@yamada-ui/react 2.3.0-dev-20260724085908 → 2.3.0-dev-20260730080927

package/dist/esm/components/popover/popover.js

@@ -1,5 +1,7 @@
 "use client";
+import { useSplitChildren, wrapOrPassProps } from "../../utils/children.js";
 import { utils_exports } from "../../utils/index.js";
+import { mergeProps } from "../../core/components/props.js";
 import { createSlotComponent } from "../../core/components/create-component.js";
 import { motion as motion$1 } from "../motion/factory.js";
 import { useValue } from "../../hooks/use-value/index.js";
@@ -9,7 +11,7 @@ import { Portal } from "../portal/portal.js";
 import { slideFadeVariants } from "../slide-fade/slide-fade.js";
 import { usePopover } from "./use-popover.js";
 import { useMemo } from "react";
-import { jsx } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { AnimatePresence } from "motion/react";
 //#region src/components/popover/popover.tsx
 const usePopupAnimationProps = (props = {}) => {
@@ -97,15 +99,21 @@ const { ComponentContext, PropsContext: PopoverPropsContext, StyleContext, useCo
 */
 const PopoverRoot = (props) => {
 	const styleProps = usePopoverStyleProps(props);
-	const [styleContext, { animationScheme, children, duration, ...rest }] = useRootComponentProps({
+	const [styleContext, { anchor: anchorProp, animationScheme, body, children, duration, footer, header, trigger: triggerProp, anchorProps, bodyProps, closeTriggerProps, contentProps, footerProps, headerProps, triggerProps, ...rest }] = useRootComponentProps({
 		...props,
 		...styleProps
 	});
+	const [omittedChildren, trigger, anchor, customContent] = useSplitChildren((0, utils_exports.isFunction)(children) ? void 0 : children, PopoverTrigger, PopoverAnchor, PopoverContent);
 	const { open, getAnchorProps, getBodyProps, getCloseTriggerProps, getContentProps, getFooterProps, getHeaderProps, getPositionerProps, getTriggerProps, onClose } = usePopover(rest);
 	const componentContext = useMemo(() => ({
 		animationScheme,
 		duration,
 		open,
+		anchorProps,
+		bodyProps,
+		closeTriggerProps,
+		contentProps,
+		footerProps,
 		getAnchorProps,
 		getBodyProps,
 		getCloseTriggerProps,
@@ -113,11 +121,19 @@ const PopoverRoot = (props) => {
 		getFooterProps,
 		getHeaderProps,
 		getPositionerProps,
-		getTriggerProps
+		getTriggerProps,
+		headerProps,
+		triggerProps
 	}), [
 		open,
 		animationScheme,
+		anchorProps,
+		bodyProps,
+		closeTriggerProps,
+		contentProps,
 		duration,
+		footerProps,
+		headerProps,
 		getAnchorProps,
 		getBodyProps,
 		getCloseTriggerProps,
@@ -125,63 +141,89 @@ const PopoverRoot = (props) => {
 		getFooterProps,
 		getHeaderProps,
 		getPositionerProps,
-		getTriggerProps
+		getTriggerProps,
+		triggerProps
 	]);
+	const customAnchor = anchorProp ? /* @__PURE__ */ jsx(PopoverAnchor, { children: anchorProp }) : null;
+	const customTrigger = triggerProp ? /* @__PURE__ */ jsx(PopoverTrigger, { children: triggerProp }) : null;
+	const customContentProp = header !== void 0 || body !== void 0 || footer !== void 0 ? /* @__PURE__ */ jsx(ShorthandPopoverContent, {
+		body,
+		footer,
+		header
+	}) : null;
 	return /* @__PURE__ */ jsx(StyleContext, {
 		value: styleContext,
 		children: /* @__PURE__ */ jsx(ComponentContext, {
 			value: componentContext,
-			children: (0, utils_exports.runIfFn)(children, {
+			children: (0, utils_exports.isFunction)(children) ? (0, utils_exports.runIfFn)(children, {
 				open,
 				onClose
-			})
+			}) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+				anchor ?? customAnchor,
+				trigger ?? customTrigger,
+				omittedChildren,
+				customContent ?? customContentProp
+			] })
 		})
 	});
 };
 const PopoverTrigger = withContext("button", "trigger")({ asChild: true }, (props) => {
-	const { getTriggerProps } = useComponentContext();
-	return getTriggerProps(props);
+	const { getTriggerProps, triggerProps } = useComponentContext();
+	return getTriggerProps(mergeProps(triggerProps, props)());
 });
 const PopoverCloseTrigger = withContext("button", {
 	name: "CloseTrigger",
 	slot: ["trigger", "close"]
 })({ asChild: true }, (props) => {
-	const { getCloseTriggerProps } = useComponentContext();
-	return getCloseTriggerProps(props);
+	const { closeTriggerProps, getCloseTriggerProps } = useComponentContext();
+	return getCloseTriggerProps(mergeProps(closeTriggerProps, props)());
 });
 const PopoverAnchor = withContext("div", "anchor")({ asChild: true }, (props) => {
-	const { getAnchorProps } = useComponentContext();
-	return getAnchorProps(props);
+	const { anchorProps, getAnchorProps } = useComponentContext();
+	return getAnchorProps(mergeProps(anchorProps, props)());
 });
 const PopoverPositioner = withContext("div", "positioner")(void 0, (props) => {
 	const { getPositionerProps } = useComponentContext();
 	return getPositionerProps(props);
 });
-const PopoverContent = withContext(({ portalProps, ...rest }) => {
-	const { animationScheme, duration, open, getContentProps } = useComponentContext();
+const PopoverContent = withContext(({ portalProps: portalPropsProp, positionerProps: positionerPropsProp, ...rest }) => {
+	const { animationScheme, duration, open, contentProps: { portalProps, positionerProps, ...contentProps } = {}, getContentProps } = useComponentContext();
 	const popupAnimationProps = usePopupAnimationProps({
 		animationScheme,
 		duration
 	});
 	return /* @__PURE__ */ jsx(AnimatePresence, { children: open ? /* @__PURE__ */ jsx(Portal, {
-		...portalProps,
-		children: /* @__PURE__ */ jsx(PopoverPositioner, { children: /* @__PURE__ */ jsx(motion$1.div, {
-			...popupAnimationProps,
-			...(0, utils_exports.cast)(getContentProps((0, utils_exports.cast)(rest)))
-		}) })
+		...mergeProps(portalProps, portalPropsProp)(),
+		children: /* @__PURE__ */ jsx(PopoverPositioner, {
+			...mergeProps(positionerProps, positionerPropsProp)(),
+			children: /* @__PURE__ */ jsx(motion$1.div, {
+				...popupAnimationProps,
+				...(0, utils_exports.cast)(getContentProps((0, utils_exports.cast)(mergeProps(contentProps, rest)())))
+			})
+		})
 	}) : null });
 }, "content")();
+const ShorthandPopoverContent = ({ body, footer, header }) => {
+	const customHeader = wrapOrPassProps(PopoverHeader, header);
+	const customBody = wrapOrPassProps(PopoverBody, body);
+	const customFooter = wrapOrPassProps(PopoverFooter, footer);
+	return /* @__PURE__ */ jsxs(PopoverContent, { children: [
+		customHeader,
+		customBody,
+		customFooter
+	] });
+};
 const PopoverHeader = withContext("div", "header")(void 0, (props) => {
-	const { getHeaderProps } = useComponentContext();
-	return getHeaderProps(props);
+	const { getHeaderProps, headerProps } = useComponentContext();
+	return getHeaderProps(mergeProps(headerProps, props)());
 });
 const PopoverBody = withContext("div", "body")(void 0, (props) => {
-	const { getBodyProps } = useComponentContext();
-	return getBodyProps(props);
+	const { bodyProps, getBodyProps } = useComponentContext();
+	return getBodyProps(mergeProps(bodyProps, props)());
 });
 const PopoverFooter = withContext("div", "footer")(void 0, (props) => {
-	const { getFooterProps } = useComponentContext();
-	return getFooterProps(props);
+	const { footerProps, getFooterProps } = useComponentContext();
+	return getFooterProps(mergeProps(footerProps, props)());
 });
 //#endregion
 export { PopoverAnchor, PopoverBody, PopoverCloseTrigger, PopoverContent, PopoverFooter, PopoverHeader, PopoverPropsContext, PopoverRoot, PopoverTrigger, usePopoverPropsContext, usePopoverStyleProps, usePopupAnimationProps };

package/dist/esm/components/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","names":["motion"],"sources":["../../../../src/components/popover/popover.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren } from \"react\"\nimport type {\n  HTMLProps,\n  HTMLStyledProps,\n  SimplePlacement,\n  StyleValue,\n  ThemeProps,\n} from \"../../core\"\nimport type { Merge, ReactNodeOrFunction } from \"../../utils\"\nimport type { HTMLMotionProps, MotionTransitionProps } from \"../motion\"\nimport type { PortalProps } from \"../portal\"\nimport type { PopoverStyle } from \"./popover.style\"\nimport type { UsePopoverProps, UsePopoverReturn } from \"./use-popover\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { cast, filterUndefined, runIfFn } from \"../../utils\"\nimport { fadeScaleVariants } from \"../fade-scale\"\nimport { motion } from \"../motion\"\nimport { Portal } from \"../portal\"\nimport { slideFadeVariants } from \"../slide-fade\"\nimport { popoverStyle } from \"./popover.style\"\nimport { usePopover } from \"./use-popover\"\n\nexport interface UsePopupAnimationProps {\n  /**\n   * The animation of the element.\n   *\n   * @default 'scale'\n   */\n  animationScheme?: StyleValue<\"none\" | \"scale\" | SimplePlacement>\n  /**\n   * The animation duration.\n   *\n   * @default 0.1\n   */\n  duration?: StyleValue<MotionTransitionProps[\"duration\"]>\n}\n\nexport const usePopupAnimationProps = (props: UsePopupAnimationProps = {}) => {\n  const animationScheme = useValue(props.animationScheme ?? \"scale\")\n  const duration = useValue(props.duration ?? 0.1)\n  const sharedProps = { animate: \"enter\", exit: \"exit\", initial: \"exit\" }\n\n  switch (animationScheme) {\n    case \"scale\":\n      return {\n        ...sharedProps,\n        custom: { duration, reverse: true, scale: 0.95 },\n        variants: fadeScaleVariants,\n      }\n    case \"block-start\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetY: -16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    case \"inline-end\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetX: 16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    case \"inline-start\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetX: -16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    case \"block-end\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetY: 16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    default:\n      return {}\n  }\n}\n\nexport interface UsePopoverStyleProps {\n  /**\n   * If `true`, the popper will change its placement and flip when it's about to overflow its boundary area.\n   *\n   * @default true\n   */\n  flip?: StyleValue<UsePopoverProps[\"flip\"]>\n  /**\n   * The distance or margin between the reference and popper.\n   * It is used internally to create an `offset` modifier.\n   *\n   * @default 8\n   */\n  gutter?: StyleValue<UsePopoverProps[\"gutter\"]>\n  /**\n   * If `true`, the popper will match the width of the reference at all times.\n   * It's useful for `autocomplete`, `date-picker` and `select` patterns.\n   *\n   * @default false\n   */\n  matchWidth?: StyleValue<UsePopoverProps[\"matchWidth\"]>\n  /**\n   * The placement of the popper relative to its reference.\n   *\n   * @default 'end'\n   */\n  placement?: StyleValue<UsePopoverProps[\"placement\"]>\n  /**\n   * The CSS positioning strategy to use.\n   *\n   * @default 'absolute'\n   */\n  strategy?: StyleValue<UsePopoverProps[\"strategy\"]>\n}\n\nexport const usePopoverStyleProps = (props: UsePopoverStyleProps = {}) => {\n  const placement = useValue(props.placement)\n  const gutter = useValue(props.gutter)\n  const matchWidth = useValue(props.matchWidth)\n  const strategy = useValue(props.strategy)\n  const flip = useValue(props.flip)\n\n  return useMemo(\n    () => filterUndefined({ flip, gutter, matchWidth, placement, strategy }),\n    [flip, gutter, matchWidth, placement, strategy],\n  )\n}\n\ninterface ComponentContext\n  extends\n    Pick<\n      UsePopoverReturn,\n      | \"getAnchorProps\"\n      | \"getBodyProps\"\n      | \"getCloseTriggerProps\"\n      | \"getContentProps\"\n      | \"getFooterProps\"\n      | \"getHeaderProps\"\n      | \"getPositionerProps\"\n      | \"getTriggerProps\"\n      | \"open\"\n    >,\n    UsePopupAnimationProps {}\n\nexport interface PopoverRootProps\n  extends\n    Merge<UsePopoverProps, UsePopoverStyleProps>,\n    UsePopupAnimationProps,\n    ThemeProps<PopoverStyle> {\n  /**\n   * The children of the popover.\n   */\n  children?: ReactNodeOrFunction<{\n    open: boolean\n    onClose: () => void\n  }>\n}\n\nconst {\n  ComponentContext,\n  PropsContext: PopoverPropsContext,\n  StyleContext,\n  useComponentContext,\n  usePropsContext: usePopoverPropsContext,\n  withContext,\n  useRootComponentProps,\n} = createSlotComponent<PopoverRootProps, PopoverStyle, ComponentContext>(\n  \"popover\",\n  popoverStyle,\n)\n\nexport { PopoverPropsContext, usePopoverPropsContext }\n\n/**\n * `Popover` is a component that floats around an element to display information.\n *\n * @see https://yamada-ui.com/docs/components/popover\n */\nexport const PopoverRoot: FC<PopoverRootProps> = (props) => {\n  const styleProps = usePopoverStyleProps(props)\n  const [styleContext, { animationScheme, children, duration, ...rest }] =\n    useRootComponentProps({ ...props, ...styleProps })\n  const {\n    open,\n    getAnchorProps,\n    getBodyProps,\n    getCloseTriggerProps,\n    getContentProps,\n    getFooterProps,\n    getHeaderProps,\n    getPositionerProps,\n    getTriggerProps,\n    onClose,\n  } = usePopover(rest)\n  const componentContext = useMemo(\n    () => ({\n      animationScheme,\n      duration,\n      open,\n      getAnchorProps,\n      getBodyProps,\n      getCloseTriggerProps,\n      getContentProps,\n      getFooterProps,\n      getHeaderProps,\n      getPositionerProps,\n      getTriggerProps,\n    }),\n    [\n      open,\n      animationScheme,\n      duration,\n      getAnchorProps,\n      getBodyProps,\n      getCloseTriggerProps,\n      getContentProps,\n      getFooterProps,\n      getHeaderProps,\n      getPositionerProps,\n      getTriggerProps,\n    ],\n  )\n\n  return (\n    <StyleContext value={styleContext}>\n      <ComponentContext value={componentContext}>\n        {runIfFn(children, { open, onClose })}\n      </ComponentContext>\n    </StyleContext>\n  )\n}\n\nexport interface PopoverTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PopoverTrigger = withContext<\"button\", PopoverTriggerProps>(\n  \"button\",\n  \"trigger\",\n)({ asChild: true }, (props) => {\n  const { getTriggerProps } = useComponentContext()\n\n  return getTriggerProps(props)\n})\n\nexport interface PopoverCloseTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PopoverCloseTrigger = withContext<\n  \"button\",\n  PopoverCloseTriggerProps\n>(\"button\", { name: \"CloseTrigger\", slot: [\"trigger\", \"close\"] })(\n  { asChild: true },\n  (props) => {\n    const { getCloseTriggerProps } = useComponentContext()\n\n    return getCloseTriggerProps(props)\n  },\n)\n\nexport interface PopoverAnchorProps extends HTMLStyledProps {}\n\nexport const PopoverAnchor = withContext<\"div\", PopoverAnchorProps>(\n  \"div\",\n  \"anchor\",\n)({ asChild: true }, (props) => {\n  const { getAnchorProps } = useComponentContext()\n\n  return getAnchorProps(props)\n})\n\ninterface PopoverPositionerProps extends HTMLStyledProps {}\n\nconst PopoverPositioner = withContext<\"div\", PopoverPositionerProps>(\n  \"div\",\n  \"positioner\",\n)(undefined, (props) => {\n  const { getPositionerProps } = useComponentContext()\n\n  return getPositionerProps(props)\n})\n\nexport interface PopoverContentProps\n  extends Omit<HTMLMotionProps, \"children\">, PropsWithChildren {\n  /**\n   * Props for portal component.\n   */\n  portalProps?: Omit<PortalProps, \"children\">\n}\n\nexport const PopoverContent = withContext<\"div\", PopoverContentProps>(\n  ({ portalProps, ...rest }) => {\n    const { animationScheme, duration, open, getContentProps } =\n      useComponentContext()\n    const popupAnimationProps = usePopupAnimationProps({\n      animationScheme,\n      duration,\n    })\n\n    return (\n      <AnimatePresence>\n        {open ? (\n          <Portal {...portalProps}>\n            <PopoverPositioner>\n              <motion.div\n                {...popupAnimationProps}\n                {...cast<HTMLMotionProps>(\n                  getContentProps(cast<HTMLProps>(rest)),\n                )}\n              />\n            </PopoverPositioner>\n          </Portal>\n        ) : null}\n      </AnimatePresence>\n    )\n  },\n  \"content\",\n)()\n\nexport interface PopoverHeaderProps extends HTMLStyledProps {}\n\nexport const PopoverHeader = withContext<\"div\", PopoverHeaderProps>(\n  \"div\",\n  \"header\",\n)(undefined, (props) => {\n  const { getHeaderProps } = useComponentContext()\n\n  return getHeaderProps(props)\n})\n\nexport interface PopoverBodyProps extends HTMLStyledProps {}\n\nexport const PopoverBody = withContext<\"div\", PopoverBodyProps>(\"div\", \"body\")(\n  undefined,\n  (props) => {\n    const { getBodyProps } = useComponentContext()\n\n    return getBodyProps(props)\n  },\n)\n\nexport interface PopoverFooterProps extends HTMLStyledProps {}\n\nexport const PopoverFooter = withContext<\"div\", PopoverFooterProps>(\n  \"div\",\n  \"footer\",\n)(undefined, (props) => {\n  const { getFooterProps } = useComponentContext()\n\n  return getFooterProps(props)\n})\n"],"mappings":"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"}
+{"version":3,"file":"popover.js","names":["motion"],"sources":["../../../../src/components/popover/popover.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, ReactNode } from \"react\"\nimport type {\n  HTMLProps,\n  HTMLStyledProps,\n  SimplePlacement,\n  StyleValue,\n  ThemeProps,\n} from \"../../core\"\nimport type { Merge, ReactNodeOrFunction } from \"../../utils\"\nimport type { HTMLMotionProps, MotionTransitionProps } from \"../motion\"\nimport type { PortalProps } from \"../portal\"\nimport type { PopoverStyle } from \"./popover.style\"\nimport type { UsePopoverProps, UsePopoverReturn } from \"./use-popover\"\nimport { AnimatePresence } from \"motion/react\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, mergeProps } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport {\n  cast,\n  filterUndefined,\n  isFunction,\n  runIfFn,\n  useSplitChildren,\n  wrapOrPassProps,\n} from \"../../utils\"\nimport { fadeScaleVariants } from \"../fade-scale\"\nimport { motion } from \"../motion\"\nimport { Portal } from \"../portal\"\nimport { slideFadeVariants } from \"../slide-fade\"\nimport { popoverStyle } from \"./popover.style\"\nimport { usePopover } from \"./use-popover\"\n\nexport interface UsePopupAnimationProps {\n  /**\n   * The animation of the element.\n   *\n   * @default 'scale'\n   */\n  animationScheme?: StyleValue<\"none\" | \"scale\" | SimplePlacement>\n  /**\n   * The animation duration.\n   *\n   * @default 0.1\n   */\n  duration?: StyleValue<MotionTransitionProps[\"duration\"]>\n}\n\nexport const usePopupAnimationProps = (props: UsePopupAnimationProps = {}) => {\n  const animationScheme = useValue(props.animationScheme ?? \"scale\")\n  const duration = useValue(props.duration ?? 0.1)\n  const sharedProps = { animate: \"enter\", exit: \"exit\", initial: \"exit\" }\n\n  switch (animationScheme) {\n    case \"scale\":\n      return {\n        ...sharedProps,\n        custom: { duration, reverse: true, scale: 0.95 },\n        variants: fadeScaleVariants,\n      }\n    case \"block-start\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetY: -16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    case \"inline-end\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetX: 16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    case \"inline-start\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetX: -16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    case \"block-end\":\n      return {\n        ...sharedProps,\n        custom: { duration, offsetY: 16, reverse: true },\n        variants: slideFadeVariants,\n      }\n    default:\n      return {}\n  }\n}\n\nexport interface UsePopoverStyleProps {\n  /**\n   * If `true`, the popper will change its placement and flip when it's about to overflow its boundary area.\n   *\n   * @default true\n   */\n  flip?: StyleValue<UsePopoverProps[\"flip\"]>\n  /**\n   * The distance or margin between the reference and popper.\n   * It is used internally to create an `offset` modifier.\n   *\n   * @default 8\n   */\n  gutter?: StyleValue<UsePopoverProps[\"gutter\"]>\n  /**\n   * If `true`, the popper will match the width of the reference at all times.\n   * It's useful for `autocomplete`, `date-picker` and `select` patterns.\n   *\n   * @default false\n   */\n  matchWidth?: StyleValue<UsePopoverProps[\"matchWidth\"]>\n  /**\n   * The placement of the popper relative to its reference.\n   *\n   * @default 'end'\n   */\n  placement?: StyleValue<UsePopoverProps[\"placement\"]>\n  /**\n   * The CSS positioning strategy to use.\n   *\n   * @default 'absolute'\n   */\n  strategy?: StyleValue<UsePopoverProps[\"strategy\"]>\n}\n\nexport const usePopoverStyleProps = (props: UsePopoverStyleProps = {}) => {\n  const placement = useValue(props.placement)\n  const gutter = useValue(props.gutter)\n  const matchWidth = useValue(props.matchWidth)\n  const strategy = useValue(props.strategy)\n  const flip = useValue(props.flip)\n\n  return useMemo(\n    () => filterUndefined({ flip, gutter, matchWidth, placement, strategy }),\n    [flip, gutter, matchWidth, placement, strategy],\n  )\n}\n\ninterface ComponentContext\n  extends\n    Pick<\n      UsePopoverReturn,\n      | \"getAnchorProps\"\n      | \"getBodyProps\"\n      | \"getCloseTriggerProps\"\n      | \"getContentProps\"\n      | \"getFooterProps\"\n      | \"getHeaderProps\"\n      | \"getPositionerProps\"\n      | \"getTriggerProps\"\n      | \"open\"\n    >,\n    UsePopupAnimationProps,\n    Pick<\n      PopoverRootProps,\n      | \"anchorProps\"\n      | \"bodyProps\"\n      | \"closeTriggerProps\"\n      | \"contentProps\"\n      | \"footerProps\"\n      | \"headerProps\"\n      | \"triggerProps\"\n    > {}\n\nexport interface PopoverRootProps\n  extends\n    Merge<UsePopoverProps, UsePopoverStyleProps>,\n    UsePopupAnimationProps,\n    ThemeProps<PopoverStyle>,\n    ShorthandPopoverContentProps {\n  /**\n   * The popover anchor to use.\n   */\n  anchor?: ReactNode\n  /**\n   * The children of the popover.\n   */\n  children?: ReactNodeOrFunction<{\n    open: boolean\n    onClose: () => void\n  }>\n  /**\n   * The popover trigger to use.\n   */\n  trigger?: ReactNode\n  /**\n   * Props for anchor element.\n   */\n  anchorProps?: Omit<PopoverAnchorProps, \"asChild\" | \"children\">\n  /**\n   * Props for body element.\n   */\n  bodyProps?: Omit<PopoverBodyProps, \"children\">\n  /**\n   * Props for close trigger element.\n   */\n  closeTriggerProps?: Omit<PopoverCloseTriggerProps, \"asChild\" | \"children\">\n  /**\n   * Props for content element.\n   */\n  contentProps?: Omit<PopoverContentProps, \"children\">\n  /**\n   * Props for footer element.\n   */\n  footerProps?: Omit<PopoverFooterProps, \"children\">\n  /**\n   * Props for header element.\n   */\n  headerProps?: Omit<PopoverHeaderProps, \"children\">\n  /**\n   * Props for trigger element.\n   */\n  triggerProps?: Omit<PopoverTriggerProps, \"asChild\" | \"children\">\n}\n\nconst {\n  ComponentContext,\n  PropsContext: PopoverPropsContext,\n  StyleContext,\n  useComponentContext,\n  usePropsContext: usePopoverPropsContext,\n  withContext,\n  useRootComponentProps,\n} = createSlotComponent<PopoverRootProps, PopoverStyle, ComponentContext>(\n  \"popover\",\n  popoverStyle,\n)\n\nexport { PopoverPropsContext, usePopoverPropsContext }\n\n/**\n * `Popover` is a component that floats around an element to display information.\n *\n * @see https://yamada-ui.com/docs/components/popover\n */\nexport const PopoverRoot: FC<PopoverRootProps> = (props) => {\n  const styleProps = usePopoverStyleProps(props)\n  const [\n    styleContext,\n    {\n      anchor: anchorProp,\n      animationScheme,\n      body,\n      children,\n      duration,\n      footer,\n      header,\n      trigger: triggerProp,\n      anchorProps,\n      bodyProps,\n      closeTriggerProps,\n      contentProps,\n      footerProps,\n      headerProps,\n      triggerProps,\n      ...rest\n    },\n  ] = useRootComponentProps({ ...props, ...styleProps })\n  const [omittedChildren, trigger, anchor, customContent] = useSplitChildren(\n    isFunction(children) ? undefined : children,\n    PopoverTrigger,\n    PopoverAnchor,\n    PopoverContent,\n  )\n  const {\n    open,\n    getAnchorProps,\n    getBodyProps,\n    getCloseTriggerProps,\n    getContentProps,\n    getFooterProps,\n    getHeaderProps,\n    getPositionerProps,\n    getTriggerProps,\n    onClose,\n  } = usePopover(rest)\n  const componentContext = useMemo(\n    () => ({\n      animationScheme,\n      duration,\n      open,\n      anchorProps,\n      bodyProps,\n      closeTriggerProps,\n      contentProps,\n      footerProps,\n      getAnchorProps,\n      getBodyProps,\n      getCloseTriggerProps,\n      getContentProps,\n      getFooterProps,\n      getHeaderProps,\n      getPositionerProps,\n      getTriggerProps,\n      headerProps,\n      triggerProps,\n    }),\n    [\n      open,\n      animationScheme,\n      anchorProps,\n      bodyProps,\n      closeTriggerProps,\n      contentProps,\n      duration,\n      footerProps,\n      headerProps,\n      getAnchorProps,\n      getBodyProps,\n      getCloseTriggerProps,\n      getContentProps,\n      getFooterProps,\n      getHeaderProps,\n      getPositionerProps,\n      getTriggerProps,\n      triggerProps,\n    ],\n  )\n  const customAnchor = anchorProp ? (\n    <PopoverAnchor>{anchorProp}</PopoverAnchor>\n  ) : null\n  const customTrigger = triggerProp ? (\n    <PopoverTrigger>{triggerProp}</PopoverTrigger>\n  ) : null\n  const customContentProp =\n    header !== undefined || body !== undefined || footer !== undefined ? (\n      <ShorthandPopoverContent body={body} footer={footer} header={header} />\n    ) : null\n\n  return (\n    <StyleContext value={styleContext}>\n      <ComponentContext value={componentContext}>\n        {isFunction(children) ? (\n          runIfFn(children, { open, onClose })\n        ) : (\n          <>\n            {anchor ?? customAnchor}\n            {trigger ?? customTrigger}\n            {omittedChildren}\n            {customContent ?? customContentProp}\n          </>\n        )}\n      </ComponentContext>\n    </StyleContext>\n  )\n}\n\nexport interface PopoverTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PopoverTrigger = withContext<\"button\", PopoverTriggerProps>(\n  \"button\",\n  \"trigger\",\n)({ asChild: true }, (props) => {\n  const { getTriggerProps, triggerProps } = useComponentContext()\n\n  return getTriggerProps(mergeProps(triggerProps, props)())\n})\n\nexport interface PopoverCloseTriggerProps extends HTMLStyledProps<\"button\"> {}\n\nexport const PopoverCloseTrigger = withContext<\n  \"button\",\n  PopoverCloseTriggerProps\n>(\"button\", { name: \"CloseTrigger\", slot: [\"trigger\", \"close\"] })(\n  { asChild: true },\n  (props) => {\n    const { closeTriggerProps, getCloseTriggerProps } = useComponentContext()\n\n    return getCloseTriggerProps(mergeProps(closeTriggerProps, props)())\n  },\n)\n\nexport interface PopoverAnchorProps extends HTMLStyledProps {}\n\nexport const PopoverAnchor = withContext<\"div\", PopoverAnchorProps>(\n  \"div\",\n  \"anchor\",\n)({ asChild: true }, (props) => {\n  const { anchorProps, getAnchorProps } = useComponentContext()\n\n  return getAnchorProps(mergeProps(anchorProps, props)())\n})\n\ninterface PopoverPositionerProps extends HTMLStyledProps {}\n\nconst PopoverPositioner = withContext<\"div\", PopoverPositionerProps>(\n  \"div\",\n  \"positioner\",\n)(undefined, (props) => {\n  const { getPositionerProps } = useComponentContext()\n\n  return getPositionerProps(props)\n})\n\nexport interface PopoverContentProps\n  extends Omit<HTMLMotionProps, \"children\">, PropsWithChildren {\n  /**\n   * Props for portal component.\n   */\n  portalProps?: Omit<PortalProps, \"children\">\n  /**\n   * Props for positioner component.\n   */\n  positionerProps?: Omit<PopoverPositionerProps, \"children\">\n}\n\nexport const PopoverContent = withContext<\"div\", PopoverContentProps>(\n  ({\n    portalProps: portalPropsProp,\n    positionerProps: positionerPropsProp,\n    ...rest\n  }) => {\n    const {\n      animationScheme,\n      duration,\n      open,\n      contentProps: { portalProps, positionerProps, ...contentProps } = {},\n      getContentProps,\n    } = useComponentContext()\n    const popupAnimationProps = usePopupAnimationProps({\n      animationScheme,\n      duration,\n    })\n\n    return (\n      <AnimatePresence>\n        {open ? (\n          <Portal {...mergeProps(portalProps, portalPropsProp)()}>\n            <PopoverPositioner\n              {...mergeProps(positionerProps, positionerPropsProp)()}\n            >\n              <motion.div\n                {...popupAnimationProps}\n                {...cast<HTMLMotionProps>(\n                  getContentProps(\n                    cast<HTMLProps>(mergeProps(contentProps, rest)()),\n                  ),\n                )}\n              />\n            </PopoverPositioner>\n          </Portal>\n        ) : null}\n      </AnimatePresence>\n    )\n  },\n  \"content\",\n)()\n\ninterface ShorthandPopoverContentProps {\n  /**\n   * The popover body to use.\n   */\n  body?: PopoverBodyProps | ReactNode\n  /**\n   * The popover footer to use.\n   */\n  footer?: PopoverFooterProps | ReactNode\n  /**\n   * The popover header to use.\n   */\n  header?: PopoverHeaderProps | ReactNode\n}\n\nconst ShorthandPopoverContent: FC<ShorthandPopoverContentProps> = ({\n  body,\n  footer,\n  header,\n}) => {\n  const customHeader = wrapOrPassProps(PopoverHeader, header)\n  const customBody = wrapOrPassProps(PopoverBody, body)\n  const customFooter = wrapOrPassProps(PopoverFooter, footer)\n\n  return (\n    <PopoverContent>\n      {customHeader}\n      {customBody}\n      {customFooter}\n    </PopoverContent>\n  )\n}\n\nexport interface PopoverHeaderProps extends HTMLStyledProps {}\n\nexport const PopoverHeader = withContext<\"div\", PopoverHeaderProps>(\n  \"div\",\n  \"header\",\n)(undefined, (props) => {\n  const { getHeaderProps, headerProps } = useComponentContext()\n\n  return getHeaderProps(mergeProps(headerProps, props)())\n})\n\nexport interface PopoverBodyProps extends HTMLStyledProps {}\n\nexport const PopoverBody = withContext<\"div\", PopoverBodyProps>(\"div\", \"body\")(\n  undefined,\n  (props) => {\n    const { bodyProps, getBodyProps } = useComponentContext()\n\n    return getBodyProps(mergeProps(bodyProps, props)())\n  },\n)\n\nexport interface PopoverFooterProps extends HTMLStyledProps {}\n\nexport const PopoverFooter = withContext<\"div\", PopoverFooterProps>(\n  \"div\",\n  \"footer\",\n)(undefined, (props) => {\n  const { footerProps, getFooterProps } = useComponentContext()\n\n  return getFooterProps(mergeProps(footerProps, props)())\n})\n"],"mappings":"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"}

package/dist/esm/components/portal/portal.js

@@ -2,7 +2,8 @@
 import { useSsr } from "../../utils/ssr.js";
 import { utils_exports } from "../../utils/index.js";
 import { useEnvironment } from "../../core/system/environment-provider.js";
-import { Children, useEffect, useState } from "react";
+import { useFocusLockShard } from "../focus-lock/focus-lock.js";
+import { Children, useEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
 //#region src/components/portal/portal.tsx
@@ -17,14 +18,29 @@ const getPortalNode = (node) => {
 * @see https://yamada-ui.com/docs/components/portal
 */
 const Portal = ({ children, containerRef: ref, disabled }) => {
+	const shardRef = useRef(null);
 	const [target, setTarget] = useState(ref?.current);
 	const ssr = useSsr();
 	const { getRootNode } = useEnvironment();
+	const registerShard = useFocusLockShard();
 	useEffect(() => {
 		setTarget(() => ref?.current);
 	}, [ref]);
+	useEffect(() => {
+		const shard = shardRef.current;
+		if (disabled || ssr || !shard) return;
+		return registerShard?.(shard);
+	}, [
+		disabled,
+		registerShard,
+		ssr
+	]);
 	if (ssr || disabled) return children;
 	const container = target ?? getPortalNode(getRootNode());
+	if (registerShard) return createPortal(/* @__PURE__ */ jsx("div", {
+		ref: shardRef,
+		children
+	}), container);
 	return /* @__PURE__ */ jsx(Fragment$1, { children: Children.map(children, (child) => createPortal(child, container)) });
 };
 //#endregion

package/dist/esm/components/portal/portal.js.map

@@ -1 +1 @@
-{"version":3,"file":"portal.js","names":[],"sources":["../../../../src/components/portal/portal.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, RefObject } from \"react\"\nimport type { RootNode } from \"../../core\"\nimport { Children, useEffect, useState } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { useEnvironment } from \"../../core\"\nimport { getDocument, isShadowRoot, useSsr } from \"../../utils\"\n\nconst getPortalNode = (node?: RootNode) => {\n  const rootNode = node?.getRootNode()\n\n  if (isShadowRoot(rootNode)) return rootNode\n\n  return getDocument(node).body\n}\n\nexport interface PortalProps extends PropsWithChildren {\n  /**\n   * The `ref` to the component where the portal will be attached to.\n   */\n  containerRef?: RefObject<HTMLElement | null>\n  /**\n   * If `true`, the forwarding will be disabled.\n   */\n  disabled?: boolean\n}\n\n/**\n * `Portal` is a component that renders elements outside of the current `DOM` hierarchy.\n *\n * @see https://yamada-ui.com/docs/components/portal\n */\nexport const Portal: FC<PortalProps> = ({\n  children,\n  containerRef: ref,\n  disabled,\n}) => {\n  const [target, setTarget] = useState(ref?.current)\n  const ssr = useSsr()\n  const { getRootNode } = useEnvironment()\n\n  useEffect(() => {\n    setTarget(() => ref?.current)\n  }, [ref])\n\n  if (ssr || disabled) return children\n\n  const container = target ?? getPortalNode(getRootNode())\n\n  return (\n    <>{Children.map(children, (child) => createPortal(child, container))}</>\n  )\n}\n"],"mappings":";;;;;;;;AASA,MAAM,iBAAiB,SAAoB;CACzC,MAAM,WAAW,MAAM,YAAY;CAEnC,KAAA,GAAA,cAAA,aAAA,CAAiB,QAAQ,GAAG,OAAO;CAEnC,QAAA,GAAA,cAAA,YAAA,CAAmB,IAAI,CAAC,CAAC;AAC3B;;;;;;AAkBA,MAAa,UAA2B,EACtC,UACA,cAAc,KACd,eACI;CACJ,MAAM,CAAC,QAAQ,aAAa,SAAS,KAAK,OAAO;CACjD,MAAM,MAAM,OAAO;CACnB,MAAM,EAAE,gBAAgB,eAAe;CAEvC,gBAAgB;EACd,gBAAgB,KAAK,OAAO;CAC9B,GAAG,CAAC,GAAG,CAAC;CAER,IAAI,OAAO,UAAU,OAAO;CAE5B,MAAM,YAAY,UAAU,cAAc,YAAY,CAAC;CAEvD,OACE,oBAAA,YAAA,EAAA,UAAG,SAAS,IAAI,WAAW,UAAU,aAAa,OAAO,SAAS,CAAC,EAAI,CAAA;AAE3E"}
+{"version":3,"file":"portal.js","names":[],"sources":["../../../../src/components/portal/portal.tsx"],"sourcesContent":["\"use client\"\n\nimport type { FC, PropsWithChildren, RefObject } from \"react\"\nimport type { RootNode } from \"../../core\"\nimport { Children, useEffect, useRef, useState } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { useEnvironment } from \"../../core\"\nimport { getDocument, isShadowRoot, useSsr } from \"../../utils\"\nimport { useFocusLockShard } from \"../focus-lock\"\n\nconst getPortalNode = (node?: RootNode) => {\n  const rootNode = node?.getRootNode()\n\n  if (isShadowRoot(rootNode)) return rootNode\n\n  return getDocument(node).body\n}\n\nexport interface PortalProps extends PropsWithChildren {\n  /**\n   * The `ref` to the component where the portal will be attached to.\n   */\n  containerRef?: RefObject<HTMLElement | null>\n  /**\n   * If `true`, the forwarding will be disabled.\n   */\n  disabled?: boolean\n}\n\n/**\n * `Portal` is a component that renders elements outside of the current `DOM` hierarchy.\n *\n * @see https://yamada-ui.com/docs/components/portal\n */\nexport const Portal: FC<PortalProps> = ({\n  children,\n  containerRef: ref,\n  disabled,\n}) => {\n  const shardRef = useRef<HTMLDivElement>(null)\n  const [target, setTarget] = useState(ref?.current)\n  const ssr = useSsr()\n  const { getRootNode } = useEnvironment()\n  const registerShard = useFocusLockShard()\n\n  useEffect(() => {\n    setTarget(() => ref?.current)\n  }, [ref])\n\n  useEffect(() => {\n    const shard = shardRef.current\n\n    if (disabled || ssr || !shard) return\n\n    return registerShard?.(shard)\n  }, [disabled, registerShard, ssr])\n\n  if (ssr || disabled) return children\n\n  const container = target ?? getPortalNode(getRootNode())\n\n  if (registerShard)\n    return createPortal(<div ref={shardRef}>{children}</div>, container)\n\n  return (\n    <>{Children.map(children, (child) => createPortal(child, container))}</>\n  )\n}\n"],"mappings":";;;;;;;;;AAUA,MAAM,iBAAiB,SAAoB;CACzC,MAAM,WAAW,MAAM,YAAY;CAEnC,KAAA,GAAA,cAAA,aAAA,CAAiB,QAAQ,GAAG,OAAO;CAEnC,QAAA,GAAA,cAAA,YAAA,CAAmB,IAAI,CAAC,CAAC;AAC3B;;;;;;AAkBA,MAAa,UAA2B,EACtC,UACA,cAAc,KACd,eACI;CACJ,MAAM,WAAW,OAAuB,IAAI;CAC5C,MAAM,CAAC,QAAQ,aAAa,SAAS,KAAK,OAAO;CACjD,MAAM,MAAM,OAAO;CACnB,MAAM,EAAE,gBAAgB,eAAe;CACvC,MAAM,gBAAgB,kBAAkB;CAExC,gBAAgB;EACd,gBAAgB,KAAK,OAAO;CAC9B,GAAG,CAAC,GAAG,CAAC;CAER,gBAAgB;EACd,MAAM,QAAQ,SAAS;EAEvB,IAAI,YAAY,OAAO,CAAC,OAAO;EAE/B,OAAO,gBAAgB,KAAK;CAC9B,GAAG;EAAC;EAAU;EAAe;CAAG,CAAC;CAEjC,IAAI,OAAO,UAAU,OAAO;CAE5B,MAAM,YAAY,UAAU,cAAc,YAAY,CAAC;CAEvD,IAAI,eACF,OAAO,aAAa,oBAAC,OAAD;EAAK,KAAK;EAAW;CAAc,CAAA,GAAG,SAAS;CAErE,OACE,oBAAA,YAAA,EAAA,UAAG,SAAS,IAAI,WAAW,UAAU,aAAa,OAAO,SAAS,CAAC,EAAI,CAAA;AAE3E"}

package/dist/esm/components/progress/progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress.js","names":[],"sources":["../../../../src/components/progress/progress.tsx"],"sourcesContent":["\"use client\"\n\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ProgressStyle } from \"./progress.style\"\nimport type { UseProgressProps } from \"./use-progress\"\nimport { createSlotComponent, mergeCSS, styled } from \"../../core\"\nimport { isNumber } from \"../../utils\"\nimport { progressStyle } from \"./progress.style\"\nimport { useProgress } from \"./use-progress\"\n\nexport interface ProgressProps\n  extends HTMLStyledProps, UseProgressProps, ThemeProps<ProgressStyle> {\n  /**\n   * The animation duration in seconds.\n   */\n  duration?: number | string\n  /**\n   * The color of the progress range.\n   */\n  rangeColor?: CSSProps[\"color\"]\n  /**\n   * The color of the progress track.\n   */\n  trackColor?: CSSProps[\"color\"]\n  /**\n   * Props for the progress range element.\n   */\n  rangeProps?: ProgressRangeProps\n}\n\nconst {\n  PropsContext: ProgressPropsContext,\n  usePropsContext: useProgressPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<ProgressProps, ProgressStyle>(\"progress\", progressStyle)\n\nexport { ProgressPropsContext, useProgressPropsContext }\n\n/**\n * `Progress` is a component for visually indicating progress.\n *\n * @see https://yamada-ui.com/docs/components/progress\n */\nexport const Progress = withProvider(\n  ({ css, max, min, rangeColor, trackColor, value, rangeProps, ...rest }) => {\n    const { percent, getRangeProps, getRootProps } = useProgress({\n      max,\n      min,\n      value,\n    })\n\n    return (\n      <styled.div\n        css={mergeCSS(css, { \"--width\": `${percent}%` })}\n        bg={trackColor}\n        {...getRootProps(rest)}\n      >\n        <ProgressRange bg={rangeColor} {...getRangeProps(rangeProps)} />\n      </styled.div>\n    )\n  },\n  \"root\",\n)(undefined, ({ duration, ...rest }) => ({\n  \"--duration\": isNumber(duration) ? `${duration}s` : duration,\n  ...rest,\n}))\n\ninterface ProgressRangeProps extends HTMLStyledProps {}\n\nconst ProgressRange = withContext<\"div\", ProgressRangeProps>(\"div\", \"range\")()\n"],"mappings":";;;;;;;;;AA8BA,MAAM,EACJ,cAAc,sBACd,iBAAiB,yBACjB,aACA,iBACE,oBAAkD,YAAY,aAAa;;;;;;AAS/E,MAAa,WAAW,cACrB,EAAE,KAAK,KAAK,KAAK,YAAY,YAAY,OAAO,YAAY,GAAG,WAAW;CACzE,MAAM,EAAE,SAAS,eAAe,iBAAiB,YAAY;EAC3D;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,OAAO,KAAR;EACE,KAAK,SAAS,KAAK,EAAE,WAAW,GAAG,QAAQ,GAAG,CAAC;EAC/C,IAAI;EACJ,GAAI,aAAa,IAAI;YAErB,oBAAC,eAAD;GAAe,IAAI;GAAY,GAAI,cAAc,UAAU;EAAI,CAAA;CACrD,CAAA;AAEhB,GACA,MACF,CAAC,CAAC,KAAA,IAAY,EAAE,UAAU,GAAG,YAAY;CACvC,eAAA,GAAA,cAAA,SAAA,CAAuB,QAAQ,IAAI,GAAG,SAAS,KAAK;CACpD,GAAG;AACL,EAAE;AAIF,MAAM,gBAAgB,YAAuC,OAAO,OAAO,CAAC,CAAC"}
+{"version":3,"file":"progress.js","names":[],"sources":["../../../../src/components/progress/progress.tsx"],"sourcesContent":["\"use client\"\n\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ProgressStyle } from \"./progress.style\"\nimport type { UseProgressProps } from \"./use-progress\"\nimport { createSlotComponent, mergeCSS, styled } from \"../../core\"\nimport { isNumber } from \"../../utils\"\nimport { progressStyle } from \"./progress.style\"\nimport { useProgress } from \"./use-progress\"\n\nexport interface ProgressProps\n  extends HTMLStyledProps, UseProgressProps, ThemeProps<ProgressStyle> {\n  /**\n   * The animation duration in seconds.\n   */\n  duration?: number | string\n  /**\n   * The color of the progress range.\n   */\n  rangeColor?: CSSProps[\"color\"]\n  /**\n   * The color of the progress track.\n   */\n  trackColor?: CSSProps[\"color\"]\n  /**\n   * Props for the progress range element.\n   */\n  rangeProps?: ProgressRangeProps\n}\n\nconst {\n  PropsContext: ProgressPropsContext,\n  usePropsContext: useProgressPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<ProgressProps, ProgressStyle>(\"progress\", progressStyle)\n\nexport { ProgressPropsContext, useProgressPropsContext }\n\n/**\n * `Progress` is a component for visually indicating progress.\n *\n * @see https://yamada-ui.com/docs/components/progress\n */\nexport const Progress = withProvider(\n  ({ css, max, min, rangeColor, trackColor, value, rangeProps, ...rest }) => {\n    const { percent, getRangeProps, getRootProps } = useProgress({\n      max,\n      min,\n      value,\n    })\n\n    return (\n      <styled.div\n        css={mergeCSS(css, { \"--width\": `${percent}%` })}\n        bg={trackColor}\n        {...getRootProps(rest)}\n      >\n        <ProgressRange bg={rangeColor} {...getRangeProps(rangeProps)} />\n      </styled.div>\n    )\n  },\n  \"root\",\n)(undefined, ({ duration, ...rest }) => ({\n  \"--duration\": isNumber(duration) ? `${duration}s` : duration,\n  ...rest,\n}))\n\ninterface ProgressRangeProps extends HTMLStyledProps {}\n\nconst ProgressRange = withContext<\"div\", ProgressRangeProps>(\"div\", \"range\")()\n"],"mappings":";;;;;;;;;AA8BA,MAAM,EACJ,cAAc,sBACd,iBAAiB,yBACjB,aACA,iBACE,oBAAkD,YAAY,aAAa;;;;;;AAS/E,MAAa,WAAW,cACrB,EAAE,KAAK,KAAK,KAAK,YAAY,YAAY,OAAO,YAAY,GAAG,WAAW;CACzE,MAAM,EAAE,SAAS,eAAe,iBAAiB,YAAY;EAC3D;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,OAAO,KAAR;EACE,KAAK,SAAS,KAAK,EAAE,WAAW,GAAG,QAAQ,GAAG,CAAC;EAC/C,IAAI;EACJ,GAAI,aAAa,IAAI;EAErB,UAAA,oBAAC,eAAD;GAAe,IAAI;GAAY,GAAI,cAAc,UAAU;EAAI,CAAA;CACrD,CAAA;AAEhB,GACA,MACF,CAAC,CAAC,KAAA,IAAY,EAAE,UAAU,GAAG,YAAY;CACvC,eAAA,GAAA,cAAA,SAAA,CAAuB,QAAQ,IAAI,GAAG,SAAS,KAAK;CACpD,GAAG;AACL,EAAE;AAIF,MAAM,gBAAgB,YAAuC,OAAO,OAAO,CAAC,CAAC"}

package/dist/esm/components/qr-code/qr-code.js.map

@@ -1 +1 @@
-{"version":3,"file":"qr-code.js","names":[],"sources":["../../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { QrCodeStyle } from \"./qr-code.style\"\nimport type { UseQrCodeProps, UseQrCodeReturn } from \"./use-qr-code\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useSplitChildren } from \"../../utils\"\nimport { qrCodeStyle } from \"./qr-code.style\"\nimport { useQrCode } from \"./use-qr-code\"\n\ninterface ComponentContext\n  extends\n    Pick<\n      UseQrCodeReturn,\n      \"getFrameProps\" | \"getOverlayProps\" | \"getPatternProps\"\n    >,\n    Pick<QrCodeRootProps, \"patternProps\"> {}\n\nexport interface QrCodeRootProps\n  extends\n    Omit<HTMLStyledProps, \"border\" | \"invert\">,\n    ThemeProps<QrCodeStyle>,\n    UseQrCodeProps {\n  /**\n   * Props for the frame component.\n   */\n  frameProps?: QrCodeFrameProps\n  /**\n   * Props for the pattern component.\n   */\n  patternProps?: QrCodePatternProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: QrCodePropsContext,\n  useComponentContext,\n  usePropsContext: useQrCodePropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<QrCodeRootProps, QrCodeStyle, ComponentContext>(\n  \"qr-code\",\n  qrCodeStyle,\n)\n\nexport { QrCodePropsContext, useQrCodePropsContext }\n\n/**\n * `QrCode` is a component that displays a QR code.\n *\n * @see https://yamada-ui.com/docs/components/qr-code\n */\nexport const QrCodeRoot = withProvider<\"div\", QrCodeRootProps>(\n  ({ children, frameProps, patternProps, ...rest }) => {\n    const { getFrameProps, getOverlayProps, getPatternProps, getRootProps } =\n      useQrCode(rest)\n    const [omittedChildren, customFrame] = useSplitChildren(\n      children,\n      QrCodeFrame,\n    )\n    const context = useMemo(\n      () => ({ getFrameProps, getOverlayProps, getPatternProps, patternProps }),\n      [getFrameProps, getOverlayProps, getPatternProps, patternProps],\n    )\n\n    return (\n      <ComponentContext value={context}>\n        <styled.div {...getRootProps()}>\n          {customFrame ?? <QrCodeFrame {...frameProps} />}\n          {omittedChildren}\n        </styled.div>\n      </ComponentContext>\n    )\n  },\n  \"root\",\n)()\n\nexport interface QrCodeFrameProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const QrCodeFrame = withContext<\"svg\", QrCodeFrameProps>(\n  ({ children, ...rest }) => {\n    const { getFrameProps, patternProps } = useComponentContext()\n    const [omittedChildren, customPattern] = useSplitChildren(\n      children,\n      QrCodePattern,\n    )\n\n    return (\n      <styled.svg {...getFrameProps(rest)}>\n        {customPattern ?? <QrCodePattern {...patternProps} />}\n        {omittedChildren}\n      </styled.svg>\n    )\n  },\n  \"frame\",\n)()\n\nexport interface QrCodePatternProps extends HTMLStyledProps<\"path\"> {}\n\nexport const QrCodePattern = withContext<\"path\", QrCodePatternProps>(\n  \"path\",\n  \"pattern\",\n)(undefined, (props) => {\n  const { getPatternProps } = useComponentContext()\n\n  return getPatternProps(props)\n})\n\nexport interface QrCodeOverlayProps extends HTMLStyledProps {}\n\nexport const QrCodeOverlay = withContext<\"div\", QrCodeOverlayProps>(\n  \"div\",\n  \"overlay\",\n)(undefined, (props) => {\n  const { getOverlayProps } = useComponentContext()\n\n  return getOverlayProps(props)\n})\n"],"mappings":";;;;;;;;;AAkCA,MAAM,EACJ,kBACA,cAAc,oBACd,qBACA,iBAAiB,uBACjB,aACA,iBACE,oBACF,WACA,WACF;;;;;;AASA,MAAa,aAAa,cACvB,EAAE,UAAU,YAAY,cAAc,GAAG,WAAW;CACnD,MAAM,EAAE,eAAe,iBAAiB,iBAAiB,iBACvD,UAAU,IAAI;CAChB,MAAM,CAAC,iBAAiB,eAAe,iBACrC,UACA,WACF;CACA,MAAM,UAAU,eACP;EAAE;EAAe;EAAiB;EAAiB;CAAa,IACvE;EAAC;EAAe;EAAiB;EAAiB;CAAY,CAChE;CAEA,OACE,oBAAC,kBAAD;EAAkB,OAAO;YACvB,qBAAC,OAAO,KAAR;GAAY,GAAI,aAAa;aAA7B,CACG,eAAe,oBAAC,aAAD,EAAa,GAAI,WAAa,CAAA,GAC7C,eACS;;CACI,CAAA;AAEtB,GACA,MACF,CAAC,CAAC;AAIF,MAAa,cAAc,aACxB,EAAE,UAAU,GAAG,WAAW;CACzB,MAAM,EAAE,eAAe,iBAAiB,oBAAoB;CAC5D,MAAM,CAAC,iBAAiB,iBAAiB,iBACvC,UACA,aACF;CAEA,OACE,qBAAC,OAAO,KAAR;EAAY,GAAI,cAAc,IAAI;YAAlC,CACG,iBAAiB,oBAAC,eAAD,EAAe,GAAI,aAAe,CAAA,GACnD,eACS;;AAEhB,GACA,OACF,CAAC,CAAC;AAIF,MAAa,gBAAgB,YAC3B,QACA,SACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,oBAAoB;CAEhD,OAAO,gBAAgB,KAAK;AAC9B,CAAC;AAID,MAAa,gBAAgB,YAC3B,OACA,SACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,oBAAoB;CAEhD,OAAO,gBAAgB,KAAK;AAC9B,CAAC"}
+{"version":3,"file":"qr-code.js","names":[],"sources":["../../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { QrCodeStyle } from \"./qr-code.style\"\nimport type { UseQrCodeProps, UseQrCodeReturn } from \"./use-qr-code\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useSplitChildren } from \"../../utils\"\nimport { qrCodeStyle } from \"./qr-code.style\"\nimport { useQrCode } from \"./use-qr-code\"\n\ninterface ComponentContext\n  extends\n    Pick<\n      UseQrCodeReturn,\n      \"getFrameProps\" | \"getOverlayProps\" | \"getPatternProps\"\n    >,\n    Pick<QrCodeRootProps, \"patternProps\"> {}\n\nexport interface QrCodeRootProps\n  extends\n    Omit<HTMLStyledProps, \"border\" | \"invert\">,\n    ThemeProps<QrCodeStyle>,\n    UseQrCodeProps {\n  /**\n   * Props for the frame component.\n   */\n  frameProps?: QrCodeFrameProps\n  /**\n   * Props for the pattern component.\n   */\n  patternProps?: QrCodePatternProps\n}\n\nconst {\n  ComponentContext,\n  PropsContext: QrCodePropsContext,\n  useComponentContext,\n  usePropsContext: useQrCodePropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<QrCodeRootProps, QrCodeStyle, ComponentContext>(\n  \"qr-code\",\n  qrCodeStyle,\n)\n\nexport { QrCodePropsContext, useQrCodePropsContext }\n\n/**\n * `QrCode` is a component that displays a QR code.\n *\n * @see https://yamada-ui.com/docs/components/qr-code\n */\nexport const QrCodeRoot = withProvider<\"div\", QrCodeRootProps>(\n  ({ children, frameProps, patternProps, ...rest }) => {\n    const { getFrameProps, getOverlayProps, getPatternProps, getRootProps } =\n      useQrCode(rest)\n    const [omittedChildren, customFrame] = useSplitChildren(\n      children,\n      QrCodeFrame,\n    )\n    const context = useMemo(\n      () => ({ getFrameProps, getOverlayProps, getPatternProps, patternProps }),\n      [getFrameProps, getOverlayProps, getPatternProps, patternProps],\n    )\n\n    return (\n      <ComponentContext value={context}>\n        <styled.div {...getRootProps()}>\n          {customFrame ?? <QrCodeFrame {...frameProps} />}\n          {omittedChildren}\n        </styled.div>\n      </ComponentContext>\n    )\n  },\n  \"root\",\n)()\n\nexport interface QrCodeFrameProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const QrCodeFrame = withContext<\"svg\", QrCodeFrameProps>(\n  ({ children, ...rest }) => {\n    const { getFrameProps, patternProps } = useComponentContext()\n    const [omittedChildren, customPattern] = useSplitChildren(\n      children,\n      QrCodePattern,\n    )\n\n    return (\n      <styled.svg {...getFrameProps(rest)}>\n        {customPattern ?? <QrCodePattern {...patternProps} />}\n        {omittedChildren}\n      </styled.svg>\n    )\n  },\n  \"frame\",\n)()\n\nexport interface QrCodePatternProps extends HTMLStyledProps<\"path\"> {}\n\nexport const QrCodePattern = withContext<\"path\", QrCodePatternProps>(\n  \"path\",\n  \"pattern\",\n)(undefined, (props) => {\n  const { getPatternProps } = useComponentContext()\n\n  return getPatternProps(props)\n})\n\nexport interface QrCodeOverlayProps extends HTMLStyledProps {}\n\nexport const QrCodeOverlay = withContext<\"div\", QrCodeOverlayProps>(\n  \"div\",\n  \"overlay\",\n)(undefined, (props) => {\n  const { getOverlayProps } = useComponentContext()\n\n  return getOverlayProps(props)\n})\n"],"mappings":";;;;;;;;;AAkCA,MAAM,EACJ,kBACA,cAAc,oBACd,qBACA,iBAAiB,uBACjB,aACA,iBACE,oBACF,WACA,WACF;;;;;;AASA,MAAa,aAAa,cACvB,EAAE,UAAU,YAAY,cAAc,GAAG,WAAW;CACnD,MAAM,EAAE,eAAe,iBAAiB,iBAAiB,iBACvD,UAAU,IAAI;CAChB,MAAM,CAAC,iBAAiB,eAAe,iBACrC,UACA,WACF;CACA,MAAM,UAAU,eACP;EAAE;EAAe;EAAiB;EAAiB;CAAa,IACvE;EAAC;EAAe;EAAiB;EAAiB;CAAY,CAChE;CAEA,OACE,oBAAC,kBAAD;EAAkB,OAAO;EACvB,UAAA,qBAAC,OAAO,KAAR;GAAY,GAAI,aAAa;GAA7B,UAAA,CACG,eAAe,oBAAC,aAAD,EAAa,GAAI,WAAa,CAAA,GAC7C,eACS;;CACI,CAAA;AAEtB,GACA,MACF,CAAC,CAAC;AAIF,MAAa,cAAc,aACxB,EAAE,UAAU,GAAG,WAAW;CACzB,MAAM,EAAE,eAAe,iBAAiB,oBAAoB;CAC5D,MAAM,CAAC,iBAAiB,iBAAiB,iBACvC,UACA,aACF;CAEA,OACE,qBAAC,OAAO,KAAR;EAAY,GAAI,cAAc,IAAI;EAAlC,UAAA,CACG,iBAAiB,oBAAC,eAAD,EAAe,GAAI,aAAe,CAAA,GACnD,eACS;;AAEhB,GACA,OACF,CAAC,CAAC;AAIF,MAAa,gBAAgB,YAC3B,QACA,SACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,oBAAoB;CAEhD,OAAO,gBAAgB,KAAK;AAC9B,CAAC;AAID,MAAa,gBAAgB,YAC3B,OACA,SACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,oBAAoB;CAEhD,OAAO,gBAAgB,KAAK;AAC9B,CAAC"}

package/dist/esm/components/radio/radio-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group.js","names":[],"sources":["../../../../src/components/radio/radio-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 { RadioProps } from \"./radio\"\nimport type { RadioStyle } from \"./radio.style\"\nimport type { UseRadioGroupProps } from \"./use-radio-group\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport {\n  component,\n  Radio,\n  RadioPropsContext,\n  useRootComponentProps,\n} from \"./radio\"\nimport { RadioGroupContext, useRadioGroup } from \"./use-radio-group\"\n\nexport interface RadioGroupItem<\n  Y extends string = string,\n> extends RadioProps<Y> {\n  label: ReactNode\n}\n\nexport interface RadioGroupRootProps<Y extends string = string>\n  extends\n    Omit<\n      WithoutThemeProps<GroupProps, RadioStyle>,\n      \"defaultValue\" | \"onChange\" | \"value\"\n    >,\n    ThemeProps<RadioStyle>,\n    UseRadioGroupProps<Y>,\n    UseInputBorderProps {\n  /**\n   * If provided, generate options based on items.\n   *\n   * @default []\n   */\n  items?: RadioGroupItem<Y>[]\n}\n\n/**\n * `RadioGroup` is a component that groups `Radio` components.\n *\n * @see https://yamada-ui.com/docs/components/radio\n */\nexport const RadioGroupRoot = component<\"div\", RadioGroupRootProps>((props) => {\n  const [\n    ,\n    {\n      colorScheme,\n      size,\n      variant,\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 { name, value, getInputProps, getLabelProps, getRootProps, onChange } =\n    useRadioGroup(rest)\n  const computedChildren = useMemo(() => {\n    if (children) return children\n\n    return items.map(({ label, value, ...rest }, index) => (\n      <Radio key={value ?? index} value={value} {...rest}>\n        {label}\n      </Radio>\n    ))\n  }, [items, children])\n  const context = useMemo(\n    () => ({\n      colorScheme,\n      size,\n      variant,\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    ],\n  )\n  const groupContext = useMemo(\n    () => ({ name, value, getInputProps, getLabelProps, onChange }),\n    [name, value, getInputProps, getLabelProps, onChange],\n  )\n\n  return (\n    <RadioPropsContext value={context}>\n      <RadioGroupContext value={groupContext}>\n        <Group orientation=\"vertical\" {...getRootProps()}>\n          {computedChildren}\n        </Group>\n      </RadioGroupContext>\n    </RadioPropsContext>\n  )\n}, \"group\")() as GenericsComponent<{\n  <Y extends string = string>(props: RadioGroupRootProps<Y>): ReactElement\n}>\n\nexport { Radio as RadioGroupItem }\n"],"mappings":";;;;;;;;;;;;AAmDA,MAAa,iBAAiB,WAAuC,UAAU;CAC7E,MAAM,GAEJ,EACE,aACA,MACA,SACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,CAAC,GACT,UACA,OACA,GAAG,UAEH,sBAAsB,OAAO,SAAS,EACxC,eAAe;EAAC;EAAW;EAAe;EAAQ;CAAO,EAC3D,CAAC;CACD,MAAM,EAAE,MAAM,OAAO,eAAe,eAAe,cAAc,aAC/D,cAAc,IAAI;CACpB,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;EAErB,OAAO,MAAM,KAAK,EAAE,OAAO,OAAO,GAAG,QAAQ,UAC3C,oBAAC,OAAD;GAAmC;GAAO,GAAI;aAC3C;EACI,GAFK,SAAS,KAEd,CACR;CACH,GAAG,CAAC,OAAO,QAAQ,CAAC;CA8BpB,OACE,oBAAC,mBAAD;EAAmB,OA9BL,eACP;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,IACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAQgC;YAC9B,oBAAC,mBAAD;GAAmB,OAPF,eACZ;IAAE;IAAM;IAAO;IAAe;IAAe;GAAS,IAC7D;IAAC;IAAM;IAAO;IAAe;IAAe;GAAQ,CAKb;aACnC,oBAAC,OAAD;IAAO,aAAY;IAAW,GAAI,aAAa;cAC5C;GACI,CAAA;EACU,CAAA;CACF,CAAA;AAEvB,GAAG,OAAO,CAAC,CAAC"}
+{"version":3,"file":"radio-group.js","names":[],"sources":["../../../../src/components/radio/radio-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 { RadioProps } from \"./radio\"\nimport type { RadioStyle } from \"./radio.style\"\nimport type { UseRadioGroupProps } from \"./use-radio-group\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport {\n  component,\n  Radio,\n  RadioPropsContext,\n  useRootComponentProps,\n} from \"./radio\"\nimport { RadioGroupContext, useRadioGroup } from \"./use-radio-group\"\n\nexport interface RadioGroupItem<\n  Y extends string = string,\n> extends RadioProps<Y> {\n  label: ReactNode\n}\n\nexport interface RadioGroupRootProps<Y extends string = string>\n  extends\n    Omit<\n      WithoutThemeProps<GroupProps, RadioStyle>,\n      \"defaultValue\" | \"onChange\" | \"value\"\n    >,\n    ThemeProps<RadioStyle>,\n    UseRadioGroupProps<Y>,\n    UseInputBorderProps {\n  /**\n   * If provided, generate options based on items.\n   *\n   * @default []\n   */\n  items?: RadioGroupItem<Y>[]\n}\n\n/**\n * `RadioGroup` is a component that groups `Radio` components.\n *\n * @see https://yamada-ui.com/docs/components/radio\n */\nexport const RadioGroupRoot = component<\"div\", RadioGroupRootProps>((props) => {\n  const [\n    ,\n    {\n      colorScheme,\n      size,\n      variant,\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 { name, value, getInputProps, getLabelProps, getRootProps, onChange } =\n    useRadioGroup(rest)\n  const computedChildren = useMemo(() => {\n    if (children) return children\n\n    return items.map(({ label, value, ...rest }, index) => (\n      <Radio key={value ?? index} value={value} {...rest}>\n        {label}\n      </Radio>\n    ))\n  }, [items, children])\n  const context = useMemo(\n    () => ({\n      colorScheme,\n      size,\n      variant,\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    ],\n  )\n  const groupContext = useMemo(\n    () => ({ name, value, getInputProps, getLabelProps, onChange }),\n    [name, value, getInputProps, getLabelProps, onChange],\n  )\n\n  return (\n    <RadioPropsContext value={context}>\n      <RadioGroupContext value={groupContext}>\n        <Group orientation=\"vertical\" {...getRootProps()}>\n          {computedChildren}\n        </Group>\n      </RadioGroupContext>\n    </RadioPropsContext>\n  )\n}, \"group\")() as GenericsComponent<{\n  <Y extends string = string>(props: RadioGroupRootProps<Y>): ReactElement\n}>\n\nexport { Radio as RadioGroupItem }\n"],"mappings":";;;;;;;;;;;;AAmDA,MAAa,iBAAiB,WAAuC,UAAU;CAC7E,MAAM,GAEJ,EACE,aACA,MACA,SACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,CAAC,GACT,UACA,OACA,GAAG,UAEH,sBAAsB,OAAO,SAAS,EACxC,eAAe;EAAC;EAAW;EAAe;EAAQ;CAAO,EAC3D,CAAC;CACD,MAAM,EAAE,MAAM,OAAO,eAAe,eAAe,cAAc,aAC/D,cAAc,IAAI;CACpB,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;EAErB,OAAO,MAAM,KAAK,EAAE,OAAO,OAAO,GAAG,QAAQ,UAC3C,oBAAC,OAAD;GAAmC;GAAO,GAAI;GAC3C,UAAA;EACI,GAFK,SAAS,KAEd,CACR;CACH,GAAG,CAAC,OAAO,QAAQ,CAAC;CA8BpB,OACE,oBAAC,mBAAD;EAAmB,OA9BL,eACP;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,IACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAQgC;EAC9B,UAAA,oBAAC,mBAAD;GAAmB,OAPF,eACZ;IAAE;IAAM;IAAO;IAAe;IAAe;GAAS,IAC7D;IAAC;IAAM;IAAO;IAAe;IAAe;GAAQ,CAKb;GACnC,UAAA,oBAAC,OAAD;IAAO,aAAY;IAAW,GAAI,aAAa;IAC5C,UAAA;GACI,CAAA;EACU,CAAA;CACF,CAAA;AAEvB,GAAG,OAAO,CAAC,CAAC"}

