@jbpark/ui-kit 10.1.0 → 10.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/Alert.d.mts +24 -0
- package/dist/Alert.d.mts.map +1 -0
- package/dist/Alert.mjs +68 -0
- package/dist/Alert.mjs.map +1 -0
- package/dist/Anchor.d.mts +29 -0
- package/dist/Anchor.d.mts.map +1 -0
- package/dist/Anchor.mjs +120 -0
- package/dist/Anchor.mjs.map +1 -0
- package/dist/AutoComplete.d.mts +34 -0
- package/dist/AutoComplete.d.mts.map +1 -0
- package/dist/AutoComplete.mjs +82 -0
- package/dist/AutoComplete.mjs.map +1 -0
- package/dist/Avatar.d.mts +19 -0
- package/dist/Avatar.d.mts.map +1 -0
- package/dist/Avatar.mjs +43 -0
- package/dist/Avatar.mjs.map +1 -0
- package/dist/Badge.d.mts +23 -0
- package/dist/Badge.d.mts.map +1 -0
- package/dist/Badge.mjs +41 -0
- package/dist/Badge.mjs.map +1 -0
- package/dist/Breadcrumb.d.mts +3 -3
- package/dist/Breadcrumb.d.mts.map +1 -1
- package/dist/Breadcrumb.mjs +1 -1
- package/dist/Breadcrumb.mjs.map +1 -1
- package/dist/Button.d.mts +3 -3
- package/dist/Button.d.mts.map +1 -1
- package/dist/Button.mjs +1 -1
- package/dist/Calendar.d.mts +28 -0
- package/dist/Calendar.d.mts.map +1 -0
- package/dist/Calendar.mjs +64 -0
- package/dist/Calendar.mjs.map +1 -0
- package/dist/Card.d.mts +2 -2
- package/dist/Card.d.mts.map +1 -1
- package/dist/Cascader.d.mts +34 -0
- package/dist/Cascader.d.mts.map +1 -0
- package/dist/Cascader.mjs +144 -0
- package/dist/Cascader.mjs.map +1 -0
- package/dist/CodeEditor.d.mts +2 -2
- package/dist/CodeEditor.d.mts.map +1 -1
- package/dist/ContextMenu.d.mts +33 -0
- package/dist/ContextMenu.d.mts.map +1 -0
- package/dist/ContextMenu.mjs +92 -0
- package/dist/ContextMenu.mjs.map +1 -0
- package/dist/Descriptions.d.mts +31 -0
- package/dist/Descriptions.d.mts.map +1 -0
- package/dist/Descriptions.mjs +67 -0
- package/dist/Descriptions.mjs.map +1 -0
- package/dist/Divider.d.mts +18 -0
- package/dist/Divider.d.mts.map +1 -0
- package/dist/Divider.mjs +44 -0
- package/dist/Divider.mjs.map +1 -0
- package/dist/Form.d.mts +12 -0
- package/dist/Form.d.mts.map +1 -0
- package/dist/Form.mjs +11 -0
- package/dist/Form.mjs.map +1 -0
- package/dist/Layout.d.mts.map +1 -1
- package/dist/Mentions.d.mts +34 -0
- package/dist/Mentions.d.mts.map +1 -0
- package/dist/Mentions.mjs +207 -0
- package/dist/Mentions.mjs.map +1 -0
- package/dist/Menu.mjs +1 -2
- package/dist/Pagination.d.mts +2 -2
- package/dist/Pagination.d.mts.map +1 -1
- package/dist/Pagination.mjs +1 -1
- package/dist/Popconfirm.d.mts +33 -0
- package/dist/Popconfirm.d.mts.map +1 -0
- package/dist/Popconfirm.mjs +119 -0
- package/dist/Popconfirm.mjs.map +1 -0
- package/dist/Rate.d.mts +27 -0
- package/dist/Rate.d.mts.map +1 -0
- package/dist/Rate.mjs +81 -0
- package/dist/Rate.mjs.map +1 -0
- package/dist/Reveals.d.mts.map +1 -1
- package/dist/ScrollArea.d.mts +8 -0
- package/dist/ScrollArea.d.mts.map +1 -0
- package/dist/ScrollArea.mjs +11 -0
- package/dist/ScrollArea.mjs.map +1 -0
- package/dist/Segmented.d.mts +26 -0
- package/dist/Segmented.d.mts.map +1 -0
- package/dist/Segmented.mjs +57 -0
- package/dist/Segmented.mjs.map +1 -0
- package/dist/Space.d.mts +2 -2
- package/dist/Space.d.mts.map +1 -1
- package/dist/Statistic.d.mts +22 -0
- package/dist/Statistic.d.mts.map +1 -0
- package/dist/Statistic.mjs +53 -0
- package/dist/Statistic.mjs.map +1 -0
- package/dist/Steps.d.mts +28 -0
- package/dist/Steps.d.mts.map +1 -0
- package/dist/Steps.mjs +70 -0
- package/dist/Steps.mjs.map +1 -0
- package/dist/Table.d.mts +4 -4
- package/dist/Table.d.mts.map +1 -1
- package/dist/Tag.d.mts +3 -3
- package/dist/Tag.d.mts.map +1 -1
- package/dist/TimePicker.d.mts +26 -0
- package/dist/TimePicker.d.mts.map +1 -0
- package/dist/TimePicker.mjs +77 -0
- package/dist/TimePicker.mjs.map +1 -0
- package/dist/Timeline.d.mts +35 -0
- package/dist/Timeline.d.mts.map +1 -0
- package/dist/Timeline.mjs +59 -0
- package/dist/Timeline.mjs.map +1 -0
- package/dist/Tour.d.mts +37 -0
- package/dist/Tour.d.mts.map +1 -0
- package/dist/Tour.mjs +192 -0
- package/dist/Tour.mjs.map +1 -0
- package/dist/Transfer.d.mts +36 -0
- package/dist/Transfer.d.mts.map +1 -0
- package/dist/Transfer.mjs +147 -0
- package/dist/Transfer.mjs.map +1 -0
- package/dist/Tree.d.mts +62 -0
- package/dist/Tree.d.mts.map +1 -0
- package/dist/Tree.mjs +462 -0
- package/dist/Tree.mjs.map +1 -0
- package/dist/TreeSelect.d.mts +34 -0
- package/dist/TreeSelect.d.mts.map +1 -0
- package/dist/TreeSelect.mjs +135 -0
- package/dist/TreeSelect.mjs.map +1 -0
- package/dist/Typography.d.mts.map +1 -1
- package/dist/components/atoms/checkbox/checkbox.d.mts +5 -3
- package/dist/components/atoms/checkbox/checkbox.d.mts.map +1 -1
- package/dist/components/atoms/checkbox/checkbox.mjs +8 -4
- package/dist/components/atoms/checkbox/checkbox.mjs.map +1 -1
- package/dist/components/atoms/checkbox/group.d.mts +2 -2
- package/dist/components/atoms/checkbox/group.d.mts.map +1 -1
- package/dist/components/atoms/checkbox/index.d.mts.map +1 -1
- package/dist/components/atoms/color-picker.d.mts +2 -2
- package/dist/components/atoms/color-picker.d.mts.map +1 -1
- package/dist/components/atoms/date-picker.d.mts +5 -1
- package/dist/components/atoms/date-picker.d.mts.map +1 -1
- package/dist/components/atoms/date-picker.mjs +54 -10
- package/dist/components/atoms/date-picker.mjs.map +1 -1
- package/dist/components/atoms/float-button/back-top.d.mts +2 -2
- package/dist/components/atoms/float-button/back-top.d.mts.map +1 -1
- package/dist/components/atoms/float-button/back-top.mjs +1 -1
- package/dist/components/atoms/float-button/float-button.d.mts +2 -2
- package/dist/components/atoms/float-button/float-button.d.mts.map +1 -1
- package/dist/components/atoms/float-button/index.d.mts.map +1 -1
- package/dist/components/atoms/index.d.mts +13 -2
- package/dist/components/atoms/input/index.d.mts +5 -1
- package/dist/components/atoms/input/index.d.mts.map +1 -1
- package/dist/components/atoms/input/index.mjs +5 -1
- package/dist/components/atoms/input/index.mjs.map +1 -1
- package/dist/components/atoms/input/number.d.mts +23 -0
- package/dist/components/atoms/input/number.d.mts.map +1 -0
- package/dist/components/atoms/input/number.mjs +71 -0
- package/dist/components/atoms/input/number.mjs.map +1 -0
- package/dist/components/atoms/input/otp.d.mts +26 -0
- package/dist/components/atoms/input/otp.d.mts.map +1 -0
- package/dist/components/atoms/input/otp.mjs +52 -0
- package/dist/components/atoms/input/otp.mjs.map +1 -0
- package/dist/components/atoms/input/search.d.mts +2 -7
- package/dist/components/atoms/input/search.d.mts.map +1 -1
- package/dist/components/atoms/input/search.mjs +6 -8
- package/dist/components/atoms/input/search.mjs.map +1 -1
- package/dist/components/atoms/mentions-token.mjs +31 -0
- package/dist/components/atoms/mentions-token.mjs.map +1 -0
- package/dist/components/atoms/option-group.d.mts +4 -5
- package/dist/components/atoms/option-group.d.mts.map +1 -1
- package/dist/components/atoms/popover.d.mts +2 -2
- package/dist/components/atoms/popover.d.mts.map +1 -1
- package/dist/components/atoms/progress.d.mts +5 -3
- package/dist/components/atoms/progress.d.mts.map +1 -1
- package/dist/components/atoms/progress.mjs +2 -2
- package/dist/components/atoms/progress.mjs.map +1 -1
- package/dist/components/atoms/radio/group.d.mts +2 -2
- package/dist/components/atoms/radio/group.d.mts.map +1 -1
- package/dist/components/atoms/radio/group.mjs +1 -1
- package/dist/components/atoms/radio/index.d.mts.map +1 -1
- package/dist/components/atoms/radio/radio.d.mts +2 -2
- package/dist/components/atoms/radio/radio.d.mts.map +1 -1
- package/dist/components/atoms/radio/radio.mjs +1 -1
- package/dist/components/atoms/rich-text-editor/rich-text-editor.d.mts +8 -3
- package/dist/components/atoms/rich-text-editor/rich-text-editor.d.mts.map +1 -1
- package/dist/components/atoms/rich-text-editor/rich-text-editor.mjs +7 -2
- package/dist/components/atoms/rich-text-editor/rich-text-editor.mjs.map +1 -1
- package/dist/components/atoms/rich-text-editor/toolbar-presets.mjs +2 -2
- package/dist/components/atoms/rich-text-editor/types.d.mts +2 -3
- package/dist/components/atoms/rich-text-editor/types.d.mts.map +1 -1
- package/dist/components/atoms/select-multiple.d.mts +2 -3
- package/dist/components/atoms/select-multiple.d.mts.map +1 -1
- package/dist/components/atoms/select-multiple.mjs +4 -3
- package/dist/components/atoms/select-multiple.mjs.map +1 -1
- package/dist/components/atoms/select-searchable-options.d.mts +3 -4
- package/dist/components/atoms/select-searchable-options.d.mts.map +1 -1
- package/dist/components/atoms/select-searchable.d.mts +2 -3
- package/dist/components/atoms/select-searchable.d.mts.map +1 -1
- package/dist/components/atoms/select-searchable.mjs +4 -3
- package/dist/components/atoms/select-searchable.mjs.map +1 -1
- package/dist/components/atoms/select.d.mts +4 -4
- package/dist/components/atoms/select.d.mts.map +1 -1
- package/dist/components/atoms/select.mjs +1 -1
- package/dist/components/atoms/select.mjs.map +1 -1
- package/dist/components/atoms/skeleton/button.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/index.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/node.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/skeleton.d.mts +5 -3
- package/dist/components/atoms/skeleton/skeleton.d.mts.map +1 -1
- package/dist/components/atoms/skeleton/skeleton.mjs +2 -2
- package/dist/components/atoms/skeleton/skeleton.mjs.map +1 -1
- package/dist/components/atoms/slider/slider.d.mts +3 -3
- package/dist/components/atoms/slider/slider.d.mts.map +1 -1
- package/dist/components/atoms/spin.d.mts +2 -2
- package/dist/components/atoms/spin.d.mts.map +1 -1
- package/dist/components/atoms/spin.mjs +1 -1
- package/dist/components/atoms/switch.d.mts +2 -2
- package/dist/components/atoms/switch.d.mts.map +1 -1
- package/dist/components/atoms/tooltip.d.mts +2 -2
- package/dist/components/atoms/tooltip.d.mts.map +1 -1
- package/dist/components/atoms/typography/link.d.mts +2 -2
- package/dist/components/atoms/typography/link.d.mts.map +1 -1
- package/dist/components/atoms/typography/paragraph.d.mts +2 -2
- package/dist/components/atoms/typography/paragraph.d.mts.map +1 -1
- package/dist/components/atoms/typography/text.d.mts +2 -2
- package/dist/components/atoms/typography/text.d.mts.map +1 -1
- package/dist/components/atoms/typography/title.d.mts +2 -2
- package/dist/components/atoms/typography/title.d.mts.map +1 -1
- package/dist/components/atoms/typography/typography.d.mts +2 -2
- package/dist/components/atoms/typography/typography.d.mts.map +1 -1
- package/dist/components/molecules/collapse.d.mts +9 -9
- package/dist/components/molecules/collapse.d.mts.map +1 -1
- package/dist/components/molecules/collapse.mjs +11 -2
- package/dist/components/molecules/collapse.mjs.map +1 -1
- package/dist/components/molecules/dropdown.d.mts +2 -2
- package/dist/components/molecules/dropdown.d.mts.map +1 -1
- package/dist/components/molecules/index.d.mts +23 -13
- package/dist/components/molecules/marquees/index.d.mts.map +1 -1
- package/dist/components/molecules/marquees/item.d.mts +4 -4
- package/dist/components/molecules/marquees/item.d.mts.map +1 -1
- package/dist/components/molecules/marquees/item.mjs +5 -5
- package/dist/components/molecules/marquees/item.mjs.map +1 -1
- package/dist/components/molecules/marquees/marquees.d.mts +2 -2
- package/dist/components/molecules/marquees/marquees.d.mts.map +1 -1
- package/dist/components/molecules/marquees/marquees.mjs +4 -5
- package/dist/components/molecules/marquees/marquees.mjs.map +1 -1
- package/dist/components/molecules/menu/item/item.mjs +1 -1
- package/dist/components/molecules/menu/menu.d.mts +9 -9
- package/dist/components/molecules/menu/menu.d.mts.map +1 -1
- package/dist/components/molecules/menu/menu.mjs +3 -1
- package/dist/components/molecules/menu/menu.mjs.map +1 -1
- package/dist/components/molecules/reveals/item.d.mts +2 -2
- package/dist/components/molecules/reveals/item.d.mts.map +1 -1
- package/dist/components/molecules/reveals/reveals.d.mts +5 -5
- package/dist/components/molecules/reveals/reveals.d.mts.map +1 -1
- package/dist/components/molecules/splitter/index.d.mts.map +1 -1
- package/dist/components/molecules/splitter/panel.d.mts +3 -3
- package/dist/components/molecules/splitter/panel.d.mts.map +1 -1
- package/dist/components/molecules/splitter/splitter.d.mts +3 -3
- package/dist/components/molecules/splitter/splitter.d.mts.map +1 -1
- package/dist/components/molecules/tabs.d.mts +9 -5
- package/dist/components/molecules/tabs.d.mts.map +1 -1
- package/dist/components/molecules/tabs.mjs +5 -1
- package/dist/components/molecules/tabs.mjs.map +1 -1
- package/dist/components/molecules/upload.d.mts +3 -3
- package/dist/components/molecules/upload.d.mts.map +1 -1
- package/dist/components/molecules/upload.mjs +1 -1
- package/dist/components/organisms/drawer.d.mts +3 -3
- package/dist/components/organisms/drawer.d.mts.map +1 -1
- package/dist/components/organisms/drawer.mjs +4 -3
- package/dist/components/organisms/drawer.mjs.map +1 -1
- package/dist/components/organisms/form/context.d.mts +4 -0
- package/dist/components/organisms/form/context.d.mts.map +1 -0
- package/dist/components/organisms/form/context.mjs +9 -0
- package/dist/components/organisms/form/context.mjs.map +1 -0
- package/dist/components/organisms/form/control.d.mts +11 -0
- package/dist/components/organisms/form/control.d.mts.map +1 -0
- package/dist/components/organisms/form/control.mjs +19 -0
- package/dist/components/organisms/form/control.mjs.map +1 -0
- package/dist/components/organisms/form/field.d.mts +25 -0
- package/dist/components/organisms/form/field.d.mts.map +1 -0
- package/dist/components/organisms/form/field.mjs +54 -0
- package/dist/components/organisms/form/field.mjs.map +1 -0
- package/dist/components/organisms/form/form.d.mts +14 -0
- package/dist/components/organisms/form/form.d.mts.map +1 -0
- package/dist/components/organisms/form/form.mjs +23 -0
- package/dist/components/organisms/form/form.mjs.map +1 -0
- package/dist/components/organisms/index.d.mts +14 -6
- package/dist/components/organisms/list/index.d.mts.map +1 -1
- package/dist/components/organisms/list/list.d.mts +2 -2
- package/dist/components/organisms/list/list.d.mts.map +1 -1
- package/dist/components/organisms/modal.d.mts +6 -3
- package/dist/components/organisms/modal.d.mts.map +1 -1
- package/dist/components/organisms/modal.mjs +25 -18
- package/dist/components/organisms/modal.mjs.map +1 -1
- package/dist/components/organisms/swiper/index.d.mts.map +1 -1
- package/dist/components/organisms/swiper/swiper.d.mts +2 -2
- package/dist/components/organisms/swiper/swiper.d.mts.map +1 -1
- package/dist/components/organisms/toast.d.mts +2 -2
- package/dist/components/organisms/toast.d.mts.map +1 -1
- package/dist/components/organisms/toast.mjs +1 -1
- package/dist/components/templates/container.d.mts +2 -2
- package/dist/components/templates/container.d.mts.map +1 -1
- package/dist/components/templates/empty.d.mts +2 -2
- package/dist/components/templates/empty.d.mts.map +1 -1
- package/dist/components/templates/empty.mjs +1 -1
- package/dist/components/templates/grid/col.d.mts +2 -2
- package/dist/components/templates/grid/col.d.mts.map +1 -1
- package/dist/components/templates/grid/row.d.mts +2 -2
- package/dist/components/templates/grid/row.d.mts.map +1 -1
- package/dist/components/templates/layout/content.d.mts +2 -2
- package/dist/components/templates/layout/content.d.mts.map +1 -1
- package/dist/components/templates/layout/footer.d.mts +2 -2
- package/dist/components/templates/layout/footer.d.mts.map +1 -1
- package/dist/components/templates/layout/header.d.mts +2 -2
- package/dist/components/templates/layout/header.d.mts.map +1 -1
- package/dist/components/templates/layout/layout.d.mts +2 -2
- package/dist/components/templates/layout/layout.d.mts.map +1 -1
- package/dist/components/templates/layout/sider.d.mts +2 -2
- package/dist/components/templates/layout/sider.d.mts.map +1 -1
- package/dist/components/templates/layout/sider.mjs +1 -1
- package/dist/components/templates/page-header.d.mts +2 -2
- package/dist/components/templates/page-header.d.mts.map +1 -1
- package/dist/components/templates/page-header.mjs +1 -1
- package/dist/components/templates/result.d.mts +2 -2
- package/dist/components/templates/result.d.mts.map +1 -1
- package/dist/components/templates/result.mjs +1 -1
- package/dist/core/accordion.mjs +1 -1
- package/dist/core/autocomplete.d.mts +2 -0
- package/dist/core/autocomplete.mjs +48 -0
- package/dist/core/autocomplete.mjs.map +1 -0
- package/dist/core/badge.d.mts +5 -3
- package/dist/core/badge.d.mts.map +1 -1
- package/dist/core/button.d.mts +6 -4
- package/dist/core/button.d.mts.map +1 -1
- package/dist/core/calendar.d.mts +13 -3
- package/dist/core/calendar.d.mts.map +1 -0
- package/dist/core/calendar.mjs +1 -1
- package/dist/core/checkbox.mjs +11 -8
- package/dist/core/checkbox.mjs.map +1 -1
- package/dist/core/combobox.d.mts +26 -4
- package/dist/core/combobox.d.mts.map +1 -1
- package/dist/core/combobox.mjs +2 -2
- package/dist/core/combobox.mjs.map +1 -1
- package/dist/core/dialog.mjs +2 -2
- package/dist/core/dialog.mjs.map +1 -1
- package/dist/core/form.d.mts +8 -0
- package/dist/core/form.d.mts.map +1 -0
- package/dist/core/form.mjs +3 -0
- package/dist/core/index.d.mts +13 -9
- package/dist/core/popover.mjs +10 -2
- package/dist/core/popover.mjs.map +1 -1
- package/dist/core/radio-group.mjs +1 -1
- package/dist/core/resizable.d.mts +7 -2
- package/dist/core/resizable.d.mts.map +1 -1
- package/dist/core/resizable.mjs +1 -1
- package/dist/core/scroll-area.d.mts +20 -0
- package/dist/core/scroll-area.d.mts.map +1 -0
- package/dist/core/scroll-area.mjs +57 -0
- package/dist/core/scroll-area.mjs.map +1 -0
- package/dist/core/select.d.mts +24 -2
- package/dist/core/select.d.mts.map +1 -1
- package/dist/core/select.mjs +1 -1
- package/dist/core/separator.d.mts +13 -2
- package/dist/core/separator.d.mts.map +1 -0
- package/dist/core/tabs.d.mts +16 -2
- package/dist/core/tabs.d.mts.map +1 -1
- package/dist/index.d.mts +63 -34
- package/dist/index.mjs +29 -5
- package/dist/lib/colors.d.mts +2 -3
- package/dist/lib/colors.d.mts.map +1 -1
- package/dist/providers/config/context.d.mts +2 -3
- package/dist/providers/config/context.d.mts.map +1 -1
- package/dist/providers/config/context.mjs +3 -1
- package/dist/providers/config/context.mjs.map +1 -1
- package/dist/providers/config/registry.d.mts +2 -3
- package/dist/providers/config/registry.d.mts.map +1 -1
- package/dist/providers/config/types.d.mts +8 -7
- package/dist/providers/config/types.d.mts.map +1 -1
- package/dist/style.css +838 -288
- package/dist/utils.d.mts +2 -3
- package/dist/utils.d.mts.map +1 -1
- package/package.json +147 -26
- package/dist/components/molecules/marquees/use-pause-on-hover.mjs +0 -26
- package/dist/components/molecules/marquees/use-pause-on-hover.mjs.map +0 -1
|
@@ -0,0 +1,135 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "./utils.mjs";
|
|
3
|
+
import { DEFAULT_LOCALE, useConfig } from "./providers/config/context.mjs";
|
|
4
|
+
import Button from "./Button.mjs";
|
|
5
|
+
import { popover_exports } from "./core/popover.mjs";
|
|
6
|
+
import Tree from "./Tree.mjs";
|
|
7
|
+
import { useImperativeHandle, useRef, useState } from "react";
|
|
8
|
+
import { DirectionProvider } from "@base-ui/react/direction-provider";
|
|
9
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
+
import { ChevronDown, X } from "lucide-react";
|
|
11
|
+
//#region src/components/organisms/tree-select.tsx
|
|
12
|
+
const TreeSelect = ({ nodes, value, defaultValue = null, onChange, expandedKeys, defaultExpandedKeys = [], onExpand, open, defaultOpen = false, onOpenChange, allowClear = true, clearLabel, placeholder = "Choose a node", popupLabel = "Choose a node", emptyText = "No nodes", container, name, form, disabled = false, className, classNames, dir, ref, onKeyDown, ...props }) => {
|
|
13
|
+
const { direction, locale } = useConfig();
|
|
14
|
+
const resolvedDirection = dir === "ltr" || dir === "rtl" ? dir : direction;
|
|
15
|
+
const [internalValue, setInternalValue] = useState(defaultValue);
|
|
16
|
+
const [internalOpen, setInternalOpen] = useState(defaultOpen);
|
|
17
|
+
const [internalExpanded, setInternalExpanded] = useState(defaultExpandedKeys);
|
|
18
|
+
const selected = value === void 0 ? internalValue : value;
|
|
19
|
+
const isOpen = (open ?? internalOpen) && !disabled;
|
|
20
|
+
const expanded = expandedKeys ?? internalExpanded;
|
|
21
|
+
const tree = useRef(null);
|
|
22
|
+
const trigger = useRef(null);
|
|
23
|
+
useImperativeHandle(ref, () => trigger.current, []);
|
|
24
|
+
const { Popover, PopoverTrigger, PopoverContent, PopoverTitle } = popover_exports;
|
|
25
|
+
const entries = /* @__PURE__ */ new Map();
|
|
26
|
+
const visit = (list, isDisabled) => {
|
|
27
|
+
for (const node of list) {
|
|
28
|
+
const entry = {
|
|
29
|
+
node,
|
|
30
|
+
isDisabled: isDisabled || !!node.disabled
|
|
31
|
+
};
|
|
32
|
+
entries.set(node.key, entry);
|
|
33
|
+
visit(node.children ?? [], entry.isDisabled);
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
visit(nodes, disabled);
|
|
37
|
+
const changeOpen = (next) => {
|
|
38
|
+
if (disabled && next) return;
|
|
39
|
+
if (open === void 0) setInternalOpen(next);
|
|
40
|
+
if (next !== isOpen) onOpenChange?.(next);
|
|
41
|
+
};
|
|
42
|
+
const select = (next) => {
|
|
43
|
+
const entry = next === null ? null : entries.get(next);
|
|
44
|
+
if (disabled || next !== null && (!entry || entry.isDisabled)) return;
|
|
45
|
+
if (value === void 0) setInternalValue(next);
|
|
46
|
+
if (next !== selected) onChange?.(next, entry?.node ?? null);
|
|
47
|
+
changeOpen(false);
|
|
48
|
+
};
|
|
49
|
+
return /* @__PURE__ */ jsx(DirectionProvider, {
|
|
50
|
+
direction: resolvedDirection,
|
|
51
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
52
|
+
"data-slot": "tree-select",
|
|
53
|
+
dir: resolvedDirection,
|
|
54
|
+
className: cn("flex w-full min-w-0 items-center gap-1", className),
|
|
55
|
+
children: [
|
|
56
|
+
name && /* @__PURE__ */ jsx("input", {
|
|
57
|
+
type: "hidden",
|
|
58
|
+
name,
|
|
59
|
+
form,
|
|
60
|
+
disabled,
|
|
61
|
+
value: selected ?? ""
|
|
62
|
+
}),
|
|
63
|
+
/* @__PURE__ */ jsxs(Popover, {
|
|
64
|
+
open: isOpen,
|
|
65
|
+
onOpenChange: changeOpen,
|
|
66
|
+
children: [/* @__PURE__ */ jsxs(PopoverTrigger, {
|
|
67
|
+
...props,
|
|
68
|
+
ref: trigger,
|
|
69
|
+
disabled,
|
|
70
|
+
render: /* @__PURE__ */ jsx(Button, { variant: "outlined" }),
|
|
71
|
+
className: cn("h-9 min-w-0 flex-1 justify-between text-start", classNames?.trigger),
|
|
72
|
+
onKeyDown: (event) => {
|
|
73
|
+
onKeyDown?.(event);
|
|
74
|
+
if (!event.defaultPrevented && (event.key === "ArrowDown" || event.key === "ArrowUp")) {
|
|
75
|
+
event.preventDefault();
|
|
76
|
+
changeOpen(true);
|
|
77
|
+
}
|
|
78
|
+
},
|
|
79
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
80
|
+
className: cn("min-w-0 truncate", selected === null && "text-muted-foreground", classNames?.value),
|
|
81
|
+
children: selected === null ? placeholder : entries.get(selected)?.node.label ?? selected
|
|
82
|
+
}), /* @__PURE__ */ jsx(ChevronDown, {
|
|
83
|
+
"aria-hidden": "true",
|
|
84
|
+
className: "size-4 shrink-0"
|
|
85
|
+
})]
|
|
86
|
+
}), /* @__PURE__ */ jsxs(PopoverContent, {
|
|
87
|
+
container,
|
|
88
|
+
dir: resolvedDirection,
|
|
89
|
+
align: "start",
|
|
90
|
+
initialFocus: () => tree.current?.querySelector("[role=\"treeitem\"][aria-selected=\"true\"]") ?? tree.current?.querySelector("[role=\"treeitem\"][tabindex=\"0\"]") ?? true,
|
|
91
|
+
className: cn("w-(--anchor-width) max-w-(--available-width) p-2", classNames?.popup),
|
|
92
|
+
children: [/* @__PURE__ */ jsx(PopoverTitle, {
|
|
93
|
+
className: "sr-only",
|
|
94
|
+
children: popupLabel
|
|
95
|
+
}), /* @__PURE__ */ jsx(Tree, {
|
|
96
|
+
ref: tree,
|
|
97
|
+
nodes,
|
|
98
|
+
selectedKeys: selected === null ? [] : [selected],
|
|
99
|
+
onSelect: (keys) => select(keys[0] ?? null),
|
|
100
|
+
expandedKeys: expanded,
|
|
101
|
+
onExpand: (keys) => {
|
|
102
|
+
if (expandedKeys === void 0) setInternalExpanded(keys);
|
|
103
|
+
onExpand?.(keys);
|
|
104
|
+
},
|
|
105
|
+
emptyText,
|
|
106
|
+
"aria-label": popupLabel,
|
|
107
|
+
dir: resolvedDirection,
|
|
108
|
+
className: cn("max-h-[min(20rem,var(--available-height))] overflow-y-auto", classNames?.tree),
|
|
109
|
+
classNames: classNames?.nodes
|
|
110
|
+
})]
|
|
111
|
+
})]
|
|
112
|
+
}),
|
|
113
|
+
allowClear && selected !== null && /* @__PURE__ */ jsx(Button, {
|
|
114
|
+
variant: "text",
|
|
115
|
+
size: "small",
|
|
116
|
+
disabled,
|
|
117
|
+
"aria-label": clearLabel ?? locale.clear ?? DEFAULT_LOCALE.clear,
|
|
118
|
+
onClick: () => {
|
|
119
|
+
select(null);
|
|
120
|
+
trigger.current?.focus();
|
|
121
|
+
},
|
|
122
|
+
className: cn("size-8 shrink-0 p-0", classNames?.clear),
|
|
123
|
+
children: /* @__PURE__ */ jsx(X, {
|
|
124
|
+
"aria-hidden": "true",
|
|
125
|
+
className: "size-4"
|
|
126
|
+
})
|
|
127
|
+
})
|
|
128
|
+
]
|
|
129
|
+
})
|
|
130
|
+
});
|
|
131
|
+
};
|
|
132
|
+
//#endregion
|
|
133
|
+
export { TreeSelect as default };
|
|
134
|
+
|
|
135
|
+
//# sourceMappingURL=TreeSelect.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TreeSelect.mjs","names":["popover"],"sources":["../src/components/organisms/tree-select.tsx"],"sourcesContent":["'use client';\n\nimport {\n type ComponentPropsWithRef,\n type ReactNode,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\n\nimport { DirectionProvider } from '@base-ui/react/direction-provider';\nimport { ChevronDown, X } from 'lucide-react';\n\nimport { DEFAULT_LOCALE, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { popover } from '../../core';\nimport Button from '../atoms/button';\nimport Tree, { type Node, type Props as TreeProps } from './tree';\n\nexport type { Node } from './tree';\n\nexport interface Props extends Omit<\n ComponentPropsWithRef<'button'>,\n 'children' | 'value' | 'defaultValue' | 'onChange' | 'type'\n> {\n nodes: readonly Node[];\n value?: string | null;\n defaultValue?: string | null;\n onChange?: (value: string | null, node: Node | null) => void;\n expandedKeys?: readonly string[];\n defaultExpandedKeys?: readonly string[];\n onExpand?: (keys: string[]) => void;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n allowClear?: boolean;\n clearLabel?: string;\n placeholder?: string;\n popupLabel?: string;\n emptyText?: ReactNode;\n container?: HTMLElement;\n form?: string;\n classNames?: {\n trigger?: string;\n value?: string;\n clear?: string;\n popup?: string;\n tree?: string;\n nodes?: TreeProps['classNames'];\n };\n}\n\nconst TreeSelect = ({\n nodes,\n value,\n defaultValue = null,\n onChange,\n expandedKeys,\n defaultExpandedKeys = [],\n onExpand,\n open,\n defaultOpen = false,\n onOpenChange,\n allowClear = true,\n clearLabel,\n placeholder = 'Choose a node',\n popupLabel = 'Choose a node',\n emptyText = 'No nodes',\n container,\n name,\n form,\n disabled = false,\n className,\n classNames,\n dir,\n ref,\n onKeyDown,\n ...props\n}: Props) => {\n const { direction, locale } = useConfig();\n const resolvedDirection = dir === 'ltr' || dir === 'rtl' ? dir : direction;\n const [internalValue, setInternalValue] = useState(defaultValue);\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n const [internalExpanded, setInternalExpanded] =\n useState<readonly string[]>(defaultExpandedKeys);\n const selected = value === undefined ? internalValue : value;\n const isOpen = (open ?? internalOpen) && !disabled;\n const expanded = expandedKeys ?? internalExpanded;\n const tree = useRef<HTMLUListElement>(null);\n const trigger = useRef<HTMLButtonElement>(null);\n useImperativeHandle(ref, () => trigger.current!, []);\n const { Popover, PopoverTrigger, PopoverContent, PopoverTitle } = popover;\n const entries = new Map<string, { node: Node; isDisabled: boolean }>();\n const visit = (list: readonly Node[], isDisabled: boolean) => {\n for (const node of list) {\n const entry = { node, isDisabled: isDisabled || !!node.disabled };\n entries.set(node.key, entry);\n visit(node.children ?? [], entry.isDisabled);\n }\n };\n\n visit(nodes, disabled);\n\n const changeOpen = (next: boolean) => {\n if (disabled && next) return;\n if (open === undefined) setInternalOpen(next);\n if (next !== isOpen) onOpenChange?.(next);\n };\n const select = (next: string | null) => {\n const entry = next === null ? null : entries.get(next);\n\n if (disabled || (next !== null && (!entry || entry.isDisabled))) return;\n if (value === undefined) setInternalValue(next);\n if (next !== selected) onChange?.(next, entry?.node ?? null);\n\n changeOpen(false);\n };\n\n return (\n <DirectionProvider direction={resolvedDirection}>\n <div\n data-slot=\"tree-select\"\n dir={resolvedDirection}\n className={cn(\n 'flex w-full min-w-0 items-center gap-1',\n className, //\n )}\n >\n {name && (\n <input\n type=\"hidden\"\n name={name}\n form={form}\n disabled={disabled}\n value={selected ?? ''}\n />\n )}\n <Popover open={isOpen} onOpenChange={changeOpen}>\n <PopoverTrigger\n {...props}\n ref={trigger}\n disabled={disabled}\n render={<Button variant=\"outlined\" />}\n className={cn(\n 'h-9 min-w-0 flex-1 justify-between text-start',\n classNames?.trigger, //\n )}\n onKeyDown={event => {\n onKeyDown?.(event);\n\n if (\n !event.defaultPrevented &&\n (event.key === 'ArrowDown' || event.key === 'ArrowUp')\n ) {\n event.preventDefault();\n changeOpen(true);\n }\n }}\n >\n <span\n className={cn(\n 'min-w-0 truncate',\n selected === null && 'text-muted-foreground',\n classNames?.value, //\n )}\n >\n {selected === null\n ? placeholder\n : (entries.get(selected)?.node.label ?? selected)}\n </span>\n <ChevronDown aria-hidden=\"true\" className=\"size-4 shrink-0\" />\n </PopoverTrigger>\n <PopoverContent\n container={container}\n dir={resolvedDirection}\n align=\"start\"\n initialFocus={() =>\n tree.current?.querySelector<HTMLElement>(\n '[role=\"treeitem\"][aria-selected=\"true\"]',\n ) ??\n tree.current?.querySelector<HTMLElement>(\n '[role=\"treeitem\"][tabindex=\"0\"]',\n ) ??\n true\n }\n className={cn(\n 'w-(--anchor-width) max-w-(--available-width) p-2',\n classNames?.popup, //\n )}\n >\n <PopoverTitle className=\"sr-only\">{popupLabel}</PopoverTitle>\n <Tree\n ref={tree}\n nodes={nodes}\n selectedKeys={selected === null ? [] : [selected]}\n onSelect={keys => select(keys[0] ?? null)}\n expandedKeys={expanded}\n onExpand={keys => {\n if (expandedKeys === undefined) setInternalExpanded(keys);\n onExpand?.(keys);\n }}\n emptyText={emptyText}\n aria-label={popupLabel}\n dir={resolvedDirection}\n className={cn(\n 'max-h-[min(20rem,var(--available-height))] overflow-y-auto',\n classNames?.tree, //\n )}\n classNames={classNames?.nodes}\n />\n </PopoverContent>\n </Popover>\n {allowClear && selected !== null && (\n <Button\n variant=\"text\"\n size=\"small\"\n disabled={disabled}\n aria-label={clearLabel ?? locale.clear ?? DEFAULT_LOCALE.clear}\n onClick={() => {\n select(null);\n trigger.current?.focus();\n }}\n className={cn(\n 'size-8 shrink-0 p-0',\n classNames?.clear, //\n )}\n >\n <X aria-hidden=\"true\" className=\"size-4\" />\n </Button>\n )}\n </div>\n </DirectionProvider>\n );\n};\n\nexport default TreeSelect;\n"],"mappings":";;;;;;;;;;;AAqDA,MAAM,cAAc,EAClB,OACA,OACA,eAAe,MACf,UACA,cACA,sBAAsB,CAAC,GACvB,UACA,MACA,cAAc,OACd,cACA,aAAa,MACb,YACA,cAAc,iBACd,aAAa,iBACb,YAAY,YACZ,WACA,MACA,MACA,WAAW,OACX,WACA,YACA,KACA,KACA,WACA,GAAG,YACQ;CACX,MAAM,EAAE,WAAW,WAAW,UAAU;CACxC,MAAM,oBAAoB,QAAQ,SAAS,QAAQ,QAAQ,MAAM;CACjE,MAAM,CAAC,eAAe,oBAAoB,SAAS,YAAY;CAC/D,MAAM,CAAC,cAAc,mBAAmB,SAAS,WAAW;CAC5D,MAAM,CAAC,kBAAkB,uBACvB,SAA4B,mBAAmB;CACjD,MAAM,WAAW,UAAU,KAAA,IAAY,gBAAgB;CACvD,MAAM,UAAU,QAAQ,iBAAiB,CAAC;CAC1C,MAAM,WAAW,gBAAgB;CACjC,MAAM,OAAO,OAAyB,IAAI;CAC1C,MAAM,UAAU,OAA0B,IAAI;CAC9C,oBAAoB,WAAW,QAAQ,SAAU,CAAC,CAAC;CACnD,MAAM,EAAE,SAAS,gBAAgB,gBAAgB,iBAAiBA;CAClE,MAAM,0BAAU,IAAI,IAAiD;CACrE,MAAM,SAAS,MAAuB,eAAwB;EAC5D,KAAK,MAAM,QAAQ,MAAM;GACvB,MAAM,QAAQ;IAAE;IAAM,YAAY,cAAc,CAAC,CAAC,KAAK;GAAS;GAChE,QAAQ,IAAI,KAAK,KAAK,KAAK;GAC3B,MAAM,KAAK,YAAY,CAAC,GAAG,MAAM,UAAU;EAC7C;CACF;CAEA,MAAM,OAAO,QAAQ;CAErB,MAAM,cAAc,SAAkB;EACpC,IAAI,YAAY,MAAM;EACtB,IAAI,SAAS,KAAA,GAAW,gBAAgB,IAAI;EAC5C,IAAI,SAAS,QAAQ,eAAe,IAAI;CAC1C;CACA,MAAM,UAAU,SAAwB;EACtC,MAAM,QAAQ,SAAS,OAAO,OAAO,QAAQ,IAAI,IAAI;EAErD,IAAI,YAAa,SAAS,SAAS,CAAC,SAAS,MAAM,aAAc;EACjE,IAAI,UAAU,KAAA,GAAW,iBAAiB,IAAI;EAC9C,IAAI,SAAS,UAAU,WAAW,MAAM,OAAO,QAAQ,IAAI;EAE3D,WAAW,KAAK;CAClB;CAEA,OACE,oBAAC,mBAAD;EAAmB,WAAW;EAC5B,UAAA,qBAAC,OAAD;GACE,aAAU;GACV,KAAK;GACL,WAAW,GACT,0CACA,SACF;GANF,UAAA;IAQG,QACC,oBAAC,SAAD;KACE,MAAK;KACC;KACA;KACI;KACV,OAAO,YAAY;IACpB,CAAA;IAEH,qBAAC,SAAD;KAAS,MAAM;KAAQ,cAAc;KAArC,UAAA,CACE,qBAAC,gBAAD;MACE,GAAI;MACJ,KAAK;MACK;MACV,QAAQ,oBAAC,QAAD,EAAQ,SAAQ,WAAY,CAAA;MACpC,WAAW,GACT,iDACA,YAAY,OACd;MACA,YAAW,UAAS;OAClB,YAAY,KAAK;OAEjB,IACE,CAAC,MAAM,qBACN,MAAM,QAAQ,eAAe,MAAM,QAAQ,YAC5C;QACA,MAAM,eAAe;QACrB,WAAW,IAAI;OACjB;MACF;MAnBF,UAAA,CAqBE,oBAAC,QAAD;OACE,WAAW,GACT,oBACA,aAAa,QAAQ,yBACrB,YAAY,KACd;OAEC,UAAA,aAAa,OACV,cACC,QAAQ,IAAI,QAAQ,CAAC,EAAE,KAAK,SAAS;MACtC,CAAA,GACN,oBAAC,aAAD;OAAa,eAAY;OAAO,WAAU;MAAmB,CAAA,CAC/C;KAChB,CAAA,GAAA,qBAAC,gBAAD;MACa;MACX,KAAK;MACL,OAAM;MACN,oBACE,KAAK,SAAS,cACZ,6CACF,KACA,KAAK,SAAS,cACZ,qCACF,KACA;MAEF,WAAW,GACT,oDACA,YAAY,KACd;MAhBF,UAAA,CAkBE,oBAAC,cAAD;OAAc,WAAU;OAAW,UAAA;MAAyB,CAAA,GAC5D,oBAAC,MAAD;OACE,KAAK;OACE;OACP,cAAc,aAAa,OAAO,CAAC,IAAI,CAAC,QAAQ;OAChD,WAAU,SAAQ,OAAO,KAAK,MAAM,IAAI;OACxC,cAAc;OACd,WAAU,SAAQ;QAChB,IAAI,iBAAiB,KAAA,GAAW,oBAAoB,IAAI;QACxD,WAAW,IAAI;OACjB;OACW;OACX,cAAY;OACZ,KAAK;OACL,WAAW,GACT,8DACA,YAAY,IACd;OACA,YAAY,YAAY;MACzB,CAAA,CACa;KACT,CAAA,CAAA;;IACR,cAAc,aAAa,QAC1B,oBAAC,QAAD;KACE,SAAQ;KACR,MAAK;KACK;KACV,cAAY,cAAc,OAAO,SAAS,eAAe;KACzD,eAAe;MACb,OAAO,IAAI;MACX,QAAQ,SAAS,MAAM;KACzB;KACA,WAAW,GACT,uBACA,YAAY,KACd;KAEA,UAAA,oBAAC,GAAD;MAAG,eAAY;MAAO,WAAU;KAAU,CAAA;IACpC,CAAA;GAEP;;CACY,CAAA;AAEvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Typography.d.mts","names":[],"sources":["../src/components/atoms/typography/index.ts"],"mappings":";;;;;;KAMK,
|
|
1
|
+
{"version":3,"file":"Typography.d.mts","names":["TypographyImpl"],"sources":["../src/components/atoms/typography/index.ts"],"mappings":";;;;;;KAMK,6BAA6BA;EAChC,aAAa;EACb,kBAAkB;EAClB,aAAa;EACb,cAAc;;cAGV,YAA+B"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { OptionValue } from "../option-group.mjs";
|
|
2
2
|
//#region src/components/atoms/checkbox/checkbox.d.ts
|
|
3
|
-
interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {
|
|
3
|
+
export interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {
|
|
4
4
|
placement?: 'left' | 'right';
|
|
5
5
|
defaultChecked?: boolean;
|
|
6
6
|
checked?: boolean;
|
|
7
|
+
indeterminate?: boolean;
|
|
7
8
|
value?: OptionValue;
|
|
8
9
|
/** Native form field name — participates in `FormData` when set. */
|
|
9
10
|
name?: string;
|
|
@@ -11,11 +12,12 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'>
|
|
|
11
12
|
icons?: Partial<{
|
|
12
13
|
checked: React.ReactNode;
|
|
13
14
|
unchecked: React.ReactNode;
|
|
15
|
+
indeterminate: React.ReactNode;
|
|
14
16
|
}>;
|
|
15
17
|
children?: React.ReactNode;
|
|
16
18
|
onChange?: (checked: boolean) => void;
|
|
17
19
|
}
|
|
18
|
-
declare const Checkbox: ({ placement, value: _value, children, className, icons, disabled, defaultChecked, checked: _checked, name, onChange: _onChange, ...props }: Props) => import("react").JSX.Element;
|
|
20
|
+
declare const Checkbox: ({ placement, value: _value, children, className, icons, disabled, indeterminate, defaultChecked, checked: _checked, name, onChange: _onChange, ...props }: Props) => import("react").JSX.Element;
|
|
19
21
|
//#endregion
|
|
20
|
-
export {
|
|
22
|
+
export { Checkbox as default };
|
|
21
23
|
//# sourceMappingURL=checkbox.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.mts","names":[],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"checkbox.d.mts","names":[],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"mappings":";;iBAeiB,cAAc,KAC7B,MAAM;EAGN;EACA;EACA;EACA;EACA,QAAQ;;EAER;EACA;EACA,QAAQ;IACN,SAAS,MAAM;IACf,WAAW,MAAM;IACjB,eAAe,MAAM;;EAEvB,WAAW,MAAM;EACjB,YAAY;;cAGR,aAAY,WAAA,OAAA,QAAA,UAAA,WAAA,OAAA,UAAA,eAAA,gBAAA,SAAA,UAAA,MAAA,UAAA,cAAA,SAaf,0BAAK,IAAA"}
|
|
@@ -3,13 +3,13 @@ import { cn } from "../../../utils.mjs";
|
|
|
3
3
|
import { checkbox_exports } from "../../../core/checkbox.mjs";
|
|
4
4
|
import { label_exports } from "../../../core/label.mjs";
|
|
5
5
|
import { useId, useRef } from "react";
|
|
6
|
-
import { Square, SquareCheck } from "lucide-react";
|
|
7
6
|
import { useControllableState, useKeyPress } from "@jbpark/use-hooks";
|
|
8
7
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
+
import { Square, SquareCheck, SquareMinus } from "lucide-react";
|
|
9
9
|
//#region src/components/atoms/checkbox/checkbox.tsx
|
|
10
10
|
const { Checkbox: CoreCheckbox } = checkbox_exports;
|
|
11
11
|
const { Label: CoreLabel } = label_exports;
|
|
12
|
-
const Checkbox = ({ placement = "left", value: _value = "", children, className, icons, disabled, defaultChecked, checked: _checked, name, onChange: _onChange = () => {}, ...props }) => {
|
|
12
|
+
const Checkbox = ({ placement = "left", value: _value = "", children, className, icons, disabled, indeterminate = false, defaultChecked, checked: _checked, name, onChange: _onChange = () => {}, ...props }) => {
|
|
13
13
|
const [checked, setChecked] = useControllableState({
|
|
14
14
|
value: _checked,
|
|
15
15
|
defaultValue: defaultChecked ?? false,
|
|
@@ -32,6 +32,9 @@ const Checkbox = ({ placement = "left", value: _value = "", children, className,
|
|
|
32
32
|
});
|
|
33
33
|
const renderContent = icons ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
34
34
|
/* @__PURE__ */ jsx("input", {
|
|
35
|
+
ref: (element) => {
|
|
36
|
+
if (element) element.indeterminate = indeterminate;
|
|
37
|
+
},
|
|
35
38
|
id,
|
|
36
39
|
hidden: true,
|
|
37
40
|
type: "checkbox",
|
|
@@ -46,14 +49,14 @@ const Checkbox = ({ placement = "left", value: _value = "", children, className,
|
|
|
46
49
|
/* @__PURE__ */ jsx("span", {
|
|
47
50
|
ref: iconTriggerRef,
|
|
48
51
|
role: "checkbox",
|
|
49
|
-
"aria-checked": checked,
|
|
52
|
+
"aria-checked": indeterminate ? "mixed" : checked,
|
|
50
53
|
"aria-disabled": disabled,
|
|
51
54
|
tabIndex: disabled ? -1 : 0,
|
|
52
55
|
className: cn(cursorClassName, disabled && "opacity-50"),
|
|
53
56
|
onClick: () => {
|
|
54
57
|
onChange(!checked);
|
|
55
58
|
},
|
|
56
|
-
children: checked ? icons.checked ?? /* @__PURE__ */ jsx(SquareCheck, {}) : icons.unchecked ?? /* @__PURE__ */ jsx(Square, {})
|
|
59
|
+
children: indeterminate ? icons.indeterminate ?? /* @__PURE__ */ jsx(SquareMinus, {}) : checked ? icons.checked ?? /* @__PURE__ */ jsx(SquareCheck, {}) : icons.unchecked ?? /* @__PURE__ */ jsx(Square, {})
|
|
57
60
|
}),
|
|
58
61
|
children && /* @__PURE__ */ jsx("label", {
|
|
59
62
|
className: cn(cursorClassName, disabled && "opacity-50"),
|
|
@@ -65,6 +68,7 @@ const Checkbox = ({ placement = "left", value: _value = "", children, className,
|
|
|
65
68
|
name,
|
|
66
69
|
value: itemValue,
|
|
67
70
|
checked,
|
|
71
|
+
indeterminate,
|
|
68
72
|
disabled,
|
|
69
73
|
className: cn("rounded-sm", cursorClassName),
|
|
70
74
|
onCheckedChange: onChange
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.mjs","names":["checkbox","label"],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useRef } from 'react';\n\nimport { useControllableState, useKeyPress } from '@jbpark/use-hooks';\nimport { Square, SquareCheck } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { checkbox, label } from '../../../core';\nimport { type OptionValue } from './group';\n\nconst { Checkbox: CoreCheckbox } = checkbox;\nconst { Label: CoreLabel } = label;\n\nexport interface Props extends Omit<\n React.ComponentPropsWithoutRef<'div'>,\n 'onChange'\n> {\n placement?: 'left' | 'right';\n defaultChecked?: boolean;\n checked?: boolean;\n value?: OptionValue;\n /** Native form field name — participates in `FormData` when set. */\n name?: string;\n disabled?: boolean;\n icons?: Partial<{
|
|
1
|
+
{"version":3,"file":"checkbox.mjs","names":["checkbox","label"],"sources":["../../../../src/components/atoms/checkbox/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useRef } from 'react';\n\nimport { useControllableState, useKeyPress } from '@jbpark/use-hooks';\nimport { Square, SquareCheck, SquareMinus } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { checkbox, label } from '../../../core';\nimport { type OptionValue } from './group';\n\nconst { Checkbox: CoreCheckbox } = checkbox;\nconst { Label: CoreLabel } = label;\n\nexport interface Props extends Omit<\n React.ComponentPropsWithoutRef<'div'>,\n 'onChange'\n> {\n placement?: 'left' | 'right';\n defaultChecked?: boolean;\n checked?: boolean;\n indeterminate?: boolean;\n value?: OptionValue;\n /** Native form field name — participates in `FormData` when set. */\n name?: string;\n disabled?: boolean;\n icons?: Partial<{\n checked: React.ReactNode;\n unchecked: React.ReactNode;\n indeterminate: React.ReactNode;\n }>;\n children?: React.ReactNode;\n onChange?: (checked: boolean) => void;\n}\n\nconst Checkbox = ({\n placement = 'left',\n value: _value = '',\n children,\n className,\n icons,\n disabled,\n indeterminate = false,\n defaultChecked,\n checked: _checked,\n name,\n onChange: _onChange = () => {},\n ...props\n}: Props) => {\n const [checked, setChecked] = useControllableState<boolean>({\n value: _checked,\n defaultValue: defaultChecked ?? false,\n onChange: _onChange,\n });\n\n const id = useId();\n const itemValue = String(_value);\n\n const cursorClassName = disabled ? 'cursor-not-allowed' : 'cursor-pointer';\n\n const onChange = (next: boolean) => {\n if (disabled) {\n return;\n }\n\n setChecked(next);\n };\n\n const iconTriggerRef = useRef<HTMLSpanElement>(null);\n\n useKeyPress(\n ['Enter', 'space'],\n event => {\n event.preventDefault();\n onChange(!checked);\n },\n { target: iconTriggerRef, enabled: !!icons && !disabled },\n );\n\n const renderContent = icons ? (\n <>\n <input\n ref={element => {\n if (element) element.indeterminate = indeterminate;\n }}\n id={id}\n hidden\n type=\"checkbox\"\n name={name}\n value={itemValue}\n checked={checked}\n disabled={disabled}\n onChange={e => {\n onChange(e.target.checked);\n }}\n />\n <span\n ref={iconTriggerRef}\n role=\"checkbox\"\n aria-checked={indeterminate ? 'mixed' : checked}\n aria-disabled={disabled}\n tabIndex={disabled ? -1 : 0}\n className={cn(cursorClassName, disabled && 'opacity-50')}\n onClick={() => {\n onChange(!checked);\n }}\n >\n {indeterminate\n ? (icons.indeterminate ?? <SquareMinus />)\n : checked\n ? (icons.checked ?? <SquareCheck />)\n : (icons.unchecked ?? <Square />)}\n </span>\n {children && (\n <label\n className={cn(cursorClassName, disabled && 'opacity-50')}\n htmlFor={id}\n >\n {children}\n </label>\n )}\n </>\n ) : (\n <>\n <CoreCheckbox\n id={id}\n name={name}\n value={itemValue}\n checked={checked}\n indeterminate={indeterminate}\n disabled={disabled}\n // Keep the atom's established 4px radius after the Base UI migration;\n // tailwind-merge lets this override the core primitive's radius (#361).\n className={cn('rounded-sm', cursorClassName)}\n onCheckedChange={onChange}\n />\n {children && (\n <CoreLabel htmlFor={id} className={cn(cursorClassName, 'text-left')}>\n {children}\n </CoreLabel>\n )}\n </>\n );\n\n return (\n <div\n data-slot=\"checkbox-field\"\n className={cn(\n 'flex items-center gap-x-2',\n placement === 'right' && 'flex-row-reverse',\n cursorClassName,\n className,\n //\n )}\n {...props}\n >\n {renderContent}\n </div>\n );\n};\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;AAYA,MAAM,EAAE,UAAU,iBAAiBA;AACnC,MAAM,EAAE,OAAO,cAAcC;AAuB7B,MAAM,YAAY,EAChB,YAAY,QACZ,OAAO,SAAS,IAChB,UACA,WACA,OACA,UACA,gBAAgB,OAChB,gBACA,SAAS,UACT,MACA,UAAU,kBAAkB,CAAC,GAC7B,GAAG,YACQ;CACX,MAAM,CAAC,SAAS,cAAc,qBAA8B;EAC1D,OAAO;EACP,cAAc,kBAAkB;EAChC,UAAU;CACZ,CAAC;CAED,MAAM,KAAK,MAAM;CACjB,MAAM,YAAY,OAAO,MAAM;CAE/B,MAAM,kBAAkB,WAAW,uBAAuB;CAE1D,MAAM,YAAY,SAAkB;EAClC,IAAI,UACF;EAGF,WAAW,IAAI;CACjB;CAEA,MAAM,iBAAiB,OAAwB,IAAI;CAEnD,YACE,CAAC,SAAS,OAAO,IACjB,UAAS;EACP,MAAM,eAAe;EACrB,SAAS,CAAC,OAAO;CACnB,GACA;EAAE,QAAQ;EAAgB,SAAS,CAAC,CAAC,SAAS,CAAC;CAAS,CAC1D;CAEA,MAAM,gBAAgB,QACpB,qBAAA,YAAA,EAAA,UAAA;EACE,oBAAC,SAAD;GACE,MAAK,YAAW;IACd,IAAI,SAAS,QAAQ,gBAAgB;GACvC;GACI;GACJ,QAAA;GACA,MAAK;GACC;GACN,OAAO;GACE;GACC;GACV,WAAU,MAAK;IACb,SAAS,EAAE,OAAO,OAAO;GAC3B;EACD,CAAA;EACD,oBAAC,QAAD;GACE,KAAK;GACL,MAAK;GACL,gBAAc,gBAAgB,UAAU;GACxC,iBAAe;GACf,UAAU,WAAW,KAAK;GAC1B,WAAW,GAAG,iBAAiB,YAAY,YAAY;GACvD,eAAe;IACb,SAAS,CAAC,OAAO;GACnB;GAEC,UAAA,gBACI,MAAM,iBAAiB,oBAAC,aAAD,CAAc,CAAA,IACtC,UACG,MAAM,WAAW,oBAAC,aAAD,CAAc,CAAA,IAC/B,MAAM,aAAa,oBAAC,QAAD,CAAS,CAAA;EAC/B,CAAA;EACL,YACC,oBAAC,SAAD;GACE,WAAW,GAAG,iBAAiB,YAAY,YAAY;GACvD,SAAS;GAER;EACI,CAAA;CAET,EAAA,CAAA,IAEF,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,cAAD;EACM;EACE;EACN,OAAO;EACE;EACM;EACL;EAGV,WAAW,GAAG,cAAc,eAAe;EAC3C,iBAAiB;CAClB,CAAA,GACA,YACC,oBAAC,WAAD;EAAW,SAAS;EAAI,WAAW,GAAG,iBAAiB,WAAW;EAC/D;CACQ,CAAA,CAEb,EAAA,CAAA;CAGJ,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,6BACA,cAAc,WAAW,oBACzB,iBACA,SAEF;EACA,GAAI;EAEH,UAAA;CACE,CAAA;AAET"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { OptionGroupClassNames, OptionValue, Options } from "../option-group.mjs";
|
|
2
2
|
//#region src/components/atoms/checkbox/group.d.ts
|
|
3
|
-
interface Props extends Omit<React.ComponentPropsWithoutRef<'ul'>, 'onChange' | 'defaultValue' | 'value'> {
|
|
3
|
+
export interface Props extends Omit<React.ComponentPropsWithoutRef<'ul'>, 'onChange' | 'defaultValue' | 'value'> {
|
|
4
4
|
options?: Options;
|
|
5
5
|
orientation?: 'vertical' | 'horizontal';
|
|
6
6
|
placement?: 'left' | 'right';
|
|
@@ -14,5 +14,5 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'ul'>, 'onChange' |
|
|
|
14
14
|
}
|
|
15
15
|
declare const Group: ({ orientation, placement, className, classNames, options: _options, name, disabled, defaultValue, value: _value, onChange: _onChange, ...props }: Props) => import("react").JSX.Element;
|
|
16
16
|
//#endregion
|
|
17
|
-
export { type OptionValue,
|
|
17
|
+
export { type OptionValue, Group as default };
|
|
18
18
|
//# sourceMappingURL=group.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"group.d.mts","names":[],"sources":["../../../../src/components/atoms/checkbox/group.tsx"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"group.d.mts","names":[],"sources":["../../../../src/components/atoms/checkbox/group.tsx"],"mappings":";;iBAkBiB,cAAc,KAC7B,MAAM;EAGN,UAAU;EACV;EACA;EACA,aAAa;EACb,eAAe;EACf,QAAQ;;EAER;EACA;EACA,YAAY,QAAQ;;cAGhB,UAAS,aAAA,WAAA,WAAA,YAAA,SAAA,UAAA,MAAA,UAAA,cAAA,OAAA,QAAA,UAAA,cAAA,SAYZ,0BAAK,IAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/checkbox/index.ts"],"mappings":";;;KAGK,
|
|
1
|
+
{"version":3,"file":"index.d.mts","names":["CheckboxImpl"],"sources":["../../../../src/components/atoms/checkbox/index.ts"],"mappings":";;;KAGK,2BAA2BA;EAAiB,cAAc;;cAEzD,UAA2B"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
//#region src/components/atoms/color-picker.d.ts
|
|
2
|
-
interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange' | 'defaultValue' | 'value' | 'onClick' | 'onKeyDown' | 'open'> {
|
|
2
|
+
export interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange' | 'defaultValue' | 'value' | 'onClick' | 'onKeyDown' | 'open'> {
|
|
3
3
|
defaultValue?: string;
|
|
4
4
|
value?: string;
|
|
5
5
|
showText?: boolean;
|
|
@@ -11,5 +11,5 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange' |
|
|
|
11
11
|
}
|
|
12
12
|
declare const ColorPicker: ({ defaultValue, value: _value, showText, disabled, className, onChange: _onChange, open: _open, defaultOpen, onOpenChange, ...props }: Props) => import("react").JSX.Element;
|
|
13
13
|
//#endregion
|
|
14
|
-
export {
|
|
14
|
+
export { ColorPicker as default };
|
|
15
15
|
//# sourceMappingURL=color-picker.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"color-picker.d.mts","names":[],"sources":["../../../src/components/atoms/color-picker.tsx"],"mappings":";
|
|
1
|
+
{"version":3,"file":"color-picker.d.mts","names":[],"sources":["../../../src/components/atoms/color-picker.tsx"],"mappings":";iBAUiB,cAAc,KAC7B,MAAM;EAGN;EACA;EACA;EACA;EACA,YAAY;EACZ;EACA;EACA,gBAAgB;;cAGZ,gBAAe,cAAA,OAAA,QAAA,UAAA,UAAA,WAAA,UAAA,WAAA,MAAA,OAAA,aAAA,iBAAA,SAWlB,0BAAK,IAAA"}
|
|
@@ -5,9 +5,13 @@ interface Props {
|
|
|
5
5
|
placeholder?: string;
|
|
6
6
|
className?: string;
|
|
7
7
|
disabled?: boolean;
|
|
8
|
+
/** Pick a local date and time together. Optionally configure the minute interval. */
|
|
9
|
+
showTime?: boolean | {
|
|
10
|
+
minuteStep?: number;
|
|
11
|
+
};
|
|
8
12
|
onChange?: (date: Date | undefined) => void;
|
|
9
13
|
}
|
|
10
|
-
declare const DatePicker: ({ defaultValue, value: _value, placeholder, className, disabled, onChange: _onChange }: Props) => import("react").JSX.Element;
|
|
14
|
+
declare const DatePicker: ({ defaultValue, value: _value, placeholder, className, disabled, showTime, onChange: _onChange }: Props) => import("react").JSX.Element;
|
|
11
15
|
//#endregion
|
|
12
16
|
export { type Props, DatePicker as default };
|
|
13
17
|
//# sourceMappingURL=date-picker.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker.d.mts","names":[],"sources":["../../../src/components/atoms/date-picker.tsx"],"mappings":";
|
|
1
|
+
{"version":3,"file":"date-picker.d.mts","names":[],"sources":["../../../src/components/atoms/date-picker.tsx"],"mappings":";UAiBU;EACR,eAAe;EACf,QAAQ;EACR;EACA;EACA;;EAEA;IAAuB;;EACvB,YAAY,MAAM;;cAQd,eAAc,cAAA,OAAA,QAAA,aAAA,WAAA,UAAA,UAAA,UAAA,aAQjB,0BAAK,IAAA"}
|
|
@@ -3,38 +3,82 @@ import { cn } from "../../utils.mjs";
|
|
|
3
3
|
import { calendar_exports } from "../../core/calendar.mjs";
|
|
4
4
|
import Button from "../../Button.mjs";
|
|
5
5
|
import Popover from "./popover.mjs";
|
|
6
|
+
import TimePicker from "../../TimePicker.mjs";
|
|
6
7
|
import { useState } from "react";
|
|
7
|
-
import { CalendarIcon } from "lucide-react";
|
|
8
8
|
import { useControllableState } from "@jbpark/use-hooks";
|
|
9
|
-
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
+
import { CalendarIcon } from "lucide-react";
|
|
10
11
|
import { format } from "date-fns";
|
|
11
12
|
//#region src/components/atoms/date-picker.tsx
|
|
12
13
|
const { Calendar } = calendar_exports;
|
|
13
|
-
const
|
|
14
|
+
const toTimeValue = (date) => date ? `${String(date.getHours()).padStart(2, "0")}:${String(date.getMinutes()).padStart(2, "0")}` : "00:00";
|
|
15
|
+
const DatePicker = ({ defaultValue, value: _value, placeholder = "Pick a date", className, disabled, showTime = false, onChange: _onChange = () => {} }) => {
|
|
14
16
|
const [value, onChange] = useControllableState({
|
|
15
17
|
value: _value,
|
|
16
18
|
defaultValue,
|
|
17
19
|
onChange: _onChange
|
|
18
20
|
});
|
|
19
21
|
const [open, setOpen] = useState(false);
|
|
22
|
+
const [draftDate, setDraftDate] = useState(value);
|
|
23
|
+
const [draftTime, setDraftTime] = useState(toTimeValue(value));
|
|
24
|
+
const minuteStep = typeof showTime === "object" ? showTime.minuteStep : void 0;
|
|
25
|
+
const handleOpenChange = (nextOpen) => {
|
|
26
|
+
if (nextOpen && showTime) {
|
|
27
|
+
setDraftDate(value);
|
|
28
|
+
setDraftTime(toTimeValue(value));
|
|
29
|
+
}
|
|
30
|
+
setOpen(nextOpen);
|
|
31
|
+
};
|
|
32
|
+
const handleConfirm = () => {
|
|
33
|
+
if (!draftDate || !draftTime) return;
|
|
34
|
+
const [hours, minutes] = draftTime.split(":").map(Number);
|
|
35
|
+
onChange(new Date(draftDate.getFullYear(), draftDate.getMonth(), draftDate.getDate(), hours, minutes));
|
|
36
|
+
setOpen(false);
|
|
37
|
+
};
|
|
20
38
|
return /* @__PURE__ */ jsx(Popover, {
|
|
21
39
|
placement: "bottomLeft",
|
|
22
40
|
open,
|
|
23
|
-
onOpenChange:
|
|
24
|
-
content: /* @__PURE__ */ jsx(Calendar, {
|
|
41
|
+
onOpenChange: handleOpenChange,
|
|
42
|
+
content: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Calendar, {
|
|
25
43
|
mode: "single",
|
|
26
|
-
selected: value,
|
|
44
|
+
selected: showTime ? draftDate : value,
|
|
27
45
|
onSelect: (date) => {
|
|
28
|
-
|
|
29
|
-
|
|
46
|
+
if (showTime) setDraftDate(date);
|
|
47
|
+
else {
|
|
48
|
+
onChange(date);
|
|
49
|
+
setOpen(false);
|
|
50
|
+
}
|
|
30
51
|
}
|
|
31
|
-
}),
|
|
52
|
+
}), showTime && /* @__PURE__ */ jsxs("div", {
|
|
53
|
+
className: "border-border flex flex-col gap-3 border-t p-3",
|
|
54
|
+
children: [/* @__PURE__ */ jsx(TimePicker, {
|
|
55
|
+
label: "Time",
|
|
56
|
+
value: draftTime,
|
|
57
|
+
onChange: (time) => setDraftTime(time ?? ""),
|
|
58
|
+
minuteStep,
|
|
59
|
+
allowClear: false,
|
|
60
|
+
size: "small"
|
|
61
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
62
|
+
className: "flex justify-end gap-2",
|
|
63
|
+
children: [/* @__PURE__ */ jsx(Button, {
|
|
64
|
+
size: "small",
|
|
65
|
+
onClick: () => setOpen(false),
|
|
66
|
+
children: "Cancel"
|
|
67
|
+
}), /* @__PURE__ */ jsx(Button, {
|
|
68
|
+
type: "primary",
|
|
69
|
+
size: "small",
|
|
70
|
+
disabled: !draftDate || !draftTime,
|
|
71
|
+
onClick: handleConfirm,
|
|
72
|
+
children: "OK"
|
|
73
|
+
})]
|
|
74
|
+
})]
|
|
75
|
+
})] }),
|
|
32
76
|
children: /* @__PURE__ */ jsx(Button, {
|
|
33
77
|
icon: /* @__PURE__ */ jsx(CalendarIcon, {}),
|
|
34
78
|
"data-empty": !value,
|
|
35
79
|
disabled,
|
|
36
80
|
className: cn("w-full justify-start text-left font-normal", "data-[empty=true]:text-muted-foreground", className),
|
|
37
|
-
children: value ? format(value, "PPP") : placeholder
|
|
81
|
+
children: value ? format(value, showTime ? "PPP HH:mm" : "PPP") : placeholder
|
|
38
82
|
})
|
|
39
83
|
});
|
|
40
84
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker.mjs","names":["calendar"],"sources":["../../../src/components/atoms/date-picker.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\n\nimport { useControllableState } from '@jbpark/use-hooks';\nimport { format } from 'date-fns';\nimport { CalendarIcon } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { calendar } from '../../core';\nimport Button from './button';\nimport Popover from './popover';\n\nconst { Calendar } = calendar;\n\ninterface Props {\n defaultValue?: Date;\n value?: Date;\n placeholder?: string;\n className?: string;\n disabled?: boolean;\n onChange?: (date: Date | undefined) => void;\n}\n\nconst DatePicker = ({\n defaultValue,\n value: _value,\n placeholder = 'Pick a date',\n className,\n disabled,\n onChange: _onChange = () => {},\n}: Props) => {\n const [value, onChange] = useControllableState<Date | undefined>({\n value: _value,\n defaultValue,\n onChange: _onChange,\n });\n const [open, setOpen] = useState(false);\n\n return (\n <Popover\n placement=\"bottomLeft\"\n open={open}\n onOpenChange={
|
|
1
|
+
{"version":3,"file":"date-picker.mjs","names":["calendar"],"sources":["../../../src/components/atoms/date-picker.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\n\nimport { useControllableState } from '@jbpark/use-hooks';\nimport { format } from 'date-fns';\nimport { CalendarIcon } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { calendar } from '../../core';\nimport Button from './button';\nimport Popover from './popover';\nimport TimePicker from './time-picker';\n\nconst { Calendar } = calendar;\n\ninterface Props {\n defaultValue?: Date;\n value?: Date;\n placeholder?: string;\n className?: string;\n disabled?: boolean;\n /** Pick a local date and time together. Optionally configure the minute interval. */\n showTime?: boolean | { minuteStep?: number };\n onChange?: (date: Date | undefined) => void;\n}\n\nconst toTimeValue = (date?: Date) =>\n date\n ? `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`\n : '00:00';\n\nconst DatePicker = ({\n defaultValue,\n value: _value,\n placeholder = 'Pick a date',\n className,\n disabled,\n showTime = false,\n onChange: _onChange = () => {},\n}: Props) => {\n const [value, onChange] = useControllableState<Date | undefined>({\n value: _value,\n defaultValue,\n onChange: _onChange,\n });\n const [open, setOpen] = useState(false);\n const [draftDate, setDraftDate] = useState<Date | undefined>(value);\n const [draftTime, setDraftTime] = useState(toTimeValue(value));\n const minuteStep =\n typeof showTime === 'object' ? showTime.minuteStep : undefined;\n\n const handleOpenChange = (nextOpen: boolean) => {\n if (nextOpen && showTime) {\n setDraftDate(value);\n setDraftTime(toTimeValue(value));\n }\n\n setOpen(nextOpen);\n };\n\n const handleConfirm = () => {\n if (!draftDate || !draftTime) return;\n\n const [hours, minutes] = draftTime.split(':').map(Number);\n\n onChange(\n new Date(\n draftDate.getFullYear(),\n draftDate.getMonth(),\n draftDate.getDate(),\n hours,\n minutes,\n ),\n );\n setOpen(false);\n };\n\n return (\n <Popover\n placement=\"bottomLeft\"\n open={open}\n onOpenChange={handleOpenChange}\n content={\n <>\n <Calendar\n mode=\"single\"\n selected={showTime ? draftDate : value}\n onSelect={date => {\n if (showTime) {\n setDraftDate(date);\n } else {\n onChange(date);\n setOpen(false);\n }\n }}\n />\n {showTime && (\n <div className=\"border-border flex flex-col gap-3 border-t p-3\">\n <TimePicker\n label=\"Time\"\n value={draftTime}\n onChange={time => setDraftTime(time ?? '')}\n minuteStep={minuteStep}\n allowClear={false}\n size=\"small\"\n />\n <div className=\"flex justify-end gap-2\">\n <Button size=\"small\" onClick={() => setOpen(false)}>\n Cancel\n </Button>\n <Button\n type=\"primary\"\n size=\"small\"\n disabled={!draftDate || !draftTime}\n onClick={handleConfirm}\n >\n OK\n </Button>\n </div>\n </div>\n )}\n </>\n }\n >\n <Button\n icon={<CalendarIcon />}\n data-empty={!value}\n disabled={disabled}\n className={cn(\n 'w-full justify-start text-left font-normal',\n 'data-[empty=true]:text-muted-foreground',\n className,\n //\n )}\n >\n {value ? format(value, showTime ? 'PPP HH:mm' : 'PPP') : placeholder}\n </Button>\n </Popover>\n );\n};\n\nexport default DatePicker;\nexport type { Props };\n"],"mappings":";;;;;;;;;;;;AAeA,MAAM,EAAE,aAAaA;AAarB,MAAM,eAAe,SACnB,OACI,GAAG,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG,EAAE,GAAG,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG,MACxF;AAEN,MAAM,cAAc,EAClB,cACA,OAAO,QACP,cAAc,eACd,WACA,UACA,WAAW,OACX,UAAU,kBAAkB,CAAC,QAClB;CACX,MAAM,CAAC,OAAO,YAAY,qBAAuC;EAC/D,OAAO;EACP;EACA,UAAU;CACZ,CAAC;CACD,MAAM,CAAC,MAAM,WAAW,SAAS,KAAK;CACtC,MAAM,CAAC,WAAW,gBAAgB,SAA2B,KAAK;CAClE,MAAM,CAAC,WAAW,gBAAgB,SAAS,YAAY,KAAK,CAAC;CAC7D,MAAM,aACJ,OAAO,aAAa,WAAW,SAAS,aAAa,KAAA;CAEvD,MAAM,oBAAoB,aAAsB;EAC9C,IAAI,YAAY,UAAU;GACxB,aAAa,KAAK;GAClB,aAAa,YAAY,KAAK,CAAC;EACjC;EAEA,QAAQ,QAAQ;CAClB;CAEA,MAAM,sBAAsB;EAC1B,IAAI,CAAC,aAAa,CAAC,WAAW;EAE9B,MAAM,CAAC,OAAO,WAAW,UAAU,MAAM,GAAG,CAAC,CAAC,IAAI,MAAM;EAExD,SACE,IAAI,KACF,UAAU,YAAY,GACtB,UAAU,SAAS,GACnB,UAAU,QAAQ,GAClB,OACA,OACF,CACF;EACA,QAAQ,KAAK;CACf;CAEA,OACE,oBAAC,SAAD;EACE,WAAU;EACJ;EACN,cAAc;EACd,SACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,UAAD;GACE,MAAK;GACL,UAAU,WAAW,YAAY;GACjC,WAAU,SAAQ;IAChB,IAAI,UACF,aAAa,IAAI;SACZ;KACL,SAAS,IAAI;KACb,QAAQ,KAAK;IACf;GACF;EACD,CAAA,GACA,YACC,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACE,oBAAC,YAAD;IACE,OAAM;IACN,OAAO;IACP,WAAU,SAAQ,aAAa,QAAQ,EAAE;IAC7B;IACZ,YAAY;IACZ,MAAK;GACN,CAAA,GACD,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,oBAAC,QAAD;KAAQ,MAAK;KAAQ,eAAe,QAAQ,KAAK;KAAG,UAAA;IAE5C,CAAA,GACR,oBAAC,QAAD;KACE,MAAK;KACL,MAAK;KACL,UAAU,CAAC,aAAa,CAAC;KACzB,SAAS;KACV,UAAA;IAEO,CAAA,CACL;GACF,CAAA,CAAA;EAEP,CAAA,CAAA,EAAA,CAAA;EAGJ,UAAA,oBAAC,QAAD;GACE,MAAM,oBAAC,cAAD,CAAe,CAAA;GACrB,cAAY,CAAC;GACH;GACV,WAAW,GACT,8CACA,2CACA,SAEF;GAEC,UAAA,QAAQ,OAAO,OAAO,WAAW,cAAc,KAAK,IAAI;EACnD,CAAA;CACD,CAAA;AAEb"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { Props as Props$1 } from "../../../Button.mjs";
|
|
2
2
|
import { MouseEvent } from "react";
|
|
3
3
|
//#region src/components/atoms/float-button/back-top.d.ts
|
|
4
|
-
interface Props extends Props$1 {
|
|
4
|
+
export interface Props extends Props$1 {
|
|
5
5
|
visibilityHeight?: number;
|
|
6
6
|
onClick?: (e: MouseEvent<HTMLElement>) => void;
|
|
7
7
|
}
|
|
8
8
|
declare const BackTop: ({ ref, visibilityHeight, className, onClick, ...props }: Props) => import("react").JSX.Element;
|
|
9
9
|
//#endregion
|
|
10
|
-
export {
|
|
10
|
+
export { BackTop as default };
|
|
11
11
|
//# sourceMappingURL=back-top.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"back-top.d.mts","names":[],"sources":["../../../../src/components/atoms/float-button/back-top.tsx"],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"back-top.d.mts","names":["ButtonProps"],"sources":["../../../../src/components/atoms/float-button/back-top.tsx"],"mappings":";;;iBAaiB,cAAcA;EAC7B;EACA,WAAW,GAAG,WAAW;;cAGrB,YAAW,KAAA,kBAAA,WAAA,YAAA,SAMd,0BAAK,IAAA"}
|
|
@@ -3,9 +3,9 @@ import { cn } from "../../../utils.mjs";
|
|
|
3
3
|
import { DEFAULT_LOCALE, useConfig } from "../../../providers/config/context.mjs";
|
|
4
4
|
import FloatButton from "./float-button.mjs";
|
|
5
5
|
import { useRef } from "react";
|
|
6
|
-
import { ArrowUp } from "lucide-react";
|
|
7
6
|
import { useMergedRef, useWindowScroll } from "@jbpark/use-hooks";
|
|
8
7
|
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
import { ArrowUp } from "lucide-react";
|
|
9
9
|
//#region src/components/atoms/float-button/back-top.tsx
|
|
10
10
|
const BackTop = ({ ref, visibilityHeight = 450, className, onClick, ...props }) => {
|
|
11
11
|
const { locale } = useConfig();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Props as Props$1 } from "../../../Button.mjs";
|
|
2
2
|
//#region src/components/atoms/float-button/float-button.d.ts
|
|
3
|
-
interface Props extends Props$1 {}
|
|
3
|
+
export interface Props extends Props$1 {}
|
|
4
4
|
declare const FloatButton: ({ className, children, ...props }: Props) => import("react").JSX.Element;
|
|
5
5
|
//#endregion
|
|
6
|
-
export {
|
|
6
|
+
export { FloatButton as default };
|
|
7
7
|
//# sourceMappingURL=float-button.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"float-button.d.mts","names":[],"sources":["../../../../src/components/atoms/float-button/float-button.tsx"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"float-button.d.mts","names":["ButtonProps"],"sources":["../../../../src/components/atoms/float-button/float-button.tsx"],"mappings":";;iBAKiB,cAAcA;cAEzB,gBAAe,WAAA,aAAA,SAAmC,0BAAK,IAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/float-button/index.ts"],"mappings":";;;KAGK,
|
|
1
|
+
{"version":3,"file":"index.d.mts","names":["FloatButtonImpl"],"sources":["../../../../src/components/atoms/float-button/index.ts"],"mappings":";;;KAGK,8BAA8BA;EACjC,gBAAgB;;cAGZ,aAAiC"}
|
|
@@ -1,12 +1,23 @@
|
|
|
1
|
+
import AutoComplete, { Option, Props } from "../../AutoComplete.mjs";
|
|
2
|
+
import Avatar, { Props as Props$1 } from "../../Avatar.mjs";
|
|
3
|
+
import Badge, { Props as Props$2 } from "../../Badge.mjs";
|
|
1
4
|
import Button from "../../Button.mjs";
|
|
5
|
+
import Cascader, { Option as Option$1, Props as Props$3 } from "../../Cascader.mjs";
|
|
6
|
+
import Divider, { Props as Props$4 } from "../../Divider.mjs";
|
|
7
|
+
import Mentions, { Option as Option$2, Props as Props$5 } from "../../Mentions.mjs";
|
|
8
|
+
import Rate, { Props as Props$6 } from "../../Rate.mjs";
|
|
9
|
+
import Segmented, { Props as Props$7 } from "../../Segmented.mjs";
|
|
2
10
|
import Tag from "../../Tag.mjs";
|
|
11
|
+
import TimePicker, { Props as Props$8 } from "../../TimePicker.mjs";
|
|
3
12
|
import Typography from "../../Typography.mjs";
|
|
13
|
+
import Popover from "./popover.mjs";
|
|
4
14
|
import Checkbox from "./checkbox/index.mjs";
|
|
5
15
|
import ColorPicker from "./color-picker.mjs";
|
|
6
16
|
import DatePicker from "./date-picker.mjs";
|
|
7
17
|
import FloatButton from "./float-button/index.mjs";
|
|
18
|
+
import { Props as Props$9 } from "./input/number.mjs";
|
|
19
|
+
import { Props as Props$10 } from "./input/otp.mjs";
|
|
8
20
|
import Input from "./input/index.mjs";
|
|
9
|
-
import Popover from "./popover.mjs";
|
|
10
21
|
import Progress from "./progress.mjs";
|
|
11
22
|
import Radio from "./radio/index.mjs";
|
|
12
23
|
import RichTextEditor from "./rich-text-editor/rich-text-editor.mjs";
|
|
@@ -17,4 +28,4 @@ import Slider from "./slider/slider.mjs";
|
|
|
17
28
|
import Spin from "./spin.mjs";
|
|
18
29
|
import Switch from "./switch.mjs";
|
|
19
30
|
import Tooltip from "./tooltip.mjs";
|
|
20
|
-
export { Button, Checkbox, ColorPicker, DatePicker, FloatButton, Input, Popover, Progress, Radio, RichTextEditor, Select, Skeleton, Slider, Spin, Switch, Tag, Tooltip, Typography };
|
|
31
|
+
export { AutoComplete, type Option as AutoCompleteOption, type Props as AutoCompleteProps, Avatar, type Props$1 as AvatarProps, Badge, type Props$2 as BadgeProps, Button, Cascader, type Option$1 as CascaderOption, type Props$3 as CascaderProps, Checkbox, ColorPicker, DatePicker, Divider, type Props$4 as DividerProps, FloatButton, Input, type Props$9 as InputNumberProps, type Props$10 as InputOTPProps, Mentions, type Option$2 as MentionsOption, type Props$5 as MentionsProps, Popover, Progress, Radio, Rate, type Props$6 as RateProps, RichTextEditor, Segmented, type Props$7 as SegmentedProps, Select, Skeleton, Slider, Spin, Switch, Tag, TimePicker, type Props$8 as TimePickerProps, Tooltip, Typography };
|
|
@@ -1,12 +1,16 @@
|
|
|
1
1
|
import Input$1 from "./input.mjs";
|
|
2
|
+
import Number, { Props } from "./number.mjs";
|
|
3
|
+
import OTP, { Props as Props$1 } from "./otp.mjs";
|
|
2
4
|
import Search from "./search.mjs";
|
|
3
5
|
import TextArea from "./text-area.mjs";
|
|
4
6
|
//#region src/components/atoms/input/index.d.ts
|
|
5
7
|
type InputComponent = typeof Input$1 & {
|
|
6
8
|
Search: typeof Search;
|
|
9
|
+
Number: typeof Number;
|
|
10
|
+
OTP: typeof OTP;
|
|
7
11
|
TextArea: typeof TextArea;
|
|
8
12
|
};
|
|
9
13
|
declare const Input: InputComponent;
|
|
10
14
|
//#endregion
|
|
11
|
-
export { Search, TextArea, Input as default };
|
|
15
|
+
export { Number, type Props as NumberProps, OTP, type Props$1 as OTPProps, Search, TextArea, Input as default };
|
|
12
16
|
//# sourceMappingURL=index.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/input/index.ts"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.mts","names":["InputImpl"],"sources":["../../../../src/components/atoms/input/index.ts"],"mappings":";;;;;;KAMK,wBAAwBA;EAC3B,eAAe;EACf,eAAe;EACf,YAAY;EACZ,iBAAiB;;cAGb,OAAqB"}
|
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
import Input$1 from "./input.mjs";
|
|
2
|
+
import Number from "./number.mjs";
|
|
3
|
+
import OTP from "./otp.mjs";
|
|
2
4
|
import Search from "./search.mjs";
|
|
3
5
|
import TextArea from "./text-area.mjs";
|
|
4
6
|
//#region src/components/atoms/input/index.ts
|
|
5
7
|
const Input = Input$1;
|
|
6
8
|
Input.Search = Search;
|
|
9
|
+
Input.Number = Number;
|
|
10
|
+
Input.OTP = OTP;
|
|
7
11
|
Input.TextArea = TextArea;
|
|
8
12
|
//#endregion
|
|
9
|
-
export { Search, TextArea, Input as default };
|
|
13
|
+
export { Number, OTP, Search, TextArea, Input as default };
|
|
10
14
|
|
|
11
15
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":["InputImpl"],"sources":["../../../../src/components/atoms/input/index.ts"],"sourcesContent":["import InputImpl from './input';\nimport Search from './search';\nimport TextArea from './text-area';\n\ntype InputComponent = typeof InputImpl & {\n Search: typeof Search;\n TextArea: typeof TextArea;\n};\n\nconst Input = InputImpl as InputComponent;\n\nInput.Search = Search;\nInput.TextArea = TextArea;\n\nexport { Search, TextArea };\nexport default Input;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","names":["InputImpl"],"sources":["../../../../src/components/atoms/input/index.ts"],"sourcesContent":["import InputImpl from './input';\nimport Number from './number';\nimport OTP from './otp';\nimport Search from './search';\nimport TextArea from './text-area';\n\ntype InputComponent = typeof InputImpl & {\n Search: typeof Search;\n Number: typeof Number;\n OTP: typeof OTP;\n TextArea: typeof TextArea;\n};\n\nconst Input = InputImpl as InputComponent;\n\nInput.Search = Search;\nInput.Number = Number;\nInput.OTP = OTP;\nInput.TextArea = TextArea;\n\nexport { Number, OTP, Search, TextArea };\nexport type { Props as OTPProps } from './otp';\nexport type { Props as NumberProps } from './number';\nexport default Input;\n"],"mappings":";;;;;;AAaA,MAAM,QAAQA;AAEd,MAAM,SAAS;AACf,MAAM,SAAS;AACf,MAAM,MAAM;AACZ,MAAM,WAAW"}
|