@wheelhouse/ui 0.1.6 → 0.2.1
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/dist/blocks/index.d.ts +2 -0
- package/dist/blocks/index.d.ts.map +1 -0
- package/dist/blocks/index.js +1 -0
- package/dist/blocks/navigation/index.d.ts +2 -0
- package/dist/blocks/navigation/index.d.ts.map +1 -0
- package/dist/blocks/navigation/index.js +1 -0
- package/dist/blocks/navigation/pattern-1/index.d.ts +3 -0
- package/dist/blocks/navigation/pattern-1/index.d.ts.map +1 -0
- package/dist/blocks/navigation/pattern-1/index.js +1 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.config.d.ts +47 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.config.d.ts.map +1 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.config.js +55 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.d.ts +7 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.d.ts.map +1 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.js +50 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.stories.d.ts +16 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.stories.d.ts.map +1 -0
- package/dist/blocks/navigation/pattern-1/pattern-1.stories.js +20 -0
- package/dist/components/accordion/accordion.d.ts +15 -0
- package/dist/components/accordion/accordion.d.ts.map +1 -0
- package/dist/components/accordion/accordion.js +18 -0
- package/dist/components/accordion/accordion.stories.d.ts +7 -0
- package/dist/components/accordion/accordion.stories.d.ts.map +1 -0
- package/dist/components/accordion/accordion.stories.js +17 -0
- package/dist/components/accordion/index.d.ts +3 -0
- package/dist/components/accordion/index.d.ts.map +1 -0
- package/dist/components/accordion/index.js +1 -0
- package/dist/components/alert/alert.d.ts +11 -0
- package/dist/components/alert/alert.d.ts.map +1 -0
- package/dist/components/alert/alert.js +28 -0
- package/dist/components/alert/alert.stories.d.ts +11 -0
- package/dist/components/alert/alert.stories.d.ts.map +1 -0
- package/dist/components/alert/alert.stories.js +35 -0
- package/dist/components/alert/index.d.ts +2 -0
- package/dist/components/alert/index.d.ts.map +1 -0
- package/dist/components/alert/index.js +1 -0
- package/dist/components/alert-dialog/alert-dialog.d.ts +44 -0
- package/dist/components/alert-dialog/alert-dialog.d.ts.map +1 -0
- package/dist/components/alert-dialog/alert-dialog.js +43 -0
- package/dist/components/alert-dialog/alert-dialog.stories.d.ts +9 -0
- package/dist/components/alert-dialog/alert-dialog.stories.d.ts.map +1 -0
- package/dist/components/alert-dialog/alert-dialog.stories.js +22 -0
- package/dist/components/alert-dialog/index.d.ts +3 -0
- package/dist/components/alert-dialog/index.d.ts.map +1 -0
- package/dist/components/alert-dialog/index.js +1 -0
- package/dist/components/aspect-ratio/aspect-ratio.d.ts +11 -0
- package/dist/components/aspect-ratio/aspect-ratio.d.ts.map +1 -0
- package/dist/components/aspect-ratio/aspect-ratio.js +9 -0
- package/dist/components/aspect-ratio/aspect-ratio.stories.d.ts +8 -0
- package/dist/components/aspect-ratio/aspect-ratio.stories.d.ts.map +1 -0
- package/dist/components/aspect-ratio/aspect-ratio.stories.js +26 -0
- package/dist/components/aspect-ratio/index.d.ts +3 -0
- package/dist/components/aspect-ratio/index.d.ts.map +1 -0
- package/dist/components/aspect-ratio/index.js +1 -0
- package/dist/components/avatar/avatar.d.ts +29 -0
- package/dist/components/avatar/avatar.d.ts.map +1 -0
- package/dist/components/avatar/avatar.js +24 -0
- package/dist/components/avatar/avatar.stories.d.ts +20 -0
- package/dist/components/avatar/avatar.stories.d.ts.map +1 -0
- package/dist/components/avatar/avatar.stories.js +40 -0
- package/dist/components/avatar/index.d.ts +2 -0
- package/dist/components/avatar/index.d.ts.map +1 -0
- package/dist/components/avatar/index.js +1 -0
- package/dist/components/badge/badge.d.ts +5 -4
- package/dist/components/badge/badge.d.ts.map +1 -1
- package/dist/components/badge/badge.js +3 -3
- package/dist/components/breadcrumb/breadcrumb.d.ts +25 -0
- package/dist/components/breadcrumb/breadcrumb.d.ts.map +1 -0
- package/dist/components/breadcrumb/breadcrumb.js +38 -0
- package/dist/components/breadcrumb/breadcrumb.stories.d.ts +16 -0
- package/dist/components/breadcrumb/breadcrumb.stories.d.ts.map +1 -0
- package/dist/components/breadcrumb/breadcrumb.stories.js +21 -0
- package/dist/components/breadcrumb/index.d.ts +2 -0
- package/dist/components/breadcrumb/index.d.ts.map +1 -0
- package/dist/components/breadcrumb/index.js +1 -0
- package/dist/components/button/button.d.ts +9 -6
- package/dist/components/button/button.d.ts.map +1 -1
- package/dist/components/button/button.js +3 -3
- package/dist/components/button-group/button-group.d.ts +3 -1
- package/dist/components/button-group/button-group.d.ts.map +1 -1
- package/dist/components/button-group/button-group.js +1 -1
- package/dist/components/button-group/button-group.stories.d.ts +1 -0
- package/dist/components/button-group/button-group.stories.d.ts.map +1 -1
- package/dist/components/button-group/button-group.stories.js +4 -0
- package/dist/components/button-group/index.d.ts +1 -0
- package/dist/components/button-group/index.d.ts.map +1 -1
- package/dist/components/calendar/calendar.d.ts +34 -0
- package/dist/components/calendar/calendar.d.ts.map +1 -0
- package/dist/components/calendar/calendar.js +82 -0
- package/dist/components/calendar/calendar.stories.d.ts +16 -0
- package/dist/components/calendar/calendar.stories.d.ts.map +1 -0
- package/dist/components/calendar/calendar.stories.js +33 -0
- package/dist/components/calendar/index.d.ts +3 -0
- package/dist/components/calendar/index.d.ts.map +1 -0
- package/dist/components/calendar/index.js +1 -0
- package/dist/components/card/card.d.ts +28 -0
- package/dist/components/card/card.d.ts.map +1 -0
- package/dist/components/card/card.js +25 -0
- package/dist/components/card/card.stories.d.ts +10 -0
- package/dist/components/card/card.stories.d.ts.map +1 -0
- package/dist/components/card/card.stories.js +30 -0
- package/dist/components/card/index.d.ts +2 -0
- package/dist/components/card/index.d.ts.map +1 -0
- package/dist/components/card/index.js +1 -0
- package/dist/components/checkbox/checkbox.d.ts +9 -0
- package/dist/components/checkbox/checkbox.d.ts.map +1 -0
- package/dist/components/checkbox/checkbox.js +9 -0
- package/dist/components/checkbox/checkbox.stories.d.ts +19 -0
- package/dist/components/checkbox/checkbox.stories.d.ts.map +1 -0
- package/dist/components/checkbox/checkbox.stories.js +31 -0
- package/dist/components/checkbox/index.d.ts +2 -0
- package/dist/components/checkbox/index.d.ts.map +1 -0
- package/dist/components/checkbox/index.js +1 -0
- package/dist/components/collapsible/collapsible.d.ts +17 -0
- package/dist/components/collapsible/collapsible.d.ts.map +1 -0
- package/dist/components/collapsible/collapsible.js +17 -0
- package/dist/components/collapsible/collapsible.stories.d.ts +16 -0
- package/dist/components/collapsible/collapsible.stories.d.ts.map +1 -0
- package/dist/components/collapsible/collapsible.stories.js +24 -0
- package/dist/components/collapsible/index.d.ts +3 -0
- package/dist/components/collapsible/index.d.ts.map +1 -0
- package/dist/components/collapsible/index.js +1 -0
- package/dist/components/combobox/combobox.d.ts +38 -0
- package/dist/components/combobox/combobox.d.ts.map +1 -0
- package/dist/components/combobox/combobox.js +63 -0
- package/dist/components/combobox/combobox.stories.d.ts +18 -0
- package/dist/components/combobox/combobox.stories.d.ts.map +1 -0
- package/dist/components/combobox/combobox.stories.js +46 -0
- package/dist/components/combobox/index.d.ts +3 -0
- package/dist/components/combobox/index.d.ts.map +1 -0
- package/dist/components/combobox/index.js +1 -0
- package/dist/components/command/command.d.ts +31 -0
- package/dist/components/command/command.d.ts.map +1 -0
- package/dist/components/command/command.js +36 -0
- package/dist/components/command/command.stories.d.ts +16 -0
- package/dist/components/command/command.stories.d.ts.map +1 -0
- package/dist/components/command/command.stories.js +26 -0
- package/dist/components/command/index.d.ts +2 -0
- package/dist/components/command/index.d.ts.map +1 -0
- package/dist/components/command/index.js +1 -0
- package/dist/components/context-menu/context-menu.d.ts +62 -0
- package/dist/components/context-menu/context-menu.d.ts.map +1 -0
- package/dist/components/context-menu/context-menu.js +52 -0
- package/dist/components/context-menu/context-menu.stories.d.ts +17 -0
- package/dist/components/context-menu/context-menu.stories.d.ts.map +1 -0
- package/dist/components/context-menu/context-menu.stories.js +27 -0
- package/dist/components/context-menu/index.d.ts +2 -0
- package/dist/components/context-menu/index.d.ts.map +1 -0
- package/dist/components/context-menu/index.js +1 -0
- package/dist/components/date-selector/date-selector-context.d.ts +6 -0
- package/dist/components/date-selector/date-selector-context.d.ts.map +1 -0
- package/dist/components/date-selector/date-selector-context.js +11 -0
- package/dist/components/date-selector/date-selector-parts.d.ts +68 -0
- package/dist/components/date-selector/date-selector-parts.d.ts.map +1 -0
- package/dist/components/date-selector/date-selector-parts.js +131 -0
- package/dist/components/date-selector/date-selector-types.d.ts +118 -0
- package/dist/components/date-selector/date-selector-types.d.ts.map +1 -0
- package/dist/components/date-selector/date-selector-types.js +32 -0
- package/dist/components/date-selector/date-selector-value.d.ts +47 -0
- package/dist/components/date-selector/date-selector-value.d.ts.map +1 -0
- package/dist/components/date-selector/date-selector-value.js +183 -0
- package/dist/components/date-selector/date-selector.d.ts +6 -0
- package/dist/components/date-selector/date-selector.d.ts.map +1 -0
- package/dist/components/date-selector/date-selector.js +144 -0
- package/dist/components/date-selector/date-selector.stories.d.ts +135 -0
- package/dist/components/date-selector/date-selector.stories.d.ts.map +1 -0
- package/dist/components/date-selector/date-selector.stories.js +144 -0
- package/dist/components/date-selector/index.d.ts +7 -0
- package/dist/components/date-selector/index.d.ts.map +1 -0
- package/dist/components/date-selector/index.js +5 -0
- package/dist/components/date-selector/use-date-selector.d.ts +50 -0
- package/dist/components/date-selector/use-date-selector.d.ts.map +1 -0
- package/dist/components/date-selector/use-date-selector.js +305 -0
- package/dist/components/dialog/dialog.d.ts +40 -0
- package/dist/components/dialog/dialog.d.ts.map +1 -0
- package/dist/components/dialog/dialog.js +38 -0
- package/dist/components/dialog/dialog.stories.d.ts +9 -0
- package/dist/components/dialog/dialog.stories.d.ts.map +1 -0
- package/dist/components/dialog/dialog.stories.js +22 -0
- package/dist/components/dialog/index.d.ts +3 -0
- package/dist/components/dialog/index.d.ts.map +1 -0
- package/dist/components/dialog/index.js +1 -0
- package/dist/components/direction/direction.d.ts +7 -0
- package/dist/components/direction/direction.d.ts.map +1 -0
- package/dist/components/direction/direction.js +5 -0
- package/dist/components/direction/direction.stories.d.ts +8 -0
- package/dist/components/direction/direction.stories.d.ts.map +1 -0
- package/dist/components/direction/direction.stories.js +23 -0
- package/dist/components/direction/index.d.ts +2 -0
- package/dist/components/direction/index.d.ts.map +1 -0
- package/dist/components/direction/index.js +1 -0
- package/dist/components/drawer/drawer.d.ts +25 -0
- package/dist/components/drawer/drawer.d.ts.map +1 -0
- package/dist/components/drawer/drawer.js +36 -0
- package/dist/components/drawer/drawer.stories.d.ts +7 -0
- package/dist/components/drawer/drawer.stories.d.ts.map +1 -0
- package/dist/components/drawer/drawer.stories.js +17 -0
- package/dist/components/drawer/index.d.ts +2 -0
- package/dist/components/drawer/index.d.ts.map +1 -0
- package/dist/components/drawer/index.js +1 -0
- package/dist/components/dropdown-menu/dropdown-menu.d.ts +65 -0
- package/dist/components/dropdown-menu/dropdown-menu.d.ts.map +1 -0
- package/dist/components/dropdown-menu/dropdown-menu.js +52 -0
- package/dist/components/dropdown-menu/dropdown-menu.stories.d.ts +18 -0
- package/dist/components/dropdown-menu/dropdown-menu.stories.d.ts.map +1 -0
- package/dist/components/dropdown-menu/dropdown-menu.stories.js +31 -0
- package/dist/components/dropdown-menu/index.d.ts +3 -0
- package/dist/components/dropdown-menu/index.d.ts.map +1 -0
- package/dist/components/dropdown-menu/index.js +1 -0
- package/dist/components/empty/empty.d.ts +25 -0
- package/dist/components/empty/empty.d.ts.map +1 -0
- package/dist/components/empty/empty.js +34 -0
- package/dist/components/empty/empty.stories.d.ts +7 -0
- package/dist/components/empty/empty.stories.d.ts.map +1 -0
- package/dist/components/empty/empty.stories.js +19 -0
- package/dist/components/empty/index.d.ts +3 -0
- package/dist/components/empty/index.d.ts.map +1 -0
- package/dist/components/empty/index.js +1 -0
- package/dist/components/field/field.d.ts +22 -0
- package/dist/components/field/field.d.ts.map +1 -0
- package/dist/components/field/field.js +34 -0
- package/dist/components/field/field.stories.d.ts +16 -0
- package/dist/components/field/field.stories.d.ts.map +1 -0
- package/dist/components/field/field.stories.js +26 -0
- package/dist/components/field/index.d.ts +2 -0
- package/dist/components/field/index.d.ts.map +1 -0
- package/dist/components/field/index.js +1 -0
- package/dist/components/filters/filters-defaults.d.ts +5 -0
- package/dist/components/filters/filters-defaults.d.ts.map +1 -0
- package/dist/components/filters/filters-defaults.js +97 -0
- package/dist/components/filters/filters-types.d.ts +135 -0
- package/dist/components/filters/filters-types.d.ts.map +1 -0
- package/dist/components/filters/filters-types.js +1 -0
- package/dist/components/filters/filters-utils.d.ts +4 -0
- package/dist/components/filters/filters-utils.d.ts.map +1 -0
- package/dist/components/filters/filters-utils.js +12 -0
- package/dist/components/filters/filters.d.ts +29 -0
- package/dist/components/filters/filters.d.ts.map +1 -0
- package/dist/components/filters/filters.js +733 -0
- package/dist/components/filters/filters.stories.d.ts +8 -0
- package/dist/components/filters/filters.stories.d.ts.map +1 -0
- package/dist/components/filters/filters.stories.js +48 -0
- package/dist/components/filters/index.d.ts +5 -0
- package/dist/components/filters/index.d.ts.map +1 -0
- package/dist/components/filters/index.js +4 -0
- package/dist/components/frame/frame.d.ts +65 -0
- package/dist/components/frame/frame.d.ts.map +1 -0
- package/dist/components/frame/frame.js +108 -0
- package/dist/components/frame/frame.stories.d.ts +14 -0
- package/dist/components/frame/frame.stories.d.ts.map +1 -0
- package/dist/components/frame/frame.stories.js +50 -0
- package/dist/components/frame/index.d.ts +3 -0
- package/dist/components/frame/index.d.ts.map +1 -0
- package/dist/components/frame/index.js +1 -0
- package/dist/components/hover-card/hover-card.d.ts +16 -0
- package/dist/components/hover-card/hover-card.d.ts.map +1 -0
- package/dist/components/hover-card/hover-card.js +14 -0
- package/dist/components/hover-card/hover-card.stories.d.ts +7 -0
- package/dist/components/hover-card/hover-card.stories.d.ts.map +1 -0
- package/dist/components/hover-card/hover-card.stories.js +15 -0
- package/dist/components/hover-card/index.d.ts +3 -0
- package/dist/components/hover-card/index.d.ts.map +1 -0
- package/dist/components/hover-card/index.js +1 -0
- package/dist/components/index.d.ts +51 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +51 -0
- package/dist/components/input/index.d.ts +2 -0
- package/dist/components/input/index.d.ts.map +1 -0
- package/dist/components/input/index.js +1 -0
- package/dist/components/input/input.d.ts +16 -0
- package/dist/components/input/input.d.ts.map +1 -0
- package/dist/components/input/input.js +22 -0
- package/dist/components/input/input.stories.d.ts +28 -0
- package/dist/components/input/input.stories.d.ts.map +1 -0
- package/dist/components/input/input.stories.js +33 -0
- package/dist/components/input-group/index.d.ts +3 -0
- package/dist/components/input-group/index.d.ts.map +1 -0
- package/dist/components/input-group/index.js +1 -0
- package/dist/components/input-group/input-group.d.ts +44 -0
- package/dist/components/input-group/input-group.d.ts.map +1 -0
- package/dist/components/input-group/input-group.js +72 -0
- package/dist/components/input-group/input-group.stories.d.ts +18 -0
- package/dist/components/input-group/input-group.stories.d.ts.map +1 -0
- package/dist/components/input-group/input-group.stories.js +29 -0
- package/dist/components/item/index.d.ts +3 -0
- package/dist/components/item/index.d.ts.map +1 -0
- package/dist/components/item/index.js +1 -0
- package/dist/components/item/item.d.ts +60 -0
- package/dist/components/item/item.d.ts.map +1 -0
- package/dist/components/item/item.js +95 -0
- package/dist/components/item/item.stories.d.ts +34 -0
- package/dist/components/item/item.stories.d.ts.map +1 -0
- package/dist/components/item/item.stories.js +40 -0
- package/dist/components/kbd/index.d.ts +3 -0
- package/dist/components/kbd/index.d.ts.map +1 -0
- package/dist/components/kbd/index.js +1 -0
- package/dist/components/kbd/kbd.d.ts +15 -0
- package/dist/components/kbd/kbd.d.ts.map +1 -0
- package/dist/components/kbd/kbd.js +16 -0
- package/dist/components/kbd/kbd.stories.d.ts +17 -0
- package/dist/components/kbd/kbd.stories.d.ts.map +1 -0
- package/dist/components/kbd/kbd.stories.js +25 -0
- package/dist/components/label/index.d.ts +2 -0
- package/dist/components/label/index.d.ts.map +1 -0
- package/dist/components/label/index.js +1 -0
- package/dist/components/label/label.d.ts +6 -0
- package/dist/components/label/label.d.ts.map +1 -0
- package/dist/components/label/label.js +10 -0
- package/dist/components/label/label.stories.d.ts +18 -0
- package/dist/components/label/label.stories.d.ts.map +1 -0
- package/dist/components/label/label.stories.js +29 -0
- package/dist/components/menubar/index.d.ts +3 -0
- package/dist/components/menubar/index.d.ts.map +1 -0
- package/dist/components/menubar/index.js +1 -0
- package/dist/components/menubar/menubar.d.ts +64 -0
- package/dist/components/menubar/menubar.d.ts.map +1 -0
- package/dist/components/menubar/menubar.js +56 -0
- package/dist/components/menubar/menubar.stories.d.ts +15 -0
- package/dist/components/menubar/menubar.stories.d.ts.map +1 -0
- package/dist/components/menubar/menubar.stories.js +18 -0
- package/dist/components/native-select/index.d.ts +2 -0
- package/dist/components/native-select/index.d.ts.map +1 -0
- package/dist/components/native-select/index.js +1 -0
- package/dist/components/native-select/native-select.d.ts +12 -0
- package/dist/components/native-select/native-select.d.ts.map +1 -0
- package/dist/components/native-select/native-select.js +14 -0
- package/dist/components/native-select/native-select.stories.d.ts +8 -0
- package/dist/components/native-select/native-select.stories.d.ts.map +1 -0
- package/dist/components/native-select/native-select.stories.js +19 -0
- package/dist/components/navigation-menu/index.d.ts +3 -0
- package/dist/components/navigation-menu/index.d.ts.map +1 -0
- package/dist/components/navigation-menu/index.js +1 -0
- package/dist/components/navigation-menu/navigation-menu.d.ts +33 -0
- package/dist/components/navigation-menu/navigation-menu.d.ts.map +1 -0
- package/dist/components/navigation-menu/navigation-menu.js +33 -0
- package/dist/components/navigation-menu/navigation-menu.stories.d.ts +14 -0
- package/dist/components/navigation-menu/navigation-menu.stories.d.ts.map +1 -0
- package/dist/components/navigation-menu/navigation-menu.stories.js +14 -0
- package/dist/components/pagination/index.d.ts +3 -0
- package/dist/components/pagination/index.d.ts.map +1 -0
- package/dist/components/pagination/index.js +1 -0
- package/dist/components/pagination/pagination.d.ts +31 -0
- package/dist/components/pagination/pagination.d.ts.map +1 -0
- package/dist/components/pagination/pagination.js +29 -0
- package/dist/components/pagination/pagination.stories.d.ts +14 -0
- package/dist/components/pagination/pagination.stories.d.ts.map +1 -0
- package/dist/components/pagination/pagination.stories.js +14 -0
- package/dist/components/popover/index.d.ts +2 -0
- package/dist/components/popover/index.d.ts.map +1 -0
- package/dist/components/popover/index.js +1 -0
- package/dist/components/popover/popover.d.ts +20 -0
- package/dist/components/popover/popover.d.ts.map +1 -0
- package/dist/components/popover/popover.js +24 -0
- package/dist/components/popover/popover.stories.d.ts +7 -0
- package/dist/components/popover/popover.stories.d.ts.map +1 -0
- package/dist/components/popover/popover.stories.js +17 -0
- package/dist/components/progress/index.d.ts +3 -0
- package/dist/components/progress/index.d.ts.map +1 -0
- package/dist/components/progress/index.js +1 -0
- package/dist/components/progress/progress.d.ts +18 -0
- package/dist/components/progress/progress.d.ts.map +1 -0
- package/dist/components/progress/progress.js +20 -0
- package/dist/components/progress/progress.stories.d.ts +9 -0
- package/dist/components/progress/progress.stories.d.ts.map +1 -0
- package/dist/components/progress/progress.stories.js +29 -0
- package/dist/components/radio-group/index.d.ts +3 -0
- package/dist/components/radio-group/index.d.ts.map +1 -0
- package/dist/components/radio-group/index.js +1 -0
- package/dist/components/radio-group/radio-group.d.ts +13 -0
- package/dist/components/radio-group/radio-group.d.ts.map +1 -0
- package/dist/components/radio-group/radio-group.js +12 -0
- package/dist/components/radio-group/radio-group.stories.d.ts +7 -0
- package/dist/components/radio-group/radio-group.stories.d.ts.map +1 -0
- package/dist/components/radio-group/radio-group.stories.js +18 -0
- package/dist/components/resizable/index.d.ts +2 -0
- package/dist/components/resizable/index.d.ts.map +1 -0
- package/dist/components/resizable/index.js +1 -0
- package/dist/components/resizable/resizable.d.ts +12 -0
- package/dist/components/resizable/resizable.d.ts.map +1 -0
- package/dist/components/resizable/resizable.js +14 -0
- package/dist/components/resizable/resizable.stories.d.ts +7 -0
- package/dist/components/resizable/resizable.stories.d.ts.map +1 -0
- package/dist/components/resizable/resizable.stories.js +16 -0
- package/dist/components/scroll-area/index.d.ts +2 -0
- package/dist/components/scroll-area/index.d.ts.map +1 -0
- package/dist/components/scroll-area/index.js +1 -0
- package/dist/components/scroll-area/scroll-area.d.ts +7 -0
- package/dist/components/scroll-area/scroll-area.d.ts.map +1 -0
- package/dist/components/scroll-area/scroll-area.js +11 -0
- package/dist/components/scroll-area/scroll-area.stories.d.ts +6 -0
- package/dist/components/scroll-area/scroll-area.stories.d.ts.map +1 -0
- package/dist/components/scroll-area/scroll-area.stories.js +13 -0
- package/dist/components/select/index.d.ts +3 -0
- package/dist/components/select/index.d.ts.map +1 -0
- package/dist/components/select/index.js +1 -0
- package/dist/components/select/select.d.ts +49 -0
- package/dist/components/select/select.d.ts.map +1 -0
- package/dist/components/select/select.js +50 -0
- package/dist/components/select/select.stories.d.ts +9 -0
- package/dist/components/select/select.stories.d.ts.map +1 -0
- package/dist/components/select/select.stories.js +20 -0
- package/dist/components/separator/index.d.ts +1 -0
- package/dist/components/separator/index.d.ts.map +1 -1
- package/dist/components/separator/separator.d.ts +3 -1
- package/dist/components/separator/separator.d.ts.map +1 -1
- package/dist/components/sheet/index.d.ts +2 -0
- package/dist/components/sheet/index.d.ts.map +1 -0
- package/dist/components/sheet/index.js +1 -0
- package/dist/components/sheet/sheet.d.ts +34 -0
- package/dist/components/sheet/sheet.d.ts.map +1 -0
- package/dist/components/sheet/sheet.js +38 -0
- package/dist/components/sheet/sheet.stories.d.ts +9 -0
- package/dist/components/sheet/sheet.stories.d.ts.map +1 -0
- package/dist/components/sheet/sheet.stories.js +21 -0
- package/dist/components/slider/index.d.ts +3 -0
- package/dist/components/slider/index.d.ts.map +1 -0
- package/dist/components/slider/index.js +1 -0
- package/dist/components/slider/slider.d.ts +15 -0
- package/dist/components/slider/slider.d.ts.map +1 -0
- package/dist/components/slider/slider.js +20 -0
- package/dist/components/slider/slider.stories.d.ts +11 -0
- package/dist/components/slider/slider.stories.d.ts.map +1 -0
- package/dist/components/slider/slider.stories.js +36 -0
- package/dist/components/sonner/index.d.ts +4 -0
- package/dist/components/sonner/index.d.ts.map +1 -0
- package/dist/components/sonner/index.js +2 -0
- package/dist/components/sonner/sonner.d.ts +12 -0
- package/dist/components/sonner/sonner.d.ts.map +1 -0
- package/dist/components/sonner/sonner.js +32 -0
- package/dist/components/sonner/sonner.stories.d.ts +8 -0
- package/dist/components/sonner/sonner.stories.d.ts.map +1 -0
- package/dist/components/sonner/sonner.stories.js +25 -0
- package/dist/components/sonner/toast.d.ts +2 -0
- package/dist/components/sonner/toast.d.ts.map +1 -0
- package/dist/components/sonner/toast.js +1 -0
- package/dist/components/sortable/index.d.ts +3 -0
- package/dist/components/sortable/index.d.ts.map +1 -0
- package/dist/components/sortable/index.js +1 -0
- package/dist/components/sortable/sortable.d.ts +94 -0
- package/dist/components/sortable/sortable.d.ts.map +1 -0
- package/dist/components/sortable/sortable.js +210 -0
- package/dist/components/sortable/sortable.stories.d.ts +14 -0
- package/dist/components/sortable/sortable.stories.d.ts.map +1 -0
- package/dist/components/sortable/sortable.stories.js +38 -0
- package/dist/components/spinner/index.d.ts +3 -0
- package/dist/components/spinner/index.d.ts.map +1 -0
- package/dist/components/spinner/index.js +1 -0
- package/dist/components/spinner/spinner.d.ts +13 -0
- package/dist/components/spinner/spinner.d.ts.map +1 -0
- package/dist/components/spinner/spinner.js +12 -0
- package/dist/components/spinner/spinner.stories.d.ts +9 -0
- package/dist/components/spinner/spinner.stories.d.ts.map +1 -0
- package/dist/components/spinner/spinner.stories.js +20 -0
- package/dist/components/status-indicator/index.d.ts +3 -0
- package/dist/components/status-indicator/index.d.ts.map +1 -0
- package/dist/components/status-indicator/index.js +1 -0
- package/dist/components/status-indicator/status-indicator.d.ts +51 -0
- package/dist/components/status-indicator/status-indicator.d.ts.map +1 -0
- package/dist/components/status-indicator/status-indicator.js +48 -0
- package/dist/components/status-indicator/status-indicator.stories.d.ts +20 -0
- package/dist/components/status-indicator/status-indicator.stories.d.ts.map +1 -0
- package/dist/components/status-indicator/status-indicator.stories.js +97 -0
- package/dist/components/switch/index.d.ts +2 -0
- package/dist/components/switch/index.d.ts.map +1 -0
- package/dist/components/switch/index.js +1 -0
- package/dist/components/switch/switch.d.ts +13 -0
- package/dist/components/switch/switch.d.ts.map +1 -0
- package/dist/components/switch/switch.js +8 -0
- package/dist/components/switch/switch.stories.d.ts +20 -0
- package/dist/components/switch/switch.stories.d.ts.map +1 -0
- package/dist/components/switch/switch.stories.js +46 -0
- package/dist/components/tabs/index.d.ts +3 -0
- package/dist/components/tabs/index.d.ts.map +1 -0
- package/dist/components/tabs/index.js +1 -0
- package/dist/components/tabs/tabs.d.ts +35 -0
- package/dist/components/tabs/tabs.d.ts.map +1 -0
- package/dist/components/tabs/tabs.js +34 -0
- package/dist/components/tabs/tabs.stories.d.ts +10 -0
- package/dist/components/tabs/tabs.stories.d.ts.map +1 -0
- package/dist/components/tabs/tabs.stories.js +29 -0
- package/dist/components/text/index.d.ts +3 -0
- package/dist/components/text/index.d.ts.map +1 -0
- package/dist/components/text/index.js +1 -0
- package/dist/components/text/text.d.ts +47 -0
- package/dist/components/text/text.d.ts.map +1 -0
- package/dist/components/text/text.js +53 -0
- package/dist/components/text/text.stories.d.ts +11 -0
- package/dist/components/text/text.stories.d.ts.map +1 -0
- package/dist/components/text/text.stories.js +84 -0
- package/dist/components/textarea/index.d.ts +2 -0
- package/dist/components/textarea/index.d.ts.map +1 -0
- package/dist/components/textarea/index.js +1 -0
- package/dist/components/textarea/textarea.d.ts +11 -0
- package/dist/components/textarea/textarea.d.ts.map +1 -0
- package/dist/components/textarea/textarea.js +10 -0
- package/dist/components/textarea/textarea.stories.d.ts +24 -0
- package/dist/components/textarea/textarea.stories.d.ts.map +1 -0
- package/dist/components/textarea/textarea.stories.js +32 -0
- package/dist/components/toggle/index.d.ts +3 -0
- package/dist/components/toggle/index.d.ts.map +1 -0
- package/dist/components/toggle/index.js +1 -0
- package/dist/components/toggle/toggle.d.ts +31 -0
- package/dist/components/toggle/toggle.d.ts.map +1 -0
- package/dist/components/toggle/toggle.js +33 -0
- package/dist/components/toggle/toggle.stories.d.ts +11 -0
- package/dist/components/toggle/toggle.stories.d.ts.map +1 -0
- package/dist/components/toggle/toggle.stories.js +60 -0
- package/dist/components/toggle-group/index.d.ts +3 -0
- package/dist/components/toggle-group/index.d.ts.map +1 -0
- package/dist/components/toggle-group/index.js +1 -0
- package/dist/components/toggle-group/toggle-group.d.ts +32 -0
- package/dist/components/toggle-group/toggle-group.d.ts.map +1 -0
- package/dist/components/toggle-group/toggle-group.js +33 -0
- package/dist/components/toggle-group/toggle-group.stories.d.ts +10 -0
- package/dist/components/toggle-group/toggle-group.stories.d.ts.map +1 -0
- package/dist/components/toggle-group/toggle-group.stories.js +28 -0
- package/dist/components/tooltip/index.d.ts +3 -0
- package/dist/components/tooltip/index.d.ts.map +1 -0
- package/dist/components/tooltip/index.js +1 -0
- package/dist/components/tooltip/tooltip.d.ts +22 -0
- package/dist/components/tooltip/tooltip.d.ts.map +1 -0
- package/dist/components/tooltip/tooltip.js +21 -0
- package/dist/components/tooltip/tooltip.stories.d.ts +11 -0
- package/dist/components/tooltip/tooltip.stories.d.ts.map +1 -0
- package/dist/components/tooltip/tooltip.stories.js +33 -0
- package/dist/hooks/use-mobile.d.ts +2 -0
- package/dist/hooks/use-mobile.d.ts.map +1 -0
- package/dist/hooks/use-mobile.js +15 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/llms.txt +21 -19
- package/package.json +17 -9
- package/src/styles/globals.css +6 -11
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/blocks/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './navigation';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/navigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './pattern-1';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/blocks/navigation/pattern-1/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,YAAY,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { NavigationPattern1 } from './pattern-1';
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Navigation data for {@link NavigationPattern1}. Single source for desktop + mobile.
|
|
3
|
+
*/
|
|
4
|
+
export type NavBadge = {
|
|
5
|
+
label: string;
|
|
6
|
+
};
|
|
7
|
+
/** Simple top-level link (Dashboard, Performance, …). */
|
|
8
|
+
export type Pattern1PrimaryLink = {
|
|
9
|
+
kind: 'link';
|
|
10
|
+
label: string;
|
|
11
|
+
href: string;
|
|
12
|
+
/** Current / highlighted item (e.g. Dashboard). */
|
|
13
|
+
active?: boolean;
|
|
14
|
+
badge?: NavBadge;
|
|
15
|
+
};
|
|
16
|
+
/** Expandable group (Portfolio + children). */
|
|
17
|
+
export type Pattern1PrimarySubmenu = {
|
|
18
|
+
kind: 'submenu';
|
|
19
|
+
label: string;
|
|
20
|
+
items: readonly {
|
|
21
|
+
label: string;
|
|
22
|
+
href: string;
|
|
23
|
+
}[];
|
|
24
|
+
};
|
|
25
|
+
export type Pattern1PrimaryItem = Pattern1PrimaryLink | Pattern1PrimarySubmenu;
|
|
26
|
+
/** Left cluster: primary app routes. */
|
|
27
|
+
export declare const pattern1PrimaryNav: readonly Pattern1PrimaryItem[];
|
|
28
|
+
export type Pattern1SupportItem = {
|
|
29
|
+
label: string;
|
|
30
|
+
href: string;
|
|
31
|
+
};
|
|
32
|
+
/** Right cluster: Help / Support menu. */
|
|
33
|
+
export declare const pattern1SupportMenu: {
|
|
34
|
+
triggerLabel: string;
|
|
35
|
+
items: readonly Pattern1SupportItem[];
|
|
36
|
+
};
|
|
37
|
+
export type Pattern1UserLink = {
|
|
38
|
+
label: string;
|
|
39
|
+
href: string;
|
|
40
|
+
};
|
|
41
|
+
/** Right cluster: Account menu — grouped sections + log out. */
|
|
42
|
+
export declare const pattern1UserMenu: {
|
|
43
|
+
triggerLabel: string;
|
|
44
|
+
sections: readonly (readonly Pattern1UserLink[])[];
|
|
45
|
+
logOut: Pattern1UserLink;
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=pattern-1.config.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pattern-1.config.d.ts","sourceRoot":"","sources":["../../../../src/blocks/navigation/pattern-1/pattern-1.config.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,MAAM,MAAM,QAAQ,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAEzC,yDAAyD;AACzD,MAAM,MAAM,mBAAmB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,mDAAmD;IACnD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,QAAQ,CAAC;CACpB,CAAC;AAEF,+CAA+C;AAC/C,MAAM,MAAM,sBAAsB,GAAG;IACjC,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACrD,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,mBAAmB,GAAG,sBAAsB,CAAC;AAE/E,wCAAwC;AACxC,eAAO,MAAM,kBAAkB,EAAE,SAAS,mBAAmB,EAiB5D,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAElE,0CAA0C;AAC1C,eAAO,MAAM,mBAAmB,EAAE;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,SAAS,mBAAmB,EAAE,CAAA;CAO9F,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAE/D,gEAAgE;AAChE,eAAO,MAAM,gBAAgB,EAAE;IAC3B,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC,SAAS,gBAAgB,EAAE,CAAC,EAAE,CAAC;IACnD,MAAM,EAAE,gBAAgB,CAAC;CAuB5B,CAAC"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Navigation data for {@link NavigationPattern1}. Single source for desktop + mobile.
|
|
3
|
+
*/
|
|
4
|
+
/** Left cluster: primary app routes. */
|
|
5
|
+
export const pattern1PrimaryNav = [
|
|
6
|
+
{ kind: 'link', label: 'Dashboard', href: '/dashboard', active: true },
|
|
7
|
+
{
|
|
8
|
+
kind: 'submenu',
|
|
9
|
+
label: 'Portfolio',
|
|
10
|
+
items: [
|
|
11
|
+
{ label: 'Settings', href: '/portfolio/settings' },
|
|
12
|
+
{ label: 'Calendar', href: '/portfolio/calendar' },
|
|
13
|
+
{ label: 'Performance', href: '/portfolio/performance' },
|
|
14
|
+
{ label: 'Engine Version', href: '/portfolio/engine' },
|
|
15
|
+
],
|
|
16
|
+
},
|
|
17
|
+
{ kind: 'link', label: 'Performance', href: '/products' },
|
|
18
|
+
{ kind: 'link', label: 'Reporting', href: '/customers', badge: { label: 'Beta' } },
|
|
19
|
+
{ kind: 'link', label: 'Budgets', href: '/settings', badge: { label: 'Beta' } },
|
|
20
|
+
{ kind: 'link', label: 'Sets', href: '/settings' },
|
|
21
|
+
{ kind: 'link', label: 'Markets', href: '/settings' },
|
|
22
|
+
];
|
|
23
|
+
/** Right cluster: Help / Support menu. */
|
|
24
|
+
export const pattern1SupportMenu = {
|
|
25
|
+
triggerLabel: 'Support',
|
|
26
|
+
items: [
|
|
27
|
+
{ label: 'Live chat', href: '/support/chat' },
|
|
28
|
+
{ label: 'Help center', href: '/help' },
|
|
29
|
+
{ label: 'Changelog', href: '/changelog' },
|
|
30
|
+
],
|
|
31
|
+
};
|
|
32
|
+
/** Right cluster: Account menu — grouped sections + log out. */
|
|
33
|
+
export const pattern1UserMenu = {
|
|
34
|
+
triggerLabel: 'User',
|
|
35
|
+
sections: [
|
|
36
|
+
[
|
|
37
|
+
{ label: 'Profile', href: '/account/profile' },
|
|
38
|
+
{ label: 'Notifications', href: '/account/notifications' },
|
|
39
|
+
{ label: 'Email preferences', href: '/account/email-preferences' },
|
|
40
|
+
{ label: 'Your referrals', href: '/account/referrals' },
|
|
41
|
+
{ label: 'Teams', href: '/account/teams' },
|
|
42
|
+
],
|
|
43
|
+
[
|
|
44
|
+
{ label: 'Connected channels', href: '/connections' },
|
|
45
|
+
{ label: 'Add channel', href: '/connections/add' },
|
|
46
|
+
{ label: 'API key', href: '/account/api-key' },
|
|
47
|
+
],
|
|
48
|
+
[
|
|
49
|
+
{ label: 'Payment method', href: '/billing/payment' },
|
|
50
|
+
{ label: 'Subscriptions', href: '/billing/subscriptions' },
|
|
51
|
+
{ label: 'Invoices', href: '/billing/invoices' },
|
|
52
|
+
],
|
|
53
|
+
],
|
|
54
|
+
logOut: { label: 'Log out', href: '/logout' },
|
|
55
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export type NavigationPattern1Props = React.ComponentProps<'div'>;
|
|
3
|
+
/**
|
|
4
|
+
* Responsive app header: mobile bar (menu, brand, search, upgrade) plus desktop nav with account actions.
|
|
5
|
+
*/
|
|
6
|
+
export declare function NavigationPattern1({ className, ...props }: NavigationPattern1Props): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
//# sourceMappingURL=pattern-1.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pattern-1.d.ts","sourceRoot":"","sources":["../../../../src/blocks/navigation/pattern-1/pattern-1.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAqB/B,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AA4HlE;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,2CAoJlF"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { Bell, ChevronDown, Menu, Search, X } from 'lucide-react';
|
|
5
|
+
import { Avatar, AvatarFallback, AvatarImage } from '../../../components/avatar';
|
|
6
|
+
import { Badge } from '../../../components/badge';
|
|
7
|
+
import { Button } from '../../../components/button';
|
|
8
|
+
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../../../components/collapsible';
|
|
9
|
+
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from '../../../components/dropdown-menu';
|
|
10
|
+
import { Separator } from '../../../components/separator';
|
|
11
|
+
import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from '../../../components/sheet';
|
|
12
|
+
import { cn } from '../../../lib/utils';
|
|
13
|
+
import { pattern1PrimaryNav, pattern1SupportMenu, pattern1UserMenu } from './pattern-1.config';
|
|
14
|
+
/** Demo user — keep in sync between desktop account menu and mobile sheet. */
|
|
15
|
+
const demoUser = {
|
|
16
|
+
name: 'shadcn',
|
|
17
|
+
email: 'm@example.com',
|
|
18
|
+
avatarSrc: 'https://github.com/shadcn.png',
|
|
19
|
+
avatarAlt: '@shadcn',
|
|
20
|
+
initials: 'CN',
|
|
21
|
+
};
|
|
22
|
+
const navLinkClass = 'rounded-md px-3 py-1 text-sm font-medium text-muted-foreground hover:bg-primary/5 outline-none focus-visible:ring-2 focus-visible:ring-ring';
|
|
23
|
+
const sheetNavLinkClass = 'flex items-center gap-2 rounded-md px-3 py-2.5 text-sm font-normal text-muted-foreground hover:bg-accent hover:text-accent-foreground';
|
|
24
|
+
function primaryNavKey(entry, index) {
|
|
25
|
+
return entry.kind === 'link' ? `link-${entry.label}-${entry.href}-${index}` : `submenu-${entry.label}`;
|
|
26
|
+
}
|
|
27
|
+
/** Wheelhouse icon mark — aligned with `marketing_site/public/svg/wh-logo-icon.svg`. */
|
|
28
|
+
function BrandLogo({ className, ...props }) {
|
|
29
|
+
return (_jsxs("svg", { viewBox: "0 0 282 196", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": true, className: cn('h-5 w-auto shrink-0', className), ...props, children: [_jsx("path", { d: "M113.84 192.61L182.63 73.4702C201.1 41.4702 178.01 1.47021 141.07 1.47021H3.4999C3.149 1.47057 2.80437 1.56325 2.50062 1.73893C2.19687 1.91462 1.94468 2.16712 1.76939 2.4711C1.5941 2.77508 1.50186 3.11983 1.50195 3.47073C1.50204 3.82163 1.59445 4.16633 1.7699 4.47021L110.38 192.61C110.556 192.913 110.808 193.165 111.112 193.34C111.415 193.515 111.76 193.607 112.11 193.607C112.46 193.607 112.805 193.515 113.108 193.34C113.412 193.165 113.664 192.913 113.84 192.61Z", fill: "#AA1DA5" }), _jsx("path", { d: "M171.33 192.61L279.93 4.5C280.106 4.19611 280.198 3.85141 280.198 3.50051C280.198 3.14961 280.106 2.80487 279.931 2.50089C279.755 2.19691 279.503 1.9444 279.2 1.76872C278.896 1.59303 278.551 1.50036 278.2 1.5H140.74C103.74 1.5 80.6402 41.5 99.1302 73.57L167.86 192.57C168.032 192.877 168.282 193.134 168.584 193.314C168.887 193.494 169.232 193.591 169.584 193.595C169.936 193.599 170.283 193.51 170.589 193.337C170.896 193.164 171.152 192.913 171.33 192.61V192.61Z", fill: "#D926D2" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M142.811 1.5H140.74C103.74 1.5 80.6402 41.5 99.1302 73.57L140.858 145.817L182.63 73.4702C200.808 41.976 178.729 2.73259 142.811 1.5Z", fill: "#71146D" })] }));
|
|
30
|
+
}
|
|
31
|
+
function MobileNavLinks({ onNavigate }) {
|
|
32
|
+
return (_jsxs("div", { className: "flex flex-col gap-0.5 p-4 pt-2", children: [pattern1PrimaryNav.map((entry, i) => {
|
|
33
|
+
if (entry.kind === 'link') {
|
|
34
|
+
return (_jsxs("a", { className: cn(sheetNavLinkClass, entry.active && 'text-primary'), href: entry.href, onClick: onNavigate, children: [entry.label, entry.badge ? _jsx(Badge, { size: "sm", children: entry.badge.label }) : null] }, primaryNavKey(entry, i)));
|
|
35
|
+
}
|
|
36
|
+
return (_jsxs(Collapsible, { className: "w-full", children: [_jsx(CollapsibleTrigger, { render: _jsxs("button", { type: "button", className: cn(sheetNavLinkClass, 'group flex w-full cursor-default justify-between font-normal text-muted-foreground hover:text-accent-foreground'), children: [_jsx("span", { children: entry.label }), _jsx(ChevronDown, { className: "size-4 shrink-0 opacity-80 transition-transform group-data-[panel-open]:rotate-180" })] }) }), _jsx(CollapsibleContent, { className: "flex flex-col gap-0.5 pt-0.5 pb-1", children: entry.items.map((sub) => (_jsx("a", { className: cn(sheetNavLinkClass, 'py-2 pl-8 text-sm'), href: sub.href, onClick: onNavigate, children: sub.label }, sub.href))) })] }, primaryNavKey(entry, i)));
|
|
37
|
+
}), _jsx(Separator, { className: "my-3" }), _jsxs("div", { className: "flex items-center gap-3 rounded-md px-3 py-2", children: [_jsxs(Avatar, { className: "size-8 border-0 after:hidden", children: [_jsx(AvatarImage, { src: demoUser.avatarSrc, alt: demoUser.avatarAlt }), _jsx(AvatarFallback, { children: demoUser.initials })] }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-sm font-medium text-foreground", children: demoUser.name }), _jsx("p", { className: "truncate text-xs text-muted-foreground", children: demoUser.email })] })] }), pattern1UserMenu.sections.map((section, si) => (_jsxs(React.Fragment, { children: [si > 0 ? _jsx(Separator, { className: "my-2" }) : null, section.map((item) => (_jsx("a", { className: sheetNavLinkClass, href: item.href, onClick: onNavigate, children: item.label }, item.href)))] }, `user-section-${si}`))), _jsx(Separator, { className: "my-2" }), _jsx("a", { className: cn(sheetNavLinkClass, 'text-destructive-foreground hover:bg-destructive/10 hover:text-destructive-foreground'), href: pattern1UserMenu.logOut.href, onClick: onNavigate, children: pattern1UserMenu.logOut.label })] }));
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Responsive app header: mobile bar (menu, brand, search, upgrade) plus desktop nav with account actions.
|
|
41
|
+
*/
|
|
42
|
+
export function NavigationPattern1({ className, ...props }) {
|
|
43
|
+
const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
|
|
44
|
+
return (_jsxs("div", { "data-slot": "navigation-pattern-1", className: cn(className), ...props, children: [_jsx("nav", { className: "lg:hidden", "aria-label": "Main", children: _jsxs("div", { className: "relative flex h-14 items-center justify-between border-b border-border bg-background px-4", children: [_jsxs(Button, { type: "button", variant: "ghost", className: "relative -ml-2 h-9 w-9 shrink-0 px-0 [&_svg]:size-5", "aria-expanded": mobileMenuOpen, "aria-controls": "navigation-pattern-1-mobile-sheet", "aria-label": mobileMenuOpen ? 'Close menu' : 'Open menu', onClick: () => setMobileMenuOpen((open) => !open), children: [_jsx("span", { className: cn('absolute transition-all duration-300', mobileMenuOpen ? '-rotate-90 opacity-0' : 'rotate-0 opacity-100'), "aria-hidden": true, children: _jsx(Menu, {}) }), _jsx("span", { className: cn('absolute transition-all duration-300', mobileMenuOpen ? 'rotate-0 opacity-100' : '-rotate-90 opacity-0'), "aria-hidden": true, children: _jsx(X, {}) })] }), _jsx("div", { className: "pointer-events-none absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2", children: _jsx(BrandLogo, { className: "h-6 w-auto" }) }), _jsxs("div", { className: "flex shrink-0 items-center gap-3", children: [_jsx(Button, { type: "button", variant: "ghost", className: "size-9 p-0 [&_svg]:size-5", "aria-label": "Search", children: _jsx(Search, { className: "text-muted-foreground" }) }), _jsx(Button, { type: "button", variant: "ghost", className: "size-9 p-0 [&_svg]:size-5", "aria-label": "Notifications", children: _jsx(Bell, { className: "text-muted-foreground" }) })] })] }) }), _jsx(Sheet, { open: mobileMenuOpen, onOpenChange: setMobileMenuOpen, children: _jsxs(SheetContent, { id: "navigation-pattern-1-mobile-sheet", side: "left", showCloseButton: false, className: "flex h-[100dvh] max-h-[100dvh] w-full flex-col gap-0 overflow-hidden p-0 sm:max-w-sm", children: [_jsxs(SheetHeader, { className: "shrink-0 border-b border-border text-left", children: [_jsx(SheetTitle, { children: "Menu" }), _jsx(SheetDescription, { className: "sr-only", children: "Primary navigation links for the application." })] }), _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto overscroll-contain", children: _jsx(MobileNavLinks, { onNavigate: () => setMobileMenuOpen(false) }) })] }) }), _jsx("nav", { className: "hidden h-12 border-b border-border bg-background lg:block", "aria-label": "Main", children: _jsxs("div", { className: "container flex h-full items-center justify-between px-6", children: [_jsxs("div", { className: "flex items-center gap-x-3", children: [_jsx(BrandLogo, {}), _jsx("div", { className: "flex items-center gap-x-1", children: pattern1PrimaryNav.map((entry, i) => {
|
|
45
|
+
if (entry.kind === 'link') {
|
|
46
|
+
return (_jsxs("a", { className: cn(navLinkClass, entry.active && 'text-primary', entry.badge && 'inline-flex items-center gap-1'), href: entry.href, children: [entry.label, entry.badge ? (_jsx(Badge, { variant: "outline", size: "sm", children: entry.badge.label })) : null] }, primaryNavKey(entry, i)));
|
|
47
|
+
}
|
|
48
|
+
return (_jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: cn(navLinkClass, 'inline-flex cursor-default items-center gap-0 border-0 bg-transparent'), children: [entry.label, _jsx(ChevronDown, { className: "ml-1 size-4 opacity-80" })] }), _jsx(DropdownMenuContent, { align: "start", className: "min-w-48", children: entry.items.map((sub) => (_jsx(DropdownMenuItem, { children: sub.label }, sub.href))) })] }, primaryNavKey(entry, i)));
|
|
49
|
+
}) })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": "Search", children: _jsx(Search, { className: "size-4 text-muted-foreground" }) }), _jsx(Button, { type: "button", variant: "ghost", size: "icon", "aria-label": "Search", children: _jsx(Bell, { className: "size-4 text-muted-foreground" }) }), _jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: cn(navLinkClass, 'inline-flex cursor-default items-center gap-0 border-0 bg-transparent'), children: [pattern1SupportMenu.triggerLabel, _jsx(ChevronDown, { className: "ml-1 size-4 opacity-80" })] }), _jsx(DropdownMenuContent, { align: "start", className: "min-w-48", children: pattern1SupportMenu.items.map((item) => (_jsx(DropdownMenuItem, { children: item.label }, item.href))) })] }), _jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: cn(navLinkClass, 'inline-flex cursor-default items-center gap-0 border-0 bg-transparent'), children: [pattern1UserMenu.triggerLabel, _jsx(ChevronDown, { className: "ml-1 size-4 opacity-80" })] }), _jsxs(DropdownMenuContent, { align: "end", className: "min-w-56", children: [_jsxs(DropdownMenuLabel, { className: "font-normal", children: [_jsx("span", { className: "block text-sm font-medium", children: demoUser.name }), _jsx("span", { className: "block text-xs text-muted-foreground", children: demoUser.email })] }), _jsx(DropdownMenuSeparator, {}), pattern1UserMenu.sections.map((section, si) => (_jsxs(React.Fragment, { children: [si > 0 ? _jsx(DropdownMenuSeparator, {}) : null, section.map((item) => (_jsx(DropdownMenuItem, { children: item.label }, `${item.href}-${item.label}`)))] }, `user-dd-${si}`))), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { variant: "destructive", children: pattern1UserMenu.logOut.label })] })] })] })] }) })] }));
|
|
50
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react';
|
|
2
|
+
import { NavigationPattern1 } from './pattern-1';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: typeof NavigationPattern1;
|
|
6
|
+
parameters: {
|
|
7
|
+
layout: string;
|
|
8
|
+
};
|
|
9
|
+
};
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof meta>;
|
|
12
|
+
/** Wide canvas: show the desktop bar only (`hidden lg:block` → forced visible). */
|
|
13
|
+
export declare const Desktop: Story;
|
|
14
|
+
/** Wide canvas: show the mobile bar and sheet trigger (`lg:hidden` → forced visible). */
|
|
15
|
+
export declare const Mobile: Story;
|
|
16
|
+
//# sourceMappingURL=pattern-1.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pattern-1.stories.d.ts","sourceRoot":"","sources":["../../../../src/blocks/navigation/pattern-1/pattern-1.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,QAAA,MAAM,IAAI;;;;;;CAMiC,CAAC;AAE5C,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,mFAAmF;AACnF,eAAO,MAAM,OAAO,EAAE,KAGrB,CAAC;AAEF,yFAAyF;AACzF,eAAO,MAAM,MAAM,EAAE,KAEpB,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { NavigationPattern1 } from './pattern-1';
|
|
4
|
+
const meta = {
|
|
5
|
+
title: 'Blocks/Navigation/Pattern 1',
|
|
6
|
+
component: NavigationPattern1,
|
|
7
|
+
parameters: {
|
|
8
|
+
layout: 'padded',
|
|
9
|
+
},
|
|
10
|
+
};
|
|
11
|
+
export default meta;
|
|
12
|
+
/** Wide canvas: show the desktop bar only (`hidden lg:block` → forced visible). */
|
|
13
|
+
export const Desktop = {
|
|
14
|
+
// className="[&>nav:first-of-type]:hidden [&>nav:last-of-type]:!block"
|
|
15
|
+
render: () => _jsx(NavigationPattern1, {}),
|
|
16
|
+
};
|
|
17
|
+
/** Wide canvas: show the mobile bar and sheet trigger (`lg:hidden` → forced visible). */
|
|
18
|
+
export const Mobile = {
|
|
19
|
+
render: () => _jsx(NavigationPattern1, { className: "[&>nav:first-of-type]:!block [&>nav:last-of-type]:!hidden" }),
|
|
20
|
+
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { Accordion as AccordionPrimitive } from '@base-ui/react/accordion';
|
|
2
|
+
/** Props for `Accordion` root. See [Base UI Accordion](https://base-ui.com/react/components/accordion). */
|
|
3
|
+
export type AccordionProps = AccordionPrimitive.Root.Props;
|
|
4
|
+
/** Props for `AccordionItem`. */
|
|
5
|
+
export type AccordionItemProps = AccordionPrimitive.Item.Props;
|
|
6
|
+
/** Props for `AccordionTrigger`. */
|
|
7
|
+
export type AccordionTriggerProps = AccordionPrimitive.Trigger.Props;
|
|
8
|
+
/** Props for `AccordionContent` (collapsible panel). */
|
|
9
|
+
export type AccordionContentProps = AccordionPrimitive.Panel.Props;
|
|
10
|
+
declare function Accordion({ className, ...props }: AccordionProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
declare function AccordionItem({ className, ...props }: AccordionItemProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
declare function AccordionTrigger({ className, children, ...props }: AccordionTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
declare function AccordionContent({ className, children, ...props }: AccordionContentProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
|
|
15
|
+
//# sourceMappingURL=accordion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAK3E,2GAA2G;AAC3G,MAAM,MAAM,cAAc,GAAG,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC;AAE3D,iCAAiC;AACjC,MAAM,MAAM,kBAAkB,GAAG,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC;AAE/D,oCAAoC;AACpC,MAAM,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,OAAO,CAAC,KAAK,CAAC;AAErE,wDAAwD;AACxD,MAAM,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,KAAK,CAAC,KAAK,CAAC;AAEnE,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,2CAEzD;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAEjE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,2CAiBjF;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,2CAiBjF;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Accordion as AccordionPrimitive } from '@base-ui/react/accordion';
|
|
4
|
+
import { cn } from '../../lib/utils';
|
|
5
|
+
import { ChevronDown, ChevronUp } from 'lucide-react';
|
|
6
|
+
function Accordion({ className, ...props }) {
|
|
7
|
+
return _jsx(AccordionPrimitive.Root, { "data-slot": "accordion", className: cn('flex w-full flex-col', className), ...props });
|
|
8
|
+
}
|
|
9
|
+
function AccordionItem({ className, ...props }) {
|
|
10
|
+
return _jsx(AccordionPrimitive.Item, { "data-slot": "accordion-item", className: cn('not-last:border-b', className), ...props });
|
|
11
|
+
}
|
|
12
|
+
function AccordionTrigger({ className, children, ...props }) {
|
|
13
|
+
return (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { "data-slot": "accordion-trigger", className: cn('group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground', className), ...props, children: [children, _jsx(ChevronDown, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" }), _jsx(ChevronUp, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" })] }) }));
|
|
14
|
+
}
|
|
15
|
+
function AccordionContent({ className, children, ...props }) {
|
|
16
|
+
return (_jsx(AccordionPrimitive.Panel, { "data-slot": "accordion-content", className: "overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up", ...props, children: _jsx("div", { className: cn('h-(--accordion-panel-height) pt-0 pb-2.5 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4', className), children: children }) }));
|
|
17
|
+
}
|
|
18
|
+
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
import { Accordion } from './accordion';
|
|
3
|
+
declare const meta: Meta<typeof Accordion>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
//# sourceMappingURL=accordion.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.stories.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,SAAS,EAAqD,MAAM,aAAa,CAAC;AAE3F,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAcC,CAAC;AAEnC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAarB,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from './accordion';
|
|
3
|
+
const meta = {
|
|
4
|
+
title: 'UI/Accordion',
|
|
5
|
+
component: Accordion,
|
|
6
|
+
tags: ['autodocs'],
|
|
7
|
+
parameters: {
|
|
8
|
+
layout: 'centered',
|
|
9
|
+
},
|
|
10
|
+
decorators: [
|
|
11
|
+
(Story) => (_jsx("div", { className: "w-full max-w-md p-4", children: _jsx(Story, {}) })),
|
|
12
|
+
],
|
|
13
|
+
};
|
|
14
|
+
export default meta;
|
|
15
|
+
export const Default = {
|
|
16
|
+
render: () => (_jsxs(Accordion, { defaultValue: ['item-1'], children: [_jsxs(AccordionItem, { value: "item-1", children: [_jsx(AccordionTrigger, { children: "Is it accessible?" }), _jsx(AccordionContent, { children: "Yes. It uses semantic markup and supports keyboard navigation." })] }), _jsxs(AccordionItem, { value: "item-2", children: [_jsx(AccordionTrigger, { children: "Is it styled?" }), _jsx(AccordionContent, { children: "Yes. It matches Wheelhouse tokens and motion presets." })] })] })),
|
|
17
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE3F,YAAY,EAAE,cAAc,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from './accordion';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
3
|
+
declare const alertVariants: (props?: ({
|
|
4
|
+
variant?: "default" | "destructive" | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
declare function Alert({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
declare function AlertTitle({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
declare function AlertDescription({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
declare function AlertAction({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export { Alert, AlertTitle, AlertDescription, AlertAction };
|
|
11
|
+
//# sourceMappingURL=alert.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/alert/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,QAAA,MAAM,aAAa;;8EAclB,CAAC;AAEF,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,2CAEhH;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQvE;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7E;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAExE;AAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { cva } from 'class-variance-authority';
|
|
4
|
+
import { cn } from '../../lib/utils';
|
|
5
|
+
const alertVariants = cva("group/alert relative grid w-full gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4", {
|
|
6
|
+
variants: {
|
|
7
|
+
variant: {
|
|
8
|
+
default: 'bg-card text-card-foreground',
|
|
9
|
+
destructive: 'border-destructive-foreground/30 bg-card text-destructive-foreground *:data-[slot=alert-description]:text-destructive-foreground/90 *:[svg]:text-current',
|
|
10
|
+
},
|
|
11
|
+
},
|
|
12
|
+
defaultVariants: {
|
|
13
|
+
variant: 'default',
|
|
14
|
+
},
|
|
15
|
+
});
|
|
16
|
+
function Alert({ className, variant, ...props }) {
|
|
17
|
+
return _jsx("div", { "data-slot": "alert", role: "alert", className: cn(alertVariants({ variant }), className), ...props });
|
|
18
|
+
}
|
|
19
|
+
function AlertTitle({ className, ...props }) {
|
|
20
|
+
return (_jsx("div", { "data-slot": "alert-title", className: cn('font-medium group-has-[>svg]/alert:col-start-2 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground', className), ...props }));
|
|
21
|
+
}
|
|
22
|
+
function AlertDescription({ className, ...props }) {
|
|
23
|
+
return (_jsx("div", { "data-slot": "alert-description", className: cn('text-sm text-balance text-muted-foreground md:text-pretty [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4', className), ...props }));
|
|
24
|
+
}
|
|
25
|
+
function AlertAction({ className, ...props }) {
|
|
26
|
+
return _jsx("div", { "data-slot": "alert-action", className: cn('absolute top-2 right-2', className), ...props });
|
|
27
|
+
}
|
|
28
|
+
export { Alert, AlertTitle, AlertDescription, AlertAction };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
import { Alert } from './alert';
|
|
3
|
+
declare const meta: Meta<typeof Alert>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Gallery: Story;
|
|
8
|
+
export declare const WithIcon: Story;
|
|
9
|
+
export declare const Destructive: Story;
|
|
10
|
+
export declare const WithAction: Story;
|
|
11
|
+
//# sourceMappingURL=alert.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert.stories.d.ts","sourceRoot":"","sources":["../../../src/components/alert/alert.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,KAAK,EAA6C,MAAM,SAAS,CAAC;AAI3E,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,CAcC,CAAC;AAE/B,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KA+DrB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAQzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAC"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Alert, AlertAction, AlertDescription, AlertTitle } from './alert';
|
|
3
|
+
import { Button } from '../button';
|
|
4
|
+
import { AlertTriangle, Info } from 'lucide-react';
|
|
5
|
+
const meta = {
|
|
6
|
+
title: 'UI/Alert',
|
|
7
|
+
component: Alert,
|
|
8
|
+
tags: ['autodocs'],
|
|
9
|
+
parameters: {
|
|
10
|
+
layout: 'centered',
|
|
11
|
+
},
|
|
12
|
+
decorators: [
|
|
13
|
+
(Story) => (_jsx("div", { className: "w-96", children: _jsx(Story, {}) })),
|
|
14
|
+
],
|
|
15
|
+
};
|
|
16
|
+
export default meta;
|
|
17
|
+
export const Default = {
|
|
18
|
+
render: (args) => (_jsxs(Alert, { ...args, children: [_jsx(AlertTitle, { children: "Heads up!" }), _jsx(AlertDescription, { children: "You can add components to your app using the CLI." })] })),
|
|
19
|
+
};
|
|
20
|
+
export const Gallery = {
|
|
21
|
+
parameters: {
|
|
22
|
+
layout: 'padded',
|
|
23
|
+
controls: { disable: true },
|
|
24
|
+
},
|
|
25
|
+
render: () => (_jsxs("div", { className: "flex max-w-[min(100vw-2rem,42rem)] flex-col gap-10", children: [_jsxs("section", { className: "flex flex-col gap-3", children: [_jsx("h3", { className: "text-xs font-medium tracking-wide text-muted-foreground uppercase", children: "Default" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs(Alert, { children: [_jsx(AlertTitle, { children: "Heads up!" }), _jsx(AlertDescription, { children: "You can add components to your app using the CLI." })] }), _jsxs(Alert, { children: [_jsx(Info, { "aria-hidden": "true" }), _jsx(AlertTitle, { children: "Information" }), _jsx(AlertDescription, { children: "Your subscription renews on the 1st of next month." })] })] })] }), _jsxs("section", { className: "flex flex-col gap-3", children: [_jsx("h3", { className: "text-xs font-medium tracking-wide text-muted-foreground uppercase", children: "Destructive" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs(Alert, { variant: "destructive", children: [_jsx(AlertTitle, { children: "Something went wrong" }), _jsx(AlertDescription, { children: "Your session has expired. Please sign in again to continue." })] }), _jsxs(Alert, { variant: "destructive", children: [_jsx(AlertTriangle, { "aria-hidden": "true" }), _jsx(AlertTitle, { children: "Something went wrong" }), _jsx(AlertDescription, { children: "Your session has expired. Please sign in again to continue." })] })] })] }), _jsxs("section", { className: "flex flex-col gap-3", children: [_jsx("h3", { className: "text-xs font-medium tracking-wide text-muted-foreground uppercase", children: "With Action" }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs(Alert, { children: [_jsx(AlertTitle, { children: "Update available" }), _jsx(AlertDescription, { children: "A new version of the application is ready to install." }), _jsx(AlertAction, { children: _jsx(Button, { size: "xs", variant: "outline", children: "Update" }) })] }), _jsxs(Alert, { variant: "destructive", children: [_jsx(AlertTriangle, { "aria-hidden": "true" }), _jsx(AlertTitle, { children: "Payment failed" }), _jsx(AlertDescription, { children: "We could not process your payment. Please update your billing details." }), _jsx(AlertAction, { children: _jsx(Button, { size: "xs", variant: "outline", children: "Fix now" }) })] })] })] })] })),
|
|
26
|
+
};
|
|
27
|
+
export const WithIcon = {
|
|
28
|
+
render: (args) => (_jsxs(Alert, { ...args, children: [_jsx(Info, { "aria-hidden": "true" }), _jsx(AlertTitle, { children: "Information" }), _jsx(AlertDescription, { children: "Your subscription renews on the 1st of next month." })] })),
|
|
29
|
+
};
|
|
30
|
+
export const Destructive = {
|
|
31
|
+
render: (args) => (_jsxs(Alert, { ...args, variant: "destructive", children: [_jsx(AlertTriangle, { "aria-hidden": "true" }), _jsx(AlertTitle, { children: "Something went wrong" }), _jsx(AlertDescription, { children: "Your session has expired. Please sign in again to continue." })] })),
|
|
32
|
+
};
|
|
33
|
+
export const WithAction = {
|
|
34
|
+
render: (args) => (_jsxs(Alert, { ...args, children: [_jsx(AlertTitle, { children: "Update available" }), _jsx(AlertDescription, { children: "A new version of the application is ready to install." }), _jsx(AlertAction, { children: _jsx(Button, { size: "xs", variant: "outline", children: "Update" }) })] })),
|
|
35
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/alert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Alert, AlertAction, AlertDescription, AlertTitle } from './alert';
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';
|
|
3
|
+
import { Button } from '../button';
|
|
4
|
+
/** Props for the alert dialog root. See [Base UI Alert Dialog](https://base-ui.com/react/components/alert-dialog). */
|
|
5
|
+
export type AlertDialogProps = AlertDialogPrimitive.Root.Props;
|
|
6
|
+
declare function AlertDialog({ ...props }: AlertDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
/** Props for the element that opens the alert (typically a button). */
|
|
8
|
+
export type AlertDialogTriggerProps = AlertDialogPrimitive.Trigger.Props;
|
|
9
|
+
declare function AlertDialogTrigger({ ...props }: AlertDialogTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
/** Props for the portal that renders the overlay and popup into `document.body` (or a custom container). */
|
|
11
|
+
export type AlertDialogPortalProps = AlertDialogPrimitive.Portal.Props;
|
|
12
|
+
declare function AlertDialogPortal({ ...props }: AlertDialogPortalProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
/** Props for the dimmed backdrop behind the popup. */
|
|
14
|
+
export type AlertDialogOverlayProps = AlertDialogPrimitive.Backdrop.Props;
|
|
15
|
+
declare function AlertDialogOverlay({ className, ...props }: AlertDialogOverlayProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
/** Props for the alert surface; extends the Base UI popup with `size` layout presets. */
|
|
17
|
+
export type AlertDialogContentProps = AlertDialogPrimitive.Popup.Props & {
|
|
18
|
+
/** Layout width preset: `default` grows on larger screens; `sm` stays compact with a two-column footer on small screens. */
|
|
19
|
+
size?: 'default' | 'sm';
|
|
20
|
+
};
|
|
21
|
+
declare function AlertDialogContent({ className, size, ...props }: AlertDialogContentProps): import("react/jsx-runtime").JSX.Element;
|
|
22
|
+
/** Layout wrapper for optional media, title, and description. */
|
|
23
|
+
export type AlertDialogHeaderProps = React.ComponentProps<'div'>;
|
|
24
|
+
declare function AlertDialogHeader({ className, ...props }: AlertDialogHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
25
|
+
/** Footer row for cancel and primary actions. */
|
|
26
|
+
export type AlertDialogFooterProps = React.ComponentProps<'div'>;
|
|
27
|
+
declare function AlertDialogFooter({ className, ...props }: AlertDialogFooterProps): import("react/jsx-runtime").JSX.Element;
|
|
28
|
+
/** Optional icon or illustration slot above the title (default size layout). */
|
|
29
|
+
export type AlertDialogMediaProps = React.ComponentProps<'div'>;
|
|
30
|
+
declare function AlertDialogMedia({ className, ...props }: AlertDialogMediaProps): import("react/jsx-runtime").JSX.Element;
|
|
31
|
+
/** Accessible title; renders a heading. */
|
|
32
|
+
export type AlertDialogTitleProps = AlertDialogPrimitive.Title.Props;
|
|
33
|
+
declare function AlertDialogTitle({ className, ...props }: AlertDialogTitleProps): import("react/jsx-runtime").JSX.Element;
|
|
34
|
+
/** Supporting text below the title. */
|
|
35
|
+
export type AlertDialogDescriptionProps = AlertDialogPrimitive.Description.Props;
|
|
36
|
+
declare function AlertDialogDescription({ className, ...props }: AlertDialogDescriptionProps): import("react/jsx-runtime").JSX.Element;
|
|
37
|
+
/** Primary action; renders a `Button` (does not dismiss the alert — use `AlertDialogCancel` or close via the dialog API). */
|
|
38
|
+
export type AlertDialogActionProps = React.ComponentProps<typeof Button>;
|
|
39
|
+
declare function AlertDialogAction({ className, ...props }: AlertDialogActionProps): import("react/jsx-runtime").JSX.Element;
|
|
40
|
+
/** Dismiss action; wraps Base UI `Close` with outline `Button` styling by default. */
|
|
41
|
+
export type AlertDialogCancelProps = AlertDialogPrimitive.Close.Props & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>;
|
|
42
|
+
declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialogCancelProps): import("react/jsx-runtime").JSX.Element;
|
|
43
|
+
export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
|
|
44
|
+
//# sourceMappingURL=alert-dialog.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAGlF,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAEnC,sHAAsH;AACtH,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC;AAE/D,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,2CAElD;AAED,uEAAuE;AACvE,MAAM,MAAM,uBAAuB,GAAG,oBAAoB,CAAC,OAAO,CAAC,KAAK,CAAC;AAEzE,iBAAS,kBAAkB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,2CAEhE;AAED,4GAA4G;AAC5G,MAAM,MAAM,sBAAsB,GAAG,oBAAoB,CAAC,MAAM,CAAC,KAAK,CAAC;AAEvE,iBAAS,iBAAiB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,2CAE9D;AAED,sDAAsD;AACtD,MAAM,MAAM,uBAAuB,GAAG,oBAAoB,CAAC,QAAQ,CAAC,KAAK,CAAC;AAE1E,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,2CAW3E;AAED,yFAAyF;AACzF,MAAM,MAAM,uBAAuB,GAAG,oBAAoB,CAAC,KAAK,CAAC,KAAK,GAAG;IACrE,4HAA4H;IAC5H,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;CAC3B,CAAC;AAEF,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,IAAgB,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,2CAe7F;AAED,iEAAiE;AACjE,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEjE,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,2CAWzE;AAED,iDAAiD;AACjD,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEjE,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,2CAWzE;AAED,gFAAgF;AAChF,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAEhE,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,2CAWvE;AAED,2CAA2C;AAC3C,MAAM,MAAM,qBAAqB,GAAG,oBAAoB,CAAC,KAAK,CAAC,KAAK,CAAC;AAErE,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,2CAWvE;AAED,uCAAuC;AACvC,MAAM,MAAM,2BAA2B,GAAG,oBAAoB,CAAC,WAAW,CAAC,KAAK,CAAC;AAEjF,iBAAS,sBAAsB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,2BAA2B,2CAWnF;AAED,6HAA6H;AAC7H,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;AAEzE,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,2CAEzE;AAED,sFAAsF;AACtF,MAAM,MAAM,sBAAsB,GAAG,oBAAoB,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC,CAAC;AAEtI,iBAAS,iBAAiB,CAAC,EAAE,SAAS,EAAE,OAAmB,EAAE,IAAgB,EAAE,GAAG,KAAK,EAAE,EAAE,sBAAsB,2CAIhH;AAED,OAAO,EACH,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,GACrB,CAAC"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';
|
|
5
|
+
import { cn } from '../../lib/utils';
|
|
6
|
+
import { Button } from '../button';
|
|
7
|
+
function AlertDialog({ ...props }) {
|
|
8
|
+
return _jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
|
|
9
|
+
}
|
|
10
|
+
function AlertDialogTrigger({ ...props }) {
|
|
11
|
+
return _jsx(AlertDialogPrimitive.Trigger, { "data-slot": "alert-dialog-trigger", ...props });
|
|
12
|
+
}
|
|
13
|
+
function AlertDialogPortal({ ...props }) {
|
|
14
|
+
return _jsx(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props });
|
|
15
|
+
}
|
|
16
|
+
function AlertDialogOverlay({ className, ...props }) {
|
|
17
|
+
return (_jsx(AlertDialogPrimitive.Backdrop, { "data-slot": "alert-dialog-overlay", className: cn('fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0', className), ...props }));
|
|
18
|
+
}
|
|
19
|
+
function AlertDialogContent({ className, size = 'default', ...props }) {
|
|
20
|
+
return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Popup, { "data-slot": "alert-dialog-content", "data-size": size, className: cn('group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95', className), ...props })] }));
|
|
21
|
+
}
|
|
22
|
+
function AlertDialogHeader({ className, ...props }) {
|
|
23
|
+
return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn('grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]', className), ...props }));
|
|
24
|
+
}
|
|
25
|
+
function AlertDialogFooter({ className, ...props }) {
|
|
26
|
+
return (_jsx("div", { "data-slot": "alert-dialog-footer", className: cn('-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end', className), ...props }));
|
|
27
|
+
}
|
|
28
|
+
function AlertDialogMedia({ className, ...props }) {
|
|
29
|
+
return (_jsx("div", { "data-slot": "alert-dialog-media", className: cn("mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6", className), ...props }));
|
|
30
|
+
}
|
|
31
|
+
function AlertDialogTitle({ className, ...props }) {
|
|
32
|
+
return (_jsx(AlertDialogPrimitive.Title, { "data-slot": "alert-dialog-title", className: cn('font-heading text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2', className), ...props }));
|
|
33
|
+
}
|
|
34
|
+
function AlertDialogDescription({ className, ...props }) {
|
|
35
|
+
return (_jsx(AlertDialogPrimitive.Description, { "data-slot": "alert-dialog-description", className: cn('text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground', className), ...props }));
|
|
36
|
+
}
|
|
37
|
+
function AlertDialogAction({ className, ...props }) {
|
|
38
|
+
return _jsx(Button, { "data-slot": "alert-dialog-action", className: cn(className), ...props });
|
|
39
|
+
}
|
|
40
|
+
function AlertDialogCancel({ className, variant = 'outline', size = 'default', ...props }) {
|
|
41
|
+
return (_jsx(AlertDialogPrimitive.Close, { "data-slot": "alert-dialog-cancel", className: cn(className), render: _jsx(Button, { variant: variant, size: size }), ...props }));
|
|
42
|
+
}
|
|
43
|
+
export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
import { AlertDialog } from './alert-dialog';
|
|
3
|
+
declare const meta: Meta<typeof AlertDialog>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const WithMedia: Story;
|
|
8
|
+
export declare const SizeSm: Story;
|
|
9
|
+
//# sourceMappingURL=alert-dialog.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-dialog.stories.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/alert-dialog.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,EACH,WAAW,EAUd,MAAM,gBAAgB,CAAC;AAExB,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAOlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAgBrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAmBvB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAgBpB,CAAC"}
|