@yamada-ui/react 2.2.5-dev-20260727050304 → 2.2.5-dev-20260727071034
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/accordion/accordion.cjs.map +1 -1
- package/dist/cjs/components/action-bar/action-bar.cjs.map +1 -1
- package/dist/cjs/components/airy/airy.cjs.map +1 -1
- package/dist/cjs/components/alert/alert.cjs.map +1 -1
- package/dist/cjs/components/alpha-slider/alpha-slider.cjs.map +1 -1
- package/dist/cjs/components/autocomplete/autocomplete.cjs.map +1 -1
- package/dist/cjs/components/autocomplete/use-autocomplete.cjs.map +1 -1
- package/dist/cjs/components/avatar/avatar-group.cjs.map +1 -1
- package/dist/cjs/components/avatar/avatar.cjs.map +1 -1
- package/dist/cjs/components/blockquote/blockquote.cjs.map +1 -1
- package/dist/cjs/components/breadcrumb/breadcrumb.cjs.map +1 -1
- package/dist/cjs/components/button/button-group.cjs.map +1 -1
- package/dist/cjs/components/button/button.cjs.map +1 -1
- package/dist/cjs/components/calendar/calendar.cjs.map +1 -1
- package/dist/cjs/components/calendar/use-calendar.cjs.map +1 -1
- package/dist/cjs/components/carousel/carousel.cjs.map +1 -1
- package/dist/cjs/components/chart/cartesian-chart.cjs.map +1 -1
- package/dist/cjs/components/chart/chart.cjs.map +1 -1
- package/dist/cjs/components/chart/polar-chart.cjs.map +1 -1
- package/dist/cjs/components/checkbox/checkbox-group.cjs.map +1 -1
- package/dist/cjs/components/checkbox/checkbox.cjs.map +1 -1
- package/dist/cjs/components/checkbox-card/checkbox-card-group.cjs.map +1 -1
- package/dist/cjs/components/checkbox-card/checkbox-card.cjs.map +1 -1
- package/dist/cjs/components/circle-progress/circle-progress.cjs.map +1 -1
- package/dist/cjs/components/collapse/collapse.cjs.map +1 -1
- package/dist/cjs/components/color-picker/color-picker.cjs.map +1 -1
- package/dist/cjs/components/color-selector/color-selector.cjs.map +1 -1
- package/dist/cjs/components/color-swatch/color-swatch-group.cjs.map +1 -1
- package/dist/cjs/components/color-swatch/color-swatch.cjs.map +1 -1
- package/dist/cjs/components/data-list/data-list.cjs.map +1 -1
- package/dist/cjs/components/date-picker/date-picker.cjs.map +1 -1
- package/dist/cjs/components/date-picker/use-date-picker.cjs.map +1 -1
- package/dist/cjs/components/drawer/drawer.cjs.map +1 -1
- package/dist/cjs/components/dropzone/dropzone.cjs.map +1 -1
- package/dist/cjs/components/editable/editable.cjs.map +1 -1
- package/dist/cjs/components/empty-state/empty-state.cjs.map +1 -1
- package/dist/cjs/components/fade/fade.cjs.map +1 -1
- package/dist/cjs/components/fade-scale/fade-scale.cjs.map +1 -1
- package/dist/cjs/components/field/field.cjs.map +1 -1
- package/dist/cjs/components/fieldset/fieldset.cjs.map +1 -1
- package/dist/cjs/components/file-input/file-input.cjs.map +1 -1
- package/dist/cjs/components/flip/flip.cjs.map +1 -1
- package/dist/cjs/components/focus-lock/focus-lock.cjs.map +1 -1
- package/dist/cjs/components/form/form.cjs.map +1 -1
- package/dist/cjs/components/format/format-byte.cjs.map +1 -1
- package/dist/cjs/components/format/format-date-time.cjs.map +1 -1
- package/dist/cjs/components/format/format-number.cjs.map +1 -1
- package/dist/cjs/components/highlight/highlight.cjs.map +1 -1
- package/dist/cjs/components/hue-slider/hue-slider.cjs.map +1 -1
- package/dist/cjs/components/icon/icons/circle-euro-icon.cjs +14 -0
- package/dist/cjs/components/icon/icons/circle-euro-icon.cjs.map +1 -0
- package/dist/cjs/components/icon/icons/index.cjs +9 -3
- package/dist/cjs/components/icon/icons/index.cjs.map +1 -1
- package/dist/cjs/components/icon/icons/scan-box-icon.cjs +14 -0
- package/dist/cjs/components/icon/icons/scan-box-icon.cjs.map +1 -0
- package/dist/cjs/components/icon/icons/server-plus-icon.cjs +14 -0
- package/dist/cjs/components/icon/icons/server-plus-icon.cjs.map +1 -0
- package/dist/cjs/components/icon/index.cjs +6 -2
- package/dist/cjs/components/indicator/indicator.cjs.map +1 -1
- package/dist/cjs/components/infinite-scroll-area/infinite-scroll-area.cjs.map +1 -1
- package/dist/cjs/components/input/input-group.cjs.map +1 -1
- package/dist/cjs/components/link-box/link-box.cjs.map +1 -1
- package/dist/cjs/components/list/list.cjs.map +1 -1
- package/dist/cjs/components/loading/audio.cjs.map +1 -1
- package/dist/cjs/components/loading/background.cjs.map +1 -1
- package/dist/cjs/components/loading/circles.cjs.map +1 -1
- package/dist/cjs/components/loading/dots.cjs.map +1 -1
- package/dist/cjs/components/loading/grid.cjs.map +1 -1
- package/dist/cjs/components/loading/loading-provider.cjs.map +1 -1
- package/dist/cjs/components/loading/oval.cjs.map +1 -1
- package/dist/cjs/components/loading/page.cjs.map +1 -1
- package/dist/cjs/components/loading/puff.cjs.map +1 -1
- package/dist/cjs/components/loading/rings.cjs.map +1 -1
- package/dist/cjs/components/loading/screen.cjs.map +1 -1
- package/dist/cjs/components/loading/suspense.cjs.map +1 -1
- package/dist/cjs/components/menu/menu.cjs.map +1 -1
- package/dist/cjs/components/menu/use-menu.cjs.map +1 -1
- package/dist/cjs/components/modal/modal.cjs.map +1 -1
- package/dist/cjs/components/native-accordion/native-accordion.cjs.map +1 -1
- package/dist/cjs/components/native-popover/native-popover.cjs.map +1 -1
- package/dist/cjs/components/native-select/native-select.cjs.map +1 -1
- package/dist/cjs/components/native-select/use-native-select.cjs.map +1 -1
- package/dist/cjs/components/native-table/native-table.cjs.map +1 -1
- package/dist/cjs/components/notice/notice-provider.cjs.map +1 -1
- package/dist/cjs/components/notice/notice.cjs.map +1 -1
- package/dist/cjs/components/notice/use-notice.cjs.map +1 -1
- package/dist/cjs/components/number-input/number-input.cjs.map +1 -1
- package/dist/cjs/components/pagination/pagination.cjs.map +1 -1
- package/dist/cjs/components/password-input/password-input.cjs.map +1 -1
- package/dist/cjs/components/password-input/strength-meter.cjs.map +1 -1
- package/dist/cjs/components/picture/picture.cjs.map +1 -1
- package/dist/cjs/components/pin-input/pin-input.cjs.map +1 -1
- package/dist/cjs/components/popover/popover.cjs.map +1 -1
- package/dist/cjs/components/progress/progress.cjs.map +1 -1
- package/dist/cjs/components/qr-code/qr-code.cjs.map +1 -1
- package/dist/cjs/components/radio/radio-group.cjs.map +1 -1
- package/dist/cjs/components/radio/radio.cjs.map +1 -1
- package/dist/cjs/components/radio-card/radio-card-group.cjs.map +1 -1
- package/dist/cjs/components/radio-card/radio-card.cjs.map +1 -1
- package/dist/cjs/components/rating/rating.cjs.map +1 -1
- package/dist/cjs/components/reorder/reorder.cjs.map +1 -1
- package/dist/cjs/components/resizable/resizable.cjs.map +1 -1
- package/dist/cjs/components/ripple/ripple.cjs.map +1 -1
- package/dist/cjs/components/rotate/rotate.cjs.map +1 -1
- package/dist/cjs/components/saturation-slider/saturation-slider.cjs.map +1 -1
- package/dist/cjs/components/saturation-slider/use-saturation-slider.cjs.map +1 -1
- package/dist/cjs/components/segmented-control/segmented-control.cjs.map +1 -1
- package/dist/cjs/components/select/select.cjs.map +1 -1
- package/dist/cjs/components/select/use-select.cjs.map +1 -1
- package/dist/cjs/components/sidebar/sidebar.cjs.map +1 -1
- package/dist/cjs/components/skeleton/skeleton-text.cjs.map +1 -1
- package/dist/cjs/components/slide/slide.cjs.map +1 -1
- package/dist/cjs/components/slide-fade/slide-fade.cjs.map +1 -1
- package/dist/cjs/components/slider/slider.cjs.map +1 -1
- package/dist/cjs/components/slot/slot.cjs.map +1 -1
- package/dist/cjs/components/snacks/snacks.cjs.map +1 -1
- package/dist/cjs/components/stack/stack.cjs.map +1 -1
- package/dist/cjs/components/stack/z-stack.cjs.map +1 -1
- package/dist/cjs/components/stat/stat.cjs.map +1 -1
- package/dist/cjs/components/status/status.cjs.map +1 -1
- package/dist/cjs/components/steps/steps.cjs.map +1 -1
- package/dist/cjs/components/switch/switch.cjs.map +1 -1
- package/dist/cjs/components/table/table.cjs.map +1 -1
- package/dist/cjs/components/tabs/tabs.cjs.map +1 -1
- package/dist/cjs/components/tag/tag.cjs.map +1 -1
- package/dist/cjs/components/timeline/timeline.cjs.map +1 -1
- package/dist/cjs/components/tip/tip.cjs.map +1 -1
- package/dist/cjs/components/toggle/toggle-group.cjs.map +1 -1
- package/dist/cjs/components/tooltip/tooltip.cjs.map +1 -1
- package/dist/cjs/components/tree/tree.cjs.map +1 -1
- package/dist/cjs/components/tree/use-tree.cjs.map +1 -1
- package/dist/cjs/core/components/create-component.cjs.map +1 -1
- package/dist/cjs/core/system/breakpoint.cjs.map +1 -1
- package/dist/cjs/core/system/environment-provider.cjs.map +1 -1
- package/dist/cjs/core/system/styled.cjs.map +1 -1
- package/dist/cjs/core/system/theme-provider.cjs.map +1 -1
- package/dist/cjs/hooks/use-async-callback/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-breakpoint/use-breakpoint.cjs.map +1 -1
- package/dist/cjs/hooks/use-combobox/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-field-sizing/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-outside-click/index.cjs.map +1 -1
- package/dist/cjs/index.cjs +9 -3
- package/dist/cjs/providers/ui-provider/ui-provider.cjs.map +1 -1
- package/dist/cjs/utils/store.cjs.map +1 -1
- package/dist/esm/components/accordion/accordion.js.map +1 -1
- package/dist/esm/components/action-bar/action-bar.js.map +1 -1
- package/dist/esm/components/airy/airy.js.map +1 -1
- package/dist/esm/components/alert/alert.js.map +1 -1
- package/dist/esm/components/alpha-slider/alpha-slider.js.map +1 -1
- package/dist/esm/components/autocomplete/autocomplete.js.map +1 -1
- package/dist/esm/components/autocomplete/use-autocomplete.js.map +1 -1
- package/dist/esm/components/avatar/avatar-group.js.map +1 -1
- package/dist/esm/components/avatar/avatar.js.map +1 -1
- package/dist/esm/components/blockquote/blockquote.js.map +1 -1
- package/dist/esm/components/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/esm/components/button/button-group.js.map +1 -1
- package/dist/esm/components/button/button.js.map +1 -1
- package/dist/esm/components/calendar/calendar.js.map +1 -1
- package/dist/esm/components/calendar/use-calendar.js.map +1 -1
- package/dist/esm/components/carousel/carousel.js.map +1 -1
- package/dist/esm/components/chart/cartesian-chart.js.map +1 -1
- package/dist/esm/components/chart/chart.js.map +1 -1
- package/dist/esm/components/chart/polar-chart.js.map +1 -1
- package/dist/esm/components/checkbox/checkbox-group.js.map +1 -1
- package/dist/esm/components/checkbox/checkbox.js.map +1 -1
- package/dist/esm/components/checkbox-card/checkbox-card-group.js.map +1 -1
- package/dist/esm/components/checkbox-card/checkbox-card.js.map +1 -1
- package/dist/esm/components/circle-progress/circle-progress.js.map +1 -1
- package/dist/esm/components/collapse/collapse.js.map +1 -1
- package/dist/esm/components/color-picker/color-picker.js.map +1 -1
- package/dist/esm/components/color-selector/color-selector.js.map +1 -1
- package/dist/esm/components/color-swatch/color-swatch-group.js.map +1 -1
- package/dist/esm/components/color-swatch/color-swatch.js.map +1 -1
- package/dist/esm/components/data-list/data-list.js.map +1 -1
- package/dist/esm/components/date-picker/date-picker.js.map +1 -1
- package/dist/esm/components/date-picker/use-date-picker.js.map +1 -1
- package/dist/esm/components/drawer/drawer.js.map +1 -1
- package/dist/esm/components/dropzone/dropzone.js.map +1 -1
- package/dist/esm/components/editable/editable.js.map +1 -1
- package/dist/esm/components/empty-state/empty-state.js.map +1 -1
- package/dist/esm/components/fade/fade.js.map +1 -1
- package/dist/esm/components/fade-scale/fade-scale.js.map +1 -1
- package/dist/esm/components/field/field.js.map +1 -1
- package/dist/esm/components/fieldset/fieldset.js.map +1 -1
- package/dist/esm/components/file-input/file-input.js.map +1 -1
- package/dist/esm/components/flip/flip.js.map +1 -1
- package/dist/esm/components/focus-lock/focus-lock.js.map +1 -1
- package/dist/esm/components/form/form.js.map +1 -1
- package/dist/esm/components/format/format-byte.js.map +1 -1
- package/dist/esm/components/format/format-date-time.js.map +1 -1
- package/dist/esm/components/format/format-number.js.map +1 -1
- package/dist/esm/components/highlight/highlight.js.map +1 -1
- package/dist/esm/components/hue-slider/hue-slider.js.map +1 -1
- package/dist/esm/components/icon/icons/circle-euro-icon.js +14 -0
- package/dist/esm/components/icon/icons/circle-euro-icon.js.map +1 -0
- package/dist/esm/components/icon/icons/index.js +7 -3
- package/dist/esm/components/icon/icons/index.js.map +1 -1
- package/dist/esm/components/icon/icons/scan-box-icon.js +14 -0
- package/dist/esm/components/icon/icons/scan-box-icon.js.map +1 -0
- package/dist/esm/components/icon/icons/server-plus-icon.js +14 -0
- package/dist/esm/components/icon/icons/server-plus-icon.js.map +1 -0
- package/dist/esm/components/icon/index.js +4 -2
- package/dist/esm/components/indicator/indicator.js.map +1 -1
- package/dist/esm/components/infinite-scroll-area/infinite-scroll-area.js.map +1 -1
- package/dist/esm/components/input/input-group.js.map +1 -1
- package/dist/esm/components/link-box/link-box.js.map +1 -1
- package/dist/esm/components/list/list.js.map +1 -1
- package/dist/esm/components/loading/audio.js.map +1 -1
- package/dist/esm/components/loading/background.js.map +1 -1
- package/dist/esm/components/loading/circles.js.map +1 -1
- package/dist/esm/components/loading/dots.js.map +1 -1
- package/dist/esm/components/loading/grid.js.map +1 -1
- package/dist/esm/components/loading/loading-provider.js.map +1 -1
- package/dist/esm/components/loading/oval.js.map +1 -1
- package/dist/esm/components/loading/page.js.map +1 -1
- package/dist/esm/components/loading/puff.js.map +1 -1
- package/dist/esm/components/loading/rings.js.map +1 -1
- package/dist/esm/components/loading/screen.js.map +1 -1
- package/dist/esm/components/loading/suspense.js.map +1 -1
- package/dist/esm/components/menu/menu.js.map +1 -1
- package/dist/esm/components/menu/use-menu.js.map +1 -1
- package/dist/esm/components/modal/modal.js.map +1 -1
- package/dist/esm/components/native-accordion/native-accordion.js.map +1 -1
- package/dist/esm/components/native-popover/native-popover.js.map +1 -1
- package/dist/esm/components/native-select/native-select.js.map +1 -1
- package/dist/esm/components/native-select/use-native-select.js.map +1 -1
- package/dist/esm/components/native-table/native-table.js.map +1 -1
- package/dist/esm/components/notice/notice-provider.js.map +1 -1
- package/dist/esm/components/notice/notice.js.map +1 -1
- package/dist/esm/components/notice/use-notice.js.map +1 -1
- package/dist/esm/components/number-input/number-input.js.map +1 -1
- package/dist/esm/components/pagination/pagination.js.map +1 -1
- package/dist/esm/components/password-input/password-input.js.map +1 -1
- package/dist/esm/components/password-input/strength-meter.js.map +1 -1
- package/dist/esm/components/picture/picture.js.map +1 -1
- package/dist/esm/components/pin-input/pin-input.js.map +1 -1
- package/dist/esm/components/popover/popover.js.map +1 -1
- package/dist/esm/components/progress/progress.js.map +1 -1
- package/dist/esm/components/qr-code/qr-code.js.map +1 -1
- package/dist/esm/components/radio/radio-group.js.map +1 -1
- package/dist/esm/components/radio/radio.js.map +1 -1
- package/dist/esm/components/radio-card/radio-card-group.js.map +1 -1
- package/dist/esm/components/radio-card/radio-card.js.map +1 -1
- package/dist/esm/components/rating/rating.js.map +1 -1
- package/dist/esm/components/reorder/reorder.js.map +1 -1
- package/dist/esm/components/resizable/resizable.js.map +1 -1
- package/dist/esm/components/ripple/ripple.js.map +1 -1
- package/dist/esm/components/rotate/rotate.js.map +1 -1
- package/dist/esm/components/saturation-slider/saturation-slider.js.map +1 -1
- package/dist/esm/components/saturation-slider/use-saturation-slider.js.map +1 -1
- package/dist/esm/components/segmented-control/segmented-control.js.map +1 -1
- package/dist/esm/components/select/select.js.map +1 -1
- package/dist/esm/components/select/use-select.js.map +1 -1
- package/dist/esm/components/sidebar/sidebar.js.map +1 -1
- package/dist/esm/components/skeleton/skeleton-text.js.map +1 -1
- package/dist/esm/components/slide/slide.js.map +1 -1
- package/dist/esm/components/slide-fade/slide-fade.js.map +1 -1
- package/dist/esm/components/slider/slider.js.map +1 -1
- package/dist/esm/components/slot/slot.js.map +1 -1
- package/dist/esm/components/snacks/snacks.js.map +1 -1
- package/dist/esm/components/stack/stack.js.map +1 -1
- package/dist/esm/components/stack/z-stack.js.map +1 -1
- package/dist/esm/components/stat/stat.js.map +1 -1
- package/dist/esm/components/status/status.js.map +1 -1
- package/dist/esm/components/steps/steps.js.map +1 -1
- package/dist/esm/components/switch/switch.js.map +1 -1
- package/dist/esm/components/table/table.js.map +1 -1
- package/dist/esm/components/tabs/tabs.js.map +1 -1
- package/dist/esm/components/tag/tag.js.map +1 -1
- package/dist/esm/components/timeline/timeline.js.map +1 -1
- package/dist/esm/components/tip/tip.js.map +1 -1
- package/dist/esm/components/toggle/toggle-group.js.map +1 -1
- package/dist/esm/components/tooltip/tooltip.js.map +1 -1
- package/dist/esm/components/tree/tree.js.map +1 -1
- package/dist/esm/components/tree/use-tree.js.map +1 -1
- package/dist/esm/core/components/create-component.js.map +1 -1
- package/dist/esm/core/system/breakpoint.js.map +1 -1
- package/dist/esm/core/system/environment-provider.js.map +1 -1
- package/dist/esm/core/system/styled.js.map +1 -1
- package/dist/esm/core/system/theme-provider.js.map +1 -1
- package/dist/esm/hooks/use-breakpoint/use-breakpoint.js.map +1 -1
- package/dist/esm/hooks/use-combobox/index.js.map +1 -1
- package/dist/esm/hooks/use-field-sizing/index.js.map +1 -1
- package/dist/esm/hooks/use-outside-click/index.js.map +1 -1
- package/dist/esm/index.js +7 -3
- package/dist/esm/providers/ui-provider/ui-provider.js.map +1 -1
- package/dist/esm/utils/store.js.map +1 -1
- package/dist/types/components/icon/icons/circle-euro-icon.d.ts +13 -0
- package/dist/types/components/icon/icons/index.d.ts +5 -3
- package/dist/types/components/icon/icons/index.types.d.ts +1 -1
- package/dist/types/components/icon/icons/scan-box-icon.d.ts +13 -0
- package/dist/types/components/icon/icons/server-plus-icon.d.ts +13 -0
- package/dist/types/components/icon/index.d.ts +4 -2
- package/dist/types/components/menu/use-menu.d.ts +1 -1
- package/dist/types/components/number-input/number-input.style.d.ts +1 -1
- package/dist/types/index.d.ts +5 -3
- package/package.json +5 -5
- package/dist/cjs/components/icon/icons/circle-euro-sign-icon.cjs +0 -14
- package/dist/cjs/components/icon/icons/circle-euro-sign-icon.cjs.map +0 -1
- package/dist/esm/components/icon/icons/circle-euro-sign-icon.js +0 -14
- package/dist/esm/components/icon/icons/circle-euro-sign-icon.js.map +0 -1
- package/dist/types/components/icon/icons/circle-euro-sign-icon.d.ts +0 -13
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"status.js","names":[],"sources":["../../../../src/components/status/status.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { StatusStyle } from \"./status.style\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { statusStyle } from \"./status.style\"\n\nexport type StatusScheme = \"error\" | \"info\" | \"success\" | \"warning\"\n\nexport interface StatusProps extends HTMLStyledProps, ThemeProps<StatusStyle> {\n /**\n * The type of the status\n *\n * @default 'info'\n * */\n value?: StatusScheme\n /**\n * The props for the status indicator component\n */\n indicatorProps?: HTMLStyledProps\n /**\n * The props for the status label component\n */\n labelProps?: HTMLStyledProps\n}\n\nconst {\n PropsContext: StatusPropsContext,\n usePropsContext: useStatusPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<StatusProps, StatusStyle>(\"status\", statusStyle)\n\nexport { StatusPropsContext, useStatusPropsContext }\n\n/**\n * `Status` is component that indicate the status of a process or state.\n *\n * @see https://yamada-ui.com/docs/components/status\n */\nexport const Status = withProvider<\"div\", StatusProps>(\n ({ children, indicatorProps, labelProps, ...rest }) => {\n return (\n <styled.div {...rest}>\n <StatusIndicator {...indicatorProps} />\n\n <StatusLabel {...labelProps}>{children}</StatusLabel>\n </styled.div>\n )\n },\n \"root\",\n)(undefined, ({ colorScheme, value = \"info\", ...rest }) => ({\n colorScheme: colorScheme ?? value,\n ...rest,\n}))\n\ninterface StatusIndicatorProps extends HTMLStyledProps {}\n\nconst StatusIndicator = withContext<\"div\", StatusIndicatorProps>(\n \"div\",\n \"indicator\",\n)()\n\ninterface StatusLabelProps extends HTMLStyledProps<\"p\"> {}\n\nconst StatusLabel = withContext<\"p\", StatusLabelProps>(\"p\", \"label\")()\n"],"mappings":";;;;;;AA0BA,MAAM,EACJ,cAAc,oBACd,iBAAiB,uBACjB,aACA,iBACE,oBAA8C,UAAU,WAAW;;;;;;AASvE,MAAa,SAAS,cACnB,EAAE,UAAU,gBAAgB,YAAY,GAAG,WAAW;CACrD,OACE,qBAAC,OAAO,KAAR;EAAY,GAAI;
|
|
1
|
+
{"version":3,"file":"status.js","names":[],"sources":["../../../../src/components/status/status.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { StatusStyle } from \"./status.style\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { statusStyle } from \"./status.style\"\n\nexport type StatusScheme = \"error\" | \"info\" | \"success\" | \"warning\"\n\nexport interface StatusProps extends HTMLStyledProps, ThemeProps<StatusStyle> {\n /**\n * The type of the status\n *\n * @default 'info'\n * */\n value?: StatusScheme\n /**\n * The props for the status indicator component\n */\n indicatorProps?: HTMLStyledProps\n /**\n * The props for the status label component\n */\n labelProps?: HTMLStyledProps\n}\n\nconst {\n PropsContext: StatusPropsContext,\n usePropsContext: useStatusPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<StatusProps, StatusStyle>(\"status\", statusStyle)\n\nexport { StatusPropsContext, useStatusPropsContext }\n\n/**\n * `Status` is component that indicate the status of a process or state.\n *\n * @see https://yamada-ui.com/docs/components/status\n */\nexport const Status = withProvider<\"div\", StatusProps>(\n ({ children, indicatorProps, labelProps, ...rest }) => {\n return (\n <styled.div {...rest}>\n <StatusIndicator {...indicatorProps} />\n\n <StatusLabel {...labelProps}>{children}</StatusLabel>\n </styled.div>\n )\n },\n \"root\",\n)(undefined, ({ colorScheme, value = \"info\", ...rest }) => ({\n colorScheme: colorScheme ?? value,\n ...rest,\n}))\n\ninterface StatusIndicatorProps extends HTMLStyledProps {}\n\nconst StatusIndicator = withContext<\"div\", StatusIndicatorProps>(\n \"div\",\n \"indicator\",\n)()\n\ninterface StatusLabelProps extends HTMLStyledProps<\"p\"> {}\n\nconst StatusLabel = withContext<\"p\", StatusLabelProps>(\"p\", \"label\")()\n"],"mappings":";;;;;;AA0BA,MAAM,EACJ,cAAc,oBACd,iBAAiB,uBACjB,aACA,iBACE,oBAA8C,UAAU,WAAW;;;;;;AASvE,MAAa,SAAS,cACnB,EAAE,UAAU,gBAAgB,YAAY,GAAG,WAAW;CACrD,OACE,qBAAC,OAAO,KAAR;EAAY,GAAI;EAAhB,UAAA,CACE,oBAAC,iBAAD,EAAiB,GAAI,eAAiB,CAAA,GAEtC,oBAAC,aAAD;GAAa,GAAI;GAAa;EAAsB,CAAA,CAC1C;;AAEhB,GACA,MACF,CAAC,CAAC,KAAA,IAAY,EAAE,aAAa,QAAQ,QAAQ,GAAG,YAAY;CAC1D,aAAa,eAAe;CAC5B,GAAG;AACL,EAAE;AAIF,MAAM,kBAAkB,YACtB,OACA,WACF,CAAC,CAAC;AAIF,MAAM,cAAc,YAAmC,KAAK,OAAO,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"steps.js","names":[],"sources":["../../../../src/components/steps/steps.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { UseLazyMountProps } from \"../../hooks/use-lazy-mount\"\nimport type { StepsStyle } from \"./steps.style\"\nimport type { UseStepsItemProps, UseStepsProps } from \"./use-steps\"\nimport { Children, useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useLazyMount } from \"../../hooks/use-lazy-mount\"\nimport { useValue } from \"../../hooks/use-value\"\nimport {\n isNull,\n isUndefined,\n useFindChild,\n useValidChildren,\n} from \"../../utils\"\nimport { CheckIcon } from \"../icon\"\nimport { stepsStyle } from \"./steps.style\"\nimport {\n StepsContext,\n StepsDescendantsContext,\n StepsItemContext,\n useSteps,\n useStepsContext,\n useStepsItem,\n useStepsItemContext,\n} from \"./use-steps\"\n\ninterface ComponentContext extends Pick<\n StepsRootProps,\n \"items\" | \"lazy\" | \"lazyBehavior\"\n> {}\n\nexport interface StepsItem\n extends\n Omit<StepsItemProps, \"content\" | \"index\" | \"title\">,\n Pick<StepsIndicatorProps, \"complete\" | \"current\" | \"incomplete\"> {\n /**\n * The content for step element.\n */\n content?: ReactNode\n /**\n * The description for step element.\n */\n description?: ReactNode\n /**\n * If true, display the step separator.\n *\n * @default true\n */\n hasSeparator?: boolean\n /**\n * The title for step element.\n */\n title?: string\n /**\n * Props for step content element.\n */\n contentProps?: StepsContentProps\n /**\n * Props for step description element.\n */\n descriptionProps?: StepsDescriptionProps\n /**\n * Props for step indicator element.\n */\n indicatorProps?: StepsIndicatorProps\n /**\n * Props for step separator element.\n */\n separatorProps?: StepsSeparatorProps\n /**\n * Props for step title element.\n */\n titleProps?: StepsTitleProps\n}\n\nexport interface StepsRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n Omit<UseStepsProps, \"count\" | \"orientation\">,\n Pick<UseLazyMountProps, \"lazy\" | \"lazyBehavior\">,\n ThemeProps<StepsStyle> {\n /**\n * If provided, generate step components based on steps.\n */\n items?: StepsItem[]\n}\n\nconst {\n ComponentContext,\n PropsContext: StepsPropsContext,\n useComponentContext,\n usePropsContext: useStepsPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<StepsRootProps, StepsStyle, ComponentContext>(\n \"steps\",\n stepsStyle,\n)\n\nexport { StepsPropsContext, useStepsPropsContext }\n\n/**\n * `Steps` is a component that displays the progress of a multi-step process.\n *\n * @see https://yamada-ui.com/docs/components/steps\n */\nexport const StepsRoot = withProvider<\"div\", StepsRootProps, \"orientation\">(\n ({\n children,\n items = [],\n lazy,\n lazyBehavior,\n orientation: orientationProp,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const validChildren = useValidChildren(children)\n const stepsList = useFindChild<StepsListProps>(validChildren, StepsList)\n const {\n id,\n count,\n descendants,\n getStatus,\n index,\n orientation,\n setIndex,\n getContentProps,\n getListProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getRootProps,\n onNext,\n onPrev,\n } = useSteps({\n count: items.length || Children.count(stepsList?.props.children),\n orientation: computedOrientation,\n ...rest,\n })\n const componentContext = useMemo(\n () => ({ items, lazy, lazyBehavior }),\n [items, lazy, lazyBehavior],\n )\n const stepsContext = useMemo(\n () => ({\n id,\n count,\n getStatus,\n index,\n orientation,\n setIndex,\n getContentProps,\n getListProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n onNext,\n onPrev,\n }),\n [\n id,\n count,\n index,\n orientation,\n setIndex,\n getStatus,\n onNext,\n onPrev,\n getListProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getContentProps,\n ],\n )\n\n return (\n <StepsDescendantsContext value={descendants}>\n <StepsContext value={stepsContext}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{children}</styled.div>\n </ComponentContext>\n </StepsContext>\n </StepsDescendantsContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)()\n\nexport interface StepsListProps extends HTMLStyledProps<\"ol\"> {}\n\nexport const StepsList = withContext<\"ol\", StepsListProps>(\n ({ children, ...rest }) => {\n const { items } = useComponentContext()\n const { getListProps } = useStepsContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n else\n return items?.map(\n (\n {\n complete,\n content: _content,\n current,\n description,\n hasSeparator = true,\n incomplete,\n title,\n contentProps: _contentProps,\n descriptionProps,\n indicatorProps,\n separatorProps,\n titleProps,\n ...rest\n },\n index,\n ) => (\n <StepsItem key={index} index={index} title={title} {...rest}>\n <StepsIndicator\n complete={complete}\n current={current}\n incomplete={incomplete}\n {...indicatorProps}\n />\n\n <styled.div>\n {title ? (\n <StepsTitle {...titleProps}>{title}</StepsTitle>\n ) : null}\n {description ? (\n <StepsDescription {...descriptionProps}>\n {description}\n </StepsDescription>\n ) : null}\n </styled.div>\n\n {hasSeparator ? <StepsSeparator {...separatorProps} /> : null}\n </StepsItem>\n ),\n )\n }, [children, items])\n\n return <styled.ol {...getListProps(rest)}>{computedChildren}</styled.ol>\n },\n \"list\",\n)()\n\nexport interface StepsItemProps\n extends HTMLStyledProps<\"li\">, UseStepsItemProps {}\n\nexport const StepsItem = withContext<\"li\", StepsItemProps>((props) => {\n const {\n first,\n index,\n last,\n status,\n getDescriptionProps,\n getIndicatorProps,\n getRootProps,\n getSeparatorProps,\n getTitleProps,\n } = useStepsItem(props)\n const context = useMemo(\n () => ({\n first,\n index,\n last,\n status,\n getDescriptionProps,\n getIndicatorProps,\n getSeparatorProps,\n getTitleProps,\n }),\n [\n first,\n index,\n last,\n status,\n getTitleProps,\n getDescriptionProps,\n getSeparatorProps,\n getIndicatorProps,\n ],\n )\n\n return (\n <StepsItemContext value={context}>\n <styled.li {...getRootProps()} />\n </StepsItemContext>\n )\n}, \"item\")()\n\nexport interface StepsIndicatorProps extends HTMLStyledProps {\n /**\n * The element for the complete indicator.\n *\n * @default <CheckIcon />\n */\n complete?: ReactNode\n /**\n * The element for the current indicator.\n *\n * @default <StepsNumber />\n */\n current?: ReactNode\n /**\n * The element for the incomplete indicator.\n *\n * @default <StepsNumber />\n */\n incomplete?: ReactNode\n}\n\nexport const StepsIndicator = withContext<\"div\", StepsIndicatorProps>(\n ({\n complete = <CheckIcon />,\n current = <StepsNumber />,\n incomplete = <StepsNumber />,\n ...rest\n }) => {\n const { status, getIndicatorProps } = useStepsItemContext()\n const components = useMemo(\n () => ({ complete, current, incomplete }),\n [complete, current, incomplete],\n )\n\n return (\n <styled.div {...getIndicatorProps(rest)}>{components[status]}</styled.div>\n )\n },\n \"indicator\",\n)()\n\nexport interface StepsNumberProps extends HTMLStyledProps<\"span\"> {}\n\nexport const StepsNumber = withContext<\"span\", StepsNumberProps>(\n \"span\",\n \"number\",\n)(undefined, ({ children, ...rest }) => {\n const { index } = useStepsItemContext()\n\n return { ...rest, children: children ?? index + 1 }\n})\n\nexport interface StepsTitleProps extends HTMLStyledProps {}\n\nexport const StepsTitle = withContext<\"h3\", StepsTitleProps>(\"h3\", \"title\")(\n undefined,\n (props) => {\n const { getTitleProps } = useStepsItemContext()\n\n return getTitleProps(props)\n },\n)\n\nexport interface StepsDescriptionProps extends HTMLStyledProps<\"p\"> {}\n\nexport const StepsDescription = withContext<\"p\", StepsDescriptionProps>(\n \"p\",\n \"description\",\n)(undefined, (props) => {\n const { getDescriptionProps } = useStepsItemContext()\n\n return getDescriptionProps(props)\n})\n\nexport interface StepsSeparatorProps extends HTMLStyledProps {}\n\nexport const StepsSeparator = withContext<\"div\", StepsSeparatorProps>(\n \"div\",\n \"separator\",\n)(undefined, (props) => {\n const { getSeparatorProps } = useStepsItemContext()\n\n return getSeparatorProps(props)\n})\n\nexport interface StepsContentsProps extends PropsWithChildren {}\n\nexport const StepsContents: FC<StepsContentsProps> = ({ children }) => {\n const { items } = useComponentContext()\n\n return useMemo(() => {\n if (children) return children\n else\n return items?.map(({ content, contentProps }, index) =>\n isUndefined(content) || isNull(content) ? null : (\n <StepsContent key={index} index={index} {...contentProps}>\n {content}\n </StepsContent>\n ),\n )\n }, [children, items])\n}\n\nexport interface StepsContentProps extends HTMLStyledProps {\n /**\n * The index of the step content.\n */\n index: number\n}\n\nexport const StepsContent = withContext<\"div\", StepsContentProps>(\n \"div\",\n \"content\",\n)(undefined, ({ index, ...rest }) => {\n const { lazy, lazyBehavior } = useComponentContext()\n const { index: selectedIndex, getContentProps } = useStepsContext()\n const mounted = index === selectedIndex\n const children = useLazyMount({\n lazy,\n lazyBehavior,\n mounted,\n ...rest,\n })\n\n return { ...getContentProps({ index, ...rest }), children }\n})\n\nexport interface StepsCompletedContentProps extends HTMLStyledProps {}\n\nexport const StepsCompletedContent = withContext<\n \"div\",\n StepsCompletedContentProps\n>(\"div\", { name: \"CompletedContent\", slot: [\"content\", \"completed\"] })(\n undefined,\n (props) => {\n const { lazy, lazyBehavior } = useComponentContext()\n const { count, index: selectedIndex, getContentProps } = useStepsContext()\n const mounted = count !== 0 && count === selectedIndex\n const children = useLazyMount({\n lazy,\n lazyBehavior,\n mounted,\n ...props,\n })\n\n return { ...getContentProps(props), children }\n },\n)\n\nexport interface StepsPrevTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const StepsPrevTrigger = withContext<\"button\", StepsPrevTriggerProps>(\n \"button\",\n { name: \"PrevTrigger\", slot: [\"trigger\", \"prev\"] },\n)((props) => {\n const { getPrevTriggerProps } = useStepsContext()\n\n return { asChild: true, ...getPrevTriggerProps(props) }\n})\n\nexport interface StepsNextTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const StepsNextTrigger = withContext<\"button\", StepsNextTriggerProps>(\n \"button\",\n { name: \"NextTrigger\", slot: [\"trigger\", \"next\"] },\n)((props) => {\n const { getNextTriggerProps } = useStepsContext()\n\n return { asChild: true, ...getNextTriggerProps(props) }\n})\n"],"mappings":";;;;;;;;;;;;;AA0FA,MAAM,EACJ,kBACA,cAAc,mBACd,qBACA,iBAAiB,sBACjB,aACA,iBACE,oBACF,SACA,UACF;;;;;;AASA,MAAa,YAAY,cACtB,EACC,UACA,QAAQ,CAAC,GACT,MACA,cACA,aAAa,iBACb,GAAG,WACC;CACJ,MAAM,sBAAsB,SAAS,eAAe;CAEpD,MAAM,YAAY,aADI,iBAAiB,QACoB,GAAG,SAAS;CACvE,MAAM,EACJ,IACA,OACA,aACA,WACA,OACA,aACA,UACA,iBACA,cACA,qBACA,qBACA,cACA,QACA,WACE,SAAS;EACX,OAAO,MAAM,UAAU,SAAS,MAAM,WAAW,MAAM,QAAQ;EAC/D,aAAa;EACb,GAAG;CACL,CAAC;CACD,MAAM,mBAAmB,eAChB;EAAE;EAAO;EAAM;CAAa,IACnC;EAAC;EAAO;EAAM;CAAY,CAC5B;CAgCA,OACE,oBAAC,yBAAD;EAAyB,OAAO;YAC9B,oBAAC,cAAD;GAAc,OAjCG,eACZ;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF,IACA;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF,CAKkC;aAC9B,oBAAC,kBAAD;IAAkB,OAAO;cACvB,oBAAC,OAAO,KAAR;KAAY,GAAI,aAAa;KAAI;IAAqB,CAAA;GACtC,CAAA;EACN,CAAA;CACS,CAAA;AAE7B,GACA,QACA,EAAE,eAAe,CAAC,aAAa,EAAE,CACnC,CAAC,CAAC;AAIF,MAAa,YAAY,aACtB,EAAE,UAAU,GAAG,WAAW;CACzB,MAAM,EAAE,UAAU,oBAAoB;CACtC,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;OAEnB,OAAO,OAAO,KAEV,EACE,UACA,SAAS,UACT,SACA,aACA,eAAe,MACf,YACA,OACA,cAAc,eACd,kBACA,gBACA,gBACA,YACA,GAAG,QAEL,UAEA,qBAAC,WAAD;GAA8B;GAAc;GAAO,GAAI;aAAvD;IACE,oBAAC,gBAAD;KACY;KACD;KACG;KACZ,GAAI;IACL,CAAA;IAED,qBAAC,OAAO,KAAR,EAAA,UAAA,CACG,QACC,oBAAC,YAAD;KAAY,GAAI;eAAa;IAAkB,CAAA,IAC7C,MACH,cACC,oBAAC,kBAAD;KAAkB,GAAI;eACnB;IACe,CAAA,IAChB,IACM,EAAA,CAAA;IAEX,eAAe,oBAAC,gBAAD,EAAgB,GAAI,eAAiB,CAAA,IAAI;GAChD;KApBK,KAoBL,CAEf;CACJ,GAAG,CAAC,UAAU,KAAK,CAAC;CAEpB,OAAO,oBAAC,OAAO,IAAR;EAAW,GAAI,aAAa,IAAI;YAAI;CAA4B,CAAA;AACzE,GACA,MACF,CAAC,CAAC;AAKF,MAAa,YAAY,aAAmC,UAAU;CACpE,MAAM,EACJ,OACA,OACA,MACA,QACA,qBACA,mBACA,cACA,mBACA,kBACE,aAAa,KAAK;CAwBtB,OACE,oBAAC,kBAAD;EAAkB,OAxBJ,eACP;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,IACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAI+B;YAC7B,oBAAC,OAAO,IAAR,EAAW,GAAI,aAAa,EAAI,CAAA;CAChB,CAAA;AAEtB,GAAG,MAAM,CAAC,CAAC;AAuBX,MAAa,iBAAiB,aAC3B,EACC,WAAW,oBAAC,WAAD,CAAY,CAAA,GACvB,UAAU,oBAAC,aAAD,CAAc,CAAA,GACxB,aAAa,oBAAC,aAAD,CAAc,CAAA,GAC3B,GAAG,WACC;CACJ,MAAM,EAAE,QAAQ,sBAAsB,oBAAoB;CAC1D,MAAM,aAAa,eACV;EAAE;EAAU;EAAS;CAAW,IACvC;EAAC;EAAU;EAAS;CAAU,CAChC;CAEA,OACE,oBAAC,OAAO,KAAR;EAAY,GAAI,kBAAkB,IAAI;YAAI,WAAW;CAAoB,CAAA;AAE7E,GACA,WACF,CAAC,CAAC;AAIF,MAAa,cAAc,YACzB,QACA,QACF,CAAC,CAAC,KAAA,IAAY,EAAE,UAAU,GAAG,WAAW;CACtC,MAAM,EAAE,UAAU,oBAAoB;CAEtC,OAAO;EAAE,GAAG;EAAM,UAAU,YAAY,QAAQ;CAAE;AACpD,CAAC;AAID,MAAa,aAAa,YAAmC,MAAM,OAAO,CAAC,CACzE,KAAA,IACC,UAAU;CACT,MAAM,EAAE,kBAAkB,oBAAoB;CAE9C,OAAO,cAAc,KAAK;AAC5B,CACF;AAIA,MAAa,mBAAmB,YAC9B,KACA,aACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,wBAAwB,oBAAoB;CAEpD,OAAO,oBAAoB,KAAK;AAClC,CAAC;AAID,MAAa,iBAAiB,YAC5B,OACA,WACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,sBAAsB,oBAAoB;CAElD,OAAO,kBAAkB,KAAK;AAChC,CAAC;AAID,MAAa,iBAAyC,EAAE,eAAe;CACrE,MAAM,EAAE,UAAU,oBAAoB;CAEtC,OAAO,cAAc;EACnB,IAAI,UAAU,OAAO;OAEnB,OAAO,OAAO,KAAK,EAAE,SAAS,gBAAgB,WAAA,GAAA,cAAA,YAAA,CAChC,OAAO,MAAA,GAAA,cAAA,OAAA,CAAY,OAAO,IAAI,OACxC,oBAAC,cAAD;GAAiC;GAAO,GAAI;aACzC;EACW,GAFK,KAEL,CAElB;CACJ,GAAG,CAAC,UAAU,KAAK,CAAC;AACtB;AASA,MAAa,eAAe,YAC1B,OACA,SACF,CAAC,CAAC,KAAA,IAAY,EAAE,OAAO,GAAG,WAAW;CACnC,MAAM,EAAE,MAAM,iBAAiB,oBAAoB;CACnD,MAAM,EAAE,OAAO,eAAe,oBAAoB,gBAAgB;CAElE,MAAM,WAAW,aAAa;EAC5B;EACA;EACA,SAJc,UAAU;EAKxB,GAAG;CACL,CAAC;CAED,OAAO;EAAE,GAAG,gBAAgB;GAAE;GAAO,GAAG;EAAK,CAAC;EAAG;CAAS;AAC5D,CAAC;AAID,MAAa,wBAAwB,YAGnC,OAAO;CAAE,MAAM;CAAoB,MAAM,CAAC,WAAW,WAAW;AAAE,CAAC,CAAC,CACpE,KAAA,IACC,UAAU;CACT,MAAM,EAAE,MAAM,iBAAiB,oBAAoB;CACnD,MAAM,EAAE,OAAO,OAAO,eAAe,oBAAoB,gBAAgB;CAEzE,MAAM,WAAW,aAAa;EAC5B;EACA;EACA,SAJc,UAAU,KAAK,UAAU;EAKvC,GAAG;CACL,CAAC;CAED,OAAO;EAAE,GAAG,gBAAgB,KAAK;EAAG;CAAS;AAC/C,CACF;AAIA,MAAa,mBAAmB,YAC9B,UACA;CAAE,MAAM;CAAe,MAAM,CAAC,WAAW,MAAM;AAAE,CACnD,CAAC,EAAE,UAAU;CACX,MAAM,EAAE,wBAAwB,gBAAgB;CAEhD,OAAO;EAAE,SAAS;EAAM,GAAG,oBAAoB,KAAK;CAAE;AACxD,CAAC;AAID,MAAa,mBAAmB,YAC9B,UACA;CAAE,MAAM;CAAe,MAAM,CAAC,WAAW,MAAM;AAAE,CACnD,CAAC,EAAE,UAAU;CACX,MAAM,EAAE,wBAAwB,gBAAgB;CAEhD,OAAO;EAAE,SAAS;EAAM,GAAG,oBAAoB,KAAK;CAAE;AACxD,CAAC"}
|
|
1
|
+
{"version":3,"file":"steps.js","names":[],"sources":["../../../../src/components/steps/steps.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { UseLazyMountProps } from \"../../hooks/use-lazy-mount\"\nimport type { StepsStyle } from \"./steps.style\"\nimport type { UseStepsItemProps, UseStepsProps } from \"./use-steps\"\nimport { Children, useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useLazyMount } from \"../../hooks/use-lazy-mount\"\nimport { useValue } from \"../../hooks/use-value\"\nimport {\n isNull,\n isUndefined,\n useFindChild,\n useValidChildren,\n} from \"../../utils\"\nimport { CheckIcon } from \"../icon\"\nimport { stepsStyle } from \"./steps.style\"\nimport {\n StepsContext,\n StepsDescendantsContext,\n StepsItemContext,\n useSteps,\n useStepsContext,\n useStepsItem,\n useStepsItemContext,\n} from \"./use-steps\"\n\ninterface ComponentContext extends Pick<\n StepsRootProps,\n \"items\" | \"lazy\" | \"lazyBehavior\"\n> {}\n\nexport interface StepsItem\n extends\n Omit<StepsItemProps, \"content\" | \"index\" | \"title\">,\n Pick<StepsIndicatorProps, \"complete\" | \"current\" | \"incomplete\"> {\n /**\n * The content for step element.\n */\n content?: ReactNode\n /**\n * The description for step element.\n */\n description?: ReactNode\n /**\n * If true, display the step separator.\n *\n * @default true\n */\n hasSeparator?: boolean\n /**\n * The title for step element.\n */\n title?: string\n /**\n * Props for step content element.\n */\n contentProps?: StepsContentProps\n /**\n * Props for step description element.\n */\n descriptionProps?: StepsDescriptionProps\n /**\n * Props for step indicator element.\n */\n indicatorProps?: StepsIndicatorProps\n /**\n * Props for step separator element.\n */\n separatorProps?: StepsSeparatorProps\n /**\n * Props for step title element.\n */\n titleProps?: StepsTitleProps\n}\n\nexport interface StepsRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n Omit<UseStepsProps, \"count\" | \"orientation\">,\n Pick<UseLazyMountProps, \"lazy\" | \"lazyBehavior\">,\n ThemeProps<StepsStyle> {\n /**\n * If provided, generate step components based on steps.\n */\n items?: StepsItem[]\n}\n\nconst {\n ComponentContext,\n PropsContext: StepsPropsContext,\n useComponentContext,\n usePropsContext: useStepsPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<StepsRootProps, StepsStyle, ComponentContext>(\n \"steps\",\n stepsStyle,\n)\n\nexport { StepsPropsContext, useStepsPropsContext }\n\n/**\n * `Steps` is a component that displays the progress of a multi-step process.\n *\n * @see https://yamada-ui.com/docs/components/steps\n */\nexport const StepsRoot = withProvider<\"div\", StepsRootProps, \"orientation\">(\n ({\n children,\n items = [],\n lazy,\n lazyBehavior,\n orientation: orientationProp,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const validChildren = useValidChildren(children)\n const stepsList = useFindChild<StepsListProps>(validChildren, StepsList)\n const {\n id,\n count,\n descendants,\n getStatus,\n index,\n orientation,\n setIndex,\n getContentProps,\n getListProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getRootProps,\n onNext,\n onPrev,\n } = useSteps({\n count: items.length || Children.count(stepsList?.props.children),\n orientation: computedOrientation,\n ...rest,\n })\n const componentContext = useMemo(\n () => ({ items, lazy, lazyBehavior }),\n [items, lazy, lazyBehavior],\n )\n const stepsContext = useMemo(\n () => ({\n id,\n count,\n getStatus,\n index,\n orientation,\n setIndex,\n getContentProps,\n getListProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n onNext,\n onPrev,\n }),\n [\n id,\n count,\n index,\n orientation,\n setIndex,\n getStatus,\n onNext,\n onPrev,\n getListProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getContentProps,\n ],\n )\n\n return (\n <StepsDescendantsContext value={descendants}>\n <StepsContext value={stepsContext}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{children}</styled.div>\n </ComponentContext>\n </StepsContext>\n </StepsDescendantsContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)()\n\nexport interface StepsListProps extends HTMLStyledProps<\"ol\"> {}\n\nexport const StepsList = withContext<\"ol\", StepsListProps>(\n ({ children, ...rest }) => {\n const { items } = useComponentContext()\n const { getListProps } = useStepsContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n else\n return items?.map(\n (\n {\n complete,\n content: _content,\n current,\n description,\n hasSeparator = true,\n incomplete,\n title,\n contentProps: _contentProps,\n descriptionProps,\n indicatorProps,\n separatorProps,\n titleProps,\n ...rest\n },\n index,\n ) => (\n <StepsItem key={index} index={index} title={title} {...rest}>\n <StepsIndicator\n complete={complete}\n current={current}\n incomplete={incomplete}\n {...indicatorProps}\n />\n\n <styled.div>\n {title ? (\n <StepsTitle {...titleProps}>{title}</StepsTitle>\n ) : null}\n {description ? (\n <StepsDescription {...descriptionProps}>\n {description}\n </StepsDescription>\n ) : null}\n </styled.div>\n\n {hasSeparator ? <StepsSeparator {...separatorProps} /> : null}\n </StepsItem>\n ),\n )\n }, [children, items])\n\n return <styled.ol {...getListProps(rest)}>{computedChildren}</styled.ol>\n },\n \"list\",\n)()\n\nexport interface StepsItemProps\n extends HTMLStyledProps<\"li\">, UseStepsItemProps {}\n\nexport const StepsItem = withContext<\"li\", StepsItemProps>((props) => {\n const {\n first,\n index,\n last,\n status,\n getDescriptionProps,\n getIndicatorProps,\n getRootProps,\n getSeparatorProps,\n getTitleProps,\n } = useStepsItem(props)\n const context = useMemo(\n () => ({\n first,\n index,\n last,\n status,\n getDescriptionProps,\n getIndicatorProps,\n getSeparatorProps,\n getTitleProps,\n }),\n [\n first,\n index,\n last,\n status,\n getTitleProps,\n getDescriptionProps,\n getSeparatorProps,\n getIndicatorProps,\n ],\n )\n\n return (\n <StepsItemContext value={context}>\n <styled.li {...getRootProps()} />\n </StepsItemContext>\n )\n}, \"item\")()\n\nexport interface StepsIndicatorProps extends HTMLStyledProps {\n /**\n * The element for the complete indicator.\n *\n * @default <CheckIcon />\n */\n complete?: ReactNode\n /**\n * The element for the current indicator.\n *\n * @default <StepsNumber />\n */\n current?: ReactNode\n /**\n * The element for the incomplete indicator.\n *\n * @default <StepsNumber />\n */\n incomplete?: ReactNode\n}\n\nexport const StepsIndicator = withContext<\"div\", StepsIndicatorProps>(\n ({\n complete = <CheckIcon />,\n current = <StepsNumber />,\n incomplete = <StepsNumber />,\n ...rest\n }) => {\n const { status, getIndicatorProps } = useStepsItemContext()\n const components = useMemo(\n () => ({ complete, current, incomplete }),\n [complete, current, incomplete],\n )\n\n return (\n <styled.div {...getIndicatorProps(rest)}>{components[status]}</styled.div>\n )\n },\n \"indicator\",\n)()\n\nexport interface StepsNumberProps extends HTMLStyledProps<\"span\"> {}\n\nexport const StepsNumber = withContext<\"span\", StepsNumberProps>(\n \"span\",\n \"number\",\n)(undefined, ({ children, ...rest }) => {\n const { index } = useStepsItemContext()\n\n return { ...rest, children: children ?? index + 1 }\n})\n\nexport interface StepsTitleProps extends HTMLStyledProps {}\n\nexport const StepsTitle = withContext<\"h3\", StepsTitleProps>(\"h3\", \"title\")(\n undefined,\n (props) => {\n const { getTitleProps } = useStepsItemContext()\n\n return getTitleProps(props)\n },\n)\n\nexport interface StepsDescriptionProps extends HTMLStyledProps<\"p\"> {}\n\nexport const StepsDescription = withContext<\"p\", StepsDescriptionProps>(\n \"p\",\n \"description\",\n)(undefined, (props) => {\n const { getDescriptionProps } = useStepsItemContext()\n\n return getDescriptionProps(props)\n})\n\nexport interface StepsSeparatorProps extends HTMLStyledProps {}\n\nexport const StepsSeparator = withContext<\"div\", StepsSeparatorProps>(\n \"div\",\n \"separator\",\n)(undefined, (props) => {\n const { getSeparatorProps } = useStepsItemContext()\n\n return getSeparatorProps(props)\n})\n\nexport interface StepsContentsProps extends PropsWithChildren {}\n\nexport const StepsContents: FC<StepsContentsProps> = ({ children }) => {\n const { items } = useComponentContext()\n\n return useMemo(() => {\n if (children) return children\n else\n return items?.map(({ content, contentProps }, index) =>\n isUndefined(content) || isNull(content) ? null : (\n <StepsContent key={index} index={index} {...contentProps}>\n {content}\n </StepsContent>\n ),\n )\n }, [children, items])\n}\n\nexport interface StepsContentProps extends HTMLStyledProps {\n /**\n * The index of the step content.\n */\n index: number\n}\n\nexport const StepsContent = withContext<\"div\", StepsContentProps>(\n \"div\",\n \"content\",\n)(undefined, ({ index, ...rest }) => {\n const { lazy, lazyBehavior } = useComponentContext()\n const { index: selectedIndex, getContentProps } = useStepsContext()\n const mounted = index === selectedIndex\n const children = useLazyMount({\n lazy,\n lazyBehavior,\n mounted,\n ...rest,\n })\n\n return { ...getContentProps({ index, ...rest }), children }\n})\n\nexport interface StepsCompletedContentProps extends HTMLStyledProps {}\n\nexport const StepsCompletedContent = withContext<\n \"div\",\n StepsCompletedContentProps\n>(\"div\", { name: \"CompletedContent\", slot: [\"content\", \"completed\"] })(\n undefined,\n (props) => {\n const { lazy, lazyBehavior } = useComponentContext()\n const { count, index: selectedIndex, getContentProps } = useStepsContext()\n const mounted = count !== 0 && count === selectedIndex\n const children = useLazyMount({\n lazy,\n lazyBehavior,\n mounted,\n ...props,\n })\n\n return { ...getContentProps(props), children }\n },\n)\n\nexport interface StepsPrevTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const StepsPrevTrigger = withContext<\"button\", StepsPrevTriggerProps>(\n \"button\",\n { name: \"PrevTrigger\", slot: [\"trigger\", \"prev\"] },\n)((props) => {\n const { getPrevTriggerProps } = useStepsContext()\n\n return { asChild: true, ...getPrevTriggerProps(props) }\n})\n\nexport interface StepsNextTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const StepsNextTrigger = withContext<\"button\", StepsNextTriggerProps>(\n \"button\",\n { name: \"NextTrigger\", slot: [\"trigger\", \"next\"] },\n)((props) => {\n const { getNextTriggerProps } = useStepsContext()\n\n return { asChild: true, ...getNextTriggerProps(props) }\n})\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.js","names":[],"sources":["../../../../src/components/switch/switch.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { SwitchStyle } from \"./switch.style\"\nimport type { UseSwitchProps } from \"./use-switch\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { isObject } from \"../../utils\"\nimport { switchStyle } from \"./switch.style\"\nimport { useSwitch } from \"./use-switch\"\n\nexport interface SwitchProps\n extends\n Merge<HTMLStyledProps<\"label\">, UseSwitchProps>,\n ThemeProps<SwitchStyle> {\n /**\n * The switch icon to use.\n */\n icon?: ReactNode | { off: ReactNode; on: ReactNode }\n /**\n * Props for switch input element.\n */\n inputProps?: HTMLStyledProps<\"input\">\n /**\n * Props for switch label element.\n */\n labelProps?: HTMLStyledProps<\"span\">\n}\n\nconst {\n PropsContext: SwitchPropsContext,\n usePropsContext: useSwitchPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<SwitchProps, SwitchStyle>(\"switch\", switchStyle)\n\nexport { SwitchPropsContext, useSwitchPropsContext }\n\n/**\n * `Switch` is a component used to toggle between on and off states.\n *\n * @see https://yamada-ui.com/docs/components/switch\n */\nexport const Switch = withProvider<\"input\", SwitchProps>(\n ({ children, icon, inputProps, labelProps, ...props }) => {\n const {\n checked,\n getInputProps,\n getLabelProps,\n getRootProps,\n getThumbProps,\n getTrackProps,\n } = useSwitch(props)\n\n return (\n <styled.label {...getRootProps()}>\n <styled.input data-peer {...getInputProps(inputProps)} />\n\n <SwitchTrack {...getTrackProps()}>\n <SwitchThumb {...getThumbProps()}>\n {icon && isObject(icon) && \"on\" in icon\n ? checked\n ? icon.on\n : icon.off\n : icon}\n </SwitchThumb>\n </SwitchTrack>\n\n {children ? (\n <SwitchLabel {...getLabelProps(labelProps)}>{children}</SwitchLabel>\n ) : null}\n </styled.label>\n )\n },\n \"root\",\n)()\n\ninterface SwitchThumbProps extends HTMLStyledProps {}\n\nconst SwitchThumb = withContext<\"div\", SwitchThumbProps>(\"div\", \"thumb\")()\n\ninterface SwitchTrackProps extends HTMLStyledProps {}\n\nconst SwitchTrack = withContext<\"div\", SwitchTrackProps>(\"div\", \"track\")()\n\ninterface SwitchLabelProps extends HTMLStyledProps<\"span\"> {}\n\nconst SwitchLabel = withContext<\"span\", SwitchLabelProps>(\"span\", \"label\")()\n"],"mappings":";;;;;;;;AA8BA,MAAM,EACJ,cAAc,oBACd,iBAAiB,uBACjB,aACA,iBACE,oBAA8C,UAAU,WAAW;;;;;;AASvE,MAAa,SAAS,cACnB,EAAE,UAAU,MAAM,YAAY,YAAY,GAAG,YAAY;CACxD,MAAM,EACJ,SACA,eACA,eACA,cACA,eACA,kBACE,UAAU,KAAK;CAEnB,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,aAAa;
|
|
1
|
+
{"version":3,"file":"switch.js","names":[],"sources":["../../../../src/components/switch/switch.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { SwitchStyle } from \"./switch.style\"\nimport type { UseSwitchProps } from \"./use-switch\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { isObject } from \"../../utils\"\nimport { switchStyle } from \"./switch.style\"\nimport { useSwitch } from \"./use-switch\"\n\nexport interface SwitchProps\n extends\n Merge<HTMLStyledProps<\"label\">, UseSwitchProps>,\n ThemeProps<SwitchStyle> {\n /**\n * The switch icon to use.\n */\n icon?: ReactNode | { off: ReactNode; on: ReactNode }\n /**\n * Props for switch input element.\n */\n inputProps?: HTMLStyledProps<\"input\">\n /**\n * Props for switch label element.\n */\n labelProps?: HTMLStyledProps<\"span\">\n}\n\nconst {\n PropsContext: SwitchPropsContext,\n usePropsContext: useSwitchPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<SwitchProps, SwitchStyle>(\"switch\", switchStyle)\n\nexport { SwitchPropsContext, useSwitchPropsContext }\n\n/**\n * `Switch` is a component used to toggle between on and off states.\n *\n * @see https://yamada-ui.com/docs/components/switch\n */\nexport const Switch = withProvider<\"input\", SwitchProps>(\n ({ children, icon, inputProps, labelProps, ...props }) => {\n const {\n checked,\n getInputProps,\n getLabelProps,\n getRootProps,\n getThumbProps,\n getTrackProps,\n } = useSwitch(props)\n\n return (\n <styled.label {...getRootProps()}>\n <styled.input data-peer {...getInputProps(inputProps)} />\n\n <SwitchTrack {...getTrackProps()}>\n <SwitchThumb {...getThumbProps()}>\n {icon && isObject(icon) && \"on\" in icon\n ? checked\n ? icon.on\n : icon.off\n : icon}\n </SwitchThumb>\n </SwitchTrack>\n\n {children ? (\n <SwitchLabel {...getLabelProps(labelProps)}>{children}</SwitchLabel>\n ) : null}\n </styled.label>\n )\n },\n \"root\",\n)()\n\ninterface SwitchThumbProps extends HTMLStyledProps {}\n\nconst SwitchThumb = withContext<\"div\", SwitchThumbProps>(\"div\", \"thumb\")()\n\ninterface SwitchTrackProps extends HTMLStyledProps {}\n\nconst SwitchTrack = withContext<\"div\", SwitchTrackProps>(\"div\", \"track\")()\n\ninterface SwitchLabelProps extends HTMLStyledProps<\"span\"> {}\n\nconst SwitchLabel = withContext<\"span\", SwitchLabelProps>(\"span\", \"label\")()\n"],"mappings":";;;;;;;;AA8BA,MAAM,EACJ,cAAc,oBACd,iBAAiB,uBACjB,aACA,iBACE,oBAA8C,UAAU,WAAW;;;;;;AASvE,MAAa,SAAS,cACnB,EAAE,UAAU,MAAM,YAAY,YAAY,GAAG,YAAY;CACxD,MAAM,EACJ,SACA,eACA,eACA,cACA,eACA,kBACE,UAAU,KAAK;CAEnB,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,aAAa;EAA/B,UAAA;GACE,oBAAC,OAAO,OAAR;IAAc,aAAA;IAAU,GAAI,cAAc,UAAU;GAAI,CAAA;GAExD,oBAAC,aAAD;IAAa,GAAI,cAAc;IAC7B,UAAA,oBAAC,aAAD;KAAa,GAAI,cAAc;KAC5B,UAAA,SAAA,GAAA,cAAA,SAAA,CAAiB,IAAI,KAAK,QAAQ,OAC/B,UACE,KAAK,KACL,KAAK,MACP;IACO,CAAA;GACF,CAAA;GAEZ,WACC,oBAAC,aAAD;IAAa,GAAI,cAAc,UAAU;IAAI;GAAsB,CAAA,IACjE;EACQ;;AAElB,GACA,MACF,CAAC,CAAC;AAIF,MAAM,cAAc,YAAqC,OAAO,OAAO,CAAC,CAAC;AAIzE,MAAM,cAAc,YAAqC,OAAO,OAAO,CAAC,CAAC;AAIzE,MAAM,cAAc,YAAsC,QAAQ,OAAO,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.js","names":["NativeTable.Root","NativeTable.Thead","NativeTable.Tr","NativeTable.Th","NativeTable.Tbody","NativeTable.Td","NativeTable.Tfoot"],"sources":["../../../../src/components/table/table.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n AccessorFn,\n Cell,\n CellContext,\n ColumnDef,\n ColumnDefTemplate,\n ColumnFiltersColumnDef,\n ColumnFiltersState,\n ColumnMeta,\n ColumnPinningColumnDef,\n ColumnSizingColumnDef,\n GlobalFilterColumnDef,\n GroupingColumnDef,\n Header,\n HeaderContext,\n HeaderGroup,\n OnChangeFn,\n SortingState as OriginalSortingState,\n PaginationState,\n Table as ReactTable,\n Row,\n RowData,\n RowSelectionState,\n SortDirection,\n SortingColumnDef,\n TableOptions,\n VisibilityColumnDef,\n} from \"@tanstack/react-table\"\nimport type { FC, FocusEvent, KeyboardEvent, ReactElement } from \"react\"\nimport type { CSSProps, GenericsComponent, HTMLStyledProps } from \"../../core\"\nimport type { ReactNodeOrFunction, TransformProps } from \"../../utils\"\nimport type { CheckboxProps } from \"../checkbox\"\nimport {\n createColumnHelper,\n flexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n} from \"@tanstack/react-table\"\nimport { useMemo, useRef } from \"react\"\nimport { createComponent, focusRingStyle, mergeProps, styled } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n dataAttr,\n isFunction,\n runIfFn,\n runKeyAction,\n useUpdateEffect,\n} from \"../../utils\"\nimport { Checkbox } from \"../checkbox\"\nimport { ChevronsUpDownIcon, ChevronUpIcon } from \"../icon\"\nimport { NativeTable } from \"../native-table\"\n\ndeclare module \"@tanstack/react-table\" {\n interface ColumnDefExtensions<TData extends RowData, TValue = unknown>\n extends\n VisibilityColumnDef,\n ColumnPinningColumnDef,\n ColumnFiltersColumnDef<TData>,\n GlobalFilterColumnDef,\n SortingColumnDef<TData>,\n GroupingColumnDef<TData, TValue>,\n ColumnSizingColumnDef {}\n\n interface ColumnDefBase<TData extends RowData, TValue = unknown>\n extends\n ColumnDefExtensions<TData, TValue>,\n Pick<CSSProps, \"lineClamp\" | \"truncated\">,\n Pick<NativeTable.TdProps, \"numeric\"> {\n cell?: ColumnDefTemplate<CellContext<TData, TValue>>\n footer?: ColumnDefTemplate<HeaderContext<TData, TValue>>\n getUniqueValues?: AccessorFn<TData, unknown[]>\n meta?: ColumnMeta<TData, TValue>\n cellProps?: NativeTable.TdProps\n footerProps?: NativeTable.ThProps\n headerProps?: NativeTable.ThProps\n }\n}\n\nexport { createColumnHelper }\nexport type {\n ColumnDef,\n ColumnFiltersState,\n PaginationState,\n RowSelectionState,\n SortDirection,\n}\n\nfunction getMergeHeaderGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n const columnsIds = new Set()\n\n return headerGroups.map((headerGroup, depth, { length: fullDepth }) => {\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !columnsIds.has(header.column.id))\n .map((header) => {\n columnsIds.add(header.column.id)\n\n return header.isPlaceholder\n ? { ...header, isPlaceholder: false, rowSpan: fullDepth - depth }\n : { ...header, rowSpan: 1 }\n }),\n }\n })\n}\n\nfunction getMergeFooterGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n return headerGroups.map((headerGroup, depth) => {\n const nextHeaderGroups = headerGroups.slice(depth + 1)\n\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !header.isPlaceholder)\n .map((header) => {\n if (nextHeaderGroups.length === 0) return header\n\n const rowSpan = nextHeaderGroups.reduce((acc, nextHeaderGroup) => {\n const hasNextHeader = nextHeaderGroup.headers.some(\n (nextHeader) => nextHeader.column.id === header.column.id,\n )\n\n return acc + (hasNextHeader ? 1 : 0)\n }, 1)\n\n return { ...header, rowSpan }\n }),\n }\n })\n}\n\nexport interface ColumnSort<Y extends RowData> {\n desc: boolean\n id: keyof Y\n}\nexport type SortingState<Y extends RowData> = ColumnSort<Y>[]\n\ninterface ComponentContext extends Pick<\n TableProps<any>,\n | \"columnResizeMode\"\n | \"resizableTriggerProps\"\n | \"sortingIcon\"\n | \"sortingIconProps\"\n> {\n table: ReactTable<any>\n}\n\ninterface OmittedTableOptions<Y extends RowData> extends Omit<\n TableOptions<Y>,\n | \"getCoreRowModel\"\n | \"onColumnFiltersChange\"\n | \"onPaginationChange\"\n | \"onSortingChange\"\n> {}\n\ninterface PickedNativeTableProps extends Pick<\n NativeTable.RootProps,\n | \"className\"\n | \"highlightOnHover\"\n | \"highlightOnSelected\"\n | \"layout\"\n | \"scrollAreaProps\"\n | \"size\"\n | \"stickyFooter\"\n | \"stickyHeader\"\n | \"striped\"\n | \"variant\"\n | \"withBorder\"\n | \"withColumnBorders\"\n | \"withScrollArea\"\n> {}\n\nexport interface TableProps<Y extends RowData>\n extends\n OmittedTableOptions<Y>,\n PickedNativeTableProps,\n Pick<CSSProps, \"colorScheme\" | \"lineClamp\" | \"truncated\"> {\n /**\n * The column filters state of the table.\n */\n columnFilters?: ColumnFiltersState\n /**\n * The default column filters state of the table.\n */\n defaultColumnFilters?: ColumnFiltersState\n /**\n * The default pagination state of the table.\n */\n defaultPagination?: PaginationState\n /**\n * The default row selection state of the table.\n */\n defaultRowSelection?: RowSelectionState\n /**\n * The default sorting state of the table.\n */\n defaultSorting?: SortingState<Y>\n /**\n * If `true`, the table width will be automatically resized to the content.\n *\n * @default false\n */\n enableAutoResizeTableWidth?: boolean\n /**\n * If `true`, the keyboard navigation will be enabled.\n *\n * @default true\n */\n enableKeyboardNavigation?: boolean\n /**\n * If `true`, the pagination will be enabled.\n *\n * @default false\n */\n enablePagination?: boolean\n /**\n * The footer of the table.\n */\n footer?: ReactNodeOrFunction<ReactTable<Y>>\n /**\n * The header of the table.\n */\n header?: ReactNodeOrFunction<ReactTable<Y>>\n /**\n * The initial focusable cell of the table.\n *\n * @default {rowIndex: 0, colIndex: 0}\n */\n initialFocusableCell?: { colIndex: number; rowIndex: number }\n /**\n * The pagination state of the table.\n */\n pagination?: PaginationState\n /**\n * The row selection state of the table.\n */\n rowSelection?: RowSelectionState\n /**\n * If `true`, the row will be selected when the row is clicked.\n *\n * @default false\n */\n selectOnClickRow?: boolean\n /**\n * The sorting state of the table.\n */\n sorting?: SortingState<Y>\n /**\n * The sorting icon of the table.\n */\n sortingIcon?: ReactNodeOrFunction<false | SortDirection>\n /**\n * If `true`, the table will have a checkbox column.\n *\n * @default true\n */\n withCheckbox?: boolean\n /**\n * If `true`, the table will have a checkbox in the footer.\n *\n * @default false\n */\n withFooterCheckbox?: boolean\n /**\n * If `true`, the table will have footer groups.\n *\n * @default false\n */\n withFooterGroups?: boolean\n /**\n * The props for the table cell.\n */\n cellProps?: TransformProps<NativeTable.TdProps, Cell<Y, unknown>>\n /**\n * The props for the checkbox.\n */\n checkboxProps?: CheckboxProps\n /**\n * The props for the table footer group.\n */\n footerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /**\n * The props for the table footer.\n */\n footerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /**\n * The props for the table header checkbox.\n */\n headerCheckboxProps?: TransformProps<CheckboxProps, Header<Y, unknown>>\n /**\n * The props for the table header group.\n */\n headerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /**\n * The props for the table header.\n */\n headerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /**\n * The props for the resizable trigger.\n */\n resizableTriggerProps?: TransformProps<\n Omit<ResizableTriggerProps, \"resizing\">,\n Header<Y, unknown>\n >\n /**\n * The props for the table row checkbox.\n */\n rowCheckboxProps?: TransformProps<CheckboxProps, Row<Y>>\n /**\n * The props for the table row.\n */\n rowProps?: TransformProps<NativeTable.TrProps, Row<Y>>\n /**\n * The props for the sorting icon.\n */\n sortingIconProps?: TransformProps<\n Omit<SortingIconProps, \"sorted\">,\n Header<Y, unknown>\n >\n /**\n * The props for the table.\n */\n tableProps?: NativeTable.RootProps\n /**\n * The props for the table tbody.\n */\n tbodyProps?: NativeTable.TbodyProps\n /**\n * The props for the table tfoot.\n */\n tfootProps?: NativeTable.TfootProps\n /**\n * The props for the table thead.\n */\n theadProps?: NativeTable.TheadProps\n /**\n * The callback invoked when the column filters state changes.\n */\n onColumnFiltersChange?: (columnFilters: ColumnFiltersState) => void\n /**\n * The callback invoked when the pagination state changes.\n */\n onPaginationChange?: (pagination: PaginationState) => void\n /**\n * The callback invoked when the row is clicked.\n */\n onRowClick?: (row: Row<Y>) => void\n /**\n * The callback invoked when the row is double clicked.\n */\n onRowDoubleClick?: (row: Row<Y>) => void\n /**\n * The callback invoked when the sorting state changes.\n */\n onSortingChange?: (sorting: SortingState<Y>) => void\n}\n\nconst {\n ComponentContext,\n PropsContext: TablePropsContext,\n useComponentContext,\n usePropsContext: useTablePropsContext,\n withContext,\n} = createComponent<TableProps<any>, any, ComponentContext>(\"table\")\n\nexport { TablePropsContext, useTablePropsContext }\n\n/**\n * `Table` is a table component equipped with column sorting, row selection, and click event features.\n *\n * @see https://yamada-ui.com/docs/components/table\n */\nexport const Table = withContext(\n <Y extends RowData>({\n className,\n colorScheme,\n size,\n variant,\n columnFilters: columnFiltersProp,\n columnResizeMode = \"onChange\",\n columns: columnsProp,\n data,\n defaultColumnFilters,\n defaultPagination = { pageIndex: 0, pageSize: 20 },\n defaultRowSelection = {},\n defaultSorting,\n enableAutoResizeTableWidth = false,\n enableColumnResizing = false,\n enableKeyboardNavigation = true,\n enablePagination = false,\n enableRowSelection = false,\n footer,\n header,\n highlightOnHover = !!enableRowSelection,\n highlightOnSelected = !!enableRowSelection,\n initialFocusableCell = { colIndex: 0, rowIndex: 0 },\n layout,\n lineClamp,\n manualPagination,\n pagination: paginationProp,\n rowCount: totalRowCount,\n rowSelection: rowSelectionProp,\n selectOnClickRow = false,\n sortDescFirst = false,\n sorting: sortingProp,\n sortingIcon,\n state,\n stickyFooter,\n stickyHeader,\n striped,\n truncated,\n withBorder,\n withCheckbox = true,\n withColumnBorders,\n withFooterCheckbox = false,\n withFooterGroups = false,\n withScrollArea,\n cellProps,\n checkboxProps,\n footerGroupProps,\n footerProps,\n headerCheckboxProps,\n headerGroupProps,\n headerProps,\n resizableTriggerProps,\n rowCheckboxProps,\n rowProps,\n scrollAreaProps,\n sortingIconProps,\n tableProps,\n tbodyProps,\n tfootProps,\n theadProps,\n onColumnFiltersChange: onColumnFiltersChangeProp,\n onPaginationChange: onPaginationChangeProp,\n onRowClick,\n onRowDoubleClick,\n onRowSelectionChange: onRowSelectionChangeProp,\n onSortingChange: onSortingChangeProp,\n ...rest\n }: TableProps<Y>) => {\n const { t } = useI18n(\"table\")\n const initialFocus = useRef<boolean>(false)\n const ref = useRef<HTMLTableElement>(null)\n const focusedCell = useRef<null | { colIndex: number; rowIndex: number }>(\n null,\n )\n const [rowSelection, onRowSelectionChange] = useControllableState({\n defaultValue: defaultRowSelection,\n value: rowSelectionProp,\n onChange: onRowSelectionChangeProp,\n })\n const [sorting, onSortingChange] = useControllableState({\n defaultValue: defaultSorting,\n value: sortingProp,\n onChange: onSortingChangeProp,\n })\n const [pagination, onPaginationChange] = useControllableState({\n defaultValue: defaultPagination,\n value: paginationProp,\n onChange: onPaginationChangeProp,\n })\n const [columnFilters, onColumnFiltersChange] = useControllableState({\n defaultValue: defaultColumnFilters,\n value: columnFiltersProp,\n onChange: onColumnFiltersChangeProp,\n })\n const columns = useMemo(() => {\n if (!enableRowSelection || !withCheckbox) return columnsProp\n\n const clonedColumns = [...columnsProp]\n\n const header = ({ header, table }: HeaderContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: table.getIsAllRowsSelected(),\n indeterminate: table.getIsSomeRowsSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select all rows\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: table.getToggleAllRowsSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(headerCheckboxProps, header) ?? {},\n )()}\n />\n )\n }\n\n const cell = ({ row }: CellContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: row.getIsSelected(),\n disabled: !row.getCanSelect(),\n indeterminate: row.getIsSomeSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select row\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: row.getToggleSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(rowCheckboxProps, row) ?? {},\n )()}\n />\n )\n }\n\n clonedColumns.unshift({\n id: \"select\",\n cell,\n header,\n ...(withFooterCheckbox\n ? { footer: header }\n : { footerProps: { \"aria-hidden\": \"true\" } }),\n cellProps: { verticalAlign: \"middle\" },\n headerProps: { w: \"calc({spaces.4} + {space-x} * 2)\" },\n })\n\n return clonedColumns\n }, [\n checkboxProps,\n columnsProp,\n enableRowSelection,\n headerCheckboxProps,\n rowCheckboxProps,\n t,\n withCheckbox,\n withFooterCheckbox,\n ])\n const table = useReactTable<Y>({\n columnResizeMode,\n columns,\n data,\n enableColumnResizing,\n enableRowSelection,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n getSortedRowModel: getSortedRowModel(),\n manualPagination,\n rowCount: totalRowCount,\n sortDescFirst,\n state: {\n columnFilters,\n pagination: enablePagination ? pagination : undefined,\n rowSelection,\n sorting: sorting as OriginalSortingState,\n ...state,\n },\n onColumnFiltersChange,\n onPaginationChange,\n onRowSelectionChange,\n onSortingChange: onSortingChange as OnChangeFn<OriginalSortingState>,\n ...(enablePagination\n ? { getPaginationRowModel: getPaginationRowModel() }\n : {}),\n ...rest,\n })\n const headerGroups = table.getHeaderGroups()\n const mergedHeaderGroups = getMergeHeaderGroups(headerGroups)\n const rows = table.getRowModel().rows\n const footerGroups = table.getFooterGroups()\n const mergedFooterGroups = getMergeFooterGroups(\n withFooterGroups ? footerGroups : [],\n )\n const headerGroupCount = headerGroups.length\n const rowCount = rows.length\n const colCount = table.getAllLeafColumns().length\n const maxColIndex = colCount - 1\n const pageIndex = enablePagination\n ? table.getState().pagination.pageIndex\n : 0\n const cellMap = useMemo(() => {\n const cellMap = new Map<string, string>()\n\n if (!enableKeyboardNavigation) return cellMap\n\n const insertCellMap = (\n id: string,\n colSpan: number,\n rowSpan: number,\n colIndex: number,\n rowIndex: number,\n ) => {\n for (let i = 0; i < colSpan; i++)\n cellMap.set(`${colIndex + i}-${rowIndex}`, `${colIndex}-${rowIndex}`)\n\n for (let i = 1; i < rowSpan; i++)\n cellMap.set(`${colIndex}-${rowIndex + i}`, `${colIndex}-${rowIndex}`)\n }\n\n const insertCellMapByHeaderGroup = (\n headerGroup: HeaderGroup<Y>,\n rowIndex: number,\n ) => {\n let placeholderCount = 0\n\n headerGroup.headers.forEach((header) => {\n const colSpan = header.colSpan || 1\n const rowSpan = header.rowSpan || 1\n const colIndex = header.index + placeholderCount\n\n placeholderCount += colSpan - 1\n\n insertCellMap(header.id, colSpan, rowSpan, colIndex, rowIndex)\n })\n }\n\n mergedHeaderGroups.forEach((headerGroup, rowIndex) => {\n insertCellMapByHeaderGroup(headerGroup, rowIndex)\n })\n\n rows.forEach((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n row.getVisibleCells().forEach((cell) => {\n const colIndex = cell.column.getIndex()\n\n insertCellMap(cell.id, 1, 1, colIndex, rowIndex)\n })\n })\n\n mergedFooterGroups.forEach((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n insertCellMapByHeaderGroup(footerGroup, rowIndex)\n })\n\n return cellMap\n }, [\n enableKeyboardNavigation,\n headerGroupCount,\n mergedFooterGroups,\n mergedHeaderGroups,\n rows,\n rowCount,\n ])\n const context = useMemo(\n () => ({\n columnResizeMode,\n sortingIcon,\n table,\n resizableTriggerProps,\n sortingIconProps,\n }),\n [\n columnResizeMode,\n sortingIcon,\n sortingIconProps,\n resizableTriggerProps,\n table,\n ],\n )\n const getCell = (\n evOrEl:\n | Element\n | FocusEvent<HTMLTableElement>\n | KeyboardEvent<HTMLTableElement>\n | null\n | undefined,\n ) => {\n if (!evOrEl) return\n\n const el =\n evOrEl instanceof HTMLElement\n ? evOrEl.closest(\"th, td\")\n : \"target\" in evOrEl && evOrEl.target instanceof HTMLElement\n ? evOrEl.target.closest(\"th, td\")\n : null\n\n if (!(el instanceof HTMLTableCellElement)) return\n\n const { colindex, rowindex } = el.dataset\n const { colSpan, rowSpan } = el\n\n if (!colindex || !rowindex) return\n\n const colIndex = parseInt(colindex)\n const rowIndex = parseInt(rowindex)\n\n return { colIndex, colSpan, el, rowIndex, rowSpan }\n }\n const getShouldFocusCell = (colIndex: number, rowIndex: number) => {\n const [trulyColIndex, trulyRowIndex] =\n cellMap.get(`${colIndex}-${rowIndex}`)?.split(\"-\") ?? []\n\n if (!trulyColIndex || !trulyRowIndex) return\n\n const targetEl = ref.current?.querySelector(\n `[data-colindex=\"${trulyColIndex}\"][data-rowindex=\"${trulyRowIndex}\"]`,\n )\n\n if (!targetEl || !(targetEl instanceof HTMLTableCellElement)) return\n\n return targetEl\n }\n const removeTabIndex = (el: Element | null | undefined) => {\n if (!el || !(el instanceof HTMLElement)) return\n\n el.tabIndex = -1\n el.querySelectorAll(\"[data-focusable]\").forEach((el) => {\n if (el instanceof HTMLElement) el.tabIndex = -1\n })\n }\n const onCellFocus = (\n el: HTMLTableCellElement | null | undefined,\n colIndex: number,\n rowIndex: number,\n ) => {\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (!targetEl) return\n\n focusedCell.current = { colIndex, rowIndex }\n\n removeTabIndex(el)\n\n const shouldFocusEl =\n targetEl.querySelector(\"[data-focusable]\") ?? targetEl\n\n if (shouldFocusEl instanceof HTMLElement) {\n shouldFocusEl.tabIndex = 0\n shouldFocusEl.focus()\n }\n }\n const onFocus = (ev: FocusEvent<HTMLTableElement>) => {\n if (initialFocus.current) return\n\n initialFocus.current = true\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex)\n }\n const onKeyDown = (ev: KeyboardEvent<HTMLTableElement>) => {\n if (!enableKeyboardNavigation) return\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n runKeyAction(ev, {\n ArrowDown: () =>\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex + cell.rowSpan),\n ArrowLeft: () => onCellFocus(cell.el, cell.colIndex - 1, cell.rowIndex),\n ArrowRight: () =>\n onCellFocus(cell.el, cell.colIndex + cell.colSpan, cell.rowIndex),\n ArrowUp: () => onCellFocus(cell.el, cell.colIndex, cell.rowIndex - 1),\n End: () => onCellFocus(cell.el, maxColIndex, cell.rowIndex),\n Home: () => onCellFocus(cell.el, 0, cell.rowIndex),\n ...(enablePagination\n ? {\n PageDown: () => {\n if (!table.getCanNextPage()) return\n\n table.setPageIndex(pageIndex + 1)\n },\n PageUp: () => {\n if (!table.getCanPreviousPage()) return\n\n table.setPageIndex(pageIndex - 1)\n },\n }\n : {}),\n })\n }\n const getTabIndex = (colIndex: number, rowIndex: number) => {\n if (!enableKeyboardNavigation) return undefined\n\n return colIndex === initialFocusableCell.colIndex &&\n rowIndex === initialFocusableCell.rowIndex\n ? 0\n : undefined\n }\n\n useUpdateEffect(() => {\n if (!enableKeyboardNavigation) return\n\n const { colIndex, rowIndex } = focusedCell.current ?? initialFocusableCell\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (targetEl) targetEl.tabIndex = 0\n }, [pageIndex, enableKeyboardNavigation])\n\n return (\n <ComponentContext value={context}>\n {header ? runIfFn(header, table) : null}\n\n <NativeTable.Root\n {...mergeProps(\n {\n ref,\n className,\n style:\n enableColumnResizing && enableAutoResizeTableWidth\n ? { width: table.getCenterTotalSize() }\n : {},\n colorScheme,\n size,\n variant,\n \"aria-colcount\": colCount,\n \"aria-multiselectable\": enableRowSelection ? \"true\" : undefined,\n \"aria-rowcount\": totalRowCount || data.length,\n highlightOnHover,\n highlightOnSelected,\n layout,\n role: \"grid\",\n stickyFooter,\n stickyHeader,\n striped,\n withBorder,\n withColumnBorders,\n withScrollArea,\n scrollAreaProps,\n onFocus,\n onKeyDown,\n },\n tableProps ?? {},\n )()}\n >\n <NativeTable.Thead {...theadProps}>\n {mergedHeaderGroups.map((headerGroup, rowIndex) => {\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={headerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(headerGroupProps, headerGroup)}\n >\n {headerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const canSort = header.column.getCanSort()\n const sorted = header.column.getIsSorted()\n const canResize = header.column.getCanResize()\n const resizing = header.column.getIsResizing()\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan || 1) - 1\n\n return (\n <NativeTable.Th\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n aria-sort={\n sorted\n ? sorted === \"asc\"\n ? \"ascending\"\n : \"descending\"\n : \"none\"\n }\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan || undefined}\n numeric={columnDef.numeric}\n pe={\n canSort\n ? \"calc((1rem * {lineHeights.moderate}) + {space-x})\"\n : undefined\n }\n position=\"relative\"\n role=\"columnheader\"\n rowSpan={header.rowSpan || undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n style: enableColumnResizing\n ? { width: header.getSize() }\n : {},\n },\n runIfFn(headerProps, header) ?? {},\n columnDef.headerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n\n {canSort ? (\n <SortingIcon\n sorted={sorted}\n onClick={header.column.getToggleSortingHandler()}\n />\n ) : null}\n\n {canResize ? (\n <ResizableTrigger\n resizing={resizing}\n onDoubleClick={header.column.resetSize}\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n />\n ) : null}\n </NativeTable.Th>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Thead>\n\n <NativeTable.Tbody {...tbodyProps}>\n {rows.map((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n const selected = !!rowSelection[row.id]\n const disabled =\n isFunction(enableRowSelection) && !enableRowSelection(row)\n\n return (\n <NativeTable.Tr\n id={row.id}\n key={row.id}\n aria-disabled={ariaAttr(disabled)}\n aria-rowindex={rowIndex + 1}\n aria-selected={ariaAttr(selected)}\n data-disabled={dataAttr(disabled)}\n data-selected={dataAttr(selected)}\n role=\"row\"\n {...mergeProps(\n {\n onClick:\n !disabled && selectOnClickRow\n ? () => row.toggleSelected(!selected)\n : undefined,\n },\n {\n onClick: !disabled ? () => onRowClick?.(row) : undefined,\n onDoubleClick: !disabled\n ? () => onRowDoubleClick?.(row)\n : undefined,\n },\n runIfFn(rowProps, row) ?? {},\n )()}\n >\n {row.getVisibleCells().map((cell) => {\n const { columnDef } = cell.column\n const colIndex = cell.column.getIndex()\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )\n\n return (\n <NativeTable.Td\n key={cell.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(cellProps, cell) ?? {},\n columnDef.cellProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tbody>\n\n {withFooterGroups ? (\n <NativeTable.Tfoot {...tfootProps}>\n {mergedFooterGroups.map((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={footerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(footerGroupProps, footerGroup)}\n >\n {footerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.footer,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan || 1) - 1\n\n return (\n <NativeTable.Td\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan || undefined}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n rowSpan={header.rowSpan || undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(footerProps, header) ?? {},\n columnDef.footerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tfoot>\n ) : null}\n </NativeTable.Root>\n\n {footer ? runIfFn(footer, table) : null}\n </ComponentContext>\n )\n },\n)() as GenericsComponent<{\n <Y extends RowData>(props: TableProps<Y>): ReactElement\n}>\n\ninterface SortingIconProps extends HTMLStyledProps<\"button\"> {\n sorted: false | SortDirection\n}\n\nconst SortingIcon: FC<SortingIconProps> = ({ sorted, ...rest }) => {\n const { t } = useI18n(\"table\")\n const { sortingIcon, sortingIconProps = {} } = useComponentContext()\n const Icon = sorted ? ChevronUpIcon : ChevronsUpDownIcon\n\n return (\n <styled.button\n type=\"button\"\n layerStyle=\"ghost\"\n colorScheme=\"mono\"\n aria-label={t(\n sorted\n ? sorted === \"desc\"\n ? \"Sort descending\"\n : \"Sort ascending\"\n : \"Clear sorting\",\n )}\n data-focusable\n aspectRatio=\"1\"\n cursor=\"pointer\"\n display=\"center\"\n focusVisibleRing=\"none\"\n h=\"calc(1em * {lineHeights.moderate})\"\n position=\"absolute\"\n right=\"{space-x}\"\n rounded=\"l1\"\n tabIndex={-1}\n top=\"50%\"\n transform=\"translateY(-50%)\"\n transitionDuration=\"moderate\"\n transitionProperty=\"common\"\n _hover={{ layerStyle: \"ghost.hover\" }}\n {...mergeProps(rest, sortingIconProps)()}\n >\n {runIfFn(sortingIcon, sorted) ?? (\n <Icon transform={`rotate(${sorted === \"desc\" ? 180 : 0}deg)`} />\n )}\n </styled.button>\n )\n}\n\ninterface ResizableTriggerProps extends HTMLStyledProps {\n resizing: boolean\n}\n\nconst ResizableTrigger: FC<ResizableTriggerProps> = ({ resizing, ...rest }) => {\n const {\n columnResizeMode,\n table,\n resizableTriggerProps = {},\n } = useComponentContext()\n const offset = table.getState().columnSizingInfo.deltaOffset\n\n return (\n <styled.div\n data-active={dataAttr(resizing)}\n bg=\"colorScheme.solid\"\n cursor=\"col-resize\"\n insetY=\"0\"\n opacity={{ base: \"0\", _hover: \"1\", _active: \"1\" }}\n position=\"absolute\"\n right=\"0\"\n touchAction=\"none\"\n transform={`translateX(${columnResizeMode === \"onEnd\" && resizing && offset ? `${offset}px` : \"50%\"})`}\n userSelect=\"none\"\n w=\"1\"\n {...mergeProps(rest, resizableTriggerProps)()}\n />\n )\n}\n\ninterface TruncatedTextProps extends HTMLStyledProps<\"span\"> {}\n\nconst TruncatedText: FC<TruncatedTextProps> = ({\n children,\n lineClamp,\n truncated,\n ...rest\n}) => {\n if (lineClamp || truncated)\n return (\n <styled.span\n lineClamp={lineClamp}\n truncated={truncated}\n wordBreak=\"break-all\"\n {...rest}\n >\n {children}\n </styled.span>\n )\n else return children\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"table.js","names":["NativeTable.Root","NativeTable.Thead","NativeTable.Tr","NativeTable.Th","NativeTable.Tbody","NativeTable.Td","NativeTable.Tfoot"],"sources":["../../../../src/components/table/table.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n AccessorFn,\n Cell,\n CellContext,\n ColumnDef,\n ColumnDefTemplate,\n ColumnFiltersColumnDef,\n ColumnFiltersState,\n ColumnMeta,\n ColumnPinningColumnDef,\n ColumnSizingColumnDef,\n GlobalFilterColumnDef,\n GroupingColumnDef,\n Header,\n HeaderContext,\n HeaderGroup,\n OnChangeFn,\n SortingState as OriginalSortingState,\n PaginationState,\n Table as ReactTable,\n Row,\n RowData,\n RowSelectionState,\n SortDirection,\n SortingColumnDef,\n TableOptions,\n VisibilityColumnDef,\n} from \"@tanstack/react-table\"\nimport type { FC, FocusEvent, KeyboardEvent, ReactElement } from \"react\"\nimport type { CSSProps, GenericsComponent, HTMLStyledProps } from \"../../core\"\nimport type { ReactNodeOrFunction, TransformProps } from \"../../utils\"\nimport type { CheckboxProps } from \"../checkbox\"\nimport {\n createColumnHelper,\n flexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n} from \"@tanstack/react-table\"\nimport { useMemo, useRef } from \"react\"\nimport { createComponent, focusRingStyle, mergeProps, styled } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n dataAttr,\n isFunction,\n runIfFn,\n runKeyAction,\n useUpdateEffect,\n} from \"../../utils\"\nimport { Checkbox } from \"../checkbox\"\nimport { ChevronsUpDownIcon, ChevronUpIcon } from \"../icon\"\nimport { NativeTable } from \"../native-table\"\n\ndeclare module \"@tanstack/react-table\" {\n interface ColumnDefExtensions<TData extends RowData, TValue = unknown>\n extends\n VisibilityColumnDef,\n ColumnPinningColumnDef,\n ColumnFiltersColumnDef<TData>,\n GlobalFilterColumnDef,\n SortingColumnDef<TData>,\n GroupingColumnDef<TData, TValue>,\n ColumnSizingColumnDef {}\n\n interface ColumnDefBase<TData extends RowData, TValue = unknown>\n extends\n ColumnDefExtensions<TData, TValue>,\n Pick<CSSProps, \"lineClamp\" | \"truncated\">,\n Pick<NativeTable.TdProps, \"numeric\"> {\n cell?: ColumnDefTemplate<CellContext<TData, TValue>>\n footer?: ColumnDefTemplate<HeaderContext<TData, TValue>>\n getUniqueValues?: AccessorFn<TData, unknown[]>\n meta?: ColumnMeta<TData, TValue>\n cellProps?: NativeTable.TdProps\n footerProps?: NativeTable.ThProps\n headerProps?: NativeTable.ThProps\n }\n}\n\nexport { createColumnHelper }\nexport type {\n ColumnDef,\n ColumnFiltersState,\n PaginationState,\n RowSelectionState,\n SortDirection,\n}\n\nfunction getMergeHeaderGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n const columnsIds = new Set()\n\n return headerGroups.map((headerGroup, depth, { length: fullDepth }) => {\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !columnsIds.has(header.column.id))\n .map((header) => {\n columnsIds.add(header.column.id)\n\n return header.isPlaceholder\n ? { ...header, isPlaceholder: false, rowSpan: fullDepth - depth }\n : { ...header, rowSpan: 1 }\n }),\n }\n })\n}\n\nfunction getMergeFooterGroups(\n headerGroups: HeaderGroup<any>[],\n): HeaderGroup<any>[] {\n if (headerGroups.length <= 1) return headerGroups\n\n return headerGroups.map((headerGroup, depth) => {\n const nextHeaderGroups = headerGroups.slice(depth + 1)\n\n return {\n ...headerGroup,\n headers: headerGroup.headers\n .filter((header) => !header.isPlaceholder)\n .map((header) => {\n if (nextHeaderGroups.length === 0) return header\n\n const rowSpan = nextHeaderGroups.reduce((acc, nextHeaderGroup) => {\n const hasNextHeader = nextHeaderGroup.headers.some(\n (nextHeader) => nextHeader.column.id === header.column.id,\n )\n\n return acc + (hasNextHeader ? 1 : 0)\n }, 1)\n\n return { ...header, rowSpan }\n }),\n }\n })\n}\n\nexport interface ColumnSort<Y extends RowData> {\n desc: boolean\n id: keyof Y\n}\nexport type SortingState<Y extends RowData> = ColumnSort<Y>[]\n\ninterface ComponentContext extends Pick<\n TableProps<any>,\n | \"columnResizeMode\"\n | \"resizableTriggerProps\"\n | \"sortingIcon\"\n | \"sortingIconProps\"\n> {\n table: ReactTable<any>\n}\n\ninterface OmittedTableOptions<Y extends RowData> extends Omit<\n TableOptions<Y>,\n | \"getCoreRowModel\"\n | \"onColumnFiltersChange\"\n | \"onPaginationChange\"\n | \"onSortingChange\"\n> {}\n\ninterface PickedNativeTableProps extends Pick<\n NativeTable.RootProps,\n | \"className\"\n | \"highlightOnHover\"\n | \"highlightOnSelected\"\n | \"layout\"\n | \"scrollAreaProps\"\n | \"size\"\n | \"stickyFooter\"\n | \"stickyHeader\"\n | \"striped\"\n | \"variant\"\n | \"withBorder\"\n | \"withColumnBorders\"\n | \"withScrollArea\"\n> {}\n\nexport interface TableProps<Y extends RowData>\n extends\n OmittedTableOptions<Y>,\n PickedNativeTableProps,\n Pick<CSSProps, \"colorScheme\" | \"lineClamp\" | \"truncated\"> {\n /**\n * The column filters state of the table.\n */\n columnFilters?: ColumnFiltersState\n /**\n * The default column filters state of the table.\n */\n defaultColumnFilters?: ColumnFiltersState\n /**\n * The default pagination state of the table.\n */\n defaultPagination?: PaginationState\n /**\n * The default row selection state of the table.\n */\n defaultRowSelection?: RowSelectionState\n /**\n * The default sorting state of the table.\n */\n defaultSorting?: SortingState<Y>\n /**\n * If `true`, the table width will be automatically resized to the content.\n *\n * @default false\n */\n enableAutoResizeTableWidth?: boolean\n /**\n * If `true`, the keyboard navigation will be enabled.\n *\n * @default true\n */\n enableKeyboardNavigation?: boolean\n /**\n * If `true`, the pagination will be enabled.\n *\n * @default false\n */\n enablePagination?: boolean\n /**\n * The footer of the table.\n */\n footer?: ReactNodeOrFunction<ReactTable<Y>>\n /**\n * The header of the table.\n */\n header?: ReactNodeOrFunction<ReactTable<Y>>\n /**\n * The initial focusable cell of the table.\n *\n * @default {rowIndex: 0, colIndex: 0}\n */\n initialFocusableCell?: { colIndex: number; rowIndex: number }\n /**\n * The pagination state of the table.\n */\n pagination?: PaginationState\n /**\n * The row selection state of the table.\n */\n rowSelection?: RowSelectionState\n /**\n * If `true`, the row will be selected when the row is clicked.\n *\n * @default false\n */\n selectOnClickRow?: boolean\n /**\n * The sorting state of the table.\n */\n sorting?: SortingState<Y>\n /**\n * The sorting icon of the table.\n */\n sortingIcon?: ReactNodeOrFunction<false | SortDirection>\n /**\n * If `true`, the table will have a checkbox column.\n *\n * @default true\n */\n withCheckbox?: boolean\n /**\n * If `true`, the table will have a checkbox in the footer.\n *\n * @default false\n */\n withFooterCheckbox?: boolean\n /**\n * If `true`, the table will have footer groups.\n *\n * @default false\n */\n withFooterGroups?: boolean\n /**\n * The props for the table cell.\n */\n cellProps?: TransformProps<NativeTable.TdProps, Cell<Y, unknown>>\n /**\n * The props for the checkbox.\n */\n checkboxProps?: CheckboxProps\n /**\n * The props for the table footer group.\n */\n footerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /**\n * The props for the table footer.\n */\n footerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /**\n * The props for the table header checkbox.\n */\n headerCheckboxProps?: TransformProps<CheckboxProps, Header<Y, unknown>>\n /**\n * The props for the table header group.\n */\n headerGroupProps?: TransformProps<NativeTable.TrProps, HeaderGroup<Y>>\n /**\n * The props for the table header.\n */\n headerProps?: TransformProps<NativeTable.ThProps, Header<Y, unknown>>\n /**\n * The props for the resizable trigger.\n */\n resizableTriggerProps?: TransformProps<\n Omit<ResizableTriggerProps, \"resizing\">,\n Header<Y, unknown>\n >\n /**\n * The props for the table row checkbox.\n */\n rowCheckboxProps?: TransformProps<CheckboxProps, Row<Y>>\n /**\n * The props for the table row.\n */\n rowProps?: TransformProps<NativeTable.TrProps, Row<Y>>\n /**\n * The props for the sorting icon.\n */\n sortingIconProps?: TransformProps<\n Omit<SortingIconProps, \"sorted\">,\n Header<Y, unknown>\n >\n /**\n * The props for the table.\n */\n tableProps?: NativeTable.RootProps\n /**\n * The props for the table tbody.\n */\n tbodyProps?: NativeTable.TbodyProps\n /**\n * The props for the table tfoot.\n */\n tfootProps?: NativeTable.TfootProps\n /**\n * The props for the table thead.\n */\n theadProps?: NativeTable.TheadProps\n /**\n * The callback invoked when the column filters state changes.\n */\n onColumnFiltersChange?: (columnFilters: ColumnFiltersState) => void\n /**\n * The callback invoked when the pagination state changes.\n */\n onPaginationChange?: (pagination: PaginationState) => void\n /**\n * The callback invoked when the row is clicked.\n */\n onRowClick?: (row: Row<Y>) => void\n /**\n * The callback invoked when the row is double clicked.\n */\n onRowDoubleClick?: (row: Row<Y>) => void\n /**\n * The callback invoked when the sorting state changes.\n */\n onSortingChange?: (sorting: SortingState<Y>) => void\n}\n\nconst {\n ComponentContext,\n PropsContext: TablePropsContext,\n useComponentContext,\n usePropsContext: useTablePropsContext,\n withContext,\n} = createComponent<TableProps<any>, any, ComponentContext>(\"table\")\n\nexport { TablePropsContext, useTablePropsContext }\n\n/**\n * `Table` is a table component equipped with column sorting, row selection, and click event features.\n *\n * @see https://yamada-ui.com/docs/components/table\n */\nexport const Table = withContext(\n <Y extends RowData>({\n className,\n colorScheme,\n size,\n variant,\n columnFilters: columnFiltersProp,\n columnResizeMode = \"onChange\",\n columns: columnsProp,\n data,\n defaultColumnFilters,\n defaultPagination = { pageIndex: 0, pageSize: 20 },\n defaultRowSelection = {},\n defaultSorting,\n enableAutoResizeTableWidth = false,\n enableColumnResizing = false,\n enableKeyboardNavigation = true,\n enablePagination = false,\n enableRowSelection = false,\n footer,\n header,\n highlightOnHover = !!enableRowSelection,\n highlightOnSelected = !!enableRowSelection,\n initialFocusableCell = { colIndex: 0, rowIndex: 0 },\n layout,\n lineClamp,\n manualPagination,\n pagination: paginationProp,\n rowCount: totalRowCount,\n rowSelection: rowSelectionProp,\n selectOnClickRow = false,\n sortDescFirst = false,\n sorting: sortingProp,\n sortingIcon,\n state,\n stickyFooter,\n stickyHeader,\n striped,\n truncated,\n withBorder,\n withCheckbox = true,\n withColumnBorders,\n withFooterCheckbox = false,\n withFooterGroups = false,\n withScrollArea,\n cellProps,\n checkboxProps,\n footerGroupProps,\n footerProps,\n headerCheckboxProps,\n headerGroupProps,\n headerProps,\n resizableTriggerProps,\n rowCheckboxProps,\n rowProps,\n scrollAreaProps,\n sortingIconProps,\n tableProps,\n tbodyProps,\n tfootProps,\n theadProps,\n onColumnFiltersChange: onColumnFiltersChangeProp,\n onPaginationChange: onPaginationChangeProp,\n onRowClick,\n onRowDoubleClick,\n onRowSelectionChange: onRowSelectionChangeProp,\n onSortingChange: onSortingChangeProp,\n ...rest\n }: TableProps<Y>) => {\n const { t } = useI18n(\"table\")\n const initialFocus = useRef<boolean>(false)\n const ref = useRef<HTMLTableElement>(null)\n const focusedCell = useRef<null | { colIndex: number; rowIndex: number }>(\n null,\n )\n const [rowSelection, onRowSelectionChange] = useControllableState({\n defaultValue: defaultRowSelection,\n value: rowSelectionProp,\n onChange: onRowSelectionChangeProp,\n })\n const [sorting, onSortingChange] = useControllableState({\n defaultValue: defaultSorting,\n value: sortingProp,\n onChange: onSortingChangeProp,\n })\n const [pagination, onPaginationChange] = useControllableState({\n defaultValue: defaultPagination,\n value: paginationProp,\n onChange: onPaginationChangeProp,\n })\n const [columnFilters, onColumnFiltersChange] = useControllableState({\n defaultValue: defaultColumnFilters,\n value: columnFiltersProp,\n onChange: onColumnFiltersChangeProp,\n })\n const columns = useMemo(() => {\n if (!enableRowSelection || !withCheckbox) return columnsProp\n\n const clonedColumns = [...columnsProp]\n\n const header = ({ header, table }: HeaderContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: table.getIsAllRowsSelected(),\n indeterminate: table.getIsSomeRowsSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select all rows\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: table.getToggleAllRowsSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(headerCheckboxProps, header) ?? {},\n )()}\n />\n )\n }\n\n const cell = ({ row }: CellContext<Y, any>) => {\n return (\n <Checkbox\n {...mergeProps(\n {\n checked: row.getIsSelected(),\n disabled: !row.getCanSelect(),\n indeterminate: row.getIsSomeSelected(),\n indicatorProps: { outline: \"none\" },\n inputProps: {\n \"aria-label\": t(\"Select row\"),\n \"data-focusable\": \"\",\n tabIndex: -1,\n },\n onChange: row.getToggleSelectedHandler(),\n },\n checkboxProps ?? {},\n runIfFn(rowCheckboxProps, row) ?? {},\n )()}\n />\n )\n }\n\n clonedColumns.unshift({\n id: \"select\",\n cell,\n header,\n ...(withFooterCheckbox\n ? { footer: header }\n : { footerProps: { \"aria-hidden\": \"true\" } }),\n cellProps: { verticalAlign: \"middle\" },\n headerProps: { w: \"calc({spaces.4} + {space-x} * 2)\" },\n })\n\n return clonedColumns\n }, [\n checkboxProps,\n columnsProp,\n enableRowSelection,\n headerCheckboxProps,\n rowCheckboxProps,\n t,\n withCheckbox,\n withFooterCheckbox,\n ])\n const table = useReactTable<Y>({\n columnResizeMode,\n columns,\n data,\n enableColumnResizing,\n enableRowSelection,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n getSortedRowModel: getSortedRowModel(),\n manualPagination,\n rowCount: totalRowCount,\n sortDescFirst,\n state: {\n columnFilters,\n pagination: enablePagination ? pagination : undefined,\n rowSelection,\n sorting: sorting as OriginalSortingState,\n ...state,\n },\n onColumnFiltersChange,\n onPaginationChange,\n onRowSelectionChange,\n onSortingChange: onSortingChange as OnChangeFn<OriginalSortingState>,\n ...(enablePagination\n ? { getPaginationRowModel: getPaginationRowModel() }\n : {}),\n ...rest,\n })\n const headerGroups = table.getHeaderGroups()\n const mergedHeaderGroups = getMergeHeaderGroups(headerGroups)\n const rows = table.getRowModel().rows\n const footerGroups = table.getFooterGroups()\n const mergedFooterGroups = getMergeFooterGroups(\n withFooterGroups ? footerGroups : [],\n )\n const headerGroupCount = headerGroups.length\n const rowCount = rows.length\n const colCount = table.getAllLeafColumns().length\n const maxColIndex = colCount - 1\n const pageIndex = enablePagination\n ? table.getState().pagination.pageIndex\n : 0\n const cellMap = useMemo(() => {\n const cellMap = new Map<string, string>()\n\n if (!enableKeyboardNavigation) return cellMap\n\n const insertCellMap = (\n id: string,\n colSpan: number,\n rowSpan: number,\n colIndex: number,\n rowIndex: number,\n ) => {\n for (let i = 0; i < colSpan; i++)\n cellMap.set(`${colIndex + i}-${rowIndex}`, `${colIndex}-${rowIndex}`)\n\n for (let i = 1; i < rowSpan; i++)\n cellMap.set(`${colIndex}-${rowIndex + i}`, `${colIndex}-${rowIndex}`)\n }\n\n const insertCellMapByHeaderGroup = (\n headerGroup: HeaderGroup<Y>,\n rowIndex: number,\n ) => {\n let placeholderCount = 0\n\n headerGroup.headers.forEach((header) => {\n const colSpan = header.colSpan || 1\n const rowSpan = header.rowSpan || 1\n const colIndex = header.index + placeholderCount\n\n placeholderCount += colSpan - 1\n\n insertCellMap(header.id, colSpan, rowSpan, colIndex, rowIndex)\n })\n }\n\n mergedHeaderGroups.forEach((headerGroup, rowIndex) => {\n insertCellMapByHeaderGroup(headerGroup, rowIndex)\n })\n\n rows.forEach((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n row.getVisibleCells().forEach((cell) => {\n const colIndex = cell.column.getIndex()\n\n insertCellMap(cell.id, 1, 1, colIndex, rowIndex)\n })\n })\n\n mergedFooterGroups.forEach((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n insertCellMapByHeaderGroup(footerGroup, rowIndex)\n })\n\n return cellMap\n }, [\n enableKeyboardNavigation,\n headerGroupCount,\n mergedFooterGroups,\n mergedHeaderGroups,\n rows,\n rowCount,\n ])\n const context = useMemo(\n () => ({\n columnResizeMode,\n sortingIcon,\n table,\n resizableTriggerProps,\n sortingIconProps,\n }),\n [\n columnResizeMode,\n sortingIcon,\n sortingIconProps,\n resizableTriggerProps,\n table,\n ],\n )\n const getCell = (\n evOrEl:\n | Element\n | FocusEvent<HTMLTableElement>\n | KeyboardEvent<HTMLTableElement>\n | null\n | undefined,\n ) => {\n if (!evOrEl) return\n\n const el =\n evOrEl instanceof HTMLElement\n ? evOrEl.closest(\"th, td\")\n : \"target\" in evOrEl && evOrEl.target instanceof HTMLElement\n ? evOrEl.target.closest(\"th, td\")\n : null\n\n if (!(el instanceof HTMLTableCellElement)) return\n\n const { colindex, rowindex } = el.dataset\n const { colSpan, rowSpan } = el\n\n if (!colindex || !rowindex) return\n\n const colIndex = parseInt(colindex)\n const rowIndex = parseInt(rowindex)\n\n return { colIndex, colSpan, el, rowIndex, rowSpan }\n }\n const getShouldFocusCell = (colIndex: number, rowIndex: number) => {\n const [trulyColIndex, trulyRowIndex] =\n cellMap.get(`${colIndex}-${rowIndex}`)?.split(\"-\") ?? []\n\n if (!trulyColIndex || !trulyRowIndex) return\n\n const targetEl = ref.current?.querySelector(\n `[data-colindex=\"${trulyColIndex}\"][data-rowindex=\"${trulyRowIndex}\"]`,\n )\n\n if (!targetEl || !(targetEl instanceof HTMLTableCellElement)) return\n\n return targetEl\n }\n const removeTabIndex = (el: Element | null | undefined) => {\n if (!el || !(el instanceof HTMLElement)) return\n\n el.tabIndex = -1\n el.querySelectorAll(\"[data-focusable]\").forEach((el) => {\n if (el instanceof HTMLElement) el.tabIndex = -1\n })\n }\n const onCellFocus = (\n el: HTMLTableCellElement | null | undefined,\n colIndex: number,\n rowIndex: number,\n ) => {\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (!targetEl) return\n\n focusedCell.current = { colIndex, rowIndex }\n\n removeTabIndex(el)\n\n const shouldFocusEl =\n targetEl.querySelector(\"[data-focusable]\") ?? targetEl\n\n if (shouldFocusEl instanceof HTMLElement) {\n shouldFocusEl.tabIndex = 0\n shouldFocusEl.focus()\n }\n }\n const onFocus = (ev: FocusEvent<HTMLTableElement>) => {\n if (initialFocus.current) return\n\n initialFocus.current = true\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex)\n }\n const onKeyDown = (ev: KeyboardEvent<HTMLTableElement>) => {\n if (!enableKeyboardNavigation) return\n\n const cell = getCell(ev)\n\n if (!cell) return\n\n runKeyAction(ev, {\n ArrowDown: () =>\n onCellFocus(cell.el, cell.colIndex, cell.rowIndex + cell.rowSpan),\n ArrowLeft: () => onCellFocus(cell.el, cell.colIndex - 1, cell.rowIndex),\n ArrowRight: () =>\n onCellFocus(cell.el, cell.colIndex + cell.colSpan, cell.rowIndex),\n ArrowUp: () => onCellFocus(cell.el, cell.colIndex, cell.rowIndex - 1),\n End: () => onCellFocus(cell.el, maxColIndex, cell.rowIndex),\n Home: () => onCellFocus(cell.el, 0, cell.rowIndex),\n ...(enablePagination\n ? {\n PageDown: () => {\n if (!table.getCanNextPage()) return\n\n table.setPageIndex(pageIndex + 1)\n },\n PageUp: () => {\n if (!table.getCanPreviousPage()) return\n\n table.setPageIndex(pageIndex - 1)\n },\n }\n : {}),\n })\n }\n const getTabIndex = (colIndex: number, rowIndex: number) => {\n if (!enableKeyboardNavigation) return undefined\n\n return colIndex === initialFocusableCell.colIndex &&\n rowIndex === initialFocusableCell.rowIndex\n ? 0\n : undefined\n }\n\n useUpdateEffect(() => {\n if (!enableKeyboardNavigation) return\n\n const { colIndex, rowIndex } = focusedCell.current ?? initialFocusableCell\n const targetEl = getShouldFocusCell(colIndex, rowIndex)\n\n if (targetEl) targetEl.tabIndex = 0\n }, [pageIndex, enableKeyboardNavigation])\n\n return (\n <ComponentContext value={context}>\n {header ? runIfFn(header, table) : null}\n\n <NativeTable.Root\n {...mergeProps(\n {\n ref,\n className,\n style:\n enableColumnResizing && enableAutoResizeTableWidth\n ? { width: table.getCenterTotalSize() }\n : {},\n colorScheme,\n size,\n variant,\n \"aria-colcount\": colCount,\n \"aria-multiselectable\": enableRowSelection ? \"true\" : undefined,\n \"aria-rowcount\": totalRowCount || data.length,\n highlightOnHover,\n highlightOnSelected,\n layout,\n role: \"grid\",\n stickyFooter,\n stickyHeader,\n striped,\n withBorder,\n withColumnBorders,\n withScrollArea,\n scrollAreaProps,\n onFocus,\n onKeyDown,\n },\n tableProps ?? {},\n )()}\n >\n <NativeTable.Thead {...theadProps}>\n {mergedHeaderGroups.map((headerGroup, rowIndex) => {\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={headerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(headerGroupProps, headerGroup)}\n >\n {headerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const canSort = header.column.getCanSort()\n const sorted = header.column.getIsSorted()\n const canResize = header.column.getCanResize()\n const resizing = header.column.getIsResizing()\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan || 1) - 1\n\n return (\n <NativeTable.Th\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n aria-sort={\n sorted\n ? sorted === \"asc\"\n ? \"ascending\"\n : \"descending\"\n : \"none\"\n }\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan || undefined}\n numeric={columnDef.numeric}\n pe={\n canSort\n ? \"calc((1rem * {lineHeights.moderate}) + {space-x})\"\n : undefined\n }\n position=\"relative\"\n role=\"columnheader\"\n rowSpan={header.rowSpan || undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n style: enableColumnResizing\n ? { width: header.getSize() }\n : {},\n },\n runIfFn(headerProps, header) ?? {},\n columnDef.headerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n\n {canSort ? (\n <SortingIcon\n sorted={sorted}\n onClick={header.column.getToggleSortingHandler()}\n />\n ) : null}\n\n {canResize ? (\n <ResizableTrigger\n resizing={resizing}\n onDoubleClick={header.column.resetSize}\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n />\n ) : null}\n </NativeTable.Th>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Thead>\n\n <NativeTable.Tbody {...tbodyProps}>\n {rows.map((row, rowIndex) => {\n rowIndex += headerGroupCount\n\n const selected = !!rowSelection[row.id]\n const disabled =\n isFunction(enableRowSelection) && !enableRowSelection(row)\n\n return (\n <NativeTable.Tr\n id={row.id}\n key={row.id}\n aria-disabled={ariaAttr(disabled)}\n aria-rowindex={rowIndex + 1}\n aria-selected={ariaAttr(selected)}\n data-disabled={dataAttr(disabled)}\n data-selected={dataAttr(selected)}\n role=\"row\"\n {...mergeProps(\n {\n onClick:\n !disabled && selectOnClickRow\n ? () => row.toggleSelected(!selected)\n : undefined,\n },\n {\n onClick: !disabled ? () => onRowClick?.(row) : undefined,\n onDoubleClick: !disabled\n ? () => onRowDoubleClick?.(row)\n : undefined,\n },\n runIfFn(rowProps, row) ?? {},\n )()}\n >\n {row.getVisibleCells().map((cell) => {\n const { columnDef } = cell.column\n const colIndex = cell.column.getIndex()\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )\n\n return (\n <NativeTable.Td\n key={cell.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(cellProps, cell) ?? {},\n columnDef.cellProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tbody>\n\n {withFooterGroups ? (\n <NativeTable.Tfoot {...tfootProps}>\n {mergedFooterGroups.map((footerGroup, rowIndex) => {\n rowIndex += headerGroupCount + rowCount\n\n let placeholderCount = 0\n\n return (\n <NativeTable.Tr\n key={footerGroup.id}\n aria-rowindex={rowIndex + 1}\n role=\"row\"\n {...runIfFn(footerGroupProps, footerGroup)}\n >\n {footerGroup.headers.map((header) => {\n const { columnDef } = header.column\n const colIndex = header.index + placeholderCount\n const tabIndex = getTabIndex(colIndex, rowIndex)\n const children = header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.footer,\n header.getContext(),\n )\n\n placeholderCount += (header.colSpan || 1) - 1\n\n return (\n <NativeTable.Td\n key={header.id}\n aria-colindex={colIndex + 1}\n aria-rowindex={rowIndex + 1}\n data-colindex={colIndex}\n data-rowindex={rowIndex}\n colSpan={header.colSpan || undefined}\n numeric={columnDef.numeric}\n role=\"gridcell\"\n rowSpan={header.rowSpan || undefined}\n tabIndex={tabIndex}\n {...mergeProps(\n {\n css: {\n \"&:has([data-focusable]:focus-visible)\":\n focusRingStyle.outline,\n },\n },\n runIfFn(footerProps, header) ?? {},\n columnDef.footerProps ?? {},\n )()}\n >\n <TruncatedText\n lineClamp={columnDef.lineClamp ?? lineClamp}\n truncated={columnDef.truncated ?? truncated}\n >\n {children}\n </TruncatedText>\n </NativeTable.Td>\n )\n })}\n </NativeTable.Tr>\n )\n })}\n </NativeTable.Tfoot>\n ) : null}\n </NativeTable.Root>\n\n {footer ? runIfFn(footer, table) : null}\n </ComponentContext>\n )\n },\n)() as GenericsComponent<{\n <Y extends RowData>(props: TableProps<Y>): ReactElement\n}>\n\ninterface SortingIconProps extends HTMLStyledProps<\"button\"> {\n sorted: false | SortDirection\n}\n\nconst SortingIcon: FC<SortingIconProps> = ({ sorted, ...rest }) => {\n const { t } = useI18n(\"table\")\n const { sortingIcon, sortingIconProps = {} } = useComponentContext()\n const Icon = sorted ? ChevronUpIcon : ChevronsUpDownIcon\n\n return (\n <styled.button\n type=\"button\"\n layerStyle=\"ghost\"\n colorScheme=\"mono\"\n aria-label={t(\n sorted\n ? sorted === \"desc\"\n ? \"Sort descending\"\n : \"Sort ascending\"\n : \"Clear sorting\",\n )}\n data-focusable\n aspectRatio=\"1\"\n cursor=\"pointer\"\n display=\"center\"\n focusVisibleRing=\"none\"\n h=\"calc(1em * {lineHeights.moderate})\"\n position=\"absolute\"\n right=\"{space-x}\"\n rounded=\"l1\"\n tabIndex={-1}\n top=\"50%\"\n transform=\"translateY(-50%)\"\n transitionDuration=\"moderate\"\n transitionProperty=\"common\"\n _hover={{ layerStyle: \"ghost.hover\" }}\n {...mergeProps(rest, sortingIconProps)()}\n >\n {runIfFn(sortingIcon, sorted) ?? (\n <Icon transform={`rotate(${sorted === \"desc\" ? 180 : 0}deg)`} />\n )}\n </styled.button>\n )\n}\n\ninterface ResizableTriggerProps extends HTMLStyledProps {\n resizing: boolean\n}\n\nconst ResizableTrigger: FC<ResizableTriggerProps> = ({ resizing, ...rest }) => {\n const {\n columnResizeMode,\n table,\n resizableTriggerProps = {},\n } = useComponentContext()\n const offset = table.getState().columnSizingInfo.deltaOffset\n\n return (\n <styled.div\n data-active={dataAttr(resizing)}\n bg=\"colorScheme.solid\"\n cursor=\"col-resize\"\n insetY=\"0\"\n opacity={{ base: \"0\", _hover: \"1\", _active: \"1\" }}\n position=\"absolute\"\n right=\"0\"\n touchAction=\"none\"\n transform={`translateX(${columnResizeMode === \"onEnd\" && resizing && offset ? `${offset}px` : \"50%\"})`}\n userSelect=\"none\"\n w=\"1\"\n {...mergeProps(rest, resizableTriggerProps)()}\n />\n )\n}\n\ninterface TruncatedTextProps extends HTMLStyledProps<\"span\"> {}\n\nconst TruncatedText: FC<TruncatedTextProps> = ({\n children,\n lineClamp,\n truncated,\n ...rest\n}) => {\n if (lineClamp || truncated)\n return (\n <styled.span\n lineClamp={lineClamp}\n truncated={truncated}\n wordBreak=\"break-all\"\n {...rest}\n >\n {children}\n </styled.span>\n )\n else return children\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","names":[],"sources":["../../../../src/components/tabs/tabs.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { UseLazyMountProps } from \"../../hooks/use-lazy-mount\"\nimport type { TabsStyle } from \"./tabs.style\"\nimport type { UseTabPanelProps, UseTabProps, UseTabsProps } from \"./use-tabs\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useLazyMount } from \"../../hooks/use-lazy-mount\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { isNull, isUndefined } from \"../../utils\"\nimport { tabsStyle } from \"./tabs.style\"\nimport {\n TabDescendantsContext,\n TabPanelDescendantsContext,\n TabsContext,\n useTab,\n useTabPanel,\n useTabs,\n useTabsContext,\n} from \"./use-tabs\"\n\ninterface ComponentContext extends Pick<\n TabsRootProps,\n \"items\" | \"lazy\" | \"lazyBehavior\"\n> {}\n\nexport interface TabsItem extends Omit<TabsTabProps, \"index\"> {\n /**\n * The content for panel element.\n */\n panel: ReactNode\n /**\n * The content for tab element.\n */\n tab: ReactNode\n /**\n * Props for panel element.\n */\n panelProps?: TabsPanelProps\n}\n\nexport interface TabsRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n Omit<UseTabsProps, \"orientation\">,\n Pick<UseLazyMountProps, \"lazy\" | \"lazyBehavior\">,\n ThemeProps<TabsStyle> {\n /**\n * If provided, generate tab and panel components based on tabs.\n */\n items?: TabsItem[]\n}\n\nconst {\n ComponentContext,\n PropsContext: TabsPropsContext,\n useComponentContext,\n usePropsContext: useTabsPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<TabsRootProps, TabsStyle, ComponentContext>(\n \"tabs\",\n tabsStyle,\n)\n\nexport { TabsPropsContext, useTabsPropsContext }\n\n/**\n * `Tabs` is a component for switching between different display areas.\n *\n * @see https://yamada-ui.com/docs/components/tabs\n */\nexport const TabsRoot = withProvider<\"div\", TabsRootProps, \"orientation\">(\n ({\n children,\n items,\n lazy,\n lazyBehavior,\n orientation: orientationProp,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const {\n id,\n focusedIndex,\n index,\n manual,\n orientation,\n setFocusedIndex,\n setIndex,\n tabDescendants,\n tabPanelDescendants,\n getListProps,\n getRootProps,\n } = useTabs({ orientation: computedOrientation, ...rest })\n const componentContext = useMemo(\n () => ({ items, lazy, lazyBehavior }),\n [items, lazy, lazyBehavior],\n )\n const tabsContext = useMemo(\n () => ({\n id,\n focusedIndex,\n index,\n manual,\n orientation,\n setFocusedIndex,\n setIndex,\n getListProps,\n }),\n [\n id,\n manual,\n focusedIndex,\n index,\n orientation,\n setFocusedIndex,\n setIndex,\n getListProps,\n ],\n )\n\n return (\n <TabDescendantsContext value={tabDescendants}>\n <TabPanelDescendantsContext value={tabPanelDescendants}>\n <TabsContext value={tabsContext}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{children}</styled.div>\n </ComponentContext>\n </TabsContext>\n </TabPanelDescendantsContext>\n </TabDescendantsContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)()\n\nexport interface TabsListProps extends HTMLStyledProps {}\n\nexport const TabsList = withContext<\"div\", TabsListProps>(\n ({ children, ...rest }) => {\n const { items } = useComponentContext()\n const { getListProps } = useTabsContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n else\n return items?.map(\n (\n { id, panel: _panel, tab, panelProps: _panelProps, ...rest },\n index,\n ) =>\n isUndefined(tab) || isNull(tab) ? null : (\n <TabsTab id={id} key={id ?? index} index={index} {...rest}>\n {tab}\n </TabsTab>\n ),\n )\n }, [children, items])\n\n return <styled.div {...getListProps(rest)}>{computedChildren}</styled.div>\n },\n \"list\",\n)()\n\nexport interface TabsTabProps extends HTMLStyledProps<\"button\">, UseTabProps {}\n\nexport const TabsTab = withContext<\"button\", TabsTabProps>(\"button\", \"tab\")(\n undefined,\n (props) => {\n const { getRootProps } = useTab(props)\n\n return getRootProps()\n },\n)\n\nexport interface TabsPanelsProps extends PropsWithChildren {}\n\nexport const TabsPanels: FC<TabsPanelsProps> = ({ children }) => {\n const { items } = useComponentContext()\n\n return useMemo(() => {\n if (children) return children\n else\n return items?.map(({ id, panel, panelProps }, index) =>\n isUndefined(panel) || isNull(panel) ? null : (\n <TabsPanel key={id ?? index} index={index} {...panelProps}>\n {panel}\n </TabsPanel>\n ),\n )\n }, [children, items])\n}\n\nexport interface TabsPanelProps extends HTMLStyledProps, UseTabPanelProps {}\n\nexport const TabsPanel = withContext<\"div\", TabsPanelProps>(\"div\", \"panel\")(\n undefined,\n (props) => {\n const { lazy, lazyBehavior } = useComponentContext()\n const { selected: mounted, getRootProps } = useTabPanel(props)\n const children = useLazyMount({ lazy, lazyBehavior, mounted, ...props })\n\n return { ...getRootProps(), children }\n },\n)\n"],"mappings":";;;;;;;;;;;AAuDA,MAAM,EACJ,kBACA,cAAc,kBACd,qBACA,iBAAiB,qBACjB,aACA,iBACE,oBACF,QACA,SACF;;;;;;AASA,MAAa,WAAW,cACrB,EACC,UACA,OACA,MACA,cACA,aAAa,iBACb,GAAG,WACC;CAEJ,MAAM,EACJ,IACA,cACA,OACA,QACA,aACA,iBACA,UACA,gBACA,qBACA,cACA,iBACE,QAAQ;EAAE,aAbc,SAAS,eAaQ;EAAG,GAAG;CAAK,CAAC;CACzD,MAAM,mBAAmB,eAChB;EAAE;EAAO;EAAM;CAAa,IACnC;EAAC;EAAO;EAAM;CAAY,CAC5B;CAwBA,OACE,oBAAC,uBAAD;EAAuB,OAAO;
|
|
1
|
+
{"version":3,"file":"tabs.js","names":[],"sources":["../../../../src/components/tabs/tabs.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { UseLazyMountProps } from \"../../hooks/use-lazy-mount\"\nimport type { TabsStyle } from \"./tabs.style\"\nimport type { UseTabPanelProps, UseTabProps, UseTabsProps } from \"./use-tabs\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useLazyMount } from \"../../hooks/use-lazy-mount\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { isNull, isUndefined } from \"../../utils\"\nimport { tabsStyle } from \"./tabs.style\"\nimport {\n TabDescendantsContext,\n TabPanelDescendantsContext,\n TabsContext,\n useTab,\n useTabPanel,\n useTabs,\n useTabsContext,\n} from \"./use-tabs\"\n\ninterface ComponentContext extends Pick<\n TabsRootProps,\n \"items\" | \"lazy\" | \"lazyBehavior\"\n> {}\n\nexport interface TabsItem extends Omit<TabsTabProps, \"index\"> {\n /**\n * The content for panel element.\n */\n panel: ReactNode\n /**\n * The content for tab element.\n */\n tab: ReactNode\n /**\n * Props for panel element.\n */\n panelProps?: TabsPanelProps\n}\n\nexport interface TabsRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n Omit<UseTabsProps, \"orientation\">,\n Pick<UseLazyMountProps, \"lazy\" | \"lazyBehavior\">,\n ThemeProps<TabsStyle> {\n /**\n * If provided, generate tab and panel components based on tabs.\n */\n items?: TabsItem[]\n}\n\nconst {\n ComponentContext,\n PropsContext: TabsPropsContext,\n useComponentContext,\n usePropsContext: useTabsPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<TabsRootProps, TabsStyle, ComponentContext>(\n \"tabs\",\n tabsStyle,\n)\n\nexport { TabsPropsContext, useTabsPropsContext }\n\n/**\n * `Tabs` is a component for switching between different display areas.\n *\n * @see https://yamada-ui.com/docs/components/tabs\n */\nexport const TabsRoot = withProvider<\"div\", TabsRootProps, \"orientation\">(\n ({\n children,\n items,\n lazy,\n lazyBehavior,\n orientation: orientationProp,\n ...rest\n }) => {\n const computedOrientation = useValue(orientationProp)\n const {\n id,\n focusedIndex,\n index,\n manual,\n orientation,\n setFocusedIndex,\n setIndex,\n tabDescendants,\n tabPanelDescendants,\n getListProps,\n getRootProps,\n } = useTabs({ orientation: computedOrientation, ...rest })\n const componentContext = useMemo(\n () => ({ items, lazy, lazyBehavior }),\n [items, lazy, lazyBehavior],\n )\n const tabsContext = useMemo(\n () => ({\n id,\n focusedIndex,\n index,\n manual,\n orientation,\n setFocusedIndex,\n setIndex,\n getListProps,\n }),\n [\n id,\n manual,\n focusedIndex,\n index,\n orientation,\n setFocusedIndex,\n setIndex,\n getListProps,\n ],\n )\n\n return (\n <TabDescendantsContext value={tabDescendants}>\n <TabPanelDescendantsContext value={tabPanelDescendants}>\n <TabsContext value={tabsContext}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{children}</styled.div>\n </ComponentContext>\n </TabsContext>\n </TabPanelDescendantsContext>\n </TabDescendantsContext>\n )\n },\n \"root\",\n { transferProps: [\"orientation\"] },\n)()\n\nexport interface TabsListProps extends HTMLStyledProps {}\n\nexport const TabsList = withContext<\"div\", TabsListProps>(\n ({ children, ...rest }) => {\n const { items } = useComponentContext()\n const { getListProps } = useTabsContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n else\n return items?.map(\n (\n { id, panel: _panel, tab, panelProps: _panelProps, ...rest },\n index,\n ) =>\n isUndefined(tab) || isNull(tab) ? null : (\n <TabsTab id={id} key={id ?? index} index={index} {...rest}>\n {tab}\n </TabsTab>\n ),\n )\n }, [children, items])\n\n return <styled.div {...getListProps(rest)}>{computedChildren}</styled.div>\n },\n \"list\",\n)()\n\nexport interface TabsTabProps extends HTMLStyledProps<\"button\">, UseTabProps {}\n\nexport const TabsTab = withContext<\"button\", TabsTabProps>(\"button\", \"tab\")(\n undefined,\n (props) => {\n const { getRootProps } = useTab(props)\n\n return getRootProps()\n },\n)\n\nexport interface TabsPanelsProps extends PropsWithChildren {}\n\nexport const TabsPanels: FC<TabsPanelsProps> = ({ children }) => {\n const { items } = useComponentContext()\n\n return useMemo(() => {\n if (children) return children\n else\n return items?.map(({ id, panel, panelProps }, index) =>\n isUndefined(panel) || isNull(panel) ? null : (\n <TabsPanel key={id ?? index} index={index} {...panelProps}>\n {panel}\n </TabsPanel>\n ),\n )\n }, [children, items])\n}\n\nexport interface TabsPanelProps extends HTMLStyledProps, UseTabPanelProps {}\n\nexport const TabsPanel = withContext<\"div\", TabsPanelProps>(\"div\", \"panel\")(\n undefined,\n (props) => {\n const { lazy, lazyBehavior } = useComponentContext()\n const { selected: mounted, getRootProps } = useTabPanel(props)\n const children = useLazyMount({ lazy, lazyBehavior, mounted, ...props })\n\n return { ...getRootProps(), children }\n },\n)\n"],"mappings":";;;;;;;;;;;AAuDA,MAAM,EACJ,kBACA,cAAc,kBACd,qBACA,iBAAiB,qBACjB,aACA,iBACE,oBACF,QACA,SACF;;;;;;AASA,MAAa,WAAW,cACrB,EACC,UACA,OACA,MACA,cACA,aAAa,iBACb,GAAG,WACC;CAEJ,MAAM,EACJ,IACA,cACA,OACA,QACA,aACA,iBACA,UACA,gBACA,qBACA,cACA,iBACE,QAAQ;EAAE,aAbc,SAAS,eAaQ;EAAG,GAAG;CAAK,CAAC;CACzD,MAAM,mBAAmB,eAChB;EAAE;EAAO;EAAM;CAAa,IACnC;EAAC;EAAO;EAAM;CAAY,CAC5B;CAwBA,OACE,oBAAC,uBAAD;EAAuB,OAAO;EAC5B,UAAA,oBAAC,4BAAD;GAA4B,OAAO;GACjC,UAAA,oBAAC,aAAD;IAAa,OA1BC,eACX;KACL;KACA;KACA;KACA;KACA;KACA;KACA;KACA;IACF,IACA;KACE;KACA;KACA;KACA;KACA;KACA;KACA;KACA;IACF,CAMkC;IAC5B,UAAA,oBAAC,kBAAD;KAAkB,OAAO;KACvB,UAAA,oBAAC,OAAO,KAAR;MAAY,GAAI,aAAa;MAAI;KAAqB,CAAA;IACtC,CAAA;GACP,CAAA;EACa,CAAA;CACP,CAAA;AAE3B,GACA,QACA,EAAE,eAAe,CAAC,aAAa,EAAE,CACnC,CAAC,CAAC;AAIF,MAAa,WAAW,aACrB,EAAE,UAAU,GAAG,WAAW;CACzB,MAAM,EAAE,UAAU,oBAAoB;CACtC,MAAM,EAAE,iBAAiB,eAAe;CACxC,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;OAEnB,OAAO,OAAO,KAEV,EAAE,IAAI,OAAO,QAAQ,KAAK,YAAY,aAAa,GAAG,QACtD,WAAA,GAAA,cAAA,YAAA,CAEY,GAAG,MAAA,GAAA,cAAA,OAAA,CAAY,GAAG,IAAI,OAChC,oBAAC,SAAD;GAAa;GAA6B;GAAO,GAAI;GAClD,UAAA;EACM,GAFa,MAAM,KAEnB,CAEf;CACJ,GAAG,CAAC,UAAU,KAAK,CAAC;CAEpB,OAAO,oBAAC,OAAO,KAAR;EAAY,GAAI,aAAa,IAAI;EAAI,UAAA;CAA6B,CAAA;AAC3E,GACA,MACF,CAAC,CAAC;AAIF,MAAa,UAAU,YAAoC,UAAU,KAAK,CAAC,CACzE,KAAA,IACC,UAAU;CACT,MAAM,EAAE,iBAAiB,OAAO,KAAK;CAErC,OAAO,aAAa;AACtB,CACF;AAIA,MAAa,cAAmC,EAAE,eAAe;CAC/D,MAAM,EAAE,UAAU,oBAAoB;CAEtC,OAAO,cAAc;EACnB,IAAI,UAAU,OAAO;OAEnB,OAAO,OAAO,KAAK,EAAE,IAAI,OAAO,cAAc,WAAA,GAAA,cAAA,YAAA,CAChC,KAAK,MAAA,GAAA,cAAA,OAAA,CAAY,KAAK,IAAI,OACpC,oBAAC,WAAD;GAAoC;GAAO,GAAI;GAC5C,UAAA;EACQ,GAFK,MAAM,KAEX,CAEf;CACJ,GAAG,CAAC,UAAU,KAAK,CAAC;AACtB;AAIA,MAAa,YAAY,YAAmC,OAAO,OAAO,CAAC,CACzE,KAAA,IACC,UAAU;CACT,MAAM,EAAE,MAAM,iBAAiB,oBAAoB;CACnD,MAAM,EAAE,UAAU,SAAS,iBAAiB,YAAY,KAAK;CAC7D,MAAM,WAAW,aAAa;EAAE;EAAM;EAAc;EAAS,GAAG;CAAM,CAAC;CAEvE,OAAO;EAAE,GAAG,aAAa;EAAG;CAAS;AACvC,CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tag.js","names":[],"sources":["../../../../src/components/tag/tag.tsx"],"sourcesContent":["\"use client\"\n\nimport type { MouseEventHandler, ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { TagStyle } from \"./tag.style\"\nimport { useMemo, useRef } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useClickable } from \"../../hooks/use-clickable\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { dataAttr } from \"../../utils\"\nimport { XIcon } from \"../icon\"\nimport { tagStyle } from \"./tag.style\"\n\ninterface ComponentContext extends Pick<TagProps, \"disabled\"> {}\n\nexport interface TagProps\n extends HTMLStyledProps<\"span\">, ThemeProps<TagStyle> {\n /**\n * If `true`, the tag is disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * Icon to be displayed to the end of the tag.\n */\n endIcon?: ReactNode\n /**\n * Icon to be displayed to the start of the tag.\n */\n startIcon?: ReactNode\n /**\n * Props for tag close button element.\n */\n closeButtonProps?: TagCloseButtonProps\n /**\n * Props for content element.\n */\n contentProps?: TagContentProps\n /**\n * Props for icon element.\n */\n iconProps?: HTMLStyledProps<\"span\">\n /**\n * Function to be executed when the close button is clicked.\n */\n onClose?: MouseEventHandler<HTMLElement>\n}\n\nconst {\n ComponentContext,\n PropsContext: TagPropsContext,\n useComponentContext,\n usePropsContext: useTagPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<TagProps, TagStyle, ComponentContext>(\"tag\", tagStyle)\n\nexport { TagPropsContext, useTagPropsContext }\n\n/**\n * `Tag` is a component used to categorize or organize items using keywords that describe them.\n *\n * @see https://yamada-ui.com/docs/components/tag\n */\nexport const Tag = withProvider<\"span\", TagProps, \"disabled\">(\n ({\n children,\n disabled,\n endIcon,\n startIcon,\n closeButtonProps,\n contentProps,\n iconProps,\n onClose,\n ...rest\n }) => {\n const context = useMemo(() => ({ disabled }), [disabled])\n\n return (\n <ComponentContext value={context}>\n <styled.span data-disabled={dataAttr(disabled)} {...rest}>\n {startIcon ? (\n <TagStartIcon {...iconProps}>{startIcon}</TagStartIcon>\n ) : null}\n\n {children ? (\n <TagContent {...contentProps}>{children}</TagContent>\n ) : null}\n\n {endIcon ? <TagEndIcon {...iconProps}>{endIcon}</TagEndIcon> : null}\n\n {onClose ? (\n <TagCloseButton onClick={onClose} {...closeButtonProps} />\n ) : null}\n </styled.span>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"disabled\"] },\n)()\n\ninterface TagContentProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagContent = withContext<\"span\", TagContentProps>(\"span\", \"content\")(\n undefined,\n (props) => {\n const { disabled } = useComponentContext()\n\n return { \"data-disabled\": dataAttr(disabled), ...props }\n },\n)\n\ninterface TagStartIconProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagStartIcon = withContext<\"span\", TagStartIconProps>(\"span\", [\n \"icon\",\n \"start\",\n])(undefined, (props) => {\n const { disabled } = useComponentContext()\n\n return { \"data-disabled\": dataAttr(disabled), ...props }\n})\n\ninterface TagEndIconProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagEndIcon = withContext<\"span\", TagEndIconProps>(\"span\", [\n \"icon\",\n \"end\",\n])(undefined, (props) => {\n const { disabled } = useComponentContext()\n\n return { \"data-disabled\": dataAttr(disabled), ...props }\n})\n\ninterface TagCloseButtonProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagCloseButton = withContext<\"span\", TagCloseButtonProps>(\"span\", [\n \"icon\",\n \"closeButton\",\n])(undefined, ({ children, ...props }) => {\n const ref = useRef<HTMLSpanElement>(null)\n const { disabled } = useComponentContext()\n const rest = useClickable<HTMLSpanElement>({ ref, disabled, ...props })\n const { t } = useI18n(\"tag\")\n\n return {\n \"aria-label\": t(\"Close tag\"),\n \"data-disabled\": dataAttr(disabled),\n children: children || <XIcon />,\n ...rest,\n }\n})\n"],"mappings":";;;;;;;;;;;AAiDA,MAAM,EACJ,kBACA,cAAc,iBACd,qBACA,iBAAiB,oBACjB,aACA,iBACE,oBAA0D,OAAO,QAAQ;;;;;;AAS7E,MAAa,MAAM,cAChB,EACC,UACA,UACA,SACA,WACA,kBACA,cACA,WACA,SACA,GAAG,WACC;CACJ,MAAM,UAAU,eAAe,EAAE,SAAS,IAAI,CAAC,QAAQ,CAAC;CAExD,OACE,oBAAC,kBAAD;EAAkB,OAAO;
|
|
1
|
+
{"version":3,"file":"tag.js","names":[],"sources":["../../../../src/components/tag/tag.tsx"],"sourcesContent":["\"use client\"\n\nimport type { MouseEventHandler, ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { TagStyle } from \"./tag.style\"\nimport { useMemo, useRef } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useClickable } from \"../../hooks/use-clickable\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { dataAttr } from \"../../utils\"\nimport { XIcon } from \"../icon\"\nimport { tagStyle } from \"./tag.style\"\n\ninterface ComponentContext extends Pick<TagProps, \"disabled\"> {}\n\nexport interface TagProps\n extends HTMLStyledProps<\"span\">, ThemeProps<TagStyle> {\n /**\n * If `true`, the tag is disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * Icon to be displayed to the end of the tag.\n */\n endIcon?: ReactNode\n /**\n * Icon to be displayed to the start of the tag.\n */\n startIcon?: ReactNode\n /**\n * Props for tag close button element.\n */\n closeButtonProps?: TagCloseButtonProps\n /**\n * Props for content element.\n */\n contentProps?: TagContentProps\n /**\n * Props for icon element.\n */\n iconProps?: HTMLStyledProps<\"span\">\n /**\n * Function to be executed when the close button is clicked.\n */\n onClose?: MouseEventHandler<HTMLElement>\n}\n\nconst {\n ComponentContext,\n PropsContext: TagPropsContext,\n useComponentContext,\n usePropsContext: useTagPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<TagProps, TagStyle, ComponentContext>(\"tag\", tagStyle)\n\nexport { TagPropsContext, useTagPropsContext }\n\n/**\n * `Tag` is a component used to categorize or organize items using keywords that describe them.\n *\n * @see https://yamada-ui.com/docs/components/tag\n */\nexport const Tag = withProvider<\"span\", TagProps, \"disabled\">(\n ({\n children,\n disabled,\n endIcon,\n startIcon,\n closeButtonProps,\n contentProps,\n iconProps,\n onClose,\n ...rest\n }) => {\n const context = useMemo(() => ({ disabled }), [disabled])\n\n return (\n <ComponentContext value={context}>\n <styled.span data-disabled={dataAttr(disabled)} {...rest}>\n {startIcon ? (\n <TagStartIcon {...iconProps}>{startIcon}</TagStartIcon>\n ) : null}\n\n {children ? (\n <TagContent {...contentProps}>{children}</TagContent>\n ) : null}\n\n {endIcon ? <TagEndIcon {...iconProps}>{endIcon}</TagEndIcon> : null}\n\n {onClose ? (\n <TagCloseButton onClick={onClose} {...closeButtonProps} />\n ) : null}\n </styled.span>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"disabled\"] },\n)()\n\ninterface TagContentProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagContent = withContext<\"span\", TagContentProps>(\"span\", \"content\")(\n undefined,\n (props) => {\n const { disabled } = useComponentContext()\n\n return { \"data-disabled\": dataAttr(disabled), ...props }\n },\n)\n\ninterface TagStartIconProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagStartIcon = withContext<\"span\", TagStartIconProps>(\"span\", [\n \"icon\",\n \"start\",\n])(undefined, (props) => {\n const { disabled } = useComponentContext()\n\n return { \"data-disabled\": dataAttr(disabled), ...props }\n})\n\ninterface TagEndIconProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagEndIcon = withContext<\"span\", TagEndIconProps>(\"span\", [\n \"icon\",\n \"end\",\n])(undefined, (props) => {\n const { disabled } = useComponentContext()\n\n return { \"data-disabled\": dataAttr(disabled), ...props }\n})\n\ninterface TagCloseButtonProps extends HTMLStyledProps<\"span\"> {}\n\nconst TagCloseButton = withContext<\"span\", TagCloseButtonProps>(\"span\", [\n \"icon\",\n \"closeButton\",\n])(undefined, ({ children, ...props }) => {\n const ref = useRef<HTMLSpanElement>(null)\n const { disabled } = useComponentContext()\n const rest = useClickable<HTMLSpanElement>({ ref, disabled, ...props })\n const { t } = useI18n(\"tag\")\n\n return {\n \"aria-label\": t(\"Close tag\"),\n \"data-disabled\": dataAttr(disabled),\n children: children || <XIcon />,\n ...rest,\n }\n})\n"],"mappings":";;;;;;;;;;;AAiDA,MAAM,EACJ,kBACA,cAAc,iBACd,qBACA,iBAAiB,oBACjB,aACA,iBACE,oBAA0D,OAAO,QAAQ;;;;;;AAS7E,MAAa,MAAM,cAChB,EACC,UACA,UACA,SACA,WACA,kBACA,cACA,WACA,SACA,GAAG,WACC;CACJ,MAAM,UAAU,eAAe,EAAE,SAAS,IAAI,CAAC,QAAQ,CAAC;CAExD,OACE,oBAAC,kBAAD;EAAkB,OAAO;EACvB,UAAA,qBAAC,OAAO,MAAR;GAAa,kBAAA,GAAA,cAAA,SAAA,CAAwB,QAAQ;GAAG,GAAI;GAApD,UAAA;IACG,YACC,oBAAC,cAAD;KAAc,GAAI;KAAY,UAAA;IAAwB,CAAA,IACpD;IAEH,WACC,oBAAC,YAAD;KAAY,GAAI;KAAe;IAAqB,CAAA,IAClD;IAEH,UAAU,oBAAC,YAAD;KAAY,GAAI;KAAY,UAAA;IAAoB,CAAA,IAAI;IAE9D,UACC,oBAAC,gBAAD;KAAgB,SAAS;KAAS,GAAI;IAAmB,CAAA,IACvD;GACO;;CACG,CAAA;AAEtB,GACA,QACA,EAAE,eAAe,CAAC,UAAU,EAAE,CAChC,CAAC,CAAC;AAIF,MAAM,aAAa,YAAqC,QAAQ,SAAS,CAAC,CACxE,KAAA,IACC,UAAU;CACT,MAAM,EAAE,aAAa,oBAAoB;CAEzC,OAAO;EAAE,kBAAA,GAAA,cAAA,SAAA,CAA0B,QAAQ;EAAG,GAAG;CAAM;AACzD,CACF;AAIA,MAAM,eAAe,YAAuC,QAAQ,CAClE,QACA,OACF,CAAC,CAAC,CAAC,KAAA,IAAY,UAAU;CACvB,MAAM,EAAE,aAAa,oBAAoB;CAEzC,OAAO;EAAE,kBAAA,GAAA,cAAA,SAAA,CAA0B,QAAQ;EAAG,GAAG;CAAM;AACzD,CAAC;AAID,MAAM,aAAa,YAAqC,QAAQ,CAC9D,QACA,KACF,CAAC,CAAC,CAAC,KAAA,IAAY,UAAU;CACvB,MAAM,EAAE,aAAa,oBAAoB;CAEzC,OAAO;EAAE,kBAAA,GAAA,cAAA,SAAA,CAA0B,QAAQ;EAAG,GAAG;CAAM;AACzD,CAAC;AAID,MAAM,iBAAiB,YAAyC,QAAQ,CACtE,QACA,aACF,CAAC,CAAC,CAAC,KAAA,IAAY,EAAE,UAAU,GAAG,YAAY;CACxC,MAAM,MAAM,OAAwB,IAAI;CACxC,MAAM,EAAE,aAAa,oBAAoB;CACzC,MAAM,OAAO,aAA8B;EAAE;EAAK;EAAU,GAAG;CAAM,CAAC;CACtE,MAAM,EAAE,MAAM,QAAQ,KAAK;CAE3B,OAAO;EACL,cAAc,EAAE,WAAW;EAC3B,kBAAA,GAAA,cAAA,SAAA,CAA0B,QAAQ;EAClC,UAAU,YAAY,oBAAC,OAAD,CAAQ,CAAA;EAC9B,GAAG;CACL;AACF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"timeline.js","names":[],"sources":["../../../../src/components/timeline/timeline.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { TimelineStyle } from \"./timeline.style\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled, varAttr } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { dataAttr, isUndefined } from \"../../utils\"\nimport { timelineStyle } from \"./timeline.style\"\n\nexport interface TimelineItem extends Omit<\n TimelineItemProps,\n \"content\" | \"title\"\n> {\n align?: \"end\" | \"start\"\n content?: ReactNode\n description?: ReactNode\n indicator?: ReactNode\n title?: ReactNode\n connectorProps?: TimelineConnectorProps\n contentProps?: TimelineContentProps\n descriptionProps?: TimelineDescriptionProps\n indicatorProps?: TimelineIndicatorProps\n titleProps?: TimelineTitleProps\n}\n\ninterface ComponentContext extends Pick<TimelineRootProps, \"index\"> {}\n\nexport interface TimelineRootProps\n extends HTMLStyledProps<\"ul\">, ThemeProps<TimelineStyle> {\n /**\n * The index of the active timeline item.\n */\n index?: number\n /**\n * The fill color of the indicator.\n */\n indicatorFill?: CSSProps[\"bg\"]\n /**\n * The size of the indicator.\n */\n indicatorSize?: CSSProps[\"boxSize\"]\n /**\n * The stroke color of the indicator.\n */\n indicatorStroke?: CSSProps[\"color\"]\n /**\n * If provided, generate timeline components based on items.\n */\n items?: TimelineItem[]\n /**\n * The color of the separator.\n */\n separatorColor?: CSSProps[\"color\"]\n /**\n * The gap of the separator.\n */\n separatorGap?: CSSProps[\"gap\"]\n /**\n * The style of the separator.\n */\n separatorStyle?: CSSProps[\"borderStyle\"]\n /**\n * The width of the separator.\n */\n separatorWidth?: CSSProps[\"width\"]\n}\n\nconst {\n ComponentContext,\n PropsContext: TimelinePropsContext,\n useComponentContext,\n usePropsContext: useTimelinePropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<TimelineRootProps, TimelineStyle, ComponentContext>(\n \"timeline\",\n timelineStyle,\n)\n\nexport { TimelinePropsContext, useTimelinePropsContext }\n\n/**\n * `Timeline` is a component that is used to display a list of events in chronological order.\n *\n * @see https://yamada-ui.com/docs/components/timeline\n */\nexport const TimelineRoot = withProvider(\n ({ variant: variantProp, children, index = -1, items = [], ...rest }) => {\n const context = useMemo(() => ({ index }), [index])\n const variant = useValue(variantProp)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items.map(\n (\n {\n align = \"start\",\n content,\n description,\n indicator,\n title,\n connectorProps,\n contentProps,\n descriptionProps,\n indicatorProps,\n titleProps,\n ...rest\n },\n index,\n ) => {\n const children = {\n connector: (\n <TimelineConnector {...connectorProps}>\n <TimelineIndicator {...indicatorProps}>\n {indicator ?? (variant === \"number\" ? index + 1 : undefined)}\n </TimelineIndicator>\n </TimelineConnector>\n ),\n content: (\n <TimelineContent {...contentProps}>\n {content ?? (\n <>\n <TimelineTitle {...titleProps}>{title}</TimelineTitle>\n <TimelineDescription {...descriptionProps}>\n {description}\n </TimelineDescription>\n </>\n )}\n </TimelineContent>\n ),\n }\n\n return (\n <TimelineItem key={index} index={index} {...rest}>\n {align === \"start\" ? children.connector : children.content}\n {align === \"start\" ? children.content : children.connector}\n </TimelineItem>\n )\n },\n )\n }, [children, items, variant])\n\n return (\n <ComponentContext value={context}>\n <styled.ul {...rest}>{computedChildren}</styled.ul>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"variant\"] },\n)(\n undefined,\n ({\n indicatorFill,\n indicatorSize,\n indicatorStroke,\n separatorColor,\n separatorGap,\n separatorStyle,\n separatorWidth,\n ...rest\n }) => ({\n \"--indicator-fill\": varAttr(indicatorFill, \"colors\"),\n \"--indicator-size\": varAttr(indicatorSize, \"sizes\"),\n \"--indicator-stroke\": varAttr(indicatorStroke, \"colors\"),\n \"--separator-color\": varAttr(separatorColor, \"colors\"),\n \"--separator-gap\": varAttr(separatorGap, \"spaces\"),\n \"--separator-style\": varAttr(separatorStyle),\n \"--separator-width\": varAttr(separatorWidth, \"sizes\"),\n ...rest,\n }),\n)\n\nexport interface TimelineItemProps extends HTMLStyledProps<\"li\"> {\n /**\n * The index of the timeline item.\n */\n index?: number\n}\n\nexport const TimelineItem = withContext<\"li\", TimelineItemProps>(\"li\", \"item\")(\n undefined,\n ({ index, ...rest }) => {\n const { index: currentIndex } = useComponentContext()\n const active =\n !isUndefined(index) && !isUndefined(currentIndex) && index <= currentIndex\n\n return {\n ...rest,\n \"data-active\": dataAttr(active),\n \"data-index\": index,\n }\n },\n)\n\nexport interface TimelineConnectorProps extends HTMLStyledProps {}\n\nexport const TimelineConnector = withContext<\"div\", TimelineConnectorProps>(\n \"div\",\n \"connector\",\n)({ \"data-connector\": \"\" })\n\nexport interface TimelineIndicatorProps extends HTMLStyledProps {}\n\nconst TimelineIcon = styled(\"div\", {\n base: {\n bg: \"{indicator-fill}\",\n borderColor: \"{indicator-stroke}\",\n borderWidth: \"{separator-width}\",\n boxSize: \"full\",\n rounded: \"{indicator-rounded}\",\n },\n})\n\nexport const TimelineIndicator = withContext<\"div\", TimelineIndicatorProps>(\n \"div\",\n \"indicator\",\n)(undefined, ({ children = <TimelineIcon />, ...rest }) => ({\n children,\n ...rest,\n}))\n\nexport interface TimelineContentProps extends HTMLStyledProps {}\n\nexport const TimelineContent = withContext<\"div\", TimelineContentProps>(\n \"div\",\n \"content\",\n)({ \"data-content\": \"\" })\n\nexport interface TimelineTitleProps extends HTMLStyledProps<\"h3\"> {}\n\nexport const TimelineTitle = withContext<\"h3\", TimelineTitleProps>(\n \"h3\",\n \"title\",\n)()\n\nexport interface TimelineDescriptionProps extends HTMLStyledProps<\"p\"> {}\n\nexport const TimelineDescription = withContext<\"p\", TimelineDescriptionProps>(\n \"p\",\n \"description\",\n)()\n"],"mappings":";;;;;;;;;;AAqEA,MAAM,EACJ,kBACA,cAAc,sBACd,qBACA,iBAAiB,yBACjB,aACA,iBACE,oBACF,YACA,aACF;;;;;;AASA,MAAa,eAAe,cACzB,EAAE,SAAS,aAAa,UAAU,QAAQ,IAAI,QAAQ,CAAC,GAAG,GAAG,WAAW;CACvE,MAAM,UAAU,eAAe,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC;CAClD,MAAM,UAAU,SAAS,WAAW;CACpC,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;EAErB,OAAO,MAAM,KAET,EACE,QAAQ,SACR,SACA,aACA,WACA,OACA,gBACA,cACA,kBACA,gBACA,YACA,GAAG,QAEL,UACG;GACH,MAAM,WAAW;IACf,WACE,oBAAC,mBAAD;KAAmB,GAAI;
|
|
1
|
+
{"version":3,"file":"timeline.js","names":[],"sources":["../../../../src/components/timeline/timeline.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { TimelineStyle } from \"./timeline.style\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled, varAttr } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { dataAttr, isUndefined } from \"../../utils\"\nimport { timelineStyle } from \"./timeline.style\"\n\nexport interface TimelineItem extends Omit<\n TimelineItemProps,\n \"content\" | \"title\"\n> {\n align?: \"end\" | \"start\"\n content?: ReactNode\n description?: ReactNode\n indicator?: ReactNode\n title?: ReactNode\n connectorProps?: TimelineConnectorProps\n contentProps?: TimelineContentProps\n descriptionProps?: TimelineDescriptionProps\n indicatorProps?: TimelineIndicatorProps\n titleProps?: TimelineTitleProps\n}\n\ninterface ComponentContext extends Pick<TimelineRootProps, \"index\"> {}\n\nexport interface TimelineRootProps\n extends HTMLStyledProps<\"ul\">, ThemeProps<TimelineStyle> {\n /**\n * The index of the active timeline item.\n */\n index?: number\n /**\n * The fill color of the indicator.\n */\n indicatorFill?: CSSProps[\"bg\"]\n /**\n * The size of the indicator.\n */\n indicatorSize?: CSSProps[\"boxSize\"]\n /**\n * The stroke color of the indicator.\n */\n indicatorStroke?: CSSProps[\"color\"]\n /**\n * If provided, generate timeline components based on items.\n */\n items?: TimelineItem[]\n /**\n * The color of the separator.\n */\n separatorColor?: CSSProps[\"color\"]\n /**\n * The gap of the separator.\n */\n separatorGap?: CSSProps[\"gap\"]\n /**\n * The style of the separator.\n */\n separatorStyle?: CSSProps[\"borderStyle\"]\n /**\n * The width of the separator.\n */\n separatorWidth?: CSSProps[\"width\"]\n}\n\nconst {\n ComponentContext,\n PropsContext: TimelinePropsContext,\n useComponentContext,\n usePropsContext: useTimelinePropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<TimelineRootProps, TimelineStyle, ComponentContext>(\n \"timeline\",\n timelineStyle,\n)\n\nexport { TimelinePropsContext, useTimelinePropsContext }\n\n/**\n * `Timeline` is a component that is used to display a list of events in chronological order.\n *\n * @see https://yamada-ui.com/docs/components/timeline\n */\nexport const TimelineRoot = withProvider(\n ({ variant: variantProp, children, index = -1, items = [], ...rest }) => {\n const context = useMemo(() => ({ index }), [index])\n const variant = useValue(variantProp)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items.map(\n (\n {\n align = \"start\",\n content,\n description,\n indicator,\n title,\n connectorProps,\n contentProps,\n descriptionProps,\n indicatorProps,\n titleProps,\n ...rest\n },\n index,\n ) => {\n const children = {\n connector: (\n <TimelineConnector {...connectorProps}>\n <TimelineIndicator {...indicatorProps}>\n {indicator ?? (variant === \"number\" ? index + 1 : undefined)}\n </TimelineIndicator>\n </TimelineConnector>\n ),\n content: (\n <TimelineContent {...contentProps}>\n {content ?? (\n <>\n <TimelineTitle {...titleProps}>{title}</TimelineTitle>\n <TimelineDescription {...descriptionProps}>\n {description}\n </TimelineDescription>\n </>\n )}\n </TimelineContent>\n ),\n }\n\n return (\n <TimelineItem key={index} index={index} {...rest}>\n {align === \"start\" ? children.connector : children.content}\n {align === \"start\" ? children.content : children.connector}\n </TimelineItem>\n )\n },\n )\n }, [children, items, variant])\n\n return (\n <ComponentContext value={context}>\n <styled.ul {...rest}>{computedChildren}</styled.ul>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"variant\"] },\n)(\n undefined,\n ({\n indicatorFill,\n indicatorSize,\n indicatorStroke,\n separatorColor,\n separatorGap,\n separatorStyle,\n separatorWidth,\n ...rest\n }) => ({\n \"--indicator-fill\": varAttr(indicatorFill, \"colors\"),\n \"--indicator-size\": varAttr(indicatorSize, \"sizes\"),\n \"--indicator-stroke\": varAttr(indicatorStroke, \"colors\"),\n \"--separator-color\": varAttr(separatorColor, \"colors\"),\n \"--separator-gap\": varAttr(separatorGap, \"spaces\"),\n \"--separator-style\": varAttr(separatorStyle),\n \"--separator-width\": varAttr(separatorWidth, \"sizes\"),\n ...rest,\n }),\n)\n\nexport interface TimelineItemProps extends HTMLStyledProps<\"li\"> {\n /**\n * The index of the timeline item.\n */\n index?: number\n}\n\nexport const TimelineItem = withContext<\"li\", TimelineItemProps>(\"li\", \"item\")(\n undefined,\n ({ index, ...rest }) => {\n const { index: currentIndex } = useComponentContext()\n const active =\n !isUndefined(index) && !isUndefined(currentIndex) && index <= currentIndex\n\n return {\n ...rest,\n \"data-active\": dataAttr(active),\n \"data-index\": index,\n }\n },\n)\n\nexport interface TimelineConnectorProps extends HTMLStyledProps {}\n\nexport const TimelineConnector = withContext<\"div\", TimelineConnectorProps>(\n \"div\",\n \"connector\",\n)({ \"data-connector\": \"\" })\n\nexport interface TimelineIndicatorProps extends HTMLStyledProps {}\n\nconst TimelineIcon = styled(\"div\", {\n base: {\n bg: \"{indicator-fill}\",\n borderColor: \"{indicator-stroke}\",\n borderWidth: \"{separator-width}\",\n boxSize: \"full\",\n rounded: \"{indicator-rounded}\",\n },\n})\n\nexport const TimelineIndicator = withContext<\"div\", TimelineIndicatorProps>(\n \"div\",\n \"indicator\",\n)(undefined, ({ children = <TimelineIcon />, ...rest }) => ({\n children,\n ...rest,\n}))\n\nexport interface TimelineContentProps extends HTMLStyledProps {}\n\nexport const TimelineContent = withContext<\"div\", TimelineContentProps>(\n \"div\",\n \"content\",\n)({ \"data-content\": \"\" })\n\nexport interface TimelineTitleProps extends HTMLStyledProps<\"h3\"> {}\n\nexport const TimelineTitle = withContext<\"h3\", TimelineTitleProps>(\n \"h3\",\n \"title\",\n)()\n\nexport interface TimelineDescriptionProps extends HTMLStyledProps<\"p\"> {}\n\nexport const TimelineDescription = withContext<\"p\", TimelineDescriptionProps>(\n \"p\",\n \"description\",\n)()\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tip.js","names":[],"sources":["../../../../src/components/tip/tip.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC } from \"react\"\nimport type { WithoutThemeProps } from \"../../core\"\nimport type { IconButtonProps } from \"../button\"\nimport type { StatusScheme } from \"../status\"\nimport type { TooltipProps, TooltipStyle } from \"../tooltip\"\nimport { isString } from \"../../utils\"\nimport { IconButton } from \"../button\"\nimport {\n CircleCheckBigIcon,\n CircleQuestionMarkIcon,\n InfoIcon,\n OctagonAlertIcon,\n TriangleAlertIcon,\n} from \"../icon\"\nimport { Tooltip, useTooltipProps } from \"../tooltip\"\n\nexport type TipStatusScheme = \"help\" | StatusScheme\n\nconst icons = {\n error: OctagonAlertIcon,\n help: CircleQuestionMarkIcon,\n info: InfoIcon,\n success: CircleCheckBigIcon,\n warning: TriangleAlertIcon,\n} as const\n\nexport interface TipProps\n extends\n WithoutThemeProps<TooltipProps, TooltipStyle>,\n Omit<IconButtonProps, \"content\" | \"offset\" | \"transform\"> {\n /**\n * The status of the tip.\n *\n * @default 'help'\n */\n status?: TipStatusScheme\n}\n\n/**\n * `Tip` is a component that displays supplementary information with a built-in icon trigger.\n *\n * @see https://yamada-ui.com/docs/components/tip\n */\nexport const Tip: FC<TipProps> = (props) => {\n const [\n tooltipProps,\n {\n animationScheme,\n content,\n duration,\n status = \"help\",\n contentProps,\n portalProps,\n ...rest\n },\n ] = useTooltipProps(props)\n const Icon = icons[status]\n\n return (\n <Tooltip\n animationScheme={animationScheme}\n content={content}\n duration={duration}\n contentProps={contentProps}\n portalProps={portalProps}\n {...tooltipProps}\n >\n <IconButton\n size=\"2xs\"\n variant=\"ghost\"\n aria-label={isString(content) ? content : undefined}\n icon={<Icon />}\n {...rest}\n />\n </Tooltip>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,QAAQ;CACZ,OAAO;CACP,MAAM;CACN,MAAM;CACN,SAAS;CACT,SAAS;AACX;;;;;;AAmBA,MAAa,OAAqB,UAAU;CAC1C,MAAM,CACJ,cACA,EACE,iBACA,SACA,UACA,SAAS,QACT,cACA,aACA,GAAG,UAEH,gBAAgB,KAAK;CACzB,MAAM,OAAO,MAAM;CAEnB,OACE,oBAAC,SAAD;EACmB;EACR;EACC;EACI;EACD;EACb,GAAI;
|
|
1
|
+
{"version":3,"file":"tip.js","names":[],"sources":["../../../../src/components/tip/tip.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC } from \"react\"\nimport type { WithoutThemeProps } from \"../../core\"\nimport type { IconButtonProps } from \"../button\"\nimport type { StatusScheme } from \"../status\"\nimport type { TooltipProps, TooltipStyle } from \"../tooltip\"\nimport { isString } from \"../../utils\"\nimport { IconButton } from \"../button\"\nimport {\n CircleCheckBigIcon,\n CircleQuestionMarkIcon,\n InfoIcon,\n OctagonAlertIcon,\n TriangleAlertIcon,\n} from \"../icon\"\nimport { Tooltip, useTooltipProps } from \"../tooltip\"\n\nexport type TipStatusScheme = \"help\" | StatusScheme\n\nconst icons = {\n error: OctagonAlertIcon,\n help: CircleQuestionMarkIcon,\n info: InfoIcon,\n success: CircleCheckBigIcon,\n warning: TriangleAlertIcon,\n} as const\n\nexport interface TipProps\n extends\n WithoutThemeProps<TooltipProps, TooltipStyle>,\n Omit<IconButtonProps, \"content\" | \"offset\" | \"transform\"> {\n /**\n * The status of the tip.\n *\n * @default 'help'\n */\n status?: TipStatusScheme\n}\n\n/**\n * `Tip` is a component that displays supplementary information with a built-in icon trigger.\n *\n * @see https://yamada-ui.com/docs/components/tip\n */\nexport const Tip: FC<TipProps> = (props) => {\n const [\n tooltipProps,\n {\n animationScheme,\n content,\n duration,\n status = \"help\",\n contentProps,\n portalProps,\n ...rest\n },\n ] = useTooltipProps(props)\n const Icon = icons[status]\n\n return (\n <Tooltip\n animationScheme={animationScheme}\n content={content}\n duration={duration}\n contentProps={contentProps}\n portalProps={portalProps}\n {...tooltipProps}\n >\n <IconButton\n size=\"2xs\"\n variant=\"ghost\"\n aria-label={isString(content) ? content : undefined}\n icon={<Icon />}\n {...rest}\n />\n </Tooltip>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,QAAQ;CACZ,OAAO;CACP,MAAM;CACN,MAAM;CACN,SAAS;CACT,SAAS;AACX;;;;;;AAmBA,MAAa,OAAqB,UAAU;CAC1C,MAAM,CACJ,cACA,EACE,iBACA,SACA,UACA,SAAS,QACT,cACA,aACA,GAAG,UAEH,gBAAgB,KAAK;CACzB,MAAM,OAAO,MAAM;CAEnB,OACE,oBAAC,SAAD;EACmB;EACR;EACC;EACI;EACD;EACb,GAAI;EAEJ,UAAA,oBAAC,YAAD;GACE,MAAK;GACL,SAAQ;GACR,eAAA,GAAA,cAAA,SAAA,CAAqB,OAAO,IAAI,UAAU,KAAA;GAC1C,MAAM,oBAAC,MAAD,CAAO,CAAA;GACb,GAAI;EACL,CAAA;CACM,CAAA;AAEb"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toggle-group.js","names":[],"sources":["../../../../src/components/toggle/toggle-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type {\n GenericsComponent,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { GroupProps } from \"../group\"\nimport type { ToggleProps } from \"./toggle\"\nimport type { ToggleStyle } from \"./toggle.style\"\nimport type { UseToggleGroupProps } from \"./use-toggle-group\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport { component, TogglePropsContext, useRootComponentProps } from \"./toggle\"\nimport { ToggleGroupContext, useToggleGroup } from \"./use-toggle-group\"\n\n/**\n * `ToggleGroup` is a set of two-state buttons that can be toggled on or off.\n *\n * @see https://yamada-ui.com/docs/components/toggle\n */\nexport interface ToggleGroupRootProps<Y extends string | string[] = string>\n extends\n Omit<\n WithoutThemeProps<GroupProps, ToggleStyle>,\n \"defaultValue\" | \"onChange\" | \"value\"\n >,\n UseToggleGroupProps<Y>,\n ThemeProps<ToggleStyle> {}\n\nexport const ToggleGroupRoot = component<\"div\", ToggleGroupRootProps>(\n (props: ToggleGroupRootProps) => {\n const [, { colorScheme, size, variant, attached, ...rest }] =\n useRootComponentProps(props, \"group\", {\n transferProps: [\"size\", \"variant\", \"colorScheme\"],\n })\n const {\n disabled,\n readOnly,\n value,\n getGroupProps,\n onChange,\n onChangeMapRef,\n } = useToggleGroup(rest)\n const context = useMemo<ToggleProps>(\n () => ({\n colorScheme,\n size,\n variant,\n focusVisibleRing: attached ? \"inside\" : undefined,\n }),\n [variant, size, colorScheme, attached],\n )\n const groupContext = useMemo(\n () => ({\n disabled,\n readOnly,\n value,\n onChange,\n onChangeMapRef,\n }),\n [value, disabled, readOnly, onChange, onChangeMapRef],\n )\n\n return (\n <TogglePropsContext value={context}>\n <ToggleGroupContext value={groupContext}>\n <Group attached={attached} {...getGroupProps()} />\n </ToggleGroupContext>\n </TogglePropsContext>\n )\n },\n \"group\",\n)() as GenericsComponent<{\n <Y extends string | string[] = string>(\n props: ToggleGroupRootProps<Y>,\n ): ReactElement\n}>\n"],"mappings":";;;;;;;AA+BA,MAAa,kBAAkB,WAC5B,UAAgC;CAC/B,MAAM,GAAG,EAAE,aAAa,MAAM,SAAS,UAAU,GAAG,UAClD,sBAAsB,OAAO,SAAS,EACpC,eAAe;EAAC;EAAQ;EAAW;CAAa,EAClD,CAAC;CACH,MAAM,EACJ,UACA,UACA,OACA,eACA,UACA,mBACE,eAAe,IAAI;CAqBvB,OACE,oBAAC,oBAAD;EAAoB,OArBN,eACP;GACL;GACA;GACA;GACA,kBAAkB,WAAW,WAAW,KAAA;EAC1C,IACA;GAAC;GAAS;GAAM;GAAa;EAAQ,CAcJ;
|
|
1
|
+
{"version":3,"file":"toggle-group.js","names":[],"sources":["../../../../src/components/toggle/toggle-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type {\n GenericsComponent,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { GroupProps } from \"../group\"\nimport type { ToggleProps } from \"./toggle\"\nimport type { ToggleStyle } from \"./toggle.style\"\nimport type { UseToggleGroupProps } from \"./use-toggle-group\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport { component, TogglePropsContext, useRootComponentProps } from \"./toggle\"\nimport { ToggleGroupContext, useToggleGroup } from \"./use-toggle-group\"\n\n/**\n * `ToggleGroup` is a set of two-state buttons that can be toggled on or off.\n *\n * @see https://yamada-ui.com/docs/components/toggle\n */\nexport interface ToggleGroupRootProps<Y extends string | string[] = string>\n extends\n Omit<\n WithoutThemeProps<GroupProps, ToggleStyle>,\n \"defaultValue\" | \"onChange\" | \"value\"\n >,\n UseToggleGroupProps<Y>,\n ThemeProps<ToggleStyle> {}\n\nexport const ToggleGroupRoot = component<\"div\", ToggleGroupRootProps>(\n (props: ToggleGroupRootProps) => {\n const [, { colorScheme, size, variant, attached, ...rest }] =\n useRootComponentProps(props, \"group\", {\n transferProps: [\"size\", \"variant\", \"colorScheme\"],\n })\n const {\n disabled,\n readOnly,\n value,\n getGroupProps,\n onChange,\n onChangeMapRef,\n } = useToggleGroup(rest)\n const context = useMemo<ToggleProps>(\n () => ({\n colorScheme,\n size,\n variant,\n focusVisibleRing: attached ? \"inside\" : undefined,\n }),\n [variant, size, colorScheme, attached],\n )\n const groupContext = useMemo(\n () => ({\n disabled,\n readOnly,\n value,\n onChange,\n onChangeMapRef,\n }),\n [value, disabled, readOnly, onChange, onChangeMapRef],\n )\n\n return (\n <TogglePropsContext value={context}>\n <ToggleGroupContext value={groupContext}>\n <Group attached={attached} {...getGroupProps()} />\n </ToggleGroupContext>\n </TogglePropsContext>\n )\n },\n \"group\",\n)() as GenericsComponent<{\n <Y extends string | string[] = string>(\n props: ToggleGroupRootProps<Y>,\n ): ReactElement\n}>\n"],"mappings":";;;;;;;AA+BA,MAAa,kBAAkB,WAC5B,UAAgC;CAC/B,MAAM,GAAG,EAAE,aAAa,MAAM,SAAS,UAAU,GAAG,UAClD,sBAAsB,OAAO,SAAS,EACpC,eAAe;EAAC;EAAQ;EAAW;CAAa,EAClD,CAAC;CACH,MAAM,EACJ,UACA,UACA,OACA,eACA,UACA,mBACE,eAAe,IAAI;CAqBvB,OACE,oBAAC,oBAAD;EAAoB,OArBN,eACP;GACL;GACA;GACA;GACA,kBAAkB,WAAW,WAAW,KAAA;EAC1C,IACA;GAAC;GAAS;GAAM;GAAa;EAAQ,CAcJ;EAC/B,UAAA,oBAAC,oBAAD;GAAoB,OAbH,eACZ;IACL;IACA;IACA;IACA;IACA;GACF,IACA;IAAC;IAAO;IAAU;IAAU;IAAU;GAAc,CAKZ;GACpC,UAAA,oBAAC,OAAD;IAAiB;IAAU,GAAI,cAAc;GAAI,CAAA;EAC/B,CAAA;CACF,CAAA;AAExB,GACA,OACF,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.js","names":["motion"],"sources":["../../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { UsePopupAnimationProps } from \"../popover\"\nimport type { PortalProps } from \"../portal\"\nimport type { TooltipStyle } from \"./tooltip.style\"\nimport type { UseTooltipProps } from \"./use-tooltip\"\nimport { AnimatePresence } from \"motion/react\"\nimport { createSlotComponent } from \"../../core\"\nimport { cast } from \"../../utils\"\nimport { motion } from \"../motion\"\nimport { usePopupAnimationProps } from \"../popover\"\nimport { Portal } from \"../portal\"\nimport { tooltipStyle } from \"./tooltip.style\"\nimport { useTooltip } from \"./use-tooltip\"\n\nexport interface TooltipProps\n extends\n UseTooltipProps,\n PropsWithChildren,\n UsePopupAnimationProps,\n ThemeProps<TooltipStyle> {\n /**\n * The content of the tooltip.\n */\n content?: ReactNode\n /**\n * The animation duration.\n *\n * @default 0.1\n */\n duration?: UsePopupAnimationProps[\"duration\"]\n /**\n * Props for content element.\n */\n contentProps?: HTMLMotionProps\n /**\n * Props for portal component.\n */\n portalProps?: Omit<PortalProps, \"children\">\n}\n\nconst {\n PropsContext: TooltipPropsContext,\n StyleContext,\n usePropsContext: useTooltipPropsContext,\n withContext,\n useRootComponentProps,\n} = createSlotComponent<TooltipProps, TooltipStyle>(\"tooltip\", tooltipStyle)\n\nexport { TooltipPropsContext, useTooltipPropsContext }\n\n/**\n * `Tooltip` is a component that displays short information, such as supplementary details for an element.\n *\n * @see https://yamada-ui.com/docs/components/tooltip\n */\nexport const Tooltip: FC<TooltipProps> = (props) => {\n const [\n context,\n {\n animationScheme = \"scale\",\n children,\n content,\n duration = 0.1,\n contentProps,\n portalProps,\n ...rest\n },\n ] = useRootComponentProps(props)\n const { open, getContentProps, getPositionerProps, getTriggerProps } =\n useTooltip(rest)\n const popupAnimationProps = usePopupAnimationProps({\n animationScheme,\n duration,\n })\n\n if (!content) return children\n\n return (\n <StyleContext value={context}>\n <TooltipTrigger asChild {...getTriggerProps()}>\n {children}\n </TooltipTrigger>\n\n <AnimatePresence>\n {open ? (\n <Portal {...portalProps}>\n <TooltipPositioner {...getPositionerProps()}>\n <TooltipContent\n {...popupAnimationProps}\n {...cast<HTMLMotionProps>(\n getContentProps(cast<HTMLProps>(contentProps)),\n )}\n >\n {content}\n </TooltipContent>\n </TooltipPositioner>\n </Portal>\n ) : null}\n </AnimatePresence>\n </StyleContext>\n )\n}\n\ninterface TooltipPositionerProps extends HTMLStyledProps {}\n\nconst TooltipPositioner = withContext<\"div\", TooltipPositionerProps>(\n \"div\",\n \"positioner\",\n)()\n\ninterface TooltipTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nconst TooltipTrigger = withContext<\"button\", TooltipTriggerProps>(\n \"button\",\n \"trigger\",\n)()\n\ninterface TooltipContentProps extends Omit<\n HTMLMotionProps,\n \"children\" | \"offset\" | \"transform\"\n> {}\n\nconst TooltipContent = withContext<\"div\", TooltipContentProps>(\n motion.div,\n \"content\",\n)()\n"],"mappings":";;;;;;;;;;;AA4CA,MAAM,EACJ,cAAc,qBACd,cACA,iBAAiB,wBACjB,aACA,0BACE,oBAAgD,WAAW,YAAY;;;;;;AAS3E,MAAa,WAA6B,UAAU;CAClD,MAAM,CACJ,SACA,EACE,kBAAkB,SAClB,UACA,SACA,WAAW,IACX,cACA,aACA,GAAG,UAEH,sBAAsB,KAAK;CAC/B,MAAM,EAAE,MAAM,iBAAiB,oBAAoB,oBACjD,WAAW,IAAI;CACjB,MAAM,sBAAsB,uBAAuB;EACjD;EACA;CACF,CAAC;CAED,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,qBAAC,cAAD;EAAc,OAAO;
|
|
1
|
+
{"version":3,"file":"tooltip.js","names":["motion"],"sources":["../../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { UsePopupAnimationProps } from \"../popover\"\nimport type { PortalProps } from \"../portal\"\nimport type { TooltipStyle } from \"./tooltip.style\"\nimport type { UseTooltipProps } from \"./use-tooltip\"\nimport { AnimatePresence } from \"motion/react\"\nimport { createSlotComponent } from \"../../core\"\nimport { cast } from \"../../utils\"\nimport { motion } from \"../motion\"\nimport { usePopupAnimationProps } from \"../popover\"\nimport { Portal } from \"../portal\"\nimport { tooltipStyle } from \"./tooltip.style\"\nimport { useTooltip } from \"./use-tooltip\"\n\nexport interface TooltipProps\n extends\n UseTooltipProps,\n PropsWithChildren,\n UsePopupAnimationProps,\n ThemeProps<TooltipStyle> {\n /**\n * The content of the tooltip.\n */\n content?: ReactNode\n /**\n * The animation duration.\n *\n * @default 0.1\n */\n duration?: UsePopupAnimationProps[\"duration\"]\n /**\n * Props for content element.\n */\n contentProps?: HTMLMotionProps\n /**\n * Props for portal component.\n */\n portalProps?: Omit<PortalProps, \"children\">\n}\n\nconst {\n PropsContext: TooltipPropsContext,\n StyleContext,\n usePropsContext: useTooltipPropsContext,\n withContext,\n useRootComponentProps,\n} = createSlotComponent<TooltipProps, TooltipStyle>(\"tooltip\", tooltipStyle)\n\nexport { TooltipPropsContext, useTooltipPropsContext }\n\n/**\n * `Tooltip` is a component that displays short information, such as supplementary details for an element.\n *\n * @see https://yamada-ui.com/docs/components/tooltip\n */\nexport const Tooltip: FC<TooltipProps> = (props) => {\n const [\n context,\n {\n animationScheme = \"scale\",\n children,\n content,\n duration = 0.1,\n contentProps,\n portalProps,\n ...rest\n },\n ] = useRootComponentProps(props)\n const { open, getContentProps, getPositionerProps, getTriggerProps } =\n useTooltip(rest)\n const popupAnimationProps = usePopupAnimationProps({\n animationScheme,\n duration,\n })\n\n if (!content) return children\n\n return (\n <StyleContext value={context}>\n <TooltipTrigger asChild {...getTriggerProps()}>\n {children}\n </TooltipTrigger>\n\n <AnimatePresence>\n {open ? (\n <Portal {...portalProps}>\n <TooltipPositioner {...getPositionerProps()}>\n <TooltipContent\n {...popupAnimationProps}\n {...cast<HTMLMotionProps>(\n getContentProps(cast<HTMLProps>(contentProps)),\n )}\n >\n {content}\n </TooltipContent>\n </TooltipPositioner>\n </Portal>\n ) : null}\n </AnimatePresence>\n </StyleContext>\n )\n}\n\ninterface TooltipPositionerProps extends HTMLStyledProps {}\n\nconst TooltipPositioner = withContext<\"div\", TooltipPositionerProps>(\n \"div\",\n \"positioner\",\n)()\n\ninterface TooltipTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nconst TooltipTrigger = withContext<\"button\", TooltipTriggerProps>(\n \"button\",\n \"trigger\",\n)()\n\ninterface TooltipContentProps extends Omit<\n HTMLMotionProps,\n \"children\" | \"offset\" | \"transform\"\n> {}\n\nconst TooltipContent = withContext<\"div\", TooltipContentProps>(\n motion.div,\n \"content\",\n)()\n"],"mappings":";;;;;;;;;;;AA4CA,MAAM,EACJ,cAAc,qBACd,cACA,iBAAiB,wBACjB,aACA,0BACE,oBAAgD,WAAW,YAAY;;;;;;AAS3E,MAAa,WAA6B,UAAU;CAClD,MAAM,CACJ,SACA,EACE,kBAAkB,SAClB,UACA,SACA,WAAW,IACX,cACA,aACA,GAAG,UAEH,sBAAsB,KAAK;CAC/B,MAAM,EAAE,MAAM,iBAAiB,oBAAoB,oBACjD,WAAW,IAAI;CACjB,MAAM,sBAAsB,uBAAuB;EACjD;EACA;CACF,CAAC;CAED,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,qBAAC,cAAD;EAAc,OAAO;EAArB,UAAA,CACE,oBAAC,gBAAD;GAAgB,SAAA;GAAQ,GAAI,gBAAgB;GACzC;EACa,CAAA,GAEhB,oBAAC,iBAAD,EAAA,UACG,OACC,oBAAC,QAAD;GAAQ,GAAI;GACV,UAAA,oBAAC,mBAAD;IAAmB,GAAI,mBAAmB;IACxC,UAAA,oBAAC,gBAAD;KACE,GAAI;KACJ,IAAA,GAAA,cAAA,KAAA,CACE,iBAAA,GAAA,cAAA,KAAA,CAAgC,YAAY,CAAC,CAC/C;KAEC,UAAA;IACa,CAAA;GACC,CAAA;EACb,CAAA,IACN,KACW,CAAA,CACL;;AAElB;AAIA,MAAM,oBAAoB,YACxB,OACA,YACF,CAAC,CAAC;AAIF,MAAM,iBAAiB,YACrB,UACA,SACF,CAAC,CAAC;AAOF,MAAM,iBAAiB,YACrBA,SAAO,KACP,SACF,CAAC,CAAC"}
|