Resultfeedback
Page-level outcome for success, error, info, warning, 403, 404 and 500 with icon, title, description, up to two actions and a body slot.
설치
pnpm
pnpm dlx shadcn@4.23.0 add @uikit/resultBooking
result-booking.tsx
import { Result } from "@/components/ui/result";
export default function ResultBooking() { return ( <Result status="success" title="Booking confirmed" description="A confirmation email is on its way." actions={[ { label: "View booking", primary: true, href: "#booking" }, { label: "Back to home", href: "/" }, ]} > <dl className="grid grid-cols-2 gap-2 rounded-lg border p-3 text-sm"> <dt className="text-muted-foreground">Booking number</dt> <dd>A-10293</dd> <dt className="text-muted-foreground">Stay</dt> <dd>2 nights</dd> </dl> </Result> );}