@konopskidev/ui 0.1.1 → 0.2.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/README.md +102 -13
- package/dist/chunks/rolldown-runtime-CmQyd0Gu.cjs +27 -0
- package/dist/components/ui/accordion.cjs +62 -0
- package/dist/components/ui/accordion.cjs.map +1 -0
- package/dist/components/ui/accordion.d.cts +7 -0
- package/dist/components/ui/accordion.d.ts.map +1 -1
- package/dist/components/ui/accordion.js +9 -8
- package/dist/components/ui/accordion.js.map +1 -1
- package/dist/components/ui/alert-dialog.cjs +116 -0
- package/dist/components/ui/alert-dialog.cjs.map +1 -0
- package/dist/components/ui/alert-dialog.d.cts +18 -0
- package/dist/components/ui/alert-dialog.d.ts.map +1 -1
- package/dist/components/ui/alert-dialog.js +13 -12
- package/dist/components/ui/alert-dialog.js.map +1 -1
- package/dist/components/ui/alert.cjs +49 -0
- package/dist/components/ui/alert.cjs.map +1 -0
- package/dist/components/ui/alert.d.cts +10 -0
- package/dist/components/ui/aspect-ratio.cjs +14 -0
- package/dist/components/ui/aspect-ratio.cjs.map +1 -0
- package/dist/components/ui/aspect-ratio.d.cts +3 -0
- package/dist/components/ui/aspect-ratio.js +4 -5
- package/dist/components/ui/aspect-ratio.js.map +1 -1
- package/dist/components/ui/attachment.cjs +113 -0
- package/dist/components/ui/attachment.cjs.map +1 -0
- package/dist/components/ui/attachment.d.cts +24 -0
- package/dist/components/ui/avatar.cjs +60 -0
- package/dist/components/ui/avatar.cjs.map +1 -0
- package/dist/components/ui/avatar.d.cts +11 -0
- package/dist/components/ui/avatar.d.ts.map +1 -1
- package/dist/components/ui/avatar.js +7 -6
- package/dist/components/ui/avatar.js.map +1 -1
- package/dist/components/ui/badge.cjs +33 -0
- package/dist/components/ui/badge.cjs.map +1 -0
- package/dist/components/ui/badge.d.cts +9 -0
- package/dist/components/ui/badge.d.ts +1 -1
- package/dist/components/ui/badge.d.ts.map +1 -1
- package/dist/components/ui/badge.js +1 -0
- package/dist/components/ui/badge.js.map +1 -1
- package/dist/components/ui/breadcrumb.cjs +81 -0
- package/dist/components/ui/breadcrumb.cjs.map +1 -0
- package/dist/components/ui/breadcrumb.d.cts +11 -0
- package/dist/components/ui/bubble.cjs +79 -0
- package/dist/components/ui/bubble.cjs.map +1 -0
- package/dist/components/ui/bubble.d.cts +17 -0
- package/dist/components/ui/button-group.cjs +43 -0
- package/dist/components/ui/button-group.cjs.map +1 -0
- package/dist/components/ui/button-group.d.cts +11 -0
- package/dist/components/ui/button.cjs +64 -0
- package/dist/components/ui/button.cjs.map +1 -0
- package/dist/components/ui/button.d.cts +21 -0
- package/dist/components/ui/calendar.cjs +114 -0
- package/dist/components/ui/calendar.cjs.map +1 -0
- package/dist/components/ui/calendar.d.cts +10 -0
- package/dist/components/ui/calendar.js +0 -1
- package/dist/components/ui/calendar.js.map +1 -1
- package/dist/components/ui/card.cjs +80 -0
- package/dist/components/ui/card.cjs.map +1 -0
- package/dist/components/ui/card.d.cts +33 -0
- package/dist/components/ui/card.d.ts +15 -7
- package/dist/components/ui/card.d.ts.map +1 -1
- package/dist/components/ui/card.js +6 -12
- package/dist/components/ui/card.js.map +1 -1
- package/dist/components/ui/carousel.cjs +142 -0
- package/dist/components/ui/carousel.cjs.map +1 -0
- package/dist/components/ui/carousel.d.cts +28 -0
- package/dist/components/ui/carousel.d.ts +1 -1
- package/dist/components/ui/carousel.d.ts.map +1 -1
- package/dist/components/ui/carousel.js +1 -0
- package/dist/components/ui/carousel.js.map +1 -1
- package/dist/components/ui/chart.cjs +159 -0
- package/dist/components/ui/chart.cjs.map +1 -0
- package/dist/components/ui/chart.d.cts +44 -0
- package/dist/components/ui/chart.js +0 -1
- package/dist/components/ui/chart.js.map +1 -1
- package/dist/components/ui/checkbox.cjs +25 -0
- package/dist/components/ui/checkbox.cjs.map +1 -0
- package/dist/components/ui/checkbox.d.cts +4 -0
- package/dist/components/ui/checkbox.d.ts.map +1 -1
- package/dist/components/ui/checkbox.js +6 -5
- package/dist/components/ui/checkbox.js.map +1 -1
- package/dist/components/ui/code-block.cjs +134 -0
- package/dist/components/ui/code-block.cjs.map +1 -0
- package/dist/components/ui/code-block.d.cts +26 -0
- package/dist/components/ui/code-block.d.ts.map +1 -1
- package/dist/components/ui/code-block.js +1 -0
- package/dist/components/ui/code-block.js.map +1 -1
- package/dist/components/ui/collapsible.cjs +28 -0
- package/dist/components/ui/collapsible.cjs.map +1 -0
- package/dist/components/ui/collapsible.d.cts +5 -0
- package/dist/components/ui/collapsible.js +6 -7
- package/dist/components/ui/collapsible.js.map +1 -1
- package/dist/components/ui/combobox.cjs +193 -0
- package/dist/components/ui/combobox.cjs.map +1 -0
- package/dist/components/ui/combobox.d.cts +24 -0
- package/dist/components/ui/combobox.d.ts.map +1 -1
- package/dist/components/ui/combobox.js +22 -21
- package/dist/components/ui/combobox.js.map +1 -1
- package/dist/components/ui/command.cjs +99 -0
- package/dist/components/ui/command.cjs.map +1 -0
- package/dist/components/ui/command.d.cts +18 -0
- package/dist/components/ui/command.d.ts.map +1 -1
- package/dist/components/ui/command.js +10 -12
- package/dist/components/ui/command.js.map +1 -1
- package/dist/components/ui/context-menu.cjs +143 -0
- package/dist/components/ui/context-menu.cjs.map +1 -0
- package/dist/components/ui/context-menu.d.cts +31 -0
- package/dist/components/ui/context-menu.d.ts.map +1 -1
- package/dist/components/ui/context-menu.js +20 -19
- package/dist/components/ui/context-menu.js.map +1 -1
- package/dist/components/ui/dialog.cjs +148 -0
- package/dist/components/ui/dialog.cjs.map +1 -0
- package/dist/components/ui/dialog.d.cts +55 -0
- package/dist/components/ui/dialog.d.ts +41 -3
- package/dist/components/ui/dialog.d.ts.map +1 -1
- package/dist/components/ui/dialog.js +64 -27
- package/dist/components/ui/dialog.js.map +1 -1
- package/dist/components/ui/direction.cjs +19 -0
- package/dist/components/ui/direction.cjs.map +1 -0
- package/dist/components/ui/direction.d.cts +11 -0
- package/dist/components/ui/direction.d.ts +1 -1
- package/dist/components/ui/direction.d.ts.map +1 -1
- package/dist/components/ui/direction.js +0 -1
- package/dist/components/ui/direction.js.map +1 -1
- package/dist/components/ui/drawer.cjs +90 -0
- package/dist/components/ui/drawer.cjs.map +1 -0
- package/dist/components/ui/drawer.d.cts +13 -0
- package/dist/components/ui/drawer.js +11 -11
- package/dist/components/ui/drawer.js.map +1 -1
- package/dist/components/ui/dropdown-menu.cjs +146 -0
- package/dist/components/ui/dropdown-menu.cjs.map +1 -0
- package/dist/components/ui/dropdown-menu.d.cts +29 -0
- package/dist/components/ui/dropdown-menu.js +19 -20
- package/dist/components/ui/dropdown-menu.js.map +1 -1
- package/dist/components/ui/empty.cjs +66 -0
- package/dist/components/ui/empty.cjs.map +1 -0
- package/dist/components/ui/empty.d.cts +11 -0
- package/dist/components/ui/field.cjs +121 -0
- package/dist/components/ui/field.cjs.map +1 -0
- package/dist/components/ui/field.d.cts +24 -0
- package/dist/components/ui/field.js +0 -1
- package/dist/components/ui/field.js.map +1 -1
- package/dist/components/ui/hover-card.cjs +38 -0
- package/dist/components/ui/hover-card.cjs.map +1 -0
- package/dist/components/ui/hover-card.d.cts +6 -0
- package/dist/components/ui/hover-card.d.ts.map +1 -1
- package/dist/components/ui/hover-card.js +8 -7
- package/dist/components/ui/hover-card.js.map +1 -1
- package/dist/components/ui/input-group.cjs +87 -0
- package/dist/components/ui/input-group.cjs.map +1 -0
- package/dist/components/ui/input-group.d.cts +16 -0
- package/dist/components/ui/input-otp.cjs +54 -0
- package/dist/components/ui/input-otp.cjs.map +1 -0
- package/dist/components/ui/input-otp.d.cts +11 -0
- package/dist/components/ui/input-otp.js +0 -1
- package/dist/components/ui/input-otp.js.map +1 -1
- package/dist/components/ui/input.cjs +28 -0
- package/dist/components/ui/input.cjs.map +1 -0
- package/dist/components/ui/input.d.cts +10 -0
- package/dist/components/ui/item.cjs +133 -0
- package/dist/components/ui/item.cjs.map +1 -0
- package/dist/components/ui/item.d.cts +23 -0
- package/dist/components/ui/kbd.cjs +22 -0
- package/dist/components/ui/kbd.cjs.map +1 -0
- package/dist/components/ui/kbd.d.cts +3 -0
- package/dist/components/ui/label.cjs +19 -0
- package/dist/components/ui/label.cjs.map +1 -0
- package/dist/components/ui/label.d.cts +4 -0
- package/dist/components/ui/label.d.ts.map +1 -1
- package/dist/components/ui/label.js +5 -4
- package/dist/components/ui/label.js.map +1 -1
- package/dist/components/ui/marker.cjs +46 -0
- package/dist/components/ui/marker.cjs.map +1 -0
- package/dist/components/ui/marker.d.cts +11 -0
- package/dist/components/ui/menubar.cjs +154 -0
- package/dist/components/ui/menubar.cjs.map +1 -0
- package/dist/components/ui/menubar.d.cts +30 -0
- package/dist/components/ui/menubar.js +20 -21
- package/dist/components/ui/menubar.js.map +1 -1
- package/dist/components/ui/message-scroller.cjs +87 -0
- package/dist/components/ui/message-scroller.cjs.map +1 -0
- package/dist/components/ui/message-scroller.d.cts +10 -0
- package/dist/components/ui/message-scroller.js +9 -9
- package/dist/components/ui/message-scroller.js.map +1 -1
- package/dist/components/ui/message.cjs +58 -0
- package/dist/components/ui/message.cjs.map +1 -0
- package/dist/components/ui/message.d.cts +10 -0
- package/dist/components/ui/native-select.cjs +44 -0
- package/dist/components/ui/native-select.cjs.map +1 -0
- package/dist/components/ui/native-select.d.cts +8 -0
- package/dist/components/ui/native-select.d.ts +1 -1
- package/dist/components/ui/native-select.d.ts.map +1 -1
- package/dist/components/ui/native-select.js.map +1 -1
- package/dist/components/ui/navigation-menu.cjs +93 -0
- package/dist/components/ui/navigation-menu.cjs.map +1 -0
- package/dist/components/ui/navigation-menu.d.cts +14 -0
- package/dist/components/ui/navigation-menu.d.ts.map +1 -1
- package/dist/components/ui/navigation-menu.js +12 -11
- package/dist/components/ui/navigation-menu.js.map +1 -1
- package/dist/components/ui/pagination.cjs +90 -0
- package/dist/components/ui/pagination.cjs.map +1 -0
- package/dist/components/ui/pagination.d.cts +17 -0
- package/dist/components/ui/pagination.d.ts +1 -1
- package/dist/components/ui/pagination.d.ts.map +1 -1
- package/dist/components/ui/pagination.js.map +1 -1
- package/dist/components/ui/popover.cjs +66 -0
- package/dist/components/ui/popover.cjs.map +1 -0
- package/dist/components/ui/popover.d.cts +10 -0
- package/dist/components/ui/popover.d.ts.map +1 -1
- package/dist/components/ui/popover.js +8 -7
- package/dist/components/ui/popover.js.map +1 -1
- package/dist/components/ui/progress.cjs +25 -0
- package/dist/components/ui/progress.cjs.map +1 -0
- package/dist/components/ui/progress.d.cts +4 -0
- package/dist/components/ui/progress.js +5 -6
- package/dist/components/ui/progress.js.map +1 -1
- package/dist/components/ui/questionnaire.cjs +187 -0
- package/dist/components/ui/questionnaire.cjs.map +1 -0
- package/dist/components/ui/questionnaire.d.cts +19 -0
- package/dist/components/ui/questionnaire.d.ts.map +1 -1
- package/dist/components/ui/questionnaire.js +19 -21
- package/dist/components/ui/questionnaire.js.map +1 -1
- package/dist/components/ui/radio-group.cjs +32 -0
- package/dist/components/ui/radio-group.cjs.map +1 -0
- package/dist/components/ui/radio-group.d.cts +5 -0
- package/dist/components/ui/radio-group.d.ts.map +1 -1
- package/dist/components/ui/radio-group.js +7 -6
- package/dist/components/ui/radio-group.js.map +1 -1
- package/dist/components/ui/resizable.cjs +33 -0
- package/dist/components/ui/resizable.cjs.map +1 -0
- package/dist/components/ui/resizable.d.cts +7 -0
- package/dist/components/ui/resizable.d.ts.map +1 -1
- package/dist/components/ui/resizable.js +0 -2
- package/dist/components/ui/resizable.js.map +1 -1
- package/dist/components/ui/scroll-area.cjs +43 -0
- package/dist/components/ui/scroll-area.cjs.map +1 -0
- package/dist/components/ui/scroll-area.d.cts +5 -0
- package/dist/components/ui/scroll-area.d.ts.map +1 -1
- package/dist/components/ui/scroll-area.js +9 -8
- package/dist/components/ui/scroll-area.js.map +1 -1
- package/dist/components/ui/select.cjs +113 -0
- package/dist/components/ui/select.cjs.map +1 -0
- package/dist/components/ui/select.d.cts +15 -0
- package/dist/components/ui/select.js +17 -18
- package/dist/components/ui/select.js.map +1 -1
- package/dist/components/ui/separator.cjs +21 -0
- package/dist/components/ui/separator.cjs.map +1 -0
- package/dist/components/ui/separator.d.cts +4 -0
- package/dist/components/ui/separator.d.ts.map +1 -1
- package/dist/components/ui/separator.js +5 -4
- package/dist/components/ui/separator.js.map +1 -1
- package/dist/components/ui/sheet.cjs +101 -0
- package/dist/components/ui/sheet.cjs.map +1 -0
- package/dist/components/ui/sheet.d.cts +14 -0
- package/dist/components/ui/sheet.d.ts.map +1 -1
- package/dist/components/ui/sheet.js +1 -0
- package/dist/components/ui/sheet.js.map +1 -1
- package/dist/components/ui/sidebar.cjs +405 -0
- package/dist/components/ui/sidebar.cjs.map +1 -0
- package/dist/components/ui/sidebar.d.cts +69 -0
- package/dist/components/ui/sidebar.js +0 -1
- package/dist/components/ui/sidebar.js.map +1 -1
- package/dist/components/ui/skeleton.cjs +14 -0
- package/dist/components/ui/skeleton.cjs.map +1 -0
- package/dist/components/ui/skeleton.d.cts +2 -0
- package/dist/components/ui/slider.cjs +42 -0
- package/dist/components/ui/slider.cjs.map +1 -0
- package/dist/components/ui/slider.d.cts +7 -0
- package/dist/components/ui/slider.js +7 -8
- package/dist/components/ui/slider.js.map +1 -1
- package/dist/components/ui/sonner.cjs +36 -0
- package/dist/components/ui/sonner.cjs.map +1 -0
- package/dist/components/ui/sonner.d.cts +13 -0
- package/dist/components/ui/sonner.d.ts.map +1 -1
- package/dist/components/ui/sonner.js +4 -6
- package/dist/components/ui/sonner.js.map +1 -1
- package/dist/components/ui/spinner.cjs +17 -0
- package/dist/components/ui/spinner.cjs.map +1 -0
- package/dist/components/ui/spinner.d.cts +2 -0
- package/dist/components/ui/switch.cjs +24 -0
- package/dist/components/ui/switch.cjs.map +1 -0
- package/dist/components/ui/switch.d.cts +6 -0
- package/dist/components/ui/switch.js +5 -6
- package/dist/components/ui/switch.js.map +1 -1
- package/dist/components/ui/table.cjs +77 -0
- package/dist/components/ui/table.cjs.map +1 -0
- package/dist/components/ui/table.d.cts +10 -0
- package/dist/components/ui/table.js +2 -2
- package/dist/components/ui/table.js.map +1 -1
- package/dist/components/ui/tabs.cjs +54 -0
- package/dist/components/ui/tabs.cjs.map +1 -0
- package/dist/components/ui/tabs.d.cts +11 -0
- package/dist/components/ui/tabs.js +7 -8
- package/dist/components/ui/tabs.js.map +1 -1
- package/dist/components/ui/textarea.cjs +39 -0
- package/dist/components/ui/textarea.cjs.map +1 -0
- package/dist/components/ui/textarea.d.cts +9 -0
- package/dist/components/ui/textarea.js +0 -1
- package/dist/components/ui/textarea.js.map +1 -1
- package/dist/components/ui/toggle-group.cjs +56 -0
- package/dist/components/ui/toggle-group.cjs.map +1 -0
- package/dist/components/ui/toggle-group.d.cts +10 -0
- package/dist/components/ui/toggle-group.js +5 -6
- package/dist/components/ui/toggle-group.js.map +1 -1
- package/dist/components/ui/toggle.cjs +41 -0
- package/dist/components/ui/toggle.cjs.map +1 -0
- package/dist/components/ui/toggle.d.cts +9 -0
- package/dist/components/ui/toggle.d.ts.map +1 -1
- package/dist/components/ui/toggle.js +5 -4
- package/dist/components/ui/toggle.js.map +1 -1
- package/dist/components/ui/tooltip.cjs +43 -0
- package/dist/components/ui/tooltip.cjs.map +1 -0
- package/dist/components/ui/tooltip.d.cts +7 -0
- package/dist/components/ui/tooltip.js +8 -9
- package/dist/components/ui/tooltip.js.map +1 -1
- package/dist/components/ui/trace.cjs +86 -0
- package/dist/components/ui/trace.cjs.map +1 -0
- package/dist/components/ui/trace.d.cts +18 -0
- package/dist/hooks/use-highlighted-code.d.ts.map +1 -1
- package/dist/hooks/use-highlighted-code.js +56 -0
- package/dist/hooks/use-highlighted-code.js.map +1 -0
- package/dist/hooks/use-mobile.cjs +26 -0
- package/dist/hooks/use-mobile.cjs.map +1 -0
- package/dist/hooks/use-mobile.d.cts +1 -0
- package/dist/hooks/use-mobile.d.ts.map +1 -1
- package/dist/hooks/use-mobile.js +1 -0
- package/dist/hooks/use-mobile.js.map +1 -1
- package/dist/index.cjs +356 -0
- package/dist/index.d.cts +67 -0
- package/dist/index.d.ts +5 -11
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -14
- package/dist/lib/get-placeholder.cjs +13 -0
- package/dist/lib/get-placeholder.cjs.map +1 -0
- package/dist/lib/get-placeholder.d.cts +5 -0
- package/dist/lib/highlighter.js +79 -0
- package/dist/lib/highlighter.js.map +1 -0
- package/dist/lib/utils.cjs +8 -0
- package/dist/lib/utils.d.cts +8 -0
- package/{src → dist}/styles/globals.css +11 -0
- package/{src → dist}/styles/theme.css +2 -0
- package/{src → dist}/styles/tokens.css +8 -0
- package/package.json +114 -30
- /package/{src → dist}/styles/base.css +0 -0
- /package/{src → dist}/styles/prose.css +0 -0
- /package/{src → dist}/styles/utilities.css +0 -0
- /package/{src → dist}/styles/variants.css +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"field.cjs","names":["cva","Label","Separator","useMemo"],"sources":["../../../src/components/ui/field.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from 'cn';\nimport { useMemo } from 'react';\n\nimport { Label } from './label';\nimport { Separator } from './separator';\n\nfunction FieldSet({ className, ...props }: React.ComponentProps<'fieldset'>) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n 'flex flex-col gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3',\n className,\n )}\n {...props}\n />\n );\n}\n\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-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base',\n className,\n )}\n {...props}\n />\n );\n}\n\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-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4',\n className,\n )}\n {...props}\n />\n );\n}\n\nconst fieldVariants = cva('group/field flex w-full gap-2 data-[invalid=true]:text-destructive', {\n variants: {\n orientation: {\n vertical: 'flex-col *:w-full [&>.sr-only]:w-auto',\n horizontal:\n 'flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n responsive:\n 'flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n },\n },\n defaultVariants: {\n orientation: 'vertical',\n },\n});\n\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\nfunction FieldContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"field-content\"\n className={cn('group/field-content flex flex-1 flex-col gap-0.5 leading-snug', className)}\n {...props}\n />\n );\n}\n\nfunction FieldLabel({ className, ...props }: 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 has-data-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-sm has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-muted/50 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-3 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/50 *:data-[slot=field]:p-2.5 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10',\n 'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col',\n className,\n )}\n {...props}\n />\n );\n}\n\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 font-medium group-data-[disabled=true]/field:opacity-50',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction FieldDescription({ className, ...props }: React.ComponentProps<'p'>) {\n return (\n <p\n data-slot=\"field-description\"\n className={cn(\n 'text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5',\n 'last:mt-0 nth-last-2:-mt-1',\n '[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary',\n className,\n )}\n {...props}\n />\n );\n}\n\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=\"relative mx-auto block w-fit bg-background px-2 text-muted-foreground\"\n data-slot=\"field-separator-content\"\n >\n {children}\n </span>\n )}\n </div>\n );\n}\n\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 = [...new Map(errors.map((error) => [error?.message, error])).values()];\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((error, index) => error?.message && <li key={index}>{error.message}</li>)}\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-sm font-normal text-destructive', 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":";;;;;;;;;AASA,SAAS,SAAS,EAAE,WAAW,GAAG,SAA2C;CAC3E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,YAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,oGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EACnB,WACA,UAAU,UACV,GAAG,SACiE;CACpE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;EACE,aAAU;EACV,gBAAc;EACd,YAAA,GAAW,GAAA,GAAA,CACT,mFACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,wIACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,iBAAA,GAAgBA,yBAAAA,IAAAA,CAAI,sEAAsE;CAC9F,UAAU,EACR,aAAa;EACX,UAAU;EACV,YACE;EACF,YACE;CACJ,EACF;CACA,iBAAiB,EACf,aAAa,WACf;AACF,CAAC;AAED,SAAS,MAAM,EACb,WACA,cAAc,YACd,GAAG,SACgE;CACnE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,oBAAkB;EAClB,YAAA,GAAW,GAAA,GAAA,CAAG,cAAc,EAAE,YAAY,CAAC,GAAG,SAAS;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA6C;CAC/E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,4BAAAA,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,olBACA,qEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,iGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAoC;CAC5E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,qJACA,8BACA,qEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,eAAe,EACtB,UACA,WACA,GAAG,SAGF;CACD,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EACE,aAAU;EACV,gBAAc,CAAC,CAAC;EAChB,YAAA,GAAW,GAAA,GAAA,CACT,6EACA,SACF;EACA,GAAI;EAPN,UAAA,CASE,iBAAA,GAAA,kBAAA,IAAA,CAACC,gCAAAA,WAAD,EAAW,WAAU,2BAA4B,CAAA,GAChD,YACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GACE,WAAU;GACV,aAAU;GAET;EACG,CAAA,CAEL;;AAET;AAEA,SAAS,WAAW,EAClB,WACA,UACA,QACA,GAAG,SAGF;CACD,MAAM,WAAA,GAAUC,MAAAA,QAAAA,OAAc;EAC5B,IAAI,UACF,OAAO;EAGT,IAAI,CAAC,QAAQ,QACX,OAAO;EAGT,MAAM,eAAe,CAAC,GAAG,IAAI,IAAI,OAAO,KAAK,UAAU,CAAC,OAAO,SAAS,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;EAEzF,IAAI,cAAc,UAAU,GAC1B,OAAO,aAAa,EAAE,EAAE;EAG1B,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;GAAI,WAAU;GACX,UAAA,aAAa,KAAK,OAAO,UAAU,OAAO,WAAW,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD,EAAA,UAAiB,MAAM,QAAY,GAA1B,KAA0B,CAAC;EACxF,CAAA;CAER,GAAG,CAAC,UAAU,MAAM,CAAC;CAErB,IAAI,CAAC,SACH,OAAO;CAGT,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,wCAAwC,SAAS;EAC/D,GAAI;EAEH,UAAA;CACE,CAAA;AAET"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
import { Label } from './label.cjs';
|
|
3
|
+
declare function FieldSet({ className, ...props }: React.ComponentProps<'fieldset'>): import("react").JSX.Element;
|
|
4
|
+
declare function FieldLegend({ className, variant, ...props }: React.ComponentProps<'legend'> & {
|
|
5
|
+
variant?: 'legend' | 'label';
|
|
6
|
+
}): import("react").JSX.Element;
|
|
7
|
+
declare function FieldGroup({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
|
|
8
|
+
declare const fieldVariants: (props?: ({
|
|
9
|
+
orientation?: "vertical" | "horizontal" | "responsive" | null | undefined;
|
|
10
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
|
+
declare function Field({ className, orientation, ...props }: React.ComponentProps<'div'> & VariantProps<typeof fieldVariants>): import("react").JSX.Element;
|
|
12
|
+
declare function FieldContent({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
|
|
13
|
+
declare function FieldLabel({ className, ...props }: React.ComponentProps<typeof Label>): import("react").JSX.Element;
|
|
14
|
+
declare function FieldTitle({ className, ...props }: React.ComponentProps<'div'>): import("react").JSX.Element;
|
|
15
|
+
declare function FieldDescription({ className, ...props }: React.ComponentProps<'p'>): import("react").JSX.Element;
|
|
16
|
+
declare function FieldSeparator({ children, className, ...props }: React.ComponentProps<'div'> & {
|
|
17
|
+
children?: React.ReactNode;
|
|
18
|
+
}): import("react").JSX.Element;
|
|
19
|
+
declare function FieldError({ className, children, errors, ...props }: React.ComponentProps<'div'> & {
|
|
20
|
+
errors?: Array<{
|
|
21
|
+
message?: string;
|
|
22
|
+
} | undefined>;
|
|
23
|
+
}): import("react").JSX.Element | null;
|
|
24
|
+
export { Field, FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field.js","names":[],"sources":["../../../src/components/ui/field.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from 'cn';\nimport { useMemo } from 'react';\n\nimport { Label } from './label';\nimport { Separator } from './separator';\n\nfunction FieldSet({ className, ...props }: React.ComponentProps<'fieldset'>) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n 'flex flex-col gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3',\n className,\n )}\n {...props}\n />\n );\n}\n\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-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base',\n className,\n )}\n {...props}\n />\n );\n}\n\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-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4',\n className,\n )}\n {...props}\n />\n );\n}\n\nconst fieldVariants = cva('group/field flex w-full gap-2 data-[invalid=true]:text-destructive', {\n variants: {\n orientation: {\n vertical: 'flex-col *:w-full [&>.sr-only]:w-auto',\n horizontal:\n 'flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n responsive:\n 'flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n },\n },\n defaultVariants: {\n orientation: 'vertical',\n },\n});\n\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\nfunction FieldContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"field-content\"\n className={cn('group/field-content flex flex-1 flex-col gap-0.5 leading-snug', className)}\n {...props}\n />\n );\n}\n\nfunction FieldLabel({ className, ...props }: 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 has-data-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-sm has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-muted/50 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-3 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/50 *:data-[slot=field]:p-2.5 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10',\n 'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col',\n className,\n )}\n {...props}\n />\n );\n}\n\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 font-medium group-data-[disabled=true]/field:opacity-50',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction FieldDescription({ className, ...props }: React.ComponentProps<'p'>) {\n return (\n <p\n data-slot=\"field-description\"\n className={cn(\n 'text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5',\n 'last:mt-0 nth-last-2:-mt-1',\n '[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary',\n className,\n )}\n {...props}\n />\n );\n}\n\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=\"relative mx-auto block w-fit bg-background px-2 text-muted-foreground\"\n data-slot=\"field-separator-content\"\n >\n {children}\n </span>\n )}\n </div>\n );\n}\n\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 = [...new Map(errors.map((error) => [error?.message, error])).values()];\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((error, index) => error?.message && <li key={index}>{error.message}</li>)}\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-sm font-normal text-destructive', 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":"
|
|
1
|
+
{"version":3,"file":"field.js","names":[],"sources":["../../../src/components/ui/field.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from 'cn';\nimport { useMemo } from 'react';\n\nimport { Label } from './label';\nimport { Separator } from './separator';\n\nfunction FieldSet({ className, ...props }: React.ComponentProps<'fieldset'>) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n 'flex flex-col gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3',\n className,\n )}\n {...props}\n />\n );\n}\n\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-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base',\n className,\n )}\n {...props}\n />\n );\n}\n\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-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4',\n className,\n )}\n {...props}\n />\n );\n}\n\nconst fieldVariants = cva('group/field flex w-full gap-2 data-[invalid=true]:text-destructive', {\n variants: {\n orientation: {\n vertical: 'flex-col *:w-full [&>.sr-only]:w-auto',\n horizontal:\n 'flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n responsive:\n 'flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n },\n },\n defaultVariants: {\n orientation: 'vertical',\n },\n});\n\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\nfunction FieldContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"field-content\"\n className={cn('group/field-content flex flex-1 flex-col gap-0.5 leading-snug', className)}\n {...props}\n />\n );\n}\n\nfunction FieldLabel({ className, ...props }: 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 has-data-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-sm has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-muted/50 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-3 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/50 *:data-[slot=field]:p-2.5 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10',\n 'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col',\n className,\n )}\n {...props}\n />\n );\n}\n\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 font-medium group-data-[disabled=true]/field:opacity-50',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction FieldDescription({ className, ...props }: React.ComponentProps<'p'>) {\n return (\n <p\n data-slot=\"field-description\"\n className={cn(\n 'text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5',\n 'last:mt-0 nth-last-2:-mt-1',\n '[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary',\n className,\n )}\n {...props}\n />\n );\n}\n\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=\"relative mx-auto block w-fit bg-background px-2 text-muted-foreground\"\n data-slot=\"field-separator-content\"\n >\n {children}\n </span>\n )}\n </div>\n );\n}\n\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 = [...new Map(errors.map((error) => [error?.message, error])).values()];\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((error, index) => error?.message && <li key={index}>{error.message}</li>)}\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-sm font-normal text-destructive', 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":";;;;;;;;AASA,SAAS,SAAS,EAAE,WAAW,GAAG,SAA2C;CAC3E,OACE,oBAAC,YAAD;EACE,aAAU;EACV,WAAW,GACT,oGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EACnB,WACA,UAAU,UACV,GAAG,SACiE;CACpE,OACE,oBAAC,UAAD;EACE,aAAU;EACV,gBAAc;EACd,WAAW,GACT,mFACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,wIACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,gBAAgB,IAAI,sEAAsE;CAC9F,UAAU,EACR,aAAa;EACX,UAAU;EACV,YACE;EACF,YACE;CACJ,EACF;CACA,iBAAiB,EACf,aAAa,WACf;AACF,CAAC;AAED,SAAS,MAAM,EACb,WACA,cAAc,YACd,GAAG,SACgE;CACnE,OACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,oBAAkB;EAClB,WAAW,GAAG,cAAc,EAAE,YAAY,CAAC,GAAG,SAAS;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA6C;CAC/E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,olBACA,qEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,iGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAoC;CAC5E,OACE,oBAAC,KAAD;EACE,aAAU;EACV,WAAW,GACT,qJACA,8BACA,qEACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,eAAe,EACtB,UACA,WACA,GAAG,SAGF;CACD,OACE,qBAAC,OAAD;EACE,aAAU;EACV,gBAAc,CAAC,CAAC;EAChB,WAAW,GACT,6EACA,SACF;EACA,GAAI;EAPN,UAAA,CASE,oBAAC,WAAD,EAAW,WAAU,2BAA4B,CAAA,GAChD,YACC,oBAAC,QAAD;GACE,WAAU;GACV,aAAU;GAET;EACG,CAAA,CAEL;;AAET;AAEA,SAAS,WAAW,EAClB,WACA,UACA,QACA,GAAG,SAGF;CACD,MAAM,UAAU,cAAc;EAC5B,IAAI,UACF,OAAO;EAGT,IAAI,CAAC,QAAQ,QACX,OAAO;EAGT,MAAM,eAAe,CAAC,GAAG,IAAI,IAAI,OAAO,KAAK,UAAU,CAAC,OAAO,SAAS,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;EAEzF,IAAI,cAAc,UAAU,GAC1B,OAAO,aAAa,EAAE,EAAE;EAG1B,OACE,oBAAC,MAAD;GAAI,WAAU;GACX,UAAA,aAAa,KAAK,OAAO,UAAU,OAAO,WAAW,oBAAC,MAAD,EAAA,UAAiB,MAAM,QAAY,GAA1B,KAA0B,CAAC;EACxF,CAAA;CAER,GAAG,CAAC,UAAU,MAAM,CAAC;CAErB,IAAI,CAAC,SACH,OAAO;CAGT,OACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,WAAW,GAAG,wCAAwC,SAAS;EAC/D,GAAI;EAEH,UAAA;CACE,CAAA;AAET"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const require_rolldown_runtime = require("../../chunks/rolldown-runtime-CmQyd0Gu.cjs");
|
|
4
|
+
let cn = require("cn");
|
|
5
|
+
let radix_ui = require("radix-ui");
|
|
6
|
+
let react = require("react");
|
|
7
|
+
react = require_rolldown_runtime.__toESM(react, 1);
|
|
8
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
9
|
+
// src/components/ui/hover-card.tsx
|
|
10
|
+
function HoverCard({ ...props }) {
|
|
11
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.HoverCard.Root, {
|
|
12
|
+
"data-slot": "hover-card",
|
|
13
|
+
...props
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
function HoverCardTrigger({ ...props }) {
|
|
17
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.HoverCard.Trigger, {
|
|
18
|
+
"data-slot": "hover-card-trigger",
|
|
19
|
+
...props
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
function HoverCardContent({ className, align = "center", sideOffset = 4, ...props }) {
|
|
23
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.HoverCard.Portal, {
|
|
24
|
+
"data-slot": "hover-card-portal",
|
|
25
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.HoverCard.Content, {
|
|
26
|
+
"data-slot": "hover-card-content",
|
|
27
|
+
align,
|
|
28
|
+
sideOffset,
|
|
29
|
+
className: (0, cn.cn)("z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-sm border border-border bg-popover p-2.5 text-sm text-popover-foreground outline-hidden duration-100 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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
|
|
30
|
+
...props
|
|
31
|
+
})
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
exports.HoverCard = HoverCard;
|
|
35
|
+
exports.HoverCardContent = HoverCardContent;
|
|
36
|
+
exports.HoverCardTrigger = HoverCardTrigger;
|
|
37
|
+
|
|
38
|
+
//# sourceMappingURL=hover-card.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hover-card.cjs","names":["HoverCardPrimitive"],"sources":["../../../src/components/ui/hover-card.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from 'cn';\nimport { HoverCard as HoverCardPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nfunction HoverCard({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Root>) {\n return <HoverCardPrimitive.Root data-slot=\"hover-card\" {...props} />;\n}\n\nfunction HoverCardTrigger({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Trigger>) {\n return <HoverCardPrimitive.Trigger data-slot=\"hover-card-trigger\" {...props} />;\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 data-slot=\"hover-card-portal\">\n <HoverCardPrimitive.Content\n data-slot=\"hover-card-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n 'z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-sm border border-border bg-popover p-2.5 text-sm text-popover-foreground outline-hidden duration-100 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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n className,\n )}\n {...props}\n />\n </HoverCardPrimitive.Portal>\n );\n}\n\nexport { HoverCard, HoverCardTrigger, HoverCardContent };\n"],"mappings":";;;;;;;;;AAMA,SAAS,UAAU,EAAE,GAAG,SAA+D;CACrF,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACA,SAAAA,UAAmB,MAApB;EAAyB,aAAU;EAAa,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,iBAAiB,EAAE,GAAG,SAAkE;CAC/F,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACA,SAAAA,UAAmB,SAApB;EAA4B,aAAU;EAAqB,GAAI;CAAQ,CAAA;AAChF;AAEA,SAAS,iBAAiB,EACxB,WACA,QAAQ,UACR,aAAa,GACb,GAAG,SACuD;CAC1D,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,SAAAA,UAAmB,QAApB;EAA2B,aAAU;EACnC,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACA,SAAAA,UAAmB,SAApB;GACE,aAAU;GACH;GACK;GACZ,YAAA,GAAW,GAAA,GAAA,CACT,gdACA,SACF;GACA,GAAI;EACL,CAAA;CACwB,CAAA;AAE/B"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { HoverCard as HoverCardPrimitive } from 'radix-ui';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare function HoverCard({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Root>): React.JSX.Element;
|
|
4
|
+
declare function HoverCardTrigger({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Trigger>): React.JSX.Element;
|
|
5
|
+
declare function HoverCardContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof HoverCardPrimitive.Content>): React.JSX.Element;
|
|
6
|
+
export { HoverCard, HoverCardTrigger, HoverCardContent };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hover-card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/hover-card.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"hover-card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/hover-card.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,iBAAS,SAAS,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,qBAEpF;AAED,iBAAS,gBAAgB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,qBAE9F;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,KAAgB,EAChB,UAAc,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,qBAezD;AAED,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -1,24 +1,25 @@
|
|
|
1
|
+
"use client";
|
|
1
2
|
import { cn } from "cn";
|
|
2
|
-
import { HoverCard } from "radix-ui";
|
|
3
|
+
import { HoverCard as HoverCard$1 } from "radix-ui";
|
|
3
4
|
import "react";
|
|
4
5
|
import { jsx } from "react/jsx-runtime";
|
|
5
6
|
// src/components/ui/hover-card.tsx
|
|
6
|
-
function HoverCard
|
|
7
|
-
return /* @__PURE__ */ jsx(HoverCard.Root, {
|
|
7
|
+
function HoverCard({ ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx(HoverCard$1.Root, {
|
|
8
9
|
"data-slot": "hover-card",
|
|
9
10
|
...props
|
|
10
11
|
});
|
|
11
12
|
}
|
|
12
13
|
function HoverCardTrigger({ ...props }) {
|
|
13
|
-
return /* @__PURE__ */ jsx(HoverCard.Trigger, {
|
|
14
|
+
return /* @__PURE__ */ jsx(HoverCard$1.Trigger, {
|
|
14
15
|
"data-slot": "hover-card-trigger",
|
|
15
16
|
...props
|
|
16
17
|
});
|
|
17
18
|
}
|
|
18
19
|
function HoverCardContent({ className, align = "center", sideOffset = 4, ...props }) {
|
|
19
|
-
return /* @__PURE__ */ jsx(HoverCard.Portal, {
|
|
20
|
+
return /* @__PURE__ */ jsx(HoverCard$1.Portal, {
|
|
20
21
|
"data-slot": "hover-card-portal",
|
|
21
|
-
children: /* @__PURE__ */ jsx(HoverCard.Content, {
|
|
22
|
+
children: /* @__PURE__ */ jsx(HoverCard$1.Content, {
|
|
22
23
|
"data-slot": "hover-card-content",
|
|
23
24
|
align,
|
|
24
25
|
sideOffset,
|
|
@@ -27,6 +28,6 @@ function HoverCardContent({ className, align = "center", sideOffset = 4, ...prop
|
|
|
27
28
|
})
|
|
28
29
|
});
|
|
29
30
|
}
|
|
30
|
-
export { HoverCard
|
|
31
|
+
export { HoverCard, HoverCardContent, HoverCardTrigger };
|
|
31
32
|
|
|
32
33
|
//# sourceMappingURL=hover-card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hover-card.js","names":["
|
|
1
|
+
{"version":3,"file":"hover-card.js","names":["HoverCardPrimitive"],"sources":["../../../src/components/ui/hover-card.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from 'cn';\nimport { HoverCard as HoverCardPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nfunction HoverCard({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Root>) {\n return <HoverCardPrimitive.Root data-slot=\"hover-card\" {...props} />;\n}\n\nfunction HoverCardTrigger({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Trigger>) {\n return <HoverCardPrimitive.Trigger data-slot=\"hover-card-trigger\" {...props} />;\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 data-slot=\"hover-card-portal\">\n <HoverCardPrimitive.Content\n data-slot=\"hover-card-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n 'z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-sm border border-border bg-popover p-2.5 text-sm text-popover-foreground outline-hidden duration-100 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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n className,\n )}\n {...props}\n />\n </HoverCardPrimitive.Portal>\n );\n}\n\nexport { HoverCard, HoverCardTrigger, HoverCardContent };\n"],"mappings":";;;;;;AAMA,SAAS,UAAU,EAAE,GAAG,SAA+D;CACrF,OAAO,oBAACA,YAAmB,MAApB;EAAyB,aAAU;EAAa,GAAI;CAAQ,CAAA;AACrE;AAEA,SAAS,iBAAiB,EAAE,GAAG,SAAkE;CAC/F,OAAO,oBAACA,YAAmB,SAApB;EAA4B,aAAU;EAAqB,GAAI;CAAQ,CAAA;AAChF;AAEA,SAAS,iBAAiB,EACxB,WACA,QAAQ,UACR,aAAa,GACb,GAAG,SACuD;CAC1D,OACE,oBAACA,YAAmB,QAApB;EAA2B,aAAU;EACnC,UAAA,oBAACA,YAAmB,SAApB;GACE,aAAU;GACH;GACK;GACZ,WAAW,GACT,gdACA,SACF;GACA,GAAI;EACL,CAAA;CACwB,CAAA;AAE/B"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
+
const require_rolldown_runtime = require("../../chunks/rolldown-runtime-CmQyd0Gu.cjs");
|
|
3
|
+
const require_components_ui_button = require("./button.cjs");
|
|
4
|
+
const require_components_ui_input = require("./input.cjs");
|
|
5
|
+
const require_components_ui_textarea = require("./textarea.cjs");
|
|
6
|
+
let cn = require("cn");
|
|
7
|
+
let react = require("react");
|
|
8
|
+
react = require_rolldown_runtime.__toESM(react, 1);
|
|
9
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
10
|
+
let class_variance_authority = require("class-variance-authority");
|
|
11
|
+
// src/components/ui/input-group.tsx
|
|
12
|
+
function InputGroup({ className, ...props }) {
|
|
13
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
14
|
+
"data-slot": "input-group",
|
|
15
|
+
role: "group",
|
|
16
|
+
className: (0, cn.cn)("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-sm border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", className),
|
|
17
|
+
...props
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
var inputGroupAddonVariants = (0, class_variance_authority.cva)("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
|
|
21
|
+
variants: { align: {
|
|
22
|
+
"inline-start": "order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
|
|
23
|
+
"inline-end": "order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]",
|
|
24
|
+
"block-start": "order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2",
|
|
25
|
+
"block-end": "order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2"
|
|
26
|
+
} },
|
|
27
|
+
defaultVariants: { align: "inline-start" }
|
|
28
|
+
});
|
|
29
|
+
function InputGroupAddon({ className, align = "inline-start", ...props }) {
|
|
30
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
31
|
+
role: "group",
|
|
32
|
+
"data-slot": "input-group-addon",
|
|
33
|
+
"data-align": align,
|
|
34
|
+
className: (0, cn.cn)(inputGroupAddonVariants({ align }), className),
|
|
35
|
+
onClick: (e) => {
|
|
36
|
+
if (e.target.closest("button")) return;
|
|
37
|
+
e.currentTarget.parentElement?.querySelector("input")?.focus();
|
|
38
|
+
},
|
|
39
|
+
...props
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
var inputGroupButtonVariants = (0, class_variance_authority.cva)("flex items-center gap-2 text-sm shadow-none", {
|
|
43
|
+
variants: { size: {
|
|
44
|
+
xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
|
|
45
|
+
sm: "",
|
|
46
|
+
"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
|
|
47
|
+
"icon-sm": "size-8 p-0 has-[>svg]:p-0"
|
|
48
|
+
} },
|
|
49
|
+
defaultVariants: { size: "xs" }
|
|
50
|
+
});
|
|
51
|
+
function InputGroupButton({ className, type = "button", variant = "ghost", size = "xs", ...props }) {
|
|
52
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_ui_button.Button, {
|
|
53
|
+
type,
|
|
54
|
+
"data-size": size,
|
|
55
|
+
variant,
|
|
56
|
+
className: (0, cn.cn)(inputGroupButtonVariants({ size }), className),
|
|
57
|
+
...props
|
|
58
|
+
});
|
|
59
|
+
}
|
|
60
|
+
function InputGroupText({ className, ...props }) {
|
|
61
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
62
|
+
className: (0, cn.cn)("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
|
|
63
|
+
...props
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
function InputGroupInput({ className, ...props }) {
|
|
67
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_ui_input.Input, {
|
|
68
|
+
"data-slot": "input-group-control",
|
|
69
|
+
className: (0, cn.cn)("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
|
|
70
|
+
...props
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
function InputGroupTextarea({ className, ...props }) {
|
|
74
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_ui_textarea.Textarea, {
|
|
75
|
+
"data-slot": "input-group-control",
|
|
76
|
+
className: (0, cn.cn)("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
|
|
77
|
+
...props
|
|
78
|
+
});
|
|
79
|
+
}
|
|
80
|
+
exports.InputGroup = InputGroup;
|
|
81
|
+
exports.InputGroupAddon = InputGroupAddon;
|
|
82
|
+
exports.InputGroupButton = InputGroupButton;
|
|
83
|
+
exports.InputGroupInput = InputGroupInput;
|
|
84
|
+
exports.InputGroupText = InputGroupText;
|
|
85
|
+
exports.InputGroupTextarea = InputGroupTextarea;
|
|
86
|
+
|
|
87
|
+
//# sourceMappingURL=input-group.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input-group.cjs","names":["cva","Button","Input","Textarea"],"sources":["../../../src/components/ui/input-group.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from 'cn';\nimport * as React from 'react';\n\nimport { Button } from './button';\nimport { Input } from './input';\nimport { Textarea } from './textarea';\n\nfunction InputGroup({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"input-group\"\n role=\"group\"\n className={cn(\n 'group/input-group relative flex h-8 w-full min-w-0 items-center rounded-sm border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5',\n className,\n )}\n {...props}\n />\n );\n}\n\nconst inputGroupAddonVariants = cva(\n \"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4\",\n {\n variants: {\n align: {\n 'inline-start': 'order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]',\n 'inline-end': 'order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]',\n 'block-start':\n 'order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2',\n 'block-end':\n 'order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2',\n },\n },\n defaultVariants: {\n align: 'inline-start',\n },\n },\n);\n\nfunction InputGroupAddon({\n className,\n align = 'inline-start',\n ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof inputGroupAddonVariants>) {\n return (\n <div\n role=\"group\"\n data-slot=\"input-group-addon\"\n data-align={align}\n className={cn(inputGroupAddonVariants({ align }), className)}\n onClick={(e) => {\n if ((e.target as HTMLElement).closest('button')) {\n return;\n }\n e.currentTarget.parentElement?.querySelector('input')?.focus();\n }}\n {...props}\n />\n );\n}\n\nconst inputGroupButtonVariants = cva('flex items-center gap-2 text-sm shadow-none', {\n variants: {\n size: {\n xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n sm: '',\n 'icon-xs': 'size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0',\n 'icon-sm': 'size-8 p-0 has-[>svg]:p-0',\n },\n },\n defaultVariants: {\n size: 'xs',\n },\n});\n\nfunction InputGroupButton({\n className,\n type = 'button',\n variant = 'ghost',\n size = 'xs',\n ...props\n}: Omit<React.ComponentProps<typeof Button>, 'size'> &\n VariantProps<typeof inputGroupButtonVariants>) {\n return (\n <Button\n type={type}\n data-size={size}\n variant={variant}\n className={cn(inputGroupButtonVariants({ size }), className)}\n {...props}\n />\n );\n}\n\nfunction InputGroupText({ className, ...props }: React.ComponentProps<'span'>) {\n return (\n <span\n className={cn(\n \"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputGroupInput({ className, ...props }: React.ComponentProps<'input'>) {\n return (\n <Input\n data-slot=\"input-group-control\"\n className={cn(\n 'flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputGroupTextarea({ className, ...props }: React.ComponentProps<'textarea'>) {\n return (\n <Textarea\n data-slot=\"input-group-control\"\n className={cn(\n 'flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n InputGroup,\n InputGroupAddon,\n InputGroupButton,\n InputGroupText,\n InputGroupInput,\n InputGroupTextarea,\n};\n"],"mappings":";;;;;;;;;;;AAQA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,YAAA,GAAW,GAAA,GAAA,CACT,ylCACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,2BAAA,GAA0BA,yBAAAA,IAAAA,CAC9B,2PACA;CACE,UAAU,EACR,OAAO;EACL,gBAAgB;EAChB,cAAc;EACd,eACE;EACF,aACE;CACJ,EACF;CACA,iBAAiB,EACf,OAAO,eACT;AACF,CACF;AAEA,SAAS,gBAAgB,EACvB,WACA,QAAQ,gBACR,GAAG,SAC0E;CAC7E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,cAAY;EACZ,YAAA,GAAW,GAAA,GAAA,CAAG,wBAAwB,EAAE,MAAM,CAAC,GAAG,SAAS;EAC3D,UAAU,MAAM;GACd,IAAK,EAAE,OAAuB,QAAQ,QAAQ,GAC5C;GAEF,EAAE,cAAc,eAAe,cAAc,OAAO,CAAC,EAAE,MAAM;EAC/D;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,4BAAA,GAA2BA,yBAAAA,IAAAA,CAAI,+CAA+C;CAClF,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,WAAW;EACX,WAAW;CACb,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC;AAED,SAAS,iBAAiB,EACxB,WACA,OAAO,UACP,UAAU,SACV,OAAO,MACP,GAAG,SAE4C;CAC/C,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,QAAD;EACQ;EACN,aAAW;EACF;EACT,YAAA,GAAW,GAAA,GAAA,CAAG,yBAAyB,EAAE,KAAK,CAAC,GAAG,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAuC;CAC7E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;EACE,YAAA,GAAW,GAAA,GAAA,CACT,0HACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAwC;CAC/E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,4BAAAA,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,+JACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAA2C;CACrF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,+BAAAA,UAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,gLACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { Button } from './button.cjs';
|
|
4
|
+
declare function InputGroup({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
5
|
+
declare const inputGroupAddonVariants: (props?: ({
|
|
6
|
+
align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
|
+
declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<'div'> & VariantProps<typeof inputGroupAddonVariants>): React.JSX.Element;
|
|
9
|
+
declare const inputGroupButtonVariants: (props?: ({
|
|
10
|
+
size?: "xs" | "sm" | "icon-xs" | "icon-sm" | null | undefined;
|
|
11
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
|
+
declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, 'size'> & VariantProps<typeof inputGroupButtonVariants>): React.JSX.Element;
|
|
13
|
+
declare function InputGroupText({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
|
|
14
|
+
declare function InputGroupInput({ className, ...props }: React.ComponentProps<'input'>): React.JSX.Element;
|
|
15
|
+
declare function InputGroupTextarea({ className, ...props }: React.ComponentProps<'textarea'>): React.JSX.Element;
|
|
16
|
+
export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, };
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const require_rolldown_runtime = require("../../chunks/rolldown-runtime-CmQyd0Gu.cjs");
|
|
4
|
+
let cn = require("cn");
|
|
5
|
+
let lucide_react = require("lucide-react");
|
|
6
|
+
let react = require("react");
|
|
7
|
+
react = require_rolldown_runtime.__toESM(react, 1);
|
|
8
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
9
|
+
let input_otp = require("input-otp");
|
|
10
|
+
// src/components/ui/input-otp.tsx
|
|
11
|
+
function InputOTP({ className, containerClassName, ...props }) {
|
|
12
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(input_otp.OTPInput, {
|
|
13
|
+
"data-slot": "input-otp",
|
|
14
|
+
containerClassName: (0, cn.cn)("cn-input-otp flex items-center has-disabled:opacity-50", containerClassName),
|
|
15
|
+
spellCheck: false,
|
|
16
|
+
className: (0, cn.cn)("disabled:cursor-not-allowed", className),
|
|
17
|
+
...props
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
function InputOTPGroup({ className, ...props }) {
|
|
21
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
22
|
+
"data-slot": "input-otp-group",
|
|
23
|
+
className: (0, cn.cn)("flex items-center rounded-sm has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40", className),
|
|
24
|
+
...props
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
function InputOTPSlot({ index, className, ...props }) {
|
|
28
|
+
const { char, hasFakeCaret, isActive } = react.useContext(input_otp.OTPInputContext)?.slots[index] ?? {};
|
|
29
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
30
|
+
"data-slot": "input-otp-slot",
|
|
31
|
+
"data-active": isActive,
|
|
32
|
+
className: (0, cn.cn)("relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-sm first:border-l last:rounded-r-sm aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40", className),
|
|
33
|
+
...props,
|
|
34
|
+
children: [char, hasFakeCaret && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
35
|
+
className: "pointer-events-none absolute inset-0 flex items-center justify-center",
|
|
36
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" })
|
|
37
|
+
})]
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
function InputOTPSeparator({ ...props }) {
|
|
41
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
42
|
+
"data-slot": "input-otp-separator",
|
|
43
|
+
className: "flex items-center [&_svg:not([class*='size-'])]:size-4",
|
|
44
|
+
role: "separator",
|
|
45
|
+
...props,
|
|
46
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.MinusIcon, {})
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
exports.InputOTP = InputOTP;
|
|
50
|
+
exports.InputOTPGroup = InputOTPGroup;
|
|
51
|
+
exports.InputOTPSeparator = InputOTPSeparator;
|
|
52
|
+
exports.InputOTPSlot = InputOTPSlot;
|
|
53
|
+
|
|
54
|
+
//# sourceMappingURL=input-otp.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input-otp.cjs","names":["OTPInput","React","OTPInputContext","MinusIcon"],"sources":["../../../src/components/ui/input-otp.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from 'cn';\nimport { OTPInput, OTPInputContext } from 'input-otp';\nimport { MinusIcon } from 'lucide-react';\nimport * as React from 'react';\n\nfunction InputOTP({\n className,\n containerClassName,\n ...props\n}: React.ComponentProps<typeof OTPInput> & {\n containerClassName?: string;\n}) {\n return (\n <OTPInput\n data-slot=\"input-otp\"\n containerClassName={cn(\n 'cn-input-otp flex items-center has-disabled:opacity-50',\n containerClassName,\n )}\n spellCheck={false}\n className={cn('disabled:cursor-not-allowed', className)}\n {...props}\n />\n );\n}\n\nfunction InputOTPGroup({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"input-otp-group\"\n className={cn(\n 'flex items-center rounded-sm has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputOTPSlot({\n index,\n className,\n ...props\n}: React.ComponentProps<'div'> & {\n index: number;\n}) {\n const inputOTPContext = React.useContext(OTPInputContext);\n const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};\n\n return (\n <div\n data-slot=\"input-otp-slot\"\n data-active={isActive}\n className={cn(\n 'relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-sm first:border-l last:rounded-r-sm aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40',\n className,\n )}\n {...props}\n >\n {char}\n {hasFakeCaret && (\n <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\" />\n </div>\n )}\n </div>\n );\n}\n\nfunction InputOTPSeparator({ ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"input-otp-separator\"\n className=\"flex items-center [&_svg:not([class*='size-'])]:size-4\"\n role=\"separator\"\n {...props}\n >\n <MinusIcon />\n </div>\n );\n}\n\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };\n"],"mappings":";;;;;;;;;;AAOA,SAAS,SAAS,EAChB,WACA,oBACA,GAAG,SAGF;CACD,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,UAAAA,UAAD;EACE,aAAU;EACV,qBAAA,GAAoB,GAAA,GAAA,CAClB,0DACA,kBACF;EACA,YAAY;EACZ,YAAA,GAAW,GAAA,GAAA,CAAG,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,2KACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EACpB,OACA,WACA,GAAG,SAGF;CAED,MAAM,EAAE,MAAM,cAAc,aADJC,MAAM,WAAWC,UAAAA,eACA,CAAA,EAAiB,MAAM,UAAU,CAAC;CAE3E,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EACE,aAAU;EACV,eAAa;EACb,YAAA,GAAW,GAAA,GAAA,CACT,6eACA,SACF;EACA,GAAI;EAPN,UAAA,CASG,MACA,gBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;GAAK,WAAU;GACb,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD,EAAK,WAAU,2DAA4D,CAAA;EACxE,CAAA,CAEJ;;AAET;AAEA,SAAS,kBAAkB,EAAE,GAAG,SAAsC;CACpE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,WAAU;EACV,MAAK;EACL,GAAI;EAEJ,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,aAAAA,WAAD,CAAY,CAAA;CACT,CAAA;AAET"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { OTPInput } from 'input-otp';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare function InputOTP({ className, containerClassName, ...props }: React.ComponentProps<typeof OTPInput> & {
|
|
4
|
+
containerClassName?: string;
|
|
5
|
+
}): React.JSX.Element;
|
|
6
|
+
declare function InputOTPGroup({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
7
|
+
declare function InputOTPSlot({ index, className, ...props }: React.ComponentProps<'div'> & {
|
|
8
|
+
index: number;
|
|
9
|
+
}): React.JSX.Element;
|
|
10
|
+
declare function InputOTPSeparator({ ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
11
|
+
export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-otp.js","names":[],"sources":["../../../src/components/ui/input-otp.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from 'cn';\nimport { OTPInput, OTPInputContext } from 'input-otp';\nimport { MinusIcon } from 'lucide-react';\nimport * as React from 'react';\n\nfunction InputOTP({\n className,\n containerClassName,\n ...props\n}: React.ComponentProps<typeof OTPInput> & {\n containerClassName?: string;\n}) {\n return (\n <OTPInput\n data-slot=\"input-otp\"\n containerClassName={cn(\n 'cn-input-otp flex items-center has-disabled:opacity-50',\n containerClassName,\n )}\n spellCheck={false}\n className={cn('disabled:cursor-not-allowed', className)}\n {...props}\n />\n );\n}\n\nfunction InputOTPGroup({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"input-otp-group\"\n className={cn(\n 'flex items-center rounded-sm has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputOTPSlot({\n index,\n className,\n ...props\n}: React.ComponentProps<'div'> & {\n index: number;\n}) {\n const inputOTPContext = React.useContext(OTPInputContext);\n const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};\n\n return (\n <div\n data-slot=\"input-otp-slot\"\n data-active={isActive}\n className={cn(\n 'relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-sm first:border-l last:rounded-r-sm aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40',\n className,\n )}\n {...props}\n >\n {char}\n {hasFakeCaret && (\n <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\" />\n </div>\n )}\n </div>\n );\n}\n\nfunction InputOTPSeparator({ ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"input-otp-separator\"\n className=\"flex items-center [&_svg:not([class*='size-'])]:size-4\"\n role=\"separator\"\n {...props}\n >\n <MinusIcon />\n </div>\n );\n}\n\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"input-otp.js","names":[],"sources":["../../../src/components/ui/input-otp.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from 'cn';\nimport { OTPInput, OTPInputContext } from 'input-otp';\nimport { MinusIcon } from 'lucide-react';\nimport * as React from 'react';\n\nfunction InputOTP({\n className,\n containerClassName,\n ...props\n}: React.ComponentProps<typeof OTPInput> & {\n containerClassName?: string;\n}) {\n return (\n <OTPInput\n data-slot=\"input-otp\"\n containerClassName={cn(\n 'cn-input-otp flex items-center has-disabled:opacity-50',\n containerClassName,\n )}\n spellCheck={false}\n className={cn('disabled:cursor-not-allowed', className)}\n {...props}\n />\n );\n}\n\nfunction InputOTPGroup({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"input-otp-group\"\n className={cn(\n 'flex items-center rounded-sm has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputOTPSlot({\n index,\n className,\n ...props\n}: React.ComponentProps<'div'> & {\n index: number;\n}) {\n const inputOTPContext = React.useContext(OTPInputContext);\n const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};\n\n return (\n <div\n data-slot=\"input-otp-slot\"\n data-active={isActive}\n className={cn(\n 'relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-sm first:border-l last:rounded-r-sm aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40',\n className,\n )}\n {...props}\n >\n {char}\n {hasFakeCaret && (\n <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\" />\n </div>\n )}\n </div>\n );\n}\n\nfunction InputOTPSeparator({ ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"input-otp-separator\"\n className=\"flex items-center [&_svg:not([class*='size-'])]:size-4\"\n role=\"separator\"\n {...props}\n >\n <MinusIcon />\n </div>\n );\n}\n\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };\n"],"mappings":";;;;;;;AAOA,SAAS,SAAS,EAChB,WACA,oBACA,GAAG,SAGF;CACD,OACE,oBAAC,UAAD;EACE,aAAU;EACV,oBAAoB,GAClB,0DACA,kBACF;EACA,YAAY;EACZ,WAAW,GAAG,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,2KACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EACpB,OACA,WACA,GAAG,SAGF;CAED,MAAM,EAAE,MAAM,cAAc,aADJ,MAAM,WAAW,eACA,CAAA,EAAiB,MAAM,UAAU,CAAC;CAE3E,OACE,qBAAC,OAAD;EACE,aAAU;EACV,eAAa;EACb,WAAW,GACT,6eACA,SACF;EACA,GAAI;EAPN,UAAA,CASG,MACA,gBACC,oBAAC,OAAD;GAAK,WAAU;GACb,UAAA,oBAAC,OAAD,EAAK,WAAU,2DAA4D,CAAA;EACxE,CAAA,CAEJ;;AAET;AAEA,SAAS,kBAAkB,EAAE,GAAG,SAAsC;CACpE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAU;EACV,MAAK;EACL,GAAI;EAEJ,UAAA,oBAAC,WAAD,CAAY,CAAA;CACT,CAAA;AAET"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
+
const require_rolldown_runtime = require("../../chunks/rolldown-runtime-CmQyd0Gu.cjs");
|
|
3
|
+
const require_lib_get_placeholder = require("../../lib/get-placeholder.cjs");
|
|
4
|
+
let cn = require("cn");
|
|
5
|
+
let react = require("react");
|
|
6
|
+
react = require_rolldown_runtime.__toESM(react, 1);
|
|
7
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
|
+
// src/components/ui/input.tsx
|
|
9
|
+
function Input({ className, type, error, placeholder, ...props }) {
|
|
10
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
11
|
+
className: "w-full",
|
|
12
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
|
|
13
|
+
type,
|
|
14
|
+
"data-slot": "input",
|
|
15
|
+
"aria-invalid": error ? true : props["aria-invalid"],
|
|
16
|
+
placeholder: require_lib_get_placeholder.getPlaceholder(placeholder, props.required),
|
|
17
|
+
className: (0, cn.cn)("flex h-10 w-full min-w-0 rounded-sm border border-input bg-background px-3 py-2 font-sans text-sm focus-ring transition-colors file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive", className),
|
|
18
|
+
...props
|
|
19
|
+
}), error ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
|
|
20
|
+
"data-slot": "input-error",
|
|
21
|
+
className: "mt-2 text-sm font-bold text-destructive",
|
|
22
|
+
children: error
|
|
23
|
+
}) : null]
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
exports.Input = Input;
|
|
27
|
+
|
|
28
|
+
//# sourceMappingURL=input.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input.cjs","names":["getPlaceholder"],"sources":["../../../src/components/ui/input.tsx"],"sourcesContent":["import { cn } from 'cn';\nimport * as React from 'react';\n\nimport { getPlaceholder } from '../../lib/get-placeholder';\n\nexport interface InputProps extends React.ComponentProps<'input'> {\n /**\n * Validation message rendered under the field. A string renders one line;\n * pass `aria-invalid` yourself when you want the border treatment too.\n */\n error?: string;\n}\n\nfunction Input({ className, type, error, placeholder, ...props }: InputProps) {\n return (\n <div className=\"w-full\">\n <input\n type={type}\n data-slot=\"input\"\n aria-invalid={error ? true : props['aria-invalid']}\n placeholder={getPlaceholder(placeholder, props.required)}\n className={cn(\n 'flex h-10 w-full min-w-0 rounded-sm border border-input bg-background px-3 py-2 font-sans text-sm focus-ring transition-colors file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive',\n className,\n )}\n {...props}\n />\n {error ? (\n <p data-slot=\"input-error\" className=\"mt-2 text-sm font-bold text-destructive\">\n {error}\n </p>\n ) : null}\n </div>\n );\n}\n\nexport { Input };\n"],"mappings":";;;;;;;;AAaA,SAAS,MAAM,EAAE,WAAW,MAAM,OAAO,aAAa,GAAG,SAAqB;CAC5E,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD;GACQ;GACN,aAAU;GACV,gBAAc,QAAQ,OAAO,MAAM;GACnC,aAAaA,4BAAAA,eAAe,aAAa,MAAM,QAAQ;GACvD,YAAA,GAAW,GAAA,GAAA,CACT,mWACA,SACF;GACA,GAAI;EACL,CAAA,GACA,QACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;GAAG,aAAU;GAAc,WAAU;GAClC,UAAA;EACA,CAAA,IACD,IACD;;AAET"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface InputProps extends React.ComponentProps<'input'> {
|
|
3
|
+
/**
|
|
4
|
+
* Validation message rendered under the field. A string renders one line;
|
|
5
|
+
* pass `aria-invalid` yourself when you want the border treatment too.
|
|
6
|
+
*/
|
|
7
|
+
error?: string;
|
|
8
|
+
}
|
|
9
|
+
declare function Input({ className, type, error, placeholder, ...props }: InputProps): React.JSX.Element;
|
|
10
|
+
export { Input };
|