From 993b9719bce626ab7b30821453ff5b5ec43684a6 Mon Sep 17 00:00:00 2001 From: pasqualevitiello Date: Sun, 11 Oct 2026 17:45:47 +0200 Subject: [PATCH] style(ui): use bold overlay and empty titles --- apps/ui/public/r/alert-dialog.json | 2 +- apps/ui/public/r/dialog.json | 2 +- apps/ui/public/r/drawer.json | 2 +- apps/ui/public/r/empty.json | 2 +- apps/ui/public/r/sheet.json | 2 +- apps/ui/registry/default/ui/alert-dialog.tsx | 5 +---- apps/ui/registry/default/ui/dialog.tsx | 5 +---- apps/ui/registry/default/ui/drawer.tsx | 5 +---- apps/ui/registry/default/ui/empty.tsx | 2 +- apps/ui/registry/default/ui/sheet.tsx | 5 +---- packages/ui/src/components/alert-dialog.tsx | 5 +---- packages/ui/src/components/dialog.tsx | 5 +---- packages/ui/src/components/drawer.tsx | 5 +---- packages/ui/src/components/empty.tsx | 2 +- packages/ui/src/components/sheet.tsx | 5 +---- 15 files changed, 15 insertions(+), 39 deletions(-) diff --git a/apps/ui/public/r/alert-dialog.json b/apps/ui/public/r/alert-dialog.json index b38352613..6706c8d4c 100644 --- a/apps/ui/public/r/alert-dialog.json +++ b/apps/ui/public/r/alert-dialog.json @@ -7,7 +7,7 @@ "files": [ { "path": "registry/default/ui/alert-dialog.tsx", - "content": "\"use client\";\n\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\n\nexport const AlertDialogCreateHandle: typeof AlertDialogPrimitive.createHandle =\n AlertDialogPrimitive.createHandle;\n\nexport const AlertDialog: typeof AlertDialogPrimitive.Root =\n AlertDialogPrimitive.Root;\n\nexport const AlertDialogPortal: typeof AlertDialogPrimitive.Portal =\n AlertDialogPrimitive.Portal;\n\nexport function AlertDialogTrigger(\n props: AlertDialogPrimitive.Trigger.Props,\n): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogBackdrop({\n className,\n ...props\n}: AlertDialogPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogViewport({\n className,\n ...props\n}: AlertDialogPrimitive.Viewport.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogPopup({\n className,\n bottomStickOnMobile = true,\n portalProps,\n ...props\n}: AlertDialogPrimitive.Popup.Props & {\n bottomStickOnMobile?: boolean;\n portalProps?: AlertDialogPrimitive.Portal.Props;\n}): React.ReactElement {\n return (\n \n \n \n \n \n \n );\n}\n\nexport function AlertDialogHeader({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogFooter({\n className,\n variant = \"default\",\n ...props\n}: React.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n}): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogTitle({\n className,\n ...props\n}: AlertDialogPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogDescription({\n className,\n ...props\n}: AlertDialogPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogClose(\n props: AlertDialogPrimitive.Close.Props,\n): React.ReactElement {\n return (\n \n );\n}\n\nexport {\n AlertDialogPrimitive,\n AlertDialogBackdrop as AlertDialogOverlay,\n AlertDialogPopup as AlertDialogContent,\n};\n", + "content": "\"use client\";\n\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\n\nexport const AlertDialogCreateHandle: typeof AlertDialogPrimitive.createHandle =\n AlertDialogPrimitive.createHandle;\n\nexport const AlertDialog: typeof AlertDialogPrimitive.Root =\n AlertDialogPrimitive.Root;\n\nexport const AlertDialogPortal: typeof AlertDialogPrimitive.Portal =\n AlertDialogPrimitive.Portal;\n\nexport function AlertDialogTrigger(\n props: AlertDialogPrimitive.Trigger.Props,\n): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogBackdrop({\n className,\n ...props\n}: AlertDialogPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogViewport({\n className,\n ...props\n}: AlertDialogPrimitive.Viewport.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogPopup({\n className,\n bottomStickOnMobile = true,\n portalProps,\n ...props\n}: AlertDialogPrimitive.Popup.Props & {\n bottomStickOnMobile?: boolean;\n portalProps?: AlertDialogPrimitive.Portal.Props;\n}): React.ReactElement {\n return (\n \n \n \n \n \n \n );\n}\n\nexport function AlertDialogHeader({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogFooter({\n className,\n variant = \"default\",\n ...props\n}: React.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n}): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogTitle({\n className,\n ...props\n}: AlertDialogPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogDescription({\n className,\n ...props\n}: AlertDialogPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function AlertDialogClose(\n props: AlertDialogPrimitive.Close.Props,\n): React.ReactElement {\n return (\n \n );\n}\n\nexport {\n AlertDialogPrimitive,\n AlertDialogBackdrop as AlertDialogOverlay,\n AlertDialogPopup as AlertDialogContent,\n};\n", "type": "registry:ui" } ], diff --git a/apps/ui/public/r/dialog.json b/apps/ui/public/r/dialog.json index 82732ddb6..d10ec5dce 100644 --- a/apps/ui/public/r/dialog.json +++ b/apps/ui/public/r/dialog.json @@ -11,7 +11,7 @@ "files": [ { "path": "registry/default/ui/dialog.tsx", - "content": "\"use client\";\n\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { XIcon } from \"lucide-react\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport { ScrollArea } from \"@/registry/default/ui/scroll-area\";\n\nexport const DialogCreateHandle: typeof DialogPrimitive.createHandle =\n DialogPrimitive.createHandle;\n\nexport const Dialog: typeof DialogPrimitive.Root = DialogPrimitive.Root;\n\nexport const DialogPortal: typeof DialogPrimitive.Portal =\n DialogPrimitive.Portal;\n\nexport function DialogTrigger(\n props: DialogPrimitive.Trigger.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DialogClose(\n props: DialogPrimitive.Close.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DialogBackdrop({\n className,\n ...props\n}: DialogPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogViewport({\n className,\n ...props\n}: DialogPrimitive.Viewport.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogPopup({\n className,\n children,\n showCloseButton = true,\n bottomStickOnMobile = true,\n closeProps,\n portalProps,\n ...props\n}: DialogPrimitive.Popup.Props & {\n showCloseButton?: boolean;\n bottomStickOnMobile?: boolean;\n closeProps?: DialogPrimitive.Close.Props;\n portalProps?: DialogPrimitive.Portal.Props;\n}): React.ReactElement {\n return (\n \n \n \n \n {children}\n {showCloseButton && (\n }\n {...closeProps}\n >\n \n \n )}\n \n \n \n );\n}\n\nexport function DialogHeader({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col gap-2 p-6 in-[[data-slot=dialog-popup]:has([data-slot=dialog-panel])]:pb-3 max-sm:pb-4\",\n className,\n ),\n \"data-slot\": \"dialog-header\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DialogFooter({\n className,\n variant = \"default\",\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col-reverse gap-2 px-6 sm:flex-row sm:justify-end sm:rounded-b-[calc(var(--radius-2xl)-1px)]\",\n variant === \"default\" && \"border-t bg-muted/72 py-4\",\n variant === \"bare\" &&\n \"in-[[data-slot=dialog-popup]:has([data-slot=dialog-panel])]:pt-3 pt-4 pb-6\",\n className,\n ),\n \"data-slot\": \"dialog-footer\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DialogTitle({\n className,\n ...props\n}: DialogPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogDescription({\n className,\n ...props\n}: DialogPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogPanel({\n className,\n scrollFade = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n scrollFade?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"p-6 in-[[data-slot=dialog-popup]:has([data-slot=dialog-header])]:pt-1 in-[[data-slot=dialog-popup]:has([data-slot=dialog-footer]:not(.border-t))]:pb-1\",\n className,\n ),\n \"data-slot\": \"dialog-panel\",\n };\n\n return (\n \n {useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n })}\n \n );\n}\n\nexport {\n DialogPrimitive,\n DialogBackdrop as DialogOverlay,\n DialogPopup as DialogContent,\n};\n", + "content": "\"use client\";\n\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { XIcon } from \"lucide-react\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport { ScrollArea } from \"@/registry/default/ui/scroll-area\";\n\nexport const DialogCreateHandle: typeof DialogPrimitive.createHandle =\n DialogPrimitive.createHandle;\n\nexport const Dialog: typeof DialogPrimitive.Root = DialogPrimitive.Root;\n\nexport const DialogPortal: typeof DialogPrimitive.Portal =\n DialogPrimitive.Portal;\n\nexport function DialogTrigger(\n props: DialogPrimitive.Trigger.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DialogClose(\n props: DialogPrimitive.Close.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DialogBackdrop({\n className,\n ...props\n}: DialogPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogViewport({\n className,\n ...props\n}: DialogPrimitive.Viewport.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogPopup({\n className,\n children,\n showCloseButton = true,\n bottomStickOnMobile = true,\n closeProps,\n portalProps,\n ...props\n}: DialogPrimitive.Popup.Props & {\n showCloseButton?: boolean;\n bottomStickOnMobile?: boolean;\n closeProps?: DialogPrimitive.Close.Props;\n portalProps?: DialogPrimitive.Portal.Props;\n}): React.ReactElement {\n return (\n \n \n \n \n {children}\n {showCloseButton && (\n }\n {...closeProps}\n >\n \n \n )}\n \n \n \n );\n}\n\nexport function DialogHeader({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col gap-2 p-6 in-[[data-slot=dialog-popup]:has([data-slot=dialog-panel])]:pb-3 max-sm:pb-4\",\n className,\n ),\n \"data-slot\": \"dialog-header\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DialogFooter({\n className,\n variant = \"default\",\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col-reverse gap-2 px-6 sm:flex-row sm:justify-end sm:rounded-b-[calc(var(--radius-2xl)-1px)]\",\n variant === \"default\" && \"border-t bg-muted/72 py-4\",\n variant === \"bare\" &&\n \"in-[[data-slot=dialog-popup]:has([data-slot=dialog-panel])]:pt-3 pt-4 pb-6\",\n className,\n ),\n \"data-slot\": \"dialog-footer\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DialogTitle({\n className,\n ...props\n}: DialogPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogDescription({\n className,\n ...props\n}: DialogPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DialogPanel({\n className,\n scrollFade = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n scrollFade?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"p-6 in-[[data-slot=dialog-popup]:has([data-slot=dialog-header])]:pt-1 in-[[data-slot=dialog-popup]:has([data-slot=dialog-footer]:not(.border-t))]:pb-1\",\n className,\n ),\n \"data-slot\": \"dialog-panel\",\n };\n\n return (\n \n {useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n })}\n \n );\n}\n\nexport {\n DialogPrimitive,\n DialogBackdrop as DialogOverlay,\n DialogPopup as DialogContent,\n};\n", "type": "registry:ui" } ], diff --git a/apps/ui/public/r/drawer.json b/apps/ui/public/r/drawer.json index f7b0f00cd..4f44d96bd 100644 --- a/apps/ui/public/r/drawer.json +++ b/apps/ui/public/r/drawer.json @@ -11,7 +11,7 @@ "files": [ { "path": "registry/default/ui/drawer.tsx", - "content": "\"use client\";\n\nimport { Checkbox as CheckboxPrimitive } from \"@base-ui/react/checkbox\";\nimport { Drawer as DrawerPrimitive } from \"@base-ui/react/drawer\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { Radio as RadioPrimitive } from \"@base-ui/react/radio\";\nimport { RadioGroup as RadioGroupPrimitive } from \"@base-ui/react/radio-group\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { ChevronRightIcon, XIcon } from \"lucide-react\";\nimport type React from \"react\";\nimport { createContext, useContext } from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport { ScrollArea } from \"@/registry/default/ui/scroll-area\";\n\ntype DrawerPosition = \"right\" | \"left\" | \"top\" | \"bottom\";\n\nconst DrawerContext: React.Context<{ position: DrawerPosition }> =\n createContext<{ position: DrawerPosition }>({\n position: \"bottom\",\n });\n\nconst directionMap: Record<\n DrawerPosition,\n DrawerPrimitive.Root.Props[\"swipeDirection\"]\n> = {\n bottom: \"down\",\n left: \"left\",\n right: \"right\",\n top: \"up\",\n};\n\nexport const DrawerCreateHandle: typeof DrawerPrimitive.createHandle =\n DrawerPrimitive.createHandle;\n\nexport function Drawer({\n swipeDirection,\n position = \"bottom\",\n ...props\n}: DrawerPrimitive.Root.Props & {\n position?: DrawerPosition;\n}): React.ReactElement {\n return (\n \n \n \n );\n}\n\nexport const DrawerPortal: typeof DrawerPrimitive.Portal =\n DrawerPrimitive.Portal;\n\nexport function DrawerTrigger(\n props: DrawerPrimitive.Trigger.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DrawerClose(\n props: DrawerPrimitive.Close.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DrawerSwipeArea({\n className,\n position: positionProp,\n ...props\n}: DrawerPrimitive.SwipeArea.Props & {\n position?: DrawerPosition;\n}): React.ReactElement {\n const { position: contextPosition } = useContext(DrawerContext);\n const position = positionProp ?? contextPosition;\n\n return (\n \n );\n}\n\nexport function DrawerBackdrop({\n className,\n ...props\n}: DrawerPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerViewport({\n className,\n position,\n variant = \"default\",\n ...props\n}: DrawerPrimitive.Viewport.Props & {\n position?: DrawerPosition;\n variant?: \"default\" | \"straight\" | \"inset\";\n}): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerPopup({\n className,\n children,\n showCloseButton = false,\n position: positionProp,\n variant = \"default\",\n showBar = false,\n portalProps,\n ...props\n}: DrawerPrimitive.Popup.Props & {\n showCloseButton?: boolean;\n position?: DrawerPosition;\n variant?: \"default\" | \"straight\" | \"inset\";\n showBar?: boolean;\n portalProps?: DrawerPrimitive.Portal.Props;\n}): React.ReactElement {\n const { position: contextPosition } = useContext(DrawerContext);\n const position = positionProp ?? contextPosition;\n\n return (\n \n \n \n \n {children}\n {showCloseButton && (\n }\n >\n \n \n )}\n {showBar && }\n \n \n \n );\n}\n\nexport function DrawerHeader({\n className,\n allowSelection = false,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n allowSelection?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col gap-2 p-6 in-[[data-slot=drawer-popup]:has([data-slot=drawer-panel])]:pb-3 max-sm:pb-4\",\n !allowSelection && \"cursor-default\",\n className,\n ),\n \"data-slot\": \"drawer-header\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render: allowSelection ? : render,\n });\n}\n\nexport function DrawerFooter({\n className,\n variant = \"default\",\n allowSelection = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n allowSelection?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col-reverse gap-2 px-6 pb-(--safe-area-inset-bottom,0px) sm:flex-row sm:justify-end\",\n !allowSelection && \"cursor-default\",\n variant === \"default\" &&\n \"border-t bg-muted/72 pt-4 pb-[calc(env(safe-area-inset-bottom,0px)+--spacing(4))]\",\n variant === \"bare\" &&\n \"in-[[data-slot=drawer-popup]:has([data-slot=drawer-panel])]:pt-3 pt-4 pb-[calc(env(safe-area-inset-bottom,0px)+--spacing(6))]\",\n className,\n ),\n \"data-slot\": \"drawer-footer\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render: allowSelection ? : render,\n });\n}\n\nexport function DrawerTitle({\n className,\n ...props\n}: DrawerPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerDescription({\n className,\n ...props\n}: DrawerPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerPanel({\n className,\n scrollFade = true,\n scrollable = true,\n allowSelection = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n scrollFade?: boolean;\n scrollable?: boolean;\n allowSelection?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"p-6 in-[[data-slot=drawer-popup]:has([data-slot=drawer-header])]:pt-1 in-[[data-slot=drawer-popup]:has([data-slot=drawer-footer]:not(.border-t))]:pb-1\",\n !allowSelection && \"cursor-default\",\n className,\n ),\n \"data-slot\": \"drawer-panel\",\n };\n\n const content = useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render: allowSelection ? : render,\n });\n\n if (scrollable) {\n return (\n \n {content}\n \n );\n }\n\n return content;\n}\n\nexport function DrawerBar({\n className,\n position: positionProp,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n position?: DrawerPosition;\n}): React.ReactElement {\n const { position: contextPosition } = useContext(DrawerContext);\n const position = positionProp ?? contextPosition;\n const horizontal = position === \"left\" || position === \"right\";\n const defaultProps = {\n \"aria-hidden\": true as const,\n className: cn(\n \"absolute flex touch-none items-center justify-center p-3 before:rounded-full before:bg-input\",\n horizontal\n ? \"inset-y-0 before:h-12 before:w-1\"\n : \"inset-x-0 before:h-1 before:w-12\",\n position === \"top\" && \"bottom-0\",\n position === \"bottom\" && \"top-0\",\n position === \"left\" && \"right-0\",\n position === \"right\" && \"left-0\",\n className,\n ),\n \"data-slot\": \"drawer-bar\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport const DrawerContent: typeof DrawerPrimitive.Content =\n DrawerPrimitive.Content;\n\nexport function DrawerMenu({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"nav\">): React.ReactElement {\n const defaultProps = {\n className: cn(\"-m-2 flex flex-col\", className),\n \"data-slot\": \"drawer-menu\",\n };\n\n return useRender({\n defaultTagName: \"nav\",\n props: mergeProps<\"nav\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuItem({\n className,\n variant = \"default\",\n render,\n disabled,\n ...props\n}: useRender.ComponentProps<\"button\"> & {\n variant?: \"default\" | \"destructive\";\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex min-h-9 w-full cursor-default select-none items-center gap-2 rounded-sm px-2 py-1 text-base text-foreground outline-none hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-64 data-[variant=destructive]:text-destructive-foreground sm:min-h-8 sm:text-sm [&>svg:not([class*='opacity-'])]:opacity-80 [&>svg:not([class*='size-'])]:size-4.5 sm:[&>svg:not([class*='size-'])]:size-4 [&>svg]:pointer-events-none [&>svg]:-mx-0.5 [&>svg]:shrink-0\",\n className,\n ),\n \"data-slot\": \"drawer-menu-item\",\n \"data-variant\": variant,\n disabled,\n type: \"button\" as const,\n };\n\n return useRender({\n defaultTagName: \"button\",\n props: mergeProps<\"button\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuSeparator({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\"mx-2 my-1 h-px bg-border\", className),\n \"data-slot\": \"drawer-menu-separator\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuGroup({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\"flex flex-col\", className),\n \"data-slot\": \"drawer-menu-group\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuGroupLabel({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"px-2 py-1.5 font-medium text-muted-foreground text-xs\",\n className,\n ),\n \"data-slot\": \"drawer-menu-group-label\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuTrigger({\n className,\n children,\n ...props\n}: DrawerPrimitive.Trigger.Props): React.ReactElement {\n return (\n \n {children}\n \n \n );\n}\n\nexport function DrawerMenuCheckboxItem({\n className,\n children,\n checked,\n defaultChecked,\n onCheckedChange,\n variant = \"default\",\n disabled,\n render,\n ...props\n}: CheckboxPrimitive.Root.Props & {\n variant?: \"default\" | \"switch\";\n render?: React.ReactElement;\n}): React.ReactElement {\n return (\n \n {variant === \"switch\" ? (\n <>\n {children}\n \n \n \n \n ) : (\n <>\n \n \n \n \n \n {children}\n \n )}\n \n );\n}\n\nexport function DrawerMenuRadioGroup({\n className,\n ...props\n}: RadioGroupPrimitive.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerMenuRadioItem({\n className,\n children,\n value,\n disabled,\n render,\n ...props\n}: RadioPrimitive.Root.Props & {\n value: string;\n render?: React.ReactElement;\n}): React.ReactElement {\n return (\n \n \n \n \n \n \n {children}\n \n );\n}\n\nexport { DrawerPrimitive };\n", + "content": "\"use client\";\n\nimport { Checkbox as CheckboxPrimitive } from \"@base-ui/react/checkbox\";\nimport { Drawer as DrawerPrimitive } from \"@base-ui/react/drawer\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { Radio as RadioPrimitive } from \"@base-ui/react/radio\";\nimport { RadioGroup as RadioGroupPrimitive } from \"@base-ui/react/radio-group\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { ChevronRightIcon, XIcon } from \"lucide-react\";\nimport type React from \"react\";\nimport { createContext, useContext } from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport { ScrollArea } from \"@/registry/default/ui/scroll-area\";\n\ntype DrawerPosition = \"right\" | \"left\" | \"top\" | \"bottom\";\n\nconst DrawerContext: React.Context<{ position: DrawerPosition }> =\n createContext<{ position: DrawerPosition }>({\n position: \"bottom\",\n });\n\nconst directionMap: Record<\n DrawerPosition,\n DrawerPrimitive.Root.Props[\"swipeDirection\"]\n> = {\n bottom: \"down\",\n left: \"left\",\n right: \"right\",\n top: \"up\",\n};\n\nexport const DrawerCreateHandle: typeof DrawerPrimitive.createHandle =\n DrawerPrimitive.createHandle;\n\nexport function Drawer({\n swipeDirection,\n position = \"bottom\",\n ...props\n}: DrawerPrimitive.Root.Props & {\n position?: DrawerPosition;\n}): React.ReactElement {\n return (\n \n \n \n );\n}\n\nexport const DrawerPortal: typeof DrawerPrimitive.Portal =\n DrawerPrimitive.Portal;\n\nexport function DrawerTrigger(\n props: DrawerPrimitive.Trigger.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DrawerClose(\n props: DrawerPrimitive.Close.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function DrawerSwipeArea({\n className,\n position: positionProp,\n ...props\n}: DrawerPrimitive.SwipeArea.Props & {\n position?: DrawerPosition;\n}): React.ReactElement {\n const { position: contextPosition } = useContext(DrawerContext);\n const position = positionProp ?? contextPosition;\n\n return (\n \n );\n}\n\nexport function DrawerBackdrop({\n className,\n ...props\n}: DrawerPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerViewport({\n className,\n position,\n variant = \"default\",\n ...props\n}: DrawerPrimitive.Viewport.Props & {\n position?: DrawerPosition;\n variant?: \"default\" | \"straight\" | \"inset\";\n}): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerPopup({\n className,\n children,\n showCloseButton = false,\n position: positionProp,\n variant = \"default\",\n showBar = false,\n portalProps,\n ...props\n}: DrawerPrimitive.Popup.Props & {\n showCloseButton?: boolean;\n position?: DrawerPosition;\n variant?: \"default\" | \"straight\" | \"inset\";\n showBar?: boolean;\n portalProps?: DrawerPrimitive.Portal.Props;\n}): React.ReactElement {\n const { position: contextPosition } = useContext(DrawerContext);\n const position = positionProp ?? contextPosition;\n\n return (\n \n \n \n \n {children}\n {showCloseButton && (\n }\n >\n \n \n )}\n {showBar && }\n \n \n \n );\n}\n\nexport function DrawerHeader({\n className,\n allowSelection = false,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n allowSelection?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col gap-2 p-6 in-[[data-slot=drawer-popup]:has([data-slot=drawer-panel])]:pb-3 max-sm:pb-4\",\n !allowSelection && \"cursor-default\",\n className,\n ),\n \"data-slot\": \"drawer-header\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render: allowSelection ? : render,\n });\n}\n\nexport function DrawerFooter({\n className,\n variant = \"default\",\n allowSelection = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n allowSelection?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col-reverse gap-2 px-6 pb-(--safe-area-inset-bottom,0px) sm:flex-row sm:justify-end\",\n !allowSelection && \"cursor-default\",\n variant === \"default\" &&\n \"border-t bg-muted/72 pt-4 pb-[calc(env(safe-area-inset-bottom,0px)+--spacing(4))]\",\n variant === \"bare\" &&\n \"in-[[data-slot=drawer-popup]:has([data-slot=drawer-panel])]:pt-3 pt-4 pb-[calc(env(safe-area-inset-bottom,0px)+--spacing(6))]\",\n className,\n ),\n \"data-slot\": \"drawer-footer\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render: allowSelection ? : render,\n });\n}\n\nexport function DrawerTitle({\n className,\n ...props\n}: DrawerPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerDescription({\n className,\n ...props\n}: DrawerPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerPanel({\n className,\n scrollFade = true,\n scrollable = true,\n allowSelection = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n scrollFade?: boolean;\n scrollable?: boolean;\n allowSelection?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"p-6 in-[[data-slot=drawer-popup]:has([data-slot=drawer-header])]:pt-1 in-[[data-slot=drawer-popup]:has([data-slot=drawer-footer]:not(.border-t))]:pb-1\",\n !allowSelection && \"cursor-default\",\n className,\n ),\n \"data-slot\": \"drawer-panel\",\n };\n\n const content = useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render: allowSelection ? : render,\n });\n\n if (scrollable) {\n return (\n \n {content}\n \n );\n }\n\n return content;\n}\n\nexport function DrawerBar({\n className,\n position: positionProp,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n position?: DrawerPosition;\n}): React.ReactElement {\n const { position: contextPosition } = useContext(DrawerContext);\n const position = positionProp ?? contextPosition;\n const horizontal = position === \"left\" || position === \"right\";\n const defaultProps = {\n \"aria-hidden\": true as const,\n className: cn(\n \"absolute flex touch-none items-center justify-center p-3 before:rounded-full before:bg-input\",\n horizontal\n ? \"inset-y-0 before:h-12 before:w-1\"\n : \"inset-x-0 before:h-1 before:w-12\",\n position === \"top\" && \"bottom-0\",\n position === \"bottom\" && \"top-0\",\n position === \"left\" && \"right-0\",\n position === \"right\" && \"left-0\",\n className,\n ),\n \"data-slot\": \"drawer-bar\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport const DrawerContent: typeof DrawerPrimitive.Content =\n DrawerPrimitive.Content;\n\nexport function DrawerMenu({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"nav\">): React.ReactElement {\n const defaultProps = {\n className: cn(\"-m-2 flex flex-col\", className),\n \"data-slot\": \"drawer-menu\",\n };\n\n return useRender({\n defaultTagName: \"nav\",\n props: mergeProps<\"nav\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuItem({\n className,\n variant = \"default\",\n render,\n disabled,\n ...props\n}: useRender.ComponentProps<\"button\"> & {\n variant?: \"default\" | \"destructive\";\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex min-h-9 w-full cursor-default select-none items-center gap-2 rounded-sm px-2 py-1 text-base text-foreground outline-none hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-64 data-[variant=destructive]:text-destructive-foreground sm:min-h-8 sm:text-sm [&>svg:not([class*='opacity-'])]:opacity-80 [&>svg:not([class*='size-'])]:size-4.5 sm:[&>svg:not([class*='size-'])]:size-4 [&>svg]:pointer-events-none [&>svg]:-mx-0.5 [&>svg]:shrink-0\",\n className,\n ),\n \"data-slot\": \"drawer-menu-item\",\n \"data-variant\": variant,\n disabled,\n type: \"button\" as const,\n };\n\n return useRender({\n defaultTagName: \"button\",\n props: mergeProps<\"button\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuSeparator({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\"mx-2 my-1 h-px bg-border\", className),\n \"data-slot\": \"drawer-menu-separator\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuGroup({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\"flex flex-col\", className),\n \"data-slot\": \"drawer-menu-group\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuGroupLabel({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"px-2 py-1.5 font-medium text-muted-foreground text-xs\",\n className,\n ),\n \"data-slot\": \"drawer-menu-group-label\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function DrawerMenuTrigger({\n className,\n children,\n ...props\n}: DrawerPrimitive.Trigger.Props): React.ReactElement {\n return (\n \n {children}\n \n \n );\n}\n\nexport function DrawerMenuCheckboxItem({\n className,\n children,\n checked,\n defaultChecked,\n onCheckedChange,\n variant = \"default\",\n disabled,\n render,\n ...props\n}: CheckboxPrimitive.Root.Props & {\n variant?: \"default\" | \"switch\";\n render?: React.ReactElement;\n}): React.ReactElement {\n return (\n \n {variant === \"switch\" ? (\n <>\n {children}\n \n \n \n \n ) : (\n <>\n \n \n \n \n \n {children}\n \n )}\n \n );\n}\n\nexport function DrawerMenuRadioGroup({\n className,\n ...props\n}: RadioGroupPrimitive.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function DrawerMenuRadioItem({\n className,\n children,\n value,\n disabled,\n render,\n ...props\n}: RadioPrimitive.Root.Props & {\n value: string;\n render?: React.ReactElement;\n}): React.ReactElement {\n return (\n \n \n \n \n \n \n {children}\n \n );\n}\n\nexport { DrawerPrimitive };\n", "type": "registry:ui" } ], diff --git a/apps/ui/public/r/empty.json b/apps/ui/public/r/empty.json index d12641ee1..568617dad 100644 --- a/apps/ui/public/r/empty.json +++ b/apps/ui/public/r/empty.json @@ -4,7 +4,7 @@ "files": [ { "path": "registry/default/ui/empty.tsx", - "content": "import { cva, type VariantProps } from \"class-variance-authority\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\n\nconst emptyMediaVariants = cva(\n \"flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n {\n defaultVariants: {\n variant: \"default\",\n },\n variants: {\n variant: {\n default: \"bg-transparent\",\n icon: \"relative flex size-9 shrink-0 items-center justify-center rounded-md border bg-card not-dark:bg-clip-padding text-foreground shadow-sm/5 before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-md)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] dark:before:shadow-[0_-1px_--theme(--color-white/6%)] [&_svg:not([class*='size-'])]:size-4.5\",\n },\n },\n },\n);\n\nexport function Empty({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function EmptyHeader({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function EmptyMedia({\n className,\n variant = \"default\",\n ...props\n}: React.ComponentProps<\"div\"> &\n VariantProps): React.ReactElement {\n return (\n \n {variant === \"icon\" && (\n <>\n \n \n \n )}\n \n \n );\n}\n\nexport function EmptyTitle({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function EmptyDescription({\n className,\n ...props\n}: React.ComponentProps<\"p\">): React.ReactElement {\n return (\n a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4 [[data-slot=empty-title]+&]:mt-1\",\n className,\n )}\n data-slot=\"empty-description\"\n {...props}\n />\n );\n}\n\nexport function EmptyContent({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n", + "content": "import { cva, type VariantProps } from \"class-variance-authority\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\n\nconst emptyMediaVariants = cva(\n \"flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n {\n defaultVariants: {\n variant: \"default\",\n },\n variants: {\n variant: {\n default: \"bg-transparent\",\n icon: \"relative flex size-9 shrink-0 items-center justify-center rounded-md border bg-card not-dark:bg-clip-padding text-foreground shadow-sm/5 before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-md)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] dark:before:shadow-[0_-1px_--theme(--color-white/6%)] [&_svg:not([class*='size-'])]:size-4.5\",\n },\n },\n },\n);\n\nexport function Empty({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function EmptyHeader({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function EmptyMedia({\n className,\n variant = \"default\",\n ...props\n}: React.ComponentProps<\"div\"> &\n VariantProps): React.ReactElement {\n return (\n \n {variant === \"icon\" && (\n <>\n \n \n \n )}\n \n \n );\n}\n\nexport function EmptyTitle({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n\nexport function EmptyDescription({\n className,\n ...props\n}: React.ComponentProps<\"p\">): React.ReactElement {\n return (\n a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4 [[data-slot=empty-title]+&]:mt-1\",\n className,\n )}\n data-slot=\"empty-description\"\n {...props}\n />\n );\n}\n\nexport function EmptyContent({\n className,\n ...props\n}: React.ComponentProps<\"div\">): React.ReactElement {\n return (\n \n );\n}\n", "type": "registry:ui" } ], diff --git a/apps/ui/public/r/sheet.json b/apps/ui/public/r/sheet.json index 011fc29ba..ccbf18bef 100644 --- a/apps/ui/public/r/sheet.json +++ b/apps/ui/public/r/sheet.json @@ -11,7 +11,7 @@ "files": [ { "path": "registry/default/ui/sheet.tsx", - "content": "\"use client\";\n\nimport { Dialog as SheetPrimitive } from \"@base-ui/react/dialog\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { XIcon } from \"lucide-react\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport { ScrollArea } from \"@/registry/default/ui/scroll-area\";\n\nexport const Sheet: typeof SheetPrimitive.Root = SheetPrimitive.Root;\n\nexport const SheetPortal: typeof SheetPrimitive.Portal = SheetPrimitive.Portal;\n\nexport function SheetTrigger(\n props: SheetPrimitive.Trigger.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function SheetClose(\n props: SheetPrimitive.Close.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function SheetBackdrop({\n className,\n ...props\n}: SheetPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetViewport({\n className,\n side,\n variant = \"default\",\n ...props\n}: SheetPrimitive.Viewport.Props & {\n side?: \"right\" | \"left\" | \"top\" | \"bottom\";\n variant?: \"default\" | \"inset\";\n}): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetPopup({\n className,\n children,\n showCloseButton = true,\n side = \"right\",\n variant = \"default\",\n closeProps,\n portalProps,\n ...props\n}: SheetPrimitive.Popup.Props & {\n showCloseButton?: boolean;\n side?: \"right\" | \"left\" | \"top\" | \"bottom\";\n variant?: \"default\" | \"inset\";\n closeProps?: SheetPrimitive.Close.Props;\n portalProps?: SheetPrimitive.Portal.Props;\n}): React.ReactElement {\n return (\n \n \n \n \n {children}\n {showCloseButton && (\n }\n {...closeProps}\n >\n \n \n )}\n \n \n \n );\n}\n\nexport function SheetHeader({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col gap-2 p-6 in-[[data-slot=sheet-popup]:has([data-slot=sheet-panel])]:pb-3 max-sm:pb-4\",\n className,\n ),\n \"data-slot\": \"sheet-header\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function SheetFooter({\n className,\n variant = \"default\",\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col-reverse gap-2 px-6 sm:flex-row sm:justify-end\",\n variant === \"default\" && \"border-t bg-muted/72 py-4\",\n variant === \"bare\" &&\n \"in-[[data-slot=sheet-popup]:has([data-slot=sheet-panel])]:pt-3 pt-4 pb-6\",\n className,\n ),\n \"data-slot\": \"sheet-footer\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function SheetTitle({\n className,\n ...props\n}: SheetPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetDescription({\n className,\n ...props\n}: SheetPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetPanel({\n className,\n scrollFade = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n scrollFade?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"p-6 in-[[data-slot=sheet-popup]:has([data-slot=sheet-header])]:pt-1 in-[[data-slot=sheet-popup]:has([data-slot=sheet-footer]:not(.border-t))]:pb-1\",\n className,\n ),\n \"data-slot\": \"sheet-panel\",\n };\n\n return (\n \n {useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n })}\n \n );\n}\n\nexport {\n SheetPrimitive,\n SheetBackdrop as SheetOverlay,\n SheetPopup as SheetContent,\n};\n", + "content": "\"use client\";\n\nimport { Dialog as SheetPrimitive } from \"@base-ui/react/dialog\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { XIcon } from \"lucide-react\";\nimport type React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport { ScrollArea } from \"@/registry/default/ui/scroll-area\";\n\nexport const Sheet: typeof SheetPrimitive.Root = SheetPrimitive.Root;\n\nexport const SheetPortal: typeof SheetPrimitive.Portal = SheetPrimitive.Portal;\n\nexport function SheetTrigger(\n props: SheetPrimitive.Trigger.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function SheetClose(\n props: SheetPrimitive.Close.Props,\n): React.ReactElement {\n return ;\n}\n\nexport function SheetBackdrop({\n className,\n ...props\n}: SheetPrimitive.Backdrop.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetViewport({\n className,\n side,\n variant = \"default\",\n ...props\n}: SheetPrimitive.Viewport.Props & {\n side?: \"right\" | \"left\" | \"top\" | \"bottom\";\n variant?: \"default\" | \"inset\";\n}): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetPopup({\n className,\n children,\n showCloseButton = true,\n side = \"right\",\n variant = \"default\",\n closeProps,\n portalProps,\n ...props\n}: SheetPrimitive.Popup.Props & {\n showCloseButton?: boolean;\n side?: \"right\" | \"left\" | \"top\" | \"bottom\";\n variant?: \"default\" | \"inset\";\n closeProps?: SheetPrimitive.Close.Props;\n portalProps?: SheetPrimitive.Portal.Props;\n}): React.ReactElement {\n return (\n \n \n \n \n {children}\n {showCloseButton && (\n }\n {...closeProps}\n >\n \n \n )}\n \n \n \n );\n}\n\nexport function SheetHeader({\n className,\n render,\n ...props\n}: useRender.ComponentProps<\"div\">): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col gap-2 p-6 in-[[data-slot=sheet-popup]:has([data-slot=sheet-panel])]:pb-3 max-sm:pb-4\",\n className,\n ),\n \"data-slot\": \"sheet-header\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function SheetFooter({\n className,\n variant = \"default\",\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n variant?: \"default\" | \"bare\";\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"flex flex-col-reverse gap-2 px-6 sm:flex-row sm:justify-end\",\n variant === \"default\" && \"border-t bg-muted/72 py-4\",\n variant === \"bare\" &&\n \"in-[[data-slot=sheet-popup]:has([data-slot=sheet-panel])]:pt-3 pt-4 pb-6\",\n className,\n ),\n \"data-slot\": \"sheet-footer\",\n };\n\n return useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n });\n}\n\nexport function SheetTitle({\n className,\n ...props\n}: SheetPrimitive.Title.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetDescription({\n className,\n ...props\n}: SheetPrimitive.Description.Props): React.ReactElement {\n return (\n \n );\n}\n\nexport function SheetPanel({\n className,\n scrollFade = true,\n render,\n ...props\n}: useRender.ComponentProps<\"div\"> & {\n scrollFade?: boolean;\n}): React.ReactElement {\n const defaultProps = {\n className: cn(\n \"p-6 in-[[data-slot=sheet-popup]:has([data-slot=sheet-header])]:pt-1 in-[[data-slot=sheet-popup]:has([data-slot=sheet-footer]:not(.border-t))]:pb-1\",\n className,\n ),\n \"data-slot\": \"sheet-panel\",\n };\n\n return (\n \n {useRender({\n defaultTagName: \"div\",\n props: mergeProps<\"div\">(defaultProps, props),\n render,\n })}\n \n );\n}\n\nexport {\n SheetPrimitive,\n SheetBackdrop as SheetOverlay,\n SheetPopup as SheetContent,\n};\n", "type": "registry:ui" } ], diff --git a/apps/ui/registry/default/ui/alert-dialog.tsx b/apps/ui/registry/default/ui/alert-dialog.tsx index a1272f494..e323153b2 100644 --- a/apps/ui/registry/default/ui/alert-dialog.tsx +++ b/apps/ui/registry/default/ui/alert-dialog.tsx @@ -129,10 +129,7 @@ export function AlertDialogTitle({ }: AlertDialogPrimitive.Title.Props): React.ReactElement { return ( diff --git a/apps/ui/registry/default/ui/dialog.tsx b/apps/ui/registry/default/ui/dialog.tsx index e4de12a17..8e4dada84 100644 --- a/apps/ui/registry/default/ui/dialog.tsx +++ b/apps/ui/registry/default/ui/dialog.tsx @@ -163,10 +163,7 @@ export function DialogTitle({ }: DialogPrimitive.Title.Props): React.ReactElement { return ( diff --git a/apps/ui/registry/default/ui/drawer.tsx b/apps/ui/registry/default/ui/drawer.tsx index c6ba6b9f2..23945e1a1 100644 --- a/apps/ui/registry/default/ui/drawer.tsx +++ b/apps/ui/registry/default/ui/drawer.tsx @@ -287,10 +287,7 @@ export function DrawerTitle({ }: DrawerPrimitive.Title.Props): React.ReactElement { return ( diff --git a/apps/ui/registry/default/ui/empty.tsx b/apps/ui/registry/default/ui/empty.tsx index 96a4f68dc..1fb10e4b7 100644 --- a/apps/ui/registry/default/ui/empty.tsx +++ b/apps/ui/registry/default/ui/empty.tsx @@ -94,7 +94,7 @@ export function EmptyTitle({ }: React.ComponentProps<"div">): React.ReactElement { return (
diff --git a/apps/ui/registry/default/ui/sheet.tsx b/apps/ui/registry/default/ui/sheet.tsx index 0598a050b..52eec975b 100644 --- a/apps/ui/registry/default/ui/sheet.tsx +++ b/apps/ui/registry/default/ui/sheet.tsx @@ -174,10 +174,7 @@ export function SheetTitle({ }: SheetPrimitive.Title.Props): React.ReactElement { return ( diff --git a/packages/ui/src/components/alert-dialog.tsx b/packages/ui/src/components/alert-dialog.tsx index 23e7b3436..f99e48d5e 100644 --- a/packages/ui/src/components/alert-dialog.tsx +++ b/packages/ui/src/components/alert-dialog.tsx @@ -129,10 +129,7 @@ export function AlertDialogTitle({ }: AlertDialogPrimitive.Title.Props): React.ReactElement { return ( diff --git a/packages/ui/src/components/dialog.tsx b/packages/ui/src/components/dialog.tsx index d570b0c93..f647b1de2 100644 --- a/packages/ui/src/components/dialog.tsx +++ b/packages/ui/src/components/dialog.tsx @@ -163,10 +163,7 @@ export function DialogTitle({ }: DialogPrimitive.Title.Props): React.ReactElement { return ( diff --git a/packages/ui/src/components/drawer.tsx b/packages/ui/src/components/drawer.tsx index 883d49dac..10381700c 100644 --- a/packages/ui/src/components/drawer.tsx +++ b/packages/ui/src/components/drawer.tsx @@ -287,10 +287,7 @@ export function DrawerTitle({ }: DrawerPrimitive.Title.Props): React.ReactElement { return ( diff --git a/packages/ui/src/components/empty.tsx b/packages/ui/src/components/empty.tsx index 56d894832..30d312bab 100644 --- a/packages/ui/src/components/empty.tsx +++ b/packages/ui/src/components/empty.tsx @@ -94,7 +94,7 @@ export function EmptyTitle({ }: React.ComponentProps<"div">): React.ReactElement { return (
diff --git a/packages/ui/src/components/sheet.tsx b/packages/ui/src/components/sheet.tsx index a105686a0..424cd41b3 100644 --- a/packages/ui/src/components/sheet.tsx +++ b/packages/ui/src/components/sheet.tsx @@ -174,10 +174,7 @@ export function SheetTitle({ }: SheetPrimitive.Title.Props): React.ReactElement { return (