@yamada-ui/react 2.2.0-next-20260409094221 → 2.2.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/cjs/components/action-bar/use-action-bar.cjs +2 -1
- package/dist/cjs/components/action-bar/use-action-bar.cjs.map +1 -1
- package/dist/cjs/components/editable/use-editable.cjs +8 -4
- package/dist/cjs/components/editable/use-editable.cjs.map +1 -1
- package/dist/cjs/components/modal/modal.cjs +3 -1
- package/dist/cjs/components/modal/modal.cjs.map +1 -1
- package/dist/cjs/components/modal/use-modal.cjs +4 -2
- package/dist/cjs/components/modal/use-modal.cjs.map +1 -1
- package/dist/cjs/components/sidebar/sidebar.cjs +5 -3
- package/dist/cjs/components/sidebar/sidebar.cjs.map +1 -1
- package/dist/cjs/components/sidebar/use-sidebar.cjs +8 -3
- package/dist/cjs/components/sidebar/use-sidebar.cjs.map +1 -1
- package/dist/cjs/components/tree/tree.cjs +3 -2
- package/dist/cjs/components/tree/tree.cjs.map +1 -1
- package/dist/cjs/components/tree/tree.style.cjs +4 -1
- package/dist/cjs/components/tree/tree.style.cjs.map +1 -1
- package/dist/cjs/components/tree/use-tree.cjs +20 -6
- package/dist/cjs/components/tree/use-tree.cjs.map +1 -1
- package/dist/esm/components/action-bar/use-action-bar.js +2 -1
- package/dist/esm/components/action-bar/use-action-bar.js.map +1 -1
- package/dist/esm/components/editable/use-editable.js +8 -4
- package/dist/esm/components/editable/use-editable.js.map +1 -1
- package/dist/esm/components/modal/modal.js +3 -1
- package/dist/esm/components/modal/modal.js.map +1 -1
- package/dist/esm/components/modal/use-modal.js +4 -2
- package/dist/esm/components/modal/use-modal.js.map +1 -1
- package/dist/esm/components/sidebar/sidebar.js +5 -3
- package/dist/esm/components/sidebar/sidebar.js.map +1 -1
- package/dist/esm/components/sidebar/use-sidebar.js +9 -4
- package/dist/esm/components/sidebar/use-sidebar.js.map +1 -1
- package/dist/esm/components/tree/tree.js +3 -2
- package/dist/esm/components/tree/tree.js.map +1 -1
- package/dist/esm/components/tree/tree.style.js +4 -1
- package/dist/esm/components/tree/tree.style.js.map +1 -1
- package/dist/esm/components/tree/use-tree.js +21 -7
- package/dist/esm/components/tree/use-tree.js.map +1 -1
- package/dist/types/components/accordion/accordion.d.ts +2 -2
- package/dist/types/components/accordion/use-accordion.d.ts +11 -11
- package/dist/types/components/action-bar/action-bar.d.ts +2 -2
- package/dist/types/components/airy/airy.d.ts +2 -2
- package/dist/types/components/alert/alert.d.ts +2 -2
- package/dist/types/components/alert/alert.style.d.ts +1 -1
- package/dist/types/components/alpha-slider/alpha-slider.d.ts +2 -2
- package/dist/types/components/aspect-ratio/aspect-ratio.d.ts +2 -2
- package/dist/types/components/autocomplete/autocomplete.d.ts +2 -2
- package/dist/types/components/autocomplete/autocomplete.style.d.ts +1 -1
- package/dist/types/components/autocomplete/use-autocomplete.d.ts +5 -5
- package/dist/types/components/avatar/avatar.d.ts +5 -5
- package/dist/types/components/avatar/avatar.style.d.ts +1 -1
- package/dist/types/components/avatar/use-avatar-group.d.ts +2 -2
- package/dist/types/components/badge/badge.d.ts +2 -2
- package/dist/types/components/bleed/bleed.d.ts +2 -2
- package/dist/types/components/blockquote/blockquote.d.ts +2 -2
- package/dist/types/components/breadcrumb/breadcrumb.d.ts +2 -2
- package/dist/types/components/breadcrumb/use-breadcrumb.d.ts +2 -2
- package/dist/types/components/button/button.d.ts +2 -2
- package/dist/types/components/button/icon-button.d.ts +2 -2
- package/dist/types/components/calendar/calendar.d.ts +2 -2
- package/dist/types/components/calendar/calendar.style.d.ts +2 -2
- package/dist/types/components/calendar/use-calendar.d.ts +8 -8
- package/dist/types/components/card/card.d.ts +2 -2
- package/dist/types/components/carousel/carousel.d.ts +2 -2
- package/dist/types/components/carousel/carousel.style.d.ts +2 -2
- package/dist/types/components/carousel/use-carousel.d.ts +3 -3
- package/dist/types/components/center/center.d.ts +2 -2
- package/dist/types/components/chart/chart.d.ts +5 -5
- package/dist/types/components/chart/pie-chart.d.ts +2 -2
- package/dist/types/components/chart/radar-chart.d.ts +2 -2
- package/dist/types/components/chart/radial-chart.d.ts +2 -2
- package/dist/types/components/chart/use-chart.d.ts +2 -2
- package/dist/types/components/checkbox/checkbox.d.ts +4 -4
- package/dist/types/components/checkbox/use-checkbox-group.d.ts +2 -2
- package/dist/types/components/checkbox-card/checkbox-card.d.ts +5 -5
- package/dist/types/components/checkbox-card/checkbox-card.style.d.ts +1 -1
- package/dist/types/components/circle-progress/circle-progress.d.ts +2 -2
- package/dist/types/components/close-button/close-button.d.ts +2 -2
- package/dist/types/components/code/code.d.ts +2 -2
- package/dist/types/components/collapse/collapse.d.ts +2 -2
- package/dist/types/components/color-picker/color-picker.d.ts +2 -2
- package/dist/types/components/color-picker/color-picker.style.d.ts +1 -1
- package/dist/types/components/color-picker/use-color-picker.d.ts +2 -2
- package/dist/types/components/color-selector/color-selector.d.ts +2 -2
- package/dist/types/components/color-selector/color-selector.style.d.ts +2 -2
- package/dist/types/components/color-selector/use-color-selector.d.ts +3 -3
- package/dist/types/components/color-swatch/color-swatch.d.ts +2 -2
- package/dist/types/components/container/container.d.ts +2 -2
- package/dist/types/components/data-list/data-list.d.ts +2 -2
- package/dist/types/components/date-picker/date-picker.d.ts +2 -2
- package/dist/types/components/date-picker/use-date-picker.d.ts +4 -4
- package/dist/types/components/drawer/drawer.d.ts +2 -2
- package/dist/types/components/drawer/drawer.style.d.ts +2 -2
- package/dist/types/components/dropzone/dropzone.d.ts +5 -5
- package/dist/types/components/dropzone/dropzone.style.d.ts +1 -1
- package/dist/types/components/editable/editable.d.ts +4 -4
- package/dist/types/components/editable/use-editable.d.ts +2 -2
- package/dist/types/components/em/em.d.ts +2 -2
- package/dist/types/components/empty-state/empty-state.d.ts +2 -2
- package/dist/types/components/empty-state/empty-state.style.d.ts +2 -2
- package/dist/types/components/fade/fade.d.ts +2 -2
- package/dist/types/components/field/field.d.ts +3 -3
- package/dist/types/components/field/field.style.d.ts +2 -2
- package/dist/types/components/field/use-field-props.d.ts +4 -4
- package/dist/types/components/fieldset/fieldset.d.ts +3 -3
- package/dist/types/components/fieldset/fieldset.style.d.ts +1 -1
- package/dist/types/components/file-button/file-button.d.ts +2 -2
- package/dist/types/components/file-button/use-file-button.d.ts +18 -18
- package/dist/types/components/file-input/file-input.d.ts +2 -2
- package/dist/types/components/file-input/file-input.style.d.ts +1 -1
- package/dist/types/components/file-input/use-file-input.d.ts +17 -17
- package/dist/types/components/flex/flex.d.ts +2 -2
- package/dist/types/components/flip/flip.d.ts +4 -4
- package/dist/types/components/float/float.d.ts +2 -2
- package/dist/types/components/form/form.d.ts +3 -3
- package/dist/types/components/format/format-byte.d.ts +4 -4
- package/dist/types/components/format/format-date-time.d.ts +4 -4
- package/dist/types/components/format/format-number.d.ts +2 -2
- package/dist/types/components/grid/grid-item.d.ts +2 -2
- package/dist/types/components/grid/grid.d.ts +2 -2
- package/dist/types/components/group/group.d.ts +2 -2
- package/dist/types/components/group/use-group.d.ts +2 -2
- package/dist/types/components/heading/heading.d.ts +2 -2
- package/dist/types/components/hue-slider/hue-slider.d.ts +3 -3
- package/dist/types/components/icon/icon.d.ts +5 -5
- package/dist/types/components/image/image.d.ts +2 -2
- package/dist/types/components/indicator/indicator.d.ts +4 -4
- package/dist/types/components/infinite-scroll-area/infinite-scroll-area.d.ts +2 -2
- package/dist/types/components/input/input-addon.d.ts +2 -2
- package/dist/types/components/input/input-element.d.ts +2 -2
- package/dist/types/components/input/input.d.ts +2 -2
- package/dist/types/components/kbd/kbd.d.ts +2 -2
- package/dist/types/components/link/link.d.ts +2 -2
- package/dist/types/components/link-box/link-box.d.ts +2 -2
- package/dist/types/components/list/list.d.ts +2 -2
- package/dist/types/components/loading/loading-provider.d.ts +2 -2
- package/dist/types/components/loading/loading.d.ts +3 -3
- package/dist/types/components/mark/mark.d.ts +2 -2
- package/dist/types/components/menu/menu.d.ts +2 -2
- package/dist/types/components/menu/menu.style.d.ts +2 -2
- package/dist/types/components/menu/use-menu.d.ts +11 -11
- package/dist/types/components/modal/modal.d.ts +2 -2
- package/dist/types/components/modal/modal.style.d.ts +2 -2
- package/dist/types/components/native-accordion/native-accordion.d.ts +2 -2
- package/dist/types/components/native-accordion/use-native-accordion.d.ts +2 -2
- package/dist/types/components/native-popover/native-popover.d.ts +2 -2
- package/dist/types/components/native-select/native-select.d.ts +2 -2
- package/dist/types/components/native-table/native-table.d.ts +4 -4
- package/dist/types/components/notice/notice.style.d.ts +1 -1
- package/dist/types/components/number-input/number-input.d.ts +2 -2
- package/dist/types/components/pagination/pagination.d.ts +2 -2
- package/dist/types/components/pagination/use-pagination.d.ts +2 -2
- package/dist/types/components/password-input/password-input.d.ts +2 -2
- package/dist/types/components/password-input/strength-meter.d.ts +2 -2
- package/dist/types/components/password-input/use-password-input.d.ts +2 -2
- package/dist/types/components/pin-input/pin-input.d.ts +2 -2
- package/dist/types/components/pin-input/use-pin-input.d.ts +7 -7
- package/dist/types/components/popover/popover.d.ts +2 -2
- package/dist/types/components/progress/progress.d.ts +2 -2
- package/dist/types/components/progress/use-progress.d.ts +706 -706
- package/dist/types/components/qr-code/qr-code.d.ts +2 -2
- package/dist/types/components/radio/radio.d.ts +4 -4
- package/dist/types/components/radio/use-radio-group.d.ts +2 -2
- package/dist/types/components/radio-card/radio-card.d.ts +5 -5
- package/dist/types/components/radio-card/radio-card.style.d.ts +1 -1
- package/dist/types/components/rating/use-rating.d.ts +7 -7
- package/dist/types/components/reorder/reorder.d.ts +2 -2
- package/dist/types/components/reorder/reorder.style.d.ts +1 -1
- package/dist/types/components/reorder/use-reorder.d.ts +3 -3
- package/dist/types/components/resizable/resizable.d.ts +2 -2
- package/dist/types/components/resizable/resizable.style.d.ts +2 -2
- package/dist/types/components/resizable/use-resizable.d.ts +2 -2
- package/dist/types/components/ripple/ripple.d.ts +2 -2
- package/dist/types/components/ripple/use-ripple.d.ts +2 -2
- package/dist/types/components/rotate/rotate.d.ts +2 -2
- package/dist/types/components/saturation-slider/saturation-slider.d.ts +2 -2
- package/dist/types/components/saturation-slider/use-saturation-slider.d.ts +2 -2
- package/dist/types/components/scroll-area/scroll-area.d.ts +2 -2
- package/dist/types/components/segmented-control/segmented-control.d.ts +2 -2
- package/dist/types/components/segmented-control/segmented-control.style.d.ts +2 -2
- package/dist/types/components/segmented-control/use-segmented-control.d.ts +9 -9
- package/dist/types/components/select/select.d.ts +2 -2
- package/dist/types/components/select/select.style.d.ts +1 -1
- package/dist/types/components/select/use-select.d.ts +4 -4
- package/dist/types/components/separator/separator.d.ts +2 -2
- package/dist/types/components/sidebar/sidebar.d.ts +2 -2
- package/dist/types/components/sidebar/use-sidebar.d.ts +9 -9
- package/dist/types/components/simple-grid/simple-grid.d.ts +2 -2
- package/dist/types/components/skeleton/skeleton.d.ts +2 -2
- package/dist/types/components/slide/slide.d.ts +2 -2
- package/dist/types/components/slide-fade/slide-fade.d.ts +2 -2
- package/dist/types/components/slider/slider.d.ts +2 -2
- package/dist/types/components/slider/use-slider.d.ts +2 -2
- package/dist/types/components/stack/h-stack.d.ts +2 -2
- package/dist/types/components/stack/stack.d.ts +2 -2
- package/dist/types/components/stack/v-stack.d.ts +2 -2
- package/dist/types/components/stack/z-stack.d.ts +2 -2
- package/dist/types/components/stat/stat.d.ts +2 -2
- package/dist/types/components/stat/stat.style.d.ts +2 -2
- package/dist/types/components/status/status.d.ts +2 -2
- package/dist/types/components/steps/steps.d.ts +2 -2
- package/dist/types/components/steps/steps.style.d.ts +1 -1
- package/dist/types/components/steps/use-steps.d.ts +10 -10
- package/dist/types/components/switch/switch.d.ts +2 -2
- package/dist/types/components/table/table.d.ts +2 -2
- package/dist/types/components/tabs/tabs.d.ts +2 -2
- package/dist/types/components/tabs/tabs.style.d.ts +1 -1
- package/dist/types/components/tabs/use-tabs.d.ts +16 -16
- package/dist/types/components/tag/tag.d.ts +2 -2
- package/dist/types/components/tag/tag.style.d.ts +1 -1
- package/dist/types/components/text/text.d.ts +2 -2
- package/dist/types/components/textarea/textarea.d.ts +2 -2
- package/dist/types/components/textarea/use-autosize.d.ts +2 -2
- package/dist/types/components/timeline/timeline.d.ts +5 -5
- package/dist/types/components/timeline/timeline.style.d.ts +1 -1
- package/dist/types/components/toggle/toggle.d.ts +5 -5
- package/dist/types/components/toggle/use-toggle-group.d.ts +2 -2
- package/dist/types/components/toggle/use-toggle.d.ts +2 -2
- package/dist/types/components/tooltip/tooltip.d.ts +2 -2
- package/dist/types/components/tree/tree.d.ts +3 -3
- package/dist/types/components/tree/tree.style.d.ts +1 -1
- package/dist/types/components/tree/use-tree.d.ts +190 -184
- package/dist/types/components/visually-hidden/visually-hidden.d.ts +2 -2
- package/dist/types/components/wrap/wrap.d.ts +2 -2
- package/dist/types/core/components/create-component.d.ts +7 -8
- package/dist/types/core/components/use-component-style.d.ts +0 -1
- package/dist/types/core/components/utils.d.ts +0 -1
- package/dist/types/core/constant.d.ts +0 -1
- package/dist/types/core/css/calc.d.ts +0 -1
- package/dist/types/core/css/config.d.ts +0 -1
- package/dist/types/core/css/css.d.ts +0 -1
- package/dist/types/core/css/index.types.d.ts +0 -1
- package/dist/types/core/css/styles.d.ts +0 -1
- package/dist/types/core/css/token.d.ts +0 -1
- package/dist/types/core/css/use-css.d.ts +0 -1
- package/dist/types/core/css/utils.d.ts +0 -1
- package/dist/types/core/generated-theme-tokens.types.d.ts +0 -1
- package/dist/types/core/index.d.ts +0 -1
- package/dist/types/core/system/color-mode-provider.d.ts +2 -2
- package/dist/types/core/system/storage-script.d.ts +3 -3
- package/dist/types/core/system/styled.d.ts +2 -2
- package/dist/types/core/system/system-provider.d.ts +2 -2
- package/dist/types/core/system/var.d.ts +0 -1
- package/dist/types/hooks/use-breakpoint/use-breakpoint-state.d.ts +2 -2
- package/dist/types/hooks/use-clickable/index.d.ts +2 -2
- package/dist/types/providers/i18n-provider/i18n-provider.d.ts +3 -3
- package/dist/types/providers/ui-provider/ui-provider.d.ts +2 -2
- package/dist/types/utils/children.d.ts +2 -2
- package/package.json +1 -1
|
@@ -25,8 +25,9 @@ const useActionBar = ({ closeOnEsc = true, defaultOpen, open: openProp, onClose:
|
|
|
25
25
|
const { t } = require_i18n_provider.useI18n("actionBar");
|
|
26
26
|
const onKeyDown = (0, react.useCallback)((ev) => {
|
|
27
27
|
if (ev.key !== "Escape") return;
|
|
28
|
+
if (!closeOnEsc) return;
|
|
28
29
|
ev.stopPropagation();
|
|
29
|
-
|
|
30
|
+
onClose();
|
|
30
31
|
}, [closeOnEsc, onClose]);
|
|
31
32
|
require_hooks_use_event_listener_index.useEventListener(getDocument(), "keydown", onKeyDown);
|
|
32
33
|
const getRootProps = (0, react.useCallback)((props = {}) => ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-action-bar.cjs","names":["useEnvironment","useDisclosure","useIds","useI18n","getRootProps: PropGetter","getOpenTriggerProps: PropGetter<\"button\">"],"sources":["../../../../src/components/action-bar/use-action-bar.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport { useCallback } from \"react\"\nimport { useEnvironment } from \"../../core\"\nimport {\n useDisclosure,\n type UseDisclosureProps,\n} from \"../../hooks/use-disclosure\"\nimport { useEventListener } from \"../../hooks/use-event-listener\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { handlerAll, useIds } from \"../../utils\"\n\nexport interface UseActionBarProps\n extends HTMLProps, Omit<UseDisclosureProps, \"timing\"> {\n /**\n * If `true`, the action bar will close when the `Esc` key is pressed.\n *\n * @default true\n */\n closeOnEsc?: boolean\n}\n\nexport const useActionBar = ({\n closeOnEsc = true,\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n ...rest\n}: UseActionBarProps = {}) => {\n const { getDocument } = useEnvironment()\n const { open, onClose, onOpen } = useDisclosure({\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n })\n const [contentId] = useIds()\n const { t } = useI18n(\"actionBar\")\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n
|
|
1
|
+
{"version":3,"file":"use-action-bar.cjs","names":["useEnvironment","useDisclosure","useIds","useI18n","getRootProps: PropGetter","getOpenTriggerProps: PropGetter<\"button\">"],"sources":["../../../../src/components/action-bar/use-action-bar.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport { useCallback } from \"react\"\nimport { useEnvironment } from \"../../core\"\nimport {\n useDisclosure,\n type UseDisclosureProps,\n} from \"../../hooks/use-disclosure\"\nimport { useEventListener } from \"../../hooks/use-event-listener\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { handlerAll, useIds } from \"../../utils\"\n\nexport interface UseActionBarProps\n extends HTMLProps, Omit<UseDisclosureProps, \"timing\"> {\n /**\n * If `true`, the action bar will close when the `Esc` key is pressed.\n *\n * @default true\n */\n closeOnEsc?: boolean\n}\n\nexport const useActionBar = ({\n closeOnEsc = true,\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n ...rest\n}: UseActionBarProps = {}) => {\n const { getDocument } = useEnvironment()\n const { open, onClose, onOpen } = useDisclosure({\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n })\n const [contentId] = useIds()\n const { t } = useI18n(\"actionBar\")\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n if (!closeOnEsc) return\n\n ev.stopPropagation()\n onClose()\n },\n [closeOnEsc, onClose],\n )\n\n useEventListener(getDocument(), \"keydown\", onKeyDown)\n\n const getRootProps: PropGetter = useCallback(\n (props = {}) => ({ ...rest, ...props }),\n [rest],\n )\n\n const getOpenTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n \"aria-controls\": open ? contentId : undefined,\n \"aria-expanded\": open,\n \"aria-haspopup\": \"dialog\",\n \"aria-label\": t(\"Open action bar\"),\n ...props,\n onClick: handlerAll(props.onClick, onOpen),\n }),\n [contentId, onOpen, open, t],\n )\n\n const getCloseTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n \"aria-label\": t(\"Close action bar\"),\n ...props,\n onClick: handlerAll(props.onClick, onClose),\n }),\n [onClose, t],\n )\n\n const getContentProps: PropGetter<\"section\"> = useCallback(\n (props = {}) => ({\n id: contentId,\n role: \"dialog\",\n ...props,\n }),\n [contentId],\n )\n\n return {\n open,\n getCloseTriggerProps,\n getContentProps,\n getOpenTriggerProps,\n getRootProps,\n onClose,\n onOpen,\n }\n}\n\nexport type UseActionBarReturn = ReturnType<typeof useActionBar>\n"],"mappings":";;;;;;;;;;;;;;;AAuBA,MAAa,gBAAgB,EAC3B,aAAa,MACb,aACA,MAAM,UACN,SAAS,aACT,QAAQ,YACR,GAAG,SACkB,EAAE,KAAK;CAC5B,MAAM,EAAE,gBAAgBA,6CAAgB;CACxC,MAAM,EAAE,MAAM,SAAS,WAAWC,qCAAc;EAC9C;EACA,MAAM;EACN,SAAS;EACT,QAAQ;EACT,CAAC;CACF,MAAM,CAAC,aAAaC,oBAAQ;CAC5B,MAAM,EAAE,MAAMC,8BAAQ,YAAY;CAElC,MAAM,oCACH,OAAsB;AACrB,MAAI,GAAG,QAAQ,SAAU;AAEzB,MAAI,CAAC,WAAY;AAEjB,KAAG,iBAAiB;AACpB,WAAS;IAEX,CAAC,YAAY,QAAQ,CACtB;AAED,yDAAiB,aAAa,EAAE,WAAW,UAAU;CAErD,MAAMC,uCACH,QAAQ,EAAE,MAAM;EAAE,GAAG;EAAM,GAAG;EAAO,GACtC,CAAC,KAAK,CACP;CAED,MAAMC,8CACH,QAAQ,EAAE,MAAM;EACf,iBAAiB,OAAO,YAAY;EACpC,iBAAiB;EACjB,iBAAiB;EACjB,cAAc,EAAE,kBAAkB;EAClC,GAAG;EACH,2DAAoB,MAAM,SAAS,OAAO;EAC3C,GACD;EAAC;EAAW;EAAQ;EAAM;EAAE,CAC7B;AAoBD,QAAO;EACL;EACA,8CAnBC,QAAQ,EAAE,MAAM;GACf,cAAc,EAAE,mBAAmB;GACnC,GAAG;GACH,2DAAoB,MAAM,SAAS,QAAQ;GAC5C,GACD,CAAC,SAAS,EAAE,CACb;EAcC,yCAXC,QAAQ,EAAE,MAAM;GACf,IAAI;GACJ,MAAM;GACN,GAAG;GACJ,GACD,CAAC,UAAU,CACZ;EAMC;EACA;EACA;EACA;EACD"}
|
|
@@ -51,11 +51,15 @@ const useEditable = (props = {}) => {
|
|
|
51
51
|
}, [onSubmitProp, value]);
|
|
52
52
|
const onKeyDown = (0, react.useCallback)((ev) => {
|
|
53
53
|
if (ev.key !== "Escape" && ev.key !== "Enter") return;
|
|
54
|
-
ev.
|
|
55
|
-
|
|
56
|
-
|
|
54
|
+
if (ev.key === "Escape") {
|
|
55
|
+
ev.preventDefault();
|
|
56
|
+
onCancel();
|
|
57
|
+
} else {
|
|
57
58
|
const { metaKey, shiftKey } = ev;
|
|
58
|
-
if (!shiftKey && !metaKey)
|
|
59
|
+
if (!shiftKey && !metaKey) {
|
|
60
|
+
ev.preventDefault();
|
|
61
|
+
onSubmit();
|
|
62
|
+
}
|
|
59
63
|
}
|
|
60
64
|
}, [onCancel, onSubmit]);
|
|
61
65
|
const onKeyDownWithoutSubmit = (0, react.useCallback)((ev) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-editable.cjs","names":["createContext","useFieldProps","useCallbackRef","useControllableState","getRootProps: PropGetter","props","getPreviewProps: PropGetter<\"span\">","mergeRefs","getInputProps: PropGetter<\"input\">","getTextareaProps: PropGetter<\"textarea\">","getControlProps: PropGetter","getEditProps: PropGetter<\"button\">","getSubmitProps: PropGetter<\"button\">"],"sources":["../../../../src/components/editable/use-editable.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\"\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useFocusOnPointerDown } from \"../../hooks/use-focus\"\nimport {\n contains,\n createContext,\n handlerAll,\n mergeRefs,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface EditableContext extends Omit<\n UseEditableReturn,\n \"getRootProps\" | \"onCancel\" | \"onEdit\" | \"onSubmit\" | \"value\"\n> {}\n\nconst [EditableContext, useEditableContext] = createContext<EditableContext>({\n name: \"EditableContext\",\n})\n\nexport { EditableContext, useEditableContext }\n\nexport interface UseEditableProps extends FieldProps {\n /**\n * The initial value of the Editable in both edit & preview mode.\n */\n defaultValue?: string\n /**\n * The placeholder text when the value is empty.\n */\n placeholder?: string\n /**\n * If `true`, the read only view, has a `tabIndex` set to `0`\n * so it can receive focus via the keyboard or click.\n *\n * @default true\n */\n previewFocusable?: boolean\n /**\n * If `true`, the input's text will be highlighted on focus.\n *\n * @default true\n */\n selectAllOnFocus?: boolean\n /**\n * If `true`, the Editable will start with edit mode by default.\n */\n startWithEditView?: boolean\n /**\n * If `true`, it'll update the value onBlur and turn off the edit mode.\n *\n * @default true\n */\n submitOnBlur?: boolean\n /**\n * The value of the Editable in both edit & preview mode.\n */\n value?: string\n /**\n * Callback invoked when user cancels input with the `Esc` key.\n * It provides the last confirmed value as argument.\n */\n onCancel?: (preValue: string) => void\n /**\n * A callback invoked when user changes input.\n */\n onChange?: (value: string) => void\n /**\n * A callback invoked once the user enters edit mode.\n */\n onEdit?: () => void\n /**\n * A callback invoked when user confirms value with `enter` key or by blurring input.\n */\n onSubmit?: (value: string) => void\n}\n\nexport const useEditable = (props: UseEditableProps = {}) => {\n const {\n props: {\n id,\n defaultValue,\n disabled,\n placeholder,\n previewFocusable = true,\n readOnly,\n required,\n selectAllOnFocus = true,\n startWithEditView,\n submitOnBlur = true,\n value: valueProp,\n onCancel: onCancelProp,\n onChange: onChangeProp,\n onEdit: onEditProp,\n onSubmit: onSubmitProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const onEditRef = useCallbackRef(onEditProp)\n const [editing, setEditing] = useState<boolean>(\n !!startWithEditView && !disabled,\n )\n const [value, setValue] = useControllableState({\n defaultValue: defaultValue || \"\",\n value: valueProp,\n onChange: onChangeProp,\n })\n const interactive = !editing && !disabled\n const emptyValue = value.length === 0\n const [prevValue, setPrevValue] = useState(value)\n const inputRef = useRef<HTMLInputElement | HTMLTextAreaElement>(null)\n const previewRef = useRef<HTMLElement>(null)\n const editRef = useRef<HTMLButtonElement>(null)\n const cancelRef = useRef<HTMLButtonElement>(null)\n const submitRef = useRef<HTMLButtonElement>(null)\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) =>\n setValue(ev.currentTarget.value),\n [setValue],\n )\n\n const onUpdatePrevValue = useCallback(() => setPrevValue(value), [value])\n\n const onEdit = useCallback(() => {\n if (interactive) setEditing(true)\n }, [interactive])\n\n const onCancel = useCallback(() => {\n setEditing(false)\n setValue(prevValue)\n onCancelProp?.(prevValue)\n }, [prevValue, onCancelProp, setValue])\n\n const onSubmit = useCallback(() => {\n setEditing(false)\n setPrevValue(value)\n onSubmitProp?.(value)\n }, [onSubmitProp, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\" && ev.key !== \"Enter\") return\n\n ev.preventDefault()\n\n if (ev.key === \"Escape\") {\n onCancel()\n } else {\n const { metaKey, shiftKey } = ev\n\n if (!shiftKey && !metaKey) onSubmit()\n }\n },\n [onCancel, onSubmit],\n )\n\n const onKeyDownWithoutSubmit = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n ev.preventDefault()\n onCancel()\n },\n [onCancel],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent) => {\n if (!editing) return\n\n const ownerDocument = ev.currentTarget.ownerDocument\n const relatedTarget = (ev.relatedTarget ??\n ownerDocument.activeElement) as HTMLElement\n const targetIsCancel = contains(cancelRef.current, relatedTarget)\n const targetIsSubmit = contains(submitRef.current, relatedTarget)\n const validBlur = !targetIsCancel && !targetIsSubmit\n\n if (!validBlur) return\n\n if (submitOnBlur) {\n onSubmit()\n } else {\n onCancel()\n }\n },\n [editing, submitOnBlur, onSubmit, onCancel],\n )\n\n useFocusOnPointerDown({\n ref: inputRef,\n elements: [cancelRef, submitRef],\n enabled: editing,\n })\n\n useSafeLayoutEffect(() => {\n if (!editing) return\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n }, [])\n\n useUpdateEffect(() => {\n if (!editing) {\n editRef.current?.focus()\n\n return\n }\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n\n onEditRef()\n }, [editing, onEditRef, selectAllOnFocus])\n\n useEffect(() => {\n if (editing) return\n\n const el = inputRef.current\n const activeEl = el?.ownerDocument.activeElement\n\n if (activeEl === el) el?.blur()\n }, [editing])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n ...rest,\n ...dataProps,\n ...props,\n }),\n [rest, dataProps],\n )\n\n const getPreviewProps: PropGetter<\"span\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(previewRef, ref),\n children: emptyValue ? placeholder : value,\n hidden: editing,\n tabIndex: interactive && previewFocusable ? 0 : undefined,\n onFocus: handlerAll(props.onFocus, onEdit, onUpdatePrevValue),\n }),\n [\n dataProps,\n editing,\n interactive,\n previewFocusable,\n emptyValue,\n onEdit,\n onUpdatePrevValue,\n placeholder,\n value,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDown,\n ],\n )\n\n const getTextareaProps: PropGetter<\"textarea\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDownWithoutSubmit),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDownWithoutSubmit,\n ],\n )\n\n const getControlProps: PropGetter = useCallback(\n (props) => ({\n ...dataProps,\n role: \"group\",\n ...props,\n }),\n [dataProps],\n )\n\n const getEditProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(editRef, ref),\n disabled,\n hidden: editing,\n onClick: handlerAll(props.onClick, onEdit),\n }),\n [dataProps, disabled, editing, onEdit],\n )\n\n const getSubmitProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(submitRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onSubmit),\n }),\n [dataProps, disabled, editing, onSubmit],\n )\n\n const getCancelProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(cancelRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onCancel),\n }),\n [dataProps, disabled, editing, onCancel],\n )\n\n return {\n editing,\n value,\n getCancelProps,\n getControlProps,\n getEditProps,\n getInputProps,\n getPreviewProps,\n getRootProps,\n getSubmitProps,\n getTextareaProps,\n onCancel,\n onEdit,\n onSubmit,\n }\n}\n\nexport type UseEditableReturn = ReturnType<typeof useEditable>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-editable.cjs","names":["createContext","useFieldProps","useCallbackRef","useControllableState","getRootProps: PropGetter","props","getPreviewProps: PropGetter<\"span\">","mergeRefs","getInputProps: PropGetter<\"input\">","getTextareaProps: PropGetter<\"textarea\">","getControlProps: PropGetter","getEditProps: PropGetter<\"button\">","getSubmitProps: PropGetter<\"button\">"],"sources":["../../../../src/components/editable/use-editable.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\"\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useFocusOnPointerDown } from \"../../hooks/use-focus\"\nimport {\n contains,\n createContext,\n handlerAll,\n mergeRefs,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface EditableContext extends Omit<\n UseEditableReturn,\n \"getRootProps\" | \"onCancel\" | \"onEdit\" | \"onSubmit\" | \"value\"\n> {}\n\nconst [EditableContext, useEditableContext] = createContext<EditableContext>({\n name: \"EditableContext\",\n})\n\nexport { EditableContext, useEditableContext }\n\nexport interface UseEditableProps extends FieldProps {\n /**\n * The initial value of the Editable in both edit & preview mode.\n */\n defaultValue?: string\n /**\n * The placeholder text when the value is empty.\n */\n placeholder?: string\n /**\n * If `true`, the read only view, has a `tabIndex` set to `0`\n * so it can receive focus via the keyboard or click.\n *\n * @default true\n */\n previewFocusable?: boolean\n /**\n * If `true`, the input's text will be highlighted on focus.\n *\n * @default true\n */\n selectAllOnFocus?: boolean\n /**\n * If `true`, the Editable will start with edit mode by default.\n */\n startWithEditView?: boolean\n /**\n * If `true`, it'll update the value onBlur and turn off the edit mode.\n *\n * @default true\n */\n submitOnBlur?: boolean\n /**\n * The value of the Editable in both edit & preview mode.\n */\n value?: string\n /**\n * Callback invoked when user cancels input with the `Esc` key.\n * It provides the last confirmed value as argument.\n */\n onCancel?: (preValue: string) => void\n /**\n * A callback invoked when user changes input.\n */\n onChange?: (value: string) => void\n /**\n * A callback invoked once the user enters edit mode.\n */\n onEdit?: () => void\n /**\n * A callback invoked when user confirms value with `enter` key or by blurring input.\n */\n onSubmit?: (value: string) => void\n}\n\nexport const useEditable = (props: UseEditableProps = {}) => {\n const {\n props: {\n id,\n defaultValue,\n disabled,\n placeholder,\n previewFocusable = true,\n readOnly,\n required,\n selectAllOnFocus = true,\n startWithEditView,\n submitOnBlur = true,\n value: valueProp,\n onCancel: onCancelProp,\n onChange: onChangeProp,\n onEdit: onEditProp,\n onSubmit: onSubmitProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const onEditRef = useCallbackRef(onEditProp)\n const [editing, setEditing] = useState<boolean>(\n !!startWithEditView && !disabled,\n )\n const [value, setValue] = useControllableState({\n defaultValue: defaultValue || \"\",\n value: valueProp,\n onChange: onChangeProp,\n })\n const interactive = !editing && !disabled\n const emptyValue = value.length === 0\n const [prevValue, setPrevValue] = useState(value)\n const inputRef = useRef<HTMLInputElement | HTMLTextAreaElement>(null)\n const previewRef = useRef<HTMLElement>(null)\n const editRef = useRef<HTMLButtonElement>(null)\n const cancelRef = useRef<HTMLButtonElement>(null)\n const submitRef = useRef<HTMLButtonElement>(null)\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) =>\n setValue(ev.currentTarget.value),\n [setValue],\n )\n\n const onUpdatePrevValue = useCallback(() => setPrevValue(value), [value])\n\n const onEdit = useCallback(() => {\n if (interactive) setEditing(true)\n }, [interactive])\n\n const onCancel = useCallback(() => {\n setEditing(false)\n setValue(prevValue)\n onCancelProp?.(prevValue)\n }, [prevValue, onCancelProp, setValue])\n\n const onSubmit = useCallback(() => {\n setEditing(false)\n setPrevValue(value)\n onSubmitProp?.(value)\n }, [onSubmitProp, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\" && ev.key !== \"Enter\") return\n\n if (ev.key === \"Escape\") {\n ev.preventDefault()\n onCancel()\n } else {\n const { metaKey, shiftKey } = ev\n\n if (!shiftKey && !metaKey) {\n ev.preventDefault()\n onSubmit()\n }\n }\n },\n [onCancel, onSubmit],\n )\n\n const onKeyDownWithoutSubmit = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n ev.preventDefault()\n onCancel()\n },\n [onCancel],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent) => {\n if (!editing) return\n\n const ownerDocument = ev.currentTarget.ownerDocument\n const relatedTarget = (ev.relatedTarget ??\n ownerDocument.activeElement) as HTMLElement\n const targetIsCancel = contains(cancelRef.current, relatedTarget)\n const targetIsSubmit = contains(submitRef.current, relatedTarget)\n const validBlur = !targetIsCancel && !targetIsSubmit\n\n if (!validBlur) return\n\n if (submitOnBlur) {\n onSubmit()\n } else {\n onCancel()\n }\n },\n [editing, submitOnBlur, onSubmit, onCancel],\n )\n\n useFocusOnPointerDown({\n ref: inputRef,\n elements: [cancelRef, submitRef],\n enabled: editing,\n })\n\n useSafeLayoutEffect(() => {\n if (!editing) return\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n }, [])\n\n useUpdateEffect(() => {\n if (!editing) {\n editRef.current?.focus()\n\n return\n }\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n\n onEditRef()\n }, [editing, onEditRef, selectAllOnFocus])\n\n useEffect(() => {\n if (editing) return\n\n const el = inputRef.current\n const activeEl = el?.ownerDocument.activeElement\n\n if (activeEl === el) el?.blur()\n }, [editing])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n ...rest,\n ...dataProps,\n ...props,\n }),\n [rest, dataProps],\n )\n\n const getPreviewProps: PropGetter<\"span\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(previewRef, ref),\n children: emptyValue ? placeholder : value,\n hidden: editing,\n tabIndex: interactive && previewFocusable ? 0 : undefined,\n onFocus: handlerAll(props.onFocus, onEdit, onUpdatePrevValue),\n }),\n [\n dataProps,\n editing,\n interactive,\n previewFocusable,\n emptyValue,\n onEdit,\n onUpdatePrevValue,\n placeholder,\n value,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDown,\n ],\n )\n\n const getTextareaProps: PropGetter<\"textarea\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDownWithoutSubmit),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDownWithoutSubmit,\n ],\n )\n\n const getControlProps: PropGetter = useCallback(\n (props) => ({\n ...dataProps,\n role: \"group\",\n ...props,\n }),\n [dataProps],\n )\n\n const getEditProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(editRef, ref),\n disabled,\n hidden: editing,\n onClick: handlerAll(props.onClick, onEdit),\n }),\n [dataProps, disabled, editing, onEdit],\n )\n\n const getSubmitProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(submitRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onSubmit),\n }),\n [dataProps, disabled, editing, onSubmit],\n )\n\n const getCancelProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(cancelRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onCancel),\n }),\n [dataProps, disabled, editing, onCancel],\n )\n\n return {\n editing,\n value,\n getCancelProps,\n getControlProps,\n getEditProps,\n getInputProps,\n getPreviewProps,\n getRootProps,\n getSubmitProps,\n getTextareaProps,\n onCancel,\n onEdit,\n onSubmit,\n }\n}\n\nexport type UseEditableReturn = ReturnType<typeof useEditable>\n"],"mappings":"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"}
|
|
@@ -8,6 +8,7 @@ const require_create_component = require('../../core/components/create-component
|
|
|
8
8
|
require('../../core/index.cjs');
|
|
9
9
|
const require_factory$1 = require('../motion/factory.cjs');
|
|
10
10
|
require('../motion/index.cjs');
|
|
11
|
+
const require_hooks_use_value_index = require('../../hooks/use-value/index.cjs');
|
|
11
12
|
const require_portal = require('../portal/portal.cjs');
|
|
12
13
|
require('../portal/index.cjs');
|
|
13
14
|
const require_popover = require('../popover/popover.cjs');
|
|
@@ -113,7 +114,8 @@ const ModalCloseButton = withContext(require_close_button.CloseButton, "closeBut
|
|
|
113
114
|
return { ...getCloseButtonProps(props) };
|
|
114
115
|
});
|
|
115
116
|
const ModalOverlay = withContext((props) => {
|
|
116
|
-
const { animationScheme, duration, getOverlayProps } = useComponentContext();
|
|
117
|
+
const { animationScheme, duration: durationProp, getOverlayProps } = useComponentContext();
|
|
118
|
+
const duration = require_hooks_use_value_index.useValue(durationProp);
|
|
117
119
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory$1.motion.div, {
|
|
118
120
|
custom: { duration },
|
|
119
121
|
...animationScheme !== "none" ? {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal.cjs","names":["createSlotComponent","modalStyle","useSplitChildren","useModal","AnimatePresence","Portal","FocusLock","RemoveScroll","styled","CloseButton","motion","fadeVariants","usePopupAnimationProps","ShorthandModalContent: FC<ShorthandModalContentProps>","wrapOrPassProps","Button"],"sources":["../../../../src/components/modal/modal.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ButtonProps } from \"../button\"\nimport type { CloseButtonProps } from \"../close-button\"\nimport type { FocusLockProps } from \"../focus-lock\"\nimport type { HTMLMotionProps, HTMLMotionPropsWithoutAs } from \"../motion\"\nimport type { UsePopupAnimationProps } from \"../popover\"\nimport type { PortalProps } from \"../portal\"\nimport type { ModalStyle } from \"./modal.style\"\nimport type { UseModalProps, UseModalReturn } from \"./use-modal\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { RemoveScroll } from \"react-remove-scroll\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { cast, isArray, useSplitChildren, wrapOrPassProps } from \"../../utils\"\nimport { Button } from \"../button\"\nimport { CloseButton } from \"../close-button\"\nimport { fadeVariants } from \"../fade\"\nimport { FocusLock } from \"../focus-lock\"\nimport { motion } from \"../motion\"\nimport { usePopupAnimationProps } from \"../popover\"\nimport { Portal } from \"../portal\"\nimport { modalStyle } from \"./modal.style\"\nimport { useModal } from \"./use-modal\"\n\ninterface ComponentContext\n extends\n Omit<UseModalReturn, \"getRootProps\">,\n UsePopupAnimationProps,\n Pick<ModalRootProps, \"withCloseButton\"> {}\n\nexport interface ModalRootProps\n extends\n ThemeProps<ModalStyle>,\n Omit<UseModalProps, \"title\">,\n Pick<\n FocusLockProps,\n | \"autoFocus\"\n | \"finalFocusRef\"\n | \"initialFocusRef\"\n | \"lockFocusAcrossFrames\"\n | \"restoreFocus\"\n >,\n UsePopupAnimationProps,\n ShorthandModalContentProps {\n /**\n * Handle zoom or pinch gestures on iOS devices when scroll locking is enabled.\n *\n * @default false.\n */\n allowPinchZoom?: boolean\n /**\n * If `true`, scrolling will be disabled on the `body` when the modal opens.\n *\n * @default true\n */\n blockScrollOnMount?: boolean\n /**\n * The modal trigger to use.\n */\n trigger?: ReactNode\n /**\n * If `true`, display the modal close button.\n *\n * @default true\n */\n withCloseButton?: boolean\n /**\n * If `true`, display the modal overlay.\n *\n * @default true\n */\n withOverlay?: boolean\n /**\n * Props to be forwarded to the portal component.\n */\n portalProps?: Omit<PortalProps, \"children\">\n /**\n * Callback function to run side effects after the modal has closed.\n */\n onCloseComplete?: () => void\n}\n\nconst {\n ComponentContext,\n PropsContext: ModalPropsContext,\n useComponentContext,\n usePropsContext: useModalPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<ModalRootProps, ModalStyle, ComponentContext>(\n \"modal\",\n modalStyle,\n)\n\nexport { ModalPropsContext, useModalPropsContext }\n\n/**\n * `Modal` is a component that is displayed over the main content to focus the user's attention solely on the information.\n *\n * @see https://yamada-ui.com/docs/components/modal\n */\nexport const ModalRoot = withProvider<\"div\", ModalRootProps>(\n ({\n allowPinchZoom = false,\n animationScheme = \"scale\",\n autoFocus,\n blockScrollOnMount = true,\n body,\n cancel,\n children,\n duration,\n finalFocusRef,\n footer,\n header,\n initialFocusRef,\n lockFocusAcrossFrames = true,\n middle,\n restoreFocus,\n success,\n title,\n trigger,\n withCloseButton = true,\n withOverlay = true,\n portalProps,\n onCancel,\n onCloseComplete,\n onMiddle,\n onSuccess,\n ...props\n }) => {\n const [omittedChildren, openTrigger, customOverlay] = useSplitChildren(\n children,\n ModalOpenTrigger,\n ModalOverlay,\n )\n const hasChildren = isArray(omittedChildren) && !!omittedChildren.length\n const { open, getRootProps, ...rest } = useModal(props)\n const customOpenTrigger = trigger ? (\n <ModalOpenTrigger>{trigger}</ModalOpenTrigger>\n ) : null\n const context = useMemo(\n () => ({\n animationScheme,\n duration,\n open,\n withCloseButton,\n ...rest,\n }),\n [animationScheme, duration, open, withCloseButton, rest],\n )\n\n return (\n <ComponentContext value={context}>\n {openTrigger ?? customOpenTrigger}\n\n <AnimatePresence onExitComplete={onCloseComplete}>\n {open ? (\n <Portal {...portalProps}>\n <FocusLock\n autoFocus={autoFocus}\n finalFocusRef={finalFocusRef}\n initialFocusRef={initialFocusRef}\n lockFocusAcrossFrames={lockFocusAcrossFrames}\n restoreFocus={restoreFocus}\n >\n <RemoveScroll\n allowPinchZoom={allowPinchZoom}\n enabled={blockScrollOnMount}\n forwardProps\n >\n <styled.div {...getRootProps()}>\n {customOverlay ?? (withOverlay ? <ModalOverlay /> : null)}\n\n {hasChildren ? (\n omittedChildren\n ) : (\n <ShorthandModalContent\n body={body}\n cancel={cancel}\n footer={footer}\n header={header}\n middle={middle}\n success={success}\n title={title}\n onCancel={onCancel}\n onMiddle={onMiddle}\n onSuccess={onSuccess}\n />\n )}\n </styled.div>\n </RemoveScroll>\n </FocusLock>\n </Portal>\n ) : null}\n </AnimatePresence>\n </ComponentContext>\n )\n },\n \"root\",\n)()\n\nexport interface ModalOpenTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const ModalOpenTrigger = withContext<\"button\", ModalOpenTriggerProps>(\n \"button\",\n { name: \"OpenTrigger\", slot: [\"trigger\", \"open\"] },\n)(undefined, (props) => {\n const { getOpenTriggerProps } = useComponentContext()\n\n return { asChild: true, ...getOpenTriggerProps(props) }\n})\n\nexport interface ModalCloseTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const ModalCloseTrigger = withContext<\"button\", ModalCloseTriggerProps>(\n \"button\",\n { name: \"CloseTrigger\", slot: [\"trigger\", \"close\"] },\n)(undefined, (props) => {\n const { getCloseTriggerProps } = useComponentContext()\n\n return { asChild: true, ...getCloseTriggerProps(props) }\n})\n\nexport interface ModalCloseButtonProps extends CloseButtonProps {}\n\nexport const ModalCloseButton = withContext<\"button\", ModalCloseButtonProps>(\n CloseButton,\n \"closeButton\",\n)(undefined, (props) => {\n const { getCloseButtonProps } = useComponentContext()\n\n return { ...getCloseButtonProps(props) }\n})\n\nexport interface ModalOverlayProps extends HTMLMotionProps {}\n\nexport const ModalOverlay = withContext<\"div\", ModalOverlayProps>((props) => {\n const { animationScheme, duration, getOverlayProps } = useComponentContext()\n\n return (\n <motion.div\n custom={{ duration }}\n {...(animationScheme !== \"none\"\n ? {\n animate: \"enter\",\n exit: \"exit\",\n initial: \"exit\",\n variants: fadeVariants,\n }\n : {})}\n {...cast<HTMLMotionProps>(getOverlayProps(cast<HTMLProps>(props)))}\n />\n )\n}, \"overlay\")()\n\nexport interface ModalContentProps\n extends Omit<HTMLMotionProps<\"section\">, \"children\">, PropsWithChildren {}\n\nexport const ModalContent = withContext<\"section\", ModalContentProps>(\n ({ children, ...rest }) => {\n const { animationScheme, duration, withCloseButton, getContentProps } =\n useComponentContext()\n const [omittedChildren, customCloseButton] = useSplitChildren(\n children,\n ModalCloseButton,\n )\n const popupAnimationProps = usePopupAnimationProps({\n animationScheme,\n duration,\n })\n\n return (\n <motion.section\n {...popupAnimationProps}\n {...cast<HTMLMotionPropsWithoutAs<\"section\">>(\n getContentProps(cast<HTMLProps<\"section\">>(rest)),\n )}\n >\n {customCloseButton ?? (withCloseButton ? <ModalCloseButton /> : null)}\n\n {omittedChildren}\n </motion.section>\n )\n },\n \"content\",\n)()\n\ninterface ShorthandModalContentProps {\n /**\n * The modal body to use.\n */\n body?: ModalBodyProps | ReactNode\n /**\n * The modal cancel button to use.\n */\n cancel?: ButtonProps | ReactNode\n /**\n * The modal footer to use.\n */\n footer?: ModalFooterProps | ReactNode\n /**\n * The modal header to use.\n */\n header?: ModalHeaderProps | ReactNode\n /**\n * The modal middle button to use.\n */\n middle?: ButtonProps | ReactNode\n /**\n * The modal success button to use.\n */\n success?: ButtonProps | ReactNode\n /**\n * The modal title to use.\n */\n title?: ModalTitleProps | ReactNode\n /**\n * The callback invoked when cancel button clicked.\n */\n onCancel?: (onClose: () => void) => void\n /**\n * The callback invoked when middle button clicked.\n */\n onMiddle?: (onClose: () => void) => void\n /**\n * The callback invoked when success button clicked.\n */\n onSuccess?: (onClose: () => void) => void\n}\n\nexport const ShorthandModalContent: FC<ShorthandModalContentProps> = ({\n body,\n cancel,\n footer,\n header,\n middle,\n success,\n title,\n onCancel,\n onMiddle,\n onSuccess,\n}) => {\n const { onClose } = useComponentContext()\n const customHeader = wrapOrPassProps(ModalHeader, header)\n const customTitle = wrapOrPassProps(ModalTitle, title)\n const customBody = wrapOrPassProps(ModalBody, body)\n const customFooter = wrapOrPassProps(ModalFooter, footer)\n const customCancel = wrapOrPassProps(Button, cancel, {\n colorScheme: \"mono\",\n variant: \"ghost\",\n onClick: () => (onCancel ? onCancel(onClose) : onClose()),\n })\n const customMiddle = wrapOrPassProps(Button, middle, {\n colorScheme: \"secondary\",\n onClick: () => (onMiddle ? onMiddle(onClose) : onClose()),\n })\n const customSuccess = wrapOrPassProps(Button, success, {\n colorScheme: \"primary\",\n onClick: () => (onSuccess ? onSuccess(onClose) : onClose()),\n })\n\n return (\n <ModalContent>\n {customHeader ??\n (customTitle ? <ModalHeader>{customTitle}</ModalHeader> : null)}\n {customBody}\n {customFooter ??\n (customCancel || customMiddle || customSuccess ? (\n <ModalFooter>\n {customCancel}\n {customMiddle}\n {customSuccess}\n </ModalFooter>\n ) : null)}\n </ModalContent>\n )\n}\n\nexport interface ModalHeaderProps extends HTMLStyledProps<\"header\"> {}\n\nexport const ModalHeader = withContext<\"header\", ModalHeaderProps>(\n \"header\",\n \"header\",\n)(undefined, (props) => {\n const { getHeaderProps } = useComponentContext()\n\n return { ...getHeaderProps(props) }\n})\n\nexport interface ModalTitleProps extends HTMLStyledProps<\"h2\"> {}\n\nexport const ModalTitle = withContext<\"h2\", ModalTitleProps>(\"h2\", \"title\")(\n undefined,\n (props) => {\n const { getTitleProps } = useComponentContext()\n\n return { ...getTitleProps(props) }\n },\n)\n\nexport interface ModalBodyProps extends HTMLStyledProps {}\n\nexport const ModalBody = withContext<\"div\", ModalBodyProps>(\"div\", \"body\")(\n undefined,\n (props) => {\n const { getBodyProps } = useComponentContext()\n\n return { ...getBodyProps(props) }\n },\n)\n\nexport interface ModalFooterProps extends HTMLStyledProps<\"footer\"> {}\n\nexport const ModalFooter = withContext<\"footer\", ModalFooterProps>(\n \"footer\",\n \"footer\",\n)(undefined, (props) => {\n const { getFooterProps } = useComponentContext()\n\n return { ...getFooterProps(props) }\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"modal.cjs","names":["createSlotComponent","modalStyle","useSplitChildren","useModal","AnimatePresence","Portal","FocusLock","RemoveScroll","styled","CloseButton","useValue","motion","fadeVariants","usePopupAnimationProps","ShorthandModalContent: FC<ShorthandModalContentProps>","wrapOrPassProps","Button"],"sources":["../../../../src/components/modal/modal.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ButtonProps } from \"../button\"\nimport type { CloseButtonProps } from \"../close-button\"\nimport type { FocusLockProps } from \"../focus-lock\"\nimport type { HTMLMotionProps, HTMLMotionPropsWithoutAs } from \"../motion\"\nimport type { UsePopupAnimationProps } from \"../popover\"\nimport type { PortalProps } from \"../portal\"\nimport type { ModalStyle } from \"./modal.style\"\nimport type { UseModalProps, UseModalReturn } from \"./use-modal\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { RemoveScroll } from \"react-remove-scroll\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { cast, isArray, useSplitChildren, wrapOrPassProps } from \"../../utils\"\nimport { Button } from \"../button\"\nimport { CloseButton } from \"../close-button\"\nimport { fadeVariants } from \"../fade\"\nimport { FocusLock } from \"../focus-lock\"\nimport { motion } from \"../motion\"\nimport { usePopupAnimationProps } from \"../popover\"\nimport { Portal } from \"../portal\"\nimport { modalStyle } from \"./modal.style\"\nimport { useModal } from \"./use-modal\"\n\ninterface ComponentContext\n extends\n Omit<UseModalReturn, \"getRootProps\">,\n UsePopupAnimationProps,\n Pick<ModalRootProps, \"withCloseButton\"> {}\n\nexport interface ModalRootProps\n extends\n ThemeProps<ModalStyle>,\n Omit<UseModalProps, \"title\">,\n Pick<\n FocusLockProps,\n | \"autoFocus\"\n | \"finalFocusRef\"\n | \"initialFocusRef\"\n | \"lockFocusAcrossFrames\"\n | \"restoreFocus\"\n >,\n UsePopupAnimationProps,\n ShorthandModalContentProps {\n /**\n * Handle zoom or pinch gestures on iOS devices when scroll locking is enabled.\n *\n * @default false.\n */\n allowPinchZoom?: boolean\n /**\n * If `true`, scrolling will be disabled on the `body` when the modal opens.\n *\n * @default true\n */\n blockScrollOnMount?: boolean\n /**\n * The modal trigger to use.\n */\n trigger?: ReactNode\n /**\n * If `true`, display the modal close button.\n *\n * @default true\n */\n withCloseButton?: boolean\n /**\n * If `true`, display the modal overlay.\n *\n * @default true\n */\n withOverlay?: boolean\n /**\n * Props to be forwarded to the portal component.\n */\n portalProps?: Omit<PortalProps, \"children\">\n /**\n * Callback function to run side effects after the modal has closed.\n */\n onCloseComplete?: () => void\n}\n\nconst {\n ComponentContext,\n PropsContext: ModalPropsContext,\n useComponentContext,\n usePropsContext: useModalPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<ModalRootProps, ModalStyle, ComponentContext>(\n \"modal\",\n modalStyle,\n)\n\nexport { ModalPropsContext, useModalPropsContext }\n\n/**\n * `Modal` is a component that is displayed over the main content to focus the user's attention solely on the information.\n *\n * @see https://yamada-ui.com/docs/components/modal\n */\nexport const ModalRoot = withProvider<\"div\", ModalRootProps>(\n ({\n allowPinchZoom = false,\n animationScheme = \"scale\",\n autoFocus,\n blockScrollOnMount = true,\n body,\n cancel,\n children,\n duration,\n finalFocusRef,\n footer,\n header,\n initialFocusRef,\n lockFocusAcrossFrames = true,\n middle,\n restoreFocus,\n success,\n title,\n trigger,\n withCloseButton = true,\n withOverlay = true,\n portalProps,\n onCancel,\n onCloseComplete,\n onMiddle,\n onSuccess,\n ...props\n }) => {\n const [omittedChildren, openTrigger, customOverlay] = useSplitChildren(\n children,\n ModalOpenTrigger,\n ModalOverlay,\n )\n const hasChildren = isArray(omittedChildren) && !!omittedChildren.length\n const { open, getRootProps, ...rest } = useModal(props)\n const customOpenTrigger = trigger ? (\n <ModalOpenTrigger>{trigger}</ModalOpenTrigger>\n ) : null\n const context = useMemo(\n () => ({\n animationScheme,\n duration,\n open,\n withCloseButton,\n ...rest,\n }),\n [animationScheme, duration, open, withCloseButton, rest],\n )\n\n return (\n <ComponentContext value={context}>\n {openTrigger ?? customOpenTrigger}\n\n <AnimatePresence onExitComplete={onCloseComplete}>\n {open ? (\n <Portal {...portalProps}>\n <FocusLock\n autoFocus={autoFocus}\n finalFocusRef={finalFocusRef}\n initialFocusRef={initialFocusRef}\n lockFocusAcrossFrames={lockFocusAcrossFrames}\n restoreFocus={restoreFocus}\n >\n <RemoveScroll\n allowPinchZoom={allowPinchZoom}\n enabled={blockScrollOnMount}\n forwardProps\n >\n <styled.div {...getRootProps()}>\n {customOverlay ?? (withOverlay ? <ModalOverlay /> : null)}\n\n {hasChildren ? (\n omittedChildren\n ) : (\n <ShorthandModalContent\n body={body}\n cancel={cancel}\n footer={footer}\n header={header}\n middle={middle}\n success={success}\n title={title}\n onCancel={onCancel}\n onMiddle={onMiddle}\n onSuccess={onSuccess}\n />\n )}\n </styled.div>\n </RemoveScroll>\n </FocusLock>\n </Portal>\n ) : null}\n </AnimatePresence>\n </ComponentContext>\n )\n },\n \"root\",\n)()\n\nexport interface ModalOpenTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const ModalOpenTrigger = withContext<\"button\", ModalOpenTriggerProps>(\n \"button\",\n { name: \"OpenTrigger\", slot: [\"trigger\", \"open\"] },\n)(undefined, (props) => {\n const { getOpenTriggerProps } = useComponentContext()\n\n return { asChild: true, ...getOpenTriggerProps(props) }\n})\n\nexport interface ModalCloseTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const ModalCloseTrigger = withContext<\"button\", ModalCloseTriggerProps>(\n \"button\",\n { name: \"CloseTrigger\", slot: [\"trigger\", \"close\"] },\n)(undefined, (props) => {\n const { getCloseTriggerProps } = useComponentContext()\n\n return { asChild: true, ...getCloseTriggerProps(props) }\n})\n\nexport interface ModalCloseButtonProps extends CloseButtonProps {}\n\nexport const ModalCloseButton = withContext<\"button\", ModalCloseButtonProps>(\n CloseButton,\n \"closeButton\",\n)(undefined, (props) => {\n const { getCloseButtonProps } = useComponentContext()\n\n return { ...getCloseButtonProps(props) }\n})\n\nexport interface ModalOverlayProps extends HTMLMotionProps {}\n\nexport const ModalOverlay = withContext<\"div\", ModalOverlayProps>((props) => {\n const {\n animationScheme,\n duration: durationProp,\n getOverlayProps,\n } = useComponentContext()\n const duration = useValue(durationProp)\n\n return (\n <motion.div\n custom={{ duration }}\n {...(animationScheme !== \"none\"\n ? {\n animate: \"enter\",\n exit: \"exit\",\n initial: \"exit\",\n variants: fadeVariants,\n }\n : {})}\n {...cast<HTMLMotionProps>(getOverlayProps(cast<HTMLProps>(props)))}\n />\n )\n}, \"overlay\")()\n\nexport interface ModalContentProps\n extends Omit<HTMLMotionProps<\"section\">, \"children\">, PropsWithChildren {}\n\nexport const ModalContent = withContext<\"section\", ModalContentProps>(\n ({ children, ...rest }) => {\n const { animationScheme, duration, withCloseButton, getContentProps } =\n useComponentContext()\n const [omittedChildren, customCloseButton] = useSplitChildren(\n children,\n ModalCloseButton,\n )\n const popupAnimationProps = usePopupAnimationProps({\n animationScheme,\n duration,\n })\n\n return (\n <motion.section\n {...popupAnimationProps}\n {...cast<HTMLMotionPropsWithoutAs<\"section\">>(\n getContentProps(cast<HTMLProps<\"section\">>(rest)),\n )}\n >\n {customCloseButton ?? (withCloseButton ? <ModalCloseButton /> : null)}\n\n {omittedChildren}\n </motion.section>\n )\n },\n \"content\",\n)()\n\ninterface ShorthandModalContentProps {\n /**\n * The modal body to use.\n */\n body?: ModalBodyProps | ReactNode\n /**\n * The modal cancel button to use.\n */\n cancel?: ButtonProps | ReactNode\n /**\n * The modal footer to use.\n */\n footer?: ModalFooterProps | ReactNode\n /**\n * The modal header to use.\n */\n header?: ModalHeaderProps | ReactNode\n /**\n * The modal middle button to use.\n */\n middle?: ButtonProps | ReactNode\n /**\n * The modal success button to use.\n */\n success?: ButtonProps | ReactNode\n /**\n * The modal title to use.\n */\n title?: ModalTitleProps | ReactNode\n /**\n * The callback invoked when cancel button clicked.\n */\n onCancel?: (onClose: () => void) => void\n /**\n * The callback invoked when middle button clicked.\n */\n onMiddle?: (onClose: () => void) => void\n /**\n * The callback invoked when success button clicked.\n */\n onSuccess?: (onClose: () => void) => void\n}\n\nexport const ShorthandModalContent: FC<ShorthandModalContentProps> = ({\n body,\n cancel,\n footer,\n header,\n middle,\n success,\n title,\n onCancel,\n onMiddle,\n onSuccess,\n}) => {\n const { onClose } = useComponentContext()\n const customHeader = wrapOrPassProps(ModalHeader, header)\n const customTitle = wrapOrPassProps(ModalTitle, title)\n const customBody = wrapOrPassProps(ModalBody, body)\n const customFooter = wrapOrPassProps(ModalFooter, footer)\n const customCancel = wrapOrPassProps(Button, cancel, {\n colorScheme: \"mono\",\n variant: \"ghost\",\n onClick: () => (onCancel ? onCancel(onClose) : onClose()),\n })\n const customMiddle = wrapOrPassProps(Button, middle, {\n colorScheme: \"secondary\",\n onClick: () => (onMiddle ? onMiddle(onClose) : onClose()),\n })\n const customSuccess = wrapOrPassProps(Button, success, {\n colorScheme: \"primary\",\n onClick: () => (onSuccess ? onSuccess(onClose) : onClose()),\n })\n\n return (\n <ModalContent>\n {customHeader ??\n (customTitle ? <ModalHeader>{customTitle}</ModalHeader> : null)}\n {customBody}\n {customFooter ??\n (customCancel || customMiddle || customSuccess ? (\n <ModalFooter>\n {customCancel}\n {customMiddle}\n {customSuccess}\n </ModalFooter>\n ) : null)}\n </ModalContent>\n )\n}\n\nexport interface ModalHeaderProps extends HTMLStyledProps<\"header\"> {}\n\nexport const ModalHeader = withContext<\"header\", ModalHeaderProps>(\n \"header\",\n \"header\",\n)(undefined, (props) => {\n const { getHeaderProps } = useComponentContext()\n\n return { ...getHeaderProps(props) }\n})\n\nexport interface ModalTitleProps extends HTMLStyledProps<\"h2\"> {}\n\nexport const ModalTitle = withContext<\"h2\", ModalTitleProps>(\"h2\", \"title\")(\n undefined,\n (props) => {\n const { getTitleProps } = useComponentContext()\n\n return { ...getTitleProps(props) }\n },\n)\n\nexport interface ModalBodyProps extends HTMLStyledProps {}\n\nexport const ModalBody = withContext<\"div\", ModalBodyProps>(\"div\", \"body\")(\n undefined,\n (props) => {\n const { getBodyProps } = useComponentContext()\n\n return { ...getBodyProps(props) }\n },\n)\n\nexport interface ModalFooterProps extends HTMLStyledProps<\"footer\"> {}\n\nexport const ModalFooter = withContext<\"footer\", ModalFooterProps>(\n \"footer\",\n \"footer\",\n)(undefined, (props) => {\n const { getFooterProps } = useComponentContext()\n\n return { ...getFooterProps(props) }\n})\n"],"mappings":"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"}
|
|
@@ -19,8 +19,10 @@ const useModal = ({ closeOnEsc = true, closeOnOverlay = true, defaultOpen, open:
|
|
|
19
19
|
const { t } = require_i18n_provider.useI18n("modal");
|
|
20
20
|
const onKeyDown = (0, react.useCallback)((ev) => {
|
|
21
21
|
if (ev.key !== "Escape") return;
|
|
22
|
-
|
|
23
|
-
|
|
22
|
+
if (closeOnEsc) {
|
|
23
|
+
ev.stopPropagation();
|
|
24
|
+
onClose();
|
|
25
|
+
}
|
|
24
26
|
onEsc?.();
|
|
25
27
|
}, [
|
|
26
28
|
closeOnEsc,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-modal.cjs","names":["useDisclosure","useIds","useI18n","getRootProps: PropGetter","getOverlayProps: PropGetter","getOpenTriggerProps: PropGetter<\"button\">","getCloseTriggerProps: PropGetter<\"button\">","getCloseButtonProps: PropGetter<\"button\">","getContentProps: PropGetter<\"section\">","getHeaderProps: PropGetter<\"header\">","getTitleProps: PropGetter<\"h2\">"],"sources":["../../../../src/components/modal/use-modal.ts"],"sourcesContent":["import type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { UseDisclosureProps } from \"../../hooks/use-disclosure\"\nimport { useCallback } from \"react\"\nimport { useDisclosure } from \"../../hooks/use-disclosure\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { cx, handlerAll, useIds } from \"../../utils\"\n\nexport interface UseModalProps\n extends HTMLProps, Omit<UseDisclosureProps, \"timing\"> {\n /**\n * If `true`, the modal will close when the `Esc` key is pressed.\n *\n * @default true\n */\n closeOnEsc?: boolean\n /**\n * If `true`, the modal will close when the overlay is clicked.\n *\n * @default true\n */\n closeOnOverlay?: boolean\n /**\n * Callback invoked when the escape key is pressed and focus is within modal.\n */\n onEsc?: () => void\n}\n\nexport const useModal = ({\n closeOnEsc = true,\n closeOnOverlay = true,\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onEsc,\n onOpen: onOpenProp,\n ...rest\n}: UseModalProps = {}) => {\n const { open, onClose, onOpen } = useDisclosure({\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n })\n const [contentId, titleId, bodyId] = useIds()\n const { t } = useI18n(\"modal\")\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n ev.stopPropagation()\n
|
|
1
|
+
{"version":3,"file":"use-modal.cjs","names":["useDisclosure","useIds","useI18n","getRootProps: PropGetter","getOverlayProps: PropGetter","getOpenTriggerProps: PropGetter<\"button\">","getCloseTriggerProps: PropGetter<\"button\">","getCloseButtonProps: PropGetter<\"button\">","getContentProps: PropGetter<\"section\">","getHeaderProps: PropGetter<\"header\">","getTitleProps: PropGetter<\"h2\">"],"sources":["../../../../src/components/modal/use-modal.ts"],"sourcesContent":["import type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { UseDisclosureProps } from \"../../hooks/use-disclosure\"\nimport { useCallback } from \"react\"\nimport { useDisclosure } from \"../../hooks/use-disclosure\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { cx, handlerAll, useIds } from \"../../utils\"\n\nexport interface UseModalProps\n extends HTMLProps, Omit<UseDisclosureProps, \"timing\"> {\n /**\n * If `true`, the modal will close when the `Esc` key is pressed.\n *\n * @default true\n */\n closeOnEsc?: boolean\n /**\n * If `true`, the modal will close when the overlay is clicked.\n *\n * @default true\n */\n closeOnOverlay?: boolean\n /**\n * Callback invoked when the escape key is pressed and focus is within modal.\n */\n onEsc?: () => void\n}\n\nexport const useModal = ({\n closeOnEsc = true,\n closeOnOverlay = true,\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onEsc,\n onOpen: onOpenProp,\n ...rest\n}: UseModalProps = {}) => {\n const { open, onClose, onOpen } = useDisclosure({\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n })\n const [contentId, titleId, bodyId] = useIds()\n const { t } = useI18n(\"modal\")\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n if (closeOnEsc) {\n ev.stopPropagation()\n onClose()\n }\n\n onEsc?.()\n },\n [closeOnEsc, onClose, onEsc],\n )\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n ...rest,\n ...props,\n }),\n [rest],\n )\n\n const getOverlayProps: PropGetter = useCallback(\n (props = {}) => ({\n \"aria-hidden\": \"true\",\n ...props,\n onClick: handlerAll(props.onClick, (ev) => {\n ev.stopPropagation()\n\n if (closeOnOverlay) onClose()\n }),\n }),\n [closeOnOverlay, onClose],\n )\n\n const getOpenTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n \"aria-controls\": open ? contentId : undefined,\n \"aria-expanded\": open,\n \"aria-haspopup\": \"dialog\",\n \"aria-label\": t(\"Open modal\"),\n ...props,\n onClick: handlerAll(props.onClick, onOpen),\n }),\n [contentId, onOpen, open, t],\n )\n\n const getCloseTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n \"aria-label\": t(\"Close modal\"),\n ...props,\n onClick: handlerAll(props.onClick, onClose),\n }),\n [onClose, t],\n )\n\n const getCloseButtonProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n \"aria-label\": t(\"Close modal\"),\n ...props,\n onClick: handlerAll(props.onClick, onClose),\n }),\n [onClose, t],\n )\n\n const getContentProps: PropGetter<\"section\"> = useCallback(\n ({\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": ariaLabelledby,\n ...props\n } = {}) => ({\n id: contentId,\n \"aria-describedby\": cx(ariaDescribedby, bodyId),\n \"aria-labelledby\": cx(ariaLabelledby, titleId),\n \"aria-modal\": \"true\",\n role: \"dialog\",\n ...props,\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [bodyId, contentId, onKeyDown, titleId],\n )\n\n const getHeaderProps: PropGetter<\"header\"> = useCallback(\n (props) => ({\n ...props,\n }),\n [],\n )\n\n const getTitleProps: PropGetter<\"h2\"> = useCallback(\n (props) => ({\n id: titleId,\n ...props,\n }),\n [titleId],\n )\n\n const getBodyProps: PropGetter = useCallback(\n (props) => ({\n id: bodyId,\n ...props,\n }),\n [bodyId],\n )\n\n const getFooterProps: PropGetter<\"footer\"> = useCallback(\n (props) => ({\n ...props,\n }),\n [],\n )\n\n return {\n open,\n getBodyProps,\n getCloseButtonProps,\n getCloseTriggerProps,\n getContentProps,\n getFooterProps,\n getHeaderProps,\n getOpenTriggerProps,\n getOverlayProps,\n getRootProps,\n getTitleProps,\n onClose,\n onOpen,\n }\n}\n\nexport type UseModalReturn = ReturnType<typeof useModal>\n"],"mappings":";;;;;;;;;;AA4BA,MAAa,YAAY,EACvB,aAAa,MACb,iBAAiB,MACjB,aACA,MAAM,UACN,SAAS,aACT,OACA,QAAQ,YACR,GAAG,SACc,EAAE,KAAK;CACxB,MAAM,EAAE,MAAM,SAAS,WAAWA,qCAAc;EAC9C;EACA,MAAM;EACN,SAAS;EACT,QAAQ;EACT,CAAC;CACF,MAAM,CAAC,WAAW,SAAS,UAAUC,oBAAQ;CAC7C,MAAM,EAAE,MAAMC,8BAAQ,QAAQ;CAE9B,MAAM,oCACH,OAAsB;AACrB,MAAI,GAAG,QAAQ,SAAU;AAEzB,MAAI,YAAY;AACd,MAAG,iBAAiB;AACpB,YAAS;;AAGX,WAAS;IAEX;EAAC;EAAY;EAAS;EAAM,CAC7B;CAED,MAAMC,uCACH,WAAW;EACV,GAAG;EACH,GAAG;EACJ,GACD,CAAC,KAAK,CACP;CAED,MAAMC,0CACH,QAAQ,EAAE,MAAM;EACf,eAAe;EACf,GAAG;EACH,2DAAoB,MAAM,UAAU,OAAO;AACzC,MAAG,iBAAiB;AAEpB,OAAI,eAAgB,UAAS;IAC7B;EACH,GACD,CAAC,gBAAgB,QAAQ,CAC1B;CAED,MAAMC,8CACH,QAAQ,EAAE,MAAM;EACf,iBAAiB,OAAO,YAAY;EACpC,iBAAiB;EACjB,iBAAiB;EACjB,cAAc,EAAE,aAAa;EAC7B,GAAG;EACH,2DAAoB,MAAM,SAAS,OAAO;EAC3C,GACD;EAAC;EAAW;EAAQ;EAAM;EAAE,CAC7B;CAED,MAAMC,+CACH,QAAQ,EAAE,MAAM;EACf,cAAc,EAAE,cAAc;EAC9B,GAAG;EACH,2DAAoB,MAAM,SAAS,QAAQ;EAC5C,GACD,CAAC,SAAS,EAAE,CACb;CAED,MAAMC,8CACH,QAAQ,EAAE,MAAM;EACf,cAAc,EAAE,cAAc;EAC9B,GAAG;EACH,2DAAoB,MAAM,SAAS,QAAQ;EAC5C,GACD,CAAC,SAAS,EAAE,CACb;CAED,MAAMC,0CACH,EACC,oBAAoB,iBACpB,mBAAmB,gBACnB,GAAG,UACD,EAAE,MAAM;EACV,IAAI;EACJ,8DAAuB,iBAAiB,OAAO;EAC/C,6DAAsB,gBAAgB,QAAQ;EAC9C,cAAc;EACd,MAAM;EACN,GAAG;EACH,6DAAsB,MAAM,WAAW,UAAU;EAClD,GACD;EAAC;EAAQ;EAAW;EAAW;EAAQ,CACxC;CAED,MAAMC,yCACH,WAAW,EACV,GAAG,OACJ,GACD,EAAE,CACH;CAED,MAAMC,wCACH,WAAW;EACV,IAAI;EACJ,GAAG;EACJ,GACD,CAAC,QAAQ,CACV;AAiBD,QAAO;EACL;EACA,sCAhBC,WAAW;GACV,IAAI;GACJ,GAAG;GACJ,GACD,CAAC,OAAO,CACT;EAYC;EACA;EACA;EACA,wCAZC,WAAW,EACV,GAAG,OACJ,GACD,EAAE,CACH;EASC;EACA;EACA;EACA;EACA;EACA;EACA;EACD"}
|
|
@@ -317,10 +317,12 @@ const SidebarMenuButton = withContext("button", ["menu", "button"])(void 0, (pro
|
|
|
317
317
|
const { mode } = useComponentContext();
|
|
318
318
|
const { menuProps } = useSidePanelComponentContext();
|
|
319
319
|
const offcanvas = mode === "offcanvas";
|
|
320
|
+
const { disabled, ...rest } = require_props.mergeProps(menuProps, props)();
|
|
320
321
|
return {
|
|
321
322
|
"data-menu": "",
|
|
322
|
-
|
|
323
|
-
|
|
323
|
+
disabled,
|
|
324
|
+
...rest,
|
|
325
|
+
tabIndex: (!offcanvas || open) && !disabled ? 0 : -1
|
|
324
326
|
};
|
|
325
327
|
});
|
|
326
328
|
const SidebarItem = withContext(({ animated: animatedProp, asyncChildren: asyncChildrenProp, children: childrenProp, endElement, indicator: indicatorProp, items, label, loadingScheme, render, startElement, contentProps, endElementProps, indicatorProps, labelProps, linkProps, startElementProps, tooltipProps, triggerProps, ...rest }) => {
|
|
@@ -354,7 +356,7 @@ const SidebarItem = withContext(({ animated: animatedProp, asyncChildren: asyncC
|
|
|
354
356
|
children: computedChildren
|
|
355
357
|
});
|
|
356
358
|
const animated = animatedProp ?? componentContext.animated ?? true;
|
|
357
|
-
const tabIndex = offcanvas ? open && expanded ? 0 : -1 : expanded ? 0 : -1;
|
|
359
|
+
const tabIndex = offcanvas ? open && expanded && !disabled ? 0 : -1 : expanded && !disabled ? 0 : -1;
|
|
358
360
|
const callbackProps = (0, react.useMemo)(() => ({
|
|
359
361
|
disabled,
|
|
360
362
|
expanded: groupOpen
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidebar.cjs","names":["createContext","createSlotComponent","sidebarStyle","useBreakpointValue","useValue","useSidebar","SidebarDescendantsContext","SidebarContext","styled","useSidebarContext","useSplitChildren","mergeProps","rest","children","useSidebarGroup","useIncludesChildren","useValidChildren","useLoadingComponent","useSidebarItem","SidebarItemContext","SidebarItemTooltip: FC<SidebarItemTooltipProps>","Tooltip","Collapse","ChevronRightIcon","Children"],"sources":["../../../../src/components/sidebar/sidebar.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type {\n Breakpoint,\n ExtractStyleValue,\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n} from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { CollapseProps } from \"../collapse\"\nimport type { Loading } from \"../loading\"\nimport type { WithTransitionProps } from \"../motion\"\nimport type {\n UseSidebarGroupProps,\n UseSidebarGroupReturn,\n UseSidebarItemProps,\n UseSidebarItemReturn,\n UseSidebarProps,\n UseSidebarReturn,\n} from \"./use-sidebar\"\nimport {\n Children,\n cloneElement,\n isValidElement,\n useCallback,\n useMemo,\n} from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useBreakpointValue } from \"../../hooks/use-breakpoint\"\nimport { useValue } from \"../../hooks/use-value\"\nimport {\n cast,\n createContext,\n dataAttr,\n isObject,\n isString,\n runIfFn,\n useIncludesChildren,\n useSplitChildren,\n useValidChildren,\n} from \"../../utils\"\nimport { Collapse } from \"../collapse\"\nimport { Drawer } from \"../drawer\"\nimport { ChevronRightIcon } from \"../icon\"\nimport { useLoadingComponent } from \"../loading\"\nimport { Tooltip, type TooltipProps } from \"../tooltip\"\nimport { sidebarStyle, type SidebarStyle } from \"./sidebar.style\"\nimport {\n SidebarContext,\n SidebarDescendantsContext,\n SidebarItemContext,\n useSidebar,\n useSidebarContext,\n useSidebarGroup,\n useSidebarItem,\n} from \"./use-sidebar\"\n\ninterface SidebarItemCallBackProps {\n disabled?: boolean\n expanded?: boolean\n}\n\ntype SidebarItemReactNode =\n | ReactNodeOrFunction<SidebarItemCallBackProps>\n | {\n group: ReactNodeOrFunction<SidebarItemCallBackProps>\n item?: ReactNodeOrFunction<SidebarItemCallBackProps>\n }\n | {\n item: ReactNodeOrFunction<SidebarItemCallBackProps>\n group?: ReactNodeOrFunction<SidebarItemCallBackProps>\n }\n\ninterface SidebarItemSharedRenderProps\n extends\n Pick<SidebarItemProps, \"label\">,\n Pick<\n UseSidebarItemReturn,\n | \"expanded\"\n | \"expandedValue\"\n | \"onExpandedChange\"\n | \"onSelectedChange\"\n | \"selected\"\n | \"selectedValue\"\n | \"value\"\n > {\n itemProps: HTMLStyledProps<\"li\">\n linkProps: HTMLStyledProps<\"a\">\n triggerProps: HTMLStyledProps<\"button\">\n endElement?: ReactNode\n startElement?: ReactNode\n}\n\ninterface SidebarItemRenderProps\n extends\n PropsWithChildren,\n Omit<SidebarItemSharedRenderProps, \"endElement\" | \"startElement\">,\n Pick<\n UseSidebarItemReturn,\n | \"group\"\n | \"groupLoading\"\n | \"groupOpen\"\n | \"onGroupClose\"\n | \"onGroupOpen\"\n | \"onGroupToggle\"\n > {\n endElement: { group?: ReactNode; item?: ReactNode }\n startElement: { group?: ReactNode; item?: ReactNode }\n indicator?: ReactNode\n link?: ReactNode\n trigger?: ReactNode\n}\n\ninterface SidebarItemLinkRenderProps extends Omit<\n SidebarItemSharedRenderProps,\n \"itemProps\" | \"triggerProps\"\n> {}\n\ninterface SidebarItemTriggerRenderProps\n extends\n Omit<SidebarItemSharedRenderProps, \"itemProps\" | \"linkProps\">,\n Pick<\n UseSidebarItemReturn,\n | \"groupLoading\"\n | \"groupOpen\"\n | \"onGroupClose\"\n | \"onGroupOpen\"\n | \"onGroupToggle\"\n > {\n indicator?: ReactNode\n}\n\ninterface SidebarItemRender {\n item?: ReactNodeOrFunction<SidebarItemRenderProps>\n link?: ReactNodeOrFunction<SidebarItemLinkRenderProps>\n trigger?: ReactNodeOrFunction<SidebarItemTriggerRenderProps>\n}\n\ninterface SidebarGroup extends Omit<SidebarGroupProps, \"children\" | \"value\"> {\n children: SidebarItemWithValue[]\n group: true\n}\n\nexport interface SidebarItemWithValue extends Omit<\n SidebarItemProps,\n \"children\"\n> {\n children?: SidebarItemWithValue[]\n}\n\nexport type SidebarItem = SidebarGroup | SidebarItemWithValue\n\nconst createKey = (props: SidebarItem, index: number) => {\n return \"value\" in props ? props.value || index : index\n}\n\nconst getReactNodeOrFunction = (\n type: \"group\" | \"item\",\n custom?: SidebarItemReactNode,\n root?: SidebarItemReactNode,\n): ReactNodeOrFunction<SidebarItemCallBackProps> => {\n if (isObject(custom) && (\"group\" in custom || \"item\" in custom)) {\n return custom[type]\n } else if (custom) {\n return custom\n } else if (isObject(root) && (\"group\" in root || \"item\" in root)) {\n return root[type]\n } else {\n return root\n }\n}\n\ninterface ComponentContext extends Pick<\n UseSidebarReturn,\n | \"getContentProps\"\n | \"getFooterProps\"\n | \"getHeaderProps\"\n | \"getSidePanelProps\"\n | \"getTriggerProps\"\n> {\n breakpoint: ExtractStyleValue<NonNullable<SidebarRootProps[\"breakpoint\"]>>\n mode: ExtractStyleValue<NonNullable<SidebarRootProps[\"mode\"]>>\n placement: ExtractStyleValue<NonNullable<SidebarRootProps[\"placement\"]>>\n}\n\ninterface GroupComponentContext\n extends\n Pick<SidebarGroupProps, \"contentProps\" | \"labelProps\">,\n Pick<UseSidebarGroupReturn, \"getContentProps\" | \"getLabelProps\"> {}\n\nconst [GroupComponentContext, useGroupComponentContext] =\n createContext<GroupComponentContext>({ name: \"GroupComponentContext\" })\n\ninterface ItemComponentContext {\n contentProps: SidebarItemContentProps\n endElementProps: SidebarItemEndElementProps\n indicatorProps: SidebarItemIndicatorProps\n labelProps: SidebarItemLabelProps\n startElementProps: SidebarItemStartElementProps\n tooltipProps: SidebarItemTooltipProps\n}\n\nconst [ItemComponentContext, useItemComponentContext] =\n createContext<ItemComponentContext>({ name: \"ItemComponentContext\" })\n\ninterface SidePanelComponentContext extends Pick<\n SidebarSidePanelProps,\n | \"animated\"\n | \"contentProps\"\n | \"endElement\"\n | \"endElementProps\"\n | \"footerProps\"\n | \"groupContentProps\"\n | \"groupProps\"\n | \"handleProps\"\n | \"headerProps\"\n | \"indicator\"\n | \"indicatorHidden\"\n | \"indicatorProps\"\n | \"itemContentProps\"\n | \"itemProps\"\n | \"items\"\n | \"labelProps\"\n | \"linkProps\"\n | \"loadingScheme\"\n | \"menuProps\"\n | \"render\"\n | \"startElement\"\n | \"startElementProps\"\n | \"tooltipProps\"\n | \"triggerProps\"\n> {}\n\nconst [SidePanelComponentContext, useSidePanelComponentContext] =\n createContext<SidePanelComponentContext>({\n name: \"SidePanelComponentContext\",\n })\n\nexport interface SidebarRootProps\n extends\n HTMLStyledProps<\"div\">,\n ThemeProps<SidebarStyle>,\n Omit<UseSidebarProps, \"mobile\"> {\n /**\n * The breakpoint to use for the sidebar. If `false`, the sidebar will be always visible.\n *\n * @default 'md'\n */\n breakpoint?: Exclude<Breakpoint, \"base\"> | false\n}\n\nconst {\n ComponentContext,\n PropsContext: SidebarPropsContext,\n useComponentContext,\n usePropsContext: useSidebarPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<SidebarRootProps, SidebarStyle, ComponentContext>(\n \"sidebar\",\n sidebarStyle,\n)\n\nexport { SidebarPropsContext, useSidebarPropsContext }\n\n/**\n * `Sidebar` is a component that is used to display a list of items in a sidebar.\n *\n * @see https://yamada-ui.com/docs/components/sidebar\n */\nexport const SidebarRoot = withProvider<\n \"div\",\n SidebarRootProps,\n \"mode\" | \"placement\"\n>(\n ({\n breakpoint = \"md\",\n mode: modeProp = \"offcanvas\",\n placement: placementProp = \"start\",\n ...rest\n }) => {\n const mobile =\n useBreakpointValue<boolean | undefined>(\n breakpoint ? { [breakpoint]: true } : { base: false },\n ) ?? false\n const mode = useValue(modeProp)\n const placement = useValue(placementProp)\n const {\n descendants,\n expandedValue,\n open,\n selectedValue,\n getContentProps,\n getFooterProps,\n getHeaderProps,\n getRootProps,\n getSidePanelProps,\n getTriggerProps,\n onClose,\n onExpandedChange,\n onOpen,\n onSelectedChange,\n onToggle,\n } = useSidebar({ mobile, ...rest })\n const context = useMemo(\n () => ({\n expandedValue,\n mobile,\n open,\n selectedValue,\n onClose,\n onExpandedChange,\n onOpen,\n onSelectedChange,\n onToggle,\n }),\n [\n mobile,\n expandedValue,\n open,\n selectedValue,\n onClose,\n onExpandedChange,\n onOpen,\n onSelectedChange,\n onToggle,\n ],\n )\n const componentContext = useMemo(\n () => ({\n breakpoint,\n mode,\n placement,\n getContentProps,\n getFooterProps,\n getHeaderProps,\n getSidePanelProps,\n getTriggerProps,\n }),\n [\n breakpoint,\n mode,\n placement,\n getContentProps,\n getFooterProps,\n getHeaderProps,\n getSidePanelProps,\n getTriggerProps,\n ],\n )\n\n return (\n <SidebarDescendantsContext value={descendants}>\n <SidebarContext value={context}>\n <ComponentContext value={componentContext}>\n <styled.div data-group {...getRootProps()} />\n </ComponentContext>\n </SidebarContext>\n </SidebarDescendantsContext>\n )\n },\n \"root\",\n { transferProps: [\"mode\", \"placement\"] },\n)()\n\nexport interface SidebarMainPanelProps extends HTMLStyledProps {}\n\nexport const SidebarMainPanel = withContext<\"div\", SidebarMainPanelProps>(\n \"div\",\n \"mainPanel\",\n)()\n\nexport interface SidebarTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarTrigger = withContext<\"button\", SidebarTriggerProps>(\n \"button\",\n \"trigger\",\n)(undefined, (props) => {\n const { getTriggerProps } = useComponentContext()\n\n return { asChild: true, ...getTriggerProps(props) }\n})\n\nexport interface SidebarSidePanelProps\n extends\n Omit<HTMLStyledProps<\"aside\">, \"content\">,\n Pick<SidebarContentProps, \"items\">,\n Pick<\n SidebarItemProps,\n | \"animated\"\n | \"endElement\"\n | \"endElementProps\"\n | \"indicator\"\n | \"indicatorProps\"\n | \"labelProps\"\n | \"linkProps\"\n | \"loadingScheme\"\n | \"render\"\n | \"startElement\"\n | \"startElementProps\"\n | \"tooltipProps\"\n | \"triggerProps\"\n > {\n /**\n * The content of the sidebar.\n */\n content?: ReactNode\n /**\n * The footer of the sidebar.\n */\n footer?: ReactNode\n /**\n * The header of the sidebar.\n */\n header?: ReactNode\n /**\n * If `true`, hide the tree indicator icon for all items.\n *\n * @default false\n */\n indicatorHidden?: boolean\n /**\n * If `true`, the sidebar will be rendered with a handle.\n *\n * @default true\n */\n withHandle?: boolean\n /**\n * Props for the content component.\n */\n contentProps?: SidebarContentProps\n /**\n * Props for the drawer component.\n */\n drawerProps?: Omit<\n Drawer.RootProps,\n | \"body\"\n | \"cancel\"\n | \"children\"\n | \"footer\"\n | \"header\"\n | \"middle\"\n | \"onCancel\"\n | \"onClose\"\n | \"onMiddle\"\n | \"onOpen\"\n | \"onSuccess\"\n | \"open\"\n | \"success\"\n | \"title\"\n | \"trigger\"\n >\n /**\n * Props for the footer component.\n */\n footerProps?: SidebarFooterProps\n /**\n * Props for the group content component.\n */\n groupContentProps?: Omit<SidebarGroupContentProps, \"children\">\n /**\n * Props for the group component.\n */\n groupProps?: Omit<SidebarGroupProps, \"children\" | \"label\" | \"value\">\n /**\n * Props for the handle component.\n */\n handleProps?: SidebarHandleProps\n /**\n * Props for the header component.\n */\n headerProps?: SidebarHeaderProps\n /**\n * Props for the item content component.\n */\n itemContentProps?: SidebarItemContentProps\n /**\n * Props for the item component.\n */\n itemProps?: Omit<\n SidebarItemProps,\n \"children\" | \"items\" | \"label\" | \"open\" | \"value\"\n >\n /**\n * Props for the menu component.\n *\n * @default 'md'\n */\n menuProps?: SidebarMenuProps\n}\n\nexport const SidebarSidePanel = withContext<\"aside\", SidebarSidePanelProps>(\n ({\n animated = true,\n children,\n content,\n endElement,\n footer,\n header,\n indicator,\n indicatorHidden,\n items,\n loadingScheme,\n render,\n startElement,\n withHandle = true,\n contentProps,\n drawerProps,\n endElementProps,\n footerProps,\n groupContentProps,\n groupProps,\n handleProps,\n headerProps,\n indicatorProps,\n itemContentProps,\n itemProps,\n labelProps,\n linkProps,\n menuProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n ...rest\n }) => {\n const { mobile, open, onClose } = useSidebarContext()\n const { breakpoint, placement, getSidePanelProps } = useComponentContext()\n const [\n omittedChildren,\n customHeader,\n customContent,\n customFooter,\n customHandle,\n ] = useSplitChildren(\n children,\n SidebarHeader,\n SidebarContent,\n SidebarFooter,\n SidebarHandle,\n )\n const context = useMemo(\n () => ({\n animated,\n endElement,\n indicator,\n indicatorHidden,\n items,\n loadingScheme,\n render,\n startElement,\n contentProps,\n endElementProps,\n footerProps,\n groupContentProps,\n groupProps,\n handleProps,\n headerProps,\n indicatorProps,\n itemContentProps,\n itemProps,\n labelProps,\n linkProps,\n menuProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n }),\n [\n animated,\n endElement,\n indicator,\n indicatorHidden,\n items,\n render,\n loadingScheme,\n startElement,\n contentProps,\n endElementProps,\n footerProps,\n groupContentProps,\n groupProps,\n handleProps,\n headerProps,\n indicatorProps,\n itemContentProps,\n itemProps,\n labelProps,\n linkProps,\n menuProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n ],\n )\n\n return (\n <SidePanelComponentContext value={context}>\n {mobile ? (\n <Drawer.Root\n size=\"sm\"\n autoFocus={false}\n duration={!animated ? 0 : undefined}\n open={open}\n placement={`inline-${placement}`}\n withCloseButton={false}\n portalProps={{ disabled: true }}\n onClose={onClose}\n {...drawerProps}\n >\n <Drawer.Content>\n {customHeader ??\n (header ? <SidebarHeader>{header}</SidebarHeader> : null)}\n\n {customContent ??\n (content || items ? (\n <SidebarContent>{content}</SidebarContent>\n ) : null)}\n\n {customFooter ??\n (footer ? <SidebarFooter>{footer}</SidebarFooter> : null)}\n </Drawer.Content>\n </Drawer.Root>\n ) : (\n <>\n <SidebarGap\n data-animated={dataAttr(animated)}\n display={\n breakpoint\n ? { base: undefined, [breakpoint]: \"none\" }\n : undefined\n }\n />\n\n <styled.aside\n data-animated={dataAttr(animated)}\n data-group\n display={\n breakpoint\n ? { base: undefined, [breakpoint]: \"none\" }\n : undefined\n }\n {...getSidePanelProps(rest)}\n >\n {customHeader ??\n (header ? <SidebarHeader>{header}</SidebarHeader> : null)}\n {customContent ??\n (content || items ? (\n <SidebarContent>{content}</SidebarContent>\n ) : null)}\n {customFooter ??\n (footer ? <SidebarFooter>{footer}</SidebarFooter> : null)}\n {customHandle ?? (withHandle ? <SidebarHandle /> : null)}\n\n {omittedChildren}\n </styled.aside>\n </>\n )}\n </SidePanelComponentContext>\n )\n },\n \"sidePanel\",\n)()\n\ninterface SidebarGapProps extends HTMLStyledProps<\"div\"> {}\n\nconst SidebarGap = withContext<\"div\", SidebarGapProps>(\"div\", \"gap\")()\n\nexport interface SidebarHeaderProps extends HTMLStyledProps<\"header\"> {}\n\nexport const SidebarHeader = withContext<\"header\", SidebarHeaderProps>(\n \"header\",\n \"header\",\n)(undefined, (props) => {\n const { getHeaderProps } = useComponentContext()\n const { headerProps } = useSidePanelComponentContext()\n\n return getHeaderProps(mergeProps(headerProps, props)())\n})\n\nexport interface SidebarFooterProps extends HTMLStyledProps<\"footer\"> {}\n\nexport const SidebarFooter = withContext<\"footer\", SidebarFooterProps>(\n \"footer\",\n \"footer\",\n)(undefined, (props) => {\n const { getFooterProps } = useComponentContext()\n const { footerProps } = useSidePanelComponentContext()\n\n return getFooterProps(mergeProps(footerProps, props)())\n})\n\nexport interface SidebarContentProps extends HTMLStyledProps<\"ul\"> {\n /**\n * If provided, generate elements based on items.\n */\n items?: SidebarItem[]\n}\n\nexport const SidebarContent = withContext<\"ul\", SidebarContentProps>(\n ({ children, items, ...rest }) => {\n const { getContentProps } = useComponentContext()\n const { items: rootItems, contentProps } = useSidePanelComponentContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return (items ?? rootItems)?.map((props, index) => {\n const key = createKey(props, index)\n\n if (\"group\" in props) {\n const { children, group: _, ...rest } = props\n\n return <SidebarGroup key={key} items={children} {...rest} />\n } else {\n const { children, ...rest } = props\n\n return <SidebarItem key={key} items={children} {...rest} />\n }\n })\n }, [children, items, rootItems])\n\n return (\n <styled.ul {...getContentProps(mergeProps(contentProps, rest)())}>\n {computedChildren}\n </styled.ul>\n )\n },\n \"content\",\n)()\n\nexport interface SidebarHandleProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarHandle = withContext<\"button\", SidebarHandleProps>(\n (props) => {\n const { handleProps } = useSidePanelComponentContext()\n\n return (\n <SidebarTrigger {...mergeProps(handleProps, props)()}>\n <styled.button tabIndex={-1} />\n </SidebarTrigger>\n )\n },\n \"handle\",\n)()\n\nexport interface SidebarGroupProps\n extends\n Omit<HTMLStyledProps<\"li\">, \"content\" | \"value\">,\n UseSidebarGroupProps {\n /**\n * If provided, generate elements based on items.\n */\n items?: SidebarItemWithValue[]\n /**\n * The label of the group.\n */\n label?: ReactNode\n /**\n * Props for the content component.\n */\n contentProps?: Omit<SidebarGroupContentProps, \"children\">\n /**\n * Props for the label component.\n */\n labelProps?: HTMLStyledProps<\"span\">\n}\n\nexport const SidebarGroup = withContext<\"li\", SidebarGroupProps>(\n ({\n children,\n items,\n label,\n value: valueProp = isString(label) ? label : undefined,\n contentProps,\n labelProps,\n ...rest\n }) => {\n const { groupProps } = useSidePanelComponentContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items?.map(({ children, ...rest }, index) => {\n const key = createKey(rest, index)\n\n return <SidebarItem key={key} items={children} {...rest} />\n })\n }, [children, items])\n const [omittedChildren, customLabel, customContent] = useSplitChildren(\n computedChildren,\n SidebarGroupLabel,\n SidebarGroupContent,\n )\n const { getContentProps, getLabelProps, getRootProps } = useSidebarGroup({\n ...mergeProps(groupProps, rest)(),\n value: valueProp,\n })\n const context = useMemo(\n () => ({ contentProps, getContentProps, getLabelProps, labelProps }),\n [getLabelProps, labelProps, getContentProps, contentProps],\n )\n\n return (\n <GroupComponentContext value={context}>\n <styled.li {...getRootProps()}>\n {customLabel ??\n (label ? <SidebarGroupLabel>{label}</SidebarGroupLabel> : null)}\n {customContent ?? (\n <SidebarGroupContent>{omittedChildren}</SidebarGroupContent>\n )}\n </styled.li>\n </GroupComponentContext>\n )\n },\n \"group\",\n)()\n\nexport interface SidebarGroupLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const SidebarGroupLabel = withContext<\"span\", SidebarGroupLabelProps>(\n \"span\",\n \"groupLabel\",\n)(undefined, (props) => {\n const { getLabelProps, labelProps } = useGroupComponentContext()\n\n return getLabelProps(mergeProps(labelProps, props)())\n})\n\nexport interface SidebarGroupContentProps extends HTMLStyledProps<\"div\"> {}\n\nexport const SidebarGroupContent = withContext<\"div\", SidebarGroupContentProps>(\n \"div\",\n \"groupContent\",\n)(undefined, ({ children, ...rest }) => {\n const validChildren = useValidChildren(children)\n const list = useIncludesChildren(validChildren, SidebarItem)\n const { groupContentProps } = useSidePanelComponentContext()\n const { contentProps, getContentProps } = useGroupComponentContext()\n\n return {\n as: list ? \"ul\" : \"div\",\n children,\n ...getContentProps(mergeProps(groupContentProps, contentProps, rest)()),\n }\n})\n\nexport interface SidebarMenuProps extends HTMLStyledProps<\"div\"> {}\n\nexport const SidebarMenu = withContext<\"div\", SidebarMenuProps>(\"div\", \"menu\")(\n undefined,\n (props) => {\n const { menuProps } = useSidePanelComponentContext()\n\n return { \"data-menu\": \"\", ...mergeProps(menuProps, props)() }\n },\n)\n\nexport interface SidebarMenuButtonProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarMenuButton = withContext<\"button\", SidebarMenuButtonProps>(\n \"button\",\n [\"menu\", \"button\"],\n)(undefined, (props) => {\n const { open } = useSidebarContext()\n const { mode } = useComponentContext()\n const { menuProps } = useSidePanelComponentContext()\n const offcanvas = mode === \"offcanvas\"\n\n return {\n \"data-menu\": \"\",\n ...mergeProps(menuProps, props)(),\n tabIndex: !offcanvas || open ? 0 : -1,\n }\n})\n\nexport interface SidebarItemProps\n extends\n Omit<HTMLStyledProps<\"li\">, \"value\">,\n Omit<UseSidebarItemProps, \"asyncChildren\"> {\n /**\n * The label to display in the item.\n */\n label: ReactNode\n /**\n * If `true`, the sidebar item will be animated.\n *\n * @default true\n */\n animated?: boolean\n /**\n * The element to display at the end of the item.\n */\n endElement?: SidebarItemReactNode\n /**\n * The sidebar item indicator icon to use.\n */\n indicator?: ReactNodeOrFunction<SidebarItemCallBackProps>\n /**\n * If provided, generate elements based on items.\n */\n items?: SidebarItemWithValue[]\n /**\n * The loading scheme.\n *\n * @default 'oval'\n */\n loadingScheme?: Loading.Scheme\n /**\n * If provided, the sidebar item will be rendered with custom components.\n */\n render?: SidebarItemRender\n /**\n * The element to display at the start of the item.\n */\n startElement?: SidebarItemReactNode\n /**\n * Props for the content component.\n */\n contentProps?: Omit<SidebarItemContentProps, \"children\">\n /**\n * Props for the end component.\n */\n endElementProps?: SidebarItemEndElementProps\n /**\n * Props for the indicator component.\n */\n indicatorProps?: SidebarItemIndicatorProps\n /**\n * Props for the label component.\n */\n labelProps?: SidebarItemLabelProps\n /**\n * Props for the link component.\n */\n linkProps?: SidebarItemLinkProps\n /**\n * Props for the start component.\n */\n startElementProps?: SidebarItemStartElementProps\n /**\n * Props for the tooltip component.\n */\n tooltipProps?: Omit<SidebarItemTooltipProps, \"children\" | \"content\">\n /**\n * Props for the trigger component.\n */\n triggerProps?: SidebarItemTriggerProps\n /**\n * If provided, the sidebar item will be rendered as an async sidebar item.\n */\n asyncChildren?: () => Promise<SidebarItemWithValue[]>\n}\n\nexport const SidebarItem = withContext<\"li\", SidebarItemProps>(\n ({\n animated: animatedProp,\n asyncChildren: asyncChildrenProp,\n children: childrenProp,\n endElement,\n indicator: indicatorProp,\n items,\n label,\n loadingScheme,\n render,\n startElement,\n contentProps,\n endElementProps,\n indicatorProps,\n labelProps,\n linkProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n ...rest\n }) => {\n const { mode } = useComponentContext()\n const offcanvas = mode === \"offcanvas\"\n const componentContext = useSidePanelComponentContext()\n const Loading = useLoadingComponent(\n loadingScheme ?? componentContext.loadingScheme ?? \"oval\",\n )\n const computedChildren = useMemo(() => {\n if (childrenProp) return childrenProp\n\n return items?.map(({ children, ...rest }, index) => {\n const key = createKey(rest, index)\n\n return <SidebarItem key={key} items={children} {...rest} />\n })\n }, [childrenProp, items])\n const asyncChildren = useCallback(async () => {\n const items = await asyncChildrenProp?.()\n\n return items?.map(({ children, ...rest }, index) => {\n const key = createKey(rest, index)\n\n return <SidebarItem key={key} items={children} {...rest} />\n })\n }, [asyncChildrenProp])\n const {\n branchOpen,\n children,\n disabled,\n expanded,\n expandedValue,\n group,\n groupLoading,\n groupOpen,\n open,\n selected,\n selectedValue,\n value,\n getContentProps,\n getIndicatorProps,\n getItemProps,\n getLabelProps,\n getLinkProps,\n getTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n } = useSidebarItem({\n ...componentContext.itemProps,\n ...rest,\n asyncChildren: asyncChildrenProp ? asyncChildren : undefined,\n children: computedChildren,\n })\n const animated = animatedProp ?? componentContext.animated ?? true\n const tabIndex = offcanvas ? (open && expanded ? 0 : -1) : expanded ? 0 : -1\n const callbackProps = useMemo(\n () => ({ disabled, expanded: groupOpen }),\n [disabled, groupOpen],\n )\n const mergedTriggerProps = useMemo(() => {\n return getTriggerProps({\n tabIndex,\n ...mergeProps(componentContext.triggerProps, triggerProps)(),\n }) as SidebarItemTriggerProps\n }, [getTriggerProps, tabIndex, componentContext.triggerProps, triggerProps])\n const mergedLinkProps = useMemo(() => {\n return getLinkProps({\n tabIndex,\n ...mergeProps(componentContext.linkProps, linkProps)(),\n }) as SidebarItemLinkProps\n }, [getLinkProps, tabIndex, componentContext.linkProps, linkProps])\n const indicator = useMemo<ReactNode>(\n () => runIfFn(indicatorProp ?? componentContext.indicator, callbackProps),\n [indicatorProp, componentContext.indicator, callbackProps],\n )\n const groupStartElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"group\",\n startElement,\n componentContext.startElement,\n ),\n callbackProps,\n ),\n [startElement, componentContext.startElement, callbackProps],\n )\n const groupEndElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"group\",\n endElement,\n componentContext.endElement,\n ),\n callbackProps,\n ),\n [endElement, componentContext.endElement, callbackProps],\n )\n const itemStartElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"item\",\n startElement,\n componentContext.startElement,\n ),\n callbackProps,\n ),\n [startElement, componentContext.startElement, callbackProps],\n )\n const itemEndElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"item\",\n endElement,\n componentContext.endElement,\n ),\n callbackProps,\n ),\n [endElement, componentContext.endElement, callbackProps],\n )\n const trigger = useMemo<ReactNode>(\n () =>\n runIfFn(render?.trigger ?? componentContext.render?.trigger, {\n endElement: groupEndElement,\n expanded,\n expandedValue,\n groupLoading,\n groupOpen,\n indicator,\n label,\n selected,\n selectedValue,\n startElement: groupStartElement,\n value,\n triggerProps: mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n }),\n [\n render?.trigger,\n componentContext.render?.trigger,\n groupEndElement,\n expanded,\n expandedValue,\n groupLoading,\n groupOpen,\n indicator,\n label,\n selected,\n selectedValue,\n groupStartElement,\n value,\n mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n ],\n )\n const link = useMemo<ReactNode>(\n () =>\n runIfFn(render?.link ?? componentContext.render?.link, {\n endElement: itemEndElement,\n expanded,\n expandedValue,\n label,\n selected,\n selectedValue,\n startElement: itemStartElement,\n value,\n linkProps: mergedLinkProps,\n onExpandedChange,\n onSelectedChange,\n }),\n [\n render?.link,\n componentContext.render?.link,\n itemEndElement,\n expanded,\n expandedValue,\n label,\n selected,\n selectedValue,\n itemStartElement,\n value,\n mergedLinkProps,\n onExpandedChange,\n onSelectedChange,\n ],\n )\n const item = useMemo<ReactNode>(\n () =>\n runIfFn(render?.item ?? componentContext.render?.item, {\n children,\n endElement: { group: groupEndElement, item: itemEndElement },\n expanded,\n expandedValue,\n group,\n groupLoading,\n groupOpen,\n indicator,\n label,\n link,\n selected,\n selectedValue,\n startElement: { group: groupStartElement, item: itemStartElement },\n trigger,\n value,\n itemProps: getItemProps() as HTMLStyledProps<\"li\">,\n linkProps: mergedLinkProps,\n triggerProps: mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n }),\n [\n render?.item,\n componentContext.render?.item,\n children,\n groupEndElement,\n itemEndElement,\n expanded,\n expandedValue,\n group,\n groupLoading,\n groupOpen,\n indicator,\n label,\n link,\n selected,\n selectedValue,\n groupStartElement,\n itemStartElement,\n trigger,\n value,\n getItemProps,\n mergedLinkProps,\n mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n ],\n )\n const context = useMemo(\n () => ({ branchOpen, groupOpen }),\n [branchOpen, groupOpen],\n )\n const itemComponentContext = useMemo(\n () => ({\n contentProps: {\n duration: !animated ? 0 : undefined,\n open: groupOpen,\n ...getContentProps(\n mergeProps(componentContext.itemContentProps, contentProps)(),\n ),\n },\n endElementProps: mergeProps(\n componentContext.endElementProps,\n endElementProps,\n )(),\n indicatorProps: getIndicatorProps({\n \"data-animated\": dataAttr(animated),\n ...mergeProps(componentContext.indicatorProps, indicatorProps)(),\n }) as SidebarItemIndicatorProps,\n labelProps: getLabelProps(\n mergeProps(componentContext.labelProps, labelProps)(),\n ) as SidebarItemLabelProps,\n startElementProps: mergeProps(\n componentContext.startElementProps,\n startElementProps,\n )(),\n tooltipProps: {\n content: label,\n disabled: open,\n ...mergeProps(componentContext.tooltipProps, tooltipProps)(),\n },\n }),\n [\n animated,\n componentContext.endElementProps,\n componentContext.indicatorProps,\n componentContext.itemContentProps,\n componentContext.labelProps,\n componentContext.startElementProps,\n componentContext.tooltipProps,\n contentProps,\n endElementProps,\n getContentProps,\n getIndicatorProps,\n getLabelProps,\n groupOpen,\n indicatorProps,\n label,\n labelProps,\n open,\n startElementProps,\n tooltipProps,\n ],\n )\n\n return (\n <SidebarItemContext value={context}>\n <ItemComponentContext value={itemComponentContext}>\n {item ?? (\n <styled.li {...getItemProps()}>\n {group ? (\n <>\n {trigger ?? (\n <SidebarItemTrigger {...mergedTriggerProps}>\n {groupStartElement ? (\n <SidebarItemStartElement>\n {groupStartElement}\n </SidebarItemStartElement>\n ) : null}\n {label ? (\n <SidebarItemLabel>{label}</SidebarItemLabel>\n ) : null}\n {groupEndElement ? (\n <SidebarItemEndElement>\n {groupEndElement}\n </SidebarItemEndElement>\n ) : null}\n <SidebarItemIndicator>\n {groupLoading ? (\n <Loading />\n ) : (\n runIfFn(indicator, callbackProps)\n )}\n </SidebarItemIndicator>\n </SidebarItemTrigger>\n )}\n\n <SidebarItemContent>{children}</SidebarItemContent>\n </>\n ) : (\n (link ?? (\n <SidebarItemLink {...mergedLinkProps}>\n {itemStartElement ? (\n <SidebarItemStartElement>\n {itemStartElement}\n </SidebarItemStartElement>\n ) : null}\n {label ? (\n <SidebarItemLabel>{label}</SidebarItemLabel>\n ) : null}\n {itemEndElement ? (\n <SidebarItemEndElement>\n {itemEndElement}\n </SidebarItemEndElement>\n ) : null}\n </SidebarItemLink>\n ))\n )}\n </styled.li>\n )}\n </ItemComponentContext>\n </SidebarItemContext>\n )\n },\n \"item\",\n)()\n\ninterface SidebarItemTooltipProps extends TooltipProps {}\n\nconst SidebarItemTooltip: FC<SidebarItemTooltipProps> = (props) => {\n const { tooltipProps } = useItemComponentContext()\n const { children, disabled, ...rest } = { ...tooltipProps, ...props }\n const { mode, placement } = useComponentContext()\n const offcanvas = mode === \"offcanvas\"\n\n if (offcanvas || disabled) {\n return children\n } else {\n return (\n <Tooltip\n closeOnClick={false}\n gutter={16}\n placement={`center-${placement === \"start\" ? \"end\" : \"start\"}`}\n {...rest}\n >\n {children}\n </Tooltip>\n )\n }\n}\n\nexport interface SidebarItemTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarItemTrigger = withContext<\n \"button\",\n SidebarItemTriggerProps\n>((props) => {\n return (\n <SidebarItemTooltip>\n <styled.button {...props} />\n </SidebarItemTooltip>\n )\n}, \"itemTrigger\")()\n\nexport interface SidebarItemLinkProps extends HTMLStyledProps<\"a\"> {}\n\nexport const SidebarItemLink = withContext<\"a\", SidebarItemLinkProps>(\n (props) => {\n return (\n <SidebarItemTooltip>\n <styled.a {...props} />\n </SidebarItemTooltip>\n )\n },\n \"itemLink\",\n)()\n\nexport interface SidebarItemContentProps\n extends\n Omit<HTMLStyledProps<\"ul\">, \"transition\">,\n Pick<CollapseProps, \"animationOpacity\" | keyof WithTransitionProps> {}\n\nexport const SidebarItemContent = withContext<\"ul\", SidebarItemContentProps>(\n (props) => {\n const { contentProps = {} } = useItemComponentContext()\n\n return (\n <Collapse\n as=\"ul\"\n {...cast<CollapseProps>(mergeProps(contentProps, props)())}\n />\n )\n },\n \"itemContent\",\n)()\n\nexport interface SidebarItemIndicatorProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const SidebarItemIndicator = withContext<\n \"svg\",\n SidebarItemIndicatorProps\n>(({ children = <ChevronRightIcon />, ...rest }) => {\n const { indicatorHidden } = useSidePanelComponentContext()\n\n if (indicatorHidden) return null\n\n if (isValidElement<HTMLProps<\"svg\">>(children))\n return cloneElement(children, { ...rest, ...children.props })\n\n return Children.count(children) > 1 ? Children.only(null) : null\n}, \"itemIndicator\")(undefined, (props) => {\n const { indicatorProps } = useItemComponentContext()\n\n return mergeProps(indicatorProps, props)()\n})\n\nexport interface SidebarItemStartElementProps extends HTMLStyledProps {}\n\nexport const SidebarItemStartElement = withContext<\n \"div\",\n SidebarItemStartElementProps\n>(\"div\", {\n name: \"ItemStartElement\",\n slot: [\"itemElement\", \"start\"],\n})(undefined, (props) => {\n const { startElementProps } = useItemComponentContext()\n\n return mergeProps(startElementProps, props)()\n})\n\nexport interface SidebarItemEndElementProps extends HTMLStyledProps {}\n\nexport const SidebarItemEndElement = withContext<\n \"div\",\n SidebarItemEndElementProps\n>(\"div\", {\n name: \"ItemEndElement\",\n slot: [\"itemElement\", \"end\"],\n})(undefined, (props) => {\n const { endElementProps } = useItemComponentContext()\n\n return mergeProps(endElementProps, props)()\n})\n\nexport interface SidebarItemLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const SidebarItemLabel = withContext<\"span\", SidebarItemLabelProps>(\n \"span\",\n \"itemLabel\",\n)(undefined, (props) => {\n const { labelProps } = useItemComponentContext()\n\n return mergeProps(labelProps, props)()\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA,MAAM,aAAa,OAAoB,UAAkB;AACvD,QAAO,WAAW,QAAQ,MAAM,SAAS,QAAQ;;AAGnD,MAAM,0BACJ,MACA,QACA,SACkD;AAClD,qDAAa,OAAO,KAAK,WAAW,UAAU,UAAU,QACtD,QAAO,OAAO;UACL,OACT,QAAO;0DACW,KAAK,KAAK,WAAW,QAAQ,UAAU,MACzD,QAAO,KAAK;KAEZ,QAAO;;AAsBX,MAAM,CAAC,uBAAuB,4BAC5BA,8BAAqC,EAAE,MAAM,yBAAyB,CAAC;AAWzE,MAAM,CAAC,sBAAsB,2BAC3BA,8BAAoC,EAAE,MAAM,wBAAwB,CAAC;AA8BvE,MAAM,CAAC,2BAA2B,gCAChCA,8BAAyC,EACvC,MAAM,6BACP,CAAC;AAeJ,MAAM,EACJ,kBACA,cAAc,qBACd,qBACA,iBAAiB,wBACjB,aACA,iBACEC,6CACF,WACAC,mCACD;;;;;;AASD,MAAa,cAAc,cAKxB,EACC,aAAa,MACb,MAAM,WAAW,aACjB,WAAW,gBAAgB,SAC3B,GAAG,WACC;CACJ,MAAM,SACJC,gDACE,aAAa,GAAG,aAAa,MAAM,GAAG,EAAE,MAAM,OAAO,CACtD,IAAI;CACP,MAAM,OAAOC,uCAAS,SAAS;CAC/B,MAAM,YAAYA,uCAAS,cAAc;CACzC,MAAM,EACJ,aACA,eACA,MACA,eACA,iBACA,gBACA,gBACA,cACA,mBACA,iBACA,SACA,kBACA,QACA,kBACA,aACEC,+BAAW;EAAE;EAAQ,GAAG;EAAM,CAAC;AAgDnC,QACE,2CAACC;EAA0B,OAAO;YAChC,2CAACC;GAAe,iCAhDX;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD,GACD;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD,CACF;aA2BK,2CAAC;IAAiB,iCAzBf;KACL;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACD,GACD;KACE;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACD,CACF;cAMO,2CAACC,uBAAO;KAAI;KAAW,GAAI,cAAc;MAAI;KAC5B;IACJ;GACS;GAGhC,QACA,EAAE,eAAe,CAAC,QAAQ,YAAY,EAAE,CACzC,EAAE;AAIH,MAAa,mBAAmB,YAC9B,OACA,YACD,EAAE;AAIH,MAAa,iBAAiB,YAC5B,UACA,UACD,CAAC,SAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,qBAAqB;AAEjD,QAAO;EAAE,SAAS;EAAM,GAAG,gBAAgB,MAAM;EAAE;EACnD;AA8GF,MAAa,mBAAmB,aAC7B,EACC,WAAW,MACX,UACA,SACA,YACA,QACA,QACA,WACA,iBACA,OACA,eACA,QACA,cACA,aAAa,MACb,cACA,aACA,iBACA,aACA,mBACA,YACA,aACA,aACA,gBACA,kBACA,WACA,YACA,WACA,WACA,mBACA,cACA,cACA,GAAG,WACC;CACJ,MAAM,EAAE,QAAQ,MAAM,YAAYC,uCAAmB;CACrD,MAAM,EAAE,YAAY,WAAW,sBAAsB,qBAAqB;CAC1E,MAAM,CACJ,iBACA,cACA,eACA,cACA,gBACEC,kCACF,UACA,eACA,gBACA,eACA,cACD;AAwDD,QACE,2CAAC;EAA0B,iCAvDpB;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;YAII,SACC;GACE,MAAK;GACL,WAAW;GACX,UAAU,CAAC,WAAW,IAAI;GACpB;GACN,WAAW,UAAU;GACrB,iBAAiB;GACjB,aAAa,EAAE,UAAU,MAAM;GACtB;GACT,GAAI;aAEJ;IACG,iBACE,SAAS,2CAAC,2BAAe,SAAuB,GAAG;IAErD,kBACE,WAAW,QACV,2CAAC,4BAAgB,UAAyB,GACxC;IAEL,iBACE,SAAS,2CAAC,2BAAe,SAAuB,GAAG;OACvC;IACL,GAEd,qFACE,2CAAC;GACC,iEAAwB,SAAS;GACjC,SACE,aAC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A;EACA;EACA;EACA;EACD,CAAC,EACJ;EACE,QAAQ;EACR,iBAAiB,QAAQ;EACzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CACD,MAAM,+EAEM,QAAQ,QAAQ,iBAAiB,QAAQ,MAAM;EACrD,YAAY;EACZ;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA,WAAW;EACX;EACA;EACD,CAAC,EACJ;EACE,QAAQ;EACR,iBAAiB,QAAQ;EACzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CACD,MAAM,+EAEM,QAAQ,QAAQ,iBAAiB,QAAQ,MAAM;EACrD;EACA,YAAY;GAAE,OAAO;GAAiB,MAAM;GAAgB;EAC5D;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;GAAE,OAAO;GAAmB,MAAM;GAAkB;EAClE;EACA;EACA,WAAW,cAAc;EACzB,WAAW;EACX,cAAc;EACd;EACA;EACA;EACA;EACA;EACD,CAAC,EACJ;EACE,QAAQ;EACR,iBAAiB,QAAQ;EACzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AA0DD,QACE,2CAACQ;EAAmB,iCAzDb;GAAE;GAAY;GAAW,GAChC,CAAC,YAAY,UAAU,CACxB;YAwDG,2CAAC;GAAqB,iCAtDjB;IACL,cAAc;KACZ,UAAU,CAAC,WAAW,IAAI;KAC1B,MAAM;KACN,GAAG,gBACDR,yBAAW,iBAAiB,kBAAkB,aAAa,EAAE,CAC9D;KACF;IACD,iBAAiBA,yBACf,iBAAiB,iBACjB,gBACD,EAAE;IACH,gBAAgB,kBAAkB;KAChC,iEAA0B,SAAS;KACnC,GAAGA,yBAAW,iBAAiB,gBAAgB,eAAe,EAAE;KACjE,CAAC;IACF,YAAY,cACVA,yBAAW,iBAAiB,YAAY,WAAW,EAAE,CACtD;IACD,mBAAmBA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"}
|
|
1
|
+
{"version":3,"file":"sidebar.cjs","names":["createContext","createSlotComponent","sidebarStyle","useBreakpointValue","useValue","useSidebar","SidebarDescendantsContext","SidebarContext","styled","useSidebarContext","useSplitChildren","mergeProps","rest","children","useSidebarGroup","useIncludesChildren","useValidChildren","useLoadingComponent","useSidebarItem","SidebarItemContext","SidebarItemTooltip: FC<SidebarItemTooltipProps>","Tooltip","Collapse","ChevronRightIcon","Children"],"sources":["../../../../src/components/sidebar/sidebar.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type {\n Breakpoint,\n ExtractStyleValue,\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n} from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { CollapseProps } from \"../collapse\"\nimport type { Loading } from \"../loading\"\nimport type { WithTransitionProps } from \"../motion\"\nimport type {\n UseSidebarGroupProps,\n UseSidebarGroupReturn,\n UseSidebarItemProps,\n UseSidebarItemReturn,\n UseSidebarProps,\n UseSidebarReturn,\n} from \"./use-sidebar\"\nimport {\n Children,\n cloneElement,\n isValidElement,\n useCallback,\n useMemo,\n} from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useBreakpointValue } from \"../../hooks/use-breakpoint\"\nimport { useValue } from \"../../hooks/use-value\"\nimport {\n cast,\n createContext,\n dataAttr,\n isObject,\n isString,\n runIfFn,\n useIncludesChildren,\n useSplitChildren,\n useValidChildren,\n} from \"../../utils\"\nimport { Collapse } from \"../collapse\"\nimport { Drawer } from \"../drawer\"\nimport { ChevronRightIcon } from \"../icon\"\nimport { useLoadingComponent } from \"../loading\"\nimport { Tooltip, type TooltipProps } from \"../tooltip\"\nimport { sidebarStyle, type SidebarStyle } from \"./sidebar.style\"\nimport {\n SidebarContext,\n SidebarDescendantsContext,\n SidebarItemContext,\n useSidebar,\n useSidebarContext,\n useSidebarGroup,\n useSidebarItem,\n} from \"./use-sidebar\"\n\ninterface SidebarItemCallBackProps {\n disabled?: boolean\n expanded?: boolean\n}\n\ntype SidebarItemReactNode =\n | ReactNodeOrFunction<SidebarItemCallBackProps>\n | {\n group: ReactNodeOrFunction<SidebarItemCallBackProps>\n item?: ReactNodeOrFunction<SidebarItemCallBackProps>\n }\n | {\n item: ReactNodeOrFunction<SidebarItemCallBackProps>\n group?: ReactNodeOrFunction<SidebarItemCallBackProps>\n }\n\ninterface SidebarItemSharedRenderProps\n extends\n Pick<SidebarItemProps, \"label\">,\n Pick<\n UseSidebarItemReturn,\n | \"expanded\"\n | \"expandedValue\"\n | \"onExpandedChange\"\n | \"onSelectedChange\"\n | \"selected\"\n | \"selectedValue\"\n | \"value\"\n > {\n itemProps: HTMLStyledProps<\"li\">\n linkProps: HTMLStyledProps<\"a\">\n triggerProps: HTMLStyledProps<\"button\">\n endElement?: ReactNode\n startElement?: ReactNode\n}\n\ninterface SidebarItemRenderProps\n extends\n PropsWithChildren,\n Omit<SidebarItemSharedRenderProps, \"endElement\" | \"startElement\">,\n Pick<\n UseSidebarItemReturn,\n | \"group\"\n | \"groupLoading\"\n | \"groupOpen\"\n | \"onGroupClose\"\n | \"onGroupOpen\"\n | \"onGroupToggle\"\n > {\n endElement: { group?: ReactNode; item?: ReactNode }\n startElement: { group?: ReactNode; item?: ReactNode }\n indicator?: ReactNode\n link?: ReactNode\n trigger?: ReactNode\n}\n\ninterface SidebarItemLinkRenderProps extends Omit<\n SidebarItemSharedRenderProps,\n \"itemProps\" | \"triggerProps\"\n> {}\n\ninterface SidebarItemTriggerRenderProps\n extends\n Omit<SidebarItemSharedRenderProps, \"itemProps\" | \"linkProps\">,\n Pick<\n UseSidebarItemReturn,\n | \"groupLoading\"\n | \"groupOpen\"\n | \"onGroupClose\"\n | \"onGroupOpen\"\n | \"onGroupToggle\"\n > {\n indicator?: ReactNode\n}\n\ninterface SidebarItemRender {\n item?: ReactNodeOrFunction<SidebarItemRenderProps>\n link?: ReactNodeOrFunction<SidebarItemLinkRenderProps>\n trigger?: ReactNodeOrFunction<SidebarItemTriggerRenderProps>\n}\n\ninterface SidebarGroup extends Omit<SidebarGroupProps, \"children\" | \"value\"> {\n children: SidebarItemWithValue[]\n group: true\n}\n\nexport interface SidebarItemWithValue extends Omit<\n SidebarItemProps,\n \"children\"\n> {\n children?: SidebarItemWithValue[]\n}\n\nexport type SidebarItem = SidebarGroup | SidebarItemWithValue\n\nconst createKey = (props: SidebarItem, index: number) => {\n return \"value\" in props ? props.value || index : index\n}\n\nconst getReactNodeOrFunction = (\n type: \"group\" | \"item\",\n custom?: SidebarItemReactNode,\n root?: SidebarItemReactNode,\n): ReactNodeOrFunction<SidebarItemCallBackProps> => {\n if (isObject(custom) && (\"group\" in custom || \"item\" in custom)) {\n return custom[type]\n } else if (custom) {\n return custom\n } else if (isObject(root) && (\"group\" in root || \"item\" in root)) {\n return root[type]\n } else {\n return root\n }\n}\n\ninterface ComponentContext extends Pick<\n UseSidebarReturn,\n | \"getContentProps\"\n | \"getFooterProps\"\n | \"getHeaderProps\"\n | \"getSidePanelProps\"\n | \"getTriggerProps\"\n> {\n breakpoint: ExtractStyleValue<NonNullable<SidebarRootProps[\"breakpoint\"]>>\n mode: ExtractStyleValue<NonNullable<SidebarRootProps[\"mode\"]>>\n placement: ExtractStyleValue<NonNullable<SidebarRootProps[\"placement\"]>>\n}\n\ninterface GroupComponentContext\n extends\n Pick<SidebarGroupProps, \"contentProps\" | \"labelProps\">,\n Pick<UseSidebarGroupReturn, \"getContentProps\" | \"getLabelProps\"> {}\n\nconst [GroupComponentContext, useGroupComponentContext] =\n createContext<GroupComponentContext>({ name: \"GroupComponentContext\" })\n\ninterface ItemComponentContext {\n contentProps: SidebarItemContentProps\n endElementProps: SidebarItemEndElementProps\n indicatorProps: SidebarItemIndicatorProps\n labelProps: SidebarItemLabelProps\n startElementProps: SidebarItemStartElementProps\n tooltipProps: SidebarItemTooltipProps\n}\n\nconst [ItemComponentContext, useItemComponentContext] =\n createContext<ItemComponentContext>({ name: \"ItemComponentContext\" })\n\ninterface SidePanelComponentContext extends Pick<\n SidebarSidePanelProps,\n | \"animated\"\n | \"contentProps\"\n | \"endElement\"\n | \"endElementProps\"\n | \"footerProps\"\n | \"groupContentProps\"\n | \"groupProps\"\n | \"handleProps\"\n | \"headerProps\"\n | \"indicator\"\n | \"indicatorHidden\"\n | \"indicatorProps\"\n | \"itemContentProps\"\n | \"itemProps\"\n | \"items\"\n | \"labelProps\"\n | \"linkProps\"\n | \"loadingScheme\"\n | \"menuProps\"\n | \"render\"\n | \"startElement\"\n | \"startElementProps\"\n | \"tooltipProps\"\n | \"triggerProps\"\n> {}\n\nconst [SidePanelComponentContext, useSidePanelComponentContext] =\n createContext<SidePanelComponentContext>({\n name: \"SidePanelComponentContext\",\n })\n\nexport interface SidebarRootProps\n extends\n HTMLStyledProps<\"div\">,\n ThemeProps<SidebarStyle>,\n Omit<UseSidebarProps, \"mobile\"> {\n /**\n * The breakpoint to use for the sidebar. If `false`, the sidebar will be always visible.\n *\n * @default 'md'\n */\n breakpoint?: Exclude<Breakpoint, \"base\"> | false\n}\n\nconst {\n ComponentContext,\n PropsContext: SidebarPropsContext,\n useComponentContext,\n usePropsContext: useSidebarPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<SidebarRootProps, SidebarStyle, ComponentContext>(\n \"sidebar\",\n sidebarStyle,\n)\n\nexport { SidebarPropsContext, useSidebarPropsContext }\n\n/**\n * `Sidebar` is a component that is used to display a list of items in a sidebar.\n *\n * @see https://yamada-ui.com/docs/components/sidebar\n */\nexport const SidebarRoot = withProvider<\n \"div\",\n SidebarRootProps,\n \"mode\" | \"placement\"\n>(\n ({\n breakpoint = \"md\",\n mode: modeProp = \"offcanvas\",\n placement: placementProp = \"start\",\n ...rest\n }) => {\n const mobile =\n useBreakpointValue<boolean | undefined>(\n breakpoint ? { [breakpoint]: true } : { base: false },\n ) ?? false\n const mode = useValue(modeProp)\n const placement = useValue(placementProp)\n const {\n descendants,\n expandedValue,\n open,\n selectedValue,\n getContentProps,\n getFooterProps,\n getHeaderProps,\n getRootProps,\n getSidePanelProps,\n getTriggerProps,\n onClose,\n onExpandedChange,\n onOpen,\n onSelectedChange,\n onToggle,\n } = useSidebar({ mobile, ...rest })\n const context = useMemo(\n () => ({\n expandedValue,\n mobile,\n open,\n selectedValue,\n onClose,\n onExpandedChange,\n onOpen,\n onSelectedChange,\n onToggle,\n }),\n [\n mobile,\n expandedValue,\n open,\n selectedValue,\n onClose,\n onExpandedChange,\n onOpen,\n onSelectedChange,\n onToggle,\n ],\n )\n const componentContext = useMemo(\n () => ({\n breakpoint,\n mode,\n placement,\n getContentProps,\n getFooterProps,\n getHeaderProps,\n getSidePanelProps,\n getTriggerProps,\n }),\n [\n breakpoint,\n mode,\n placement,\n getContentProps,\n getFooterProps,\n getHeaderProps,\n getSidePanelProps,\n getTriggerProps,\n ],\n )\n\n return (\n <SidebarDescendantsContext value={descendants}>\n <SidebarContext value={context}>\n <ComponentContext value={componentContext}>\n <styled.div data-group {...getRootProps()} />\n </ComponentContext>\n </SidebarContext>\n </SidebarDescendantsContext>\n )\n },\n \"root\",\n { transferProps: [\"mode\", \"placement\"] },\n)()\n\nexport interface SidebarMainPanelProps extends HTMLStyledProps {}\n\nexport const SidebarMainPanel = withContext<\"div\", SidebarMainPanelProps>(\n \"div\",\n \"mainPanel\",\n)()\n\nexport interface SidebarTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarTrigger = withContext<\"button\", SidebarTriggerProps>(\n \"button\",\n \"trigger\",\n)(undefined, (props) => {\n const { getTriggerProps } = useComponentContext()\n\n return { asChild: true, ...getTriggerProps(props) }\n})\n\nexport interface SidebarSidePanelProps\n extends\n Omit<HTMLStyledProps<\"aside\">, \"content\">,\n Pick<SidebarContentProps, \"items\">,\n Pick<\n SidebarItemProps,\n | \"animated\"\n | \"endElement\"\n | \"endElementProps\"\n | \"indicator\"\n | \"indicatorProps\"\n | \"labelProps\"\n | \"linkProps\"\n | \"loadingScheme\"\n | \"render\"\n | \"startElement\"\n | \"startElementProps\"\n | \"tooltipProps\"\n | \"triggerProps\"\n > {\n /**\n * The content of the sidebar.\n */\n content?: ReactNode\n /**\n * The footer of the sidebar.\n */\n footer?: ReactNode\n /**\n * The header of the sidebar.\n */\n header?: ReactNode\n /**\n * If `true`, hide the tree indicator icon for all items.\n *\n * @default false\n */\n indicatorHidden?: boolean\n /**\n * If `true`, the sidebar will be rendered with a handle.\n *\n * @default true\n */\n withHandle?: boolean\n /**\n * Props for the content component.\n */\n contentProps?: SidebarContentProps\n /**\n * Props for the drawer component.\n */\n drawerProps?: Omit<\n Drawer.RootProps,\n | \"body\"\n | \"cancel\"\n | \"children\"\n | \"footer\"\n | \"header\"\n | \"middle\"\n | \"onCancel\"\n | \"onClose\"\n | \"onMiddle\"\n | \"onOpen\"\n | \"onSuccess\"\n | \"open\"\n | \"success\"\n | \"title\"\n | \"trigger\"\n >\n /**\n * Props for the footer component.\n */\n footerProps?: SidebarFooterProps\n /**\n * Props for the group content component.\n */\n groupContentProps?: Omit<SidebarGroupContentProps, \"children\">\n /**\n * Props for the group component.\n */\n groupProps?: Omit<SidebarGroupProps, \"children\" | \"label\" | \"value\">\n /**\n * Props for the handle component.\n */\n handleProps?: SidebarHandleProps\n /**\n * Props for the header component.\n */\n headerProps?: SidebarHeaderProps\n /**\n * Props for the item content component.\n */\n itemContentProps?: SidebarItemContentProps\n /**\n * Props for the item component.\n */\n itemProps?: Omit<\n SidebarItemProps,\n \"children\" | \"items\" | \"label\" | \"open\" | \"value\"\n >\n /**\n * Props for the menu component.\n *\n * @default 'md'\n */\n menuProps?: SidebarMenuProps\n}\n\nexport const SidebarSidePanel = withContext<\"aside\", SidebarSidePanelProps>(\n ({\n animated = true,\n children,\n content,\n endElement,\n footer,\n header,\n indicator,\n indicatorHidden,\n items,\n loadingScheme,\n render,\n startElement,\n withHandle = true,\n contentProps,\n drawerProps,\n endElementProps,\n footerProps,\n groupContentProps,\n groupProps,\n handleProps,\n headerProps,\n indicatorProps,\n itemContentProps,\n itemProps,\n labelProps,\n linkProps,\n menuProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n ...rest\n }) => {\n const { mobile, open, onClose } = useSidebarContext()\n const { breakpoint, placement, getSidePanelProps } = useComponentContext()\n const [\n omittedChildren,\n customHeader,\n customContent,\n customFooter,\n customHandle,\n ] = useSplitChildren(\n children,\n SidebarHeader,\n SidebarContent,\n SidebarFooter,\n SidebarHandle,\n )\n const context = useMemo(\n () => ({\n animated,\n endElement,\n indicator,\n indicatorHidden,\n items,\n loadingScheme,\n render,\n startElement,\n contentProps,\n endElementProps,\n footerProps,\n groupContentProps,\n groupProps,\n handleProps,\n headerProps,\n indicatorProps,\n itemContentProps,\n itemProps,\n labelProps,\n linkProps,\n menuProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n }),\n [\n animated,\n endElement,\n indicator,\n indicatorHidden,\n items,\n render,\n loadingScheme,\n startElement,\n contentProps,\n endElementProps,\n footerProps,\n groupContentProps,\n groupProps,\n handleProps,\n headerProps,\n indicatorProps,\n itemContentProps,\n itemProps,\n labelProps,\n linkProps,\n menuProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n ],\n )\n\n return (\n <SidePanelComponentContext value={context}>\n {mobile ? (\n <Drawer.Root\n size=\"sm\"\n autoFocus={false}\n duration={!animated ? 0 : undefined}\n open={open}\n placement={`inline-${placement}`}\n withCloseButton={false}\n portalProps={{ disabled: true }}\n onClose={onClose}\n {...drawerProps}\n >\n <Drawer.Content>\n {customHeader ??\n (header ? <SidebarHeader>{header}</SidebarHeader> : null)}\n\n {customContent ??\n (content || items ? (\n <SidebarContent>{content}</SidebarContent>\n ) : null)}\n\n {customFooter ??\n (footer ? <SidebarFooter>{footer}</SidebarFooter> : null)}\n </Drawer.Content>\n </Drawer.Root>\n ) : (\n <>\n <SidebarGap\n data-animated={dataAttr(animated)}\n display={\n breakpoint\n ? { base: undefined, [breakpoint]: \"none\" }\n : undefined\n }\n />\n\n <styled.aside\n data-animated={dataAttr(animated)}\n data-group\n display={\n breakpoint\n ? { base: undefined, [breakpoint]: \"none\" }\n : undefined\n }\n {...getSidePanelProps(rest)}\n >\n {customHeader ??\n (header ? <SidebarHeader>{header}</SidebarHeader> : null)}\n {customContent ??\n (content || items ? (\n <SidebarContent>{content}</SidebarContent>\n ) : null)}\n {customFooter ??\n (footer ? <SidebarFooter>{footer}</SidebarFooter> : null)}\n {customHandle ?? (withHandle ? <SidebarHandle /> : null)}\n\n {omittedChildren}\n </styled.aside>\n </>\n )}\n </SidePanelComponentContext>\n )\n },\n \"sidePanel\",\n)()\n\ninterface SidebarGapProps extends HTMLStyledProps<\"div\"> {}\n\nconst SidebarGap = withContext<\"div\", SidebarGapProps>(\"div\", \"gap\")()\n\nexport interface SidebarHeaderProps extends HTMLStyledProps<\"header\"> {}\n\nexport const SidebarHeader = withContext<\"header\", SidebarHeaderProps>(\n \"header\",\n \"header\",\n)(undefined, (props) => {\n const { getHeaderProps } = useComponentContext()\n const { headerProps } = useSidePanelComponentContext()\n\n return getHeaderProps(mergeProps(headerProps, props)())\n})\n\nexport interface SidebarFooterProps extends HTMLStyledProps<\"footer\"> {}\n\nexport const SidebarFooter = withContext<\"footer\", SidebarFooterProps>(\n \"footer\",\n \"footer\",\n)(undefined, (props) => {\n const { getFooterProps } = useComponentContext()\n const { footerProps } = useSidePanelComponentContext()\n\n return getFooterProps(mergeProps(footerProps, props)())\n})\n\nexport interface SidebarContentProps extends HTMLStyledProps<\"ul\"> {\n /**\n * If provided, generate elements based on items.\n */\n items?: SidebarItem[]\n}\n\nexport const SidebarContent = withContext<\"ul\", SidebarContentProps>(\n ({ children, items, ...rest }) => {\n const { getContentProps } = useComponentContext()\n const { items: rootItems, contentProps } = useSidePanelComponentContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return (items ?? rootItems)?.map((props, index) => {\n const key = createKey(props, index)\n\n if (\"group\" in props) {\n const { children, group: _, ...rest } = props\n\n return <SidebarGroup key={key} items={children} {...rest} />\n } else {\n const { children, ...rest } = props\n\n return <SidebarItem key={key} items={children} {...rest} />\n }\n })\n }, [children, items, rootItems])\n\n return (\n <styled.ul {...getContentProps(mergeProps(contentProps, rest)())}>\n {computedChildren}\n </styled.ul>\n )\n },\n \"content\",\n)()\n\nexport interface SidebarHandleProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarHandle = withContext<\"button\", SidebarHandleProps>(\n (props) => {\n const { handleProps } = useSidePanelComponentContext()\n\n return (\n <SidebarTrigger {...mergeProps(handleProps, props)()}>\n <styled.button tabIndex={-1} />\n </SidebarTrigger>\n )\n },\n \"handle\",\n)()\n\nexport interface SidebarGroupProps\n extends\n Omit<HTMLStyledProps<\"li\">, \"content\" | \"value\">,\n UseSidebarGroupProps {\n /**\n * If provided, generate elements based on items.\n */\n items?: SidebarItemWithValue[]\n /**\n * The label of the group.\n */\n label?: ReactNode\n /**\n * Props for the content component.\n */\n contentProps?: Omit<SidebarGroupContentProps, \"children\">\n /**\n * Props for the label component.\n */\n labelProps?: HTMLStyledProps<\"span\">\n}\n\nexport const SidebarGroup = withContext<\"li\", SidebarGroupProps>(\n ({\n children,\n items,\n label,\n value: valueProp = isString(label) ? label : undefined,\n contentProps,\n labelProps,\n ...rest\n }) => {\n const { groupProps } = useSidePanelComponentContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items?.map(({ children, ...rest }, index) => {\n const key = createKey(rest, index)\n\n return <SidebarItem key={key} items={children} {...rest} />\n })\n }, [children, items])\n const [omittedChildren, customLabel, customContent] = useSplitChildren(\n computedChildren,\n SidebarGroupLabel,\n SidebarGroupContent,\n )\n const { getContentProps, getLabelProps, getRootProps } = useSidebarGroup({\n ...mergeProps(groupProps, rest)(),\n value: valueProp,\n })\n const context = useMemo(\n () => ({ contentProps, getContentProps, getLabelProps, labelProps }),\n [getLabelProps, labelProps, getContentProps, contentProps],\n )\n\n return (\n <GroupComponentContext value={context}>\n <styled.li {...getRootProps()}>\n {customLabel ??\n (label ? <SidebarGroupLabel>{label}</SidebarGroupLabel> : null)}\n {customContent ?? (\n <SidebarGroupContent>{omittedChildren}</SidebarGroupContent>\n )}\n </styled.li>\n </GroupComponentContext>\n )\n },\n \"group\",\n)()\n\nexport interface SidebarGroupLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const SidebarGroupLabel = withContext<\"span\", SidebarGroupLabelProps>(\n \"span\",\n \"groupLabel\",\n)(undefined, (props) => {\n const { getLabelProps, labelProps } = useGroupComponentContext()\n\n return getLabelProps(mergeProps(labelProps, props)())\n})\n\nexport interface SidebarGroupContentProps extends HTMLStyledProps<\"div\"> {}\n\nexport const SidebarGroupContent = withContext<\"div\", SidebarGroupContentProps>(\n \"div\",\n \"groupContent\",\n)(undefined, ({ children, ...rest }) => {\n const validChildren = useValidChildren(children)\n const list = useIncludesChildren(validChildren, SidebarItem)\n const { groupContentProps } = useSidePanelComponentContext()\n const { contentProps, getContentProps } = useGroupComponentContext()\n\n return {\n as: list ? \"ul\" : \"div\",\n children,\n ...getContentProps(mergeProps(groupContentProps, contentProps, rest)()),\n }\n})\n\nexport interface SidebarMenuProps extends HTMLStyledProps<\"div\"> {}\n\nexport const SidebarMenu = withContext<\"div\", SidebarMenuProps>(\"div\", \"menu\")(\n undefined,\n (props) => {\n const { menuProps } = useSidePanelComponentContext()\n\n return { \"data-menu\": \"\", ...mergeProps(menuProps, props)() }\n },\n)\n\nexport interface SidebarMenuButtonProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarMenuButton = withContext<\"button\", SidebarMenuButtonProps>(\n \"button\",\n [\"menu\", \"button\"],\n)(undefined, (props) => {\n const { open } = useSidebarContext()\n const { mode } = useComponentContext()\n const { menuProps } = useSidePanelComponentContext()\n const offcanvas = mode === \"offcanvas\"\n const { disabled, ...rest } = mergeProps(menuProps, props)()\n\n return {\n \"data-menu\": \"\",\n disabled,\n ...rest,\n tabIndex: (!offcanvas || open) && !disabled ? 0 : -1,\n }\n})\n\nexport interface SidebarItemProps\n extends\n Omit<HTMLStyledProps<\"li\">, \"value\">,\n Omit<UseSidebarItemProps, \"asyncChildren\"> {\n /**\n * The label to display in the item.\n */\n label: ReactNode\n /**\n * If `true`, the sidebar item will be animated.\n *\n * @default true\n */\n animated?: boolean\n /**\n * The element to display at the end of the item.\n */\n endElement?: SidebarItemReactNode\n /**\n * The sidebar item indicator icon to use.\n */\n indicator?: ReactNodeOrFunction<SidebarItemCallBackProps>\n /**\n * If provided, generate elements based on items.\n */\n items?: SidebarItemWithValue[]\n /**\n * The loading scheme.\n *\n * @default 'oval'\n */\n loadingScheme?: Loading.Scheme\n /**\n * If provided, the sidebar item will be rendered with custom components.\n */\n render?: SidebarItemRender\n /**\n * The element to display at the start of the item.\n */\n startElement?: SidebarItemReactNode\n /**\n * Props for the content component.\n */\n contentProps?: Omit<SidebarItemContentProps, \"children\">\n /**\n * Props for the end component.\n */\n endElementProps?: SidebarItemEndElementProps\n /**\n * Props for the indicator component.\n */\n indicatorProps?: SidebarItemIndicatorProps\n /**\n * Props for the label component.\n */\n labelProps?: SidebarItemLabelProps\n /**\n * Props for the link component.\n */\n linkProps?: SidebarItemLinkProps\n /**\n * Props for the start component.\n */\n startElementProps?: SidebarItemStartElementProps\n /**\n * Props for the tooltip component.\n */\n tooltipProps?: Omit<SidebarItemTooltipProps, \"children\" | \"content\">\n /**\n * Props for the trigger component.\n */\n triggerProps?: SidebarItemTriggerProps\n /**\n * If provided, the sidebar item will be rendered as an async sidebar item.\n */\n asyncChildren?: () => Promise<SidebarItemWithValue[]>\n}\n\nexport const SidebarItem = withContext<\"li\", SidebarItemProps>(\n ({\n animated: animatedProp,\n asyncChildren: asyncChildrenProp,\n children: childrenProp,\n endElement,\n indicator: indicatorProp,\n items,\n label,\n loadingScheme,\n render,\n startElement,\n contentProps,\n endElementProps,\n indicatorProps,\n labelProps,\n linkProps,\n startElementProps,\n tooltipProps,\n triggerProps,\n ...rest\n }) => {\n const { mode } = useComponentContext()\n const offcanvas = mode === \"offcanvas\"\n const componentContext = useSidePanelComponentContext()\n const Loading = useLoadingComponent(\n loadingScheme ?? componentContext.loadingScheme ?? \"oval\",\n )\n const computedChildren = useMemo(() => {\n if (childrenProp) return childrenProp\n\n return items?.map(({ children, ...rest }, index) => {\n const key = createKey(rest, index)\n\n return <SidebarItem key={key} items={children} {...rest} />\n })\n }, [childrenProp, items])\n const asyncChildren = useCallback(async () => {\n const items = await asyncChildrenProp?.()\n\n return items?.map(({ children, ...rest }, index) => {\n const key = createKey(rest, index)\n\n return <SidebarItem key={key} items={children} {...rest} />\n })\n }, [asyncChildrenProp])\n const {\n branchOpen,\n children,\n disabled,\n expanded,\n expandedValue,\n group,\n groupLoading,\n groupOpen,\n open,\n selected,\n selectedValue,\n value,\n getContentProps,\n getIndicatorProps,\n getItemProps,\n getLabelProps,\n getLinkProps,\n getTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n } = useSidebarItem({\n ...componentContext.itemProps,\n ...rest,\n asyncChildren: asyncChildrenProp ? asyncChildren : undefined,\n children: computedChildren,\n })\n const animated = animatedProp ?? componentContext.animated ?? true\n const tabIndex = offcanvas\n ? open && expanded && !disabled\n ? 0\n : -1\n : expanded && !disabled\n ? 0\n : -1\n const callbackProps = useMemo(\n () => ({ disabled, expanded: groupOpen }),\n [disabled, groupOpen],\n )\n const mergedTriggerProps = useMemo(() => {\n return getTriggerProps({\n tabIndex,\n ...mergeProps(componentContext.triggerProps, triggerProps)(),\n }) as SidebarItemTriggerProps\n }, [getTriggerProps, tabIndex, componentContext.triggerProps, triggerProps])\n const mergedLinkProps = useMemo(() => {\n return getLinkProps({\n tabIndex,\n ...mergeProps(componentContext.linkProps, linkProps)(),\n }) as SidebarItemLinkProps\n }, [getLinkProps, tabIndex, componentContext.linkProps, linkProps])\n const indicator = useMemo<ReactNode>(\n () => runIfFn(indicatorProp ?? componentContext.indicator, callbackProps),\n [indicatorProp, componentContext.indicator, callbackProps],\n )\n const groupStartElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"group\",\n startElement,\n componentContext.startElement,\n ),\n callbackProps,\n ),\n [startElement, componentContext.startElement, callbackProps],\n )\n const groupEndElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"group\",\n endElement,\n componentContext.endElement,\n ),\n callbackProps,\n ),\n [endElement, componentContext.endElement, callbackProps],\n )\n const itemStartElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"item\",\n startElement,\n componentContext.startElement,\n ),\n callbackProps,\n ),\n [startElement, componentContext.startElement, callbackProps],\n )\n const itemEndElement = useMemo<ReactNode>(\n () =>\n runIfFn(\n getReactNodeOrFunction(\n \"item\",\n endElement,\n componentContext.endElement,\n ),\n callbackProps,\n ),\n [endElement, componentContext.endElement, callbackProps],\n )\n const trigger = useMemo<ReactNode>(\n () =>\n runIfFn(render?.trigger ?? componentContext.render?.trigger, {\n endElement: groupEndElement,\n expanded,\n expandedValue,\n groupLoading,\n groupOpen,\n indicator,\n label,\n selected,\n selectedValue,\n startElement: groupStartElement,\n value,\n triggerProps: mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n }),\n [\n render?.trigger,\n componentContext.render?.trigger,\n groupEndElement,\n expanded,\n expandedValue,\n groupLoading,\n groupOpen,\n indicator,\n label,\n selected,\n selectedValue,\n groupStartElement,\n value,\n mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n ],\n )\n const link = useMemo<ReactNode>(\n () =>\n runIfFn(render?.link ?? componentContext.render?.link, {\n endElement: itemEndElement,\n expanded,\n expandedValue,\n label,\n selected,\n selectedValue,\n startElement: itemStartElement,\n value,\n linkProps: mergedLinkProps,\n onExpandedChange,\n onSelectedChange,\n }),\n [\n render?.link,\n componentContext.render?.link,\n itemEndElement,\n expanded,\n expandedValue,\n label,\n selected,\n selectedValue,\n itemStartElement,\n value,\n mergedLinkProps,\n onExpandedChange,\n onSelectedChange,\n ],\n )\n const item = useMemo<ReactNode>(\n () =>\n runIfFn(render?.item ?? componentContext.render?.item, {\n children,\n endElement: { group: groupEndElement, item: itemEndElement },\n expanded,\n expandedValue,\n group,\n groupLoading,\n groupOpen,\n indicator,\n label,\n link,\n selected,\n selectedValue,\n startElement: { group: groupStartElement, item: itemStartElement },\n trigger,\n value,\n itemProps: getItemProps() as HTMLStyledProps<\"li\">,\n linkProps: mergedLinkProps,\n triggerProps: mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n }),\n [\n render?.item,\n componentContext.render?.item,\n children,\n groupEndElement,\n itemEndElement,\n expanded,\n expandedValue,\n group,\n groupLoading,\n groupOpen,\n indicator,\n label,\n link,\n selected,\n selectedValue,\n groupStartElement,\n itemStartElement,\n trigger,\n value,\n getItemProps,\n mergedLinkProps,\n mergedTriggerProps,\n onExpandedChange,\n onGroupClose,\n onGroupOpen,\n onGroupToggle,\n onSelectedChange,\n ],\n )\n const context = useMemo(\n () => ({ branchOpen, groupOpen }),\n [branchOpen, groupOpen],\n )\n const itemComponentContext = useMemo(\n () => ({\n contentProps: {\n duration: !animated ? 0 : undefined,\n open: groupOpen,\n ...getContentProps(\n mergeProps(componentContext.itemContentProps, contentProps)(),\n ),\n },\n endElementProps: mergeProps(\n componentContext.endElementProps,\n endElementProps,\n )(),\n indicatorProps: getIndicatorProps({\n \"data-animated\": dataAttr(animated),\n ...mergeProps(componentContext.indicatorProps, indicatorProps)(),\n }) as SidebarItemIndicatorProps,\n labelProps: getLabelProps(\n mergeProps(componentContext.labelProps, labelProps)(),\n ) as SidebarItemLabelProps,\n startElementProps: mergeProps(\n componentContext.startElementProps,\n startElementProps,\n )(),\n tooltipProps: {\n content: label,\n disabled: open,\n ...mergeProps(componentContext.tooltipProps, tooltipProps)(),\n },\n }),\n [\n animated,\n componentContext.endElementProps,\n componentContext.indicatorProps,\n componentContext.itemContentProps,\n componentContext.labelProps,\n componentContext.startElementProps,\n componentContext.tooltipProps,\n contentProps,\n endElementProps,\n getContentProps,\n getIndicatorProps,\n getLabelProps,\n groupOpen,\n indicatorProps,\n label,\n labelProps,\n open,\n startElementProps,\n tooltipProps,\n ],\n )\n\n return (\n <SidebarItemContext value={context}>\n <ItemComponentContext value={itemComponentContext}>\n {item ?? (\n <styled.li {...getItemProps()}>\n {group ? (\n <>\n {trigger ?? (\n <SidebarItemTrigger {...mergedTriggerProps}>\n {groupStartElement ? (\n <SidebarItemStartElement>\n {groupStartElement}\n </SidebarItemStartElement>\n ) : null}\n {label ? (\n <SidebarItemLabel>{label}</SidebarItemLabel>\n ) : null}\n {groupEndElement ? (\n <SidebarItemEndElement>\n {groupEndElement}\n </SidebarItemEndElement>\n ) : null}\n <SidebarItemIndicator>\n {groupLoading ? (\n <Loading />\n ) : (\n runIfFn(indicator, callbackProps)\n )}\n </SidebarItemIndicator>\n </SidebarItemTrigger>\n )}\n\n <SidebarItemContent>{children}</SidebarItemContent>\n </>\n ) : (\n (link ?? (\n <SidebarItemLink {...mergedLinkProps}>\n {itemStartElement ? (\n <SidebarItemStartElement>\n {itemStartElement}\n </SidebarItemStartElement>\n ) : null}\n {label ? (\n <SidebarItemLabel>{label}</SidebarItemLabel>\n ) : null}\n {itemEndElement ? (\n <SidebarItemEndElement>\n {itemEndElement}\n </SidebarItemEndElement>\n ) : null}\n </SidebarItemLink>\n ))\n )}\n </styled.li>\n )}\n </ItemComponentContext>\n </SidebarItemContext>\n )\n },\n \"item\",\n)()\n\ninterface SidebarItemTooltipProps extends TooltipProps {}\n\nconst SidebarItemTooltip: FC<SidebarItemTooltipProps> = (props) => {\n const { tooltipProps } = useItemComponentContext()\n const { children, disabled, ...rest } = { ...tooltipProps, ...props }\n const { mode, placement } = useComponentContext()\n const offcanvas = mode === \"offcanvas\"\n\n if (offcanvas || disabled) {\n return children\n } else {\n return (\n <Tooltip\n closeOnClick={false}\n gutter={16}\n placement={`center-${placement === \"start\" ? \"end\" : \"start\"}`}\n {...rest}\n >\n {children}\n </Tooltip>\n )\n }\n}\n\nexport interface SidebarItemTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const SidebarItemTrigger = withContext<\n \"button\",\n SidebarItemTriggerProps\n>((props) => {\n return (\n <SidebarItemTooltip>\n <styled.button {...props} />\n </SidebarItemTooltip>\n )\n}, \"itemTrigger\")()\n\nexport interface SidebarItemLinkProps extends HTMLStyledProps<\"a\"> {}\n\nexport const SidebarItemLink = withContext<\"a\", SidebarItemLinkProps>(\n (props) => {\n return (\n <SidebarItemTooltip>\n <styled.a {...props} />\n </SidebarItemTooltip>\n )\n },\n \"itemLink\",\n)()\n\nexport interface SidebarItemContentProps\n extends\n Omit<HTMLStyledProps<\"ul\">, \"transition\">,\n Pick<CollapseProps, \"animationOpacity\" | keyof WithTransitionProps> {}\n\nexport const SidebarItemContent = withContext<\"ul\", SidebarItemContentProps>(\n (props) => {\n const { contentProps = {} } = useItemComponentContext()\n\n return (\n <Collapse\n as=\"ul\"\n {...cast<CollapseProps>(mergeProps(contentProps, props)())}\n />\n )\n },\n \"itemContent\",\n)()\n\nexport interface SidebarItemIndicatorProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const SidebarItemIndicator = withContext<\n \"svg\",\n SidebarItemIndicatorProps\n>(({ children = <ChevronRightIcon />, ...rest }) => {\n const { indicatorHidden } = useSidePanelComponentContext()\n\n if (indicatorHidden) return null\n\n if (isValidElement<HTMLProps<\"svg\">>(children))\n return cloneElement(children, { ...rest, ...children.props })\n\n return Children.count(children) > 1 ? Children.only(null) : null\n}, \"itemIndicator\")(undefined, (props) => {\n const { indicatorProps } = useItemComponentContext()\n\n return mergeProps(indicatorProps, props)()\n})\n\nexport interface SidebarItemStartElementProps extends HTMLStyledProps {}\n\nexport const SidebarItemStartElement = withContext<\n \"div\",\n SidebarItemStartElementProps\n>(\"div\", {\n name: \"ItemStartElement\",\n slot: [\"itemElement\", \"start\"],\n})(undefined, (props) => {\n const { startElementProps } = useItemComponentContext()\n\n return mergeProps(startElementProps, props)()\n})\n\nexport interface SidebarItemEndElementProps extends HTMLStyledProps {}\n\nexport const SidebarItemEndElement = withContext<\n \"div\",\n SidebarItemEndElementProps\n>(\"div\", {\n name: \"ItemEndElement\",\n slot: [\"itemElement\", \"end\"],\n})(undefined, (props) => {\n const { endElementProps } = useItemComponentContext()\n\n return mergeProps(endElementProps, props)()\n})\n\nexport interface SidebarItemLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const SidebarItemLabel = withContext<\"span\", SidebarItemLabelProps>(\n \"span\",\n \"itemLabel\",\n)(undefined, (props) => {\n const { labelProps } = useItemComponentContext()\n\n return mergeProps(labelProps, props)()\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA,MAAM,aAAa,OAAoB,UAAkB;AACvD,QAAO,WAAW,QAAQ,MAAM,SAAS,QAAQ;;AAGnD,MAAM,0BACJ,MACA,QACA,SACkD;AAClD,qDAAa,OAAO,KAAK,WAAW,UAAU,UAAU,QACtD,QAAO,OAAO;UACL,OACT,QAAO;0DACW,KAAK,KAAK,WAAW,QAAQ,UAAU,MACzD,QAAO,KAAK;KAEZ,QAAO;;AAsBX,MAAM,CAAC,uBAAuB,4BAC5BA,8BAAqC,EAAE,MAAM,yBAAyB,CAAC;AAWzE,MAAM,CAAC,sBAAsB,2BAC3BA,8BAAoC,EAAE,MAAM,wBAAwB,CAAC;AA8BvE,MAAM,CAAC,2BAA2B,gCAChCA,8BAAyC,EACvC,MAAM,6BACP,CAAC;AAeJ,MAAM,EACJ,kBACA,cAAc,qBACd,qBACA,iBAAiB,wBACjB,aACA,iBACEC,6CACF,WACAC,mCACD;;;;;;AASD,MAAa,cAAc,cAKxB,EACC,aAAa,MACb,MAAM,WAAW,aACjB,WAAW,gBAAgB,SAC3B,GAAG,WACC;CACJ,MAAM,SACJC,gDACE,aAAa,GAAG,aAAa,MAAM,GAAG,EAAE,MAAM,OAAO,CACtD,IAAI;CACP,MAAM,OAAOC,uCAAS,SAAS;CAC/B,MAAM,YAAYA,uCAAS,cAAc;CACzC,MAAM,EACJ,aACA,eACA,MACA,eACA,iBACA,gBACA,gBACA,cACA,mBACA,iBACA,SACA,kBACA,QACA,kBACA,aACEC,+BAAW;EAAE;EAAQ,GAAG;EAAM,CAAC;AAgDnC,QACE,2CAACC;EAA0B,OAAO;YAChC,2CAACC;GAAe,iCAhDX;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD,GACD;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACD,CACF;aA2BK,2CAAC;IAAiB,iCAzBf;KACL;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACD,GACD;KACE;KACA;KACA;KACA;KACA;KACA;KACA;KACA;KACD,CACF;cAMO,2CAACC,uBAAO;KAAI;KAAW,GAAI,cAAc;MAAI;KAC5B;IACJ;GACS;GAGhC,QACA,EAAE,eAAe,CAAC,QAAQ,YAAY,EAAE,CACzC,EAAE;AAIH,MAAa,mBAAmB,YAC9B,OACA,YACD,EAAE;AAIH,MAAa,iBAAiB,YAC5B,UACA,UACD,CAAC,SAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,qBAAqB;AAEjD,QAAO;EAAE,SAAS;EAAM,GAAG,gBAAgB,MAAM;EAAE;EACnD;AA8GF,MAAa,mBAAmB,aAC7B,EACC,WAAW,MACX,UACA,SACA,YACA,QACA,QACA,WACA,iBACA,OACA,eACA,QACA,cACA,aAAa,MACb,cACA,aACA,iBACA,aACA,mBACA,YACA,aACA,aACA,gBACA,kBACA,WACA,YACA,WACA,WACA,mBACA,cACA,cACA,GAAG,WACC;CACJ,MAAM,EAAE,QAAQ,MAAM,YAAYC,uCAAmB;CACrD,MAAM,EAAE,YAAY,WAAW,sBAAsB,qBAAqB;CAC1E,MAAM,CACJ,iBACA,cACA,eACA,cACA,gBACEC,kCACF,UACA,eACA,gBACA,eACA,cACD;AAwDD,QACE,2CAAC;EAA0B,iCAvDpB;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;YAII,SACC;GACE,MAAK;GACL,WAAW;GACX,UAAU,CAAC,WAAW,IAAI;GACpB;GACN,WAAW,UAAU;GACrB,iBAAiB;GACjB,aAAa,EAAE,UAAU,MAAM;GACtB;GACT,GAAI;aAEJ;IACG,iBACE,SAAS,2CAAC,2BAAe,SAAuB,GAAG;IAErD,kBACE,WAAW,QACV,2CAAC,4BAAgB,UAAyB,GACxC;IAEL,iBACE,SAAS,2CAAC,2BAAe,SAAuB,GAAG;OACvC;IACL,GAEd,qFACE,2CAAC;GACC,iEAAwB,SAAS;GACjC,SACE,aAC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A;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA,cAAc;EACd;EACA;EACA;EACA;EACA;EACD,CAAC,EACJ;EACE,QAAQ;EACR,iBAAiB,QAAQ;EACzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CACD,MAAM,+EAEM,QAAQ,QAAQ,iBAAiB,QAAQ,MAAM;EACrD,YAAY;EACZ;EACA;EACA;EACA;EACA;EACA,cAAc;EACd;EACA,WAAW;EACX;EACA;EACD,CAAC,EACJ;EACE,QAAQ;EACR,iBAAiB,QAAQ;EACzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CACD,MAAM,+EAEM,QAAQ,QAAQ,iBAAiB,QAAQ,MAAM;EACrD;EACA,YAAY;GAAE,OAAO;GAAiB,MAAM;GAAgB;EAC5D;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;GAAE,OAAO;GAAmB,MAAM;GAAkB;EAClE;EACA;EACA,WAAW,cAAc;EACzB,WAAW;EACX,cAAc;EACd;EACA;EACA;EACA;EACA;EACD,CAAC,EACJ;EACE,QAAQ;EACR,iBAAiB,QAAQ;EACzB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AA0DD,QACE,2CAACQ;EAAmB,iCAzDb;GAAE;GAAY;GAAW,GAChC,CAAC,YAAY,UAAU,CACxB;YAwDG,2CAAC;GAAqB,iCAtDjB;IACL,cAAc;KACZ,UAAU,CAAC,WAAW,IAAI;KAC1B,MAAM;KACN,GAAG,gBACDR,yBAAW,iBAAiB,kBAAkB,aAAa,EAAE,CAC9D;KACF;IACD,iBAAiBA,yBACf,iBAAiB,iBACjB,gBACD,EAAE;IACH,gBAAgB,kBAAkB;KAChC,iEAA0B,SAAS;KACnC,GAAGA,yBAAW,iBAAiB,gBAAgB,eAAe,EAAE;KACjE,CA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"}
|