package/dist/esm/components/radio/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.js","names":[],"sources":["../../../../src/components/radio/radio.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { RadioStyle } from \"./radio.style\"\nimport type { UseRadioProps } from \"./use-radio\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useInputBorder } from \"../input\"\nimport { radioStyle } from \"./radio.style\"\nimport { useRadio } from \"./use-radio\"\n\nexport interface RadioProps<Y extends string = string>\n  extends\n    Merge<HTMLStyledProps<\"label\">, UseRadioProps<Y>>,\n    ThemeProps<RadioStyle>,\n    UseInputBorderProps {\n  /**\n   * Props for the indicator component.\n   */\n  indicatorProps?: RadioIndicatorProps\n  /**\n   * Props for the input element.\n   */\n  inputProps?: HTMLStyledProps<\"input\">\n  /**\n   * Props for the label component.\n   */\n  labelProps?: RadioLabelProps\n  /**\n   * Props for the label element.\n   */\n  rootProps?: HTMLStyledProps<\"label\">\n}\n\nconst {\n  component,\n  PropsContext: RadioPropsContext,\n  usePropsContext: useRadioPropsContext,\n  withContext,\n  withProvider,\n  useRootComponentProps,\n} = createSlotComponent<RadioProps, RadioStyle>(\"radio\", radioStyle)\n\nexport {\n  component,\n  RadioPropsContext,\n  useRadioPropsContext,\n  useRootComponentProps,\n}\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see https://yamada-ui.com/docs/components/radio\n */\nexport const Radio = withProvider<\"label\", RadioProps>(\n  ({\n    children,\n    errorBorderColor,\n    focusBorderColor,\n    indicatorProps,\n    inputProps,\n    labelProps,\n    rootProps,\n    ...rest\n  }) => {\n    const { getIndicatorProps, getInputProps, getRootProps } = useRadio(rest)\n    const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n    const input = useMemo(() => {\n      return <styled.input {...getInputProps(inputProps)} />\n    }, [getInputProps, inputProps])\n    const indicator = useMemo(() => {\n      return <RadioIndicator {...getIndicatorProps(indicatorProps)} />\n    }, [getIndicatorProps, indicatorProps])\n\n    return (\n      <styled.label {...getRootProps({ ...varProps, ...rootProps })}>\n        {input}\n        {indicator}\n        {children ? <RadioLabel {...labelProps}>{children}</RadioLabel> : null}\n      </styled.label>\n    )\n  },\n  \"root\",\n)() as GenericsComponent<{\n  <Y extends string = string>(props: RadioProps<Y>): ReactElement\n}>\n\ninterface RadioIndicatorProps extends HTMLStyledProps {}\n\nconst RadioIndicator = withContext<\"div\", RadioIndicatorProps>(\n  \"div\",\n  \"indicator\",\n)({ \"data-indicator\": \"\" })\n\ninterface RadioLabelProps extends HTMLStyledProps<\"span\"> {}\n\nconst RadioLabel = withContext<\"span\", RadioLabelProps>(\"span\", \"label\")()\n"],"mappings":";;;;;;;;;AAqCA,MAAM,EACJ,WACA,cAAc,mBACd,iBAAiB,sBACjB,aACA,cACA,0BACE,oBAA4C,SAAS,UAAU;;;;;;AAcnE,MAAa,QAAQ,cAClB,EACC,UACA,kBACA,kBACA,gBACA,YACA,YACA,WACA,GAAG,WACC;CACJ,MAAM,EAAE,mBAAmB,eAAe,iBAAiB,SAAS,IAAI;CACxE,MAAM,WAAW,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,QAAQ,cAAc;EAC1B,OAAO,oBAAC,OAAO,OAAR,EAAc,GAAI,cAAc,UAAU,EAAI,CAAA;CACvD,GAAG,CAAC,eAAe,UAAU,CAAC;CAC9B,MAAM,YAAY,cAAc;EAC9B,OAAO,oBAAC,gBAAD,EAAgB,GAAI,kBAAkB,cAAc,EAAI,CAAA;CACjE,GAAG,CAAC,mBAAmB,cAAc,CAAC;CAEtC,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,aAAa;GAAE,GAAG;GAAU,GAAG;EAAU,CAAC;YAA5D;GACG;GACA;GACA,WAAW,oBAAC,YAAD;IAAY,GAAI;IAAa;GAAqB,CAAA,IAAI;EACtD;;AAElB,GACA,MACF,CAAC,CAAC;AAMF,MAAM,iBAAiB,YACrB,OACA,WACF,CAAC,CAAC,EAAE,kBAAkB,GAAG,CAAC;AAI1B,MAAM,aAAa,YAAqC,QAAQ,OAAO,CAAC,CAAC"}
+{"version":3,"file":"radio.js","names":[],"sources":["../../../../src/components/radio/radio.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { RadioStyle } from \"./radio.style\"\nimport type { UseRadioProps } from \"./use-radio\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useInputBorder } from \"../input\"\nimport { radioStyle } from \"./radio.style\"\nimport { useRadio } from \"./use-radio\"\n\nexport interface RadioProps<Y extends string = string>\n  extends\n    Merge<HTMLStyledProps<\"label\">, UseRadioProps<Y>>,\n    ThemeProps<RadioStyle>,\n    UseInputBorderProps {\n  /**\n   * Props for the indicator component.\n   */\n  indicatorProps?: RadioIndicatorProps\n  /**\n   * Props for the input element.\n   */\n  inputProps?: HTMLStyledProps<\"input\">\n  /**\n   * Props for the label component.\n   */\n  labelProps?: RadioLabelProps\n  /**\n   * Props for the label element.\n   */\n  rootProps?: HTMLStyledProps<\"label\">\n}\n\nconst {\n  component,\n  PropsContext: RadioPropsContext,\n  usePropsContext: useRadioPropsContext,\n  withContext,\n  withProvider,\n  useRootComponentProps,\n} = createSlotComponent<RadioProps, RadioStyle>(\"radio\", radioStyle)\n\nexport {\n  component,\n  RadioPropsContext,\n  useRadioPropsContext,\n  useRootComponentProps,\n}\n\n/**\n * `Radio` is a component used for allowing users to select one option from multiple choices.\n *\n * @see https://yamada-ui.com/docs/components/radio\n */\nexport const Radio = withProvider<\"label\", RadioProps>(\n  ({\n    children,\n    errorBorderColor,\n    focusBorderColor,\n    indicatorProps,\n    inputProps,\n    labelProps,\n    rootProps,\n    ...rest\n  }) => {\n    const { getIndicatorProps, getInputProps, getRootProps } = useRadio(rest)\n    const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n    const input = useMemo(() => {\n      return <styled.input {...getInputProps(inputProps)} />\n    }, [getInputProps, inputProps])\n    const indicator = useMemo(() => {\n      return <RadioIndicator {...getIndicatorProps(indicatorProps)} />\n    }, [getIndicatorProps, indicatorProps])\n\n    return (\n      <styled.label {...getRootProps({ ...varProps, ...rootProps })}>\n        {input}\n        {indicator}\n        {children ? <RadioLabel {...labelProps}>{children}</RadioLabel> : null}\n      </styled.label>\n    )\n  },\n  \"root\",\n)() as GenericsComponent<{\n  <Y extends string = string>(props: RadioProps<Y>): ReactElement\n}>\n\ninterface RadioIndicatorProps extends HTMLStyledProps {}\n\nconst RadioIndicator = withContext<\"div\", RadioIndicatorProps>(\n  \"div\",\n  \"indicator\",\n)({ \"data-indicator\": \"\" })\n\ninterface RadioLabelProps extends HTMLStyledProps<\"span\"> {}\n\nconst RadioLabel = withContext<\"span\", RadioLabelProps>(\"span\", \"label\")()\n"],"mappings":";;;;;;;;;AAqCA,MAAM,EACJ,WACA,cAAc,mBACd,iBAAiB,sBACjB,aACA,cACA,0BACE,oBAA4C,SAAS,UAAU;;;;;;AAcnE,MAAa,QAAQ,cAClB,EACC,UACA,kBACA,kBACA,gBACA,YACA,YACA,WACA,GAAG,WACC;CACJ,MAAM,EAAE,mBAAmB,eAAe,iBAAiB,SAAS,IAAI;CACxE,MAAM,WAAW,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,QAAQ,cAAc;EAC1B,OAAO,oBAAC,OAAO,OAAR,EAAc,GAAI,cAAc,UAAU,EAAI,CAAA;CACvD,GAAG,CAAC,eAAe,UAAU,CAAC;CAC9B,MAAM,YAAY,cAAc;EAC9B,OAAO,oBAAC,gBAAD,EAAgB,GAAI,kBAAkB,cAAc,EAAI,CAAA;CACjE,GAAG,CAAC,mBAAmB,cAAc,CAAC;CAEtC,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,aAAa;GAAE,GAAG;GAAU,GAAG;EAAU,CAAC;EAA5D,UAAA;GACG;GACA;GACA,WAAW,oBAAC,YAAD;IAAY,GAAI;IAAa;GAAqB,CAAA,IAAI;EACtD;;AAElB,GACA,MACF,CAAC,CAAC;AAMF,MAAM,iBAAiB,YACrB,OACA,WACF,CAAC,CAAC,EAAE,kBAAkB,GAAG,CAAC;AAI1B,MAAM,aAAa,YAAqC,QAAQ,OAAO,CAAC,CAAC"}

