@jbpark/ui-kit 5.1.0 → 5.3.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/dist/Button.d.mts +1 -19
- package/dist/Button.d.mts.map +1 -1
- package/dist/Button.mjs +2 -4
- package/dist/Button.mjs.map +1 -1
- package/dist/Card.d.mts +1 -10
- package/dist/Card.d.mts.map +1 -1
- package/dist/Card.mjs +1 -2
- package/dist/Card.mjs.map +1 -1
- package/dist/Layout.d.mts +5 -6
- package/dist/Layout.d.mts.map +1 -1
- package/dist/Layout.mjs +1 -2
- package/dist/Layout.mjs.map +1 -1
- package/dist/Menu.d.mts +1 -1
- package/dist/Menu.mjs +1 -2
- package/dist/Reveals.d.mts +2 -3
- package/dist/Reveals.d.mts.map +1 -1
- package/dist/Reveals.mjs +1 -2
- package/dist/Reveals.mjs.map +1 -1
- package/dist/Space.d.mts +1 -17
- package/dist/Space.d.mts.map +1 -1
- package/dist/Space.mjs +1 -2
- package/dist/Space.mjs.map +1 -1
- package/dist/Tag.d.mts +1 -9
- package/dist/Tag.d.mts.map +1 -1
- package/dist/Tag.mjs +1 -2
- package/dist/Tag.mjs.map +1 -1
- package/dist/Typography.d.mts +5 -6
- package/dist/Typography.d.mts.map +1 -1
- package/dist/Typography.mjs +1 -2
- package/dist/Typography.mjs.map +1 -1
- package/dist/_virtual/_rolldown/runtime.mjs +6 -11
- package/dist/components/atoms/checkbox/checkbox.d.mts +2 -17
- package/dist/components/atoms/checkbox/checkbox.d.mts.map +1 -1
- package/dist/components/atoms/checkbox/checkbox.mjs +13 -12
- package/dist/components/atoms/checkbox/checkbox.mjs.map +1 -1
- package/dist/components/atoms/checkbox/group.d.mts +2 -16
- package/dist/components/atoms/checkbox/group.d.mts.map +1 -1
- package/dist/components/atoms/checkbox/group.mjs +4 -5
- package/dist/components/atoms/checkbox/group.mjs.map +1 -1
- package/dist/components/atoms/checkbox/index.d.mts +3 -4
- package/dist/components/atoms/checkbox/index.d.mts.map +1 -1
- package/dist/components/atoms/checkbox/index.mjs +1 -2
- package/dist/components/atoms/checkbox/index.mjs.map +1 -1
- package/dist/components/atoms/color-picker.d.mts +2 -15
- package/dist/components/atoms/color-picker.d.mts.map +1 -1
- package/dist/components/atoms/color-picker.mjs +2 -4
- package/dist/components/atoms/color-picker.mjs.map +1 -1
- package/dist/components/atoms/date-picker.d.mts +2 -11
- package/dist/components/atoms/date-picker.d.mts.map +1 -1
- package/dist/components/atoms/date-picker.mjs +2 -4
- package/dist/components/atoms/date-picker.mjs.map +1 -1
- package/dist/components/atoms/float-button/back-top.d.mts +2 -10
- package/dist/components/atoms/float-button/back-top.d.mts.map +1 -1
- package/dist/components/atoms/float-button/back-top.mjs +4 -5
- package/dist/components/atoms/float-button/back-top.mjs.map +1 -1
- package/dist/components/atoms/float-button/float-button.d.mts +2 -8
- package/dist/components/atoms/float-button/float-button.d.mts.map +1 -1
- package/dist/components/atoms/float-button/float-button.mjs +1 -2
- package/dist/components/atoms/float-button/float-button.mjs.map +1 -1
- package/dist/components/atoms/float-button/index.d.mts +3 -4
- package/dist/components/atoms/float-button/index.d.mts.map +1 -1
- package/dist/components/atoms/float-button/index.mjs +1 -2
- package/dist/components/atoms/float-button/index.mjs.map +1 -1
- package/dist/components/atoms/index.d.mts +13 -12
- package/dist/components/atoms/input/index.d.mts +4 -5
- package/dist/components/atoms/input/index.d.mts.map +1 -1
- package/dist/components/atoms/input/index.mjs +2 -3
- package/dist/components/atoms/input/index.mjs.map +1 -1
- package/dist/components/atoms/input/input.d.mts +2 -7
- package/dist/components/atoms/input/input.d.mts.map +1 -1
- package/dist/components/atoms/input/input.mjs +1 -2
- package/dist/components/atoms/input/input.mjs.map +1 -1
- package/dist/components/atoms/input/search.d.mts +2 -15
- package/dist/components/atoms/input/search.d.mts.map +1 -1
- package/dist/components/atoms/input/search.mjs +2 -4
- package/dist/components/atoms/input/search.mjs.map +1 -1
- package/dist/components/atoms/input/text-area.d.mts +2 -8
- package/dist/components/atoms/input/text-area.d.mts.map +1 -1
- package/dist/components/atoms/input/text-area.mjs +1 -2
- package/dist/components/atoms/input/text-area.mjs.map +1 -1
- package/dist/components/atoms/option-group.d.mts +1 -1
- package/dist/components/atoms/option-group.d.mts.map +1 -1
- package/dist/components/atoms/option-group.mjs +1 -1
- package/dist/components/atoms/option-group.mjs.map +1 -1
- package/dist/components/atoms/popover.d.mts +2 -14
- package/dist/components/atoms/popover.d.mts.map +1 -1
- package/dist/components/atoms/popover.mjs +1 -2
- package/dist/components/atoms/popover.mjs.map +1 -1
- package/dist/components/atoms/progress.d.mts +2 -10
- package/dist/components/atoms/progress.d.mts.map +1 -1
- package/dist/components/atoms/progress.mjs +1 -2
- package/dist/components/atoms/progress.mjs.map +1 -1
- package/dist/components/atoms/radio/context.mjs +2 -4
- package/dist/components/atoms/radio/context.mjs.map +1 -1
- package/dist/components/atoms/radio/group.d.mts +2 -19
- package/dist/components/atoms/radio/group.d.mts.map +1 -1
- package/dist/components/atoms/radio/group.mjs +2 -4
- package/dist/components/atoms/radio/group.mjs.map +1 -1
- package/dist/components/atoms/radio/index.d.mts +3 -4
- package/dist/components/atoms/radio/index.d.mts.map +1 -1
- package/dist/components/atoms/radio/index.mjs +1 -2
- package/dist/components/atoms/radio/index.mjs.map +1 -1
- package/dist/components/atoms/radio/radio.d.mts +2 -18
- package/dist/components/atoms/radio/radio.d.mts.map +1 -1
- package/dist/components/atoms/radio/radio.mjs +13 -12
- package/dist/components/atoms/radio/radio.mjs.map +1 -1
- package/dist/components/atoms/select.d.mts +2 -10
- package/dist/components/atoms/select.d.mts.map +1 -1
- package/dist/components/atoms/select.mjs +2 -3
- package/dist/components/atoms/select.mjs.map +1 -1
- package/dist/components/atoms/skeleton/button.d.mts +2 -7
- package/dist/components/atoms/skeleton/button.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/button.mjs +1 -2
- package/dist/components/atoms/skeleton/button.mjs.map +1 -1
- package/dist/components/atoms/skeleton/index.d.mts +4 -5
- package/dist/components/atoms/skeleton/index.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/index.mjs +2 -3
- package/dist/components/atoms/skeleton/index.mjs.map +1 -1
- package/dist/components/atoms/skeleton/node.d.mts +2 -7
- package/dist/components/atoms/skeleton/node.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/node.mjs +1 -2
- package/dist/components/atoms/skeleton/node.mjs.map +1 -1
- package/dist/components/atoms/skeleton/skeleton.d.mts +2 -20
- package/dist/components/atoms/skeleton/skeleton.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/skeleton.mjs +2 -4
- package/dist/components/atoms/skeleton/skeleton.mjs.map +1 -1
- package/dist/components/atoms/spin.d.mts +2 -10
- package/dist/components/atoms/spin.d.mts.map +1 -1
- package/dist/components/atoms/spin.mjs +2 -4
- package/dist/components/atoms/spin.mjs.map +1 -1
- package/dist/components/atoms/switch.d.mts +2 -14
- package/dist/components/atoms/switch.d.mts.map +1 -1
- package/dist/components/atoms/switch.mjs +2 -4
- package/dist/components/atoms/switch.mjs.map +1 -1
- package/dist/components/atoms/typography/link.d.mts +2 -10
- package/dist/components/atoms/typography/link.d.mts.map +1 -1
- package/dist/components/atoms/typography/link.mjs +1 -2
- package/dist/components/atoms/typography/link.mjs.map +1 -1
- package/dist/components/atoms/typography/paragraph.d.mts +2 -8
- package/dist/components/atoms/typography/paragraph.d.mts.map +1 -1
- package/dist/components/atoms/typography/paragraph.mjs +1 -2
- package/dist/components/atoms/typography/paragraph.mjs.map +1 -1
- package/dist/components/atoms/typography/text.d.mts +2 -10
- package/dist/components/atoms/typography/text.d.mts.map +1 -1
- package/dist/components/atoms/typography/text.mjs +1 -2
- package/dist/components/atoms/typography/text.mjs.map +1 -1
- package/dist/components/atoms/typography/title.d.mts +2 -9
- package/dist/components/atoms/typography/title.d.mts.map +1 -1
- package/dist/components/atoms/typography/title.mjs +1 -2
- package/dist/components/atoms/typography/title.mjs.map +1 -1
- package/dist/components/atoms/typography/typography.d.mts +2 -7
- package/dist/components/atoms/typography/typography.d.mts.map +1 -1
- package/dist/components/atoms/typography/typography.mjs +1 -2
- package/dist/components/atoms/typography/typography.mjs.map +1 -1
- package/dist/components/molecules/collapse.d.mts +2 -14
- package/dist/components/molecules/collapse.d.mts.map +1 -1
- package/dist/components/molecules/collapse.mjs +4 -6
- package/dist/components/molecules/collapse.mjs.map +1 -1
- package/dist/components/molecules/dropdown.d.mts +2 -15
- package/dist/components/molecules/dropdown.d.mts.map +1 -1
- package/dist/components/molecules/dropdown.mjs +15 -15
- package/dist/components/molecules/dropdown.mjs.map +1 -1
- package/dist/components/molecules/index.d.mts +7 -7
- package/dist/components/molecules/marquees/index.d.mts +3 -4
- package/dist/components/molecules/marquees/index.d.mts.map +1 -1
- package/dist/components/molecules/marquees/index.mjs +2 -3
- package/dist/components/molecules/marquees/index.mjs.map +1 -1
- package/dist/components/molecules/marquees/item.d.mts +2 -11
- package/dist/components/molecules/marquees/item.d.mts.map +1 -1
- package/dist/components/molecules/marquees/item.mjs +12 -10
- package/dist/components/molecules/marquees/item.mjs.map +1 -1
- package/dist/components/molecules/marquees/marquees.d.mts +2 -11
- package/dist/components/molecules/marquees/marquees.d.mts.map +1 -1
- package/dist/components/molecules/marquees/marquees.mjs +5 -5
- package/dist/components/molecules/marquees/marquees.mjs.map +1 -1
- package/dist/components/molecules/menu/item/item.mjs +2 -4
- package/dist/components/molecules/menu/item/item.mjs.map +1 -1
- package/dist/components/molecules/menu/item/label.mjs +1 -2
- package/dist/components/molecules/menu/item/label.mjs.map +1 -1
- package/dist/components/molecules/menu/menu.d.mts +2 -17
- package/dist/components/molecules/menu/menu.d.mts.map +1 -1
- package/dist/components/molecules/menu/menu.mjs +2 -4
- package/dist/components/molecules/menu/menu.mjs.map +1 -1
- package/dist/components/molecules/reveals/item.d.mts +2 -15
- package/dist/components/molecules/reveals/item.d.mts.map +1 -1
- package/dist/components/molecules/reveals/item.mjs +2 -4
- package/dist/components/molecules/reveals/item.mjs.map +1 -1
- package/dist/components/molecules/reveals/reveals.d.mts +2 -18
- package/dist/components/molecules/reveals/reveals.d.mts.map +1 -1
- package/dist/components/molecules/reveals/reveals.mjs +2 -3
- package/dist/components/molecules/reveals/reveals.mjs.map +1 -1
- package/dist/components/molecules/splitter/index.d.mts +3 -4
- package/dist/components/molecules/splitter/index.d.mts.map +1 -1
- package/dist/components/molecules/splitter/index.mjs +1 -2
- package/dist/components/molecules/splitter/index.mjs.map +1 -1
- package/dist/components/molecules/splitter/panel.d.mts +2 -8
- package/dist/components/molecules/splitter/panel.d.mts.map +1 -1
- package/dist/components/molecules/splitter/panel.mjs +1 -2
- package/dist/components/molecules/splitter/panel.mjs.map +1 -1
- package/dist/components/molecules/splitter/splitter.d.mts +2 -14
- package/dist/components/molecules/splitter/splitter.d.mts.map +1 -1
- package/dist/components/molecules/splitter/splitter.mjs +2 -4
- package/dist/components/molecules/splitter/splitter.mjs.map +1 -1
- package/dist/components/molecules/upload.d.mts +2 -15
- package/dist/components/molecules/upload.d.mts.map +1 -1
- package/dist/components/molecules/upload.mjs +2 -4
- package/dist/components/molecules/upload.mjs.map +1 -1
- package/dist/components/organisms/drawer.d.mts +2 -25
- package/dist/components/organisms/drawer.d.mts.map +1 -1
- package/dist/components/organisms/drawer.mjs +2 -4
- package/dist/components/organisms/drawer.mjs.map +1 -1
- package/dist/components/organisms/imperative-stack.mjs +2 -4
- package/dist/components/organisms/imperative-stack.mjs.map +1 -1
- package/dist/components/organisms/index.d.mts +6 -5
- package/dist/components/organisms/list/index.d.mts +3 -4
- package/dist/components/organisms/list/index.d.mts.map +1 -1
- package/dist/components/organisms/list/index.mjs +1 -2
- package/dist/components/organisms/list/index.mjs.map +1 -1
- package/dist/components/organisms/list/item.d.mts +2 -8
- package/dist/components/organisms/list/item.d.mts.map +1 -1
- package/dist/components/organisms/list/item.mjs +1 -2
- package/dist/components/organisms/list/item.mjs.map +1 -1
- package/dist/components/organisms/list/list.d.mts +3 -20
- package/dist/components/organisms/list/list.d.mts.map +1 -1
- package/dist/components/organisms/list/list.mjs +3 -5
- package/dist/components/organisms/list/list.mjs.map +1 -1
- package/dist/components/organisms/modal.d.mts +2 -22
- package/dist/components/organisms/modal.d.mts.map +1 -1
- package/dist/components/organisms/modal.mjs +3 -5
- package/dist/components/organisms/modal.mjs.map +1 -1
- package/dist/components/organisms/swiper/index.d.mts +3 -4
- package/dist/components/organisms/swiper/index.d.mts.map +1 -1
- package/dist/components/organisms/swiper/index.mjs +2 -3
- package/dist/components/organisms/swiper/index.mjs.map +1 -1
- package/dist/components/organisms/swiper/slide.d.mts +2 -8
- package/dist/components/organisms/swiper/slide.d.mts.map +1 -1
- package/dist/components/organisms/swiper/slide.mjs +2 -4
- package/dist/components/organisms/swiper/slide.mjs.map +1 -1
- package/dist/components/organisms/swiper/swiper.d.mts +2 -15
- package/dist/components/organisms/swiper/swiper.d.mts.map +1 -1
- package/dist/components/organisms/swiper/swiper.mjs +2 -4
- package/dist/components/organisms/swiper/swiper.mjs.map +1 -1
- package/dist/components/organisms/toast.d.mts +2 -13
- package/dist/components/organisms/toast.d.mts.map +1 -1
- package/dist/components/organisms/toast.mjs +2 -4
- package/dist/components/organisms/toast.mjs.map +1 -1
- package/dist/components/templates/container.d.mts +2 -10
- package/dist/components/templates/container.d.mts.map +1 -1
- package/dist/components/templates/container.mjs +1 -2
- package/dist/components/templates/container.mjs.map +1 -1
- package/dist/components/templates/empty.d.mts +2 -11
- package/dist/components/templates/empty.d.mts.map +1 -1
- package/dist/components/templates/empty.mjs +1 -2
- package/dist/components/templates/empty.mjs.map +1 -1
- package/dist/components/templates/grid/col.d.mts +2 -17
- package/dist/components/templates/grid/col.d.mts.map +1 -1
- package/dist/components/templates/grid/col.mjs +2 -4
- package/dist/components/templates/grid/col.mjs.map +1 -1
- package/dist/components/templates/grid/row-context.mjs +1 -2
- package/dist/components/templates/grid/row-context.mjs.map +1 -1
- package/dist/components/templates/grid/row.d.mts +2 -13
- package/dist/components/templates/grid/row.d.mts.map +1 -1
- package/dist/components/templates/grid/row.mjs +2 -4
- package/dist/components/templates/grid/row.mjs.map +1 -1
- package/dist/components/templates/layout/content.d.mts +2 -9
- package/dist/components/templates/layout/content.d.mts.map +1 -1
- package/dist/components/templates/layout/content.mjs +1 -2
- package/dist/components/templates/layout/content.mjs.map +1 -1
- package/dist/components/templates/layout/footer.d.mts +2 -8
- package/dist/components/templates/layout/footer.d.mts.map +1 -1
- package/dist/components/templates/layout/footer.mjs +1 -2
- package/dist/components/templates/layout/footer.mjs.map +1 -1
- package/dist/components/templates/layout/header.d.mts +2 -9
- package/dist/components/templates/layout/header.d.mts.map +1 -1
- package/dist/components/templates/layout/header.mjs +1 -2
- package/dist/components/templates/layout/header.mjs.map +1 -1
- package/dist/components/templates/layout/layout.d.mts +2 -8
- package/dist/components/templates/layout/layout.d.mts.map +1 -1
- package/dist/components/templates/layout/layout.mjs +1 -2
- package/dist/components/templates/layout/layout.mjs.map +1 -1
- package/dist/components/templates/layout/sider-context.mjs +1 -2
- package/dist/components/templates/layout/sider-context.mjs.map +1 -1
- package/dist/components/templates/layout/sider.d.mts +2 -21
- package/dist/components/templates/layout/sider.d.mts.map +1 -1
- package/dist/components/templates/layout/sider.mjs +2 -4
- package/dist/components/templates/layout/sider.mjs.map +1 -1
- package/dist/components/templates/page-header.d.mts +2 -14
- package/dist/components/templates/page-header.d.mts.map +1 -1
- package/dist/components/templates/page-header.mjs +2 -4
- package/dist/components/templates/page-header.mjs.map +1 -1
- package/dist/components/templates/result.d.mts +2 -13
- package/dist/components/templates/result.d.mts.map +1 -1
- package/dist/components/templates/result.mjs +1 -2
- package/dist/components/templates/result.mjs.map +1 -1
- package/dist/core/accordion.d.mts +5 -22
- package/dist/core/accordion.d.mts.map +1 -1
- package/dist/core/accordion.mjs +3 -5
- package/dist/core/accordion.mjs.map +1 -1
- package/dist/core/badge.d.mts +3 -12
- package/dist/core/badge.d.mts.map +1 -1
- package/dist/core/badge.mjs +2 -3
- package/dist/core/badge.mjs.map +1 -1
- package/dist/core/button.d.mts +4 -14
- package/dist/core/button.d.mts.map +1 -1
- package/dist/core/button.mjs +1 -2
- package/dist/core/button.mjs.map +1 -1
- package/dist/core/calendar.d.mts +4 -21
- package/dist/core/calendar.d.mts.map +1 -1
- package/dist/core/calendar.mjs +3 -5
- package/dist/core/calendar.mjs.map +1 -1
- package/dist/core/checkbox.d.mts +2 -8
- package/dist/core/checkbox.d.mts.map +1 -1
- package/dist/core/checkbox.mjs +3 -5
- package/dist/core/checkbox.mjs.map +1 -1
- package/dist/core/dialog.d.mts +12 -48
- package/dist/core/dialog.d.mts.map +1 -1
- package/dist/core/dialog.mjs +3 -5
- package/dist/core/dialog.mjs.map +1 -1
- package/dist/core/drawer.d.mts +11 -46
- package/dist/core/drawer.d.mts.map +1 -1
- package/dist/core/drawer.mjs +3 -5
- package/dist/core/drawer.mjs.map +1 -1
- package/dist/core/field.d.mts +15 -54
- package/dist/core/field.d.mts.map +1 -1
- package/dist/core/field.mjs +3 -5
- package/dist/core/field.mjs.map +1 -1
- package/dist/core/input.d.mts +2 -9
- package/dist/core/input.d.mts.map +1 -1
- package/dist/core/input.mjs +2 -3
- package/dist/core/input.mjs.map +1 -1
- package/dist/core/label.d.mts +1 -7
- package/dist/core/label.d.mts.map +1 -1
- package/dist/core/label.mjs +2 -4
- package/dist/core/label.mjs.map +1 -1
- package/dist/core/popover.d.mts +9 -33
- package/dist/core/popover.d.mts.map +1 -1
- package/dist/core/popover.mjs +3 -5
- package/dist/core/popover.mjs.map +1 -1
- package/dist/core/progress.d.mts +2 -11
- package/dist/core/progress.d.mts.map +1 -1
- package/dist/core/progress.mjs +3 -5
- package/dist/core/progress.mjs.map +1 -1
- package/dist/core/radio-group.d.mts +4 -15
- package/dist/core/radio-group.d.mts.map +1 -1
- package/dist/core/radio-group.mjs +3 -5
- package/dist/core/radio-group.mjs.map +1 -1
- package/dist/core/resizable.d.mts +5 -17
- package/dist/core/resizable.d.mts.map +1 -1
- package/dist/core/resizable.mjs +3 -5
- package/dist/core/resizable.mjs.map +1 -1
- package/dist/core/select.d.mts +13 -50
- package/dist/core/select.d.mts.map +1 -1
- package/dist/core/select.mjs +3 -5
- package/dist/core/select.mjs.map +1 -1
- package/dist/core/separator.d.mts +2 -10
- package/dist/core/separator.d.mts.map +1 -1
- package/dist/core/separator.mjs +2 -4
- package/dist/core/separator.mjs.map +1 -1
- package/dist/core/skeleton.d.mts +2 -8
- package/dist/core/skeleton.d.mts.map +1 -1
- package/dist/core/skeleton.mjs +2 -3
- package/dist/core/skeleton.mjs.map +1 -1
- package/dist/core/switch.d.mts +3 -12
- package/dist/core/switch.d.mts.map +1 -1
- package/dist/core/switch.mjs +3 -5
- package/dist/core/switch.mjs.map +1 -1
- package/dist/core/textarea.d.mts +2 -8
- package/dist/core/textarea.d.mts.map +1 -1
- package/dist/core/textarea.mjs +2 -3
- package/dist/core/textarea.mjs.map +1 -1
- package/dist/core.mjs +1 -2
- package/dist/index.d.mts +31 -33
- package/dist/index.mjs +2 -3
- package/dist/providers/config/config.d.mts +2 -14
- package/dist/providers/config/config.d.mts.map +1 -1
- package/dist/providers/config/config.mjs +5 -6
- package/dist/providers/config/config.mjs.map +1 -1
- package/dist/providers/config/context.d.mts +0 -2
- package/dist/providers/config/context.d.mts.map +1 -1
- package/dist/providers/config/context.mjs +2 -4
- package/dist/providers/config/context.mjs.map +1 -1
- package/dist/providers/config/registry.d.mts +2 -7
- package/dist/providers/config/registry.d.mts.map +1 -1
- package/dist/providers/config/registry.mjs +2 -4
- package/dist/providers/config/registry.mjs.map +1 -1
- package/dist/providers/config/types.d.mts.map +1 -1
- package/dist/providers.d.mts +1 -2
- package/dist/providers.mjs +1 -2
- package/dist/style.css +1051 -1755
- package/dist/utils.d.mts +0 -1
- package/dist/utils.d.mts.map +1 -1
- package/dist/utils.mjs +1 -2
- package/dist/utils.mjs.map +1 -1
- package/package.json +29 -28
- package/dist/components/templates/grid/index.d.mts +0 -2
- package/dist/components/templates/index.d.mts +0 -13
- package/dist/providers/config/index.d.mts +0 -4
- package/dist/style.css.map +0 -1
- package/dist/style.mjs +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"marquees.mjs","names":[],"sources":["../../../../src/components/molecules/marquees/marquees.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\n\nimport { useResponsiveSize, useThrottle } from '@jbpark/use-hooks';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item, { type ItemProps } from './item';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n speed?: number;\n autoFill?: boolean | number;\n pauseOnHover?: boolean;\n items?: ItemProps[];\n}\n\nconst Marquees = ({\n className,\n items,\n speed,\n pauseOnHover = true,\n autoFill = true,\n ...props\n}: Props) => {\n const [width, setWidth] = useState<string | number>(\n '100vw',\n //\n );\n const [padding, setPadding] = useState(0);\n const [pause, setPause] = useState(false);\n\n const throttledWidth = useThrottle(width, 200);\n\n const { size, ref: responsiveRef } = useResponsiveSize<HTMLDivElement>();\n const containerRef = useRef<HTMLDivElement | null>(null);\n const setContainerRef = (node: HTMLDivElement | null) => {\n containerRef.current = node;\n responsiveRef(node);\n };\n const hoverEvents = pauseOnHover\n ? {\n onMouseEnter: () => {\n setPause(true);\n },\n onMouseLeave: () => {\n setPause(false);\n },\n }\n : {};\n\n useEffect(() => {\n if (!size.width || !containerRef.current) {\n return;\n }\n\n const computedStyle = getComputedStyle(containerRef.current);\n const paddingLeft = parseFloat(computedStyle.paddingLeft) || 0;\n const paddingRight = parseFloat(computedStyle.paddingRight) || 0;\n\n setPadding(paddingLeft + paddingRight);\n\n setWidth(size.width);\n }, [size]);\n\n return (\n <div\n ref={setContainerRef}\n className={cn(\n className,\n //\n )}\n {...hoverEvents}\n {...props}\n >\n <div\n className={cn(\n 'flex flex-col gap-y-5',\n 'overflow-hidden',\n 'whitespace-nowrap',\n 'bg-inherit',\n //\n )}\n style={{\n width:\n typeof throttledWidth === 'number'\n ? throttledWidth - padding\n : throttledWidth,\n }}\n >\n {items?.map(({ children, key: itemKey, ...item }: ItemProps, key) => (\n <Item\n key={itemKey || key}\n width={throttledWidth}\n pause={pause}\n speed={speed}\n autoFill={autoFill}\n {...item}\n >\n {children}\n </Item>\n ))}\n </div>\n </div>\n );\n};\n\nexport default Marquees;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"marquees.mjs","names":[],"sources":["../../../../src/components/molecules/marquees/marquees.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\n\nimport { useResponsiveSize, useThrottle } from '@jbpark/use-hooks';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item, { type ItemProps } from './item';\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n speed?: number;\n autoFill?: boolean | number;\n pauseOnHover?: boolean;\n items?: ItemProps[];\n}\n\nconst Marquees = ({\n className,\n items,\n speed,\n pauseOnHover = true,\n autoFill = true,\n ...props\n}: Props) => {\n const [width, setWidth] = useState<string | number>(\n '100vw',\n //\n );\n const [padding, setPadding] = useState(0);\n const [pause, setPause] = useState(false);\n\n const throttledWidth = useThrottle(width, 200);\n\n const { size, ref: responsiveRef } = useResponsiveSize<HTMLDivElement>();\n const containerRef = useRef<HTMLDivElement | null>(null);\n const setContainerRef = (node: HTMLDivElement | null) => {\n containerRef.current = node;\n responsiveRef(node);\n };\n const hoverEvents = pauseOnHover\n ? {\n onMouseEnter: () => {\n setPause(true);\n },\n onMouseLeave: () => {\n setPause(false);\n },\n }\n : {};\n\n useEffect(() => {\n if (!size.width || !containerRef.current) {\n return;\n }\n\n const computedStyle = getComputedStyle(containerRef.current);\n const paddingLeft = parseFloat(computedStyle.paddingLeft) || 0;\n const paddingRight = parseFloat(computedStyle.paddingRight) || 0;\n\n setPadding(paddingLeft + paddingRight);\n\n setWidth(size.width);\n }, [size]);\n\n return (\n <div\n ref={setContainerRef}\n className={cn(\n className,\n //\n )}\n {...hoverEvents}\n {...props}\n >\n <div\n className={cn(\n 'flex flex-col gap-y-5',\n 'overflow-hidden',\n 'whitespace-nowrap',\n 'bg-inherit',\n //\n )}\n style={{\n width:\n typeof throttledWidth === 'number'\n ? throttledWidth - padding\n : throttledWidth,\n }}\n >\n {items?.map(({ children, key: itemKey, ...item }: ItemProps, key) => (\n <Item\n key={itemKey || key}\n width={throttledWidth}\n pause={pause}\n speed={speed}\n autoFill={autoFill}\n {...item}\n >\n {children}\n </Item>\n ))}\n </div>\n </div>\n );\n};\n\nexport default Marquees;\n"],"mappings":";;;;;;;AAiBA,MAAM,YAAY,EAChB,WACA,OACA,OACA,eAAe,MACf,WAAW,MACX,GAAG,YACQ;CACX,MAAM,CAAC,OAAO,YAAY,SACxB,OAEF;CACA,MAAM,CAAC,SAAS,cAAc,SAAS,CAAC;CACxC,MAAM,CAAC,OAAO,YAAY,SAAS,KAAK;CAExC,MAAM,iBAAiB,YAAY,OAAO,GAAG;CAE7C,MAAM,EAAE,MAAM,KAAK,kBAAkB,kBAAkC;CACvE,MAAM,eAAe,OAA8B,IAAI;CACvD,MAAM,mBAAmB,SAAgC;EACvD,aAAa,UAAU;EACvB,cAAc,IAAI;CACpB;CACA,MAAM,cAAc,eAChB;EACE,oBAAoB;GAClB,SAAS,IAAI;EACf;EACA,oBAAoB;GAClB,SAAS,KAAK;EAChB;CACF,IACA,CAAC;CAEL,gBAAgB;EACd,IAAI,CAAC,KAAK,SAAS,CAAC,aAAa,SAC/B;EAGF,MAAM,gBAAgB,iBAAiB,aAAa,OAAO;EAC3D,MAAM,cAAc,WAAW,cAAc,WAAW,KAAK;EAC7D,MAAM,eAAe,WAAW,cAAc,YAAY,KAAK;EAE/D,WAAW,cAAc,YAAY;EAErC,SAAS,KAAK,KAAK;CACrB,GAAG,CAAC,IAAI,CAAC;CAET,OACE,oBAAC,OAAD;EACE,KAAK;EACL,WAAW,GACT,SAEF;EACA,GAAI;EACJ,GAAI;EAEJ,UAAA,oBAAC,OAAD;GACE,WAAW,GACT,yBACA,mBACA,qBACA,YAEF;GACA,OAAO,EACL,OACE,OAAO,mBAAmB,WACtB,iBAAiB,UACjB,eACR;GAEC,UAAA,OAAO,KAAK,EAAE,UAAU,KAAK,SAAS,GAAG,QAAmB,QAC3D,oBAAC,MAAD;IAEE,OAAO;IACA;IACA;IACG;IACV,GAAI;IAEH;GACG,GARC,WAAW,GAQZ,CACP;EACE,CAAA;CACF,CAAA;AAET"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use client";
|
|
3
2
|
import { cn } from "../../../../utils.mjs";
|
|
4
3
|
import Label from "./label.mjs";
|
|
5
4
|
import { MENU_CLASSNAMES } from "../menu.mjs";
|
|
@@ -7,7 +6,6 @@ import { ChevronDown } from "lucide-react";
|
|
|
7
6
|
import { createElement, useRef, useState } from "react";
|
|
8
7
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
8
|
import { AnimatePresence, motion } from "motion/react";
|
|
10
|
-
|
|
11
9
|
//#region src/components/molecules/menu/item/item.tsx
|
|
12
10
|
const OFFSET = [8, 8];
|
|
13
11
|
const INLINE_OFFSET = 16;
|
|
@@ -150,7 +148,7 @@ const Item = ({ itemKey, keyPath, root = false, index, mode, label, children, se
|
|
|
150
148
|
}) })]
|
|
151
149
|
});
|
|
152
150
|
};
|
|
153
|
-
|
|
154
151
|
//#endregion
|
|
155
152
|
export { Item as default };
|
|
153
|
+
|
|
156
154
|
//# sourceMappingURL=item.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.mjs","names":[],"sources":["../../../../../src/components/molecules/menu/item/item.tsx"],"sourcesContent":["'use client';\n\nimport { useRef, useState } from 'react';\n\nimport { ChevronDown } from 'lucide-react';\nimport { AnimatePresence, motion } from 'motion/react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { MENU_CLASSNAMES, MenuItem, Props } from '../menu';\nimport Label from './label';\n\ninterface ItemProps extends Props, MenuItem {\n itemKey: React.Key;\n keyPath: React.Key[];\n root?: boolean;\n index: number;\n}\nconst OFFSET: [number, number] = [8, 8];\nconst INLINE_OFFSET = 16;\n\nconst STYLES = {\n hover: {\n classes: ['hover:underline', 'hover:underline-offset-8'],\n },\n open: {\n classes: ['underline', 'underline-offset-8'],\n },\n} as const;\n\nconst getItemClasses = (\n root: boolean,\n isHorizontal: boolean,\n isInline: boolean,\n hasChildren: boolean,\n customClasses?: string,\n) =>\n cn(\n 'px-4 py-2',\n 'cursor-pointer',\n 'whitespace-nowrap',\n root && isHorizontal ? 'inline-flex' : 'flex',\n ...(root\n ? [\n 'h-full',\n 'rounded-none border-transparent',\n hasChildren && 'hover:border-current',\n isHorizontal ? 'border-b-2' : 'border-r-2',\n isInline && 'border-none',\n ]\n : ['rounded-md', ...STYLES.hover.classes]),\n customClasses,\n );\n\nconst Item = ({\n itemKey,\n keyPath,\n root = false,\n index,\n mode,\n label,\n children,\n selectionMap,\n classNames,\n styles,\n offset = OFFSET,\n inlineOffset = INLINE_OFFSET,\n onClick,\n onSelect,\n ...props\n}: ItemProps) => {\n const [open, setOpen] = useState<boolean>(false);\n\n const itemRef = useRef<HTMLLIElement | null>(null);\n\n const isHorizontal = mode === 'horizontal';\n const isInline = mode === 'inline';\n\n const [left, top] = offset;\n\n const selected = selectionMap?.get(itemKey) ?? false;\n\n const item = {\n ...props,\n label,\n key: itemKey,\n children,\n };\n\n const itemClassNames = getItemClasses(\n root,\n isHorizontal,\n isInline,\n !!children?.length,\n root ? classNames?.rootItem : classNames?.item,\n );\n\n const handleSelect = (domEvent: React.SyntheticEvent) => {\n domEvent.stopPropagation();\n\n if (isInline) {\n setOpen(!open);\n }\n\n const params = {\n domEvent,\n key: itemKey,\n keyPath,\n item,\n };\n\n onClick?.(params);\n\n if (!selected) {\n onSelect?.(params);\n }\n };\n\n // Roving tabindex (WAI-ARIA menu pattern): only the first item in each\n // menu/submenu level is a Tab stop (below); arrow keys move real DOM\n // focus between sibling <li>s within that same level, which is what\n // ends up mattering for actual keyboard use even though — unlike a\n // fully state-tracked implementation — focus resets to the first item\n // if the user Tabs out and back in rather than resuming where they left\n // off.\n const handleKeyDown = (domEvent: React.KeyboardEvent) => {\n if (domEvent.key === 'Enter' || domEvent.key === ' ') {\n domEvent.preventDefault();\n handleSelect(domEvent);\n return;\n }\n\n if (domEvent.key === 'Escape') {\n if (children?.length && open) {\n domEvent.stopPropagation();\n setOpen(false);\n }\n return;\n }\n\n const isNext = isHorizontal\n ? domEvent.key === 'ArrowRight'\n : domEvent.key === 'ArrowDown';\n const isPrev = isHorizontal\n ? domEvent.key === 'ArrowLeft'\n : domEvent.key === 'ArrowUp';\n\n if (!isNext && !isPrev) {\n return;\n }\n\n domEvent.preventDefault();\n const sibling = isNext\n ? itemRef.current?.nextElementSibling\n : itemRef.current?.previousElementSibling;\n sibling?.querySelector<HTMLElement>('[role=\"menuitem\"]')?.focus();\n };\n\n const childrenContainerClassNames = cn(\n isInline ? 'relative overflow-hidden' : 'absolute min-w-[200px]',\n !isInline && root && isHorizontal\n ? 'left-0 top-full pt-2 pl-0'\n : !isInline\n ? 'left-full top-0 pl-2 pt-0'\n : 'pl-4',\n );\n\n const childrenContainerStyle = isInline\n ? {\n paddingLeft: inlineOffset,\n }\n : root && isHorizontal\n ? {\n paddingTop: top,\n }\n : {\n paddingLeft: left,\n };\n\n return (\n <li\n ref={itemRef}\n role=\"none\"\n className={cn(\n 'group',\n 'relative',\n root && isHorizontal ? 'inline-block' : 'block',\n )}\n onMouseEnter={() => {\n if (isInline) {\n return;\n }\n setOpen(true);\n }}\n onMouseLeave={() => {\n if (isInline) {\n return;\n }\n setOpen(false);\n }}\n onFocus={() => {\n if (isInline) {\n return;\n }\n setOpen(true);\n }}\n onBlur={e => {\n if (isInline) {\n return;\n }\n if (!itemRef.current?.contains(e.relatedTarget as Node)) {\n setOpen(false);\n }\n }}\n >\n <div\n role=\"menuitem\"\n tabIndex={index === 0 ? 0 : -1}\n aria-expanded={children?.length ? open : undefined}\n aria-haspopup={children?.length ? 'menu' : undefined}\n aria-current={selected ? true : undefined}\n className={cn(\n itemClassNames,\n ...(selected\n ? root\n ? ['border-current']\n : [...STYLES.open.classes, ...STYLES.hover.classes]\n : root && !!children?.length\n ? ['group-hover:border-current']\n : []),\n //\n )}\n style={root ? styles?.rootItem : styles?.item}\n onClick={handleSelect}\n onKeyDown={handleKeyDown}\n >\n <div\n className={cn(\n 'w-full',\n 'inline-flex items-center justify-between',\n //\n )}\n >\n <Label className={cn(classNames?.label)} style={styles?.label}>\n {label}\n </Label>\n {!root && !isInline && !!children?.length && (\n <ChevronDown className={cn('-rotate-90')} />\n )}\n {isInline && !!children?.length && (\n <ChevronDown\n className={cn(\n 'transition-all',\n open ? '-rotate-180' : 'rotate-0',\n )}\n />\n )}\n </div>\n </div>\n <AnimatePresence>\n {!!children?.length && open && (\n <motion.div\n className={cn(\n childrenContainerClassNames,\n //\n )}\n style={childrenContainerStyle}\n initial={isInline ? { height: 0, opacity: 0 } : { opacity: 0 }}\n animate={isInline ? { height: 'auto', opacity: 1 } : { opacity: 1 }}\n exit={isInline ? { height: 0, opacity: 0 } : { opacity: 0 }}\n transition={{ duration: 0.2 }}\n >\n <ul\n role=\"menu\"\n className={cn(\n MENU_CLASSNAMES,\n isInline && 'shadow-none',\n classNames?.subMenu,\n //\n )}\n style={styles?.subMenu}\n >\n {children.map((child, childIndex) => (\n <Item\n {...child}\n key={child.key}\n itemKey={child.key}\n keyPath={[...keyPath, child.key]}\n index={childIndex}\n selectionMap={selectionMap}\n mode={mode}\n classNames={classNames}\n styles={styles}\n offset={offset}\n inlineOffset={inlineOffset}\n onClick={onClick}\n onSelect={onSelect}\n />\n ))}\n </ul>\n </motion.div>\n )}\n </AnimatePresence>\n </li>\n );\n};\n\nexport default Item;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"item.mjs","names":[],"sources":["../../../../../src/components/molecules/menu/item/item.tsx"],"sourcesContent":["'use client';\n\nimport { useRef, useState } from 'react';\n\nimport { ChevronDown } from 'lucide-react';\nimport { AnimatePresence, motion } from 'motion/react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { MENU_CLASSNAMES, MenuItem, Props } from '../menu';\nimport Label from './label';\n\ninterface ItemProps extends Props, MenuItem {\n itemKey: React.Key;\n keyPath: React.Key[];\n root?: boolean;\n index: number;\n}\nconst OFFSET: [number, number] = [8, 8];\nconst INLINE_OFFSET = 16;\n\nconst STYLES = {\n hover: {\n classes: ['hover:underline', 'hover:underline-offset-8'],\n },\n open: {\n classes: ['underline', 'underline-offset-8'],\n },\n} as const;\n\nconst getItemClasses = (\n root: boolean,\n isHorizontal: boolean,\n isInline: boolean,\n hasChildren: boolean,\n customClasses?: string,\n) =>\n cn(\n 'px-4 py-2',\n 'cursor-pointer',\n 'whitespace-nowrap',\n root && isHorizontal ? 'inline-flex' : 'flex',\n ...(root\n ? [\n 'h-full',\n 'rounded-none border-transparent',\n hasChildren && 'hover:border-current',\n isHorizontal ? 'border-b-2' : 'border-r-2',\n isInline && 'border-none',\n ]\n : ['rounded-md', ...STYLES.hover.classes]),\n customClasses,\n );\n\nconst Item = ({\n itemKey,\n keyPath,\n root = false,\n index,\n mode,\n label,\n children,\n selectionMap,\n classNames,\n styles,\n offset = OFFSET,\n inlineOffset = INLINE_OFFSET,\n onClick,\n onSelect,\n ...props\n}: ItemProps) => {\n const [open, setOpen] = useState<boolean>(false);\n\n const itemRef = useRef<HTMLLIElement | null>(null);\n\n const isHorizontal = mode === 'horizontal';\n const isInline = mode === 'inline';\n\n const [left, top] = offset;\n\n const selected = selectionMap?.get(itemKey) ?? false;\n\n const item = {\n ...props,\n label,\n key: itemKey,\n children,\n };\n\n const itemClassNames = getItemClasses(\n root,\n isHorizontal,\n isInline,\n !!children?.length,\n root ? classNames?.rootItem : classNames?.item,\n );\n\n const handleSelect = (domEvent: React.SyntheticEvent) => {\n domEvent.stopPropagation();\n\n if (isInline) {\n setOpen(!open);\n }\n\n // Next.js's types pull in React's `react/experimental` augmentation\n // (adding `useOptimistic`'s internal key symbol to `React.Key`), which\n // widens `itemKey`/`item.key` here beyond what `ClickEventHandler`\n // expects when this file is type-checked as part of a Next.js app —\n // real menu item keys are always string/number, never that symbol.\n const params = {\n domEvent,\n key: itemKey as Exclude<React.Key, symbol>,\n keyPath,\n item: item as unknown as MenuItem,\n };\n\n onClick?.(params);\n\n if (!selected) {\n onSelect?.(params);\n }\n };\n\n // Roving tabindex (WAI-ARIA menu pattern): only the first item in each\n // menu/submenu level is a Tab stop (below); arrow keys move real DOM\n // focus between sibling <li>s within that same level, which is what\n // ends up mattering for actual keyboard use even though — unlike a\n // fully state-tracked implementation — focus resets to the first item\n // if the user Tabs out and back in rather than resuming where they left\n // off.\n //\n // Deliberately not `useKeyPress` (unlike dropdown.tsx's trigger and\n // radio.tsx/checkbox.tsx's icon mode, #229's action item 5): that hook\n // is a static combo -> handler binding, one listener per combo. This\n // handler is a single stateful branch — Enter/Space select, Escape\n // conditionally closes a submenu and stops the event from also closing\n // an ancestor Dropdown, and the arrow-key branch reads `itemRef` at\n // fire time to focus a *sibling* `<li>`. Splitting that into 3-4\n // separate useKeyPress calls (each its own listener) per menu item\n // wouldn't fix a bug — the existing logic is already correct — it would\n // just multiply listeners across every item in a menu for no benefit.\n const handleKeyDown = (domEvent: React.KeyboardEvent) => {\n if (domEvent.key === 'Enter' || domEvent.key === ' ') {\n domEvent.preventDefault();\n handleSelect(domEvent);\n return;\n }\n\n if (domEvent.key === 'Escape') {\n if (children?.length && open) {\n domEvent.stopPropagation();\n setOpen(false);\n }\n return;\n }\n\n const isNext = isHorizontal\n ? domEvent.key === 'ArrowRight'\n : domEvent.key === 'ArrowDown';\n const isPrev = isHorizontal\n ? domEvent.key === 'ArrowLeft'\n : domEvent.key === 'ArrowUp';\n\n if (!isNext && !isPrev) {\n return;\n }\n\n domEvent.preventDefault();\n const sibling = isNext\n ? itemRef.current?.nextElementSibling\n : itemRef.current?.previousElementSibling;\n sibling?.querySelector<HTMLElement>('[role=\"menuitem\"]')?.focus();\n };\n\n const childrenContainerClassNames = cn(\n isInline ? 'relative overflow-hidden' : 'absolute min-w-[200px]',\n !isInline && root && isHorizontal\n ? 'left-0 top-full pt-2 pl-0'\n : !isInline\n ? 'left-full top-0 pl-2 pt-0'\n : 'pl-4',\n );\n\n const childrenContainerStyle = isInline\n ? {\n paddingLeft: inlineOffset,\n }\n : root && isHorizontal\n ? {\n paddingTop: top,\n }\n : {\n paddingLeft: left,\n };\n\n return (\n <li\n ref={itemRef}\n role=\"none\"\n className={cn(\n 'group',\n 'relative',\n root && isHorizontal ? 'inline-block' : 'block',\n )}\n onMouseEnter={() => {\n if (isInline) {\n return;\n }\n setOpen(true);\n }}\n onMouseLeave={() => {\n if (isInline) {\n return;\n }\n setOpen(false);\n }}\n onFocus={() => {\n if (isInline) {\n return;\n }\n setOpen(true);\n }}\n onBlur={e => {\n if (isInline) {\n return;\n }\n if (!itemRef.current?.contains(e.relatedTarget as Node)) {\n setOpen(false);\n }\n }}\n >\n <div\n role=\"menuitem\"\n tabIndex={index === 0 ? 0 : -1}\n aria-expanded={children?.length ? open : undefined}\n aria-haspopup={children?.length ? 'menu' : undefined}\n aria-current={selected ? true : undefined}\n className={cn(\n itemClassNames,\n ...(selected\n ? root\n ? ['border-current']\n : [...STYLES.open.classes, ...STYLES.hover.classes]\n : root && !!children?.length\n ? ['group-hover:border-current']\n : []),\n //\n )}\n style={root ? styles?.rootItem : styles?.item}\n onClick={handleSelect}\n onKeyDown={handleKeyDown}\n >\n <div\n className={cn(\n 'w-full',\n 'inline-flex items-center justify-between',\n //\n )}\n >\n <Label className={cn(classNames?.label)} style={styles?.label}>\n {label}\n </Label>\n {!root && !isInline && !!children?.length && (\n <ChevronDown className={cn('-rotate-90')} />\n )}\n {isInline && !!children?.length && (\n <ChevronDown\n className={cn(\n 'transition-all',\n open ? '-rotate-180' : 'rotate-0',\n )}\n />\n )}\n </div>\n </div>\n <AnimatePresence>\n {!!children?.length && open && (\n <motion.div\n className={cn(\n childrenContainerClassNames,\n //\n )}\n style={childrenContainerStyle}\n initial={isInline ? { height: 0, opacity: 0 } : { opacity: 0 }}\n animate={isInline ? { height: 'auto', opacity: 1 } : { opacity: 1 }}\n exit={isInline ? { height: 0, opacity: 0 } : { opacity: 0 }}\n transition={{ duration: 0.2 }}\n >\n <ul\n role=\"menu\"\n className={cn(\n MENU_CLASSNAMES,\n isInline && 'shadow-none',\n classNames?.subMenu,\n //\n )}\n style={styles?.subMenu}\n >\n {children.map((child, childIndex) => (\n <Item\n {...child}\n key={child.key}\n itemKey={child.key}\n keyPath={[...keyPath, child.key]}\n index={childIndex}\n selectionMap={selectionMap}\n mode={mode}\n classNames={classNames}\n styles={styles}\n offset={offset}\n inlineOffset={inlineOffset}\n onClick={onClick}\n onSelect={onSelect}\n />\n ))}\n </ul>\n </motion.div>\n )}\n </AnimatePresence>\n </li>\n );\n};\n\nexport default Item;\n"],"mappings":"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"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { cn } from "../../../../utils.mjs";
|
|
2
2
|
import Typography from "../../../../Typography.mjs";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
|
-
|
|
5
4
|
//#region src/components/molecules/menu/item/label.tsx
|
|
6
5
|
const Label = ({ children, className, ...props }) => {
|
|
7
6
|
if (typeof children === "string") return /* @__PURE__ */ jsx(Typography.Text, {
|
|
@@ -11,7 +10,7 @@ const Label = ({ children, className, ...props }) => {
|
|
|
11
10
|
});
|
|
12
11
|
return children;
|
|
13
12
|
};
|
|
14
|
-
|
|
15
13
|
//#endregion
|
|
16
14
|
export { Label as default };
|
|
15
|
+
|
|
17
16
|
//# sourceMappingURL=label.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"label.mjs","names":[],"sources":["../../../../../src/components/molecules/menu/item/label.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Typography from '../../../atoms/typography';\n\ninterface Props extends React.ComponentPropsWithoutRef<\n typeof Typography.Text\n> {}\n\nconst Label = ({ children, className, ...props }: Props) => {\n if (typeof children === 'string') {\n return (\n <Typography.Text className={cn(className)} {...props}>\n {children}\n </Typography.Text>\n );\n }\n\n return children;\n};\n\nexport default Label;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"label.mjs","names":[],"sources":["../../../../../src/components/molecules/menu/item/label.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport Typography from '../../../atoms/typography';\n\ninterface Props extends React.ComponentPropsWithoutRef<\n typeof Typography.Text\n> {}\n\nconst Label = ({ children, className, ...props }: Props) => {\n if (typeof children === 'string') {\n return (\n <Typography.Text className={cn(className)} {...props}>\n {children}\n </Typography.Text>\n );\n }\n\n return children;\n};\n\nexport default Label;\n"],"mappings":";;;;AAQA,MAAM,SAAS,EAAE,UAAU,WAAW,GAAG,YAAmB;CAC1D,IAAI,OAAO,aAAa,UACtB,OACE,oBAAC,WAAW,MAAZ;EAAiB,WAAW,GAAG,SAAS;EAAG,GAAI;EAC5C;CACc,CAAA;CAIrB,OAAO;AACT"}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
-
|
|
3
1
|
//#region src/components/molecules/menu/menu.d.ts
|
|
4
2
|
interface MenuItem {
|
|
5
3
|
label: React.ReactNode;
|
|
@@ -43,20 +41,7 @@ declare const MENU_CLASSNAMES: string[];
|
|
|
43
41
|
type SelectionMap = ReadonlyMap<React.Key, boolean>;
|
|
44
42
|
declare const buildSelectionMap: (items: MenuItem[], selectedKeysSet: ReadonlySet<React.Key>) => SelectionMap;
|
|
45
43
|
declare const findKey: (menu: MenuItem, targetKeys: ReadonlySet<React.Key>) => boolean;
|
|
46
|
-
declare const Menu: ({
|
|
47
|
-
items,
|
|
48
|
-
mode,
|
|
49
|
-
defaultSelectedKeys,
|
|
50
|
-
selectedKeys: _selectedKeys,
|
|
51
|
-
className,
|
|
52
|
-
classNames,
|
|
53
|
-
styles,
|
|
54
|
-
offset,
|
|
55
|
-
inlineOffset,
|
|
56
|
-
onClick,
|
|
57
|
-
onSelect: _onSelect,
|
|
58
|
-
...props
|
|
59
|
-
}: MenuProps) => react_jsx_runtime0.JSX.Element;
|
|
44
|
+
declare const Menu: ({ items, mode, defaultSelectedKeys, selectedKeys: _selectedKeys, className, classNames, styles, offset, inlineOffset, onClick, onSelect: _onSelect, ...props }: MenuProps) => import("react").JSX.Element;
|
|
60
45
|
//#endregion
|
|
61
|
-
export { ClickEventHandler, MENU_CLASSNAMES,
|
|
46
|
+
export { ClickEventHandler, MENU_CLASSNAMES, MenuItem, MenuProps, Props, SelectionMap, buildSelectionMap, Menu as default, findKey };
|
|
62
47
|
//# sourceMappingURL=menu.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.d.mts","names":[],"sources":["../../../../src/components/molecules/menu/menu.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"menu.d.mts","names":[],"sources":["../../../../src/components/molecules/menu/menu.tsx"],"mappings":";UAUiB;EACf,OAAO,MAAM;EACb,KAAK,MAAM;EACX;EACA;EACA,WAAW;;UAGI;EACf;EACA,eAAe,MAAM;EACrB,sBAAsB,MAAM;EAC5B,eAAe;EACf;EACA;EACA;IACE;IACA;IACA;IACA;;EAEF;IACE,WAAW,MAAM;IACjB,UAAU,MAAM;IAChB,OAAO,MAAM;IACb,QAAQ,MAAM;;EAEhB,UAAU;EACV,WAAW;;UAGI,kBAEb,OACA,KAAK,MAAM;EACb,QAAQ;;KAGE,qBAAqB;EAC/B,UAAU,MAAM;EAChB,KAAK,MAAM;EACX,SAAS,MAAM;EACf,MAAM;;cAGK;KASD,eAAe,YAAY,MAAM;cAEhC,oBACX,OAAO,YACP,iBAAiB,YAAY,MAAM,SAClC;cAeU,UACX,MAAM,UACN,YAAY,YAAY,MAAM;cAiB1B,SAAQ,OAAA,MAAA,qBAAA,cAAA,eAAA,WAAA,YAAA,QAAA,QAAA,cAAA,SAAA,UAAA,cAAA,SAaX,8BAAS,IAAA"}
|
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use client";
|
|
3
2
|
import { cn } from "../../../utils.mjs";
|
|
4
3
|
import Item from "./item/item.mjs";
|
|
5
4
|
import { createElement, useMemo } from "react";
|
|
6
5
|
import { jsx } from "react/jsx-runtime";
|
|
7
6
|
import { useControllableState } from "@jbpark/use-hooks";
|
|
8
|
-
|
|
9
7
|
//#region src/components/molecules/menu/menu.tsx
|
|
10
8
|
const MENU_CLASSNAMES = [
|
|
11
9
|
"p-0",
|
|
@@ -66,7 +64,7 @@ const Menu = ({ items, mode = "vertical", defaultSelectedKeys = [], selectedKeys
|
|
|
66
64
|
}))
|
|
67
65
|
});
|
|
68
66
|
};
|
|
69
|
-
|
|
70
67
|
//#endregion
|
|
71
68
|
export { MENU_CLASSNAMES, buildSelectionMap, Menu as default, findKey };
|
|
69
|
+
|
|
72
70
|
//# sourceMappingURL=menu.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.mjs","names":[],"sources":["../../../../src/components/molecules/menu/menu.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { useControllableState } from '@jbpark/use-hooks';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item from './item';\n\nexport interface MenuItem {\n label: React.ReactNode;\n key: React.Key;\n type?: string;\n path?: string;\n children?: MenuItem[];\n}\n\nexport interface Props {\n mode?: 'horizontal' | 'vertical' | 'inline';\n selectedKeys?: React.Key[];\n defaultSelectedKeys?: React.Key[];\n selectionMap?: SelectionMap;\n offset?: [number, number];\n inlineOffset?: number;\n classNames?: {\n rootItem?: string;\n subMenu?: string;\n item?: string;\n label?: string;\n };\n styles?: {\n rootItem?: React.CSSProperties;\n subMenu?: React.CSSProperties;\n item?: React.CSSProperties;\n label?: React.CSSProperties;\n };\n onClick?: ClickEventHandler;\n onSelect?: ClickEventHandler;\n}\n\nexport interface MenuProps\n extends\n Props,\n Omit<React.ComponentPropsWithoutRef<'ul'>, 'onClick' | 'onSelect'> {\n items?: MenuItem[];\n}\n\nexport type ClickEventHandler = (params: {\n domEvent: React.SyntheticEvent;\n key: React.Key;\n keyPath: React.Key[];\n item: MenuItem;\n}) => void;\n\nexport const MENU_CLASSNAMES = [\n 'p-0',\n 'bg-popover',\n 'text-popover-foreground',\n 'shadow-md',\n 'rounded-md',\n //\n];\n\nexport type SelectionMap = ReadonlyMap<React.Key, boolean>;\n\nexport const buildSelectionMap = (\n items: MenuItem[],\n selectedKeysSet: ReadonlySet<React.Key>,\n): SelectionMap => {\n const map = new Map<React.Key, boolean>();\n\n const dfs = (node: MenuItem): boolean => {\n const self = selectedKeysSet.has(node.key);\n const hasSelectedChild = node.children?.some(child => dfs(child)) ?? false;\n const isSelected = self || hasSelectedChild;\n map.set(node.key, isSelected);\n return isSelected;\n };\n\n items.forEach(dfs);\n return map;\n};\n\nexport const findKey = (\n menu: MenuItem,\n targetKeys: ReadonlySet<React.Key>,\n): boolean => {\n if (targetKeys.has(menu.key)) {\n return true;\n }\n\n if (menu.children && Array.isArray(menu.children)) {\n for (const child of menu.children) {\n if (findKey(child, targetKeys)) {\n return true;\n }\n }\n }\n\n return false;\n};\n\nconst Menu = ({\n items,\n mode = 'vertical',\n defaultSelectedKeys = [],\n selectedKeys: _selectedKeys,\n className,\n classNames,\n styles,\n offset,\n inlineOffset,\n onClick,\n onSelect: _onSelect,\n ...props\n}: MenuProps) => {\n const [selectedKeys, setSelectedKeys] = useControllableState<React.Key[]>({\n value: _selectedKeys,\n defaultValue: defaultSelectedKeys ?? [],\n });\n\n const selectedKeysSet = useMemo(\n () => new Set<React.Key>(selectedKeys ?? []),\n [selectedKeys],\n );\n\n const selectionMap = useMemo(\n () => buildSelectionMap(items ?? [], selectedKeysSet),\n [items, selectedKeysSet],\n );\n\n const onSelect = (params: {\n domEvent: React.SyntheticEvent;\n key: React.Key;\n keyPath: React.Key[];\n item: MenuItem;\n }) => {\n setSelectedKeys([params.key]);\n _onSelect?.(params);\n };\n\n return (\n <ul\n role=\"menu\"\n className={cn(\n MENU_CLASSNAMES,\n mode === 'horizontal' ? 'flex' : 'inline-block',\n className,\n )}\n {...props}\n >\n {items?.map((item, index) => (\n <Item\n root\n {...item}\n key={item.key}\n itemKey={item.key}\n keyPath={[item.key]}\n index={index}\n selectionMap={selectionMap}\n mode={mode}\n classNames={classNames}\n styles={styles}\n offset={offset}\n inlineOffset={inlineOffset}\n onClick={onClick}\n onSelect={onSelect}\n />\n ))}\n </ul>\n );\n};\n\nexport default Menu;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"menu.mjs","names":[],"sources":["../../../../src/components/molecules/menu/menu.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { useControllableState } from '@jbpark/use-hooks';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item from './item';\n\nexport interface MenuItem {\n label: React.ReactNode;\n key: React.Key;\n type?: string;\n path?: string;\n children?: MenuItem[];\n}\n\nexport interface Props {\n mode?: 'horizontal' | 'vertical' | 'inline';\n selectedKeys?: React.Key[];\n defaultSelectedKeys?: React.Key[];\n selectionMap?: SelectionMap;\n offset?: [number, number];\n inlineOffset?: number;\n classNames?: {\n rootItem?: string;\n subMenu?: string;\n item?: string;\n label?: string;\n };\n styles?: {\n rootItem?: React.CSSProperties;\n subMenu?: React.CSSProperties;\n item?: React.CSSProperties;\n label?: React.CSSProperties;\n };\n onClick?: ClickEventHandler;\n onSelect?: ClickEventHandler;\n}\n\nexport interface MenuProps\n extends\n Props,\n Omit<React.ComponentPropsWithoutRef<'ul'>, 'onClick' | 'onSelect'> {\n items?: MenuItem[];\n}\n\nexport type ClickEventHandler = (params: {\n domEvent: React.SyntheticEvent;\n key: React.Key;\n keyPath: React.Key[];\n item: MenuItem;\n}) => void;\n\nexport const MENU_CLASSNAMES = [\n 'p-0',\n 'bg-popover',\n 'text-popover-foreground',\n 'shadow-md',\n 'rounded-md',\n //\n];\n\nexport type SelectionMap = ReadonlyMap<React.Key, boolean>;\n\nexport const buildSelectionMap = (\n items: MenuItem[],\n selectedKeysSet: ReadonlySet<React.Key>,\n): SelectionMap => {\n const map = new Map<React.Key, boolean>();\n\n const dfs = (node: MenuItem): boolean => {\n const self = selectedKeysSet.has(node.key);\n const hasSelectedChild = node.children?.some(child => dfs(child)) ?? false;\n const isSelected = self || hasSelectedChild;\n map.set(node.key, isSelected);\n return isSelected;\n };\n\n items.forEach(dfs);\n return map;\n};\n\nexport const findKey = (\n menu: MenuItem,\n targetKeys: ReadonlySet<React.Key>,\n): boolean => {\n if (targetKeys.has(menu.key)) {\n return true;\n }\n\n if (menu.children && Array.isArray(menu.children)) {\n for (const child of menu.children) {\n if (findKey(child, targetKeys)) {\n return true;\n }\n }\n }\n\n return false;\n};\n\nconst Menu = ({\n items,\n mode = 'vertical',\n defaultSelectedKeys = [],\n selectedKeys: _selectedKeys,\n className,\n classNames,\n styles,\n offset,\n inlineOffset,\n onClick,\n onSelect: _onSelect,\n ...props\n}: MenuProps) => {\n const [selectedKeys, setSelectedKeys] = useControllableState<React.Key[]>({\n value: _selectedKeys,\n defaultValue: defaultSelectedKeys ?? [],\n });\n\n const selectedKeysSet = useMemo(\n () => new Set<React.Key>(selectedKeys ?? []),\n [selectedKeys],\n );\n\n const selectionMap = useMemo(\n () => buildSelectionMap(items ?? [], selectedKeysSet),\n [items, selectedKeysSet],\n );\n\n const onSelect = (params: {\n domEvent: React.SyntheticEvent;\n key: React.Key;\n keyPath: React.Key[];\n item: MenuItem;\n }) => {\n setSelectedKeys([params.key]);\n _onSelect?.(params);\n };\n\n return (\n <ul\n role=\"menu\"\n className={cn(\n MENU_CLASSNAMES,\n mode === 'horizontal' ? 'flex' : 'inline-block',\n className,\n )}\n {...props}\n >\n {items?.map((item, index) => (\n <Item\n root\n {...item}\n key={item.key}\n itemKey={item.key}\n keyPath={[item.key]}\n index={index}\n selectionMap={selectionMap}\n mode={mode}\n classNames={classNames}\n styles={styles}\n offset={offset}\n inlineOffset={inlineOffset}\n onClick={onClick}\n onSelect={onSelect}\n />\n ))}\n </ul>\n );\n};\n\nexport default Menu;\n"],"mappings":";;;;;;;AAuDA,MAAa,kBAAkB;CAC7B;CACA;CACA;CACA;CACA;AAEF;AAIA,MAAa,qBACX,OACA,oBACiB;CACjB,MAAM,sBAAM,IAAI,IAAwB;CAExC,MAAM,OAAO,SAA4B;EACvC,MAAM,OAAO,gBAAgB,IAAI,KAAK,GAAG;EACzC,MAAM,mBAAmB,KAAK,UAAU,MAAK,UAAS,IAAI,KAAK,CAAC,KAAK;EACrE,MAAM,aAAa,QAAQ;EAC3B,IAAI,IAAI,KAAK,KAAK,UAAU;EAC5B,OAAO;CACT;CAEA,MAAM,QAAQ,GAAG;CACjB,OAAO;AACT;AAEA,MAAa,WACX,MACA,eACY;CACZ,IAAI,WAAW,IAAI,KAAK,GAAG,GACzB,OAAO;CAGT,IAAI,KAAK,YAAY,MAAM,QAAQ,KAAK,QAAQ,GACzC;OAAA,MAAM,SAAS,KAAK,UACvB,IAAI,QAAQ,OAAO,UAAU,GAC3B,OAAO;CAAA;CAKb,OAAO;AACT;AAEA,MAAM,QAAQ,EACZ,OACA,OAAO,YACP,sBAAsB,CAAC,GACvB,cAAc,eACd,WACA,YACA,QACA,QACA,cACA,SACA,UAAU,WACV,GAAG,YACY;CACf,MAAM,CAAC,cAAc,mBAAmB,qBAAkC;EACxE,OAAO;EACP,cAAc,uBAAuB,CAAC;CACxC,CAAC;CAED,MAAM,kBAAkB,cAChB,IAAI,IAAe,gBAAgB,CAAC,CAAC,GAC3C,CAAC,YAAY,CACf;CAEA,MAAM,eAAe,cACb,kBAAkB,SAAS,CAAC,GAAG,eAAe,GACpD,CAAC,OAAO,eAAe,CACzB;CAEA,MAAM,YAAY,WAKZ;EACJ,gBAAgB,CAAC,OAAO,GAAG,CAAC;EAC5B,YAAY,MAAM;CACpB;CAEA,OACE,oBAAC,MAAD;EACE,MAAK;EACL,WAAW,GACT,iBACA,SAAS,eAAe,SAAS,gBACjC,SACF;EACA,GAAI;EAEH,UAAA,OAAO,KAAK,MAAM,UACjB,8BAAC,MAAD;GACE,MAAA;GACA,GAAI;GACJ,KAAK,KAAK;GACV,SAAS,KAAK;GACd,SAAS,CAAC,KAAK,GAAG;GACX;GACO;GACR;GACM;GACJ;GACA;GACM;GACL;GACC;EACX,CAAA,CACF;CACC,CAAA;AAER"}
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
1
|
import { MotionProps } from "motion/react";
|
|
3
|
-
|
|
4
2
|
//#region src/components/molecules/reveals/item.d.ts
|
|
5
3
|
declare const effectVariants: {
|
|
6
4
|
fadeIn: {
|
|
@@ -43,18 +41,7 @@ interface ItemProps {
|
|
|
43
41
|
variants?: MotionProps['variants'];
|
|
44
42
|
transition?: MotionProps['transition'];
|
|
45
43
|
}
|
|
46
|
-
declare const Item: ({
|
|
47
|
-
effect,
|
|
48
|
-
children,
|
|
49
|
-
once,
|
|
50
|
-
viewport,
|
|
51
|
-
variants,
|
|
52
|
-
duration,
|
|
53
|
-
delay,
|
|
54
|
-
transition,
|
|
55
|
-
className,
|
|
56
|
-
...props
|
|
57
|
-
}: ItemProps) => react_jsx_runtime0.JSX.Element;
|
|
44
|
+
declare const Item: ({ effect, children, once, viewport, variants, duration, delay, transition, className, ...props }: ItemProps) => import("react").JSX.Element;
|
|
58
45
|
//#endregion
|
|
59
|
-
export {
|
|
46
|
+
export { ItemProps, Item as default };
|
|
60
47
|
//# sourceMappingURL=item.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.d.mts","names":[],"sources":["../../../../src/components/molecules/reveals/item.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"item.d.mts","names":[],"sources":["../../../../src/components/molecules/reveals/item.tsx"],"mappings":";;cAMM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAeW;EACf,sBAAsB;EACtB;EACA;EACA;EACA;EACA,WAAW,MAAM;EACjB,WAAW;EACX,WAAW;EACX,aAAa;;cAGT,SAAQ,QAAA,UAAA,MAAA,UAAA,UAAA,UAAA,OAAA,YAAA,cAAA,SAWX,8BAAS,IAAA"}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use client";
|
|
3
2
|
import { cn } from "../../../utils.mjs";
|
|
4
3
|
import { jsx } from "react/jsx-runtime";
|
|
5
4
|
import { motion } from "motion/react";
|
|
6
|
-
|
|
7
5
|
//#region src/components/molecules/reveals/item.tsx
|
|
8
6
|
const effectVariants = {
|
|
9
7
|
fadeIn: {
|
|
@@ -61,7 +59,7 @@ const Item = ({ effect = "fadeInUp", children, once, viewport, variants, duratio
|
|
|
61
59
|
children
|
|
62
60
|
});
|
|
63
61
|
};
|
|
64
|
-
|
|
65
62
|
//#endregion
|
|
66
63
|
export { Item as default };
|
|
64
|
+
|
|
67
65
|
//# sourceMappingURL=item.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.mjs","names":[],"sources":["../../../../src/components/molecules/reveals/item.tsx"],"sourcesContent":["'use client';\n\nimport { type MotionProps, motion } from 'motion/react';\n\nimport { cn } from '@repo/ui/utils';\n\nconst effectVariants = {\n fadeIn: {\n offscreen: { opacity: 0 },\n onscreen: { opacity: 1 },\n },\n fadeInUp: {\n offscreen: { opacity: 0, y: 50 },\n onscreen: { opacity: 1, y: 0 },\n },\n slideInUp: {\n offscreen: { opacity: 1, y: 50 },\n onscreen: { opacity: 1, y: 0 },\n },\n};\n\nexport interface ItemProps {\n effect?: keyof typeof effectVariants;\n delay?: number;\n once?: boolean;\n duration?: number;\n className?: string;\n children?: React.ReactNode;\n viewport?: MotionProps['viewport'];\n variants?: MotionProps['variants'];\n transition?: MotionProps['transition'];\n}\n\nconst Item = ({\n effect = 'fadeInUp',\n children,\n once,\n viewport,\n variants,\n duration,\n delay,\n transition,\n className,\n ...props\n}: ItemProps) => {\n return (\n <motion.div\n initial=\"offscreen\"\n whileInView=\"onscreen\"\n viewport={{ once, ...viewport }}\n variants={{\n offscreen: {\n ...effectVariants[effect].offscreen,\n ...variants?.offscreen,\n transition: {\n duration: 0,\n },\n },\n onscreen: {\n ...effectVariants[effect].onscreen,\n ...variants?.onscreen,\n transition: {\n duration,\n ease: 'easeOut',\n delay,\n ...transition,\n },\n },\n }}\n className={cn(\n 'flex h-full items-center justify-center',\n className,\n //\n )}\n {...props}\n >\n {children}\n </motion.div>\n );\n};\n\nexport default Item;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"item.mjs","names":[],"sources":["../../../../src/components/molecules/reveals/item.tsx"],"sourcesContent":["'use client';\n\nimport { type MotionProps, motion } from 'motion/react';\n\nimport { cn } from '@repo/ui/utils';\n\nconst effectVariants = {\n fadeIn: {\n offscreen: { opacity: 0 },\n onscreen: { opacity: 1 },\n },\n fadeInUp: {\n offscreen: { opacity: 0, y: 50 },\n onscreen: { opacity: 1, y: 0 },\n },\n slideInUp: {\n offscreen: { opacity: 1, y: 50 },\n onscreen: { opacity: 1, y: 0 },\n },\n};\n\nexport interface ItemProps {\n effect?: keyof typeof effectVariants;\n delay?: number;\n once?: boolean;\n duration?: number;\n className?: string;\n children?: React.ReactNode;\n viewport?: MotionProps['viewport'];\n variants?: MotionProps['variants'];\n transition?: MotionProps['transition'];\n}\n\nconst Item = ({\n effect = 'fadeInUp',\n children,\n once,\n viewport,\n variants,\n duration,\n delay,\n transition,\n className,\n ...props\n}: ItemProps) => {\n return (\n <motion.div\n initial=\"offscreen\"\n whileInView=\"onscreen\"\n viewport={{ once, ...viewport }}\n variants={{\n offscreen: {\n ...effectVariants[effect].offscreen,\n ...variants?.offscreen,\n transition: {\n duration: 0,\n },\n },\n onscreen: {\n ...effectVariants[effect].onscreen,\n ...variants?.onscreen,\n transition: {\n duration,\n ease: 'easeOut',\n delay,\n ...transition,\n },\n },\n }}\n className={cn(\n 'flex h-full items-center justify-center',\n className,\n //\n )}\n {...props}\n >\n {children}\n </motion.div>\n );\n};\n\nexport default Item;\n"],"mappings":";;;;;AAMA,MAAM,iBAAiB;CACrB,QAAQ;EACN,WAAW,EAAE,SAAS,EAAE;EACxB,UAAU,EAAE,SAAS,EAAE;CACzB;CACA,UAAU;EACR,WAAW;GAAE,SAAS;GAAG,GAAG;EAAG;EAC/B,UAAU;GAAE,SAAS;GAAG,GAAG;EAAE;CAC/B;CACA,WAAW;EACT,WAAW;GAAE,SAAS;GAAG,GAAG;EAAG;EAC/B,UAAU;GAAE,SAAS;GAAG,GAAG;EAAE;CAC/B;AACF;AAcA,MAAM,QAAQ,EACZ,SAAS,YACT,UACA,MACA,UACA,UACA,UACA,OACA,YACA,WACA,GAAG,YACY;CACf,OACE,oBAAC,OAAO,KAAR;EACE,SAAQ;EACR,aAAY;EACZ,UAAU;GAAE;GAAM,GAAG;EAAS;EAC9B,UAAU;GACR,WAAW;IACT,GAAG,eAAe,OAAO,CAAC;IAC1B,GAAG,UAAU;IACb,YAAY,EACV,UAAU,EACZ;GACF;GACA,UAAU;IACR,GAAG,eAAe,OAAO,CAAC;IAC1B,GAAG,UAAU;IACb,YAAY;KACV;KACA,MAAM;KACN;KACA,GAAG;IACL;GACF;EACF;EACA,WAAW,GACT,2CACA,SAEF;EACA,GAAI;EAEH;CACS,CAAA;AAEhB"}
|
|
@@ -1,6 +1,4 @@
|
|
|
1
1
|
import { ItemProps } from "./item.mjs";
|
|
2
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
-
|
|
4
2
|
//#region src/components/molecules/reveals/reveals.d.ts
|
|
5
3
|
interface Props extends React.ComponentPropsWithoutRef<'div'>, ItemProps {
|
|
6
4
|
cascade?: number;
|
|
@@ -14,21 +12,7 @@ interface Props extends React.ComponentPropsWithoutRef<'div'>, ItemProps {
|
|
|
14
12
|
declare const DURATION = 0.6;
|
|
15
13
|
declare const DELAY = 0;
|
|
16
14
|
declare const CASCADE = 0.1;
|
|
17
|
-
declare const Reveals: ({
|
|
18
|
-
children,
|
|
19
|
-
className,
|
|
20
|
-
classNames,
|
|
21
|
-
items,
|
|
22
|
-
cascade,
|
|
23
|
-
duration,
|
|
24
|
-
delay,
|
|
25
|
-
effect,
|
|
26
|
-
once,
|
|
27
|
-
viewport,
|
|
28
|
-
variants,
|
|
29
|
-
transition,
|
|
30
|
-
...props
|
|
31
|
-
}: Props) => react_jsx_runtime0.JSX.Element;
|
|
15
|
+
declare const Reveals: ({ children, className, classNames, items, cascade, duration, delay, effect, once, viewport, variants, transition, ...props }: Props) => import("react").JSX.Element;
|
|
32
16
|
//#endregion
|
|
33
|
-
export { CASCADE, DELAY, DURATION, Props, Reveals };
|
|
17
|
+
export { CASCADE, DELAY, DURATION, Props, Reveals as default };
|
|
34
18
|
//# sourceMappingURL=reveals.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"reveals.d.mts","names":[],"sources":["../../../../src/components/molecules/reveals/reveals.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"reveals.d.mts","names":[],"sources":["../../../../src/components/molecules/reveals/reveals.tsx"],"mappings":";;UAMiB,cACP,MAAM,iCAAiC;EAC/C;EACA;IACE;IACA;;EAEF;EACA,QAAQ;;cAGG;cACA;cACA;cAEP,YAAW,UAAA,WAAA,YAAA,OAAA,SAAA,UAAA,OAAA,QAAA,MAAA,UAAA,UAAA,eAAA,SAcd,0BAAK,IAAA"}
|
|
@@ -2,12 +2,11 @@ import { cn } from "../../../utils.mjs";
|
|
|
2
2
|
import Item from "./item.mjs";
|
|
3
3
|
import { Children } from "react";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
|
|
6
5
|
//#region src/components/molecules/reveals/reveals.tsx
|
|
7
6
|
const DURATION = .6;
|
|
8
7
|
const DELAY = 0;
|
|
9
8
|
const CASCADE = .1;
|
|
10
|
-
const Reveals = ({ children, className, classNames, items = [], cascade = CASCADE, duration = DURATION, delay =
|
|
9
|
+
const Reveals = ({ children, className, classNames, items = [], cascade = CASCADE, duration = DURATION, delay = 0, effect, once, viewport, variants, transition, ...props }) => {
|
|
11
10
|
const renderItems = (items) => items.map((item, index) => /* @__PURE__ */ jsx(Item, {
|
|
12
11
|
effect,
|
|
13
12
|
duration,
|
|
@@ -26,7 +25,7 @@ const Reveals = ({ children, className, classNames, items = [], cascade = CASCAD
|
|
|
26
25
|
children: renderItems(children ? Children.toArray(children).map((child) => ({ children: child })) : items)
|
|
27
26
|
});
|
|
28
27
|
};
|
|
29
|
-
|
|
30
28
|
//#endregion
|
|
31
29
|
export { CASCADE, DELAY, DURATION, Reveals as default };
|
|
30
|
+
|
|
32
31
|
//# sourceMappingURL=reveals.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"reveals.mjs","names":[],"sources":["../../../../src/components/molecules/reveals/reveals.tsx"],"sourcesContent":["import { Children } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item, { type ItemProps } from './item';\n\nexport interface Props\n extends React.ComponentPropsWithoutRef<'div'>, ItemProps {\n cascade?: number;\n classNames?: {\n root?: string;\n item?: string;\n };\n once?: boolean;\n items?: ItemProps[];\n}\n\nexport const DURATION = 0.6;\nexport const DELAY = 0;\nexport const CASCADE = 0.1;\n\nconst Reveals = ({\n children,\n className,\n classNames,\n items = [],\n cascade = CASCADE,\n duration = DURATION,\n delay = DELAY,\n effect,\n once,\n viewport,\n variants,\n transition,\n ...props\n}: Props) => {\n const renderItems = (items: ItemProps[]) =>\n items.map((item, index) => (\n <Item\n key={index}\n effect={effect}\n duration={duration}\n delay={delay + cascade * index}\n once={once}\n viewport={viewport}\n variants={variants}\n transition={transition}\n {...item}\n className={cn(\n item.className,\n classNames?.item,\n //\n )}\n >\n {item.children}\n </Item>\n ));\n\n return (\n <div\n className={cn(\n 'flex gap-5',\n className,\n classNames?.root,\n //\n )}\n {...props}\n >\n {renderItems(\n children\n ? Children.toArray(children).map(child => ({\n children: child,\n }))\n : items,\n )}\n </div>\n );\n};\n\nexport default Reveals;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"reveals.mjs","names":[],"sources":["../../../../src/components/molecules/reveals/reveals.tsx"],"sourcesContent":["import { Children } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item, { type ItemProps } from './item';\n\nexport interface Props\n extends React.ComponentPropsWithoutRef<'div'>, ItemProps {\n cascade?: number;\n classNames?: {\n root?: string;\n item?: string;\n };\n once?: boolean;\n items?: ItemProps[];\n}\n\nexport const DURATION = 0.6;\nexport const DELAY = 0;\nexport const CASCADE = 0.1;\n\nconst Reveals = ({\n children,\n className,\n classNames,\n items = [],\n cascade = CASCADE,\n duration = DURATION,\n delay = DELAY,\n effect,\n once,\n viewport,\n variants,\n transition,\n ...props\n}: Props) => {\n const renderItems = (items: ItemProps[]) =>\n items.map((item, index) => (\n <Item\n key={index}\n effect={effect}\n duration={duration}\n delay={delay + cascade * index}\n once={once}\n viewport={viewport}\n variants={variants}\n transition={transition}\n {...item}\n className={cn(\n item.className,\n classNames?.item,\n //\n )}\n >\n {item.children}\n </Item>\n ));\n\n return (\n <div\n className={cn(\n 'flex gap-5',\n className,\n classNames?.root,\n //\n )}\n {...props}\n >\n {renderItems(\n children\n ? Children.toArray(children).map(child => ({\n children: child,\n }))\n : items,\n )}\n </div>\n );\n};\n\nexport default Reveals;\n"],"mappings":";;;;;AAiBA,MAAa,WAAW;AACxB,MAAa,QAAQ;AACrB,MAAa,UAAU;AAEvB,MAAM,WAAW,EACf,UACA,WACA,YACA,QAAQ,CAAC,GACT,UAAU,SACV,WAAW,UACX,QAAA,GACA,QACA,MACA,UACA,UACA,YACA,GAAG,YACQ;CACX,MAAM,eAAe,UACnB,MAAM,KAAK,MAAM,UACf,oBAAC,MAAD;EAEU;EACE;EACV,OAAO,QAAQ,UAAU;EACnB;EACI;EACA;EACE;EACZ,GAAI;EACJ,WAAW,GACT,KAAK,WACL,YAAY,IAEd;EAEC,UAAA,KAAK;CACF,GAhBC,KAgBD,CACP;CAEH,OACE,oBAAC,OAAD;EACE,WAAW,GACT,cACA,WACA,YAAY,IAEd;EACA,GAAI;EAEH,UAAA,YACC,WACI,SAAS,QAAQ,QAAQ,CAAC,CAAC,KAAI,WAAU,EACvC,UAAU,MACZ,EAAE,IACF,KACN;CACG,CAAA;AAET"}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Props as Props$1
|
|
3
|
-
|
|
1
|
+
import Panel, { Props } from "./panel.mjs";
|
|
2
|
+
import Splitter$1, { Props as Props$1 } from "./splitter.mjs";
|
|
4
3
|
//#region src/components/molecules/splitter/index.d.ts
|
|
5
4
|
type SplitterComponent = typeof Splitter$1 & {
|
|
6
5
|
Panel: typeof Panel;
|
|
7
6
|
};
|
|
8
7
|
declare const Splitter: SplitterComponent;
|
|
9
8
|
//#endregion
|
|
10
|
-
export { Splitter };
|
|
9
|
+
export { type Props$1 as Props, Splitter as default };
|
|
11
10
|
//# sourceMappingURL=index.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/molecules/splitter/index.ts"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/molecules/splitter/index.ts"],"mappings":";;;KAGK,2BAA2B;EAAiB,cAAc;;cAEzD,UAA2B"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import Panel from "./panel.mjs";
|
|
2
2
|
import Splitter$1 from "./splitter.mjs";
|
|
3
|
-
|
|
4
3
|
//#region src/components/molecules/splitter/index.ts
|
|
5
4
|
const Splitter = Splitter$1;
|
|
6
5
|
Splitter.Panel = Panel;
|
|
7
|
-
|
|
8
6
|
//#endregion
|
|
9
7
|
export { Splitter as default };
|
|
8
|
+
|
|
10
9
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":["SplitterImpl"],"sources":["../../../../src/components/molecules/splitter/index.ts"],"sourcesContent":["import Panel, { type Props as SplitterPanelProps } from './panel';\nimport SplitterImpl, { type Props } from './splitter';\n\ntype SplitterComponent = typeof SplitterImpl & { Panel: typeof Panel };\n\nconst Splitter = SplitterImpl as SplitterComponent;\n\nSplitter.Panel = Panel;\n\nexport default Splitter;\nexport type { Props, SplitterPanelProps };\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","names":["SplitterImpl"],"sources":["../../../../src/components/molecules/splitter/index.ts"],"sourcesContent":["import Panel, { type Props as SplitterPanelProps } from './panel';\nimport SplitterImpl, { type Props } from './splitter';\n\ntype SplitterComponent = typeof SplitterImpl & { Panel: typeof Panel };\n\nconst Splitter = SplitterImpl as SplitterComponent;\n\nSplitter.Panel = Panel;\n\nexport default Splitter;\nexport type { Props, SplitterPanelProps };\n"],"mappings":";;;AAKA,MAAM,WAAWA;AAEjB,SAAS,QAAQ"}
|
|
@@ -1,17 +1,11 @@
|
|
|
1
1
|
import { ResizablePanel as ResizablePanel$1 } from "../../../core/resizable.mjs";
|
|
2
2
|
import "../../../core.mjs";
|
|
3
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
-
|
|
5
3
|
//#region src/components/molecules/splitter/panel.d.ts
|
|
6
4
|
declare const ResizablePanel: typeof ResizablePanel$1;
|
|
7
5
|
interface Props extends React.ComponentProps<typeof ResizablePanel> {
|
|
8
6
|
children: React.ReactNode;
|
|
9
7
|
}
|
|
10
|
-
declare const Panel: ({
|
|
11
|
-
children,
|
|
12
|
-
className,
|
|
13
|
-
...props
|
|
14
|
-
}: Props) => react_jsx_runtime0.JSX.Element;
|
|
8
|
+
declare const Panel: ({ children, className, ...props }: Props) => import("react").JSX.Element;
|
|
15
9
|
//#endregion
|
|
16
|
-
export {
|
|
10
|
+
export { Props, Panel as default };
|
|
17
11
|
//# sourceMappingURL=panel.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"panel.d.mts","names":[],"sources":["../../../../src/components/molecules/splitter/panel.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"panel.d.mts","names":[],"sources":["../../../../src/components/molecules/splitter/panel.tsx"],"mappings":";;;cAGQ,uBAAc;UAEL,cAAc,MAAM,sBAAsB;EACzD,UAAU,MAAM;;cAGZ,UAAS,UAAA,cAAA,SAAmC,0BAAK,IAAA"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { cn } from "../../../utils.mjs";
|
|
2
2
|
import { resizable_exports } from "../../../core/resizable.mjs";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
|
-
|
|
5
4
|
//#region src/components/molecules/splitter/panel.tsx
|
|
6
5
|
const { ResizablePanel } = resizable_exports;
|
|
7
6
|
const Panel = ({ children, className, ...props }) => {
|
|
@@ -11,7 +10,7 @@ const Panel = ({ children, className, ...props }) => {
|
|
|
11
10
|
children
|
|
12
11
|
});
|
|
13
12
|
};
|
|
14
|
-
|
|
15
13
|
//#endregion
|
|
16
14
|
export { Panel as default };
|
|
15
|
+
|
|
17
16
|
//# sourceMappingURL=panel.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"panel.mjs","names":["resizable"],"sources":["../../../../src/components/molecules/splitter/panel.tsx"],"sourcesContent":["import { resizable } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { ResizablePanel } = resizable;\n\nexport interface Props extends React.ComponentProps<typeof ResizablePanel> {\n children: React.ReactNode;\n}\n\nconst Panel = ({ children, className, ...props }: Props) => {\n return (\n <ResizablePanel\n className={cn('min-h-0 min-w-0 overflow-auto', className)}\n {...props}\n >\n {children}\n </ResizablePanel>\n );\n};\n\nexport default Panel;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"panel.mjs","names":["resizable"],"sources":["../../../../src/components/molecules/splitter/panel.tsx"],"sourcesContent":["import { resizable } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { ResizablePanel } = resizable;\n\nexport interface Props extends React.ComponentProps<typeof ResizablePanel> {\n children: React.ReactNode;\n}\n\nconst Panel = ({ children, className, ...props }: Props) => {\n return (\n <ResizablePanel\n className={cn('min-h-0 min-w-0 overflow-auto', className)}\n {...props}\n >\n {children}\n </ResizablePanel>\n );\n};\n\nexport default Panel;\n"],"mappings":";;;;AAGA,MAAM,EAAE,mBAAmBA;AAM3B,MAAM,SAAS,EAAE,UAAU,WAAW,GAAG,YAAmB;CAC1D,OACE,oBAAC,gBAAD;EACE,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;EAEH;CACa,CAAA;AAEpB"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import { ResizablePanelGroup as ResizablePanelGroup$1 } from "../../../core/resizable.mjs";
|
|
2
2
|
import "../../../core.mjs";
|
|
3
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
-
|
|
5
3
|
//#region src/components/molecules/splitter/splitter.d.ts
|
|
6
4
|
declare const ResizablePanelGroup: typeof ResizablePanelGroup$1;
|
|
7
5
|
type SplitterLayout = Parameters<NonNullable<React.ComponentProps<typeof ResizablePanelGroup>['onLayoutChanged']>>[0];
|
|
@@ -14,17 +12,7 @@ interface Props extends Omit<React.ComponentProps<typeof ResizablePanelGroup>, '
|
|
|
14
12
|
onResize?: (layout: SplitterLayout) => void;
|
|
15
13
|
onResizeEnd?: (layout: SplitterLayout) => void;
|
|
16
14
|
}
|
|
17
|
-
declare const Splitter: ({
|
|
18
|
-
children,
|
|
19
|
-
className,
|
|
20
|
-
orientation,
|
|
21
|
-
withHandle,
|
|
22
|
-
handle,
|
|
23
|
-
handleClassName,
|
|
24
|
-
onResize,
|
|
25
|
-
onResizeEnd,
|
|
26
|
-
...props
|
|
27
|
-
}: Props) => react_jsx_runtime0.JSX.Element;
|
|
15
|
+
declare const Splitter: ({ children, className, orientation, withHandle, handle, handleClassName, onResize, onResizeEnd, ...props }: Props) => import("react").JSX.Element;
|
|
28
16
|
//#endregion
|
|
29
|
-
export { Props, Splitter };
|
|
17
|
+
export { Props, Splitter as default };
|
|
30
18
|
//# sourceMappingURL=splitter.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"splitter.d.mts","names":[],"sources":["../../../../src/components/molecules/splitter/splitter.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"splitter.d.mts","names":[],"sources":["../../../../src/components/molecules/splitter/splitter.tsx"],"mappings":";;;cAOyB,4BAAmB;KAEvC,iBAAiB,WACpB,YACE,MAAM,sBAAsB;UAIf,cAAc,KAC7B,MAAM,sBAAsB;EAG5B,UAAU,MAAM;EAChB;EACA;EACA,SAAS,MAAM;EACf;EACA,YAAY,QAAQ;EACpB,eAAe,QAAQ;;cAGnB,aAAY,UAAA,WAAA,aAAA,YAAA,QAAA,iBAAA,UAAA,gBAAA,SAUf,0BAAK,IAAA"}
|
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use client";
|
|
3
2
|
import { cn } from "../../../utils.mjs";
|
|
4
3
|
import { resizable_exports } from "../../../core/resizable.mjs";
|
|
5
4
|
import { Children, Fragment, isValidElement } from "react";
|
|
6
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
-
|
|
8
6
|
//#region src/components/molecules/splitter/splitter.tsx
|
|
9
7
|
const { ResizableHandle, ResizablePanelGroup } = resizable_exports;
|
|
10
8
|
const Splitter = ({ children, className, orientation = "horizontal", withHandle = true, handle, handleClassName, onResize, onResizeEnd, ...props }) => {
|
|
@@ -23,7 +21,7 @@ const Splitter = ({ children, className, orientation = "horizontal", withHandle
|
|
|
23
21
|
})] }, isValidElement(panel) && panel.key != null ? panel.key : index))
|
|
24
22
|
});
|
|
25
23
|
};
|
|
26
|
-
|
|
27
24
|
//#endregion
|
|
28
25
|
export { Splitter as default };
|
|
26
|
+
|
|
29
27
|
//# sourceMappingURL=splitter.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"splitter.mjs","names":["resizable"],"sources":["../../../../src/components/molecules/splitter/splitter.tsx"],"sourcesContent":["'use client';\n\nimport { Children, Fragment, isValidElement } from 'react';\n\nimport { resizable } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { ResizableHandle, ResizablePanelGroup } = resizable;\n\ntype SplitterLayout = Parameters<\n NonNullable<\n React.ComponentProps<typeof ResizablePanelGroup>['onLayoutChanged']\n >\n>[0];\n\nexport interface Props extends Omit<\n React.ComponentProps<typeof ResizablePanelGroup>,\n 'children' | 'orientation' | 'onLayoutChange' | 'onLayoutChanged' | 'onResize'\n> {\n children: React.ReactNode;\n orientation?: 'horizontal' | 'vertical';\n withHandle?: boolean;\n handle?: React.ReactNode;\n handleClassName?: string;\n onResize?: (layout: SplitterLayout) => void;\n onResizeEnd?: (layout: SplitterLayout) => void;\n}\n\nconst Splitter = ({\n children,\n className,\n orientation = 'horizontal',\n withHandle = true,\n handle,\n handleClassName,\n onResize,\n onResizeEnd,\n ...props\n}: Props) => {\n const panels = Children.toArray(children);\n\n return (\n <ResizablePanelGroup\n className={cn(\n 'border-border/60 h-full w-full rounded-lg border',\n className,\n )}\n orientation={orientation}\n onLayoutChange={onResize}\n onLayoutChanged={onResizeEnd}\n {...props}\n >\n {panels.map((panel, index) => (\n <Fragment\n key={isValidElement(panel) && panel.key != null ? panel.key : index}\n >\n {panel}\n {index < panels.length - 1 && (\n <ResizableHandle\n className={cn(\n `hover:bg-border/80 data-separator-active:bg-border\n transition-colors`,\n handleClassName,\n )}\n withHandle={withHandle && handle === undefined}\n >\n {handle}\n </ResizableHandle>\n )}\n </Fragment>\n ))}\n </ResizablePanelGroup>\n );\n};\n\nexport default Splitter;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"splitter.mjs","names":["resizable"],"sources":["../../../../src/components/molecules/splitter/splitter.tsx"],"sourcesContent":["'use client';\n\nimport { Children, Fragment, isValidElement } from 'react';\n\nimport { resizable } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { ResizableHandle, ResizablePanelGroup } = resizable;\n\ntype SplitterLayout = Parameters<\n NonNullable<\n React.ComponentProps<typeof ResizablePanelGroup>['onLayoutChanged']\n >\n>[0];\n\nexport interface Props extends Omit<\n React.ComponentProps<typeof ResizablePanelGroup>,\n 'children' | 'orientation' | 'onLayoutChange' | 'onLayoutChanged' | 'onResize'\n> {\n children: React.ReactNode;\n orientation?: 'horizontal' | 'vertical';\n withHandle?: boolean;\n handle?: React.ReactNode;\n handleClassName?: string;\n onResize?: (layout: SplitterLayout) => void;\n onResizeEnd?: (layout: SplitterLayout) => void;\n}\n\nconst Splitter = ({\n children,\n className,\n orientation = 'horizontal',\n withHandle = true,\n handle,\n handleClassName,\n onResize,\n onResizeEnd,\n ...props\n}: Props) => {\n const panels = Children.toArray(children);\n\n return (\n <ResizablePanelGroup\n className={cn(\n 'border-border/60 h-full w-full rounded-lg border',\n className,\n )}\n orientation={orientation}\n onLayoutChange={onResize}\n onLayoutChanged={onResizeEnd}\n {...props}\n >\n {panels.map((panel, index) => (\n <Fragment\n key={isValidElement(panel) && panel.key != null ? panel.key : index}\n >\n {panel}\n {index < panels.length - 1 && (\n <ResizableHandle\n className={cn(\n `hover:bg-border/80 data-separator-active:bg-border\n transition-colors`,\n handleClassName,\n )}\n withHandle={withHandle && handle === undefined}\n >\n {handle}\n </ResizableHandle>\n )}\n </Fragment>\n ))}\n </ResizablePanelGroup>\n );\n};\n\nexport default Splitter;\n"],"mappings":";;;;;;AAOA,MAAM,EAAE,iBAAiB,wBAAwBA;AAqBjD,MAAM,YAAY,EAChB,UACA,WACA,cAAc,cACd,aAAa,MACb,QACA,iBACA,UACA,aACA,GAAG,YACQ;CACX,MAAM,SAAS,SAAS,QAAQ,QAAQ;CAExC,OACE,oBAAC,qBAAD;EACE,WAAW,GACT,oDACA,SACF;EACa;EACb,gBAAgB;EAChB,iBAAiB;EACjB,GAAI;EAEH,UAAA,OAAO,KAAK,OAAO,UAClB,qBAAC,UAAD,EAAA,UAAA,CAGG,OACA,QAAQ,OAAO,SAAS,KACvB,oBAAC,iBAAD;GACE,WAAW,GACT;oCAEA,eACF;GACA,YAAY,cAAc,WAAW,KAAA;GAEpC,UAAA;EACc,CAAA,CAEX,EAAA,GAfH,eAAe,KAAK,KAAK,MAAM,OAAO,OAAO,MAAM,MAAM,KAetD,CACX;CACkB,CAAA;AAEzB"}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
-
|
|
3
1
|
//#region src/components/molecules/upload.d.ts
|
|
4
2
|
interface UploadFile {
|
|
5
3
|
uid: string;
|
|
@@ -29,18 +27,7 @@ interface Props {
|
|
|
29
27
|
reason: 'max-count' | 'read-error';
|
|
30
28
|
}) => void;
|
|
31
29
|
}
|
|
32
|
-
declare const Upload: ({
|
|
33
|
-
defaultValue,
|
|
34
|
-
value: _value,
|
|
35
|
-
multiple,
|
|
36
|
-
accept,
|
|
37
|
-
maxCount,
|
|
38
|
-
disabled,
|
|
39
|
-
className,
|
|
40
|
-
classNames,
|
|
41
|
-
onChange: _onChange,
|
|
42
|
-
onReject
|
|
43
|
-
}: Props) => react_jsx_runtime0.JSX.Element;
|
|
30
|
+
declare const Upload: ({ defaultValue, value: _value, multiple, accept, maxCount, disabled, className, classNames, onChange: _onChange, onReject }: Props) => import("react").JSX.Element;
|
|
44
31
|
//#endregion
|
|
45
|
-
export { Props,
|
|
32
|
+
export { Props, UploadFile, Upload as default };
|
|
46
33
|
//# sourceMappingURL=upload.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"upload.d.mts","names":[],"sources":["../../../src/components/molecules/upload.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"upload.d.mts","names":[],"sources":["../../../src/components/molecules/upload.tsx"],"mappings":";UAgBiB;EACf;EACA;EACA;;UAGe;EACf,eAAe;EACf,QAAQ;EACR;EACA;EACA;EACA;EACA;EACA;IACE;IACA;IACA;;EAEF,YAAY,OAAO;;;;;EAKnB,YAAY;IAAQ,MAAM;IAAM;;;cAO5B,WAAU,cAAA,OAAA,QAAA,UAAA,QAAA,UAAA,UAAA,WAAA,YAAA,UAAA,WAAA,YAWb,0BAAK,IAAA"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use client";
|
|
3
2
|
import { cn } from "../../utils.mjs";
|
|
4
3
|
import Button from "../../Button.mjs";
|
|
5
4
|
import { Upload, X } from "lucide-react";
|
|
@@ -7,7 +6,6 @@ import { useId } from "react";
|
|
|
7
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
8
7
|
import { useControllableState, useFileDrop, useFileToDataUrl } from "@jbpark/use-hooks";
|
|
9
8
|
import { v4 } from "uuid";
|
|
10
|
-
|
|
11
9
|
//#region src/components/molecules/upload.tsx
|
|
12
10
|
const isImage = (file) => /^data:image\//.test(file.url) || /\.(png|jpe?g|gif|webp|svg)$/i.test(file.name);
|
|
13
11
|
const Upload$1 = ({ defaultValue = [], value: _value, multiple = true, accept = "image/*", maxCount, disabled, className, classNames, onChange: _onChange = () => {}, onReject }) => {
|
|
@@ -107,7 +105,7 @@ const Upload$1 = ({ defaultValue = [], value: _value, multiple = true, accept =
|
|
|
107
105
|
})]
|
|
108
106
|
});
|
|
109
107
|
};
|
|
110
|
-
|
|
111
108
|
//#endregion
|
|
112
109
|
export { Upload$1 as default };
|
|
110
|
+
|
|
113
111
|
//# sourceMappingURL=upload.mjs.map
|