A succinct message that is displayed temporarily.
import { VNode, JSX, Fragment } from "preact";
import { Button } from "https://deno.land/x/testing_shadcn_ui_for_deno@0.1.2/components/button.tsx"
import {
ToastAction,
Toaster,
useToast,
toastVariants
} from "https://deno.land/x/testing_shadcn_ui_for_deno@0.1.2/components/toast.tsx"
function ToastDemoBase(porps:{variant:keyof typeof toastVariants["variants"]["variant"]}) {
const { toast } = useToast()
return (
<Button
variant={porps.variant == "default" ? "outline" : "destructive"}
onClick={() => {
toast({
title: "Scheduled: Catch up ",
description: "Friday, February 10, 2023 at 5:57 PM",
action: <ToastAction altText="Goto schedule to undo">Undo</ToastAction>
})
}}
>
Add to calendar
</Button>
)
}
export function ToastDemo(){
return (
<Fragment>
<ToastDemoBase variant="default" />
<Toaster variant="default" />
</Fragment>
)
}