package/dist/esm/components/radio-card/radio-card-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-card-group.js","names":[],"sources":["../../../../src/components/radio-card/radio-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 { GroupProps } from \"../group\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { UseRadioGroupProps } from \"../radio\"\nimport type { RadioCardRootProps } from \"./radio-card\"\nimport type { RadioCardStyle } from \"./radio-card.style\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport { RadioGroupContext, useRadioGroup } from \"../radio\"\nimport {\n  component,\n  RadioCardPropsContext,\n  RadioCardRoot,\n  useRootComponentProps,\n} from \"./radio-card\"\n\nexport interface RadioCardGroupItem<\n  Y extends string = string,\n> extends RadioCardRootProps<Y> {}\n\nexport interface RadioCardGroupRootProps<Y extends string = string>\n  extends\n    Omit<\n      WithoutThemeProps<GroupProps, RadioCardStyle>,\n      \"defaultValue\" | \"onChange\" | \"value\"\n    >,\n    ThemeProps<RadioCardStyle>,\n    UseRadioGroupProps<Y>,\n    UseInputBorderProps,\n    Pick<RadioCardRootProps, \"withIndicator\"> {\n  /**\n   * If provided, generate options based on items.\n   *\n   * @default []\n   */\n  items?: RadioCardGroupItem<Y>[]\n}\n\n/**\n * `RadioCardGroup` is a component that groups `RadioCard` components.\n *\n * @see https://yamada-ui.com/docs/components/radio-card\n */\nexport const RadioCardGroupRoot = component<\"div\", RadioCardGroupRootProps>(\n  (props) => {\n    const [\n      ,\n      {\n        colorScheme,\n        size,\n        variant,\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 {\n      name,\n      value,\n      getInputProps,\n      getLabelProps,\n      getRootProps,\n      onChange,\n    } = useRadioGroup(rest)\n    const computedChildren = useMemo(() => {\n      if (children) return children\n\n      return items.map(({ value, ...rest }, index) => (\n        <RadioCardRoot key={value ?? index} value={value} {...rest} />\n      ))\n    }, [items, children])\n    const context = useMemo(\n      () => ({\n        colorScheme,\n        size,\n        variant,\n        disabled,\n        errorBorderColor,\n        focusBorderColor,\n        invalid,\n        justify,\n        readOnly,\n        shape,\n        withIndicator,\n      }),\n      [\n        colorScheme,\n        size,\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      () => ({ name, value, getInputProps, getLabelProps, onChange }),\n      [name, value, getInputProps, getLabelProps, onChange],\n    )\n\n    return (\n      <RadioCardPropsContext value={context}>\n        <RadioGroupContext value={groupContext}>\n          <Group {...getRootProps()}>{computedChildren}</Group>\n        </RadioGroupContext>\n      </RadioCardPropsContext>\n    )\n  },\n  \"group\",\n)() as GenericsComponent<{\n  <Y extends string = string>(props: RadioCardGroupRootProps<Y>): ReactElement\n}>\n\nexport { RadioCardRoot as RadioCardGroupItem }\n"],"mappings":";;;;;;;;;;;;AAkDA,MAAa,qBAAqB,WAC/B,UAAU;CACT,MAAM,GAEJ,EACE,aACA,MACA,SACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,CAAC,GACT,SACA,UACA,OACA,eACA,GAAG,UAEH,sBAAsB,OAAO,SAAS,EACxC,eAAe;EACb;EACA;EACA;EACA;EACA;EACA;CACF,EACF,CAAC;CACD,MAAM,EACJ,MACA,OACA,eACA,eACA,cACA,aACE,cAAc,IAAI;CACtB,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;EAErB,OAAO,MAAM,KAAK,EAAE,OAAO,GAAG,QAAQ,UACpC,oBAAC,eAAD;GAA2C;GAAO,GAAI;EAAO,GAAzC,SAAS,KAAgC,CAC9D;CACH,GAAG,CAAC,OAAO,QAAQ,CAAC;CAkCpB,OACE,oBAAC,uBAAD;EAAuB,OAlCT,eACP;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,IACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAQoC;YAClC,oBAAC,mBAAD;GAAmB,OAPF,eACZ;IAAE;IAAM;IAAO;IAAe;IAAe;GAAS,IAC7D;IAAC;IAAM;IAAO;IAAe;IAAe;GAAQ,CAKb;aACnC,oBAAC,OAAD;IAAO,GAAI,aAAa;cAAI;GAAwB,CAAA;EACnC,CAAA;CACE,CAAA;AAE3B,GACA,OACF,CAAC,CAAC"}
+{"version":3,"file":"radio-card-group.js","names":[],"sources":["../../../../src/components/radio-card/radio-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 { GroupProps } from \"../group\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { UseRadioGroupProps } from \"../radio\"\nimport type { RadioCardRootProps } from \"./radio-card\"\nimport type { RadioCardStyle } from \"./radio-card.style\"\nimport { useMemo } from \"react\"\nimport { Group } from \"../group\"\nimport { RadioGroupContext, useRadioGroup } from \"../radio\"\nimport {\n  component,\n  RadioCardPropsContext,\n  RadioCardRoot,\n  useRootComponentProps,\n} from \"./radio-card\"\n\nexport interface RadioCardGroupItem<\n  Y extends string = string,\n> extends RadioCardRootProps<Y> {}\n\nexport interface RadioCardGroupRootProps<Y extends string = string>\n  extends\n    Omit<\n      WithoutThemeProps<GroupProps, RadioCardStyle>,\n      \"defaultValue\" | \"onChange\" | \"value\"\n    >,\n    ThemeProps<RadioCardStyle>,\n    UseRadioGroupProps<Y>,\n    UseInputBorderProps,\n    Pick<RadioCardRootProps, \"withIndicator\"> {\n  /**\n   * If provided, generate options based on items.\n   *\n   * @default []\n   */\n  items?: RadioCardGroupItem<Y>[]\n}\n\n/**\n * `RadioCardGroup` is a component that groups `RadioCard` components.\n *\n * @see https://yamada-ui.com/docs/components/radio-card\n */\nexport const RadioCardGroupRoot = component<\"div\", RadioCardGroupRootProps>(\n  (props) => {\n    const [\n      ,\n      {\n        colorScheme,\n        size,\n        variant,\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 {\n      name,\n      value,\n      getInputProps,\n      getLabelProps,\n      getRootProps,\n      onChange,\n    } = useRadioGroup(rest)\n    const computedChildren = useMemo(() => {\n      if (children) return children\n\n      return items.map(({ value, ...rest }, index) => (\n        <RadioCardRoot key={value ?? index} value={value} {...rest} />\n      ))\n    }, [items, children])\n    const context = useMemo(\n      () => ({\n        colorScheme,\n        size,\n        variant,\n        disabled,\n        errorBorderColor,\n        focusBorderColor,\n        invalid,\n        justify,\n        readOnly,\n        shape,\n        withIndicator,\n      }),\n      [\n        colorScheme,\n        size,\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      () => ({ name, value, getInputProps, getLabelProps, onChange }),\n      [name, value, getInputProps, getLabelProps, onChange],\n    )\n\n    return (\n      <RadioCardPropsContext value={context}>\n        <RadioGroupContext value={groupContext}>\n          <Group {...getRootProps()}>{computedChildren}</Group>\n        </RadioGroupContext>\n      </RadioCardPropsContext>\n    )\n  },\n  \"group\",\n)() as GenericsComponent<{\n  <Y extends string = string>(props: RadioCardGroupRootProps<Y>): ReactElement\n}>\n\nexport { RadioCardRoot as RadioCardGroupItem }\n"],"mappings":";;;;;;;;;;;;AAkDA,MAAa,qBAAqB,WAC/B,UAAU;CACT,MAAM,GAEJ,EACE,aACA,MACA,SACA,UACA,UACA,kBACA,kBACA,SACA,QAAQ,CAAC,GACT,SACA,UACA,OACA,eACA,GAAG,UAEH,sBAAsB,OAAO,SAAS,EACxC,eAAe;EACb;EACA;EACA;EACA;EACA;EACA;CACF,EACF,CAAC;CACD,MAAM,EACJ,MACA,OACA,eACA,eACA,cACA,aACE,cAAc,IAAI;CACtB,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;EAErB,OAAO,MAAM,KAAK,EAAE,OAAO,GAAG,QAAQ,UACpC,oBAAC,eAAD;GAA2C;GAAO,GAAI;EAAO,GAAzC,SAAS,KAAgC,CAC9D;CACH,GAAG,CAAC,OAAO,QAAQ,CAAC;CAkCpB,OACE,oBAAC,uBAAD;EAAuB,OAlCT,eACP;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,IACA;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAQoC;EAClC,UAAA,oBAAC,mBAAD;GAAmB,OAPF,eACZ;IAAE;IAAM;IAAO;IAAe;IAAe;GAAS,IAC7D;IAAC;IAAM;IAAO;IAAe;IAAe;GAAQ,CAKb;GACnC,UAAA,oBAAC,OAAD;IAAO,GAAI,aAAa;IAAI,UAAA;GAAwB,CAAA;EACnC,CAAA;CACE,CAAA;AAE3B,GACA,OACF,CAAC,CAAC"}

