@yamada-ui/menu 1.0.22 → 1.0.23-dev-20240414102445
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/{chunk-5CCAXKYE.mjs → chunk-NMZBDE4G.mjs} +2 -2
- package/dist/chunk-NMZBDE4G.mjs.map +1 -0
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/menu-option-group.js +1 -1
- package/dist/menu-option-group.js.map +1 -1
- package/dist/menu-option-group.mjs +1 -1
- package/package.json +3 -3
- package/dist/chunk-5CCAXKYE.mjs.map +0 -1
|
@@ -20,7 +20,7 @@ var MenuOptionGroup = forwardRef(
|
|
|
20
20
|
...rest
|
|
21
21
|
}, ref) => {
|
|
22
22
|
const isRadio = type === "radio";
|
|
23
|
-
defaultValue = isRadio ? "" : [];
|
|
23
|
+
defaultValue != null ? defaultValue : defaultValue = isRadio ? "" : [];
|
|
24
24
|
const [value, setValue] = useControllableState({
|
|
25
25
|
...rest,
|
|
26
26
|
defaultValue
|
|
@@ -64,4 +64,4 @@ MenuOptionGroup.displayName = "MenuOptionGroup";
|
|
|
64
64
|
export {
|
|
65
65
|
MenuOptionGroup
|
|
66
66
|
};
|
|
67
|
-
//# sourceMappingURL=chunk-
|
|
67
|
+
//# sourceMappingURL=chunk-NMZBDE4G.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/menu-option-group.tsx"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps } from \"@yamada-ui/core\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { cx, getValidChildren, omitObject, isArray } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, Ref } from \"react\"\nimport { cloneElement, forwardRef, useCallback } from \"react\"\nimport { MenuGroup } from \"./menu-group\"\nimport { MenuOptionItem } from \"./menu-item\"\n\ntype MenuOptionGroupOptions<Y extends string | string[] = string> = {\n /**\n * The label of the option group.\n */\n label?: string\n /**\n * The value of the menu item group.\n */\n value?: Y\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: Y\n /**\n * The type of the menu option group.\n *\n * @default 'checkbox'\n */\n type?: \"radio\" | \"checkbox\"\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport type MenuOptionGroupProps<Y extends string | string[] = string> = Omit<\n HTMLUIProps<\"div\">,\n keyof MenuOptionGroupOptions\n> &\n MenuOptionGroupOptions<Y>\n\nexport const MenuOptionGroup = forwardRef(\n <Y extends string | string[] = string>(\n {\n className,\n defaultValue,\n type,\n children,\n ...rest\n }: MenuOptionGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const isRadio = type === \"radio\"\n\n defaultValue ??= (isRadio ? \"\" : []) as Y\n\n const [value, setValue] = useControllableState({\n ...rest,\n defaultValue,\n })\n\n const onChange = useCallback(\n (selectedValue: string) => {\n if (isRadio && typeof value === \"string\") setValue(selectedValue as Y)\n\n if (!isRadio && isArray(value)) {\n const nextValue = value.includes(selectedValue)\n ? value.filter((item) => item !== selectedValue)\n : value.concat(selectedValue)\n\n setValue(nextValue as Y)\n }\n },\n [isRadio, value, setValue],\n )\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type !== MenuOptionItem) return child\n\n const onClick = (ev: MouseEvent) => {\n onChange(child.props.value)\n child.props.onClick?.(ev)\n }\n\n const isChecked =\n !isRadio && isArray(value)\n ? value.includes(child.props.value)\n : child.props.value === value\n\n return cloneElement(child, { type, onClick, isChecked })\n })\n\n return (\n <MenuGroup\n ref={ref}\n className={cx(\"ui-menu__item--group--option\", className)}\n {...omitObject(rest, [\"value\", \"onChange\"])}\n >\n {cloneChildren}\n </MenuGroup>\n )\n },\n) as {\n <Y extends string | string[] = string>(\n props: MenuOptionGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nMenuOptionGroup.displayName = \"MenuOptionGroup\"\n"],"mappings":";;;;;;;;;AACA,SAAS,4BAA4B;AACrC,SAAS,IAAI,kBAAkB,YAAY,eAAe;AAE1D,SAAS,cAAc,YAAY,mBAAmB;AAyFhD;AAtDC,IAAM,kBAAkB;AAAA,EAC7B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,UAAU,SAAS;AAEzB,yDAAkB,UAAU,KAAK,CAAC;AAElC,UAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB;AAAA,MAC7C,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AAED,UAAM,WAAW;AAAA,MACf,CAAC,kBAA0B;AACzB,YAAI,WAAW,OAAO,UAAU;AAAU,mBAAS,aAAkB;AAErE,YAAI,CAAC,WAAW,QAAQ,KAAK,GAAG;AAC9B,gBAAM,YAAY,MAAM,SAAS,aAAa,IAC1C,MAAM,OAAO,CAAC,SAAS,SAAS,aAAa,IAC7C,MAAM,OAAO,aAAa;AAE9B,mBAAS,SAAc;AAAA,QACzB;AAAA,MACF;AAAA,MACA,CAAC,SAAS,OAAO,QAAQ;AAAA,IAC3B;AAEA,UAAM,gBAAgB,iBAAiB,QAAQ;AAE/C,UAAM,gBAAgB,cAAc,IAAI,CAAC,UAAU;AACjD,UAAI,MAAM,SAAS;AAAgB,eAAO;AAE1C,YAAM,UAAU,CAAC,OAAmB;AA/E1C;AAgFQ,iBAAS,MAAM,MAAM,KAAK;AAC1B,0BAAM,OAAM,YAAZ,4BAAsB;AAAA,MACxB;AAEA,YAAM,YACJ,CAAC,WAAW,QAAQ,KAAK,IACrB,MAAM,SAAS,MAAM,MAAM,KAAK,IAChC,MAAM,MAAM,UAAU;AAE5B,aAAO,aAAa,OAAO,EAAE,MAAM,SAAS,UAAU,CAAC;AAAA,IACzD,CAAC;AAED,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,gCAAgC,SAAS;AAAA,QACtD,GAAG,WAAW,MAAM,CAAC,SAAS,UAAU,CAAC;AAAA,QAEzC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAMA,gBAAgB,cAAc;","names":[]}
|
package/dist/index.js
CHANGED
|
@@ -477,7 +477,7 @@ var MenuOptionGroup = (0, import_react5.forwardRef)(
|
|
|
477
477
|
...rest
|
|
478
478
|
}, ref) => {
|
|
479
479
|
const isRadio = type === "radio";
|
|
480
|
-
defaultValue = isRadio ? "" : [];
|
|
480
|
+
defaultValue != null ? defaultValue : defaultValue = isRadio ? "" : [];
|
|
481
481
|
const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
|
|
482
482
|
...rest,
|
|
483
483
|
defaultValue
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/menu.tsx","../src/menu-button.tsx","../src/menu-list.tsx","../src/menu-item.tsx","../src/menu-group.tsx","../src/menu-option-group.tsx","../src/menu-divider.tsx"],"sourcesContent":["export { Menu } from \"./menu\"\nexport type { MenuProps } from \"./menu\"\nexport { MenuButton } from \"./menu-button\"\nexport type { MenuButtonProps } from \"./menu-button\"\nexport { MenuList } from \"./menu-list\"\nexport type { MenuListProps } from \"./menu-list\"\nexport { MenuItem, MenuOptionItem } from \"./menu-item\"\nexport type { MenuItemProps, MenuOptionItemProps } from \"./menu-item\"\nexport { MenuGroup } from \"./menu-group\"\nexport type { MenuGroupProps } from \"./menu-group\"\nexport { MenuOptionGroup } from \"./menu-option-group\"\nexport type { MenuOptionGroupProps } from \"./menu-option-group\"\nexport { MenuDivider } from \"./menu-divider\"\nexport type { MenuDividerProps } from \"./menu-divider\"\n","/**\n * `Menu` is a component that displays a common dropdown menu.\n *\n * @see Docs https://yamada-ui.com/components/overlay/menu\n */\nimport type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport { useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { PopoverProps } from \"@yamada-ui/popover\"\nimport { Popover } from \"@yamada-ui/popover\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { useDisclosure } from \"@yamada-ui/use-disclosure\"\nimport {\n createContext,\n useUnmountEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { Dispatch, FC, RefObject, SetStateAction } from \"react\"\nimport { useCallback, useRef, useState } from \"react\"\n\nconst {\n DescendantsContextProvider,\n useDescendantsContext: useMenuDescendantsContext,\n useDescendants,\n useDescendant: useMenuDescendant,\n} = createDescendant<HTMLElement>()\n\nexport { useMenuDescendantsContext, useMenuDescendant }\n\ntype MenuContext = MenuOptions & {\n isOpen: boolean\n onOpen: () => void\n onClose: () => void\n onFocusFirstItem: () => void\n onFocusLastItem: () => void\n focusedIndex: number\n setFocusedIndex: Dispatch<SetStateAction<number>>\n menuRef: RefObject<HTMLDivElement>\n styles: Record<string, CSSUIObject>\n}\n\nconst [MenuProvider, useMenu] = createContext<MenuContext>({\n name: \"MenuContext\",\n errorMessage: `useMenu returned is 'undefined'. Seems you forgot to wrap the components in \"<Menu />\"`,\n})\n\nexport { useMenu }\n\ntype MenuOptions = {\n /**\n * If `true`, the list element will be closed when value is selected.\n *\n * @default true\n */\n closeOnSelect?: boolean\n}\n\nexport type MenuProps = ThemeProps<\"Menu\"> &\n Omit<PopoverProps, \"closeOnButton\"> &\n MenuOptions\n\nexport const Menu: FC<MenuProps> = (props) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Menu\", props)\n const {\n initialFocusRef,\n closeOnSelect = true,\n placement = \"bottom-start\",\n duration = 0.2,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const descendants = useDescendants()\n\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n\n const menuRef = useRef<HTMLDivElement>(null)\n const timeoutIds = useRef<Set<any>>(new Set([]))\n\n const onFocusMenu = useCallback(() => {\n requestAnimationFrame(() =>\n menuRef.current?.focus({ preventScroll: false }),\n )\n }, [])\n\n const onFocusFirstItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const first = descendants.enabledFirstValue()\n\n if (first) setFocusedIndex(first.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onFocusLastItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const last = descendants.enabledLastValue()\n\n if (last) setFocusedIndex(last.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onOpenInternal = useCallback(() => {\n rest.onOpen?.()\n\n onFocusMenu()\n }, [onFocusMenu, rest])\n\n const { isOpen, onOpen, onClose } = useDisclosure({\n ...props,\n onOpen: onOpenInternal,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) setFocusedIndex(-1)\n }, [isOpen])\n\n useUnmountEffect(() => {\n timeoutIds.current.forEach((id) => clearTimeout(id))\n timeoutIds.current.clear()\n })\n\n return (\n <DescendantsContextProvider value={descendants}>\n <MenuProvider\n value={{\n isOpen,\n onOpen,\n onClose,\n onFocusFirstItem,\n onFocusLastItem,\n closeOnSelect,\n focusedIndex,\n setFocusedIndex,\n menuRef,\n styles,\n }}\n >\n <Popover\n {...{\n ...rest,\n isOpen,\n onOpen,\n onClose,\n placement,\n duration,\n initialFocusRef,\n closeOnButton: false,\n }}\n />\n </MenuProvider>\n </DescendantsContextProvider>\n )\n}\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { PopoverTrigger } from \"@yamada-ui/popover\"\nimport { ariaAttr, cx, dataAttr, funcAll, handlerAll } from \"@yamada-ui/utils\"\nimport type { KeyboardEvent } from \"react\"\nimport { useCallback } from \"react\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuButtonProps = HTMLUIProps<\"button\">\n\nexport const MenuButton = forwardRef<MenuButtonProps, \"button\">(\n ({ className, children, as: As, ...rest }, ref) => {\n const { isOpen, onOpen, onFocusFirstItem, onFocusLastItem } = useMenu()\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n const actions: Record<string, Function> = {\n Enter: funcAll(onOpen, onFocusFirstItem),\n ArrowDown: funcAll(onOpen, onFocusFirstItem),\n ArrowUp: funcAll(onOpen, onFocusLastItem),\n }\n\n const action = actions[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n ev.stopPropagation()\n action()\n },\n [onFocusFirstItem, onFocusLastItem, onOpen],\n )\n\n const Component = As || Button\n\n return (\n <PopoverTrigger>\n <Component\n ref={ref}\n className={cx(\"ui-menu\", className)}\n {...rest}\n data-active={dataAttr(isOpen)}\n aria-expanded={ariaAttr(isOpen)}\n onKeyDown={handlerAll(rest.onKeyDown, onKeyDown)}\n >\n <ui.span __css={{ pointerEvents: \"none\", flex: \"1 1 auto\", minW: 0 }}>\n {children}\n </ui.span>\n </Component>\n </PopoverTrigger>\n )\n },\n)\n\nconst Button = forwardRef<MenuButtonProps, \"button\">((rest, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n appearance: \"none\",\n alignItems: \"center\",\n outline: 0,\n ...styles.button,\n }\n\n return <ui.button ref={ref} __css={css} {...rest} />\n})\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport { PopoverContent } from \"@yamada-ui/popover\"\nimport { cx, handlerAll, mergeRefs } from \"@yamada-ui/utils\"\nimport type { KeyboardEvent, KeyboardEventHandler } from \"react\"\nimport { useCallback } from \"react\"\nimport { useMenu, useMenuDescendantsContext } from \"./menu\"\n\nexport type MenuListProps = MotionProps<\"ul\">\n\nexport const MenuList = forwardRef<MenuListProps, \"ul\">(\n ({ className, ...rest }, ref) => {\n const { menuRef, focusedIndex, setFocusedIndex, onClose, styles } =\n useMenu()\n\n const descendants = useMenuDescendantsContext()\n\n const onNext = useCallback(() => {\n const next = descendants.enabledNextValue(focusedIndex)\n\n if (next) setFocusedIndex(next.index)\n }, [descendants, focusedIndex, setFocusedIndex])\n\n const onPrev = useCallback(() => {\n const prev = descendants.enabledPrevValue(focusedIndex)\n\n if (prev) setFocusedIndex(prev.index)\n }, [descendants, focusedIndex, setFocusedIndex])\n\n const onFirst = useCallback(() => {\n const first = descendants.enabledFirstValue()\n\n if (first) setFocusedIndex(first.index)\n }, [descendants, setFocusedIndex])\n\n const onLast = useCallback(() => {\n const last = descendants.enabledLastValue()\n\n if (last) setFocusedIndex(last.index)\n }, [descendants, setFocusedIndex])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n const actions: Record<string, KeyboardEventHandler> = {\n Tab: (ev) => ev.preventDefault(),\n Escape: onClose,\n ArrowDown: focusedIndex === -1 ? onFirst : onNext,\n ArrowUp: focusedIndex === -1 ? onLast : onPrev,\n Home: onFirst,\n End: onLast,\n }\n\n const action = actions[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [focusedIndex, onClose, onFirst, onLast, onNext, onPrev],\n )\n\n const css: CSSUIObject = { ...styles.list }\n\n return (\n <PopoverContent\n as=\"ul\"\n ref={mergeRefs(menuRef, ref)}\n className={cx(\"ui-menu__list\", className)}\n role=\"menu\"\n tabIndex={-1}\n __css={css}\n {...rest}\n onKeyDown={handlerAll(rest.onKeyDown, onKeyDown)}\n />\n )\n },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { useClickable } from \"@yamada-ui/use-clickable\"\nimport {\n ariaAttr,\n cx,\n isActiveElement,\n isHTMLElement,\n mergeRefs,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { FC, FocusEvent, MouseEvent, ReactElement } from \"react\"\nimport { useCallback, useRef } from \"react\"\nimport { useMenu, useMenuDescendant } from \"./menu\"\n\nconst isTargetMenuItem = (target: EventTarget | null) => {\n return (\n isHTMLElement(target) &&\n !!target?.getAttribute(\"role\")?.startsWith(\"menu-item\")\n )\n}\n\ntype MenuItemOptions = {\n /**\n * If `true`, the menu item will be disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, the menu item will be focusable.\n *\n * @default false\n */\n isFocusable?: boolean\n /**\n * If `true`, the list element will be closed when selected.\n *\n * @default false\n */\n closeOnSelect?: boolean\n /**\n * The menu item icon to use.\n */\n icon?: ReactElement\n /**\n * Right-aligned label text content, useful for displaying hotkeys.\n */\n command?: string\n}\n\nexport type MenuItemProps = HTMLUIProps<\"button\"> & MenuItemOptions\n\nexport const MenuItem = forwardRef<MenuItemProps, \"button\">(\n (\n {\n as,\n className,\n type,\n isDisabled,\n isFocusable,\n closeOnSelect: customCloseOnSelect,\n icon,\n command,\n children,\n ...props\n },\n ref,\n ) => {\n const {\n focusedIndex,\n setFocusedIndex,\n isOpen,\n onClose,\n closeOnSelect: generalCloseOnSelect,\n menuRef,\n styles,\n } = useMenu()\n\n const trulyDisabled = isDisabled && !isFocusable\n\n const buttonRef = useRef<HTMLButtonElement>(null)\n const { index, register } = useMenuDescendant({ disabled: trulyDisabled })\n\n const isFocused = index === focusedIndex\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLButtonElement>) => {\n props.onClick?.(ev)\n if (!isTargetMenuItem(ev.currentTarget)) return\n\n if (customCloseOnSelect ?? generalCloseOnSelect) onClose()\n },\n [props, customCloseOnSelect, generalCloseOnSelect, onClose],\n )\n\n const onFocus = useCallback(\n (ev: FocusEvent<HTMLButtonElement>) => {\n props.onFocus?.(ev)\n setFocusedIndex(index)\n },\n [props, setFocusedIndex, index],\n )\n\n const rest = useClickable({\n onClick,\n onFocus,\n ref: mergeRefs(register, buttonRef, ref),\n isDisabled,\n isFocusable,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) return\n\n if (isFocused && !trulyDisabled && buttonRef.current) {\n requestAnimationFrame(() => buttonRef.current?.focus())\n } else if (menuRef.current && !isActiveElement(menuRef.current)) {\n menuRef.current.focus()\n }\n }, [isFocused, trulyDisabled, menuRef, isOpen])\n\n type = as || type ? type ?? undefined : \"button\"\n\n children =\n icon || command ? (\n <ui.span style={{ pointerEvents: \"none\", flex: 1 }}>{children}</ui.span>\n ) : (\n children\n )\n\n const css: CSSUIObject = {\n textDecoration: \"none\",\n color: \"inherit\",\n userSelect: \"none\",\n display: \"flex\",\n width: \"100%\",\n alignItems: \"center\",\n textAlign: \"start\",\n flex: \"0 0 auto\",\n outline: 0,\n gap: \"0.75rem\",\n ...styles.item,\n }\n\n return (\n <ui.li\n {...props}\n {...rest}\n as={as}\n type={type}\n role=\"menu-item\"\n tabIndex={isFocused ? 0 : -1}\n className={cx(\"ui-menu__item\", className)}\n __css={css}\n >\n {icon ? <MenuIcon>{icon}</MenuIcon> : null}\n {children}\n {command ? <MenuCommand>{command}</MenuCommand> : null}\n </ui.li>\n )\n },\n)\n\ntype MenuOptionItemOptions = {\n /**\n * The menu option item icon to use.\n */\n icon?: ReactElement | null\n /**\n * The value of the menu option item.\n */\n value?: string\n /**\n * If `true`, the checkbox or radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The type of the menu option item.\n */\n type?: \"radio\" | \"checkbox\"\n}\n\nexport type MenuOptionItemProps = Omit<MenuItemProps, \"icon\" | \"command\"> &\n MenuOptionItemOptions\n\nexport const MenuOptionItem = forwardRef<MenuOptionItemProps, \"button\">(\n (\n { className, icon, isChecked, closeOnSelect = false, children, ...rest },\n ref,\n ) => {\n return (\n <MenuItem\n ref={ref}\n className={cx(\"ui-menu__item--option\", className)}\n aria-checked={ariaAttr(isChecked)}\n closeOnSelect={closeOnSelect}\n {...rest}\n >\n {icon !== null ? (\n <MenuIcon opacity={isChecked ? 1 : 0}>\n {icon || <CheckIcon />}\n </MenuIcon>\n ) : null}\n {children}\n </MenuItem>\n )\n },\n)\n\ntype MenuIconProps = HTMLUIProps<\"span\">\n\nconst MenuIcon = forwardRef<MenuIconProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = {\n flexShrink: 0,\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n fontSize: \"0.85em\",\n ...styles.icon,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__icon\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype MenuCommandProps = HTMLUIProps<\"span\">\n\nconst MenuCommand = forwardRef<MenuCommandProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.command }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__command\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst CheckIcon: FC = () => (\n <svg viewBox=\"0 0 14 14\" width=\"1em\" height=\"1em\">\n <polygon\n fill=\"currentColor\"\n points=\"5.5 11.9993304 14 3.49933039 12.5 2 5.5 8.99933039 1.5 4.9968652 0 6.49933039\"\n />\n </svg>\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuGroupProps = HTMLUIProps<\"div\"> & {\n /**\n * The label of the group.\n */\n label?: string\n}\n\nexport const MenuGroup = forwardRef<MenuGroupProps, \"div\">(\n ({ className, label, children, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.group }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-menu__item\", \"ui-menu__item--group\", className)}\n role=\"group\"\n __css={css}\n {...rest}\n >\n {label ? (\n <ui.span\n className={cx(\"ui-menu__item--group-label\")}\n __css={styles.groupLabel}\n >\n {label}\n </ui.span>\n ) : null}\n\n <ui.ul className=\"ui-menu__item__group\">{children}</ui.ul>\n </ui.li>\n )\n },\n)\n","import type { ComponentArgs, HTMLUIProps } from \"@yamada-ui/core\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { cx, getValidChildren, omitObject, isArray } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, Ref } from \"react\"\nimport { cloneElement, forwardRef, useCallback } from \"react\"\nimport { MenuGroup } from \"./menu-group\"\nimport { MenuOptionItem } from \"./menu-item\"\n\ntype MenuOptionGroupOptions<Y extends string | string[] = string> = {\n /**\n * The label of the option group.\n */\n label?: string\n /**\n * The value of the menu item group.\n */\n value?: Y\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: Y\n /**\n * The type of the menu option group.\n *\n * @default 'checkbox'\n */\n type?: \"radio\" | \"checkbox\"\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport type MenuOptionGroupProps<Y extends string | string[] = string> = Omit<\n HTMLUIProps<\"div\">,\n keyof MenuOptionGroupOptions\n> &\n MenuOptionGroupOptions<Y>\n\nexport const MenuOptionGroup = forwardRef(\n <Y extends string | string[] = string>(\n {\n className,\n defaultValue,\n type,\n children,\n ...rest\n }: MenuOptionGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const isRadio = type === \"radio\"\n\n defaultValue = (isRadio ? \"\" : []) as Y\n\n const [value, setValue] = useControllableState({\n ...rest,\n defaultValue,\n })\n\n const onChange = useCallback(\n (selectedValue: string) => {\n if (isRadio && typeof value === \"string\") setValue(selectedValue as Y)\n\n if (!isRadio && isArray(value)) {\n const nextValue = value.includes(selectedValue)\n ? value.filter((item) => item !== selectedValue)\n : value.concat(selectedValue)\n\n setValue(nextValue as Y)\n }\n },\n [isRadio, value, setValue],\n )\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type !== MenuOptionItem) return child\n\n const onClick = (ev: MouseEvent) => {\n onChange(child.props.value)\n child.props.onClick?.(ev)\n }\n\n const isChecked =\n !isRadio && isArray(value)\n ? value.includes(child.props.value)\n : child.props.value === value\n\n return cloneElement(child, { type, onClick, isChecked })\n })\n\n return (\n <MenuGroup\n ref={ref}\n className={cx(\"ui-menu__item--group--option\", className)}\n {...omitObject(rest, [\"value\", \"onChange\"])}\n >\n {cloneChildren}\n </MenuGroup>\n )\n },\n) as {\n <Y extends string | string[] = string>(\n props: MenuOptionGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nMenuOptionGroup.displayName = \"MenuOptionGroup\"\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuDividerProps = HTMLUIProps<\"hr\">\n\nexport const MenuDivider = forwardRef(({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.divider }\n\n return (\n <ui.hr\n ref={ref}\n className={cx(\"ui-menu__divider\", className)}\n __css={css}\n {...rest}\n />\n )\n})\n"],"mappings":"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","names":["import_core","import_popover","import_utils","import_react","import_jsx_runtime","import_core","import_popover","import_utils","import_react","import_jsx_runtime","ev","import_core","import_utils","import_react","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_utils","import_react","import_jsx_runtime","import_core","import_utils","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/menu.tsx","../src/menu-button.tsx","../src/menu-list.tsx","../src/menu-item.tsx","../src/menu-group.tsx","../src/menu-option-group.tsx","../src/menu-divider.tsx"],"sourcesContent":["export { Menu } from \"./menu\"\nexport type { MenuProps } from \"./menu\"\nexport { MenuButton } from \"./menu-button\"\nexport type { MenuButtonProps } from \"./menu-button\"\nexport { MenuList } from \"./menu-list\"\nexport type { MenuListProps } from \"./menu-list\"\nexport { MenuItem, MenuOptionItem } from \"./menu-item\"\nexport type { MenuItemProps, MenuOptionItemProps } from \"./menu-item\"\nexport { MenuGroup } from \"./menu-group\"\nexport type { MenuGroupProps } from \"./menu-group\"\nexport { MenuOptionGroup } from \"./menu-option-group\"\nexport type { MenuOptionGroupProps } from \"./menu-option-group\"\nexport { MenuDivider } from \"./menu-divider\"\nexport type { MenuDividerProps } from \"./menu-divider\"\n","/**\n * `Menu` is a component that displays a common dropdown menu.\n *\n * @see Docs https://yamada-ui.com/components/overlay/menu\n */\nimport type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport { useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { PopoverProps } from \"@yamada-ui/popover\"\nimport { Popover } from \"@yamada-ui/popover\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { useDisclosure } from \"@yamada-ui/use-disclosure\"\nimport {\n createContext,\n useUnmountEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { Dispatch, FC, RefObject, SetStateAction } from \"react\"\nimport { useCallback, useRef, useState } from \"react\"\n\nconst {\n DescendantsContextProvider,\n useDescendantsContext: useMenuDescendantsContext,\n useDescendants,\n useDescendant: useMenuDescendant,\n} = createDescendant<HTMLElement>()\n\nexport { useMenuDescendantsContext, useMenuDescendant }\n\ntype MenuContext = MenuOptions & {\n isOpen: boolean\n onOpen: () => void\n onClose: () => void\n onFocusFirstItem: () => void\n onFocusLastItem: () => void\n focusedIndex: number\n setFocusedIndex: Dispatch<SetStateAction<number>>\n menuRef: RefObject<HTMLDivElement>\n styles: Record<string, CSSUIObject>\n}\n\nconst [MenuProvider, useMenu] = createContext<MenuContext>({\n name: \"MenuContext\",\n errorMessage: `useMenu returned is 'undefined'. Seems you forgot to wrap the components in \"<Menu />\"`,\n})\n\nexport { useMenu }\n\ntype MenuOptions = {\n /**\n * If `true`, the list element will be closed when value is selected.\n *\n * @default true\n */\n closeOnSelect?: boolean\n}\n\nexport type MenuProps = ThemeProps<\"Menu\"> &\n Omit<PopoverProps, \"closeOnButton\"> &\n MenuOptions\n\nexport const Menu: FC<MenuProps> = (props) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Menu\", props)\n const {\n initialFocusRef,\n closeOnSelect = true,\n placement = \"bottom-start\",\n duration = 0.2,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const descendants = useDescendants()\n\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n\n const menuRef = useRef<HTMLDivElement>(null)\n const timeoutIds = useRef<Set<any>>(new Set([]))\n\n const onFocusMenu = useCallback(() => {\n requestAnimationFrame(() =>\n menuRef.current?.focus({ preventScroll: false }),\n )\n }, [])\n\n const onFocusFirstItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const first = descendants.enabledFirstValue()\n\n if (first) setFocusedIndex(first.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onFocusLastItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const last = descendants.enabledLastValue()\n\n if (last) setFocusedIndex(last.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onOpenInternal = useCallback(() => {\n rest.onOpen?.()\n\n onFocusMenu()\n }, [onFocusMenu, rest])\n\n const { isOpen, onOpen, onClose } = useDisclosure({\n ...props,\n onOpen: onOpenInternal,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) setFocusedIndex(-1)\n }, [isOpen])\n\n useUnmountEffect(() => {\n timeoutIds.current.forEach((id) => clearTimeout(id))\n timeoutIds.current.clear()\n })\n\n return (\n <DescendantsContextProvider value={descendants}>\n <MenuProvider\n value={{\n isOpen,\n onOpen,\n onClose,\n onFocusFirstItem,\n onFocusLastItem,\n closeOnSelect,\n focusedIndex,\n setFocusedIndex,\n menuRef,\n styles,\n }}\n >\n <Popover\n {...{\n ...rest,\n isOpen,\n onOpen,\n onClose,\n placement,\n duration,\n initialFocusRef,\n closeOnButton: false,\n }}\n />\n </MenuProvider>\n </DescendantsContextProvider>\n )\n}\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { PopoverTrigger } from \"@yamada-ui/popover\"\nimport { ariaAttr, cx, dataAttr, funcAll, handlerAll } from \"@yamada-ui/utils\"\nimport type { KeyboardEvent } from \"react\"\nimport { useCallback } from \"react\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuButtonProps = HTMLUIProps<\"button\">\n\nexport const MenuButton = forwardRef<MenuButtonProps, \"button\">(\n ({ className, children, as: As, ...rest }, ref) => {\n const { isOpen, onOpen, onFocusFirstItem, onFocusLastItem } = useMenu()\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n const actions: Record<string, Function> = {\n Enter: funcAll(onOpen, onFocusFirstItem),\n ArrowDown: funcAll(onOpen, onFocusFirstItem),\n ArrowUp: funcAll(onOpen, onFocusLastItem),\n }\n\n const action = actions[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n ev.stopPropagation()\n action()\n },\n [onFocusFirstItem, onFocusLastItem, onOpen],\n )\n\n const Component = As || Button\n\n return (\n <PopoverTrigger>\n <Component\n ref={ref}\n className={cx(\"ui-menu\", className)}\n {...rest}\n data-active={dataAttr(isOpen)}\n aria-expanded={ariaAttr(isOpen)}\n onKeyDown={handlerAll(rest.onKeyDown, onKeyDown)}\n >\n <ui.span __css={{ pointerEvents: \"none\", flex: \"1 1 auto\", minW: 0 }}>\n {children}\n </ui.span>\n </Component>\n </PopoverTrigger>\n )\n },\n)\n\nconst Button = forwardRef<MenuButtonProps, \"button\">((rest, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n appearance: \"none\",\n alignItems: \"center\",\n outline: 0,\n ...styles.button,\n }\n\n return <ui.button ref={ref} __css={css} {...rest} />\n})\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport { PopoverContent } from \"@yamada-ui/popover\"\nimport { cx, handlerAll, mergeRefs } from \"@yamada-ui/utils\"\nimport type { KeyboardEvent, KeyboardEventHandler } from \"react\"\nimport { useCallback } from \"react\"\nimport { useMenu, useMenuDescendantsContext } from \"./menu\"\n\nexport type MenuListProps = MotionProps<\"ul\">\n\nexport const MenuList = forwardRef<MenuListProps, \"ul\">(\n ({ className, ...rest }, ref) => {\n const { menuRef, focusedIndex, setFocusedIndex, onClose, styles } =\n useMenu()\n\n const descendants = useMenuDescendantsContext()\n\n const onNext = useCallback(() => {\n const next = descendants.enabledNextValue(focusedIndex)\n\n if (next) setFocusedIndex(next.index)\n }, [descendants, focusedIndex, setFocusedIndex])\n\n const onPrev = useCallback(() => {\n const prev = descendants.enabledPrevValue(focusedIndex)\n\n if (prev) setFocusedIndex(prev.index)\n }, [descendants, focusedIndex, setFocusedIndex])\n\n const onFirst = useCallback(() => {\n const first = descendants.enabledFirstValue()\n\n if (first) setFocusedIndex(first.index)\n }, [descendants, setFocusedIndex])\n\n const onLast = useCallback(() => {\n const last = descendants.enabledLastValue()\n\n if (last) setFocusedIndex(last.index)\n }, [descendants, setFocusedIndex])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n const actions: Record<string, KeyboardEventHandler> = {\n Tab: (ev) => ev.preventDefault(),\n Escape: onClose,\n ArrowDown: focusedIndex === -1 ? onFirst : onNext,\n ArrowUp: focusedIndex === -1 ? onLast : onPrev,\n Home: onFirst,\n End: onLast,\n }\n\n const action = actions[ev.key]\n\n if (!action) return\n\n ev.preventDefault()\n action(ev)\n },\n [focusedIndex, onClose, onFirst, onLast, onNext, onPrev],\n )\n\n const css: CSSUIObject = { ...styles.list }\n\n return (\n <PopoverContent\n as=\"ul\"\n ref={mergeRefs(menuRef, ref)}\n className={cx(\"ui-menu__list\", className)}\n role=\"menu\"\n tabIndex={-1}\n __css={css}\n {...rest}\n onKeyDown={handlerAll(rest.onKeyDown, onKeyDown)}\n />\n )\n },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { useClickable } from \"@yamada-ui/use-clickable\"\nimport {\n ariaAttr,\n cx,\n isActiveElement,\n isHTMLElement,\n mergeRefs,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { FC, FocusEvent, MouseEvent, ReactElement } from \"react\"\nimport { useCallback, useRef } from \"react\"\nimport { useMenu, useMenuDescendant } from \"./menu\"\n\nconst isTargetMenuItem = (target: EventTarget | null) => {\n return (\n isHTMLElement(target) &&\n !!target?.getAttribute(\"role\")?.startsWith(\"menu-item\")\n )\n}\n\ntype MenuItemOptions = {\n /**\n * If `true`, the menu item will be disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, the menu item will be focusable.\n *\n * @default false\n */\n isFocusable?: boolean\n /**\n * If `true`, the list element will be closed when selected.\n *\n * @default false\n */\n closeOnSelect?: boolean\n /**\n * The menu item icon to use.\n */\n icon?: ReactElement\n /**\n * Right-aligned label text content, useful for displaying hotkeys.\n */\n command?: string\n}\n\nexport type MenuItemProps = HTMLUIProps<\"button\"> & MenuItemOptions\n\nexport const MenuItem = forwardRef<MenuItemProps, \"button\">(\n (\n {\n as,\n className,\n type,\n isDisabled,\n isFocusable,\n closeOnSelect: customCloseOnSelect,\n icon,\n command,\n children,\n ...props\n },\n ref,\n ) => {\n const {\n focusedIndex,\n setFocusedIndex,\n isOpen,\n onClose,\n closeOnSelect: generalCloseOnSelect,\n menuRef,\n styles,\n } = useMenu()\n\n const trulyDisabled = isDisabled && !isFocusable\n\n const buttonRef = useRef<HTMLButtonElement>(null)\n const { index, register } = useMenuDescendant({ disabled: trulyDisabled })\n\n const isFocused = index === focusedIndex\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLButtonElement>) => {\n props.onClick?.(ev)\n if (!isTargetMenuItem(ev.currentTarget)) return\n\n if (customCloseOnSelect ?? generalCloseOnSelect) onClose()\n },\n [props, customCloseOnSelect, generalCloseOnSelect, onClose],\n )\n\n const onFocus = useCallback(\n (ev: FocusEvent<HTMLButtonElement>) => {\n props.onFocus?.(ev)\n setFocusedIndex(index)\n },\n [props, setFocusedIndex, index],\n )\n\n const rest = useClickable({\n onClick,\n onFocus,\n ref: mergeRefs(register, buttonRef, ref),\n isDisabled,\n isFocusable,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) return\n\n if (isFocused && !trulyDisabled && buttonRef.current) {\n requestAnimationFrame(() => buttonRef.current?.focus())\n } else if (menuRef.current && !isActiveElement(menuRef.current)) {\n menuRef.current.focus()\n }\n }, [isFocused, trulyDisabled, menuRef, isOpen])\n\n type = as || type ? type ?? undefined : \"button\"\n\n children =\n icon || command ? (\n <ui.span style={{ pointerEvents: \"none\", flex: 1 }}>{children}</ui.span>\n ) : (\n children\n )\n\n const css: CSSUIObject = {\n textDecoration: \"none\",\n color: \"inherit\",\n userSelect: \"none\",\n display: \"flex\",\n width: \"100%\",\n alignItems: \"center\",\n textAlign: \"start\",\n flex: \"0 0 auto\",\n outline: 0,\n gap: \"0.75rem\",\n ...styles.item,\n }\n\n return (\n <ui.li\n {...props}\n {...rest}\n as={as}\n type={type}\n role=\"menu-item\"\n tabIndex={isFocused ? 0 : -1}\n className={cx(\"ui-menu__item\", className)}\n __css={css}\n >\n {icon ? <MenuIcon>{icon}</MenuIcon> : null}\n {children}\n {command ? <MenuCommand>{command}</MenuCommand> : null}\n </ui.li>\n )\n },\n)\n\ntype MenuOptionItemOptions = {\n /**\n * The menu option item icon to use.\n */\n icon?: ReactElement | null\n /**\n * The value of the menu option item.\n */\n value?: string\n /**\n * If `true`, the checkbox or radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The type of the menu option item.\n */\n type?: \"radio\" | \"checkbox\"\n}\n\nexport type MenuOptionItemProps = Omit<MenuItemProps, \"icon\" | \"command\"> &\n MenuOptionItemOptions\n\nexport const MenuOptionItem = forwardRef<MenuOptionItemProps, \"button\">(\n (\n { className, icon, isChecked, closeOnSelect = false, children, ...rest },\n ref,\n ) => {\n return (\n <MenuItem\n ref={ref}\n className={cx(\"ui-menu__item--option\", className)}\n aria-checked={ariaAttr(isChecked)}\n closeOnSelect={closeOnSelect}\n {...rest}\n >\n {icon !== null ? (\n <MenuIcon opacity={isChecked ? 1 : 0}>\n {icon || <CheckIcon />}\n </MenuIcon>\n ) : null}\n {children}\n </MenuItem>\n )\n },\n)\n\ntype MenuIconProps = HTMLUIProps<\"span\">\n\nconst MenuIcon = forwardRef<MenuIconProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = {\n flexShrink: 0,\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n fontSize: \"0.85em\",\n ...styles.icon,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__icon\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype MenuCommandProps = HTMLUIProps<\"span\">\n\nconst MenuCommand = forwardRef<MenuCommandProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.command }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__command\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst CheckIcon: FC = () => (\n <svg viewBox=\"0 0 14 14\" width=\"1em\" height=\"1em\">\n <polygon\n fill=\"currentColor\"\n points=\"5.5 11.9993304 14 3.49933039 12.5 2 5.5 8.99933039 1.5 4.9968652 0 6.49933039\"\n />\n </svg>\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuGroupProps = HTMLUIProps<\"div\"> & {\n /**\n * The label of the group.\n */\n label?: string\n}\n\nexport const MenuGroup = forwardRef<MenuGroupProps, \"div\">(\n ({ className, label, children, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.group }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-menu__item\", \"ui-menu__item--group\", className)}\n role=\"group\"\n __css={css}\n {...rest}\n >\n {label ? (\n <ui.span\n className={cx(\"ui-menu__item--group-label\")}\n __css={styles.groupLabel}\n >\n {label}\n </ui.span>\n ) : null}\n\n <ui.ul className=\"ui-menu__item__group\">{children}</ui.ul>\n </ui.li>\n )\n },\n)\n","import type { ComponentArgs, HTMLUIProps } from \"@yamada-ui/core\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { cx, getValidChildren, omitObject, isArray } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, Ref } from \"react\"\nimport { cloneElement, forwardRef, useCallback } from \"react\"\nimport { MenuGroup } from \"./menu-group\"\nimport { MenuOptionItem } from \"./menu-item\"\n\ntype MenuOptionGroupOptions<Y extends string | string[] = string> = {\n /**\n * The label of the option group.\n */\n label?: string\n /**\n * The value of the menu item group.\n */\n value?: Y\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: Y\n /**\n * The type of the menu option group.\n *\n * @default 'checkbox'\n */\n type?: \"radio\" | \"checkbox\"\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport type MenuOptionGroupProps<Y extends string | string[] = string> = Omit<\n HTMLUIProps<\"div\">,\n keyof MenuOptionGroupOptions\n> &\n MenuOptionGroupOptions<Y>\n\nexport const MenuOptionGroup = forwardRef(\n <Y extends string | string[] = string>(\n {\n className,\n defaultValue,\n type,\n children,\n ...rest\n }: MenuOptionGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const isRadio = type === \"radio\"\n\n defaultValue ??= (isRadio ? \"\" : []) as Y\n\n const [value, setValue] = useControllableState({\n ...rest,\n defaultValue,\n })\n\n const onChange = useCallback(\n (selectedValue: string) => {\n if (isRadio && typeof value === \"string\") setValue(selectedValue as Y)\n\n if (!isRadio && isArray(value)) {\n const nextValue = value.includes(selectedValue)\n ? value.filter((item) => item !== selectedValue)\n : value.concat(selectedValue)\n\n setValue(nextValue as Y)\n }\n },\n [isRadio, value, setValue],\n )\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type !== MenuOptionItem) return child\n\n const onClick = (ev: MouseEvent) => {\n onChange(child.props.value)\n child.props.onClick?.(ev)\n }\n\n const isChecked =\n !isRadio && isArray(value)\n ? value.includes(child.props.value)\n : child.props.value === value\n\n return cloneElement(child, { type, onClick, isChecked })\n })\n\n return (\n <MenuGroup\n ref={ref}\n className={cx(\"ui-menu__item--group--option\", className)}\n {...omitObject(rest, [\"value\", \"onChange\"])}\n >\n {cloneChildren}\n </MenuGroup>\n )\n },\n) as {\n <Y extends string | string[] = string>(\n props: MenuOptionGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nMenuOptionGroup.displayName = \"MenuOptionGroup\"\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuDividerProps = HTMLUIProps<\"hr\">\n\nexport const MenuDivider = forwardRef(({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.divider }\n\n return (\n <ui.hr\n ref={ref}\n className={cx(\"ui-menu__divider\", className)}\n __css={css}\n {...rest}\n />\n )\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACMA,kBAAuD;AAEvD,qBAAwB;AACxB,4BAAiC;AACjC,4BAA8B;AAC9B,mBAIO;AAEP,mBAA8C;AA8HtC;AA5HR,IAAM;AAAA,EACJ;AAAA,EACA,uBAAuB;AAAA,EACvB;AAAA,EACA,eAAe;AACjB,QAAI,wCAA8B;AAgBlC,IAAM,CAAC,cAAc,OAAO,QAAI,4BAA2B;AAAA,EACzD,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAiBM,IAAM,OAAsB,CAAC,UAAU;AAC5C,QAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,QAAQ,KAAK;AAClE,QAAM;AAAA,IACJ;AAAA,IACA,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,GAAG;AAAA,EACL,QAAI,4BAAe,WAAW;AAE9B,QAAM,cAAc,eAAe;AAEnC,QAAM,CAAC,cAAc,eAAe,QAAI,uBAAiB,EAAE;AAE3D,QAAM,cAAU,qBAAuB,IAAI;AAC3C,QAAM,iBAAa,qBAAiB,oBAAI,IAAI,CAAC,CAAC,CAAC;AAE/C,QAAM,kBAAc,0BAAY,MAAM;AACpC;AAAA,MAAsB,MAAG;AA9E7B;AA+EM,6BAAQ,YAAR,mBAAiB,MAAM,EAAE,eAAe,MAAM;AAAA;AAAA,IAChD;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,uBAAmB,0BAAY,MAAM;AACzC,UAAM,KAAK,WAAW,MAAM;AAC1B,UAAI;AAAiB;AAErB,YAAM,QAAQ,YAAY,kBAAkB;AAE5C,UAAI;AAAO,wBAAgB,MAAM,KAAK;AAAA,IACxC,CAAC;AAED,eAAW,QAAQ,IAAI,EAAE;AAAA,EAC3B,GAAG,CAAC,aAAa,eAAe,CAAC;AAEjC,QAAM,sBAAkB,0BAAY,MAAM;AACxC,UAAM,KAAK,WAAW,MAAM;AAC1B,UAAI;AAAiB;AAErB,YAAM,OAAO,YAAY,iBAAiB;AAE1C,UAAI;AAAM,wBAAgB,KAAK,KAAK;AAAA,IACtC,CAAC;AAED,eAAW,QAAQ,IAAI,EAAE;AAAA,EAC3B,GAAG,CAAC,aAAa,eAAe,CAAC;AAEjC,QAAM,qBAAiB,0BAAY,MAAM;AA3G3C;AA4GI,eAAK,WAAL;AAEA,gBAAY;AAAA,EACd,GAAG,CAAC,aAAa,IAAI,CAAC;AAEtB,QAAM,EAAE,QAAQ,QAAQ,QAAQ,QAAI,qCAAc;AAAA,IAChD,GAAG;AAAA,IACH,QAAQ;AAAA,EACV,CAAC;AAED,oCAAgB,MAAM;AACpB,QAAI,CAAC;AAAQ,sBAAgB,EAAE;AAAA,EACjC,GAAG,CAAC,MAAM,CAAC;AAEX,qCAAiB,MAAM;AACrB,eAAW,QAAQ,QAAQ,CAAC,OAAO,aAAa,EAAE,CAAC;AACnD,eAAW,QAAQ,MAAM;AAAA,EAC3B,CAAC;AAED,SACE,4CAAC,8BAA2B,OAAO,aACjC;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,YACF,GAAG;AAAA,YACH;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,eAAe;AAAA,UACjB;AAAA;AAAA,MACF;AAAA;AAAA,EACF,GACF;AAEJ;;;AC7JA,IAAAA,eAA+B;AAC/B,IAAAC,kBAA+B;AAC/B,IAAAC,gBAA4D;AAE5D,IAAAC,gBAA4B;AAwClB,IAAAC,sBAAA;AAnCH,IAAM,iBAAa;AAAA,EACxB,CAAC,EAAE,WAAW,UAAU,IAAI,IAAI,GAAG,KAAK,GAAG,QAAQ;AACjD,UAAM,EAAE,QAAQ,QAAQ,kBAAkB,gBAAgB,IAAI,QAAQ;AAEtE,UAAM,gBAAY;AAAA,MAChB,CAAC,OAAsB;AACrB,cAAM,UAAoC;AAAA,UACxC,WAAO,uBAAQ,QAAQ,gBAAgB;AAAA,UACvC,eAAW,uBAAQ,QAAQ,gBAAgB;AAAA,UAC3C,aAAS,uBAAQ,QAAQ,eAAe;AAAA,QAC1C;AAEA,cAAM,SAAS,QAAQ,GAAG,GAAG;AAE7B,YAAI,CAAC;AAAQ;AAEb,WAAG,eAAe;AAClB,WAAG,gBAAgB;AACnB,eAAO;AAAA,MACT;AAAA,MACA,CAAC,kBAAkB,iBAAiB,MAAM;AAAA,IAC5C;AAEA,UAAM,YAAY,MAAM;AAExB,WACE,6CAAC,kCACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,WAAW,SAAS;AAAA,QACjC,GAAG;AAAA,QACJ,mBAAa,wBAAS,MAAM;AAAA,QAC5B,qBAAe,wBAAS,MAAM;AAAA,QAC9B,eAAW,0BAAW,KAAK,WAAW,SAAS;AAAA,QAE/C,uDAAC,gBAAG,MAAH,EAAQ,OAAO,EAAE,eAAe,QAAQ,MAAM,YAAY,MAAM,EAAE,GAChE,UACH;AAAA;AAAA,IACF,GACF;AAAA,EAEJ;AACF;AAEA,IAAM,aAAS,yBAAsC,CAAC,MAAM,QAAQ;AAClE,QAAM,EAAE,OAAO,IAAI,QAAQ;AAE3B,QAAM,MAAmB;AAAA,IACvB,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,GAAG,OAAO;AAAA,EACZ;AAEA,SAAO,6CAAC,gBAAG,QAAH,EAAU,KAAU,OAAO,KAAM,GAAG,MAAM;AACpD,CAAC;;;ACjED,IAAAC,eAA2B;AAE3B,IAAAC,kBAA+B;AAC/B,IAAAC,gBAA0C;AAE1C,IAAAC,gBAA4B;AA4DtB,IAAAC,sBAAA;AAvDC,IAAM,eAAW;AAAA,EACtB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,SAAS,cAAc,iBAAiB,SAAS,OAAO,IAC9D,QAAQ;AAEV,UAAM,cAAc,0BAA0B;AAE9C,UAAM,aAAS,2BAAY,MAAM;AAC/B,YAAM,OAAO,YAAY,iBAAiB,YAAY;AAEtD,UAAI;AAAM,wBAAgB,KAAK,KAAK;AAAA,IACtC,GAAG,CAAC,aAAa,cAAc,eAAe,CAAC;AAE/C,UAAM,aAAS,2BAAY,MAAM;AAC/B,YAAM,OAAO,YAAY,iBAAiB,YAAY;AAEtD,UAAI;AAAM,wBAAgB,KAAK,KAAK;AAAA,IACtC,GAAG,CAAC,aAAa,cAAc,eAAe,CAAC;AAE/C,UAAM,cAAU,2BAAY,MAAM;AAChC,YAAM,QAAQ,YAAY,kBAAkB;AAE5C,UAAI;AAAO,wBAAgB,MAAM,KAAK;AAAA,IACxC,GAAG,CAAC,aAAa,eAAe,CAAC;AAEjC,UAAM,aAAS,2BAAY,MAAM;AAC/B,YAAM,OAAO,YAAY,iBAAiB;AAE1C,UAAI;AAAM,wBAAgB,KAAK,KAAK;AAAA,IACtC,GAAG,CAAC,aAAa,eAAe,CAAC;AAEjC,UAAM,gBAAY;AAAA,MAChB,CAAC,OAAsB;AACrB,cAAM,UAAgD;AAAA,UACpD,KAAK,CAACC,QAAOA,IAAG,eAAe;AAAA,UAC/B,QAAQ;AAAA,UACR,WAAW,iBAAiB,KAAK,UAAU;AAAA,UAC3C,SAAS,iBAAiB,KAAK,SAAS;AAAA,UACxC,MAAM;AAAA,UACN,KAAK;AAAA,QACP;AAEA,cAAM,SAAS,QAAQ,GAAG,GAAG;AAE7B,YAAI,CAAC;AAAQ;AAEb,WAAG,eAAe;AAClB,eAAO,EAAE;AAAA,MACX;AAAA,MACA,CAAC,cAAc,SAAS,SAAS,QAAQ,QAAQ,MAAM;AAAA,IACzD;AAEA,UAAM,MAAmB,EAAE,GAAG,OAAO,KAAK;AAE1C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,SAAK,yBAAU,SAAS,GAAG;AAAA,QAC3B,eAAW,kBAAG,iBAAiB,SAAS;AAAA,QACxC,MAAK;AAAA,QACL,UAAU;AAAA,QACV,OAAO;AAAA,QACN,GAAG;AAAA,QACJ,eAAW,0BAAW,KAAK,WAAW,SAAS;AAAA;AAAA,IACjD;AAAA,EAEJ;AACF;;;AC7EA,IAAAC,eAA+B;AAC/B,2BAA6B;AAC7B,IAAAC,gBAOO;AAEP,IAAAC,gBAAoC;AAkH5B,IAAAC,sBAAA;AA/GR,IAAM,mBAAmB,CAAC,WAA+B;AAfzD;AAgBE,aACE,6BAAc,MAAM,KACpB,CAAC,GAAC,sCAAQ,aAAa,YAArB,mBAA8B,WAAW;AAE/C;AAiCO,IAAM,eAAW;AAAA,EACtB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf;AAAA,MACA;AAAA,IACF,IAAI,QAAQ;AAEZ,UAAM,gBAAgB,cAAc,CAAC;AAErC,UAAM,gBAAY,sBAA0B,IAAI;AAChD,UAAM,EAAE,OAAO,SAAS,IAAI,kBAAkB,EAAE,UAAU,cAAc,CAAC;AAEzE,UAAM,YAAY,UAAU;AAE5B,UAAM,cAAU;AAAA,MACd,CAAC,OAAsC;AAvF7C;AAwFQ,oBAAM,YAAN,+BAAgB;AAChB,YAAI,CAAC,iBAAiB,GAAG,aAAa;AAAG;AAEzC,YAAI,oDAAuB;AAAsB,kBAAQ;AAAA,MAC3D;AAAA,MACA,CAAC,OAAO,qBAAqB,sBAAsB,OAAO;AAAA,IAC5D;AAEA,UAAM,cAAU;AAAA,MACd,CAAC,OAAsC;AAjG7C;AAkGQ,oBAAM,YAAN,+BAAgB;AAChB,wBAAgB,KAAK;AAAA,MACvB;AAAA,MACA,CAAC,OAAO,iBAAiB,KAAK;AAAA,IAChC;AAEA,UAAM,WAAO,mCAAa;AAAA,MACxB;AAAA,MACA;AAAA,MACA,SAAK,yBAAU,UAAU,WAAW,GAAG;AAAA,MACvC;AAAA,MACA;AAAA,IACF,CAAC;AAED,uCAAgB,MAAM;AACpB,UAAI,CAAC;AAAQ;AAEb,UAAI,aAAa,CAAC,iBAAiB,UAAU,SAAS;AACpD,8BAAsB,MAAG;AApHjC;AAoHoC,iCAAU,YAAV,mBAAmB;AAAA,SAAO;AAAA,MACxD,WAAW,QAAQ,WAAW,KAAC,+BAAgB,QAAQ,OAAO,GAAG;AAC/D,gBAAQ,QAAQ,MAAM;AAAA,MACxB;AAAA,IACF,GAAG,CAAC,WAAW,eAAe,SAAS,MAAM,CAAC;AAE9C,WAAO,MAAM,OAAO,sBAAQ,SAAY;AAExC,eACE,QAAQ,UACN,6CAAC,gBAAG,MAAH,EAAQ,OAAO,EAAE,eAAe,QAAQ,MAAM,EAAE,GAAI,UAAS,IAE9D;AAGJ,UAAM,MAAmB;AAAA,MACvB,gBAAgB;AAAA,MAChB,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,MACT,KAAK;AAAA,MACL,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,gBAAG;AAAA,MAAH;AAAA,QACE,GAAG;AAAA,QACH,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,MAAK;AAAA,QACL,UAAU,YAAY,IAAI;AAAA,QAC1B,eAAW,kBAAG,iBAAiB,SAAS;AAAA,QACxC,OAAO;AAAA,QAEN;AAAA,iBAAO,6CAAC,YAAU,gBAAK,IAAc;AAAA,UACrC;AAAA,UACA,UAAU,6CAAC,eAAa,mBAAQ,IAAiB;AAAA;AAAA;AAAA,IACpD;AAAA,EAEJ;AACF;AA0BO,IAAM,qBAAiB;AAAA,EAC5B,CACE,EAAE,WAAW,MAAM,WAAW,gBAAgB,OAAO,UAAU,GAAG,KAAK,GACvE,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,yBAAyB,SAAS;AAAA,QAChD,oBAAc,wBAAS,SAAS;AAAA,QAChC;AAAA,QACC,GAAG;AAAA,QAEH;AAAA,mBAAS,OACR,6CAAC,YAAS,SAAS,YAAY,IAAI,GAChC,kBAAQ,6CAAC,aAAU,GACtB,IACE;AAAA,UACH;AAAA;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAIA,IAAM,eAAW;AAAA,EACf,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,QAAQ;AAE3B,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,gBAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,uBAAuB,SAAS;AAAA,QAC9C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAIA,IAAM,kBAAc;AAAA,EAClB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,QAAQ;AAE3B,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC,gBAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,0BAA0B,SAAS;AAAA,QACjD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,IAAM,YAAgB,MACpB,6CAAC,SAAI,SAAQ,aAAY,OAAM,OAAM,QAAO,OAC1C;AAAA,EAAC;AAAA;AAAA,IACC,MAAK;AAAA,IACL,QAAO;AAAA;AACT,GACF;;;ACtQF,IAAAC,eAA+B;AAC/B,IAAAC,gBAAmB;AAiBb,IAAAC,sBAAA;AAPC,IAAM,gBAAY;AAAA,EACvB,CAAC,EAAE,WAAW,OAAO,UAAU,GAAG,KAAK,GAAG,QAAQ;AAChD,UAAM,EAAE,OAAO,IAAI,QAAQ;AAE3B,UAAM,MAAmB,EAAE,GAAG,OAAO,MAAM;AAE3C,WACE;AAAA,MAAC,gBAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,iBAAiB,wBAAwB,SAAS;AAAA,QAChE,MAAK;AAAA,QACL,OAAO;AAAA,QACN,GAAG;AAAA,QAEH;AAAA,kBACC;AAAA,YAAC,gBAAG;AAAA,YAAH;AAAA,cACC,eAAW,kBAAG,4BAA4B;AAAA,cAC1C,OAAO,OAAO;AAAA,cAEb;AAAA;AAAA,UACH,IACE;AAAA,UAEJ,6CAAC,gBAAG,IAAH,EAAM,WAAU,wBAAwB,UAAS;AAAA;AAAA;AAAA,IACpD;AAAA,EAEJ;AACF;;;ACtCA,oCAAqC;AACrC,IAAAC,gBAA0D;AAE1D,IAAAC,gBAAsD;AAyFhD,IAAAC,sBAAA;AAtDC,IAAM,sBAAkB;AAAA,EAC7B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,UAAU,SAAS;AAEzB,yDAAkB,UAAU,KAAK,CAAC;AAElC,UAAM,CAAC,OAAO,QAAQ,QAAI,oDAAqB;AAAA,MAC7C,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AAED,UAAM,eAAW;AAAA,MACf,CAAC,kBAA0B;AACzB,YAAI,WAAW,OAAO,UAAU;AAAU,mBAAS,aAAkB;AAErE,YAAI,CAAC,eAAW,uBAAQ,KAAK,GAAG;AAC9B,gBAAM,YAAY,MAAM,SAAS,aAAa,IAC1C,MAAM,OAAO,CAAC,SAAS,SAAS,aAAa,IAC7C,MAAM,OAAO,aAAa;AAE9B,mBAAS,SAAc;AAAA,QACzB;AAAA,MACF;AAAA,MACA,CAAC,SAAS,OAAO,QAAQ;AAAA,IAC3B;AAEA,UAAM,oBAAgB,gCAAiB,QAAQ;AAE/C,UAAM,gBAAgB,cAAc,IAAI,CAAC,UAAU;AACjD,UAAI,MAAM,SAAS;AAAgB,eAAO;AAE1C,YAAM,UAAU,CAAC,OAAmB;AA/E1C;AAgFQ,iBAAS,MAAM,MAAM,KAAK;AAC1B,0BAAM,OAAM,YAAZ,4BAAsB;AAAA,MACxB;AAEA,YAAM,YACJ,CAAC,eAAW,uBAAQ,KAAK,IACrB,MAAM,SAAS,MAAM,MAAM,KAAK,IAChC,MAAM,MAAM,UAAU;AAE5B,iBAAO,4BAAa,OAAO,EAAE,MAAM,SAAS,UAAU,CAAC;AAAA,IACzD,CAAC;AAED,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,gCAAgC,SAAS;AAAA,QACtD,OAAG,0BAAW,MAAM,CAAC,SAAS,UAAU,CAAC;AAAA,QAEzC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAMA,gBAAgB,cAAc;;;AC3G9B,IAAAC,eAA+B;AAC/B,IAAAC,gBAAmB;AAWf,IAAAC,sBAAA;AANG,IAAM,kBAAc,yBAAW,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AACrE,QAAM,EAAE,OAAO,IAAI,QAAQ;AAE3B,QAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,SACE;AAAA,IAAC,gBAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,eAAW,kBAAG,oBAAoB,SAAS;AAAA,MAC3C,OAAO;AAAA,MACN,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;","names":["import_core","import_popover","import_utils","import_react","import_jsx_runtime","import_core","import_popover","import_utils","import_react","import_jsx_runtime","ev","import_core","import_utils","import_react","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_utils","import_react","import_jsx_runtime","import_core","import_utils","import_jsx_runtime"]}
|
package/dist/index.mjs
CHANGED
|
@@ -264,7 +264,7 @@ var MenuOptionGroup = (0, import_react3.forwardRef)(
|
|
|
264
264
|
...rest
|
|
265
265
|
}, ref) => {
|
|
266
266
|
const isRadio = type === "radio";
|
|
267
|
-
defaultValue = isRadio ? "" : [];
|
|
267
|
+
defaultValue != null ? defaultValue : defaultValue = isRadio ? "" : [];
|
|
268
268
|
const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
|
|
269
269
|
...rest,
|
|
270
270
|
defaultValue
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/menu-option-group.tsx","../src/menu-group.tsx","../src/menu.tsx","../src/menu-item.tsx"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps } from \"@yamada-ui/core\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { cx, getValidChildren, omitObject, isArray } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, Ref } from \"react\"\nimport { cloneElement, forwardRef, useCallback } from \"react\"\nimport { MenuGroup } from \"./menu-group\"\nimport { MenuOptionItem } from \"./menu-item\"\n\ntype MenuOptionGroupOptions<Y extends string | string[] = string> = {\n /**\n * The label of the option group.\n */\n label?: string\n /**\n * The value of the menu item group.\n */\n value?: Y\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: Y\n /**\n * The type of the menu option group.\n *\n * @default 'checkbox'\n */\n type?: \"radio\" | \"checkbox\"\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport type MenuOptionGroupProps<Y extends string | string[] = string> = Omit<\n HTMLUIProps<\"div\">,\n keyof MenuOptionGroupOptions\n> &\n MenuOptionGroupOptions<Y>\n\nexport const MenuOptionGroup = forwardRef(\n <Y extends string | string[] = string>(\n {\n className,\n defaultValue,\n type,\n children,\n ...rest\n }: MenuOptionGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const isRadio = type === \"radio\"\n\n defaultValue = (isRadio ? \"\" : []) as Y\n\n const [value, setValue] = useControllableState({\n ...rest,\n defaultValue,\n })\n\n const onChange = useCallback(\n (selectedValue: string) => {\n if (isRadio && typeof value === \"string\") setValue(selectedValue as Y)\n\n if (!isRadio && isArray(value)) {\n const nextValue = value.includes(selectedValue)\n ? value.filter((item) => item !== selectedValue)\n : value.concat(selectedValue)\n\n setValue(nextValue as Y)\n }\n },\n [isRadio, value, setValue],\n )\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type !== MenuOptionItem) return child\n\n const onClick = (ev: MouseEvent) => {\n onChange(child.props.value)\n child.props.onClick?.(ev)\n }\n\n const isChecked =\n !isRadio && isArray(value)\n ? value.includes(child.props.value)\n : child.props.value === value\n\n return cloneElement(child, { type, onClick, isChecked })\n })\n\n return (\n <MenuGroup\n ref={ref}\n className={cx(\"ui-menu__item--group--option\", className)}\n {...omitObject(rest, [\"value\", \"onChange\"])}\n >\n {cloneChildren}\n </MenuGroup>\n )\n },\n) as {\n <Y extends string | string[] = string>(\n props: MenuOptionGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nMenuOptionGroup.displayName = \"MenuOptionGroup\"\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuGroupProps = HTMLUIProps<\"div\"> & {\n /**\n * The label of the group.\n */\n label?: string\n}\n\nexport const MenuGroup = forwardRef<MenuGroupProps, \"div\">(\n ({ className, label, children, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.group }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-menu__item\", \"ui-menu__item--group\", className)}\n role=\"group\"\n __css={css}\n {...rest}\n >\n {label ? (\n <ui.span\n className={cx(\"ui-menu__item--group-label\")}\n __css={styles.groupLabel}\n >\n {label}\n </ui.span>\n ) : null}\n\n <ui.ul className=\"ui-menu__item__group\">{children}</ui.ul>\n </ui.li>\n )\n },\n)\n","/**\n * `Menu` is a component that displays a common dropdown menu.\n *\n * @see Docs https://yamada-ui.com/components/overlay/menu\n */\nimport type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport { useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { PopoverProps } from \"@yamada-ui/popover\"\nimport { Popover } from \"@yamada-ui/popover\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { useDisclosure } from \"@yamada-ui/use-disclosure\"\nimport {\n createContext,\n useUnmountEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { Dispatch, FC, RefObject, SetStateAction } from \"react\"\nimport { useCallback, useRef, useState } from \"react\"\n\nconst {\n DescendantsContextProvider,\n useDescendantsContext: useMenuDescendantsContext,\n useDescendants,\n useDescendant: useMenuDescendant,\n} = createDescendant<HTMLElement>()\n\nexport { useMenuDescendantsContext, useMenuDescendant }\n\ntype MenuContext = MenuOptions & {\n isOpen: boolean\n onOpen: () => void\n onClose: () => void\n onFocusFirstItem: () => void\n onFocusLastItem: () => void\n focusedIndex: number\n setFocusedIndex: Dispatch<SetStateAction<number>>\n menuRef: RefObject<HTMLDivElement>\n styles: Record<string, CSSUIObject>\n}\n\nconst [MenuProvider, useMenu] = createContext<MenuContext>({\n name: \"MenuContext\",\n errorMessage: `useMenu returned is 'undefined'. Seems you forgot to wrap the components in \"<Menu />\"`,\n})\n\nexport { useMenu }\n\ntype MenuOptions = {\n /**\n * If `true`, the list element will be closed when value is selected.\n *\n * @default true\n */\n closeOnSelect?: boolean\n}\n\nexport type MenuProps = ThemeProps<\"Menu\"> &\n Omit<PopoverProps, \"closeOnButton\"> &\n MenuOptions\n\nexport const Menu: FC<MenuProps> = (props) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Menu\", props)\n const {\n initialFocusRef,\n closeOnSelect = true,\n placement = \"bottom-start\",\n duration = 0.2,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const descendants = useDescendants()\n\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n\n const menuRef = useRef<HTMLDivElement>(null)\n const timeoutIds = useRef<Set<any>>(new Set([]))\n\n const onFocusMenu = useCallback(() => {\n requestAnimationFrame(() =>\n menuRef.current?.focus({ preventScroll: false }),\n )\n }, [])\n\n const onFocusFirstItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const first = descendants.enabledFirstValue()\n\n if (first) setFocusedIndex(first.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onFocusLastItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const last = descendants.enabledLastValue()\n\n if (last) setFocusedIndex(last.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onOpenInternal = useCallback(() => {\n rest.onOpen?.()\n\n onFocusMenu()\n }, [onFocusMenu, rest])\n\n const { isOpen, onOpen, onClose } = useDisclosure({\n ...props,\n onOpen: onOpenInternal,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) setFocusedIndex(-1)\n }, [isOpen])\n\n useUnmountEffect(() => {\n timeoutIds.current.forEach((id) => clearTimeout(id))\n timeoutIds.current.clear()\n })\n\n return (\n <DescendantsContextProvider value={descendants}>\n <MenuProvider\n value={{\n isOpen,\n onOpen,\n onClose,\n onFocusFirstItem,\n onFocusLastItem,\n closeOnSelect,\n focusedIndex,\n setFocusedIndex,\n menuRef,\n styles,\n }}\n >\n <Popover\n {...{\n ...rest,\n isOpen,\n onOpen,\n onClose,\n placement,\n duration,\n initialFocusRef,\n closeOnButton: false,\n }}\n />\n </MenuProvider>\n </DescendantsContextProvider>\n )\n}\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { useClickable } from \"@yamada-ui/use-clickable\"\nimport {\n ariaAttr,\n cx,\n isActiveElement,\n isHTMLElement,\n mergeRefs,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { FC, FocusEvent, MouseEvent, ReactElement } from \"react\"\nimport { useCallback, useRef } from \"react\"\nimport { useMenu, useMenuDescendant } from \"./menu\"\n\nconst isTargetMenuItem = (target: EventTarget | null) => {\n return (\n isHTMLElement(target) &&\n !!target?.getAttribute(\"role\")?.startsWith(\"menu-item\")\n )\n}\n\ntype MenuItemOptions = {\n /**\n * If `true`, the menu item will be disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, the menu item will be focusable.\n *\n * @default false\n */\n isFocusable?: boolean\n /**\n * If `true`, the list element will be closed when selected.\n *\n * @default false\n */\n closeOnSelect?: boolean\n /**\n * The menu item icon to use.\n */\n icon?: ReactElement\n /**\n * Right-aligned label text content, useful for displaying hotkeys.\n */\n command?: string\n}\n\nexport type MenuItemProps = HTMLUIProps<\"button\"> & MenuItemOptions\n\nexport const MenuItem = forwardRef<MenuItemProps, \"button\">(\n (\n {\n as,\n className,\n type,\n isDisabled,\n isFocusable,\n closeOnSelect: customCloseOnSelect,\n icon,\n command,\n children,\n ...props\n },\n ref,\n ) => {\n const {\n focusedIndex,\n setFocusedIndex,\n isOpen,\n onClose,\n closeOnSelect: generalCloseOnSelect,\n menuRef,\n styles,\n } = useMenu()\n\n const trulyDisabled = isDisabled && !isFocusable\n\n const buttonRef = useRef<HTMLButtonElement>(null)\n const { index, register } = useMenuDescendant({ disabled: trulyDisabled })\n\n const isFocused = index === focusedIndex\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLButtonElement>) => {\n props.onClick?.(ev)\n if (!isTargetMenuItem(ev.currentTarget)) return\n\n if (customCloseOnSelect ?? generalCloseOnSelect) onClose()\n },\n [props, customCloseOnSelect, generalCloseOnSelect, onClose],\n )\n\n const onFocus = useCallback(\n (ev: FocusEvent<HTMLButtonElement>) => {\n props.onFocus?.(ev)\n setFocusedIndex(index)\n },\n [props, setFocusedIndex, index],\n )\n\n const rest = useClickable({\n onClick,\n onFocus,\n ref: mergeRefs(register, buttonRef, ref),\n isDisabled,\n isFocusable,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) return\n\n if (isFocused && !trulyDisabled && buttonRef.current) {\n requestAnimationFrame(() => buttonRef.current?.focus())\n } else if (menuRef.current && !isActiveElement(menuRef.current)) {\n menuRef.current.focus()\n }\n }, [isFocused, trulyDisabled, menuRef, isOpen])\n\n type = as || type ? type ?? undefined : \"button\"\n\n children =\n icon || command ? (\n <ui.span style={{ pointerEvents: \"none\", flex: 1 }}>{children}</ui.span>\n ) : (\n children\n )\n\n const css: CSSUIObject = {\n textDecoration: \"none\",\n color: \"inherit\",\n userSelect: \"none\",\n display: \"flex\",\n width: \"100%\",\n alignItems: \"center\",\n textAlign: \"start\",\n flex: \"0 0 auto\",\n outline: 0,\n gap: \"0.75rem\",\n ...styles.item,\n }\n\n return (\n <ui.li\n {...props}\n {...rest}\n as={as}\n type={type}\n role=\"menu-item\"\n tabIndex={isFocused ? 0 : -1}\n className={cx(\"ui-menu__item\", className)}\n __css={css}\n >\n {icon ? <MenuIcon>{icon}</MenuIcon> : null}\n {children}\n {command ? <MenuCommand>{command}</MenuCommand> : null}\n </ui.li>\n )\n },\n)\n\ntype MenuOptionItemOptions = {\n /**\n * The menu option item icon to use.\n */\n icon?: ReactElement | null\n /**\n * The value of the menu option item.\n */\n value?: string\n /**\n * If `true`, the checkbox or radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The type of the menu option item.\n */\n type?: \"radio\" | \"checkbox\"\n}\n\nexport type MenuOptionItemProps = Omit<MenuItemProps, \"icon\" | \"command\"> &\n MenuOptionItemOptions\n\nexport const MenuOptionItem = forwardRef<MenuOptionItemProps, \"button\">(\n (\n { className, icon, isChecked, closeOnSelect = false, children, ...rest },\n ref,\n ) => {\n return (\n <MenuItem\n ref={ref}\n className={cx(\"ui-menu__item--option\", className)}\n aria-checked={ariaAttr(isChecked)}\n closeOnSelect={closeOnSelect}\n {...rest}\n >\n {icon !== null ? (\n <MenuIcon opacity={isChecked ? 1 : 0}>\n {icon || <CheckIcon />}\n </MenuIcon>\n ) : null}\n {children}\n </MenuItem>\n )\n },\n)\n\ntype MenuIconProps = HTMLUIProps<\"span\">\n\nconst MenuIcon = forwardRef<MenuIconProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = {\n flexShrink: 0,\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n fontSize: \"0.85em\",\n ...styles.icon,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__icon\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype MenuCommandProps = HTMLUIProps<\"span\">\n\nconst MenuCommand = forwardRef<MenuCommandProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.command }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__command\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst CheckIcon: FC = () => (\n <svg viewBox=\"0 0 14 14\" width=\"1em\" height=\"1em\">\n <polygon\n fill=\"currentColor\"\n points=\"5.5 11.9993304 14 3.49933039 12.5 2 5.5 8.99933039 1.5 4.9968652 0 6.49933039\"\n />\n </svg>\n)\n"],"mappings":"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","names":["import_utils","import_react","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_react","import_jsx_runtime","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../src/menu-option-group.tsx","../src/menu-group.tsx","../src/menu.tsx","../src/menu-item.tsx"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps } from \"@yamada-ui/core\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { cx, getValidChildren, omitObject, isArray } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, Ref } from \"react\"\nimport { cloneElement, forwardRef, useCallback } from \"react\"\nimport { MenuGroup } from \"./menu-group\"\nimport { MenuOptionItem } from \"./menu-item\"\n\ntype MenuOptionGroupOptions<Y extends string | string[] = string> = {\n /**\n * The label of the option group.\n */\n label?: string\n /**\n * The value of the menu item group.\n */\n value?: Y\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: Y\n /**\n * The type of the menu option group.\n *\n * @default 'checkbox'\n */\n type?: \"radio\" | \"checkbox\"\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport type MenuOptionGroupProps<Y extends string | string[] = string> = Omit<\n HTMLUIProps<\"div\">,\n keyof MenuOptionGroupOptions\n> &\n MenuOptionGroupOptions<Y>\n\nexport const MenuOptionGroup = forwardRef(\n <Y extends string | string[] = string>(\n {\n className,\n defaultValue,\n type,\n children,\n ...rest\n }: MenuOptionGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const isRadio = type === \"radio\"\n\n defaultValue ??= (isRadio ? \"\" : []) as Y\n\n const [value, setValue] = useControllableState({\n ...rest,\n defaultValue,\n })\n\n const onChange = useCallback(\n (selectedValue: string) => {\n if (isRadio && typeof value === \"string\") setValue(selectedValue as Y)\n\n if (!isRadio && isArray(value)) {\n const nextValue = value.includes(selectedValue)\n ? value.filter((item) => item !== selectedValue)\n : value.concat(selectedValue)\n\n setValue(nextValue as Y)\n }\n },\n [isRadio, value, setValue],\n )\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type !== MenuOptionItem) return child\n\n const onClick = (ev: MouseEvent) => {\n onChange(child.props.value)\n child.props.onClick?.(ev)\n }\n\n const isChecked =\n !isRadio && isArray(value)\n ? value.includes(child.props.value)\n : child.props.value === value\n\n return cloneElement(child, { type, onClick, isChecked })\n })\n\n return (\n <MenuGroup\n ref={ref}\n className={cx(\"ui-menu__item--group--option\", className)}\n {...omitObject(rest, [\"value\", \"onChange\"])}\n >\n {cloneChildren}\n </MenuGroup>\n )\n },\n) as {\n <Y extends string | string[] = string>(\n props: MenuOptionGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nMenuOptionGroup.displayName = \"MenuOptionGroup\"\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useMenu } from \"./menu\"\n\nexport type MenuGroupProps = HTMLUIProps<\"div\"> & {\n /**\n * The label of the group.\n */\n label?: string\n}\n\nexport const MenuGroup = forwardRef<MenuGroupProps, \"div\">(\n ({ className, label, children, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.group }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-menu__item\", \"ui-menu__item--group\", className)}\n role=\"group\"\n __css={css}\n {...rest}\n >\n {label ? (\n <ui.span\n className={cx(\"ui-menu__item--group-label\")}\n __css={styles.groupLabel}\n >\n {label}\n </ui.span>\n ) : null}\n\n <ui.ul className=\"ui-menu__item__group\">{children}</ui.ul>\n </ui.li>\n )\n },\n)\n","/**\n * `Menu` is a component that displays a common dropdown menu.\n *\n * @see Docs https://yamada-ui.com/components/overlay/menu\n */\nimport type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport { useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { PopoverProps } from \"@yamada-ui/popover\"\nimport { Popover } from \"@yamada-ui/popover\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { useDisclosure } from \"@yamada-ui/use-disclosure\"\nimport {\n createContext,\n useUnmountEffect,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { Dispatch, FC, RefObject, SetStateAction } from \"react\"\nimport { useCallback, useRef, useState } from \"react\"\n\nconst {\n DescendantsContextProvider,\n useDescendantsContext: useMenuDescendantsContext,\n useDescendants,\n useDescendant: useMenuDescendant,\n} = createDescendant<HTMLElement>()\n\nexport { useMenuDescendantsContext, useMenuDescendant }\n\ntype MenuContext = MenuOptions & {\n isOpen: boolean\n onOpen: () => void\n onClose: () => void\n onFocusFirstItem: () => void\n onFocusLastItem: () => void\n focusedIndex: number\n setFocusedIndex: Dispatch<SetStateAction<number>>\n menuRef: RefObject<HTMLDivElement>\n styles: Record<string, CSSUIObject>\n}\n\nconst [MenuProvider, useMenu] = createContext<MenuContext>({\n name: \"MenuContext\",\n errorMessage: `useMenu returned is 'undefined'. Seems you forgot to wrap the components in \"<Menu />\"`,\n})\n\nexport { useMenu }\n\ntype MenuOptions = {\n /**\n * If `true`, the list element will be closed when value is selected.\n *\n * @default true\n */\n closeOnSelect?: boolean\n}\n\nexport type MenuProps = ThemeProps<\"Menu\"> &\n Omit<PopoverProps, \"closeOnButton\"> &\n MenuOptions\n\nexport const Menu: FC<MenuProps> = (props) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Menu\", props)\n const {\n initialFocusRef,\n closeOnSelect = true,\n placement = \"bottom-start\",\n duration = 0.2,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const descendants = useDescendants()\n\n const [focusedIndex, setFocusedIndex] = useState<number>(-1)\n\n const menuRef = useRef<HTMLDivElement>(null)\n const timeoutIds = useRef<Set<any>>(new Set([]))\n\n const onFocusMenu = useCallback(() => {\n requestAnimationFrame(() =>\n menuRef.current?.focus({ preventScroll: false }),\n )\n }, [])\n\n const onFocusFirstItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const first = descendants.enabledFirstValue()\n\n if (first) setFocusedIndex(first.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onFocusLastItem = useCallback(() => {\n const id = setTimeout(() => {\n if (initialFocusRef) return\n\n const last = descendants.enabledLastValue()\n\n if (last) setFocusedIndex(last.index)\n })\n\n timeoutIds.current.add(id)\n }, [descendants, initialFocusRef])\n\n const onOpenInternal = useCallback(() => {\n rest.onOpen?.()\n\n onFocusMenu()\n }, [onFocusMenu, rest])\n\n const { isOpen, onOpen, onClose } = useDisclosure({\n ...props,\n onOpen: onOpenInternal,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) setFocusedIndex(-1)\n }, [isOpen])\n\n useUnmountEffect(() => {\n timeoutIds.current.forEach((id) => clearTimeout(id))\n timeoutIds.current.clear()\n })\n\n return (\n <DescendantsContextProvider value={descendants}>\n <MenuProvider\n value={{\n isOpen,\n onOpen,\n onClose,\n onFocusFirstItem,\n onFocusLastItem,\n closeOnSelect,\n focusedIndex,\n setFocusedIndex,\n menuRef,\n styles,\n }}\n >\n <Popover\n {...{\n ...rest,\n isOpen,\n onOpen,\n onClose,\n placement,\n duration,\n initialFocusRef,\n closeOnButton: false,\n }}\n />\n </MenuProvider>\n </DescendantsContextProvider>\n )\n}\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { useClickable } from \"@yamada-ui/use-clickable\"\nimport {\n ariaAttr,\n cx,\n isActiveElement,\n isHTMLElement,\n mergeRefs,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { FC, FocusEvent, MouseEvent, ReactElement } from \"react\"\nimport { useCallback, useRef } from \"react\"\nimport { useMenu, useMenuDescendant } from \"./menu\"\n\nconst isTargetMenuItem = (target: EventTarget | null) => {\n return (\n isHTMLElement(target) &&\n !!target?.getAttribute(\"role\")?.startsWith(\"menu-item\")\n )\n}\n\ntype MenuItemOptions = {\n /**\n * If `true`, the menu item will be disabled.\n *\n * @default false\n */\n isDisabled?: boolean\n /**\n * If `true`, the menu item will be focusable.\n *\n * @default false\n */\n isFocusable?: boolean\n /**\n * If `true`, the list element will be closed when selected.\n *\n * @default false\n */\n closeOnSelect?: boolean\n /**\n * The menu item icon to use.\n */\n icon?: ReactElement\n /**\n * Right-aligned label text content, useful for displaying hotkeys.\n */\n command?: string\n}\n\nexport type MenuItemProps = HTMLUIProps<\"button\"> & MenuItemOptions\n\nexport const MenuItem = forwardRef<MenuItemProps, \"button\">(\n (\n {\n as,\n className,\n type,\n isDisabled,\n isFocusable,\n closeOnSelect: customCloseOnSelect,\n icon,\n command,\n children,\n ...props\n },\n ref,\n ) => {\n const {\n focusedIndex,\n setFocusedIndex,\n isOpen,\n onClose,\n closeOnSelect: generalCloseOnSelect,\n menuRef,\n styles,\n } = useMenu()\n\n const trulyDisabled = isDisabled && !isFocusable\n\n const buttonRef = useRef<HTMLButtonElement>(null)\n const { index, register } = useMenuDescendant({ disabled: trulyDisabled })\n\n const isFocused = index === focusedIndex\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLButtonElement>) => {\n props.onClick?.(ev)\n if (!isTargetMenuItem(ev.currentTarget)) return\n\n if (customCloseOnSelect ?? generalCloseOnSelect) onClose()\n },\n [props, customCloseOnSelect, generalCloseOnSelect, onClose],\n )\n\n const onFocus = useCallback(\n (ev: FocusEvent<HTMLButtonElement>) => {\n props.onFocus?.(ev)\n setFocusedIndex(index)\n },\n [props, setFocusedIndex, index],\n )\n\n const rest = useClickable({\n onClick,\n onFocus,\n ref: mergeRefs(register, buttonRef, ref),\n isDisabled,\n isFocusable,\n })\n\n useUpdateEffect(() => {\n if (!isOpen) return\n\n if (isFocused && !trulyDisabled && buttonRef.current) {\n requestAnimationFrame(() => buttonRef.current?.focus())\n } else if (menuRef.current && !isActiveElement(menuRef.current)) {\n menuRef.current.focus()\n }\n }, [isFocused, trulyDisabled, menuRef, isOpen])\n\n type = as || type ? type ?? undefined : \"button\"\n\n children =\n icon || command ? (\n <ui.span style={{ pointerEvents: \"none\", flex: 1 }}>{children}</ui.span>\n ) : (\n children\n )\n\n const css: CSSUIObject = {\n textDecoration: \"none\",\n color: \"inherit\",\n userSelect: \"none\",\n display: \"flex\",\n width: \"100%\",\n alignItems: \"center\",\n textAlign: \"start\",\n flex: \"0 0 auto\",\n outline: 0,\n gap: \"0.75rem\",\n ...styles.item,\n }\n\n return (\n <ui.li\n {...props}\n {...rest}\n as={as}\n type={type}\n role=\"menu-item\"\n tabIndex={isFocused ? 0 : -1}\n className={cx(\"ui-menu__item\", className)}\n __css={css}\n >\n {icon ? <MenuIcon>{icon}</MenuIcon> : null}\n {children}\n {command ? <MenuCommand>{command}</MenuCommand> : null}\n </ui.li>\n )\n },\n)\n\ntype MenuOptionItemOptions = {\n /**\n * The menu option item icon to use.\n */\n icon?: ReactElement | null\n /**\n * The value of the menu option item.\n */\n value?: string\n /**\n * If `true`, the checkbox or radio will be checked.\n *\n * @default false\n */\n isChecked?: boolean\n /**\n * The type of the menu option item.\n */\n type?: \"radio\" | \"checkbox\"\n}\n\nexport type MenuOptionItemProps = Omit<MenuItemProps, \"icon\" | \"command\"> &\n MenuOptionItemOptions\n\nexport const MenuOptionItem = forwardRef<MenuOptionItemProps, \"button\">(\n (\n { className, icon, isChecked, closeOnSelect = false, children, ...rest },\n ref,\n ) => {\n return (\n <MenuItem\n ref={ref}\n className={cx(\"ui-menu__item--option\", className)}\n aria-checked={ariaAttr(isChecked)}\n closeOnSelect={closeOnSelect}\n {...rest}\n >\n {icon !== null ? (\n <MenuIcon opacity={isChecked ? 1 : 0}>\n {icon || <CheckIcon />}\n </MenuIcon>\n ) : null}\n {children}\n </MenuItem>\n )\n },\n)\n\ntype MenuIconProps = HTMLUIProps<\"span\">\n\nconst MenuIcon = forwardRef<MenuIconProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = {\n flexShrink: 0,\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n fontSize: \"0.85em\",\n ...styles.icon,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__icon\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\ntype MenuCommandProps = HTMLUIProps<\"span\">\n\nconst MenuCommand = forwardRef<MenuCommandProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useMenu()\n\n const css: CSSUIObject = { ...styles.command }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-menu__item__command\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nconst CheckIcon: FC = () => (\n <svg viewBox=\"0 0 14 14\" width=\"1em\" height=\"1em\">\n <polygon\n fill=\"currentColor\"\n points=\"5.5 11.9993304 14 3.49933039 12.5 2 5.5 8.99933039 1.5 4.9968652 0 6.49933039\"\n />\n </svg>\n)\n"],"mappings":"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","names":["import_utils","import_react","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_react","import_jsx_runtime","import_jsx_runtime"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/menu",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.23-dev-20240414102445",
|
|
4
4
|
"description": "Yamada UI menu component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -37,13 +37,13 @@
|
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@yamada-ui/core": "1.6.3",
|
|
40
|
-
"@yamada-ui/utils": "1.1.2",
|
|
41
40
|
"@yamada-ui/popover": "1.0.22",
|
|
41
|
+
"@yamada-ui/utils": "1.1.2",
|
|
42
42
|
"@yamada-ui/motion": "1.0.22",
|
|
43
43
|
"@yamada-ui/transitions": "1.0.22",
|
|
44
44
|
"@yamada-ui/use-disclosure": "1.0.11",
|
|
45
|
-
"@yamada-ui/use-descendant": "1.0.11",
|
|
46
45
|
"@yamada-ui/use-clickable": "1.0.11",
|
|
46
|
+
"@yamada-ui/use-descendant": "1.0.11",
|
|
47
47
|
"@yamada-ui/use-controllable-state": "1.0.11"
|
|
48
48
|
},
|
|
49
49
|
"devDependencies": {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/menu-option-group.tsx"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps } from \"@yamada-ui/core\"\nimport { useControllableState } from \"@yamada-ui/use-controllable-state\"\nimport { cx, getValidChildren, omitObject, isArray } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, Ref } from \"react\"\nimport { cloneElement, forwardRef, useCallback } from \"react\"\nimport { MenuGroup } from \"./menu-group\"\nimport { MenuOptionItem } from \"./menu-item\"\n\ntype MenuOptionGroupOptions<Y extends string | string[] = string> = {\n /**\n * The label of the option group.\n */\n label?: string\n /**\n * The value of the menu item group.\n */\n value?: Y\n /**\n * The initial value of the menu item group.\n */\n defaultValue?: Y\n /**\n * The type of the menu option group.\n *\n * @default 'checkbox'\n */\n type?: \"radio\" | \"checkbox\"\n /**\n * The callback fired when any children checkbox is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport type MenuOptionGroupProps<Y extends string | string[] = string> = Omit<\n HTMLUIProps<\"div\">,\n keyof MenuOptionGroupOptions\n> &\n MenuOptionGroupOptions<Y>\n\nexport const MenuOptionGroup = forwardRef(\n <Y extends string | string[] = string>(\n {\n className,\n defaultValue,\n type,\n children,\n ...rest\n }: MenuOptionGroupProps<Y>,\n ref: ForwardedRef<HTMLDivElement>,\n ) => {\n const isRadio = type === \"radio\"\n\n defaultValue = (isRadio ? \"\" : []) as Y\n\n const [value, setValue] = useControllableState({\n ...rest,\n defaultValue,\n })\n\n const onChange = useCallback(\n (selectedValue: string) => {\n if (isRadio && typeof value === \"string\") setValue(selectedValue as Y)\n\n if (!isRadio && isArray(value)) {\n const nextValue = value.includes(selectedValue)\n ? value.filter((item) => item !== selectedValue)\n : value.concat(selectedValue)\n\n setValue(nextValue as Y)\n }\n },\n [isRadio, value, setValue],\n )\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type !== MenuOptionItem) return child\n\n const onClick = (ev: MouseEvent) => {\n onChange(child.props.value)\n child.props.onClick?.(ev)\n }\n\n const isChecked =\n !isRadio && isArray(value)\n ? value.includes(child.props.value)\n : child.props.value === value\n\n return cloneElement(child, { type, onClick, isChecked })\n })\n\n return (\n <MenuGroup\n ref={ref}\n className={cx(\"ui-menu__item--group--option\", className)}\n {...omitObject(rest, [\"value\", \"onChange\"])}\n >\n {cloneChildren}\n </MenuGroup>\n )\n },\n) as {\n <Y extends string | string[] = string>(\n props: MenuOptionGroupProps<Y> & { ref?: Ref<HTMLDivElement> },\n ): JSX.Element\n} & ComponentArgs\n\nMenuOptionGroup.displayName = \"MenuOptionGroup\"\n"],"mappings":";;;;;;;;;AACA,SAAS,4BAA4B;AACrC,SAAS,IAAI,kBAAkB,YAAY,eAAe;AAE1D,SAAS,cAAc,YAAY,mBAAmB;AAyFhD;AAtDC,IAAM,kBAAkB;AAAA,EAC7B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,UAAU,SAAS;AAEzB,mBAAgB,UAAU,KAAK,CAAC;AAEhC,UAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB;AAAA,MAC7C,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AAED,UAAM,WAAW;AAAA,MACf,CAAC,kBAA0B;AACzB,YAAI,WAAW,OAAO,UAAU;AAAU,mBAAS,aAAkB;AAErE,YAAI,CAAC,WAAW,QAAQ,KAAK,GAAG;AAC9B,gBAAM,YAAY,MAAM,SAAS,aAAa,IAC1C,MAAM,OAAO,CAAC,SAAS,SAAS,aAAa,IAC7C,MAAM,OAAO,aAAa;AAE9B,mBAAS,SAAc;AAAA,QACzB;AAAA,MACF;AAAA,MACA,CAAC,SAAS,OAAO,QAAQ;AAAA,IAC3B;AAEA,UAAM,gBAAgB,iBAAiB,QAAQ;AAE/C,UAAM,gBAAgB,cAAc,IAAI,CAAC,UAAU;AACjD,UAAI,MAAM,SAAS;AAAgB,eAAO;AAE1C,YAAM,UAAU,CAAC,OAAmB;AA/E1C;AAgFQ,iBAAS,MAAM,MAAM,KAAK;AAC1B,0BAAM,OAAM,YAAZ,4BAAsB;AAAA,MACxB;AAEA,YAAM,YACJ,CAAC,WAAW,QAAQ,KAAK,IACrB,MAAM,SAAS,MAAM,MAAM,KAAK,IAChC,MAAM,MAAM,UAAU;AAE5B,aAAO,aAAa,OAAO,EAAE,MAAM,SAAS,UAAU,CAAC;AAAA,IACzD,CAAC;AAED,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,gCAAgC,SAAS;AAAA,QACtD,GAAG,WAAW,MAAM,CAAC,SAAS,UAAU,CAAC;AAAA,QAEzC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAMA,gBAAgB,cAAc;","names":[]}
|