Toast

import { Toast, ToastProvider, ToastViewport } from "@fanvue/ui";
import type {
  ToastProps,
  ToastProviderProps,
  ToastVariant,
  ToastViewportProps,
} from "@fanvue/ui";

import { Toast } from "@fanvue/ui";

<Toast variant="info" title="Info message" open />

import { Toast } from "@fanvue/ui";

<div className="flex flex-col gap-3">
  {(["info", "warning", "success", "error", "messageToast"] as const).map((variant) => (
    <Toast
      key={variant}
      open
      variant={variant}
      title={variant}
      description={`This is a ${variant} message`}
    />
  ))}
</div>

import { Toast } from "@fanvue/ui";

<Toast variant="success" description="Operation completed successfully" open />

import { Toast } from "@fanvue/ui";

<Toast
  variant="info"
  title="Update available"
  description="A new version is available"
  onActionClick={() => {
    console.log("Action clicked");
  }}
  actionLabel="Update"
  open
/>

import { Toast } from "@fanvue/ui";

<Toast
  variant="success"
  title="Success"
  description="Operation completed"
  showClose={false}
  open
/>