package/dist/esm/components/radio-card/radio-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-card.js","names":[],"sources":["../../../../src/components/radio-card/radio-card.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { UseRadioProps } from \"../radio\"\nimport type { RadioCardStyle } from \"./radio-card.style\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useInputBorder } from \"../input\"\nimport { useRadio } from \"../radio\"\nimport { radioCardStyle } from \"./radio-card.style\"\n\nexport interface RadioCardRootProps<Y extends string = string>\n  extends\n    Merge<HTMLStyledProps<\"label\">, UseRadioProps<Y>>,\n    ThemeProps<RadioCardStyle>,\n    UseInputBorderProps {\n  /**\n   * The addon of the radio card.\n   */\n  addon?: ReactNode\n  /**\n   * The description of the radio card.\n   */\n  description?: ReactNode\n  /**\n   * The label of the radio card.\n   */\n  label?: ReactNode\n  /**\n   * If `true`, the indicator will be displayed.\n   *\n   * @default true\n   */\n  withIndicator?: boolean\n  /**\n   * Props for the addon component.\n   */\n  addonProps?: RadioCardAddonProps\n  /**\n   * Props for the description component.\n   */\n  descriptionProps?: RadioCardDescriptionProps\n  /**\n   * Props for the indicator component.\n   */\n  indicatorProps?: RadioCardIndicatorProps\n  /**\n   * Props for the input element.\n   */\n  inputProps?: HTMLStyledProps<\"input\">\n  /**\n   * Props for the label component.\n   */\n  labelProps?: RadioCardLabelProps\n  /**\n   * Props for the label element.\n   */\n  rootProps?: HTMLStyledProps<\"label\">\n}\n\nconst {\n  component,\n  PropsContext: RadioCardPropsContext,\n  usePropsContext: useRadioCardPropsContext,\n  withContext,\n  withProvider,\n  useRootComponentProps,\n} = createSlotComponent<RadioCardRootProps, RadioCardStyle>(\n  \"radio-card\",\n  radioCardStyle,\n)\n\nexport {\n  component,\n  RadioCardPropsContext,\n  useRadioCardPropsContext,\n  useRootComponentProps,\n}\n\n/**\n * `RadioCard` is a component used for allowing users to select one option from multiple choices.\n *\n * @see https://yamada-ui.com/docs/components/radio-card\n */\nexport const RadioCardRoot = withProvider<\"label\", RadioCardRootProps>(\n  ({\n    addon,\n    children,\n    description,\n    errorBorderColor,\n    focusBorderColor,\n    label,\n    withIndicator = true,\n    addonProps,\n    descriptionProps,\n    indicatorProps,\n    inputProps,\n    labelProps,\n    rootProps,\n    ...rest\n  }) => {\n    const { getIndicatorProps, getInputProps, getRootProps } = useRadio(rest)\n    const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n    const computedChildren = useMemo(() => {\n      if (children) return children\n\n      return (\n        <>\n          {label ? (\n            <RadioCardLabel {...labelProps}>{label}</RadioCardLabel>\n          ) : null}\n          {description ? (\n            <RadioCardDescription {...descriptionProps}>\n              {description}\n            </RadioCardDescription>\n          ) : null}\n          {addon ? (\n            <RadioCardAddon {...addonProps}>{addon}</RadioCardAddon>\n          ) : null}\n        </>\n      )\n    }, [\n      addon,\n      addonProps,\n      children,\n      description,\n      descriptionProps,\n      label,\n      labelProps,\n    ])\n\n    return (\n      <styled.label {...getRootProps({ ...varProps, ...rootProps })}>\n        <styled.input {...getInputProps(inputProps)} />\n        {withIndicator ? (\n          <RadioCardIndicator {...getIndicatorProps(indicatorProps)} />\n        ) : null}\n\n        {computedChildren}\n      </styled.label>\n    )\n  },\n  \"root\",\n)() as GenericsComponent<{\n  <Y extends string = string>(props: RadioCardRootProps<Y>): ReactElement\n}>\n\ninterface RadioCardIndicatorProps extends HTMLStyledProps {}\n\nconst RadioCardIndicator = withContext<\"div\", RadioCardIndicatorProps>(\n  \"div\",\n  \"indicator\",\n)({ \"data-indicator\": \"\" })\n\nexport interface RadioCardLabelProps extends HTMLStyledProps {}\n\nexport const RadioCardLabel = withContext<\"span\", RadioCardLabelProps>(\n  \"span\",\n  \"label\",\n)()\n\nexport interface RadioCardDescriptionProps extends HTMLStyledProps {}\n\nexport const RadioCardDescription = withContext<\n  \"span\",\n  RadioCardDescriptionProps\n>(\"span\", \"description\")()\n\nexport interface RadioCardAddonProps extends HTMLStyledProps {}\n\nexport const RadioCardAddon = withContext<\"span\", RadioCardAddonProps>(\n  \"span\",\n  \"addon\",\n)()\n"],"mappings":";;;;;;;;;AA+DA,MAAM,EACJ,WACA,cAAc,uBACd,iBAAiB,0BACjB,aACA,cACA,0BACE,oBACF,cACA,cACF;;;;;;AAcA,MAAa,gBAAgB,cAC1B,EACC,OACA,UACA,aACA,kBACA,kBACA,OACA,gBAAgB,MAChB,YACA,kBACA,gBACA,YACA,YACA,WACA,GAAG,WACC;CACJ,MAAM,EAAE,mBAAmB,eAAe,iBAAiB,SAAS,IAAI;CACxE,MAAM,WAAW,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;EAErB,OACE,qBAAA,YAAA,EAAA,UAAA;GACG,QACC,oBAAC,gBAAD;IAAgB,GAAI;cAAa;GAAsB,CAAA,IACrD;GACH,cACC,oBAAC,sBAAD;IAAsB,GAAI;cACvB;GACmB,CAAA,IACpB;GACH,QACC,oBAAC,gBAAD;IAAgB,GAAI;cAAa;GAAsB,CAAA,IACrD;EACJ,EAAA,CAAA;CAEN,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,aAAa;GAAE,GAAG;GAAU,GAAG;EAAU,CAAC;YAA5D;GACE,oBAAC,OAAO,OAAR,EAAc,GAAI,cAAc,UAAU,EAAI,CAAA;GAC7C,gBACC,oBAAC,oBAAD,EAAoB,GAAI,kBAAkB,cAAc,EAAI,CAAA,IAC1D;GAEH;EACW;;AAElB,GACA,MACF,CAAC,CAAC;AAMF,MAAM,qBAAqB,YACzB,OACA,WACF,CAAC,CAAC,EAAE,kBAAkB,GAAG,CAAC;AAI1B,MAAa,iBAAiB,YAC5B,QACA,OACF,CAAC,CAAC;AAIF,MAAa,uBAAuB,YAGlC,QAAQ,aAAa,CAAC,CAAC;AAIzB,MAAa,iBAAiB,YAC5B,QACA,OACF,CAAC,CAAC"}
+{"version":3,"file":"radio-card.js","names":[],"sources":["../../../../src/components/radio-card/radio-card.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { UseRadioProps } from \"../radio\"\nimport type { RadioCardStyle } from \"./radio-card.style\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useInputBorder } from \"../input\"\nimport { useRadio } from \"../radio\"\nimport { radioCardStyle } from \"./radio-card.style\"\n\nexport interface RadioCardRootProps<Y extends string = string>\n  extends\n    Merge<HTMLStyledProps<\"label\">, UseRadioProps<Y>>,\n    ThemeProps<RadioCardStyle>,\n    UseInputBorderProps {\n  /**\n   * The addon of the radio card.\n   */\n  addon?: ReactNode\n  /**\n   * The description of the radio card.\n   */\n  description?: ReactNode\n  /**\n   * The label of the radio card.\n   */\n  label?: ReactNode\n  /**\n   * If `true`, the indicator will be displayed.\n   *\n   * @default true\n   */\n  withIndicator?: boolean\n  /**\n   * Props for the addon component.\n   */\n  addonProps?: RadioCardAddonProps\n  /**\n   * Props for the description component.\n   */\n  descriptionProps?: RadioCardDescriptionProps\n  /**\n   * Props for the indicator component.\n   */\n  indicatorProps?: RadioCardIndicatorProps\n  /**\n   * Props for the input element.\n   */\n  inputProps?: HTMLStyledProps<\"input\">\n  /**\n   * Props for the label component.\n   */\n  labelProps?: RadioCardLabelProps\n  /**\n   * Props for the label element.\n   */\n  rootProps?: HTMLStyledProps<\"label\">\n}\n\nconst {\n  component,\n  PropsContext: RadioCardPropsContext,\n  usePropsContext: useRadioCardPropsContext,\n  withContext,\n  withProvider,\n  useRootComponentProps,\n} = createSlotComponent<RadioCardRootProps, RadioCardStyle>(\n  \"radio-card\",\n  radioCardStyle,\n)\n\nexport {\n  component,\n  RadioCardPropsContext,\n  useRadioCardPropsContext,\n  useRootComponentProps,\n}\n\n/**\n * `RadioCard` is a component used for allowing users to select one option from multiple choices.\n *\n * @see https://yamada-ui.com/docs/components/radio-card\n */\nexport const RadioCardRoot = withProvider<\"label\", RadioCardRootProps>(\n  ({\n    addon,\n    children,\n    description,\n    errorBorderColor,\n    focusBorderColor,\n    label,\n    withIndicator = true,\n    addonProps,\n    descriptionProps,\n    indicatorProps,\n    inputProps,\n    labelProps,\n    rootProps,\n    ...rest\n  }) => {\n    const { getIndicatorProps, getInputProps, getRootProps } = useRadio(rest)\n    const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n    const computedChildren = useMemo(() => {\n      if (children) return children\n\n      return (\n        <>\n          {label ? (\n            <RadioCardLabel {...labelProps}>{label}</RadioCardLabel>\n          ) : null}\n          {description ? (\n            <RadioCardDescription {...descriptionProps}>\n              {description}\n            </RadioCardDescription>\n          ) : null}\n          {addon ? (\n            <RadioCardAddon {...addonProps}>{addon}</RadioCardAddon>\n          ) : null}\n        </>\n      )\n    }, [\n      addon,\n      addonProps,\n      children,\n      description,\n      descriptionProps,\n      label,\n      labelProps,\n    ])\n\n    return (\n      <styled.label {...getRootProps({ ...varProps, ...rootProps })}>\n        <styled.input {...getInputProps(inputProps)} />\n        {withIndicator ? (\n          <RadioCardIndicator {...getIndicatorProps(indicatorProps)} />\n        ) : null}\n\n        {computedChildren}\n      </styled.label>\n    )\n  },\n  \"root\",\n)() as GenericsComponent<{\n  <Y extends string = string>(props: RadioCardRootProps<Y>): ReactElement\n}>\n\ninterface RadioCardIndicatorProps extends HTMLStyledProps {}\n\nconst RadioCardIndicator = withContext<\"div\", RadioCardIndicatorProps>(\n  \"div\",\n  \"indicator\",\n)({ \"data-indicator\": \"\" })\n\nexport interface RadioCardLabelProps extends HTMLStyledProps {}\n\nexport const RadioCardLabel = withContext<\"span\", RadioCardLabelProps>(\n  \"span\",\n  \"label\",\n)()\n\nexport interface RadioCardDescriptionProps extends HTMLStyledProps {}\n\nexport const RadioCardDescription = withContext<\n  \"span\",\n  RadioCardDescriptionProps\n>(\"span\", \"description\")()\n\nexport interface RadioCardAddonProps extends HTMLStyledProps {}\n\nexport const RadioCardAddon = withContext<\"span\", RadioCardAddonProps>(\n  \"span\",\n  \"addon\",\n)()\n"],"mappings":";;;;;;;;;AA+DA,MAAM,EACJ,WACA,cAAc,uBACd,iBAAiB,0BACjB,aACA,cACA,0BACE,oBACF,cACA,cACF;;;;;;AAcA,MAAa,gBAAgB,cAC1B,EACC,OACA,UACA,aACA,kBACA,kBACA,OACA,gBAAgB,MAChB,YACA,kBACA,gBACA,YACA,YACA,WACA,GAAG,WACC;CACJ,MAAM,EAAE,mBAAmB,eAAe,iBAAiB,SAAS,IAAI;CACxE,MAAM,WAAW,eAAe;EAAE;EAAkB;CAAiB,CAAC;CACtE,MAAM,mBAAmB,cAAc;EACrC,IAAI,UAAU,OAAO;EAErB,OACE,qBAAA,YAAA,EAAA,UAAA;GACG,QACC,oBAAC,gBAAD;IAAgB,GAAI;IAAa,UAAA;GAAsB,CAAA,IACrD;GACH,cACC,oBAAC,sBAAD;IAAsB,GAAI;IACvB,UAAA;GACmB,CAAA,IACpB;GACH,QACC,oBAAC,gBAAD;IAAgB,GAAI;IAAa,UAAA;GAAsB,CAAA,IACrD;EACJ,EAAA,CAAA;CAEN,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,aAAa;GAAE,GAAG;GAAU,GAAG;EAAU,CAAC;EAA5D,UAAA;GACE,oBAAC,OAAO,OAAR,EAAc,GAAI,cAAc,UAAU,EAAI,CAAA;GAC7C,gBACC,oBAAC,oBAAD,EAAoB,GAAI,kBAAkB,cAAc,EAAI,CAAA,IAC1D;GAEH;EACW;;AAElB,GACA,MACF,CAAC,CAAC;AAMF,MAAM,qBAAqB,YACzB,OACA,WACF,CAAC,CAAC,EAAE,kBAAkB,GAAG,CAAC;AAI1B,MAAa,iBAAiB,YAC5B,QACA,OACF,CAAC,CAAC;AAIF,MAAa,uBAAuB,YAGlC,QAAQ,aAAa,CAAC,CAAC;AAIzB,MAAa,iBAAiB,YAC5B,QACA,OACF,CAAC,CAAC"}

