Body animation

Enabling body animation is as simple as adding the animateBody property to the add function.

Example

To enable body animation set animateBody to true.

import { animation, toast, Toaster } from "@toastup/react";
import "@toastup/react/style";

export function BodyAnimationExample() {
  const handleClick = () =>
    toast.add({
      animateBody: true,
    });
  return (
    <div>
      <button onClick={handleClick}>Add toast</button>
      <Toaster />
    </div>
  );
}

There are three built-in body animations: zoom, slideHorizontal and slideVertical. You can change the default by setting inBodyAnimation property.

import { animation, toast } from "@toastup/react";

toast.add({
  animateBody: true,
  inBodyAnimation: animation.body.slideVerticallyWithFadeInBody,
});

Example​

Example