import { ToastContainer, toast } from "@monorepo/solid-pkg-ui";

import { ToastContainer } from "@monorepo/solid-pkg-ui";

function App() {
  return (
    <>
      <ToastContainer />
      {/* Your app content */}
    </>
  );
}

import { toast } from "@monorepo/solid-pkg-ui";

// Success toast
toast.success("Your changes have been saved!", {
  title: "Success",
  position: "top-right",
  duration: 3000,
});

// Error toast
toast.danger("Failed to save changes", {
  title: "Error",
  position: "top-right",
});

// Warning toast
toast.warning("This action cannot be undone", {
  title: "Warning",
  position: "top-center",
  duration: 0, // Won't auto-dismiss
});

// Info toast
toast.info("New features are available", {
  title: "Info",
  position: "bottom-right",
});

import { Toast } from "@monorepo/solid-pkg-ui";

<Toast
  id="my-toast"
  type="success"
  title="Success!"
  message="Your request has been submitted."
  duration={3000}
  position="top-right"
  onClose={() => console.log("Toast closed")}
/>;

interface ToastOptions {
  id?: string; // Custom ID (auto-generated if not provided)
  title?: string; // Toast title
  duration?: number; // Auto-dismiss duration in ms (0 = no auto-dismiss)
  position?: ToastPosition; // Toast position
  onClose?: () => void; // Callback when toast closes
}

interface ToastProps {
  id: string; // Required: Unique ID
  type?: ToastType; // 'success' | 'danger' | 'warning' | 'info'
  title?: string; // Optional title
  message: string; // Required: Toast message
  duration?: number; // Auto-dismiss duration (default: 5000ms)
  position?: ToastPosition; // Toast position (default: 'top-right')
  onClose?: () => void; // Callback when closed
}

type ToastType = "success" | "danger" | "warning" | "info";

type ToastPosition =
  | "top-center"
  | "top-right"
  | "bottom-center"
  | "bottom-right";