package/dist/esm/components/rating/rating.js.map

@@ -1 +1 @@
-{"version":3,"file":"rating.js","names":[],"sources":["../../../../src/components/rating/rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { FunctionOrValue, Merge, ReactNodeOrFunction } from \"../../utils\"\nimport type { RatingStyle } from \"./rating.style\"\nimport type { UseRatingItemProps, UseRatingProps } from \"./use-rating\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled, varAttr } from \"../../core\"\nimport { runIfFn } from \"../../utils\"\nimport { StarIcon } from \"../icon\"\nimport { ratingStyle } from \"./rating.style\"\nimport {\n  RatingContext,\n  useRating,\n  useRatingContext,\n  useRatingItem,\n} from \"./use-rating\"\n\ninterface ComponentContext extends Pick<\n  RatingProps,\n  | \"color\"\n  | \"emptyIcon\"\n  | \"filledIcon\"\n  | \"groupProps\"\n  | \"iconProps\"\n  | \"inputProps\"\n  | \"itemProps\"\n> {}\n\nexport interface RatingProps\n  extends\n    Merge<Omit<HTMLStyledProps, \"children\" | \"color\">, UseRatingProps>,\n    ThemeProps<RatingStyle> {\n  /**\n   * The color of the filled icons.\n   */\n  color?: FunctionOrValue<number, CSSProps[\"color\"]>\n  /**\n   * The empty icon for the rating.\n   */\n  emptyIcon?: ReactNodeOrFunction<number>\n  /**\n   * The filled icon for the rating.\n   */\n  filledIcon?: ReactNodeOrFunction<number>\n  /**\n   * Props for the rating group.\n   */\n  groupProps?: FunctionOrValue<number, RatingGroupProps>\n  /**\n   * Props for the rating item.\n   */\n  iconProps?: FunctionOrValue<number, RatingIconProps>\n  /**\n   * Props for the input element.\n   */\n  inputProps?: FunctionOrValue<number, HTMLStyledProps<\"input\">>\n  /**\n   * Props for the rating item.\n   */\n  itemProps?: FunctionOrValue<number, RatingItemProps>\n}\n\nconst {\n  ComponentContext,\n  PropsContext: RatingPropsContext,\n  useComponentContext,\n  usePropsContext: useRatingPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<RatingProps, RatingStyle, ComponentContext>(\n  \"rating\",\n  ratingStyle,\n)\n\nexport { RatingPropsContext, useRatingPropsContext }\n\n/**\n * `Rating` is a component used to allow users to provide ratings.\n *\n * @see https://yamada-ui.com/docs/components/rating\n */\nexport const Rating = withProvider<\"div\", RatingProps>(\n  ({\n    color,\n    emptyIcon,\n    filledIcon,\n    groupProps,\n    iconProps,\n    inputProps,\n    itemProps,\n    ...rest\n  }) => {\n    const {\n      id,\n      name,\n      count,\n      decimal,\n      disabled,\n      displayValue,\n      fractions,\n      highlightSelectedOnly,\n      hoveredValue,\n      interactive,\n      outsideRef,\n      readOnly,\n      required,\n      roundedValue,\n      setHoveredValue,\n      setValue,\n      value,\n      ariaProps,\n      dataProps,\n      eventProps,\n      getRootProps,\n    } = useRating(rest)\n    const ratingContext = useMemo(\n      () => ({\n        id,\n        name,\n        count,\n        decimal,\n        disabled,\n        displayValue,\n        fractions,\n        highlightSelectedOnly,\n        hoveredValue,\n        interactive,\n        outsideRef,\n        readOnly,\n        required,\n        roundedValue,\n        setHoveredValue,\n        setValue,\n        value,\n        ariaProps,\n        dataProps,\n        eventProps,\n      }),\n      [\n        id,\n        name,\n        count,\n        decimal,\n        disabled,\n        fractions,\n        highlightSelectedOnly,\n        hoveredValue,\n        interactive,\n        displayValue,\n        outsideRef,\n        readOnly,\n        required,\n        roundedValue,\n        setHoveredValue,\n        setValue,\n        value,\n        ariaProps,\n        dataProps,\n        eventProps,\n      ],\n    )\n    const componentContext = useMemo(\n      () => ({\n        color,\n        emptyIcon,\n        filledIcon,\n        groupProps,\n        iconProps,\n        inputProps,\n        itemProps,\n      }),\n      [\n        color,\n        emptyIcon,\n        filledIcon,\n        groupProps,\n        iconProps,\n        inputProps,\n        itemProps,\n      ],\n    )\n\n    return (\n      <RatingContext value={ratingContext}>\n        <ComponentContext value={componentContext}>\n          <styled.div {...getRootProps()}>\n            {Array.from({ length: count }).map((_, index) => (\n              <RatingGroup key={index} value={index + 1} />\n            ))}\n          </styled.div>\n        </ComponentContext>\n      </RatingContext>\n    )\n  },\n  \"root\",\n)()\n\ninterface RatingGroupProps extends HTMLStyledProps {\n  value: number\n}\n\nconst RatingGroup = withContext<\"div\", RatingGroupProps>(\n  ({ value, ...rest }) => {\n    const { fractions } = useRatingContext()\n    const { groupProps } = useComponentContext()\n    const count = useMemo(\n      () => (value === 1 ? fractions + 1 : fractions),\n      [value, fractions],\n    )\n\n    return (\n      <styled.div {...mergeProps(rest, runIfFn(groupProps, value))()}>\n        {Array.from({ length: count }).map((_, index) => (\n          <RatingItem key={index} groupValue={value} index={index} />\n        ))}\n      </styled.div>\n    )\n  },\n  \"group\",\n)()\n\ninterface RatingItemProps\n  extends HTMLStyledProps<\"label\">, UseRatingItemProps {}\n\nconst RatingItem = withContext<\"label\", RatingItemProps>((props) => {\n  const {\n    active,\n    filled,\n    fractionValue,\n    groupValue,\n    getInputProps,\n    getLabelProps,\n  } = useRatingItem(props)\n  const {\n    emptyIcon = <StarIcon fill=\"currentColor\" strokeColor=\"currentColor\" />,\n    filledIcon = <StarIcon fill=\"currentColor\" strokeColor=\"currentColor\" />,\n    iconProps,\n    inputProps,\n    itemProps,\n  } = useComponentContext()\n  const clipPath =\n    fractionValue !== 1\n      ? `inset(0 ${active ? 100 - fractionValue * 100 : 100}% 0 0)`\n      : undefined\n\n  return (\n    <styled.label {...getLabelProps(runIfFn(itemProps, groupValue))}>\n      <styled.input {...getInputProps(runIfFn(inputProps, groupValue))} />\n\n      <RatingIcon\n        {...{ \"--clip-path\": clipPath }}\n        {...runIfFn(iconProps, groupValue)}\n      >\n        {filled\n          ? runIfFn(filledIcon, groupValue)\n          : runIfFn(emptyIcon, groupValue)}\n      </RatingIcon>\n    </styled.label>\n  )\n}, \"item\")(undefined, ({ groupValue, ...rest }) => {\n  const { color } = useComponentContext()\n\n  return {\n    \"--filled-color\": varAttr(runIfFn(color, groupValue), \"colors\"),\n    groupValue,\n    ...rest,\n  }\n})\n\ninterface RatingIconProps extends HTMLStyledProps {}\n\nconst RatingIcon = withContext<\"div\", RatingIconProps>(\"div\", \"icon\")()\n"],"mappings":";;;;;;;;;;;;AA+DA,MAAM,EACJ,kBACA,cAAc,oBACd,qBACA,iBAAiB,uBACjB,aACA,iBACE,oBACF,UACA,WACF;;;;;;AASA,MAAa,SAAS,cACnB,EACC,OACA,WACA,YACA,YACA,WACA,YACA,WACA,GAAG,WACC;CACJ,MAAM,EACJ,IACA,MACA,OACA,SACA,UACA,cACA,WACA,uBACA,cACA,aACA,YACA,UACA,UACA,cACA,iBACA,UACA,OACA,WACA,WACA,YACA,iBACE,UAAU,IAAI;CAClB,MAAM,gBAAgB,eACb;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CACA,MAAM,mBAAmB,eAChB;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,OACE,oBAAC,eAAD;EAAe,OAAO;YACpB,oBAAC,kBAAD;GAAkB,OAAO;aACvB,oBAAC,OAAO,KAAR;IAAY,GAAI,aAAa;cAC1B,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,oBAAC,aAAD,EAAyB,OAAO,QAAQ,EAAI,GAA1B,KAA0B,CAC7C;GACS,CAAA;EACI,CAAA;CACL,CAAA;AAEnB,GACA,MACF,CAAC,CAAC;AAMF,MAAM,cAAc,aACjB,EAAE,OAAO,GAAG,WAAW;CACtB,MAAM,EAAE,cAAc,iBAAiB;CACvC,MAAM,EAAE,eAAe,oBAAoB;CAC3C,MAAM,QAAQ,cACL,UAAU,IAAI,YAAY,IAAI,WACrC,CAAC,OAAO,SAAS,CACnB;CAEA,OACE,oBAAC,OAAO,KAAR;EAAY,GAAI,WAAW,OAAA,GAAA,cAAA,QAAA,CAAc,YAAY,KAAK,CAAC,CAAC,CAAC;YAC1D,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,oBAAC,YAAD;GAAwB,YAAY;GAAc;EAAQ,GAAzC,KAAyC,CAC3D;CACS,CAAA;AAEhB,GACA,OACF,CAAC,CAAC;AAKF,MAAM,aAAa,aAAuC,UAAU;CAClE,MAAM,EACJ,QACA,QACA,eACA,YACA,eACA,kBACE,cAAc,KAAK;CACvB,MAAM,EACJ,YAAY,oBAAC,UAAD;EAAU,MAAK;EAAe,aAAY;CAAgB,CAAA,GACtE,aAAa,oBAAC,UAAD;EAAU,MAAK;EAAe,aAAY;CAAgB,CAAA,GACvE,WACA,YACA,cACE,oBAAoB;CACxB,MAAM,WACJ,kBAAkB,IACd,WAAW,SAAS,MAAM,gBAAgB,MAAM,IAAI,UACpD,KAAA;CAEN,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,eAAA,GAAA,cAAA,QAAA,CAAsB,WAAW,UAAU,CAAC;YAA9D,CACE,oBAAC,OAAO,OAAR,EAAc,GAAI,eAAA,GAAA,cAAA,QAAA,CAAsB,YAAY,UAAU,CAAC,EAAI,CAAA,GAEnE,oBAAC,YAAD;GACQ,eAAe;GACrB,IAAA,GAAA,cAAA,QAAA,CAAY,WAAW,UAAU;aAEhC,UAAA,GAAA,cAAA,QAAA,CACW,YAAY,UAAU,KAAA,GAAA,cAAA,QAAA,CACtB,WAAW,UAAU;EACvB,CAAA,CACA;;AAElB,GAAG,MAAM,CAAC,CAAC,KAAA,IAAY,EAAE,YAAY,GAAG,WAAW;CACjD,MAAM,EAAE,UAAU,oBAAoB;CAEtC,OAAO;EACL,kBAAkB,SAAA,GAAA,cAAA,QAAA,CAAgB,OAAO,UAAU,GAAG,QAAQ;EAC9D;EACA,GAAG;CACL;AACF,CAAC;AAID,MAAM,aAAa,YAAoC,OAAO,MAAM,CAAC,CAAC"}
+{"version":3,"file":"rating.js","names":[],"sources":["../../../../src/components/rating/rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { FunctionOrValue, Merge, ReactNodeOrFunction } from \"../../utils\"\nimport type { RatingStyle } from \"./rating.style\"\nimport type { UseRatingItemProps, UseRatingProps } from \"./use-rating\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, mergeProps, styled, varAttr } from \"../../core\"\nimport { runIfFn } from \"../../utils\"\nimport { StarIcon } from \"../icon\"\nimport { ratingStyle } from \"./rating.style\"\nimport {\n  RatingContext,\n  useRating,\n  useRatingContext,\n  useRatingItem,\n} from \"./use-rating\"\n\ninterface ComponentContext extends Pick<\n  RatingProps,\n  | \"color\"\n  | \"emptyIcon\"\n  | \"filledIcon\"\n  | \"groupProps\"\n  | \"iconProps\"\n  | \"inputProps\"\n  | \"itemProps\"\n> {}\n\nexport interface RatingProps\n  extends\n    Merge<Omit<HTMLStyledProps, \"children\" | \"color\">, UseRatingProps>,\n    ThemeProps<RatingStyle> {\n  /**\n   * The color of the filled icons.\n   */\n  color?: FunctionOrValue<number, CSSProps[\"color\"]>\n  /**\n   * The empty icon for the rating.\n   */\n  emptyIcon?: ReactNodeOrFunction<number>\n  /**\n   * The filled icon for the rating.\n   */\n  filledIcon?: ReactNodeOrFunction<number>\n  /**\n   * Props for the rating group.\n   */\n  groupProps?: FunctionOrValue<number, RatingGroupProps>\n  /**\n   * Props for the rating item.\n   */\n  iconProps?: FunctionOrValue<number, RatingIconProps>\n  /**\n   * Props for the input element.\n   */\n  inputProps?: FunctionOrValue<number, HTMLStyledProps<\"input\">>\n  /**\n   * Props for the rating item.\n   */\n  itemProps?: FunctionOrValue<number, RatingItemProps>\n}\n\nconst {\n  ComponentContext,\n  PropsContext: RatingPropsContext,\n  useComponentContext,\n  usePropsContext: useRatingPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<RatingProps, RatingStyle, ComponentContext>(\n  \"rating\",\n  ratingStyle,\n)\n\nexport { RatingPropsContext, useRatingPropsContext }\n\n/**\n * `Rating` is a component used to allow users to provide ratings.\n *\n * @see https://yamada-ui.com/docs/components/rating\n */\nexport const Rating = withProvider<\"div\", RatingProps>(\n  ({\n    color,\n    emptyIcon,\n    filledIcon,\n    groupProps,\n    iconProps,\n    inputProps,\n    itemProps,\n    ...rest\n  }) => {\n    const {\n      id,\n      name,\n      count,\n      decimal,\n      disabled,\n      displayValue,\n      fractions,\n      highlightSelectedOnly,\n      hoveredValue,\n      interactive,\n      outsideRef,\n      readOnly,\n      required,\n      roundedValue,\n      setHoveredValue,\n      setValue,\n      value,\n      ariaProps,\n      dataProps,\n      eventProps,\n      getRootProps,\n    } = useRating(rest)\n    const ratingContext = useMemo(\n      () => ({\n        id,\n        name,\n        count,\n        decimal,\n        disabled,\n        displayValue,\n        fractions,\n        highlightSelectedOnly,\n        hoveredValue,\n        interactive,\n        outsideRef,\n        readOnly,\n        required,\n        roundedValue,\n        setHoveredValue,\n        setValue,\n        value,\n        ariaProps,\n        dataProps,\n        eventProps,\n      }),\n      [\n        id,\n        name,\n        count,\n        decimal,\n        disabled,\n        fractions,\n        highlightSelectedOnly,\n        hoveredValue,\n        interactive,\n        displayValue,\n        outsideRef,\n        readOnly,\n        required,\n        roundedValue,\n        setHoveredValue,\n        setValue,\n        value,\n        ariaProps,\n        dataProps,\n        eventProps,\n      ],\n    )\n    const componentContext = useMemo(\n      () => ({\n        color,\n        emptyIcon,\n        filledIcon,\n        groupProps,\n        iconProps,\n        inputProps,\n        itemProps,\n      }),\n      [\n        color,\n        emptyIcon,\n        filledIcon,\n        groupProps,\n        iconProps,\n        inputProps,\n        itemProps,\n      ],\n    )\n\n    return (\n      <RatingContext value={ratingContext}>\n        <ComponentContext value={componentContext}>\n          <styled.div {...getRootProps()}>\n            {Array.from({ length: count }).map((_, index) => (\n              <RatingGroup key={index} value={index + 1} />\n            ))}\n          </styled.div>\n        </ComponentContext>\n      </RatingContext>\n    )\n  },\n  \"root\",\n)()\n\ninterface RatingGroupProps extends HTMLStyledProps {\n  value: number\n}\n\nconst RatingGroup = withContext<\"div\", RatingGroupProps>(\n  ({ value, ...rest }) => {\n    const { fractions } = useRatingContext()\n    const { groupProps } = useComponentContext()\n    const count = useMemo(\n      () => (value === 1 ? fractions + 1 : fractions),\n      [value, fractions],\n    )\n\n    return (\n      <styled.div {...mergeProps(rest, runIfFn(groupProps, value))()}>\n        {Array.from({ length: count }).map((_, index) => (\n          <RatingItem key={index} groupValue={value} index={index} />\n        ))}\n      </styled.div>\n    )\n  },\n  \"group\",\n)()\n\ninterface RatingItemProps\n  extends HTMLStyledProps<\"label\">, UseRatingItemProps {}\n\nconst RatingItem = withContext<\"label\", RatingItemProps>((props) => {\n  const {\n    active,\n    filled,\n    fractionValue,\n    groupValue,\n    getInputProps,\n    getLabelProps,\n  } = useRatingItem(props)\n  const {\n    emptyIcon = <StarIcon fill=\"currentColor\" strokeColor=\"currentColor\" />,\n    filledIcon = <StarIcon fill=\"currentColor\" strokeColor=\"currentColor\" />,\n    iconProps,\n    inputProps,\n    itemProps,\n  } = useComponentContext()\n  const clipPath =\n    fractionValue !== 1\n      ? `inset(0 ${active ? 100 - fractionValue * 100 : 100}% 0 0)`\n      : undefined\n\n  return (\n    <styled.label {...getLabelProps(runIfFn(itemProps, groupValue))}>\n      <styled.input {...getInputProps(runIfFn(inputProps, groupValue))} />\n\n      <RatingIcon\n        {...{ \"--clip-path\": clipPath }}\n        {...runIfFn(iconProps, groupValue)}\n      >\n        {filled\n          ? runIfFn(filledIcon, groupValue)\n          : runIfFn(emptyIcon, groupValue)}\n      </RatingIcon>\n    </styled.label>\n  )\n}, \"item\")(undefined, ({ groupValue, ...rest }) => {\n  const { color } = useComponentContext()\n\n  return {\n    \"--filled-color\": varAttr(runIfFn(color, groupValue), \"colors\"),\n    groupValue,\n    ...rest,\n  }\n})\n\ninterface RatingIconProps extends HTMLStyledProps {}\n\nconst RatingIcon = withContext<\"div\", RatingIconProps>(\"div\", \"icon\")()\n"],"mappings":";;;;;;;;;;;;AA+DA,MAAM,EACJ,kBACA,cAAc,oBACd,qBACA,iBAAiB,uBACjB,aACA,iBACE,oBACF,UACA,WACF;;;;;;AASA,MAAa,SAAS,cACnB,EACC,OACA,WACA,YACA,YACA,WACA,YACA,WACA,GAAG,WACC;CACJ,MAAM,EACJ,IACA,MACA,OACA,SACA,UACA,cACA,WACA,uBACA,cACA,aACA,YACA,UACA,UACA,cACA,iBACA,UACA,OACA,WACA,WACA,YACA,iBACE,UAAU,IAAI;CAClB,MAAM,gBAAgB,eACb;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CACA,MAAM,mBAAmB,eAChB;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,OACE,oBAAC,eAAD;EAAe,OAAO;EACpB,UAAA,oBAAC,kBAAD;GAAkB,OAAO;GACvB,UAAA,oBAAC,OAAO,KAAR;IAAY,GAAI,aAAa;IAC1B,UAAA,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,oBAAC,aAAD,EAAyB,OAAO,QAAQ,EAAI,GAA1B,KAA0B,CAC7C;GACS,CAAA;EACI,CAAA;CACL,CAAA;AAEnB,GACA,MACF,CAAC,CAAC;AAMF,MAAM,cAAc,aACjB,EAAE,OAAO,GAAG,WAAW;CACtB,MAAM,EAAE,cAAc,iBAAiB;CACvC,MAAM,EAAE,eAAe,oBAAoB;CAC3C,MAAM,QAAQ,cACL,UAAU,IAAI,YAAY,IAAI,WACrC,CAAC,OAAO,SAAS,CACnB;CAEA,OACE,oBAAC,OAAO,KAAR;EAAY,GAAI,WAAW,OAAA,GAAA,cAAA,QAAA,CAAc,YAAY,KAAK,CAAC,CAAC,CAAC;EAC1D,UAAA,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,oBAAC,YAAD;GAAwB,YAAY;GAAc;EAAQ,GAAzC,KAAyC,CAC3D;CACS,CAAA;AAEhB,GACA,OACF,CAAC,CAAC;AAKF,MAAM,aAAa,aAAuC,UAAU;CAClE,MAAM,EACJ,QACA,QACA,eACA,YACA,eACA,kBACE,cAAc,KAAK;CACvB,MAAM,EACJ,YAAY,oBAAC,UAAD;EAAU,MAAK;EAAe,aAAY;CAAgB,CAAA,GACtE,aAAa,oBAAC,UAAD;EAAU,MAAK;EAAe,aAAY;CAAgB,CAAA,GACvE,WACA,YACA,cACE,oBAAoB;CACxB,MAAM,WACJ,kBAAkB,IACd,WAAW,SAAS,MAAM,gBAAgB,MAAM,IAAI,UACpD,KAAA;CAEN,OACE,qBAAC,OAAO,OAAR;EAAc,GAAI,eAAA,GAAA,cAAA,QAAA,CAAsB,WAAW,UAAU,CAAC;EAA9D,UAAA,CACE,oBAAC,OAAO,OAAR,EAAc,GAAI,eAAA,GAAA,cAAA,QAAA,CAAsB,YAAY,UAAU,CAAC,EAAI,CAAA,GAEnE,oBAAC,YAAD;GACQ,eAAe;GACrB,IAAA,GAAA,cAAA,QAAA,CAAY,WAAW,UAAU;GAEhC,UAAA,UAAA,GAAA,cAAA,QAAA,CACW,YAAY,UAAU,KAAA,GAAA,cAAA,QAAA,CACtB,WAAW,UAAU;EACvB,CAAA,CACA;;AAElB,GAAG,MAAM,CAAC,CAAC,KAAA,IAAY,EAAE,YAAY,GAAG,WAAW;CACjD,MAAM,EAAE,UAAU,oBAAoB;CAEtC,OAAO;EACL,kBAAkB,SAAA,GAAA,cAAA,QAAA,CAAgB,OAAO,UAAU,GAAG,QAAQ;EAC9D;EACA,GAAG;CACL;AACF,CAAC;AAID,MAAM,aAAa,YAAoC,OAAO,MAAM,CAAC,CAAC"}

