@databricks/appkit-ui 0.11.1 → 0.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE.md +4 -0
- package/NOTICE.md +1 -0
- package/dist/react/charts/area/index.d.ts +2 -2
- package/dist/react/charts/bar/index.d.ts +2 -2
- package/dist/react/charts/base.d.ts +2 -2
- package/dist/react/charts/base.d.ts.map +1 -1
- package/dist/react/charts/base.js.map +1 -1
- package/dist/react/charts/chart-error-boundary.js.map +1 -1
- package/dist/react/charts/create-chart.d.ts +2 -2
- package/dist/react/charts/create-chart.d.ts.map +1 -1
- package/dist/react/charts/create-chart.js.map +1 -1
- package/dist/react/charts/empty.js.map +1 -1
- package/dist/react/charts/error.js.map +1 -1
- package/dist/react/charts/heatmap/index.d.ts +2 -2
- package/dist/react/charts/line/index.d.ts +2 -2
- package/dist/react/charts/loading.js.map +1 -1
- package/dist/react/charts/options.d.ts.map +1 -1
- package/dist/react/charts/pie/index.d.ts +3 -3
- package/dist/react/charts/radar/index.d.ts +2 -2
- package/dist/react/charts/scatter/index.d.ts +2 -2
- package/dist/react/charts/wrapper.d.ts +2 -2
- package/dist/react/charts/wrapper.d.ts.map +1 -1
- package/dist/react/charts/wrapper.js.map +1 -1
- package/dist/react/genie/genie-chat-input.d.ts +23 -0
- package/dist/react/genie/genie-chat-input.d.ts.map +1 -0
- package/dist/react/genie/genie-chat-input.js +58 -0
- package/dist/react/genie/genie-chat-input.js.map +1 -0
- package/dist/react/genie/genie-chat-message-list.d.ts +21 -0
- package/dist/react/genie/genie-chat-message-list.d.ts.map +1 -0
- package/dist/react/genie/genie-chat-message-list.js +64 -0
- package/dist/react/genie/genie-chat-message-list.js.map +1 -0
- package/dist/react/genie/genie-chat-message.d.ts +18 -0
- package/dist/react/genie/genie-chat-message.d.ts.map +1 -0
- package/dist/react/genie/genie-chat-message.js +71 -0
- package/dist/react/genie/genie-chat-message.js.map +1 -0
- package/dist/react/genie/genie-chat.d.ts +14 -0
- package/dist/react/genie/genie-chat.d.ts.map +1 -0
- package/dist/react/genie/genie-chat.js +47 -0
- package/dist/react/genie/genie-chat.js.map +1 -0
- package/dist/react/genie/index.js +5 -0
- package/dist/react/genie/types.d.ts +44 -0
- package/dist/react/genie/types.d.ts.map +1 -0
- package/dist/react/genie/use-genie-chat.d.ts +17 -0
- package/dist/react/genie/use-genie-chat.d.ts.map +1 -0
- package/dist/react/genie/use-genie-chat.js +254 -0
- package/dist/react/genie/use-genie-chat.js.map +1 -0
- package/dist/react/index.d.ts +8 -1
- package/dist/react/index.js +14 -8
- package/dist/react/portal-container-context.js.map +1 -1
- package/dist/react/table/data-table.d.ts +2 -2
- package/dist/react/table/data-table.d.ts.map +1 -1
- package/dist/react/table/data-table.js +2 -2
- package/dist/react/table/data-table.js.map +1 -1
- package/dist/react/table/empty.js.map +1 -1
- package/dist/react/table/error.js.map +1 -1
- package/dist/react/table/loading.js.map +1 -1
- package/dist/react/table/table-wrapper.js +2 -2
- package/dist/react/table/table-wrapper.js.map +1 -1
- package/dist/react/ui/accordion.d.ts +5 -5
- package/dist/react/ui/accordion.d.ts.map +1 -1
- package/dist/react/ui/accordion.js.map +1 -1
- package/dist/react/ui/alert-dialog.d.ts +12 -12
- package/dist/react/ui/alert-dialog.js +1 -1
- package/dist/react/ui/alert-dialog.js.map +1 -1
- package/dist/react/ui/alert.d.ts +4 -4
- package/dist/react/ui/alert.d.ts.map +1 -1
- package/dist/react/ui/alert.js.map +1 -1
- package/dist/react/ui/aspect-ratio.d.ts +2 -2
- package/dist/react/ui/aspect-ratio.js.map +1 -1
- package/dist/react/ui/avatar.d.ts +4 -4
- package/dist/react/ui/avatar.js.map +1 -1
- package/dist/react/ui/badge.d.ts +2 -2
- package/dist/react/ui/badge.js.map +1 -1
- package/dist/react/ui/breadcrumb.d.ts +8 -8
- package/dist/react/ui/breadcrumb.js +1 -1
- package/dist/react/ui/breadcrumb.js.map +1 -1
- package/dist/react/ui/button-group.d.ts +4 -4
- package/dist/react/ui/button-group.js.map +1 -1
- package/dist/react/ui/button.d.ts +2 -2
- package/dist/react/ui/button.js.map +1 -1
- package/dist/react/ui/calendar.d.ts +3 -3
- package/dist/react/ui/calendar.js.map +1 -1
- package/dist/react/ui/card.d.ts +8 -8
- package/dist/react/ui/card.js.map +1 -1
- package/dist/react/ui/carousel.d.ts +6 -6
- package/dist/react/ui/carousel.js.map +1 -1
- package/dist/react/ui/chart.d.ts +5 -5
- package/dist/react/ui/chart.js.map +1 -1
- package/dist/react/ui/checkbox.d.ts +2 -2
- package/dist/react/ui/checkbox.js.map +1 -1
- package/dist/react/ui/collapsible.d.ts +4 -4
- package/dist/react/ui/collapsible.js.map +1 -1
- package/dist/react/ui/command.d.ts +10 -10
- package/dist/react/ui/command.js.map +1 -1
- package/dist/react/ui/context-menu.d.ts +16 -16
- package/dist/react/ui/context-menu.js.map +1 -1
- package/dist/react/ui/dialog.d.ts +11 -11
- package/dist/react/ui/dialog.js.map +1 -1
- package/dist/react/ui/drawer.d.ts +11 -11
- package/dist/react/ui/drawer.d.ts.map +1 -1
- package/dist/react/ui/drawer.js.map +1 -1
- package/dist/react/ui/dropdown-menu.d.ts +16 -16
- package/dist/react/ui/dropdown-menu.js.map +1 -1
- package/dist/react/ui/empty.d.ts +7 -7
- package/dist/react/ui/empty.js.map +1 -1
- package/dist/react/ui/field.d.ts +11 -11
- package/dist/react/ui/field.js.map +1 -1
- package/dist/react/ui/form.d.ts +7 -7
- package/dist/react/ui/form.js.map +1 -1
- package/dist/react/ui/hover-card.d.ts +4 -4
- package/dist/react/ui/hover-card.js.map +1 -1
- package/dist/react/ui/index.js +5 -5
- package/dist/react/ui/input-group.d.ts +7 -7
- package/dist/react/ui/input-group.js.map +1 -1
- package/dist/react/ui/input-otp.d.ts +5 -5
- package/dist/react/ui/input-otp.js.map +1 -1
- package/dist/react/ui/input.d.ts +2 -2
- package/dist/react/ui/input.js.map +1 -1
- package/dist/react/ui/item.d.ts +11 -11
- package/dist/react/ui/item.js.map +1 -1
- package/dist/react/ui/kbd.d.ts +3 -3
- package/dist/react/ui/kbd.js.map +1 -1
- package/dist/react/ui/label.d.ts +2 -2
- package/dist/react/ui/label.js.map +1 -1
- package/dist/react/ui/menubar.d.ts +17 -17
- package/dist/react/ui/menubar.js.map +1 -1
- package/dist/react/ui/navigation-menu.d.ts +9 -9
- package/dist/react/ui/navigation-menu.js +1 -1
- package/dist/react/ui/navigation-menu.js.map +1 -1
- package/dist/react/ui/pagination.d.ts +8 -8
- package/dist/react/ui/pagination.js.map +1 -1
- package/dist/react/ui/popover.d.ts +5 -5
- package/dist/react/ui/popover.js.map +1 -1
- package/dist/react/ui/progress.d.ts +2 -2
- package/dist/react/ui/progress.js.map +1 -1
- package/dist/react/ui/radio-group.d.ts +3 -3
- package/dist/react/ui/radio-group.js.map +1 -1
- package/dist/react/ui/resizable.d.ts +4 -4
- package/dist/react/ui/resizable.js.map +1 -1
- package/dist/react/ui/scroll-area.d.ts +3 -3
- package/dist/react/ui/scroll-area.js.map +1 -1
- package/dist/react/ui/select.d.ts +11 -11
- package/dist/react/ui/select.js.map +1 -1
- package/dist/react/ui/separator.d.ts +2 -2
- package/dist/react/ui/separator.js.map +1 -1
- package/dist/react/ui/sheet.d.ts +9 -9
- package/dist/react/ui/sheet.js.map +1 -1
- package/dist/react/ui/sidebar.d.ts +24 -24
- package/dist/react/ui/sidebar.js +2 -2
- package/dist/react/ui/sidebar.js.map +1 -1
- package/dist/react/ui/skeleton.d.ts +2 -2
- package/dist/react/ui/skeleton.js.map +1 -1
- package/dist/react/ui/slider.d.ts +2 -2
- package/dist/react/ui/slider.js.map +1 -1
- package/dist/react/ui/sonner.d.ts +2 -2
- package/dist/react/ui/sonner.js.map +1 -1
- package/dist/react/ui/spinner.d.ts +2 -2
- package/dist/react/ui/spinner.js.map +1 -1
- package/dist/react/ui/switch.d.ts +2 -2
- package/dist/react/ui/switch.js.map +1 -1
- package/dist/react/ui/table.d.ts +9 -9
- package/dist/react/ui/table.js.map +1 -1
- package/dist/react/ui/tabs.d.ts +5 -5
- package/dist/react/ui/tabs.js.map +1 -1
- package/dist/react/ui/textarea.d.ts +2 -2
- package/dist/react/ui/textarea.js.map +1 -1
- package/dist/react/ui/toggle-group.d.ts +3 -3
- package/dist/react/ui/toggle-group.js.map +1 -1
- package/dist/react/ui/toggle.d.ts +2 -2
- package/dist/react/ui/toggle.js.map +1 -1
- package/dist/react/ui/tooltip.d.ts +5 -5
- package/dist/react/ui/tooltip.d.ts.map +1 -1
- package/dist/react/ui/tooltip.js.map +1 -1
- package/dist/shared/src/genie.d.ts +48 -0
- package/dist/shared/src/genie.d.ts.map +1 -0
- package/docs/docs/api/appkit/Class.AppKitError/index.html +2 -2
- package/docs/docs/api/appkit/Class.AuthenticationError/index.html +2 -2
- package/docs/docs/api/appkit/Class.ConfigurationError/index.html +2 -2
- package/docs/docs/api/appkit/Class.ConnectionError/index.html +2 -2
- package/docs/docs/api/appkit/Class.ExecutionError/index.html +2 -2
- package/docs/docs/api/appkit/Class.InitializationError/index.html +2 -2
- package/docs/docs/api/appkit/Class.Plugin/index.html +2 -2
- package/docs/docs/api/appkit/Class.ResourceRegistry/index.html +2 -2
- package/docs/docs/api/appkit/Class.ServerError/index.html +2 -2
- package/docs/docs/api/appkit/Class.TunnelError/index.html +2 -2
- package/docs/docs/api/appkit/Class.ValidationError/index.html +2 -2
- package/docs/docs/api/appkit/Enumeration.RequestedClaimsPermissionSet/index.html +2 -2
- package/docs/docs/api/appkit/Enumeration.ResourceType/index.html +2 -2
- package/docs/docs/api/appkit/Function.appKitTypesPlugin/index.html +2 -2
- package/docs/docs/api/appkit/Function.createApp/index.html +2 -2
- package/docs/docs/api/appkit/Function.createLakebasePool/index.html +2 -2
- package/docs/docs/api/appkit/Function.generateDatabaseCredential/index.html +2 -2
- package/docs/docs/api/appkit/Function.getExecutionContext/index.html +2 -2
- package/docs/docs/api/appkit/Function.getLakebaseOrmConfig/index.html +2 -2
- package/docs/docs/api/appkit/Function.getLakebasePgConfig/index.html +2 -2
- package/docs/docs/api/appkit/Function.getPluginManifest/index.html +2 -2
- package/docs/docs/api/appkit/Function.getResourceRequirements/index.html +2 -2
- package/docs/docs/api/appkit/Function.getUsernameWithApiLookup/index.html +2 -2
- package/docs/docs/api/appkit/Function.getWorkspaceClient/index.html +2 -2
- package/docs/docs/api/appkit/Function.isSQLTypeMarker/index.html +2 -2
- package/docs/docs/api/appkit/Interface.BasePluginConfig/index.html +2 -2
- package/docs/docs/api/appkit/Interface.CacheConfig/index.html +2 -2
- package/docs/docs/api/appkit/Interface.DatabaseCredential/index.html +2 -2
- package/docs/docs/api/appkit/Interface.GenerateDatabaseCredentialRequest/index.html +2 -2
- package/docs/docs/api/appkit/Interface.ITelemetry/index.html +2 -2
- package/docs/docs/api/appkit/Interface.LakebasePoolConfig/index.html +2 -2
- package/docs/docs/api/appkit/Interface.PluginManifest/index.html +2 -2
- package/docs/docs/api/appkit/Interface.RequestedClaims/index.html +2 -2
- package/docs/docs/api/appkit/Interface.RequestedResource/index.html +2 -2
- package/docs/docs/api/appkit/Interface.ResourceEntry/index.html +2 -2
- package/docs/docs/api/appkit/Interface.ResourceFieldEntry/index.html +2 -2
- package/docs/docs/api/appkit/Interface.ResourceRequirement/index.html +2 -2
- package/docs/docs/api/appkit/Interface.StreamExecutionSettings/index.html +2 -2
- package/docs/docs/api/appkit/Interface.TelemetryConfig/index.html +2 -2
- package/docs/docs/api/appkit/Interface.ValidationResult/index.html +2 -2
- package/docs/docs/api/appkit/TypeAlias.ConfigSchema/index.html +2 -2
- package/docs/docs/api/appkit/TypeAlias.IAppRouter/index.html +2 -2
- package/docs/docs/api/appkit/TypeAlias.ResourcePermission/index.html +2 -2
- package/docs/docs/api/appkit/TypeAlias.ToPlugin/index.html +2 -2
- package/docs/docs/api/appkit/Variable.sql/index.html +2 -2
- package/docs/docs/api/appkit/index.html +2 -2
- package/docs/docs/api/appkit-ui/data/AreaChart/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/BarChart/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/DataTable/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/DonutChart/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/HeatmapChart/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/LineChart/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/PieChart/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/RadarChart/index.html +3 -3
- package/docs/docs/api/appkit-ui/data/ScatterChart/index.html +4 -4
- package/docs/docs/api/appkit-ui/genie/GenieChat/index.html +26 -0
- package/docs/docs/api/appkit-ui/genie/GenieChat.md +43 -0
- package/docs/docs/api/appkit-ui/genie/GenieChatInput/index.html +24 -0
- package/docs/docs/api/appkit-ui/genie/GenieChatInput.md +27 -0
- package/docs/docs/api/appkit-ui/genie/GenieChatMessage/index.html +24 -0
- package/docs/docs/api/appkit-ui/genie/GenieChatMessage.md +25 -0
- package/docs/docs/api/appkit-ui/genie/GenieChatMessageList/index.html +24 -0
- package/docs/docs/api/appkit-ui/genie/GenieChatMessageList.md +26 -0
- package/docs/docs/api/appkit-ui/index.html +3 -3
- package/docs/docs/api/appkit-ui/styling/index.html +4 -4
- package/docs/docs/api/appkit-ui/ui/Accordion/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Alert/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/AlertDialog/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/AspectRatio/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Avatar/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Badge/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Breadcrumb/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Button/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/ButtonGroup/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Calendar/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Card/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Carousel/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/ChartContainer/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Checkbox/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Collapsible/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Command/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/ContextMenu/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Dialog/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Drawer/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/DropdownMenu/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Empty/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Field/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/FormControl/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/HoverCard/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Input/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/InputGroup/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/InputOTP/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Item/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Kbd/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Label/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Menubar/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/NavigationMenu/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Pagination/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Popover/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Progress/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/RadioGroup/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/ResizableHandle/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/ScrollArea/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Select/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Separator/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Sheet/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Sidebar/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Skeleton/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Slider/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Spinner/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Switch/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Table/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Tabs/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Textarea/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Toaster/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Toggle/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/ToggleGroup/index.html +3 -3
- package/docs/docs/api/appkit-ui/ui/Tooltip/index.html +3 -3
- package/docs/docs/api/index.html +2 -2
- package/docs/docs/app-management/index.html +2 -2
- package/docs/docs/architecture/index.html +2 -2
- package/docs/docs/category/development/index.html +2 -2
- package/docs/docs/configuration/index.html +2 -2
- package/docs/docs/core-principles/index.html +2 -2
- package/docs/docs/development/ai-assisted-development/index.html +2 -2
- package/docs/docs/development/index.html +2 -2
- package/docs/docs/development/llm-guide/index.html +2 -2
- package/docs/docs/development/local-development/index.html +2 -2
- package/docs/docs/development/project-setup/index.html +2 -2
- package/docs/docs/development/remote-bridge/index.html +2 -2
- package/docs/docs/development/type-generation/index.html +2 -2
- package/docs/docs/index.html +2 -2
- package/docs/docs/plugins/analytics/index.html +2 -2
- package/docs/docs/plugins/caching/index.html +2 -2
- package/docs/docs/plugins/custom-plugins/index.html +2 -2
- package/docs/docs/plugins/execution-context/index.html +2 -2
- package/docs/docs/plugins/index.html +2 -2
- package/docs/docs/plugins/lakebase/index.html +4 -4
- package/docs/docs/plugins/lakebase.md +25 -24
- package/docs/docs/plugins/plugin-management/index.html +2 -2
- package/docs/docs/plugins/server/index.html +2 -2
- package/llms.txt +4 -0
- package/package.json +2 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.js","names":["Drawer","DrawerPrimitive"],"sources":["../../../src/react/ui/drawer.tsx"],"sourcesContent":["\"use client\";\n\nimport type * as React from \"react\";\nimport { Drawer as DrawerPrimitive } from \"vaul\";\n\nimport { cn } from \"../lib/utils\";\nimport { useResolvedPortalContainer } from \"../portal-container-context\";\n\n/** Draggable panel that slides in from screen edges */\nfunction Drawer({\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\n return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />;\n}\n\n/** Button that opens the drawer */\nfunction DrawerTrigger({\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\n}\n\n/** Portal container for drawer content */\nfunction DrawerPortal({\n container,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n return (\n <DrawerPrimitive.Portal\n data-slot=\"drawer-portal\"\n container={useResolvedPortalContainer(container)}\n {...props}\n />\n );\n}\n\n/** Button that closes the drawer */\nfunction DrawerClose({\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />;\n}\n\n/** Dimmed overlay behind the drawer */\nfunction DrawerOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n return (\n <DrawerPrimitive.Overlay\n data-slot=\"drawer-overlay\"\n className={cn(\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Main content area of the drawer */\nfunction DrawerContent({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\n return (\n <DrawerPortal data-slot=\"drawer-portal\">\n <DrawerOverlay />\n <DrawerPrimitive.Content\n data-slot=\"drawer-content\"\n className={cn(\n \"group/drawer-content bg-background fixed z-50 flex h-auto flex-col\",\n \"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b\",\n \"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t\",\n \"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n \"data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm\",\n className,\n )}\n {...props}\n >\n <div className=\"bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block\" />\n {children}\n </DrawerPrimitive.Content>\n </DrawerPortal>\n );\n}\n\n/** Header section of the drawer */\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"drawer-header\"\n className={cn(\n \"flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Footer section of the drawer */\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"drawer-footer\"\n className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n {...props}\n />\n );\n}\n\n/** Title text for the drawer */\nfunction DrawerTitle({\n className,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n return (\n <DrawerPrimitive.Title\n data-slot=\"drawer-title\"\n className={cn(\"text-foreground font-semibold\", className)}\n {...props}\n />\n );\n}\n\n/** Description text for the drawer */\nfunction DrawerDescription({\n className,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n return (\n <DrawerPrimitive.Description\n data-slot=\"drawer-description\"\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n );\n}\n\nexport {\n Drawer,\n DrawerPortal,\n DrawerOverlay,\n DrawerTrigger,\n DrawerClose,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerTitle,\n DrawerDescription,\n};\n"],"mappings":";;;;;;;;;AASA,SAASA,SAAO,EACd,GAAG,SACiD;AACpD,QAAO,oBAACC,OAAgB;
|
|
1
|
+
{"version":3,"file":"drawer.js","names":["Drawer","DrawerPrimitive"],"sources":["../../../src/react/ui/drawer.tsx"],"sourcesContent":["\"use client\";\n\nimport type * as React from \"react\";\nimport { Drawer as DrawerPrimitive } from \"vaul\";\n\nimport { cn } from \"../lib/utils\";\nimport { useResolvedPortalContainer } from \"../portal-container-context\";\n\n/** Draggable panel that slides in from screen edges */\nfunction Drawer({\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\n return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />;\n}\n\n/** Button that opens the drawer */\nfunction DrawerTrigger({\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\n}\n\n/** Portal container for drawer content */\nfunction DrawerPortal({\n container,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n return (\n <DrawerPrimitive.Portal\n data-slot=\"drawer-portal\"\n container={useResolvedPortalContainer(container)}\n {...props}\n />\n );\n}\n\n/** Button that closes the drawer */\nfunction DrawerClose({\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />;\n}\n\n/** Dimmed overlay behind the drawer */\nfunction DrawerOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n return (\n <DrawerPrimitive.Overlay\n data-slot=\"drawer-overlay\"\n className={cn(\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Main content area of the drawer */\nfunction DrawerContent({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\n return (\n <DrawerPortal data-slot=\"drawer-portal\">\n <DrawerOverlay />\n <DrawerPrimitive.Content\n data-slot=\"drawer-content\"\n className={cn(\n \"group/drawer-content bg-background fixed z-50 flex h-auto flex-col\",\n \"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b\",\n \"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t\",\n \"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n \"data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm\",\n className,\n )}\n {...props}\n >\n <div className=\"bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block\" />\n {children}\n </DrawerPrimitive.Content>\n </DrawerPortal>\n );\n}\n\n/** Header section of the drawer */\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"drawer-header\"\n className={cn(\n \"flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Footer section of the drawer */\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"drawer-footer\"\n className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n {...props}\n />\n );\n}\n\n/** Title text for the drawer */\nfunction DrawerTitle({\n className,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n return (\n <DrawerPrimitive.Title\n data-slot=\"drawer-title\"\n className={cn(\"text-foreground font-semibold\", className)}\n {...props}\n />\n );\n}\n\n/** Description text for the drawer */\nfunction DrawerDescription({\n className,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n return (\n <DrawerPrimitive.Description\n data-slot=\"drawer-description\"\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n );\n}\n\nexport {\n Drawer,\n DrawerPortal,\n DrawerOverlay,\n DrawerTrigger,\n DrawerClose,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerTitle,\n DrawerDescription,\n};\n"],"mappings":";;;;;;;;;AASA,SAASA,SAAO,EACd,GAAG,SACiD;AACpD,QAAO,oBAACC,OAAgB,MAAjB;EAAsB,aAAU;EAAS,GAAI;EAAS;;;AAI/D,SAAS,cAAc,EACrB,GAAG,SACoD;AACvD,QAAO,oBAACA,OAAgB,SAAjB;EAAyB,aAAU;EAAiB,GAAI;EAAS;;;AAI1E,SAAS,aAAa,EACpB,WACA,GAAG,SACmD;AACtD,QACE,oBAACA,OAAgB,QAAjB;EACE,aAAU;EACV,WAAW,2BAA2B,UAAU;EAChD,GAAI;EACJ;;;AAKN,SAAS,YAAY,EACnB,GAAG,SACkD;AACrD,QAAO,oBAACA,OAAgB,OAAjB;EAAuB,aAAU;EAAe,GAAI;EAAS;;;AAItE,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;AACvD,QACE,oBAACA,OAAgB,SAAjB;EACE,aAAU;EACV,WAAW,GACT,0JACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,cAAc,EACrB,WACA,UACA,GAAG,SACoD;AACvD,QACE,qBAAC,cAAD;EAAc,aAAU;YAAxB,CACE,oBAAC,eAAD,EAAiB,GACjB,qBAACA,OAAgB,SAAjB;GACE,aAAU;GACV,WAAW,GACT,sEACA,kQACA,uRACA,+NACA,yNACA,UACD;GACD,GAAI;aAVN,CAYE,oBAAC,OAAD,EAAK,WAAU,mIAAoI,GAClJ,SACuB;KACb;;;;AAKnB,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,4LACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,UAAU;EAC3D,GAAI;EACJ;;;AAKN,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;AACrD,QACE,oBAACA,OAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,UAAU;EACzD,GAAI;EACJ;;;AAKN,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;AAC3D,QACE,oBAACA,OAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,UAAU;EACzD,GAAI;EACJ"}
|
|
@@ -1,27 +1,27 @@
|
|
|
1
1
|
import * as React$1 from "react";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime104 from "react/jsx-runtime";
|
|
3
3
|
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
|
|
4
4
|
|
|
5
5
|
//#region src/react/ui/dropdown-menu.d.ts
|
|
6
6
|
/** Menu that displays when triggered by a button or element */
|
|
7
7
|
declare function DropdownMenu({
|
|
8
8
|
...props
|
|
9
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Root>):
|
|
9
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Root>): react_jsx_runtime104.JSX.Element;
|
|
10
10
|
declare function DropdownMenuPortal({
|
|
11
11
|
container,
|
|
12
12
|
...props
|
|
13
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Portal>):
|
|
13
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Portal>): react_jsx_runtime104.JSX.Element;
|
|
14
14
|
declare function DropdownMenuTrigger({
|
|
15
15
|
...props
|
|
16
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Trigger>):
|
|
16
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Trigger>): react_jsx_runtime104.JSX.Element;
|
|
17
17
|
declare function DropdownMenuContent({
|
|
18
18
|
className,
|
|
19
19
|
sideOffset,
|
|
20
20
|
...props
|
|
21
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Content>):
|
|
21
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Content>): react_jsx_runtime104.JSX.Element;
|
|
22
22
|
declare function DropdownMenuGroup({
|
|
23
23
|
...props
|
|
24
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Group>):
|
|
24
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Group>): react_jsx_runtime104.JSX.Element;
|
|
25
25
|
declare function DropdownMenuItem({
|
|
26
26
|
className,
|
|
27
27
|
inset,
|
|
@@ -30,39 +30,39 @@ declare function DropdownMenuItem({
|
|
|
30
30
|
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
|
|
31
31
|
inset?: boolean;
|
|
32
32
|
variant?: "default" | "destructive";
|
|
33
|
-
}):
|
|
33
|
+
}): react_jsx_runtime104.JSX.Element;
|
|
34
34
|
declare function DropdownMenuCheckboxItem({
|
|
35
35
|
className,
|
|
36
36
|
children,
|
|
37
37
|
checked,
|
|
38
38
|
...props
|
|
39
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>):
|
|
39
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>): react_jsx_runtime104.JSX.Element;
|
|
40
40
|
declare function DropdownMenuRadioGroup({
|
|
41
41
|
...props
|
|
42
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>):
|
|
42
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>): react_jsx_runtime104.JSX.Element;
|
|
43
43
|
declare function DropdownMenuRadioItem({
|
|
44
44
|
className,
|
|
45
45
|
children,
|
|
46
46
|
...props
|
|
47
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>):
|
|
47
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>): react_jsx_runtime104.JSX.Element;
|
|
48
48
|
declare function DropdownMenuLabel({
|
|
49
49
|
className,
|
|
50
50
|
inset,
|
|
51
51
|
...props
|
|
52
52
|
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
|
|
53
53
|
inset?: boolean;
|
|
54
|
-
}):
|
|
54
|
+
}): react_jsx_runtime104.JSX.Element;
|
|
55
55
|
declare function DropdownMenuSeparator({
|
|
56
56
|
className,
|
|
57
57
|
...props
|
|
58
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Separator>):
|
|
58
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Separator>): react_jsx_runtime104.JSX.Element;
|
|
59
59
|
declare function DropdownMenuShortcut({
|
|
60
60
|
className,
|
|
61
61
|
...props
|
|
62
|
-
}: React$1.ComponentProps<"span">):
|
|
62
|
+
}: React$1.ComponentProps<"span">): react_jsx_runtime104.JSX.Element;
|
|
63
63
|
declare function DropdownMenuSub({
|
|
64
64
|
...props
|
|
65
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Sub>):
|
|
65
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.Sub>): react_jsx_runtime104.JSX.Element;
|
|
66
66
|
declare function DropdownMenuSubTrigger({
|
|
67
67
|
className,
|
|
68
68
|
inset,
|
|
@@ -70,11 +70,11 @@ declare function DropdownMenuSubTrigger({
|
|
|
70
70
|
...props
|
|
71
71
|
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
|
|
72
72
|
inset?: boolean;
|
|
73
|
-
}):
|
|
73
|
+
}): react_jsx_runtime104.JSX.Element;
|
|
74
74
|
declare function DropdownMenuSubContent({
|
|
75
75
|
className,
|
|
76
76
|
...props
|
|
77
|
-
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.SubContent>):
|
|
77
|
+
}: React$1.ComponentProps<typeof DropdownMenuPrimitive.SubContent>): react_jsx_runtime104.JSX.Element;
|
|
78
78
|
//#endregion
|
|
79
79
|
export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
|
|
80
80
|
//# sourceMappingURL=dropdown-menu.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.js","names":[],"sources":["../../../src/react/ui/dropdown-menu.tsx"],"sourcesContent":["import type * as React from \"react\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\nimport { useResolvedPortalContainer } from \"../portal-container-context\";\n\n/** Menu that displays when triggered by a button or element */\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\n return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />;\n}\n\nfunction DropdownMenuPortal({\n container,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\n return (\n <DropdownMenuPrimitive.Portal\n data-slot=\"dropdown-menu-portal\"\n container={useResolvedPortalContainer(container)}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\n return (\n <DropdownMenuPrimitive.Trigger\n data-slot=\"dropdown-menu-trigger\"\n {...props}\n />\n );\n}\n\nfunction DropdownMenuContent({\n className,\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\n return (\n <DropdownMenuPrimitive.Portal container={useResolvedPortalContainer()}>\n <DropdownMenuPrimitive.Content\n data-slot=\"dropdown-menu-content\"\n sideOffset={sideOffset}\n className={cn(\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md\",\n className,\n )}\n {...props}\n />\n </DropdownMenuPrimitive.Portal>\n );\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\n return (\n <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n );\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean;\n variant?: \"default\" | \"destructive\";\n}) {\n return (\n <DropdownMenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\n return (\n <DropdownMenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n );\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\n return (\n <DropdownMenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n );\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\n return (\n <DropdownMenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CircleIcon className=\"size-2 fill-current\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.RadioItem>\n );\n}\n\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\n inset?: boolean;\n}) {\n return (\n <DropdownMenuPrimitive.Label\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n \"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\n return (\n <DropdownMenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn(\"bg-border -mx-1 my-1 h-px\", className)}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<\"span\">) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n \"text-muted-foreground ml-auto text-xs tracking-widest\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\n return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />;\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n inset?: boolean;\n}) {\n return (\n <DropdownMenuPrimitive.SubTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ml-auto size-4\" />\n </DropdownMenuPrimitive.SubTrigger>\n );\n}\n\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\n return (\n <DropdownMenuPrimitive.SubContent\n data-slot=\"dropdown-menu-sub-content\"\n className={cn(\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg\",\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n DropdownMenu,\n DropdownMenuPortal,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuLabel,\n DropdownMenuItem,\n DropdownMenuCheckboxItem,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubTrigger,\n DropdownMenuSubContent,\n};\n"],"mappings":";;;;;;;;AAQA,SAAS,aAAa,EACpB,GAAG,SACuD;AAC1D,QAAO,oBAAC,sBAAsB;EAAK,aAAU;EAAgB,GAAI;GAAS;;AAG5E,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;AAC5D,QACE,oBAAC,sBAAsB;EACrB,aAAU;EACV,WAAW,2BAA2B,UAAU;EAChD,GAAI;GACJ;;AAIN,SAAS,oBAAoB,EAC3B,GAAG,SAC0D;AAC7D,QACE,oBAAC,sBAAsB;EACrB,aAAU;EACV,GAAI;GACJ;;AAIN,SAAS,oBAAoB,EAC3B,WACA,aAAa,GACb,GAAG,SAC0D;AAC7D,QACE,oBAAC,sBAAsB;EAAO,WAAW,4BAA4B;YACnE,oBAAC,sBAAsB;GACrB,aAAU;GACE;GACZ,WAAW,GACT,0jBACA,UACD;GACD,GAAI;IACJ;GAC2B;;AAInC,SAAS,kBAAkB,EACzB,GAAG,SACwD;AAC3D,QACE,oBAAC,sBAAsB;EAAM,aAAU;EAAsB,GAAI;GAAS;;AAI9E,SAAS,iBAAiB,EACxB,WACA,OACA,UAAU,WACV,GAAG,SAIF;AACD,QACE,oBAAC,sBAAsB;EACrB,aAAU;EACV,cAAY;EACZ,gBAAc;EACd,WAAW,GACT,+mBACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,yBAAyB,EAChC,WACA,UACA,SACA,GAAG,SAC+D;AAClE,QACE,qBAAC,sBAAsB;EACrB,aAAU;EACV,WAAW,GACT,gTACA,UACD;EACQ;EACT,GAAI;aAEJ,oBAAC;GAAK,WAAU;aACd,oBAAC,sBAAsB,2BACrB,oBAAC,aAAU,WAAU,WAAW,GACI;IACjC,EACN;GACkC;;AAIzC,SAAS,uBAAuB,EAC9B,GAAG,SAC6D;AAChE,QACE,oBAAC,sBAAsB;EACrB,aAAU;EACV,GAAI;GACJ;;AAIN,SAAS,sBAAsB,EAC7B,WACA,UACA,GAAG,SAC4D;AAC/D,QACE,qBAAC,sBAAsB;EACrB,aAAU;EACV,WAAW,GACT,gTACA,UACD;EACD,GAAI;aAEJ,oBAAC;GAAK,WAAU;aACd,oBAAC,sBAAsB,2BACrB,oBAAC,cAAW,WAAU,wBAAwB,GACV;IACjC,EACN;GAC+B;;AAItC,SAAS,kBAAkB,EACzB,WACA,OACA,GAAG,SAGF;AACD,QACE,oBAAC,sBAAsB;EACrB,aAAU;EACV,cAAY;EACZ,WAAW,GACT,qDACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,sBAAsB,EAC7B,WACA,GAAG,SAC4D;AAC/D,QACE,oBAAC,sBAAsB;EACrB,aAAU;EACV,WAAW,GAAG,6BAA6B,UAAU;EACrD,GAAI;GACJ;;AAIN,SAAS,qBAAqB,EAC5B,WACA,GAAG,SAC4B;AAC/B,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,yDACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,gBAAgB,EACvB,GAAG,SACsD;AACzD,QAAO,oBAAC,sBAAsB;EAAI,aAAU;EAAoB,GAAI;GAAS;;AAG/E,SAAS,uBAAuB,EAC9B,WACA,OACA,UACA,GAAG,SAGF;AACD,QACE,qBAAC,sBAAsB;EACrB,aAAU;EACV,cAAY;EACZ,WAAW,GACT,8WACA,UACD;EACD,GAAI;aAEH,UACD,oBAAC,oBAAiB,WAAU,mBAAmB;GACd;;AAIvC,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;AAChE,QACE,oBAAC,sBAAsB;EACrB,aAAU;EACV,WAAW,GACT,ifACA,UACD;EACD,GAAI;GACJ"}
|
|
1
|
+
{"version":3,"file":"dropdown-menu.js","names":[],"sources":["../../../src/react/ui/dropdown-menu.tsx"],"sourcesContent":["import type * as React from \"react\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\nimport { useResolvedPortalContainer } from \"../portal-container-context\";\n\n/** Menu that displays when triggered by a button or element */\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\n return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />;\n}\n\nfunction DropdownMenuPortal({\n container,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\n return (\n <DropdownMenuPrimitive.Portal\n data-slot=\"dropdown-menu-portal\"\n container={useResolvedPortalContainer(container)}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\n return (\n <DropdownMenuPrimitive.Trigger\n data-slot=\"dropdown-menu-trigger\"\n {...props}\n />\n );\n}\n\nfunction DropdownMenuContent({\n className,\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\n return (\n <DropdownMenuPrimitive.Portal container={useResolvedPortalContainer()}>\n <DropdownMenuPrimitive.Content\n data-slot=\"dropdown-menu-content\"\n sideOffset={sideOffset}\n className={cn(\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md\",\n className,\n )}\n {...props}\n />\n </DropdownMenuPrimitive.Portal>\n );\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\n return (\n <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n );\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean;\n variant?: \"default\" | \"destructive\";\n}) {\n return (\n <DropdownMenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\n return (\n <DropdownMenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n );\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\n return (\n <DropdownMenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n );\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\n return (\n <DropdownMenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CircleIcon className=\"size-2 fill-current\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.RadioItem>\n );\n}\n\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\n inset?: boolean;\n}) {\n return (\n <DropdownMenuPrimitive.Label\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n \"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\n return (\n <DropdownMenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn(\"bg-border -mx-1 my-1 h-px\", className)}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<\"span\">) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n \"text-muted-foreground ml-auto text-xs tracking-widest\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\n return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />;\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n inset?: boolean;\n}) {\n return (\n <DropdownMenuPrimitive.SubTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ml-auto size-4\" />\n </DropdownMenuPrimitive.SubTrigger>\n );\n}\n\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\n return (\n <DropdownMenuPrimitive.SubContent\n data-slot=\"dropdown-menu-sub-content\"\n className={cn(\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg\",\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n DropdownMenu,\n DropdownMenuPortal,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuLabel,\n DropdownMenuItem,\n DropdownMenuCheckboxItem,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubTrigger,\n DropdownMenuSubContent,\n};\n"],"mappings":";;;;;;;;AAQA,SAAS,aAAa,EACpB,GAAG,SACuD;AAC1D,QAAO,oBAAC,sBAAsB,MAAvB;EAA4B,aAAU;EAAgB,GAAI;EAAS;;AAG5E,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;AAC5D,QACE,oBAAC,sBAAsB,QAAvB;EACE,aAAU;EACV,WAAW,2BAA2B,UAAU;EAChD,GAAI;EACJ;;AAIN,SAAS,oBAAoB,EAC3B,GAAG,SAC0D;AAC7D,QACE,oBAAC,sBAAsB,SAAvB;EACE,aAAU;EACV,GAAI;EACJ;;AAIN,SAAS,oBAAoB,EAC3B,WACA,aAAa,GACb,GAAG,SAC0D;AAC7D,QACE,oBAAC,sBAAsB,QAAvB;EAA8B,WAAW,4BAA4B;YACnE,oBAAC,sBAAsB,SAAvB;GACE,aAAU;GACE;GACZ,WAAW,GACT,0jBACA,UACD;GACD,GAAI;GACJ;EAC2B;;AAInC,SAAS,kBAAkB,EACzB,GAAG,SACwD;AAC3D,QACE,oBAAC,sBAAsB,OAAvB;EAA6B,aAAU;EAAsB,GAAI;EAAS;;AAI9E,SAAS,iBAAiB,EACxB,WACA,OACA,UAAU,WACV,GAAG,SAIF;AACD,QACE,oBAAC,sBAAsB,MAAvB;EACE,aAAU;EACV,cAAY;EACZ,gBAAc;EACd,WAAW,GACT,+mBACA,UACD;EACD,GAAI;EACJ;;AAIN,SAAS,yBAAyB,EAChC,WACA,UACA,SACA,GAAG,SAC+D;AAClE,QACE,qBAAC,sBAAsB,cAAvB;EACE,aAAU;EACV,WAAW,GACT,gTACA,UACD;EACQ;EACT,GAAI;YAPN,CASE,oBAAC,QAAD;GAAM,WAAU;aACd,oBAAC,sBAAsB,eAAvB,YACE,oBAAC,WAAD,EAAW,WAAU,UAAW,GACI;GACjC,GACN,SACkC;;;AAIzC,SAAS,uBAAuB,EAC9B,GAAG,SAC6D;AAChE,QACE,oBAAC,sBAAsB,YAAvB;EACE,aAAU;EACV,GAAI;EACJ;;AAIN,SAAS,sBAAsB,EAC7B,WACA,UACA,GAAG,SAC4D;AAC/D,QACE,qBAAC,sBAAsB,WAAvB;EACE,aAAU;EACV,WAAW,GACT,gTACA,UACD;EACD,GAAI;YANN,CAQE,oBAAC,QAAD;GAAM,WAAU;aACd,oBAAC,sBAAsB,eAAvB,YACE,oBAAC,YAAD,EAAY,WAAU,uBAAwB,GACV;GACjC,GACN,SAC+B;;;AAItC,SAAS,kBAAkB,EACzB,WACA,OACA,GAAG,SAGF;AACD,QACE,oBAAC,sBAAsB,OAAvB;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,qDACA,UACD;EACD,GAAI;EACJ;;AAIN,SAAS,sBAAsB,EAC7B,WACA,GAAG,SAC4D;AAC/D,QACE,oBAAC,sBAAsB,WAAvB;EACE,aAAU;EACV,WAAW,GAAG,6BAA6B,UAAU;EACrD,GAAI;EACJ;;AAIN,SAAS,qBAAqB,EAC5B,WACA,GAAG,SAC4B;AAC/B,QACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GACT,yDACA,UACD;EACD,GAAI;EACJ;;AAIN,SAAS,gBAAgB,EACvB,GAAG,SACsD;AACzD,QAAO,oBAAC,sBAAsB,KAAvB;EAA2B,aAAU;EAAoB,GAAI;EAAS;;AAG/E,SAAS,uBAAuB,EAC9B,WACA,OACA,UACA,GAAG,SAGF;AACD,QACE,qBAAC,sBAAsB,YAAvB;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,8WACA,UACD;EACD,GAAI;YAPN,CASG,UACD,oBAAC,kBAAD,EAAkB,WAAU,kBAAmB,EACd;;;AAIvC,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;AAChE,QACE,oBAAC,sBAAsB,YAAvB;EACE,aAAU;EACV,WAAW,GACT,ifACA,UACD;EACD,GAAI;EACJ"}
|
package/dist/react/ui/empty.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react_jsx_runtime119 from "react/jsx-runtime";
|
|
2
2
|
import { VariantProps } from "class-variance-authority";
|
|
3
3
|
import * as class_variance_authority_types3 from "class-variance-authority/types";
|
|
4
4
|
|
|
@@ -7,11 +7,11 @@ import * as class_variance_authority_types3 from "class-variance-authority/types
|
|
|
7
7
|
declare function Empty({
|
|
8
8
|
className,
|
|
9
9
|
...props
|
|
10
|
-
}: React.ComponentProps<"div">):
|
|
10
|
+
}: React.ComponentProps<"div">): react_jsx_runtime119.JSX.Element;
|
|
11
11
|
declare function EmptyHeader({
|
|
12
12
|
className,
|
|
13
13
|
...props
|
|
14
|
-
}: React.ComponentProps<"div">):
|
|
14
|
+
}: React.ComponentProps<"div">): react_jsx_runtime119.JSX.Element;
|
|
15
15
|
declare const emptyMediaVariants: (props?: ({
|
|
16
16
|
variant?: "default" | "icon" | null | undefined;
|
|
17
17
|
} & class_variance_authority_types3.ClassProp) | undefined) => string;
|
|
@@ -19,19 +19,19 @@ declare function EmptyMedia({
|
|
|
19
19
|
className,
|
|
20
20
|
variant,
|
|
21
21
|
...props
|
|
22
|
-
}: React.ComponentProps<"div"> & VariantProps<typeof emptyMediaVariants>):
|
|
22
|
+
}: React.ComponentProps<"div"> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime119.JSX.Element;
|
|
23
23
|
declare function EmptyTitle({
|
|
24
24
|
className,
|
|
25
25
|
...props
|
|
26
|
-
}: React.ComponentProps<"div">):
|
|
26
|
+
}: React.ComponentProps<"div">): react_jsx_runtime119.JSX.Element;
|
|
27
27
|
declare function EmptyDescription({
|
|
28
28
|
className,
|
|
29
29
|
...props
|
|
30
|
-
}: React.ComponentProps<"p">):
|
|
30
|
+
}: React.ComponentProps<"p">): react_jsx_runtime119.JSX.Element;
|
|
31
31
|
declare function EmptyContent({
|
|
32
32
|
className,
|
|
33
33
|
...props
|
|
34
|
-
}: React.ComponentProps<"div">):
|
|
34
|
+
}: React.ComponentProps<"div">): react_jsx_runtime119.JSX.Element;
|
|
35
35
|
//#endregion
|
|
36
36
|
export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };
|
|
37
37
|
//# sourceMappingURL=empty.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"empty.js","names":[],"sources":["../../../src/react/ui/empty.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\n/** Empty state component for displaying no-data scenarios */\nfunction Empty({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty\"\n className={cn(\n \"flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-header\"\n className={cn(\n \"flex max-w-sm flex-col items-center gap-2 text-center\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst emptyMediaVariants = cva(\n \"flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n {\n variants: {\n variant: {\n default: \"bg-transparent\",\n icon: \"bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n },\n);\n\nfunction EmptyMedia({\n className,\n variant = \"default\",\n ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof emptyMediaVariants>) {\n return (\n <div\n data-slot=\"empty-icon\"\n data-variant={variant}\n className={cn(emptyMediaVariants({ variant, className }))}\n {...props}\n />\n );\n}\n\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-title\"\n className={cn(\"text-lg font-medium tracking-tight\", className)}\n {...props}\n />\n );\n}\n\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n return (\n <div\n data-slot=\"empty-description\"\n className={cn(\n \"text-muted-foreground [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction EmptyContent({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-content\"\n className={cn(\n \"flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance\",\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n Empty,\n EmptyHeader,\n EmptyTitle,\n EmptyDescription,\n EmptyContent,\n EmptyMedia,\n};\n"],"mappings":";;;;;;AAKA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAsC;AACnE,QACE,oBAAC;
|
|
1
|
+
{"version":3,"file":"empty.js","names":[],"sources":["../../../src/react/ui/empty.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\n/** Empty state component for displaying no-data scenarios */\nfunction Empty({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty\"\n className={cn(\n \"flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-header\"\n className={cn(\n \"flex max-w-sm flex-col items-center gap-2 text-center\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst emptyMediaVariants = cva(\n \"flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n {\n variants: {\n variant: {\n default: \"bg-transparent\",\n icon: \"bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n },\n);\n\nfunction EmptyMedia({\n className,\n variant = \"default\",\n ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof emptyMediaVariants>) {\n return (\n <div\n data-slot=\"empty-icon\"\n data-variant={variant}\n className={cn(emptyMediaVariants({ variant, className }))}\n {...props}\n />\n );\n}\n\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-title\"\n className={cn(\"text-lg font-medium tracking-tight\", className)}\n {...props}\n />\n );\n}\n\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n return (\n <div\n data-slot=\"empty-description\"\n className={cn(\n \"text-muted-foreground [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction EmptyContent({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-content\"\n className={cn(\n \"flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance\",\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n Empty,\n EmptyHeader,\n EmptyTitle,\n EmptyDescription,\n EmptyContent,\n EmptyMedia,\n};\n"],"mappings":";;;;;;AAKA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAsC;AACnE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,gIACA,UACD;EACD,GAAI;EACJ;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,yDACA,UACD;EACD,GAAI;EACJ;;AAIN,MAAM,qBAAqB,IACzB,+FACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,MAAM;EACP,EACF;CACD,iBAAiB,EACf,SAAS,WACV;CACF,CACF;AAED,SAAS,WAAW,EAClB,WACA,UAAU,WACV,GAAG,SACqE;AACxE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,gBAAc;EACd,WAAW,GAAG,mBAAmB;GAAE;GAAS;GAAW,CAAC,CAAC;EACzD,GAAI;EACJ;;AAIN,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;AACxE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,sCAAsC,UAAU;EAC9D,GAAI;EACJ;;AAIN,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAoC;AAC5E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,2GACA,UACD;EACD,GAAI;EACJ;;AAIN,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,iFACA,UACD;EACD,GAAI;EACJ"}
|
package/dist/react/ui/field.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Label } from "./label.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime125 from "react/jsx-runtime";
|
|
3
3
|
import { VariantProps } from "class-variance-authority";
|
|
4
4
|
import * as class_variance_authority_types4 from "class-variance-authority/types";
|
|
5
5
|
|
|
@@ -8,7 +8,7 @@ import * as class_variance_authority_types4 from "class-variance-authority/types
|
|
|
8
8
|
declare function FieldSet({
|
|
9
9
|
className,
|
|
10
10
|
...props
|
|
11
|
-
}: React.ComponentProps<"fieldset">):
|
|
11
|
+
}: React.ComponentProps<"fieldset">): react_jsx_runtime125.JSX.Element;
|
|
12
12
|
/** Title or caption for a fieldset */
|
|
13
13
|
declare function FieldLegend({
|
|
14
14
|
className,
|
|
@@ -16,12 +16,12 @@ declare function FieldLegend({
|
|
|
16
16
|
...props
|
|
17
17
|
}: React.ComponentProps<"legend"> & {
|
|
18
18
|
variant?: "legend" | "label";
|
|
19
|
-
}):
|
|
19
|
+
}): react_jsx_runtime125.JSX.Element;
|
|
20
20
|
/** Container for organizing multiple fields */
|
|
21
21
|
declare function FieldGroup({
|
|
22
22
|
className,
|
|
23
23
|
...props
|
|
24
|
-
}: React.ComponentProps<"div">):
|
|
24
|
+
}: React.ComponentProps<"div">): react_jsx_runtime125.JSX.Element;
|
|
25
25
|
declare const fieldVariants: (props?: ({
|
|
26
26
|
orientation?: "horizontal" | "vertical" | "responsive" | null | undefined;
|
|
27
27
|
} & class_variance_authority_types4.ClassProp) | undefined) => string;
|
|
@@ -30,27 +30,27 @@ declare function Field({
|
|
|
30
30
|
className,
|
|
31
31
|
orientation,
|
|
32
32
|
...props
|
|
33
|
-
}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>):
|
|
33
|
+
}: React.ComponentProps<"div"> & VariantProps<typeof fieldVariants>): react_jsx_runtime125.JSX.Element;
|
|
34
34
|
/** Container for field label, description, and error messages */
|
|
35
35
|
declare function FieldContent({
|
|
36
36
|
className,
|
|
37
37
|
...props
|
|
38
|
-
}: React.ComponentProps<"div">):
|
|
38
|
+
}: React.ComponentProps<"div">): react_jsx_runtime125.JSX.Element;
|
|
39
39
|
/** Label for a form field */
|
|
40
40
|
declare function FieldLabel({
|
|
41
41
|
className,
|
|
42
42
|
...props
|
|
43
|
-
}: React.ComponentProps<typeof Label>):
|
|
43
|
+
}: React.ComponentProps<typeof Label>): react_jsx_runtime125.JSX.Element;
|
|
44
44
|
/** Title text for a field */
|
|
45
45
|
declare function FieldTitle({
|
|
46
46
|
className,
|
|
47
47
|
...props
|
|
48
|
-
}: React.ComponentProps<"div">):
|
|
48
|
+
}: React.ComponentProps<"div">): react_jsx_runtime125.JSX.Element;
|
|
49
49
|
/** Helper text providing additional context for a field */
|
|
50
50
|
declare function FieldDescription({
|
|
51
51
|
className,
|
|
52
52
|
...props
|
|
53
|
-
}: React.ComponentProps<"p">):
|
|
53
|
+
}: React.ComponentProps<"p">): react_jsx_runtime125.JSX.Element;
|
|
54
54
|
/** Visual separator between fields with optional label */
|
|
55
55
|
declare function FieldSeparator({
|
|
56
56
|
children,
|
|
@@ -58,7 +58,7 @@ declare function FieldSeparator({
|
|
|
58
58
|
...props
|
|
59
59
|
}: React.ComponentProps<"div"> & {
|
|
60
60
|
children?: React.ReactNode;
|
|
61
|
-
}):
|
|
61
|
+
}): react_jsx_runtime125.JSX.Element;
|
|
62
62
|
/** Error message display for invalid field values */
|
|
63
63
|
declare function FieldError({
|
|
64
64
|
className,
|
|
@@ -69,7 +69,7 @@ declare function FieldError({
|
|
|
69
69
|
errors?: Array<{
|
|
70
70
|
message?: string;
|
|
71
71
|
} | undefined>;
|
|
72
|
-
}):
|
|
72
|
+
}): react_jsx_runtime125.JSX.Element | null;
|
|
73
73
|
//#endregion
|
|
74
74
|
export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle };
|
|
75
75
|
//# sourceMappingURL=field.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field.js","names":[],"sources":["../../../src/react/ui/field.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\nimport { Label } from \"./label\";\nimport { Separator } from \"./separator\";\n\n/** Container for grouping related form fields */\nfunction FieldSet({ className, ...props }: React.ComponentProps<\"fieldset\">) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n \"flex flex-col gap-6\",\n \"has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Title or caption for a fieldset */\nfunction FieldLegend({\n className,\n variant = \"legend\",\n ...props\n}: React.ComponentProps<\"legend\"> & { variant?: \"legend\" | \"label\" }) {\n return (\n <legend\n data-slot=\"field-legend\"\n data-variant={variant}\n className={cn(\n \"mb-3 font-medium\",\n \"data-[variant=legend]:text-base\",\n \"data-[variant=label]:text-sm\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Container for organizing multiple fields */\nfunction FieldGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"field-group\"\n className={cn(\n \"group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst fieldVariants = cva(\n \"group/field flex w-full gap-3 data-[invalid=true]:text-destructive\",\n {\n variants: {\n orientation: {\n vertical: [\"flex-col [&>*]:w-full [&>.sr-only]:w-auto\"],\n horizontal: [\n \"flex-row items-center\",\n \"[&>[data-slot=field-label]]:flex-auto\",\n \"has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n ],\n responsive: [\n \"flex-col [&>*]:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto\",\n \"@md/field-group:[&>[data-slot=field-label]]:flex-auto\",\n \"@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n ],\n },\n },\n defaultVariants: {\n orientation: \"vertical\",\n },\n },\n);\n\n/** Form field wrapper with label and input positioning */\nfunction Field({\n className,\n orientation = \"vertical\",\n ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof fieldVariants>) {\n return (\n <div\n role=\"group\"\n data-slot=\"field\"\n data-orientation={orientation}\n className={cn(fieldVariants({ orientation }), className)}\n {...props}\n />\n );\n}\n\n/** Container for field label, description, and error messages */\nfunction FieldContent({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"field-content\"\n className={cn(\n \"group/field-content flex flex-1 flex-col gap-1.5 leading-snug\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Label for a form field */\nfunction FieldLabel({\n className,\n ...props\n}: React.ComponentProps<typeof Label>) {\n return (\n <Label\n data-slot=\"field-label\"\n className={cn(\n \"group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50\",\n \"has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4\",\n \"has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Title text for a field */\nfunction FieldTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"field-label\"\n className={cn(\n \"flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Helper text providing additional context for a field */\nfunction FieldDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n return (\n <p\n data-slot=\"field-description\"\n className={cn(\n \"text-muted-foreground text-sm leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance\",\n \"last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5\",\n \"[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Visual separator between fields with optional label */\nfunction FieldSeparator({\n children,\n className,\n ...props\n}: React.ComponentProps<\"div\"> & {\n children?: React.ReactNode;\n}) {\n return (\n <div\n data-slot=\"field-separator\"\n data-content={!!children}\n className={cn(\n \"relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2\",\n className,\n )}\n {...props}\n >\n <Separator className=\"absolute inset-0 top-1/2\" />\n {children && (\n <span\n className=\"bg-background text-muted-foreground relative mx-auto block w-fit px-2\"\n data-slot=\"field-separator-content\"\n >\n {children}\n </span>\n )}\n </div>\n );\n}\n\n/** Error message display for invalid field values */\nfunction FieldError({\n className,\n children,\n errors,\n ...props\n}: React.ComponentProps<\"div\"> & {\n errors?: Array<{ message?: string } | undefined>;\n}) {\n const content = useMemo(() => {\n if (children) {\n return children;\n }\n\n if (!errors?.length) {\n return null;\n }\n\n const uniqueErrors = [\n ...new Map(errors.map((error) => [error?.message, error])).values(),\n ];\n\n if (uniqueErrors?.length == 1) {\n return uniqueErrors[0]?.message;\n }\n\n return (\n <ul className=\"ml-4 flex list-disc flex-col gap-1\">\n {uniqueErrors.map(\n (error, index) =>\n error?.message && <li key={index}>{error.message}</li>,\n )}\n </ul>\n );\n }, [children, errors]);\n\n if (!content) {\n return null;\n }\n\n return (\n <div\n role=\"alert\"\n data-slot=\"field-error\"\n className={cn(\"text-destructive text-sm font-normal\", className)}\n {...props}\n >\n {content}\n </div>\n );\n}\n\nexport {\n Field,\n FieldLabel,\n FieldDescription,\n FieldError,\n FieldGroup,\n FieldLegend,\n FieldSeparator,\n FieldSet,\n FieldContent,\n FieldTitle,\n};\n"],"mappings":";;;;;;;;;AAQA,SAAS,SAAS,EAAE,WAAW,GAAG,SAA2C;AAC3E,QACE,oBAAC;
|
|
1
|
+
{"version":3,"file":"field.js","names":[],"sources":["../../../src/react/ui/field.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\nimport { Label } from \"./label\";\nimport { Separator } from \"./separator\";\n\n/** Container for grouping related form fields */\nfunction FieldSet({ className, ...props }: React.ComponentProps<\"fieldset\">) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n \"flex flex-col gap-6\",\n \"has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Title or caption for a fieldset */\nfunction FieldLegend({\n className,\n variant = \"legend\",\n ...props\n}: React.ComponentProps<\"legend\"> & { variant?: \"legend\" | \"label\" }) {\n return (\n <legend\n data-slot=\"field-legend\"\n data-variant={variant}\n className={cn(\n \"mb-3 font-medium\",\n \"data-[variant=legend]:text-base\",\n \"data-[variant=label]:text-sm\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Container for organizing multiple fields */\nfunction FieldGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"field-group\"\n className={cn(\n \"group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst fieldVariants = cva(\n \"group/field flex w-full gap-3 data-[invalid=true]:text-destructive\",\n {\n variants: {\n orientation: {\n vertical: [\"flex-col [&>*]:w-full [&>.sr-only]:w-auto\"],\n horizontal: [\n \"flex-row items-center\",\n \"[&>[data-slot=field-label]]:flex-auto\",\n \"has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n ],\n responsive: [\n \"flex-col [&>*]:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto\",\n \"@md/field-group:[&>[data-slot=field-label]]:flex-auto\",\n \"@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n ],\n },\n },\n defaultVariants: {\n orientation: \"vertical\",\n },\n },\n);\n\n/** Form field wrapper with label and input positioning */\nfunction Field({\n className,\n orientation = \"vertical\",\n ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof fieldVariants>) {\n return (\n <div\n role=\"group\"\n data-slot=\"field\"\n data-orientation={orientation}\n className={cn(fieldVariants({ orientation }), className)}\n {...props}\n />\n );\n}\n\n/** Container for field label, description, and error messages */\nfunction FieldContent({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"field-content\"\n className={cn(\n \"group/field-content flex flex-1 flex-col gap-1.5 leading-snug\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Label for a form field */\nfunction FieldLabel({\n className,\n ...props\n}: React.ComponentProps<typeof Label>) {\n return (\n <Label\n data-slot=\"field-label\"\n className={cn(\n \"group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50\",\n \"has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4\",\n \"has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Title text for a field */\nfunction FieldTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"field-label\"\n className={cn(\n \"flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Helper text providing additional context for a field */\nfunction FieldDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n return (\n <p\n data-slot=\"field-description\"\n className={cn(\n \"text-muted-foreground text-sm leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance\",\n \"last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5\",\n \"[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\n/** Visual separator between fields with optional label */\nfunction FieldSeparator({\n children,\n className,\n ...props\n}: React.ComponentProps<\"div\"> & {\n children?: React.ReactNode;\n}) {\n return (\n <div\n data-slot=\"field-separator\"\n data-content={!!children}\n className={cn(\n \"relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2\",\n className,\n )}\n {...props}\n >\n <Separator className=\"absolute inset-0 top-1/2\" />\n {children && (\n <span\n className=\"bg-background text-muted-foreground relative mx-auto block w-fit px-2\"\n data-slot=\"field-separator-content\"\n >\n {children}\n </span>\n )}\n </div>\n );\n}\n\n/** Error message display for invalid field values */\nfunction FieldError({\n className,\n children,\n errors,\n ...props\n}: React.ComponentProps<\"div\"> & {\n errors?: Array<{ message?: string } | undefined>;\n}) {\n const content = useMemo(() => {\n if (children) {\n return children;\n }\n\n if (!errors?.length) {\n return null;\n }\n\n const uniqueErrors = [\n ...new Map(errors.map((error) => [error?.message, error])).values(),\n ];\n\n if (uniqueErrors?.length == 1) {\n return uniqueErrors[0]?.message;\n }\n\n return (\n <ul className=\"ml-4 flex list-disc flex-col gap-1\">\n {uniqueErrors.map(\n (error, index) =>\n error?.message && <li key={index}>{error.message}</li>,\n )}\n </ul>\n );\n }, [children, errors]);\n\n if (!content) {\n return null;\n }\n\n return (\n <div\n role=\"alert\"\n data-slot=\"field-error\"\n className={cn(\"text-destructive text-sm font-normal\", className)}\n {...props}\n >\n {content}\n </div>\n );\n}\n\nexport {\n Field,\n FieldLabel,\n FieldDescription,\n FieldError,\n FieldGroup,\n FieldLegend,\n FieldSeparator,\n FieldSet,\n FieldContent,\n FieldTitle,\n};\n"],"mappings":";;;;;;;;;AAQA,SAAS,SAAS,EAAE,WAAW,GAAG,SAA2C;AAC3E,QACE,oBAAC,YAAD;EACE,aAAU;EACV,WAAW,GACT,uBACA,gFACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,YAAY,EACnB,WACA,UAAU,UACV,GAAG,SACiE;AACpE,QACE,oBAAC,UAAD;EACE,aAAU;EACV,gBAAc;EACd,WAAW,GACT,oBACA,mCACA,gCACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;AACxE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,0IACA,UACD;EACD,GAAI;EACJ;;AAIN,MAAM,gBAAgB,IACpB,sEACA;CACE,UAAU,EACR,aAAa;EACX,UAAU,CAAC,4CAA4C;EACvD,YAAY;GACV;GACA;GACA;GACD;EACD,YAAY;GACV;GACA;GACA;GACD;EACF,EACF;CACD,iBAAiB,EACf,aAAa,YACd;CACF,CACF;;AAGD,SAAS,MAAM,EACb,WACA,cAAc,YACd,GAAG,SACgE;AACnE,QACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,oBAAkB;EAClB,WAAW,GAAG,cAAc,EAAE,aAAa,CAAC,EAAE,UAAU;EACxD,GAAI;EACJ;;;AAKN,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,iEACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,WAAW,EAClB,WACA,GAAG,SACkC;AACrC,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,gHACA,qKACA,6HACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;AACxE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,8GACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAoC;AAC5E,QACE,oBAAC,KAAD;EACE,aAAU;EACV,WAAW,GACT,yHACA,gEACA,qEACA,UACD;EACD,GAAI;EACJ;;;AAKN,SAAS,eAAe,EACtB,UACA,WACA,GAAG,SAGF;AACD,QACE,qBAAC,OAAD;EACE,aAAU;EACV,gBAAc,CAAC,CAAC;EAChB,WAAW,GACT,6EACA,UACD;EACD,GAAI;YAPN,CASE,oBAAC,WAAD,EAAW,WAAU,4BAA6B,GACjD,YACC,oBAAC,QAAD;GACE,WAAU;GACV,aAAU;GAET;GACI,EAEL;;;;AAKV,SAAS,WAAW,EAClB,WACA,UACA,QACA,GAAG,SAGF;CACD,MAAM,UAAU,cAAc;AAC5B,MAAI,SACF,QAAO;AAGT,MAAI,CAAC,QAAQ,OACX,QAAO;EAGT,MAAM,eAAe,CACnB,GAAG,IAAI,IAAI,OAAO,KAAK,UAAU,CAAC,OAAO,SAAS,MAAM,CAAC,CAAC,CAAC,QAAQ,CACpE;AAED,MAAI,cAAc,UAAU,EAC1B,QAAO,aAAa,IAAI;AAG1B,SACE,oBAAC,MAAD;GAAI,WAAU;aACX,aAAa,KACX,OAAO,UACN,OAAO,WAAW,oBAAC,MAAD,YAAiB,MAAM,SAAa,EAA3B,MAA2B,CACzD;GACE;IAEN,CAAC,UAAU,OAAO,CAAC;AAEtB,KAAI,CAAC,QACH,QAAO;AAGT,QACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,WAAW,GAAG,wCAAwC,UAAU;EAChE,GAAI;YAEH;EACG"}
|
package/dist/react/ui/form.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as react2 from "react";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime135 from "react/jsx-runtime";
|
|
3
3
|
import { Slot } from "@radix-ui/react-slot";
|
|
4
4
|
import * as LabelPrimitive from "@radix-ui/react-label";
|
|
5
5
|
import * as react_hook_form0 from "react-hook-form";
|
|
@@ -11,7 +11,7 @@ declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransfor
|
|
|
11
11
|
/** Controlled field component for react-hook-form integration */
|
|
12
12
|
declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({
|
|
13
13
|
...props
|
|
14
|
-
}: ControllerProps<TFieldValues, TName>) =>
|
|
14
|
+
}: ControllerProps<TFieldValues, TName>) => react_jsx_runtime135.JSX.Element;
|
|
15
15
|
declare const useFormField: () => {
|
|
16
16
|
invalid: boolean;
|
|
17
17
|
isDirty: boolean;
|
|
@@ -28,26 +28,26 @@ declare const useFormField: () => {
|
|
|
28
28
|
declare function FormItem({
|
|
29
29
|
className,
|
|
30
30
|
...props
|
|
31
|
-
}: react2.ComponentProps<"div">):
|
|
31
|
+
}: react2.ComponentProps<"div">): react_jsx_runtime135.JSX.Element;
|
|
32
32
|
/** Label for a form field with error state styling */
|
|
33
33
|
declare function FormLabel({
|
|
34
34
|
className,
|
|
35
35
|
...props
|
|
36
|
-
}: react2.ComponentProps<typeof LabelPrimitive.Root>):
|
|
36
|
+
}: react2.ComponentProps<typeof LabelPrimitive.Root>): react_jsx_runtime135.JSX.Element;
|
|
37
37
|
/** Wrapper for form control elements with accessibility attributes */
|
|
38
38
|
declare function FormControl({
|
|
39
39
|
...props
|
|
40
|
-
}: react2.ComponentProps<typeof Slot>):
|
|
40
|
+
}: react2.ComponentProps<typeof Slot>): react_jsx_runtime135.JSX.Element;
|
|
41
41
|
/** Helper text providing guidance for a form field */
|
|
42
42
|
declare function FormDescription({
|
|
43
43
|
className,
|
|
44
44
|
...props
|
|
45
|
-
}: react2.ComponentProps<"p">):
|
|
45
|
+
}: react2.ComponentProps<"p">): react_jsx_runtime135.JSX.Element;
|
|
46
46
|
/** Validation error message for a form field */
|
|
47
47
|
declare function FormMessage({
|
|
48
48
|
className,
|
|
49
49
|
...props
|
|
50
|
-
}: react2.ComponentProps<"p">):
|
|
50
|
+
}: react2.ComponentProps<"p">): react_jsx_runtime135.JSX.Element | null;
|
|
51
51
|
//#endregion
|
|
52
52
|
export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };
|
|
53
53
|
//# sourceMappingURL=form.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form.js","names":["React"],"sources":["../../../src/react/ui/form.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport type * as LabelPrimitive from \"@radix-ui/react-label\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n Controller,\n FormProvider,\n useFormContext,\n useFormState,\n type ControllerProps,\n type FieldPath,\n type FieldValues,\n} from \"react-hook-form\";\n\nimport { cn } from \"../lib/utils\";\nimport { Label } from \"./label\";\n\n/** Form context provider using react-hook-form */\nconst Form = FormProvider;\n\ntype FormFieldContextValue<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = {\n name: TName;\n};\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n {} as FormFieldContextValue,\n);\n\n/** Controlled field component for react-hook-form integration */\nconst FormField = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n ...props\n}: ControllerProps<TFieldValues, TName>) => {\n return (\n <FormFieldContext.Provider value={{ name: props.name }}>\n <Controller {...props} />\n </FormFieldContext.Provider>\n );\n};\n\nconst useFormField = () => {\n const fieldContext = React.useContext(FormFieldContext);\n const itemContext = React.useContext(FormItemContext);\n const { getFieldState } = useFormContext();\n const formState = useFormState({ name: fieldContext.name });\n const fieldState = getFieldState(fieldContext.name, formState);\n\n if (!fieldContext) {\n throw new Error(\"useFormField should be used within <FormField>\");\n }\n\n const { id } = itemContext;\n\n return {\n id,\n name: fieldContext.name,\n formItemId: `${id}-form-item`,\n formDescriptionId: `${id}-form-item-description`,\n formMessageId: `${id}-form-item-message`,\n ...fieldState,\n };\n};\n\ntype FormItemContextValue = {\n id: string;\n};\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n {} as FormItemContextValue,\n);\n\n/** Container for a single form field with label and messages */\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\n const id = React.useId();\n\n return (\n <FormItemContext.Provider value={{ id }}>\n <div\n data-slot=\"form-item\"\n className={cn(\"grid gap-2\", className)}\n {...props}\n />\n </FormItemContext.Provider>\n );\n}\n\n/** Label for a form field with error state styling */\nfunction FormLabel({\n className,\n ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n const { error, formItemId } = useFormField();\n\n return (\n <Label\n data-slot=\"form-label\"\n data-error={!!error}\n className={cn(\"data-[error=true]:text-destructive\", className)}\n htmlFor={formItemId}\n {...props}\n />\n );\n}\n\n/** Wrapper for form control elements with accessibility attributes */\nfunction FormControl({ ...props }: React.ComponentProps<typeof Slot>) {\n const { error, formItemId, formDescriptionId, formMessageId } =\n useFormField();\n\n return (\n <Slot\n data-slot=\"form-control\"\n id={formItemId}\n aria-describedby={\n !error\n ? `${formDescriptionId}`\n : `${formDescriptionId} ${formMessageId}`\n }\n aria-invalid={!!error}\n {...props}\n />\n );\n}\n\n/** Helper text providing guidance for a form field */\nfunction FormDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n const { formDescriptionId } = useFormField();\n\n return (\n <p\n data-slot=\"form-description\"\n id={formDescriptionId}\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n );\n}\n\n/** Validation error message for a form field */\nfunction FormMessage({ className, ...props }: React.ComponentProps<\"p\">) {\n const { error, formMessageId } = useFormField();\n const body = error ? String(error?.message ?? \"\") : props.children;\n\n if (!body) {\n return null;\n }\n\n return (\n <p\n data-slot=\"form-message\"\n id={formMessageId}\n className={cn(\"text-destructive text-sm\", className)}\n {...props}\n >\n {body}\n </p>\n );\n}\n\nexport {\n useFormField,\n Form,\n FormItem,\n FormLabel,\n FormControl,\n FormDescription,\n FormMessage,\n FormField,\n};\n"],"mappings":";;;;;;;;;;;AAmBA,MAAM,OAAO;AASb,MAAM,mBAAmBA,QAAM,cAC7B,EAAE,CACH;;AAGD,MAAM,aAGJ,EACA,GAAG,YACuC;AAC1C,QACE,oBAAC,iBAAiB;
|
|
1
|
+
{"version":3,"file":"form.js","names":["React"],"sources":["../../../src/react/ui/form.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport type * as LabelPrimitive from \"@radix-ui/react-label\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n Controller,\n FormProvider,\n useFormContext,\n useFormState,\n type ControllerProps,\n type FieldPath,\n type FieldValues,\n} from \"react-hook-form\";\n\nimport { cn } from \"../lib/utils\";\nimport { Label } from \"./label\";\n\n/** Form context provider using react-hook-form */\nconst Form = FormProvider;\n\ntype FormFieldContextValue<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = {\n name: TName;\n};\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n {} as FormFieldContextValue,\n);\n\n/** Controlled field component for react-hook-form integration */\nconst FormField = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n ...props\n}: ControllerProps<TFieldValues, TName>) => {\n return (\n <FormFieldContext.Provider value={{ name: props.name }}>\n <Controller {...props} />\n </FormFieldContext.Provider>\n );\n};\n\nconst useFormField = () => {\n const fieldContext = React.useContext(FormFieldContext);\n const itemContext = React.useContext(FormItemContext);\n const { getFieldState } = useFormContext();\n const formState = useFormState({ name: fieldContext.name });\n const fieldState = getFieldState(fieldContext.name, formState);\n\n if (!fieldContext) {\n throw new Error(\"useFormField should be used within <FormField>\");\n }\n\n const { id } = itemContext;\n\n return {\n id,\n name: fieldContext.name,\n formItemId: `${id}-form-item`,\n formDescriptionId: `${id}-form-item-description`,\n formMessageId: `${id}-form-item-message`,\n ...fieldState,\n };\n};\n\ntype FormItemContextValue = {\n id: string;\n};\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n {} as FormItemContextValue,\n);\n\n/** Container for a single form field with label and messages */\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\n const id = React.useId();\n\n return (\n <FormItemContext.Provider value={{ id }}>\n <div\n data-slot=\"form-item\"\n className={cn(\"grid gap-2\", className)}\n {...props}\n />\n </FormItemContext.Provider>\n );\n}\n\n/** Label for a form field with error state styling */\nfunction FormLabel({\n className,\n ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n const { error, formItemId } = useFormField();\n\n return (\n <Label\n data-slot=\"form-label\"\n data-error={!!error}\n className={cn(\"data-[error=true]:text-destructive\", className)}\n htmlFor={formItemId}\n {...props}\n />\n );\n}\n\n/** Wrapper for form control elements with accessibility attributes */\nfunction FormControl({ ...props }: React.ComponentProps<typeof Slot>) {\n const { error, formItemId, formDescriptionId, formMessageId } =\n useFormField();\n\n return (\n <Slot\n data-slot=\"form-control\"\n id={formItemId}\n aria-describedby={\n !error\n ? `${formDescriptionId}`\n : `${formDescriptionId} ${formMessageId}`\n }\n aria-invalid={!!error}\n {...props}\n />\n );\n}\n\n/** Helper text providing guidance for a form field */\nfunction FormDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n const { formDescriptionId } = useFormField();\n\n return (\n <p\n data-slot=\"form-description\"\n id={formDescriptionId}\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n );\n}\n\n/** Validation error message for a form field */\nfunction FormMessage({ className, ...props }: React.ComponentProps<\"p\">) {\n const { error, formMessageId } = useFormField();\n const body = error ? String(error?.message ?? \"\") : props.children;\n\n if (!body) {\n return null;\n }\n\n return (\n <p\n data-slot=\"form-message\"\n id={formMessageId}\n className={cn(\"text-destructive text-sm\", className)}\n {...props}\n >\n {body}\n </p>\n );\n}\n\nexport {\n useFormField,\n Form,\n FormItem,\n FormLabel,\n FormControl,\n FormDescription,\n FormMessage,\n FormField,\n};\n"],"mappings":";;;;;;;;;;;AAmBA,MAAM,OAAO;AASb,MAAM,mBAAmBA,QAAM,cAC7B,EAAE,CACH;;AAGD,MAAM,aAGJ,EACA,GAAG,YACuC;AAC1C,QACE,oBAAC,iBAAiB,UAAlB;EAA2B,OAAO,EAAE,MAAM,MAAM,MAAM;YACpD,oBAAC,YAAD,EAAY,GAAI,OAAS;EACC;;AAIhC,MAAM,qBAAqB;CACzB,MAAM,eAAeA,QAAM,WAAW,iBAAiB;CACvD,MAAM,cAAcA,QAAM,WAAW,gBAAgB;CACrD,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,YAAY,aAAa,EAAE,MAAM,aAAa,MAAM,CAAC;CAC3D,MAAM,aAAa,cAAc,aAAa,MAAM,UAAU;AAE9D,KAAI,CAAC,aACH,OAAM,IAAI,MAAM,iDAAiD;CAGnE,MAAM,EAAE,OAAO;AAEf,QAAO;EACL;EACA,MAAM,aAAa;EACnB,YAAY,GAAG,GAAG;EAClB,mBAAmB,GAAG,GAAG;EACzB,eAAe,GAAG,GAAG;EACrB,GAAG;EACJ;;AAOH,MAAM,kBAAkBA,QAAM,cAC5B,EAAE,CACH;;AAGD,SAAS,SAAS,EAAE,WAAW,GAAG,SAAsC;CACtE,MAAM,KAAKA,QAAM,OAAO;AAExB,QACE,oBAAC,gBAAgB,UAAjB;EAA0B,OAAO,EAAE,IAAI;YACrC,oBAAC,OAAD;GACE,aAAU;GACV,WAAW,GAAG,cAAc,UAAU;GACtC,GAAI;GACJ;EACuB;;;AAK/B,SAAS,UAAU,EACjB,WACA,GAAG,SACgD;CACnD,MAAM,EAAE,OAAO,eAAe,cAAc;AAE5C,QACE,oBAAC,OAAD;EACE,aAAU;EACV,cAAY,CAAC,CAAC;EACd,WAAW,GAAG,sCAAsC,UAAU;EAC9D,SAAS;EACT,GAAI;EACJ;;;AAKN,SAAS,YAAY,EAAE,GAAG,SAA4C;CACpE,MAAM,EAAE,OAAO,YAAY,mBAAmB,kBAC5C,cAAc;AAEhB,QACE,oBAAC,MAAD;EACE,aAAU;EACV,IAAI;EACJ,oBACE,CAAC,QACG,GAAG,sBACH,GAAG,kBAAkB,GAAG;EAE9B,gBAAc,CAAC,CAAC;EAChB,GAAI;EACJ;;;AAKN,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAoC;CAC3E,MAAM,EAAE,sBAAsB,cAAc;AAE5C,QACE,oBAAC,KAAD;EACE,aAAU;EACV,IAAI;EACJ,WAAW,GAAG,iCAAiC,UAAU;EACzD,GAAI;EACJ;;;AAKN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAoC;CACvE,MAAM,EAAE,OAAO,kBAAkB,cAAc;CAC/C,MAAM,OAAO,QAAQ,OAAO,OAAO,WAAW,GAAG,GAAG,MAAM;AAE1D,KAAI,CAAC,KACH,QAAO;AAGT,QACE,oBAAC,KAAD;EACE,aAAU;EACV,IAAI;EACJ,WAAW,GAAG,4BAA4B,UAAU;EACpD,GAAI;YAEH;EACC"}
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import * as React$1 from "react";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime141 from "react/jsx-runtime";
|
|
3
3
|
import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
|
|
4
4
|
|
|
5
5
|
//#region src/react/ui/hover-card.d.ts
|
|
6
6
|
/** Content card that appears when hovering over an element */
|
|
7
7
|
declare function HoverCard({
|
|
8
8
|
...props
|
|
9
|
-
}: React$1.ComponentProps<typeof HoverCardPrimitive.Root>):
|
|
9
|
+
}: React$1.ComponentProps<typeof HoverCardPrimitive.Root>): react_jsx_runtime141.JSX.Element;
|
|
10
10
|
declare function HoverCardTrigger({
|
|
11
11
|
...props
|
|
12
|
-
}: React$1.ComponentProps<typeof HoverCardPrimitive.Trigger>):
|
|
12
|
+
}: React$1.ComponentProps<typeof HoverCardPrimitive.Trigger>): react_jsx_runtime141.JSX.Element;
|
|
13
13
|
declare function HoverCardContent({
|
|
14
14
|
className,
|
|
15
15
|
align,
|
|
16
16
|
sideOffset,
|
|
17
17
|
...props
|
|
18
|
-
}: React$1.ComponentProps<typeof HoverCardPrimitive.Content>):
|
|
18
|
+
}: React$1.ComponentProps<typeof HoverCardPrimitive.Content>): react_jsx_runtime141.JSX.Element;
|
|
19
19
|
//#endregion
|
|
20
20
|
export { HoverCard, HoverCardContent, HoverCardTrigger };
|
|
21
21
|
//# sourceMappingURL=hover-card.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hover-card.js","names":[],"sources":["../../../src/react/ui/hover-card.tsx"],"sourcesContent":["\"use client\";\n\nimport type * as React from \"react\";\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\";\n\nimport { cn } from \"../lib/utils\";\nimport { useResolvedPortalContainer } from \"../portal-container-context\";\n\n/** Content card that appears when hovering over an element */\nfunction HoverCard({\n ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Root>) {\n return <HoverCardPrimitive.Root data-slot=\"hover-card\" {...props} />;\n}\n\nfunction HoverCardTrigger({\n ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Trigger>) {\n return (\n <HoverCardPrimitive.Trigger data-slot=\"hover-card-trigger\" {...props} />\n );\n}\n\nfunction HoverCardContent({\n className,\n align = \"center\",\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Content>) {\n return (\n <HoverCardPrimitive.Portal\n data-slot=\"hover-card-portal\"\n container={useResolvedPortalContainer()}\n >\n <HoverCardPrimitive.Content\n data-slot=\"hover-card-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden\",\n className,\n )}\n {...props}\n />\n </HoverCardPrimitive.Portal>\n );\n}\n\nexport { HoverCard, HoverCardTrigger, HoverCardContent };\n"],"mappings":";;;;;;;;;AASA,SAAS,UAAU,EACjB,GAAG,SACoD;AACvD,QAAO,oBAAC,mBAAmB;
|
|
1
|
+
{"version":3,"file":"hover-card.js","names":[],"sources":["../../../src/react/ui/hover-card.tsx"],"sourcesContent":["\"use client\";\n\nimport type * as React from \"react\";\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\";\n\nimport { cn } from \"../lib/utils\";\nimport { useResolvedPortalContainer } from \"../portal-container-context\";\n\n/** Content card that appears when hovering over an element */\nfunction HoverCard({\n ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Root>) {\n return <HoverCardPrimitive.Root data-slot=\"hover-card\" {...props} />;\n}\n\nfunction HoverCardTrigger({\n ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Trigger>) {\n return (\n <HoverCardPrimitive.Trigger data-slot=\"hover-card-trigger\" {...props} />\n );\n}\n\nfunction HoverCardContent({\n className,\n align = \"center\",\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof HoverCardPrimitive.Content>) {\n return (\n <HoverCardPrimitive.Portal\n data-slot=\"hover-card-portal\"\n container={useResolvedPortalContainer()}\n >\n <HoverCardPrimitive.Content\n data-slot=\"hover-card-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden\",\n className,\n )}\n {...props}\n />\n </HoverCardPrimitive.Portal>\n );\n}\n\nexport { HoverCard, HoverCardTrigger, HoverCardContent };\n"],"mappings":";;;;;;;;;AASA,SAAS,UAAU,EACjB,GAAG,SACoD;AACvD,QAAO,oBAAC,mBAAmB,MAApB;EAAyB,aAAU;EAAa,GAAI;EAAS;;AAGtE,SAAS,iBAAiB,EACxB,GAAG,SACuD;AAC1D,QACE,oBAAC,mBAAmB,SAApB;EAA4B,aAAU;EAAqB,GAAI;EAAS;;AAI5E,SAAS,iBAAiB,EACxB,WACA,QAAQ,UACR,aAAa,GACb,GAAG,SACuD;AAC1D,QACE,oBAAC,mBAAmB,QAApB;EACE,aAAU;EACV,WAAW,4BAA4B;YAEvC,oBAAC,mBAAmB,SAApB;GACE,aAAU;GACH;GACK;GACZ,WAAW,GACT,qeACA,UACD;GACD,GAAI;GACJ;EACwB"}
|
package/dist/react/ui/index.js
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import { Button, buttonVariants } from "./button.js";
|
|
2
|
+
import { ScrollArea, ScrollBar } from "./scroll-area.js";
|
|
3
|
+
import { Skeleton } from "./skeleton.js";
|
|
4
|
+
import { Spinner } from "./spinner.js";
|
|
5
|
+
import { Avatar, AvatarFallback, AvatarImage } from "./avatar.js";
|
|
6
|
+
import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "./card.js";
|
|
2
7
|
import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "./dropdown-menu.js";
|
|
3
8
|
import { Input } from "./input.js";
|
|
4
9
|
import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from "./select.js";
|
|
@@ -8,13 +13,11 @@ import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "./
|
|
|
8
13
|
import { Alert, AlertDescription, AlertTitle } from "./alert.js";
|
|
9
14
|
import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger } from "./alert-dialog.js";
|
|
10
15
|
import { AspectRatio } from "./aspect-ratio.js";
|
|
11
|
-
import { Avatar, AvatarFallback, AvatarImage } from "./avatar.js";
|
|
12
16
|
import { Badge, badgeVariants } from "./badge.js";
|
|
13
17
|
import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "./breadcrumb.js";
|
|
14
18
|
import { Separator } from "./separator.js";
|
|
15
19
|
import { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants } from "./button-group.js";
|
|
16
20
|
import { Calendar, CalendarDayButton } from "./calendar.js";
|
|
17
|
-
import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "./card.js";
|
|
18
21
|
import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "./carousel.js";
|
|
19
22
|
import { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent } from "./chart.js";
|
|
20
23
|
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./collapsible.js";
|
|
@@ -39,14 +42,11 @@ import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger } from "./popove
|
|
|
39
42
|
import { Progress } from "./progress.js";
|
|
40
43
|
import { RadioGroup, RadioGroupItem } from "./radio-group.js";
|
|
41
44
|
import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "./resizable.js";
|
|
42
|
-
import { ScrollArea, ScrollBar } from "./scroll-area.js";
|
|
43
45
|
import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "./sheet.js";
|
|
44
|
-
import { Skeleton } from "./skeleton.js";
|
|
45
46
|
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./tooltip.js";
|
|
46
47
|
import { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar } from "./sidebar.js";
|
|
47
48
|
import { Slider } from "./slider.js";
|
|
48
49
|
import { Toaster } from "./sonner.js";
|
|
49
|
-
import { Spinner } from "./spinner.js";
|
|
50
50
|
import { Switch } from "./switch.js";
|
|
51
51
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "./tabs.js";
|
|
52
52
|
import { Toggle, toggleVariants } from "./toggle.js";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Button } from "./button.js";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
|
-
import * as
|
|
3
|
+
import * as react_jsx_runtime145 from "react/jsx-runtime";
|
|
4
4
|
import { VariantProps } from "class-variance-authority";
|
|
5
5
|
import * as class_variance_authority_types5 from "class-variance-authority/types";
|
|
6
6
|
|
|
@@ -9,7 +9,7 @@ import * as class_variance_authority_types5 from "class-variance-authority/types
|
|
|
9
9
|
declare function InputGroup({
|
|
10
10
|
className,
|
|
11
11
|
...props
|
|
12
|
-
}: React$1.ComponentProps<"div">):
|
|
12
|
+
}: React$1.ComponentProps<"div">): react_jsx_runtime145.JSX.Element;
|
|
13
13
|
declare const inputGroupAddonVariants: (props?: ({
|
|
14
14
|
align?: "inline-start" | "inline-end" | "block-start" | "block-end" | null | undefined;
|
|
15
15
|
} & class_variance_authority_types5.ClassProp) | undefined) => string;
|
|
@@ -18,7 +18,7 @@ declare function InputGroupAddon({
|
|
|
18
18
|
className,
|
|
19
19
|
align,
|
|
20
20
|
...props
|
|
21
|
-
}: React$1.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>):
|
|
21
|
+
}: React$1.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>): react_jsx_runtime145.JSX.Element;
|
|
22
22
|
declare const inputGroupButtonVariants: (props?: ({
|
|
23
23
|
size?: "sm" | "icon-sm" | "xs" | "icon-xs" | null | undefined;
|
|
24
24
|
} & class_variance_authority_types5.ClassProp) | undefined) => string;
|
|
@@ -29,22 +29,22 @@ declare function InputGroupButton({
|
|
|
29
29
|
variant,
|
|
30
30
|
size,
|
|
31
31
|
...props
|
|
32
|
-
}: Omit<React$1.ComponentProps<typeof Button>, "size"> & VariantProps<typeof inputGroupButtonVariants>):
|
|
32
|
+
}: Omit<React$1.ComponentProps<typeof Button>, "size"> & VariantProps<typeof inputGroupButtonVariants>): react_jsx_runtime145.JSX.Element;
|
|
33
33
|
/** Static text or icon displayed within an input group */
|
|
34
34
|
declare function InputGroupText({
|
|
35
35
|
className,
|
|
36
36
|
...props
|
|
37
|
-
}: React$1.ComponentProps<"span">):
|
|
37
|
+
}: React$1.ComponentProps<"span">): react_jsx_runtime145.JSX.Element;
|
|
38
38
|
/** Text input styled for use within an input group */
|
|
39
39
|
declare function InputGroupInput({
|
|
40
40
|
className,
|
|
41
41
|
...props
|
|
42
|
-
}: React$1.ComponentProps<"input">):
|
|
42
|
+
}: React$1.ComponentProps<"input">): react_jsx_runtime145.JSX.Element;
|
|
43
43
|
/** Textarea styled for use within an input group */
|
|
44
44
|
declare function InputGroupTextarea({
|
|
45
45
|
className,
|
|
46
46
|
...props
|
|
47
|
-
}: React$1.ComponentProps<"textarea">):
|
|
47
|
+
}: React$1.ComponentProps<"textarea">): react_jsx_runtime145.JSX.Element;
|
|
48
48
|
//#endregion
|
|
49
49
|
export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
|
|
50
50
|
//# sourceMappingURL=input-group.d.ts.map
|