@yamada-ui/react 2.2.3-dev-20260622141401 → 2.2.3
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/use-accordion.cjs.map +1 -1
- package/dist/cjs/components/autocomplete/use-autocomplete.cjs.map +1 -1
- package/dist/cjs/components/calendar/use-calendar.cjs +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/chart.cjs.map +1 -1
- package/dist/cjs/components/chart/use-polar-chart.cjs.map +1 -1
- package/dist/cjs/components/checkbox/checkbox.cjs.map +1 -1
- package/dist/cjs/components/checkbox/use-checkbox-group.cjs.map +1 -1
- package/dist/cjs/components/checkbox-card/checkbox-card.cjs.map +1 -1
- package/dist/cjs/components/collapse/collapse.cjs.map +1 -1
- package/dist/cjs/components/color-picker/use-color-picker.cjs.map +1 -1
- package/dist/cjs/components/color-swatch/color-swatch-group.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 +1 -1
- package/dist/cjs/components/date-picker/use-date-picker.cjs.map +1 -1
- package/dist/cjs/components/editable/use-editable.cjs.map +1 -1
- package/dist/cjs/components/field/field.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/highlight/highlight.cjs.map +1 -1
- package/dist/cjs/components/indicator/indicator.cjs.map +1 -1
- package/dist/cjs/components/infinite-scroll-area/use-infinite-scroll.cjs.map +1 -1
- package/dist/cjs/components/input/input-group.cjs.map +1 -1
- package/dist/cjs/components/list/list.cjs.map +1 -1
- package/dist/cjs/components/menu/use-menu.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.cjs.map +1 -1
- package/dist/cjs/components/number-input/use-number-input.cjs.map +1 -1
- package/dist/cjs/components/pagination/pagination.cjs.map +1 -1
- package/dist/cjs/components/pagination/use-pagination.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/pin-input/use-pin-input.cjs.map +1 -1
- package/dist/cjs/components/qr-code/use-qr-code.cjs.map +1 -1
- package/dist/cjs/components/radio/use-radio-group.cjs.map +1 -1
- package/dist/cjs/components/segmented-control/segmented-control.cjs.map +1 -1
- package/dist/cjs/components/select/use-select.cjs.map +1 -1
- package/dist/cjs/components/show/show.cjs.map +1 -1
- package/dist/cjs/components/sidebar/sidebar.cjs.map +1 -1
- package/dist/cjs/components/sidebar/use-sidebar.cjs.map +1 -1
- package/dist/cjs/components/simple-grid/simple-grid.cjs.map +1 -1
- package/dist/cjs/components/stack/z-stack.cjs.map +1 -1
- package/dist/cjs/components/steps/steps.cjs.map +1 -1
- package/dist/cjs/components/steps/use-steps.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/toggle/use-toggle-group.cjs.map +1 -1
- package/dist/cjs/components/toggle/use-toggle.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/components/props.cjs.map +1 -1
- package/dist/cjs/core/components/use-component-style.cjs.map +1 -1
- package/dist/cjs/core/css/animation.cjs.map +1 -1
- package/dist/cjs/core/css/at-rule.cjs.map +1 -1
- package/dist/cjs/core/css/calc.cjs.map +1 -1
- package/dist/cjs/core/css/color-mix.cjs.map +1 -1
- package/dist/cjs/core/css/config.cjs.map +1 -1
- package/dist/cjs/core/css/css.cjs.map +1 -1
- package/dist/cjs/core/css/gradient.cjs.map +1 -1
- package/dist/cjs/core/css/grid.cjs.map +1 -1
- package/dist/cjs/core/css/transition.cjs.map +1 -1
- package/dist/cjs/core/css/utils.cjs.map +1 -1
- package/dist/cjs/core/system/breakpoint.cjs.map +1 -1
- package/dist/cjs/core/system/color-mode-provider.cjs.map +1 -1
- package/dist/cjs/core/system/create-system.cjs.map +1 -1
- package/dist/cjs/core/system/environment-provider.cjs.map +1 -1
- package/dist/cjs/core/system/storage-manager.cjs.map +1 -1
- package/dist/cjs/core/system/storage-script.cjs.map +1 -1
- package/dist/cjs/core/system/use-system-color-mode.cjs.map +1 -1
- package/dist/cjs/core/system/var.cjs.map +1 -1
- package/dist/cjs/hooks/use-animation/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-breakpoint/use-breakpoint-value.cjs.map +1 -1
- package/dist/cjs/hooks/use-breakpoint/use-breakpoint.cjs.map +1 -1
- package/dist/cjs/hooks/use-clickable/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-clipboard/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-controllable-state/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-counter/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-descendants/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-focus/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-local-storage/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-mounted/index.cjs.map +1 -1
- package/dist/cjs/hooks/use-outside-click/index.cjs.map +1 -1
- package/dist/cjs/providers/i18n-provider/i18n-provider.cjs.map +1 -1
- package/dist/cjs/utils/children.cjs.map +1 -1
- package/dist/cjs/utils/dom.cjs.map +1 -1
- package/dist/cjs/utils/store.cjs.map +1 -1
- package/dist/esm/components/accordion/use-accordion.js.map +1 -1
- package/dist/esm/components/autocomplete/use-autocomplete.js.map +1 -1
- package/dist/esm/components/calendar/use-calendar.js +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/chart.js.map +1 -1
- package/dist/esm/components/chart/use-polar-chart.js.map +1 -1
- package/dist/esm/components/checkbox/checkbox.js.map +1 -1
- package/dist/esm/components/checkbox/use-checkbox-group.js.map +1 -1
- package/dist/esm/components/checkbox-card/checkbox-card.js.map +1 -1
- package/dist/esm/components/collapse/collapse.js.map +1 -1
- package/dist/esm/components/color-picker/use-color-picker.js.map +1 -1
- package/dist/esm/components/color-swatch/color-swatch-group.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 +1 -1
- package/dist/esm/components/date-picker/use-date-picker.js.map +1 -1
- package/dist/esm/components/editable/use-editable.js.map +1 -1
- package/dist/esm/components/field/field.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/highlight/highlight.js.map +1 -1
- package/dist/esm/components/indicator/indicator.js.map +1 -1
- package/dist/esm/components/infinite-scroll-area/use-infinite-scroll.js.map +1 -1
- package/dist/esm/components/input/input-group.js.map +1 -1
- package/dist/esm/components/list/list.js.map +1 -1
- package/dist/esm/components/menu/use-menu.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.js.map +1 -1
- package/dist/esm/components/number-input/use-number-input.js.map +1 -1
- package/dist/esm/components/pagination/pagination.js.map +1 -1
- package/dist/esm/components/pagination/use-pagination.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/pin-input/use-pin-input.js.map +1 -1
- package/dist/esm/components/qr-code/use-qr-code.js.map +1 -1
- package/dist/esm/components/radio/use-radio-group.js.map +1 -1
- package/dist/esm/components/segmented-control/segmented-control.js.map +1 -1
- package/dist/esm/components/select/use-select.js.map +1 -1
- package/dist/esm/components/show/show.js.map +1 -1
- package/dist/esm/components/sidebar/sidebar.js.map +1 -1
- package/dist/esm/components/sidebar/use-sidebar.js.map +1 -1
- package/dist/esm/components/simple-grid/simple-grid.js.map +1 -1
- package/dist/esm/components/stack/z-stack.js.map +1 -1
- package/dist/esm/components/steps/steps.js.map +1 -1
- package/dist/esm/components/steps/use-steps.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/toggle/use-toggle-group.js.map +1 -1
- package/dist/esm/components/toggle/use-toggle.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/components/props.js.map +1 -1
- package/dist/esm/core/components/use-component-style.js.map +1 -1
- package/dist/esm/core/css/animation.js.map +1 -1
- package/dist/esm/core/css/at-rule.js.map +1 -1
- package/dist/esm/core/css/calc.js.map +1 -1
- package/dist/esm/core/css/color-mix.js.map +1 -1
- package/dist/esm/core/css/config.js.map +1 -1
- package/dist/esm/core/css/css.js.map +1 -1
- package/dist/esm/core/css/gradient.js.map +1 -1
- package/dist/esm/core/css/grid.js.map +1 -1
- package/dist/esm/core/css/transition.js.map +1 -1
- package/dist/esm/core/css/utils.js.map +1 -1
- package/dist/esm/core/system/breakpoint.js.map +1 -1
- package/dist/esm/core/system/color-mode-provider.js.map +1 -1
- package/dist/esm/core/system/create-system.js.map +1 -1
- package/dist/esm/core/system/environment-provider.js.map +1 -1
- package/dist/esm/core/system/storage-manager.js.map +1 -1
- package/dist/esm/core/system/storage-script.js.map +1 -1
- package/dist/esm/core/system/use-system-color-mode.js.map +1 -1
- package/dist/esm/core/system/var.js.map +1 -1
- package/dist/esm/hooks/use-animation/index.js.map +1 -1
- package/dist/esm/hooks/use-breakpoint/use-breakpoint-value.js.map +1 -1
- package/dist/esm/hooks/use-breakpoint/use-breakpoint.js.map +1 -1
- package/dist/esm/hooks/use-clickable/index.js.map +1 -1
- package/dist/esm/hooks/use-clipboard/index.js.map +1 -1
- package/dist/esm/hooks/use-controllable-state/index.js.map +1 -1
- package/dist/esm/hooks/use-counter/index.js.map +1 -1
- package/dist/esm/hooks/use-descendants/index.js.map +1 -1
- package/dist/esm/hooks/use-focus/index.js.map +1 -1
- package/dist/esm/hooks/use-local-storage/index.js.map +1 -1
- package/dist/esm/hooks/use-mounted/index.js.map +1 -1
- package/dist/esm/hooks/use-outside-click/index.js.map +1 -1
- package/dist/esm/providers/i18n-provider/i18n-provider.js.map +1 -1
- package/dist/esm/utils/children.js.map +1 -1
- package/dist/esm/utils/dom.js.map +1 -1
- package/dist/esm/utils/store.js.map +1 -1
- package/dist/types/components/autocomplete/autocomplete.style.d.ts +1 -1
- package/dist/types/components/breadcrumb/breadcrumb.style.d.ts +1 -1
- package/dist/types/components/calendar/calendar.style.d.ts +2 -2
- package/dist/types/components/carousel/carousel.style.d.ts +2 -2
- package/dist/types/components/chart/polar-chart.style.d.ts +1 -1
- package/dist/types/components/date-picker/date-picker.style.d.ts +1 -1
- package/dist/types/components/field/use-field-props.d.ts +1 -1
- package/dist/types/components/file-button/use-file-button.d.ts +2 -2
- package/dist/types/components/file-input/use-file-input.d.ts +2 -2
- package/dist/types/components/menu/menu.style.d.ts +2 -2
- package/dist/types/components/progress/use-progress.d.ts +6 -6
- package/dist/types/components/rating/rating.style.d.ts +2 -2
- package/dist/types/components/select/select.style.d.ts +1 -1
- package/dist/types/components/steps/steps.style.d.ts +1 -1
- package/dist/types/components/tabs/tabs.style.d.ts +1 -1
- package/dist/types/components/tree/tree.style.d.ts +1 -1
- package/dist/types/components/tree/use-tree.d.ts +2 -2
- package/dist/types/hooks/use-clickable/index.d.ts +2 -2
- package/dist/types/providers/i18n-provider/i18n-provider.d.ts +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-menu.js","names":["createContext","noop"],"sources":["../../../../src/components/menu/use-menu.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent, MouseEvent, RefObject } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { Descendant, Descendants } from \"../../hooks/use-descendants\"\nimport type { UseDisclosureProps } from \"../../hooks/use-disclosure\"\nimport { useCallback, useId, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport { useDisclosure } from \"../../hooks/use-disclosure\"\nimport {\n ariaAttr,\n assignRef,\n createContext,\n cx,\n dataAttr,\n handlerAll,\n isArray,\n isString,\n isTruthyDataAttr,\n mergeRefs,\n noop,\n runKeyAction,\n useUpdateEffect,\n} from \"../../utils\"\n\ntype SubMenuDirection = \"end\" | \"start\"\n\ninterface MenuDescendantProps {\n id: string\n}\ntype MenuDescendant = Descendant<HTMLDivElement, MenuDescendantProps>\n\nconst {\n DescendantsContext: MenuDescendantsContext,\n useDescendant: useMenuDescendant,\n useDescendantRegister: useMenuDescendantRegister,\n useDescendants: useMenuDescendants,\n} = createDescendants<HTMLDivElement, MenuDescendantProps>()\n\nexport { MenuDescendantsContext, useMenuDescendant, useMenuDescendants }\n\ninterface MenuContext extends Pick<\n UseMenuReturn,\n | \"onActiveDescendant\"\n | \"onClose\"\n | \"onCloseSubMenu\"\n | \"onOpen\"\n | \"onSelect\"\n | \"subMenu\"\n | \"subMenuDirection\"\n> {}\n\nconst [MenuContext, useMenuContext] = createContext<MenuContext>({\n name: \"MenuContext\",\n})\n\ninterface MenuGroupContext extends Pick<UseMenuGroupReturn, \"getLabelProps\"> {}\n\nconst [MenuGroupContext, useMenuGroupContext] = createContext<MenuGroupContext>(\n {\n name: \"MenuGroupContext\",\n },\n)\n\ninterface MainMenuContext {\n descendants: Descendants<HTMLDivElement, MenuDescendantProps>\n onActiveDescendant: (descendant?: MenuDescendant) => void\n onCloseRef: RefObject<() => void>\n onSelect: (value?: string, closeOnSelect?: boolean) => void\n closeOnSelect?: boolean\n}\n\nconst [MainMenuContext, useMainMenuContext] = createContext<MainMenuContext>({\n name: \"MainMenuContext\",\n strict: false,\n})\n\ninterface MenuOptionGroupContext {\n type: \"checkbox\" | \"radio\"\n value: string | string[]\n onChange?: (value: string) => void\n}\n\nconst [MenuOptionGroupContext, useMenuOptionGroupContext] =\n createContext<MenuOptionGroupContext>({\n name: \"MenuOptionGroupContext\",\n })\n\nexport {\n MainMenuContext,\n MenuContext,\n MenuGroupContext,\n MenuOptionGroupContext,\n useMainMenuContext,\n useMenuContext,\n useMenuGroupContext,\n useMenuOptionGroupContext,\n}\n\nexport interface UseMenuProps extends Omit<UseDisclosureProps, \"timing\"> {\n /**\n * If `true`, the menu item will be closed when selected.\n *\n * @default true\n */\n closeOnSelect?: boolean\n /**\n * If `true`, the menu will be disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * The direction of the sub menu.\n *\n * @default 'end'\n */\n subMenuDirection?: SubMenuDirection\n /**\n * Callback invoked when a menu item is selected.\n */\n onSelect?: (value?: string) => void\n}\n\nexport const useMenu = ({\n closeOnSelect,\n defaultOpen,\n disabled = false,\n open: openProp,\n subMenuDirection = \"end\",\n onClose: onCloseProp,\n onOpen: onOpenProp,\n onSelect: onSelectProp,\n}: UseMenuProps = {}) => {\n const triggerId = useId()\n const contentId = useId()\n const descendants = useMenuDescendants()\n const updateRef = useRef<() => void>(noop)\n const onCloseRef = useRef<() => void>(noop)\n const contentRef = useRef<HTMLDivElement>(null)\n const { open, onClose, onOpen } = useDisclosure({\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n })\n const onCloseSubMenu = useCallback(() => onCloseRef.current(), [])\n const onActiveDescendant = useCallback(\n (\n descendant?: MenuDescendant,\n options: FocusOptions = { preventScroll: true },\n ) => {\n if (!contentRef.current || !descendant || disabled) return\n\n contentRef.current.setAttribute(\"aria-activedescendant\", descendant.id)\n\n descendants.active(descendant, options)\n },\n [descendants, disabled],\n )\n const { mainCloseOnSelect, subMenu, getSubMenuProps, onMainSelect } =\n useSubMenu({\n descendants,\n disabled,\n open,\n subMenuDirection,\n onActiveDescendant,\n onClose,\n onOpen,\n })\n\n closeOnSelect ??= mainCloseOnSelect ?? true\n\n const onSelect = useCallback(\n (value?: string, closeOnSelectProp = closeOnSelect) => {\n if (disabled) return\n\n onSelectProp?.(value)\n onMainSelect?.(value, closeOnSelectProp)\n\n if (!closeOnSelectProp) return\n\n onClose()\n },\n [closeOnSelect, disabled, onClose, onMainSelect, onSelectProp],\n )\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled) return\n\n ev.preventDefault()\n\n if (!open) {\n onOpen()\n } else {\n onClose()\n }\n },\n [disabled, onClose, onOpen, open],\n )\n\n const onContextMenu = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled) return\n\n ev.preventDefault()\n onOpen()\n updateRef.current()\n },\n [disabled, onOpen],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n if (disabled) return\n\n runKeyAction(ev, {\n ArrowDown: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n },\n ArrowUp: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledLastValue()\n\n onActiveDescendant(descendant)\n })\n },\n Enter: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n },\n Space: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n },\n })\n },\n [descendants, disabled, onActiveDescendant, onOpen],\n )\n\n const getTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n ...getSubMenuProps({\n id: triggerId,\n \"aria-controls\": open ? contentId : undefined,\n \"aria-disabled\": ariaAttr(disabled),\n \"aria-expanded\": open,\n \"aria-haspopup\": \"menu\",\n \"data-trigger\": dataAttr(true),\n role: \"button\",\n tabIndex: disabled ? -1 : 0,\n ...props,\n onClick: handlerAll(props.onClick, onClick),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n }),\n [contentId, disabled, getSubMenuProps, onClick, onKeyDown, open, triggerId],\n )\n\n const getContextTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n id: triggerId,\n \"aria-controls\": open ? contentId : undefined,\n \"aria-disabled\": ariaAttr(disabled),\n \"aria-expanded\": open,\n \"aria-haspopup\": \"menu\",\n \"data-trigger\": dataAttr(true),\n role: \"application\",\n ...props,\n onContextMenu: handlerAll(props.onContextMenu, onContextMenu),\n }),\n [contentId, disabled, onContextMenu, open, triggerId],\n )\n\n const getContentProps: PropGetter = useCallback(\n ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n id: contentId,\n \"aria-labelledby\": cx(ariaLabelledby, triggerId),\n role: \"menu\",\n ...props,\n ref: mergeRefs(ref, contentRef),\n }),\n [contentId, triggerId],\n )\n\n const getSeparatorProps: PropGetter = useCallback(\n (props) => ({ role: \"separator\", ...props }),\n [],\n )\n\n return {\n closeOnSelect,\n descendants,\n open,\n subMenu,\n subMenuDirection,\n updateRef,\n getContentProps,\n getContextTriggerProps,\n getSeparatorProps,\n getTriggerProps,\n onActiveDescendant,\n onClose,\n onCloseRef,\n onCloseSubMenu,\n onOpen,\n onSelect,\n }\n}\n\nexport type UseMenuReturn = ReturnType<typeof useMenu>\n\nexport interface UseSubMenuProps extends Omit<\n Required<UseDisclosureProps>,\n \"defaultOpen\" | \"timing\"\n> {\n descendants: Descendants<HTMLDivElement, MenuDescendantProps>\n onActiveDescendant: (descendant?: MenuDescendant) => void\n disabled?: boolean\n subMenuDirection?: SubMenuDirection\n}\n\nexport const useSubMenu = ({\n descendants,\n disabled = false,\n open,\n subMenuDirection = \"end\",\n onActiveDescendant,\n onClose,\n onOpen,\n}: UseSubMenuProps) => {\n const uuid = useId()\n const {\n closeOnSelect: mainCloseOnSelect,\n descendants: mainDescendants,\n onActiveDescendant: onActiveMainDescendant,\n onCloseRef,\n onSelect: onMainSelect,\n } = useMainMenuContext() ?? {}\n const subMenu = !!mainDescendants && !!onActiveMainDescendant\n const createRegister = useMenuDescendantRegister(mainDescendants)\n const triggerRef = useRef<HTMLDivElement>(null)\n\n const dataDisabled = useCallback((node?: HTMLDivElement | null) => {\n node ??= triggerRef.current\n\n if (!node) return false\n\n const dataDisabled = isTruthyDataAttr(node.getAttribute(\"data-disabled\"))\n\n return dataDisabled\n }, [])\n\n const ariaDisabled = useCallback((node?: HTMLDivElement | null) => {\n node ??= triggerRef.current\n\n if (!node) return false\n\n const ariaDisabled = isTruthyDataAttr(node.getAttribute(\"aria-disabled\"))\n\n return ariaDisabled\n }, [])\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (!subMenu) return\n\n ev.defaultPrevented = disabled || dataDisabled() || ariaDisabled()\n },\n [ariaDisabled, dataDisabled, disabled, subMenu],\n )\n\n const onMouseEnter = useCallback(() => {\n if (!subMenu || disabled || dataDisabled() || ariaDisabled()) return\n\n onOpen()\n }, [ariaDisabled, dataDisabled, disabled, onOpen, subMenu])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (!subMenu || disabled || dataDisabled() || ariaDisabled()) return\n\n const descendant = descendants.value(triggerRef.current)\n\n onActiveMainDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n [\n ariaDisabled,\n dataDisabled,\n descendants,\n disabled,\n onActiveMainDescendant,\n subMenu,\n ],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n if (!subMenu || disabled) return\n\n const currentDescendant = open ? descendants : mainDescendants\n const onActiveCurrentDescendant = open\n ? onActiveDescendant\n : onActiveMainDescendant\n\n runKeyAction(ev, {\n ArrowDown: () => {\n const descendant = currentDescendant.enabledNextValue(\n triggerRef.current,\n )\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n ArrowUp: () => {\n const descendant = currentDescendant.enabledPrevValue(\n triggerRef.current,\n )\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n End: () => {\n const descendant = currentDescendant.enabledLastValue()\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n Home: () => {\n const descendant = currentDescendant.enabledFirstValue()\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n [subMenuDirection === \"end\" ? \"ArrowRight\" : \"ArrowLeft\"]: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n\n ev.defaultPrevented = true\n },\n })\n },\n [\n subMenu,\n disabled,\n open,\n descendants,\n mainDescendants,\n onActiveDescendant,\n onActiveMainDescendant,\n subMenuDirection,\n onOpen,\n ],\n )\n\n assignRef(onCloseRef, onClose)\n\n const getSubMenuProps: PropGetter = useCallback(\n ({ id = uuid, ref, ...props } = {}) => {\n const getDisabled = (node: HTMLDivElement) =>\n disabled || dataDisabled(node) || ariaDisabled(node)\n const register = createRegister({ id, disabled: getDisabled })\n\n return {\n role: subMenu ? \"menuitem\" : \"button\",\n ...props,\n ref: mergeRefs(ref, triggerRef, register),\n onClick: handlerAll(onClick, props.onClick),\n onKeyDown: handlerAll(onKeyDown, props.onKeyDown),\n onMouseEnter: handlerAll(onMouseEnter, props.onMouseEnter),\n onMouseMove: handlerAll(onMouseMove, props.onMouseMove),\n }\n },\n [\n uuid,\n subMenu,\n createRegister,\n onClick,\n onKeyDown,\n onMouseEnter,\n onMouseMove,\n disabled,\n dataDisabled,\n ariaDisabled,\n ],\n )\n\n return { mainCloseOnSelect, subMenu, getSubMenuProps, onMainSelect }\n}\n\nexport type UseSubMenuReturn = ReturnType<typeof useSubMenu>\n\nexport interface UseMenuGroupProps extends HTMLProps {}\n\nexport const useMenuGroup = ({\n \"aria-labelledby\": ariaLabelledbyProp,\n ...rest\n}: UseMenuGroupProps) => {\n const labelId = useId()\n\n const getGroupProps: PropGetter = useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) =>\n mergeProps(\n {\n \"aria-labelledby\": cx(ariaLabelledbyProp, ariaLabelledby, labelId),\n role: \"group\",\n },\n rest,\n props,\n )(),\n [ariaLabelledbyProp, labelId, rest],\n )\n\n const getLabelProps: PropGetter<\"span\"> = useCallback(\n (props) => ({ id: labelId, role: \"presentation\", ...props }),\n [labelId],\n )\n\n return { getGroupProps, getLabelProps }\n}\n\nexport type UseMenuGroupReturn = ReturnType<typeof useMenuGroup>\n\nexport interface UseMenuItemProps extends HTMLProps {\n /**\n * If `true`, the menu item will be closed when selected.\n */\n closeOnSelect?: boolean\n /**\n * If `true`, the menu item will be disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * The value of the menu item.\n */\n value?: string\n}\n\nexport const useMenuItem = ({\n id,\n \"aria-disabled\": ariaDisabled,\n \"data-disabled\": dataDisabled,\n \"data-trigger\": dataTrigger,\n closeOnSelect,\n disabled = false,\n value,\n ...rest\n}: UseMenuItemProps) => {\n const trigger = isTruthyDataAttr(dataTrigger)\n const {\n subMenu,\n subMenuDirection,\n onActiveDescendant,\n onClose,\n onCloseSubMenu,\n onSelect,\n } = useMenuContext()\n const uuid = useId()\n const itemRef = useRef<HTMLDivElement>(null)\n const subMenuTrigger = subMenu && trigger\n\n id ??= uuid\n\n const { descendants, register } = useMenuDescendant({\n id,\n disabled: disabled || subMenuTrigger,\n })\n\n const onActive = useCallback(() => {\n if (disabled) return\n\n const descendant = descendants.value(itemRef.current)\n\n onActiveDescendant(descendant)\n }, [descendants, disabled, onActiveDescendant])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n runKeyAction(ev, {\n ArrowDown: () => {\n const descendant = descendants.enabledNextValue(itemRef.current)\n\n onActiveDescendant(descendant)\n },\n ArrowUp: () => {\n const descendant = descendants.enabledPrevValue(itemRef.current)\n\n onActiveDescendant(descendant)\n },\n End: () => {\n const descendant = descendants.enabledLastValue()\n\n onActiveDescendant(descendant)\n },\n Enter: () => onSelect(value, closeOnSelect),\n Home: () => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n },\n Space: () => onSelect(value, closeOnSelect),\n [subMenuDirection === \"end\" ? \"ArrowLeft\" : \"ArrowRight\"]: () => {\n if (!subMenu) return\n\n onClose()\n\n const descendant = descendants.firstValue()\n\n descendant?.node.focus()\n },\n })\n },\n [\n closeOnSelect,\n descendants,\n onActiveDescendant,\n onClose,\n onSelect,\n subMenu,\n subMenuDirection,\n value,\n ],\n )\n\n const getItemProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => {\n const {\n onClick: restOnClick,\n onFocus: restOnFocus,\n onKeyDown: restOnKeyDown,\n onMouseMove: restOnMouseMove,\n ...restProps\n } = rest\n const {\n onClick: propsOnClick,\n onFocus: propsOnFocus,\n onKeyDown: propsOnKeyDown,\n onMouseMove: propsOnMouseMove,\n ...itemProps\n } = props\n\n return mergeProps(\n {\n id,\n \"aria-disabled\": ariaDisabled ?? ariaAttr(disabled),\n \"data-disabled\": dataDisabled ?? dataAttr(disabled),\n role: \"menuitem\",\n tabIndex: -1,\n },\n restProps,\n itemProps,\n {\n ref: mergeRefs(ref, itemRef, register),\n onClick: handlerAll(propsOnClick, restOnClick, () =>\n onSelect(value, closeOnSelect),\n ),\n onFocus: handlerAll(propsOnFocus, restOnFocus, onActive),\n onKeyDown: handlerAll(propsOnKeyDown, restOnKeyDown, onKeyDown),\n onMouseMove: handlerAll(propsOnMouseMove, restOnMouseMove, () => {\n onCloseSubMenu()\n onActive()\n }),\n },\n )()\n },\n [\n id,\n ariaDisabled,\n disabled,\n dataDisabled,\n rest,\n register,\n onActive,\n onKeyDown,\n onSelect,\n value,\n closeOnSelect,\n onCloseSubMenu,\n ],\n )\n\n return {\n subMenuTrigger,\n getItemProps,\n }\n}\n\nexport type UseMenuItemReturn = ReturnType<typeof useMenuItem>\n\nexport type MenuOptionGroupType = \"checkbox\" | \"radio\"\nexport type MenuOptionGroupValue<Y extends MenuOptionGroupType> =\n Y extends \"checkbox\" ? string[] : string\n\nexport interface UseMenuOptionGroupProps<\n Y extends MenuOptionGroupType = \"checkbox\",\n M extends MenuOptionGroupValue<Y> = MenuOptionGroupValue<Y>,\n> {\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: M\n /**\n * The type of the menu option group.\n */\n type?: Y\n /**\n * The value of the menu item group.\n */\n value?: M\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: M) => void\n}\n\nexport const useMenuOptionGroup = <\n Y extends \"checkbox\" | \"radio\" = \"checkbox\",\n M extends Y extends \"checkbox\" ? string[] : string = Y extends \"checkbox\"\n ? string[]\n : string,\n>({\n type = \"checkbox\" as Y,\n defaultValue = (type === \"checkbox\" ? [] : \"\") as M,\n value: valueProp,\n onChange: onChangeProp,\n}: UseMenuOptionGroupProps<Y, M>) => {\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const radio = type === \"radio\"\n\n const onChange = useCallback(\n (selectedValue: string) => {\n setValue((prev) => {\n if (radio && isString(prev)) {\n return selectedValue as M\n } else if (!radio && isArray(prev)) {\n return (\n prev.includes(selectedValue)\n ? prev.filter((value) => value !== selectedValue)\n : prev.concat(selectedValue)\n ) as M\n } else {\n return prev\n }\n })\n },\n [radio, setValue],\n )\n\n useUpdateEffect(() => {\n setValue(valueProp!)\n }, [valueProp])\n\n return {\n type,\n value,\n onChange,\n }\n}\n\nexport type UseMenuOptionGroupReturn = ReturnType<typeof useMenuOptionGroup>\n\nexport interface UseMenuOptionItemProps extends UseMenuItemProps {\n /**\n * The value of the menu option item.\n */\n value: string\n}\n\nexport const useMenuOptionItem = ({\n disabled,\n value,\n ...rest\n}: UseMenuOptionItemProps) => {\n const { type, value: selectedValue, onChange } = useMenuOptionGroupContext()\n const { getItemProps } = useMenuItem({ disabled, value, ...rest })\n const radio = type === \"radio\" && isString(selectedValue)\n const checkbox = type === \"checkbox\" && isArray(selectedValue)\n const selected = radio\n ? value === selectedValue\n : checkbox\n ? selectedValue.includes(value)\n : false\n\n const getIndicatorProps: PropGetter = useCallback(\n ({ style, ...props } = {}) => ({\n style: { opacity: selected ? 1 : 0, ...style },\n ...props,\n }),\n [selected],\n )\n\n const getOptionItemProps: PropGetter = useCallback(\n (props = {}) =>\n getItemProps({\n role: radio ? \"menuitemradio\" : \"menuitemcheckbox\",\n ...props,\n onClick: handlerAll(props.onClick, () =>\n !disabled ? onChange?.(value) : noop,\n ),\n }),\n [disabled, getItemProps, onChange, radio, value],\n )\n\n return {\n type,\n selected,\n getIndicatorProps,\n getOptionItemProps,\n }\n}\n\nexport type UseMenuOptionItemReturn = ReturnType<typeof useMenuOptionItem>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-menu.js","names":["createContext","noop"],"sources":["../../../../src/components/menu/use-menu.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent, MouseEvent, RefObject } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { Descendant, Descendants } from \"../../hooks/use-descendants\"\nimport type { UseDisclosureProps } from \"../../hooks/use-disclosure\"\nimport { useCallback, useId, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport { useDisclosure } from \"../../hooks/use-disclosure\"\nimport {\n ariaAttr,\n assignRef,\n createContext,\n cx,\n dataAttr,\n handlerAll,\n isArray,\n isString,\n isTruthyDataAttr,\n mergeRefs,\n noop,\n runKeyAction,\n useUpdateEffect,\n} from \"../../utils\"\n\ntype SubMenuDirection = \"end\" | \"start\"\n\ninterface MenuDescendantProps {\n id: string\n}\ntype MenuDescendant = Descendant<HTMLDivElement, MenuDescendantProps>\n\nconst {\n DescendantsContext: MenuDescendantsContext,\n useDescendant: useMenuDescendant,\n useDescendantRegister: useMenuDescendantRegister,\n useDescendants: useMenuDescendants,\n} = createDescendants<HTMLDivElement, MenuDescendantProps>()\n\nexport { MenuDescendantsContext, useMenuDescendant, useMenuDescendants }\n\ninterface MenuContext extends Pick<\n UseMenuReturn,\n | \"onActiveDescendant\"\n | \"onClose\"\n | \"onCloseSubMenu\"\n | \"onOpen\"\n | \"onSelect\"\n | \"subMenu\"\n | \"subMenuDirection\"\n> {}\n\nconst [MenuContext, useMenuContext] = createContext<MenuContext>({\n name: \"MenuContext\",\n})\n\ninterface MenuGroupContext extends Pick<UseMenuGroupReturn, \"getLabelProps\"> {}\n\nconst [MenuGroupContext, useMenuGroupContext] = createContext<MenuGroupContext>(\n {\n name: \"MenuGroupContext\",\n },\n)\n\ninterface MainMenuContext {\n descendants: Descendants<HTMLDivElement, MenuDescendantProps>\n onActiveDescendant: (descendant?: MenuDescendant) => void\n onCloseRef: RefObject<() => void>\n onSelect: (value?: string, closeOnSelect?: boolean) => void\n closeOnSelect?: boolean\n}\n\nconst [MainMenuContext, useMainMenuContext] = createContext<MainMenuContext>({\n name: \"MainMenuContext\",\n strict: false,\n})\n\ninterface MenuOptionGroupContext {\n type: \"checkbox\" | \"radio\"\n value: string | string[]\n onChange?: (value: string) => void\n}\n\nconst [MenuOptionGroupContext, useMenuOptionGroupContext] =\n createContext<MenuOptionGroupContext>({\n name: \"MenuOptionGroupContext\",\n })\n\nexport {\n MainMenuContext,\n MenuContext,\n MenuGroupContext,\n MenuOptionGroupContext,\n useMainMenuContext,\n useMenuContext,\n useMenuGroupContext,\n useMenuOptionGroupContext,\n}\n\nexport interface UseMenuProps extends Omit<UseDisclosureProps, \"timing\"> {\n /**\n * If `true`, the menu item will be closed when selected.\n *\n * @default true\n */\n closeOnSelect?: boolean\n /**\n * If `true`, the menu will be disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * The direction of the sub menu.\n *\n * @default 'end'\n */\n subMenuDirection?: SubMenuDirection\n /**\n * Callback invoked when a menu item is selected.\n */\n onSelect?: (value?: string) => void\n}\n\nexport const useMenu = ({\n closeOnSelect,\n defaultOpen,\n disabled = false,\n open: openProp,\n subMenuDirection = \"end\",\n onClose: onCloseProp,\n onOpen: onOpenProp,\n onSelect: onSelectProp,\n}: UseMenuProps = {}) => {\n const triggerId = useId()\n const contentId = useId()\n const descendants = useMenuDescendants()\n const updateRef = useRef<() => void>(noop)\n const onCloseRef = useRef<() => void>(noop)\n const contentRef = useRef<HTMLDivElement>(null)\n const { open, onClose, onOpen } = useDisclosure({\n defaultOpen,\n open: openProp,\n onClose: onCloseProp,\n onOpen: onOpenProp,\n })\n const onCloseSubMenu = useCallback(() => onCloseRef.current(), [])\n const onActiveDescendant = useCallback(\n (\n descendant?: MenuDescendant,\n options: FocusOptions = { preventScroll: true },\n ) => {\n if (!contentRef.current || !descendant || disabled) return\n\n contentRef.current.setAttribute(\"aria-activedescendant\", descendant.id)\n\n descendants.active(descendant, options)\n },\n [descendants, disabled],\n )\n const { mainCloseOnSelect, subMenu, getSubMenuProps, onMainSelect } =\n useSubMenu({\n descendants,\n disabled,\n open,\n subMenuDirection,\n onActiveDescendant,\n onClose,\n onOpen,\n })\n\n closeOnSelect ??= mainCloseOnSelect ?? true\n\n const onSelect = useCallback(\n (value?: string, closeOnSelectProp = closeOnSelect) => {\n if (disabled) return\n\n onSelectProp?.(value)\n onMainSelect?.(value, closeOnSelectProp)\n\n if (!closeOnSelectProp) return\n\n onClose()\n },\n [closeOnSelect, disabled, onClose, onMainSelect, onSelectProp],\n )\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled) return\n\n ev.preventDefault()\n\n if (!open) onOpen()\n else onClose()\n },\n [disabled, onClose, onOpen, open],\n )\n\n const onContextMenu = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled) return\n\n ev.preventDefault()\n onOpen()\n updateRef.current()\n },\n [disabled, onOpen],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n if (disabled) return\n\n runKeyAction(ev, {\n ArrowDown: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n },\n ArrowUp: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledLastValue()\n\n onActiveDescendant(descendant)\n })\n },\n Enter: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n },\n Space: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n },\n })\n },\n [descendants, disabled, onActiveDescendant, onOpen],\n )\n\n const getTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n ...getSubMenuProps({\n id: triggerId,\n \"aria-controls\": open ? contentId : undefined,\n \"aria-disabled\": ariaAttr(disabled),\n \"aria-expanded\": open,\n \"aria-haspopup\": \"menu\",\n \"data-trigger\": dataAttr(true),\n role: \"button\",\n tabIndex: disabled ? -1 : 0,\n ...props,\n onClick: handlerAll(props.onClick, onClick),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n }),\n [contentId, disabled, getSubMenuProps, onClick, onKeyDown, open, triggerId],\n )\n\n const getContextTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n id: triggerId,\n \"aria-controls\": open ? contentId : undefined,\n \"aria-disabled\": ariaAttr(disabled),\n \"aria-expanded\": open,\n \"aria-haspopup\": \"menu\",\n \"data-trigger\": dataAttr(true),\n role: \"application\",\n ...props,\n onContextMenu: handlerAll(props.onContextMenu, onContextMenu),\n }),\n [contentId, disabled, onContextMenu, open, triggerId],\n )\n\n const getContentProps: PropGetter = useCallback(\n ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n id: contentId,\n \"aria-labelledby\": cx(ariaLabelledby, triggerId),\n role: \"menu\",\n ...props,\n ref: mergeRefs(ref, contentRef),\n }),\n [contentId, triggerId],\n )\n\n const getSeparatorProps: PropGetter = useCallback(\n (props) => ({ role: \"separator\", ...props }),\n [],\n )\n\n return {\n closeOnSelect,\n descendants,\n open,\n subMenu,\n subMenuDirection,\n updateRef,\n getContentProps,\n getContextTriggerProps,\n getSeparatorProps,\n getTriggerProps,\n onActiveDescendant,\n onClose,\n onCloseRef,\n onCloseSubMenu,\n onOpen,\n onSelect,\n }\n}\n\nexport type UseMenuReturn = ReturnType<typeof useMenu>\n\nexport interface UseSubMenuProps extends Omit<\n Required<UseDisclosureProps>,\n \"defaultOpen\" | \"timing\"\n> {\n descendants: Descendants<HTMLDivElement, MenuDescendantProps>\n onActiveDescendant: (descendant?: MenuDescendant) => void\n disabled?: boolean\n subMenuDirection?: SubMenuDirection\n}\n\nexport const useSubMenu = ({\n descendants,\n disabled = false,\n open,\n subMenuDirection = \"end\",\n onActiveDescendant,\n onClose,\n onOpen,\n}: UseSubMenuProps) => {\n const uuid = useId()\n const {\n closeOnSelect: mainCloseOnSelect,\n descendants: mainDescendants,\n onActiveDescendant: onActiveMainDescendant,\n onCloseRef,\n onSelect: onMainSelect,\n } = useMainMenuContext() ?? {}\n const subMenu = !!mainDescendants && !!onActiveMainDescendant\n const createRegister = useMenuDescendantRegister(mainDescendants)\n const triggerRef = useRef<HTMLDivElement>(null)\n\n const dataDisabled = useCallback((node?: HTMLDivElement | null) => {\n node ??= triggerRef.current\n\n if (!node) return false\n\n const dataDisabled = isTruthyDataAttr(node.getAttribute(\"data-disabled\"))\n\n return dataDisabled\n }, [])\n\n const ariaDisabled = useCallback((node?: HTMLDivElement | null) => {\n node ??= triggerRef.current\n\n if (!node) return false\n\n const ariaDisabled = isTruthyDataAttr(node.getAttribute(\"aria-disabled\"))\n\n return ariaDisabled\n }, [])\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (!subMenu) return\n\n ev.defaultPrevented = disabled || dataDisabled() || ariaDisabled()\n },\n [ariaDisabled, dataDisabled, disabled, subMenu],\n )\n\n const onMouseEnter = useCallback(() => {\n if (!subMenu || disabled || dataDisabled() || ariaDisabled()) return\n\n onOpen()\n }, [ariaDisabled, dataDisabled, disabled, onOpen, subMenu])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (!subMenu || disabled || dataDisabled() || ariaDisabled()) return\n\n const descendant = descendants.value(triggerRef.current)\n\n onActiveMainDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n [\n ariaDisabled,\n dataDisabled,\n descendants,\n disabled,\n onActiveMainDescendant,\n subMenu,\n ],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n if (!subMenu || disabled) return\n\n const currentDescendant = open ? descendants : mainDescendants\n const onActiveCurrentDescendant = open\n ? onActiveDescendant\n : onActiveMainDescendant\n\n runKeyAction(ev, {\n ArrowDown: () => {\n const descendant = currentDescendant.enabledNextValue(\n triggerRef.current,\n )\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n ArrowUp: () => {\n const descendant = currentDescendant.enabledPrevValue(\n triggerRef.current,\n )\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n End: () => {\n const descendant = currentDescendant.enabledLastValue()\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n Home: () => {\n const descendant = currentDescendant.enabledFirstValue()\n\n onActiveCurrentDescendant(descendant)\n\n ev.defaultPrevented = true\n },\n [subMenuDirection === \"end\" ? \"ArrowRight\" : \"ArrowLeft\"]: () => {\n onOpen()\n\n setTimeout(() => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n })\n\n ev.defaultPrevented = true\n },\n })\n },\n [\n subMenu,\n disabled,\n open,\n descendants,\n mainDescendants,\n onActiveDescendant,\n onActiveMainDescendant,\n subMenuDirection,\n onOpen,\n ],\n )\n\n assignRef(onCloseRef, onClose)\n\n const getSubMenuProps: PropGetter = useCallback(\n ({ id = uuid, ref, ...props } = {}) => {\n const getDisabled = (node: HTMLDivElement) =>\n disabled || dataDisabled(node) || ariaDisabled(node)\n const register = createRegister({ id, disabled: getDisabled })\n\n return {\n role: subMenu ? \"menuitem\" : \"button\",\n ...props,\n ref: mergeRefs(ref, triggerRef, register),\n onClick: handlerAll(onClick, props.onClick),\n onKeyDown: handlerAll(onKeyDown, props.onKeyDown),\n onMouseEnter: handlerAll(onMouseEnter, props.onMouseEnter),\n onMouseMove: handlerAll(onMouseMove, props.onMouseMove),\n }\n },\n [\n uuid,\n subMenu,\n createRegister,\n onClick,\n onKeyDown,\n onMouseEnter,\n onMouseMove,\n disabled,\n dataDisabled,\n ariaDisabled,\n ],\n )\n\n return { mainCloseOnSelect, subMenu, getSubMenuProps, onMainSelect }\n}\n\nexport type UseSubMenuReturn = ReturnType<typeof useSubMenu>\n\nexport interface UseMenuGroupProps extends HTMLProps {}\n\nexport const useMenuGroup = ({\n \"aria-labelledby\": ariaLabelledbyProp,\n ...rest\n}: UseMenuGroupProps) => {\n const labelId = useId()\n\n const getGroupProps: PropGetter = useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) =>\n mergeProps(\n {\n \"aria-labelledby\": cx(ariaLabelledbyProp, ariaLabelledby, labelId),\n role: \"group\",\n },\n rest,\n props,\n )(),\n [ariaLabelledbyProp, labelId, rest],\n )\n\n const getLabelProps: PropGetter<\"span\"> = useCallback(\n (props) => ({ id: labelId, role: \"presentation\", ...props }),\n [labelId],\n )\n\n return { getGroupProps, getLabelProps }\n}\n\nexport type UseMenuGroupReturn = ReturnType<typeof useMenuGroup>\n\nexport interface UseMenuItemProps extends HTMLProps {\n /**\n * If `true`, the menu item will be closed when selected.\n */\n closeOnSelect?: boolean\n /**\n * If `true`, the menu item will be disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * The value of the menu item.\n */\n value?: string\n}\n\nexport const useMenuItem = ({\n id,\n \"aria-disabled\": ariaDisabled,\n \"data-disabled\": dataDisabled,\n \"data-trigger\": dataTrigger,\n closeOnSelect,\n disabled = false,\n value,\n ...rest\n}: UseMenuItemProps) => {\n const trigger = isTruthyDataAttr(dataTrigger)\n const {\n subMenu,\n subMenuDirection,\n onActiveDescendant,\n onClose,\n onCloseSubMenu,\n onSelect,\n } = useMenuContext()\n const uuid = useId()\n const itemRef = useRef<HTMLDivElement>(null)\n const subMenuTrigger = subMenu && trigger\n\n id ??= uuid\n\n const { descendants, register } = useMenuDescendant({\n id,\n disabled: disabled || subMenuTrigger,\n })\n\n const onActive = useCallback(() => {\n if (disabled) return\n\n const descendant = descendants.value(itemRef.current)\n\n onActiveDescendant(descendant)\n }, [descendants, disabled, onActiveDescendant])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n runKeyAction(ev, {\n ArrowDown: () => {\n const descendant = descendants.enabledNextValue(itemRef.current)\n\n onActiveDescendant(descendant)\n },\n ArrowUp: () => {\n const descendant = descendants.enabledPrevValue(itemRef.current)\n\n onActiveDescendant(descendant)\n },\n End: () => {\n const descendant = descendants.enabledLastValue()\n\n onActiveDescendant(descendant)\n },\n Enter: () => onSelect(value, closeOnSelect),\n Home: () => {\n const descendant = descendants.enabledFirstValue()\n\n onActiveDescendant(descendant)\n },\n Space: () => onSelect(value, closeOnSelect),\n [subMenuDirection === \"end\" ? \"ArrowLeft\" : \"ArrowRight\"]: () => {\n if (!subMenu) return\n\n onClose()\n\n const descendant = descendants.firstValue()\n\n descendant?.node.focus()\n },\n })\n },\n [\n closeOnSelect,\n descendants,\n onActiveDescendant,\n onClose,\n onSelect,\n subMenu,\n subMenuDirection,\n value,\n ],\n )\n\n const getItemProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => {\n const {\n onClick: restOnClick,\n onFocus: restOnFocus,\n onKeyDown: restOnKeyDown,\n onMouseMove: restOnMouseMove,\n ...restProps\n } = rest\n const {\n onClick: propsOnClick,\n onFocus: propsOnFocus,\n onKeyDown: propsOnKeyDown,\n onMouseMove: propsOnMouseMove,\n ...itemProps\n } = props\n\n return mergeProps(\n {\n id,\n \"aria-disabled\": ariaDisabled ?? ariaAttr(disabled),\n \"data-disabled\": dataDisabled ?? dataAttr(disabled),\n role: \"menuitem\",\n tabIndex: -1,\n },\n restProps,\n itemProps,\n {\n ref: mergeRefs(ref, itemRef, register),\n onClick: handlerAll(propsOnClick, restOnClick, () =>\n onSelect(value, closeOnSelect),\n ),\n onFocus: handlerAll(propsOnFocus, restOnFocus, onActive),\n onKeyDown: handlerAll(propsOnKeyDown, restOnKeyDown, onKeyDown),\n onMouseMove: handlerAll(propsOnMouseMove, restOnMouseMove, () => {\n onCloseSubMenu()\n onActive()\n }),\n },\n )()\n },\n [\n id,\n ariaDisabled,\n disabled,\n dataDisabled,\n rest,\n register,\n onActive,\n onKeyDown,\n onSelect,\n value,\n closeOnSelect,\n onCloseSubMenu,\n ],\n )\n\n return {\n subMenuTrigger,\n getItemProps,\n }\n}\n\nexport type UseMenuItemReturn = ReturnType<typeof useMenuItem>\n\nexport type MenuOptionGroupType = \"checkbox\" | \"radio\"\nexport type MenuOptionGroupValue<Y extends MenuOptionGroupType> =\n Y extends \"checkbox\" ? string[] : string\n\nexport interface UseMenuOptionGroupProps<\n Y extends MenuOptionGroupType = \"checkbox\",\n M extends MenuOptionGroupValue<Y> = MenuOptionGroupValue<Y>,\n> {\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: M\n /**\n * The type of the menu option group.\n */\n type?: Y\n /**\n * The value of the menu item group.\n */\n value?: M\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: M) => void\n}\n\nexport const useMenuOptionGroup = <\n Y extends \"checkbox\" | \"radio\" = \"checkbox\",\n M extends Y extends \"checkbox\" ? string[] : string = Y extends \"checkbox\"\n ? string[]\n : string,\n>({\n type = \"checkbox\" as Y,\n defaultValue = (type === \"checkbox\" ? [] : \"\") as M,\n value: valueProp,\n onChange: onChangeProp,\n}: UseMenuOptionGroupProps<Y, M>) => {\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const radio = type === \"radio\"\n\n const onChange = useCallback(\n (selectedValue: string) => {\n setValue((prev) => {\n if (radio && isString(prev)) return selectedValue as M\n else if (!radio && isArray(prev))\n return (\n prev.includes(selectedValue)\n ? prev.filter((value) => value !== selectedValue)\n : prev.concat(selectedValue)\n ) as M\n else return prev\n })\n },\n [radio, setValue],\n )\n\n useUpdateEffect(() => {\n setValue(valueProp!)\n }, [valueProp])\n\n return {\n type,\n value,\n onChange,\n }\n}\n\nexport type UseMenuOptionGroupReturn = ReturnType<typeof useMenuOptionGroup>\n\nexport interface UseMenuOptionItemProps extends UseMenuItemProps {\n /**\n * The value of the menu option item.\n */\n value: string\n}\n\nexport const useMenuOptionItem = ({\n disabled,\n value,\n ...rest\n}: UseMenuOptionItemProps) => {\n const { type, value: selectedValue, onChange } = useMenuOptionGroupContext()\n const { getItemProps } = useMenuItem({ disabled, value, ...rest })\n const radio = type === \"radio\" && isString(selectedValue)\n const checkbox = type === \"checkbox\" && isArray(selectedValue)\n const selected = radio\n ? value === selectedValue\n : checkbox\n ? selectedValue.includes(value)\n : false\n\n const getIndicatorProps: PropGetter = useCallback(\n ({ style, ...props } = {}) => ({\n style: { opacity: selected ? 1 : 0, ...style },\n ...props,\n }),\n [selected],\n )\n\n const getOptionItemProps: PropGetter = useCallback(\n (props = {}) =>\n getItemProps({\n role: radio ? \"menuitemradio\" : \"menuitemcheckbox\",\n ...props,\n onClick: handlerAll(props.onClick, () =>\n !disabled ? onChange?.(value) : noop,\n ),\n }),\n [disabled, getItemProps, onChange, radio, value],\n )\n\n return {\n type,\n selected,\n getIndicatorProps,\n getOptionItemProps,\n }\n}\n\nexport type UseMenuOptionItemReturn = ReturnType<typeof useMenuOptionItem>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-native-select.js","names":[],"sources":["../../../../src/components/native-select/use-native-select.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { cloneElement, useCallback, useMemo } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { ariaAttr } from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface NativeSelectSharedItem extends Omit<\n HTMLProps<\"option\">,\n \"children\" | \"label\" | \"value\"\n> {\n label: string\n}\n\ninterface NativeSelectItemWithValue extends NativeSelectSharedItem {\n value?: HTMLProps<\"option\">[\"value\"]\n}\n\ninterface NativeSelectItemWithItems extends NativeSelectSharedItem {\n items: NativeSelectItemWithValue[]\n}\n\nexport type NativeSelectItem =\n | NativeSelectItemWithItems\n | NativeSelectItemWithValue\n\nexport interface UseNativeSelectProps extends HTMLProps<\"select\">, FieldProps {\n /**\n * If `true`, include placeholder in options.\n *\n * @default true\n */\n includePlaceholder?: boolean\n /**\n * If provided, generate options based on items.\n *\n * @default []\n */\n items?: NativeSelectItem[]\n /**\n * The placeholder for select.\n */\n placeholder?: string\n}\n\nexport const useNativeSelect = (props: UseNativeSelectProps = {}) => {\n const {\n props: {\n children,\n disabled,\n includePlaceholder = true,\n items = [],\n placeholder,\n readOnly,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n\n const computedChildren = useMemo(() => {\n let computedChildren: ReactNode = null\n\n if (children)
|
|
1
|
+
{"version":3,"file":"use-native-select.js","names":[],"sources":["../../../../src/components/native-select/use-native-select.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { cloneElement, useCallback, useMemo } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { ariaAttr } from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface NativeSelectSharedItem extends Omit<\n HTMLProps<\"option\">,\n \"children\" | \"label\" | \"value\"\n> {\n label: string\n}\n\ninterface NativeSelectItemWithValue extends NativeSelectSharedItem {\n value?: HTMLProps<\"option\">[\"value\"]\n}\n\ninterface NativeSelectItemWithItems extends NativeSelectSharedItem {\n items: NativeSelectItemWithValue[]\n}\n\nexport type NativeSelectItem =\n | NativeSelectItemWithItems\n | NativeSelectItemWithValue\n\nexport interface UseNativeSelectProps extends HTMLProps<\"select\">, FieldProps {\n /**\n * If `true`, include placeholder in options.\n *\n * @default true\n */\n includePlaceholder?: boolean\n /**\n * If provided, generate options based on items.\n *\n * @default []\n */\n items?: NativeSelectItem[]\n /**\n * The placeholder for select.\n */\n placeholder?: string\n}\n\nexport const useNativeSelect = (props: UseNativeSelectProps = {}) => {\n const {\n props: {\n children,\n disabled,\n includePlaceholder = true,\n items = [],\n placeholder,\n readOnly,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n\n const computedChildren = useMemo(() => {\n let computedChildren: ReactNode = null\n\n if (children) computedChildren = children\n else if (items.length)\n computedChildren = items.map((item, index) => {\n if (\"items\" in item) {\n const { items, label, ...rest } = item\n\n return cloneElement(<optgroup />, {\n key: index,\n children: items.map(({ label, ...rest }, index) =>\n cloneElement(<option aria-label={label} />, {\n key: index,\n children: label,\n ...rest,\n }),\n ),\n label,\n ...rest,\n })\n } else {\n const { label, ...rest } = item\n\n return cloneElement(<option aria-label={label} />, {\n key: index,\n children: label,\n ...rest,\n })\n }\n })\n\n return (\n <>\n {placeholder ? (\n <option hidden={!includePlaceholder} value=\"\">\n {placeholder}\n </option>\n ) : null}\n\n {computedChildren}\n </>\n )\n }, [children, items, placeholder, includePlaceholder])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({ ...dataProps, ...props }),\n [dataProps],\n )\n\n const getFieldProps: PropGetter<\"select\"> = useCallback(\n ({ ref, ...props } = {}) =>\n mergeProps(\n {\n disabled,\n readOnly,\n tabIndex: interactive ? undefined : -1,\n ...ariaProps,\n ...dataProps,\n \"aria-disabled\": ariaAttr(!interactive),\n \"aria-label\": placeholder,\n },\n {\n onBlur: eventProps.onBlur,\n onFocus: eventProps.onFocus,\n },\n rest,\n props,\n {\n ref,\n children: props.children ?? computedChildren,\n },\n )(),\n [\n interactive,\n ariaProps,\n computedChildren,\n dataProps,\n eventProps,\n rest,\n placeholder,\n disabled,\n readOnly,\n ],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props) => ({ ...dataProps, ...props }),\n [dataProps],\n )\n\n return { getFieldProps, getIconProps, getRootProps }\n}\n\nexport type UseNativeSelectReturn = ReturnType<typeof useNativeSelect>\n"],"mappings":";;;;;;;AAgDA,MAAa,mBAAmB,QAA8B,CAAC,MAAM;CACnE,MAAM,EACJ,OAAO,EACL,UACA,UACA,qBAAqB,MACrB,QAAQ,CAAC,GACT,aACA,UACA,GAAG,QAEL,WACA,WACA,eACE,cAAc,KAAK;CACvB,MAAM,cAAc,EAAE,YAAY;CAElC,MAAM,mBAAmB,cAAc;EACrC,IAAI,mBAA8B;EAElC,IAAI,UAAU,mBAAmB;OAC5B,IAAI,MAAM,QACb,mBAAmB,MAAM,KAAK,MAAM,UAAU;GAC5C,IAAI,WAAW,MAAM;IACnB,MAAM,EAAE,OAAO,OAAO,GAAG,SAAS;IAElC,OAAO,aAAa,oBAAC,YAAD,CAAW,CAAA,GAAG;KAChC,KAAK;KACL,UAAU,MAAM,KAAK,EAAE,OAAO,GAAG,QAAQ,UACvC,aAAa,oBAAC,UAAD,EAAQ,cAAY,MAAQ,CAAA,GAAG;MAC1C,KAAK;MACL,UAAU;MACV,GAAG;KACL,CAAC,CACH;KACA;KACA,GAAG;IACL,CAAC;GACH,OAAO;IACL,MAAM,EAAE,OAAO,GAAG,SAAS;IAE3B,OAAO,aAAa,oBAAC,UAAD,EAAQ,cAAY,MAAQ,CAAA,GAAG;KACjD,KAAK;KACL,UAAU;KACV,GAAG;IACL,CAAC;GACH;EACF,CAAC;EAEH,OACE,qBAAA,YAAA,EAAA,UAAA,CACG,cACC,oBAAC,UAAD;GAAQ,QAAQ,CAAC;GAAoB,OAAM;aACxC;EACK,CAAA,IACN,MAEH,gBACD,EAAA,CAAA;CAEN,GAAG;EAAC;EAAU;EAAO;EAAa;CAAkB,CAAC;CAErD,MAAM,eAA2B,aAC9B,WAAW;EAAE,GAAG;EAAW,GAAG;CAAM,IACrC,CAAC,SAAS,CACZ;CA2CA,OAAO;EAAE,eAzCmC,aACzC,EAAE,KAAK,GAAG,UAAU,CAAC,MACpB,WACE;GACE;GACA;GACA,UAAU,cAAc,KAAA,IAAY;GACpC,GAAG;GACH,GAAG;GACH,kBAAA,GAAA,cAAA,SAAA,CAA0B,CAAC,WAAW;GACtC,cAAc;EAChB,GACA;GACE,QAAQ,WAAW;GACnB,SAAS,WAAW;EACtB,GACA,MACA,OACA;GACE;GACA,UAAU,MAAM,YAAY;EAC9B,CACF,CAAC,CAAC,GACJ;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAQmB;EAAG,cALS,aAC9B,WAAW;GAAE,GAAG;GAAW,GAAG;EAAM,IACrC,CAAC,SAAS,CAGuB;EAAG;CAAa;AACrD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"native-table.js","names":[],"sources":["../../../../src/components/native-table/native-table.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n CSSProps,\n HTMLStyledProps,\n SimpleDirection,\n ThemeProps,\n} from \"../../core\"\nimport type { NativeTableStyle } from \"./native-table.style\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { nativeTableStyle } from \"./native-table.style\"\n\nexport interface NativeTableRootProps\n extends HTMLStyledProps<\"table\">, ThemeProps<NativeTableStyle> {\n /**\n * The CSS `table-layout` property.\n */\n layout?: CSSProps[\"tableLayout\"]\n /**\n * Whether to enable the scroll area.\n *\n * @default false\n */\n withScrollArea?: boolean\n /**\n * The props for the scroll area.\n */\n scrollAreaProps?: NativeTableAreaProps\n}\n\nconst {\n PropsContext: NativeTablePropsContext,\n usePropsContext: useNativeTablePropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<NativeTableRootProps, NativeTableStyle>(\n \"native-table\",\n nativeTableStyle,\n)\n\nexport { NativeTablePropsContext, useNativeTablePropsContext }\n\n/**\n * `NativeTable` is a component for efficiently organizing and displaying data.\n *\n * @see https://yamada-ui.com/docs/components/native-table\n */\nexport const NativeTableRoot = withProvider(\n ({ withScrollArea, scrollAreaProps, ...rest }) => {\n if (withScrollArea)
|
|
1
|
+
{"version":3,"file":"native-table.js","names":[],"sources":["../../../../src/components/native-table/native-table.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n CSSProps,\n HTMLStyledProps,\n SimpleDirection,\n ThemeProps,\n} from \"../../core\"\nimport type { NativeTableStyle } from \"./native-table.style\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { nativeTableStyle } from \"./native-table.style\"\n\nexport interface NativeTableRootProps\n extends HTMLStyledProps<\"table\">, ThemeProps<NativeTableStyle> {\n /**\n * The CSS `table-layout` property.\n */\n layout?: CSSProps[\"tableLayout\"]\n /**\n * Whether to enable the scroll area.\n *\n * @default false\n */\n withScrollArea?: boolean\n /**\n * The props for the scroll area.\n */\n scrollAreaProps?: NativeTableAreaProps\n}\n\nconst {\n PropsContext: NativeTablePropsContext,\n usePropsContext: useNativeTablePropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<NativeTableRootProps, NativeTableStyle>(\n \"native-table\",\n nativeTableStyle,\n)\n\nexport { NativeTablePropsContext, useNativeTablePropsContext }\n\n/**\n * `NativeTable` is a component for efficiently organizing and displaying data.\n *\n * @see https://yamada-ui.com/docs/components/native-table\n */\nexport const NativeTableRoot = withProvider(\n ({ withScrollArea, scrollAreaProps, ...rest }) => {\n if (withScrollArea)\n return (\n <NativeTableScrollArea {...scrollAreaProps}>\n <styled.table {...rest} />\n </NativeTableScrollArea>\n )\n else return <styled.table {...rest} />\n },\n \"root\",\n)(undefined, ({ layout: tableLayout, ...rest }) => ({\n tableLayout,\n ...rest,\n}))\n\ninterface NativeTableAreaProps\n extends HTMLStyledProps, ThemeProps<NativeTableStyle> {}\n\nconst NativeTableScrollArea = withContext<\"div\", NativeTableAreaProps>(\n \"div\",\n \"scrollArea\",\n)({ tabIndex: 0 })\n\nexport interface CaptionProps extends HTMLStyledProps<\"caption\"> {\n /**\n * The placement of the table caption.\n *\n * @default 'end'\n */\n placement?: SimpleDirection\n}\n\nexport const Caption = withContext<\"caption\", CaptionProps>(\n \"caption\",\n \"caption\",\n)(undefined, ({ placement = \"end\", ...rest }) => ({\n \"data-placement\": placement,\n captionSide: placement === \"end\" ? \"bottom\" : \"top\",\n ...rest,\n}))\n\nexport interface TheadProps extends HTMLStyledProps<\"thead\"> {}\n\nexport const Thead = withContext<\"thead\", TheadProps>(\"thead\", \"thead\")()\n\nexport interface TbodyProps extends HTMLStyledProps<\"tbody\"> {}\n\nexport const Tbody = withContext<\"tbody\", TbodyProps>(\"tbody\", \"tbody\")()\n\nexport interface TfootProps extends HTMLStyledProps<\"tfoot\"> {}\n\nexport const Tfoot = withContext<\"tfoot\", TfootProps>(\"tfoot\", \"tfoot\")()\n\nexport interface ColgroupProps extends HTMLStyledProps<\"colgroup\"> {}\n\nexport const Colgroup = withContext<\"colgroup\", ColgroupProps>(\n \"colgroup\",\n \"colgroup\",\n)()\n\nexport interface ColProps extends HTMLStyledProps<\"col\"> {}\n\nexport const Col = withContext<\"col\", ColProps>(\"col\", \"col\")()\n\nexport interface TrProps extends HTMLStyledProps<\"tr\"> {}\n\nexport const Tr = withContext<\"tr\", TrProps>(\"tr\", \"tr\")()\n\nexport interface ThProps extends HTMLStyledProps<\"th\"> {\n /**\n * Aligns the cell content to the right.\n *\n * @default false\n */\n numeric?: boolean\n}\n\nexport const Th = withContext<\"th\", ThProps>(\"th\", \"th\")(\n undefined,\n ({ numeric, ...rest }) => ({\n \"data-numeric\": numeric,\n ...rest,\n }),\n)\n\nexport interface TdProps extends HTMLStyledProps<\"td\"> {\n /**\n * Aligns the cell content to the right.\n *\n * @default false\n */\n numeric?: boolean\n}\n\nexport const Td = withContext<\"td\", TdProps>(\"td\", \"td\")(\n undefined,\n ({ numeric, ...rest }) => ({\n \"data-numeric\": numeric,\n ...rest,\n }),\n)\n"],"mappings":";;;;;;AA8BA,MAAM,EACJ,cAAc,yBACd,iBAAiB,4BACjB,aACA,iBACE,oBACF,gBACA,gBACF;;;;;;AASA,MAAa,kBAAkB,cAC5B,EAAE,gBAAgB,iBAAiB,GAAG,WAAW;CAChD,IAAI,gBACF,OACE,oBAAC,uBAAD;EAAuB,GAAI;YACzB,oBAAC,OAAO,OAAR,EAAc,GAAI,KAAO,CAAA;CACJ,CAAA;MAEtB,OAAO,oBAAC,OAAO,OAAR,EAAc,GAAI,KAAO,CAAA;AACvC,GACA,MACF,CAAC,CAAC,KAAA,IAAY,EAAE,QAAQ,aAAa,GAAG,YAAY;CAClD;CACA,GAAG;AACL,EAAE;AAKF,MAAM,wBAAwB,YAC5B,OACA,YACF,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC;AAWjB,MAAa,UAAU,YACrB,WACA,SACF,CAAC,CAAC,KAAA,IAAY,EAAE,YAAY,OAAO,GAAG,YAAY;CAChD,kBAAkB;CAClB,aAAa,cAAc,QAAQ,WAAW;CAC9C,GAAG;AACL,EAAE;AAIF,MAAa,QAAQ,YAAiC,SAAS,OAAO,CAAC,CAAC;AAIxE,MAAa,QAAQ,YAAiC,SAAS,OAAO,CAAC,CAAC;AAIxE,MAAa,QAAQ,YAAiC,SAAS,OAAO,CAAC,CAAC;AAIxE,MAAa,WAAW,YACtB,YACA,UACF,CAAC,CAAC;AAIF,MAAa,MAAM,YAA6B,OAAO,KAAK,CAAC,CAAC;AAI9D,MAAa,KAAK,YAA2B,MAAM,IAAI,CAAC,CAAC;AAWzD,MAAa,KAAK,YAA2B,MAAM,IAAI,CAAC,CACtD,KAAA,IACC,EAAE,SAAS,GAAG,YAAY;CACzB,gBAAgB;CAChB,GAAG;AACL,EACF;AAWA,MAAa,KAAK,YAA2B,MAAM,IAAI,CAAC,CACtD,KAAA,IACC,EAAE,SAAS,GAAG,YAAY;CACzB,gBAAgB;CAChB,GAAG;AACL,EACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notice.js","names":["Alert.Root","noop","Alert.Loading","Alert.Icon","Alert.Title","Alert.Description"],"sources":["../../../../src/components/notice/notice.tsx"],"sourcesContent":["\"use client\"\n\nimport type { RefObject } from \"react\"\nimport type { ToasterProps } from \"sonner\"\nimport type {\n HTMLStyledProps,\n NoticeCloseStrategy,\n NoticeConfig,\n NoticePlacement,\n} from \"../../core\"\nimport type { CloseButtonProps } from \"../close-button\"\nimport type { Controller, NoticeMethods } from \"./notice-provider\"\nimport type { NoticeStyle } from \"./notice.style\"\nimport type { UseNoticeOptions } from \"./use-notice\"\nimport { useCallback, useMemo, useState } from \"react\"\nimport { toast, Toaster } from \"sonner\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { assignRef, dataAttr, handlerAll, noop } from \"../../utils\"\nimport { Alert } from \"../alert\"\nimport { CloseButton } from \"../close-button\"\nimport { useNoticeContext } from \"./notice-provider\"\nimport { noticeStyle } from \"./notice.style\"\n\ntype ToasterPosition = Required<ToasterProps>[\"position\"]\n\nexport const PLACEMENT_MAP: {\n [key in NoticePlacement]: ToasterPosition\n} = {\n end: \"bottom-center\",\n \"end-center\": \"bottom-center\",\n \"end-end\": \"bottom-right\",\n \"end-start\": \"bottom-left\",\n start: \"top-center\",\n \"start-center\": \"top-center\",\n \"start-end\": \"top-right\",\n \"start-start\": \"top-left\",\n}\n\nexport interface NoticeRootProps extends Pick<\n Required<NoticeConfig>,\n \"expand\" | \"limit\" | \"placement\"\n> {\n ref: RefObject<Controller>\n}\n\nconst {\n PropsContext: NoticePropsContext,\n usePropsContext: useNoticePropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<NoticeRootProps, NoticeStyle>(\"notice\", noticeStyle)\n\nexport { NoticePropsContext, useNoticePropsContext }\n\nexport const NoticeRoot = withProvider<\"fragment\", NoticeRootProps>(\n ({ ref, expand, limit, placement, ...rest }) => {\n const { getId } = useNoticeContext()\n const position = useMemo(() => PLACEMENT_MAP[placement], [placement])\n const [updatedLimit, setUpdatedLimit] = useState(limit)\n\n const getLimit = useCallback<NoticeMethods[\"getLimit\"]>(\n (target) => {\n if (target === placement && updatedLimit !== limit)
|
|
1
|
+
{"version":3,"file":"notice.js","names":["Alert.Root","noop","Alert.Loading","Alert.Icon","Alert.Title","Alert.Description"],"sources":["../../../../src/components/notice/notice.tsx"],"sourcesContent":["\"use client\"\n\nimport type { RefObject } from \"react\"\nimport type { ToasterProps } from \"sonner\"\nimport type {\n HTMLStyledProps,\n NoticeCloseStrategy,\n NoticeConfig,\n NoticePlacement,\n} from \"../../core\"\nimport type { CloseButtonProps } from \"../close-button\"\nimport type { Controller, NoticeMethods } from \"./notice-provider\"\nimport type { NoticeStyle } from \"./notice.style\"\nimport type { UseNoticeOptions } from \"./use-notice\"\nimport { useCallback, useMemo, useState } from \"react\"\nimport { toast, Toaster } from \"sonner\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { assignRef, dataAttr, handlerAll, noop } from \"../../utils\"\nimport { Alert } from \"../alert\"\nimport { CloseButton } from \"../close-button\"\nimport { useNoticeContext } from \"./notice-provider\"\nimport { noticeStyle } from \"./notice.style\"\n\ntype ToasterPosition = Required<ToasterProps>[\"position\"]\n\nexport const PLACEMENT_MAP: {\n [key in NoticePlacement]: ToasterPosition\n} = {\n end: \"bottom-center\",\n \"end-center\": \"bottom-center\",\n \"end-end\": \"bottom-right\",\n \"end-start\": \"bottom-left\",\n start: \"top-center\",\n \"start-center\": \"top-center\",\n \"start-end\": \"top-right\",\n \"start-start\": \"top-left\",\n}\n\nexport interface NoticeRootProps extends Pick<\n Required<NoticeConfig>,\n \"expand\" | \"limit\" | \"placement\"\n> {\n ref: RefObject<Controller>\n}\n\nconst {\n PropsContext: NoticePropsContext,\n usePropsContext: useNoticePropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<NoticeRootProps, NoticeStyle>(\"notice\", noticeStyle)\n\nexport { NoticePropsContext, useNoticePropsContext }\n\nexport const NoticeRoot = withProvider<\"fragment\", NoticeRootProps>(\n ({ ref, expand, limit, placement, ...rest }) => {\n const { getId } = useNoticeContext()\n const position = useMemo(() => PLACEMENT_MAP[placement], [placement])\n const [updatedLimit, setUpdatedLimit] = useState(limit)\n\n const getLimit = useCallback<NoticeMethods[\"getLimit\"]>(\n (target) => {\n if (target === placement && updatedLimit !== limit) return updatedLimit\n else return limit\n },\n [placement, limit, updatedLimit],\n )\n\n const updateLimit = useCallback<NoticeMethods[\"updateLimit\"]>(\n ({ limit, placement: target }) => {\n if (target === placement) setUpdatedLimit(limit)\n },\n [placement],\n )\n\n assignRef(ref.current.updateLimit, updateLimit)\n assignRef(ref.current.getLimit, getLimit)\n\n return (\n <styled.div {...rest}>\n <Toaster\n id={getId(placement)}\n containerAriaLabel=\"\"\n expand={expand}\n gap={16}\n hotkey={[\"\"]}\n mobileOffset=\"var(--mobile-offset)\"\n offset=\"var(--offset)\"\n position={position}\n visibleToasts={updatedLimit}\n />\n </styled.div>\n )\n },\n \"root\",\n)()\n\nexport interface NoticeItemProps\n extends UseNoticeOptions, Omit<HTMLStyledProps, \"id\" | \"title\"> {\n closeStrategies?: NoticeCloseStrategy[]\n}\n\nexport const NoticeItem = withContext<\"div\", NoticeItemProps>(\n ({\n id,\n variant = \"plain\",\n closable,\n closeStrategies = [\"click\", \"drag\"],\n description,\n loadingScheme,\n status,\n title,\n withIcon = true,\n closeButtonProps,\n contentProps,\n descriptionProps,\n iconProps,\n loadingProps,\n titleProps,\n onClick,\n ...rest\n }) => {\n const onClose = useCallback(() => toast.dismiss(id), [id])\n\n return (\n <Alert.Root\n variant={variant}\n status={status}\n {...rest}\n onClick={handlerAll(\n onClick,\n closable && closeStrategies.includes(\"click\") ? onClose : noop,\n )}\n >\n {withIcon ? (\n loadingScheme ? (\n <Alert.Loading loadingScheme={loadingScheme} {...loadingProps} />\n ) : (\n <Alert.Icon {...iconProps} />\n )\n ) : null}\n\n <NoticeContent\n data-close-button={dataAttr(\n closable && closeStrategies.includes(\"button\"),\n )}\n {...contentProps}\n >\n {title ? (\n <Alert.Title me=\"0\" {...titleProps}>\n {title}\n </Alert.Title>\n ) : null}\n {description ? (\n <Alert.Description lineClamp={2} {...descriptionProps}>\n {description}\n </Alert.Description>\n ) : null}\n </NoticeContent>\n\n {closable && closeStrategies.includes(\"button\") ? (\n <NoticeCloseButton\n data-variant={variant}\n {...closeButtonProps}\n onClick={handlerAll(closeButtonProps?.onClick, onClose)}\n />\n ) : null}\n </Alert.Root>\n )\n },\n \"item\",\n)()\n\nexport interface NoticeContentProps extends HTMLStyledProps {}\n\nexport const NoticeContent = withContext<\"div\", NoticeContentProps>(\n \"div\",\n \"content\",\n)()\n\nexport interface NoticeCloseButtonProps extends CloseButtonProps {}\n\nexport const NoticeCloseButton = withContext<\"button\", NoticeCloseButtonProps>(\n CloseButton,\n \"closeButton\",\n)()\n"],"mappings":";;;;;;;;;;;;;AAyBA,MAAa,gBAET;CACF,KAAK;CACL,cAAc;CACd,WAAW;CACX,aAAa;CACb,OAAO;CACP,gBAAgB;CAChB,aAAa;CACb,eAAe;AACjB;AASA,MAAM,EACJ,cAAc,oBACd,iBAAiB,uBACjB,aACA,iBACE,oBAAkD,UAAU,WAAW;AAI3E,MAAa,aAAa,cACvB,EAAE,KAAK,QAAQ,OAAO,WAAW,GAAG,WAAW;CAC9C,MAAM,EAAE,UAAU,iBAAiB;CACnC,MAAM,WAAW,cAAc,cAAc,YAAY,CAAC,SAAS,CAAC;CACpE,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CAEtD,MAAM,WAAW,aACd,WAAW;EACV,IAAI,WAAW,aAAa,iBAAiB,OAAO,OAAO;OACtD,OAAO;CACd,GACA;EAAC;EAAW;EAAO;CAAY,CACjC;CAEA,MAAM,cAAc,aACjB,EAAE,OAAO,WAAW,aAAa;EAChC,IAAI,WAAW,WAAW,gBAAgB,KAAK;CACjD,GACA,CAAC,SAAS,CACZ;CAEA,UAAU,IAAI,QAAQ,aAAa,WAAW;CAC9C,UAAU,IAAI,QAAQ,UAAU,QAAQ;CAExC,OACE,oBAAC,OAAO,KAAR;EAAY,GAAI;YACd,oBAAC,SAAD;GACE,IAAI,MAAM,SAAS;GACnB,oBAAmB;GACX;GACR,KAAK;GACL,QAAQ,CAAC,EAAE;GACX,cAAa;GACb,QAAO;GACG;GACV,eAAe;EAChB,CAAA;CACS,CAAA;AAEhB,GACA,MACF,CAAC,CAAC;AAOF,MAAa,aAAa,aACvB,EACC,IACA,UAAU,SACV,UACA,kBAAkB,CAAC,SAAS,MAAM,GAClC,aACA,eACA,QACA,OACA,WAAW,MACX,kBACA,cACA,kBACA,WACA,cACA,YACA,SACA,GAAG,WACC;CACJ,MAAM,UAAU,kBAAkB,MAAM,QAAQ,EAAE,GAAG,CAAC,EAAE,CAAC;CAEzD,OACE,qBAACA,WAAD;EACW;EACD;EACR,GAAI;EACJ,UAAA,GAAA,cAAA,WAAA,CACE,SACA,YAAY,gBAAgB,SAAS,OAAO,IAAI,UAAUC,cAAAA,IAC5D;YAPF;GASG,WACC,gBACE,oBAACC,cAAD;IAA8B;IAAe,GAAI;GAAe,CAAA,IAEhE,oBAACC,WAAD,EAAY,GAAI,UAAY,CAAA,IAE5B;GAEJ,qBAAC,eAAD;IACE,sBAAA,GAAA,cAAA,SAAA,CACE,YAAY,gBAAgB,SAAS,QAAQ,CAC/C;IACA,GAAI;cAJN,CAMG,QACC,oBAACC,YAAD;KAAa,IAAG;KAAI,GAAI;eACrB;IACU,CAAA,IACX,MACH,cACC,oBAACC,kBAAD;KAAmB,WAAW;KAAG,GAAI;eAClC;IACgB,CAAA,IACjB,IACS;;GAEd,YAAY,gBAAgB,SAAS,QAAQ,IAC5C,oBAAC,mBAAD;IACE,gBAAc;IACd,GAAI;IACJ,UAAA,GAAA,cAAA,WAAA,CAAoB,kBAAkB,SAAS,OAAO;GACvD,CAAA,IACC;EACM;;AAEhB,GACA,MACF,CAAC,CAAC;AAIF,MAAa,gBAAgB,YAC3B,OACA,SACF,CAAC,CAAC;AAIF,MAAa,oBAAoB,YAC/B,aACA,aACF,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-number-input.js","names":[],"sources":["../../../../src/components/number-input/use-number-input.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { UseCounterProps } from \"../../hooks/use-counter\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useMemo, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useCounter } from \"../../hooks/use-counter\"\nimport { useEventListener } from \"../../hooks/use-event-listener\"\nimport {\n ariaAttr,\n isComposing,\n mergeRefs,\n runKeyAction,\n useSafeLayoutEffect,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { useNumberCounter } from \"./use-number-counter\"\n\nconst defaultFormat = (value: number | string) => value.toString()\n\nconst defaultParse = (value: string) => value\n\nconst isDefaultValidCharacter = (char: string) => /^[Ee0-9+\\-.]$/.test(char)\n\nconst isValidNumericKeyboardEvent = (\n { key, altKey, ctrlKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n const modifierKey = ctrlKey || altKey || metaKey\n const singleCharacterKey = key.length === 1\n\n if (!singleCharacterKey || modifierKey) return true\n\n return isValid(key)\n}\n\nconst getStepRatio = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n metaKey,\n shiftKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\nexport interface UseNumberInputProps\n extends\n Omit<HTMLProps<\"input\">, keyof UseCounterProps>,\n UseCounterProps,\n FieldProps {\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the button.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: number | string) => string\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: number | string) => string | undefined\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n}\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n props: {\n allowMouseWheel,\n clampValueOnBlur = true,\n defaultValue,\n disabled,\n focusInputOnChange = true,\n format = defaultFormat,\n getAriaValueText,\n isValidCharacter = isDefaultValidCharacter,\n keepWithinRange = true,\n max: maxValue = Number.MAX_SAFE_INTEGER,\n min: minValue = Number.MIN_SAFE_INTEGER,\n parse = defaultParse,\n precision,\n readOnly,\n step = 1,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n const inputRef = useRef<HTMLInputElement>(null)\n const {\n cast,\n max,\n min,\n out,\n setValue,\n update,\n value,\n valueAsNumber,\n ...counter\n } = useCounter({\n defaultValue,\n keepWithinRange,\n max: maxValue,\n min: minValue,\n precision,\n step,\n value: valueProp,\n onChange: onChangeProp,\n })\n const selectionRef = useRef<null | {\n end: null | number\n start: null | number\n }>(null)\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const increment = useCallback(\n (value: number = step) => {\n if (!interactive) return\n\n counter.increment(value)\n\n if (!focusInputOnChange) return\n\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n },\n [interactive, counter, step, focusInputOnChange],\n )\n\n const decrement = useCallback(\n (value: number = step) => {\n if (!interactive) return\n\n counter.decrement(value)\n\n if (!focusInputOnChange) return\n\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n },\n [interactive, counter, step, focusInputOnChange],\n )\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (isComposing(ev)) return\n\n const { selectionEnd, selectionStart, value } = ev.currentTarget\n\n update(sanitize(parse(value)))\n\n selectionRef.current = { end: selectionEnd, start: selectionStart }\n },\n [parse, sanitize, update],\n )\n\n const onFocus = useCallback((ev: FocusEvent<HTMLInputElement>) => {\n if (!selectionRef.current) return\n\n const { end, start } = selectionRef.current\n const { selectionStart, value } = ev.currentTarget\n\n ev.currentTarget.selectionStart = start ?? value.length\n ev.currentTarget.selectionEnd = end ?? selectionStart\n }, [])\n\n const onBlur = useCallback(() => {\n if (!clampValueOnBlur) return\n\n let nextValue = value\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < minValue) nextValue = minValue\n\n if (valueAsNumber > maxValue) nextValue = maxValue\n\n cast(nextValue)\n }\n }, [\n cast,\n clampValueOnBlur,\n maxValue,\n minValue,\n setValue,\n value,\n valueAsNumber,\n ])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n if (isComposing(ev)) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const stepValue = getStepRatio(ev) * step\n\n runKeyAction(ev, {\n ArrowDown: () => decrement(stepValue),\n ArrowUp: () => increment(stepValue),\n End: () => update(maxValue),\n Home: () => update(minValue),\n })\n },\n [decrement, increment, isValidCharacter, maxValue, minValue, step, update],\n )\n\n const { getDecrementProps, getIncrementProps } = useNumberCounter({\n \"aria-disabled\": ariaAttr(!interactive),\n decrement,\n disabled,\n increment,\n keepWithinRange,\n max,\n min,\n ...dataProps,\n })\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n setValue(sanitize(parse(inputRef.current.value)))\n }, [parse, sanitize])\n\n useEventListener(\n inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const focused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !focused) return\n\n ev.preventDefault()\n\n const stepValue = getStepRatio(ev) * step\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) {\n increment(stepValue)\n } else if (direction === 1) {\n decrement(stepValue)\n }\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ ref, ...props } = {}) => {\n const { ref: restRef, ...restWithoutRef } = rest\n\n return mergeProps(\n {\n ...ariaProps,\n ...dataProps,\n type: \"text\",\n \"aria-invalid\": ariaAttr(ariaProps[\"aria-invalid\"] ?? out),\n \"aria-valuemax\": maxValue,\n \"aria-valuemin\": minValue,\n \"aria-valuenow\": Number.isNaN(valueAsNumber)\n ? undefined\n : valueAsNumber,\n \"aria-valuetext\": valueText,\n autoComplete: \"off\",\n autoCorrect: \"off\",\n disabled,\n inputMode: \"decimal\",\n max: maxValue,\n min: minValue,\n pattern: \"[0-9]*(.[0-9]+)?\",\n readOnly,\n role: \"spinbutton\",\n step,\n value: format(value),\n },\n restWithoutRef,\n eventProps,\n props,\n {\n ref: mergeRefs(ref, restRef, inputRef),\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n },\n )()\n },\n [\n format,\n out,\n value,\n valueText,\n ariaProps,\n dataProps,\n eventProps,\n maxValue,\n minValue,\n valueAsNumber,\n disabled,\n readOnly,\n step,\n rest,\n onKeyDown,\n onBlur,\n onFocus,\n onChange,\n ],\n )\n\n return { getDecrementProps, getIncrementProps, getInputProps }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-number-input.js","names":[],"sources":["../../../../src/components/number-input/use-number-input.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { UseCounterProps } from \"../../hooks/use-counter\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useMemo, useRef } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useCounter } from \"../../hooks/use-counter\"\nimport { useEventListener } from \"../../hooks/use-event-listener\"\nimport {\n ariaAttr,\n isComposing,\n mergeRefs,\n runKeyAction,\n useSafeLayoutEffect,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { useNumberCounter } from \"./use-number-counter\"\n\nconst defaultFormat = (value: number | string) => value.toString()\n\nconst defaultParse = (value: string) => value\n\nconst isDefaultValidCharacter = (char: string) => /^[Ee0-9+\\-.]$/.test(char)\n\nconst isValidNumericKeyboardEvent = (\n { key, altKey, ctrlKey, metaKey }: KeyboardEvent,\n isValid: (key: string) => boolean,\n) => {\n const modifierKey = ctrlKey || altKey || metaKey\n const singleCharacterKey = key.length === 1\n\n if (!singleCharacterKey || modifierKey) return true\n\n return isValid(key)\n}\n\nconst getStepRatio = <Y extends KeyboardEvent | WheelEvent>({\n ctrlKey,\n metaKey,\n shiftKey,\n}: Y) => {\n let ratio = 1\n\n if (metaKey || ctrlKey) ratio = 0.1\n\n if (shiftKey) ratio = 10\n\n return ratio\n}\n\nexport interface UseNumberInputProps\n extends\n Omit<HTMLProps<\"input\">, keyof UseCounterProps>,\n UseCounterProps,\n FieldProps {\n /**\n * If `true`, the input's value will change based on mouse wheel.\n *\n * @default false\n */\n allowMouseWheel?: boolean\n /**\n * This controls the value update when you blur out of the input.\n * - If `true` and the value is greater than `max`, the value will be reset to `max`.\n * - Else, the value remains the same.\n *\n * @default true\n */\n clampValueOnBlur?: boolean\n /**\n * If `true`, the input will be focused as you increment or decrement the value with the button.\n *\n * @default true\n */\n focusInputOnChange?: boolean\n /**\n * If using a custom display format, this converts the default format to the custom format.\n */\n format?: (value: number | string) => string\n /**\n * This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n *\n * It is used to set the `aria-valuetext` property of the input.\n */\n getAriaValueText?: (value: number | string) => string | undefined\n /**\n * Whether the pressed key should be allowed in the input.\n * The default behavior is to allow DOM floating point characters defined by /^[Ee0-9+\\-.]$/.\n */\n isValidCharacter?: (value: string) => boolean\n /**\n * If using a custom display format, this converts the custom format to a format `parseFloat` understands.\n */\n parse?: (value: string) => string\n}\n\nexport const useNumberInput = (props: UseNumberInputProps = {}) => {\n const {\n props: {\n allowMouseWheel,\n clampValueOnBlur = true,\n defaultValue,\n disabled,\n focusInputOnChange = true,\n format = defaultFormat,\n getAriaValueText,\n isValidCharacter = isDefaultValidCharacter,\n keepWithinRange = true,\n max: maxValue = Number.MAX_SAFE_INTEGER,\n min: minValue = Number.MIN_SAFE_INTEGER,\n parse = defaultParse,\n precision,\n readOnly,\n step = 1,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n const inputRef = useRef<HTMLInputElement>(null)\n const {\n cast,\n max,\n min,\n out,\n setValue,\n update,\n value,\n valueAsNumber,\n ...counter\n } = useCounter({\n defaultValue,\n keepWithinRange,\n max: maxValue,\n min: minValue,\n precision,\n step,\n value: valueProp,\n onChange: onChangeProp,\n })\n const selectionRef = useRef<null | {\n end: null | number\n start: null | number\n }>(null)\n const valueText = useMemo(() => {\n let text = getAriaValueText?.(value)\n\n if (text != null) return text\n\n text = value.toString()\n\n return !text ? undefined : text\n }, [value, getAriaValueText])\n\n const sanitize = useCallback(\n (value: string) => value.split(\"\").filter(isValidCharacter).join(\"\"),\n [isValidCharacter],\n )\n\n const increment = useCallback(\n (value: number = step) => {\n if (!interactive) return\n\n counter.increment(value)\n\n if (!focusInputOnChange) return\n\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n },\n [interactive, counter, step, focusInputOnChange],\n )\n\n const decrement = useCallback(\n (value: number = step) => {\n if (!interactive) return\n\n counter.decrement(value)\n\n if (!focusInputOnChange) return\n\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n },\n [interactive, counter, step, focusInputOnChange],\n )\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (isComposing(ev)) return\n\n const { selectionEnd, selectionStart, value } = ev.currentTarget\n\n update(sanitize(parse(value)))\n\n selectionRef.current = { end: selectionEnd, start: selectionStart }\n },\n [parse, sanitize, update],\n )\n\n const onFocus = useCallback((ev: FocusEvent<HTMLInputElement>) => {\n if (!selectionRef.current) return\n\n const { end, start } = selectionRef.current\n const { selectionStart, value } = ev.currentTarget\n\n ev.currentTarget.selectionStart = start ?? value.length\n ev.currentTarget.selectionEnd = end ?? selectionStart\n }, [])\n\n const onBlur = useCallback(() => {\n if (!clampValueOnBlur) return\n\n let nextValue = value\n\n if (value === \"\") return\n\n const valueStartsWithE = /^[eE]/.test(value.toString())\n\n if (valueStartsWithE) {\n setValue(\"\")\n } else {\n if (valueAsNumber < minValue) nextValue = minValue\n\n if (valueAsNumber > maxValue) nextValue = maxValue\n\n cast(nextValue)\n }\n }, [\n cast,\n clampValueOnBlur,\n maxValue,\n minValue,\n setValue,\n value,\n valueAsNumber,\n ])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n if (isComposing(ev)) return\n\n if (!isValidNumericKeyboardEvent(ev, isValidCharacter))\n ev.preventDefault()\n\n const stepValue = getStepRatio(ev) * step\n\n runKeyAction(ev, {\n ArrowDown: () => decrement(stepValue),\n ArrowUp: () => increment(stepValue),\n End: () => update(maxValue),\n Home: () => update(minValue),\n })\n },\n [decrement, increment, isValidCharacter, maxValue, minValue, step, update],\n )\n\n const { getDecrementProps, getIncrementProps } = useNumberCounter({\n \"aria-disabled\": ariaAttr(!interactive),\n decrement,\n disabled,\n increment,\n keepWithinRange,\n max,\n min,\n ...dataProps,\n })\n\n useSafeLayoutEffect(() => {\n if (!inputRef.current) return\n\n const notInSync = inputRef.current.value != value\n\n if (!notInSync) return\n\n setValue(sanitize(parse(inputRef.current.value)))\n }, [parse, sanitize])\n\n useEventListener(\n inputRef.current,\n \"wheel\",\n (ev) => {\n const ownerDocument = inputRef.current?.ownerDocument ?? document\n const focused = ownerDocument.activeElement === inputRef.current\n\n if (!allowMouseWheel || !focused) return\n\n ev.preventDefault()\n\n const stepValue = getStepRatio(ev) * step\n const direction = Math.sign(ev.deltaY)\n\n if (direction === -1) increment(stepValue)\n else if (direction === 1) decrement(stepValue)\n },\n { passive: false },\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ ref, ...props } = {}) => {\n const { ref: restRef, ...restWithoutRef } = rest\n\n return mergeProps(\n {\n ...ariaProps,\n ...dataProps,\n type: \"text\",\n \"aria-invalid\": ariaAttr(ariaProps[\"aria-invalid\"] ?? out),\n \"aria-valuemax\": maxValue,\n \"aria-valuemin\": minValue,\n \"aria-valuenow\": Number.isNaN(valueAsNumber)\n ? undefined\n : valueAsNumber,\n \"aria-valuetext\": valueText,\n autoComplete: \"off\",\n autoCorrect: \"off\",\n disabled,\n inputMode: \"decimal\",\n max: maxValue,\n min: minValue,\n pattern: \"[0-9]*(.[0-9]+)?\",\n readOnly,\n role: \"spinbutton\",\n step,\n value: format(value),\n },\n restWithoutRef,\n eventProps,\n props,\n {\n ref: mergeRefs(ref, restRef, inputRef),\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n },\n )()\n },\n [\n format,\n out,\n value,\n valueText,\n ariaProps,\n dataProps,\n eventProps,\n maxValue,\n minValue,\n valueAsNumber,\n disabled,\n readOnly,\n step,\n rest,\n onKeyDown,\n onBlur,\n onFocus,\n onChange,\n ],\n )\n\n return { getDecrementProps, getIncrementProps, getInputProps }\n}\n\nexport type UseNumberInputReturn = ReturnType<typeof useNumberInput>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination.js","names":["ButtonGroup.Root","ButtonGroup.IconItem"],"sources":["../../../../src/components/pagination/pagination.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, ReactNode } from \"react\"\nimport type {\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { PaginationStyle } from \"./pagination.style\"\nimport type { Page, UsePaginationProps } from \"./use-pagination\"\nimport { cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { isNumber, runIfFn } from \"../../utils\"\nimport { ButtonGroup } from \"../button\"\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n ChevronsLeftIcon,\n ChevronsRightIcon,\n EllipsisIcon,\n} from \"../icon\"\nimport { paginationStyle } from \"./pagination.style\"\nimport {\n PaginationContext,\n usePagination,\n usePaginationContext,\n} from \"./use-pagination\"\n\nexport interface PaginationRootProps\n extends\n WithoutThemeProps<\n Omit<ButtonGroup.RootProps, \"onChange\" | \"page\">,\n PaginationStyle\n >,\n ThemeProps<PaginationStyle>,\n Omit<UsePaginationProps, \"boundaries\" | \"siblings\"> {\n /**\n * Number of elements visible on the left/right edges.\n *\n * @default 1\n */\n boundaries?: number\n /** Number of siblings displayed on the left/right side of selected page.\n *\n * @default 1\n */\n siblings?: number\n /**\n * If `true`, display the control buttons.\n *\n * @default true\n */\n withControls?: boolean\n /**\n * If `true`, display the edge buttons.\n *\n * @default false\n */\n withEdges?: boolean\n /**\n * Props for next of the control button element.\n */\n controlNextProps?: PaginationItemProps\n /**\n * Props for previous of the control button element.\n */\n controlPrevProps?: PaginationItemProps\n /**\n * Props for control button element.\n */\n controlProps?: PaginationItemProps\n /**\n * Props for end of the edge button element.\n */\n edgeEndProps?: PaginationItemProps\n /**\n * Props for edge button element.\n */\n edgeProps?: PaginationItemProps\n /**\n * Props for start of the edge button element.\n */\n edgeStartProps?: PaginationItemProps\n /**\n * Props for ellipsis of the element.\n */\n ellipsisProps?: PaginationItemProps\n /**\n * Props for item of the button element.\n */\n itemProps?: PaginationItemProps\n}\n\nconst {\n PropsContext: PaginationPropsContext,\n usePropsContext: usePaginationPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<PaginationRootProps, PaginationStyle>(\n \"pagination\",\n paginationStyle,\n)\n\nexport { PaginationPropsContext, usePaginationPropsContext }\n\n/**\n * `Pagination` is a component for managing the pagination and navigation of content.\n *\n * @see https://yamada-ui.com/docs/components/pagination\n */\nexport const PaginationRoot = withProvider<\n \"nav\",\n PaginationRootProps,\n \"size\" | \"variant\"\n>(\n ({\n size,\n variant,\n children,\n withControls = true,\n withEdges = false,\n controlNextProps,\n controlPrevProps,\n controlProps,\n edgeEndProps,\n edgeProps,\n edgeStartProps,\n ellipsisProps,\n itemProps,\n ...rest\n }) => {\n const {\n currentPage,\n disabled,\n range,\n total,\n getEndTriggerProps,\n getItemProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getRootProps,\n getStartTriggerProps,\n onChange,\n onChangeEnd,\n onChangeNext,\n onChangePrev,\n onChangeStart,\n } = usePagination(rest)\n const context = useMemo(\n () => ({\n currentPage,\n disabled,\n range,\n total,\n getEndTriggerProps,\n getItemProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getStartTriggerProps,\n onChange,\n onChangeEnd,\n onChangeNext,\n onChangePrev,\n onChangeStart,\n }),\n [\n currentPage,\n disabled,\n range,\n total,\n getEndTriggerProps,\n getItemProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getStartTriggerProps,\n onChange,\n onChangeEnd,\n onChangeNext,\n onChangePrev,\n onChangeStart,\n ],\n )\n const computedChildren = useMemo(() => {\n if (children) {\n return children\n } else {\n const children: ReactNode[] = []\n\n if (withEdges)\n children.push(\n <PaginationStartTrigger>\n <PaginationItem\n icon={<ChevronsLeftIcon />}\n {...mergeProps(edgeProps, edgeStartProps)()}\n />\n </PaginationStartTrigger>,\n )\n if (withControls)\n children.push(\n <PaginationPrevTrigger>\n <PaginationItem\n icon={<ChevronLeftIcon />}\n {...mergeProps(controlProps, controlPrevProps)()}\n />\n </PaginationPrevTrigger>,\n )\n\n children.push(\n <PaginationItems\n render={(page) =>\n isNumber(page) ? (\n <PaginationItem {...itemProps}>\n <styled.span role=\"presentation\">{page}</styled.span>\n </PaginationItem>\n ) : (\n <PaginationItem\n as=\"span\"\n icon={<EllipsisIcon />}\n {...ellipsisProps}\n />\n )\n }\n />,\n )\n\n if (withControls)\n children.push(\n <PaginationNextTrigger>\n <PaginationItem\n icon={<ChevronRightIcon />}\n {...mergeProps(controlProps, controlNextProps)()}\n />\n </PaginationNextTrigger>,\n )\n if (withEdges)\n children.push(\n <PaginationEndTrigger>\n <PaginationItem\n icon={<ChevronsRightIcon />}\n {...mergeProps(edgeProps, edgeEndProps)()}\n />\n </PaginationEndTrigger>,\n )\n\n return children\n }\n }, [\n children,\n withEdges,\n withControls,\n itemProps,\n ellipsisProps,\n edgeProps,\n edgeStartProps,\n edgeEndProps,\n controlProps,\n controlPrevProps,\n controlNextProps,\n ])\n\n return (\n <PaginationContext value={context}>\n <ButtonGroup.Root\n as=\"nav\"\n size={size}\n variant={variant}\n {...getRootProps()}\n >\n {computedChildren}\n </ButtonGroup.Root>\n </PaginationContext>\n )\n },\n \"root\",\n { transferProps: [\"variant\", \"size\"] },\n)()\n\nexport interface PaginationItemsProps {\n /**\n * The function used to generate children.\n * it will be called with page number or `\"ellipsis\"`.\n */\n children?: (page: Page) => ReactNode\n /**\n * The function used to generate children.\n * it will be called with page number or `\"ellipsis\"`.\n */\n render?: (page: Page) => ReactNode\n}\n\nexport const PaginationItems: FC<PaginationItemsProps> = ({\n children,\n render,\n}) => {\n const { range, getItemProps } = usePaginationContext()\n\n return useMemo(\n () =>\n range.map((page, index) => {\n const component = children?.(page) ?? render?.(page)\n\n if (isValidElement<HTMLProps<\"button\">>(component)) {\n return cloneElement(component, {\n ...getItemProps({ key: index, page, ...component.props }),\n })\n } else {\n return component\n }\n }),\n [children, getItemProps, range, render],\n )\n}\n\nexport interface PaginationItemProps extends ButtonGroup.IconItemProps {}\n\nexport const PaginationItem = withContext<\"button\", PaginationItemProps>(\n ButtonGroup.IconItem,\n \"item\",\n)()\n\nexport interface PaginationTextProps extends Omit<\n HTMLStyledProps<\"span\">,\n \"children\"\n> {\n /**\n * The children of the text.\n * if function, it will be called with `{ page: number; total: number }`.\n */\n children?: ReactNodeOrFunction<{ page: number; total: number }>\n /**\n * The format of the text.\n *\n * @default 'compact'\n */\n format?: \"compact\" | \"short\"\n}\n\nexport const PaginationText = withContext<\"span\", PaginationTextProps>(\n \"span\",\n \"text\",\n)(undefined, ({ children, format = \"compact\", ...rest }) => {\n const { currentPage, total } = usePaginationContext()\n const { t } = useI18n(\"pagination\")\n const computedChildren = useMemo(() => {\n if (children) {\n return runIfFn(children, { page: currentPage, total })\n } else if (format === \"short\") {\n return t(\"{value} / {total}\", {\n total,\n value: currentPage,\n })\n } else {\n return t(\"{value} of {total}\", {\n total,\n value: currentPage,\n })\n }\n }, [children, currentPage, format, total, t])\n\n return {\n ...rest,\n children: computedChildren,\n }\n})\n\nexport interface PaginationStartTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationStartTrigger = withContext<\n \"button\",\n PaginationStartTriggerProps\n>(\"button\", { name: \"StartTrigger\", slot: [\"trigger\", \"start\"] })(\n undefined,\n (props) => {\n const { getStartTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getStartTriggerProps(props) }\n },\n)\n\nexport interface PaginationEndTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationEndTrigger = withContext<\n \"button\",\n PaginationEndTriggerProps\n>(\"button\", { name: \"EndTrigger\", slot: [\"trigger\", \"end\"] })(\n undefined,\n (props) => {\n const { getEndTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getEndTriggerProps(props) }\n },\n)\n\nexport interface PaginationPrevTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationPrevTrigger = withContext<\n \"button\",\n PaginationPrevTriggerProps\n>(\"button\", { name: \"PrevTrigger\", slot: [\"trigger\", \"prev\"] })(\n undefined,\n (props) => {\n const { getPrevTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getPrevTriggerProps(props) }\n },\n)\n\nexport interface PaginationNextTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationNextTrigger = withContext<\n \"button\",\n PaginationNextTriggerProps\n>(\"button\", { name: \"NextTrigger\", slot: [\"trigger\", \"next\"] })(\n undefined,\n (props) => {\n const { getNextTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getNextTriggerProps(props) }\n },\n)\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"pagination.js","names":["ButtonGroup.Root","ButtonGroup.IconItem"],"sources":["../../../../src/components/pagination/pagination.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, ReactNode } from \"react\"\nimport type {\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { PaginationStyle } from \"./pagination.style\"\nimport type { Page, UsePaginationProps } from \"./use-pagination\"\nimport { cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled } from \"../../core\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { isNumber, runIfFn } from \"../../utils\"\nimport { ButtonGroup } from \"../button\"\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n ChevronsLeftIcon,\n ChevronsRightIcon,\n EllipsisIcon,\n} from \"../icon\"\nimport { paginationStyle } from \"./pagination.style\"\nimport {\n PaginationContext,\n usePagination,\n usePaginationContext,\n} from \"./use-pagination\"\n\nexport interface PaginationRootProps\n extends\n WithoutThemeProps<\n Omit<ButtonGroup.RootProps, \"onChange\" | \"page\">,\n PaginationStyle\n >,\n ThemeProps<PaginationStyle>,\n Omit<UsePaginationProps, \"boundaries\" | \"siblings\"> {\n /**\n * Number of elements visible on the left/right edges.\n *\n * @default 1\n */\n boundaries?: number\n /** Number of siblings displayed on the left/right side of selected page.\n *\n * @default 1\n */\n siblings?: number\n /**\n * If `true`, display the control buttons.\n *\n * @default true\n */\n withControls?: boolean\n /**\n * If `true`, display the edge buttons.\n *\n * @default false\n */\n withEdges?: boolean\n /**\n * Props for next of the control button element.\n */\n controlNextProps?: PaginationItemProps\n /**\n * Props for previous of the control button element.\n */\n controlPrevProps?: PaginationItemProps\n /**\n * Props for control button element.\n */\n controlProps?: PaginationItemProps\n /**\n * Props for end of the edge button element.\n */\n edgeEndProps?: PaginationItemProps\n /**\n * Props for edge button element.\n */\n edgeProps?: PaginationItemProps\n /**\n * Props for start of the edge button element.\n */\n edgeStartProps?: PaginationItemProps\n /**\n * Props for ellipsis of the element.\n */\n ellipsisProps?: PaginationItemProps\n /**\n * Props for item of the button element.\n */\n itemProps?: PaginationItemProps\n}\n\nconst {\n PropsContext: PaginationPropsContext,\n usePropsContext: usePaginationPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<PaginationRootProps, PaginationStyle>(\n \"pagination\",\n paginationStyle,\n)\n\nexport { PaginationPropsContext, usePaginationPropsContext }\n\n/**\n * `Pagination` is a component for managing the pagination and navigation of content.\n *\n * @see https://yamada-ui.com/docs/components/pagination\n */\nexport const PaginationRoot = withProvider<\n \"nav\",\n PaginationRootProps,\n \"size\" | \"variant\"\n>(\n ({\n size,\n variant,\n children,\n withControls = true,\n withEdges = false,\n controlNextProps,\n controlPrevProps,\n controlProps,\n edgeEndProps,\n edgeProps,\n edgeStartProps,\n ellipsisProps,\n itemProps,\n ...rest\n }) => {\n const {\n currentPage,\n disabled,\n range,\n total,\n getEndTriggerProps,\n getItemProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getRootProps,\n getStartTriggerProps,\n onChange,\n onChangeEnd,\n onChangeNext,\n onChangePrev,\n onChangeStart,\n } = usePagination(rest)\n const context = useMemo(\n () => ({\n currentPage,\n disabled,\n range,\n total,\n getEndTriggerProps,\n getItemProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getStartTriggerProps,\n onChange,\n onChangeEnd,\n onChangeNext,\n onChangePrev,\n onChangeStart,\n }),\n [\n currentPage,\n disabled,\n range,\n total,\n getEndTriggerProps,\n getItemProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getStartTriggerProps,\n onChange,\n onChangeEnd,\n onChangeNext,\n onChangePrev,\n onChangeStart,\n ],\n )\n const computedChildren = useMemo(() => {\n if (children) {\n return children\n } else {\n const children: ReactNode[] = []\n\n if (withEdges)\n children.push(\n <PaginationStartTrigger>\n <PaginationItem\n icon={<ChevronsLeftIcon />}\n {...mergeProps(edgeProps, edgeStartProps)()}\n />\n </PaginationStartTrigger>,\n )\n if (withControls)\n children.push(\n <PaginationPrevTrigger>\n <PaginationItem\n icon={<ChevronLeftIcon />}\n {...mergeProps(controlProps, controlPrevProps)()}\n />\n </PaginationPrevTrigger>,\n )\n\n children.push(\n <PaginationItems\n render={(page) =>\n isNumber(page) ? (\n <PaginationItem {...itemProps}>\n <styled.span role=\"presentation\">{page}</styled.span>\n </PaginationItem>\n ) : (\n <PaginationItem\n as=\"span\"\n icon={<EllipsisIcon />}\n {...ellipsisProps}\n />\n )\n }\n />,\n )\n\n if (withControls)\n children.push(\n <PaginationNextTrigger>\n <PaginationItem\n icon={<ChevronRightIcon />}\n {...mergeProps(controlProps, controlNextProps)()}\n />\n </PaginationNextTrigger>,\n )\n if (withEdges)\n children.push(\n <PaginationEndTrigger>\n <PaginationItem\n icon={<ChevronsRightIcon />}\n {...mergeProps(edgeProps, edgeEndProps)()}\n />\n </PaginationEndTrigger>,\n )\n\n return children\n }\n }, [\n children,\n withEdges,\n withControls,\n itemProps,\n ellipsisProps,\n edgeProps,\n edgeStartProps,\n edgeEndProps,\n controlProps,\n controlPrevProps,\n controlNextProps,\n ])\n\n return (\n <PaginationContext value={context}>\n <ButtonGroup.Root\n as=\"nav\"\n size={size}\n variant={variant}\n {...getRootProps()}\n >\n {computedChildren}\n </ButtonGroup.Root>\n </PaginationContext>\n )\n },\n \"root\",\n { transferProps: [\"variant\", \"size\"] },\n)()\n\nexport interface PaginationItemsProps {\n /**\n * The function used to generate children.\n * it will be called with page number or `\"ellipsis\"`.\n */\n children?: (page: Page) => ReactNode\n /**\n * The function used to generate children.\n * it will be called with page number or `\"ellipsis\"`.\n */\n render?: (page: Page) => ReactNode\n}\n\nexport const PaginationItems: FC<PaginationItemsProps> = ({\n children,\n render,\n}) => {\n const { range, getItemProps } = usePaginationContext()\n\n return useMemo(\n () =>\n range.map((page, index) => {\n const component = children?.(page) ?? render?.(page)\n\n if (isValidElement<HTMLProps<\"button\">>(component))\n return cloneElement(component, {\n ...getItemProps({ key: index, page, ...component.props }),\n })\n else return component\n }),\n [children, getItemProps, range, render],\n )\n}\n\nexport interface PaginationItemProps extends ButtonGroup.IconItemProps {}\n\nexport const PaginationItem = withContext<\"button\", PaginationItemProps>(\n ButtonGroup.IconItem,\n \"item\",\n)()\n\nexport interface PaginationTextProps extends Omit<\n HTMLStyledProps<\"span\">,\n \"children\"\n> {\n /**\n * The children of the text.\n * if function, it will be called with `{ page: number; total: number }`.\n */\n children?: ReactNodeOrFunction<{ page: number; total: number }>\n /**\n * The format of the text.\n *\n * @default 'compact'\n */\n format?: \"compact\" | \"short\"\n}\n\nexport const PaginationText = withContext<\"span\", PaginationTextProps>(\n \"span\",\n \"text\",\n)(undefined, ({ children, format = \"compact\", ...rest }) => {\n const { currentPage, total } = usePaginationContext()\n const { t } = useI18n(\"pagination\")\n const computedChildren = useMemo(() => {\n if (children) return runIfFn(children, { page: currentPage, total })\n else if (format === \"short\")\n return t(\"{value} / {total}\", {\n total,\n value: currentPage,\n })\n else\n return t(\"{value} of {total}\", {\n total,\n value: currentPage,\n })\n }, [children, currentPage, format, total, t])\n\n return {\n ...rest,\n children: computedChildren,\n }\n})\n\nexport interface PaginationStartTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationStartTrigger = withContext<\n \"button\",\n PaginationStartTriggerProps\n>(\"button\", { name: \"StartTrigger\", slot: [\"trigger\", \"start\"] })(\n undefined,\n (props) => {\n const { getStartTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getStartTriggerProps(props) }\n },\n)\n\nexport interface PaginationEndTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationEndTrigger = withContext<\n \"button\",\n PaginationEndTriggerProps\n>(\"button\", { name: \"EndTrigger\", slot: [\"trigger\", \"end\"] })(\n undefined,\n (props) => {\n const { getEndTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getEndTriggerProps(props) }\n },\n)\n\nexport interface PaginationPrevTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationPrevTrigger = withContext<\n \"button\",\n PaginationPrevTriggerProps\n>(\"button\", { name: \"PrevTrigger\", slot: [\"trigger\", \"prev\"] })(\n undefined,\n (props) => {\n const { getPrevTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getPrevTriggerProps(props) }\n },\n)\n\nexport interface PaginationNextTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PaginationNextTrigger = withContext<\n \"button\",\n PaginationNextTriggerProps\n>(\"button\", { name: \"NextTrigger\", slot: [\"trigger\", \"next\"] })(\n undefined,\n (props) => {\n const { getNextTriggerProps } = usePaginationContext()\n\n return { asChild: true, ...getNextTriggerProps(props) }\n },\n)\n"],"mappings":";;;;;;;;;;;;;;;;;;AAgGA,MAAM,EACJ,cAAc,wBACd,iBAAiB,2BACjB,aACA,iBACE,oBACF,cACA,eACF;;;;;;AASA,MAAa,iBAAiB,cAK3B,EACC,MACA,SACA,UACA,eAAe,MACf,YAAY,OACZ,kBACA,kBACA,cACA,cACA,WACA,gBACA,eACA,WACA,GAAG,WACC;CACJ,MAAM,EACJ,aACA,UACA,OACA,OACA,oBACA,cACA,qBACA,qBACA,cACA,sBACA,UACA,aACA,cACA,cACA,kBACE,cAAc,IAAI;CACtB,MAAM,UAAU,eACP;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CACA,MAAM,mBAAmB,cAAc;EACrC,IAAI,UACF,OAAO;OACF;GACL,MAAM,WAAwB,CAAC;GAE/B,IAAI,WACF,SAAS,KACP,oBAAC,wBAAD,EAAA,UACE,oBAAC,gBAAD;IACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;IACzB,GAAI,WAAW,WAAW,cAAc,CAAC,CAAC;GAC3C,CAAA,EACqB,CAAA,CAC1B;GACF,IAAI,cACF,SAAS,KACP,oBAAC,uBAAD,EAAA,UACE,oBAAC,gBAAD;IACE,MAAM,oBAAC,iBAAD,CAAkB,CAAA;IACxB,GAAI,WAAW,cAAc,gBAAgB,CAAC,CAAC;GAChD,CAAA,EACoB,CAAA,CACzB;GAEF,SAAS,KACP,oBAAC,iBAAD,EACE,SAAS,UAAA,GAAA,cAAA,SAAA,CACE,IAAI,IACX,oBAAC,gBAAD;IAAgB,GAAI;cAClB,oBAAC,OAAO,MAAR;KAAa,MAAK;eAAgB;IAAkB,CAAA;GACtC,CAAA,IAEhB,oBAAC,gBAAD;IACE,IAAG;IACH,MAAM,oBAAC,cAAD,CAAe,CAAA;IACrB,GAAI;GACL,CAAA,EAGN,CAAA,CACH;GAEA,IAAI,cACF,SAAS,KACP,oBAAC,uBAAD,EAAA,UACE,oBAAC,gBAAD;IACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;IACzB,GAAI,WAAW,cAAc,gBAAgB,CAAC,CAAC;GAChD,CAAA,EACoB,CAAA,CACzB;GACF,IAAI,WACF,SAAS,KACP,oBAAC,sBAAD,EAAA,UACE,oBAAC,gBAAD;IACE,MAAM,oBAAC,mBAAD,CAAoB,CAAA;IAC1B,GAAI,WAAW,WAAW,YAAY,CAAC,CAAC;GACzC,CAAA,EACmB,CAAA,CACxB;GAEF,OAAO;EACT;CACF,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,mBAAD;EAAmB,OAAO;YACxB,oBAACA,iBAAD;GACE,IAAG;GACG;GACG;GACT,GAAI,aAAa;aAEhB;EACe,CAAA;CACD,CAAA;AAEvB,GACA,QACA,EAAE,eAAe,CAAC,WAAW,MAAM,EAAE,CACvC,CAAC,CAAC;AAeF,MAAa,mBAA6C,EACxD,UACA,aACI;CACJ,MAAM,EAAE,OAAO,iBAAiB,qBAAqB;CAErD,OAAO,cAEH,MAAM,KAAK,MAAM,UAAU;EACzB,MAAM,YAAY,WAAW,IAAI,KAAK,SAAS,IAAI;EAEnD,IAAI,eAAoC,SAAS,GAC/C,OAAO,aAAa,WAAW,EAC7B,GAAG,aAAa;GAAE,KAAK;GAAO;GAAM,GAAG,UAAU;EAAM,CAAC,EAC1D,CAAC;OACE,OAAO;CACd,CAAC,GACH;EAAC;EAAU;EAAc;EAAO;CAAM,CACxC;AACF;AAIA,MAAa,iBAAiB,YAC5BC,YACA,MACF,CAAC,CAAC;AAmBF,MAAa,iBAAiB,YAC5B,QACA,MACF,CAAC,CAAC,KAAA,IAAY,EAAE,UAAU,SAAS,WAAW,GAAG,WAAW;CAC1D,MAAM,EAAE,aAAa,UAAU,qBAAqB;CACpD,MAAM,EAAE,MAAM,QAAQ,YAAY;CAClC,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,QAAA,GAAA,cAAA,QAAA,CAAe,UAAU;GAAE,MAAM;GAAa;EAAM,CAAC;OAC9D,IAAI,WAAW,SAClB,OAAO,EAAE,qBAAqB;GAC5B;GACA,OAAO;EACT,CAAC;OAED,OAAO,EAAE,sBAAsB;GAC7B;GACA,OAAO;EACT,CAAC;CACL,GAAG;EAAC;EAAU;EAAa;EAAQ;EAAO;CAAC,CAAC;CAE5C,OAAO;EACL,GAAG;EACH,UAAU;CACZ;AACF,CAAC;AAID,MAAa,yBAAyB,YAGpC,UAAU;CAAE,MAAM;CAAgB,MAAM,CAAC,WAAW,OAAO;AAAE,CAAC,CAAC,CAC/D,KAAA,IACC,UAAU;CACT,MAAM,EAAE,yBAAyB,qBAAqB;CAEtD,OAAO;EAAE,SAAS;EAAM,GAAG,qBAAqB,KAAK;CAAE;AACzD,CACF;AAIA,MAAa,uBAAuB,YAGlC,UAAU;CAAE,MAAM;CAAc,MAAM,CAAC,WAAW,KAAK;AAAE,CAAC,CAAC,CAC3D,KAAA,IACC,UAAU;CACT,MAAM,EAAE,uBAAuB,qBAAqB;CAEpD,OAAO;EAAE,SAAS;EAAM,GAAG,mBAAmB,KAAK;CAAE;AACvD,CACF;AAIA,MAAa,wBAAwB,YAGnC,UAAU;CAAE,MAAM;CAAe,MAAM,CAAC,WAAW,MAAM;AAAE,CAAC,CAAC,CAC7D,KAAA,IACC,UAAU;CACT,MAAM,EAAE,wBAAwB,qBAAqB;CAErD,OAAO;EAAE,SAAS;EAAM,GAAG,oBAAoB,KAAK;CAAE;AACxD,CACF;AAIA,MAAa,wBAAwB,YAGnC,UAAU;CAAE,MAAM;CAAe,MAAM,CAAC,WAAW,MAAM;AAAE,CAAC,CAAC,CAC7D,KAAA,IACC,UAAU;CACT,MAAM,EAAE,wBAAwB,qBAAqB;CAErD,OAAO;EAAE,SAAS;EAAM,GAAG,oBAAoB,KAAK;CAAE;AACxD,CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-pagination.js","names":["createContext"],"sources":["../../../../src/components/pagination/use-pagination.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport { useCallback, useMemo } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { createContext, handlerAll, isNumber, mergeRefs } from \"../../utils\"\n\nexport type Page = \"ellipsis\" | number\n\ninterface PaginationContext extends Omit<UsePaginationReturn, \"getRootProps\"> {}\n\nconst [PaginationContext, usePaginationContext] =\n createContext<PaginationContext>({\n name: \"PaginationContext\",\n })\n\nexport { PaginationContext, usePaginationContext }\n\nexport interface UsePaginationProps extends Omit<\n HTMLProps,\n \"onChange\" | \"page\"\n> {\n /**\n * The total number of pages in pagination.\n */\n total: number\n /**\n * Number of elements visible on the left/right edges.\n *\n * @default 1\n */\n boundaries?: number\n /**\n * The initial page of the pagination.\n * Should be less than `total` and greater than `1`.\n *\n * @default 1\n */\n defaultPage?: number\n /**\n * If `true`, the pagination all item will be disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * The page of the pagination.\n * Should be less than `total` and greater than `1`.\n */\n page?: number\n /** Number of siblings displayed on the left/right side of selected page.\n *\n * @default 1\n */\n siblings?: number\n /**\n * The callback invoked when the page changes.\n */\n onChange?: (page: number) => void\n}\n\nexport const usePagination = ({\n boundaries = 1,\n defaultPage = 1,\n disabled = false,\n page,\n siblings = 1,\n total,\n onChange: onChangeProp,\n ...rest\n}: UsePaginationProps) => {\n const { ref: restRef, ...restProps } = rest\n const [currentPage, setCurrentPage] = useControllableState({\n defaultValue: defaultPage,\n value: page,\n onChange: onChangeProp,\n })\n const { t } = useI18n(\"pagination\")\n const range = useMemo((): Page[] => {\n const minimumTotal = siblings * 2 + 3 + boundaries * 2\n\n if (minimumTotal >= total) return computedRange(1, total)\n\n const prevSiblings = Math.max(currentPage - siblings, boundaries)\n const nextSiblings = Math.min(currentPage + siblings, total - boundaries)\n const prevDots = prevSiblings > boundaries + 2\n const nextDots = nextSiblings < total - (boundaries + 1)\n\n if (!prevDots && nextDots) {\n const prevPages = siblings * 2 + boundaries + 2\n\n return [\n ...computedRange(1, prevPages),\n \"ellipsis\",\n ...computedRange(total - (boundaries - 1), total),\n ]\n }\n\n if (prevDots && !nextDots) {\n const nextPages = boundaries + 1 + 2 * siblings\n\n return [\n ...computedRange(1, boundaries),\n \"ellipsis\",\n ...computedRange(total - nextPages, total),\n ]\n }\n\n return [\n ...computedRange(1, boundaries),\n \"ellipsis\",\n ...computedRange(prevSiblings, nextSiblings),\n \"ellipsis\",\n ...computedRange(total - boundaries + 1, total),\n ]\n }, [boundaries, siblings, currentPage, total])\n\n const onChange = useCallback(\n (page: number) => setCurrentPage(Math.max(1, Math.min(total, page))),\n [setCurrentPage, total],\n )\n\n const onChangeStart = useCallback(() => setCurrentPage(1), [setCurrentPage])\n\n const onChangeEnd = useCallback(\n () => setCurrentPage(total),\n [setCurrentPage, total],\n )\n\n const onChangePrev = useCallback(\n () => setCurrentPage((prev) => Math.max(1, prev - 1)),\n [setCurrentPage],\n )\n\n const onChangeNext = useCallback(\n () => setCurrentPage((prev) => Math.min(total, prev + 1)),\n [setCurrentPage, total],\n )\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n mergeProps(\n {\n \"aria-label\": t(\"Pagination\"),\n role: \"navigation\",\n },\n restProps,\n props,\n {\n ref: mergeRefs(ref, restRef),\n },\n )(),\n [restProps, restRef, t],\n )\n\n const getItemProps: PropGetter<\"button\", { page?: Page }> = useCallback(\n ({ page, ...props } = {}) => {\n if (isNumber(page))
|
|
1
|
+
{"version":3,"file":"use-pagination.js","names":["createContext"],"sources":["../../../../src/components/pagination/use-pagination.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport { useCallback, useMemo } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport { createContext, handlerAll, isNumber, mergeRefs } from \"../../utils\"\n\nexport type Page = \"ellipsis\" | number\n\ninterface PaginationContext extends Omit<UsePaginationReturn, \"getRootProps\"> {}\n\nconst [PaginationContext, usePaginationContext] =\n createContext<PaginationContext>({\n name: \"PaginationContext\",\n })\n\nexport { PaginationContext, usePaginationContext }\n\nexport interface UsePaginationProps extends Omit<\n HTMLProps,\n \"onChange\" | \"page\"\n> {\n /**\n * The total number of pages in pagination.\n */\n total: number\n /**\n * Number of elements visible on the left/right edges.\n *\n * @default 1\n */\n boundaries?: number\n /**\n * The initial page of the pagination.\n * Should be less than `total` and greater than `1`.\n *\n * @default 1\n */\n defaultPage?: number\n /**\n * If `true`, the pagination all item will be disabled.\n *\n * @default false\n */\n disabled?: boolean\n /**\n * The page of the pagination.\n * Should be less than `total` and greater than `1`.\n */\n page?: number\n /** Number of siblings displayed on the left/right side of selected page.\n *\n * @default 1\n */\n siblings?: number\n /**\n * The callback invoked when the page changes.\n */\n onChange?: (page: number) => void\n}\n\nexport const usePagination = ({\n boundaries = 1,\n defaultPage = 1,\n disabled = false,\n page,\n siblings = 1,\n total,\n onChange: onChangeProp,\n ...rest\n}: UsePaginationProps) => {\n const { ref: restRef, ...restProps } = rest\n const [currentPage, setCurrentPage] = useControllableState({\n defaultValue: defaultPage,\n value: page,\n onChange: onChangeProp,\n })\n const { t } = useI18n(\"pagination\")\n const range = useMemo((): Page[] => {\n const minimumTotal = siblings * 2 + 3 + boundaries * 2\n\n if (minimumTotal >= total) return computedRange(1, total)\n\n const prevSiblings = Math.max(currentPage - siblings, boundaries)\n const nextSiblings = Math.min(currentPage + siblings, total - boundaries)\n const prevDots = prevSiblings > boundaries + 2\n const nextDots = nextSiblings < total - (boundaries + 1)\n\n if (!prevDots && nextDots) {\n const prevPages = siblings * 2 + boundaries + 2\n\n return [\n ...computedRange(1, prevPages),\n \"ellipsis\",\n ...computedRange(total - (boundaries - 1), total),\n ]\n }\n\n if (prevDots && !nextDots) {\n const nextPages = boundaries + 1 + 2 * siblings\n\n return [\n ...computedRange(1, boundaries),\n \"ellipsis\",\n ...computedRange(total - nextPages, total),\n ]\n }\n\n return [\n ...computedRange(1, boundaries),\n \"ellipsis\",\n ...computedRange(prevSiblings, nextSiblings),\n \"ellipsis\",\n ...computedRange(total - boundaries + 1, total),\n ]\n }, [boundaries, siblings, currentPage, total])\n\n const onChange = useCallback(\n (page: number) => setCurrentPage(Math.max(1, Math.min(total, page))),\n [setCurrentPage, total],\n )\n\n const onChangeStart = useCallback(() => setCurrentPage(1), [setCurrentPage])\n\n const onChangeEnd = useCallback(\n () => setCurrentPage(total),\n [setCurrentPage, total],\n )\n\n const onChangePrev = useCallback(\n () => setCurrentPage((prev) => Math.max(1, prev - 1)),\n [setCurrentPage],\n )\n\n const onChangeNext = useCallback(\n () => setCurrentPage((prev) => Math.min(total, prev + 1)),\n [setCurrentPage, total],\n )\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n mergeProps(\n {\n \"aria-label\": t(\"Pagination\"),\n role: \"navigation\",\n },\n restProps,\n props,\n {\n ref: mergeRefs(ref, restRef),\n },\n )(),\n [restProps, restRef, t],\n )\n\n const getItemProps: PropGetter<\"button\", { page?: Page }> = useCallback(\n ({ page, ...props } = {}) => {\n if (isNumber(page))\n return {\n type: \"button\",\n \"aria-current\": currentPage === page ? \"page\" : undefined,\n \"aria-label\": t(\"Go to page {value}\", { value: page }),\n disabled,\n ...props,\n onClick: handlerAll(props.onClick, () => onChange(page)),\n }\n else return { ...props, \"data-ellipsis\": \"\" }\n },\n [currentPage, t, onChange, disabled],\n )\n\n const getStartTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n type: \"button\",\n \"aria-label\": t(\"Go to first page\"),\n disabled: disabled || currentPage === 1,\n ...props,\n onClick: handlerAll(props.onClick, onChangeStart),\n }),\n [onChangeStart, t, disabled, currentPage],\n )\n\n const getEndTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n type: \"button\",\n \"aria-label\": t(\"Go to last page\"),\n disabled: disabled || currentPage === total,\n ...props,\n onClick: handlerAll(props.onClick, onChangeEnd),\n }),\n [onChangeEnd, t, disabled, currentPage, total],\n )\n\n const getPrevTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n type: \"button\",\n \"aria-label\": t(\"Go to previous page\"),\n disabled: disabled || currentPage === 1,\n ...props,\n onClick: handlerAll(props.onClick, onChangePrev),\n }),\n [onChangePrev, t, disabled, currentPage],\n )\n\n const getNextTriggerProps: PropGetter<\"button\"> = useCallback(\n (props = {}) => ({\n type: \"button\",\n \"aria-label\": t(\"Go to next page\"),\n disabled: disabled || currentPage === total,\n ...props,\n onClick: handlerAll(props.onClick, onChangeNext),\n }),\n [onChangeNext, t, disabled, currentPage, total],\n )\n\n return {\n currentPage,\n disabled,\n range,\n total,\n getEndTriggerProps,\n getItemProps,\n getNextTriggerProps,\n getPrevTriggerProps,\n getRootProps,\n getStartTriggerProps,\n onChange,\n onChangeEnd,\n onChangeNext,\n onChangePrev,\n onChangeStart,\n }\n}\n\nexport type UsePaginationReturn = ReturnType<typeof usePagination>\n\nconst computedRange = (start: number, end: number) =>\n Array.from({ length: end - start + 1 }, (_, index) => index + start)\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"picture.js","names":[],"sources":["../../../../src/components/picture/picture.tsx"],"sourcesContent":["import type { FC } from \"react\"\nimport type { HTMLStyledProps, ThemeTokens } from \"../../core\"\nimport type { AnyString } from \"../../utils\"\nimport type { ImageProps } from \"../image\"\nimport { useCallback, useMemo } from \"react\"\nimport { styled, tokenToValue, useSystem } from \"../../core\"\nimport { getPx, isUndefined } from \"../../utils\"\nimport { Image } from \"../image\"\n\nconst createQuery = (\n minW: number | string | undefined,\n maxW: number | string | undefined,\n) => {\n let media = \"\"\n\n if (minW) {\n media = `(min-width: ${minW}px)`\n\n if (maxW) media += ` and (max-width: ${maxW}px)`\n } else {\n media = `(max-width: ${maxW}px)`\n }\n\n return media\n}\n\nexport interface PictureSource extends SourceProps {\n /**\n * The maximum width for the source.\n *\n * If media is set, media takes precedence.\n */\n maxW?: AnyString | number | ThemeTokens[\"sizes\"]\n /**\n * The minimum width for the source.\n *\n * If media is set, media takes precedence.\n */\n minW?: AnyString | number | ThemeTokens[\"sizes\"]\n /**\n * The source set for the source element.\n */\n srcSet?: string\n}\n\nexport interface PictureProps extends ImageProps {\n /**\n * If `true`, the sources will be sorted by the `minW` and `maxW` properties.\n *\n * @default true\n */\n enableSorting?: boolean\n /**\n * The sources for the picture element.\n */\n sources?: PictureSource[]\n /**\n * The props for the picture element.\n */\n pictureProps?: HTMLStyledProps<\"picture\">\n}\n\n/**\n * `Picture` is a component that uses the `picture` element to provide alternative images for different display or device scenarios.\n *\n * @see https://yamada-ui.com/docs/components/picture\n */\nexport const Picture: FC<PictureProps> = ({\n children,\n enableSorting = true,\n sources: sourcesProp = [],\n pictureProps,\n ...rest\n}) => {\n const system = useSystem()\n const { queriesObj } = system.breakpoints\n const { direction = \"down\", identifier = \"@media screen\" } =\n system.config.breakpoint ?? {}\n const searchValue =\n identifier === \"@media screen\" ? \"@media screen and \" : `${identifier} `\n\n const compareSources = useCallback(\n (a: PictureSource, b: PictureSource) => {\n const k = direction === \"down\" ? \"maxW\" : \"minW\"\n\n if (isUndefined(a[k]) && !isUndefined(b[k])) return -1\n\n if (!isUndefined(a[k]) && isUndefined(b[k])) return 1\n\n return direction === \"down\"\n ? Number(a.maxW) - Number(b.maxW)\n : Number(b.minW) - Number(a.minW)\n },\n [direction],\n )\n\n const sources = useMemo(() => {\n const computedSources = sourcesProp.map(\n ({ maxW, media, minW, ...rest }) => {\n if (!media) {\n if (minW) minW = getPx(tokenToValue(system)(\"sizes\", minW))\n if (maxW) maxW = getPx(tokenToValue(system)(\"sizes\", maxW))\n\n media = createQuery(minW, maxW)\n\n return { ...rest, maxW, media, minW }\n } else {\n const { maxW, minW, query } = queriesObj[media] ?? {}\n\n if (query) media = query.replace(searchValue, \"\")\n\n return { ...rest, maxW, media, minW }\n }\n },\n )\n\n if (enableSorting)
|
|
1
|
+
{"version":3,"file":"picture.js","names":[],"sources":["../../../../src/components/picture/picture.tsx"],"sourcesContent":["import type { FC } from \"react\"\nimport type { HTMLStyledProps, ThemeTokens } from \"../../core\"\nimport type { AnyString } from \"../../utils\"\nimport type { ImageProps } from \"../image\"\nimport { useCallback, useMemo } from \"react\"\nimport { styled, tokenToValue, useSystem } from \"../../core\"\nimport { getPx, isUndefined } from \"../../utils\"\nimport { Image } from \"../image\"\n\nconst createQuery = (\n minW: number | string | undefined,\n maxW: number | string | undefined,\n) => {\n let media = \"\"\n\n if (minW) {\n media = `(min-width: ${minW}px)`\n\n if (maxW) media += ` and (max-width: ${maxW}px)`\n } else {\n media = `(max-width: ${maxW}px)`\n }\n\n return media\n}\n\nexport interface PictureSource extends SourceProps {\n /**\n * The maximum width for the source.\n *\n * If media is set, media takes precedence.\n */\n maxW?: AnyString | number | ThemeTokens[\"sizes\"]\n /**\n * The minimum width for the source.\n *\n * If media is set, media takes precedence.\n */\n minW?: AnyString | number | ThemeTokens[\"sizes\"]\n /**\n * The source set for the source element.\n */\n srcSet?: string\n}\n\nexport interface PictureProps extends ImageProps {\n /**\n * If `true`, the sources will be sorted by the `minW` and `maxW` properties.\n *\n * @default true\n */\n enableSorting?: boolean\n /**\n * The sources for the picture element.\n */\n sources?: PictureSource[]\n /**\n * The props for the picture element.\n */\n pictureProps?: HTMLStyledProps<\"picture\">\n}\n\n/**\n * `Picture` is a component that uses the `picture` element to provide alternative images for different display or device scenarios.\n *\n * @see https://yamada-ui.com/docs/components/picture\n */\nexport const Picture: FC<PictureProps> = ({\n children,\n enableSorting = true,\n sources: sourcesProp = [],\n pictureProps,\n ...rest\n}) => {\n const system = useSystem()\n const { queriesObj } = system.breakpoints\n const { direction = \"down\", identifier = \"@media screen\" } =\n system.config.breakpoint ?? {}\n const searchValue =\n identifier === \"@media screen\" ? \"@media screen and \" : `${identifier} `\n\n const compareSources = useCallback(\n (a: PictureSource, b: PictureSource) => {\n const k = direction === \"down\" ? \"maxW\" : \"minW\"\n\n if (isUndefined(a[k]) && !isUndefined(b[k])) return -1\n\n if (!isUndefined(a[k]) && isUndefined(b[k])) return 1\n\n return direction === \"down\"\n ? Number(a.maxW) - Number(b.maxW)\n : Number(b.minW) - Number(a.minW)\n },\n [direction],\n )\n\n const sources = useMemo(() => {\n const computedSources = sourcesProp.map(\n ({ maxW, media, minW, ...rest }) => {\n if (!media) {\n if (minW) minW = getPx(tokenToValue(system)(\"sizes\", minW))\n if (maxW) maxW = getPx(tokenToValue(system)(\"sizes\", maxW))\n\n media = createQuery(minW, maxW)\n\n return { ...rest, maxW, media, minW }\n } else {\n const { maxW, minW, query } = queriesObj[media] ?? {}\n\n if (query) media = query.replace(searchValue, \"\")\n\n return { ...rest, maxW, media, minW }\n }\n },\n )\n\n if (enableSorting) return computedSources.sort(compareSources)\n else return computedSources\n }, [\n sourcesProp,\n enableSorting,\n system,\n queriesObj,\n searchValue,\n compareSources,\n ])\n\n const sourceElements = useMemo(\n () =>\n sources.map(({ maxW: _maxW, minW: _minW, ...rest }, index) => (\n <styled.source key={index} {...rest} />\n )),\n [sources],\n )\n\n return (\n <styled.picture {...pictureProps}>\n {children ?? (\n <>\n {sourceElements}\n\n <Image {...rest} />\n </>\n )}\n </styled.picture>\n )\n}\n\nexport interface SourceProps extends HTMLStyledProps<\"source\"> {\n /**\n * The media query for the source.\n */\n media?: AnyString | ThemeTokens[\"breakpoints\"]\n}\n\nexport const Source: FC<SourceProps> = ({ media, ...rest }) => {\n const { breakpoints, config } = useSystem()\n const { queriesObj } = breakpoints\n const { identifier = \"@media screen\" } = config.breakpoint ?? {}\n const searchValue =\n identifier === \"@media screen\" ? \"@media screen and \" : `${identifier} `\n\n const { query } = media ? (queriesObj[media] ?? {}) : {}\n\n if (query) media = query.replace(searchValue, \"\")\n\n return <styled.source media={media} {...rest} />\n}\n"],"mappings":";;;;;;;;AASA,MAAM,eACJ,MACA,SACG;CACH,IAAI,QAAQ;CAEZ,IAAI,MAAM;EACR,QAAQ,eAAe,KAAK;EAE5B,IAAI,MAAM,SAAS,oBAAoB,KAAK;CAC9C,OACE,QAAQ,eAAe,KAAK;CAG9B,OAAO;AACT;;;;;;AA2CA,MAAa,WAA6B,EACxC,UACA,gBAAgB,MAChB,SAAS,cAAc,CAAC,GACxB,cACA,GAAG,WACC;CACJ,MAAM,SAAS,UAAU;CACzB,MAAM,EAAE,eAAe,OAAO;CAC9B,MAAM,EAAE,YAAY,QAAQ,aAAa,oBACvC,OAAO,OAAO,cAAc,CAAC;CAC/B,MAAM,cACJ,eAAe,kBAAkB,uBAAuB,GAAG,WAAW;CAExE,MAAM,iBAAiB,aACpB,GAAkB,MAAqB;EACtC,MAAM,IAAI,cAAc,SAAS,SAAS;EAE1C,KAAA,GAAA,cAAA,YAAA,CAAgB,EAAE,EAAE,KAAK,EAAA,GAAA,cAAA,YAAA,CAAa,EAAE,EAAE,GAAG,OAAO;EAEpD,IAAI,EAAA,GAAA,cAAA,YAAA,CAAa,EAAE,EAAE,MAAA,GAAA,cAAA,YAAA,CAAiB,EAAE,EAAE,GAAG,OAAO;EAEpD,OAAO,cAAc,SACjB,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,IAAI,IAC9B,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,IAAI;CACpC,GACA,CAAC,SAAS,CACZ;CAEA,MAAM,UAAU,cAAc;EAC5B,MAAM,kBAAkB,YAAY,KACjC,EAAE,MAAM,OAAO,MAAM,GAAG,WAAW;GAClC,IAAI,CAAC,OAAO;IACV,IAAI,MAAM,QAAA,GAAA,cAAA,MAAA,CAAa,aAAa,MAAM,CAAC,CAAC,SAAS,IAAI,CAAC;IAC1D,IAAI,MAAM,QAAA,GAAA,cAAA,MAAA,CAAa,aAAa,MAAM,CAAC,CAAC,SAAS,IAAI,CAAC;IAE1D,QAAQ,YAAY,MAAM,IAAI;IAE9B,OAAO;KAAE,GAAG;KAAM;KAAM;KAAO;IAAK;GACtC,OAAO;IACL,MAAM,EAAE,MAAM,MAAM,UAAU,WAAW,UAAU,CAAC;IAEpD,IAAI,OAAO,QAAQ,MAAM,QAAQ,aAAa,EAAE;IAEhD,OAAO;KAAE,GAAG;KAAM;KAAM;KAAO;IAAK;GACtC;EACF,CACF;EAEA,IAAI,eAAe,OAAO,gBAAgB,KAAK,cAAc;OACxD,OAAO;CACd,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,iBAAiB,cAEnB,QAAQ,KAAK,EAAE,MAAM,OAAO,MAAM,OAAO,GAAG,QAAQ,UAClD,oBAAC,OAAO,QAAR,EAA2B,GAAI,KAAO,GAAlB,KAAkB,CACvC,GACH,CAAC,OAAO,CACV;CAEA,OACE,oBAAC,OAAO,SAAR;EAAgB,GAAI;YACjB,YACC,qBAAA,YAAA,EAAA,UAAA,CACG,gBAED,oBAAC,OAAD,EAAO,GAAI,KAAO,CAAA,CAClB,EAAA,CAAA;CAEU,CAAA;AAEpB;AASA,MAAa,UAA2B,EAAE,OAAO,GAAG,WAAW;CAC7D,MAAM,EAAE,aAAa,WAAW,UAAU;CAC1C,MAAM,EAAE,eAAe;CACvB,MAAM,EAAE,aAAa,oBAAoB,OAAO,cAAc,CAAC;CAC/D,MAAM,cACJ,eAAe,kBAAkB,uBAAuB,GAAG,WAAW;CAExE,MAAM,EAAE,UAAU,QAAS,WAAW,UAAU,CAAC,IAAK,CAAC;CAEvD,IAAI,OAAO,QAAQ,MAAM,QAAQ,aAAa,EAAE;CAEhD,OAAO,oBAAC,OAAO,QAAR;EAAsB;EAAO,GAAI;CAAO,CAAA;AACjD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pin-input.js","names":[],"sources":["../../../../src/components/pin-input/pin-input.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n RequiredPropGetter,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { GroupProps } from \"../group\"\nimport type { InputProps, UseInputBorderProps } from \"../input\"\nimport type { PinInputStyle } from \"./pin-input.style\"\nimport type { UsePinInputProps } from \"./use-pin-input\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent } from \"../../core\"\nimport { getValidChildren, mergeRefs } from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { Group } from \"../group\"\nimport { Input } from \"../input\"\nimport { pinInputStyle } from \"./pin-input.style\"\nimport {\n PinInputDescendantsContext,\n usePinInput,\n usePinInputDescendant,\n} from \"./use-pin-input\"\n\ninterface ComponentContext extends UseInputBorderProps {\n getInputProps: RequiredPropGetter<\"input\", { index: number }>\n}\n\nexport interface PinInputRootProps\n extends\n Omit<\n WithoutThemeProps<GroupProps, PinInputStyle>,\n \"defaultValue\" | \"mask\" | \"onChange\"\n >,\n ThemeProps<PinInputStyle>,\n UseInputBorderProps,\n UsePinInputProps {}\n\nconst {\n ComponentContext,\n PropsContext: PinInputPropsContext,\n useComponentContext,\n usePropsContext: usePinInputPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<PinInputRootProps, PinInputStyle, ComponentContext>(\n \"pin-input\",\n pinInputStyle,\n)\n\nexport { PinInputPropsContext, usePinInputPropsContext }\n\n/**\n * `PinInput` is a component used to capture pin codes or OTP (One-Time Password) inputs.\n *\n * @see https://yamada-ui.com/docs/components/pin-input\n */\nexport const PinInputRoot = withProvider<\"div\", PinInputRootProps>(\n ({ children, errorBorderColor, focusBorderColor, ...rest }) => {\n const { descendants, items, getInputProps, getRootProps } =\n usePinInput(rest)\n const cloneChildren = useMemo(() => {\n const validChildren = getValidChildren(children)\n\n if (validChildren.length)
|
|
1
|
+
{"version":3,"file":"pin-input.js","names":[],"sources":["../../../../src/components/pin-input/pin-input.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n RequiredPropGetter,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { GroupProps } from \"../group\"\nimport type { InputProps, UseInputBorderProps } from \"../input\"\nimport type { PinInputStyle } from \"./pin-input.style\"\nimport type { UsePinInputProps } from \"./use-pin-input\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent } from \"../../core\"\nimport { getValidChildren, mergeRefs } from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { Group } from \"../group\"\nimport { Input } from \"../input\"\nimport { pinInputStyle } from \"./pin-input.style\"\nimport {\n PinInputDescendantsContext,\n usePinInput,\n usePinInputDescendant,\n} from \"./use-pin-input\"\n\ninterface ComponentContext extends UseInputBorderProps {\n getInputProps: RequiredPropGetter<\"input\", { index: number }>\n}\n\nexport interface PinInputRootProps\n extends\n Omit<\n WithoutThemeProps<GroupProps, PinInputStyle>,\n \"defaultValue\" | \"mask\" | \"onChange\"\n >,\n ThemeProps<PinInputStyle>,\n UseInputBorderProps,\n UsePinInputProps {}\n\nconst {\n ComponentContext,\n PropsContext: PinInputPropsContext,\n useComponentContext,\n usePropsContext: usePinInputPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<PinInputRootProps, PinInputStyle, ComponentContext>(\n \"pin-input\",\n pinInputStyle,\n)\n\nexport { PinInputPropsContext, usePinInputPropsContext }\n\n/**\n * `PinInput` is a component used to capture pin codes or OTP (One-Time Password) inputs.\n *\n * @see https://yamada-ui.com/docs/components/pin-input\n */\nexport const PinInputRoot = withProvider<\"div\", PinInputRootProps>(\n ({ children, errorBorderColor, focusBorderColor, ...rest }) => {\n const { descendants, items, getInputProps, getRootProps } =\n usePinInput(rest)\n const cloneChildren = useMemo(() => {\n const validChildren = getValidChildren(children)\n\n if (validChildren.length) return validChildren\n else\n return Array.from({ length: items }, (_, index) => (\n <PinInputField key={index} index={index} />\n ))\n }, [children, items])\n const context = useMemo(\n () => ({ errorBorderColor, focusBorderColor, getInputProps }),\n [getInputProps, errorBorderColor, focusBorderColor],\n )\n\n return (\n <PinInputDescendantsContext value={descendants}>\n <ComponentContext value={context}>\n <Group {...getRootProps()}>{cloneChildren}</Group>\n </ComponentContext>\n </PinInputDescendantsContext>\n )\n },\n \"root\",\n)()\n\nexport interface PinInputFieldProps extends InputProps {\n /**\n * The index of the pin input field.\n */\n index: number\n}\n\nexport const PinInputField = withContext<\"input\", PinInputFieldProps>(\n Input,\n \"field\",\n)(undefined, ({ ref, index, ...rest }) => {\n const { errorBorderColor, focusBorderColor, getInputProps } =\n useComponentContext()\n const { register } = usePinInputDescendant()\n const { props, ariaProps, dataProps, eventProps } = useFieldProps(rest)\n\n return {\n ...getInputProps({\n errorBorderColor,\n focusBorderColor,\n ...ariaProps,\n ...dataProps,\n ...eventProps,\n ...props,\n ref: mergeRefs(register, ref),\n index,\n }),\n }\n})\n"],"mappings":";;;;;;;;;;;;AAsCA,MAAM,EACJ,kBACA,cAAc,sBACd,qBACA,iBAAiB,yBACjB,aACA,iBACE,oBACF,aACA,aACF;;;;;;AASA,MAAa,eAAe,cACzB,EAAE,UAAU,kBAAkB,kBAAkB,GAAG,WAAW;CAC7D,MAAM,EAAE,aAAa,OAAO,eAAe,iBACzC,YAAY,IAAI;CAClB,MAAM,gBAAgB,cAAc;EAClC,MAAM,gBAAgB,iBAAiB,QAAQ;EAE/C,IAAI,cAAc,QAAQ,OAAO;OAE/B,OAAO,MAAM,KAAK,EAAE,QAAQ,MAAM,IAAI,GAAG,UACvC,oBAAC,eAAD,EAAkC,MAAQ,GAAtB,KAAsB,CAC3C;CACL,GAAG,CAAC,UAAU,KAAK,CAAC;CAMpB,OACE,oBAAC,4BAAD;EAA4B,OAAO;YACjC,oBAAC,kBAAD;GAAkB,OAPN,eACP;IAAE;IAAkB;IAAkB;GAAc,IAC3D;IAAC;IAAe;IAAkB;GAAgB,CAKjB;aAC7B,oBAAC,OAAD;IAAO,GAAI,aAAa;cAAI;GAAqB,CAAA;EACjC,CAAA;CACQ,CAAA;AAEhC,GACA,MACF,CAAC,CAAC;AASF,MAAa,gBAAgB,YAC3B,OACA,OACF,CAAC,CAAC,KAAA,IAAY,EAAE,KAAK,OAAO,GAAG,WAAW;CACxC,MAAM,EAAE,kBAAkB,kBAAkB,kBAC1C,oBAAoB;CACtB,MAAM,EAAE,aAAa,sBAAsB;CAC3C,MAAM,EAAE,OAAO,WAAW,WAAW,eAAe,cAAc,IAAI;CAEtE,OAAO,EACL,GAAG,cAAc;EACf;EACA;EACA,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACH,KAAK,UAAU,UAAU,GAAG;EAC5B;CACF,CAAC,EACH;AACF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-pin-input.js","names":[],"sources":["../../../../src/components/pin-input/use-pin-input.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter, RequiredPropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport { cx, filterUndefined, handlerAll, runKeyAction } from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst {\n DescendantsContext: PinInputDescendantsContext,\n useDescendant: usePinInputDescendant,\n useDescendants: usePinInputDescendants,\n} = createDescendants<HTMLInputElement>()\n\nexport {\n PinInputDescendantsContext,\n usePinInputDescendant,\n usePinInputDescendants,\n}\n\nconst toArray = (value?: string) => value?.split(\"\")\n\nconst validate = (value: string, type: UsePinInputProps[\"type\"]) => {\n const NUMERIC_REGEX = /^[0-9]+$/\n const ALPHA_NUMERIC_REGEX = /^[a-zA-Z0-9]+$/i\n\n const regex = type === \"alphanumeric\" ? ALPHA_NUMERIC_REGEX : NUMERIC_REGEX\n\n return regex.test(value)\n}\n\nexport interface UsePinInputProps\n extends\n Omit<HTMLProps, \"defaultValue\" | \"mask\" | \"onChange\" | \"value\">,\n FieldProps {\n /**\n * If `true`, the pin input receives focus on mount.\n *\n * @default false\n */\n autoFocus?: boolean\n /**\n * The initial value of the pin input.\n */\n defaultValue?: string\n /**\n * The top-level id string that will be applied to the input fields.\n * The index of the input will be appended to this top-level id.\n */\n id?: string\n /**\n * The number of inputs to display.\n *\n * @default 4\n */\n items?: number\n /**\n * If `true`, focus will move automatically to the next input once filled.\n *\n * @default true\n */\n manageFocus?: boolean\n /**\n * If `true`, the input's value will be masked just like `type=password`.\n */\n mask?: boolean\n /**\n * If `true`, the pin input component signals to its fields that they should.\n */\n otp?: boolean\n /**\n * The placeholder for the pin input.\n *\n * @default '◯'\n */\n placeholder?: string\n /**\n * The type of values the pin-input should allow.\n *\n * @default 'number'\n */\n type?: \"alphanumeric\" | \"number\"\n /**\n * The value of the pin input.\n */\n value?: string\n /**\n * Function called on input change.\n */\n onChange?: (value: string) => void\n /**\n * Function called when all inputs have valid values.\n */\n onComplete?: (value: string) => void\n}\n\nexport const usePinInput = (props: UsePinInputProps = {}) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n type = \"number\",\n autoFocus,\n defaultValue,\n disabled,\n items = 4,\n manageFocus = true,\n mask,\n otp = false,\n placeholder = \"◯\",\n readOnly,\n value,\n onChange: onChangeProp,\n onComplete,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const descendants = usePinInputDescendants()\n const [moveFocus, setMoveFocus] = useState<boolean>(true)\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n const [values, setValues] = useControllableState<string[]>({\n defaultValue: toArray(defaultValue) || [],\n value: toArray(value),\n onChange: (values) => onChangeProp?.(values.join(\"\")),\n })\n\n const focusNext = useCallback(\n (index: number) => {\n if (!moveFocus || !manageFocus) return\n\n const next = descendants.nextValue(index, false)\n\n if (!next) return\n\n requestAnimationFrame(() => next.node.focus())\n },\n [descendants, moveFocus, manageFocus],\n )\n\n const focusInputField = useCallback(\n (direction: \"next\" | \"prev\", index: number) => {\n const input =\n direction === \"next\"\n ? descendants.nextValue(index, false)\n : descendants.prevValue(index, false)\n\n if (!input) return\n\n const valueLength = input.node.value.length\n\n requestAnimationFrame(() => {\n input.node.focus()\n input.node.setSelectionRange(0, valueLength)\n })\n },\n [descendants],\n )\n\n const setValue = useCallback(\n (value: string, index: number, focus = true) => {\n let nextValues = [...values]\n\n nextValues[index] = value\n\n setValues(nextValues)\n\n nextValues = nextValues.filter(Boolean)\n\n const complete = value !== \"\" && nextValues.length === descendants.count()\n\n if (complete) {\n onComplete?.(nextValues.join(\"\"))\n descendants.value(index)?.node.blur()\n } else if (focus) {\n focusNext(index)\n }\n },\n [values, setValues, descendants, onComplete, focusNext],\n )\n\n const getNextValue = useCallback(\n (value: string | undefined, eventValue: string) => {\n let nextValue = eventValue\n\n if (!value?.length) return nextValue\n\n if (value.startsWith(eventValue.charAt(0))) {\n nextValue = eventValue.charAt(1)\n } else if (value.startsWith(eventValue.charAt(1))) {\n nextValue = eventValue.charAt(0)\n }\n\n return nextValue\n },\n [],\n )\n\n const onChange = useCallback(\n (index: number) =>\n ({ target }: ChangeEvent<HTMLInputElement>) => {\n const eventValue = target.value\n const currentValue = values[index]\n const nextValue = getNextValue(currentValue, eventValue)\n\n if (nextValue === \"\") {\n setValue(\"\", index)\n\n return\n }\n\n if (eventValue.length > 2) {\n if (!validate(eventValue, type)) return\n\n const nextValue = eventValue\n .split(\"\")\n .filter((_, index) => index < descendants.count())\n\n setValues(nextValue)\n\n if (nextValue.length === descendants.count()) {\n onComplete?.(nextValue.join(\"\"))\n descendants.value(index)?.node.blur()\n }\n } else {\n if (validate(nextValue, type)) setValue(nextValue, index)\n\n setMoveFocus(true)\n }\n },\n [descendants, getNextValue, onComplete, setValue, setValues, type, values],\n )\n\n const onKeyDown = useCallback(\n (index: number) => (ev: KeyboardEvent<HTMLInputElement>) => {\n if (!manageFocus) return\n\n runKeyAction(\n ev,\n {\n ArrowLeft: (ev) => {\n ev.preventDefault()\n focusInputField(\"prev\", index)\n },\n ArrowRight: (ev) => {\n ev.preventDefault()\n focusInputField(\"next\", index)\n },\n Backspace: (ev) => {\n if ((ev.target as HTMLInputElement).value === \"\") {\n const prevInput = descendants.prevValue(index, false)\n\n if (!prevInput) return\n\n setValue(\"\", index - 1, false)\n prevInput.node.focus()\n setMoveFocus(true)\n } else {\n setMoveFocus(false)\n }\n },\n },\n { preventDefault: false },\n )\n },\n [descendants, focusInputField, manageFocus, setValue],\n )\n\n const onFocus = useCallback(\n (index: number) => () => setFocusedIndex(index),\n [],\n )\n\n const onBlur = useCallback(() => setFocusedIndex(-1), [])\n\n useEffect(() => {\n if (!autoFocus) return\n\n const firstValue = descendants.firstValue()\n\n if (!firstValue) return\n\n requestAnimationFrame(() => firstValue.node.focus())\n }, [autoFocus, descendants])\n\n const getRootProps: PropGetter = useCallback(\n (props) => mergeProps({ role: \"group\" }, rest, props)(),\n [rest],\n )\n\n const getInputProps: RequiredPropGetter<\"input\", { index: number }> =\n useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, index, ...props }) => ({\n ...ariaProps,\n ...dataProps,\n type: mask ? \"password\" : type === \"number\" ? \"tel\" : \"text\",\n \"aria-labelledby\": cx(ariaLabelledby, labelId),\n autoComplete: otp ? \"one-time-code\" : \"off\",\n disabled,\n inputMode: type === \"number\" ? \"numeric\" : \"text\",\n placeholder:\n focusedIndex === index && !readOnly && !props.readOnly\n ? \"\"\n : placeholder,\n readOnly,\n value: values[index] || \"\",\n ...filterUndefined(props),\n id: `${id}${index ? `-${index}` : \"\"}`,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange(index)),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onFocus(index)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown(index)),\n }),\n [\n ariaProps,\n dataProps,\n eventProps,\n mask,\n type,\n labelId,\n otp,\n disabled,\n focusedIndex,\n readOnly,\n placeholder,\n values,\n id,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n ],\n )\n\n return {\n descendants,\n items,\n getInputProps,\n getRootProps,\n }\n}\n\nexport type UsePinInputReturn = ReturnType<typeof usePinInput>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-pin-input.js","names":[],"sources":["../../../../src/components/pin-input/use-pin-input.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent } from \"react\"\nimport type { HTMLProps, PropGetter, RequiredPropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useId, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport { cx, filterUndefined, handlerAll, runKeyAction } from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst {\n DescendantsContext: PinInputDescendantsContext,\n useDescendant: usePinInputDescendant,\n useDescendants: usePinInputDescendants,\n} = createDescendants<HTMLInputElement>()\n\nexport {\n PinInputDescendantsContext,\n usePinInputDescendant,\n usePinInputDescendants,\n}\n\nconst toArray = (value?: string) => value?.split(\"\")\n\nconst validate = (value: string, type: UsePinInputProps[\"type\"]) => {\n const NUMERIC_REGEX = /^[0-9]+$/\n const ALPHA_NUMERIC_REGEX = /^[a-zA-Z0-9]+$/i\n\n const regex = type === \"alphanumeric\" ? ALPHA_NUMERIC_REGEX : NUMERIC_REGEX\n\n return regex.test(value)\n}\n\nexport interface UsePinInputProps\n extends\n Omit<HTMLProps, \"defaultValue\" | \"mask\" | \"onChange\" | \"value\">,\n FieldProps {\n /**\n * If `true`, the pin input receives focus on mount.\n *\n * @default false\n */\n autoFocus?: boolean\n /**\n * The initial value of the pin input.\n */\n defaultValue?: string\n /**\n * The top-level id string that will be applied to the input fields.\n * The index of the input will be appended to this top-level id.\n */\n id?: string\n /**\n * The number of inputs to display.\n *\n * @default 4\n */\n items?: number\n /**\n * If `true`, focus will move automatically to the next input once filled.\n *\n * @default true\n */\n manageFocus?: boolean\n /**\n * If `true`, the input's value will be masked just like `type=password`.\n */\n mask?: boolean\n /**\n * If `true`, the pin input component signals to its fields that they should.\n */\n otp?: boolean\n /**\n * The placeholder for the pin input.\n *\n * @default '◯'\n */\n placeholder?: string\n /**\n * The type of values the pin-input should allow.\n *\n * @default 'number'\n */\n type?: \"alphanumeric\" | \"number\"\n /**\n * The value of the pin input.\n */\n value?: string\n /**\n * Function called on input change.\n */\n onChange?: (value: string) => void\n /**\n * Function called when all inputs have valid values.\n */\n onComplete?: (value: string) => void\n}\n\nexport const usePinInput = (props: UsePinInputProps = {}) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n type = \"number\",\n autoFocus,\n defaultValue,\n disabled,\n items = 4,\n manageFocus = true,\n mask,\n otp = false,\n placeholder = \"◯\",\n readOnly,\n value,\n onChange: onChangeProp,\n onComplete,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const descendants = usePinInputDescendants()\n const [moveFocus, setMoveFocus] = useState<boolean>(true)\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n const [values, setValues] = useControllableState<string[]>({\n defaultValue: toArray(defaultValue) || [],\n value: toArray(value),\n onChange: (values) => onChangeProp?.(values.join(\"\")),\n })\n\n const focusNext = useCallback(\n (index: number) => {\n if (!moveFocus || !manageFocus) return\n\n const next = descendants.nextValue(index, false)\n\n if (!next) return\n\n requestAnimationFrame(() => next.node.focus())\n },\n [descendants, moveFocus, manageFocus],\n )\n\n const focusInputField = useCallback(\n (direction: \"next\" | \"prev\", index: number) => {\n const input =\n direction === \"next\"\n ? descendants.nextValue(index, false)\n : descendants.prevValue(index, false)\n\n if (!input) return\n\n const valueLength = input.node.value.length\n\n requestAnimationFrame(() => {\n input.node.focus()\n input.node.setSelectionRange(0, valueLength)\n })\n },\n [descendants],\n )\n\n const setValue = useCallback(\n (value: string, index: number, focus = true) => {\n let nextValues = [...values]\n\n nextValues[index] = value\n\n setValues(nextValues)\n\n nextValues = nextValues.filter(Boolean)\n\n const complete = value !== \"\" && nextValues.length === descendants.count()\n\n if (complete) {\n onComplete?.(nextValues.join(\"\"))\n descendants.value(index)?.node.blur()\n } else if (focus) {\n focusNext(index)\n }\n },\n [values, setValues, descendants, onComplete, focusNext],\n )\n\n const getNextValue = useCallback(\n (value: string | undefined, eventValue: string) => {\n let nextValue = eventValue\n\n if (!value?.length) return nextValue\n\n if (value.startsWith(eventValue.charAt(0)))\n nextValue = eventValue.charAt(1)\n else if (value.startsWith(eventValue.charAt(1)))\n nextValue = eventValue.charAt(0)\n\n return nextValue\n },\n [],\n )\n\n const onChange = useCallback(\n (index: number) =>\n ({ target }: ChangeEvent<HTMLInputElement>) => {\n const eventValue = target.value\n const currentValue = values[index]\n const nextValue = getNextValue(currentValue, eventValue)\n\n if (nextValue === \"\") {\n setValue(\"\", index)\n\n return\n }\n\n if (eventValue.length > 2) {\n if (!validate(eventValue, type)) return\n\n const nextValue = eventValue\n .split(\"\")\n .filter((_, index) => index < descendants.count())\n\n setValues(nextValue)\n\n if (nextValue.length === descendants.count()) {\n onComplete?.(nextValue.join(\"\"))\n descendants.value(index)?.node.blur()\n }\n } else {\n if (validate(nextValue, type)) setValue(nextValue, index)\n\n setMoveFocus(true)\n }\n },\n [descendants, getNextValue, onComplete, setValue, setValues, type, values],\n )\n\n const onKeyDown = useCallback(\n (index: number) => (ev: KeyboardEvent<HTMLInputElement>) => {\n if (!manageFocus) return\n\n runKeyAction(\n ev,\n {\n ArrowLeft: (ev) => {\n ev.preventDefault()\n focusInputField(\"prev\", index)\n },\n ArrowRight: (ev) => {\n ev.preventDefault()\n focusInputField(\"next\", index)\n },\n Backspace: (ev) => {\n if ((ev.target as HTMLInputElement).value === \"\") {\n const prevInput = descendants.prevValue(index, false)\n\n if (!prevInput) return\n\n setValue(\"\", index - 1, false)\n prevInput.node.focus()\n setMoveFocus(true)\n } else {\n setMoveFocus(false)\n }\n },\n },\n { preventDefault: false },\n )\n },\n [descendants, focusInputField, manageFocus, setValue],\n )\n\n const onFocus = useCallback(\n (index: number) => () => setFocusedIndex(index),\n [],\n )\n\n const onBlur = useCallback(() => setFocusedIndex(-1), [])\n\n useEffect(() => {\n if (!autoFocus) return\n\n const firstValue = descendants.firstValue()\n\n if (!firstValue) return\n\n requestAnimationFrame(() => firstValue.node.focus())\n }, [autoFocus, descendants])\n\n const getRootProps: PropGetter = useCallback(\n (props) => mergeProps({ role: \"group\" }, rest, props)(),\n [rest],\n )\n\n const getInputProps: RequiredPropGetter<\"input\", { index: number }> =\n useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, index, ...props }) => ({\n ...ariaProps,\n ...dataProps,\n type: mask ? \"password\" : type === \"number\" ? \"tel\" : \"text\",\n \"aria-labelledby\": cx(ariaLabelledby, labelId),\n autoComplete: otp ? \"one-time-code\" : \"off\",\n disabled,\n inputMode: type === \"number\" ? \"numeric\" : \"text\",\n placeholder:\n focusedIndex === index && !readOnly && !props.readOnly\n ? \"\"\n : placeholder,\n readOnly,\n value: values[index] || \"\",\n ...filterUndefined(props),\n id: `${id}${index ? `-${index}` : \"\"}`,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange(index)),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onFocus(index)),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown(index)),\n }),\n [\n ariaProps,\n dataProps,\n eventProps,\n mask,\n type,\n labelId,\n otp,\n disabled,\n focusedIndex,\n readOnly,\n placeholder,\n values,\n id,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n ],\n )\n\n return {\n descendants,\n items,\n getInputProps,\n getRootProps,\n }\n}\n\nexport type UsePinInputReturn = ReturnType<typeof usePinInput>\n"],"mappings":"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"}
|