npm - @yamada-ui/react - Versions diffs - 2.2.0 → 2.3.0-next-20260411064049 - Mend

@yamada-ui/react 2.2.0 → 2.3.0-next-20260411064049

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.

Files changed (238) hide show

package/dist/cjs/components/accordion/accordion.cjs CHANGED Viewed

@@ -102,7 +102,7 @@ const AccordionItem = withContext(({ button, children, icon, ...rest }) => {
 		})
 	});
 }, "item")();
-const AccordionButton = withContext(({ children, icon: customIcon, containerProps, ...rest }) => {
+const AccordionButton = withContext(({ children, icon: customIcon, suppressHydrationWarning, containerProps, ...rest }) => {
 	const { icon: rootIcon } = useComponentContext();
 	const { icon: itemIcon } = useItemComponentContext();
 	const { disabled, open, getButtonProps } = require_use_accordion.useAccordionItemContext();
@@ -111,9 +111,13 @@ const AccordionButton = withContext(({ children, icon: customIcon, containerProp
 		expanded: open
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.h3, {
+		suppressHydrationWarning,
 		...containerProps,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_factory.styled.button, {
-			...getButtonProps(rest),
+			...getButtonProps({
+				suppressHydrationWarning,
+				...rest
+			}),
 			children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccordionIcon, { children: (0, require_utils_index.utils_exports.runIfFn)(customIcon, props) ?? (0, require_utils_index.utils_exports.runIfFn)(itemIcon, props) ?? (0, require_utils_index.utils_exports.runIfFn)(rootIcon, props) })]
 		})
 	});
@@ -128,7 +132,7 @@ const AccordionIcon = withContext(({ children = /* @__PURE__ */ (0, react_jsx_ru
 	}));
 	return react.Children.count(children) > 1 ? react.Children.only(null) : null;
 }, "icon")();
-const AccordionPanel = withContext(({ animationOpacity, children, delay, duration, endingHeight, startingHeight, transition, transitionEnd, unmountOnExit, ...rest }) => {
+const AccordionPanel = withContext(({ animationOpacity, children, delay, duration, endingHeight, startingHeight, suppressHydrationWarning, transition, transitionEnd, unmountOnExit, ...rest }) => {
 	const { open, getPanelProps } = require_use_accordion.useAccordionItemContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_collapse.Collapse, {
 		animationOpacity,
@@ -141,8 +145,14 @@ const AccordionPanel = withContext(({ animationOpacity, children, delay, duratio
 		transitionEnd,
 		unmountOnExit,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.div, {
-			...getPanelProps(rest),
-			children: (0, require_utils_index.utils_exports.isString)(children) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.p, { children }) : children
+			...getPanelProps({
+				suppressHydrationWarning,
+				...rest
+			}),
+			children: (0, require_utils_index.utils_exports.isString)(children) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.p, {
+				suppressHydrationWarning,
+				children
+			}) : children
 		})
 	});
 }, "panel")();

package/dist/cjs/components/accordion/accordion.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"accordion.cjs","names":["createContext","createSlotComponent","accordionStyle","useAccordion","index","props","AccordionDescendantsContext","AccordionContext","styled","useAccordionItem","useSplitChildren","AccordionItemContext","useAccordionItemContext","ChevronDownIcon","Children","Collapse"],"sources":["../../../../src/components/accordion/accordion.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { CollapseProps } from \"../collapse\"\nimport type { WithTransitionProps } from \"../motion\"\nimport type { AccordionStyle } from \"./accordion.style\"\nimport type { UseAccordionItemProps, UseAccordionProps } from \"./use-accordion\"\nimport { Children, cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { createContext, isString, runIfFn, useSplitChildren } from \"../../utils\"\nimport { Collapse } from \"../collapse\"\nimport { ChevronDownIcon } from \"../icon\"\nimport { accordionStyle } from \"./accordion.style\"\nimport {\n AccordionContext,\n AccordionDescendantsContext,\n AccordionItemContext,\n useAccordion,\n useAccordionItem,\n useAccordionItemContext,\n} from \"./use-accordion\"\n\ninterface AccordionCallBackProps {\n disabled?: boolean\n expanded?: boolean\n}\n\nexport interface AccordionItem extends Omit<AccordionItemProps, \"index\"> {}\n\ninterface ComponentContext extends Pick<\n AccordionRootProps,\n \"icon\" \| \"iconHidden\"\n> {}\n\nexport interface AccordionRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n ThemeProps<AccordionStyle>,\n UseAccordionProps {\n /*\n The accordion icon for all items to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n If `true`, hide the accordion icon for all items.\n \n @default false\n /\n iconHidden?: boolean\n /\n If provided, generate elements based on items.\n /\n items?: AccordionItem[]\n}\n\ninterface ItemComponentContext extends Pick<AccordionItemProps, \"icon\"> {}\n\nconst [ItemComponentContext, useItemComponentContext] =\n createContext<ItemComponentContext>({\n name: \"ItemComponentContext\",\n })\n\nconst {\n ComponentContext,\n PropsContext: AccordionPropsContext,\n useComponentContext,\n usePropsContext: useAccordionPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<AccordionRootProps, AccordionStyle, ComponentContext>(\n \"accordion\",\n accordionStyle,\n)\n\nexport { AccordionPropsContext, useAccordionPropsContext }\n\n/\n `Accordion` is a component for a list that displays information in an expandable or collapsible manner.\n \n @see https://yamada-ui.com/docs/components/accordion\n /\nexport const AccordionRoot = withProvider<\"div\", AccordionRootProps>(\n ({ children, icon, iconHidden, items, ...props }) => {\n const {\n descendants,\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n getRootProps,\n } = useAccordion(props)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items?.map((props, index) => (\n <AccordionItem key={index} index={index} {...props} />\n ))\n }, [children, items])\n const context = useMemo(\n () => ({\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n }),\n [focusedIndex, index, multiple, setFocusedIndex, setIndex, toggle],\n )\n const componentContext = useMemo(\n () => ({ icon, iconHidden }),\n [icon, iconHidden],\n )\n\n return (\n <AccordionDescendantsContext value={descendants}>\n <AccordionContext value={context}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{computedChildren}</styled.div>\n </ComponentContext>\n </AccordionContext>\n </AccordionDescendantsContext>\n )\n },\n \"root\",\n)()\n\nexport interface AccordionItemProps\n extends\n Omit<HTMLStyledProps, \"children\">,\n Omit<UseAccordionItemProps, \"children\"> {\n /\n The accordion button to use.\n /\n button?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion children to use.\n /\n children?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n}\n\nexport const AccordionItem = withContext<\"div\", AccordionItemProps>(\n ({ button, children, icon, ...rest }) => {\n const {\n disabled,\n open,\n getButtonProps,\n getIconProps,\n getItemProps,\n getPanelProps,\n } = useAccordionItem(rest)\n const computedChildren = useMemo(\n () => runIfFn(children, { disabled, expanded: open }),\n [children, disabled, open],\n )\n const [omittedChildren, customAccordionButton, customAccordionPanel] =\n useSplitChildren(computedChildren, AccordionButton, AccordionPanel)\n const context = useMemo(\n () => ({\n disabled,\n icon,\n open,\n getButtonProps,\n getIconProps,\n getPanelProps,\n }),\n [disabled, getButtonProps, getPanelProps, getIconProps, icon, open],\n )\n const componentContext = useMemo(() => ({ icon }), [icon])\n\n return (\n <AccordionItemContext value={context}>\n <ItemComponentContext value={componentContext}>\n <styled.div {...getItemProps()}>\n {customAccordionButton ?? (\n <AccordionButton>\n {runIfFn(button, { disabled, expanded: open })}\n </AccordionButton>\n )}\n {customAccordionPanel ?? (\n <AccordionPanel>{omittedChildren}</AccordionPanel>\n )}\n </styled.div>\n </ItemComponentContext>\n </AccordionItemContext>\n )\n },\n \"item\",\n)()\n\nexport interface AccordionButtonProps extends HTMLStyledProps<\"button\"> {\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n Props the container element.\n */\n containerProps?: HTMLStyledProps\n}\n\nexport const AccordionButton = withContext<\"button\", AccordionButtonProps>(\n ({ children, icon: customIcon, containerProps, ...rest }) => {\n const { icon: rootIcon } = useComponentContext()\n const { icon: itemIcon } = useItemComponentContext()\n const { disabled, open, getButtonProps } = useAccordionItemContext()\n const props = { disabled, expanded: open }\n\n return (\n <styled.h3 {...containerProps}>\n <styled.button {...getButtonProps(rest)}>\n {children}\n\n <AccordionIcon>\n {runIfFn(customIcon, props) ??\n runIfFn(itemIcon, props) ??\n runIfFn(rootIcon, props)}\n </AccordionIcon>\n </styled.button>\n </styled.h3>\n )\n },\n \"button\",\n)()\n\ninterface AccordionIconProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const AccordionIcon = withContext<\"svg\", AccordionIconProps>(\n ({ children = <ChevronDownIcon />, ...rest }) => {\n const { iconHidden } = useComponentContext()\n const { getIconProps } = useAccordionItemContext()\n\n if (iconHidden) return null\n\n if (isValidElement<HTMLProps<\"svg\">>(children))\n return cloneElement(\n children,\n getIconProps({\n ...rest,\n ...children.props,\n }),\n )\n\n return Children.count(children) > 1 ? Children.only(null) : null\n },\n \"icon\",\n)()\n\nexport interface AccordionPanelProps\n extends\n Omit<HTMLStyledProps, \"transition\">,\n Pick<\n CollapseProps,\n \| \"animationOpacity\"\n \| \"endingHeight\"\n \| \"startingHeight\"\n \| keyof WithTransitionProps\n > {}\n\nexport const AccordionPanel = withContext<\"div\", AccordionPanelProps>(\n ({\n animationOpacity,\n children,\n delay,\n duration,\n endingHeight,\n startingHeight,\n transition,\n transitionEnd,\n unmountOnExit,\n ...rest\n }) => {\n const { open, getPanelProps } = useAccordionItemContext()\n\n return (\n <Collapse\n {...{\n animationOpacity,\n delay,\n duration,\n endingHeight,\n open,\n startingHeight,\n transition,\n transitionEnd,\n unmountOnExit,\n }}\n >\n <styled.div {...getPanelProps(rest)}>\n {isString(children) ? <styled.p>{children}</styled.p> : children}\n </styled.div>\n </Collapse>\n )\n },\n \"panel\",\n)()\n"],"mappings":"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"}
1	+ {"version":3,"file":"accordion.cjs","names":["createContext","createSlotComponent","accordionStyle","useAccordion","index","props","AccordionDescendantsContext","AccordionContext","styled","useAccordionItem","useSplitChildren","AccordionItemContext","useAccordionItemContext","ChevronDownIcon","Children","Collapse"],"sources":["../../../../src/components/accordion/accordion.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ReactNodeOrFunction } from \"../../utils\"\nimport type { CollapseProps } from \"../collapse\"\nimport type { WithTransitionProps } from \"../motion\"\nimport type { AccordionStyle } from \"./accordion.style\"\nimport type { UseAccordionItemProps, UseAccordionProps } from \"./use-accordion\"\nimport { Children, cloneElement, isValidElement, useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { createContext, isString, runIfFn, useSplitChildren } from \"../../utils\"\nimport { Collapse } from \"../collapse\"\nimport { ChevronDownIcon } from \"../icon\"\nimport { accordionStyle } from \"./accordion.style\"\nimport {\n AccordionContext,\n AccordionDescendantsContext,\n AccordionItemContext,\n useAccordion,\n useAccordionItem,\n useAccordionItemContext,\n} from \"./use-accordion\"\n\ninterface AccordionCallBackProps {\n disabled?: boolean\n expanded?: boolean\n}\n\nexport interface AccordionItem extends Omit<AccordionItemProps, \"index\"> {}\n\ninterface ComponentContext extends Pick<\n AccordionRootProps,\n \"icon\" \| \"iconHidden\"\n> {}\n\nexport interface AccordionRootProps\n extends\n Omit<HTMLStyledProps, \"onChange\">,\n ThemeProps<AccordionStyle>,\n UseAccordionProps {\n /*\n The accordion icon for all items to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n If `true`, hide the accordion icon for all items.\n \n @default false\n /\n iconHidden?: boolean\n /\n If provided, generate elements based on items.\n /\n items?: AccordionItem[]\n}\n\ninterface ItemComponentContext extends Pick<AccordionItemProps, \"icon\"> {}\n\nconst [ItemComponentContext, useItemComponentContext] =\n createContext<ItemComponentContext>({\n name: \"ItemComponentContext\",\n })\n\nconst {\n ComponentContext,\n PropsContext: AccordionPropsContext,\n useComponentContext,\n usePropsContext: useAccordionPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<AccordionRootProps, AccordionStyle, ComponentContext>(\n \"accordion\",\n accordionStyle,\n)\n\nexport { AccordionPropsContext, useAccordionPropsContext }\n\n/\n `Accordion` is a component for a list that displays information in an expandable or collapsible manner.\n \n @see https://yamada-ui.com/docs/components/accordion\n /\nexport const AccordionRoot = withProvider<\"div\", AccordionRootProps>(\n ({ children, icon, iconHidden, items, ...props }) => {\n const {\n descendants,\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n getRootProps,\n } = useAccordion(props)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items?.map((props, index) => (\n <AccordionItem key={index} index={index} {...props} />\n ))\n }, [children, items])\n const context = useMemo(\n () => ({\n focusedIndex,\n index,\n multiple,\n setFocusedIndex,\n setIndex,\n toggle,\n }),\n [focusedIndex, index, multiple, setFocusedIndex, setIndex, toggle],\n )\n const componentContext = useMemo(\n () => ({ icon, iconHidden }),\n [icon, iconHidden],\n )\n\n return (\n <AccordionDescendantsContext value={descendants}>\n <AccordionContext value={context}>\n <ComponentContext value={componentContext}>\n <styled.div {...getRootProps()}>{computedChildren}</styled.div>\n </ComponentContext>\n </AccordionContext>\n </AccordionDescendantsContext>\n )\n },\n \"root\",\n)()\n\nexport interface AccordionItemProps\n extends\n Omit<HTMLStyledProps, \"children\">,\n Omit<UseAccordionItemProps, \"children\"> {\n /\n The accordion button to use.\n /\n button?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion children to use.\n /\n children?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n}\n\nexport const AccordionItem = withContext<\"div\", AccordionItemProps>(\n ({ button, children, icon, ...rest }) => {\n const {\n disabled,\n open,\n getButtonProps,\n getIconProps,\n getItemProps,\n getPanelProps,\n } = useAccordionItem(rest)\n const computedChildren = useMemo(\n () => runIfFn(children, { disabled, expanded: open }),\n [children, disabled, open],\n )\n const [omittedChildren, customAccordionButton, customAccordionPanel] =\n useSplitChildren(computedChildren, AccordionButton, AccordionPanel)\n const context = useMemo(\n () => ({\n disabled,\n icon,\n open,\n getButtonProps,\n getIconProps,\n getPanelProps,\n }),\n [disabled, getButtonProps, getPanelProps, getIconProps, icon, open],\n )\n const componentContext = useMemo(() => ({ icon }), [icon])\n\n return (\n <AccordionItemContext value={context}>\n <ItemComponentContext value={componentContext}>\n <styled.div {...getItemProps()}>\n {customAccordionButton ?? (\n <AccordionButton>\n {runIfFn(button, { disabled, expanded: open })}\n </AccordionButton>\n )}\n {customAccordionPanel ?? (\n <AccordionPanel>{omittedChildren}</AccordionPanel>\n )}\n </styled.div>\n </ItemComponentContext>\n </AccordionItemContext>\n )\n },\n \"item\",\n)()\n\nexport interface AccordionButtonProps extends HTMLStyledProps<\"button\"> {\n /\n The accordion icon to use.\n /\n icon?: ReactNodeOrFunction<AccordionCallBackProps>\n /\n Props the container element.\n */\n containerProps?: HTMLStyledProps\n}\n\nexport const AccordionButton = withContext<\"button\", AccordionButtonProps>(\n ({\n children,\n icon: customIcon,\n suppressHydrationWarning,\n containerProps,\n ...rest\n }) => {\n const { icon: rootIcon } = useComponentContext()\n const { icon: itemIcon } = useItemComponentContext()\n const { disabled, open, getButtonProps } = useAccordionItemContext()\n const props = { disabled, expanded: open }\n\n return (\n <styled.h3\n suppressHydrationWarning={suppressHydrationWarning}\n {...containerProps}\n >\n <styled.button\n {...getButtonProps({ suppressHydrationWarning, ...rest })}\n >\n {children}\n\n <AccordionIcon>\n {runIfFn(customIcon, props) ??\n runIfFn(itemIcon, props) ??\n runIfFn(rootIcon, props)}\n </AccordionIcon>\n </styled.button>\n </styled.h3>\n )\n },\n \"button\",\n)()\n\ninterface AccordionIconProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const AccordionIcon = withContext<\"svg\", AccordionIconProps>(\n ({ children = <ChevronDownIcon />, ...rest }) => {\n const { iconHidden } = useComponentContext()\n const { getIconProps } = useAccordionItemContext()\n\n if (iconHidden) return null\n\n if (isValidElement<HTMLProps<\"svg\">>(children))\n return cloneElement(\n children,\n getIconProps({\n ...rest,\n ...children.props,\n }),\n )\n\n return Children.count(children) > 1 ? Children.only(null) : null\n },\n \"icon\",\n)()\n\nexport interface AccordionPanelProps\n extends\n Omit<HTMLStyledProps, \"transition\">,\n Pick<\n CollapseProps,\n \| \"animationOpacity\"\n \| \"endingHeight\"\n \| \"startingHeight\"\n \| keyof WithTransitionProps\n > {}\n\nexport const AccordionPanel = withContext<\"div\", AccordionPanelProps>(\n ({\n animationOpacity,\n children,\n delay,\n duration,\n endingHeight,\n startingHeight,\n suppressHydrationWarning,\n transition,\n transitionEnd,\n unmountOnExit,\n ...rest\n }) => {\n const { open, getPanelProps } = useAccordionItemContext()\n\n return (\n <Collapse\n {...{\n animationOpacity,\n delay,\n duration,\n endingHeight,\n open,\n startingHeight,\n transition,\n transitionEnd,\n unmountOnExit,\n }}\n >\n <styled.div {...getPanelProps({ suppressHydrationWarning, ...rest })}>\n {isString(children) ? (\n <styled.p suppressHydrationWarning={suppressHydrationWarning}>\n {children}\n </styled.p>\n ) : (\n children\n )}\n </styled.div>\n </Collapse>\n )\n },\n \"panel\",\n)()\n"],"mappings":"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"}

package/dist/cjs/components/avatar/avatar-group.cjs CHANGED Viewed

@@ -15,7 +15,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * @see https://yamada-ui.com/docs/components/avatar
 */
 const AvatarGroupRoot = require_avatar.component((props) => {
-	const [, { colorScheme, size, variant, shape, ...rest }] = require_avatar.useRootComponentProps(props, "group", { transferProps: [
+	const [, { colorScheme, size, variant, shape, suppressHydrationWarning, ...rest }] = require_avatar.useRootComponentProps(props, "group", { transferProps: [
 		"variant",
 		"colorScheme",
 		"size",
@@ -27,14 +27,17 @@ const AvatarGroupRoot = require_avatar.component((props) => {
 			colorScheme,
 			size,
 			variant,
-			shape
+			shape,
+			suppressHydrationWarning
 		}), [
 			variant,
 			size,
 			colorScheme,
-			shape
+			shape,
+			suppressHydrationWarning
 		]),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_factory.styled.div, {
+			suppressHydrationWarning,
 			...getRootProps(),
 			children: [excess > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_avatar.Avatar, { fallback: `+${excess}` }) : null, children]
 		})

package/dist/cjs/components/avatar/avatar-group.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"avatar-group.cjs","names":["component","useRootComponentProps","useAvatarGroup","AvatarPropsContext","styled","Avatar"],"sources":["../../../../src/components/avatar/avatar-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { AvatarStyle } from \"./avatar.style\"\nimport type { UseAvatarGroupProps } from \"./use-avatar-group\"\nimport { useMemo } from \"react\"\nimport { styled } from \"../../core\"\nimport {\n Avatar,\n AvatarPropsContext,\n component,\n useRootComponentProps,\n} from \"./avatar\"\nimport { useAvatarGroup } from \"./use-avatar-group\"\n\nexport interface AvatarGroupRootProps\n extends HTMLStyledProps, ThemeProps<AvatarStyle>, UseAvatarGroupProps {}\n\n/*\n `Avatar` is a component that displays a profile picture or an icon with initials representing a user.\n \n @see https://yamada-ui.com/docs/components/avatar\n */\nexport const AvatarGroupRoot = component<\"div\", AvatarGroupRootProps>(\n (props) => {\n const [, { colorScheme, size, variant, shape, ...rest }] ~~=\n~~ useRootComponentProps(props, \"group\", {\n transferProps: [\"variant\", \"colorScheme\", \"size\", \"shape\"],\n })\n const { children, excess, getRootProps } = useAvatarGroup(rest)\n const context = useMemo(\n () => ({ colorScheme, size, variant, shape }),\n [variant, size, colorScheme, shape],\n )\n\n return (\n <AvatarPropsContext value={context}>\n <styled.div {...getRootProps()}>\n {excess > 0 ? <Avatar fallback={`+${excess}`} /> : null}\n {children}\n </styled.div>\n </AvatarPropsContext>\n )\n },\n \"group\",\n)()\n"],"mappings":";;;;;;;;;;;;;;;;AAuBA,MAAa,kBAAkBA,0BAC5B,UAAU;CACT,MAAM,~~GAAG~~,EAAE,aAAa,MAAM,SAAS,OAAO,GAAG,~~UAC/CC~~,qCAAsB,OAAO,SAAS,~~EACpC~~,eAAe;EAAC;EAAW;EAAe;EAAQ;EAAQ,EAC3D,CAAC;~~CACJ~~,MAAM,EAAE,UAAU,QAAQ,iBAAiBC,wCAAe,KAAK;~~AAM~~/D,QACE,2CAACC;EAAmB,~~iCALb~~;~~GAAE~~;~~GAAa~~;~~GAAM~~;~~GAAS~~;~~GAAO~~,~~GAC5C~~;GAAC;GAAS;GAAM;GAAa;~~GAAM~~,~~CACpC~~;YAIG,4CAACC,uBAAO;~~GAAI~~,GAAI,cAAc;~~cAC3B~~,SAAS,IAAI,2CAACC,yBAAO,UAAU,IAAI,WAAY,GAAG,MAClD;IACU;GACM;GAGzB,QACD,EAAE"}
1	+ {"version":3,"file":"avatar-group.cjs","names":["component","useRootComponentProps","useAvatarGroup","AvatarPropsContext","styled","Avatar"],"sources":["../../../../src/components/avatar/avatar-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { AvatarStyle } from \"./avatar.style\"\nimport type { UseAvatarGroupProps } from \"./use-avatar-group\"\nimport { useMemo } from \"react\"\nimport { styled } from \"../../core\"\nimport {\n Avatar,\n AvatarPropsContext,\n component,\n useRootComponentProps,\n} from \"./avatar\"\nimport { useAvatarGroup } from \"./use-avatar-group\"\n\nexport interface AvatarGroupRootProps\n extends HTMLStyledProps, ThemeProps<AvatarStyle>, UseAvatarGroupProps {}\n\n/*\n `Avatar` is a component that displays a profile picture or an icon with initials representing a user.\n \n @see https://yamada-ui.com/docs/components/avatar\n */\nexport const AvatarGroupRoot = component<\"div\", AvatarGroupRootProps>(\n (props) => {\n const [\n ,\n { colorScheme, size, variant, shape, suppressHydrationWarning, ...rest },\n ] = useRootComponentProps(props, \"group\", {\n transferProps: [\"variant\", \"colorScheme\", \"size\", \"shape\"],\n })\n const { children, excess, getRootProps } = useAvatarGroup(rest)\n const context = useMemo(\n () => ({\n colorScheme,\n size,\n variant,\n shape,\n suppressHydrationWarning,\n }),\n [variant, size, colorScheme, shape, suppressHydrationWarning],\n )\n\n return (\n <AvatarPropsContext value={context}>\n <styled.div\n suppressHydrationWarning={suppressHydrationWarning}\n {...getRootProps()}\n >\n {excess > 0 ? <Avatar fallback={`+${excess}`} /> : null}\n {children}\n </styled.div>\n </AvatarPropsContext>\n )\n },\n \"group\",\n)()\n"],"mappings":";;;;;;;;;;;;;;;;AAuBA,MAAa,kBAAkBA,0BAC5B,UAAU;CACT,MAAM,GAEJ,EAAE,aAAa,MAAM,SAAS,OAAO,0BAA0B,GAAG,UAChEC,qCAAsB,OAAO,SAAS,EACxC,eAAe;EAAC;EAAW;EAAe;EAAQ;EAAQ,EAC3D,CAAC;CACF,MAAM,EAAE,UAAU,QAAQ,iBAAiBC,wCAAe,KAAK;AAY/D,QACE,2CAACC;EAAmB,iCAXb;GACL;GACA;GACA;GACA;GACA;GACD,GACD;GAAC;GAAS;GAAM;GAAa;GAAO;GAAyB,CAC9D;YAIG,4CAACC,uBAAO;GACoB;GAC1B,GAAI,cAAc;cAEjB,SAAS,IAAI,2CAACC,yBAAO,UAAU,IAAI,WAAY,GAAG,MAClD;IACU;GACM;GAGzB,QACD,EAAE"}

package/dist/cjs/components/checkbox/checkbox-group.cjs CHANGED Viewed

@@ -15,7 +15,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * @see https://yamada-ui.com/docs/components/checkbox
 */
 const CheckboxGroupRoot = require_checkbox.component((props) => {
-	const [, { colorScheme, size, variant, checkedIcon, children, disabled, errorBorderColor, focusBorderColor, invalid, items = [], readOnly, shape, ...rest }] = require_checkbox.useRootComponentProps(props, "group", { transferProps: [
+	const [, { colorScheme, size, variant, checkedIcon, children, disabled, errorBorderColor, focusBorderColor, invalid, items = [], readOnly, shape, suppressHydrationWarning, ...rest }] = require_checkbox.useRootComponentProps(props, "group", { transferProps: [
 		"variant",
 		"colorScheme",
 		"size",
@@ -41,7 +41,8 @@ const CheckboxGroupRoot = require_checkbox.component((props) => {
 			focusBorderColor,
 			invalid,
 			readOnly,
-			shape
+			shape,
+			suppressHydrationWarning
 		}), [
 			variant,
 			size,
@@ -52,7 +53,8 @@ const CheckboxGroupRoot = require_checkbox.component((props) => {
 			readOnly,
 			errorBorderColor,
 			focusBorderColor,
-			checkedIcon
+			checkedIcon,
+			suppressHydrationWarning
 		]),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_checkbox_group.CheckboxGroupContext, {
 			value: (0, react.useMemo)(() => ({
@@ -70,7 +72,7 @@ const CheckboxGroupRoot = require_checkbox.component((props) => {
 			]),
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
 				orientation: "vertical",
-				...getRootProps(),
+				...getRootProps({ suppressHydrationWarning }),
 				children: computedChildren
 			})
 		})

package/dist/cjs/components/checkbox/checkbox-group.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"checkbox-group.cjs","names":["component","useRootComponentProps","useCheckboxGroup","rest","Checkbox","value","CheckboxPropsContext","CheckboxGroupContext","Group"],"sources":["../../../../src/components/checkbox/checkbox-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type {\n GenericsComponent,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { GroupProps } from \"../group\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport type { CheckboxStyle } from \"./checkbox.style\"\nimport type { UseCheckboxGroupProps } from \"./use-checkbox-group\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport {\n Checkbox,\n CheckboxPropsContext,\n component,\n useRootComponentProps,\n} from \"./checkbox\"\nimport { CheckboxGroupContext, useCheckboxGroup } from \"./use-checkbox-group\"\n\nexport interface CheckboxGroupItem<\n Y extends string = string,\n> extends CheckboxProps<Y> {\n label: ReactNode\n}\n\nexport interface CheckboxGroupRootProps<Y extends string = string>\n extends\n Omit<\n WithoutThemeProps<GroupProps, CheckboxStyle>,\n \"defaultValue\" \| \"onChange\" \| \"value\"\n >,\n ThemeProps<CheckboxStyle>,\n UseCheckboxGroupProps<Y>,\n UseInputBorderProps,\n Pick<CheckboxProps, \"checkedIcon\"> {\n /*\n If provided, generate options based on items.\n \n @default []\n /\n items?: CheckboxGroupItem<Y>[]\n}\n\n/\n `CheckboxGroup` is a component that groups `Checkbox` components.\n \n @see https://yamada-ui.com/docs/components/checkbox\n */\nexport const CheckboxGroupRoot = component<\"div\", CheckboxGroupRootProps>(\n (props) => {\n const [\n ,\n {\n colorScheme,\n size,\n variant,\n checkedIcon,\n children,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n items = [],\n readOnly,\n shape,\n ...rest\n },\n ] = useRootComponentProps(props, \"group\", {\n transferProps: [\"variant\", \"colorScheme\", \"size\", \"shape\"],\n })\n const { max, value, getInputProps, getLabelProps, getRootProps, onChange } =\n useCheckboxGroup(rest)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items.map(({ label, value, ...rest }, index) => (\n <Checkbox key={value ?? index} value={value} {...rest}>\n {label}\n </Checkbox>\n ))\n }, [items, children])\n const context = useMemo(\n () => ({\n colorScheme,\n size,\n variant,\n checkedIcon,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n readOnly,\n shape,\n }),\n [\n variant,\n size,\n colorScheme,\n shape,\n disabled,\n invalid,\n readOnly,\n errorBorderColor,\n focusBorderColor,\n checkedIcon,\n ],\n )\n const groupContext = useMemo(\n () => ({ max, value, getInputProps, getLabelProps, onChange }),\n [max, value, getInputProps, getLabelProps, onChange],\n )\n\n return (\n <CheckboxPropsContext value={context}>\n <CheckboxGroupContext value={groupContext}>\n <Group orientation=\"vertical\" {...getRootProps()}>\n {computedChildren}\n </Group>\n </CheckboxGroupContext>\n </CheckboxPropsContext>\n )\n },\n \"group\",\n)() as GenericsComponent<{\n <Y extends string = string>(props: CheckboxGroupRootProps<Y>): ReactElement\n}>\n\nexport { Checkbox as CheckboxGroupItem }\n"],"mappings":";;;;;;;;;;;;;;;;AAoDA,MAAa,oBAAoBA,4BAC9B,UAAU;CACT,MAAM,GAEJ,EACE,aACA,MACA,SACA,aACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,EAAE,EACV,UACA,OACA,GAAG,UAEHC,uCAAsB,OAAO,SAAS,EACxC,eAAe;EAAC;EAAW;EAAe;EAAQ;EAAQ,EAC3D,CAAC;CACF,MAAM,EAAE,KAAK,OAAO,eAAe,eAAe,cAAc,aAC9DC,4CAAiB,KAAK;CACxB,MAAM,4CAAiC;AACrC,MAAI,SAAU,QAAO;AAErB,SAAO,MAAM,KAAK,EAAE,OAAO,gBAAO,GAAGC,UAAQ,UAC3C,2CAACC;GAA8B,OAAOC;GAAO,GAAIF;aAC9C;KADYE,WAAS,MAEb,CACX;IACD,CAAC,OAAO,SAAS,CAAC;~~AAgCrB~~,QACE,2CAACC;EAAqB,~~iCA/Bf~~;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;YAQG,2CAACC;GAAqB,iCANjB;IAAE;IAAK;IAAO;IAAe;IAAe;IAAU,GAC7D;IAAC;IAAK;IAAO;IAAe;IAAe;IAAS,CACrD;aAKK,2CAACC;~~IAAM~~,aAAY;~~IAAW~~,GAAI,~~cAAc~~;~~cAC7C~~;KACK;IACa;GACF;GAG3B,QACD,EAAE"}
1	+ {"version":3,"file":"checkbox-group.cjs","names":["component","useRootComponentProps","useCheckboxGroup","rest","Checkbox","value","CheckboxPropsContext","CheckboxGroupContext","Group"],"sources":["../../../../src/components/checkbox/checkbox-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type {\n GenericsComponent,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { GroupProps } from \"../group\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { CheckboxProps } from \"./checkbox\"\nimport type { CheckboxStyle } from \"./checkbox.style\"\nimport type { UseCheckboxGroupProps } from \"./use-checkbox-group\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport {\n Checkbox,\n CheckboxPropsContext,\n component,\n useRootComponentProps,\n} from \"./checkbox\"\nimport { CheckboxGroupContext, useCheckboxGroup } from \"./use-checkbox-group\"\n\nexport interface CheckboxGroupItem<\n Y extends string = string,\n> extends CheckboxProps<Y> {\n label: ReactNode\n}\n\nexport interface CheckboxGroupRootProps<Y extends string = string>\n extends\n Omit<\n WithoutThemeProps<GroupProps, CheckboxStyle>,\n \"defaultValue\" \| \"onChange\" \| \"value\"\n >,\n ThemeProps<CheckboxStyle>,\n UseCheckboxGroupProps<Y>,\n UseInputBorderProps,\n Pick<CheckboxProps, \"checkedIcon\"> {\n /*\n If provided, generate options based on items.\n \n @default []\n /\n items?: CheckboxGroupItem<Y>[]\n}\n\n/\n `CheckboxGroup` is a component that groups `Checkbox` components.\n \n @see https://yamada-ui.com/docs/components/checkbox\n */\nexport const CheckboxGroupRoot = component<\"div\", CheckboxGroupRootProps>(\n (props) => {\n const [\n ,\n {\n colorScheme,\n size,\n variant,\n checkedIcon,\n children,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n items = [],\n readOnly,\n shape,\n suppressHydrationWarning,\n ...rest\n },\n ] = useRootComponentProps(props, \"group\", {\n transferProps: [\"variant\", \"colorScheme\", \"size\", \"shape\"],\n })\n const { max, value, getInputProps, getLabelProps, getRootProps, onChange } =\n useCheckboxGroup(rest)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items.map(({ label, value, ...rest }, index) => (\n <Checkbox key={value ?? index} value={value} {...rest}>\n {label}\n </Checkbox>\n ))\n }, [items, children])\n const context = useMemo(\n () => ({\n colorScheme,\n size,\n variant,\n checkedIcon,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n readOnly,\n shape,\n suppressHydrationWarning,\n }),\n [\n variant,\n size,\n colorScheme,\n shape,\n disabled,\n invalid,\n readOnly,\n errorBorderColor,\n focusBorderColor,\n checkedIcon,\n suppressHydrationWarning,\n ],\n )\n const groupContext = useMemo(\n () => ({ max, value, getInputProps, getLabelProps, onChange }),\n [max, value, getInputProps, getLabelProps, onChange],\n )\n\n return (\n <CheckboxPropsContext value={context}>\n <CheckboxGroupContext value={groupContext}>\n <Group\n orientation=\"vertical\"\n {...getRootProps({ suppressHydrationWarning })}\n >\n {computedChildren}\n </Group>\n </CheckboxGroupContext>\n </CheckboxPropsContext>\n )\n },\n \"group\",\n)() as GenericsComponent<{\n <Y extends string = string>(props: CheckboxGroupRootProps<Y>): ReactElement\n}>\n\nexport { Checkbox as CheckboxGroupItem }\n"],"mappings":";;;;;;;;;;;;;;;;AAoDA,MAAa,oBAAoBA,4BAC9B,UAAU;CACT,MAAM,GAEJ,EACE,aACA,MACA,SACA,aACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,EAAE,EACV,UACA,OACA,0BACA,GAAG,UAEHC,uCAAsB,OAAO,SAAS,EACxC,eAAe;EAAC;EAAW;EAAe;EAAQ;EAAQ,EAC3D,CAAC;CACF,MAAM,EAAE,KAAK,OAAO,eAAe,eAAe,cAAc,aAC9DC,4CAAiB,KAAK;CACxB,MAAM,4CAAiC;AACrC,MAAI,SAAU,QAAO;AAErB,SAAO,MAAM,KAAK,EAAE,OAAO,gBAAO,GAAGC,UAAQ,UAC3C,2CAACC;GAA8B,OAAOC;GAAO,GAAIF;aAC9C;KADYE,WAAS,MAEb,CACX;IACD,CAAC,OAAO,SAAS,CAAC;AAkCrB,QACE,2CAACC;EAAqB,iCAjCf;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;YAQG,2CAACC;GAAqB,iCANjB;IAAE;IAAK;IAAO;IAAe;IAAe;IAAU,GAC7D;IAAC;IAAK;IAAO;IAAe;IAAe;IAAS,CACrD;aAKK,2CAACC;IACC,aAAY;IACZ,GAAI,aAAa,EAAE,0BAA0B,CAAC;cAE7C;KACK;IACa;GACF;GAG3B,QACD,EAAE"}

package/dist/cjs/components/checkbox-card/checkbox-card-group.cjs CHANGED Viewed

@@ -16,7 +16,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * @see https://yamada-ui.com/docs/components/checkbox-card
 */
 const CheckboxCardGroupRoot = require_checkbox_card.component((props) => {
-	const [, { colorScheme, size, variant, checkedIcon, children, disabled, errorBorderColor, focusBorderColor, invalid, items = [], justify, readOnly, shape, withIndicator, ...rest }] = require_checkbox_card.useRootComponentProps(props, "group", { transferProps: [
+	const [, { colorScheme, size, variant, checkedIcon, children, disabled, errorBorderColor, focusBorderColor, invalid, items = [], justify, readOnly, shape, suppressHydrationWarning, withIndicator, ...rest }] = require_checkbox_card.useRootComponentProps(props, "group", { transferProps: [
 		"variant",
 		"colorScheme",
 		"size",
@@ -45,6 +45,7 @@ const CheckboxCardGroupRoot = require_checkbox_card.component((props) => {
 			justify,
 			readOnly,
 			shape,
+			suppressHydrationWarning,
 			withIndicator
 		}), [
 			colorScheme,
@@ -58,7 +59,8 @@ const CheckboxCardGroupRoot = require_checkbox_card.component((props) => {
 			focusBorderColor,
 			invalid,
 			readOnly,
-			shape
+			shape,
+			suppressHydrationWarning
 		]),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_checkbox_group.CheckboxGroupContext, {
 			value: (0, react.useMemo)(() => ({
@@ -75,7 +77,7 @@ const CheckboxCardGroupRoot = require_checkbox_card.component((props) => {
 				onChange
 			]),
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
-				...getRootProps(),
+				...getRootProps({ suppressHydrationWarning }),
 				children: computedChildren
 			})
 		})

package/dist/cjs/components/checkbox-card/checkbox-card-group.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"checkbox-card-group.cjs","names":["component","useRootComponentProps","useCheckboxGroup","rest","CheckboxCardRoot","value","CheckboxCardPropsContext","CheckboxGroupContext","Group"],"sources":["../../../../src/components/checkbox-card/checkbox-card-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type {\n GenericsComponent,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { UseCheckboxGroupProps } from \"../checkbox\"\nimport type { GroupProps } from \"../group\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { CheckboxCardRootProps } from \"./checkbox-card\"\nimport type { CheckboxCardStyle } from \"./checkbox-card.style\"\nimport { useMemo } from \"react\"\nimport { CheckboxGroupContext, useCheckboxGroup } from \"../checkbox\"\nimport { Group } from \"../group\"\nimport {\n CheckboxCardPropsContext,\n CheckboxCardRoot,\n component,\n useRootComponentProps,\n} from \"./checkbox-card\"\n\nexport interface CheckboxCardGroupItem<\n Y extends string = string,\n> extends CheckboxCardRootProps<Y> {}\n\nexport interface CheckboxCardGroupRootProps<Y extends string = string>\n extends\n Omit<\n WithoutThemeProps<GroupProps, CheckboxCardStyle>,\n \"defaultValue\" \| \"onChange\" \| \"value\"\n >,\n ThemeProps<CheckboxCardStyle>,\n UseCheckboxGroupProps<Y>,\n UseInputBorderProps,\n Pick<CheckboxCardRootProps, \"checkedIcon\" \| \"withIndicator\"> {\n /*\n If provided, generate options based on items.\n \n @default []\n /\n items?: CheckboxCardGroupItem<Y>[]\n}\n\n/\n `CheckboxCardGroup` is a component that groups `CheckboxCard` components.\n \n @see https://yamada-ui.com/docs/components/checkbox-card\n */\nexport const CheckboxCardGroupRoot = component<\n \"div\",\n CheckboxCardGroupRootProps\n>((props) => {\n const [\n ,\n {\n colorScheme,\n size,\n variant,\n checkedIcon,\n children,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n items = [],\n justify,\n readOnly,\n shape,\n withIndicator,\n ...rest\n },\n ] = useRootComponentProps(props, \"group\", {\n transferProps: [\n \"variant\",\n \"colorScheme\",\n \"size\",\n \"shape\",\n \"justify\",\n \"withIndicator\",\n ],\n })\n const { max, value, getInputProps, getLabelProps, getRootProps, onChange } =\n useCheckboxGroup(rest)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items.map(({ value, ...rest }, index) => (\n <CheckboxCardRoot key={value ?? index} value={value} {...rest} />\n ))\n }, [items, children])\n const context = useMemo(\n () => ({\n colorScheme,\n size,\n variant,\n checkedIcon,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n justify,\n readOnly,\n shape,\n withIndicator,\n }),\n [\n colorScheme,\n size,\n checkedIcon,\n variant,\n disabled,\n justify,\n withIndicator,\n errorBorderColor,\n focusBorderColor,\n invalid,\n readOnly,\n shape,\n ],\n )\n const groupContext = useMemo(\n () => ({ max, value, getInputProps, getLabelProps, onChange }),\n [max, value, getInputProps, getLabelProps, onChange],\n )\n\n return (\n <CheckboxCardPropsContext value={context}>\n <CheckboxGroupContext value={groupContext}>\n <Group {...getRootProps()}>{computedChildren}</Group>\n </CheckboxGroupContext>\n </CheckboxCardPropsContext>\n )\n}, \"group\")() as GenericsComponent<{\n <Y extends string = string>(\n props: CheckboxCardGroupRootProps<Y>,\n ): ReactElement\n}>\n\nexport { CheckboxCardRoot as CheckboxCardGroupItem }\n"],"mappings":";;;;;;;;;;;;;;;;;AAkDA,MAAa,wBAAwBA,iCAGlC,UAAU;CACX,MAAM,GAEJ,EACE,aACA,MACA,SACA,aACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,EAAE,EACV,SACA,UACA,OACA,eACA,GAAG,UAEHC,4CAAsB,OAAO,SAAS,EACxC,eAAe;EACb;EACA;EACA;EACA;EACA;EACA;EACD,EACF,CAAC;CACF,MAAM,EAAE,KAAK,OAAO,eAAe,eAAe,cAAc,aAC9DC,4CAAiB,KAAK;CACxB,MAAM,4CAAiC;AACrC,MAAI,SAAU,QAAO;AAErB,SAAO,MAAM,KAAK,EAAE,gBAAO,GAAGC,UAAQ,UACpC,2CAACC;GAAsC,OAAOC;GAAO,GAAIF;KAAlCE,WAAS,MAAiC,CACjE;IACD,CAAC,OAAO,SAAS,CAAC;~~AAoCrB~~,QACE,2CAACC;EAAyB,~~iCAnCnB~~;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;YAQG,2CAACC;GAAqB,iCANjB;IAAE;IAAK;IAAO;IAAe;IAAe;IAAU,GAC7D;IAAC;IAAK;IAAO;IAAe;IAAe;IAAS,CACrD;aAKK,2CAACC;IAAM,GAAI,~~cAAc~~;~~cAAG~~;~~KAAyB~~;~~IAChC~~;GACE;GAE5B,QAAQ,EAAE"}
1	+ {"version":3,"file":"checkbox-card-group.cjs","names":["component","useRootComponentProps","useCheckboxGroup","rest","CheckboxCardRoot","value","CheckboxCardPropsContext","CheckboxGroupContext","Group"],"sources":["../../../../src/components/checkbox-card/checkbox-card-group.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type {\n GenericsComponent,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { UseCheckboxGroupProps } from \"../checkbox\"\nimport type { GroupProps } from \"../group\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { CheckboxCardRootProps } from \"./checkbox-card\"\nimport type { CheckboxCardStyle } from \"./checkbox-card.style\"\nimport { useMemo } from \"react\"\nimport { CheckboxGroupContext, useCheckboxGroup } from \"../checkbox\"\nimport { Group } from \"../group\"\nimport {\n CheckboxCardPropsContext,\n CheckboxCardRoot,\n component,\n useRootComponentProps,\n} from \"./checkbox-card\"\n\nexport interface CheckboxCardGroupItem<\n Y extends string = string,\n> extends CheckboxCardRootProps<Y> {}\n\nexport interface CheckboxCardGroupRootProps<Y extends string = string>\n extends\n Omit<\n WithoutThemeProps<GroupProps, CheckboxCardStyle>,\n \"defaultValue\" \| \"onChange\" \| \"value\"\n >,\n ThemeProps<CheckboxCardStyle>,\n UseCheckboxGroupProps<Y>,\n UseInputBorderProps,\n Pick<CheckboxCardRootProps, \"checkedIcon\" \| \"withIndicator\"> {\n /*\n If provided, generate options based on items.\n \n @default []\n /\n items?: CheckboxCardGroupItem<Y>[]\n}\n\n/\n `CheckboxCardGroup` is a component that groups `CheckboxCard` components.\n \n @see https://yamada-ui.com/docs/components/checkbox-card\n */\nexport const CheckboxCardGroupRoot = component<\n \"div\",\n CheckboxCardGroupRootProps\n>((props) => {\n const [\n ,\n {\n colorScheme,\n size,\n variant,\n checkedIcon,\n children,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n items = [],\n justify,\n readOnly,\n shape,\n suppressHydrationWarning,\n withIndicator,\n ...rest\n },\n ] = useRootComponentProps(props, \"group\", {\n transferProps: [\n \"variant\",\n \"colorScheme\",\n \"size\",\n \"shape\",\n \"justify\",\n \"withIndicator\",\n ],\n })\n const { max, value, getInputProps, getLabelProps, getRootProps, onChange } =\n useCheckboxGroup(rest)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return items.map(({ value, ...rest }, index) => (\n <CheckboxCardRoot key={value ?? index} value={value} {...rest} />\n ))\n }, [items, children])\n const context = useMemo(\n () => ({\n colorScheme,\n size,\n variant,\n checkedIcon,\n disabled,\n errorBorderColor,\n focusBorderColor,\n invalid,\n justify,\n readOnly,\n shape,\n suppressHydrationWarning,\n withIndicator,\n }),\n [\n colorScheme,\n size,\n checkedIcon,\n variant,\n disabled,\n justify,\n withIndicator,\n errorBorderColor,\n focusBorderColor,\n invalid,\n readOnly,\n shape,\n suppressHydrationWarning,\n ],\n )\n const groupContext = useMemo(\n () => ({ max, value, getInputProps, getLabelProps, onChange }),\n [max, value, getInputProps, getLabelProps, onChange],\n )\n\n return (\n <CheckboxCardPropsContext value={context}>\n <CheckboxGroupContext value={groupContext}>\n <Group {...getRootProps({ suppressHydrationWarning })}>\n {computedChildren}\n </Group>\n </CheckboxGroupContext>\n </CheckboxCardPropsContext>\n )\n}, \"group\")() as GenericsComponent<{\n <Y extends string = string>(\n props: CheckboxCardGroupRootProps<Y>,\n ): ReactElement\n}>\n\nexport { CheckboxCardRoot as CheckboxCardGroupItem }\n"],"mappings":";;;;;;;;;;;;;;;;;AAkDA,MAAa,wBAAwBA,iCAGlC,UAAU;CACX,MAAM,GAEJ,EACE,aACA,MACA,SACA,aACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,EAAE,EACV,SACA,UACA,OACA,0BACA,eACA,GAAG,UAEHC,4CAAsB,OAAO,SAAS,EACxC,eAAe;EACb;EACA;EACA;EACA;EACA;EACA;EACD,EACF,CAAC;CACF,MAAM,EAAE,KAAK,OAAO,eAAe,eAAe,cAAc,aAC9DC,4CAAiB,KAAK;CACxB,MAAM,4CAAiC;AACrC,MAAI,SAAU,QAAO;AAErB,SAAO,MAAM,KAAK,EAAE,gBAAO,GAAGC,UAAQ,UACpC,2CAACC;GAAsC,OAAOC;GAAO,GAAIF;KAAlCE,WAAS,MAAiC,CACjE;IACD,CAAC,OAAO,SAAS,CAAC;AAsCrB,QACE,2CAACC;EAAyB,iCArCnB;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;YAQG,2CAACC;GAAqB,iCANjB;IAAE;IAAK;IAAO;IAAe;IAAe;IAAU,GAC7D;IAAC;IAAK;IAAO;IAAe;IAAe;IAAS,CACrD;aAKK,2CAACC;IAAM,GAAI,aAAa,EAAE,0BAA0B,CAAC;cAClD;KACK;IACa;GACE;GAE5B,QAAQ,EAAE"}

package/dist/cjs/components/menu/menu.cjs CHANGED Viewed

@@ -18,7 +18,7 @@ let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/menu/menu.tsx
-const { ComponentContext, PropsContext: MenuPropsContext, StyleContext, useComponentContext, usePropsContext: useMenuPropsContext, withContext, useRootComponentProps } = require_create_component.createSlotComponent("menu", require_menu_style.menuStyle);
+const { ComponentContext, HydrationContext, PropsContext: MenuPropsContext, StyleContext, useComponentContext, usePropsContext: useMenuPropsContext, withContext, useRootComponentProps } = require_create_component.createSlotComponent("menu", require_menu_style.menuStyle);
 /**
 * `Menu` is a component that displays a common dropdown menu.
 *
@@ -26,7 +26,7 @@ const { ComponentContext, PropsContext: MenuPropsContext, StyleContext, useCompo
 */
 const MenuRoot = (props) => {
 	const [styleContext, mergedProps] = useRootComponentProps(props);
-	const [{ animationScheme, initialFocusRef, offset, placement, ...popoverProps }, { children, disabled, ...rest }] = require_use_popover.usePopoverProps(mergedProps, [
+	const [{ animationScheme, initialFocusRef, offset, placement, ...popoverProps }, { children, disabled, suppressHydrationWarning, ...rest }] = require_use_popover.usePopoverProps(mergedProps, [
 		"disabled",
 		"open",
 		"defaultOpen",
@@ -65,55 +65,58 @@ const MenuRoot = (props) => {
 	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyleContext, {
 		value: styleContext,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_menu.MenuDescendantsContext, {
-			value: descendants,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_menu.MenuContext, {
-				value: (0, react.useMemo)(() => ({
-					subMenu,
-					subMenuDirection,
-					onActiveDescendant,
-					onClose,
-					onCloseSubMenu,
-					onOpen,
-					onSelect
-				}), [
-					onClose,
-					onOpen,
-					onSelect,
-					onActiveDescendant,
-					subMenu,
-					subMenuDirection,
-					onCloseSubMenu
-				]),
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_menu.MainMenuContext, {
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HydrationContext, {
+			value: (0, react.useMemo)(() => suppressHydrationWarning ? { suppressHydrationWarning } : {}, [suppressHydrationWarning]),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_menu.MenuDescendantsContext, {
+				value: descendants,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_menu.MenuContext, {
 					value: (0, react.useMemo)(() => ({
-						closeOnSelect,
-						descendants,
+						subMenu,
+						subMenuDirection,
 						onActiveDescendant,
-						onCloseRef,
+						onClose,
+						onCloseSubMenu,
+						onOpen,
 						onSelect
 					}), [
-						closeOnSelect,
-						descendants,
+						onClose,
+						onOpen,
+						onSelect,
 						onActiveDescendant,
-						onCloseRef,
-						onSelect
+						subMenu,
+						subMenuDirection,
+						onCloseSubMenu
 					]),
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_menu.MainMenuContext, {
 						value: (0, react.useMemo)(() => ({
-							getContentProps,
-							getContextTriggerProps,
-							getSeparatorProps,
-							getTriggerProps
+							closeOnSelect,
+							descendants,
+							onActiveDescendant,
+							onCloseRef,
+							onSelect
 						}), [
-							getContentProps,
-							getContextTriggerProps,
-							getSeparatorProps,
-							getTriggerProps
+							closeOnSelect,
+							descendants,
+							onActiveDescendant,
+							onCloseRef,
+							onSelect
 						]),
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_popover.PopoverRoot, {
-							...mergedPopoverProps,
-							children
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
+							value: (0, react.useMemo)(() => ({
+								getContentProps,
+								getContextTriggerProps,
+								getSeparatorProps,
+								getTriggerProps
+							}), [
+								getContentProps,
+								getContextTriggerProps,
+								getSeparatorProps,
+								getTriggerProps
+							]),
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_popover.PopoverRoot, {
+								...mergedPopoverProps,
+								children
+							})
 						})
 					})
 				})

package/dist/cjs/components/menu/menu.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menu.cjs","names":["createSlotComponent","menuStyle","MenuRoot: FC<MenuRootProps>","usePopoverProps","useMenu","MenuDescendantsContext","MenuContext","MainMenuContext","styled","useMenuContext","rest","Fragment","items","index","useMenuGroupContext","useMenuGroup","MenuGroupContext","useMenuOptionGroup","MenuOptionGroupContext","useMenuItem","ChevronRightIcon","useMenuOptionItem","CircleSmallIcon","CheckIcon"],"sources":["../../../../src/components/menu/menu.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, ReactElement, ReactNode } from \"react\"\nimport type {\n GenericsComponent,\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { MenuStyle } from \"./menu.style\"\nimport type {\n MenuOptionGroupType,\n MenuOptionGroupValue,\n UseMenuGroupProps,\n UseMenuItemProps,\n UseMenuOptionGroupProps,\n UseMenuOptionItemProps,\n UseMenuProps,\n UseMenuReturn,\n} from \"./use-menu\"\nimport { Fragment, useMemo, useState } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { cast, handlerAll } from \"../../utils\"\nimport { CheckIcon, ChevronRightIcon, CircleSmallIcon } from \"../icon\"\nimport { Popover, usePopoverProps } from \"../popover\"\nimport { menuStyle } from \"./menu.style\"\nimport {\n MainMenuContext,\n MenuContext,\n MenuDescendantsContext,\n MenuGroupContext,\n MenuOptionGroupContext,\n useMenu,\n useMenuContext,\n useMenuGroup,\n useMenuGroupContext,\n useMenuItem,\n useMenuOptionGroup,\n useMenuOptionItem,\n} from \"./use-menu\"\n\ninterface MenuSharedItem {\n label?: ReactNode\n}\n\ninterface MenuItemWithValue extends MenuSharedItem, MenuItemProps {}\n\ninterface MenuOptionItem extends MenuSharedItem, MenuOptionItemProps {}\n\ninterface MenuItemWithSeparator extends MenuSeparatorProps {\n type: \"separator\"\n}\n\ninterface MenuItemWithRadioGroup<Y extends string = string>\n extends\n Omit<MenuItemWithItems, \"defaultValue\" \| \"items\" \| \"onChange\">,\n MenuOptionGroupProps<\"radio\", Y> {\n type: \"radio\"\n items?: MenuOptionItem[]\n}\n\ninterface MenuItemWithCheckboxGroup<Y extends string[] = string[]>\n extends\n Omit<MenuItemWithItems, \"defaultValue\" \| \"items\" \| \"onChange\">,\n MenuOptionGroupProps<\"checkbox\", Y> {\n type: \"checkbox\"\n items?: MenuOptionItem[]\n}\n\ninterface MenuItemWithItems extends MenuSharedItem, MenuGroupProps {\n hasEndSeparator?: boolean\n hasSeparator?: boolean\n hasStartSeparator?: boolean\n items?: MenuItemWithValue[]\n labelProps?: MenuLabelProps\n}\n\nexport type MenuItem =\n \| MenuItemWithCheckboxGroup\n \| MenuItemWithItems\n \| MenuItemWithRadioGroup\n \| MenuItemWithSeparator\n \| MenuItemWithValue\n\ninterface ComponentContext extends Pick<\n UseMenuReturn,\n \| \"getContentProps\"\n \| \"getContextTriggerProps\"\n \| \"getSeparatorProps\"\n \| \"getTriggerProps\"\n> {}\n\nexport interface MenuRootProps\n extends\n UseMenuProps,\n Omit<\n WithoutThemeProps<Popover.RootProps, MenuStyle>,\n \"autoFocus\" \| \"modal\" \| \"updateRef\" \| \"withCloseButton\"\n >,\n ThemeProps<MenuStyle> {\n /*\n The placement of the popper relative to its reference.\n \n @default 'end-start'\n /\n placement?: Popover.RootProps[\"placement\"]\n}\n\nconst {\n ComponentContext,\n PropsContext: MenuPropsContext,\n StyleContext,\n useComponentContext,\n usePropsContext: useMenuPropsContext,\n withContext,\n useRootComponentProps,\n} = createSlotComponent<MenuRootProps, MenuStyle, ComponentContext>(\n \"menu\",\n menuStyle,\n)\n\nexport { MenuPropsContext, useMenuPropsContext }\n\n/\n `Menu` is a component that displays a common dropdown menu.\n \n @see https://yamada-ui.com/docs/components/menu\n /\nexport const MenuRoot: FC<MenuRootProps> = (props) => {\n const [styleContext, mergedProps] = useRootComponentProps(props)\n const [\n { animationScheme, initialFocusRef, offset, placement, ...popoverProps },\n { children, disabled, ...rest },\n ] = usePopoverProps(mergedProps, [\n \"disabled\",\n \"open\",\n \"defaultOpen\",\n \"onOpen\",\n \"onClose\",\n ])\n const {\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 } = useMenu({ disabled, ...rest })\n const mergedPopoverProps = useMemo<Popover.RootProps>(\n () => ({\n ...popoverProps,\n animationScheme:\n animationScheme ?? (subMenu ? \"inline-start\" : \"block-start\"),\n autoFocus: !!initialFocusRef,\n disabled,\n initialFocusRef,\n offset: offset ?? (subMenu ? [0, 0] : undefined),\n open,\n placement:\n placement ?? (subMenu ? `center-${subMenuDirection}` : \"end-start\"),\n updateRef,\n onClose,\n onOpen,\n }),\n [\n animationScheme,\n disabled,\n initialFocusRef,\n offset,\n onClose,\n onOpen,\n open,\n placement,\n popoverProps,\n subMenu,\n subMenuDirection,\n updateRef,\n ],\n )\n const menuContext = useMemo(\n () => ({\n subMenu,\n subMenuDirection,\n onActiveDescendant,\n onClose,\n onCloseSubMenu,\n onOpen,\n onSelect,\n }),\n [\n onClose,\n onOpen,\n onSelect,\n onActiveDescendant,\n subMenu,\n subMenuDirection,\n onCloseSubMenu,\n ],\n )\n const mainMenuContext = useMemo(\n () => ({\n closeOnSelect,\n descendants,\n onActiveDescendant,\n onCloseRef,\n onSelect,\n }),\n [closeOnSelect, descendants, onActiveDescendant, onCloseRef, onSelect],\n )\n const componentContext = useMemo(\n () => ({\n getContentProps,\n getContextTriggerProps,\n getSeparatorProps,\n getTriggerProps,\n }),\n [\n getContentProps,\n getContextTriggerProps,\n getSeparatorProps,\n getTriggerProps,\n ],\n )\n\n return (\n <StyleContext value={styleContext}>\n <MenuDescendantsContext value={descendants}>\n <MenuContext value={menuContext}>\n <MainMenuContext value={mainMenuContext}>\n <ComponentContext value={componentContext}>\n <Popover.Root {...mergedPopoverProps}>{children}</Popover.Root>\n </ComponentContext>\n </MainMenuContext>\n </MenuContext>\n </MenuDescendantsContext>\n </StyleContext>\n )\n}\n\nexport interface MenuTriggerProps extends Popover.TriggerProps {}\n\nexport const MenuTrigger = withContext<\"button\", MenuTriggerProps>(\n Popover.Trigger,\n \"trigger\",\n)(undefined, (props) => {\n const { getTriggerProps } = useComponentContext()\n\n return cast<HTMLProps<\"button\">>(getTriggerProps(cast<HTMLProps>(props)))\n})\n\ninterface Rect {\n left: number\n top: number\n}\n\nexport interface MenuContextTriggerProps extends HTMLProps {}\n\nexport const MenuContextTrigger = withContext<\"div\", MenuContextTriggerProps>(\n ({ children, onContextMenu, ...rest }) => {\n const [rect, setRect] = useState<Rect>({\n left: 0,\n top: 0,\n })\n const { getContextTriggerProps } = useComponentContext()\n\n return (\n <>\n <MenuAnchor>\n <styled.div style={{ position: \"fixed\", ...rect }} />\n </MenuAnchor>\n\n <styled.div\n asChild\n {...getContextTriggerProps({\n onContextMenu: handlerAll(onContextMenu, (ev) => {\n setRect({ left: ev.clientX, top: ev.clientY })\n }),\n ...rest,\n })}\n >\n {children}\n </styled.div>\n </>\n )\n },\n \"contextTrigger\",\n)()\n\nexport interface MenuAnchorProps extends Popover.AnchorProps {}\n\nexport const MenuAnchor = withContext<\"div\", MenuAnchorProps>(\n Popover.Anchor,\n \"anchor\",\n)()\n\nexport interface MenuContentProps extends Popover.ContentProps {\n /\n The footer of the menu.\n /\n footer?: ReactNode\n /\n The header of the menu.\n /\n header?: ReactNode\n /\n If provided, generate elements based on items.\n /\n items?: MenuItem[]\n /\n Props for the footer component.\n /\n footerProps?: MenuFooterProps\n /\n Props for the header component.\n /\n headerProps?: MenuHeaderProps\n}\n\nexport const MenuContent = withContext<\"div\", MenuContentProps>(\n Popover.Content,\n \"content\",\n)(\n undefined,\n ({\n children,\n footer,\n header,\n items = [],\n footerProps,\n headerProps,\n portalProps,\n ...rest\n }) => {\n const { subMenu } = useMenuContext()\n const { getContentProps } = useComponentContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return (\n <>\n {header ? <MenuHeader {...headerProps}>{header}</MenuHeader> : null}\n\n {items.map((props, index) => {\n if (\"type\" in props) {\n if (props.type === \"radio\") {\n const {\n type,\n hasSeparator = true,\n hasEndSeparator = hasSeparator,\n hasStartSeparator = hasSeparator,\n items = [],\n ...rest\n } = props\n\n return (\n <Fragment key={index}>\n {hasStartSeparator ? <MenuSeparator /> : null}\n\n <MenuOptionGroup type={type} {...rest}>\n {items.map(({ label, ...rest }, index) => (\n <MenuOptionItem key={index} {...rest}>\n {label}\n </MenuOptionItem>\n ))}\n </MenuOptionGroup>\n\n {hasEndSeparator ? <MenuSeparator /> : null}\n </Fragment>\n )\n } else if (props.type === \"checkbox\") {\n const {\n type,\n hasSeparator = true,\n hasEndSeparator = hasSeparator,\n hasStartSeparator = hasSeparator,\n items = [],\n ...rest\n } = props\n\n return (\n <Fragment key={index}>\n {hasStartSeparator ? <MenuSeparator /> : null}\n\n <MenuOptionGroup type={type} {...rest}>\n {items.map(({ label, ...rest }, index) => (\n <MenuOptionItem key={index} {...rest}>\n {label}\n </MenuOptionItem>\n ))}\n </MenuOptionGroup>\n\n {hasEndSeparator ? <MenuSeparator /> : null}\n </Fragment>\n )\n } else {\n return <MenuSeparator key={index} />\n }\n } else if (\"items\" in props) {\n const {\n hasSeparator = true,\n hasEndSeparator = hasSeparator,\n hasStartSeparator = hasSeparator,\n items = [],\n ...rest\n } = props\n\n return (\n <Fragment key={index}>\n {hasStartSeparator ? <MenuSeparator /> : null}\n\n <MenuGroup {...rest}>\n {items.map(({ label, ...rest }, index) => (\n <MenuItem key={index} {...rest}>\n {label}\n </MenuItem>\n ))}\n </MenuGroup>\n\n {hasEndSeparator ? <MenuSeparator /> : null}\n </Fragment>\n )\n } else if (\"value\" in props) {\n const { label, ...rest } = props\n\n return (\n <MenuItem key={index} {...rest}>\n {label}\n </MenuItem>\n )\n }\n })}\n\n {footer ? <MenuFooter {...footerProps}>{footer}</MenuFooter> : null}\n </>\n )\n }, [children, footer, footerProps, header, headerProps, items])\n\n return {\n ...getContentProps(\n cast<HTMLProps>({ ...rest, children: computedChildren }),\n ),\n portalProps: subMenu ? { ...portalProps, disabled: true } : portalProps,\n }\n },\n)\n\nexport interface MenuHeaderProps extends HTMLStyledProps {}\n\nexport const MenuHeader = withContext<\"div\", MenuHeaderProps>(\n \"div\",\n \"header\",\n)({ \"data-header\": \"\" })\n\nexport interface MenuFooterProps extends HTMLStyledProps {}\n\nexport const MenuFooter = withContext<\"div\", MenuFooterProps>(\n \"div\",\n \"footer\",\n)({ \"data-footer\": \"\" })\n\nexport interface MenuLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const MenuLabel = withContext<\"span\", MenuLabelProps>(\"span\", \"label\")(\n undefined,\n (props) => {\n const { getLabelProps } = useMenuGroupContext()\n\n return getLabelProps(props)\n },\n)\n\nexport interface MenuGroupProps extends UseMenuGroupProps, HTMLStyledProps {\n /\n The label of the group.\n /\n label?: ReactNode\n /\n Props for the label component.\n /\n labelProps?: MenuLabelProps\n}\n\nexport const MenuGroup = withContext<\"div\", MenuGroupProps>(\n ({ children, label, labelProps, ...rest }) => {\n const { getGroupProps, getLabelProps } = useMenuGroup(rest)\n const context = useMemo(() => ({ getLabelProps }), [getLabelProps])\n\n return (\n <MenuGroupContext value={context}>\n <styled.div {...getGroupProps()}>\n {label ? <MenuLabel {...labelProps}>{label}</MenuLabel> : null}\n {children}\n </styled.div>\n </MenuGroupContext>\n )\n },\n \"group\",\n)()\n\nexport interface MenuOptionGroupProps<\n Y extends MenuOptionGroupType = \"checkbox\",\n M extends MenuOptionGroupValue<Y> = MenuOptionGroupValue<Y>,\n>\n extends\n UseMenuOptionGroupProps<Y, M>,\n Omit<MenuGroupProps, \"defaultValue\" \| \"onChange\"> {}\n\nexport const MenuOptionGroup = withContext<\"div\", MenuOptionGroupProps>(\n ({\n type: typeProp,\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n }) => {\n const { type, value, onChange } = useMenuOptionGroup({\n type: typeProp,\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const context = useMemo(\n () => ({ type, value, onChange }),\n [type, value, onChange],\n )\n\n return (\n <MenuOptionGroupContext value={context}>\n <MenuGroup {...rest} />\n </MenuOptionGroupContext>\n )\n },\n { name: \"OptionGroup\", slot: [\"group\", \"option\"] },\n)() as GenericsComponent<{\n <\n Y extends MenuOptionGroupType = \"checkbox\",\n M extends MenuOptionGroupValue<Y> = MenuOptionGroupValue<Y>,\n >(\n props: MenuOptionGroupProps<Y, M>,\n ): ReactElement\n}>\n\nexport interface MenuItemProps extends HTMLStyledProps, UseMenuItemProps {}\n\nexport const MenuItem = withContext<\"div\", MenuItemProps>(\n ({ children, ...rest }) => {\n const { subMenuTrigger, getItemProps } = useMenuItem(rest)\n\n return (\n <styled.div {...getItemProps()}>\n {children}\n\n {subMenuTrigger ? (\n <MenuIndicator as={ChevronRightIcon} ms=\"auto\" />\n ) : null}\n </styled.div>\n )\n },\n \"item\",\n)()\n\nexport interface MenuOptionItemProps\n extends HTMLStyledProps, UseMenuOptionItemProps {\n /\n The icon to be used in the menu option item.\n */\n icon?: ReactNode\n}\n\nexport const MenuOptionItem = withContext<\"div\", MenuOptionItemProps>(\n ({ children, icon, ...rest }) => {\n const { type, getIndicatorProps, getOptionItemProps } =\n useMenuOptionItem(rest)\n\n return (\n <styled.div {...getOptionItemProps()}>\n <MenuIndicator {...getIndicatorProps()}>\n {icon \|\|\n (type === \"radio\" ? (\n <CircleSmallIcon fill=\"currentColor\" />\n ) : (\n <CheckIcon />\n ))}\n </MenuIndicator>\n {children}\n </styled.div>\n )\n },\n { name: \"OptionItem\", slot: [\"item\", \"option\"] },\n)()\n\nexport interface MenuIndicatorProps extends HTMLStyledProps {}\n\nexport const MenuIndicator = withContext<\"div\", MenuIndicatorProps>(\n \"div\",\n \"indicator\",\n)()\n\nexport interface MenuCommandProps extends HTMLStyledProps<\"kbd\"> {}\n\nexport const MenuCommand = withContext<\"kbd\", MenuCommandProps>(\n \"kbd\",\n \"command\",\n)()\n\nexport interface MenuSeparatorProps extends HTMLStyledProps<\"hr\"> {}\n\nexport const MenuSeparator = withContext<\"hr\", MenuSeparatorProps>(\n \"hr\",\n \"separator\",\n)(undefined, (props) => {\n const { getSeparatorProps } = useComponentContext()\n\n return getSeparatorProps(props)\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA6GA,MAAM,EACJ,kBACA,cAAc,kBACd,cACA,qBACA,iBAAiB,qBACjB,aACA,0BACEA,6CACF,QACAC,6BACD;;;;;;AASD,MAAaC,YAA+B,UAAU;CACpD,MAAM,CAAC,cAAc,eAAe,sBAAsB,MAAM;CAChE,MAAM,CACJ,EAAE,iBAAiB,iBAAiB,QAAQ,WAAW,GAAG,gBAC1D,EAAE,UAAU,UAAU,GAAG,UACvBC,oCAAgB,aAAa;EAC/B;EACA;EACA;EACA;EACA;EACD,CAAC;CACF,MAAM,EACJ,eACA,aACA,MACA,SACA,kBACA,WACA,iBACA,wBACA,mBACA,iBACA,oBACA,SACA,YACA,gBACA,QACA,aACEC,yBAAQ;EAAE;EAAU,GAAG;EAAM,CAAC;CAClC,MAAM,+CACG;EACL,GAAG;EACH,iBACE,oBAAoB,UAAU,iBAAiB;EACjD,WAAW,CAAC,CAAC;EACb;EACA;EACA,QAAQ,WAAW,UAAU,CAAC,GAAG,EAAE,GAAG;EACtC;EACA,WACE,cAAc,UAAU,UAAU,qBAAqB;EACzD;EACA;EACA;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AA8CD,QACE,2CAAC;EAAa,OAAO;YACnB,2CAACC;GAAuB,OAAO;aAC7B,2CAACC;IAAY,iCA/CV;KACL;KACA;KACA;KACA;KACA;KACA;KACA;KACD,GACD;KACE;KACA;KACA;KACA;KACA;KACA;KACA;KACD,CACF;cA8BO,2CAACC;KAAgB,iCA5BhB;MACL;MACA;MACA;MACA;MACA;MACD,GACD;MAAC;MAAe;MAAa;MAAoB;MAAY;MAAS,CACvE;eAqBS,2CAAC;MAAiB,iCAnBnB;OACL;OACA;OACA;OACA;OACD,GACD;OACE;OACA;OACA;OACA;OACD,CACF;gBAQW;OAAc,GAAI;OAAqB;QAAwB;OAC9C;MACH;KACN;IACS;GACZ;;AAMnB,MAAa,cAAc,4CAEzB,UACD,CAAC,SAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,qBAAqB;AAEjD,oDAAiC,4DAAgC,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"}
1	+ {"version":3,"file":"menu.cjs","names":["createSlotComponent","menuStyle","MenuRoot: FC<MenuRootProps>","usePopoverProps","useMenu","MenuDescendantsContext","MenuContext","MainMenuContext","styled","useMenuContext","rest","Fragment","items","index","useMenuGroupContext","useMenuGroup","MenuGroupContext","useMenuOptionGroup","MenuOptionGroupContext","useMenuItem","ChevronRightIcon","useMenuOptionItem","CircleSmallIcon","CheckIcon"],"sources":["../../../../src/components/menu/menu.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, ReactElement, ReactNode } from \"react\"\nimport type {\n GenericsComponent,\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n WithoutThemeProps,\n} from \"../../core\"\nimport type { MenuStyle } from \"./menu.style\"\nimport type {\n MenuOptionGroupType,\n MenuOptionGroupValue,\n UseMenuGroupProps,\n UseMenuItemProps,\n UseMenuOptionGroupProps,\n UseMenuOptionItemProps,\n UseMenuProps,\n UseMenuReturn,\n} from \"./use-menu\"\nimport { Fragment, useMemo, useState } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { cast, handlerAll } from \"../../utils\"\nimport { CheckIcon, ChevronRightIcon, CircleSmallIcon } from \"../icon\"\nimport { Popover, usePopoverProps } from \"../popover\"\nimport { menuStyle } from \"./menu.style\"\nimport {\n MainMenuContext,\n MenuContext,\n MenuDescendantsContext,\n MenuGroupContext,\n MenuOptionGroupContext,\n useMenu,\n useMenuContext,\n useMenuGroup,\n useMenuGroupContext,\n useMenuItem,\n useMenuOptionGroup,\n useMenuOptionItem,\n} from \"./use-menu\"\n\ninterface MenuSharedItem {\n label?: ReactNode\n}\n\ninterface MenuItemWithValue extends MenuSharedItem, MenuItemProps {}\n\ninterface MenuOptionItem extends MenuSharedItem, MenuOptionItemProps {}\n\ninterface MenuItemWithSeparator extends MenuSeparatorProps {\n type: \"separator\"\n}\n\ninterface MenuItemWithRadioGroup<Y extends string = string>\n extends\n Omit<MenuItemWithItems, \"defaultValue\" \| \"items\" \| \"onChange\">,\n MenuOptionGroupProps<\"radio\", Y> {\n type: \"radio\"\n items?: MenuOptionItem[]\n}\n\ninterface MenuItemWithCheckboxGroup<Y extends string[] = string[]>\n extends\n Omit<MenuItemWithItems, \"defaultValue\" \| \"items\" \| \"onChange\">,\n MenuOptionGroupProps<\"checkbox\", Y> {\n type: \"checkbox\"\n items?: MenuOptionItem[]\n}\n\ninterface MenuItemWithItems extends MenuSharedItem, MenuGroupProps {\n hasEndSeparator?: boolean\n hasSeparator?: boolean\n hasStartSeparator?: boolean\n items?: MenuItemWithValue[]\n labelProps?: MenuLabelProps\n}\n\nexport type MenuItem =\n \| MenuItemWithCheckboxGroup\n \| MenuItemWithItems\n \| MenuItemWithRadioGroup\n \| MenuItemWithSeparator\n \| MenuItemWithValue\n\ninterface ComponentContext extends Pick<\n UseMenuReturn,\n \| \"getContentProps\"\n \| \"getContextTriggerProps\"\n \| \"getSeparatorProps\"\n \| \"getTriggerProps\"\n> {}\n\nexport interface MenuRootProps\n extends\n UseMenuProps,\n Omit<\n WithoutThemeProps<Popover.RootProps, MenuStyle>,\n \"autoFocus\" \| \"modal\" \| \"updateRef\" \| \"withCloseButton\"\n >,\n ThemeProps<MenuStyle> {\n /*\n The placement of the popper relative to its reference.\n \n @default 'end-start'\n /\n placement?: Popover.RootProps[\"placement\"]\n}\n\nconst {\n ComponentContext,\n HydrationContext,\n PropsContext: MenuPropsContext,\n StyleContext,\n useComponentContext,\n usePropsContext: useMenuPropsContext,\n withContext,\n useRootComponentProps,\n} = createSlotComponent<MenuRootProps, MenuStyle, ComponentContext>(\n \"menu\",\n menuStyle,\n)\n\nexport { MenuPropsContext, useMenuPropsContext }\n\n/\n `Menu` is a component that displays a common dropdown menu.\n \n @see https://yamada-ui.com/docs/components/menu\n /\nexport const MenuRoot: FC<MenuRootProps> = (props) => {\n const [styleContext, mergedProps] = useRootComponentProps(props)\n const [\n { animationScheme, initialFocusRef, offset, placement, ...popoverProps },\n { children, disabled, suppressHydrationWarning, ...rest },\n ] = usePopoverProps(mergedProps, [\n \"disabled\",\n \"open\",\n \"defaultOpen\",\n \"onOpen\",\n \"onClose\",\n ])\n const {\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 } = useMenu({ disabled, ...rest })\n const mergedPopoverProps = useMemo<Popover.RootProps>(\n () => ({\n ...popoverProps,\n animationScheme:\n animationScheme ?? (subMenu ? \"inline-start\" : \"block-start\"),\n autoFocus: !!initialFocusRef,\n disabled,\n initialFocusRef,\n offset: offset ?? (subMenu ? [0, 0] : undefined),\n open,\n placement:\n placement ?? (subMenu ? `center-${subMenuDirection}` : \"end-start\"),\n updateRef,\n onClose,\n onOpen,\n }),\n [\n animationScheme,\n disabled,\n initialFocusRef,\n offset,\n onClose,\n onOpen,\n open,\n placement,\n popoverProps,\n subMenu,\n subMenuDirection,\n updateRef,\n ],\n )\n const hydrationContext = useMemo(\n () => (suppressHydrationWarning ? { suppressHydrationWarning } : {}),\n [suppressHydrationWarning],\n )\n const menuContext = useMemo(\n () => ({\n subMenu,\n subMenuDirection,\n onActiveDescendant,\n onClose,\n onCloseSubMenu,\n onOpen,\n onSelect,\n }),\n [\n onClose,\n onOpen,\n onSelect,\n onActiveDescendant,\n subMenu,\n subMenuDirection,\n onCloseSubMenu,\n ],\n )\n const mainMenuContext = useMemo(\n () => ({\n closeOnSelect,\n descendants,\n onActiveDescendant,\n onCloseRef,\n onSelect,\n }),\n [closeOnSelect, descendants, onActiveDescendant, onCloseRef, onSelect],\n )\n const componentContext = useMemo(\n () => ({\n getContentProps,\n getContextTriggerProps,\n getSeparatorProps,\n getTriggerProps,\n }),\n [\n getContentProps,\n getContextTriggerProps,\n getSeparatorProps,\n getTriggerProps,\n ],\n )\n\n return (\n <StyleContext value={styleContext}>\n <HydrationContext value={hydrationContext}>\n <MenuDescendantsContext value={descendants}>\n <MenuContext value={menuContext}>\n <MainMenuContext value={mainMenuContext}>\n <ComponentContext value={componentContext}>\n <Popover.Root {...mergedPopoverProps}>{children}</Popover.Root>\n </ComponentContext>\n </MainMenuContext>\n </MenuContext>\n </MenuDescendantsContext>\n </HydrationContext>\n </StyleContext>\n )\n}\n\nexport interface MenuTriggerProps extends Popover.TriggerProps {}\n\nexport const MenuTrigger = withContext<\"button\", MenuTriggerProps>(\n Popover.Trigger,\n \"trigger\",\n)(undefined, (props) => {\n const { getTriggerProps } = useComponentContext()\n\n return cast<HTMLProps<\"button\">>(getTriggerProps(cast<HTMLProps>(props)))\n})\n\ninterface Rect {\n left: number\n top: number\n}\n\nexport interface MenuContextTriggerProps extends HTMLProps {}\n\nexport const MenuContextTrigger = withContext<\"div\", MenuContextTriggerProps>(\n ({ children, onContextMenu, ...rest }) => {\n const [rect, setRect] = useState<Rect>({\n left: 0,\n top: 0,\n })\n const { getContextTriggerProps } = useComponentContext()\n\n return (\n <>\n <MenuAnchor>\n <styled.div style={{ position: \"fixed\", ...rect }} />\n </MenuAnchor>\n\n <styled.div\n asChild\n {...getContextTriggerProps({\n onContextMenu: handlerAll(onContextMenu, (ev) => {\n setRect({ left: ev.clientX, top: ev.clientY })\n }),\n ...rest,\n })}\n >\n {children}\n </styled.div>\n </>\n )\n },\n \"contextTrigger\",\n)()\n\nexport interface MenuAnchorProps extends Popover.AnchorProps {}\n\nexport const MenuAnchor = withContext<\"div\", MenuAnchorProps>(\n Popover.Anchor,\n \"anchor\",\n)()\n\nexport interface MenuContentProps extends Popover.ContentProps {\n /\n The footer of the menu.\n /\n footer?: ReactNode\n /\n The header of the menu.\n /\n header?: ReactNode\n /\n If provided, generate elements based on items.\n /\n items?: MenuItem[]\n /\n Props for the footer component.\n /\n footerProps?: MenuFooterProps\n /\n Props for the header component.\n /\n headerProps?: MenuHeaderProps\n}\n\nexport const MenuContent = withContext<\"div\", MenuContentProps>(\n Popover.Content,\n \"content\",\n)(\n undefined,\n ({\n children,\n footer,\n header,\n items = [],\n footerProps,\n headerProps,\n portalProps,\n ...rest\n }) => {\n const { subMenu } = useMenuContext()\n const { getContentProps } = useComponentContext()\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return (\n <>\n {header ? <MenuHeader {...headerProps}>{header}</MenuHeader> : null}\n\n {items.map((props, index) => {\n if (\"type\" in props) {\n if (props.type === \"radio\") {\n const {\n type,\n hasSeparator = true,\n hasEndSeparator = hasSeparator,\n hasStartSeparator = hasSeparator,\n items = [],\n ...rest\n } = props\n\n return (\n <Fragment key={index}>\n {hasStartSeparator ? <MenuSeparator /> : null}\n\n <MenuOptionGroup type={type} {...rest}>\n {items.map(({ label, ...rest }, index) => (\n <MenuOptionItem key={index} {...rest}>\n {label}\n </MenuOptionItem>\n ))}\n </MenuOptionGroup>\n\n {hasEndSeparator ? <MenuSeparator /> : null}\n </Fragment>\n )\n } else if (props.type === \"checkbox\") {\n const {\n type,\n hasSeparator = true,\n hasEndSeparator = hasSeparator,\n hasStartSeparator = hasSeparator,\n items = [],\n ...rest\n } = props\n\n return (\n <Fragment key={index}>\n {hasStartSeparator ? <MenuSeparator /> : null}\n\n <MenuOptionGroup type={type} {...rest}>\n {items.map(({ label, ...rest }, index) => (\n <MenuOptionItem key={index} {...rest}>\n {label}\n </MenuOptionItem>\n ))}\n </MenuOptionGroup>\n\n {hasEndSeparator ? <MenuSeparator /> : null}\n </Fragment>\n )\n } else {\n return <MenuSeparator key={index} />\n }\n } else if (\"items\" in props) {\n const {\n hasSeparator = true,\n hasEndSeparator = hasSeparator,\n hasStartSeparator = hasSeparator,\n items = [],\n ...rest\n } = props\n\n return (\n <Fragment key={index}>\n {hasStartSeparator ? <MenuSeparator /> : null}\n\n <MenuGroup {...rest}>\n {items.map(({ label, ...rest }, index) => (\n <MenuItem key={index} {...rest}>\n {label}\n </MenuItem>\n ))}\n </MenuGroup>\n\n {hasEndSeparator ? <MenuSeparator /> : null}\n </Fragment>\n )\n } else if (\"value\" in props) {\n const { label, ...rest } = props\n\n return (\n <MenuItem key={index} {...rest}>\n {label}\n </MenuItem>\n )\n }\n })}\n\n {footer ? <MenuFooter {...footerProps}>{footer}</MenuFooter> : null}\n </>\n )\n }, [children, footer, footerProps, header, headerProps, items])\n\n return {\n ...getContentProps(\n cast<HTMLProps>({ ...rest, children: computedChildren }),\n ),\n portalProps: subMenu ? { ...portalProps, disabled: true } : portalProps,\n }\n },\n)\n\nexport interface MenuHeaderProps extends HTMLStyledProps {}\n\nexport const MenuHeader = withContext<\"div\", MenuHeaderProps>(\n \"div\",\n \"header\",\n)({ \"data-header\": \"\" })\n\nexport interface MenuFooterProps extends HTMLStyledProps {}\n\nexport const MenuFooter = withContext<\"div\", MenuFooterProps>(\n \"div\",\n \"footer\",\n)({ \"data-footer\": \"\" })\n\nexport interface MenuLabelProps extends HTMLStyledProps<\"span\"> {}\n\nexport const MenuLabel = withContext<\"span\", MenuLabelProps>(\"span\", \"label\")(\n undefined,\n (props) => {\n const { getLabelProps } = useMenuGroupContext()\n\n return getLabelProps(props)\n },\n)\n\nexport interface MenuGroupProps extends UseMenuGroupProps, HTMLStyledProps {\n /\n The label of the group.\n /\n label?: ReactNode\n /\n Props for the label component.\n /\n labelProps?: MenuLabelProps\n}\n\nexport const MenuGroup = withContext<\"div\", MenuGroupProps>(\n ({ children, label, labelProps, ...rest }) => {\n const { getGroupProps, getLabelProps } = useMenuGroup(rest)\n const context = useMemo(() => ({ getLabelProps }), [getLabelProps])\n\n return (\n <MenuGroupContext value={context}>\n <styled.div {...getGroupProps()}>\n {label ? <MenuLabel {...labelProps}>{label}</MenuLabel> : null}\n {children}\n </styled.div>\n </MenuGroupContext>\n )\n },\n \"group\",\n)()\n\nexport interface MenuOptionGroupProps<\n Y extends MenuOptionGroupType = \"checkbox\",\n M extends MenuOptionGroupValue<Y> = MenuOptionGroupValue<Y>,\n>\n extends\n UseMenuOptionGroupProps<Y, M>,\n Omit<MenuGroupProps, \"defaultValue\" \| \"onChange\"> {}\n\nexport const MenuOptionGroup = withContext<\"div\", MenuOptionGroupProps>(\n ({\n type: typeProp,\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n }) => {\n const { type, value, onChange } = useMenuOptionGroup({\n type: typeProp,\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const context = useMemo(\n () => ({ type, value, onChange }),\n [type, value, onChange],\n )\n\n return (\n <MenuOptionGroupContext value={context}>\n <MenuGroup {...rest} />\n </MenuOptionGroupContext>\n )\n },\n { name: \"OptionGroup\", slot: [\"group\", \"option\"] },\n)() as GenericsComponent<{\n <\n Y extends MenuOptionGroupType = \"checkbox\",\n M extends MenuOptionGroupValue<Y> = MenuOptionGroupValue<Y>,\n >(\n props: MenuOptionGroupProps<Y, M>,\n ): ReactElement\n}>\n\nexport interface MenuItemProps extends HTMLStyledProps, UseMenuItemProps {}\n\nexport const MenuItem = withContext<\"div\", MenuItemProps>(\n ({ children, ...rest }) => {\n const { subMenuTrigger, getItemProps } = useMenuItem(rest)\n\n return (\n <styled.div {...getItemProps()}>\n {children}\n\n {subMenuTrigger ? (\n <MenuIndicator as={ChevronRightIcon} ms=\"auto\" />\n ) : null}\n </styled.div>\n )\n },\n \"item\",\n)()\n\nexport interface MenuOptionItemProps\n extends HTMLStyledProps, UseMenuOptionItemProps {\n /\n The icon to be used in the menu option item.\n */\n icon?: ReactNode\n}\n\nexport const MenuOptionItem = withContext<\"div\", MenuOptionItemProps>(\n ({ children, icon, ...rest }) => {\n const { type, getIndicatorProps, getOptionItemProps } =\n useMenuOptionItem(rest)\n\n return (\n <styled.div {...getOptionItemProps()}>\n <MenuIndicator {...getIndicatorProps()}>\n {icon \|\|\n (type === \"radio\" ? (\n <CircleSmallIcon fill=\"currentColor\" />\n ) : (\n <CheckIcon />\n ))}\n </MenuIndicator>\n {children}\n </styled.div>\n )\n },\n { name: \"OptionItem\", slot: [\"item\", \"option\"] },\n)()\n\nexport interface MenuIndicatorProps extends HTMLStyledProps {}\n\nexport const MenuIndicator = withContext<\"div\", MenuIndicatorProps>(\n \"div\",\n \"indicator\",\n)()\n\nexport interface MenuCommandProps extends HTMLStyledProps<\"kbd\"> {}\n\nexport const MenuCommand = withContext<\"kbd\", MenuCommandProps>(\n \"kbd\",\n \"command\",\n)()\n\nexport interface MenuSeparatorProps extends HTMLStyledProps<\"hr\"> {}\n\nexport const MenuSeparator = withContext<\"hr\", MenuSeparatorProps>(\n \"hr\",\n \"separator\",\n)(undefined, (props) => {\n const { getSeparatorProps } = useComponentContext()\n\n return getSeparatorProps(props)\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA6GA,MAAM,EACJ,kBACA,kBACA,cAAc,kBACd,cACA,qBACA,iBAAiB,qBACjB,aACA,0BACEA,6CACF,QACAC,6BACD;;;;;;AASD,MAAaC,YAA+B,UAAU;CACpD,MAAM,CAAC,cAAc,eAAe,sBAAsB,MAAM;CAChE,MAAM,CACJ,EAAE,iBAAiB,iBAAiB,QAAQ,WAAW,GAAG,gBAC1D,EAAE,UAAU,UAAU,0BAA0B,GAAG,UACjDC,oCAAgB,aAAa;EAC/B;EACA;EACA;EACA;EACA;EACD,CAAC;CACF,MAAM,EACJ,eACA,aACA,MACA,SACA,kBACA,WACA,iBACA,wBACA,mBACA,iBACA,oBACA,SACA,YACA,gBACA,QACA,aACEC,yBAAQ;EAAE;EAAU,GAAG;EAAM,CAAC;CAClC,MAAM,+CACG;EACL,GAAG;EACH,iBACE,oBAAoB,UAAU,iBAAiB;EACjD,WAAW,CAAC,CAAC;EACb;EACA;EACA,QAAQ,WAAW,UAAU,CAAC,GAAG,EAAE,GAAG;EACtC;EACA,WACE,cAAc,UAAU,UAAU,qBAAqB;EACzD;EACA;EACA;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AAkDD,QACE,2CAAC;EAAa,OAAO;YACnB,2CAAC;GAAiB,gCAlDb,2BAA2B,EAAE,0BAA0B,GAAG,EAAE,EACnE,CAAC,yBAAyB,CAC3B;aAiDK,2CAACC;IAAuB,OAAO;cAC7B,2CAACC;KAAY,iCAhDZ;MACL;MACA;MACA;MACA;MACA;MACA;MACA;MACD,GACD;MACE;MACA;MACA;MACA;MACA;MACA;MACA;MACD,CACF;eA+BS,2CAACC;MAAgB,iCA7BlB;OACL;OACA;OACA;OACA;OACA;OACD,GACD;OAAC;OAAe;OAAa;OAAoB;OAAY;OAAS,CACvE;gBAsBW,2CAAC;OAAiB,iCApBrB;QACL;QACA;QACA;QACA;QACD,GACD;QACE;QACA;QACA;QACA;QACD,CACF;iBASa;QAAc,GAAI;QAAqB;SAAwB;QAC9C;OACH;MACN;KACS;IACR;GA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"}

package/dist/cjs/components/native-popover/native-popover.cjs CHANGED Viewed

@@ -11,38 +11,41 @@ let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/native-popover/native-popover.tsx
-const { ComponentContext, PropsContext: NativePopoverPropsContext, StyleContext, useComponentContext, usePropsContext: useNativePopoverPropsContext, withContext, useRootComponentProps } = require_create_component.createSlotComponent("native-popover", require_native_popover_style.nativePopoverStyle);
+const { ComponentContext, HydrationContext, PropsContext: NativePopoverPropsContext, StyleContext, useComponentContext, usePropsContext: useNativePopoverPropsContext, withContext, useRootComponentProps } = require_create_component.createSlotComponent("native-popover", require_native_popover_style.nativePopoverStyle);
 /**
 * `NativePopover` is a component that floats around an element to display information using the native HTML Popover API.
 *
 * @see https://yamada-ui.com/docs/components/native-popover
 */
 const NativePopoverRoot = (props) => {
-	const [styleContext, { children, ...rest }] = useRootComponentProps(props);
+	const [styleContext, { children, suppressHydrationWarning, ...rest }] = useRootComponentProps(props);
 	const { getAnchorProps, getBodyProps, getCloseTriggerProps, getContentProps, getFooterProps, getHeaderProps, getPositionerProps, getTriggerProps } = require_use_native_popover.useNativePopover(rest);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyleContext, {
 		value: styleContext,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
-			value: (0, react.useMemo)(() => ({
-				getAnchorProps,
-				getBodyProps,
-				getCloseTriggerProps,
-				getContentProps,
-				getFooterProps,
-				getHeaderProps,
-				getPositionerProps,
-				getTriggerProps
-			}), [
-				getAnchorProps,
-				getBodyProps,
-				getCloseTriggerProps,
-				getContentProps,
-				getFooterProps,
-				getHeaderProps,
-				getPositionerProps,
-				getTriggerProps
-			]),
-			children
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HydrationContext, {
+			value: (0, react.useMemo)(() => suppressHydrationWarning ? { suppressHydrationWarning } : {}, [suppressHydrationWarning]),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
+				value: (0, react.useMemo)(() => ({
+					getAnchorProps,
+					getBodyProps,
+					getCloseTriggerProps,
+					getContentProps,
+					getFooterProps,
+					getHeaderProps,
+					getPositionerProps,
+					getTriggerProps
+				}), [
+					getAnchorProps,
+					getBodyProps,
+					getCloseTriggerProps,
+					getContentProps,
+					getFooterProps,
+					getHeaderProps,
+					getPositionerProps,
+					getTriggerProps
+				]),
+				children
+			})
 		})
 	});
 };