@exsto/ds 0.0.1-rc.2 → 0.0.1-rc.21
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 +163 -28
- package/dist/date-picker.js +2 -0
- package/dist/ds/src/date-picker.d.ts +9 -0
- package/dist/ds/src/file-input.d.ts +9 -0
- package/dist/ds/src/index.d.ts +2 -3
- package/dist/ds/src/rich-text-editor.d.ts +8 -0
- package/dist/ds/src/time-field.d.ts +9 -0
- package/dist/file-input.js +2 -0
- package/dist/index.js +79 -2
- package/dist/rich-text-editor.js +4 -0
- package/dist/source-hash.txt +1 -0
- package/dist/styles.css +1185 -403
- package/dist/theme.css +122 -7
- package/dist/time-field.js +2 -0
- package/dist/ui/src/components/edyn/animated-number/animated-number.d.ts +30 -0
- package/dist/ui/src/components/edyn/animated-number/animated-number.js +108 -0
- package/dist/ui/src/components/edyn/animated-number/animated-number.js.map +1 -0
- package/dist/ui/src/components/edyn/animated-number/animated-number.test.d.ts +9 -0
- package/dist/ui/src/components/edyn/animated-number/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/audio-player/audio-player.d.ts +3 -2
- package/dist/ui/src/components/edyn/audio-player/audio-player.js +86 -0
- package/dist/ui/src/components/edyn/audio-player/audio-player.js.map +1 -0
- package/dist/ui/src/components/edyn/date-picker/date-picker.d.ts +86 -0
- package/dist/ui/src/components/edyn/date-picker/date-picker.js +302 -0
- package/dist/ui/src/components/edyn/date-picker/date-picker.js.map +1 -0
- package/dist/ui/src/components/edyn/date-picker/date-picker.state.test.d.ts +9 -0
- package/dist/ui/src/components/edyn/date-picker/date-text.d.ts +40 -0
- package/dist/ui/src/components/edyn/date-picker/date-text.js +105 -0
- package/dist/ui/src/components/edyn/date-picker/date-text.js.map +1 -0
- package/dist/ui/src/components/edyn/date-picker/index.d.ts +2 -0
- package/dist/ui/src/components/edyn/date-range-picker/date-range-picker.d.ts +28 -0
- package/dist/ui/src/components/edyn/date-range-picker/date-range-picker.js +70 -0
- package/dist/ui/src/components/edyn/date-range-picker/date-range-picker.js.map +1 -0
- package/dist/ui/src/components/edyn/date-range-picker/date-range-picker.test.d.ts +9 -0
- package/dist/ui/src/components/edyn/date-range-picker/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/file-input/file-input.d.ts +90 -0
- package/dist/ui/src/components/edyn/file-input/file-input.js +261 -0
- package/dist/ui/src/components/edyn/file-input/file-input.js.map +1 -0
- package/dist/ui/src/components/edyn/file-input/file-input.test.d.ts +8 -0
- package/dist/ui/src/components/edyn/file-input/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/initials-avatar/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/initials-avatar/initials-avatar.d.ts +54 -0
- package/dist/ui/src/components/edyn/initials-avatar/initials-avatar.js +86 -0
- package/dist/ui/src/components/edyn/initials-avatar/initials-avatar.js.map +1 -0
- package/dist/ui/src/components/edyn/initials-avatar/initials-avatar.test.d.ts +10 -0
- package/dist/ui/src/components/edyn/multi-select/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/multi-select/multi-select.d.ts +117 -0
- package/dist/ui/src/components/edyn/multi-select/multi-select.js +342 -0
- package/dist/ui/src/components/edyn/multi-select/multi-select.js.map +1 -0
- package/dist/ui/src/components/edyn/multi-select/multi-select.test.d.ts +9 -0
- package/dist/ui/src/components/edyn/presence/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/presence/presence.d.ts +15 -0
- package/dist/ui/src/components/edyn/presence/presence.js +58 -0
- package/dist/ui/src/components/edyn/presence/presence.js.map +1 -0
- package/dist/ui/src/components/edyn/presence/presence.test.d.ts +8 -0
- package/dist/ui/src/components/edyn/progress-line/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/progress-line/progress-line.d.ts +23 -0
- package/dist/ui/src/components/edyn/progress-line/progress-line.js +100 -0
- package/dist/ui/src/components/edyn/progress-line/progress-line.js.map +1 -0
- package/dist/ui/src/components/edyn/progress-line/progress-line.test.d.ts +9 -0
- package/dist/ui/src/components/edyn/rich-text-content/allow-list.d.ts +11 -0
- package/dist/ui/src/components/edyn/rich-text-content/allow-list.js +37 -0
- package/dist/ui/src/components/edyn/rich-text-content/allow-list.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-content/index.d.ts +2 -0
- package/dist/ui/src/components/edyn/rich-text-content/rich-text-content.d.ts +22 -0
- package/dist/ui/src/components/edyn/rich-text-content/rich-text-content.js +124 -0
- package/dist/ui/src/components/edyn/rich-text-content/rich-text-content.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-content/rich-text-content.test.d.ts +8 -0
- package/dist/ui/src/components/edyn/rich-text-editor/extensions.d.ts +18 -0
- package/dist/ui/src/components/edyn/rich-text-editor/extensions.js +124 -0
- package/dist/ui/src/components/edyn/rich-text-editor/extensions.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-editor/index.d.ts +3 -0
- package/dist/ui/src/components/edyn/rich-text-editor/mention-list.d.ts +17 -0
- package/dist/ui/src/components/edyn/rich-text-editor/mention-list.js +232 -0
- package/dist/ui/src/components/edyn/rich-text-editor/mention-list.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-editor/rich-text-editor.d.ts +53 -0
- package/dist/ui/src/components/edyn/rich-text-editor/rich-text-editor.js +244 -0
- package/dist/ui/src/components/edyn/rich-text-editor/rich-text-editor.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-editor/rich-text-editor.test.d.ts +6 -0
- package/dist/ui/src/components/edyn/rich-text-editor/serialize.d.ts +13 -0
- package/dist/ui/src/components/edyn/rich-text-editor/serialize.js +55 -0
- package/dist/ui/src/components/edyn/rich-text-editor/serialize.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-editor/sync.d.ts +19 -0
- package/dist/ui/src/components/edyn/rich-text-editor/sync.js +34 -0
- package/dist/ui/src/components/edyn/rich-text-editor/sync.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-editor/sync.test.d.ts +11 -0
- package/dist/ui/src/components/edyn/rich-text-editor/toolbar.d.ts +20 -0
- package/dist/ui/src/components/edyn/rich-text-editor/toolbar.js +235 -0
- package/dist/ui/src/components/edyn/rich-text-editor/toolbar.js.map +1 -0
- package/dist/ui/src/components/edyn/rich-text-editor/types.d.ts +68 -0
- package/dist/ui/src/components/edyn/rich-text-editor/types.js +26 -0
- package/dist/ui/src/components/edyn/rich-text-editor/types.js.map +1 -0
- package/dist/ui/src/components/edyn/time-field/index.d.ts +1 -0
- package/dist/ui/src/components/edyn/time-field/time-field.d.ts +85 -0
- package/dist/ui/src/components/edyn/time-field/time-field.js +337 -0
- package/dist/ui/src/components/edyn/time-field/time-field.js.map +1 -0
- package/dist/ui/src/components/edyn/time-field/time-field.test.d.ts +8 -0
- package/dist/ui/src/components/edyn/video-player/video-player.d.ts +2 -2
- package/dist/ui/src/components/edyn/video-player/video-player.js +132 -0
- package/dist/ui/src/components/edyn/video-player/video-player.js.map +1 -0
- package/dist/ui/src/components/forwarded-props.test.d.ts +8 -0
- package/dist/ui/src/components/ui/accordion/accordion.d.ts +9 -8
- package/dist/ui/src/components/ui/accordion/accordion.js +83 -0
- package/dist/ui/src/components/ui/accordion/accordion.js.map +1 -0
- package/dist/ui/src/components/ui/alert/alert.js +47 -0
- package/dist/ui/src/components/ui/alert/alert.js.map +1 -0
- package/dist/ui/src/components/ui/alert-dialog/alert-dialog.js +97 -0
- package/dist/ui/src/components/ui/alert-dialog/alert-dialog.js.map +1 -0
- package/dist/ui/src/components/ui/aspect-ratio/aspect-ratio.js +15 -0
- package/dist/ui/src/components/ui/aspect-ratio/aspect-ratio.js.map +1 -0
- package/dist/ui/src/components/ui/attachment/attachment.d.ts +1 -1
- package/dist/ui/src/components/ui/attachment/attachment.js +105 -0
- package/dist/ui/src/components/ui/attachment/attachment.js.map +1 -0
- package/dist/ui/src/components/ui/avatar/avatar.js +51 -0
- package/dist/ui/src/components/ui/avatar/avatar.js.map +1 -0
- package/dist/ui/src/components/ui/badge/badge.d.ts +1 -1
- package/dist/ui/src/components/ui/badge/badge.js +47 -0
- package/dist/ui/src/components/ui/badge/badge.js.map +1 -0
- package/dist/ui/src/components/ui/breadcrumb/breadcrumb.js +73 -0
- package/dist/ui/src/components/ui/breadcrumb/breadcrumb.js.map +1 -0
- package/dist/ui/src/components/ui/bubble/bubble.js +74 -0
- package/dist/ui/src/components/ui/bubble/bubble.js.map +1 -0
- package/dist/ui/src/components/ui/button/button.behavior.test.d.ts +8 -0
- package/dist/ui/src/components/ui/button/button.d.ts +1 -1
- package/dist/ui/src/components/ui/button/button.js +93 -0
- package/dist/ui/src/components/ui/button/button.js.map +1 -0
- package/dist/ui/src/components/ui/button-group/button-group.js +37 -0
- package/dist/ui/src/components/ui/button-group/button-group.js.map +1 -0
- package/dist/ui/src/components/ui/calendar/calendar.behavior.test.d.ts +9 -0
- package/dist/ui/src/components/ui/calendar/calendar.d.ts +1 -1
- package/dist/ui/src/components/ui/calendar/calendar.js +141 -0
- package/dist/ui/src/components/ui/calendar/calendar.js.map +1 -0
- package/dist/ui/src/components/ui/card/card.js +57 -0
- package/dist/ui/src/components/ui/card/card.js.map +1 -0
- package/dist/ui/src/components/ui/carousel/carousel.js +136 -0
- package/dist/ui/src/components/ui/carousel/carousel.js.map +1 -0
- package/dist/ui/src/components/ui/chart/chart.js +168 -0
- package/dist/ui/src/components/ui/chart/chart.js.map +1 -0
- package/dist/ui/src/components/ui/checkbox/checkbox.js +21 -0
- package/dist/ui/src/components/ui/checkbox/checkbox.js.map +1 -0
- package/dist/ui/src/components/ui/collapsible/collapsible.js +26 -0
- package/dist/ui/src/components/ui/collapsible/collapsible.js.map +1 -0
- package/dist/ui/src/components/ui/combobox/combobox.d.ts +15 -1
- package/dist/ui/src/components/ui/combobox/combobox.js +111 -0
- package/dist/ui/src/components/ui/combobox/combobox.js.map +1 -0
- package/dist/ui/src/components/ui/command/command.d.ts +17 -1
- package/dist/ui/src/components/ui/command/command.js +118 -0
- package/dist/ui/src/components/ui/command/command.js.map +1 -0
- package/dist/ui/src/components/ui/context-menu/context-menu.d.ts +1 -1
- package/dist/ui/src/components/ui/context-menu/context-menu.js +145 -0
- package/dist/ui/src/components/ui/context-menu/context-menu.js.map +1 -0
- package/dist/ui/src/components/ui/dialog/dialog.js +94 -0
- package/dist/ui/src/components/ui/dialog/dialog.js.map +1 -0
- package/dist/ui/src/components/ui/direction/direction.js +2 -0
- package/dist/ui/src/components/ui/drawer/drawer.js +88 -0
- package/dist/ui/src/components/ui/drawer/drawer.js.map +1 -0
- package/dist/ui/src/components/ui/dropdown-menu/dropdown-menu.d.ts +12 -1
- package/dist/ui/src/components/ui/dropdown-menu/dropdown-menu.js +159 -0
- package/dist/ui/src/components/ui/dropdown-menu/dropdown-menu.js.map +1 -0
- package/dist/ui/src/components/ui/empty/empty.js +61 -0
- package/dist/ui/src/components/ui/empty/empty.js.map +1 -0
- package/dist/ui/src/components/ui/field/field.js +36 -0
- package/dist/ui/src/components/ui/field/field.js.map +1 -0
- package/dist/ui/src/components/ui/hover-card/hover-card.js +39 -0
- package/dist/ui/src/components/ui/hover-card/hover-card.js.map +1 -0
- package/dist/ui/src/components/ui/indicator/indicator.js +79 -0
- package/dist/ui/src/components/ui/indicator/indicator.js.map +1 -0
- package/dist/ui/src/components/ui/input/input.js +16 -0
- package/dist/ui/src/components/ui/input/input.js.map +1 -0
- package/dist/ui/src/components/ui/input-group/input-group.d.ts +1 -1
- package/dist/ui/src/components/ui/input-group/input-group.js +77 -0
- package/dist/ui/src/components/ui/input-group/input-group.js.map +1 -0
- package/dist/ui/src/components/ui/input-otp/input-otp.js +48 -0
- package/dist/ui/src/components/ui/input-otp/input-otp.js.map +1 -0
- package/dist/ui/src/components/ui/item/item.d.ts +1 -1
- package/dist/ui/src/components/ui/item/item.js +122 -0
- package/dist/ui/src/components/ui/item/item.js.map +1 -0
- package/dist/ui/src/components/ui/kbd/kbd.js +21 -0
- package/dist/ui/src/components/ui/kbd/kbd.js.map +1 -0
- package/dist/ui/src/components/ui/label/label.js +14 -0
- package/dist/ui/src/components/ui/label/label.js.map +1 -0
- package/dist/ui/src/components/ui/marker/marker.js +44 -0
- package/dist/ui/src/components/ui/marker/marker.js.map +1 -0
- package/dist/ui/src/components/ui/menubar/menubar.js +140 -0
- package/dist/ui/src/components/ui/menubar/menubar.js.map +1 -0
- package/dist/ui/src/components/ui/message/message.js +50 -0
- package/dist/ui/src/components/ui/message/message.js.map +1 -0
- package/dist/ui/src/components/ui/message-scroller/message-scroller.js +61 -0
- package/dist/ui/src/components/ui/message-scroller/message-scroller.js.map +1 -0
- package/dist/ui/src/components/ui/native-select/native-select.js +39 -0
- package/dist/ui/src/components/ui/native-select/native-select.js.map +1 -0
- package/dist/ui/src/components/ui/navigation-menu/navigation-menu.js +87 -0
- package/dist/ui/src/components/ui/navigation-menu/navigation-menu.js.map +1 -0
- package/dist/ui/src/components/ui/pagination/pagination.d.ts +3 -2
- package/dist/ui/src/components/ui/pagination/pagination.js +104 -0
- package/dist/ui/src/components/ui/pagination/pagination.js.map +1 -0
- package/dist/ui/src/components/ui/popover/popover.d.ts +1 -1
- package/dist/ui/src/components/ui/popover/popover.js +59 -0
- package/dist/ui/src/components/ui/popover/popover.js.map +1 -0
- package/dist/ui/src/components/ui/progress/progress.behavior.test.d.ts +8 -0
- package/dist/ui/src/components/ui/progress/progress.d.ts +43 -1
- package/dist/ui/src/components/ui/progress/progress.js +70 -0
- package/dist/ui/src/components/ui/progress/progress.js.map +1 -0
- package/dist/ui/src/components/ui/questionnaire/questionnaire.js +171 -0
- package/dist/ui/src/components/ui/questionnaire/questionnaire.js.map +1 -0
- package/dist/ui/src/components/ui/radio-group/radio-group.js +29 -0
- package/dist/ui/src/components/ui/radio-group/radio-group.js.map +1 -0
- package/dist/ui/src/components/ui/resizable/resizable.js +29 -0
- package/dist/ui/src/components/ui/resizable/resizable.js.map +1 -0
- package/dist/ui/src/components/ui/scroll-area/index.d.ts +1 -0
- package/dist/ui/src/components/ui/scroll-area/popup-list-scroll.d.ts +13 -0
- package/dist/ui/src/components/ui/scroll-area/popup-list-scroll.js +69 -0
- package/dist/ui/src/components/ui/scroll-area/popup-list-scroll.js.map +1 -0
- package/dist/ui/src/components/ui/scroll-area/scroll-area.behavior.test.d.ts +12 -0
- package/dist/ui/src/components/ui/scroll-area/scroll-area.d.ts +57 -6
- package/dist/ui/src/components/ui/scroll-area/scroll-area.js +155 -0
- package/dist/ui/src/components/ui/scroll-area/scroll-area.js.map +1 -0
- package/dist/ui/src/components/ui/select/select.js +97 -0
- package/dist/ui/src/components/ui/select/select.js.map +1 -0
- package/dist/ui/src/components/ui/separator/separator.behavior.test.d.ts +14 -0
- package/dist/ui/src/components/ui/separator/separator.d.ts +14 -0
- package/dist/ui/src/components/ui/separator/separator.js +30 -0
- package/dist/ui/src/components/ui/separator/separator.js.map +1 -0
- package/dist/ui/src/components/ui/sheet/sheet.d.ts +8 -0
- package/dist/ui/src/components/ui/sheet/sheet.js +99 -0
- package/dist/ui/src/components/ui/sheet/sheet.js.map +1 -0
- package/dist/ui/src/components/ui/sidebar/sidebar.js +383 -0
- package/dist/ui/src/components/ui/sidebar/sidebar.js.map +1 -0
- package/dist/ui/src/components/ui/skeleton/skeleton.js +14 -0
- package/dist/ui/src/components/ui/skeleton/skeleton.js.map +1 -0
- package/dist/ui/src/components/ui/slider/slider.js +49 -0
- package/dist/ui/src/components/ui/slider/slider.js.map +1 -0
- package/dist/ui/src/components/ui/spinner/spinner.js +28 -0
- package/dist/ui/src/components/ui/spinner/spinner.js.map +1 -0
- package/dist/ui/src/components/ui/switch/switch.js +20 -0
- package/dist/ui/src/components/ui/switch/switch.js.map +1 -0
- package/dist/ui/src/components/ui/table/table.behavior.test.d.ts +4 -5
- package/dist/ui/src/components/ui/table/table.d.ts +15 -1
- package/dist/ui/src/components/ui/table/table.js +81 -0
- package/dist/ui/src/components/ui/table/table.js.map +1 -0
- package/dist/ui/src/components/ui/tabs/tabs.d.ts +9 -8
- package/dist/ui/src/components/ui/tabs/tabs.js +50 -0
- package/dist/ui/src/components/ui/tabs/tabs.js.map +1 -0
- package/dist/ui/src/components/ui/textarea/textarea.js +14 -0
- package/dist/ui/src/components/ui/textarea/textarea.js.map +1 -0
- package/dist/ui/src/components/ui/toast/toast.js +124 -0
- package/dist/ui/src/components/ui/toast/toast.js.map +1 -0
- package/dist/ui/src/components/ui/toggle/toggle.js +37 -0
- package/dist/ui/src/components/ui/toggle/toggle.js.map +1 -0
- package/dist/ui/src/components/ui/toggle-group/toggle-group.js +56 -0
- package/dist/ui/src/components/ui/toggle-group/toggle-group.js.map +1 -0
- package/dist/ui/src/components/ui/tooltip/tooltip.js +43 -0
- package/dist/ui/src/components/ui/tooltip/tooltip.js.map +1 -0
- package/dist/ui/src/hooks/use-media-player.js +140 -0
- package/dist/ui/src/hooks/use-media-player.js.map +1 -0
- package/dist/ui/src/hooks/use-merged-refs.js +18 -0
- package/dist/ui/src/hooks/use-merged-refs.js.map +1 -0
- package/dist/ui/src/hooks/use-mobile.js +20 -0
- package/dist/ui/src/hooks/use-mobile.js.map +1 -0
- package/dist/ui/src/index.d.ts +8 -0
- package/dist/ui/src/lib/first-weekday.d.ts +6 -0
- package/dist/ui/src/lib/first-weekday.js +34 -0
- package/dist/ui/src/lib/first-weekday.js.map +1 -0
- package/dist/ui/src/lib/focus-guards.d.ts +2 -0
- package/dist/ui/src/lib/focus-guards.js +52 -0
- package/dist/ui/src/lib/focus-guards.js.map +1 -0
- package/dist/ui/src/lib/focus-ring.test.d.ts +8 -0
- package/dist/ui/src/lib/popup-list.d.ts +75 -0
- package/dist/ui/src/lib/popup-list.js +48 -0
- package/dist/ui/src/lib/popup-list.js.map +1 -0
- package/dist/ui/src/lib/popup-list.test.d.ts +10 -0
- package/dist/ui/src/lib/utils.js +21 -0
- package/dist/ui/src/lib/utils.js.map +1 -0
- package/package.json +36 -8
- package/dist/chunks/toggle-group-ByNq8g7H.js +0 -4263
- package/dist/chunks/toggle-group-ByNq8g7H.js.map +0 -1
- package/dist/dom/src/context.d.ts +0 -34
- package/dist/dom/src/define-element.d.ts +0 -11
- package/dist/dom/src/field-control.d.ts +0 -5
- package/dist/dom/src/index.d.ts +0 -6
- package/dist/dom/src/mode.d.ts +0 -8
- package/dist/dom/src/styles.d.ts +0 -6
- package/dist/dom/src/theme-state.d.ts +0 -1
- package/dist/dom/src/types.d.ts +0 -65
- package/dist/ds/src/elements.d.ts +0 -12
- package/dist/elements/src/edx-accordion.d.ts +0 -14
- package/dist/elements/src/edx-accordion.test.d.ts +0 -1
- package/dist/elements/src/edx-alert.d.ts +0 -14
- package/dist/elements/src/edx-audio-player.d.ts +0 -11
- package/dist/elements/src/edx-avatar.d.ts +0 -10
- package/dist/elements/src/edx-badge.d.ts +0 -12
- package/dist/elements/src/edx-breadcrumb.d.ts +0 -11
- package/dist/elements/src/edx-button-group.d.ts +0 -7
- package/dist/elements/src/edx-button.d.ts +0 -20
- package/dist/elements/src/edx-calendar.d.ts +0 -21
- package/dist/elements/src/edx-card.d.ts +0 -8
- package/dist/elements/src/edx-checkbox.d.ts +0 -18
- package/dist/elements/src/edx-combobox.d.ts +0 -28
- package/dist/elements/src/edx-content-components.d.ts +0 -2
- package/dist/elements/src/edx-dialog.d.ts +0 -20
- package/dist/elements/src/edx-drawer.d.ts +0 -21
- package/dist/elements/src/edx-dropdown-menu.d.ts +0 -29
- package/dist/elements/src/edx-field.d.ts +0 -9
- package/dist/elements/src/edx-field.test.d.ts +0 -1
- package/dist/elements/src/edx-indicator.d.ts +0 -14
- package/dist/elements/src/edx-input-group.d.ts +0 -32
- package/dist/elements/src/edx-input-otp.d.ts +0 -19
- package/dist/elements/src/edx-input.d.ts +0 -31
- package/dist/elements/src/edx-interactive-components.d.ts +0 -2
- package/dist/elements/src/edx-label.d.ts +0 -6
- package/dist/elements/src/edx-pagination.d.ts +0 -8
- package/dist/elements/src/edx-popover.d.ts +0 -24
- package/dist/elements/src/edx-progress.d.ts +0 -10
- package/dist/elements/src/edx-radio-group.d.ts +0 -22
- package/dist/elements/src/edx-radio-group.test.d.ts +0 -1
- package/dist/elements/src/edx-scroll-area.d.ts +0 -15
- package/dist/elements/src/edx-scroll-area.test.d.ts +0 -1
- package/dist/elements/src/edx-select.d.ts +0 -34
- package/dist/elements/src/edx-separator.d.ts +0 -10
- package/dist/elements/src/edx-skeleton.d.ts +0 -8
- package/dist/elements/src/edx-slider.d.ts +0 -17
- package/dist/elements/src/edx-slider.test.d.ts +0 -1
- package/dist/elements/src/edx-switch.d.ts +0 -18
- package/dist/elements/src/edx-table.d.ts +0 -13
- package/dist/elements/src/edx-table.test.d.ts +0 -1
- package/dist/elements/src/edx-tabs.d.ts +0 -15
- package/dist/elements/src/edx-tabs.test.d.ts +0 -1
- package/dist/elements/src/edx-textarea.d.ts +0 -25
- package/dist/elements/src/edx-toggle-group.d.ts +0 -27
- package/dist/elements/src/edx-toggle-group.test.d.ts +0 -1
- package/dist/elements/src/edx-toggle.d.ts +0 -18
- package/dist/elements/src/edx-tooltip.d.ts +0 -28
- package/dist/elements/src/edx-video-player.d.ts +0 -16
- package/dist/elements/src/field-control-bridge.d.ts +0 -7
- package/dist/elements/src/index.d.ts +0 -14
- package/dist/elements/src/projected-content.test.d.ts +0 -1
- package/dist/elements/src/registry.d.ts +0 -39
- package/dist/elements/src/registry.test.d.ts +0 -1
- package/dist/elements.js +0 -4020
- package/dist/elements.js.map +0 -1
- /package/dist/{dom/src/define-element.test.d.ts → ui/src/components/edyn/date-picker/date-text.test.d.ts} +0 -0
- /package/dist/{dom/src/native-slot.test.d.ts → ui/src/lib/first-weekday.test.d.ts} +0 -0
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
import { cn } from "../../../lib/utils.js";
|
|
2
|
+
import { useExposedFocusGuards } from "../../../lib/focus-guards.js";
|
|
3
|
+
import { POPUP_FRAME_CLASS, POPUP_GROUP_LABEL_CLASS, POPUP_ITEM_INDICATOR_CLASS, POPUP_LAYER_CLASS, POPUP_LIST_WIDTH_CLASS, popupItemClass } from "../../../lib/popup-list.js";
|
|
4
|
+
import { PopupListScroll } from "../scroll-area/popup-list-scroll.js";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
import { IconCheck, IconChevronRight } from "@tabler/icons-react";
|
|
7
|
+
import { Menu } from "@base-ui/react/menu";
|
|
8
|
+
//#region ../ui/src/components/ui/dropdown-menu/dropdown-menu.tsx
|
|
9
|
+
var DropdownMenu = ({ ...props }) => {
|
|
10
|
+
return /* @__PURE__ */ jsx(Menu.Root, {
|
|
11
|
+
"data-slot": "dropdown-menu",
|
|
12
|
+
...props
|
|
13
|
+
});
|
|
14
|
+
};
|
|
15
|
+
var DropdownMenuPortal = ({ ...props }) => {
|
|
16
|
+
return /* @__PURE__ */ jsx(Menu.Portal, {
|
|
17
|
+
"data-slot": "dropdown-menu-portal",
|
|
18
|
+
...props
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
var DropdownMenuTrigger = ({ ...props }) => {
|
|
22
|
+
return /* @__PURE__ */ jsx(Menu.Trigger, {
|
|
23
|
+
"data-slot": "dropdown-menu-trigger",
|
|
24
|
+
...props
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
/**
|
|
28
|
+
* Scrolls inside a DS ScrollArea like the other popup lists, with the bar shown
|
|
29
|
+
* for as long as the menu overflows and a fade on whichever end is cut off.
|
|
30
|
+
*
|
|
31
|
+
* Base UI puts `role="menu"` on this popup itself and offers no inner list part
|
|
32
|
+
* to move it onto, so the ScrollArea sits INSIDE the role. That is only legal
|
|
33
|
+
* because ScrollArea drops the `role="presentation"` Base UI gives its root,
|
|
34
|
+
* viewport and content: a menu may not own presentation wrappers (axe reports
|
|
35
|
+
* a critical aria-required-children violation), but it may own plain divs.
|
|
36
|
+
* e2e/a11y.spec.ts scans the open menu in both themes to keep it that way.
|
|
37
|
+
*/
|
|
38
|
+
var DropdownMenuContent = ({ align = "start", alignOffset = 0, side = "bottom", sideOffset = 4, className, children, ...props }) => {
|
|
39
|
+
useExposedFocusGuards();
|
|
40
|
+
return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, {
|
|
41
|
+
className: cn(POPUP_LAYER_CLASS, "isolate outline-none"),
|
|
42
|
+
align,
|
|
43
|
+
alignOffset,
|
|
44
|
+
side,
|
|
45
|
+
sideOffset,
|
|
46
|
+
children: /* @__PURE__ */ jsx(Menu.Popup, {
|
|
47
|
+
"data-slot": "dropdown-menu-content",
|
|
48
|
+
className: cn("z-50 flex max-h-(--available-height) origin-(--transform-origin) flex-col overflow-hidden duration-100", POPUP_FRAME_CLASS, POPUP_LIST_WIDTH_CLASS, "data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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:overflow-hidden data-closed:fade-out-0 data-closed:zoom-out-95", "motion-reduce:animate-none", className),
|
|
49
|
+
...props,
|
|
50
|
+
children: /* @__PURE__ */ jsx(PopupListScroll, {
|
|
51
|
+
focusable: false,
|
|
52
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
53
|
+
className: "px-1",
|
|
54
|
+
children
|
|
55
|
+
})
|
|
56
|
+
})
|
|
57
|
+
})
|
|
58
|
+
}) });
|
|
59
|
+
};
|
|
60
|
+
var DropdownMenuGroup = ({ ...props }) => {
|
|
61
|
+
return /* @__PURE__ */ jsx(Menu.Group, {
|
|
62
|
+
"data-slot": "dropdown-menu-group",
|
|
63
|
+
...props
|
|
64
|
+
});
|
|
65
|
+
};
|
|
66
|
+
var DropdownMenuLabel = ({ className, inset, ...props }) => {
|
|
67
|
+
return /* @__PURE__ */ jsx(Menu.GroupLabel, {
|
|
68
|
+
"data-slot": "dropdown-menu-label",
|
|
69
|
+
"data-inset": inset,
|
|
70
|
+
className: cn(POPUP_GROUP_LABEL_CLASS, "data-[inset=true]:pl-7", className),
|
|
71
|
+
...props
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
var DropdownMenuItem = ({ className, inset, variant = "default", ...props }) => {
|
|
75
|
+
return /* @__PURE__ */ jsx(Menu.Item, {
|
|
76
|
+
"data-slot": "dropdown-menu-item",
|
|
77
|
+
"data-inset": inset,
|
|
78
|
+
"data-variant": variant,
|
|
79
|
+
className: cn("group/dropdown-menu-item", popupItemClass(), "data-[inset=true]:pl-7", "data-[variant=destructive]:text-destructive data-[variant=destructive]:[&>svg]:text-destructive", "data-[variant=destructive]:data-highlighted:bg-destructive/10 data-[variant=destructive]:data-highlighted:text-destructive", className),
|
|
80
|
+
...props
|
|
81
|
+
});
|
|
82
|
+
};
|
|
83
|
+
var DropdownMenuSub = ({ ...props }) => {
|
|
84
|
+
return /* @__PURE__ */ jsx(Menu.SubmenuRoot, {
|
|
85
|
+
"data-slot": "dropdown-menu-sub",
|
|
86
|
+
...props
|
|
87
|
+
});
|
|
88
|
+
};
|
|
89
|
+
var DropdownMenuSubTrigger = ({ className, inset, children, ...props }) => {
|
|
90
|
+
return /* @__PURE__ */ jsxs(Menu.SubmenuTrigger, {
|
|
91
|
+
"data-slot": "dropdown-menu-sub-trigger",
|
|
92
|
+
"data-inset": inset,
|
|
93
|
+
className: cn(popupItemClass(), "data-[inset=true]:pl-7 data-popup-open:bg-foreground/6 data-popup-open:[&>svg]:text-foreground", className),
|
|
94
|
+
...props,
|
|
95
|
+
children: [children, /* @__PURE__ */ jsx(IconChevronRight, { className: "ml-auto" })]
|
|
96
|
+
});
|
|
97
|
+
};
|
|
98
|
+
var DropdownMenuSubContent = ({ align = "start", alignOffset = -3, side = "right", sideOffset = 0, className, ...props }) => {
|
|
99
|
+
return /* @__PURE__ */ jsx(DropdownMenuContent, {
|
|
100
|
+
"data-slot": "dropdown-menu-sub-content",
|
|
101
|
+
className: cn("shadow-lg", className),
|
|
102
|
+
align,
|
|
103
|
+
alignOffset,
|
|
104
|
+
side,
|
|
105
|
+
sideOffset,
|
|
106
|
+
...props
|
|
107
|
+
});
|
|
108
|
+
};
|
|
109
|
+
var DropdownMenuCheckboxItem = ({ className, children, checked, inset, ...props }) => {
|
|
110
|
+
return /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
|
|
111
|
+
"data-slot": "dropdown-menu-checkbox-item",
|
|
112
|
+
"data-inset": inset,
|
|
113
|
+
className: cn(popupItemClass("base-ui", true), "data-checked:font-medium data-[inset=true]:pl-7", className),
|
|
114
|
+
checked,
|
|
115
|
+
...props,
|
|
116
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
117
|
+
className: POPUP_ITEM_INDICATOR_CLASS,
|
|
118
|
+
"data-slot": "dropdown-menu-checkbox-item-indicator",
|
|
119
|
+
children: /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx(IconCheck, {}) })
|
|
120
|
+
}), children]
|
|
121
|
+
});
|
|
122
|
+
};
|
|
123
|
+
var DropdownMenuRadioGroup = ({ ...props }) => {
|
|
124
|
+
return /* @__PURE__ */ jsx(Menu.RadioGroup, {
|
|
125
|
+
"data-slot": "dropdown-menu-radio-group",
|
|
126
|
+
...props
|
|
127
|
+
});
|
|
128
|
+
};
|
|
129
|
+
var DropdownMenuRadioItem = ({ className, children, inset, ...props }) => {
|
|
130
|
+
return /* @__PURE__ */ jsxs(Menu.RadioItem, {
|
|
131
|
+
"data-slot": "dropdown-menu-radio-item",
|
|
132
|
+
"data-inset": inset,
|
|
133
|
+
className: cn(popupItemClass("base-ui", true), "data-checked:font-medium data-[inset=true]:pl-7", className),
|
|
134
|
+
...props,
|
|
135
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
136
|
+
className: POPUP_ITEM_INDICATOR_CLASS,
|
|
137
|
+
"data-slot": "dropdown-menu-radio-item-indicator",
|
|
138
|
+
children: /* @__PURE__ */ jsx(Menu.RadioItemIndicator, { children: /* @__PURE__ */ jsx(IconCheck, {}) })
|
|
139
|
+
}), children]
|
|
140
|
+
});
|
|
141
|
+
};
|
|
142
|
+
var DropdownMenuSeparator = ({ className, ...props }) => {
|
|
143
|
+
return /* @__PURE__ */ jsx(Menu.Separator, {
|
|
144
|
+
"data-slot": "dropdown-menu-separator",
|
|
145
|
+
className: cn("-mx-1 my-1 h-px bg-border", className),
|
|
146
|
+
...props
|
|
147
|
+
});
|
|
148
|
+
};
|
|
149
|
+
var DropdownMenuShortcut = ({ className, ...props }) => {
|
|
150
|
+
return /* @__PURE__ */ jsx("span", {
|
|
151
|
+
"data-slot": "dropdown-menu-shortcut",
|
|
152
|
+
className: cn("ml-auto text-xs tracking-widest text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground", className),
|
|
153
|
+
...props
|
|
154
|
+
});
|
|
155
|
+
};
|
|
156
|
+
//#endregion
|
|
157
|
+
export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger };
|
|
158
|
+
|
|
159
|
+
//# sourceMappingURL=dropdown-menu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown-menu.js","names":[],"sources":["../../../../../../../ui/src/components/ui/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { useExposedFocusGuards } from '@edyn/ui/lib/focus-guards';\nimport {\n POPUP_FRAME_CLASS,\n POPUP_GROUP_LABEL_CLASS,\n POPUP_ITEM_INDICATOR_CLASS,\n POPUP_LAYER_CLASS,\n POPUP_LIST_WIDTH_CLASS,\n popupItemClass,\n} from '@edyn/ui/lib/popup-list';\nimport { cn } from '@edyn/ui/lib/utils';\nimport { IconCheck, IconChevronRight } from '@tabler/icons-react';\nimport type * as React from 'react';\nimport { PopupListScroll } from '../scroll-area';\n\nexport const DropdownMenu = ({ ...props }: MenuPrimitive.Root.Props) => {\n return <MenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />;\n};\n\nexport const DropdownMenuPortal = ({ ...props }: MenuPrimitive.Portal.Props) => {\n return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />;\n};\n\nexport const DropdownMenuTrigger = ({ ...props }: MenuPrimitive.Trigger.Props) => {\n return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />;\n};\n\n/**\n * Scrolls inside a DS ScrollArea like the other popup lists, with the bar shown\n * for as long as the menu overflows and a fade on whichever end is cut off.\n *\n * Base UI puts `role=\"menu\"` on this popup itself and offers no inner list part\n * to move it onto, so the ScrollArea sits INSIDE the role. That is only legal\n * because ScrollArea drops the `role=\"presentation\"` Base UI gives its root,\n * viewport and content: a menu may not own presentation wrappers (axe reports\n * a critical aria-required-children violation), but it may own plain divs.\n * e2e/a11y.spec.ts scans the open menu in both themes to keep it that way.\n */\nexport const DropdownMenuContent = ({\n align = 'start',\n alignOffset = 0,\n side = 'bottom',\n sideOffset = 4,\n className,\n children,\n ...props\n}: MenuPrimitive.Popup.Props & Pick<MenuPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>) => {\n useExposedFocusGuards();\n return (\n <MenuPrimitive.Portal>\n <MenuPrimitive.Positioner\n className={cn(POPUP_LAYER_CLASS, 'isolate outline-none')}\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n >\n <MenuPrimitive.Popup\n data-slot=\"dropdown-menu-content\"\n className={cn(\n 'z-50 flex max-h-(--available-height) origin-(--transform-origin) flex-col overflow-hidden duration-100',\n POPUP_FRAME_CLASS,\n POPUP_LIST_WIDTH_CLASS,\n 'data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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:overflow-hidden data-closed:fade-out-0 data-closed:zoom-out-95',\n 'motion-reduce:animate-none',\n className,\n )}\n {...props}\n >\n {/* POPUP_LIST_HEIGHT_CLASS caps the element that scrolls at eight rows, or at the whole rows the\n positioner's measured height allows; the air above and below the rows is that class's margin, so the content takes\n no vertical padding. */}\n <PopupListScroll focusable={false}>\n <div className=\"px-1\">{children}</div>\n </PopupListScroll>\n </MenuPrimitive.Popup>\n </MenuPrimitive.Positioner>\n </MenuPrimitive.Portal>\n );\n};\n\nexport const DropdownMenuGroup = ({ ...props }: MenuPrimitive.Group.Props) => {\n return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />;\n};\n\nexport const DropdownMenuLabel = ({\n className,\n inset,\n ...props\n}: MenuPrimitive.GroupLabel.Props & {\n inset?: boolean;\n}) => {\n return (\n <MenuPrimitive.GroupLabel\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(POPUP_GROUP_LABEL_CLASS, 'data-[inset=true]:pl-7', className)}\n {...props}\n />\n );\n};\n\nexport const DropdownMenuItem = ({\n className,\n inset,\n variant = 'default',\n ...props\n}: MenuPrimitive.Item.Props & {\n inset?: boolean;\n variant?: 'default' | 'destructive';\n}) => {\n return (\n <MenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n 'group/dropdown-menu-item',\n popupItemClass(),\n 'data-[inset=true]:pl-7',\n // A destructive item keeps its own colour, and its own highlight with it:\n // the shared translucent one would make it read like any other item.\n 'data-[variant=destructive]:text-destructive data-[variant=destructive]:[&>svg]:text-destructive',\n 'data-[variant=destructive]:data-highlighted:bg-destructive/10 data-[variant=destructive]:data-highlighted:text-destructive',\n className,\n )}\n {...props}\n />\n );\n};\n\nexport const DropdownMenuSub = ({ ...props }: MenuPrimitive.SubmenuRoot.Props) => {\n return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props} />;\n};\n\nexport const DropdownMenuSubTrigger = ({\n className,\n inset,\n children,\n ...props\n}: MenuPrimitive.SubmenuTrigger.Props & {\n inset?: boolean;\n}) => {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n popupItemClass(),\n // An open submenu holds its trigger in the highlight while the pointer is\n // down in its panel.\n 'data-[inset=true]:pl-7 data-popup-open:bg-foreground/6 data-popup-open:[&>svg]:text-foreground',\n className,\n )}\n {...props}\n >\n {children}\n <IconChevronRight className=\"ml-auto\" />\n </MenuPrimitive.SubmenuTrigger>\n );\n};\n\nexport const DropdownMenuSubContent = ({\n align = 'start',\n alignOffset = -3,\n side = 'right',\n sideOffset = 0,\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuContent>) => {\n return (\n <DropdownMenuContent\n data-slot=\"dropdown-menu-sub-content\"\n className={cn('shadow-lg', className)}\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n {...props}\n />\n );\n};\n\nexport const DropdownMenuCheckboxItem = ({\n className,\n children,\n checked,\n inset,\n ...props\n}: MenuPrimitive.CheckboxItem.Props & {\n inset?: boolean;\n}) => {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n data-inset={inset}\n className={cn(popupItemClass('base-ui', true), 'data-checked:font-medium data-[inset=true]:pl-7', className)}\n checked={checked}\n {...props}\n >\n <span className={POPUP_ITEM_INDICATOR_CLASS} data-slot=\"dropdown-menu-checkbox-item-indicator\">\n <MenuPrimitive.CheckboxItemIndicator>\n <IconCheck />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n );\n};\n\nexport const DropdownMenuRadioGroup = ({ ...props }: MenuPrimitive.RadioGroup.Props) => {\n return <MenuPrimitive.RadioGroup data-slot=\"dropdown-menu-radio-group\" {...props} />;\n};\n\nexport const DropdownMenuRadioItem = ({\n className,\n children,\n inset,\n ...props\n}: MenuPrimitive.RadioItem.Props & {\n inset?: boolean;\n}) => {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n data-inset={inset}\n className={cn(popupItemClass('base-ui', true), 'data-checked:font-medium data-[inset=true]:pl-7', className)}\n {...props}\n >\n <span className={POPUP_ITEM_INDICATOR_CLASS} data-slot=\"dropdown-menu-radio-item-indicator\">\n <MenuPrimitive.RadioItemIndicator>\n <IconCheck />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n );\n};\n\nexport const DropdownMenuSeparator = ({ className, ...props }: MenuPrimitive.Separator.Props) => {\n return <MenuPrimitive.Separator data-slot=\"dropdown-menu-separator\" className={cn('-mx-1 my-1 h-px bg-border', className)} {...props} />;\n};\n\nexport const DropdownMenuShortcut = ({ className, ...props }: React.ComponentProps<'span'>) => {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn('ml-auto text-xs tracking-widest text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground', className)}\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;;;AAeA,IAAa,gBAAgB,EAAE,GAAG,YAAsC;CACtE,OAAO,oBAAC,KAAc,MAAf;EAAoB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACnE;AAEA,IAAa,sBAAsB,EAAE,GAAG,YAAwC;CAC9E,OAAO,oBAAC,KAAc,QAAf;EAAsB,aAAU;EAAuB,GAAI;CAAQ,CAAA;AAC5E;AAEA,IAAa,uBAAuB,EAAE,GAAG,YAAyC;CAChF,OAAO,oBAAC,KAAc,SAAf;EAAuB,aAAU;EAAwB,GAAI;CAAQ,CAAA;AAC9E;;;;;;;;;;;;AAaA,IAAa,uBAAuB,EAClC,QAAQ,SACR,cAAc,GACd,OAAO,UACP,aAAa,GACb,WACA,UACA,GAAG,YACoH;CACvH,sBAAsB;CACtB,OACE,oBAAC,KAAc,QAAf,EAAA,UACE,oBAAC,KAAc,YAAf;EACE,WAAW,GAAG,mBAAmB,sBAAsB;EAChD;EACM;EACP;EACM;EAEZ,UAAA,oBAAC,KAAc,OAAf;GACE,aAAU;GACV,WAAW,GACT,0GACA,mBACA,wBACA,2ZACA,8BACA,SACF;GACA,GAAI;GAKJ,UAAA,oBAAC,iBAAD;IAAiB,WAAW;IAC1B,UAAA,oBAAC,OAAD;KAAK,WAAU;KAAQ;IAAc,CAAA;GACtB,CAAA;EACE,CAAA;CACG,CAAA,EACN,CAAA;AAE1B;AAEA,IAAa,qBAAqB,EAAE,GAAG,YAAuC;CAC5E,OAAO,oBAAC,KAAc,OAAf;EAAqB,aAAU;EAAsB,GAAI;CAAQ,CAAA;AAC1E;AAEA,IAAa,qBAAqB,EAChC,WACA,OACA,GAAG,YAGC;CACJ,OACE,oBAAC,KAAc,YAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,yBAAyB,0BAA0B,SAAS;EAC1E,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,oBAAoB,EAC/B,WACA,OACA,UAAU,WACV,GAAG,YAIC;CACJ,OACE,oBAAC,KAAc,MAAf;EACE,aAAU;EACV,cAAY;EACZ,gBAAc;EACd,WAAW,GACT,4BACA,eAAe,GACf,0BAGA,mGACA,8HACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,mBAAmB,EAAE,GAAG,YAA6C;CAChF,OAAO,oBAAC,KAAc,aAAf;EAA2B,aAAU;EAAoB,GAAI;CAAQ,CAAA;AAC9E;AAEA,IAAa,0BAA0B,EACrC,WACA,OACA,UACA,GAAG,YAGC;CACJ,OACE,qBAAC,KAAc,gBAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GACT,eAAe,GAGf,kGACA,SACF;EACA,GAAI;EAVN,UAAA,CAYG,UACD,oBAAC,kBAAD,EAAkB,WAAU,UAAW,CAAA,CACX;;AAElC;AAEA,IAAa,0BAA0B,EACrC,QAAQ,SACR,cAAc,IACd,OAAO,SACP,aAAa,GACb,WACA,GAAG,YACmD;CACtD,OACE,oBAAC,qBAAD;EACE,aAAU;EACV,WAAW,GAAG,aAAa,SAAS;EAC7B;EACM;EACP;EACM;EACZ,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,4BAA4B,EACvC,WACA,UACA,SACA,OACA,GAAG,YAGC;CACJ,OACE,qBAAC,KAAc,cAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,eAAe,WAAW,IAAI,GAAG,mDAAmD,SAAS;EAClG;EACT,GAAI;EALN,UAAA,CAOE,oBAAC,QAAD;GAAM,WAAW;GAA4B,aAAU;GACrD,UAAA,oBAAC,KAAc,uBAAf,EAAA,UACE,oBAAC,WAAD,CAAY,CAAA,EACuB,CAAA;EACjC,CAAA,GACL,QACyB;;AAEhC;AAEA,IAAa,0BAA0B,EAAE,GAAG,YAA4C;CACtF,OAAO,oBAAC,KAAc,YAAf;EAA0B,aAAU;EAA4B,GAAI;CAAQ,CAAA;AACrF;AAEA,IAAa,yBAAyB,EACpC,WACA,UACA,OACA,GAAG,YAGC;CACJ,OACE,qBAAC,KAAc,WAAf;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,eAAe,WAAW,IAAI,GAAG,mDAAmD,SAAS;EAC3G,GAAI;EAJN,UAAA,CAME,oBAAC,QAAD;GAAM,WAAW;GAA4B,aAAU;GACrD,UAAA,oBAAC,KAAc,oBAAf,EAAA,UACE,oBAAC,WAAD,CAAY,CAAA,EACoB,CAAA;EAC9B,CAAA,GACL,QACsB;;AAE7B;AAEA,IAAa,yBAAyB,EAAE,WAAW,GAAG,YAA2C;CAC/F,OAAO,oBAAC,KAAc,WAAf;EAAyB,aAAU;EAA0B,WAAW,GAAG,6BAA6B,SAAS;EAAG,GAAI;CAAQ,CAAA;AACzI;AAEA,IAAa,wBAAwB,EAAE,WAAW,GAAG,YAA0C;CAC7F,OACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GAAG,+GAA+G,SAAS;EACtI,GAAI;CACL,CAAA;AAEL"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { cn } from "../../../lib/utils.js";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
//#region ../ui/src/components/ui/empty/empty.tsx
|
|
5
|
+
var Empty = ({ className, ...props }) => {
|
|
6
|
+
return /* @__PURE__ */ jsx("div", {
|
|
7
|
+
"data-slot": "empty",
|
|
8
|
+
className: cn("flex w-full min-w-0 flex-1 flex-col items-center justify-center gap-4 rounded-xl border-dashed p-6 text-center text-balance", className),
|
|
9
|
+
...props
|
|
10
|
+
});
|
|
11
|
+
};
|
|
12
|
+
var EmptyHeader = ({ className, ...props }) => {
|
|
13
|
+
return /* @__PURE__ */ jsx("div", {
|
|
14
|
+
"data-slot": "empty-header",
|
|
15
|
+
className: cn("flex max-w-sm flex-col items-center gap-2", className),
|
|
16
|
+
...props
|
|
17
|
+
});
|
|
18
|
+
};
|
|
19
|
+
var emptyMediaVariants = cva("mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", {
|
|
20
|
+
variants: { variant: {
|
|
21
|
+
default: "bg-transparent",
|
|
22
|
+
icon: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-4"
|
|
23
|
+
} },
|
|
24
|
+
defaultVariants: { variant: "default" }
|
|
25
|
+
});
|
|
26
|
+
var EmptyMedia = ({ className, variant = "default", ...props }) => {
|
|
27
|
+
return /* @__PURE__ */ jsx("div", {
|
|
28
|
+
"data-slot": "empty-icon",
|
|
29
|
+
"data-variant": variant,
|
|
30
|
+
className: cn(emptyMediaVariants({
|
|
31
|
+
variant,
|
|
32
|
+
className
|
|
33
|
+
})),
|
|
34
|
+
...props
|
|
35
|
+
});
|
|
36
|
+
};
|
|
37
|
+
var EmptyTitle = ({ className, ...props }) => {
|
|
38
|
+
return /* @__PURE__ */ jsx("div", {
|
|
39
|
+
"data-slot": "empty-title",
|
|
40
|
+
className: cn("font-heading text-sm font-medium tracking-tight", className),
|
|
41
|
+
...props
|
|
42
|
+
});
|
|
43
|
+
};
|
|
44
|
+
var EmptyDescription = ({ className, ...props }) => {
|
|
45
|
+
return /* @__PURE__ */ jsx("div", {
|
|
46
|
+
"data-slot": "empty-description",
|
|
47
|
+
className: cn("text-sm/6 text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
|
|
48
|
+
...props
|
|
49
|
+
});
|
|
50
|
+
};
|
|
51
|
+
var EmptyContent = ({ className, ...props }) => {
|
|
52
|
+
return /* @__PURE__ */ jsx("div", {
|
|
53
|
+
"data-slot": "empty-content",
|
|
54
|
+
className: cn("flex w-full max-w-sm min-w-0 flex-col items-center gap-2.5 text-sm text-balance", className),
|
|
55
|
+
...props
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
//#endregion
|
|
59
|
+
export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle };
|
|
60
|
+
|
|
61
|
+
//# sourceMappingURL=empty.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"empty.js","names":[],"sources":["../../../../../../../ui/src/components/ui/empty/empty.tsx"],"sourcesContent":["import { cn } from '@edyn/ui/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nexport const Empty = ({ className, ...props }: React.ComponentProps<'div'>) => {\n return (\n <div\n data-slot=\"empty\"\n className={cn(\n 'flex w-full min-w-0 flex-1 flex-col items-center justify-center gap-4 rounded-xl border-dashed p-6 text-center text-balance',\n className,\n )}\n {...props}\n />\n );\n};\n\nexport const EmptyHeader = ({ className, ...props }: React.ComponentProps<'div'>) => {\n return <div data-slot=\"empty-header\" className={cn('flex max-w-sm flex-col items-center gap-2', className)} {...props} />;\n};\n\nconst emptyMediaVariants = cva('mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0', {\n variants: {\n variant: {\n default: 'bg-transparent',\n icon: \"flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-4\",\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n});\n\nexport const EmptyMedia = ({ className, variant = 'default', ...props }: React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>) => {\n return <div data-slot=\"empty-icon\" data-variant={variant} className={cn(emptyMediaVariants({ variant, className }))} {...props} />;\n};\n\nexport const EmptyTitle = ({ className, ...props }: React.ComponentProps<'div'>) => {\n return <div data-slot=\"empty-title\" className={cn('font-heading text-sm font-medium tracking-tight', className)} {...props} />;\n};\n\nexport const EmptyDescription = ({ className, ...props }: React.ComponentProps<'p'>) => {\n return (\n <div\n data-slot=\"empty-description\"\n className={cn('text-sm/6 text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary', className)}\n {...props}\n />\n );\n};\n\nexport const EmptyContent = ({ className, ...props }: React.ComponentProps<'div'>) => {\n return (\n <div\n data-slot=\"empty-content\"\n className={cn('flex w-full max-w-sm min-w-0 flex-col items-center gap-2.5 text-sm text-balance', className)}\n {...props}\n />\n );\n};\n"],"mappings":";;;;AAGA,IAAa,SAAS,EAAE,WAAW,GAAG,YAAyC;CAC7E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,+HACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,eAAe,EAAE,WAAW,GAAG,YAAyC;CACnF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,GAAG,6CAA6C,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC1H;AAEA,IAAM,qBAAqB,IAAI,+FAA+F;CAC5H,UAAU,EACR,SAAS;EACP,SAAS;EACT,MAAM;CACR,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,IAAa,cAAc,EAAE,WAAW,UAAU,WAAW,GAAG,YAAmF;CACjJ,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAa,gBAAc;EAAS,WAAW,GAAG,mBAAmB;GAAE;GAAS;EAAU,CAAC,CAAC;EAAG,GAAI;CAAQ,CAAA;AACnI;AAEA,IAAa,cAAc,EAAE,WAAW,GAAG,YAAyC;CAClF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAc,WAAW,GAAG,mDAAmD,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC/H;AAEA,IAAa,oBAAoB,EAAE,WAAW,GAAG,YAAuC;CACtF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,qGAAqG,SAAS;EAC5H,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,gBAAgB,EAAE,WAAW,GAAG,YAAyC;CACpF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mFAAmF,SAAS;EAC1G,GAAI;CACL,CAAA;AAEL"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { cn } from "../../../lib/utils.js";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Field } from "@base-ui/react/field";
|
|
4
|
+
//#region ../ui/src/components/ui/field/field.tsx
|
|
5
|
+
var Field$1 = ({ className, ...props }) => {
|
|
6
|
+
return /* @__PURE__ */ jsx(Field.Root, {
|
|
7
|
+
"data-slot": "field",
|
|
8
|
+
className: cn("group/field flex flex-col gap-2", className),
|
|
9
|
+
...props
|
|
10
|
+
});
|
|
11
|
+
};
|
|
12
|
+
var FieldLabel = ({ className, ...props }) => {
|
|
13
|
+
return /* @__PURE__ */ jsx(Field.Label, {
|
|
14
|
+
"data-slot": "field-label",
|
|
15
|
+
className: cn("flex items-center gap-2 text-sm leading-5 font-medium select-none data-disabled:pointer-events-none data-disabled:text-muted-foreground", className),
|
|
16
|
+
...props
|
|
17
|
+
});
|
|
18
|
+
};
|
|
19
|
+
var FieldDescription = ({ className, ...props }) => {
|
|
20
|
+
return /* @__PURE__ */ jsx(Field.Description, {
|
|
21
|
+
"data-slot": "field-description",
|
|
22
|
+
className: cn("text-sm text-muted-foreground", className),
|
|
23
|
+
...props
|
|
24
|
+
});
|
|
25
|
+
};
|
|
26
|
+
var FieldError = ({ className, ...props }) => {
|
|
27
|
+
return /* @__PURE__ */ jsx(Field.Error, {
|
|
28
|
+
"data-slot": "field-error",
|
|
29
|
+
className: cn("text-sm text-destructive", className),
|
|
30
|
+
...props
|
|
31
|
+
});
|
|
32
|
+
};
|
|
33
|
+
//#endregion
|
|
34
|
+
export { Field$1 as Field, FieldDescription, FieldError, FieldLabel };
|
|
35
|
+
|
|
36
|
+
//# sourceMappingURL=field.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"field.js","names":[],"sources":["../../../../../../../ui/src/components/ui/field/field.tsx"],"sourcesContent":["import { Field as FieldPrimitive } from '@base-ui/react/field';\nimport { cn } from '@edyn/ui/lib/utils';\n\nexport const Field = ({ className, ...props }: FieldPrimitive.Root.Props) => {\n return <FieldPrimitive.Root data-slot=\"field\" className={cn('group/field flex flex-col gap-2', className)} {...props} />;\n};\n\nexport const FieldLabel = ({ className, ...props }: FieldPrimitive.Label.Props) => {\n return (\n <FieldPrimitive.Label\n data-slot=\"field-label\"\n className={cn(\n // Dimmed only when the Field itself is disabled (data-disabled), and in the muted text colour, not at half opacity, so it still reads at 4.5:1.\n 'flex items-center gap-2 text-sm leading-5 font-medium select-none data-disabled:pointer-events-none data-disabled:text-muted-foreground',\n className,\n )}\n {...props}\n />\n );\n};\n\nexport const FieldDescription = ({ className, ...props }: FieldPrimitive.Description.Props) => {\n return <FieldPrimitive.Description data-slot=\"field-description\" className={cn('text-sm text-muted-foreground', className)} {...props} />;\n};\n\nexport const FieldError = ({ className, ...props }: FieldPrimitive.Error.Props) => {\n return <FieldPrimitive.Error data-slot=\"field-error\" className={cn('text-sm text-destructive', className)} {...props} />;\n};\n"],"mappings":";;;;AAGA,IAAa,WAAS,EAAE,WAAW,GAAG,YAAuC;CAC3E,OAAO,oBAAC,MAAe,MAAhB;EAAqB,aAAU;EAAQ,WAAW,GAAG,mCAAmC,SAAS;EAAG,GAAI;CAAQ,CAAA;AACzH;AAEA,IAAa,cAAc,EAAE,WAAW,GAAG,YAAwC;CACjF,OACE,oBAAC,MAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAET,2IACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,oBAAoB,EAAE,WAAW,GAAG,YAA8C;CAC7F,OAAO,oBAAC,MAAe,aAAhB;EAA4B,aAAU;EAAoB,WAAW,GAAG,iCAAiC,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC1I;AAEA,IAAa,cAAc,EAAE,WAAW,GAAG,YAAwC;CACjF,OAAO,oBAAC,MAAe,OAAhB;EAAsB,aAAU;EAAc,WAAW,GAAG,4BAA4B,SAAS;EAAG,GAAI;CAAQ,CAAA;AACzH"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "../../../lib/utils.js";
|
|
3
|
+
import { POPUP_LAYER_CLASS } from "../../../lib/popup-list.js";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { PreviewCard } from "@base-ui/react/preview-card";
|
|
6
|
+
//#region ../ui/src/components/ui/hover-card/hover-card.tsx
|
|
7
|
+
var HoverCard = ({ ...props }) => {
|
|
8
|
+
return /* @__PURE__ */ jsx(PreviewCard.Root, {
|
|
9
|
+
"data-slot": "hover-card",
|
|
10
|
+
...props
|
|
11
|
+
});
|
|
12
|
+
};
|
|
13
|
+
var HoverCardTrigger = ({ ...props }) => {
|
|
14
|
+
return /* @__PURE__ */ jsx(PreviewCard.Trigger, {
|
|
15
|
+
"data-slot": "hover-card-trigger",
|
|
16
|
+
...props
|
|
17
|
+
});
|
|
18
|
+
};
|
|
19
|
+
var HoverCardContent = ({ className, side = "bottom", sideOffset = 4, align = "center", alignOffset = 4, ...props }) => {
|
|
20
|
+
return /* @__PURE__ */ jsx(PreviewCard.Portal, {
|
|
21
|
+
"data-slot": "hover-card-portal",
|
|
22
|
+
children: /* @__PURE__ */ jsx(PreviewCard.Positioner, {
|
|
23
|
+
align,
|
|
24
|
+
alignOffset,
|
|
25
|
+
side,
|
|
26
|
+
sideOffset,
|
|
27
|
+
className: cn(POPUP_LAYER_CLASS, "isolate"),
|
|
28
|
+
children: /* @__PURE__ */ jsx(PreviewCard.Popup, {
|
|
29
|
+
"data-slot": "hover-card-content",
|
|
30
|
+
className: cn("z-50 w-64 origin-(--transform-origin) rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 motion-reduce:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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),
|
|
31
|
+
...props
|
|
32
|
+
})
|
|
33
|
+
})
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
//#endregion
|
|
37
|
+
export { HoverCard, HoverCardContent, HoverCardTrigger };
|
|
38
|
+
|
|
39
|
+
//# sourceMappingURL=hover-card.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hover-card.js","names":[],"sources":["../../../../../../../ui/src/components/ui/hover-card/hover-card.tsx"],"sourcesContent":["'use client';\n\nimport { PreviewCard as PreviewCardPrimitive } from '@base-ui/react/preview-card';\nimport { POPUP_LAYER_CLASS } from '@edyn/ui/lib/popup-list';\nimport { cn } from '@edyn/ui/lib/utils';\n\nexport const HoverCard = ({ ...props }: PreviewCardPrimitive.Root.Props) => {\n return <PreviewCardPrimitive.Root data-slot=\"hover-card\" {...props} />;\n};\n\nexport const HoverCardTrigger = ({ ...props }: PreviewCardPrimitive.Trigger.Props) => {\n return <PreviewCardPrimitive.Trigger data-slot=\"hover-card-trigger\" {...props} />;\n};\n\nexport const HoverCardContent = ({\n className,\n side = 'bottom',\n sideOffset = 4,\n align = 'center',\n alignOffset = 4,\n ...props\n}: PreviewCardPrimitive.Popup.Props & Pick<PreviewCardPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>) => {\n return (\n <PreviewCardPrimitive.Portal data-slot=\"hover-card-portal\">\n <PreviewCardPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n className={cn(POPUP_LAYER_CLASS, 'isolate')}\n >\n <PreviewCardPrimitive.Popup\n data-slot=\"hover-card-content\"\n className={cn(\n 'z-50 w-64 origin-(--transform-origin) rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 motion-reduce:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 </PreviewCardPrimitive.Positioner>\n </PreviewCardPrimitive.Portal>\n );\n};\n"],"mappings":";;;;;;AAMA,IAAa,aAAa,EAAE,GAAG,YAA6C;CAC1E,OAAO,oBAAC,YAAqB,MAAtB;EAA2B,aAAU;EAAa,GAAI;CAAQ,CAAA;AACvE;AAEA,IAAa,oBAAoB,EAAE,GAAG,YAAgD;CACpF,OAAO,oBAAC,YAAqB,SAAtB;EAA8B,aAAU;EAAqB,GAAI;CAAQ,CAAA;AAClF;AAEA,IAAa,oBAAoB,EAC/B,WACA,OAAO,UACP,aAAa,GACb,QAAQ,UACR,cAAc,GACd,GAAG,YACkI;CACrI,OACE,oBAAC,YAAqB,QAAtB;EAA6B,aAAU;EACrC,UAAA,oBAAC,YAAqB,YAAtB;GACS;GACM;GACP;GACM;GACZ,WAAW,GAAG,mBAAmB,SAAS;GAE1C,UAAA,oBAAC,YAAqB,OAAtB;IACE,aAAU;IACV,WAAW,GACT,4jBACA,SACF;IACA,GAAI;GACL,CAAA;EAC8B,CAAA;CACN,CAAA;AAEjC"}
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { cn } from "../../../lib/utils.js";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
//#region ../ui/src/components/ui/indicator/indicator.tsx
|
|
5
|
+
/**
|
|
6
|
+
* Indicator: notification count-bubble or status-dot that attaches to a corner
|
|
7
|
+
* of another element (the Material/Angular "badge" concept; our Badge is the
|
|
8
|
+
* label chip). The parent element must be position-relative (e.g. `relative`).
|
|
9
|
+
*
|
|
10
|
+
* Legacy mapping: `edynBadge` directive -> `Indicator` default/destructive;
|
|
11
|
+
* `edyn-dot` -> `Indicator` dot variant.
|
|
12
|
+
* Positioning uses Radix vocabulary: side (top|bottom) + align (start|end).
|
|
13
|
+
*/
|
|
14
|
+
var indicatorVariants = cva("absolute z-10 inline-flex shrink-0 items-center justify-center font-medium leading-none ring-2 ring-background", {
|
|
15
|
+
variants: {
|
|
16
|
+
variant: {
|
|
17
|
+
/** Count bubble: primary colors, shows children as the count/text. */
|
|
18
|
+
default: "h-4 min-w-4 rounded-full bg-primary px-1 text-xs tabular-nums text-primary-foreground",
|
|
19
|
+
/** Status dot: solid circle, no children rendered. */
|
|
20
|
+
dot: "size-2 rounded-full bg-primary",
|
|
21
|
+
/** Count bubble in destructive (error/alert) colors. */
|
|
22
|
+
destructive: "h-4 min-w-4 rounded-full bg-destructive px-1 text-xs text-destructive-foreground tabular-nums dark:text-background"
|
|
23
|
+
},
|
|
24
|
+
side: {
|
|
25
|
+
top: "top-0",
|
|
26
|
+
bottom: "bottom-0"
|
|
27
|
+
},
|
|
28
|
+
align: {
|
|
29
|
+
start: "left-0",
|
|
30
|
+
end: "right-0"
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
compoundVariants: [
|
|
34
|
+
{
|
|
35
|
+
side: "top",
|
|
36
|
+
align: "start",
|
|
37
|
+
class: "-translate-x-1/2 -translate-y-1/2"
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
side: "top",
|
|
41
|
+
align: "end",
|
|
42
|
+
class: "translate-x-1/2 -translate-y-1/2"
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
side: "bottom",
|
|
46
|
+
align: "start",
|
|
47
|
+
class: "-translate-x-1/2 translate-y-1/2"
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
side: "bottom",
|
|
51
|
+
align: "end",
|
|
52
|
+
class: "translate-x-1/2 translate-y-1/2"
|
|
53
|
+
}
|
|
54
|
+
],
|
|
55
|
+
defaultVariants: {
|
|
56
|
+
variant: "default",
|
|
57
|
+
side: "top",
|
|
58
|
+
align: "end"
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
var Indicator = ({ className, variant = "default", side = "top", align = "end", children, ...props }) => {
|
|
62
|
+
return /* @__PURE__ */ jsx("span", {
|
|
63
|
+
"data-slot": "indicator",
|
|
64
|
+
"data-variant": variant,
|
|
65
|
+
"data-side": side,
|
|
66
|
+
"data-align": align,
|
|
67
|
+
className: cn(indicatorVariants({
|
|
68
|
+
variant,
|
|
69
|
+
side,
|
|
70
|
+
align
|
|
71
|
+
}), className),
|
|
72
|
+
...props,
|
|
73
|
+
children: variant !== "dot" ? children : null
|
|
74
|
+
});
|
|
75
|
+
};
|
|
76
|
+
//#endregion
|
|
77
|
+
export { Indicator, indicatorVariants };
|
|
78
|
+
|
|
79
|
+
//# sourceMappingURL=indicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"indicator.js","names":[],"sources":["../../../../../../../ui/src/components/ui/indicator/indicator.tsx"],"sourcesContent":["/**\n * Indicator: notification count-bubble or status-dot that attaches to a corner\n * of another element (the Material/Angular \"badge\" concept; our Badge is the\n * label chip). The parent element must be position-relative (e.g. `relative`).\n *\n * Legacy mapping: `edynBadge` directive -> `Indicator` default/destructive;\n * `edyn-dot` -> `Indicator` dot variant.\n * Positioning uses Radix vocabulary: side (top|bottom) + align (start|end).\n */\nimport { cn } from '@edyn/ui/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type { ComponentProps } from 'react';\n\nexport const indicatorVariants = cva(\n 'absolute z-10 inline-flex shrink-0 items-center justify-center font-medium leading-none ring-2 ring-background',\n {\n variants: {\n variant: {\n /** Count bubble: primary colors, shows children as the count/text. */\n default: 'h-4 min-w-4 rounded-full bg-primary px-1 text-xs tabular-nums text-primary-foreground',\n /** Status dot: solid circle, no children rendered. */\n dot: 'size-2 rounded-full bg-primary',\n /** Count bubble in destructive (error/alert) colors. */\n destructive: 'h-4 min-w-4 rounded-full bg-destructive px-1 text-xs text-destructive-foreground tabular-nums dark:text-background',\n },\n side: {\n top: 'top-0',\n bottom: 'bottom-0',\n },\n align: {\n start: 'left-0',\n end: 'right-0',\n },\n },\n compoundVariants: [\n {\n side: 'top',\n align: 'start',\n class: '-translate-x-1/2 -translate-y-1/2',\n },\n {\n side: 'top',\n align: 'end',\n class: 'translate-x-1/2 -translate-y-1/2',\n },\n {\n side: 'bottom',\n align: 'start',\n class: '-translate-x-1/2 translate-y-1/2',\n },\n {\n side: 'bottom',\n align: 'end',\n class: 'translate-x-1/2 translate-y-1/2',\n },\n ],\n defaultVariants: {\n variant: 'default',\n side: 'top',\n align: 'end',\n },\n },\n);\n\nexport type TIndicatorVariantProps = VariantProps<typeof indicatorVariants>;\n\nexport type TIndicatorProps = ComponentProps<'span'> & TIndicatorVariantProps;\n\nexport const Indicator = ({ className, variant = 'default', side = 'top', align = 'end', children, ...props }: TIndicatorProps) => {\n return (\n <span\n data-slot=\"indicator\"\n data-variant={variant}\n data-side={side}\n data-align={align}\n className={cn(indicatorVariants({ variant, side, align }), className)}\n {...props}\n >\n {variant !== 'dot' ? children : null}\n </span>\n );\n};\n"],"mappings":";;;;;;;;;;;;;AAaA,IAAa,oBAAoB,IAC/B,kHACA;CACE,UAAU;EACR,SAAS;;GAEP,SAAS;;GAET,KAAK;;GAEL,aAAa;EACf;EACA,MAAM;GACJ,KAAK;GACL,QAAQ;EACV;EACA,OAAO;GACL,OAAO;GACP,KAAK;EACP;CACF;CACA,kBAAkB;EAChB;GACE,MAAM;GACN,OAAO;GACP,OAAO;EACT;EACA;GACE,MAAM;GACN,OAAO;GACP,OAAO;EACT;EACA;GACE,MAAM;GACN,OAAO;GACP,OAAO;EACT;EACA;GACE,MAAM;GACN,OAAO;GACP,OAAO;EACT;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,OAAO;CACT;AACF,CACF;AAMA,IAAa,aAAa,EAAE,WAAW,UAAU,WAAW,OAAO,OAAO,QAAQ,OAAO,UAAU,GAAG,YAA6B;CACjI,OACE,oBAAC,QAAD;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,cAAY;EACZ,WAAW,GAAG,kBAAkB;GAAE;GAAS;GAAM;EAAM,CAAC,GAAG,SAAS;EACpE,GAAI;EAEH,UAAA,YAAY,QAAQ,WAAW;CAC5B,CAAA;AAEV"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { cn } from "../../../lib/utils.js";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Input } from "@base-ui/react/input";
|
|
4
|
+
//#region ../ui/src/components/ui/input/input.tsx
|
|
5
|
+
var Input$1 = ({ className, type, ...props }) => {
|
|
6
|
+
return /* @__PURE__ */ jsx(Input, {
|
|
7
|
+
type,
|
|
8
|
+
"data-slot": "input",
|
|
9
|
+
className: cn("h-8 w-full min-w-0 rounded-lg border border-control bg-transparent px-2.5 py-1 text-base transition-colors outline-none 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:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", className),
|
|
10
|
+
...props
|
|
11
|
+
});
|
|
12
|
+
};
|
|
13
|
+
//#endregion
|
|
14
|
+
export { Input$1 as Input };
|
|
15
|
+
|
|
16
|
+
//# sourceMappingURL=input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input.js","names":[],"sources":["../../../../../../../ui/src/components/ui/input/input.tsx"],"sourcesContent":["import { Input as InputPrimitive } from '@base-ui/react/input';\nimport { cn } from '@edyn/ui/lib/utils';\nimport type * as React from 'react';\n\nexport const Input = ({ className, type, ...props }: React.ComponentProps<'input'>) => {\n return (\n <InputPrimitive\n type={type}\n data-slot=\"input\"\n className={cn(\n 'h-8 w-full min-w-0 rounded-lg border border-control bg-transparent px-2.5 py-1 text-base transition-colors outline-none 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:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',\n className,\n )}\n {...props}\n />\n );\n};\n"],"mappings":";;;;AAIA,IAAa,WAAS,EAAE,WAAW,MAAM,GAAG,YAA2C;CACrF,OACE,oBAAC,OAAD;EACQ;EACN,aAAU;EACV,WAAW,GACT,ukBACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
|
|
@@ -6,7 +6,7 @@ export interface IInputGroupProps extends React.ComponentProps<'div'> {
|
|
|
6
6
|
export declare const InputGroup: ({ className, ...props }: IInputGroupProps) => React.JSX.Element;
|
|
7
7
|
export type TInputGroupAddonAlign = 'inline-start' | 'inline-end' | 'block-start' | 'block-end';
|
|
8
8
|
declare const inputGroupAddonVariants: (props?: ({
|
|
9
|
-
align?: "inline-
|
|
9
|
+
align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
|
|
10
10
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
11
11
|
export interface IInputGroupAddonProps extends React.ComponentProps<'div'>, VariantProps<typeof inputGroupAddonVariants> {
|
|
12
12
|
}
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import { cn } from "../../../lib/utils.js";
|
|
2
|
+
import { Button } from "../button/button.js";
|
|
3
|
+
import { Input } from "../input/input.js";
|
|
4
|
+
import { Textarea } from "../textarea/textarea.js";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
|
+
import { cva } from "class-variance-authority";
|
|
7
|
+
//#region ../ui/src/components/ui/input-group/input-group.tsx
|
|
8
|
+
var InputGroup = ({ className, ...props }) => {
|
|
9
|
+
return /* @__PURE__ */ jsx("div", {
|
|
10
|
+
"data-slot": "input-group",
|
|
11
|
+
className: cn("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-control transition-colors outline-none", "has-disabled:bg-input/50 has-disabled:opacity-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 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]]: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", "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),
|
|
12
|
+
...props
|
|
13
|
+
});
|
|
14
|
+
};
|
|
15
|
+
var inputGroupAddonVariants = cva("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-foreground/70 select-none [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
|
|
16
|
+
variants: { align: {
|
|
17
|
+
"inline-start": "order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
|
|
18
|
+
"inline-end": "order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]",
|
|
19
|
+
"block-start": "order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2",
|
|
20
|
+
"block-end": "order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2"
|
|
21
|
+
} },
|
|
22
|
+
defaultVariants: { align: "inline-start" }
|
|
23
|
+
});
|
|
24
|
+
var InputGroupAddon = ({ className, align = "inline-start", ...props }) => {
|
|
25
|
+
return /* @__PURE__ */ jsx("div", {
|
|
26
|
+
"data-slot": "input-group-addon",
|
|
27
|
+
"data-align": align,
|
|
28
|
+
className: cn(inputGroupAddonVariants({ align }), className),
|
|
29
|
+
onPointerDown: (event) => {
|
|
30
|
+
if (event.target.closest("button")) return;
|
|
31
|
+
event.currentTarget.parentElement?.querySelector("input")?.focus();
|
|
32
|
+
},
|
|
33
|
+
...props
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
var inputGroupButtonVariants = cva("flex items-center gap-2 text-sm shadow-none", {
|
|
37
|
+
variants: { size: {
|
|
38
|
+
xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
|
|
39
|
+
sm: "",
|
|
40
|
+
"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
|
|
41
|
+
"icon-sm": "size-8 p-0 has-[>svg]:p-0"
|
|
42
|
+
} },
|
|
43
|
+
defaultVariants: { size: "xs" }
|
|
44
|
+
});
|
|
45
|
+
var InputGroupButton = ({ className, type = "button", variant = "ghost", size = "xs", ...props }) => {
|
|
46
|
+
return /* @__PURE__ */ jsx(Button, {
|
|
47
|
+
type,
|
|
48
|
+
"data-size": size,
|
|
49
|
+
variant,
|
|
50
|
+
className: cn(inputGroupButtonVariants({ size }), className),
|
|
51
|
+
...props
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
var InputGroupText = ({ className, ...props }) => {
|
|
55
|
+
return /* @__PURE__ */ jsx("span", {
|
|
56
|
+
className: cn("flex items-center gap-2 text-sm text-foreground/70 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
|
|
57
|
+
...props
|
|
58
|
+
});
|
|
59
|
+
};
|
|
60
|
+
var InputGroupInput = ({ className, ...props }) => {
|
|
61
|
+
return /* @__PURE__ */ jsx(Input, {
|
|
62
|
+
"data-slot": "input-group-control",
|
|
63
|
+
className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
|
|
64
|
+
...props
|
|
65
|
+
});
|
|
66
|
+
};
|
|
67
|
+
var InputGroupTextarea = ({ className, ...props }) => {
|
|
68
|
+
return /* @__PURE__ */ jsx(Textarea, {
|
|
69
|
+
"data-slot": "input-group-control",
|
|
70
|
+
className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
|
|
71
|
+
...props
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
//#endregion
|
|
75
|
+
export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
|
|
76
|
+
|
|
77
|
+
//# sourceMappingURL=input-group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input-group.js","names":[],"sources":["../../../../../../../ui/src/components/ui/input-group/input-group.tsx"],"sourcesContent":["import { cn } from '@edyn/ui/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\nimport { Button } from '../button/button';\nimport { Input } from '../input/input';\nimport { Textarea } from '../textarea/textarea';\n\nexport interface IInputGroupProps extends React.ComponentProps<'div'> {}\n\nexport const InputGroup = ({ className, ...props }: IInputGroupProps) => {\n return (\n <div\n data-slot=\"input-group\"\n className={cn(\n 'group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-control transition-colors outline-none',\n 'has-disabled:bg-input/50 has-disabled:opacity-50 ',\n '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 dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40',\n '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',\n '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\nexport type TInputGroupAddonAlign = 'inline-start' | 'inline-end' | 'block-start' | 'block-end';\n\nconst inputGroupAddonVariants = cva(\n \"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-foreground/70 select-none [&>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': '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': '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\nexport interface IInputGroupAddonProps extends React.ComponentProps<'div'>, VariantProps<typeof inputGroupAddonVariants> {}\n\nexport const InputGroupAddon = ({ className, align = 'inline-start', ...props }: IInputGroupAddonProps) => {\n return (\n <div\n data-slot=\"input-group-addon\"\n data-align={align}\n className={cn(inputGroupAddonVariants({ align }), className)}\n onPointerDown={(event) => {\n if ((event.target as HTMLElement).closest('button')) {\n return;\n }\n event.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\nexport type TInputGroupButtonProps = Omit<React.ComponentProps<typeof Button>, 'size' | 'type'> &\n VariantProps<typeof inputGroupButtonVariants> & {\n type?: 'button' | 'submit' | 'reset';\n };\n\nexport const InputGroupButton = ({ className, type = 'button', variant = 'ghost', size = 'xs', ...props }: TInputGroupButtonProps) => {\n return <Button type={type} data-size={size} variant={variant} className={cn(inputGroupButtonVariants({ size }), className)} {...props} />;\n};\n\nexport const InputGroupText = ({ className, ...props }: React.ComponentProps<'span'>) => {\n return (\n <span\n className={cn(\"flex items-center gap-2 text-sm text-foreground/70 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\", className)}\n {...props}\n />\n );\n};\n\nexport interface IInputGroupInputProps extends React.ComponentProps<'input'> {}\n\nexport const InputGroupInput = ({ className, ...props }: IInputGroupInputProps) => {\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 focus-visible: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 const 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 focus-visible: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"],"mappings":";;;;;;;AASA,IAAa,cAAc,EAAE,WAAW,GAAG,YAA8B;CACvE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,mIACA,qDACA,6QACA,sLACA,iMACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAIA,IAAM,0BAA0B,IAC9B,sMACA;CACE,UAAU,EACR,OAAO;EACL,gBAAgB;EAChB,cAAc;EACd,eAAe;EACf,aAAa;CACf,EACF;CACA,iBAAiB,EACf,OAAO,eACT;AACF,CACF;AAIA,IAAa,mBAAmB,EAAE,WAAW,QAAQ,gBAAgB,GAAG,YAAmC;CACzG,OACE,oBAAC,OAAD;EACE,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,wBAAwB,EAAE,MAAM,CAAC,GAAG,SAAS;EAC3D,gBAAgB,UAAU;GACxB,IAAK,MAAM,OAAuB,QAAQ,QAAQ,GAChD;GAEF,MAAM,cAAc,eAAe,cAAc,OAAO,CAAC,EAAE,MAAM;EACnE;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,2BAA2B,IAAI,+CAA+C;CAClF,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,WAAW;EACX,WAAW;CACb,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC;AAOD,IAAa,oBAAoB,EAAE,WAAW,OAAO,UAAU,UAAU,SAAS,OAAO,MAAM,GAAG,YAAoC;CACpI,OAAO,oBAAC,QAAD;EAAc;EAAM,aAAW;EAAe;EAAS,WAAW,GAAG,yBAAyB,EAAE,KAAK,CAAC,GAAG,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC1I;AAEA,IAAa,kBAAkB,EAAE,WAAW,GAAG,YAA0C;CACvF,OACE,oBAAC,QAAD;EACE,WAAW,GAAG,uHAAuH,SAAS;EAC9I,GAAI;CACL,CAAA;AAEL;AAIA,IAAa,mBAAmB,EAAE,WAAW,GAAG,YAAmC;CACjF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,oLACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,sBAAsB,EAAE,WAAW,GAAG,YAA8C;CAC/F,OACE,oBAAC,UAAD;EACE,aAAU;EACV,WAAW,GACT,qMACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { cn } from "../../../lib/utils.js";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
import { IconMinus } from "@tabler/icons-react";
|
|
5
|
+
import { OTPInput, OTPInputContext } from "input-otp";
|
|
6
|
+
//#region ../ui/src/components/ui/input-otp/input-otp.tsx
|
|
7
|
+
var InputOTP = ({ className, containerClassName, ...props }) => {
|
|
8
|
+
return /* @__PURE__ */ jsx(OTPInput, {
|
|
9
|
+
"data-slot": "input-otp",
|
|
10
|
+
containerClassName: cn("cn-input-otp flex items-center has-disabled:opacity-50", containerClassName),
|
|
11
|
+
spellCheck: false,
|
|
12
|
+
className: cn("disabled:cursor-not-allowed", className),
|
|
13
|
+
...props
|
|
14
|
+
});
|
|
15
|
+
};
|
|
16
|
+
var InputOTPGroup = ({ className, ...props }) => {
|
|
17
|
+
return /* @__PURE__ */ jsx("div", {
|
|
18
|
+
"data-slot": "input-otp-group",
|
|
19
|
+
className: cn("flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40", className),
|
|
20
|
+
...props
|
|
21
|
+
});
|
|
22
|
+
};
|
|
23
|
+
var InputOTPSlot = ({ index, className, ...props }) => {
|
|
24
|
+
const { char, hasFakeCaret, isActive } = React.useContext(OTPInputContext)?.slots[index] ?? {};
|
|
25
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
26
|
+
"data-slot": "input-otp-slot",
|
|
27
|
+
"data-active": isActive,
|
|
28
|
+
className: cn("relative flex size-8 items-center justify-center border-y border-r border-control text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg 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),
|
|
29
|
+
...props,
|
|
30
|
+
children: [char, hasFakeCaret && /* @__PURE__ */ jsx("div", {
|
|
31
|
+
className: "pointer-events-none absolute inset-0 flex items-center justify-center",
|
|
32
|
+
children: /* @__PURE__ */ jsx("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000 motion-reduce:animate-none" })
|
|
33
|
+
})]
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
var InputOTPSeparator = ({ ...props }) => {
|
|
37
|
+
return /* @__PURE__ */ jsx("div", {
|
|
38
|
+
"data-slot": "input-otp-separator",
|
|
39
|
+
className: "flex items-center [&_svg:not([class*='size-'])]:size-4",
|
|
40
|
+
"aria-hidden": "true",
|
|
41
|
+
...props,
|
|
42
|
+
children: /* @__PURE__ */ jsx(IconMinus, {})
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
//#endregion
|
|
46
|
+
export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
|
|
47
|
+
|
|
48
|
+
//# sourceMappingURL=input-otp.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input-otp.js","names":[],"sources":["../../../../../../../ui/src/components/ui/input-otp/input-otp.tsx"],"sourcesContent":["import { cn } from '@edyn/ui/lib/utils';\nimport { IconMinus } from '@tabler/icons-react';\nimport { OTPInput, OTPInputContext } from 'input-otp';\nimport * as React from 'react';\n\nexport const 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('cn-input-otp flex items-center has-disabled:opacity-50', containerClassName)}\n spellCheck={false}\n className={cn('disabled:cursor-not-allowed', className)}\n {...props}\n />\n );\n};\n\nexport const InputOTPGroup = ({ className, ...props }: React.ComponentProps<'div'>) => {\n return (\n <div\n data-slot=\"input-otp-group\"\n className={cn(\n 'flex items-center rounded-lg 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\nexport const 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-control text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg 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 motion-reduce:animate-none\" />\n </div>\n )}\n </div>\n );\n};\n\nexport const InputOTPSeparator = ({ ...props }: React.ComponentProps<'div'>) => {\n return (\n <div data-slot=\"input-otp-separator\" className=\"flex items-center [&_svg:not([class*='size-'])]:size-4\" aria-hidden=\"true\" {...props}>\n <IconMinus />\n </div>\n );\n};\n"],"mappings":";;;;;;AAKA,IAAa,YAAY,EACvB,WACA,oBACA,GAAG,YAGC;CACJ,OACE,oBAAC,UAAD;EACE,aAAU;EACV,oBAAoB,GAAG,0DAA0D,kBAAkB;EACnG,YAAY;EACZ,WAAW,GAAG,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,iBAAiB,EAAE,WAAW,GAAG,YAAyC;CACrF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,2KACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,gBAAgB,EAC3B,OACA,WACA,GAAG,YAGC;CAEJ,MAAM,EAAE,MAAM,cAAc,aADJ,MAAM,WAAW,eACA,CAAA,EAAiB,MAAM,UAAU,CAAC;CAE3E,OACE,qBAAC,OAAD;EACE,aAAU;EACV,eAAa;EACb,WAAW,GACT,+eACA,SACF;EACA,GAAI;EAPN,UAAA,CASG,MACA,gBACC,oBAAC,OAAD;GAAK,WAAU;GACb,UAAA,oBAAC,OAAD,EAAK,WAAU,sFAAuF,CAAA;EACnG,CAAA,CAEJ;;AAET;AAEA,IAAa,qBAAqB,EAAE,GAAG,YAAyC;CAC9E,OACE,oBAAC,OAAD;EAAK,aAAU;EAAsB,WAAU;EAAyD,eAAY;EAAO,GAAI;EAC7H,UAAA,oBAAC,WAAD,CAAY,CAAA;CACT,CAAA;AAET"}
|