package/dist/esm/components/reorder/reorder.js.map

@@ -1 +1 @@
-{"version":3,"file":"reorder.js","names":["OriginalReorder"],"sources":["../../../../src/components/reorder/reorder.tsx"],"sourcesContent":["\"use client\"\n\nimport type { PropsWithChildren, ReactElement } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { ReorderStyle } from \"./reorder.style\"\nimport type { UseReorderItemProps, UseReorderProps } from \"./use-reorder\"\nimport { Reorder as OriginalReorder } from \"motion/react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { GripVerticalIcon } from \"../icon\"\nimport { reorderStyle } from \"./reorder.style\"\nimport {\n  ReorderContext,\n  ReorderItemContext,\n  useReorder,\n  useReorderItem,\n  useReorderItemContext,\n} from \"./use-reorder\"\n\nexport interface ReorderItem<Y = string> extends ReorderItemProps<Y> {}\n\nexport interface ReorderRootProps<Y = string>\n  extends\n    Merge<\n      HTMLMotionProps<\"ul\">,\n      Omit<UseReorderProps<Y>, \"item\" | \"items\" | \"orientation\">\n    >,\n    ThemeProps<ReorderStyle> {\n  /**\n   * If provided, generate reorder items based on items.\n   *\n   */\n  items?: ReorderItem<Y>[]\n}\n\nconst {\n  PropsContext: ReorderPropsContext,\n  usePropsContext: useReorderPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<ReorderRootProps, ReorderStyle>(\"reorder\", reorderStyle)\n\nexport { ReorderPropsContext, useReorderPropsContext }\n\n/**\n * `Reorder` is a component that allows you to change the order of items using drag and drop.\n *\n * @see https://yamada-ui.com/docs/components/reorder\n */\nexport const ReorderRoot = withProvider<\"ul\", ReorderRootProps>(\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint\n  <Y extends any = string>({\n    orientation: orientationProp,\n    ...rest\n  }: ReorderRootProps<Y>) => {\n    const orientation = useValue(orientationProp)\n    const { children, getRootProps } = useReorder({\n      ...rest,\n      item: <ReorderItem />,\n      orientation,\n    })\n\n    return (\n      <ReorderContext value={{ orientation }}>\n        <styled.ul\n          as={OriginalReorder.Group<Y[]>}\n          {...(getRootProps() as HTMLStyledProps<\"ul\">)}\n        >\n          {children}\n        </styled.ul>\n      </ReorderContext>\n    )\n  },\n  \"root\",\n  { transferProps: [\"orientation\"] },\n)() as GenericsComponent<{\n  <Y = string>(props: ReorderRootProps<Y>): ReactElement\n}>\n\nexport interface ReorderItemProps<Y = string>\n  extends\n    Omit<Merge<HTMLMotionProps<\"li\">, UseReorderItemProps<Y>>, \"children\">,\n    PropsWithChildren {}\n\nexport const ReorderItem = withContext<\"li\", ReorderItemProps>(\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint\n  <Y extends any = string>(props: ReorderItemProps<Y>) => {\n    const { getItemProps, getTriggerProps } = useReorderItem(props)\n\n    return (\n      <ReorderItemContext value={{ getTriggerProps }}>\n        <styled.li\n          as={OriginalReorder.Item<Y>}\n          {...(getItemProps() as HTMLStyledProps<\"li\">)}\n        />\n      </ReorderItemContext>\n    )\n  },\n  \"item\",\n)() as GenericsComponent<{\n  <Y = string>(props: ReorderItemProps<Y>): ReactElement\n}>\n\nexport interface ReorderTriggerProps extends HTMLStyledProps {}\n\nexport const ReorderTrigger = withContext<\"div\", ReorderTriggerProps>(\n  \"div\",\n  \"trigger\",\n)(undefined, (props) => {\n  const { getTriggerProps } = useReorderItemContext()\n\n  return { children: <GripVerticalIcon />, ...getTriggerProps(props) }\n})\n"],"mappings":";;;;;;;;;;AAqCA,MAAM,EACJ,cAAc,qBACd,iBAAiB,wBACjB,aACA,iBACE,oBAAoD,WAAW,YAAY;;;;;;AAS/E,MAAa,cAAc,cAEA,EACvB,aAAa,iBACb,GAAG,WACsB;CACzB,MAAM,cAAc,SAAS,eAAe;CAC5C,MAAM,EAAE,UAAU,iBAAiB,WAAW;EAC5C,GAAG;EACH,MAAM,oBAAC,aAAD,CAAc,CAAA;EACpB;CACF,CAAC;CAED,OACE,oBAAC,gBAAD;EAAgB,OAAO,EAAE,YAAY;YACnC,oBAAC,OAAO,IAAR;GACE,IAAIA,QAAgB;GACpB,GAAK,aAAa;GAEjB;EACQ,CAAA;CACG,CAAA;AAEpB,GACA,QACA,EAAE,eAAe,CAAC,aAAa,EAAE,CACnC,CAAC,CAAC;AASF,MAAa,cAAc,aAEA,UAA+B;CACtD,MAAM,EAAE,cAAc,oBAAoB,eAAe,KAAK;CAE9D,OACE,oBAAC,oBAAD;EAAoB,OAAO,EAAE,gBAAgB;YAC3C,oBAAC,OAAO,IAAR;GACE,IAAIA,QAAgB;GACpB,GAAK,aAAa;EACnB,CAAA;CACiB,CAAA;AAExB,GACA,MACF,CAAC,CAAC;AAMF,MAAa,iBAAiB,YAC5B,OACA,SACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,sBAAsB;CAElD,OAAO;EAAE,UAAU,oBAAC,kBAAD,CAAmB,CAAA;EAAG,GAAG,gBAAgB,KAAK;CAAE;AACrE,CAAC"}
+{"version":3,"file":"reorder.js","names":["OriginalReorder"],"sources":["../../../../src/components/reorder/reorder.tsx"],"sourcesContent":["\"use client\"\n\nimport type { PropsWithChildren, ReactElement } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { ReorderStyle } from \"./reorder.style\"\nimport type { UseReorderItemProps, UseReorderProps } from \"./use-reorder\"\nimport { Reorder as OriginalReorder } from \"motion/react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { GripVerticalIcon } from \"../icon\"\nimport { reorderStyle } from \"./reorder.style\"\nimport {\n  ReorderContext,\n  ReorderItemContext,\n  useReorder,\n  useReorderItem,\n  useReorderItemContext,\n} from \"./use-reorder\"\n\nexport interface ReorderItem<Y = string> extends ReorderItemProps<Y> {}\n\nexport interface ReorderRootProps<Y = string>\n  extends\n    Merge<\n      HTMLMotionProps<\"ul\">,\n      Omit<UseReorderProps<Y>, \"item\" | \"items\" | \"orientation\">\n    >,\n    ThemeProps<ReorderStyle> {\n  /**\n   * If provided, generate reorder items based on items.\n   *\n   */\n  items?: ReorderItem<Y>[]\n}\n\nconst {\n  PropsContext: ReorderPropsContext,\n  usePropsContext: useReorderPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<ReorderRootProps, ReorderStyle>(\"reorder\", reorderStyle)\n\nexport { ReorderPropsContext, useReorderPropsContext }\n\n/**\n * `Reorder` is a component that allows you to change the order of items using drag and drop.\n *\n * @see https://yamada-ui.com/docs/components/reorder\n */\nexport const ReorderRoot = withProvider<\"ul\", ReorderRootProps>(\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint\n  <Y extends any = string>({\n    orientation: orientationProp,\n    ...rest\n  }: ReorderRootProps<Y>) => {\n    const orientation = useValue(orientationProp)\n    const { children, getRootProps } = useReorder({\n      ...rest,\n      item: <ReorderItem />,\n      orientation,\n    })\n\n    return (\n      <ReorderContext value={{ orientation }}>\n        <styled.ul\n          as={OriginalReorder.Group<Y[]>}\n          {...(getRootProps() as HTMLStyledProps<\"ul\">)}\n        >\n          {children}\n        </styled.ul>\n      </ReorderContext>\n    )\n  },\n  \"root\",\n  { transferProps: [\"orientation\"] },\n)() as GenericsComponent<{\n  <Y = string>(props: ReorderRootProps<Y>): ReactElement\n}>\n\nexport interface ReorderItemProps<Y = string>\n  extends\n    Omit<Merge<HTMLMotionProps<\"li\">, UseReorderItemProps<Y>>, \"children\">,\n    PropsWithChildren {}\n\nexport const ReorderItem = withContext<\"li\", ReorderItemProps>(\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint\n  <Y extends any = string>(props: ReorderItemProps<Y>) => {\n    const { getItemProps, getTriggerProps } = useReorderItem(props)\n\n    return (\n      <ReorderItemContext value={{ getTriggerProps }}>\n        <styled.li\n          as={OriginalReorder.Item<Y>}\n          {...(getItemProps() as HTMLStyledProps<\"li\">)}\n        />\n      </ReorderItemContext>\n    )\n  },\n  \"item\",\n)() as GenericsComponent<{\n  <Y = string>(props: ReorderItemProps<Y>): ReactElement\n}>\n\nexport interface ReorderTriggerProps extends HTMLStyledProps {}\n\nexport const ReorderTrigger = withContext<\"div\", ReorderTriggerProps>(\n  \"div\",\n  \"trigger\",\n)(undefined, (props) => {\n  const { getTriggerProps } = useReorderItemContext()\n\n  return { children: <GripVerticalIcon />, ...getTriggerProps(props) }\n})\n"],"mappings":";;;;;;;;;;AAqCA,MAAM,EACJ,cAAc,qBACd,iBAAiB,wBACjB,aACA,iBACE,oBAAoD,WAAW,YAAY;;;;;;AAS/E,MAAa,cAAc,cAEA,EACvB,aAAa,iBACb,GAAG,WACsB;CACzB,MAAM,cAAc,SAAS,eAAe;CAC5C,MAAM,EAAE,UAAU,iBAAiB,WAAW;EAC5C,GAAG;EACH,MAAM,oBAAC,aAAD,CAAc,CAAA;EACpB;CACF,CAAC;CAED,OACE,oBAAC,gBAAD;EAAgB,OAAO,EAAE,YAAY;EACnC,UAAA,oBAAC,OAAO,IAAR;GACE,IAAIA,QAAgB;GACpB,GAAK,aAAa;GAEjB;EACQ,CAAA;CACG,CAAA;AAEpB,GACA,QACA,EAAE,eAAe,CAAC,aAAa,EAAE,CACnC,CAAC,CAAC;AASF,MAAa,cAAc,aAEA,UAA+B;CACtD,MAAM,EAAE,cAAc,oBAAoB,eAAe,KAAK;CAE9D,OACE,oBAAC,oBAAD;EAAoB,OAAO,EAAE,gBAAgB;EAC3C,UAAA,oBAAC,OAAO,IAAR;GACE,IAAIA,QAAgB;GACpB,GAAK,aAAa;EACnB,CAAA;CACiB,CAAA;AAExB,GACA,MACF,CAAC,CAAC;AAMF,MAAa,iBAAiB,YAC5B,OACA,SACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,oBAAoB,sBAAsB;CAElD,OAAO;EAAE,UAAU,oBAAC,kBAAD,CAAmB,CAAA;EAAG,GAAG,gBAAgB,KAAK;CAAE;AACrE,CAAC"}

