@evinvest/uikit 0.30.0 → 0.32.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 +267 -73
- package/dist/{chunk-3IPB4QQJ.js → chunk-35SPIU4U.js} +10 -6
- package/dist/chunk-35SPIU4U.js.map +1 -0
- package/dist/components/{accordion.js → atomic/accordion.js} +3 -3
- package/dist/components/atomic/accordion.js.map +1 -0
- package/dist/components/{alert-dialog.js → atomic/alert-dialog.js} +11 -10
- package/dist/components/atomic/alert-dialog.js.map +1 -0
- package/dist/components/{alert.js → atomic/alert.js} +2 -2
- package/dist/components/atomic/alert.js.map +1 -0
- package/dist/components/atomic/animated-number-columns.js +105 -0
- package/dist/components/atomic/animated-number-columns.js.map +1 -0
- package/dist/components/{avatar.js → atomic/avatar.js} +2 -2
- package/dist/components/atomic/avatar.js.map +1 -0
- package/dist/components/{badge.js → atomic/badge.js} +4 -4
- package/dist/components/atomic/badge.js.map +1 -0
- package/dist/components/{band.js → atomic/band.js} +2 -2
- package/dist/components/atomic/band.js.map +1 -0
- package/dist/components/{breadcrumb.js → atomic/breadcrumb.js} +3 -3
- package/dist/components/atomic/breadcrumb.js.map +1 -0
- package/dist/components/{button-group.js → atomic/button-group.js} +3 -3
- package/dist/components/atomic/button-group.js.map +1 -0
- package/dist/components/{button.js → atomic/button.js} +7 -15
- package/dist/components/atomic/button.js.map +1 -0
- package/dist/components/{calendar.js → atomic/calendar.js} +2 -2
- package/dist/components/atomic/calendar.js.map +1 -0
- package/dist/components/{card.js → atomic/card.js} +2 -2
- package/dist/components/atomic/card.js.map +1 -0
- package/dist/components/{checkbox.js → atomic/checkbox.js} +4 -4
- package/dist/components/atomic/checkbox.js.map +1 -0
- package/dist/components/{collapsible.js → atomic/collapsible.js} +1 -1
- package/dist/components/atomic/collapsible.js.map +1 -0
- package/dist/components/{command.js → atomic/command.js} +9 -7
- package/dist/components/atomic/command.js.map +1 -0
- package/dist/components/{container.js → atomic/container.js} +2 -2
- package/dist/components/atomic/container.js.map +1 -0
- package/dist/components/{context-menu.js → atomic/context-menu.js} +62 -14
- package/dist/components/atomic/context-menu.js.map +1 -0
- package/dist/components/{dialog.js → atomic/dialog.js} +11 -10
- package/dist/components/atomic/dialog.js.map +1 -0
- package/dist/components/{drawer.js → atomic/drawer.js} +10 -8
- package/dist/components/atomic/drawer.js.map +1 -0
- package/dist/components/{dropdown-menu.js → atomic/dropdown-menu.js} +74 -15
- package/dist/components/atomic/dropdown-menu.js.map +1 -0
- package/dist/components/{empty.js → atomic/empty.js} +2 -2
- package/dist/components/atomic/empty.js.map +1 -0
- package/dist/components/atomic/field-context.js.map +1 -0
- package/dist/components/atomic/form-row.js +51 -0
- package/dist/components/atomic/form-row.js.map +1 -0
- package/dist/components/{hover-card.js → atomic/hover-card.js} +8 -8
- package/dist/components/atomic/hover-card.js.map +1 -0
- package/dist/components/{info-tip.js → atomic/info-tip.js} +10 -10
- package/dist/components/atomic/info-tip.js.map +1 -0
- package/dist/components/{input-otp.js → atomic/input-otp.js} +3 -3
- package/dist/components/atomic/input-otp.js.map +1 -0
- package/dist/components/{input.js → atomic/input.js} +3 -3
- package/dist/components/atomic/input.js.map +1 -0
- package/dist/components/{kbd.js → atomic/kbd.js} +2 -2
- package/dist/components/atomic/kbd.js.map +1 -0
- package/dist/components/atomic/key-value.js +68 -0
- package/dist/components/atomic/key-value.js.map +1 -0
- package/dist/components/{label.js → atomic/label.js} +2 -2
- package/dist/components/atomic/label.js.map +1 -0
- package/dist/components/{menubar.js → atomic/menubar.js} +48 -14
- package/dist/components/atomic/menubar.js.map +1 -0
- package/dist/components/{native-select.js → atomic/native-select.js} +6 -7
- package/dist/components/atomic/native-select.js.map +1 -0
- package/dist/components/{navigation-menu.js → atomic/navigation-menu.js} +11 -12
- package/dist/components/atomic/navigation-menu.js.map +1 -0
- package/dist/components/{pagination.js → atomic/pagination.js} +1 -1
- package/dist/components/atomic/pagination.js.map +1 -0
- package/dist/components/{popover.js → atomic/popover.js} +10 -10
- package/dist/components/atomic/popover.js.map +1 -0
- package/dist/components/{progress.js → atomic/progress.js} +2 -2
- package/dist/components/atomic/progress.js.map +1 -0
- package/dist/components/{radio-group.js → atomic/radio-group.js} +4 -4
- package/dist/components/atomic/radio-group.js.map +1 -0
- package/dist/components/{scroll-area.js → atomic/scroll-area.js} +2 -2
- package/dist/components/atomic/scroll-area.js.map +1 -0
- package/dist/components/{section-descriptor.js → atomic/section-descriptor.js} +2 -2
- package/dist/components/atomic/section-descriptor.js.map +1 -0
- package/dist/components/{select-listbox.js → atomic/select-listbox.js} +1 -1
- package/dist/components/atomic/select-listbox.js.map +1 -0
- package/dist/components/{select.js → atomic/select.js} +26 -16
- package/dist/components/atomic/select.js.map +1 -0
- package/dist/components/{separator.js → atomic/separator.js} +2 -2
- package/dist/components/atomic/separator.js.map +1 -0
- package/dist/components/{sheet.js → atomic/sheet.js} +11 -10
- package/dist/components/atomic/sheet.js.map +1 -0
- package/dist/components/{sidebar.js → atomic/sidebar.js} +5 -5
- package/dist/components/atomic/sidebar.js.map +1 -0
- package/dist/components/{skeleton.js → atomic/skeleton.js} +2 -2
- package/dist/components/atomic/skeleton.js.map +1 -0
- package/dist/components/{slider.js → atomic/slider.js} +3 -3
- package/dist/components/atomic/slider.js.map +1 -0
- package/dist/components/{sonner.js → atomic/sonner.js} +2 -2
- package/dist/components/atomic/sonner.js.map +1 -0
- package/dist/components/{spinner.js → atomic/spinner.js} +1 -1
- package/dist/components/atomic/spinner.js.map +1 -0
- package/dist/components/atomic/status-item.js +42 -0
- package/dist/components/atomic/status-item.js.map +1 -0
- package/dist/components/{switch.js → atomic/switch.js} +4 -4
- package/dist/components/atomic/switch.js.map +1 -0
- package/dist/components/{table.js → atomic/table.js} +2 -2
- package/dist/components/atomic/table.js.map +1 -0
- package/dist/components/{tabs.js → atomic/tabs.js} +4 -4
- package/dist/components/atomic/tabs.js.map +1 -0
- package/dist/components/{textarea.js → atomic/textarea.js} +3 -3
- package/dist/components/atomic/textarea.js.map +1 -0
- package/dist/components/{toggle-group.js → atomic/toggle-group.js} +2 -2
- package/dist/components/atomic/toggle-group.js.map +1 -0
- package/dist/components/{toggle.js → atomic/toggle.js} +3 -3
- package/dist/components/atomic/toggle.js.map +1 -0
- package/dist/components/{tooltip.js → atomic/tooltip.js} +8 -8
- package/dist/components/atomic/tooltip.js.map +1 -0
- package/dist/components/atomic/use-count-tween.js +42 -0
- package/dist/components/atomic/use-count-tween.js.map +1 -0
- package/dist/components/derived/animated-number.js +157 -0
- package/dist/components/derived/animated-number.js.map +1 -0
- package/dist/components/{carousel.js → derived/carousel.js} +4 -4
- package/dist/components/derived/carousel.js.map +1 -0
- package/dist/components/derived/command-palette.js +119 -0
- package/dist/components/derived/command-palette.js.map +1 -0
- package/dist/components/derived/confirm-dialog.js +123 -0
- package/dist/components/derived/confirm-dialog.js.map +1 -0
- package/dist/components/{date-time-picker.js → derived/date-time-picker.js} +8 -8
- package/dist/components/derived/date-time-picker.js.map +1 -0
- package/dist/components/{field.js → derived/field.js} +6 -6
- package/dist/components/derived/field.js.map +1 -0
- package/dist/components/{form.js → derived/form.js} +4 -4
- package/dist/components/derived/form.js.map +1 -0
- package/dist/components/derived/icon-button.js +35 -0
- package/dist/components/derived/icon-button.js.map +1 -0
- package/dist/components/{input-group.js → derived/input-group.js} +5 -5
- package/dist/components/derived/input-group.js.map +1 -0
- package/dist/components/{item.js → derived/item.js} +4 -4
- package/dist/components/derived/item.js.map +1 -0
- package/dist/components/derived/popover-form.js +60 -0
- package/dist/components/derived/popover-form.js.map +1 -0
- package/dist/components/derived/settings.js +94 -0
- package/dist/components/derived/settings.js.map +1 -0
- package/dist/components/shell/account-list.js +128 -0
- package/dist/components/shell/account-list.js.map +1 -0
- package/dist/components/shell/account-menu-profile.js +114 -0
- package/dist/components/shell/account-menu-profile.js.map +1 -0
- package/dist/components/shell/account-menu.js +97 -0
- package/dist/components/shell/account-menu.js.map +1 -0
- package/dist/components/shell/account-settings-dialog.js +84 -0
- package/dist/components/shell/account-settings-dialog.js.map +1 -0
- package/dist/components/{app-shell.js → shell/app-shell.js} +10 -1
- package/dist/components/shell/app-shell.js.map +1 -0
- package/dist/components/shell/aside.js +140 -0
- package/dist/components/shell/aside.js.map +1 -0
- package/dist/components/{auth-wall.js → shell/auth-wall.js} +1 -1
- package/dist/components/shell/auth-wall.js.map +1 -0
- package/dist/components/{bottom-tab-bar.js → shell/bottom-tab-bar.js} +1 -1
- package/dist/components/shell/bottom-tab-bar.js.map +1 -0
- package/dist/components/shell/chat-composer.js +141 -0
- package/dist/components/shell/chat-composer.js.map +1 -0
- package/dist/components/shell/chat-message.js +195 -0
- package/dist/components/shell/chat-message.js.map +1 -0
- package/dist/components/shell/chat-panel.js +137 -0
- package/dist/components/shell/chat-panel.js.map +1 -0
- package/dist/components/shell/chat-stream-text.js +69 -0
- package/dist/components/shell/chat-stream-text.js.map +1 -0
- package/dist/components/shell/chat-typing.js +26 -0
- package/dist/components/shell/chat-typing.js.map +1 -0
- package/dist/components/{footer.js → shell/footer.js} +1 -1
- package/dist/components/shell/footer.js.map +1 -0
- package/dist/components/shell/header-controls.js +149 -0
- package/dist/components/shell/header-controls.js.map +1 -0
- package/dist/components/{list-rows.js → shell/list-rows.js} +1 -1
- package/dist/components/shell/list-rows.js.map +1 -0
- package/dist/components/{logo.js → shell/logo.js} +1 -1
- package/dist/components/shell/logo.js.map +1 -0
- package/dist/components/{mobile-app-bar.js → shell/mobile-app-bar.js} +1 -1
- package/dist/components/shell/mobile-app-bar.js.map +1 -0
- package/dist/components/{nav-badge.js → shell/nav-badge.js} +1 -1
- package/dist/components/shell/nav-badge.js.map +1 -0
- package/dist/components/shell/nav-collapse.js +142 -0
- package/dist/components/shell/nav-collapse.js.map +1 -0
- package/dist/components/shell/nav-link.js.map +1 -0
- package/dist/components/shell/nav-model.js.map +1 -0
- package/dist/components/{page-frame.js → shell/page-frame.js} +3 -6
- package/dist/components/shell/page-frame.js.map +1 -0
- package/dist/components/{resource-error.js → shell/resource-error.js} +4 -4
- package/dist/components/shell/resource-error.js.map +1 -0
- package/dist/components/shell/section-nav.js +139 -0
- package/dist/components/shell/section-nav.js.map +1 -0
- package/dist/components/shell/settled.js.map +1 -0
- package/dist/components/shell/shell-icons.js.map +1 -0
- package/dist/components/{shell-nav.js → shell/shell-nav.js} +81 -39
- package/dist/components/shell/shell-nav.js.map +1 -0
- package/dist/components/shell/smart-header.js +53 -0
- package/dist/components/shell/smart-header.js.map +1 -0
- package/dist/components/{status-screen.js → shell/status-screen.js} +3 -3
- package/dist/components/shell/status-screen.js.map +1 -0
- package/dist/components/{system-banner.js → shell/system-banner.js} +23 -13
- package/dist/components/shell/system-banner.js.map +1 -0
- package/dist/components/{top-bar.js → shell/top-bar.js} +5 -4
- package/dist/components/shell/top-bar.js.map +1 -0
- package/dist/components/shell/use-shell-nav.js.map +1 -0
- package/dist/components/shell/workspace-tab.js +140 -0
- package/dist/components/shell/workspace-tab.js.map +1 -0
- package/dist/generated/accent.js +2 -2
- package/dist/generated/accent.js.map +1 -1
- package/dist/generated/account-list.js +35 -0
- package/dist/generated/account-list.js.map +1 -0
- package/dist/generated/account-settings-dialog.js +27 -0
- package/dist/generated/account-settings-dialog.js.map +1 -0
- package/dist/generated/alert-dialog.js +1 -1
- package/dist/generated/alert-dialog.js.map +1 -1
- package/dist/generated/alert.js +2 -2
- package/dist/generated/alert.js.map +1 -1
- package/dist/generated/aside.js +36 -0
- package/dist/generated/aside.js.map +1 -0
- package/dist/generated/badge.js +7 -6
- package/dist/generated/badge.js.map +1 -1
- package/dist/generated/band.js +1 -1
- package/dist/generated/band.js.map +1 -1
- package/dist/generated/breadcrumb.js +2 -2
- package/dist/generated/breadcrumb.js.map +1 -1
- package/dist/generated/button-group.js +2 -2
- package/dist/generated/button-group.js.map +1 -1
- package/dist/generated/button.js +4 -4
- package/dist/generated/button.js.map +1 -1
- package/dist/generated/card.js +6 -6
- package/dist/generated/card.js.map +1 -1
- package/dist/generated/chat-composer.js +21 -0
- package/dist/generated/chat-composer.js.map +1 -0
- package/dist/generated/chat-message.js +86 -0
- package/dist/generated/chat-message.js.map +1 -0
- package/dist/generated/chat-typing.js +9 -0
- package/dist/generated/chat-typing.js.map +1 -0
- package/dist/generated/command-palette.js +17 -0
- package/dist/generated/command-palette.js.map +1 -0
- package/dist/generated/command.js +2 -2
- package/dist/generated/command.js.map +1 -1
- package/dist/generated/confirm-dialog.js +28 -0
- package/dist/generated/confirm-dialog.js.map +1 -0
- package/dist/generated/context-menu.js +1 -1
- package/dist/generated/context-menu.js.map +1 -1
- package/dist/generated/date-time-picker.js +1 -1
- package/dist/generated/date-time-picker.js.map +1 -1
- package/dist/generated/dialog.js +1 -1
- package/dist/generated/dialog.js.map +1 -1
- package/dist/generated/drawer.js +1 -1
- package/dist/generated/drawer.js.map +1 -1
- package/dist/generated/dropdown-menu.js +1 -1
- package/dist/generated/dropdown-menu.js.map +1 -1
- package/dist/generated/form-row.js +17 -0
- package/dist/generated/form-row.js.map +1 -0
- package/dist/generated/header-controls.js +56 -0
- package/dist/generated/header-controls.js.map +1 -0
- package/dist/generated/icon-button.js +13 -0
- package/dist/generated/icon-button.js.map +1 -0
- package/dist/generated/key-value.js +15 -0
- package/dist/generated/key-value.js.map +1 -0
- package/dist/generated/menubar.js +1 -1
- package/dist/generated/menubar.js.map +1 -1
- package/dist/generated/navigation-menu.js +1 -1
- package/dist/generated/navigation-menu.js.map +1 -1
- package/dist/generated/popover-form.js +13 -0
- package/dist/generated/popover-form.js.map +1 -0
- package/dist/generated/section-label.js +10 -0
- package/dist/generated/section-label.js.map +1 -0
- package/dist/generated/select.js +15 -3
- package/dist/generated/select.js.map +1 -1
- package/dist/generated/settings.js +36 -0
- package/dist/generated/settings.js.map +1 -0
- package/dist/generated/sheet.js +1 -1
- package/dist/generated/sheet.js.map +1 -1
- package/dist/generated/slider.js +1 -1
- package/dist/generated/slider.js.map +1 -1
- package/dist/generated/smart-header.js +11 -0
- package/dist/generated/smart-header.js.map +1 -0
- package/dist/generated/sonner.js +4 -4
- package/dist/generated/sonner.js.map +1 -1
- package/dist/generated/status-item.js +17 -0
- package/dist/generated/status-item.js.map +1 -0
- package/dist/generated/system-banner.js +33 -0
- package/dist/generated/system-banner.js.map +1 -0
- package/dist/generated/top-bar.js +9 -0
- package/dist/generated/top-bar.js.map +1 -0
- package/dist/generated/workspace-tab.js +17 -0
- package/dist/generated/workspace-tab.js.map +1 -0
- package/dist/icons/select-chevron.js.map +1 -0
- package/dist/icons/ui-icons.js +77 -0
- package/dist/icons/ui-icons.js.map +1 -0
- package/dist/index.d.ts +852 -156
- package/dist/index.js +96 -76
- package/dist/lib/cn.js +8 -1
- package/dist/lib/cn.js.map +1 -1
- package/dist/lib/number-parts.js +90 -0
- package/dist/lib/number-parts.js.map +1 -0
- package/dist/palette-cli.js +1 -1
- package/dist/palette.d.ts +6 -4
- package/dist/palette.js +3 -1
- package/dist/primitives/dismissable-layer.js +76 -4
- package/dist/primitives/dismissable-layer.js.map +1 -1
- package/dist/primitives/focus-scope.js +20 -5
- package/dist/primitives/focus-scope.js.map +1 -1
- package/dist/primitives/use-floating.js +16 -1
- package/dist/primitives/use-floating.js.map +1 -1
- package/dist/primitives/use-reduced-motion.js +20 -0
- package/dist/primitives/use-reduced-motion.js.map +1 -0
- package/package.json +2 -2
- package/styles/ev.css +281 -49
- package/styles/theme.css +335 -39
- package/styles/tokens.css +643 -103
- package/dist/chunk-3IPB4QQJ.js.map +0 -1
- package/dist/components/accordion.js.map +0 -1
- package/dist/components/account-menu.js +0 -70
- package/dist/components/account-menu.js.map +0 -1
- package/dist/components/alert-dialog.js.map +0 -1
- package/dist/components/alert.js.map +0 -1
- package/dist/components/app-shell.js.map +0 -1
- package/dist/components/auth-wall.js.map +0 -1
- package/dist/components/avatar.js.map +0 -1
- package/dist/components/badge.js.map +0 -1
- package/dist/components/band.js.map +0 -1
- package/dist/components/bottom-tab-bar.js.map +0 -1
- package/dist/components/breadcrumb.js.map +0 -1
- package/dist/components/button-group.js.map +0 -1
- package/dist/components/button.js.map +0 -1
- package/dist/components/calendar.js.map +0 -1
- package/dist/components/card.js.map +0 -1
- package/dist/components/carousel.js.map +0 -1
- package/dist/components/checkbox.js.map +0 -1
- package/dist/components/collapsible.js.map +0 -1
- package/dist/components/command.js.map +0 -1
- package/dist/components/container.js.map +0 -1
- package/dist/components/context-menu.js.map +0 -1
- package/dist/components/date-time-picker.js.map +0 -1
- package/dist/components/dialog.js.map +0 -1
- package/dist/components/drawer.js.map +0 -1
- package/dist/components/dropdown-menu.js.map +0 -1
- package/dist/components/empty.js.map +0 -1
- package/dist/components/field-context.js.map +0 -1
- package/dist/components/field.js.map +0 -1
- package/dist/components/footer.js.map +0 -1
- package/dist/components/form.js.map +0 -1
- package/dist/components/hover-card.js.map +0 -1
- package/dist/components/info-tip.js.map +0 -1
- package/dist/components/input-group.js.map +0 -1
- package/dist/components/input-otp.js.map +0 -1
- package/dist/components/input.js.map +0 -1
- package/dist/components/item.js.map +0 -1
- package/dist/components/kbd.js.map +0 -1
- package/dist/components/label.js.map +0 -1
- package/dist/components/list-rows.js.map +0 -1
- package/dist/components/logo.js.map +0 -1
- package/dist/components/menubar.js.map +0 -1
- package/dist/components/mobile-app-bar.js.map +0 -1
- package/dist/components/native-select.js.map +0 -1
- package/dist/components/nav-badge.js.map +0 -1
- package/dist/components/nav-link.js.map +0 -1
- package/dist/components/nav-model.js.map +0 -1
- package/dist/components/navigation-menu.js.map +0 -1
- package/dist/components/page-frame.js.map +0 -1
- package/dist/components/pagination.js.map +0 -1
- package/dist/components/popover.js.map +0 -1
- package/dist/components/progress.js.map +0 -1
- package/dist/components/radio-group.js.map +0 -1
- package/dist/components/resource-error.js.map +0 -1
- package/dist/components/scroll-area.js.map +0 -1
- package/dist/components/section-descriptor.js.map +0 -1
- package/dist/components/section-nav.js +0 -86
- package/dist/components/section-nav.js.map +0 -1
- package/dist/components/select-chevron.js.map +0 -1
- package/dist/components/select-listbox.js.map +0 -1
- package/dist/components/select.js.map +0 -1
- package/dist/components/separator.js.map +0 -1
- package/dist/components/settled.js.map +0 -1
- package/dist/components/sheet.js.map +0 -1
- package/dist/components/shell-icons.js.map +0 -1
- package/dist/components/shell-nav.js.map +0 -1
- package/dist/components/sidebar.js.map +0 -1
- package/dist/components/skeleton.js.map +0 -1
- package/dist/components/slider.js.map +0 -1
- package/dist/components/sonner.js.map +0 -1
- package/dist/components/spinner.js.map +0 -1
- package/dist/components/status-screen.js.map +0 -1
- package/dist/components/switch.js.map +0 -1
- package/dist/components/system-banner.js.map +0 -1
- package/dist/components/table.js.map +0 -1
- package/dist/components/tabs.js.map +0 -1
- package/dist/components/terminal.js +0 -206
- package/dist/components/terminal.js.map +0 -1
- package/dist/components/textarea.js.map +0 -1
- package/dist/components/toggle-group.js.map +0 -1
- package/dist/components/toggle.js.map +0 -1
- package/dist/components/tooltip.js.map +0 -1
- package/dist/components/top-bar.js.map +0 -1
- package/dist/components/use-shell-nav.js.map +0 -1
- package/dist/generated/terminal.js +0 -70
- package/dist/generated/terminal.js.map +0 -1
- /package/dist/components/{field-context.js → atomic/field-context.js} +0 -0
- /package/dist/components/{nav-link.js → shell/nav-link.js} +0 -0
- /package/dist/components/{nav-model.js → shell/nav-model.js} +0 -0
- /package/dist/components/{settled.js → shell/settled.js} +0 -0
- /package/dist/components/{shell-icons.js → shell/shell-icons.js} +0 -0
- /package/dist/components/{use-shell-nav.js → shell/use-shell-nav.js} +0 -0
- /package/dist/{components → icons}/select-chevron.js +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/dropdown-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport { useFloating } from \"../../primitives/use-floating\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../../primitives/dismissable-layer\";\nimport { usePresence } from \"../../primitives/presence\";\nimport { useRovingFocus } from \"../../primitives/use-roving-focus\";\nimport { useHoverIntent } from \"../../primitives/use-hover-intent\";\nimport { mergeRefs } from \"../../primitives/merge-refs\";\nimport { Portal } from \"../../primitives/portal\";\nimport { Slot } from \"../../primitives/slot\";\nimport {\n DROPDOWN_MENU_CHECK_ITEM,\n DROPDOWN_MENU_CONTENT,\n DROPDOWN_MENU_ITEM,\n DROPDOWN_MENU_ITEM_INDICATOR,\n DROPDOWN_MENU_LABEL,\n DROPDOWN_MENU_SEPARATOR,\n DROPDOWN_MENU_SHORTCUT,\n DROPDOWN_MENU_SUB_CONTENT,\n DROPDOWN_MENU_SUB_TRIGGER,\n} from \"../../generated/dropdown-menu\";\n\ninterface DropdownMenuContextValue {\n open: boolean;\n setOpen: (next: boolean) => void;\n anchorRef: React.RefObject<HTMLElement | null>;\n}\n\nconst DropdownMenuContext = React.createContext<DropdownMenuContextValue | null>(\n null,\n);\n\nfunction useDropdownMenu(): DropdownMenuContextValue {\n const ctx = React.useContext(DropdownMenuContext);\n if (!ctx) throw new Error(\"DropdownMenu parts must be used within <DropdownMenu>\");\n return ctx;\n}\n\nexport interface DropdownMenuProps {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n children?: React.ReactNode;\n}\n\nexport function DropdownMenu({ open, defaultOpen = false, onOpenChange, children }: DropdownMenuProps) {\n const [isOpen, setOpen] = useControllableState<boolean>({\n ...(open !== undefined ? { value: open } : {}),\n defaultValue: defaultOpen,\n ...(onOpenChange ? { onChange: onOpenChange } : {}),\n });\n const anchorRef = React.useRef<HTMLElement | null>(null);\n return (\n <DropdownMenuContext.Provider value={{ open: isOpen, setOpen, anchorRef }}>\n <div data-slot=\"dropdown-menu\">{children}</div>\n </DropdownMenuContext.Provider>\n );\n}\n\nexport function DropdownMenuPortal({ children }: { children?: React.ReactNode }) {\n return <Portal>{children}</Portal>;\n}\n\nexport interface DropdownMenuTriggerProps extends React.ComponentProps<\"button\"> {\n asChild?: boolean;\n}\n\nexport function DropdownMenuTrigger({ asChild = false, onClick, ...props }: DropdownMenuTriggerProps) {\n const { open, setOpen, anchorRef } = useDropdownMenu();\n const Comp = asChild ? Slot : \"button\";\n return (\n <Comp\n data-slot=\"dropdown-menu-trigger\"\n aria-haspopup=\"menu\"\n aria-expanded={open}\n data-state={open ? \"open\" : \"closed\"}\n ref={anchorRef as React.Ref<HTMLButtonElement>}\n onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e);\n setOpen(!open);\n }}\n {...(props as Record<string, unknown>)}\n />\n );\n}\n\nexport interface DropdownMenuContentProps extends React.ComponentProps<\"div\"> {\n sideOffset?: number;\n align?: \"start\" | \"center\" | \"end\";\n}\n\nexport function DropdownMenuContent({\n className,\n sideOffset = 4,\n align = \"start\",\n children,\n ...props\n}: DropdownMenuContentProps) {\n const { open, setOpen, anchorRef } = useDropdownMenu();\n const { isPresent, ref: presRef } = usePresence(open);\n const { floatingRef, style, side } = useFloating({\n anchorRef,\n open,\n side: \"bottom\",\n align,\n offset: sideOffset,\n });\n const dismissRef = useDismissableLayer({\n enabled: open,\n onDismiss: () => setOpen(false),\n exclude: [anchorRef],\n });\n const contentRef = React.useRef<HTMLDivElement | null>(null);\n // Roving focus across rendered menu items: ArrowUp/Down move the active item.\n const items = () =>\n Array.from(\n contentRef.current?.querySelectorAll<HTMLElement>(\"[role^='menuitem']\") ?? [],\n ).filter((el) => el.getAttribute(\"data-disabled\") === null);\n const { activeIndex, setActiveIndex, onKeyDown: rovingKeyDown } = useRovingFocus({\n count: () => items().length,\n orientation: \"vertical\",\n loop: true,\n });\n // Reset on close: a menu reopens on its first item, and an index left past\n // the end (items gone while closed) would focus nothing.\n React.useEffect(() => {\n if (!open) setActiveIndex(0);\n }, [open, setActiveIndex]);\n React.useEffect(() => {\n if (!open) return;\n items()[activeIndex]?.focus();\n }, [open, activeIndex]);\n // Give focus back to the trigger on close, as Popover and Dialog do. Skipped when focus already\n // went somewhere real (an item opened a dialog, an outside click landed on an input).\n const wasOpen = React.useRef(false);\n React.useEffect(() => {\n if (open) {\n wasOpen.current = true;\n return;\n }\n if (!wasOpen.current) return;\n wasOpen.current = false;\n const active = document.activeElement;\n if (!active || active === document.body || contentRef.current?.contains(active)) anchorRef.current?.focus();\n }, [open, anchorRef]);\n // Selecting an item closes the menu: items call this through context.\n const close = React.useCallback(() => setOpen(false), [setOpen]);\n if (!isPresent) return null;\n return (\n <Portal>\n <DropdownMenuCloseContext.Provider value={close}>\n <div\n data-slot=\"dropdown-menu-content\"\n data-state={open ? \"open\" : \"closed\"}\n data-side={side}\n role=\"menu\"\n tabIndex={-1}\n // Escape is the stack's (useDismissableLayer): it closes this menu\n // only while it is the top layer.\n onKeyDown={rovingKeyDown}\n ref={mergeRefs(floatingRef, dismissRef, presRef, contentRef)}\n style={style}\n className={cn(\n DROPDOWN_MENU_CONTENT,\n className,\n )}\n {...(props as Record<string, unknown>)}\n >\n <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n </div>\n </DropdownMenuCloseContext.Provider>\n </Portal>\n );\n}\n\nconst DropdownMenuCloseContext = React.createContext<() => void>(() => {});\n\nexport function DropdownMenuGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n return <div data-slot=\"dropdown-menu-group\" role=\"group\" className={className} {...props} />;\n}\n\nexport interface DropdownMenuItemProps extends React.ComponentProps<\"div\"> {\n /** Render the child (a link) as the item. */\n asChild?: boolean;\n inset?: boolean;\n variant?: \"neutral\" | \"destructive\";\n disabled?: boolean;\n}\n\nexport function DropdownMenuItem({\n asChild = false,\n className,\n inset,\n variant = \"neutral\",\n disabled,\n onClick,\n onKeyDown,\n ...props\n}: DropdownMenuItemProps) {\n const close = React.useContext(DropdownMenuCloseContext);\n const Comp = asChild ? Slot : \"div\";\n return (\n <Comp\n data-slot=\"dropdown-menu-item\"\n data-inset={inset ? \"\" : undefined}\n data-variant={variant}\n data-disabled={disabled ? \"\" : undefined}\n role=\"menuitem\"\n tabIndex={disabled ? undefined : -1}\n className={cn(\n DROPDOWN_MENU_ITEM,\n className,\n )}\n onClick={(e) => {\n if (disabled) return;\n onClick?.(e);\n close();\n }}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n (e.currentTarget as HTMLElement).click();\n }\n }}\n {...props}\n />\n );\n}\n\nexport interface DropdownMenuCheckboxItemProps extends React.ComponentProps<\"div\"> {\n checked?: boolean;\n disabled?: boolean;\n}\n\nexport function DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n disabled,\n onClick,\n onKeyDown,\n ...props\n}: DropdownMenuCheckboxItemProps) {\n // No close: several boxes can be toggled in one visit. Escape or an outside click ends it.\n return (\n <div\n data-slot=\"dropdown-menu-checkbox-item\"\n role=\"menuitemcheckbox\"\n aria-checked={checked}\n data-state={checked ? \"checked\" : \"unchecked\"}\n data-disabled={disabled ? \"\" : undefined}\n tabIndex={disabled ? undefined : -1}\n className={cn(\n DROPDOWN_MENU_CHECK_ITEM,\n className,\n )}\n onClick={(e) => {\n if (disabled) return;\n onClick?.(e);\n }}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n (e.currentTarget as HTMLElement).click();\n }\n }}\n {...props}\n >\n <span className={DROPDOWN_MENU_ITEM_INDICATOR}>\n {checked ? (\n <svg className=\"size-4\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n <path d=\"M20 6 9 17l-5-5\" />\n </svg>\n ) : null}\n </span>\n {children}\n </div>\n );\n}\n\ninterface DropdownMenuRadioGroupContextValue {\n value: string | undefined;\n setValue: (next: string) => void;\n}\n\nconst DropdownMenuRadioGroupContext =\n React.createContext<DropdownMenuRadioGroupContextValue | null>(null);\n\nexport interface DropdownMenuRadioGroupProps extends Omit<React.ComponentProps<\"div\">, \"onChange\"> {\n value?: string;\n onValueChange?: (value: string) => void;\n}\n\nexport function DropdownMenuRadioGroup({\n className,\n value,\n onValueChange,\n children,\n ...props\n}: DropdownMenuRadioGroupProps) {\n const ctx = React.useMemo<DropdownMenuRadioGroupContextValue>(\n () => ({ value, setValue: (next) => onValueChange?.(next) }),\n [value, onValueChange],\n );\n return (\n <DropdownMenuRadioGroupContext.Provider value={ctx}>\n <div data-slot=\"dropdown-menu-radio-group\" role=\"group\" className={className} {...props}>\n {children}\n </div>\n </DropdownMenuRadioGroupContext.Provider>\n );\n}\n\nexport interface DropdownMenuRadioItemProps extends React.ComponentProps<\"div\"> {\n value: string;\n disabled?: boolean;\n}\n\nexport function DropdownMenuRadioItem({\n className,\n children,\n value,\n disabled,\n onClick,\n ...props\n}: DropdownMenuRadioItemProps) {\n const close = React.useContext(DropdownMenuCloseContext);\n const group = React.useContext(DropdownMenuRadioGroupContext);\n const checked = group?.value === value;\n return (\n <div\n data-slot=\"dropdown-menu-radio-item\"\n role=\"menuitemradio\"\n aria-checked={checked}\n data-state={checked ? \"checked\" : \"unchecked\"}\n data-disabled={disabled ? \"\" : undefined}\n tabIndex={disabled ? undefined : -1}\n className={cn(\n DROPDOWN_MENU_CHECK_ITEM,\n className,\n )}\n onClick={(e) => {\n if (disabled) return;\n onClick?.(e);\n group?.setValue(value);\n close();\n }}\n {...props}\n >\n <span className={DROPDOWN_MENU_ITEM_INDICATOR}>\n {checked ? (\n <svg className=\"size-2 fill-current\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n </svg>\n ) : null}\n </span>\n {children}\n </div>\n );\n}\n\nexport interface DropdownMenuLabelProps extends React.ComponentProps<\"div\"> {\n inset?: boolean;\n}\n\nexport function DropdownMenuLabel({ className, inset, ...props }: DropdownMenuLabelProps) {\n return (\n <div\n data-slot=\"dropdown-menu-label\"\n data-inset={inset ? \"\" : undefined}\n className={cn(DROPDOWN_MENU_LABEL, className)}\n {...props}\n />\n );\n}\n\nexport function DropdownMenuSeparator({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"dropdown-menu-separator\"\n role=\"separator\"\n className={cn(DROPDOWN_MENU_SEPARATOR, className)}\n {...props}\n />\n );\n}\n\nexport function DropdownMenuShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(DROPDOWN_MENU_SHORTCUT, className)}\n {...props}\n />\n );\n}\n\n// Sub-menus render inline (nested) rather than in a separate floating layer: the\n// sub-content is revealed in place when its trigger toggles, simplifying the\n// nesting Radix portals each level. data-state still reflects open/closed.\ninterface DropdownMenuSubContextValue {\n open: boolean;\n setOpen: (next: boolean) => void;\n triggerRef: React.RefObject<HTMLDivElement | null>;\n /** Set by a keyboard open, so the first item takes focus; a pointer open leaves focus alone. */\n focusFirst: React.RefObject<boolean>;\n}\n\nconst DropdownMenuSubContext = React.createContext<DropdownMenuSubContextValue | null>(null);\n\nexport interface DropdownMenuSubProps {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n children?: React.ReactNode;\n}\n\nexport function DropdownMenuSub({ open, defaultOpen = false, onOpenChange, children }: DropdownMenuSubProps) {\n const [isOpen, setOpen] = useControllableState<boolean>({\n ...(open !== undefined ? { value: open } : {}),\n defaultValue: defaultOpen,\n ...(onOpenChange ? { onChange: onOpenChange } : {}),\n });\n const triggerRef = React.useRef<HTMLDivElement | null>(null);\n const focusFirst = React.useRef(false);\n // On the wrapper, which holds the trigger and the flyout, so crossing from one to the other is not \"leaving\".\n const hover = useHoverIntent({\n onOpen: () => setOpen(true),\n onClose: () => setOpen(false),\n openDelay: 100,\n closeDelay: 150,\n });\n return (\n <DropdownMenuSubContext.Provider value={{ open: isOpen, setOpen, triggerRef, focusFirst }}>\n <div data-slot=\"dropdown-menu-sub\" {...hover}>\n {children}\n </div>\n </DropdownMenuSubContext.Provider>\n );\n}\n\nexport interface DropdownMenuSubTriggerProps extends React.ComponentProps<\"div\"> {\n inset?: boolean;\n}\n\nexport function DropdownMenuSubTrigger({\n className,\n inset,\n children,\n onClick,\n onKeyDown,\n ...props\n}: DropdownMenuSubTriggerProps) {\n const ctx = React.useContext(DropdownMenuSubContext);\n return (\n <div\n ref={ctx?.triggerRef}\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset ? \"\" : undefined}\n data-state={ctx?.open ? \"open\" : \"closed\"}\n role=\"menuitem\"\n aria-haspopup=\"menu\"\n aria-expanded={ctx?.open}\n tabIndex={-1}\n className={cn(\n DROPDOWN_MENU_SUB_TRIGGER,\n className,\n )}\n onClick={(e) => {\n onClick?.(e);\n ctx?.setOpen(!ctx.open);\n }}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n if (!ctx || (e.key !== \"ArrowRight\" && e.key !== \"Enter\" && e.key !== \" \")) return;\n e.preventDefault();\n // Stops the menu's own handler, which would read Enter as \"select this item\".\n e.stopPropagation();\n ctx.focusFirst.current = true;\n ctx.setOpen(true);\n }}\n {...props}\n >\n {children}\n <svg className=\"ml-auto size-4\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n <path d=\"m9 18 6-6-6-6\" />\n </svg>\n </div>\n );\n}\n\nexport function DropdownMenuSubContent({ className, children, onKeyDown, ...props }: React.ComponentProps<\"div\">) {\n const ctx = React.useContext(DropdownMenuSubContext);\n const ref = React.useRef<HTMLDivElement | null>(null);\n const open = ctx?.open ?? false;\n React.useEffect(() => {\n if (!open || !ctx?.focusFirst.current) return;\n ctx.focusFirst.current = false;\n ref.current?.querySelector<HTMLElement>(\"[role^='menuitem']\")?.focus();\n }, [open, ctx]);\n if (!ctx?.open) return null;\n return (\n <div\n ref={ref}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n if (e.key === \"ArrowLeft\" || e.key === \"Escape\") {\n // Closes this flyout only; Escape would otherwise reach the whole menu's dismissal.\n e.preventDefault();\n e.stopPropagation();\n ctx.setOpen(false);\n ctx.triggerRef.current?.focus();\n }\n }}\n data-slot=\"dropdown-menu-sub-content\"\n data-state=\"open\"\n role=\"menu\"\n className={cn(\n DROPDOWN_MENU_SUB_CONTENT,\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n}\n"],"mappings":";AAyDM,cAgMF,YAhME;AAvDN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB,2BAA2B;AAC3D,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,iBAAiB;AAC1B,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAQP,MAAM,sBAAsB,MAAM;AAAA,EAChC;AACF;AAEA,SAAS,kBAA4C;AACnD,QAAM,MAAM,MAAM,WAAW,mBAAmB;AAChD,MAAI,CAAC,IAAK,OAAM,IAAI,MAAM,uDAAuD;AACjF,SAAO;AACT;AASO,SAAS,aAAa,EAAE,MAAM,cAAc,OAAO,cAAc,SAAS,GAAsB;AACrG,QAAM,CAAC,QAAQ,OAAO,IAAI,qBAA8B;AAAA,IACtD,GAAI,SAAS,SAAY,EAAE,OAAO,KAAK,IAAI,CAAC;AAAA,IAC5C,cAAc;AAAA,IACd,GAAI,eAAe,EAAE,UAAU,aAAa,IAAI,CAAC;AAAA,EACnD,CAAC;AACD,QAAM,YAAY,MAAM,OAA2B,IAAI;AACvD,SACE,oBAAC,oBAAoB,UAApB,EAA6B,OAAO,EAAE,MAAM,QAAQ,SAAS,UAAU,GACtE,8BAAC,SAAI,aAAU,iBAAiB,UAAS,GAC3C;AAEJ;AAEO,SAAS,mBAAmB,EAAE,SAAS,GAAmC;AAC/E,SAAO,oBAAC,UAAQ,UAAS;AAC3B;AAMO,SAAS,oBAAoB,EAAE,UAAU,OAAO,SAAS,GAAG,MAAM,GAA6B;AACpG,QAAM,EAAE,MAAM,SAAS,UAAU,IAAI,gBAAgB;AACrD,QAAM,OAAO,UAAU,OAAO;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,iBAAc;AAAA,MACd,iBAAe;AAAA,MACf,cAAY,OAAO,SAAS;AAAA,MAC5B,KAAK;AAAA,MACL,SAAS,CAAC,MAA2C;AACnD,kBAAU,CAAC;AACX,gBAAQ,CAAC,IAAI;AAAA,MACf;AAAA,MACC,GAAI;AAAA;AAAA,EACP;AAEJ;AAOO,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA,aAAa;AAAA,EACb,QAAQ;AAAA,EACR;AAAA,EACA,GAAG;AACL,GAA6B;AAC3B,QAAM,EAAE,MAAM,SAAS,UAAU,IAAI,gBAAgB;AACrD,QAAM,EAAE,WAAW,KAAK,QAAQ,IAAI,YAAY,IAAI;AACpD,QAAM,EAAE,aAAa,OAAO,KAAK,IAAI,YAAY;AAAA,IAC/C;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA,QAAQ;AAAA,EACV,CAAC;AACD,QAAM,aAAa,oBAAoB;AAAA,IACrC,SAAS;AAAA,IACT,WAAW,MAAM,QAAQ,KAAK;AAAA,IAC9B,SAAS,CAAC,SAAS;AAAA,EACrB,CAAC;AACD,QAAM,aAAa,MAAM,OAA8B,IAAI;AAE3D,QAAM,QAAQ,MACZ,MAAM;AAAA,IACJ,WAAW,SAAS,iBAA8B,oBAAoB,KAAK,CAAC;AAAA,EAC9E,EAAE,OAAO,CAAC,OAAO,GAAG,aAAa,eAAe,MAAM,IAAI;AAC5D,QAAM,EAAE,aAAa,gBAAgB,WAAW,cAAc,IAAI,eAAe;AAAA,IAC/E,OAAO,MAAM,MAAM,EAAE;AAAA,IACrB,aAAa;AAAA,IACb,MAAM;AAAA,EACR,CAAC;AAGD,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,KAAM,gBAAe,CAAC;AAAA,EAC7B,GAAG,CAAC,MAAM,cAAc,CAAC;AACzB,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,KAAM;AACX,UAAM,EAAE,WAAW,GAAG,MAAM;AAAA,EAC9B,GAAG,CAAC,MAAM,WAAW,CAAC;AAGtB,QAAM,UAAU,MAAM,OAAO,KAAK;AAClC,QAAM,UAAU,MAAM;AACpB,QAAI,MAAM;AACR,cAAQ,UAAU;AAClB;AAAA,IACF;AACA,QAAI,CAAC,QAAQ,QAAS;AACtB,YAAQ,UAAU;AAClB,UAAM,SAAS,SAAS;AACxB,QAAI,CAAC,UAAU,WAAW,SAAS,QAAQ,WAAW,SAAS,SAAS,MAAM,EAAG,WAAU,SAAS,MAAM;AAAA,EAC5G,GAAG,CAAC,MAAM,SAAS,CAAC;AAEpB,QAAM,QAAQ,MAAM,YAAY,MAAM,QAAQ,KAAK,GAAG,CAAC,OAAO,CAAC;AAC/D,MAAI,CAAC,UAAW,QAAO;AACvB,SACE,oBAAC,UACC,8BAAC,yBAAyB,UAAzB,EAAkC,OAAO,OACxC;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,cAAY,OAAO,SAAS;AAAA,MAC5B,aAAW;AAAA,MACX,MAAK;AAAA,MACL,UAAU;AAAA,MAGV,WAAW;AAAA,MACX,KAAK,UAAU,aAAa,YAAY,SAAS,UAAU;AAAA,MAC3D;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAI;AAAA,MAEL,8BAAC,yBAAsB,OAAO,YAAa,UAAS;AAAA;AAAA,EACtD,GACF,GACF;AAEJ;AAEA,MAAM,2BAA2B,MAAM,cAA0B,MAAM;AAAC,CAAC;AAElE,SAAS,kBAAkB,EAAE,WAAW,GAAG,MAAM,GAAgC;AACtF,SAAO,oBAAC,SAAI,aAAU,uBAAsB,MAAK,SAAQ,WAAuB,GAAG,OAAO;AAC5F;AAUO,SAAS,iBAAiB;AAAA,EAC/B,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA0B;AACxB,QAAM,QAAQ,MAAM,WAAW,wBAAwB;AACvD,QAAM,OAAO,UAAU,OAAO;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,cAAY,QAAQ,KAAK;AAAA,MACzB,gBAAc;AAAA,MACd,iBAAe,WAAW,KAAK;AAAA,MAC/B,MAAK;AAAA,MACL,UAAU,WAAW,SAAY;AAAA,MACjC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,CAAC,MAAM;AACd,YAAI,SAAU;AACd,kBAAU,CAAC;AACX,cAAM;AAAA,MACR;AAAA,MACA,WAAW,CAAC,MAAM;AAChB,oBAAY,CAAC;AACb,YAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,YAAE,eAAe;AACjB,UAAC,EAAE,cAA8B,MAAM;AAAA,QACzC;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAOO,SAAS,yBAAyB;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkC;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,gBAAc;AAAA,MACd,cAAY,UAAU,YAAY;AAAA,MAClC,iBAAe,WAAW,KAAK;AAAA,MAC/B,UAAU,WAAW,SAAY;AAAA,MACjC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,CAAC,MAAM;AACd,YAAI,SAAU;AACd,kBAAU,CAAC;AAAA,MACb;AAAA,MACA,WAAW,CAAC,MAAM;AAChB,oBAAY,CAAC;AACb,YAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,YAAE,eAAe;AACjB,UAAC,EAAE,cAA8B,MAAM;AAAA,QACzC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,4BAAC,UAAK,WAAW,8BACd,oBACC,oBAAC,SAAI,WAAU,UAAS,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KAAI,eAAc,SAAQ,gBAAe,SAAQ,eAAY,QACrJ,8BAAC,UAAK,GAAE,mBAAkB,GAC5B,IACE,MACN;AAAA,QACC;AAAA;AAAA;AAAA,EACH;AAEJ;AAOA,MAAM,gCACJ,MAAM,cAAyD,IAAI;AAO9D,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,QAAM,MAAM,MAAM;AAAA,IAChB,OAAO,EAAE,OAAO,UAAU,CAAC,SAAS,gBAAgB,IAAI,EAAE;AAAA,IAC1D,CAAC,OAAO,aAAa;AAAA,EACvB;AACA,SACE,oBAAC,8BAA8B,UAA9B,EAAuC,OAAO,KAC7C,8BAAC,SAAI,aAAU,6BAA4B,MAAK,SAAQ,WAAuB,GAAG,OAC/E,UACH,GACF;AAEJ;AAOO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA+B;AAC7B,QAAM,QAAQ,MAAM,WAAW,wBAAwB;AACvD,QAAM,QAAQ,MAAM,WAAW,6BAA6B;AAC5D,QAAM,UAAU,OAAO,UAAU;AACjC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,gBAAc;AAAA,MACd,cAAY,UAAU,YAAY;AAAA,MAClC,iBAAe,WAAW,KAAK;AAAA,MAC/B,UAAU,WAAW,SAAY;AAAA,MACjC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,CAAC,MAAM;AACd,YAAI,SAAU;AACd,kBAAU,CAAC;AACX,eAAO,SAAS,KAAK;AACrB,cAAM;AAAA,MACR;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,4BAAC,UAAK,WAAW,8BACd,oBACC,oBAAC,SAAI,WAAU,uBAAsB,SAAQ,aAAY,eAAY,QACnE,8BAAC,YAAO,IAAG,MAAK,IAAG,MAAK,GAAE,MAAK,GACjC,IACE,MACN;AAAA,QACC;AAAA;AAAA;AAAA,EACH;AAEJ;AAMO,SAAS,kBAAkB,EAAE,WAAW,OAAO,GAAG,MAAM,GAA2B;AACxF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,cAAY,QAAQ,KAAK;AAAA,MACzB,WAAW,GAAG,qBAAqB,SAAS;AAAA,MAC3C,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,sBAAsB,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC1F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,WAAW,GAAG,yBAAyB,SAAS;AAAA,MAC/C,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,qBAAqB,EAAE,WAAW,GAAG,MAAM,GAAiC;AAC1F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,wBAAwB,SAAS;AAAA,MAC9C,GAAG;AAAA;AAAA,EACN;AAEJ;AAaA,MAAM,yBAAyB,MAAM,cAAkD,IAAI;AASpF,SAAS,gBAAgB,EAAE,MAAM,cAAc,OAAO,cAAc,SAAS,GAAyB;AAC3G,QAAM,CAAC,QAAQ,OAAO,IAAI,qBAA8B;AAAA,IACtD,GAAI,SAAS,SAAY,EAAE,OAAO,KAAK,IAAI,CAAC;AAAA,IAC5C,cAAc;AAAA,IACd,GAAI,eAAe,EAAE,UAAU,aAAa,IAAI,CAAC;AAAA,EACnD,CAAC;AACD,QAAM,aAAa,MAAM,OAA8B,IAAI;AAC3D,QAAM,aAAa,MAAM,OAAO,KAAK;AAErC,QAAM,QAAQ,eAAe;AAAA,IAC3B,QAAQ,MAAM,QAAQ,IAAI;AAAA,IAC1B,SAAS,MAAM,QAAQ,KAAK;AAAA,IAC5B,WAAW;AAAA,IACX,YAAY;AAAA,EACd,CAAC;AACD,SACE,oBAAC,uBAAuB,UAAvB,EAAgC,OAAO,EAAE,MAAM,QAAQ,SAAS,YAAY,WAAW,GACtF,8BAAC,SAAI,aAAU,qBAAqB,GAAG,OACpC,UACH,GACF;AAEJ;AAMO,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,QAAM,MAAM,MAAM,WAAW,sBAAsB;AACnD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,KAAK;AAAA,MACV,aAAU;AAAA,MACV,cAAY,QAAQ,KAAK;AAAA,MACzB,cAAY,KAAK,OAAO,SAAS;AAAA,MACjC,MAAK;AAAA,MACL,iBAAc;AAAA,MACd,iBAAe,KAAK;AAAA,MACpB,UAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,CAAC,MAAM;AACd,kBAAU,CAAC;AACX,aAAK,QAAQ,CAAC,IAAI,IAAI;AAAA,MACxB;AAAA,MACA,WAAW,CAAC,MAAM;AAChB,oBAAY,CAAC;AACb,YAAI,CAAC,OAAQ,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,WAAW,EAAE,QAAQ,IAAM;AAC5E,UAAE,eAAe;AAEjB,UAAE,gBAAgB;AAClB,YAAI,WAAW,UAAU;AACzB,YAAI,QAAQ,IAAI;AAAA,MAClB;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,QACD,oBAAC,SAAI,WAAU,kBAAiB,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KAAI,eAAc,SAAQ,gBAAe,SAAQ,eAAY,QAC7J,8BAAC,UAAK,GAAE,iBAAgB,GAC1B;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,uBAAuB,EAAE,WAAW,UAAU,WAAW,GAAG,MAAM,GAAgC;AAChH,QAAM,MAAM,MAAM,WAAW,sBAAsB;AACnD,QAAM,MAAM,MAAM,OAA8B,IAAI;AACpD,QAAM,OAAO,KAAK,QAAQ;AAC1B,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,QAAQ,CAAC,KAAK,WAAW,QAAS;AACvC,QAAI,WAAW,UAAU;AACzB,QAAI,SAAS,cAA2B,oBAAoB,GAAG,MAAM;AAAA,EACvE,GAAG,CAAC,MAAM,GAAG,CAAC;AACd,MAAI,CAAC,KAAK,KAAM,QAAO;AACvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,CAAC,MAAM;AAChB,oBAAY,CAAC;AACb,YAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,UAAU;AAE/C,YAAE,eAAe;AACjB,YAAE,gBAAgB;AAClB,cAAI,QAAQ,KAAK;AACjB,cAAI,WAAW,SAAS,MAAM;AAAA,QAChC;AAAA,MACF;AAAA,MACA,aAAU;AAAA,MACV,cAAW;AAAA,MACX,MAAK;AAAA,MACL,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":[]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import * as React from "react";
|
|
3
|
-
import { cn } from "
|
|
3
|
+
import { cn } from "../../lib/cn.js";
|
|
4
4
|
import {
|
|
5
5
|
EMPTY,
|
|
6
6
|
EMPTY_CONTENT,
|
|
@@ -9,7 +9,7 @@ import {
|
|
|
9
9
|
EMPTY_MEDIA_BASE,
|
|
10
10
|
EMPTY_TITLE,
|
|
11
11
|
emptyMediaVariants
|
|
12
|
-
} from "
|
|
12
|
+
} from "../../generated/empty.js";
|
|
13
13
|
function Empty({ className, ...props }) {
|
|
14
14
|
return /* @__PURE__ */ jsx("div", { "data-slot": "empty", className: cn(EMPTY, className), ...props });
|
|
15
15
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/empty.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n EMPTY,\n EMPTY_CONTENT,\n EMPTY_DESCRIPTION,\n EMPTY_HEADER,\n EMPTY_MEDIA_BASE,\n EMPTY_TITLE,\n emptyMediaVariants,\n type EmptyMediaVariant,\n} from \"../../generated/empty\";\n\nexport type { EmptyMediaVariant };\n\nexport function Empty({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div data-slot=\"empty\" className={cn(EMPTY, className)} {...props} />\n );\n}\n\nexport function EmptyHeader({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-header\"\n className={cn(EMPTY_HEADER, className)}\n {...props}\n />\n );\n}\n\nexport interface EmptyMediaProps extends React.ComponentProps<\"div\"> {\n variant?: EmptyMediaVariant;\n}\n\nexport function EmptyMedia({\n className,\n variant = \"bare\",\n ...props\n}: EmptyMediaProps) {\n return (\n <div\n data-slot=\"empty-icon\"\n data-variant={variant}\n className={cn(EMPTY_MEDIA_BASE, emptyMediaVariants[variant], className)}\n {...props}\n />\n );\n}\n\nexport function EmptyTitle({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-title\"\n className={cn(EMPTY_TITLE, className)}\n {...props}\n />\n );\n}\n\nexport function EmptyDescription({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-description\"\n className={cn(EMPTY_DESCRIPTION, className)}\n {...props}\n />\n );\n}\n\nexport function EmptyContent({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"empty-content\"\n className={cn(EMPTY_CONTENT, className)}\n {...props}\n />\n );\n}\n"],"mappings":"AAiBI;AAjBJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAIA,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC1E,SACE,oBAAC,SAAI,aAAU,SAAQ,WAAW,GAAG,OAAO,SAAS,GAAI,GAAG,OAAO;AAEvE;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,cAAc,SAAS;AAAA,MACpC,GAAG;AAAA;AAAA,EACN;AAEJ;AAMO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAAoB;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,WAAW,GAAG,kBAAkB,mBAAmB,OAAO,GAAG,SAAS;AAAA,MACrE,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,aAAa,SAAS;AAAA,MACnC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,mBAAmB,SAAS;AAAA,MACzC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,eAAe,SAAS;AAAA,MACrC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/field-context.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\n/**\n * The id a `<Field>` hands to the one control it labels. `React.useId` is\n * derived from the position in the tree, so the server render and the hydrating\n * client agree on it — a module counter would not, and the label's `for` would\n * point at nothing after hydration.\n */\nexport interface FieldControl {\n id: string;\n /** Records a control taking the id; returns the release. */\n claim: () => () => void;\n}\n\nexport const FieldControlContext = React.createContext<FieldControl | null>(null);\n\nconst DEV = typeof process !== \"undefined\" && process.env.NODE_ENV !== \"production\";\n\n/** The `claim` of a `Field`: warns in development when a second control takes the id. */\nexport function useFieldClaims(): () => () => void {\n const claims = React.useRef(0);\n return React.useCallback(() => {\n claims.current += 1;\n if (DEV && claims.current === 2) {\n console.warn(\n \"@evinvest/uikit: two controls took the same <Field> id. A Field labels one control; \" +\n \"give the others an `id` of their own.\",\n );\n }\n return () => {\n claims.current -= 1;\n };\n }, []);\n}\n\n/** The caller's `id` when given, else the enclosing `<Field>`'s, else none. */\nexport function useFieldControlId(id: string | undefined): string | undefined {\n const field = React.useContext(FieldControlContext);\n const fromField = id === undefined ? field : null;\n React.useEffect(() => fromField?.claim(), [fromField]);\n return id ?? fromField?.id;\n}\n"],"mappings":";AAEA,YAAY,WAAW;AAchB,MAAM,sBAAsB,MAAM,cAAmC,IAAI;AAEhF,MAAM,MAAM,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa;AAGhE,SAAS,iBAAmC;AACjD,QAAM,SAAS,MAAM,OAAO,CAAC;AAC7B,SAAO,MAAM,YAAY,MAAM;AAC7B,WAAO,WAAW;AAClB,QAAI,OAAO,OAAO,YAAY,GAAG;AAC/B,cAAQ;AAAA,QACN;AAAA,MAEF;AAAA,IACF;AACA,WAAO,MAAM;AACX,aAAO,WAAW;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC;AACP;AAGO,SAAS,kBAAkB,IAA4C;AAC5E,QAAM,QAAQ,MAAM,WAAW,mBAAmB;AAClD,QAAM,YAAY,OAAO,SAAY,QAAQ;AAC7C,QAAM,UAAU,MAAM,WAAW,MAAM,GAAG,CAAC,SAAS,CAAC;AACrD,SAAO,MAAM,WAAW;AAC1B;","names":[]}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { cn } from "../../lib/cn.js";
|
|
4
|
+
import {
|
|
5
|
+
FORM_ROW_BASE,
|
|
6
|
+
FORM_ROW_CONTROL,
|
|
7
|
+
FORM_ROW_DESCRIPTION,
|
|
8
|
+
FORM_ROW_DIVIDER,
|
|
9
|
+
FORM_ROW_HINT,
|
|
10
|
+
FORM_ROW_LABEL,
|
|
11
|
+
FORM_ROW_LABEL_COLUMN
|
|
12
|
+
} from "../../generated/form-row.js";
|
|
13
|
+
function FormRow({
|
|
14
|
+
label,
|
|
15
|
+
htmlFor,
|
|
16
|
+
description,
|
|
17
|
+
hint,
|
|
18
|
+
divider = true,
|
|
19
|
+
className,
|
|
20
|
+
children,
|
|
21
|
+
...props
|
|
22
|
+
}) {
|
|
23
|
+
const Label = htmlFor !== void 0 ? "label" : "span";
|
|
24
|
+
return /* @__PURE__ */ jsxs(
|
|
25
|
+
"div",
|
|
26
|
+
{
|
|
27
|
+
"data-slot": "form-row",
|
|
28
|
+
"data-divider": divider,
|
|
29
|
+
className: cn(
|
|
30
|
+
FORM_ROW_BASE,
|
|
31
|
+
divider && FORM_ROW_DIVIDER,
|
|
32
|
+
className
|
|
33
|
+
),
|
|
34
|
+
...props,
|
|
35
|
+
children: [
|
|
36
|
+
/* @__PURE__ */ jsxs("div", { "data-slot": "form-row-label", className: FORM_ROW_LABEL_COLUMN, children: [
|
|
37
|
+
/* @__PURE__ */ jsx(Label, { ...htmlFor !== void 0 ? { htmlFor } : {}, className: FORM_ROW_LABEL, children: label }),
|
|
38
|
+
description != null && /* @__PURE__ */ jsx("span", { className: FORM_ROW_DESCRIPTION, children: description })
|
|
39
|
+
] }),
|
|
40
|
+
/* @__PURE__ */ jsxs("div", { "data-slot": "form-row-control", className: FORM_ROW_CONTROL, children: [
|
|
41
|
+
children,
|
|
42
|
+
hint != null && /* @__PURE__ */ jsx("span", { className: FORM_ROW_HINT, children: hint })
|
|
43
|
+
] })
|
|
44
|
+
]
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
export {
|
|
49
|
+
FormRow
|
|
50
|
+
};
|
|
51
|
+
//# sourceMappingURL=form-row.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/form-row.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n FORM_ROW_BASE,\n FORM_ROW_CONTROL,\n FORM_ROW_DESCRIPTION,\n FORM_ROW_DIVIDER,\n FORM_ROW_HINT,\n FORM_ROW_LABEL,\n FORM_ROW_LABEL_COLUMN,\n} from \"../../generated/form-row\";\n\nexport interface FormRowProps extends Omit<React.ComponentProps<\"div\">, \"title\"> {\n label: React.ReactNode;\n /** The id of the control in `children`; renders the label as a `<label for>`. */\n htmlFor?: string;\n /** A line under the label. */\n description?: React.ReactNode;\n /** A caption under the control, e.g. a format hint. */\n hint?: React.ReactNode;\n /** Hairline under the row. Default true; the last row of a group turns it off. */\n divider?: boolean;\n}\n\n/**\n * Label on the left, the value or its control on the right; they stack on a\n * phone. A plain `div`, not `ListRow`: it is a form field row, not a list item,\n * and its label column has a fixed width so controls line up down the page.\n */\nexport function FormRow({\n label,\n htmlFor,\n description,\n hint,\n divider = true,\n className,\n children,\n ...props\n}: FormRowProps) {\n const Label = htmlFor !== undefined ? \"label\" : \"span\";\n return (\n <div\n data-slot=\"form-row\"\n data-divider={divider}\n className={cn(\n FORM_ROW_BASE,\n divider && FORM_ROW_DIVIDER,\n className,\n )}\n {...props}\n >\n <div data-slot=\"form-row-label\" className={FORM_ROW_LABEL_COLUMN}>\n <Label {...(htmlFor !== undefined ? { htmlFor } : {})} className={FORM_ROW_LABEL}>\n {label}\n </Label>\n {description != null && <span className={FORM_ROW_DESCRIPTION}>{description}</span>}\n </div>\n <div data-slot=\"form-row-control\" className={FORM_ROW_CONTROL}>\n {children}\n {hint != null && <span className={FORM_ROW_HINT}>{hint}</span>}\n </div>\n </div>\n );\n}\n"],"mappings":"AAmDM,SACE,KADF;AAnDN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAmBA,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiB;AACf,QAAM,QAAQ,YAAY,SAAY,UAAU;AAChD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,WAAW;AAAA,QACT;AAAA,QACA,WAAW;AAAA,QACX;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,6BAAC,SAAI,aAAU,kBAAiB,WAAW,uBACzC;AAAA,8BAAC,SAAO,GAAI,YAAY,SAAY,EAAE,QAAQ,IAAI,CAAC,GAAI,WAAW,gBAC/D,iBACH;AAAA,UACC,eAAe,QAAQ,oBAAC,UAAK,WAAW,sBAAuB,uBAAY;AAAA,WAC9E;AAAA,QACA,qBAAC,SAAI,aAAU,oBAAmB,WAAW,kBAC1C;AAAA;AAAA,UACA,QAAQ,QAAQ,oBAAC,UAAK,WAAW,eAAgB,gBAAK;AAAA,WACzD;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
|
-
import { cn } from "
|
|
5
|
-
import { useControllableState } from "
|
|
6
|
-
import { useFloating } from "
|
|
7
|
-
import { usePresence } from "
|
|
8
|
-
import { mergeRefs } from "
|
|
9
|
-
import { Portal } from "
|
|
10
|
-
import { Slot } from "
|
|
11
|
-
import { HOVER_CARD_CONTENT } from "
|
|
4
|
+
import { cn } from "../../lib/cn.js";
|
|
5
|
+
import { useControllableState } from "../../primitives/use-controllable-state.js";
|
|
6
|
+
import { useFloating } from "../../primitives/use-floating.js";
|
|
7
|
+
import { usePresence } from "../../primitives/presence.js";
|
|
8
|
+
import { mergeRefs } from "../../primitives/merge-refs.js";
|
|
9
|
+
import { Portal } from "../../primitives/portal.js";
|
|
10
|
+
import { Slot } from "../../primitives/slot.js";
|
|
11
|
+
import { HOVER_CARD_CONTENT } from "../../generated/hover-card.js";
|
|
12
12
|
const HoverCardContext = React.createContext(null);
|
|
13
13
|
function useHoverCard() {
|
|
14
14
|
const ctx = React.useContext(HoverCardContext);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/hover-card.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport { useFloating } from \"../../primitives/use-floating\";\nimport { usePresence } from \"../../primitives/presence\";\nimport { mergeRefs } from \"../../primitives/merge-refs\";\nimport { Portal } from \"../../primitives/portal\";\nimport { Slot } from \"../../primitives/slot\";\nimport { HOVER_CARD_CONTENT } from \"../../generated/hover-card\";\n\ninterface HoverCardContextValue {\n open: boolean;\n setOpen: (next: boolean) => void;\n anchorRef: React.RefObject<HTMLElement | null>;\n}\n\nconst HoverCardContext = React.createContext<HoverCardContextValue | null>(null);\n\nfunction useHoverCard(): HoverCardContextValue {\n const ctx = React.useContext(HoverCardContext);\n if (!ctx) throw new Error(\"HoverCard parts must be used within <HoverCard>\");\n return ctx;\n}\n\nexport interface HoverCardProps {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n children?: React.ReactNode;\n}\n\nexport function HoverCard({ open, defaultOpen = false, onOpenChange, children }: HoverCardProps) {\n const [isOpen, setOpen] = useControllableState<boolean>({\n ...(open !== undefined ? { value: open } : {}),\n defaultValue: defaultOpen,\n ...(onOpenChange ? { onChange: onOpenChange } : {}),\n });\n const anchorRef = React.useRef<HTMLElement | null>(null);\n return (\n <HoverCardContext.Provider value={{ open: isOpen, setOpen, anchorRef }}>\n {children}\n </HoverCardContext.Provider>\n );\n}\n\nexport interface HoverCardTriggerProps extends React.ComponentProps<\"a\"> {\n asChild?: boolean;\n}\n\nexport function HoverCardTrigger({\n asChild = false,\n onPointerEnter,\n onPointerLeave,\n ...props\n}: HoverCardTriggerProps) {\n const { setOpen, anchorRef } = useHoverCard();\n const Comp = asChild ? Slot : \"a\";\n return (\n <Comp\n data-slot=\"hover-card-trigger\"\n ref={anchorRef as React.Ref<never>}\n onPointerEnter={(e: React.PointerEvent<HTMLAnchorElement>) => {\n onPointerEnter?.(e);\n setOpen(true);\n }}\n onPointerLeave={(e: React.PointerEvent<HTMLAnchorElement>) => {\n onPointerLeave?.(e);\n setOpen(false);\n }}\n {...(props as Record<string, unknown>)}\n />\n );\n}\n\nexport interface HoverCardContentProps extends React.ComponentProps<\"div\"> {\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n align?: \"start\" | \"center\" | \"end\";\n sideOffset?: number;\n}\n\nexport function HoverCardContent({\n className,\n side: sideProp = \"bottom\",\n align = \"center\",\n sideOffset = 4,\n children,\n ...props\n}: HoverCardContentProps) {\n const { open, anchorRef } = useHoverCard();\n const { isPresent, ref: presRef } = usePresence(open);\n const { floatingRef, style, side } = useFloating({\n anchorRef,\n open,\n side: sideProp,\n align,\n offset: sideOffset,\n });\n if (!isPresent) return null;\n return (\n <Portal>\n <div\n data-slot=\"hover-card-content\"\n data-state={open ? \"open\" : \"closed\"}\n data-side={side}\n data-align={align}\n ref={mergeRefs(floatingRef, presRef)}\n style={style}\n className={cn(HOVER_CARD_CONTENT, className)}\n {...(props as Record<string, unknown>)}\n >\n {children}\n </div>\n </Portal>\n );\n}\n"],"mappings":";AAyCI;AAvCJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB;AAC1B,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,0BAA0B;AAQnC,MAAM,mBAAmB,MAAM,cAA4C,IAAI;AAE/E,SAAS,eAAsC;AAC7C,QAAM,MAAM,MAAM,WAAW,gBAAgB;AAC7C,MAAI,CAAC,IAAK,OAAM,IAAI,MAAM,iDAAiD;AAC3E,SAAO;AACT;AASO,SAAS,UAAU,EAAE,MAAM,cAAc,OAAO,cAAc,SAAS,GAAmB;AAC/F,QAAM,CAAC,QAAQ,OAAO,IAAI,qBAA8B;AAAA,IACtD,GAAI,SAAS,SAAY,EAAE,OAAO,KAAK,IAAI,CAAC;AAAA,IAC5C,cAAc;AAAA,IACd,GAAI,eAAe,EAAE,UAAU,aAAa,IAAI,CAAC;AAAA,EACnD,CAAC;AACD,QAAM,YAAY,MAAM,OAA2B,IAAI;AACvD,SACE,oBAAC,iBAAiB,UAAjB,EAA0B,OAAO,EAAE,MAAM,QAAQ,SAAS,UAAU,GAClE,UACH;AAEJ;AAMO,SAAS,iBAAiB;AAAA,EAC/B,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA0B;AACxB,QAAM,EAAE,SAAS,UAAU,IAAI,aAAa;AAC5C,QAAM,OAAO,UAAU,OAAO;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,KAAK;AAAA,MACL,gBAAgB,CAAC,MAA6C;AAC5D,yBAAiB,CAAC;AAClB,gBAAQ,IAAI;AAAA,MACd;AAAA,MACA,gBAAgB,CAAC,MAA6C;AAC5D,yBAAiB,CAAC;AAClB,gBAAQ,KAAK;AAAA,MACf;AAAA,MACC,GAAI;AAAA;AAAA,EACP;AAEJ;AAQO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,MAAM,WAAW;AAAA,EACjB,QAAQ;AAAA,EACR,aAAa;AAAA,EACb;AAAA,EACA,GAAG;AACL,GAA0B;AACxB,QAAM,EAAE,MAAM,UAAU,IAAI,aAAa;AACzC,QAAM,EAAE,WAAW,KAAK,QAAQ,IAAI,YAAY,IAAI;AACpD,QAAM,EAAE,aAAa,OAAO,KAAK,IAAI,YAAY;AAAA,IAC/C;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA,QAAQ;AAAA,EACV,CAAC;AACD,MAAI,CAAC,UAAW,QAAO;AACvB,SACE,oBAAC,UACC;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,cAAY,OAAO,SAAS;AAAA,MAC5B,aAAW;AAAA,MACX,cAAY;AAAA,MACZ,KAAK,UAAU,aAAa,OAAO;AAAA,MACnC;AAAA,MACA,WAAW,GAAG,oBAAoB,SAAS;AAAA,MAC1C,GAAI;AAAA,MAEJ;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
|
-
import { cn } from "
|
|
5
|
-
import { useControllableState } from "
|
|
6
|
-
import { useFloating } from "
|
|
7
|
-
import { DismissableLayerScope, useDismissableLayer } from "
|
|
8
|
-
import { usePresence } from "
|
|
9
|
-
import { useHoverIntent } from "
|
|
10
|
-
import { mergeRefs } from "
|
|
11
|
-
import { Portal } from "
|
|
12
|
-
import { Slot } from "
|
|
13
|
-
import { POPOVER_CONTENT } from "
|
|
4
|
+
import { cn } from "../../lib/cn.js";
|
|
5
|
+
import { useControllableState } from "../../primitives/use-controllable-state.js";
|
|
6
|
+
import { useFloating } from "../../primitives/use-floating.js";
|
|
7
|
+
import { DismissableLayerScope, useDismissableLayer } from "../../primitives/dismissable-layer.js";
|
|
8
|
+
import { usePresence } from "../../primitives/presence.js";
|
|
9
|
+
import { useHoverIntent } from "../../primitives/use-hover-intent.js";
|
|
10
|
+
import { mergeRefs } from "../../primitives/merge-refs.js";
|
|
11
|
+
import { Portal } from "../../primitives/portal.js";
|
|
12
|
+
import { Slot } from "../../primitives/slot.js";
|
|
13
|
+
import { POPOVER_CONTENT } from "../../generated/popover.js";
|
|
14
14
|
const InfoTipContext = React.createContext(null);
|
|
15
15
|
function useInfoTip() {
|
|
16
16
|
const ctx = React.useContext(InfoTipContext);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/info-tip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport { useFloating } from \"../../primitives/use-floating\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../../primitives/dismissable-layer\";\nimport { usePresence } from \"../../primitives/presence\";\nimport { useHoverIntent } from \"../../primitives/use-hover-intent\";\nimport { mergeRefs } from \"../../primitives/merge-refs\";\nimport { Portal } from \"../../primitives/portal\";\nimport { Slot } from \"../../primitives/slot\";\nimport { POPOVER_CONTENT } from \"../../generated/popover\";\n\n/**\n * `InfoTip` — the ⓘ-beside-a-label *toggletip*. It reuses the popover machinery\n * (controllable state + floating + dismissable layer + portal) but deliberately\n * NOT the tooltip ARIA: the trigger is a real `<button aria-expanded aria-controls>`\n * and the bubble is a `role=\"status\"` live region, never `role=\"tooltip\"`. That is\n * the pattern that stays correct across mouse, keyboard and touch (a `role=tooltip`\n * is hover/focus-only and never opens on tap). Hover-with-intent (~0.5s) is layered\n * on as a mouse-only enhancement; click/tap/Enter/Space toggle instantly.\n *\n * The bubble holds plain, non-interactive help text — it does not trap focus and\n * nothing inside it is focusable, so there is no focus to manage or return.\n */\ninterface InfoTipContextValue {\n open: boolean;\n setOpen: (next: boolean) => void;\n anchorRef: React.RefObject<HTMLElement | null>;\n contentId: string;\n}\n\nconst InfoTipContext = React.createContext<InfoTipContextValue | null>(null);\n\nfunction useInfoTip(): InfoTipContextValue {\n const ctx = React.useContext(InfoTipContext);\n if (!ctx) throw new Error(\"InfoTip parts must be used within <InfoTip>\");\n return ctx;\n}\n\nexport interface InfoTipProps {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n children?: React.ReactNode;\n}\n\nexport function InfoTip({\n open,\n defaultOpen = false,\n onOpenChange,\n children,\n}: InfoTipProps) {\n const [isOpen, setOpen] = useControllableState<boolean>({\n ...(open !== undefined ? { value: open } : {}),\n defaultValue: defaultOpen,\n ...(onOpenChange ? { onChange: onOpenChange } : {}),\n });\n const anchorRef = React.useRef<HTMLElement | null>(null);\n const contentId = React.useId();\n return (\n <InfoTipContext.Provider\n value={{ open: isOpen, setOpen, anchorRef, contentId }}\n >\n {children}\n </InfoTipContext.Provider>\n );\n}\n\n// lucide `info`, inlined per the kit's no-lucide-dep icon convention.\nfunction InfoGlyph({ className }: { className?: string }) {\n return (\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={2}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden\n className={cn(\"size-4\", className)}\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n <path d=\"M12 16v-4\" />\n <path d=\"M12 8h.01\" />\n </svg>\n );\n}\n\nexport interface InfoTipTriggerProps extends React.ComponentProps<\"button\"> {\n asChild?: boolean;\n /** Accessible name for the icon-only button. */\n label?: string;\n /** Milliseconds the mouse must dwell before the tip opens on hover. */\n hoverDelay?: number;\n}\n\nexport function InfoTipTrigger({\n asChild = false,\n label = \"More information\",\n hoverDelay = 500,\n className,\n onClick,\n onBlur,\n onPointerEnter,\n onPointerLeave,\n children,\n ...props\n}: InfoTipTriggerProps) {\n const { open, setOpen, anchorRef, contentId } = useInfoTip();\n const hover = useHoverIntent({\n onOpen: () => setOpen(true),\n onClose: () => setOpen(false),\n openDelay: hoverDelay,\n });\n const Comp = asChild ? Slot : \"button\";\n return (\n <Comp\n data-slot=\"info-tip-trigger\"\n data-state={open ? \"open\" : \"closed\"}\n type={asChild ? undefined : \"button\"}\n aria-label={label}\n aria-expanded={open}\n aria-controls={contentId}\n ref={anchorRef as React.Ref<never>}\n className={cn(\n \"inline-flex size-4 shrink-0 cursor-help items-center justify-center rounded-full align-middle text-ink-soft outline-none transition-colors hover:text-ink focus-visible:ring-2 focus-visible:ring-ring data-[state=open]:text-accent-debug\",\n className,\n )}\n onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e);\n setOpen(!open);\n }}\n onBlur={(e: React.FocusEvent<HTMLButtonElement>) => {\n onBlur?.(e);\n setOpen(false);\n }}\n onPointerEnter={(e: React.PointerEvent<HTMLButtonElement>) => {\n onPointerEnter?.(e);\n hover.onPointerEnter(e);\n }}\n onPointerLeave={(e: React.PointerEvent<HTMLButtonElement>) => {\n onPointerLeave?.(e);\n hover.onPointerLeave(e);\n }}\n {...(props as Record<string, unknown>)}\n >\n {children ?? <InfoGlyph />}\n </Comp>\n );\n}\n\nexport interface InfoTipContentProps extends React.ComponentProps<\"div\"> {\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n align?: \"start\" | \"center\" | \"end\";\n sideOffset?: number;\n}\n\nexport function InfoTipContent({\n className,\n side: sideProp = \"bottom\",\n align = \"center\",\n sideOffset = 6,\n children,\n ...props\n}: InfoTipContentProps) {\n const { open, setOpen, anchorRef, contentId } = useInfoTip();\n const { isPresent, ref: presRef } = usePresence(open);\n const { floatingRef, style, side } = useFloating({\n anchorRef,\n open,\n side: sideProp,\n align,\n offset: sideOffset,\n });\n const dismissRef = useDismissableLayer({\n enabled: open,\n onDismiss: () => setOpen(false),\n exclude: [anchorRef],\n });\n if (!isPresent) return null;\n return (\n <Portal>\n <div\n id={contentId}\n role=\"status\"\n aria-live=\"polite\"\n data-slot=\"info-tip-content\"\n data-state={open ? \"open\" : \"closed\"}\n data-side={side}\n data-align={align}\n ref={mergeRefs(floatingRef, dismissRef, presRef)}\n style={style}\n className={cn(POPOVER_CONTENT, \"w-64 p-3 text-sm\", className)}\n {...(props as Record<string, unknown>)}\n >\n <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n </div>\n </Portal>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
|
-
import { cn } from "
|
|
5
|
-
import { useControllableState } from "
|
|
4
|
+
import { cn } from "../../lib/cn.js";
|
|
5
|
+
import { useControllableState } from "../../primitives/use-controllable-state.js";
|
|
6
6
|
import {
|
|
7
7
|
INPUT_OTP_CONTAINER,
|
|
8
8
|
INPUT_OTP_GROUP,
|
|
@@ -10,7 +10,7 @@ import {
|
|
|
10
10
|
INPUT_OTP_SLOT,
|
|
11
11
|
INPUT_OTP_SLOT_CARET,
|
|
12
12
|
INPUT_OTP_SLOT_CARET_WRAPPER
|
|
13
|
-
} from "
|
|
13
|
+
} from "../../generated/input-otp.js";
|
|
14
14
|
const InputOTPContext = React.createContext(null);
|
|
15
15
|
function useInputOTP() {
|
|
16
16
|
const context = React.useContext(InputOTPContext);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/input-otp.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport {\n INPUT_OTP_CONTAINER,\n INPUT_OTP_GROUP,\n INPUT_OTP_INPUT,\n INPUT_OTP_SLOT,\n INPUT_OTP_SLOT_CARET,\n INPUT_OTP_SLOT_CARET_WRAPPER,\n} from \"../../generated/input-otp\";\n\ntype InputOTPContextValue = {\n value: string;\n maxLength: number;\n activeIndex: number;\n};\n\nconst InputOTPContext = React.createContext<InputOTPContextValue | null>(null);\n\nfunction useInputOTP() {\n const context = React.useContext(InputOTPContext);\n if (!context) {\n throw new Error(\"InputOTP slots must be used within an <InputOTP />\");\n }\n return context;\n}\n\nexport interface InputOTPProps\n extends Omit<React.ComponentProps<\"input\">, \"value\" | \"defaultValue\" | \"onChange\"> {\n maxLength: number;\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n containerClassName?: string;\n children?: React.ReactNode;\n}\n\nexport function InputOTP({\n maxLength,\n value: valueProp,\n defaultValue = \"\",\n onChange,\n className,\n containerClassName,\n children,\n disabled,\n ...props\n}: InputOTPProps) {\n const [value, setValue] = useControllableState<string>({\n value: valueProp,\n defaultValue,\n onChange,\n });\n const [focused, setFocused] = React.useState(false);\n\n const activeIndex = focused ? Math.min(value.length, maxLength - 1) : -1;\n\n return (\n <InputOTPContext.Provider value={{ value, maxLength, activeIndex }}>\n <div\n data-slot=\"input-otp\"\n className={cn(INPUT_OTP_CONTAINER, containerClassName)}\n >\n {children}\n <input\n // drag/momentum: n/a — single visually-hidden input tracks the string\n inputMode=\"numeric\"\n autoComplete=\"one-time-code\"\n maxLength={maxLength}\n value={value}\n disabled={disabled}\n onChange={(e) => setValue(e.target.value.slice(0, maxLength))}\n onFocus={() => setFocused(true)}\n onBlur={() => setFocused(false)}\n className={cn(INPUT_OTP_INPUT, className)}\n {...props}\n />\n </div>\n </InputOTPContext.Provider>\n );\n}\n\nexport function InputOTPGroup({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"input-otp-group\"\n className={cn(INPUT_OTP_GROUP, className)}\n {...props}\n />\n );\n}\n\nexport interface InputOTPSlotProps extends React.ComponentProps<\"div\"> {\n index: number;\n}\n\nexport function InputOTPSlot({ index, className, ...props }: InputOTPSlotProps) {\n const { value, activeIndex } = useInputOTP();\n const char = value[index];\n const isActive = activeIndex === index;\n const hasFakeCaret = isActive && char === undefined;\n\n return (\n <div\n data-slot=\"input-otp-slot\"\n data-active={isActive}\n className={cn(INPUT_OTP_SLOT, className)}\n {...props}\n >\n {char}\n {hasFakeCaret && (\n <div className={INPUT_OTP_SLOT_CARET_WRAPPER}>\n <div className={INPUT_OTP_SLOT_CARET} />\n </div>\n )}\n </div>\n );\n}\n\nexport function InputOTPSeparator({ ...props }: React.ComponentProps<\"div\">) {\n return (\n <div data-slot=\"input-otp-separator\" role=\"separator\" {...props}>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M5 12h14\" />\n </svg>\n </div>\n );\n}\n"],"mappings":";AA8DM,SAKE,KALF;AA5DN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAQP,MAAM,kBAAkB,MAAM,cAA2C,IAAI;AAE7E,SAAS,cAAc;AACrB,QAAM,UAAU,MAAM,WAAW,eAAe;AAChD,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACtE;AACA,SAAO;AACT;AAYO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,QAAM,CAAC,OAAO,QAAQ,IAAI,qBAA6B;AAAA,IACrD,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,CAAC,SAAS,UAAU,IAAI,MAAM,SAAS,KAAK;AAElD,QAAM,cAAc,UAAU,KAAK,IAAI,MAAM,QAAQ,YAAY,CAAC,IAAI;AAEtE,SACE,oBAAC,gBAAgB,UAAhB,EAAyB,OAAO,EAAE,OAAO,WAAW,YAAY,GAC/D;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,qBAAqB,kBAAkB;AAAA,MAEpD;AAAA;AAAA,QACD;AAAA,UAAC;AAAA;AAAA,YAEC,WAAU;AAAA,YACV,cAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,MAAM,MAAM,GAAG,SAAS,CAAC;AAAA,YAC5D,SAAS,MAAM,WAAW,IAAI;AAAA,YAC9B,QAAQ,MAAM,WAAW,KAAK;AAAA,YAC9B,WAAW,GAAG,iBAAiB,SAAS;AAAA,YACvC,GAAG;AAAA;AAAA,QACN;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;AAEO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,iBAAiB,SAAS;AAAA,MACvC,GAAG;AAAA;AAAA,EACN;AAEJ;AAMO,SAAS,aAAa,EAAE,OAAO,WAAW,GAAG,MAAM,GAAsB;AAC9E,QAAM,EAAE,OAAO,YAAY,IAAI,YAAY;AAC3C,QAAM,OAAO,MAAM,KAAK;AACxB,QAAM,WAAW,gBAAgB;AACjC,QAAM,eAAe,YAAY,SAAS;AAE1C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,eAAa;AAAA,MACb,WAAW,GAAG,gBAAgB,SAAS;AAAA,MACtC,GAAG;AAAA,MAEH;AAAA;AAAA,QACA,gBACC,oBAAC,SAAI,WAAW,8BACd,8BAAC,SAAI,WAAW,sBAAsB,GACxC;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEO,SAAS,kBAAkB,EAAE,GAAG,MAAM,GAAgC;AAC3E,SACE,oBAAC,SAAI,aAAU,uBAAsB,MAAK,aAAa,GAAG,OACxD;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,QAAO;AAAA,MACP,aAAY;AAAA,MACZ,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,eAAY;AAAA,MAEZ,8BAAC,UAAK,GAAE,YAAW;AAAA;AAAA,EACrB,GACF;AAEJ;","names":[]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
|
-
import { cn } from "
|
|
5
|
-
import { INPUT_BASE, inputSizeClasses } from "
|
|
6
|
-
import { markLabelable } from "
|
|
4
|
+
import { cn } from "../../lib/cn.js";
|
|
5
|
+
import { INPUT_BASE, inputSizeClasses } from "../../generated/input.js";
|
|
6
|
+
import { markLabelable } from "../../primitives/labelable.js";
|
|
7
7
|
import { useFieldControlId } from "./field-context.js";
|
|
8
8
|
const Input = React.forwardRef(
|
|
9
9
|
function Input2({ className, type, id, size = "md", ...props }, ref) {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/input.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { INPUT_BASE, inputSizeClasses, type InputSize } from \"../../generated/input\";\nimport { markLabelable } from \"../../primitives/labelable\";\nimport { useFieldControlId } from \"./field-context\";\n\nexport type { InputSize };\n\n// The native `size` attribute (a width in characters) gives way to the kit's\n// scale, as it does on `NativeSelect`; a width belongs in `className`.\nexport interface InputProps extends Omit<React.ComponentPropsWithoutRef<\"input\">, \"size\"> {\n size?: InputSize;\n}\n\n// `forwardRef` rather than a `ref` prop so the handle also reaches the element\n// under React 18, where function components drop `ref`.\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n function Input({ className, type, id, size = \"md\", ...props }, ref) {\n return (\n <input\n ref={ref}\n type={type}\n id={useFieldControlId(id)}\n data-slot=\"input\"\n data-size={size}\n className={cn(INPUT_BASE, inputSizeClasses[size], className)}\n {...props}\n />\n );\n },\n);\n\nmarkLabelable(Input);\n"],"mappings":";AAqBM;AAnBN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,YAAY,wBAAwC;AAC7D,SAAS,qBAAqB;AAC9B,SAAS,yBAAyB;AAY3B,MAAM,QAAQ,MAAM;AAAA,EACzB,SAASA,OAAM,EAAE,WAAW,MAAM,IAAI,OAAO,MAAM,GAAG,MAAM,GAAG,KAAK;AAClE,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,IAAI,kBAAkB,EAAE;AAAA,QACxB,aAAU;AAAA,QACV,aAAW;AAAA,QACX,WAAW,GAAG,YAAY,iBAAiB,IAAI,GAAG,SAAS;AAAA,QAC1D,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,cAAc,KAAK;","names":["Input"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import * as React from "react";
|
|
3
|
-
import { cn } from "
|
|
4
|
-
import { KBD_BASE, KBD_GROUP_BASE } from "
|
|
3
|
+
import { cn } from "../../lib/cn.js";
|
|
4
|
+
import { KBD_BASE, KBD_GROUP_BASE } from "../../generated/kbd.js";
|
|
5
5
|
function Kbd({ className, ...props }) {
|
|
6
6
|
return /* @__PURE__ */ jsx(
|
|
7
7
|
"kbd",
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/kbd.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { KBD_BASE, KBD_GROUP_BASE } from \"../../generated/kbd\";\n\nexport function Kbd({ className, ...props }: React.ComponentProps<\"kbd\">) {\n return (\n <kbd\n data-slot=\"kbd\"\n className={cn(KBD_BASE, className)}\n {...props}\n />\n );\n}\n\nexport function KbdGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <kbd\n data-slot=\"kbd-group\"\n className={cn(KBD_GROUP_BASE, className)}\n {...props}\n />\n );\n}\n"],"mappings":"AAMI;AANJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,UAAU,sBAAsB;AAElC,SAAS,IAAI,EAAE,WAAW,GAAG,MAAM,GAAgC;AACxE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,UAAU,SAAS;AAAA,MAChC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,SAAS,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,gBAAgB,SAAS;AAAA,MACtC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { cn } from "../../lib/cn.js";
|
|
5
|
+
import {
|
|
6
|
+
KEY_VALUE_BASE,
|
|
7
|
+
KEY_VALUE_COPY,
|
|
8
|
+
KEY_VALUE_LABEL,
|
|
9
|
+
KEY_VALUE_ROW,
|
|
10
|
+
KEY_VALUE_STATUS,
|
|
11
|
+
KEY_VALUE_VALUE
|
|
12
|
+
} from "../../generated/key-value.js";
|
|
13
|
+
import { UiIcon } from "../../icons/ui-icons.js";
|
|
14
|
+
const COPIED_MS = 2e3;
|
|
15
|
+
async function writeClipboard(text) {
|
|
16
|
+
try {
|
|
17
|
+
if (navigator.clipboard?.writeText) {
|
|
18
|
+
await navigator.clipboard.writeText(text);
|
|
19
|
+
return true;
|
|
20
|
+
}
|
|
21
|
+
} catch {
|
|
22
|
+
}
|
|
23
|
+
const host = document.activeElement?.closest('[role="dialog"]') ?? document.body;
|
|
24
|
+
const area = document.createElement("textarea");
|
|
25
|
+
area.value = text;
|
|
26
|
+
area.setAttribute("readonly", "");
|
|
27
|
+
area.style.position = "fixed";
|
|
28
|
+
area.style.opacity = "0";
|
|
29
|
+
host.append(area);
|
|
30
|
+
area.select();
|
|
31
|
+
try {
|
|
32
|
+
return document.execCommand("copy");
|
|
33
|
+
} finally {
|
|
34
|
+
area.remove();
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
function KeyValue({ label, value, copyText, labels = {}, className, ...props }) {
|
|
38
|
+
const [copied, setCopied] = React.useState(false);
|
|
39
|
+
const timer = React.useRef(void 0);
|
|
40
|
+
React.useEffect(() => () => clearTimeout(timer.current), []);
|
|
41
|
+
const copy = async () => {
|
|
42
|
+
if (copyText === void 0 || !await writeClipboard(copyText)) return;
|
|
43
|
+
setCopied(true);
|
|
44
|
+
clearTimeout(timer.current);
|
|
45
|
+
timer.current = setTimeout(() => setCopied(false), COPIED_MS);
|
|
46
|
+
};
|
|
47
|
+
return /* @__PURE__ */ jsxs("div", { "data-slot": "key-value", className: cn(KEY_VALUE_BASE, className), ...props, children: [
|
|
48
|
+
/* @__PURE__ */ jsx("span", { className: KEY_VALUE_LABEL, children: label }),
|
|
49
|
+
/* @__PURE__ */ jsxs("div", { className: KEY_VALUE_ROW, children: [
|
|
50
|
+
/* @__PURE__ */ jsx("span", { className: KEY_VALUE_VALUE, children: value }),
|
|
51
|
+
copyText !== void 0 && /* @__PURE__ */ jsx(
|
|
52
|
+
"button",
|
|
53
|
+
{
|
|
54
|
+
type: "button",
|
|
55
|
+
"aria-label": labels.copy ?? (typeof label === "string" ? `Copy ${label}` : "Copy"),
|
|
56
|
+
onClick: copy,
|
|
57
|
+
className: KEY_VALUE_COPY,
|
|
58
|
+
children: /* @__PURE__ */ jsx(UiIcon, { name: copied ? "check" : "copy" })
|
|
59
|
+
}
|
|
60
|
+
)
|
|
61
|
+
] }),
|
|
62
|
+
/* @__PURE__ */ jsx("span", { role: "status", "aria-live": "polite", className: KEY_VALUE_STATUS, children: copied ? labels.copied ?? "Copied" : "" })
|
|
63
|
+
] });
|
|
64
|
+
}
|
|
65
|
+
export {
|
|
66
|
+
KeyValue
|
|
67
|
+
};
|
|
68
|
+
//# sourceMappingURL=key-value.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/key-value.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n KEY_VALUE_BASE,\n KEY_VALUE_COPY,\n KEY_VALUE_LABEL,\n KEY_VALUE_ROW,\n KEY_VALUE_STATUS,\n KEY_VALUE_VALUE,\n} from \"../../generated/key-value\";\nimport { UiIcon } from \"../../icons/ui-icons\";\n\nexport interface KeyValueLabels {\n /** The copy button. Default `\"Copy {label}\"` (just `\"Copy\"` when the label is not text). */\n copy?: string;\n /** The polite announcement after a copy. Default `\"Copied\"`. */\n copied?: string;\n}\n\nexport interface KeyValueProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n label: React.ReactNode;\n value: React.ReactNode;\n /** Adds a copy button for this text. */\n copyText?: string;\n labels?: KeyValueLabels;\n}\n\nconst COPIED_MS = 2000;\n\n// The async clipboard API needs a secure context and a user gesture; an\n// insecure origin or an old webview falls back to a selection + execCommand.\nasync function writeClipboard(text: string): Promise<boolean> {\n try {\n if (navigator.clipboard?.writeText) {\n await navigator.clipboard.writeText(text);\n return true;\n }\n } catch {\n // Denied permission: try the selection route below.\n }\n // Inside a modal the focus scope pulls focus back to the dialog, which would drop a selection\n // made in <body>; the helper has to live inside the dialog the user is in.\n const host = document.activeElement?.closest('[role=\"dialog\"]') ?? document.body;\n const area = document.createElement(\"textarea\");\n area.value = text;\n area.setAttribute(\"readonly\", \"\");\n area.style.position = \"fixed\";\n area.style.opacity = \"0\";\n host.append(area);\n area.select();\n try {\n return document.execCommand(\"copy\");\n } finally {\n area.remove();\n }\n}\n\n/** A small label over its value, with an optional copy button. */\nexport function KeyValue({ label, value, copyText, labels = {}, className, ...props }: KeyValueProps) {\n const [copied, setCopied] = React.useState(false);\n const timer = React.useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n React.useEffect(() => () => clearTimeout(timer.current), []);\n\n const copy = async () => {\n if (copyText === undefined || !(await writeClipboard(copyText))) return;\n setCopied(true);\n clearTimeout(timer.current);\n timer.current = setTimeout(() => setCopied(false), COPIED_MS);\n };\n\n return (\n <div data-slot=\"key-value\" className={cn(KEY_VALUE_BASE, className)} {...props}>\n <span className={KEY_VALUE_LABEL}>{label}</span>\n <div className={KEY_VALUE_ROW}>\n <span className={KEY_VALUE_VALUE}>{value}</span>\n {copyText !== undefined && (\n <button\n type=\"button\"\n aria-label={labels.copy ?? (typeof label === \"string\" ? `Copy ${label}` : \"Copy\")}\n onClick={copy}\n className={KEY_VALUE_COPY}\n >\n <UiIcon name={copied ? \"check\" : \"copy\"} />\n </button>\n )}\n </div>\n <span role=\"status\" aria-live=\"polite\" className={KEY_VALUE_STATUS}>\n {copied ? (labels.copied ?? \"Copied\") : \"\"}\n </span>\n </div>\n );\n}\n"],"mappings":";AA0EM,cACA,YADA;AAxEN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc;AAiBvB,MAAM,YAAY;AAIlB,eAAe,eAAe,MAAgC;AAC5D,MAAI;AACF,QAAI,UAAU,WAAW,WAAW;AAClC,YAAM,UAAU,UAAU,UAAU,IAAI;AACxC,aAAO;AAAA,IACT;AAAA,EACF,QAAQ;AAAA,EAER;AAGA,QAAM,OAAO,SAAS,eAAe,QAAQ,iBAAiB,KAAK,SAAS;AAC5E,QAAM,OAAO,SAAS,cAAc,UAAU;AAC9C,OAAK,QAAQ;AACb,OAAK,aAAa,YAAY,EAAE;AAChC,OAAK,MAAM,WAAW;AACtB,OAAK,MAAM,UAAU;AACrB,OAAK,OAAO,IAAI;AAChB,OAAK,OAAO;AACZ,MAAI;AACF,WAAO,SAAS,YAAY,MAAM;AAAA,EACpC,UAAE;AACA,SAAK,OAAO;AAAA,EACd;AACF;AAGO,SAAS,SAAS,EAAE,OAAO,OAAO,UAAU,SAAS,CAAC,GAAG,WAAW,GAAG,MAAM,GAAkB;AACpG,QAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAS,KAAK;AAChD,QAAM,QAAQ,MAAM,OAAkD,MAAS;AAC/E,QAAM,UAAU,MAAM,MAAM,aAAa,MAAM,OAAO,GAAG,CAAC,CAAC;AAE3D,QAAM,OAAO,YAAY;AACvB,QAAI,aAAa,UAAa,CAAE,MAAM,eAAe,QAAQ,EAAI;AACjE,cAAU,IAAI;AACd,iBAAa,MAAM,OAAO;AAC1B,UAAM,UAAU,WAAW,MAAM,UAAU,KAAK,GAAG,SAAS;AAAA,EAC9D;AAEA,SACE,qBAAC,SAAI,aAAU,aAAY,WAAW,GAAG,gBAAgB,SAAS,GAAI,GAAG,OACvE;AAAA,wBAAC,UAAK,WAAW,iBAAkB,iBAAM;AAAA,IACzC,qBAAC,SAAI,WAAW,eACd;AAAA,0BAAC,UAAK,WAAW,iBAAkB,iBAAM;AAAA,MACxC,aAAa,UACZ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAY,OAAO,SAAS,OAAO,UAAU,WAAW,QAAQ,KAAK,KAAK;AAAA,UAC1E,SAAS;AAAA,UACT,WAAW;AAAA,UAEX,8BAAC,UAAO,MAAM,SAAS,UAAU,QAAQ;AAAA;AAAA,MAC3C;AAAA,OAEJ;AAAA,IACA,oBAAC,UAAK,MAAK,UAAS,aAAU,UAAS,WAAW,kBAC/C,mBAAU,OAAO,UAAU,WAAY,IAC1C;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import * as React from "react";
|
|
3
|
-
import { cn } from "
|
|
4
|
-
import { LABEL_BASE } from "
|
|
3
|
+
import { cn } from "../../lib/cn.js";
|
|
4
|
+
import { LABEL_BASE } from "../../generated/label.js";
|
|
5
5
|
function Label({ className, ...props }) {
|
|
6
6
|
return /* @__PURE__ */ jsx("label", { "data-slot": "label", className: cn(LABEL_BASE, className), ...props });
|
|
7
7
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/label.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { LABEL_BASE } from \"../../generated/label\";\n\nexport function Label({ className, ...props }: React.ComponentProps<\"label\">) {\n return <label data-slot=\"label\" className={cn(LABEL_BASE, className)} {...props} />;\n}\n"],"mappings":"AAKS;AALT,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,kBAAkB;AAEpB,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAAkC;AAC5E,SAAO,oBAAC,WAAM,aAAU,SAAQ,WAAW,GAAG,YAAY,SAAS,GAAI,GAAG,OAAO;AACnF;","names":[]}
|
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
|
-
import { cn } from "
|
|
5
|
-
import { useControllableState } from "
|
|
6
|
-
import { Portal } from "
|
|
7
|
-
import { useFloating } from "
|
|
8
|
-
import { DismissableLayerScope, useDismissableLayer } from "
|
|
9
|
-
import { usePresence } from "
|
|
10
|
-
import { useRovingFocus } from "
|
|
11
|
-
import {
|
|
4
|
+
import { cn } from "../../lib/cn.js";
|
|
5
|
+
import { useControllableState } from "../../primitives/use-controllable-state.js";
|
|
6
|
+
import { Portal } from "../../primitives/portal.js";
|
|
7
|
+
import { useFloating } from "../../primitives/use-floating.js";
|
|
8
|
+
import { DismissableLayerScope, useDismissableLayer } from "../../primitives/dismissable-layer.js";
|
|
9
|
+
import { usePresence } from "../../primitives/presence.js";
|
|
10
|
+
import { useRovingFocus } from "../../primitives/use-roving-focus.js";
|
|
11
|
+
import { useHoverIntent } from "../../primitives/use-hover-intent.js";
|
|
12
|
+
import { mergeRefs } from "../../primitives/merge-refs.js";
|
|
12
13
|
import {
|
|
13
14
|
MENUBAR_CHECKBOX_ITEM,
|
|
14
15
|
MENUBAR_CONTENT,
|
|
@@ -22,7 +23,7 @@ import {
|
|
|
22
23
|
MENUBAR_SUB_CONTENT,
|
|
23
24
|
MENUBAR_SUB_TRIGGER,
|
|
24
25
|
MENUBAR_TRIGGER
|
|
25
|
-
} from "
|
|
26
|
+
} from "../../generated/menubar.js";
|
|
26
27
|
const MenubarMenuContext = React.createContext(null);
|
|
27
28
|
function useMenu() {
|
|
28
29
|
const ctx = React.useContext(MenubarMenuContext);
|
|
@@ -263,19 +264,29 @@ function MenubarSub({ open, defaultOpen = false, onOpenChange, children }) {
|
|
|
263
264
|
defaultValue: defaultOpen,
|
|
264
265
|
onChange: onOpenChange
|
|
265
266
|
});
|
|
266
|
-
|
|
267
|
+
const triggerRef = React.useRef(null);
|
|
268
|
+
const focusFirst = React.useRef(false);
|
|
269
|
+
const hover = useHoverIntent({
|
|
270
|
+
onOpen: () => setOpen(true),
|
|
271
|
+
onClose: () => setOpen(false),
|
|
272
|
+
openDelay: 100,
|
|
273
|
+
closeDelay: 150
|
|
274
|
+
});
|
|
275
|
+
return /* @__PURE__ */ jsx(MenubarSubContext.Provider, { value: { open: isOpen, setOpen, triggerRef, focusFirst }, children: /* @__PURE__ */ jsx("div", { "data-slot": "menubar-sub", className: "relative", ...hover, children }) });
|
|
267
276
|
}
|
|
268
277
|
function MenubarSubTrigger({
|
|
269
278
|
className,
|
|
270
279
|
inset,
|
|
271
280
|
children,
|
|
272
281
|
onClick,
|
|
282
|
+
onKeyDown,
|
|
273
283
|
...props
|
|
274
284
|
}) {
|
|
275
|
-
const { open, setOpen } = useSub();
|
|
285
|
+
const { open, setOpen, triggerRef, focusFirst } = useSub();
|
|
276
286
|
return /* @__PURE__ */ jsxs(
|
|
277
287
|
"div",
|
|
278
288
|
{
|
|
289
|
+
ref: triggerRef,
|
|
279
290
|
"data-slot": "menubar-sub-trigger",
|
|
280
291
|
"data-inset": inset,
|
|
281
292
|
"data-state": open ? "open" : "closed",
|
|
@@ -286,6 +297,14 @@ function MenubarSubTrigger({
|
|
|
286
297
|
onClick?.(e);
|
|
287
298
|
setOpen(!open);
|
|
288
299
|
},
|
|
300
|
+
onKeyDown: (e) => {
|
|
301
|
+
onKeyDown?.(e);
|
|
302
|
+
if (e.key !== "ArrowRight" && e.key !== "Enter" && e.key !== " ") return;
|
|
303
|
+
e.preventDefault();
|
|
304
|
+
e.stopPropagation();
|
|
305
|
+
focusFirst.current = true;
|
|
306
|
+
setOpen(true);
|
|
307
|
+
},
|
|
289
308
|
...props,
|
|
290
309
|
children: [
|
|
291
310
|
children,
|
|
@@ -306,14 +325,29 @@ function MenubarSubTrigger({
|
|
|
306
325
|
}
|
|
307
326
|
);
|
|
308
327
|
}
|
|
309
|
-
function MenubarSubContent({ className, children, ...props }) {
|
|
310
|
-
const { open } = useSub();
|
|
328
|
+
function MenubarSubContent({ className, children, onKeyDown, ...props }) {
|
|
329
|
+
const { open, setOpen, triggerRef, focusFirst } = useSub();
|
|
311
330
|
const { isPresent, ref } = usePresence(open);
|
|
331
|
+
const inner = React.useRef(null);
|
|
332
|
+
React.useEffect(() => {
|
|
333
|
+
if (!open || !focusFirst.current) return;
|
|
334
|
+
focusFirst.current = false;
|
|
335
|
+
inner.current?.querySelector("[role^='menuitem']")?.focus();
|
|
336
|
+
}, [open, focusFirst]);
|
|
312
337
|
if (!isPresent) return null;
|
|
313
338
|
return /* @__PURE__ */ jsx(
|
|
314
339
|
"div",
|
|
315
340
|
{
|
|
316
|
-
ref,
|
|
341
|
+
ref: mergeRefs(ref, inner),
|
|
342
|
+
onKeyDown: (e) => {
|
|
343
|
+
onKeyDown?.(e);
|
|
344
|
+
if (e.key === "ArrowLeft" || e.key === "Escape") {
|
|
345
|
+
e.preventDefault();
|
|
346
|
+
e.stopPropagation();
|
|
347
|
+
setOpen(false);
|
|
348
|
+
triggerRef.current?.focus();
|
|
349
|
+
}
|
|
350
|
+
},
|
|
317
351
|
"data-slot": "menubar-sub-content",
|
|
318
352
|
"data-state": open ? "open" : "closed",
|
|
319
353
|
role: "menu",
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/atomic/menubar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport { Portal } from \"../../primitives/portal\";\nimport { useFloating } from \"../../primitives/use-floating\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../../primitives/dismissable-layer\";\nimport { usePresence } from \"../../primitives/presence\";\nimport { useRovingFocus } from \"../../primitives/use-roving-focus\";\nimport { useHoverIntent } from \"../../primitives/use-hover-intent\";\nimport { mergeRefs } from \"../../primitives/merge-refs\";\nimport {\n MENUBAR_CHECKBOX_ITEM,\n MENUBAR_CONTENT,\n MENUBAR_ITEM,\n MENUBAR_ITEM_INDICATOR,\n MENUBAR_LABEL,\n MENUBAR_RADIO_ITEM,\n MENUBAR_ROOT,\n MENUBAR_SEPARATOR,\n MENUBAR_SHORTCUT,\n MENUBAR_SUB_CONTENT,\n MENUBAR_SUB_TRIGGER,\n MENUBAR_TRIGGER,\n} from \"../../generated/menubar\";\n\ninterface MenuCtx {\n open: boolean;\n setOpen: (open: boolean) => void;\n triggerRef: React.RefObject<HTMLButtonElement | null>;\n}\nconst MenubarMenuContext = React.createContext<MenuCtx | null>(null);\nfunction useMenu(): MenuCtx {\n const ctx = React.useContext(MenubarMenuContext);\n if (!ctx) throw new Error(\"Menubar parts must be used within <MenubarMenu>\");\n return ctx;\n}\n\nconst MenubarRadioGroupContext = React.createContext<{\n value: string;\n onValueChange: (value: string) => void;\n} | null>(null);\n\nexport function Menubar({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"menubar\"\n role=\"menubar\"\n className={cn(MENUBAR_ROOT, className)}\n {...props}\n />\n );\n}\n\nexport interface MenubarMenuProps {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n children?: React.ReactNode;\n}\n\nexport function MenubarMenu({ open, defaultOpen = false, onOpenChange, children }: MenubarMenuProps) {\n const [isOpen, setOpen] = useControllableState({\n value: open,\n defaultValue: defaultOpen,\n onChange: onOpenChange,\n });\n const triggerRef = React.useRef<HTMLButtonElement | null>(null);\n return (\n <MenubarMenuContext.Provider value={{ open: isOpen, setOpen, triggerRef }}>\n <div data-slot=\"menubar-menu\" className=\"relative\">\n {children}\n </div>\n </MenubarMenuContext.Provider>\n );\n}\n\nexport function MenubarTrigger({ className, onClick, ...props }: React.ComponentProps<\"button\">) {\n const { open, setOpen, triggerRef } = useMenu();\n return (\n <button\n ref={triggerRef}\n type=\"button\"\n data-slot=\"menubar-trigger\"\n data-state={open ? \"open\" : \"closed\"}\n className={cn(MENUBAR_TRIGGER, className)}\n onClick={(e) => {\n onClick?.(e);\n setOpen(!open);\n }}\n {...props}\n />\n );\n}\n\nexport function MenubarContent({\n className,\n children,\n align = \"start\",\n ...props\n}: React.ComponentProps<\"div\"> & { align?: \"start\" | \"center\" | \"end\" }) {\n const { open, setOpen, triggerRef } = useMenu();\n const { isPresent, ref: presenceRef } = usePresence(open);\n const { floatingRef, style, side } = useFloating({\n anchorRef: triggerRef,\n open,\n side: \"bottom\",\n align,\n offset: 8,\n });\n const dismissRef = useDismissableLayer({\n enabled: open,\n onDismiss: () => setOpen(false),\n exclude: [triggerRef],\n });\n\n // Count the mounted menu items, not the children: separators, labels and\n // groups are children too, and an inline sub-menu adds items when it opens.\n const contentRef = React.useRef<HTMLDivElement | null>(null);\n const items = () =>\n Array.from(\n contentRef.current?.querySelectorAll<HTMLElement>(\"[role^='menuitem']\") ?? [],\n ).filter((el) => el.getAttribute(\"data-disabled\") === null);\n const { activeIndex, setActiveIndex, onKeyDown } = useRovingFocus({\n count: () => items().length,\n orientation: \"vertical\",\n });\n // Reset on close: reopen on the first item, never on an index past the end.\n React.useEffect(() => {\n if (!open) setActiveIndex(0);\n }, [open, setActiveIndex]);\n React.useEffect(() => {\n if (!open) return;\n items()[activeIndex]?.focus();\n }, [open, activeIndex]);\n\n if (!isPresent) return null;\n return (\n <Portal>\n <div\n ref={mergeRefs(presenceRef, floatingRef, dismissRef, contentRef)}\n data-slot=\"menubar-content\"\n data-state={open ? \"open\" : \"closed\"}\n data-side={side}\n role=\"menu\"\n style={style}\n className={cn(MENUBAR_CONTENT, className)}\n onKeyDown={onKeyDown}\n {...props}\n >\n <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n </div>\n </Portal>\n );\n}\n\nexport function MenubarGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n return <div data-slot=\"menubar-group\" role=\"group\" className={className} {...props} />;\n}\n\nexport function MenubarItem({\n className,\n inset,\n variant = \"neutral\",\n ...props\n}: React.ComponentProps<\"div\"> & {\n inset?: boolean;\n variant?: \"neutral\" | \"destructive\";\n}) {\n return (\n <div\n data-slot=\"menubar-item\"\n data-inset={inset}\n data-variant={variant}\n role=\"menuitem\"\n tabIndex={-1}\n className={cn(MENUBAR_ITEM, className)}\n {...props}\n />\n );\n}\n\nexport function MenubarCheckboxItem({\n className,\n children,\n checked,\n ...props\n}: React.ComponentProps<\"div\"> & { checked?: boolean }) {\n return (\n <div\n data-slot=\"menubar-checkbox-item\"\n role=\"menuitemcheckbox\"\n aria-checked={checked}\n tabIndex={-1}\n className={cn(MENUBAR_CHECKBOX_ITEM, className)}\n {...props}\n >\n <span className={MENUBAR_ITEM_INDICATOR}>\n {checked && (\n <svg\n className=\"size-4\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M20 6 9 17l-5-5\" />\n </svg>\n )}\n </span>\n {children}\n </div>\n );\n}\n\nexport interface MenubarRadioGroupProps {\n value?: string;\n defaultValue?: string;\n onValueChange?: (value: string) => void;\n className?: string;\n children?: React.ReactNode;\n}\n\nexport function MenubarRadioGroup({\n value,\n defaultValue = \"\",\n onValueChange,\n className,\n children,\n}: MenubarRadioGroupProps) {\n const [current, setValue] = useControllableState({\n value,\n defaultValue,\n onChange: onValueChange,\n });\n return (\n <MenubarRadioGroupContext.Provider value={{ value: current, onValueChange: setValue }}>\n <div data-slot=\"menubar-radio-group\" role=\"group\" className={className}>\n {children}\n </div>\n </MenubarRadioGroupContext.Provider>\n );\n}\n\nexport function MenubarRadioItem({\n className,\n children,\n value,\n ...props\n}: React.ComponentProps<\"div\"> & { value: string }) {\n const ctx = React.useContext(MenubarRadioGroupContext);\n const checked = ctx?.value === value;\n return (\n <div\n data-slot=\"menubar-radio-item\"\n role=\"menuitemradio\"\n aria-checked={checked}\n tabIndex={-1}\n className={cn(MENUBAR_RADIO_ITEM, className)}\n onClick={() => ctx?.onValueChange(value)}\n {...props}\n >\n <span className={MENUBAR_ITEM_INDICATOR}>\n {checked && (\n <svg className=\"size-2 fill-current\" viewBox=\"0 0 24 24\">\n <circle cx=\"12\" cy=\"12\" r=\"10\" />\n </svg>\n )}\n </span>\n {children}\n </div>\n );\n}\n\nexport function MenubarLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<\"div\"> & { inset?: boolean }) {\n return (\n <div\n data-slot=\"menubar-label\"\n data-inset={inset}\n className={cn(MENUBAR_LABEL, className)}\n {...props}\n />\n );\n}\n\nexport function MenubarSeparator({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"menubar-separator\"\n role=\"separator\"\n className={cn(MENUBAR_SEPARATOR, className)}\n {...props}\n />\n );\n}\n\nexport function MenubarShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n return (\n <span\n data-slot=\"menubar-shortcut\"\n className={cn(MENUBAR_SHORTCUT, className)}\n {...props}\n />\n );\n}\n\ninterface SubCtx {\n open: boolean;\n setOpen: (open: boolean) => void;\n triggerRef: React.RefObject<HTMLDivElement | null>;\n /** Set by a keyboard open, so the first item takes focus; a pointer open leaves focus alone. */\n focusFirst: React.RefObject<boolean>;\n}\nconst MenubarSubContext = React.createContext<SubCtx | null>(null);\nfunction useSub(): SubCtx {\n const ctx = React.useContext(MenubarSubContext);\n if (!ctx) throw new Error(\"MenubarSub parts must be used within <MenubarSub>\");\n return ctx;\n}\n\nexport interface MenubarSubProps {\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n children?: React.ReactNode;\n}\n\nexport function MenubarSub({ open, defaultOpen = false, onOpenChange, children }: MenubarSubProps) {\n const [isOpen, setOpen] = useControllableState({\n value: open,\n defaultValue: defaultOpen,\n onChange: onOpenChange,\n });\n const triggerRef = React.useRef<HTMLDivElement | null>(null);\n const focusFirst = React.useRef(false);\n const hover = useHoverIntent({\n onOpen: () => setOpen(true),\n onClose: () => setOpen(false),\n openDelay: 100,\n closeDelay: 150,\n });\n return (\n <MenubarSubContext.Provider value={{ open: isOpen, setOpen, triggerRef, focusFirst }}>\n <div data-slot=\"menubar-sub\" className=\"relative\" {...hover}>\n {children}\n </div>\n </MenubarSubContext.Provider>\n );\n}\n\nexport function MenubarSubTrigger({\n className,\n inset,\n children,\n onClick,\n onKeyDown,\n ...props\n}: React.ComponentProps<\"div\"> & { inset?: boolean }) {\n const { open, setOpen, triggerRef, focusFirst } = useSub();\n return (\n <div\n ref={triggerRef}\n data-slot=\"menubar-sub-trigger\"\n data-inset={inset}\n data-state={open ? \"open\" : \"closed\"}\n role=\"menuitem\"\n tabIndex={-1}\n className={cn(MENUBAR_SUB_TRIGGER, className)}\n onClick={(e) => {\n onClick?.(e);\n setOpen(!open);\n }}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n if (e.key !== \"ArrowRight\" && e.key !== \"Enter\" && e.key !== \" \") return;\n e.preventDefault();\n e.stopPropagation();\n focusFirst.current = true;\n setOpen(true);\n }}\n {...props}\n >\n {children}\n <svg\n className=\"ml-auto h-4 w-4\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"m9 18 6-6-6-6\" />\n </svg>\n </div>\n );\n}\n\nexport function MenubarSubContent({ className, children, onKeyDown, ...props }: React.ComponentProps<\"div\">) {\n const { open, setOpen, triggerRef, focusFirst } = useSub();\n const { isPresent, ref } = usePresence(open);\n const inner = React.useRef<HTMLDivElement | null>(null);\n React.useEffect(() => {\n if (!open || !focusFirst.current) return;\n focusFirst.current = false;\n inner.current?.querySelector<HTMLElement>(\"[role^='menuitem']\")?.focus();\n }, [open, focusFirst]);\n if (!isPresent) return null;\n return (\n <div\n ref={mergeRefs(ref as React.RefObject<HTMLDivElement>, inner)}\n onKeyDown={(e) => {\n onKeyDown?.(e);\n if (e.key === \"ArrowLeft\" || e.key === \"Escape\") {\n // Closes this flyout only; Escape would otherwise reach the whole menu's dismissal.\n e.preventDefault();\n e.stopPropagation();\n setOpen(false);\n triggerRef.current?.focus();\n }\n }}\n data-slot=\"menubar-sub-content\"\n data-state={open ? \"open\" : \"closed\"}\n role=\"menu\"\n className={cn(MENUBAR_SUB_CONTENT, className)}\n {...props}\n >\n {children}\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|