Sheet
tdds/sheetFreeComponent
Slide-out panel component
Install it
npx shadcn@latest add https://raw.githubusercontent.com/gjohnsx/ttb-label-verification/main/tdds-registry/public/r/sheet.jsonSource
1"use client"23import * as React from "react"4import { Dialog as SheetPrimitive } from "radix-ui"56import { cn } from "@/lib/utils"7import { Button } from "@/components/ui/button"8import { XIcon } from "lucide-react"910function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {11 return <SheetPrimitive.Root data-slot="sheet" {...props} />12}1314function SheetTrigger({15 ...props16}: React.ComponentProps<typeof SheetPrimitive.Trigger>) {17 return <SheetPrimitive.Trigger data-slot="sheet-trigger" {...props} />18}1920function SheetClose({21 ...props22}: React.ComponentProps<typeof SheetPrimitive.Close>) {23 return <SheetPrimitive.Close data-slot="sheet-close" {...props} />24}2526function SheetPortal({27 ...props28}: React.ComponentProps<typeof SheetPrimitive.Portal>) {29 return <SheetPrimitive.Portal data-slot="sheet-portal" {...props} />30}3132function SheetOverlay({33 className,34 ...props35}: React.ComponentProps<typeof SheetPrimitive.Overlay>) {36 return (37 <SheetPrimitive.Overlay38 data-slot="sheet-overlay"39 className={cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 z-50", className)}40 {...props}41 />42 )43}4445function SheetContent({46 className,47 children,48 side = "right",49 showCloseButton = true,50 closeButtonClassName,51 ...props52}: React.ComponentProps<typeof SheetPrimitive.Content> & {53 side?: "top" | "right" | "bottom" | "left"54 showCloseButton?: boolean55 closeButtonClassName?: string56}) {57 return (58 <SheetPortal>59 <SheetOverlay />60 <SheetPrimitive.Content61 data-slot="sheet-content"62 data-side={side}63// … truncated
What it pulls in
npm packages
Other registry items
Files it writes
More from tdds
All 43 items| Component | Registry | Kind | Access | Installs | Command |
|---|---|---|---|---|---|
| Accordionaccordion | tdds | Components | Free | 2 deps | |
| Alertalert | tdds | Components | Free | 1 dep | |
| Alert Dialogalert-dialog | tdds | Components | Free | 1 dep | |
| Avataravatar | tdds | Components | Free | 1 dep | |
| Badgebadge | tdds | Components | Free | 1 dep | |
| Breadcrumbbreadcrumb | tdds | Components | Free | 2 deps | |
| Buttonbutton | tdds | Components | Free | 2 deps | |
| Button Groupbutton-group | tdds | Components | Free | 1 dep |