package/dist/esm/components/resizable/resizable.js.map

@@ -1 +1 @@
-{"version":3,"file":"resizable.js","names":[],"sources":["../../../../src/components/resizable/resizable.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type {\n  HTMLStyledProps,\n  HTMLStyledPropsWithoutAs,\n  ThemeProps,\n} from \"../../core\"\nimport type { ResizableStyle } from \"./resizable.style\"\nimport type {\n  UseResizableItemProps,\n  UseResizableProps,\n  UseResizableTriggerProps,\n} from \"./use-resizable\"\nimport { useMemo } from \"react\"\nimport { Group, Panel, Separator } from \"react-resizable-panels\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { resizableStyle } from \"./resizable.style\"\nimport {\n  ResizableContext,\n  useResizable,\n  useResizableItem,\n  useResizableTrigger,\n} from \"./use-resizable\"\n\n/**\n * `Resizable` is accessible resizable panel groups and layouts with keyboard support.\n *\n * @see https://yamada-ui.com/docs/components/resizable\n */\nexport interface ResizableRootProps\n  extends\n    HTMLStyledProps,\n    ThemeProps<ResizableStyle>,\n    Omit<UseResizableProps, \"orientation\"> {}\n\nconst {\n  PropsContext: ResizablePropsContext,\n  usePropsContext: useResizablePropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<ResizableRootProps, ResizableStyle>(\n  \"resizable\",\n  resizableStyle,\n)\n\nexport { ResizablePropsContext, useResizablePropsContext }\n\nexport const ResizableRoot = withProvider<\n  \"div\",\n  ResizableRootProps,\n  \"orientation\"\n>(\n  ({ children, orientation: orientationProp, ...rest }) => {\n    const computedOrientation = useValue(orientationProp)\n    const { disabled, groupRef, orientation, getRootProps } = useResizable({\n      orientation: computedOrientation,\n      ...rest,\n    })\n\n    const context = useMemo(\n      () => ({ disabled, groupRef, orientation }),\n      [disabled, orientation, groupRef],\n    )\n\n    return (\n      <ResizableContext value={context}>\n        <styled.div as={Group} {...getRootProps()}>\n          {children}\n        </styled.div>\n      </ResizableContext>\n    )\n  },\n  \"root\",\n  { transferProps: [\"orientation\"] },\n)()\n\nexport interface ResizableItemProps\n  extends HTMLStyledPropsWithoutAs, UseResizableItemProps {}\n\nexport const ResizableItem = withContext<\"div\", ResizableItemProps>((props) => {\n  const { getItemProps } = useResizableItem(props)\n\n  return <styled.div as={Panel} {...getItemProps()} />\n}, \"item\")()\n\nexport interface ResizableTriggerProps\n  extends HTMLStyledPropsWithoutAs, UseResizableTriggerProps {\n  /**\n   * The resizable trigger icon to use.\n   */\n  icon?: ReactElement\n  /**\n   * Props for resizable trigger icon component.\n   */\n  iconProps?: HTMLStyledProps\n}\n\nexport const ResizableTrigger = withContext<\"div\", ResizableTriggerProps>(\n  ({ children, icon, iconProps, ...rest }) => {\n    const { getIconProps, getTriggerProps } = useResizableTrigger(rest)\n\n    return (\n      <styled.div as={Separator} {...getTriggerProps()}>\n        {icon ? (\n          <ResizableIcon {...getIconProps(iconProps)}>{icon}</ResizableIcon>\n        ) : null}\n\n        {children}\n      </styled.div>\n    )\n  },\n  \"trigger\",\n)()\n\ninterface ResizableIconProps extends HTMLStyledProps {}\n\nconst ResizableIcon = withContext<\"div\", ResizableIconProps>(\"div\", \"icon\")()\n"],"mappings":";;;;;;;;;;AAqCA,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,aACA,iBACE,oBACF,aACA,cACF;AAIA,MAAa,gBAAgB,cAK1B,EAAE,UAAU,aAAa,iBAAiB,GAAG,WAAW;CAEvD,MAAM,EAAE,UAAU,UAAU,aAAa,iBAAiB,aAAa;EACrE,aAF0B,SAAS,eAEJ;EAC/B,GAAG;CACL,CAAC;CAOD,OACE,oBAAC,kBAAD;EAAkB,OANJ,eACP;GAAE;GAAU;GAAU;EAAY,IACzC;GAAC;GAAU;GAAa;EAAQ,CAID;YAC7B,oBAAC,OAAO,KAAR;GAAY,IAAI;GAAO,GAAI,aAAa;GACrC;EACS,CAAA;CACI,CAAA;AAEtB,GACA,QACA,EAAE,eAAe,CAAC,aAAa,EAAE,CACnC,CAAC,CAAC;AAKF,MAAa,gBAAgB,aAAwC,UAAU;CAC7E,MAAM,EAAE,iBAAiB,iBAAiB,KAAK;CAE/C,OAAO,oBAAC,OAAO,KAAR;EAAY,IAAI;EAAO,GAAI,aAAa;CAAI,CAAA;AACrD,GAAG,MAAM,CAAC,CAAC;AAcX,MAAa,mBAAmB,aAC7B,EAAE,UAAU,MAAM,WAAW,GAAG,WAAW;CAC1C,MAAM,EAAE,cAAc,oBAAoB,oBAAoB,IAAI;CAElE,OACE,qBAAC,OAAO,KAAR;EAAY,IAAI;EAAW,GAAI,gBAAgB;YAA/C,CACG,OACC,oBAAC,eAAD;GAAe,GAAI,aAAa,SAAS;aAAI;EAAoB,CAAA,IAC/D,MAEH,QACS;;AAEhB,GACA,SACF,CAAC,CAAC;AAIF,MAAM,gBAAgB,YAAuC,OAAO,MAAM,CAAC,CAAC"}
+{"version":3,"file":"resizable.js","names":[],"sources":["../../../../src/components/resizable/resizable.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement } from \"react\"\nimport type {\n  HTMLStyledProps,\n  HTMLStyledPropsWithoutAs,\n  ThemeProps,\n} from \"../../core\"\nimport type { ResizableStyle } from \"./resizable.style\"\nimport type {\n  UseResizableItemProps,\n  UseResizableProps,\n  UseResizableTriggerProps,\n} from \"./use-resizable\"\nimport { useMemo } from \"react\"\nimport { Group, Panel, Separator } from \"react-resizable-panels\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useValue } from \"../../hooks/use-value\"\nimport { resizableStyle } from \"./resizable.style\"\nimport {\n  ResizableContext,\n  useResizable,\n  useResizableItem,\n  useResizableTrigger,\n} from \"./use-resizable\"\n\n/**\n * `Resizable` is accessible resizable panel groups and layouts with keyboard support.\n *\n * @see https://yamada-ui.com/docs/components/resizable\n */\nexport interface ResizableRootProps\n  extends\n    HTMLStyledProps,\n    ThemeProps<ResizableStyle>,\n    Omit<UseResizableProps, \"orientation\"> {}\n\nconst {\n  PropsContext: ResizablePropsContext,\n  usePropsContext: useResizablePropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<ResizableRootProps, ResizableStyle>(\n  \"resizable\",\n  resizableStyle,\n)\n\nexport { ResizablePropsContext, useResizablePropsContext }\n\nexport const ResizableRoot = withProvider<\n  \"div\",\n  ResizableRootProps,\n  \"orientation\"\n>(\n  ({ children, orientation: orientationProp, ...rest }) => {\n    const computedOrientation = useValue(orientationProp)\n    const { disabled, groupRef, orientation, getRootProps } = useResizable({\n      orientation: computedOrientation,\n      ...rest,\n    })\n\n    const context = useMemo(\n      () => ({ disabled, groupRef, orientation }),\n      [disabled, orientation, groupRef],\n    )\n\n    return (\n      <ResizableContext value={context}>\n        <styled.div as={Group} {...getRootProps()}>\n          {children}\n        </styled.div>\n      </ResizableContext>\n    )\n  },\n  \"root\",\n  { transferProps: [\"orientation\"] },\n)()\n\nexport interface ResizableItemProps\n  extends HTMLStyledPropsWithoutAs, UseResizableItemProps {}\n\nexport const ResizableItem = withContext<\"div\", ResizableItemProps>((props) => {\n  const { getItemProps } = useResizableItem(props)\n\n  return <styled.div as={Panel} {...getItemProps()} />\n}, \"item\")()\n\nexport interface ResizableTriggerProps\n  extends HTMLStyledPropsWithoutAs, UseResizableTriggerProps {\n  /**\n   * The resizable trigger icon to use.\n   */\n  icon?: ReactElement\n  /**\n   * Props for resizable trigger icon component.\n   */\n  iconProps?: HTMLStyledProps\n}\n\nexport const ResizableTrigger = withContext<\"div\", ResizableTriggerProps>(\n  ({ children, icon, iconProps, ...rest }) => {\n    const { getIconProps, getTriggerProps } = useResizableTrigger(rest)\n\n    return (\n      <styled.div as={Separator} {...getTriggerProps()}>\n        {icon ? (\n          <ResizableIcon {...getIconProps(iconProps)}>{icon}</ResizableIcon>\n        ) : null}\n\n        {children}\n      </styled.div>\n    )\n  },\n  \"trigger\",\n)()\n\ninterface ResizableIconProps extends HTMLStyledProps {}\n\nconst ResizableIcon = withContext<\"div\", ResizableIconProps>(\"div\", \"icon\")()\n"],"mappings":";;;;;;;;;;AAqCA,MAAM,EACJ,cAAc,uBACd,iBAAiB,0BACjB,aACA,iBACE,oBACF,aACA,cACF;AAIA,MAAa,gBAAgB,cAK1B,EAAE,UAAU,aAAa,iBAAiB,GAAG,WAAW;CAEvD,MAAM,EAAE,UAAU,UAAU,aAAa,iBAAiB,aAAa;EACrE,aAF0B,SAAS,eAEJ;EAC/B,GAAG;CACL,CAAC;CAOD,OACE,oBAAC,kBAAD;EAAkB,OANJ,eACP;GAAE;GAAU;GAAU;EAAY,IACzC;GAAC;GAAU;GAAa;EAAQ,CAID;EAC7B,UAAA,oBAAC,OAAO,KAAR;GAAY,IAAI;GAAO,GAAI,aAAa;GACrC;EACS,CAAA;CACI,CAAA;AAEtB,GACA,QACA,EAAE,eAAe,CAAC,aAAa,EAAE,CACnC,CAAC,CAAC;AAKF,MAAa,gBAAgB,aAAwC,UAAU;CAC7E,MAAM,EAAE,iBAAiB,iBAAiB,KAAK;CAE/C,OAAO,oBAAC,OAAO,KAAR;EAAY,IAAI;EAAO,GAAI,aAAa;CAAI,CAAA;AACrD,GAAG,MAAM,CAAC,CAAC;AAcX,MAAa,mBAAmB,aAC7B,EAAE,UAAU,MAAM,WAAW,GAAG,WAAW;CAC1C,MAAM,EAAE,cAAc,oBAAoB,oBAAoB,IAAI;CAElE,OACE,qBAAC,OAAO,KAAR;EAAY,IAAI;EAAW,GAAI,gBAAgB;EAA/C,UAAA,CACG,OACC,oBAAC,eAAD;GAAe,GAAI,aAAa,SAAS;GAAI,UAAA;EAAoB,CAAA,IAC/D,MAEH,QACS;;AAEhB,GACA,SACF,CAAC,CAAC;AAIF,MAAM,gBAAgB,YAAuC,OAAO,MAAM,CAAC,CAAC"}

