Change position

Position toast in 6 available places on the screen.

Example

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

/*
const position = {
  topLeft: "top-left",
  topCenter: "top-center",
  topRight: "top-right",
  bottomLeft: "bottom-left",
  bottomCenter: "bottom-center",
  bottomRight: "bottom-right",
} as const;
*/

export function ChangePositionExample() {
  const positions = Object.keys(position);

  const handleClick = () => {
    const randomIndex = Math.floor(Math.random() * positions.length);
    const randomKey = positions[randomIndex];

    toast.add({
      position: position[randomKey],
    });
  };
  return (
    <div>
      <button onClick={handleClick}>Add toast</button>
      <Toaster />
    </div>
  );
}