Undo toastfeedback

toastWithUndo and toastError helpers on sonner plus a Toaster wrapper with 3 s / 5 s durations, a close button, a bottom offset variable and an assertive error region.

설치

pnpm

pnpm dlx shadcn@4.23.0 add @uikit/undo-toast

의존 아이템locale sonner style

Default

undo-toast-demo.tsx

import { Button } from "@/components/ui/button";import { Toaster, toastError, toastWithUndo } from "@/components/ui/undo-toast";
export default function UndoToastDemo() {  return (    <div className="flex gap-2">      <Button variant="outline" onClick={() => toastWithUndo("Item archived", { onUndo: () => toastWithUndo("Restored") })}>        Archive      </Button>      <Button variant="outline" onClick={() => toastError("Could not save")}>        Fail      </Button>      <Toaster />    </div>  );}