package/dist/esm/components/ripple/ripple.js.map

@@ -1 +1 @@
-{"version":3,"file":"ripple.js","names":["motion"],"sources":["../../../../src/components/ripple/ripple.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Key } from \"react\"\nimport type { ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { RippleStyle } from \"./ripple.style\"\nimport type { RippleOptions } from \"./use-ripple\"\nimport { AnimatePresence } from \"motion/react\"\nimport { createComponent } from \"../../core\"\nimport { handlerAll } from \"../../utils\"\nimport { motion } from \"../motion\"\nimport { rippleStyle } from \"./ripple.style\"\n\nconst clamp = (value: number, min: number, max: number) =>\n  Math.min(Math.max(value, min), max)\n\nexport interface RippleProps\n  extends HTMLMotionProps<\"span\">, ThemeProps<RippleStyle> {\n  /**\n   * The ripples to use.\n   */\n  ripples: RippleOptions[]\n  /**\n   * The callback invoked when a ripple is cleared.\n   */\n  onClear: (key: Key) => void\n  /**\n   * If `true`, disable ripple effects when pressing a element.\n   *\n   * @default false\n   */\n  disabled?: boolean\n}\n\nconst {\n  PropsContext: RipplePropsContext,\n  usePropsContext: useRipplePropsContext,\n  withContext,\n} = createComponent<RippleProps, RippleStyle>(\"ripple\", rippleStyle)\n\nexport { RipplePropsContext, useRipplePropsContext }\n\n/**\n * `Ripple` is a component that adds a ripple effect to elements, allowing users to recognize when they have clicked.\n *\n * @see https://yamada-ui.com/docs/components/ripple\n */\nexport const Ripple = withContext<\"span\", RippleProps>(\n  ({\n    style,\n    color = \"currentColor\",\n    disabled,\n    ripples,\n    onAnimationComplete,\n    onClear,\n    ...rest\n  }) => {\n    if (disabled) return null\n\n    return (\n      <>\n        {ripples.map(({ key, size, x, y }) => {\n          const duration = clamp(0.01 * size, 0.2, size > 100 ? 0.75 : 0.5)\n\n          return (\n            <AnimatePresence key={key} mode=\"popLayout\">\n              <motion.span\n                style={{\n                  height: `${size}px`,\n                  left: x,\n                  pointerEvents: \"none\",\n                  position: \"absolute\",\n                  top: y,\n                  transformOrigin: \"center\",\n                  width: `${size}px`,\n                  ...style,\n                }}\n                animate={{ opacity: 0, transform: \"scale(2)\" }}\n                bgColor={color}\n                exit={{ opacity: 0 }}\n                initial={{ opacity: 0.35, transform: \"scale(0)\" }}\n                transition={{ duration }}\n                {...rest}\n                onAnimationComplete={handlerAll(onAnimationComplete, () =>\n                  onClear(key),\n                )}\n              />\n            </AnimatePresence>\n          )\n        })}\n      </>\n    )\n  },\n)()\n"],"mappings":";;;;;;;;AAaA,MAAM,SAAS,OAAe,KAAa,QACzC,KAAK,IAAI,KAAK,IAAI,OAAO,GAAG,GAAG,GAAG;AAoBpC,MAAM,EACJ,cAAc,oBACd,iBAAiB,uBACjB,gBACE,gBAA0C,UAAU,WAAW;;;;;;AASnE,MAAa,SAAS,aACnB,EACC,OACA,QAAQ,gBACR,UACA,SACA,qBACA,SACA,GAAG,WACC;CACJ,IAAI,UAAU,OAAO;CAErB,OACE,oBAAA,UAAA,EAAA,UACG,QAAQ,KAAK,EAAE,KAAK,MAAM,GAAG,QAAQ;EACpC,MAAM,WAAW,MAAM,MAAO,MAAM,IAAK,OAAO,MAAM,MAAO,EAAG;EAEhE,OACE,oBAAC,iBAAD;GAA2B,MAAK;aAC9B,oBAACA,SAAO,MAAR;IACE,OAAO;KACL,QAAQ,GAAG,KAAK;KAChB,MAAM;KACN,eAAe;KACf,UAAU;KACV,KAAK;KACL,iBAAiB;KACjB,OAAO,GAAG,KAAK;KACf,GAAG;IACL;IACA,SAAS;KAAE,SAAS;KAAG,WAAW;IAAW;IAC7C,SAAS;IACT,MAAM,EAAE,SAAS,EAAE;IACnB,SAAS;KAAE,SAAS;KAAM,WAAW;IAAW;IAChD,YAAY,EAAE,SAAS;IACvB,GAAI;IACJ,sBAAA,GAAA,cAAA,WAAA,CAAgC,2BAC9B,QAAQ,GAAG,CACb;GACD,CAAA;EACc,GAtBK,GAsBL;CAErB,CAAC,EACD,CAAA;AAEN,CACF,CAAC,CAAC"}
+{"version":3,"file":"ripple.js","names":["motion"],"sources":["../../../../src/components/ripple/ripple.tsx"],"sourcesContent":["\"use client\"\n\nimport type { Key } from \"react\"\nimport type { ThemeProps } from \"../../core\"\nimport type { HTMLMotionProps } from \"../motion\"\nimport type { RippleStyle } from \"./ripple.style\"\nimport type { RippleOptions } from \"./use-ripple\"\nimport { AnimatePresence } from \"motion/react\"\nimport { createComponent } from \"../../core\"\nimport { handlerAll } from \"../../utils\"\nimport { motion } from \"../motion\"\nimport { rippleStyle } from \"./ripple.style\"\n\nconst clamp = (value: number, min: number, max: number) =>\n  Math.min(Math.max(value, min), max)\n\nexport interface RippleProps\n  extends HTMLMotionProps<\"span\">, ThemeProps<RippleStyle> {\n  /**\n   * The ripples to use.\n   */\n  ripples: RippleOptions[]\n  /**\n   * The callback invoked when a ripple is cleared.\n   */\n  onClear: (key: Key) => void\n  /**\n   * If `true`, disable ripple effects when pressing a element.\n   *\n   * @default false\n   */\n  disabled?: boolean\n}\n\nconst {\n  PropsContext: RipplePropsContext,\n  usePropsContext: useRipplePropsContext,\n  withContext,\n} = createComponent<RippleProps, RippleStyle>(\"ripple\", rippleStyle)\n\nexport { RipplePropsContext, useRipplePropsContext }\n\n/**\n * `Ripple` is a component that adds a ripple effect to elements, allowing users to recognize when they have clicked.\n *\n * @see https://yamada-ui.com/docs/components/ripple\n */\nexport const Ripple = withContext<\"span\", RippleProps>(\n  ({\n    style,\n    color = \"currentColor\",\n    disabled,\n    ripples,\n    onAnimationComplete,\n    onClear,\n    ...rest\n  }) => {\n    if (disabled) return null\n\n    return (\n      <>\n        {ripples.map(({ key, size, x, y }) => {\n          const duration = clamp(0.01 * size, 0.2, size > 100 ? 0.75 : 0.5)\n\n          return (\n            <AnimatePresence key={key} mode=\"popLayout\">\n              <motion.span\n                style={{\n                  height: `${size}px`,\n                  left: x,\n                  pointerEvents: \"none\",\n                  position: \"absolute\",\n                  top: y,\n                  transformOrigin: \"center\",\n                  width: `${size}px`,\n                  ...style,\n                }}\n                animate={{ opacity: 0, transform: \"scale(2)\" }}\n                bgColor={color}\n                exit={{ opacity: 0 }}\n                initial={{ opacity: 0.35, transform: \"scale(0)\" }}\n                transition={{ duration }}\n                {...rest}\n                onAnimationComplete={handlerAll(onAnimationComplete, () =>\n                  onClear(key),\n                )}\n              />\n            </AnimatePresence>\n          )\n        })}\n      </>\n    )\n  },\n)()\n"],"mappings":";;;;;;;;AAaA,MAAM,SAAS,OAAe,KAAa,QACzC,KAAK,IAAI,KAAK,IAAI,OAAO,GAAG,GAAG,GAAG;AAoBpC,MAAM,EACJ,cAAc,oBACd,iBAAiB,uBACjB,gBACE,gBAA0C,UAAU,WAAW;;;;;;AASnE,MAAa,SAAS,aACnB,EACC,OACA,QAAQ,gBACR,UACA,SACA,qBACA,SACA,GAAG,WACC;CACJ,IAAI,UAAU,OAAO;CAErB,OACE,oBAAA,UAAA,EAAA,UACG,QAAQ,KAAK,EAAE,KAAK,MAAM,GAAG,QAAQ;EACpC,MAAM,WAAW,MAAM,MAAO,MAAM,IAAK,OAAO,MAAM,MAAO,EAAG;EAEhE,OACE,oBAAC,iBAAD;GAA2B,MAAK;GAC9B,UAAA,oBAACA,SAAO,MAAR;IACE,OAAO;KACL,QAAQ,GAAG,KAAK;KAChB,MAAM;KACN,eAAe;KACf,UAAU;KACV,KAAK;KACL,iBAAiB;KACjB,OAAO,GAAG,KAAK;KACf,GAAG;IACL;IACA,SAAS;KAAE,SAAS;KAAG,WAAW;IAAW;IAC7C,SAAS;IACT,MAAM,EAAE,SAAS,EAAE;IACnB,SAAS;KAAE,SAAS;KAAM,WAAW;IAAW;IAChD,YAAY,EAAE,SAAS;IACvB,GAAI;IACJ,sBAAA,GAAA,cAAA,WAAA,CAAgC,2BAC9B,QAAQ,GAAG,CACb;GACD,CAAA;EACc,GAtBK,GAsBL;CAErB,CAAC,EACD,CAAA;AAEN,CACF,CAAC,CAAC"}