npm - @yamada-ui/react - Versions diffs - 2.1.8-dev-20260409035719 → 2.2.0-dev-20260409110358 - Mend

@yamada-ui/react 2.1.8-dev-20260409035719 → 2.2.0-dev-20260409110358

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 (678) hide show

package/dist/cjs/components/color-picker/color-picker.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"color-picker.cjs","names":["createSlotComponent","colorPickerStyle","useGroupItemProps","useColorPicker","useInputBorder","useInputPropsContext","ColorSwatch","PipetteIcon"],"sources":["../../../../src/components/color-picker/color-picker.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type {\n Direction,\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n} from \"../../core\"\nimport type { ColorSwatchProps } from \"../color-swatch\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { PopupAnimationProps } from \"../popover\"\nimport type { ColorPickerStyle } from \"./color-picker.style\"\nimport type {\n UseColorPickerProps,\n UseColorPickerReturn,\n} from \"./use-color-picker\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent } from \"../../core\"\nimport { cast } from \"../../utils\"\nimport { ColorSelector } from \"../color-selector\"\nimport { ColorSwatch } from \"../color-swatch\"\nimport { useGroupItemProps } from \"../group\"\nimport { PipetteIcon } from \"../icon\"\nimport { InputGroup, useInputBorder, useInputPropsContext } from \"../input\"\nimport { Popover } from \"../popover\"\nimport { colorPickerStyle } from \"./color-picker.style\"\nimport { useColorPicker } from \"./use-color-picker\"\n\ninterface ComponentContext\n extends\n Pick<ColorPickerProps, \"inputProps\">,\n Pick<\n UseColorPickerReturn,\n \"getEyeDropperProps\" \| \"getInputProps\" \| \"value\"\n > {}\n\nexport interface ColorPickerProps\n extends\n Omit<HTMLStyledProps, \"defaultValue\" \| \"offset\" \| \"onChange\" \| \"ref\">,\n UseColorPickerProps,\n PopupAnimationProps,\n Pick<\n ColorSelector.RootProps,\n \| \"alphaSliderProps\"\n \| \"colorSwatches\"\n \| \"colorSwatchGroupColumns\"\n \| \"colorSwatchGroupLabel\"\n \| \"colorSwatchGroupLabelProps\"\n \| \"colorSwatchGroupProps\"\n \| \"colorSwatchItemProps\"\n \| \"hueSliderProps\"\n \| \"saturationSliderProps\"\n >,\n ThemeProps<ColorPickerStyle>,\n UseInputBorderProps {\n /*\n The placement of the popper relative to its reference.\n \n @default 'end-start'\n /\n placement?: Direction\n /\n If `true`, the color swatch component will be displayed.\n \n @default true\n /\n withColorSwatch?: boolean\n /\n If `true`, the eye dropper component will be displayed.\n \n @default true\n /\n withEyeDropper?: boolean\n /\n Props for the color swatch component.\n /\n colorSwatchProps?: ColorPickerColorSwatchProps\n /\n Props for content element.\n /\n contentProps?: ColorPickerContentProps\n /\n The props for the input element.\n /\n elementProps?: InputGroup.ElementProps\n /\n The props for the end element.\n /\n endElementProps?: InputGroup.ElementProps\n /\n Props for the eye dropper component.\n /\n eyeDropperProps?: ColorPickerEyeDropperProps\n /\n The props for the field component.\n /\n fieldProps?: ColorPickerFieldProps\n /\n The props for the input element.\n /\n inputProps?: HTMLStyledProps<\"input\">\n /\n Props for root element.\n /\n rootProps?: InputGroup.RootProps\n /\n Props for the selector component.\n /\n selectorProps?: ColorSelector.RootProps\n /\n The props for the start element.\n /\n startElementProps?: InputGroup.ElementProps\n}\n\nconst {\n ComponentContext,\n PropsContext: ColorPickerPropsContext,\n useComponentContext,\n usePropsContext: useColorPickerPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<ColorPickerProps, ColorPickerStyle, ComponentContext>(\n \"color-picker\",\n colorPickerStyle,\n)\n\nexport { ColorPickerPropsContext, useColorPickerPropsContext }\n\n/\n `ColorPicker` is a component used by the user to select a color or enter an arbitrary color value.\n \n @see https://yamada-ui.com/docs/components/color-picker\n */\nexport const ColorPicker = withProvider<\"input\", ColorPickerProps, \"size\">(\n (props) => {\n const [\n groupItemProps,\n {\n className,\n css,\n colorScheme,\n size,\n animationScheme = \"block-start\",\n colorSwatches,\n colorSwatchGroupColumns,\n colorSwatchGroupLabel,\n duration,\n errorBorderColor,\n focusBorderColor,\n withColorSwatch = true,\n withEyeDropper = true,\n alphaSliderProps,\n colorSwatchGroupLabelProps,\n colorSwatchGroupProps,\n colorSwatchItemProps,\n colorSwatchProps,\n contentProps,\n elementProps,\n endElementProps,\n eyeDropperProps,\n fieldProps,\n hueSliderProps,\n inputProps,\n rootProps,\n saturationSliderProps,\n selectorProps,\n startElementProps,\n ...rest\n },\n ] = useGroupItemProps(props)\n const {\n value,\n getContentProps,\n getEyeDropperProps,\n getFieldProps,\n getInputProps,\n getRootProps,\n getSelectorProps,\n popoverProps,\n } = useColorPicker(rest)\n const mergedPopoverProps = useMemo<Popover.RootProps>(\n () => ({\n animationScheme,\n duration,\n ...popoverProps,\n }),\n [animationScheme, duration, popoverProps],\n )\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const componentContext = useMemo(\n () => ({ value, getEyeDropperProps, getInputProps, inputProps }),\n [getEyeDropperProps, getInputProps, inputProps, value],\n )\n\n return (\n <ComponentContext value={componentContext}>\n <Popover.Root {...mergedPopoverProps}>\n <InputGroup.Root\n className={className}\n css={css}\n colorScheme={colorScheme}\n {...getRootProps({ ...groupItemProps, ...rootProps })}\n >\n {withColorSwatch ? (\n <InputGroup.Element {...elementProps} {...startElementProps}>\n <ColorPickerColorSwatch {...colorSwatchProps} />\n </InputGroup.Element>\n ) : null}\n\n <Popover.Trigger>\n <ColorPickerField\n {...getFieldProps({ ...varProps, ...fieldProps })}\n />\n </Popover.Trigger>\n\n {withEyeDropper ? (\n <InputGroup.Element\n clickable\n {...elementProps}\n {...endElementProps}\n >\n <ColorPickerEyeDropper\n {...getEyeDropperProps(eyeDropperProps)}\n />\n </InputGroup.Element>\n ) : null}\n </InputGroup.Root>\n\n <ColorPickerContent\n {...cast<ColorPickerContentProps>(\n getContentProps(cast<HTMLProps>(contentProps)),\n )}\n >\n <ColorSelector.Root\n size={size}\n {...getSelectorProps({\n colorSwatches,\n colorSwatchGroupColumns,\n colorSwatchGroupLabel,\n alphaSliderProps,\n colorSwatchGroupLabelProps,\n colorSwatchGroupProps,\n colorSwatchItemProps,\n hueSliderProps,\n saturationSliderProps,\n ...selectorProps,\n })}\n />\n </ColorPickerContent>\n </Popover.Root>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"size\"] },\n)((props) => {\n const context = useInputPropsContext()\n\n return { ...context, ...props }\n})\n\ninterface ColorPickerFieldProps extends HTMLStyledProps {}\n\nconst ColorPickerField = withContext<\"div\", ColorPickerFieldProps>(\n \"div\",\n \"field\",\n)({ \"data-group-propagate\": \"\" }, (props) => {\n const { getInputProps, inputProps } = useComponentContext()\n\n return {\n children: <ColorPickerInput {...getInputProps(inputProps)} />,\n ...props,\n }\n})\n\ninterface ColorPickerInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst ColorPickerInput = withContext<\"input\", ColorPickerInputProps>(\n \"input\",\n \"input\",\n)()\n\ninterface ColorPickerColorSwatchProps extends ColorSwatchProps {}\n\nconst ColorPickerColorSwatch = withContext<\"div\", ColorPickerColorSwatchProps>(\n ColorSwatch,\n \"colorSwatch\",\n)(undefined, (props) => {\n const { value } = useComponentContext()\n\n return { variant: \"circle\", color: value, ...props }\n})\n\ninterface ColorPickerEyeDropperProps extends HTMLStyledProps {\n icon?: ReactNode\n}\n\nconst ColorPickerEyeDropper = withContext<\"div\", ColorPickerEyeDropperProps>(\n \"div\",\n \"eyeDropper\",\n)(undefined, ({ children, icon, ...rest }) => {\n const { getEyeDropperProps } = useComponentContext()\n\n return getEyeDropperProps({\n children: icon \|\| children \|\| <PipetteIcon />,\n ...rest,\n })\n})\n\ninterface ColorPickerContentProps extends Popover.ContentProps {}\n\nconst ColorPickerContent = withContext<\"div\", ColorPickerContentProps>(\n Popover.Content,\n \"content\",\n)()\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoHA,MAAM,EACJ,kBACA,cAAc,yBACd,qBACA,iBAAiB,4BACjB,aACA,iBACEA,6CACF,gBACAC,4CACD;;;;;;AASD,MAAa,cAAc,cACxB,UAAU;CACT,MAAM,CACJ,gBACA,EACE,WACA,KACA,aACA,MACA,kBAAkB,eAClB,eACA,yBACA,uBACA,UACA,kBACA,kBACA,kBAAkB,MAClB,iBAAiB,MACjB,kBACA,4BACA,uBACA,sBACA,kBACA,cACA,cACA,iBACA,iBACA,YACA,gBACA,YACA,WACA,uBACA,eACA,mBACA,GAAG,UAEHC,oCAAkB,MAAM;CAC5B,MAAM,EACJ,OACA,iBACA,oBACA,eACA,eACA,cACA,kBACA,iBACEC,wCAAe,KAAK;CACxB,MAAM,+CACG;EACL;EACA;EACA,GAAG;EACJ,GACD;EAAC;EAAiB;EAAU;EAAa,CAC1C;CACD,MAAM,WAAWC,wCAAe;EAAE;EAAkB;EAAkB,CAAC;AAMvE,QACE,2CAAC;EAAiB,iCALX;GAAE;GAAO;GAAoB;GAAe;GAAY,GAC/D;GAAC;GAAoB;GAAe;GAAY;GAAM,CACvD;YAIG;GAAc,GAAI;cAChB;IACa;IACN;IACQ;IACb,GAAI,aAAa;KAAE,GAAG;KAAgB,GAAG;KAAW,CAAC;;KAEpD,kBACC;MAAoB,GAAI;MAAc,GAAI;gBACxC,2CAAC,0BAAuB,GAAI,mBAAoB;OAC7B,GACnB;KAEJ,uFACE,2CAAC,oBACC,GAAI,cAAc;MAAE,GAAG;MAAU,GAAG;MAAY,CAAC,GACjD,GACc;KAEjB,iBACC;MACE;MACA,GAAI;MACJ,GAAI;gBAEJ,2CAAC,yBACC,GAAI,mBAAmB,gBAAgB,GACvC;OACiB,GACnB;;KACY,EAElB,2CAAC;IACC,+CACE,4DAAgC,aAAa,CAAC,CAC/C;cAED;KACQ;KACN,GAAI,iBAAiB;MACnB;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA,GAAG;MACJ,CAAC;MACF;KACiB;IACR;GACE;GAGvB,QACA,EAAE,eAAe,CAAC,OAAO,EAAE,CAC5B,EAAE,UAAU;AAGX,QAAO;EAAE,GAFOC,oCAAsB;EAEjB,GAAG;EAAO;EAC/B;AAIF,MAAM,mBAAmB,YACvB,OACA,QACD,CAAC,EAAE,wBAAwB,IAAI,GAAG,UAAU;CAC3C,MAAM,EAAE,eAAe,eAAe,qBAAqB;AAE3D,QAAO;EACL,UAAU,2CAAC,oBAAiB,GAAI,cAAc,WAAW,GAAI;EAC7D,GAAG;EACJ;EACD;AAIF,MAAM,mBAAmB,YACvB,SACA,QACD,EAAE;AAIH,MAAM,yBAAyB,YAC7BC,kCACA,cACD,CAAC,SAAY,UAAU;CACtB,MAAM,EAAE,UAAU,qBAAqB;AAEvC,QAAO;EAAE,SAAS;EAAU,OAAO;EAAO,GAAG;EAAO;EACpD;AAMF,MAAM,wBAAwB,YAC5B,OACA,aACD,CAAC,SAAY,EAAE,UAAU,MAAM,GAAG,WAAW;CAC5C,MAAM,EAAE,uBAAuB,qBAAqB;AAEpD,QAAO,mBAAmB;EACxB,UAAU,QAAQ,YAAY,2CAACC,qCAAc;EAC7C,GAAG;EACJ,CAAC;EACF;AAIF,MAAM,qBAAqB,4CAEzB,UACD,EAAE"}
1	+ {"version":3,"file":"color-picker.cjs","names":["createSlotComponent","colorPickerStyle","useGroupItemProps","usePopoverStyleProps","useColorPicker","useInputBorder","useInputPropsContext","ColorSwatch","PipetteIcon"],"sources":["../../../../src/components/color-picker/color-picker.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { ColorSwatchProps } from \"../color-swatch\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { UsePopoverStyleProps, UsePopupAnimationProps } from \"../popover\"\nimport type { ColorPickerStyle } from \"./color-picker.style\"\nimport type {\n UseColorPickerProps,\n UseColorPickerReturn,\n} from \"./use-color-picker\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent } from \"../../core\"\nimport { cast } from \"../../utils\"\nimport { ColorSelector } from \"../color-selector\"\nimport { ColorSwatch } from \"../color-swatch\"\nimport { useGroupItemProps } from \"../group\"\nimport { PipetteIcon } from \"../icon\"\nimport { InputGroup, useInputBorder, useInputPropsContext } from \"../input\"\nimport { Popover, usePopoverStyleProps } from \"../popover\"\nimport { colorPickerStyle } from \"./color-picker.style\"\nimport { useColorPicker } from \"./use-color-picker\"\n\ninterface ComponentContext\n extends\n Pick<ColorPickerProps, \"inputProps\">,\n Pick<\n UseColorPickerReturn,\n \"getEyeDropperProps\" \| \"getInputProps\" \| \"value\"\n > {}\n\nexport interface ColorPickerProps\n extends\n Omit<HTMLStyledProps, \"defaultValue\" \| \"offset\" \| \"onChange\" \| \"ref\">,\n Merge<UseColorPickerProps, UsePopoverStyleProps>,\n UsePopupAnimationProps,\n Pick<\n ColorSelector.RootProps,\n \| \"alphaSliderProps\"\n \| \"colorSwatches\"\n \| \"colorSwatchGroupColumns\"\n \| \"colorSwatchGroupLabel\"\n \| \"colorSwatchGroupLabelProps\"\n \| \"colorSwatchGroupProps\"\n \| \"colorSwatchItemProps\"\n \| \"hueSliderProps\"\n \| \"saturationSliderProps\"\n >,\n ThemeProps<ColorPickerStyle>,\n UseInputBorderProps {\n /*\n The placement of the popper relative to its reference.\n \n @default 'end-start'\n /\n placement?: Popover.RootProps[\"placement\"]\n /\n If `true`, the color swatch component will be displayed.\n \n @default true\n /\n withColorSwatch?: boolean\n /\n If `true`, the eye dropper component will be displayed.\n \n @default true\n /\n withEyeDropper?: boolean\n /\n Props for the color swatch component.\n /\n colorSwatchProps?: ColorPickerColorSwatchProps\n /\n Props for content element.\n /\n contentProps?: ColorPickerContentProps\n /\n The props for the input element.\n /\n elementProps?: InputGroup.ElementProps\n /\n The props for the end element.\n /\n endElementProps?: InputGroup.ElementProps\n /\n Props for the eye dropper component.\n /\n eyeDropperProps?: ColorPickerEyeDropperProps\n /\n The props for the field component.\n /\n fieldProps?: ColorPickerFieldProps\n /\n The props for the input element.\n /\n inputProps?: HTMLStyledProps<\"input\">\n /\n Props for root element.\n /\n rootProps?: InputGroup.RootProps\n /\n Props for the selector component.\n /\n selectorProps?: ColorSelector.RootProps\n /\n The props for the start element.\n /\n startElementProps?: InputGroup.ElementProps\n}\n\nconst {\n ComponentContext,\n PropsContext: ColorPickerPropsContext,\n useComponentContext,\n usePropsContext: useColorPickerPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<ColorPickerProps, ColorPickerStyle, ComponentContext>(\n \"color-picker\",\n colorPickerStyle,\n)\n\nexport { ColorPickerPropsContext, useColorPickerPropsContext }\n\n/\n `ColorPicker` is a component used by the user to select a color or enter an arbitrary color value.\n \n @see https://yamada-ui.com/docs/components/color-picker\n */\nexport const ColorPicker = withProvider<\"input\", ColorPickerProps, \"size\">(\n (props) => {\n const [\n groupItemProps,\n {\n className,\n css,\n colorScheme,\n size,\n animationScheme = \"block-start\",\n colorSwatches,\n colorSwatchGroupColumns,\n colorSwatchGroupLabel,\n duration,\n errorBorderColor,\n focusBorderColor,\n withColorSwatch = true,\n withEyeDropper = true,\n alphaSliderProps,\n colorSwatchGroupLabelProps,\n colorSwatchGroupProps,\n colorSwatchItemProps,\n colorSwatchProps,\n contentProps,\n elementProps,\n endElementProps,\n eyeDropperProps,\n fieldProps,\n hueSliderProps,\n inputProps,\n rootProps,\n saturationSliderProps,\n selectorProps,\n startElementProps,\n ...rest\n },\n ] = useGroupItemProps(props)\n const popoverStyleProps = usePopoverStyleProps(rest)\n const {\n value,\n getContentProps,\n getEyeDropperProps,\n getFieldProps,\n getInputProps,\n getRootProps,\n getSelectorProps,\n popoverProps,\n } = useColorPicker({ ...rest, ...popoverStyleProps })\n const mergedPopoverProps = useMemo<Popover.RootProps>(\n () => ({\n animationScheme,\n duration,\n ...popoverProps,\n }),\n [animationScheme, duration, popoverProps],\n )\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const componentContext = useMemo(\n () => ({ value, getEyeDropperProps, getInputProps, inputProps }),\n [getEyeDropperProps, getInputProps, inputProps, value],\n )\n\n return (\n <ComponentContext value={componentContext}>\n <Popover.Root {...mergedPopoverProps}>\n <InputGroup.Root\n className={className}\n css={css}\n colorScheme={colorScheme}\n {...getRootProps({ ...groupItemProps, ...rootProps })}\n >\n {withColorSwatch ? (\n <InputGroup.Element {...elementProps} {...startElementProps}>\n <ColorPickerColorSwatch {...colorSwatchProps} />\n </InputGroup.Element>\n ) : null}\n\n <Popover.Trigger>\n <ColorPickerField\n {...getFieldProps({ ...varProps, ...fieldProps })}\n />\n </Popover.Trigger>\n\n {withEyeDropper ? (\n <InputGroup.Element\n clickable\n {...elementProps}\n {...endElementProps}\n >\n <ColorPickerEyeDropper\n {...getEyeDropperProps(eyeDropperProps)}\n />\n </InputGroup.Element>\n ) : null}\n </InputGroup.Root>\n\n <ColorPickerContent\n {...cast<ColorPickerContentProps>(\n getContentProps(cast<HTMLProps>(contentProps)),\n )}\n >\n <ColorSelector.Root\n size={size}\n {...getSelectorProps({\n colorSwatches,\n colorSwatchGroupColumns,\n colorSwatchGroupLabel,\n alphaSliderProps,\n colorSwatchGroupLabelProps,\n colorSwatchGroupProps,\n colorSwatchItemProps,\n hueSliderProps,\n saturationSliderProps,\n ...selectorProps,\n })}\n />\n </ColorPickerContent>\n </Popover.Root>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"size\"] },\n)((props) => {\n const context = useInputPropsContext()\n\n return { ...context, ...props }\n})\n\ninterface ColorPickerFieldProps extends HTMLStyledProps {}\n\nconst ColorPickerField = withContext<\"div\", ColorPickerFieldProps>(\n \"div\",\n \"field\",\n)({ \"data-group-propagate\": \"\" }, (props) => {\n const { getInputProps, inputProps } = useComponentContext()\n\n return {\n children: <ColorPickerInput {...getInputProps(inputProps)} />,\n ...props,\n }\n})\n\ninterface ColorPickerInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst ColorPickerInput = withContext<\"input\", ColorPickerInputProps>(\n \"input\",\n \"input\",\n)()\n\ninterface ColorPickerColorSwatchProps extends ColorSwatchProps {}\n\nconst ColorPickerColorSwatch = withContext<\"div\", ColorPickerColorSwatchProps>(\n ColorSwatch,\n \"colorSwatch\",\n)(undefined, (props) => {\n const { value } = useComponentContext()\n\n return { variant: \"circle\", color: value, ...props }\n})\n\ninterface ColorPickerEyeDropperProps extends HTMLStyledProps {\n icon?: ReactNode\n}\n\nconst ColorPickerEyeDropper = withContext<\"div\", ColorPickerEyeDropperProps>(\n \"div\",\n \"eyeDropper\",\n)(undefined, ({ children, icon, ...rest }) => {\n const { getEyeDropperProps } = useComponentContext()\n\n return getEyeDropperProps({\n children: icon \|\| children \|\| <PipetteIcon />,\n ...rest,\n })\n})\n\ninterface ColorPickerContentProps extends Popover.ContentProps {}\n\nconst ColorPickerContent = withContext<\"div\", ColorPickerContentProps>(\n Popover.Content,\n \"content\",\n)()\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAgHA,MAAM,EACJ,kBACA,cAAc,yBACd,qBACA,iBAAiB,4BACjB,aACA,iBACEA,6CACF,gBACAC,4CACD;;;;;;AASD,MAAa,cAAc,cACxB,UAAU;CACT,MAAM,CACJ,gBACA,EACE,WACA,KACA,aACA,MACA,kBAAkB,eAClB,eACA,yBACA,uBACA,UACA,kBACA,kBACA,kBAAkB,MAClB,iBAAiB,MACjB,kBACA,4BACA,uBACA,sBACA,kBACA,cACA,cACA,iBACA,iBACA,YACA,gBACA,YACA,WACA,uBACA,eACA,mBACA,GAAG,UAEHC,oCAAkB,MAAM;CAC5B,MAAM,oBAAoBC,qCAAqB,KAAK;CACpD,MAAM,EACJ,OACA,iBACA,oBACA,eACA,eACA,cACA,kBACA,iBACEC,wCAAe;EAAE,GAAG;EAAM,GAAG;EAAmB,CAAC;CACrD,MAAM,+CACG;EACL;EACA;EACA,GAAG;EACJ,GACD;EAAC;EAAiB;EAAU;EAAa,CAC1C;CACD,MAAM,WAAWC,wCAAe;EAAE;EAAkB;EAAkB,CAAC;AAMvE,QACE,2CAAC;EAAiB,iCALX;GAAE;GAAO;GAAoB;GAAe;GAAY,GAC/D;GAAC;GAAoB;GAAe;GAAY;GAAM,CACvD;YAIG;GAAc,GAAI;cAChB;IACa;IACN;IACQ;IACb,GAAI,aAAa;KAAE,GAAG;KAAgB,GAAG;KAAW,CAAC;;KAEpD,kBACC;MAAoB,GAAI;MAAc,GAAI;gBACxC,2CAAC,0BAAuB,GAAI,mBAAoB;OAC7B,GACnB;KAEJ,uFACE,2CAAC,oBACC,GAAI,cAAc;MAAE,GAAG;MAAU,GAAG;MAAY,CAAC,GACjD,GACc;KAEjB,iBACC;MACE;MACA,GAAI;MACJ,GAAI;gBAEJ,2CAAC,yBACC,GAAI,mBAAmB,gBAAgB,GACvC;OACiB,GACnB;;KACY,EAElB,2CAAC;IACC,+CACE,4DAAgC,aAAa,CAAC,CAC/C;cAED;KACQ;KACN,GAAI,iBAAiB;MACnB;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA,GAAG;MACJ,CAAC;MACF;KACiB;IACR;GACE;GAGvB,QACA,EAAE,eAAe,CAAC,OAAO,EAAE,CAC5B,EAAE,UAAU;AAGX,QAAO;EAAE,GAFOC,oCAAsB;EAEjB,GAAG;EAAO;EAC/B;AAIF,MAAM,mBAAmB,YACvB,OACA,QACD,CAAC,EAAE,wBAAwB,IAAI,GAAG,UAAU;CAC3C,MAAM,EAAE,eAAe,eAAe,qBAAqB;AAE3D,QAAO;EACL,UAAU,2CAAC,oBAAiB,GAAI,cAAc,WAAW,GAAI;EAC7D,GAAG;EACJ;EACD;AAIF,MAAM,mBAAmB,YACvB,SACA,QACD,EAAE;AAIH,MAAM,yBAAyB,YAC7BC,kCACA,cACD,CAAC,SAAY,UAAU;CACtB,MAAM,EAAE,UAAU,qBAAqB;AAEvC,QAAO;EAAE,SAAS;EAAU,OAAO;EAAO,GAAG;EAAO;EACpD;AAMF,MAAM,wBAAwB,YAC5B,OACA,aACD,CAAC,SAAY,EAAE,UAAU,MAAM,GAAG,WAAW;CAC5C,MAAM,EAAE,uBAAuB,qBAAqB;AAEpD,QAAO,mBAAmB;EACxB,UAAU,QAAQ,YAAY,2CAACC,qCAAc;EAC7C,GAAG;EACJ,CAAC;EACF;AAIF,MAAM,qBAAqB,4CAEzB,UACD,EAAE"}

package/dist/cjs/components/color-picker/use-color-picker.cjs CHANGED Viewed

@@ -16,13 +16,13 @@ let react = require("react");
 //#region src/components/color-picker/use-color-picker.ts
 const useColorPicker = (props) => {
 	const { t } = require_i18n_provider.useI18n("colorPicker");
-	const { props: { id, ref, name, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledbyProp, allowInput = true, closeOnChange = false, defaultValue, disabled, fallbackValue = "#FFFFFF", format: formatProp, formatInput, openOnChange = true, openOnClick = true, openOnFocus = true, pattern, placeholder, readOnly, required, value: valueProp, onChange: onChangeProp, onInputChange: onInputChangeProp, ...rest }, ariaProps, dataProps, eventProps } = require_use_field_props.useFieldProps(props);
+	const { props: { id, ref, name, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledbyProp, allowInput = true, closeOnChange = false, defaultValue, disabled, fallbackValue = "#FFFFFF", format: formatProp, formatInput, openOnChange = true, openOnClick = true, openOnFocus = true, pattern, placeholder, placement = "end-start", readOnly, required, value: valueProp, onChange: onChangeProp, onInputChange: onInputChangeProp, ...rest }, ariaProps, dataProps, eventProps } = require_use_field_props.useFieldProps(props);
 	const { interactive, open, getContentProps: getComboboxContentProps, getTriggerProps, popoverProps, onClose, onOpen } = require_hooks_use_combobox_index.useCombobox({
 		disabled,
 		openOnClick: false,
 		openOnEnter: !allowInput,
 		openOnSpace: !allowInput,
-		placement: "end-start",
+		placement,
 		readOnly,
 		transferFocus: false,
 		...ariaProps,

package/dist/cjs/components/color-picker/use-color-picker.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-color-picker.cjs","names":["useI18n","useFieldProps","useCombobox","useControllableState","useEyeDropper","value","getRootProps: PropGetter","props","getFieldProps: PropGetter","mergeRefs","ref","getInputProps: PropGetter<\"input\">","getEyeDropperProps: PropGetter","runKeyAction"],"sources":["../../../../src/components/color-picker/use-color-picker.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, MouseEvent } from \"react\"\nimport type { HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { UseComboboxProps } from \"../../hooks/use-combobox\"\nimport type { ColorFormat } from \"../../utils\"\nimport type { UseColorSelectorProps } from \"../color-selector\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useRef } from \"react\"\nimport { useCombobox } from \"../../hooks/use-combobox\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useEyeDropper } from \"../../hooks/use-eye-dropper\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n calcFormat,\n contains,\n convertColor,\n cx,\n focusTransfer,\n handlerAll,\n mergeRefs,\n runIfFn,\n runKeyAction,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nexport interface UseColorPickerProps\n extends\n Omit<\n UseComboboxProps,\n \| \"closeOnSelect\"\n \| \"initialFocusValue\"\n \| \"onChange\"\n \| \"ref\"\n \| \"selectFocusRef\"\n \| \"selectOnSpace\"\n >,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /*\n If `true`, allows input.\n \n @default true\n /\n allowInput?: boolean\n /\n If `true`, the color picker will be closed when the input value changes.\n \n @default false\n /\n closeOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n The initial value of the color picker.\n /\n defaultValue?: string\n /\n The fallback value of the color picker.\n \n @default '#FFFFFF'\n /\n fallbackValue?: string\n /\n The format of the color picker.\n * Automatically determines the format of `value` or `defaultValue`.\n \n @default 'hex'\n /\n format?: ColorFormat\n /\n The `id` attribute of the input element.\n /\n id?: string\n /\n The `name` attribute of the input element.\n /\n name?: string\n /\n If `true`, the color picker will be opened when the input value changes.\n \n @default true\n /\n openOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n If `true`, the color picker will be opened when the input is focused.\n \n @default false\n /\n openOnFocus?: boolean\n /\n The pattern used to check the input element.\n /\n pattern?: RegExp\n /\n The placeholder for color picker.\n /\n placeholder?: string\n /\n The value of the color picker.\n /\n value?: string\n /\n The function to format the input value.\n /\n formatInput?: (value: string) => string\n /\n The callback invoked when the value changes.\n /\n onChange?: (value: string) => void\n /\n The callback invoked when input value state changes.\n */\n onInputChange?: (ev: ChangeEvent<HTMLInputElement>) => void\n}\n\nexport const useColorPicker = (props: UseColorPickerProps) => {\n const { t } = useI18n(\"colorPicker\")\n const {\n props: {\n id,\n ref,\n name,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledbyProp,\n allowInput = true,\n closeOnChange = false,\n defaultValue,\n disabled,\n fallbackValue = \"#FFFFFF\",\n format: formatProp,\n formatInput,\n openOnChange = true,\n openOnClick = true,\n openOnFocus = true,\n pattern,\n placeholder,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onInputChange: onInputChangeProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const {\n interactive,\n open,\n getContentProps: getComboboxContentProps,\n getTriggerProps,\n popoverProps,\n onClose,\n onOpen,\n } = useCombobox({\n disabled,\n openOnClick: false,\n openOnEnter: !allowInput,\n openOnSpace: !allowInput,\n placement: \"end-start\",\n readOnly,\n transferFocus: false,\n ...ariaProps,\n ...dataProps,\n ...eventProps,\n ...rest,\n })\n const format =\n formatProp ?? calcFormat(valueProp ?? defaultValue ?? fallbackValue)\n const alpha = format.endsWith(\"a\")\n const fieldRef = useRef<HTMLDivElement>(null)\n const contentRef = useRef<HTMLDivElement>(null)\n const inputRef = useRef<HTMLInputElement>(null)\n const focusByClickRef = useRef<boolean>(false)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const { supported: supportedEyeDropper, onOpen: onOpenEyeDropper } =\n useEyeDropper()\n\n const onClick = useCallback(() => {\n if (!interactive) return\n\n focusByClickRef.current = true\n\n if (allowInput) inputRef.current?.focus()\n\n if (openOnClick) onOpen()\n }, [allowInput, interactive, onOpen, openOnClick])\n\n const onMouseDown = useCallback(\n (ev: MouseEvent<HTMLDivElement \| HTMLInputElement>) => {\n if (!openOnFocus) return\n\n ev.preventDefault()\n ev.stopPropagation()\n },\n [openOnFocus],\n )\n\n const onFieldFocus = useCallback(() => {\n if (allowInput) return\n\n if (openOnFocus) onOpen()\n\n focusByClickRef.current = false\n }, [allowInput, onOpen, openOnFocus])\n\n const onInputFocus = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n ev.preventDefault()\n ev.stopPropagation()\n\n if (openOnFocus && !focusByClickRef.current) onOpen()\n\n focusByClickRef.current = false\n },\n [onOpen, openOnFocus],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n if (\n contains(fieldRef.current, ev.relatedTarget) \|\|\n contains(contentRef.current, ev.relatedTarget)\n ) {\n ev.preventDefault()\n } else {\n setValue((prev) => {\n if (!prev) return prev\n\n let value = convertColor(prev)(format)\n\n if (!value) return prev\n\n if (formatInput) value = formatInput(value)\n\n if (pattern) value = value.replace(pattern, \"\")\n\n return value\n })\n }\n },\n [format, formatInput, pattern, setValue],\n )\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!allowInput) return\n\n onInputChangeProp?.(ev)\n\n if (runIfFn(closeOnChange, ev)) {\n onClose()\n } else if (runIfFn(openOnChange, ev)) {\n onOpen()\n }\n\n let inputValue = ev.target.value\n\n if (formatInput) inputValue = formatInput(inputValue)\n\n if (pattern) inputValue = inputValue.replace(pattern, \"\")\n\n setValue(inputValue)\n },\n [\n allowInput,\n closeOnChange,\n formatInput,\n onClose,\n onInputChangeProp,\n onOpen,\n openOnChange,\n pattern,\n setValue,\n ],\n )\n\n const onEyeDropperClick = useCallback(async () => {\n if (!interactive) return\n\n const result = await onOpenEyeDropper()\n\n if (result?.sRGBHex) setValue(result.sRGBHex)\n }, [interactive, onOpenEyeDropper, setValue])\n\n useEffect(() => {\n if (!open) return\n\n return focusTransfer(\n contentRef.current,\n allowInput ? inputRef.current : fieldRef.current,\n )\n }, [allowInput, open])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n const getFieldProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getTriggerProps({\n ref: mergeRefs(ref, fieldRef),\n \"aria-haspopup\": \"dialog\",\n tabIndex: !allowInput ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onClick),\n onFocus: handlerAll(props.onFocus, onFieldFocus),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }),\n\n [allowInput, getTriggerProps, onClick, onFieldFocus, onMouseDown],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n id,\n ref: mergeRefs(props.ref, ref, inputRef),\n name,\n style: {\n ...(!allowInput ? { pointerEvents: \"none\" } : {}),\n ...props.style,\n },\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": cx(ariaLabelledby, ariaLabelledbyProp),\n autoComplete: \"off\",\n disabled,\n placeholder,\n readOnly,\n required,\n tabIndex: allowInput ? 0 : -1,\n value,\n ...dataProps,\n ...props,\n onBlur: handlerAll(props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onFocus: handlerAll(props.onFocus, onInputFocus),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }),\n [\n allowInput,\n ariaLabel,\n ariaLabelledbyProp,\n dataProps,\n disabled,\n id,\n name,\n onBlur,\n onInputChange,\n onInputFocus,\n onMouseDown,\n placeholder,\n readOnly,\n ref,\n required,\n value,\n ],\n )\n\n const getEyeDropperProps: PropGetter = useCallback(\n (props = {}) => ({\n ...dataProps,\n \"aria-disabled\": ariaAttr(!interactive),\n \"aria-label\": t(\"Pick a color\"),\n hidden: !supportedEyeDropper,\n role: \"button\",\n tabIndex: interactive ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onEyeDropperClick),\n onKeyDown: handlerAll(props.onKeyDown, (ev) =>\n runKeyAction(ev, {\n Enter: onEyeDropperClick,\n Space: onEyeDropperClick,\n }),\n ),\n }),\n [dataProps, interactive, onEyeDropperClick, supportedEyeDropper, t],\n )\n\n const getContentProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getComboboxContentProps({\n ref: mergeRefs(ref, contentRef),\n role: \"dialog\",\n ...props,\n }),\n [getComboboxContentProps],\n )\n\n const getSelectorProps: PropGetter<UseColorSelectorProps> = useCallback(\n (props = {}) => ({\n disabled,\n fallbackValue,\n format,\n readOnly,\n value,\n ...props,\n onChange: handlerAll(props.onChange, setValue),\n }),\n [disabled, fallbackValue, format, readOnly, value, setValue],\n )\n\n return {\n alpha,\n format,\n interactive,\n open,\n setValue,\n value,\n getContentProps,\n getEyeDropperProps,\n getFieldProps,\n getInputProps,\n getRootProps,\n getSelectorProps,\n popoverProps,\n onClose,\n onOpen,\n }\n}\n\nexport type UseColorPickerReturn = ReturnType<typeof useColorPicker>\n"],"mappings":";;;;;;;;;;;;;;;;AAmHA,MAAa,kBAAkB,UAA+B;CAC5D,MAAM,EAAE,MAAMA,8BAAQ,cAAc;CACpC,MAAM,EACJ,OAAO,EACL,IACA,KACA,MACA,cAAc,WACd,mBAAmB,oBACnB,aAAa,MACb,gBAAgB,OAChB,cACA,UACA,gBAAgB,WAChB,QAAQ,YACR,aACA,eAAe,MACf,cAAc,MACd,cAAc,MACd,SACA,aACA,UACA,UACA,OAAO,WACP,UAAU,cACV,eAAe,mBACf,GAAG,QAEL,WACA,WACA,eACEC,sCAAc,MAAM;CACxB,MAAM,EACJ,aACA,MACA,iBAAiB,yBACjB,iBACA,cACA,SACA,WACEC,6CAAY;EACd;EACA,aAAa;EACb,aAAa,CAAC;EACd,aAAa,CAAC;EACd,WAAW;EACX;EACA,eAAe;EACf,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACJ,CAAC;CACF,MAAM,SACJ,gEAAyB,aAAa,gBAAgB,cAAc;CACtE,MAAM,QAAQ,OAAO,SAAS,IAAI;CAClC,MAAM,6BAAkC,KAAK;CAC7C,MAAM,+BAAoC,KAAK;CAC/C,MAAM,6BAAoC,KAAK;CAC/C,MAAM,oCAAkC,MAAM;CAC9C,MAAM,CAAC,OAAO,YAAYC,gEAAqB;EAC7C;EACA,OAAO;EACP,UAAU;EACX,CAAC;CACF,MAAM,EAAE,WAAW,qBAAqB,QAAQ,qBAC9CC,mDAAe;CAEjB,MAAM,uCAA4B;AAChC,MAAI,CAAC,YAAa;AAElB,kBAAgB,UAAU;AAE1B,MAAI,WAAY,UAAS,SAAS,OAAO;AAEzC,MAAI,YAAa,SAAQ;IACxB;EAAC;EAAY;EAAa;EAAQ;EAAY,CAAC;CAElD,MAAM,sCACH,OAAsD;AACrD,MAAI,CAAC,YAAa;AAElB,KAAG,gBAAgB;AACnB,KAAG,iBAAiB;IAEtB,CAAC,YAAY,CACd;CAED,MAAM,4CAAiC;AACrC,MAAI,WAAY;AAEhB,MAAI,YAAa,SAAQ;AAEzB,kBAAgB,UAAU;IACzB;EAAC;EAAY;EAAQ;EAAY,CAAC;CAErC,MAAM,uCACH,OAAqC;AACpC,KAAG,gBAAgB;AACnB,KAAG,iBAAiB;AAEpB,MAAI,eAAe,CAAC,gBAAgB,QAAS,SAAQ;AAErD,kBAAgB,UAAU;IAE5B,CAAC,QAAQ,YAAY,CACtB;CAED,MAAM,iCACH,OAAqC;AACpC,sDACW,SAAS,SAAS,GAAG,cAAc,oDACnC,WAAW,SAAS,GAAG,cAAc,CAE9C,IAAG,gBAAgB;MAEnB,WAAU,SAAS;AACjB,OAAI,CAAC,KAAM,QAAO;GAElB,IAAIC,8DAAqB,KAAK,CAAC,OAAO;AAEtC,OAAI,CAACA,QAAO,QAAO;AAEnB,OAAI,YAAa,WAAQ,YAAYA,QAAM;AAE3C,OAAI,QAAS,WAAQA,QAAM,QAAQ,SAAS,GAAG;AAE/C,UAAOA;IACP;IAGN;EAAC;EAAQ;EAAa;EAAS;EAAS,CACzC;CAED,MAAM,wCACH,OAAsC;AACrC,MAAI,CAAC,WAAY;AAEjB,sBAAoB,GAAG;AAEvB,qDAAY,eAAe,GAAG,CAC5B,UAAS;0DACQ,cAAc,GAAG,CAClC,SAAQ;EAGV,IAAI,aAAa,GAAG,OAAO;AAE3B,MAAI,YAAa,cAAa,YAAY,WAAW;AAErD,MAAI,QAAS,cAAa,WAAW,QAAQ,SAAS,GAAG;AAEzD,WAAS,WAAW;IAEtB;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAED,MAAM,2CAAgC,YAAY;AAChD,MAAI,CAAC,YAAa;EAElB,MAAM,SAAS,MAAM,kBAAkB;AAEvC,MAAI,QAAQ,QAAS,UAAS,OAAO,QAAQ;IAC5C;EAAC;EAAa;EAAkB;EAAS,CAAC;AAE7C,4BAAgB;AACd,MAAI,CAAC,KAAM;AAEX,8DACE,WAAW,SACX,aAAa,SAAS,UAAU,SAAS,QAC1C;IACA,CAAC,YAAY,KAAK,CAAC;CAEtB,MAAMC,uCACH,aAAW;EACV,GAAG;EACH,GAAGC;EACJ,GACD,CAAC,UAAU,CACZ;CAED,MAAMC,wCACH,EAAE,YAAK,GAAGD,YAAU,EAAE,KACrB,gBAAgB;EACd,KAAKE,sBAAUC,OAAK,SAAS;EAC7B,iBAAiB;EACjB,UAAU,CAAC,aAAa,IAAI;EAC5B,GAAGH;EACH,2DAAoBA,QAAM,SAAS,QAAQ;EAC3C,2DAAoBA,QAAM,SAAS,aAAa;EAChD,+DAAwBA,QAAM,aAAa,YAAY;EACxD,CAAC,EAEJ;EAAC;EAAY;EAAiB;EAAS;EAAc;EAAY,CAClE;CAED,MAAMI,wCACH,EAAE,mBAAmB,gBAAgB,GAAGJ,YAAU,EAAE,MAAM;EACzD;EACA,KAAKE,sBAAUF,QAAM,KAAK,KAAK,SAAS;EACxC;EACA,OAAO;GACL,GAAI,CAAC,aAAa,EAAE,eAAe,QAAQ,GAAG,EAAE;GAChD,GAAGA,QAAM;GACV;EACD,cAAc;EACd,6DAAsB,gBAAgB,mBAAmB;EACzD,cAAc;EACd;EACA;EACA;EACA;EACA,UAAU,aAAa,IAAI;EAC3B;EACA,GAAG;EACH,GAAGA;EACH,0DAAmBA,QAAM,QAAQ,OAAO;EACxC,4DAAqBA,QAAM,UAAU,cAAc;EACnD,2DAAoBA,QAAM,SAAS,aAAa;EAChD,+DAAwBA,QAAM,aAAa,YAAY;EACxD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAED,MAAMK,6CACH,UAAQ,EAAE,MAAM;EACf,GAAG;EACH,iEAA0B,CAAC,YAAY;EACvC,cAAc,EAAE,eAAe;EAC/B,QAAQ,CAAC;EACT,MAAM;EACN,UAAU,cAAc,IAAI;EAC5B,GAAGL;EACH,2DAAoBA,QAAM,SAAS,kBAAkB;EACrD,6DAAsBA,QAAM,YAAY,OACtCM,yBAAa,IAAI;GACf,OAAO;GACP,OAAO;GACR,CAAC,CACH;EACF,GACD;EAAC;EAAW;EAAa;EAAmB;EAAqB;EAAE,CACpE;AAyBD,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA,yCA7BC,EAAE,YAAK,GAAGN,YAAU,EAAE,KACrB,wBAAwB;GACtB,KAAKE,sBAAUC,OAAK,WAAW;GAC/B,MAAM;GACN,GAAGH;GACJ,CAAC,EACJ,CAAC,wBAAwB,CAC1B;EAuBC;EACA;EACA;EACA;EACA,0CAxBC,UAAQ,EAAE,MAAM;GACf;GACA;GACA;GACA;GACA;GACA,GAAGA;GACH,4DAAqBA,QAAM,UAAU,SAAS;GAC/C,GACD;GAAC;GAAU;GAAe;GAAQ;GAAU;GAAO;GAAS,CAC7D;EAeC;EACA;EACA;EACD"}
1	+ {"version":3,"file":"use-color-picker.cjs","names":["useI18n","useFieldProps","useCombobox","useControllableState","useEyeDropper","value","getRootProps: PropGetter","props","getFieldProps: PropGetter","mergeRefs","ref","getInputProps: PropGetter<\"input\">","getEyeDropperProps: PropGetter","runKeyAction"],"sources":["../../../../src/components/color-picker/use-color-picker.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, MouseEvent } from \"react\"\nimport type { HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { UseComboboxProps } from \"../../hooks/use-combobox\"\nimport type { ColorFormat } from \"../../utils\"\nimport type { UseColorSelectorProps } from \"../color-selector\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useRef } from \"react\"\nimport { useCombobox } from \"../../hooks/use-combobox\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useEyeDropper } from \"../../hooks/use-eye-dropper\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n calcFormat,\n contains,\n convertColor,\n cx,\n focusTransfer,\n handlerAll,\n mergeRefs,\n runIfFn,\n runKeyAction,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nexport interface UseColorPickerProps\n extends\n Omit<\n UseComboboxProps,\n \| \"closeOnSelect\"\n \| \"initialFocusValue\"\n \| \"onChange\"\n \| \"ref\"\n \| \"selectFocusRef\"\n \| \"selectOnSpace\"\n >,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /*\n If `true`, allows input.\n \n @default true\n /\n allowInput?: boolean\n /\n If `true`, the color picker will be closed when the input value changes.\n \n @default false\n /\n closeOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n The initial value of the color picker.\n /\n defaultValue?: string\n /\n The fallback value of the color picker.\n \n @default '#FFFFFF'\n /\n fallbackValue?: string\n /\n The format of the color picker.\n * Automatically determines the format of `value` or `defaultValue`.\n \n @default 'hex'\n /\n format?: ColorFormat\n /\n The `id` attribute of the input element.\n /\n id?: string\n /\n The `name` attribute of the input element.\n /\n name?: string\n /\n If `true`, the color picker will be opened when the input value changes.\n \n @default true\n /\n openOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n If `true`, the color picker will be opened when the input is focused.\n \n @default false\n /\n openOnFocus?: boolean\n /\n The pattern used to check the input element.\n /\n pattern?: RegExp\n /\n The placeholder for color picker.\n /\n placeholder?: string\n /\n The value of the color picker.\n /\n value?: string\n /\n The function to format the input value.\n /\n formatInput?: (value: string) => string\n /\n The callback invoked when the value changes.\n /\n onChange?: (value: string) => void\n /\n The callback invoked when input value state changes.\n */\n onInputChange?: (ev: ChangeEvent<HTMLInputElement>) => void\n}\n\nexport const useColorPicker = (props: UseColorPickerProps) => {\n const { t } = useI18n(\"colorPicker\")\n const {\n props: {\n id,\n ref,\n name,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledbyProp,\n allowInput = true,\n closeOnChange = false,\n defaultValue,\n disabled,\n fallbackValue = \"#FFFFFF\",\n format: formatProp,\n formatInput,\n openOnChange = true,\n openOnClick = true,\n openOnFocus = true,\n pattern,\n placeholder,\n placement = \"end-start\",\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onInputChange: onInputChangeProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const {\n interactive,\n open,\n getContentProps: getComboboxContentProps,\n getTriggerProps,\n popoverProps,\n onClose,\n onOpen,\n } = useCombobox({\n disabled,\n openOnClick: false,\n openOnEnter: !allowInput,\n openOnSpace: !allowInput,\n placement,\n readOnly,\n transferFocus: false,\n ...ariaProps,\n ...dataProps,\n ...eventProps,\n ...rest,\n })\n const format =\n formatProp ?? calcFormat(valueProp ?? defaultValue ?? fallbackValue)\n const alpha = format.endsWith(\"a\")\n const fieldRef = useRef<HTMLDivElement>(null)\n const contentRef = useRef<HTMLDivElement>(null)\n const inputRef = useRef<HTMLInputElement>(null)\n const focusByClickRef = useRef<boolean>(false)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const { supported: supportedEyeDropper, onOpen: onOpenEyeDropper } =\n useEyeDropper()\n\n const onClick = useCallback(() => {\n if (!interactive) return\n\n focusByClickRef.current = true\n\n if (allowInput) inputRef.current?.focus()\n\n if (openOnClick) onOpen()\n }, [allowInput, interactive, onOpen, openOnClick])\n\n const onMouseDown = useCallback(\n (ev: MouseEvent<HTMLDivElement \| HTMLInputElement>) => {\n if (!openOnFocus) return\n\n ev.preventDefault()\n ev.stopPropagation()\n },\n [openOnFocus],\n )\n\n const onFieldFocus = useCallback(() => {\n if (allowInput) return\n\n if (openOnFocus) onOpen()\n\n focusByClickRef.current = false\n }, [allowInput, onOpen, openOnFocus])\n\n const onInputFocus = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n ev.preventDefault()\n ev.stopPropagation()\n\n if (openOnFocus && !focusByClickRef.current) onOpen()\n\n focusByClickRef.current = false\n },\n [onOpen, openOnFocus],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n if (\n contains(fieldRef.current, ev.relatedTarget) \|\|\n contains(contentRef.current, ev.relatedTarget)\n ) {\n ev.preventDefault()\n } else {\n setValue((prev) => {\n if (!prev) return prev\n\n let value = convertColor(prev)(format)\n\n if (!value) return prev\n\n if (formatInput) value = formatInput(value)\n\n if (pattern) value = value.replace(pattern, \"\")\n\n return value\n })\n }\n },\n [format, formatInput, pattern, setValue],\n )\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!allowInput) return\n\n onInputChangeProp?.(ev)\n\n if (runIfFn(closeOnChange, ev)) {\n onClose()\n } else if (runIfFn(openOnChange, ev)) {\n onOpen()\n }\n\n let inputValue = ev.target.value\n\n if (formatInput) inputValue = formatInput(inputValue)\n\n if (pattern) inputValue = inputValue.replace(pattern, \"\")\n\n setValue(inputValue)\n },\n [\n allowInput,\n closeOnChange,\n formatInput,\n onClose,\n onInputChangeProp,\n onOpen,\n openOnChange,\n pattern,\n setValue,\n ],\n )\n\n const onEyeDropperClick = useCallback(async () => {\n if (!interactive) return\n\n const result = await onOpenEyeDropper()\n\n if (result?.sRGBHex) setValue(result.sRGBHex)\n }, [interactive, onOpenEyeDropper, setValue])\n\n useEffect(() => {\n if (!open) return\n\n return focusTransfer(\n contentRef.current,\n allowInput ? inputRef.current : fieldRef.current,\n )\n }, [allowInput, open])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n const getFieldProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getTriggerProps({\n ref: mergeRefs(ref, fieldRef),\n \"aria-haspopup\": \"dialog\",\n tabIndex: !allowInput ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onClick),\n onFocus: handlerAll(props.onFocus, onFieldFocus),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }),\n\n [allowInput, getTriggerProps, onClick, onFieldFocus, onMouseDown],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n id,\n ref: mergeRefs(props.ref, ref, inputRef),\n name,\n style: {\n ...(!allowInput ? { pointerEvents: \"none\" } : {}),\n ...props.style,\n },\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": cx(ariaLabelledby, ariaLabelledbyProp),\n autoComplete: \"off\",\n disabled,\n placeholder,\n readOnly,\n required,\n tabIndex: allowInput ? 0 : -1,\n value,\n ...dataProps,\n ...props,\n onBlur: handlerAll(props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onFocus: handlerAll(props.onFocus, onInputFocus),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }),\n [\n allowInput,\n ariaLabel,\n ariaLabelledbyProp,\n dataProps,\n disabled,\n id,\n name,\n onBlur,\n onInputChange,\n onInputFocus,\n onMouseDown,\n placeholder,\n readOnly,\n ref,\n required,\n value,\n ],\n )\n\n const getEyeDropperProps: PropGetter = useCallback(\n (props = {}) => ({\n ...dataProps,\n \"aria-disabled\": ariaAttr(!interactive),\n \"aria-label\": t(\"Pick a color\"),\n hidden: !supportedEyeDropper,\n role: \"button\",\n tabIndex: interactive ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onEyeDropperClick),\n onKeyDown: handlerAll(props.onKeyDown, (ev) =>\n runKeyAction(ev, {\n Enter: onEyeDropperClick,\n Space: onEyeDropperClick,\n }),\n ),\n }),\n [dataProps, interactive, onEyeDropperClick, supportedEyeDropper, t],\n )\n\n const getContentProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getComboboxContentProps({\n ref: mergeRefs(ref, contentRef),\n role: \"dialog\",\n ...props,\n }),\n [getComboboxContentProps],\n )\n\n const getSelectorProps: PropGetter<UseColorSelectorProps> = useCallback(\n (props = {}) => ({\n disabled,\n fallbackValue,\n format,\n readOnly,\n value,\n ...props,\n onChange: handlerAll(props.onChange, setValue),\n }),\n [disabled, fallbackValue, format, readOnly, value, setValue],\n )\n\n return {\n alpha,\n format,\n interactive,\n open,\n setValue,\n value,\n getContentProps,\n getEyeDropperProps,\n getFieldProps,\n getInputProps,\n getRootProps,\n getSelectorProps,\n popoverProps,\n onClose,\n onOpen,\n }\n}\n\nexport type UseColorPickerReturn = ReturnType<typeof useColorPicker>\n"],"mappings":"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"}

package/dist/cjs/components/color-swatch/color-swatch-group.cjs CHANGED Viewed

@@ -1,7 +1,7 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
-const require_color_swatch = require('./color-swatch.cjs');
 const require_i18n_provider = require('../../providers/i18n-provider/i18n-provider.cjs');
 require('../../providers/i18n-provider/index.cjs');
+const require_color_swatch = require('./color-swatch.cjs');
 const require_grid = require('../grid/grid.cjs');
 require('../grid/index.cjs');
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/cjs/components/date-picker/date-picker.cjs CHANGED Viewed

@@ -9,10 +9,10 @@ require('../../core/index.cjs');
 const require_calendar_icon = require('../icon/icons/calendar-icon.cjs');
 const require_x_icon = require('../icon/icons/x-icon.cjs');
 require('../icon/index.cjs');
-const require_use_group = require('../group/use-group.cjs');
-require('../group/index.cjs');
 const require_popover = require('../popover/popover.cjs');
 require('../popover/index.cjs');
+const require_use_group = require('../group/use-group.cjs');
+require('../group/index.cjs');
 const require_use_input_border = require('../input/use-input-border.cjs');
 const require_input = require('../input/input.cjs');
 const require_input_element = require('../input/input-element.cjs');
@@ -35,7 +35,11 @@ const { ComponentContext, PropsContext: DatePickerPropsContext, useComponentCont
 */
 const DatePicker = withProvider((props) => {
 	const [groupItemProps, { className, css, colorScheme, size, animationScheme = "block-start", children, clearable = true, clearIcon = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_x_icon.XIcon, {}), duration, errorBorderColor, focusBorderColor, icon, calendarProps, contentProps, elementProps, iconProps, inputProps, rootProps, ...rest }] = require_use_group.useGroupItemProps(props);
-	const { children: fieldChildren, range, separator, value, getCalendarProps, getClearIconProps, getContentProps, getFieldProps, getIconProps, getInputProps, getRootProps, popoverProps } = require_use_date_picker.useDatePicker(rest);
+	const popoverStyleProps = require_popover.usePopoverStyleProps(rest);
+	const { children: fieldChildren, range, separator, value, getCalendarProps, getClearIconProps, getContentProps, getFieldProps, getIconProps, getInputProps, getRootProps, popoverProps } = require_use_date_picker.useDatePicker({
+		...rest,
+		...popoverStyleProps
+	});
 	const mergedPopoverProps = (0, react.useMemo)(() => ({
 		animationScheme,
 		duration,

package/dist/cjs/components/date-picker/date-picker.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"date-picker.cjs","names":["createSlotComponent","datePickerStyle","XIcon","useGroupItemProps","useDatePicker","useInputBorder","useInputPropsContext","useFieldSizing","styled","mergeRefs","CalendarIcon"],"sources":["../../../../src/components/date-picker/date-picker.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type {\n Direction,\n GenericsComponent,\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n} from \"../../core\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { PopupAnimationProps } from \"../popover\"\nimport type { DatePickerStyle } from \"./date-picker.style\"\nimport type { UseDatePickerProps, UseDatePickerReturn } from \"./use-date-picker\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useFieldSizing } from \"../../hooks/use-field-sizing\"\nimport { cast, isArray, isDate, isObject, mergeRefs } from \"../../utils\"\nimport { Calendar } from \"../calendar\"\nimport { useGroupItemProps } from \"../group\"\nimport { CalendarIcon, XIcon } from \"../icon\"\nimport { InputGroup, useInputBorder, useInputPropsContext } from \"../input\"\nimport { Popover } from \"../popover\"\nimport { datePickerStyle } from \"./date-picker.style\"\nimport { useDatePicker } from \"./use-date-picker\"\n\ninterface ComponentContext\n extends\n Pick<UseDatePickerReturn, \"getInputProps\" \| \"range\" \| \"separator\">,\n Pick<DatePickerProps, \"inputProps\"> {}\n\nexport interface DatePickerProps<\n Multiple extends boolean = false,\n Range extends boolean = false,\n>\n extends\n Omit<\n HTMLStyledProps,\n \"defaultValue\" \| \"offset\" \| \"onChange\" \| \"ref\" \| \"value\"\n >,\n UseDatePickerProps<Multiple, Range>,\n PopupAnimationProps,\n ThemeProps<DatePickerStyle>,\n UseInputBorderProps {\n /*\n If `true`, display the clear icon.\n \n @default true\n /\n clearable?: boolean\n /\n The icon to be used in the clear button.\n /\n clearIcon?: ReactNode\n /\n The icon to be used in the date picker.\n /\n icon?: ReactNode\n /\n The placement of the popper relative to its reference.\n \n @default 'end-start'\n /\n placement?: Direction\n /\n The size of the calendar component.\n /\n calendarProps?: Calendar.RootProps<Multiple, Range>\n /\n Props for content element.\n /\n contentProps?: DatePickerContentProps\n /\n The props for the end element.\n /\n elementProps?: InputGroup.ElementProps\n /\n Props for icon element.\n /\n iconProps?: DatePickerIconProps\n /\n The props for the input element.\n /\n inputProps?: HTMLStyledProps<\"input\">\n /\n Props for root element.\n /\n rootProps?: InputGroup.RootProps\n}\n\nconst {\n ComponentContext,\n PropsContext: DatePickerPropsContext,\n useComponentContext,\n usePropsContext: useDatePickerPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<DatePickerProps, DatePickerStyle, ComponentContext>(\n \"date-picker\",\n datePickerStyle,\n)\n\nexport { DatePickerPropsContext, useDatePickerPropsContext }\n\n/\n `DatePicker` is a component used for users to select a date.\n \n @see https://yamada-ui.com/docs/components/date-picker\n */\nexport const DatePicker = withProvider(\n <Multiple extends boolean = false, Range extends boolean = false>(\n props: DatePickerProps<Multiple, Range>,\n ) => {\n const [\n groupItemProps,\n {\n className,\n css,\n colorScheme,\n size,\n animationScheme = \"block-start\",\n children,\n clearable = true,\n clearIcon = <XIcon />,\n duration,\n errorBorderColor,\n focusBorderColor,\n icon,\n calendarProps,\n contentProps,\n elementProps,\n iconProps,\n inputProps,\n rootProps,\n ...rest\n },\n ] = useGroupItemProps(props)\n const {\n children: fieldChildren,\n range,\n separator,\n value,\n getCalendarProps,\n getClearIconProps,\n getContentProps,\n getFieldProps,\n getIconProps,\n getInputProps,\n getRootProps,\n popoverProps,\n } = useDatePicker(rest)\n const mergedPopoverProps = useMemo<Popover.RootProps>(\n () => ({\n animationScheme,\n duration,\n ...popoverProps,\n }),\n [animationScheme, duration, popoverProps],\n )\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const selectProps = useMemo<Calendar.RootProps[\"selectProps\"]>(\n () => ({ contentProps: { portalProps: { disabled: true } } }),\n [],\n )\n const componentContext = useMemo(\n () => ({ range, separator, getInputProps, inputProps }),\n [getInputProps, inputProps, range, separator],\n )\n const hasValue = isArray(value)\n ? !!value.length\n : isObject(value) && !isDate(value)\n ? !!value.end \|\| !!value.start\n : !!value\n\n return (\n <ComponentContext value={componentContext}>\n <Popover.Root {...mergedPopoverProps}>\n <InputGroup.Root\n className={className}\n css={css}\n colorScheme={colorScheme}\n {...getRootProps({ ...groupItemProps, ...rootProps })}\n >\n <Popover.Trigger>\n <DatePickerField {...getFieldProps(varProps)}>\n {fieldChildren}\n </DatePickerField>\n </Popover.Trigger>\n\n <InputGroup.Element\n {...{ clickable: clearable && hasValue, ...elementProps }}\n >\n {clearable && hasValue ? (\n <DatePickerIcon\n icon={clearIcon}\n {...getClearIconProps(iconProps)}\n />\n ) : (\n <DatePickerIcon icon={icon} {...getIconProps(iconProps)} />\n )}\n </InputGroup.Element>\n </InputGroup.Root>\n\n <DatePickerContent\n {...cast<DatePickerContentProps>(\n getContentProps(cast<HTMLProps>(contentProps)),\n )}\n >\n <Calendar.Root\n colorScheme={colorScheme}\n size={size}\n fixed={false}\n selectProps={selectProps}\n {...getCalendarProps(calendarProps)}\n >\n {children}\n </Calendar.Root>\n </DatePickerContent>\n </Popover.Root>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"size\"] },\n)((props) => {\n const context = useInputPropsContext()\n\n return { ...context, ...props }\n}) as GenericsComponent<{\n <Multiple extends boolean = false, Range extends boolean = false>(\n props: DatePickerProps<Multiple, Range>,\n ): ReactElement\n}>\n\ninterface DatePickerFieldProps extends HTMLStyledProps {}\n\nconst DatePickerField = withContext<\"div\", DatePickerFieldProps>(\n \"div\",\n \"field\",\n)({ \"data-group-propagate\": \"\" }, ({ children, ...rest }) => {\n const { range, separator, getInputProps, inputProps } = useComponentContext()\n const computedChildren = useMemo(() => {\n if (range) {\n return (\n <>\n <DatePickerAdjustInput\n {...getInputProps({ align: \"start\", ...inputProps })}\n />\n <DatePickerSeparator>{separator}</DatePickerSeparator>\n <DatePickerAdjustInput\n {...getInputProps({ align: \"end\", ...inputProps })}\n />\n </>\n )\n } else {\n return (\n <>\n {children}\n <DatePickerInput {...getInputProps(inputProps)} />\n </>\n )\n }\n }, [children, getInputProps, inputProps, range, separator])\n\n return {\n ...rest,\n children: computedChildren,\n }\n})\n\ninterface DatePickerInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst DatePickerInput = withContext<\"input\", DatePickerInputProps>(\n \"input\",\n \"input\",\n)()\n\ninterface DatePickerAdjustInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst DatePickerAdjustInput = withContext<\"input\", DatePickerAdjustInputProps>(\n ({ ref, placeholder, value, ...rest }) => {\n const { ref: inputRef, text } = useFieldSizing({\n value: value?.toString() \|\| placeholder,\n })\n\n return (\n <>\n {text}\n\n <styled.input\n ref={mergeRefs(ref, inputRef)}\n placeholder={placeholder}\n value={value}\n {...rest}\n />\n </>\n )\n },\n [\"input\", \"adjust\"],\n)()\n\ninterface DatePickerSeparatorProps extends HTMLStyledProps<\"span\"> {}\n\nconst DatePickerSeparator = withContext<\"span\", DatePickerSeparatorProps>(\n \"span\",\n \"separator\",\n)()\n\ninterface DatePickerIconProps extends HTMLStyledProps {\n icon?: ReactNode\n}\n\nconst DatePickerIcon = withContext<\"div\", DatePickerIconProps>(\"div\", \"icon\")(\n undefined,\n ({ children, icon, ...rest }) => ({\n children: icon \|\| children \|\| <CalendarIcon />,\n ...rest,\n }),\n)\n\ninterface DatePickerContentProps extends Popover.ContentProps {}\n\nconst DatePickerContent = withContext<\"div\", DatePickerContentProps>(\n Popover.Content,\n \"content\",\n)()\n"],"mappings":"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"}
1	+ {"version":3,"file":"date-picker.cjs","names":["createSlotComponent","datePickerStyle","XIcon","useGroupItemProps","usePopoverStyleProps","useDatePicker","useInputBorder","useInputPropsContext","useFieldSizing","styled","mergeRefs","CalendarIcon"],"sources":["../../../../src/components/date-picker/date-picker.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type {\n GenericsComponent,\n HTMLProps,\n HTMLStyledProps,\n ThemeProps,\n} from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { UsePopoverStyleProps, UsePopupAnimationProps } from \"../popover\"\nimport type { DatePickerStyle } from \"./date-picker.style\"\nimport type { UseDatePickerProps, UseDatePickerReturn } from \"./use-date-picker\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useFieldSizing } from \"../../hooks/use-field-sizing\"\nimport { cast, isArray, isDate, isObject, mergeRefs } from \"../../utils\"\nimport { Calendar } from \"../calendar\"\nimport { useGroupItemProps } from \"../group\"\nimport { CalendarIcon, XIcon } from \"../icon\"\nimport { InputGroup, useInputBorder, useInputPropsContext } from \"../input\"\nimport { Popover, usePopoverStyleProps } from \"../popover\"\nimport { datePickerStyle } from \"./date-picker.style\"\nimport { useDatePicker } from \"./use-date-picker\"\n\ninterface ComponentContext\n extends\n Pick<UseDatePickerReturn, \"getInputProps\" \| \"range\" \| \"separator\">,\n Pick<DatePickerProps, \"inputProps\"> {}\n\nexport interface DatePickerProps<\n Multiple extends boolean = false,\n Range extends boolean = false,\n>\n extends\n Omit<\n HTMLStyledProps,\n \"defaultValue\" \| \"offset\" \| \"onChange\" \| \"ref\" \| \"value\"\n >,\n Merge<UseDatePickerProps<Multiple, Range>, UsePopoverStyleProps>,\n UsePopupAnimationProps,\n ThemeProps<DatePickerStyle>,\n UseInputBorderProps {\n /*\n If `true`, display the clear icon.\n \n @default true\n /\n clearable?: boolean\n /\n The icon to be used in the clear button.\n /\n clearIcon?: ReactNode\n /\n The icon to be used in the date picker.\n /\n icon?: ReactNode\n /\n The placement of the popper relative to its reference.\n \n @default 'end-start'\n /\n placement?: Popover.RootProps[\"placement\"]\n /\n The size of the calendar component.\n /\n calendarProps?: Calendar.RootProps<Multiple, Range>\n /\n Props for content element.\n /\n contentProps?: DatePickerContentProps\n /\n The props for the end element.\n /\n elementProps?: InputGroup.ElementProps\n /\n Props for icon element.\n /\n iconProps?: DatePickerIconProps\n /\n The props for the input element.\n /\n inputProps?: HTMLStyledProps<\"input\">\n /\n Props for root element.\n /\n rootProps?: InputGroup.RootProps\n}\n\nconst {\n ComponentContext,\n PropsContext: DatePickerPropsContext,\n useComponentContext,\n usePropsContext: useDatePickerPropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<DatePickerProps, DatePickerStyle, ComponentContext>(\n \"date-picker\",\n datePickerStyle,\n)\n\nexport { DatePickerPropsContext, useDatePickerPropsContext }\n\n/\n `DatePicker` is a component used for users to select a date.\n \n @see https://yamada-ui.com/docs/components/date-picker\n */\nexport const DatePicker = withProvider(\n <Multiple extends boolean = false, Range extends boolean = false>(\n props: DatePickerProps<Multiple, Range>,\n ) => {\n const [\n groupItemProps,\n {\n className,\n css,\n colorScheme,\n size,\n animationScheme = \"block-start\",\n children,\n clearable = true,\n clearIcon = <XIcon />,\n duration,\n errorBorderColor,\n focusBorderColor,\n icon,\n calendarProps,\n contentProps,\n elementProps,\n iconProps,\n inputProps,\n rootProps,\n ...rest\n },\n ] = useGroupItemProps(props)\n const popoverStyleProps = usePopoverStyleProps(rest)\n const {\n children: fieldChildren,\n range,\n separator,\n value,\n getCalendarProps,\n getClearIconProps,\n getContentProps,\n getFieldProps,\n getIconProps,\n getInputProps,\n getRootProps,\n popoverProps,\n } = useDatePicker({ ...rest, ...popoverStyleProps })\n const mergedPopoverProps = useMemo<Popover.RootProps>(\n () => ({\n animationScheme,\n duration,\n ...popoverProps,\n }),\n [animationScheme, duration, popoverProps],\n )\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const selectProps = useMemo<Calendar.RootProps[\"selectProps\"]>(\n () => ({ contentProps: { portalProps: { disabled: true } } }),\n [],\n )\n const componentContext = useMemo(\n () => ({ range, separator, getInputProps, inputProps }),\n [getInputProps, inputProps, range, separator],\n )\n const hasValue = isArray(value)\n ? !!value.length\n : isObject(value) && !isDate(value)\n ? !!value.end \|\| !!value.start\n : !!value\n\n return (\n <ComponentContext value={componentContext}>\n <Popover.Root {...mergedPopoverProps}>\n <InputGroup.Root\n className={className}\n css={css}\n colorScheme={colorScheme}\n {...getRootProps({ ...groupItemProps, ...rootProps })}\n >\n <Popover.Trigger>\n <DatePickerField {...getFieldProps(varProps)}>\n {fieldChildren}\n </DatePickerField>\n </Popover.Trigger>\n\n <InputGroup.Element\n {...{ clickable: clearable && hasValue, ...elementProps }}\n >\n {clearable && hasValue ? (\n <DatePickerIcon\n icon={clearIcon}\n {...getClearIconProps(iconProps)}\n />\n ) : (\n <DatePickerIcon icon={icon} {...getIconProps(iconProps)} />\n )}\n </InputGroup.Element>\n </InputGroup.Root>\n\n <DatePickerContent\n {...cast<DatePickerContentProps>(\n getContentProps(cast<HTMLProps>(contentProps)),\n )}\n >\n <Calendar.Root\n colorScheme={colorScheme}\n size={size}\n fixed={false}\n selectProps={selectProps}\n {...getCalendarProps(calendarProps)}\n >\n {children}\n </Calendar.Root>\n </DatePickerContent>\n </Popover.Root>\n </ComponentContext>\n )\n },\n \"root\",\n { transferProps: [\"size\"] },\n)((props) => {\n const context = useInputPropsContext()\n\n return { ...context, ...props }\n}) as GenericsComponent<{\n <Multiple extends boolean = false, Range extends boolean = false>(\n props: DatePickerProps<Multiple, Range>,\n ): ReactElement\n}>\n\ninterface DatePickerFieldProps extends HTMLStyledProps {}\n\nconst DatePickerField = withContext<\"div\", DatePickerFieldProps>(\n \"div\",\n \"field\",\n)({ \"data-group-propagate\": \"\" }, ({ children, ...rest }) => {\n const { range, separator, getInputProps, inputProps } = useComponentContext()\n const computedChildren = useMemo(() => {\n if (range) {\n return (\n <>\n <DatePickerAdjustInput\n {...getInputProps({ align: \"start\", ...inputProps })}\n />\n <DatePickerSeparator>{separator}</DatePickerSeparator>\n <DatePickerAdjustInput\n {...getInputProps({ align: \"end\", ...inputProps })}\n />\n </>\n )\n } else {\n return (\n <>\n {children}\n <DatePickerInput {...getInputProps(inputProps)} />\n </>\n )\n }\n }, [children, getInputProps, inputProps, range, separator])\n\n return {\n ...rest,\n children: computedChildren,\n }\n})\n\ninterface DatePickerInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst DatePickerInput = withContext<\"input\", DatePickerInputProps>(\n \"input\",\n \"input\",\n)()\n\ninterface DatePickerAdjustInputProps extends HTMLStyledProps<\"input\"> {}\n\nconst DatePickerAdjustInput = withContext<\"input\", DatePickerAdjustInputProps>(\n ({ ref, placeholder, value, ...rest }) => {\n const { ref: inputRef, text } = useFieldSizing({\n value: value?.toString() \|\| placeholder,\n })\n\n return (\n <>\n {text}\n\n <styled.input\n ref={mergeRefs(ref, inputRef)}\n placeholder={placeholder}\n value={value}\n {...rest}\n />\n </>\n )\n },\n [\"input\", \"adjust\"],\n)()\n\ninterface DatePickerSeparatorProps extends HTMLStyledProps<\"span\"> {}\n\nconst DatePickerSeparator = withContext<\"span\", DatePickerSeparatorProps>(\n \"span\",\n \"separator\",\n)()\n\ninterface DatePickerIconProps extends HTMLStyledProps {\n icon?: ReactNode\n}\n\nconst DatePickerIcon = withContext<\"div\", DatePickerIconProps>(\"div\", \"icon\")(\n undefined,\n ({ children, icon, ...rest }) => ({\n children: icon \|\| children \|\| <CalendarIcon />,\n ...rest,\n }),\n)\n\ninterface DatePickerContentProps extends Popover.ContentProps {}\n\nconst DatePickerContent = withContext<\"div\", DatePickerContentProps>(\n Popover.Content,\n \"content\",\n)()\n"],"mappings":"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"}

package/dist/cjs/components/date-picker/use-date-picker.cjs CHANGED Viewed

@@ -34,7 +34,7 @@ const useDatePicker = ({ maxDate = require_use_calendar.DEFAULT_MAX_DATE, minDat
 	const { props: { id, ref, name, allowInput = true, allowInputBeyond = false, closeOnChange = false, multiple = false, closeOnSelect = !multiple, defaultInputValue, defaultMonth = /* @__PURE__ */ new Date(), range = false, defaultValue = range ? {
 		end: void 0,
 		start: void 0
-	} : multiple ? [] : void 0, disabled, focusOnClear = true, format, inputValue: inputValueProp, locale = defaultLocale, max, month: monthProp, openOnChange = true, openOnClick = true, openOnFocus = true, parseDate, pattern, placeholder: placeholderProp, readOnly, render = defaultRender, required, separator = range ? "-" : ",", value: valueProp, onChange: onChangeProp, onChangeMonth: onChangeMonthProp, onInputChange: onInputChangeProp, ...computedProps }, ariaProps, dataProps, eventProps } = require_use_field_props.useFieldProps(props);
+	} : multiple ? [] : void 0, disabled, focusOnClear = true, format, inputValue: inputValueProp, locale = defaultLocale, max, month: monthProp, openOnChange = true, openOnClick = true, openOnFocus = true, parseDate, pattern, placeholder: placeholderProp, placement = "end-start", readOnly, render = defaultRender, required, separator = range ? "-" : ",", value: valueProp, onChange: onChangeProp, onChangeMonth: onChangeMonthProp, onInputChange: onInputChangeProp, ...computedProps }, ariaProps, dataProps, eventProps } = require_use_field_props.useFieldProps(props);
 	const dateTimeFormat = require_use_format_date_time.useDateTimeFormat({ locale });
 	const { calendarFormat, inputFormat } = (0, react.useMemo)(() => {
 		const { input: inputFormat$1, ...calendarFormat$1 } = format ?? {};
@@ -117,7 +117,7 @@ const useDatePicker = ({ maxDate = require_use_calendar.DEFAULT_MAX_DATE, minDat
 		openOnClick: false,
 		openOnEnter: !allowInput,
 		openOnSpace: !allowInput,
-		placement: "end-start",
+		placement,
 		readOnly,
 		transferFocus: false,
 		...ariaProps,

package/dist/cjs/components/date-picker/use-date-picker.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-date-picker.cjs","names":["defaultRender: DatePickerRender","DEFAULT_MAX_DATE","DEFAULT_MIN_DATE","useI18n","useFieldProps","useDateTimeFormat","inputFormat","calendarFormat","useCalendarProps","useControllableState","value","getAdjustedMonth","isBeforeDate","isAfterDate","useCombobox","onClear","updateMaybeDateValue","startPlaceholder","inputValue","minDate","maxDate","isComposing","ev","getRootProps: PropGetter","props","getFieldProps: PropGetter","mergeRefs","ref","getInputProps: PropGetter<\"input\", { align?: InputAlign }>","inputProps: HTMLProps<\"input\">","visuallyHiddenAttributes","getContentProps: PropGetter","getCalendarProps: PropGetter<UseCalendarProps<Multiple, Range>>","getIconProps: PropGetter","runKeyAction"],"sources":["../../../../src/components/date-picker/use-date-picker.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n ChangeEvent,\n FocusEvent,\n KeyboardEvent,\n MouseEvent,\n ReactNode,\n} from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { UseComboboxProps } from \"../../hooks/use-combobox\"\nimport type { Dict } from \"../../utils\"\nimport type {\n CalendarFormat,\n MaybeDateValue,\n UseCalendarProps,\n} from \"../calendar\"\nimport type { FieldProps } from \"../field\"\nimport dayjs from \"dayjs\"\nimport {\n cloneElement,\n isValidElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport { useCombobox } from \"../../hooks/use-combobox\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n cast,\n contains,\n dataAttr,\n focusTransfer,\n handlerAll,\n isArray,\n isComposing,\n isDate,\n isNumber,\n isObject,\n mergeRefs,\n runIfFn,\n runKeyAction,\n useUpdateEffect,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport {\n DEFAULT_MAX_DATE,\n DEFAULT_MIN_DATE,\n getAdjustedMonth,\n isAfterDate,\n isBeforeDate,\n updateMaybeDateValue,\n useCalendarProps,\n} from \"../calendar\"\nimport { useFieldProps } from \"../field\"\nimport { useDateTimeFormat } from \"../format\"\n\nexport interface DatePickerFormat extends CalendarFormat {\n input?: Intl.DateTimeFormatOptions \| null\n}\n\ntype InputAlign = \"end\" \| \"start\"\ntype MaybeInputValue<Range extends boolean = false> = Range extends true\n ? { end?: string; start?: string }\n : string \| undefined\n\ninterface DatePickerRenderProps {\n count: number\n date: Date\n focused: boolean\n index: number\n separator: string\n value: string\n onClear: () => void\n max?: number\n}\n\nexport interface DatePickerRender {\n (props: DatePickerRenderProps): ReactNode\n}\n\nconst defaultRender: DatePickerRender = ({\n count,\n focused,\n index,\n max,\n separator,\n value,\n}) => {\n const last = count - 1 === index\n\n return (\n <span style={{ marginInlineEnd: \"var(--gap)\" }}>\n {value}\n {((!isNumber(max) \|\| count < max) && focused) \|\| !last ? separator : null}\n </span>\n )\n}\n\nexport interface UseDatePickerProps<\n Multiple extends boolean = false,\n Range extends boolean = false,\n>\n extends\n Omit<UseCalendarProps<Multiple, Range>, \"format\" \| \"ref\">,\n Omit<\n UseComboboxProps,\n \"defaultValue\" \| \"initialFocusValue\" \| \"onChange\" \| \"ref\" \| \"value\"\n >,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /*\n If `true`, allows input.\n \n @default true\n /\n allowInput?: boolean\n /\n If `true`, allows input of dates beyond the `minDate` and `maxDate` restrictions.\n \n @default true\n /\n allowInputBeyond?: boolean\n /\n If `true`, the date picker will be closed when the input value changes.\n \n @default false\n /\n closeOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n The initial value of the input.\n /\n defaultInputValue?: MaybeInputValue<Range>\n /\n If `true`, the input will be focused when the clear icon is clicked.\n \n @default true\n /\n focusOnClear?: boolean\n /\n The format used for conversion.\n * Check the docs to see the format of possible modifiers you can pass.\n \n @see https://day.js.org/docs/en/display/format#list-of-localized-formats\n /\n format?: DatePickerFormat\n /\n The `id` attribute of the input element.\n /\n id?: string\n /\n The value of the input.\n /\n inputValue?: MaybeInputValue<Range>\n /\n The `name` attribute of the input element.\n /\n name?: string\n /\n If `true`, the date picker will be opened when the input value changes.\n \n @default true\n /\n openOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n If `true`, the date picker will be opened when the input is focused.\n \n @default true\n /\n openOnFocus?: boolean\n /\n The pattern used to check the input element.\n /\n pattern?: RegExp\n /\n The placeholder for date picker.\n /\n placeholder?: string\n /\n The visual separator between each value.\n \n @default ','\n /\n separator?: string\n /\n The callback invoked when input value state changes.\n /\n onInputChange?: (value: MaybeInputValue<Range>) => void\n /\n Function that converts the input value to Date type.\n /\n parseDate?: (value: string) => Date \| undefined\n /\n The function to render the selected date.\n */\n render?: (props: DatePickerRenderProps) => ReactNode\n}\n\nexport const useDatePicker = <\n Multiple extends boolean = false,\n Range extends boolean = false,\n>({\n maxDate = DEFAULT_MAX_DATE,\n minDate = DEFAULT_MIN_DATE,\n ...props\n}: UseDatePickerProps<Multiple, Range> = {}) => {\n if (dayjs(minDate).isAfter(dayjs(maxDate))) maxDate = minDate\n\n const { locale: defaultLocale, t } = useI18n(\"datePicker\")\n const {\n props: {\n id,\n ref,\n name,\n allowInput = true,\n allowInputBeyond = false,\n closeOnChange = false,\n multiple = false,\n closeOnSelect = !multiple,\n defaultInputValue,\n defaultMonth = new Date(),\n range = false,\n defaultValue = (range\n ? { end: undefined, start: undefined }\n : multiple\n ? []\n : undefined) as MaybeDateValue<Multiple, Range>,\n disabled,\n focusOnClear = true,\n format,\n inputValue: inputValueProp,\n locale = defaultLocale,\n max,\n month: monthProp,\n openOnChange = true,\n openOnClick = true,\n openOnFocus = true,\n parseDate,\n pattern,\n placeholder: placeholderProp,\n readOnly,\n render = defaultRender,\n required,\n separator = range ? \"-\" : \",\",\n value: valueProp,\n onChange: onChangeProp,\n onChangeMonth: onChangeMonthProp,\n onInputChange: onInputChangeProp,\n ...computedProps\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const dateTimeFormat = useDateTimeFormat({ locale })\n const { calendarFormat, inputFormat } = useMemo(() => {\n const { input: inputFormat, ...calendarFormat } = format ?? {}\n const defaultInputFormat: Intl.DateTimeFormatOptions = {\n day: \"numeric\",\n month: \"long\",\n year: \"numeric\",\n }\n\n return {\n calendarFormat,\n inputFormat:\n inputFormat !== null ? (inputFormat ?? defaultInputFormat) : undefined,\n }\n }, [format])\n const [calendarProps, rest] = useCalendarProps<Multiple, Range>(computedProps)\n const { excludeDate } = calendarProps\n const fieldRef = useRef<HTMLDivElement>(null)\n const contentRef = useRef<HTMLDivElement>(null)\n const startInputRef = useRef<HTMLInputElement>(null)\n const endInputRef = useRef<HTMLInputElement>(null)\n const focusByClickRef = useRef<boolean>(false)\n const [focused, setFocused] = useState(false)\n const [value, setValue] = useControllableState({\n defaultValue: defaultValue as MaybeDateValue<Multiple, Range>,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [month, setMonth] = useControllableState({\n defaultValue: () => {\n let value = defaultMonth\n\n if (dayjs(minDate).isAfter(dayjs(defaultMonth)))\n value = dayjs(minDate).set(\"date\", 1).toDate()\n\n if (valueProp) {\n value = getAdjustedMonth(valueProp, value)\n } else if (defaultValue) {\n value = getAdjustedMonth(defaultValue, value)\n }\n\n return value\n },\n value: monthProp,\n onChange: onChangeMonthProp,\n })\n const stringToDate = useCallback(\n (value: string, start: Date = minDate, end: Date = maxDate) => {\n let date = parseDate?.(value)\n\n if (!date && dayjs(value).isValid()) date = dayjs(value, locale).toDate()\n\n if (date == null) return undefined\n if (excludeDate?.(date)) return undefined\n\n if (!allowInputBeyond) {\n if (isBeforeDate(date, start)) date = start\n if (isAfterDate(date, end)) date = end\n }\n\n return date\n },\n [allowInputBeyond, excludeDate, locale, maxDate, minDate, parseDate],\n )\n const dateToString = useCallback(\n (date?: Date) => {\n if (date == null) return \"\"\n\n return dateTimeFormat(date, inputFormat)\n },\n [dateTimeFormat, inputFormat],\n )\n const [inputValue, setInputValue] = useControllableState({\n defaultValue: () => {\n if (defaultInputValue) {\n if (isObject(defaultInputValue)) {\n if (dayjs(defaultInputValue.start).isValid())\n defaultInputValue.start = dateTimeFormat(\n dayjs(defaultInputValue.start).toDate(),\n inputFormat,\n )\n\n if (dayjs(defaultInputValue.end).isValid())\n defaultInputValue.end = dateTimeFormat(\n dayjs(defaultInputValue.end).toDate(),\n inputFormat,\n )\n\n return defaultInputValue\n } else {\n if (dayjs(defaultInputValue).isValid()) {\n return dateTimeFormat(\n dayjs(defaultInputValue).toDate(),\n inputFormat,\n ) as MaybeInputValue<Range>\n } else {\n return defaultInputValue as MaybeInputValue<Range>\n }\n }\n } else if (isDate(value)) {\n return dateToString(value) as MaybeInputValue<Range>\n } else if (isObject(value) && !isArray(value)) {\n return {\n end: dateToString(value.end),\n start: dateToString(value.start),\n } as MaybeInputValue<Range>\n } else {\n return \"\" as MaybeInputValue<Range>\n }\n },\n value: inputValueProp,\n onChange: onInputChangeProp,\n })\n const {\n interactive,\n open,\n getContentProps: getComboboxContentProps,\n getTriggerProps,\n popoverProps,\n onClose,\n onOpen,\n } = useCombobox({\n disabled,\n matchWidth: false,\n openOnClick: false,\n openOnEnter: !allowInput,\n openOnSpace: !allowInput,\n placement: \"end-start\",\n readOnly,\n transferFocus: false,\n ...ariaProps,\n ...dataProps,\n ...eventProps,\n ...rest,\n })\n const children = useMemo<ReactNode>(() => {\n if (!isArray(value)) return null\n\n const count = value.length\n\n return value.map((date, index) => {\n const value = dateToString(date)\n\n const onClear = (ev?: MouseEvent<HTMLElement>) => {\n ev?.preventDefault()\n ev?.stopPropagation()\n\n setValue(\n (prev) =>\n updateMaybeDateValue(date, max)(prev) as MaybeDateValue<\n Multiple,\n Range\n >,\n )\n }\n\n const component = render({\n count,\n date,\n focused,\n index,\n max,\n separator,\n value,\n onClear,\n })\n\n if (isValidElement<Dict>(component)) {\n return cloneElement(component, { ...component.props, key: index })\n } else {\n return component\n }\n })\n }, [dateToString, focused, max, render, separator, setValue, value])\n const { endPlaceholder, startPlaceholder } = useMemo(() => {\n if (range) {\n const startPlaceholder =\n placeholderProp ?? dateTimeFormat(new Date(), inputFormat)\n const endPlaceholder =\n placeholderProp ??\n dateTimeFormat(dayjs().add(1, \"day\").toDate(), inputFormat)\n\n return { endPlaceholder, startPlaceholder }\n } else {\n const placeholder =\n placeholderProp ?? dateTimeFormat(new Date(), inputFormat)\n\n return { endPlaceholder: placeholder, startPlaceholder: placeholder }\n }\n }, [dateTimeFormat, inputFormat, placeholderProp, range])\n\n const onChange = useCallback(\n (value: MaybeDateValue<Multiple, Range>) => {\n setValue(value)\n\n if (isArray(value)) {\n setInputValue(\"\" as MaybeInputValue<Range>)\n } else if (isObject(value) && !isDate(value)) {\n setInputValue({\n end: dateToString(value.end),\n start: dateToString(value.start),\n } as MaybeInputValue<Range>)\n } else {\n setInputValue(dateToString(value) as MaybeInputValue<Range>)\n }\n\n if (!closeOnSelect) return\n\n if (isObject(value) && !isArray(value) && !isDate(value)) {\n if (value.end && value.start) onClose()\n } else {\n onClose()\n }\n },\n [setValue, closeOnSelect, setInputValue, dateToString, onClose],\n )\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!allowInput) return\n if (isArray(value) && value.length === max) return\n\n if (runIfFn(closeOnChange, ev)) {\n onClose()\n } else if (runIfFn(openOnChange, ev)) {\n onOpen()\n }\n\n let inputValue = ev.target.value\n\n if (pattern) inputValue = inputValue.replace(pattern, \"\")\n\n if (isArray(value)) {\n const date = stringToDate(inputValue)\n\n setInputValue(inputValue as MaybeInputValue<Range>)\n\n if (date) setMonth(dayjs(date).set(\"date\", 1).toDate())\n } else if (isObject(value) && !isDate(value)) {\n const align = contains(endInputRef.current, ev.target) ? \"end\" : \"start\"\n const minDate =\n value.start && align === \"end\"\n ? dayjs(value.start).add(1, \"day\").toDate()\n : undefined\n const maxDate =\n value.end && align === \"start\"\n ? dayjs(value.end).subtract(1, \"day\").toDate()\n : undefined\n const date = stringToDate(inputValue, minDate, maxDate)\n\n setInputValue((prev) =>\n isObject(prev)\n ? Object.assign({}, prev, { [align]: inputValue })\n : prev,\n )\n setValue((prev) =>\n isObject(prev) && !isDate(prev) ? { ...prev, [align]: date } : prev,\n )\n } else {\n const date = stringToDate(inputValue)\n\n setInputValue(inputValue as MaybeInputValue<Range>)\n setValue(date as MaybeDateValue<Multiple, Range>)\n }\n },\n [\n allowInput,\n closeOnChange,\n max,\n onClose,\n onOpen,\n openOnChange,\n pattern,\n setInputValue,\n setMonth,\n setValue,\n stringToDate,\n value,\n ],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n if (disabled \|\| isComposing(ev)) return\n\n const inputValue = cast<HTMLInputElement>(ev.target).value\n\n runKeyAction(\n ev,\n {\n Backspace: (ev) => {\n if (!value \|\| isDate(value)) return\n if (inputValue.length) return\n\n if (isArray(value)) {\n ev.preventDefault()\n\n setValue((prev) =>\n isArray(prev)\n ? (prev.slice(0, -1) as MaybeDateValue<Multiple, Range>)\n : prev,\n )\n } else if (contains(endInputRef.current, ev.target)) {\n ev.preventDefault()\n\n setInputValue({ end: \"\", start: \"\" } as MaybeInputValue<Range>)\n setValue({ end: undefined, start: undefined } as MaybeDateValue<\n Multiple,\n Range\n >)\n\n startInputRef.current?.focus()\n }\n },\n Enter: (ev) => {\n if (!open \|\| !inputValue.length) return\n\n if (isDate(value) \|\| isArray(value)) {\n const date = stringToDate(inputValue)\n\n if (!date) return\n\n ev.preventDefault()\n\n if (isArray(value)) {\n setInputValue(\"\" as MaybeInputValue<Range>)\n } else {\n setInputValue(dateToString(date) as MaybeInputValue<Range>)\n }\n\n setValue(\n (prev) =>\n updateMaybeDateValue(date, max)(prev) as MaybeDateValue<\n Multiple,\n Range\n >,\n )\n } else if (isObject(value)) {\n const align = contains(endInputRef.current, ev.target)\n ? \"end\"\n : \"start\"\n const minDate =\n value.start && align === \"end\"\n ? dayjs(value.start).add(1, \"day\").toDate()\n : undefined\n const maxDate =\n value.end && align === \"start\"\n ? dayjs(value.end).subtract(1, \"day\").toDate()\n : undefined\n const date = stringToDate(inputValue, minDate, maxDate)\n\n if (!date) return\n\n ev.preventDefault()\n\n setInputValue((prev) =>\n isObject(prev)\n ? Object.assign({}, prev, { [align]: dateToString(date) })\n : prev,\n )\n setValue((prev) =>\n isObject(prev) && !isDate(prev)\n ? { ...prev, [align]: date }\n : prev,\n )\n\n if (align === \"start\") endInputRef.current?.focus()\n }\n },\n },\n { preventDefault: false },\n )\n },\n [\n dateToString,\n disabled,\n max,\n open,\n setInputValue,\n setValue,\n stringToDate,\n value,\n ],\n )\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (!interactive) return\n\n focusByClickRef.current = true\n\n if (allowInput) {\n if (isObject(value) && !isArray(value) && !isDate(value)) {\n if (contains(startInputRef.current, ev.target)) return\n if (contains(endInputRef.current, ev.target)) return\n\n const { end, start } = value\n\n if ((!start && !end) \|\| !!end) {\n startInputRef.current?.focus()\n } else {\n endInputRef.current?.focus()\n }\n } else {\n startInputRef.current?.focus()\n }\n }\n\n if (openOnClick) onOpen()\n },\n [allowInput, interactive, onOpen, openOnClick, value],\n )\n\n const onMouseDown = useCallback(\n (ev: MouseEvent<HTMLDivElement \| HTMLInputElement>) => {\n if (!openOnFocus) return\n\n ev.preventDefault()\n ev.stopPropagation()\n },\n [openOnFocus],\n )\n\n const onFieldFocus = useCallback(() => {\n if (allowInput) return\n\n if (openOnFocus) onOpen()\n\n focusByClickRef.current = false\n }, [allowInput, onOpen, openOnFocus])\n\n const onInputFocus = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n ev.preventDefault()\n ev.stopPropagation()\n\n setFocused(true)\n\n if (openOnFocus && !focusByClickRef.current) onOpen()\n\n focusByClickRef.current = false\n },\n [onOpen, openOnFocus],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n setFocused(false)\n\n if (\n contains(fieldRef.current, ev.relatedTarget) \|\|\n contains(contentRef.current, ev.relatedTarget)\n ) {\n ev.preventDefault()\n } else {\n if (isArray(value)) {\n setInputValue(\"\" as MaybeInputValue<Range>)\n } else if (isObject(value) && !isDate(value)) {\n setInputValue((prev) =>\n isObject(prev)\n ? ({\n end: dateToString(value.end),\n start: dateToString(value.start),\n } as MaybeInputValue<Range>)\n : prev,\n )\n } else {\n setInputValue(dateToString(value) as MaybeInputValue<Range>)\n }\n }\n },\n [dateToString, setInputValue, value],\n )\n\n const onClear = useCallback(() => {\n if (!interactive) return\n\n setValue((prev) => {\n if (isDate(prev)) {\n return undefined as MaybeDateValue<Multiple, Range>\n } else if (isArray(prev)) {\n return [] as unknown as MaybeDateValue<Multiple, Range>\n } else if (isObject(prev)) {\n return { end: undefined, start: undefined } as MaybeDateValue<\n Multiple,\n Range\n >\n } else {\n return prev\n }\n })\n\n setInputValue(\n (range ? { end: \"\", start: \"\" } : \"\") as MaybeInputValue<Range>,\n )\n\n if (focusOnClear) {\n if (allowInput) {\n startInputRef.current?.focus()\n } else {\n fieldRef.current?.focus()\n }\n }\n }, [allowInput, focusOnClear, interactive, range, setInputValue, setValue])\n\n useEffect(() => {\n if (!open) return\n\n return focusTransfer(\n contentRef.current,\n allowInput ? startInputRef.current : fieldRef.current,\n )\n }, [allowInput, open])\n\n useUpdateEffect(() => {\n setMonth((prev) => getAdjustedMonth(value, prev))\n }, [value, range])\n\n useUpdateEffect(() => {\n if (isArray(valueProp)) return\n\n if (isObject(valueProp) && !isDate(valueProp)) {\n setInputValue({\n end: dateToString(valueProp.end),\n start: dateToString(valueProp.start),\n } as MaybeInputValue<Range>)\n } else {\n setInputValue(dateToString(valueProp) as MaybeInputValue<Range>)\n }\n }, [valueProp])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n \"data-range\": dataAttr(range),\n ...dataProps,\n ...props,\n }),\n [dataProps, range],\n )\n\n const getFieldProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getTriggerProps({\n ref: mergeRefs(ref, fieldRef),\n \"aria-haspopup\": \"dialog\",\n tabIndex: !allowInput ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onClick),\n onFocus: handlerAll(props.onFocus, onFieldFocus),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }),\n\n [allowInput, getTriggerProps, onClick, onFieldFocus, onMouseDown],\n )\n\n const getInputProps: PropGetter<\"input\", { align?: InputAlign }> =\n useCallback(\n ({ align = \"start\", ...props } = {}) => {\n const inputProps: HTMLProps<\"input\"> = {\n style: {\n ...(!allowInput ? { pointerEvents: \"none\" } : {}),\n ...props.style,\n },\n autoComplete: \"off\",\n disabled,\n readOnly,\n required,\n tabIndex: allowInput ? 0 : -1,\n ...dataProps,\n ...props,\n onBlur: handlerAll(props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onFocus: handlerAll(props.onFocus, onInputFocus),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }\n\n if (isObject(inputValue)) {\n if (align === \"start\") {\n inputProps.ref = mergeRefs(props.ref, ref, startInputRef)\n inputProps.value = inputValue.start\n inputProps.placeholder = startPlaceholder\n } else {\n inputProps.ref = mergeRefs(props.ref, ref, endInputRef)\n inputProps.value = inputValue.end\n inputProps.placeholder = endPlaceholder\n }\n\n if (!inputValue.start && align === \"start\") {\n inputProps.id = id\n inputProps.name = name\n }\n\n if (!!inputValue.start && align === \"end\") {\n inputProps.id = id\n inputProps.name = name\n }\n } else {\n inputProps.ref = mergeRefs(props.ref, ref, startInputRef)\n inputProps.value = inputValue\n inputProps.id = id\n inputProps.name = name\n\n if (isArray(value)) {\n inputProps.style = {\n ...(!focused && !!value.length\n ? visuallyHiddenAttributes.style\n : {}),\n ...inputProps.style,\n }\n inputProps.placeholder = !value.length\n ? startPlaceholder\n : undefined\n inputProps[\"data-max\"] = dataAttr(\n isNumber(max) && value.length >= max,\n )\n } else {\n inputProps.placeholder = startPlaceholder\n }\n }\n\n return inputProps\n },\n [\n allowInput,\n dataProps,\n disabled,\n endPlaceholder,\n focused,\n id,\n inputValue,\n max,\n name,\n onBlur,\n onInputFocus,\n onInputChange,\n onKeyDown,\n onMouseDown,\n readOnly,\n ref,\n required,\n startPlaceholder,\n value,\n ],\n )\n\n const getContentProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getComboboxContentProps({\n ref: mergeRefs(ref, contentRef),\n role: \"dialog\",\n ...props,\n }),\n [getComboboxContentProps],\n )\n\n const getCalendarProps: PropGetter<UseCalendarProps<Multiple, Range>> =\n useCallback(\n (props) =>\n ({\n disabled: !interactive,\n format: calendarFormat,\n locale,\n max,\n maxDate,\n minDate,\n month,\n multiple,\n range,\n value,\n onChange,\n onChangeMonth: setMonth,\n ...calendarProps,\n ...props,\n }) as UseCalendarProps<Multiple, Range>,\n [\n interactive,\n calendarFormat,\n locale,\n max,\n maxDate,\n minDate,\n month,\n multiple,\n range,\n value,\n onChange,\n setMonth,\n calendarProps,\n ],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props) => ({ ...dataProps, ...props }),\n [dataProps],\n )\n\n const getClearIconProps: PropGetter = useCallback(\n (props = {}) =>\n getIconProps({\n \"aria-disabled\": ariaAttr(!interactive),\n \"aria-label\": t(\"Clear value\"),\n role: \"button\",\n tabIndex: interactive ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onClear),\n onKeyDown: handlerAll(props.onKeyDown, (ev) =>\n runKeyAction(ev, { Enter: onClear, Space: onClear }),\n ),\n }),\n [getIconProps, interactive, onClear, t],\n )\n\n return {\n children,\n dateToString,\n inputValue,\n interactive,\n month,\n open,\n range,\n separator,\n setInputValue,\n setMonth,\n setValue,\n stringToDate,\n value,\n getCalendarProps,\n getClearIconProps,\n getContentProps,\n getFieldProps,\n getIconProps,\n getInputProps,\n getRootProps,\n popoverProps,\n onChange,\n onClose,\n onInputChange,\n onOpen,\n }\n}\n\nexport type UseDatePickerReturn = ReturnType<typeof useDatePicker>\n"],"mappings":"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ACA;EACA;EACA;EACA,eAAe;EACf,GAAG;EACH,GAAGR;EACJ,GACH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAEH,MAAMS,uCACH,aAAW;EAAE,GAAG;EAAW,GAAGT;EAAO,GACtC,CAAC,UAAU,CACZ;AAkBD,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,2CA9BC,UAAQ,EAAE,KACT,aAAa;GACX,iEAA0B,CAAC,YAAY;GACvC,cAAc,EAAE,cAAc;GAC9B,MAAM;GACN,UAAU,cAAc,IAAI;GAC5B,GAAGA;GACH,2DAAoBA,QAAM,SAAS,QAAQ;GAC3C,6DAAsBA,QAAM,YAAY,OACtCU,yBAAa,IAAI;IAAE,OAAO;IAAS,OAAO;IAAS,CAAC,CACrD;GACF,CAAC,EACJ;GAAC;GAAc;GAAa;GAAS;GAAE,CACxC;EAkBC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD"}
1	+ {"version":3,"file":"use-date-picker.cjs","names":["defaultRender: DatePickerRender","DEFAULT_MAX_DATE","DEFAULT_MIN_DATE","useI18n","useFieldProps","useDateTimeFormat","inputFormat","calendarFormat","useCalendarProps","useControllableState","value","getAdjustedMonth","isBeforeDate","isAfterDate","useCombobox","onClear","updateMaybeDateValue","startPlaceholder","inputValue","minDate","maxDate","isComposing","ev","getRootProps: PropGetter","props","getFieldProps: PropGetter","mergeRefs","ref","getInputProps: PropGetter<\"input\", { align?: InputAlign }>","inputProps: HTMLProps<\"input\">","visuallyHiddenAttributes","getContentProps: PropGetter","getCalendarProps: PropGetter<UseCalendarProps<Multiple, Range>>","getIconProps: PropGetter","runKeyAction"],"sources":["../../../../src/components/date-picker/use-date-picker.tsx"],"sourcesContent":["\"use client\"\n\nimport type {\n ChangeEvent,\n FocusEvent,\n KeyboardEvent,\n MouseEvent,\n ReactNode,\n} from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { UseComboboxProps } from \"../../hooks/use-combobox\"\nimport type { Dict } from \"../../utils\"\nimport type {\n CalendarFormat,\n MaybeDateValue,\n UseCalendarProps,\n} from \"../calendar\"\nimport type { FieldProps } from \"../field\"\nimport dayjs from \"dayjs\"\nimport {\n cloneElement,\n isValidElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport { useCombobox } from \"../../hooks/use-combobox\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n ariaAttr,\n cast,\n contains,\n dataAttr,\n focusTransfer,\n handlerAll,\n isArray,\n isComposing,\n isDate,\n isNumber,\n isObject,\n mergeRefs,\n runIfFn,\n runKeyAction,\n useUpdateEffect,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport {\n DEFAULT_MAX_DATE,\n DEFAULT_MIN_DATE,\n getAdjustedMonth,\n isAfterDate,\n isBeforeDate,\n updateMaybeDateValue,\n useCalendarProps,\n} from \"../calendar\"\nimport { useFieldProps } from \"../field\"\nimport { useDateTimeFormat } from \"../format\"\n\nexport interface DatePickerFormat extends CalendarFormat {\n input?: Intl.DateTimeFormatOptions \| null\n}\n\ntype InputAlign = \"end\" \| \"start\"\ntype MaybeInputValue<Range extends boolean = false> = Range extends true\n ? { end?: string; start?: string }\n : string \| undefined\n\ninterface DatePickerRenderProps {\n count: number\n date: Date\n focused: boolean\n index: number\n separator: string\n value: string\n onClear: () => void\n max?: number\n}\n\nexport interface DatePickerRender {\n (props: DatePickerRenderProps): ReactNode\n}\n\nconst defaultRender: DatePickerRender = ({\n count,\n focused,\n index,\n max,\n separator,\n value,\n}) => {\n const last = count - 1 === index\n\n return (\n <span style={{ marginInlineEnd: \"var(--gap)\" }}>\n {value}\n {((!isNumber(max) \|\| count < max) && focused) \|\| !last ? separator : null}\n </span>\n )\n}\n\nexport interface UseDatePickerProps<\n Multiple extends boolean = false,\n Range extends boolean = false,\n>\n extends\n Omit<UseCalendarProps<Multiple, Range>, \"format\" \| \"ref\">,\n Omit<\n UseComboboxProps,\n \"defaultValue\" \| \"initialFocusValue\" \| \"onChange\" \| \"ref\" \| \"value\"\n >,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /*\n If `true`, allows input.\n \n @default true\n /\n allowInput?: boolean\n /\n If `true`, allows input of dates beyond the `minDate` and `maxDate` restrictions.\n \n @default true\n /\n allowInputBeyond?: boolean\n /\n If `true`, the date picker will be closed when the input value changes.\n \n @default false\n /\n closeOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n The initial value of the input.\n /\n defaultInputValue?: MaybeInputValue<Range>\n /\n If `true`, the input will be focused when the clear icon is clicked.\n \n @default true\n /\n focusOnClear?: boolean\n /\n The format used for conversion.\n * Check the docs to see the format of possible modifiers you can pass.\n \n @see https://day.js.org/docs/en/display/format#list-of-localized-formats\n /\n format?: DatePickerFormat\n /\n The `id` attribute of the input element.\n /\n id?: string\n /\n The value of the input.\n /\n inputValue?: MaybeInputValue<Range>\n /\n The `name` attribute of the input element.\n /\n name?: string\n /\n If `true`, the date picker will be opened when the input value changes.\n \n @default true\n /\n openOnChange?: ((ev: ChangeEvent<HTMLInputElement>) => boolean) \| boolean\n /\n If `true`, the date picker will be opened when the input is focused.\n \n @default true\n /\n openOnFocus?: boolean\n /\n The pattern used to check the input element.\n /\n pattern?: RegExp\n /\n The placeholder for date picker.\n /\n placeholder?: string\n /\n The visual separator between each value.\n \n @default ','\n /\n separator?: string\n /\n The callback invoked when input value state changes.\n /\n onInputChange?: (value: MaybeInputValue<Range>) => void\n /\n Function that converts the input value to Date type.\n /\n parseDate?: (value: string) => Date \| undefined\n /\n The function to render the selected date.\n */\n render?: (props: DatePickerRenderProps) => ReactNode\n}\n\nexport const useDatePicker = <\n Multiple extends boolean = false,\n Range extends boolean = false,\n>({\n maxDate = DEFAULT_MAX_DATE,\n minDate = DEFAULT_MIN_DATE,\n ...props\n}: UseDatePickerProps<Multiple, Range> = {}) => {\n if (dayjs(minDate).isAfter(dayjs(maxDate))) maxDate = minDate\n\n const { locale: defaultLocale, t } = useI18n(\"datePicker\")\n const {\n props: {\n id,\n ref,\n name,\n allowInput = true,\n allowInputBeyond = false,\n closeOnChange = false,\n multiple = false,\n closeOnSelect = !multiple,\n defaultInputValue,\n defaultMonth = new Date(),\n range = false,\n defaultValue = (range\n ? { end: undefined, start: undefined }\n : multiple\n ? []\n : undefined) as MaybeDateValue<Multiple, Range>,\n disabled,\n focusOnClear = true,\n format,\n inputValue: inputValueProp,\n locale = defaultLocale,\n max,\n month: monthProp,\n openOnChange = true,\n openOnClick = true,\n openOnFocus = true,\n parseDate,\n pattern,\n placeholder: placeholderProp,\n placement = \"end-start\",\n readOnly,\n render = defaultRender,\n required,\n separator = range ? \"-\" : \",\",\n value: valueProp,\n onChange: onChangeProp,\n onChangeMonth: onChangeMonthProp,\n onInputChange: onInputChangeProp,\n ...computedProps\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const dateTimeFormat = useDateTimeFormat({ locale })\n const { calendarFormat, inputFormat } = useMemo(() => {\n const { input: inputFormat, ...calendarFormat } = format ?? {}\n const defaultInputFormat: Intl.DateTimeFormatOptions = {\n day: \"numeric\",\n month: \"long\",\n year: \"numeric\",\n }\n\n return {\n calendarFormat,\n inputFormat:\n inputFormat !== null ? (inputFormat ?? defaultInputFormat) : undefined,\n }\n }, [format])\n const [calendarProps, rest] = useCalendarProps<Multiple, Range>(computedProps)\n const { excludeDate } = calendarProps\n const fieldRef = useRef<HTMLDivElement>(null)\n const contentRef = useRef<HTMLDivElement>(null)\n const startInputRef = useRef<HTMLInputElement>(null)\n const endInputRef = useRef<HTMLInputElement>(null)\n const focusByClickRef = useRef<boolean>(false)\n const [focused, setFocused] = useState(false)\n const [value, setValue] = useControllableState({\n defaultValue: defaultValue as MaybeDateValue<Multiple, Range>,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [month, setMonth] = useControllableState({\n defaultValue: () => {\n let value = defaultMonth\n\n if (dayjs(minDate).isAfter(dayjs(defaultMonth)))\n value = dayjs(minDate).set(\"date\", 1).toDate()\n\n if (valueProp) {\n value = getAdjustedMonth(valueProp, value)\n } else if (defaultValue) {\n value = getAdjustedMonth(defaultValue, value)\n }\n\n return value\n },\n value: monthProp,\n onChange: onChangeMonthProp,\n })\n const stringToDate = useCallback(\n (value: string, start: Date = minDate, end: Date = maxDate) => {\n let date = parseDate?.(value)\n\n if (!date && dayjs(value).isValid()) date = dayjs(value, locale).toDate()\n\n if (date == null) return undefined\n if (excludeDate?.(date)) return undefined\n\n if (!allowInputBeyond) {\n if (isBeforeDate(date, start)) date = start\n if (isAfterDate(date, end)) date = end\n }\n\n return date\n },\n [allowInputBeyond, excludeDate, locale, maxDate, minDate, parseDate],\n )\n const dateToString = useCallback(\n (date?: Date) => {\n if (date == null) return \"\"\n\n return dateTimeFormat(date, inputFormat)\n },\n [dateTimeFormat, inputFormat],\n )\n const [inputValue, setInputValue] = useControllableState({\n defaultValue: () => {\n if (defaultInputValue) {\n if (isObject(defaultInputValue)) {\n if (dayjs(defaultInputValue.start).isValid())\n defaultInputValue.start = dateTimeFormat(\n dayjs(defaultInputValue.start).toDate(),\n inputFormat,\n )\n\n if (dayjs(defaultInputValue.end).isValid())\n defaultInputValue.end = dateTimeFormat(\n dayjs(defaultInputValue.end).toDate(),\n inputFormat,\n )\n\n return defaultInputValue\n } else {\n if (dayjs(defaultInputValue).isValid()) {\n return dateTimeFormat(\n dayjs(defaultInputValue).toDate(),\n inputFormat,\n ) as MaybeInputValue<Range>\n } else {\n return defaultInputValue as MaybeInputValue<Range>\n }\n }\n } else if (isDate(value)) {\n return dateToString(value) as MaybeInputValue<Range>\n } else if (isObject(value) && !isArray(value)) {\n return {\n end: dateToString(value.end),\n start: dateToString(value.start),\n } as MaybeInputValue<Range>\n } else {\n return \"\" as MaybeInputValue<Range>\n }\n },\n value: inputValueProp,\n onChange: onInputChangeProp,\n })\n const {\n interactive,\n open,\n getContentProps: getComboboxContentProps,\n getTriggerProps,\n popoverProps,\n onClose,\n onOpen,\n } = useCombobox({\n disabled,\n matchWidth: false,\n openOnClick: false,\n openOnEnter: !allowInput,\n openOnSpace: !allowInput,\n placement,\n readOnly,\n transferFocus: false,\n ...ariaProps,\n ...dataProps,\n ...eventProps,\n ...rest,\n })\n const children = useMemo<ReactNode>(() => {\n if (!isArray(value)) return null\n\n const count = value.length\n\n return value.map((date, index) => {\n const value = dateToString(date)\n\n const onClear = (ev?: MouseEvent<HTMLElement>) => {\n ev?.preventDefault()\n ev?.stopPropagation()\n\n setValue(\n (prev) =>\n updateMaybeDateValue(date, max)(prev) as MaybeDateValue<\n Multiple,\n Range\n >,\n )\n }\n\n const component = render({\n count,\n date,\n focused,\n index,\n max,\n separator,\n value,\n onClear,\n })\n\n if (isValidElement<Dict>(component)) {\n return cloneElement(component, { ...component.props, key: index })\n } else {\n return component\n }\n })\n }, [dateToString, focused, max, render, separator, setValue, value])\n const { endPlaceholder, startPlaceholder } = useMemo(() => {\n if (range) {\n const startPlaceholder =\n placeholderProp ?? dateTimeFormat(new Date(), inputFormat)\n const endPlaceholder =\n placeholderProp ??\n dateTimeFormat(dayjs().add(1, \"day\").toDate(), inputFormat)\n\n return { endPlaceholder, startPlaceholder }\n } else {\n const placeholder =\n placeholderProp ?? dateTimeFormat(new Date(), inputFormat)\n\n return { endPlaceholder: placeholder, startPlaceholder: placeholder }\n }\n }, [dateTimeFormat, inputFormat, placeholderProp, range])\n\n const onChange = useCallback(\n (value: MaybeDateValue<Multiple, Range>) => {\n setValue(value)\n\n if (isArray(value)) {\n setInputValue(\"\" as MaybeInputValue<Range>)\n } else if (isObject(value) && !isDate(value)) {\n setInputValue({\n end: dateToString(value.end),\n start: dateToString(value.start),\n } as MaybeInputValue<Range>)\n } else {\n setInputValue(dateToString(value) as MaybeInputValue<Range>)\n }\n\n if (!closeOnSelect) return\n\n if (isObject(value) && !isArray(value) && !isDate(value)) {\n if (value.end && value.start) onClose()\n } else {\n onClose()\n }\n },\n [setValue, closeOnSelect, setInputValue, dateToString, onClose],\n )\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!allowInput) return\n if (isArray(value) && value.length === max) return\n\n if (runIfFn(closeOnChange, ev)) {\n onClose()\n } else if (runIfFn(openOnChange, ev)) {\n onOpen()\n }\n\n let inputValue = ev.target.value\n\n if (pattern) inputValue = inputValue.replace(pattern, \"\")\n\n if (isArray(value)) {\n const date = stringToDate(inputValue)\n\n setInputValue(inputValue as MaybeInputValue<Range>)\n\n if (date) setMonth(dayjs(date).set(\"date\", 1).toDate())\n } else if (isObject(value) && !isDate(value)) {\n const align = contains(endInputRef.current, ev.target) ? \"end\" : \"start\"\n const minDate =\n value.start && align === \"end\"\n ? dayjs(value.start).add(1, \"day\").toDate()\n : undefined\n const maxDate =\n value.end && align === \"start\"\n ? dayjs(value.end).subtract(1, \"day\").toDate()\n : undefined\n const date = stringToDate(inputValue, minDate, maxDate)\n\n setInputValue((prev) =>\n isObject(prev)\n ? Object.assign({}, prev, { [align]: inputValue })\n : prev,\n )\n setValue((prev) =>\n isObject(prev) && !isDate(prev) ? { ...prev, [align]: date } : prev,\n )\n } else {\n const date = stringToDate(inputValue)\n\n setInputValue(inputValue as MaybeInputValue<Range>)\n setValue(date as MaybeDateValue<Multiple, Range>)\n }\n },\n [\n allowInput,\n closeOnChange,\n max,\n onClose,\n onOpen,\n openOnChange,\n pattern,\n setInputValue,\n setMonth,\n setValue,\n stringToDate,\n value,\n ],\n )\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n if (disabled \|\| isComposing(ev)) return\n\n const inputValue = cast<HTMLInputElement>(ev.target).value\n\n runKeyAction(\n ev,\n {\n Backspace: (ev) => {\n if (!value \|\| isDate(value)) return\n if (inputValue.length) return\n\n if (isArray(value)) {\n ev.preventDefault()\n\n setValue((prev) =>\n isArray(prev)\n ? (prev.slice(0, -1) as MaybeDateValue<Multiple, Range>)\n : prev,\n )\n } else if (contains(endInputRef.current, ev.target)) {\n ev.preventDefault()\n\n setInputValue({ end: \"\", start: \"\" } as MaybeInputValue<Range>)\n setValue({ end: undefined, start: undefined } as MaybeDateValue<\n Multiple,\n Range\n >)\n\n startInputRef.current?.focus()\n }\n },\n Enter: (ev) => {\n if (!open \|\| !inputValue.length) return\n\n if (isDate(value) \|\| isArray(value)) {\n const date = stringToDate(inputValue)\n\n if (!date) return\n\n ev.preventDefault()\n\n if (isArray(value)) {\n setInputValue(\"\" as MaybeInputValue<Range>)\n } else {\n setInputValue(dateToString(date) as MaybeInputValue<Range>)\n }\n\n setValue(\n (prev) =>\n updateMaybeDateValue(date, max)(prev) as MaybeDateValue<\n Multiple,\n Range\n >,\n )\n } else if (isObject(value)) {\n const align = contains(endInputRef.current, ev.target)\n ? \"end\"\n : \"start\"\n const minDate =\n value.start && align === \"end\"\n ? dayjs(value.start).add(1, \"day\").toDate()\n : undefined\n const maxDate =\n value.end && align === \"start\"\n ? dayjs(value.end).subtract(1, \"day\").toDate()\n : undefined\n const date = stringToDate(inputValue, minDate, maxDate)\n\n if (!date) return\n\n ev.preventDefault()\n\n setInputValue((prev) =>\n isObject(prev)\n ? Object.assign({}, prev, { [align]: dateToString(date) })\n : prev,\n )\n setValue((prev) =>\n isObject(prev) && !isDate(prev)\n ? { ...prev, [align]: date }\n : prev,\n )\n\n if (align === \"start\") endInputRef.current?.focus()\n }\n },\n },\n { preventDefault: false },\n )\n },\n [\n dateToString,\n disabled,\n max,\n open,\n setInputValue,\n setValue,\n stringToDate,\n value,\n ],\n )\n\n const onClick = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (!interactive) return\n\n focusByClickRef.current = true\n\n if (allowInput) {\n if (isObject(value) && !isArray(value) && !isDate(value)) {\n if (contains(startInputRef.current, ev.target)) return\n if (contains(endInputRef.current, ev.target)) return\n\n const { end, start } = value\n\n if ((!start && !end) \|\| !!end) {\n startInputRef.current?.focus()\n } else {\n endInputRef.current?.focus()\n }\n } else {\n startInputRef.current?.focus()\n }\n }\n\n if (openOnClick) onOpen()\n },\n [allowInput, interactive, onOpen, openOnClick, value],\n )\n\n const onMouseDown = useCallback(\n (ev: MouseEvent<HTMLDivElement \| HTMLInputElement>) => {\n if (!openOnFocus) return\n\n ev.preventDefault()\n ev.stopPropagation()\n },\n [openOnFocus],\n )\n\n const onFieldFocus = useCallback(() => {\n if (allowInput) return\n\n if (openOnFocus) onOpen()\n\n focusByClickRef.current = false\n }, [allowInput, onOpen, openOnFocus])\n\n const onInputFocus = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n ev.preventDefault()\n ev.stopPropagation()\n\n setFocused(true)\n\n if (openOnFocus && !focusByClickRef.current) onOpen()\n\n focusByClickRef.current = false\n },\n [onOpen, openOnFocus],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent<HTMLInputElement>) => {\n setFocused(false)\n\n if (\n contains(fieldRef.current, ev.relatedTarget) \|\|\n contains(contentRef.current, ev.relatedTarget)\n ) {\n ev.preventDefault()\n } else {\n if (isArray(value)) {\n setInputValue(\"\" as MaybeInputValue<Range>)\n } else if (isObject(value) && !isDate(value)) {\n setInputValue((prev) =>\n isObject(prev)\n ? ({\n end: dateToString(value.end),\n start: dateToString(value.start),\n } as MaybeInputValue<Range>)\n : prev,\n )\n } else {\n setInputValue(dateToString(value) as MaybeInputValue<Range>)\n }\n }\n },\n [dateToString, setInputValue, value],\n )\n\n const onClear = useCallback(() => {\n if (!interactive) return\n\n setValue((prev) => {\n if (isDate(prev)) {\n return undefined as MaybeDateValue<Multiple, Range>\n } else if (isArray(prev)) {\n return [] as unknown as MaybeDateValue<Multiple, Range>\n } else if (isObject(prev)) {\n return { end: undefined, start: undefined } as MaybeDateValue<\n Multiple,\n Range\n >\n } else {\n return prev\n }\n })\n\n setInputValue(\n (range ? { end: \"\", start: \"\" } : \"\") as MaybeInputValue<Range>,\n )\n\n if (focusOnClear) {\n if (allowInput) {\n startInputRef.current?.focus()\n } else {\n fieldRef.current?.focus()\n }\n }\n }, [allowInput, focusOnClear, interactive, range, setInputValue, setValue])\n\n useEffect(() => {\n if (!open) return\n\n return focusTransfer(\n contentRef.current,\n allowInput ? startInputRef.current : fieldRef.current,\n )\n }, [allowInput, open])\n\n useUpdateEffect(() => {\n setMonth((prev) => getAdjustedMonth(value, prev))\n }, [value, range])\n\n useUpdateEffect(() => {\n if (isArray(valueProp)) return\n\n if (isObject(valueProp) && !isDate(valueProp)) {\n setInputValue({\n end: dateToString(valueProp.end),\n start: dateToString(valueProp.start),\n } as MaybeInputValue<Range>)\n } else {\n setInputValue(dateToString(valueProp) as MaybeInputValue<Range>)\n }\n }, [valueProp])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n \"data-range\": dataAttr(range),\n ...dataProps,\n ...props,\n }),\n [dataProps, range],\n )\n\n const getFieldProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getTriggerProps({\n ref: mergeRefs(ref, fieldRef),\n \"aria-haspopup\": \"dialog\",\n tabIndex: !allowInput ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onClick),\n onFocus: handlerAll(props.onFocus, onFieldFocus),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }),\n\n [allowInput, getTriggerProps, onClick, onFieldFocus, onMouseDown],\n )\n\n const getInputProps: PropGetter<\"input\", { align?: InputAlign }> =\n useCallback(\n ({ align = \"start\", ...props } = {}) => {\n const inputProps: HTMLProps<\"input\"> = {\n style: {\n ...(!allowInput ? { pointerEvents: \"none\" } : {}),\n ...props.style,\n },\n autoComplete: \"off\",\n disabled,\n readOnly,\n required,\n tabIndex: allowInput ? 0 : -1,\n ...dataProps,\n ...props,\n onBlur: handlerAll(props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onFocus: handlerAll(props.onFocus, onInputFocus),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n }\n\n if (isObject(inputValue)) {\n if (align === \"start\") {\n inputProps.ref = mergeRefs(props.ref, ref, startInputRef)\n inputProps.value = inputValue.start\n inputProps.placeholder = startPlaceholder\n } else {\n inputProps.ref = mergeRefs(props.ref, ref, endInputRef)\n inputProps.value = inputValue.end\n inputProps.placeholder = endPlaceholder\n }\n\n if (!inputValue.start && align === \"start\") {\n inputProps.id = id\n inputProps.name = name\n }\n\n if (!!inputValue.start && align === \"end\") {\n inputProps.id = id\n inputProps.name = name\n }\n } else {\n inputProps.ref = mergeRefs(props.ref, ref, startInputRef)\n inputProps.value = inputValue\n inputProps.id = id\n inputProps.name = name\n\n if (isArray(value)) {\n inputProps.style = {\n ...(!focused && !!value.length\n ? visuallyHiddenAttributes.style\n : {}),\n ...inputProps.style,\n }\n inputProps.placeholder = !value.length\n ? startPlaceholder\n : undefined\n inputProps[\"data-max\"] = dataAttr(\n isNumber(max) && value.length >= max,\n )\n } else {\n inputProps.placeholder = startPlaceholder\n }\n }\n\n return inputProps\n },\n [\n allowInput,\n dataProps,\n disabled,\n endPlaceholder,\n focused,\n id,\n inputValue,\n max,\n name,\n onBlur,\n onInputFocus,\n onInputChange,\n onKeyDown,\n onMouseDown,\n readOnly,\n ref,\n required,\n startPlaceholder,\n value,\n ],\n )\n\n const getContentProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) =>\n getComboboxContentProps({\n ref: mergeRefs(ref, contentRef),\n role: \"dialog\",\n ...props,\n }),\n [getComboboxContentProps],\n )\n\n const getCalendarProps: PropGetter<UseCalendarProps<Multiple, Range>> =\n useCallback(\n (props) =>\n ({\n disabled: !interactive,\n format: calendarFormat,\n locale,\n max,\n maxDate,\n minDate,\n month,\n multiple,\n range,\n value,\n onChange,\n onChangeMonth: setMonth,\n ...calendarProps,\n ...props,\n }) as UseCalendarProps<Multiple, Range>,\n [\n interactive,\n calendarFormat,\n locale,\n max,\n maxDate,\n minDate,\n month,\n multiple,\n range,\n value,\n onChange,\n setMonth,\n calendarProps,\n ],\n )\n\n const getIconProps: PropGetter = useCallback(\n (props) => ({ ...dataProps, ...props }),\n [dataProps],\n )\n\n const getClearIconProps: PropGetter = useCallback(\n (props = {}) =>\n getIconProps({\n \"aria-disabled\": ariaAttr(!interactive),\n \"aria-label\": t(\"Clear value\"),\n role: \"button\",\n tabIndex: interactive ? 0 : -1,\n ...props,\n onClick: handlerAll(props.onClick, onClear),\n onKeyDown: handlerAll(props.onKeyDown, (ev) =>\n runKeyAction(ev, { Enter: onClear, Space: onClear }),\n ),\n }),\n [getIconProps, interactive, onClear, t],\n )\n\n return {\n children,\n dateToString,\n inputValue,\n interactive,\n month,\n open,\n range,\n separator,\n setInputValue,\n setMonth,\n setValue,\n stringToDate,\n value,\n getCalendarProps,\n getClearIconProps,\n getContentProps,\n getFieldProps,\n getIconProps,\n getInputProps,\n getRootProps,\n popoverProps,\n onChange,\n onClose,\n onInputChange,\n onOpen,\n }\n}\n\nexport type UseDatePickerReturn = ReturnType<typeof useDatePicker>\n"],"mappings":"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ACA;EACA;EACA;EACA;EACA,eAAe;EACf,GAAG;EACH,GAAGR;EACJ,GACH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAEH,MAAMS,uCACH,aAAW;EAAE,GAAG;EAAW,GAAGT;EAAO,GACtC,CAAC,UAAU,CACZ;AAkBD,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,2CA9BC,UAAQ,EAAE,KACT,aAAa;GACX,iEAA0B,CAAC,YAAY;GACvC,cAAc,EAAE,cAAc;GAC9B,MAAM;GACN,UAAU,cAAc,IAAI;GAC5B,GAAGA;GACH,2DAAoBA,QAAM,SAAS,QAAQ;GAC3C,6DAAsBA,QAAM,YAAY,OACtCU,yBAAa,IAAI;IAAE,OAAO;IAAS,OAAO;IAAS,CAAC,CACrD;GACF,CAAC,EACJ;GAAC;GAAc;GAAa;GAAS;GAAE,CACxC;EAkBC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD"}

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

@@ -8,9 +8,9 @@ const require_create_component = require('../../core/components/create-component
 require('../../core/index.cjs');
 const require_factory$1 = require('../motion/factory.cjs');
 require('../motion/index.cjs');
+const require_hooks_use_value_index = require('../../hooks/use-value/index.cjs');
 const require_portal = require('../portal/portal.cjs');
 require('../portal/index.cjs');
-const require_hooks_use_value_index = require('../../hooks/use-value/index.cjs');
 const require_button = require('../button/button.cjs');
 require('../button/index.cjs');
 const require_close_button = require('../close-button/close-button.cjs');

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

@@ -6,9 +6,9 @@ const require_effect = require('../../utils/effect.cjs');
 const require_ref = require('../../utils/ref.cjs');
 const require_utils_index = require('../../utils/index.cjs');
 const require_hooks_use_controllable_state_index = require('../../hooks/use-controllable-state/index.cjs');
+const require_hooks_use_focus_index = require('../../hooks/use-focus/index.cjs');
 const require_use_field_props = require('../field/use-field-props.cjs');
 require('../field/index.cjs');
-const require_hooks_use_focus_index = require('../../hooks/use-focus/index.cjs');
 let react = require("react");
 //#region src/components/editable/use-editable.ts
@@ -51,11 +51,15 @@ const useEditable = (props = {}) => {
 	}, [onSubmitProp, value]);
 	const onKeyDown = (0, react.useCallback)((ev) => {
 		if (ev.key !== "Escape" && ev.key !== "Enter") return;
-		ev.preventDefault();
-		if (ev.key === "Escape") onCancel();
-		else {
+		if (ev.key === "Escape") {
+			ev.preventDefault();
+			onCancel();
+		} else {
 			const { metaKey, shiftKey } = ev;
-			if (!shiftKey && !metaKey) onSubmit();
+			if (!shiftKey && !metaKey) {
+				ev.preventDefault();
+				onSubmit();
+			}
 		}
 	}, [onCancel, onSubmit]);
 	const onKeyDownWithoutSubmit = (0, react.useCallback)((ev) => {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"use-editable.cjs","names":["createContext","useFieldProps","useCallbackRef","useControllableState","getRootProps: PropGetter","props","getPreviewProps: PropGetter<\"span\">","mergeRefs","getInputProps: PropGetter<\"input\">","getTextareaProps: PropGetter<\"textarea\">","getControlProps: PropGetter","getEditProps: PropGetter<\"button\">","getSubmitProps: PropGetter<\"button\">"],"sources":["../../../../src/components/editable/use-editable.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\"\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useFocusOnPointerDown } from \"../../hooks/use-focus\"\nimport {\n contains,\n createContext,\n handlerAll,\n mergeRefs,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface EditableContext extends Omit<\n UseEditableReturn,\n \"getRootProps\" \| \"onCancel\" \| \"onEdit\" \| \"onSubmit\" \| \"value\"\n> {}\n\nconst [EditableContext, useEditableContext] = createContext<EditableContext>({\n name: \"EditableContext\",\n})\n\nexport { EditableContext, useEditableContext }\n\nexport interface UseEditableProps extends FieldProps {\n /*\n The initial value of the Editable in both edit & preview mode.\n /\n defaultValue?: string\n /\n The placeholder text when the value is empty.\n /\n placeholder?: string\n /\n If `true`, the read only view, has a `tabIndex` set to `0`\n * so it can receive focus via the keyboard or click.\n \n @default true\n /\n previewFocusable?: boolean\n /\n If `true`, the input's text will be highlighted on focus.\n \n @default true\n /\n selectAllOnFocus?: boolean\n /\n If `true`, the Editable will start with edit mode by default.\n /\n startWithEditView?: boolean\n /\n If `true`, it'll update the value onBlur and turn off the edit mode.\n \n @default true\n /\n submitOnBlur?: boolean\n /\n The value of the Editable in both edit & preview mode.\n /\n value?: string\n /\n Callback invoked when user cancels input with the `Esc` key.\n * It provides the last confirmed value as argument.\n /\n onCancel?: (preValue: string) => void\n /\n A callback invoked when user changes input.\n /\n onChange?: (value: string) => void\n /\n A callback invoked once the user enters edit mode.\n /\n onEdit?: () => void\n /\n A callback invoked when user confirms value with `enter` key or by blurring input.\n */\n onSubmit?: (value: string) => void\n}\n\nexport const useEditable = (props: UseEditableProps = {}) => {\n const {\n props: {\n id,\n defaultValue,\n disabled,\n placeholder,\n previewFocusable = true,\n readOnly,\n required,\n selectAllOnFocus = true,\n startWithEditView,\n submitOnBlur = true,\n value: valueProp,\n onCancel: onCancelProp,\n onChange: onChangeProp,\n onEdit: onEditProp,\n onSubmit: onSubmitProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const onEditRef = useCallbackRef(onEditProp)\n const [editing, setEditing] = useState<boolean>(\n !!startWithEditView && !disabled,\n )\n const [value, setValue] = useControllableState({\n defaultValue: defaultValue \|\| \"\",\n value: valueProp,\n onChange: onChangeProp,\n })\n const interactive = !editing && !disabled\n const emptyValue = value.length === 0\n const [prevValue, setPrevValue] = useState(value)\n const inputRef = useRef<HTMLInputElement \| HTMLTextAreaElement>(null)\n const previewRef = useRef<HTMLElement>(null)\n const editRef = useRef<HTMLButtonElement>(null)\n const cancelRef = useRef<HTMLButtonElement>(null)\n const submitRef = useRef<HTMLButtonElement>(null)\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>) =>\n setValue(ev.currentTarget.value),\n [setValue],\n )\n\n const onUpdatePrevValue = useCallback(() => setPrevValue(value), [value])\n\n const onEdit = useCallback(() => {\n if (interactive) setEditing(true)\n }, [interactive])\n\n const onCancel = useCallback(() => {\n setEditing(false)\n setValue(prevValue)\n onCancelProp?.(prevValue)\n }, [prevValue, onCancelProp, setValue])\n\n const onSubmit = useCallback(() => {\n setEditing(false)\n setPrevValue(value)\n onSubmitProp?.(value)\n }, [onSubmitProp, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\" && ev.key !== \"Enter\") return\n\n ev.preventDefault()\n\n if (ev.key === \"Escape\") {\n onCancel()\n } else {\n const { metaKey, shiftKey } = ev\n\n if (!shiftKey && !metaKey) onSubmit()\n }\n },\n [onCancel, onSubmit],\n )\n\n const onKeyDownWithoutSubmit = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n ev.preventDefault()\n onCancel()\n },\n [onCancel],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent) => {\n if (!editing) return\n\n const ownerDocument = ev.currentTarget.ownerDocument\n const relatedTarget = (ev.relatedTarget ??\n ownerDocument.activeElement) as HTMLElement\n const targetIsCancel = contains(cancelRef.current, relatedTarget)\n const targetIsSubmit = contains(submitRef.current, relatedTarget)\n const validBlur = !targetIsCancel && !targetIsSubmit\n\n if (!validBlur) return\n\n if (submitOnBlur) {\n onSubmit()\n } else {\n onCancel()\n }\n },\n [editing, submitOnBlur, onSubmit, onCancel],\n )\n\n useFocusOnPointerDown({\n ref: inputRef,\n elements: [cancelRef, submitRef],\n enabled: editing,\n })\n\n useSafeLayoutEffect(() => {\n if (!editing) return\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n }, [])\n\n useUpdateEffect(() => {\n if (!editing) {\n editRef.current?.focus()\n\n return\n }\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n\n onEditRef()\n }, [editing, onEditRef, selectAllOnFocus])\n\n useEffect(() => {\n if (editing) return\n\n const el = inputRef.current\n const activeEl = el?.ownerDocument.activeElement\n\n if (activeEl === el) el?.blur()\n }, [editing])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n ...rest,\n ...dataProps,\n ...props,\n }),\n [rest, dataProps],\n )\n\n const getPreviewProps: PropGetter<\"span\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(previewRef, ref),\n children: emptyValue ? placeholder : value,\n hidden: editing,\n tabIndex: interactive && previewFocusable ? 0 : undefined,\n onFocus: handlerAll(props.onFocus, onEdit, onUpdatePrevValue),\n }),\n [\n dataProps,\n editing,\n interactive,\n previewFocusable,\n emptyValue,\n onEdit,\n onUpdatePrevValue,\n placeholder,\n value,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDown,\n ],\n )\n\n const getTextareaProps: PropGetter<\"textarea\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDownWithoutSubmit),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDownWithoutSubmit,\n ],\n )\n\n const getControlProps: PropGetter = useCallback(\n (props) => ({\n ...dataProps,\n role: \"group\",\n ...props,\n }),\n [dataProps],\n )\n\n const getEditProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(editRef, ref),\n disabled,\n hidden: editing,\n onClick: handlerAll(props.onClick, onEdit),\n }),\n [dataProps, disabled, editing, onEdit],\n )\n\n const getSubmitProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(submitRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onSubmit),\n }),\n [dataProps, disabled, editing, onSubmit],\n )\n\n const getCancelProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(cancelRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onCancel),\n }),\n [dataProps, disabled, editing, onCancel],\n )\n\n return {\n editing,\n value,\n getCancelProps,\n getControlProps,\n getEditProps,\n getInputProps,\n getPreviewProps,\n getRootProps,\n getSubmitProps,\n getTextareaProps,\n onCancel,\n onEdit,\n onSubmit,\n }\n}\n\nexport type UseEditableReturn = ReturnType<typeof useEditable>\n"],"mappings":"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"}
1	+ {"version":3,"file":"use-editable.cjs","names":["createContext","useFieldProps","useCallbackRef","useControllableState","getRootProps: PropGetter","props","getPreviewProps: PropGetter<\"span\">","mergeRefs","getInputProps: PropGetter<\"input\">","getTextareaProps: PropGetter<\"textarea\">","getControlProps: PropGetter","getEditProps: PropGetter<\"button\">","getSubmitProps: PropGetter<\"button\">"],"sources":["../../../../src/components/editable/use-editable.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, FocusEvent, KeyboardEvent } from \"react\"\nimport type { PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useFocusOnPointerDown } from \"../../hooks/use-focus\"\nimport {\n contains,\n createContext,\n handlerAll,\n mergeRefs,\n useCallbackRef,\n useSafeLayoutEffect,\n useUpdateEffect,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface EditableContext extends Omit<\n UseEditableReturn,\n \"getRootProps\" \| \"onCancel\" \| \"onEdit\" \| \"onSubmit\" \| \"value\"\n> {}\n\nconst [EditableContext, useEditableContext] = createContext<EditableContext>({\n name: \"EditableContext\",\n})\n\nexport { EditableContext, useEditableContext }\n\nexport interface UseEditableProps extends FieldProps {\n /*\n The initial value of the Editable in both edit & preview mode.\n /\n defaultValue?: string\n /\n The placeholder text when the value is empty.\n /\n placeholder?: string\n /\n If `true`, the read only view, has a `tabIndex` set to `0`\n * so it can receive focus via the keyboard or click.\n \n @default true\n /\n previewFocusable?: boolean\n /\n If `true`, the input's text will be highlighted on focus.\n \n @default true\n /\n selectAllOnFocus?: boolean\n /\n If `true`, the Editable will start with edit mode by default.\n /\n startWithEditView?: boolean\n /\n If `true`, it'll update the value onBlur and turn off the edit mode.\n \n @default true\n /\n submitOnBlur?: boolean\n /\n The value of the Editable in both edit & preview mode.\n /\n value?: string\n /\n Callback invoked when user cancels input with the `Esc` key.\n * It provides the last confirmed value as argument.\n /\n onCancel?: (preValue: string) => void\n /\n A callback invoked when user changes input.\n /\n onChange?: (value: string) => void\n /\n A callback invoked once the user enters edit mode.\n /\n onEdit?: () => void\n /\n A callback invoked when user confirms value with `enter` key or by blurring input.\n */\n onSubmit?: (value: string) => void\n}\n\nexport const useEditable = (props: UseEditableProps = {}) => {\n const {\n props: {\n id,\n defaultValue,\n disabled,\n placeholder,\n previewFocusable = true,\n readOnly,\n required,\n selectAllOnFocus = true,\n startWithEditView,\n submitOnBlur = true,\n value: valueProp,\n onCancel: onCancelProp,\n onChange: onChangeProp,\n onEdit: onEditProp,\n onSubmit: onSubmitProp,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const onEditRef = useCallbackRef(onEditProp)\n const [editing, setEditing] = useState<boolean>(\n !!startWithEditView && !disabled,\n )\n const [value, setValue] = useControllableState({\n defaultValue: defaultValue \|\| \"\",\n value: valueProp,\n onChange: onChangeProp,\n })\n const interactive = !editing && !disabled\n const emptyValue = value.length === 0\n const [prevValue, setPrevValue] = useState(value)\n const inputRef = useRef<HTMLInputElement \| HTMLTextAreaElement>(null)\n const previewRef = useRef<HTMLElement>(null)\n const editRef = useRef<HTMLButtonElement>(null)\n const cancelRef = useRef<HTMLButtonElement>(null)\n const submitRef = useRef<HTMLButtonElement>(null)\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>) =>\n setValue(ev.currentTarget.value),\n [setValue],\n )\n\n const onUpdatePrevValue = useCallback(() => setPrevValue(value), [value])\n\n const onEdit = useCallback(() => {\n if (interactive) setEditing(true)\n }, [interactive])\n\n const onCancel = useCallback(() => {\n setEditing(false)\n setValue(prevValue)\n onCancelProp?.(prevValue)\n }, [prevValue, onCancelProp, setValue])\n\n const onSubmit = useCallback(() => {\n setEditing(false)\n setPrevValue(value)\n onSubmitProp?.(value)\n }, [onSubmitProp, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\" && ev.key !== \"Enter\") return\n\n if (ev.key === \"Escape\") {\n ev.preventDefault()\n onCancel()\n } else {\n const { metaKey, shiftKey } = ev\n\n if (!shiftKey && !metaKey) {\n ev.preventDefault()\n onSubmit()\n }\n }\n },\n [onCancel, onSubmit],\n )\n\n const onKeyDownWithoutSubmit = useCallback(\n (ev: KeyboardEvent) => {\n if (ev.key !== \"Escape\") return\n\n ev.preventDefault()\n onCancel()\n },\n [onCancel],\n )\n\n const onBlur = useCallback(\n (ev: FocusEvent) => {\n if (!editing) return\n\n const ownerDocument = ev.currentTarget.ownerDocument\n const relatedTarget = (ev.relatedTarget ??\n ownerDocument.activeElement) as HTMLElement\n const targetIsCancel = contains(cancelRef.current, relatedTarget)\n const targetIsSubmit = contains(submitRef.current, relatedTarget)\n const validBlur = !targetIsCancel && !targetIsSubmit\n\n if (!validBlur) return\n\n if (submitOnBlur) {\n onSubmit()\n } else {\n onCancel()\n }\n },\n [editing, submitOnBlur, onSubmit, onCancel],\n )\n\n useFocusOnPointerDown({\n ref: inputRef,\n elements: [cancelRef, submitRef],\n enabled: editing,\n })\n\n useSafeLayoutEffect(() => {\n if (!editing) return\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n }, [])\n\n useUpdateEffect(() => {\n if (!editing) {\n editRef.current?.focus()\n\n return\n }\n\n inputRef.current?.focus()\n\n if (selectAllOnFocus) inputRef.current?.select()\n\n onEditRef()\n }, [editing, onEditRef, selectAllOnFocus])\n\n useEffect(() => {\n if (editing) return\n\n const el = inputRef.current\n const activeEl = el?.ownerDocument.activeElement\n\n if (activeEl === el) el?.blur()\n }, [editing])\n\n const getRootProps: PropGetter = useCallback(\n (props) => ({\n ...rest,\n ...dataProps,\n ...props,\n }),\n [rest, dataProps],\n )\n\n const getPreviewProps: PropGetter<\"span\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(previewRef, ref),\n children: emptyValue ? placeholder : value,\n hidden: editing,\n tabIndex: interactive && previewFocusable ? 0 : undefined,\n onFocus: handlerAll(props.onFocus, onEdit, onUpdatePrevValue),\n }),\n [\n dataProps,\n editing,\n interactive,\n previewFocusable,\n emptyValue,\n onEdit,\n onUpdatePrevValue,\n placeholder,\n value,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDown,\n ],\n )\n\n const getTextareaProps: PropGetter<\"textarea\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n ...props,\n id,\n ref: mergeRefs(inputRef, ref),\n disabled,\n hidden: !editing,\n placeholder,\n readOnly,\n required,\n value,\n onBlur: handlerAll(eventProps.onBlur, props.onBlur, onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(eventProps.onFocus, props.onFocus, onUpdatePrevValue),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDownWithoutSubmit),\n }),\n [\n dataProps,\n ariaProps,\n id,\n disabled,\n editing,\n placeholder,\n readOnly,\n required,\n value,\n eventProps.onBlur,\n eventProps.onFocus,\n onBlur,\n onChange,\n onUpdatePrevValue,\n onKeyDownWithoutSubmit,\n ],\n )\n\n const getControlProps: PropGetter = useCallback(\n (props) => ({\n ...dataProps,\n role: \"group\",\n ...props,\n }),\n [dataProps],\n )\n\n const getEditProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(editRef, ref),\n disabled,\n hidden: editing,\n onClick: handlerAll(props.onClick, onEdit),\n }),\n [dataProps, disabled, editing, onEdit],\n )\n\n const getSubmitProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(submitRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onSubmit),\n }),\n [dataProps, disabled, editing, onSubmit],\n )\n\n const getCancelProps: PropGetter<\"button\"> = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...props,\n ref: mergeRefs(cancelRef, ref),\n disabled,\n hidden: !editing,\n onClick: handlerAll(props.onClick, onCancel),\n }),\n [dataProps, disabled, editing, onCancel],\n )\n\n return {\n editing,\n value,\n getCancelProps,\n getControlProps,\n getEditProps,\n getInputProps,\n getPreviewProps,\n getRootProps,\n getSubmitProps,\n getTextareaProps,\n onCancel,\n onEdit,\n onSubmit,\n }\n}\n\nexport type UseEditableReturn = ReturnType<typeof useEditable>\n"],"mappings":"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"}