npm - @yamada-ui/react - Versions diffs - 2.2.5-dev-20260720092031 → 2.2.5-dev-20260721065212 - Mend

@yamada-ui/react 2.2.5-dev-20260720092031 → 2.2.5-dev-20260721065212

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2529) hide show

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

@@ -102,34 +102,35 @@ const PopoverRoot = (props) => {
 		...styleProps
 	});
 	const { open, getAnchorProps, getBodyProps, getCloseTriggerProps, getContentProps, getFooterProps, getHeaderProps, getPositionerProps, getTriggerProps, onClose } = require_use_popover.usePopover(rest);
+	const componentContext = (0, react.useMemo)(() => ({
+		animationScheme,
+		duration,
+		open,
+		getAnchorProps,
+		getBodyProps,
+		getCloseTriggerProps,
+		getContentProps,
+		getFooterProps,
+		getHeaderProps,
+		getPositionerProps,
+		getTriggerProps
+	}), [
+		open,
+		animationScheme,
+		duration,
+		getAnchorProps,
+		getBodyProps,
+		getCloseTriggerProps,
+		getContentProps,
+		getFooterProps,
+		getHeaderProps,
+		getPositionerProps,
+		getTriggerProps
+	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyleContext, {
 		value: styleContext,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
-			value: (0, react.useMemo)(() => ({
-				animationScheme,
-				duration,
-				open,
-				getAnchorProps,
-				getBodyProps,
-				getCloseTriggerProps,
-				getContentProps,
-				getFooterProps,
-				getHeaderProps,
-				getPositionerProps,
-				getTriggerProps
-			}), [
-				open,
-				animationScheme,
-				duration,
-				getAnchorProps,
-				getBodyProps,
-				getCloseTriggerProps,
-				getContentProps,
-				getFooterProps,
-				getHeaderProps,
-				getPositionerProps,
-				getTriggerProps
-			]),
+			value: componentContext,
 			children: (0, require_utils_index.utils_exports.runIfFn)(children, {
 				open,
 				onClose

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

	@@ -1 +1 @@
1	- {"version":3,"file":"popover.cjs","names":["useValue","fadeScaleVariants","slideFadeVariants","createSlotComponent","popoverStyle","usePopover","AnimatePresence","Portal","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":";;;;;;;;;;;;;;AA0CA,MAAa,0BAA0B,QAAgC,CAAC,MAAM;CAC5E,MAAM,kBAAkBA,8BAAAA,SAAS,MAAM,mBAAmB,OAAO;CACjE,MAAM,WAAWA,8BAAAA,SAAS,MAAM,YAAY,EAAG;CAC/C,MAAM,cAAc;EAAE,SAAS;EAAS,MAAM;EAAQ,SAAS;CAAO;CAEtE,QAAQ,iBAAR;EACE,KAAK,SACH,OAAO;GACL,GAAG;GACH,QAAQ;IAAE;IAAU,SAAS;IAAM,OAAO;GAAK;GAC/C,UAAUC,mBAAAA;EACZ;EACF,KAAK,eACH,OAAO;GACL,GAAG;GACH,QAAQ;IAAE;IAAU,SAAS;IAAK,SAAS;GAAK;GAChD,UAAUC,mBAAAA;EACZ;EACF,KAAK,cACH,OAAO;GACL,GAAG;GACH,QAAQ;IAAE;IAAU,SAAS;IAAI,SAAS;GAAK;GAC/C,UAAUA,mBAAAA;EACZ;EACF,KAAK,gBACH,OAAO;GACL,GAAG;GACH,QAAQ;IAAE;IAAU,SAAS;IAAK,SAAS;GAAK;GAChD,UAAUA,mBAAAA;EACZ;EACF,KAAK,aACH,OAAO;GACL,GAAG;GACH,QAAQ;IAAE;IAAU,SAAS;IAAI,SAAS;GAAK;GAC/C,UAAUA,mBAAAA;EACZ;EACF,SACE,OAAO,CAAC;CACZ;AACF;AAqCA,MAAa,wBAAwB,QAA8B,CAAC,MAAM;CACxE,MAAM,YAAYF,8BAAAA,SAAS,MAAM,SAAS;CAC1C,MAAM,SAASA,8BAAAA,SAAS,MAAM,MAAM;CACpC,MAAM,aAAaA,8BAAAA,SAAS,MAAM,UAAU;CAC5C,MAAM,WAAWA,8BAAAA,SAAS,MAAM,QAAQ;CACxC,MAAM,OAAOA,8BAAAA,SAAS,MAAM,IAAI;CAEhC,QAAA,GAAA,MAAA,QAAA,QAAA,GAAA,oBAAA,cAAA,gBAAA,CACwB;EAAE;EAAM;EAAQ;EAAY;EAAW;CAAS,CAAC,GACvE;EAAC;EAAM;EAAQ;EAAY;EAAW;CAAQ,CAChD;AACF;AAgCA,MAAM,EACJ,kBACA,cAAc,qBACd,cACA,qBACA,iBAAiB,wBACjB,aACA,0BACEG,yBAAAA,oBACF,WACAC,sBAAAA,YACF;;;;;;AASA,MAAa,eAAqC,UAAU;CAC1D,MAAM,aAAa,qBAAqB,KAAK;CAC7C,MAAM,CAAC,cAAc,EAAE,iBAAiB,UAAU,UAAU,GAAG,UAC7D,sBAAsB;EAAE,GAAG;EAAO,GAAG;CAAW,CAAC;CACnD,MAAM,EACJ,MACA,gBACA,cACA,sBACA,iBACA,gBACA,gBACA,oBACA,iBACA,YACEC,oBAAAA,WAAW,IAAI;CA8BnB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,cAAD;EAAc,OAAO;YACnB,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;GAAkB,QAAA,GAAA,MAAA,QAAA,QA9Bb;IACL;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF,IACA;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF,CAK0C;4DAC7B,UAAU;IAAE;IAAM;GAAQ,CAAC;EACpB,CAAA;CACN,CAAA;AAElB;AAIA,MAAa,iBAAiB,YAC5B,UACA,SACF,CAAC,CAAC,EAAE,SAAS,KAAK,IAAI,UAAU;CAC9B,MAAM,EAAE,oBAAoB,oBAAoB;CAEhD,OAAO,gBAAgB,KAAK;AAC9B,CAAC;AAID,MAAa,sBAAsB,YAGjC,UAAU;CAAE,MAAM;CAAgB,MAAM,CAAC,WAAW,OAAO;AAAE,CAAC,CAAC,CAC/D,EAAE,SAAS,KAAK,IACf,UAAU;CACT,MAAM,EAAE,yBAAyB,oBAAoB;CAErD,OAAO,qBAAqB,KAAK;AACnC,CACF;AAIA,MAAa,gBAAgB,YAC3B,OACA,QACF,CAAC,CAAC,EAAE,SAAS,KAAK,IAAI,UAAU;CAC9B,MAAM,EAAE,mBAAmB,oBAAoB;CAE/C,OAAO,eAAe,KAAK;AAC7B,CAAC;AAID,MAAM,oBAAoB,YACxB,OACA,YACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,uBAAuB,oBAAoB;CAEnD,OAAO,mBAAmB,KAAK;AACjC,CAAC;AAUD,MAAa,iBAAiB,aAC3B,EAAE,aAAa,GAAG,WAAW;CAC5B,MAAM,EAAE,iBAAiB,UAAU,MAAM,oBACvC,oBAAoB;CACtB,MAAM,sBAAsB,uBAAuB;EACjD;EACA;CACF,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,aAAAA,iBAAD,EAAA,UACG,OACC,iBAAA,GAAA,kBAAA,IAAA,CAACC,eAAAA,QAAD;EAAQ,GAAI;YACV,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,gBAAAA,OAAO,KAAR;GACE,GAAI;GACJ,IAAA,GAAA,oBAAA,cAAA,KAAA,CACE,iBAAA,GAAA,oBAAA,cAAA,KAAA,CAAgC,IAAI,CAAC,CACvC;EACD,CAAA,EACgB,CAAA;CACb,CAAA,IACN,KACW,CAAA;AAErB,GACA,SACF,CAAC,CAAC;AAIF,MAAa,gBAAgB,YAC3B,OACA,QACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,mBAAmB,oBAAoB;CAE/C,OAAO,eAAe,KAAK;AAC7B,CAAC;AAID,MAAa,cAAc,YAAqC,OAAO,MAAM,CAAC,CAC5E,KAAA,IACC,UAAU;CACT,MAAM,EAAE,iBAAiB,oBAAoB;CAE7C,OAAO,aAAa,KAAK;AAC3B,CACF;AAIA,MAAa,gBAAgB,YAC3B,OACA,QACF,CAAC,CAAC,KAAA,IAAY,UAAU;CACtB,MAAM,EAAE,mBAAmB,oBAAoB;CAE/C,OAAO,eAAe,KAAK;AAC7B,CAAC"}
1	+ {"version":3,"file":"popover.cjs","names":["useValue","fadeScaleVariants","slideFadeVariants","createSlotComponent","popoverStyle","usePopover","AnimatePresence","Portal","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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"}

package/dist/cjs/components/qr-code/qr-code.cjs CHANGED Viewed

@@ -16,18 +16,19 @@ const { ComponentContext, PropsContext: QrCodePropsContext, useComponentContext,
 const QrCodeRoot = withProvider(({ children, frameProps, patternProps, ...rest }) => {
 	const { getFrameProps, getOverlayProps, getPatternProps, getRootProps } = require_use_qr_code.useQrCode(rest);
 	const [omittedChildren, customFrame] = require_children.useSplitChildren(children, QrCodeFrame);
+	const context = (0, react.useMemo)(() => ({
+		getFrameProps,
+		getOverlayProps,
+		getPatternProps,
+		patternProps
+	}), [
+		getFrameProps,
+		getOverlayProps,
+		getPatternProps,
+		patternProps
+	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
-		value: (0, react.useMemo)(() => ({
-			getFrameProps,
-			getOverlayProps,
-			getPatternProps,
-			patternProps
-		}), [
-			getFrameProps,
-			getOverlayProps,
-			getPatternProps,
-			patternProps
-		]),
+		value: context,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_factory.styled.div, {
 			...getRootProps(),
 			children: [customFrame ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(QrCodeFrame, { ...frameProps }), omittedChildren]

package/dist/cjs/components/qr-code/qr-code.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"qr-code.cjs","names":["createSlotComponent","qrCodeStyle","useQrCode","useSplitChildren","styled"],"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,iBACEA,yBAAAA,oBACF,WACAC,sBAAAA,WACF;;;;;;AASA,MAAa,aAAa,cACvB,EAAE,UAAU,YAAY,cAAc,GAAG,WAAW;CACnD,MAAM,EAAE,eAAe,iBAAiB,iBAAiB,iBACvDC,oBAAAA,UAAU,IAAI;CAChB,MAAM,CAAC,iBAAiB,eAAeC,iBAAAA,iBACrC,UACA,WACF;~~CAMA~~,~~OACE~~,~~iBAAA~~,GAAA,~~kBAAA,IAAA,CAAC,kBAAD;EAAkB,QAAA,GAAA,~~MAAA,QAAA,~~QALX~~;~~GAAE~~;~~GAAe~~;~~GAAiB~~;~~GAAiB~~;~~EAAa~~,IACvE;~~GAAC~~;~~GAAe~~;~~GAAiB~~;~~GAAiB~~;~~EAAY~~,~~CAI/B~~;~~YAC7B~~,iBAAA,GAAA,kBAAA,KAAA,CAACC,gBAAAA,OAAO,KAAR;GAAY,GAAI,aAAa;aAA7B,CACG,eAAe,iBAAA,GAAA,kBAAA,IAAA,CAAC,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,iBAAiBD,iBAAAA,iBACvC,UACA,aACF;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,gBAAAA,OAAO,KAAR;EAAY,GAAI,cAAc,IAAI;YAAlC,CACG,iBAAiB,iBAAA,GAAA,kBAAA,IAAA,CAAC,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"}
1	+ {"version":3,"file":"qr-code.cjs","names":["createSlotComponent","qrCodeStyle","useQrCode","useSplitChildren","styled"],"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,iBACEA,yBAAAA,oBACF,WACAC,sBAAAA,WACF;;;;;;AASA,MAAa,aAAa,cACvB,EAAE,UAAU,YAAY,cAAc,GAAG,WAAW;CACnD,MAAM,EAAE,eAAe,iBAAiB,iBAAiB,iBACvDC,oBAAAA,UAAU,IAAI;CAChB,MAAM,CAAC,iBAAiB,eAAeC,iBAAAA,iBACrC,UACA,WACF;CACA,MAAM,WAAA,GAAA,MAAA,QAAA,QACG;EAAE;EAAe;EAAiB;EAAiB;CAAa,IACvE;EAAC;EAAe;EAAiB;EAAiB;CAAY,CAChE;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;EAAkB,OAAO;YACvB,iBAAA,GAAA,kBAAA,KAAA,CAACC,gBAAAA,OAAO,KAAR;GAAY,GAAI,aAAa;aAA7B,CACG,eAAe,iBAAA,GAAA,kBAAA,IAAA,CAAC,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,iBAAiBD,iBAAAA,iBACvC,UACA,aACF;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,gBAAAA,OAAO,KAAR;EAAY,GAAI,cAAc,IAAI;YAAlC,CACG,iBAAiB,iBAAA,GAAA,kBAAA,IAAA,CAAC,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/cjs/components/rating/rating.cjs CHANGED Viewed

@@ -18,68 +18,70 @@ const { ComponentContext, PropsContext: RatingPropsContext, useComponentContext,
 */
 const Rating = withProvider(({ color, emptyIcon, filledIcon, groupProps, iconProps, inputProps, itemProps, ...rest }) => {
 	const { id, name, count, decimal, disabled, displayValue, fractions, highlightSelectedOnly, hoveredValue, interactive, outsideRef, readOnly, required, roundedValue, setHoveredValue, setValue, value, ariaProps, dataProps, eventProps, getRootProps } = require_use_rating.useRating(rest);
+	const ratingContext = (0, react.useMemo)(() => ({
+		id,
+		name,
+		count,
+		decimal,
+		disabled,
+		displayValue,
+		fractions,
+		highlightSelectedOnly,
+		hoveredValue,
+		interactive,
+		outsideRef,
+		readOnly,
+		required,
+		roundedValue,
+		setHoveredValue,
+		setValue,
+		value,
+		ariaProps,
+		dataProps,
+		eventProps
+	}), [
+		id,
+		name,
+		count,
+		decimal,
+		disabled,
+		fractions,
+		highlightSelectedOnly,
+		hoveredValue,
+		interactive,
+		displayValue,
+		outsideRef,
+		readOnly,
+		required,
+		roundedValue,
+		setHoveredValue,
+		setValue,
+		value,
+		ariaProps,
+		dataProps,
+		eventProps
+	]);
+	const componentContext = (0, react.useMemo)(() => ({
+		color,
+		emptyIcon,
+		filledIcon,
+		groupProps,
+		iconProps,
+		inputProps,
+		itemProps
+	}), [
+		color,
+		emptyIcon,
+		filledIcon,
+		groupProps,
+		iconProps,
+		inputProps,
+		itemProps
+	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_rating.RatingContext, {
-		value: (0, react.useMemo)(() => ({
-			id,
-			name,
-			count,
-			decimal,
-			disabled,
-			displayValue,
-			fractions,
-			highlightSelectedOnly,
-			hoveredValue,
-			interactive,
-			outsideRef,
-			readOnly,
-			required,
-			roundedValue,
-			setHoveredValue,
-			setValue,
-			value,
-			ariaProps,
-			dataProps,
-			eventProps
-		}), [
-			id,
-			name,
-			count,
-			decimal,
-			disabled,
-			fractions,
-			highlightSelectedOnly,
-			hoveredValue,
-			interactive,
-			displayValue,
-			outsideRef,
-			readOnly,
-			required,
-			roundedValue,
-			setHoveredValue,
-			setValue,
-			value,
-			ariaProps,
-			dataProps,
-			eventProps
-		]),
+		value: ratingContext,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
-			value: (0, react.useMemo)(() => ({
-				color,
-				emptyIcon,
-				filledIcon,
-				groupProps,
-				iconProps,
-				inputProps,
-				itemProps
-			}), [
-				color,
-				emptyIcon,
-				filledIcon,
-				groupProps,
-				iconProps,
-				inputProps,
-				itemProps
-			]),
+			value: componentContext,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.div, {
 				...getRootProps(),
 				children: Array.from({ length: count }).map((_, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RatingGroup, { value: index + 1 }, index))

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

	@@ -1 +1 @@
1	- {"version":3,"file":"rating.cjs","names":["createSlotComponent","ratingStyle","useRating","RatingContext","styled","useRatingContext","mergeProps","useRatingItem","StarIcon","varAttr"],"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,iBACEA,yBAAAA,oBACF,UACAC,qBAAAA,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,iBACEC,mBAAAA,UAAU,IAAI;~~CAoElB~~,~~OACE~~,iBAAA,GAAA,~~kBAAA,IAAA,CAACC,mBAAAA,eAAD;EAAe,QAAA,GAAA,~~MAAA,QAAA,~~QAnER~~;~~GACL~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~EACF~~,IACA;~~GACE~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~GACA~~;~~EACF~~,~~CAwBkC~~;~~YAChC~~,~~iBAAA~~,~~GAAA~~,~~kBAAA,IAAA,CAAC,kBAAD;GAAkB,QAAA,~~GAAA,MAAA,QAAA,~~QAtBb~~;~~IACL~~;~~IACA~~;~~IACA~~;~~IACA~~;~~IACA~~;~~IACA~~;~~IACA~~;~~GACF~~,IACA;~~IACE~~;~~IACA~~;~~IACA~~;~~IACA~~;~~IACA~~;~~IACA~~;~~IACA~~;~~GACF~~,~~CAK0C~~;~~aACtC~~,iBAAA,GAAA,kBAAA,IAAA,CAACC,gBAAAA,OAAO,KAAR;IAAY,GAAI,aAAa;cAC1B,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,iBAAA,GAAA,kBAAA,IAAA,CAAC,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,cAAcC,mBAAAA,iBAAiB;CACvC,MAAM,EAAE,eAAe,oBAAoB;CAC3C,MAAM,SAAA,GAAA,MAAA,QAAA,OACG,UAAU,IAAI,YAAY,IAAI,WACrC,CAAC,OAAO,SAAS,CACnB;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACD,gBAAAA,OAAO,KAAR;EAAY,GAAIE,cAAAA,WAAW,OAAA,GAAA,oBAAA,cAAA,QAAA,CAAc,YAAY,KAAK,CAAC,CAAC,CAAC;YAC1D,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,iBAAA,GAAA,kBAAA,IAAA,CAAC,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,kBACEC,mBAAAA,cAAc,KAAK;CACvB,MAAM,EACJ,YAAY,iBAAA,GAAA,kBAAA,IAAA,CAACC,kBAAAA,UAAD;EAAU,MAAK;EAAe,aAAY;CAAgB,CAAA,GACtE,aAAa,iBAAA,GAAA,kBAAA,IAAA,CAACA,kBAAAA,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,iBAAA,GAAA,kBAAA,KAAA,CAACJ,gBAAAA,OAAO,OAAR;EAAc,GAAI,eAAA,GAAA,oBAAA,cAAA,QAAA,CAAsB,WAAW,UAAU,CAAC;YAA9D,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,gBAAAA,OAAO,OAAR,EAAc,GAAI,eAAA,GAAA,oBAAA,cAAA,QAAA,CAAsB,YAAY,UAAU,CAAC,EAAI,CAAA,GAEnE,iBAAA,GAAA,kBAAA,IAAA,CAAC,YAAD;GACQ,eAAe;GACrB,IAAA,GAAA,oBAAA,cAAA,QAAA,CAAY,WAAW,UAAU;aAEhC,UAAA,GAAA,oBAAA,cAAA,QAAA,CACW,YAAY,UAAU,KAAA,GAAA,oBAAA,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,kBAAkBK,YAAAA,SAAAA,GAAAA,oBAAAA,cAAAA,QAAAA,CAAgB,OAAO,UAAU,GAAG,QAAQ;EAC9D;EACA,GAAG;CACL;AACF,CAAC;AAID,MAAM,aAAa,YAAoC,OAAO,MAAM,CAAC,CAAC"}
1	+ {"version":3,"file":"rating.cjs","names":["createSlotComponent","ratingStyle","useRating","RatingContext","styled","useRatingContext","mergeProps","useRatingItem","StarIcon","varAttr"],"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,iBACEA,yBAAAA,oBACF,UACAC,qBAAAA,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,iBACEC,mBAAAA,UAAU,IAAI;CAClB,MAAM,iBAAA,GAAA,MAAA,QAAA,QACG;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,oBAAA,GAAA,MAAA,QAAA,QACG;EACL;EACA;EACA;EACA;EACA;EACA;EACA;CACF,IACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,eAAD;EAAe,OAAO;YACpB,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;GAAkB,OAAO;aACvB,iBAAA,GAAA,kBAAA,IAAA,CAACC,gBAAAA,OAAO,KAAR;IAAY,GAAI,aAAa;cAC1B,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,iBAAA,GAAA,kBAAA,IAAA,CAAC,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,cAAcC,mBAAAA,iBAAiB;CACvC,MAAM,EAAE,eAAe,oBAAoB;CAC3C,MAAM,SAAA,GAAA,MAAA,QAAA,OACG,UAAU,IAAI,YAAY,IAAI,WACrC,CAAC,OAAO,SAAS,CACnB;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACD,gBAAAA,OAAO,KAAR;EAAY,GAAIE,cAAAA,WAAW,OAAA,GAAA,oBAAA,cAAA,QAAA,CAAc,YAAY,KAAK,CAAC,CAAC,CAAC;YAC1D,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,UACrC,iBAAA,GAAA,kBAAA,IAAA,CAAC,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,kBACEC,mBAAAA,cAAc,KAAK;CACvB,MAAM,EACJ,YAAY,iBAAA,GAAA,kBAAA,IAAA,CAACC,kBAAAA,UAAD;EAAU,MAAK;EAAe,aAAY;CAAgB,CAAA,GACtE,aAAa,iBAAA,GAAA,kBAAA,IAAA,CAACA,kBAAAA,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,iBAAA,GAAA,kBAAA,KAAA,CAACJ,gBAAAA,OAAO,OAAR;EAAc,GAAI,eAAA,GAAA,oBAAA,cAAA,QAAA,CAAsB,WAAW,UAAU,CAAC;YAA9D,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,gBAAAA,OAAO,OAAR,EAAc,GAAI,eAAA,GAAA,oBAAA,cAAA,QAAA,CAAsB,YAAY,UAAU,CAAC,EAAI,CAAA,GAEnE,iBAAA,GAAA,kBAAA,IAAA,CAAC,YAAD;GACQ,eAAe;GACrB,IAAA,GAAA,oBAAA,cAAA,QAAA,CAAY,WAAW,UAAU;aAEhC,UAAA,GAAA,oBAAA,cAAA,QAAA,CACW,YAAY,UAAU,KAAA,GAAA,oBAAA,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,kBAAkBK,YAAAA,SAAAA,GAAAA,oBAAAA,cAAAA,QAAAA,CAAgB,OAAO,UAAU,GAAG,QAAQ;EAC9D;EACA,GAAG;CACL;AACF,CAAC;AAID,MAAM,aAAa,YAAoC,OAAO,MAAM,CAAC,CAAC"}

package/dist/cjs/components/rating/use-rating.cjs CHANGED Viewed

@@ -37,7 +37,8 @@ const useRating = (props = {}) => {
 		if (!rootRef.current) return -1;
 		const { left, width } = rootRef.current.getBoundingClientRect();
 		const itemWidth = width / count;
-		return (0, require_utils_index.utils_exports.clampNumber)(getRoundedValue((x - left) / itemWidth + decimal / 2, decimal), decimal, count);
+		const hoveredValue = (x - left) / itemWidth;
+		return (0, require_utils_index.utils_exports.clampNumber)(getRoundedValue(hoveredValue + decimal / 2, decimal), decimal, count);
 	}, [count, decimal]);
 	const onMouseEnter = (0, react.useCallback)(() => {
 		if (interactive) outsideRef.current = false;
@@ -69,7 +70,8 @@ const useRating = (props = {}) => {
 		ev.preventDefault();
 		const el = ev.touches[0];
 		if (!el) return;
-		setValue(getHoveredValue(el.clientX));
+		const value = getHoveredValue(el.clientX);
+		setValue(value);
 	}, [getHoveredValue, setValue]);
 	const onTouchEnd = (0, react.useCallback)((ev) => {
 		ev.preventDefault();
@@ -142,7 +144,8 @@ const useRatingItem = ({ groupValue, index, ...rest }) => {
 	}, [outsideRef, setHoveredValue]);
 	const onInputChange = (0, react.useCallback)((ev) => {
 		if (!interactive) return;
-		setHoveredValue(parseFloat(ev.target.value));
+		const value = parseFloat(ev.target.value);
+		setHoveredValue(value);
 	}, [interactive, setHoveredValue]);
 	const onChange = (0, react.useCallback)((value) => {
 		if (!interactive) return;

package/dist/cjs/components/rating/use-rating.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-rating.cjs","names":["createContext","useFieldProps","useControllableState","mergeProps","visuallyHiddenAttributes"],"sources":["../../../../src/components/rating/use-rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent, MouseEvent, TouchEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n ariaAttr,\n clampNumber,\n createContext,\n dataAttr,\n handlerAll,\n runKeyAction,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst getRoundedValue = (value: number, to: number) => {\n const rounded = Math.round(value / to) * to\n const precision = `${to}`.split(\".\")[1]?.length \|\| 0\n\n return Number(rounded.toFixed(precision))\n}\n\nexport interface RatingContext extends Omit<UseRatingReturn, \"getRootProps\"> {}\n\nconst [RatingContext, useRatingContext] = createContext<RatingContext>({\n name: \"RatingContext\",\n})\n\nexport { RatingContext, useRatingContext }\n\nexport interface UseRatingProps\n extends FieldProps, Omit<HTMLProps, \"color\" \| \"defaultValue\" \| \"onChange\"> {\n /*\n Number of controls that should be rendered.\n \n @default 5\n /\n count?: number\n /\n The initial value of the rating.\n \n @default 0\n /\n defaultValue?: number\n /\n Number of fractions each item can be divided into,\n \n @default 1\n /\n fractions?: number\n /\n If `true`, only the selected icons will be filled.\n \n @default false\n /\n highlightSelectedOnly?: boolean\n /\n The top-level id string that will be applied to the rating.\n * The index of the rating item will be appended to this top-level id.\n /\n id?: string\n /\n The name of the input element.\n /\n name?: string\n /\n The value of the rating.\n /\n value?: number\n /\n The callback invoked when value state changes.\n /\n onChange?: (value: number) => void\n /\n The callback invoked when hovering over the rating.\n /\n onHover?: (value: number) => void\n}\n\nexport const useRating = (props: UseRatingProps = {}) => {\n const uuid = useId()\n const {\n props: {\n id = uuid,\n name = uuid,\n count: countProp = 5,\n defaultValue = 0,\n disabled,\n fractions: fractionsProp = 1,\n highlightSelectedOnly = false,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onHover,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps({ ...props, notSupportReadOnly: true })\n const rootRef = useRef<HTMLDivElement>(null)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [hoveredValue, setHoveredValue] = useState(-1)\n const outsideRef = useRef(true)\n const fractions = Math.floor(fractionsProp)\n const count = Math.floor(countProp)\n const decimal = 1 / fractions\n const roundedValue = useMemo(\n () => getRoundedValue(value, decimal),\n [decimal, value],\n )\n const interactive = !(readOnly \|\| disabled)\n const displayValue = hoveredValue !== -1 ? hoveredValue : roundedValue\n\n const getHoveredValue = useCallback(\n (x: number) => {\n if (!rootRef.current) return -1\n\n const { left, width } = rootRef.current.getBoundingClientRect()\n const itemWidth = width / count\n\n const hoveredValue = (x - left) / itemWidth\n\n const value = clampNumber(\n getRoundedValue(hoveredValue + decimal / 2, decimal),\n decimal,\n count,\n )\n\n return value\n },\n [count, decimal],\n )\n\n const onMouseEnter = useCallback(() => {\n if (interactive) outsideRef.current = false\n }, [interactive])\n\n const onMouseLeave = useCallback(() => {\n if (!interactive) return\n\n setHoveredValue(-1)\n outsideRef.current = true\n\n if (hoveredValue !== -1) onHover?.(-1)\n }, [hoveredValue, onHover, interactive, setHoveredValue])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled \|\| readOnly) return\n\n const roundedValue = getHoveredValue(ev.clientX)\n\n setHoveredValue(roundedValue)\n\n if (roundedValue !== hoveredValue) onHover?.(roundedValue)\n },\n [disabled, getHoveredValue, hoveredValue, readOnly, onHover],\n )\n\n const onTouchStart = useCallback(\n (ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n\n const el = ev.touches[0]\n\n if (!el) return\n\n const value = getHoveredValue(el.clientX)\n\n setValue(value)\n },\n [getHoveredValue, setValue],\n )\n\n const onTouchEnd = useCallback((ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n }, [])\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => {\n const merged = mergeProps(\n dataProps,\n eventProps,\n ariaProps,\n {\n id,\n \"aria-label\": `${value} Stars`,\n \"aria-readonly\": ariaAttr(readOnly),\n role: \"radiogroup\",\n },\n rest,\n props,\n { ref },\n { ref: rootRef },\n )()\n return {\n ...merged,\n onMouseEnter: handlerAll(\n props.onMouseEnter,\n rest.onMouseEnter,\n onMouseEnter,\n ),\n onMouseLeave: handlerAll(\n props.onMouseLeave,\n rest.onMouseLeave,\n onMouseLeave,\n ),\n onMouseMove: handlerAll(\n props.onMouseMove,\n rest.onMouseMove,\n onMouseMove,\n ),\n onTouchEnd: handlerAll(props.onTouchEnd, rest.onTouchEnd, onTouchEnd),\n onTouchStart: handlerAll(\n props.onTouchStart,\n rest.onTouchStart,\n onTouchStart,\n ),\n }\n },\n [\n ariaProps,\n dataProps,\n eventProps,\n id,\n onMouseEnter,\n onMouseLeave,\n onMouseMove,\n onTouchEnd,\n onTouchStart,\n readOnly,\n rest,\n value,\n ],\n )\n\n return {\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 }\n}\n\nexport type UseRatingReturn = ReturnType<typeof useRating>\n\nexport interface UseRatingItemProps extends HTMLProps<\"label\"> {\n groupValue: number\n index: number\n}\n\nexport const useRatingItem = ({\n groupValue,\n index,\n ...rest\n}: UseRatingItemProps) => {\n const {\n id: rootId,\n name,\n decimal,\n disabled,\n displayValue,\n highlightSelectedOnly,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n ariaProps,\n dataProps,\n eventProps,\n } = useRatingContext()\n const fractionValue = decimal (groupValue === 1 ? index : index + 1)\n const value = useMemo(\n () => getRoundedValue(groupValue - 1 + fractionValue, decimal),\n [decimal, fractionValue, groupValue],\n )\n const active = value === displayValue\n const checked = value === roundedValue\n const filled = highlightSelectedOnly\n ? value === displayValue\n : value <= displayValue\n const id = `${rootId}-${groupValue}-${value}`\n\n const onBlur = useCallback(() => {\n if (outsideRef.current) setHoveredValue(-1)\n }, [outsideRef, setHoveredValue])\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return\n\n const value = parseFloat(ev.target.value)\n\n setHoveredValue(value)\n },\n [interactive, setHoveredValue],\n )\n\n const onChange = useCallback(\n (value: number) => {\n if (!interactive) return\n\n setValue(value)\n },\n [interactive, setValue],\n )\n\n const onMouseDown = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onTouchStart = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n runKeyAction(ev, {\n Space: () => onChange(value),\n })\n },\n [onChange, value],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n ({ style, ...props } = {}) =>\n mergeProps(\n dataProps,\n ariaProps,\n {\n htmlFor: id,\n \"data-active\": dataAttr(active),\n \"data-filled\": dataAttr(filled),\n },\n rest,\n props,\n { style },\n {\n style: {\n zIndex: fractionValue !== 1 ? (active ? 1 : -1) : undefined,\n },\n },\n { onMouseDown, onTouchStart },\n )(),\n [\n active,\n ariaProps,\n dataProps,\n filled,\n fractionValue,\n id,\n onMouseDown,\n onTouchStart,\n rest,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-label\": value.toString(),\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n value,\n ...props,\n onBlur: handlerAll(onBlur, props.onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n id,\n name,\n value,\n active,\n checked,\n dataProps,\n eventProps,\n ariaProps,\n disabled,\n readOnly,\n required,\n onBlur,\n onInputChange,\n onKeyDown,\n ],\n )\n\n return {\n active,\n checked,\n filled,\n fractionValue,\n groupValue,\n value,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRatingItemReturn = ReturnType<typeof useRatingItem>\n"],"mappings":"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"}
1	+ {"version":3,"file":"use-rating.cjs","names":["createContext","useFieldProps","useControllableState","mergeProps","visuallyHiddenAttributes"],"sources":["../../../../src/components/rating/use-rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent, MouseEvent, TouchEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n ariaAttr,\n clampNumber,\n createContext,\n dataAttr,\n handlerAll,\n runKeyAction,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst getRoundedValue = (value: number, to: number) => {\n const rounded = Math.round(value / to) * to\n const precision = `${to}`.split(\".\")[1]?.length \|\| 0\n\n return Number(rounded.toFixed(precision))\n}\n\nexport interface RatingContext extends Omit<UseRatingReturn, \"getRootProps\"> {}\n\nconst [RatingContext, useRatingContext] = createContext<RatingContext>({\n name: \"RatingContext\",\n})\n\nexport { RatingContext, useRatingContext }\n\nexport interface UseRatingProps\n extends FieldProps, Omit<HTMLProps, \"color\" \| \"defaultValue\" \| \"onChange\"> {\n /*\n Number of controls that should be rendered.\n \n @default 5\n /\n count?: number\n /\n The initial value of the rating.\n \n @default 0\n /\n defaultValue?: number\n /\n Number of fractions each item can be divided into,\n \n @default 1\n /\n fractions?: number\n /\n If `true`, only the selected icons will be filled.\n \n @default false\n /\n highlightSelectedOnly?: boolean\n /\n The top-level id string that will be applied to the rating.\n * The index of the rating item will be appended to this top-level id.\n /\n id?: string\n /\n The name of the input element.\n /\n name?: string\n /\n The value of the rating.\n /\n value?: number\n /\n The callback invoked when value state changes.\n /\n onChange?: (value: number) => void\n /\n The callback invoked when hovering over the rating.\n /\n onHover?: (value: number) => void\n}\n\nexport const useRating = (props: UseRatingProps = {}) => {\n const uuid = useId()\n const {\n props: {\n id = uuid,\n name = uuid,\n count: countProp = 5,\n defaultValue = 0,\n disabled,\n fractions: fractionsProp = 1,\n highlightSelectedOnly = false,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onHover,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps({ ...props, notSupportReadOnly: true })\n const rootRef = useRef<HTMLDivElement>(null)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [hoveredValue, setHoveredValue] = useState(-1)\n const outsideRef = useRef(true)\n const fractions = Math.floor(fractionsProp)\n const count = Math.floor(countProp)\n const decimal = 1 / fractions\n const roundedValue = useMemo(\n () => getRoundedValue(value, decimal),\n [decimal, value],\n )\n const interactive = !(readOnly \|\| disabled)\n const displayValue = hoveredValue !== -1 ? hoveredValue : roundedValue\n\n const getHoveredValue = useCallback(\n (x: number) => {\n if (!rootRef.current) return -1\n\n const { left, width } = rootRef.current.getBoundingClientRect()\n const itemWidth = width / count\n\n const hoveredValue = (x - left) / itemWidth\n\n const value = clampNumber(\n getRoundedValue(hoveredValue + decimal / 2, decimal),\n decimal,\n count,\n )\n\n return value\n },\n [count, decimal],\n )\n\n const onMouseEnter = useCallback(() => {\n if (interactive) outsideRef.current = false\n }, [interactive])\n\n const onMouseLeave = useCallback(() => {\n if (!interactive) return\n\n setHoveredValue(-1)\n outsideRef.current = true\n\n if (hoveredValue !== -1) onHover?.(-1)\n }, [hoveredValue, onHover, interactive, setHoveredValue])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled \|\| readOnly) return\n\n const roundedValue = getHoveredValue(ev.clientX)\n\n setHoveredValue(roundedValue)\n\n if (roundedValue !== hoveredValue) onHover?.(roundedValue)\n },\n [disabled, getHoveredValue, hoveredValue, readOnly, onHover],\n )\n\n const onTouchStart = useCallback(\n (ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n\n const el = ev.touches[0]\n\n if (!el) return\n\n const value = getHoveredValue(el.clientX)\n\n setValue(value)\n },\n [getHoveredValue, setValue],\n )\n\n const onTouchEnd = useCallback((ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n }, [])\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => {\n const merged = mergeProps(\n dataProps,\n eventProps,\n ariaProps,\n {\n id,\n \"aria-label\": `${value} Stars`,\n \"aria-readonly\": ariaAttr(readOnly),\n role: \"radiogroup\",\n },\n rest,\n props,\n { ref },\n { ref: rootRef },\n )()\n return {\n ...merged,\n onMouseEnter: handlerAll(\n props.onMouseEnter,\n rest.onMouseEnter,\n onMouseEnter,\n ),\n onMouseLeave: handlerAll(\n props.onMouseLeave,\n rest.onMouseLeave,\n onMouseLeave,\n ),\n onMouseMove: handlerAll(\n props.onMouseMove,\n rest.onMouseMove,\n onMouseMove,\n ),\n onTouchEnd: handlerAll(props.onTouchEnd, rest.onTouchEnd, onTouchEnd),\n onTouchStart: handlerAll(\n props.onTouchStart,\n rest.onTouchStart,\n onTouchStart,\n ),\n }\n },\n [\n ariaProps,\n dataProps,\n eventProps,\n id,\n onMouseEnter,\n onMouseLeave,\n onMouseMove,\n onTouchEnd,\n onTouchStart,\n readOnly,\n rest,\n value,\n ],\n )\n\n return {\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 }\n}\n\nexport type UseRatingReturn = ReturnType<typeof useRating>\n\nexport interface UseRatingItemProps extends HTMLProps<\"label\"> {\n groupValue: number\n index: number\n}\n\nexport const useRatingItem = ({\n groupValue,\n index,\n ...rest\n}: UseRatingItemProps) => {\n const {\n id: rootId,\n name,\n decimal,\n disabled,\n displayValue,\n highlightSelectedOnly,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n ariaProps,\n dataProps,\n eventProps,\n } = useRatingContext()\n const fractionValue = decimal (groupValue === 1 ? index : index + 1)\n const value = useMemo(\n () => getRoundedValue(groupValue - 1 + fractionValue, decimal),\n [decimal, fractionValue, groupValue],\n )\n const active = value === displayValue\n const checked = value === roundedValue\n const filled = highlightSelectedOnly\n ? value === displayValue\n : value <= displayValue\n const id = `${rootId}-${groupValue}-${value}`\n\n const onBlur = useCallback(() => {\n if (outsideRef.current) setHoveredValue(-1)\n }, [outsideRef, setHoveredValue])\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return\n\n const value = parseFloat(ev.target.value)\n\n setHoveredValue(value)\n },\n [interactive, setHoveredValue],\n )\n\n const onChange = useCallback(\n (value: number) => {\n if (!interactive) return\n\n setValue(value)\n },\n [interactive, setValue],\n )\n\n const onMouseDown = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onTouchStart = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n runKeyAction(ev, {\n Space: () => onChange(value),\n })\n },\n [onChange, value],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n ({ style, ...props } = {}) =>\n mergeProps(\n dataProps,\n ariaProps,\n {\n htmlFor: id,\n \"data-active\": dataAttr(active),\n \"data-filled\": dataAttr(filled),\n },\n rest,\n props,\n { style },\n {\n style: {\n zIndex: fractionValue !== 1 ? (active ? 1 : -1) : undefined,\n },\n },\n { onMouseDown, onTouchStart },\n )(),\n [\n active,\n ariaProps,\n dataProps,\n filled,\n fractionValue,\n id,\n onMouseDown,\n onTouchStart,\n rest,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-label\": value.toString(),\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n value,\n ...props,\n onBlur: handlerAll(onBlur, props.onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n id,\n name,\n value,\n active,\n checked,\n dataProps,\n eventProps,\n ariaProps,\n disabled,\n readOnly,\n required,\n onBlur,\n onInputChange,\n onKeyDown,\n ],\n )\n\n return {\n active,\n checked,\n filled,\n fractionValue,\n groupValue,\n value,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRatingItemReturn = ReturnType<typeof useRatingItem>\n"],"mappings":"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"}

package/dist/cjs/components/saturation-slider/saturation-slider.cjs CHANGED Viewed

@@ -25,11 +25,12 @@ const SaturationSliderRoot = withProvider(({ children, inputProps, thumbProps, t
 		thumbProps,
 		trackProps
 	]);
+	const context = (0, react.useMemo)(() => ({
+		getThumbProps,
+		getTrackProps
+	}), [getThumbProps, getTrackProps]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComponentContext, {
-		value: (0, react.useMemo)(() => ({
-			getThumbProps,
-			getTrackProps
-		}), [getThumbProps, getTrackProps]),
+		value: context,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_factory.styled.div, {
 			...getRootProps(),
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.input, { ...getInputProps(inputProps) }), computedChildren]

package/dist/cjs/components/saturation-slider/saturation-slider.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"saturation-slider.cjs","names":["createSlotComponent","saturationSliderStyle","useSaturationSlider","styled"],"sources":["../../../../src/components/saturation-slider/saturation-slider.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { SaturationSliderStyle } from \"./saturation-slider.style\"\nimport type {\n UseSaturationSliderProps,\n UseSaturationSliderReturn,\n} from \"./use-saturation-slider\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { saturationSliderStyle } from \"./saturation-slider.style\"\nimport { useSaturationSlider } from \"./use-saturation-slider\"\n\ninterface ComponentContext extends Pick<\n UseSaturationSliderReturn,\n \"getThumbProps\" \| \"getTrackProps\"\n> {}\n\nexport interface SaturationSliderRootProps\n extends\n Merge<HTMLStyledProps, UseSaturationSliderProps>,\n ThemeProps<SaturationSliderStyle> {\n /*\n Props for the input element.\n /\n inputProps?: HTMLStyledProps<\"input\">\n /\n Props for the thumb element.\n /\n thumbProps?: SaturationSliderThumbProps\n /\n Props for the track element.\n /\n trackProps?: SaturationSliderTrackProps\n}\n\nconst {\n ComponentContext,\n PropsContext: SaturationSliderPropsContext,\n useComponentContext,\n usePropsContext: useSaturationSliderPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<\n SaturationSliderRootProps,\n SaturationSliderStyle,\n ComponentContext\n>(\"saturation-slider\", saturationSliderStyle)\n\nexport { SaturationSliderPropsContext, useSaturationSliderPropsContext }\n\n/\n `SaturationSlider` is a component used to allow the user to select a color saturation.\n \n @see https://yamada-ui.com/docs/components/saturation-slider\n */\nexport const SaturationSliderRoot = withProvider<\n \"input\",\n SaturationSliderRootProps\n>(({ children, inputProps, thumbProps, trackProps, ...rest }) => {\n const { getInputProps, getRootProps, getThumbProps, getTrackProps } =\n useSaturationSlider(rest)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return (\n <SaturationSliderTrack {...trackProps}>\n <SaturationSliderThumb {...thumbProps} />\n </SaturationSliderTrack>\n )\n }, [children, thumbProps, trackProps])\n const context = useMemo(\n () => ({ getThumbProps, getTrackProps }),\n [getThumbProps, getTrackProps],\n )\n\n return (\n <ComponentContext value={context}>\n <styled.div {...getRootProps()}>\n <styled.input {...getInputProps(inputProps)} />\n {computedChildren}\n </styled.div>\n </ComponentContext>\n )\n}, \"root\")()\n\nexport interface SaturationSliderTrackProps extends HTMLStyledProps {}\n\nexport const SaturationSliderTrack = withContext<\n \"div\",\n SaturationSliderTrackProps\n>(\"div\", \"track\")(undefined, (props) => {\n const { getTrackProps } = useComponentContext()\n\n return getTrackProps(props)\n})\n\nexport interface SaturationSliderThumbProps extends HTMLStyledProps {}\n\nexport const SaturationSliderThumb = withContext<\n \"div\",\n SaturationSliderThumbProps\n>(\"div\", \"thumb\")(undefined, (props) => {\n const { getThumbProps } = useComponentContext()\n\n return getThumbProps(props)\n})\n"],"mappings":";;;;;;;;AAqCA,MAAM,EACJ,kBACA,cAAc,8BACd,qBACA,iBAAiB,iCACjB,aACA,iBACEA,yBAAAA,oBAIF,qBAAqBC,gCAAAA,qBAAqB;;;;;;AAS5C,MAAa,uBAAuB,cAGjC,EAAE,UAAU,YAAY,YAAY,YAAY,GAAG,WAAW;CAC/D,MAAM,EAAE,eAAe,cAAc,eAAe,kBAClDC,8BAAAA,oBAAoB,IAAI;CAC1B,MAAM,oBAAA,GAAA,MAAA,QAAA,OAAiC;EACrC,IAAI,UAAU,OAAO;EAErB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAD;GAAuB,GAAI;aACzB,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAD,EAAuB,GAAI,WAAa,CAAA;EACnB,CAAA;CAE3B,GAAG;EAAC;EAAU;EAAY;CAAU,CAAC;~~CAMrC~~,~~OACE~~,~~iBAAA~~,GAAA,~~kBAAA,IAAA,CAAC,kBAAD;EAAkB,QAAA,GAAA,~~MAAA,QAAA,~~QALX~~;~~GAAE~~;~~GAAe~~;~~EAAc~~,IACtC,CAAC,eAAe,aAAa,~~CAIE~~;~~YAC7B~~,iBAAA,GAAA,kBAAA,KAAA,CAACC,gBAAAA,OAAO,KAAR;GAAY,GAAI,aAAa;aAA7B,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,gBAAAA,OAAO,OAAR,EAAc,GAAI,cAAc,UAAU,EAAI,CAAA,GAC7C,gBACS;;CACI,CAAA;AAEtB,GAAG,MAAM,CAAC,CAAC;AAIX,MAAa,wBAAwB,YAGnC,OAAO,OAAO,CAAC,CAAC,KAAA,IAAY,UAAU;CACtC,MAAM,EAAE,kBAAkB,oBAAoB;CAE9C,OAAO,cAAc,KAAK;AAC5B,CAAC;AAID,MAAa,wBAAwB,YAGnC,OAAO,OAAO,CAAC,CAAC,KAAA,IAAY,UAAU;CACtC,MAAM,EAAE,kBAAkB,oBAAoB;CAE9C,OAAO,cAAc,KAAK;AAC5B,CAAC"}
1	+ {"version":3,"file":"saturation-slider.cjs","names":["createSlotComponent","saturationSliderStyle","useSaturationSlider","styled"],"sources":["../../../../src/components/saturation-slider/saturation-slider.tsx"],"sourcesContent":["\"use client\"\n\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { SaturationSliderStyle } from \"./saturation-slider.style\"\nimport type {\n UseSaturationSliderProps,\n UseSaturationSliderReturn,\n} from \"./use-saturation-slider\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { saturationSliderStyle } from \"./saturation-slider.style\"\nimport { useSaturationSlider } from \"./use-saturation-slider\"\n\ninterface ComponentContext extends Pick<\n UseSaturationSliderReturn,\n \"getThumbProps\" \| \"getTrackProps\"\n> {}\n\nexport interface SaturationSliderRootProps\n extends\n Merge<HTMLStyledProps, UseSaturationSliderProps>,\n ThemeProps<SaturationSliderStyle> {\n /*\n Props for the input element.\n /\n inputProps?: HTMLStyledProps<\"input\">\n /\n Props for the thumb element.\n /\n thumbProps?: SaturationSliderThumbProps\n /\n Props for the track element.\n /\n trackProps?: SaturationSliderTrackProps\n}\n\nconst {\n ComponentContext,\n PropsContext: SaturationSliderPropsContext,\n useComponentContext,\n usePropsContext: useSaturationSliderPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<\n SaturationSliderRootProps,\n SaturationSliderStyle,\n ComponentContext\n>(\"saturation-slider\", saturationSliderStyle)\n\nexport { SaturationSliderPropsContext, useSaturationSliderPropsContext }\n\n/\n `SaturationSlider` is a component used to allow the user to select a color saturation.\n \n @see https://yamada-ui.com/docs/components/saturation-slider\n */\nexport const SaturationSliderRoot = withProvider<\n \"input\",\n SaturationSliderRootProps\n>(({ children, inputProps, thumbProps, trackProps, ...rest }) => {\n const { getInputProps, getRootProps, getThumbProps, getTrackProps } =\n useSaturationSlider(rest)\n const computedChildren = useMemo(() => {\n if (children) return children\n\n return (\n <SaturationSliderTrack {...trackProps}>\n <SaturationSliderThumb {...thumbProps} />\n </SaturationSliderTrack>\n )\n }, [children, thumbProps, trackProps])\n const context = useMemo(\n () => ({ getThumbProps, getTrackProps }),\n [getThumbProps, getTrackProps],\n )\n\n return (\n <ComponentContext value={context}>\n <styled.div {...getRootProps()}>\n <styled.input {...getInputProps(inputProps)} />\n {computedChildren}\n </styled.div>\n </ComponentContext>\n )\n}, \"root\")()\n\nexport interface SaturationSliderTrackProps extends HTMLStyledProps {}\n\nexport const SaturationSliderTrack = withContext<\n \"div\",\n SaturationSliderTrackProps\n>(\"div\", \"track\")(undefined, (props) => {\n const { getTrackProps } = useComponentContext()\n\n return getTrackProps(props)\n})\n\nexport interface SaturationSliderThumbProps extends HTMLStyledProps {}\n\nexport const SaturationSliderThumb = withContext<\n \"div\",\n SaturationSliderThumbProps\n>(\"div\", \"thumb\")(undefined, (props) => {\n const { getThumbProps } = useComponentContext()\n\n return getThumbProps(props)\n})\n"],"mappings":";;;;;;;;AAqCA,MAAM,EACJ,kBACA,cAAc,8BACd,qBACA,iBAAiB,iCACjB,aACA,iBACEA,yBAAAA,oBAIF,qBAAqBC,gCAAAA,qBAAqB;;;;;;AAS5C,MAAa,uBAAuB,cAGjC,EAAE,UAAU,YAAY,YAAY,YAAY,GAAG,WAAW;CAC/D,MAAM,EAAE,eAAe,cAAc,eAAe,kBAClDC,8BAAAA,oBAAoB,IAAI;CAC1B,MAAM,oBAAA,GAAA,MAAA,QAAA,OAAiC;EACrC,IAAI,UAAU,OAAO;EAErB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAD;GAAuB,GAAI;aACzB,iBAAA,GAAA,kBAAA,IAAA,CAAC,uBAAD,EAAuB,GAAI,WAAa,CAAA;EACnB,CAAA;CAE3B,GAAG;EAAC;EAAU;EAAY;CAAU,CAAC;CACrC,MAAM,WAAA,GAAA,MAAA,QAAA,QACG;EAAE;EAAe;CAAc,IACtC,CAAC,eAAe,aAAa,CAC/B;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;EAAkB,OAAO;YACvB,iBAAA,GAAA,kBAAA,KAAA,CAACC,gBAAAA,OAAO,KAAR;GAAY,GAAI,aAAa;aAA7B,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,gBAAAA,OAAO,OAAR,EAAc,GAAI,cAAc,UAAU,EAAI,CAAA,GAC7C,gBACS;;CACI,CAAA;AAEtB,GAAG,MAAM,CAAC,CAAC;AAIX,MAAa,wBAAwB,YAGnC,OAAO,OAAO,CAAC,CAAC,KAAA,IAAY,UAAU;CACtC,MAAM,EAAE,kBAAkB,oBAAoB;CAE9C,OAAO,cAAc,KAAK;AAC5B,CAAC;AAID,MAAa,wBAAwB,YAGnC,OAAO,OAAO,CAAC,CAAC,KAAA,IAAY,UAAU;CACtC,MAAM,EAAE,kBAAkB,oBAAoB;CAE9C,OAAO,cAAc,KAAK;AAC5B,CAAC"}

package/dist/cjs/components/saturation-slider/use-saturation-slider.cjs CHANGED Viewed

@@ -38,7 +38,8 @@ const useSaturationSlider = (props = {}) => {
 		},
 		onMove: (_, point, rect) => {
 			if (!interactive) return;
-			setValue(getPanValue(point, rect));
+			const panValue = getPanValue(point, rect);
+			setValue(panValue);
 		},
 		onStart: (_, point, rect) => {
 			if (!interactive) return;

package/dist/cjs/components/saturation-slider/use-saturation-slider.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-saturation-slider.cjs","names":["useFieldProps","useI18n","useControllableState","usePanEvent","mergeProps","visuallyHiddenAttributes","mergeRefs"],"sources":["../../../../src/components/saturation-slider/use-saturation-slider.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { Point } from \"../../utils\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { usePanEvent } from \"../../hooks/use-pan-event\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n clampNumber,\n cx,\n handlerAll,\n mergeRefs,\n roundNumberToStep,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { runKeyAction } from \"../../utils/dom\"\nimport { useFieldProps } from \"../field\"\n\nfunction clampValue(value: [number, number, number]) {\n return [\n clampNumber(value[0], 0, 360),\n clampNumber(value[1], 0, 1),\n clampNumber(value[2], 0, 1),\n ] as [number, number, number]\n}\n\nexport interface UseSaturationSliderProps\n extends\n Omit<HTMLProps, \"defaultValue\" \| \"onChange\" \| \"ref\">,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /*\n The initial value of the saturation slider.\n \n @default [0, 0, 1]\n /\n defaultValue?: [number, number, number]\n /\n The base `id` to use for the slider.\n /\n id?: string\n /\n The name attribute of the hidden `input` field.\n * This is particularly useful in forms.\n /\n name?: string\n /\n The step in which increments or decrements have to be made.\n \n @default 0.01\n /\n step?: number\n /\n The value of the saturation slider.\n /\n value?: [number, number, number]\n /\n This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n \n It is used to set the `aria-valuetext` property of the input.\n /\n getAriaValueText?: (value: [number, number, number]) => string \| undefined\n /\n Function called whenever the saturation slider value changes.\n /\n onChange?: (value: [number, number, number]) => void\n /\n Function called when the user is done selecting a new value.\n /\n onChangeEnd?: (value: [number, number, number]) => void\n /\n Function called when the user starts selecting a new value.\n /\n onChangeStart?: (value: [number, number, number]) => void\n}\n\nexport const useSaturationSlider = (props: UseSaturationSliderProps = {}) => {\n const {\n props: {\n id,\n ref,\n name,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-valuetext\": ariaValueText,\n defaultValue = [0, 0, 1],\n disabled,\n getAriaValueText,\n readOnly,\n required,\n step = 0.01,\n value: valueProp,\n onChange: onChangeProp,\n onChangeEnd,\n onChangeStart,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const { t } = useI18n(\"saturationSlider\")\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [h, s, v] = clampValue(value)\n const interactive = !(disabled \|\| readOnly)\n const [_, getPanEventProps] = usePanEvent<HTMLDivElement>({\n onEnd: (_, point, rect) => {\n if (!interactive) return\n\n const panValue = getPanValue(point, rect)\n\n onChangeEnd?.(panValue)\n },\n onMove: (_, point, rect) => {\n if (!interactive) return\n\n const panValue = getPanValue(point, rect)\n\n setValue(panValue)\n },\n onStart: (_, point, rect) => {\n if (!interactive) return\n\n const panValue = getPanValue(point, rect)\n\n onChangeStart?.(value)\n setValue(panValue)\n },\n })\n\n const onChange = useCallback(\n ([h, s, v]: [number, number, number]) => {\n if (!interactive) return\n\n s = clampNumber(s, 0, 1)\n v = clampNumber(v, 0, 1)\n\n setValue([h, s, v])\n },\n [interactive, setValue],\n )\n\n const getPanValue = useCallback(\n (\n { x, y }: Point,\n { bottom, height, left, width }: DOMRect,\n ): [number, number, number] => {\n const diff = { x: x - left, y: bottom - y }\n const percent = { x: diff.x / width, y: diff.y / height }\n const clamp = {\n x: clampNumber(percent.x, 0, 1),\n y: clampNumber(percent.y, 0, 1),\n }\n const s = roundNumberToStep(clamp.x, 0, step)\n const v = roundNumberToStep(clamp.y, 0, step)\n\n return [h, parseFloat(s), parseFloat(v)]\n },\n [h, step],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n runKeyAction(ev, {\n ArrowDown: () => onChange([h, s, v - step]),\n ArrowLeft: () => onChange([h, s - step, v]),\n ArrowRight: () => onChange([h, s + step, v]),\n ArrowUp: () => onChange([h, s, v + step]),\n })\n },\n [h, onChange, s, step, v],\n )\n\n const getRootProps: PropGetter = useCallback(\n (props = {}) => {\n const merged = mergeProps(dataProps, rest, props)()\n\n return {\n ...merged,\n style: {\n ...rest.style,\n ...props.style,\n \"--x\": `${Math.abs(s 100)}%`,\n \"--y\": `${Math.abs(100 - v * 100)}%`,\n backgroundColor: `hsl(${h}, 100%, 50%)`,\n backgroundImage:\n \"linear-gradient(0deg, #000, transparent), linear-gradient(90deg, #fff, transparent)\",\n },\n onBlur: handlerAll(props.onBlur, eventProps.onBlur),\n onFocus: handlerAll(props.onFocus, eventProps.onFocus),\n }\n },\n [dataProps, eventProps, h, rest, s, v],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...visuallyHiddenAttributes,\n ...dataProps,\n ...ariaProps,\n id,\n type: \"hidden\",\n name,\n disabled,\n readOnly,\n required,\n value: [h, s, v].toString(),\n ...props,\n ref: mergeRefs(props.ref, ref),\n }),\n [\n ariaProps,\n dataProps,\n disabled,\n h,\n id,\n name,\n readOnly,\n ref,\n required,\n s,\n v,\n ],\n )\n\n const getTrackProps: PropGetter = useCallback(\n (props = {}) => getPanEventProps({ ...dataProps, ...props }),\n [dataProps, getPanEventProps],\n )\n\n const getThumbProps: PropGetter = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...ariaProps,\n \"aria-label\": t(\"Saturation and brightness thumb\"),\n \"aria-roledescription\": \"2D slider\",\n \"aria-valuemax\": 100,\n \"aria-valuemin\": 0,\n \"aria-valuenow\": s * 100,\n \"aria-valuetext\":\n ariaValueText ??\n getAriaValueText?.(value) ??\n t(\"Saturation {saturation}%, Brightness {brightness}%\", {\n brightness: v * 100,\n saturation: s * 100,\n }),\n role: \"slider\",\n tabIndex: interactive ? 0 : -1,\n ...props,\n \"aria-labelledby\": cx(props[\"aria-labelledby\"], ariaLabelledBy),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n ariaLabelledBy,\n ariaProps,\n ariaValueText,\n dataProps,\n getAriaValueText,\n interactive,\n onKeyDown,\n s,\n t,\n v,\n value,\n ],\n )\n\n return {\n setValue,\n value,\n getInputProps,\n getRootProps,\n getThumbProps,\n getTrackProps,\n onChange,\n }\n}\n\nexport type UseSaturationSliderReturn = ReturnType<typeof useSaturationSlider>\n"],"mappings":"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"}
1	+ {"version":3,"file":"use-saturation-slider.cjs","names":["useFieldProps","useI18n","useControllableState","usePanEvent","mergeProps","visuallyHiddenAttributes","mergeRefs"],"sources":["../../../../src/components/saturation-slider/use-saturation-slider.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { Point } from \"../../utils\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { usePanEvent } from \"../../hooks/use-pan-event\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n clampNumber,\n cx,\n handlerAll,\n mergeRefs,\n roundNumberToStep,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { runKeyAction } from \"../../utils/dom\"\nimport { useFieldProps } from \"../field\"\n\nfunction clampValue(value: [number, number, number]) {\n return [\n clampNumber(value[0], 0, 360),\n clampNumber(value[1], 0, 1),\n clampNumber(value[2], 0, 1),\n ] as [number, number, number]\n}\n\nexport interface UseSaturationSliderProps\n extends\n Omit<HTMLProps, \"defaultValue\" \| \"onChange\" \| \"ref\">,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /*\n The initial value of the saturation slider.\n \n @default [0, 0, 1]\n /\n defaultValue?: [number, number, number]\n /\n The base `id` to use for the slider.\n /\n id?: string\n /\n The name attribute of the hidden `input` field.\n * This is particularly useful in forms.\n /\n name?: string\n /\n The step in which increments or decrements have to be made.\n \n @default 0.01\n /\n step?: number\n /\n The value of the saturation slider.\n /\n value?: [number, number, number]\n /\n This is used to format the value so that screen readers\n * can speak out a more human-friendly value.\n \n It is used to set the `aria-valuetext` property of the input.\n /\n getAriaValueText?: (value: [number, number, number]) => string \| undefined\n /\n Function called whenever the saturation slider value changes.\n /\n onChange?: (value: [number, number, number]) => void\n /\n Function called when the user is done selecting a new value.\n /\n onChangeEnd?: (value: [number, number, number]) => void\n /\n Function called when the user starts selecting a new value.\n /\n onChangeStart?: (value: [number, number, number]) => void\n}\n\nexport const useSaturationSlider = (props: UseSaturationSliderProps = {}) => {\n const {\n props: {\n id,\n ref,\n name,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-valuetext\": ariaValueText,\n defaultValue = [0, 0, 1],\n disabled,\n getAriaValueText,\n readOnly,\n required,\n step = 0.01,\n value: valueProp,\n onChange: onChangeProp,\n onChangeEnd,\n onChangeStart,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const { t } = useI18n(\"saturationSlider\")\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [h, s, v] = clampValue(value)\n const interactive = !(disabled \|\| readOnly)\n const [_, getPanEventProps] = usePanEvent<HTMLDivElement>({\n onEnd: (_, point, rect) => {\n if (!interactive) return\n\n const panValue = getPanValue(point, rect)\n\n onChangeEnd?.(panValue)\n },\n onMove: (_, point, rect) => {\n if (!interactive) return\n\n const panValue = getPanValue(point, rect)\n\n setValue(panValue)\n },\n onStart: (_, point, rect) => {\n if (!interactive) return\n\n const panValue = getPanValue(point, rect)\n\n onChangeStart?.(value)\n setValue(panValue)\n },\n })\n\n const onChange = useCallback(\n ([h, s, v]: [number, number, number]) => {\n if (!interactive) return\n\n s = clampNumber(s, 0, 1)\n v = clampNumber(v, 0, 1)\n\n setValue([h, s, v])\n },\n [interactive, setValue],\n )\n\n const getPanValue = useCallback(\n (\n { x, y }: Point,\n { bottom, height, left, width }: DOMRect,\n ): [number, number, number] => {\n const diff = { x: x - left, y: bottom - y }\n const percent = { x: diff.x / width, y: diff.y / height }\n const clamp = {\n x: clampNumber(percent.x, 0, 1),\n y: clampNumber(percent.y, 0, 1),\n }\n const s = roundNumberToStep(clamp.x, 0, step)\n const v = roundNumberToStep(clamp.y, 0, step)\n\n return [h, parseFloat(s), parseFloat(v)]\n },\n [h, step],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLDivElement>) => {\n runKeyAction(ev, {\n ArrowDown: () => onChange([h, s, v - step]),\n ArrowLeft: () => onChange([h, s - step, v]),\n ArrowRight: () => onChange([h, s + step, v]),\n ArrowUp: () => onChange([h, s, v + step]),\n })\n },\n [h, onChange, s, step, v],\n )\n\n const getRootProps: PropGetter = useCallback(\n (props = {}) => {\n const merged = mergeProps(dataProps, rest, props)()\n\n return {\n ...merged,\n style: {\n ...rest.style,\n ...props.style,\n \"--x\": `${Math.abs(s 100)}%`,\n \"--y\": `${Math.abs(100 - v * 100)}%`,\n backgroundColor: `hsl(${h}, 100%, 50%)`,\n backgroundImage:\n \"linear-gradient(0deg, #000, transparent), linear-gradient(90deg, #fff, transparent)\",\n },\n onBlur: handlerAll(props.onBlur, eventProps.onBlur),\n onFocus: handlerAll(props.onFocus, eventProps.onFocus),\n }\n },\n [dataProps, eventProps, h, rest, s, v],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...visuallyHiddenAttributes,\n ...dataProps,\n ...ariaProps,\n id,\n type: \"hidden\",\n name,\n disabled,\n readOnly,\n required,\n value: [h, s, v].toString(),\n ...props,\n ref: mergeRefs(props.ref, ref),\n }),\n [\n ariaProps,\n dataProps,\n disabled,\n h,\n id,\n name,\n readOnly,\n ref,\n required,\n s,\n v,\n ],\n )\n\n const getTrackProps: PropGetter = useCallback(\n (props = {}) => getPanEventProps({ ...dataProps, ...props }),\n [dataProps, getPanEventProps],\n )\n\n const getThumbProps: PropGetter = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...ariaProps,\n \"aria-label\": t(\"Saturation and brightness thumb\"),\n \"aria-roledescription\": \"2D slider\",\n \"aria-valuemax\": 100,\n \"aria-valuemin\": 0,\n \"aria-valuenow\": s * 100,\n \"aria-valuetext\":\n ariaValueText ??\n getAriaValueText?.(value) ??\n t(\"Saturation {saturation}%, Brightness {brightness}%\", {\n brightness: v * 100,\n saturation: s * 100,\n }),\n role: \"slider\",\n tabIndex: interactive ? 0 : -1,\n ...props,\n \"aria-labelledby\": cx(props[\"aria-labelledby\"], ariaLabelledBy),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n ariaLabelledBy,\n ariaProps,\n ariaValueText,\n dataProps,\n getAriaValueText,\n interactive,\n onKeyDown,\n s,\n t,\n v,\n value,\n ],\n )\n\n return {\n setValue,\n value,\n getInputProps,\n getRootProps,\n getThumbProps,\n getTrackProps,\n onChange,\n }\n}\n\nexport type UseSaturationSliderReturn = ReturnType<typeof useSaturationSlider>\n"],"mappings":"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"}