@yamada-ui/react 2.2.1-dev-20260504103143 → 2.2.1-dev-20260509050741

package/dist/esm/components/data-list/data-list.style.js

@@ -1,6 +1,4 @@
 import { defineComponentSlotStyle } from "../../core/system/config.js";
-import "../../core/index.js";
-
 //#region src/components/data-list/data-list.style.ts
 const dataListStyle = defineComponentSlotStyle({
 	base: {
@@ -12,7 +10,13 @@ const dataListStyle = defineComponentSlotStyle({
 		},
 		term: {}
 	},
-	props: { orientation: {
+	props: { 
+	/**
+	* The orientation of the data list.
+	*
+	* @default 'horizontal'
+	*/
+orientation: {
 		horizontal: {
 			item: { display: "contents" },
 			root: { gridTemplateColumns: "repeat({--col}, auto)" }
@@ -128,7 +132,7 @@ const dataListStyle = defineComponentSlotStyle({
 		orientation: "horizontal"
 	}
 });
-
 //#endregion
 export { dataListStyle };
+
 //# sourceMappingURL=data-list.style.js.map

package/dist/esm/components/data-list/data-list.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-list.style.js","names":[],"sources":["../../../../src/components/data-list/data-list.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\n\nexport const dataListStyle = defineComponentSlotStyle({\n  base: {\n    description: {},\n    item: {},\n    root: {\n      display: \"grid\",\n      w: \"fit-content\",\n    },\n    term: {},\n  },\n\n  props: {\n    /**\n     * The orientation of the data list.\n     *\n     * @default 'horizontal'\n     */\n    orientation: {\n      horizontal: {\n        item: {\n          display: \"contents\",\n        },\n        root: {\n          gridTemplateColumns: \"repeat({--col}, auto)\",\n        },\n      },\n      vertical: {\n        item: {\n          display: \"flex\",\n          flexDirection: \"column\",\n          gap: \"xs\",\n        },\n        root: {\n          gridTemplateColumns: \"auto\",\n        },\n      },\n    },\n  },\n\n  variants: {\n    bold: {\n      description: {\n        color: \"fg.muted\",\n      },\n      term: {\n        fontWeight: \"semibold\",\n      },\n    },\n    grid: {\n      root: {\n        borderWidth: \"1px\",\n        gap: \"0\",\n        rounded: \"l2\",\n      },\n      term: { color: \"fg.muted\" },\n    },\n    subtle: {\n      term: { color: \"fg.muted\" },\n    },\n  },\n\n  sizes: {\n    sm: {\n      root: {\n        fontSize: \"xs\",\n        gap: \"2\",\n      },\n    },\n    md: {\n      root: {\n        fontSize: \"sm\",\n        gap: \"4\",\n      },\n    },\n    lg: {\n      root: {\n        fontSize: \"md\",\n        gap: \"6\",\n      },\n    },\n  },\n\n  compounds: [\n    {\n      css: {\n        item: {\n          _notFirst: {\n            _child: {\n              borderTopWidth: \"1px\",\n            },\n          },\n          _notFirstChild: {\n            borderLeftWidth: \"1px\",\n          },\n        },\n      },\n      variant: \"grid\",\n      orientation: \"horizontal\",\n    },\n    {\n      css: {\n        item: {\n          gap: \"0\",\n          _notFirst: {\n            borderTopWidth: \"1px\",\n          },\n          _notFirstChild: {\n            borderTopWidth: \"1px\",\n          },\n        },\n      },\n      variant: \"grid\",\n      orientation: \"vertical\",\n    },\n    {\n      css: {\n        description: {\n          lineHeight: \"shorter\",\n          px: \"2\",\n          py: \"1\",\n        },\n        term: {\n          lineHeight: \"shorter\",\n          px: \"2\",\n          py: \"1\",\n        },\n      },\n      size: \"sm\",\n      variant: \"grid\",\n    },\n    {\n      css: {\n        description: {\n          lineHeight: \"shorter\",\n          px: \"3\",\n          py: \"2\",\n        },\n        term: {\n          lineHeight: \"shorter\",\n          px: \"3\",\n          py: \"2\",\n        },\n      },\n      size: \"md\",\n      variant: \"grid\",\n    },\n    {\n      css: {\n        description: {\n          lineHeight: \"moderate\",\n          px: \"4\",\n          py: \"3\",\n        },\n        term: {\n          lineHeight: \"moderate\",\n          px: \"4\",\n          py: \"3\",\n        },\n      },\n      size: \"lg\",\n      variant: \"grid\",\n    },\n  ],\n\n  defaultProps: {\n    size: \"md\",\n    variant: \"subtle\",\n    orientation: \"horizontal\",\n  },\n})\n\nexport type DataListStyle = typeof dataListStyle\n"],"mappings":";;;;AAEA,MAAa,gBAAgB,yBAAyB;CACpD,MAAM;EACJ,aAAa,EAAE;EACf,MAAM,EAAE;EACR,MAAM;GACJ,SAAS;GACT,GAAG;GACJ;EACD,MAAM,EAAE;EACT;CAED,OAAO,EAML,aAAa;EACX,YAAY;GACV,MAAM,EACJ,SAAS,YACV;GACD,MAAM,EACJ,qBAAqB,yBACtB;GACF;EACD,UAAU;GACR,MAAM;IACJ,SAAS;IACT,eAAe;IACf,KAAK;IACN;GACD,MAAM,EACJ,qBAAqB,QACtB;GACF;EACF,EACF;CAED,UAAU;EACR,MAAM;GACJ,aAAa,EACX,OAAO,YACR;GACD,MAAM,EACJ,YAAY,YACb;GACF;EACD,MAAM;GACJ,MAAM;IACJ,aAAa;IACb,KAAK;IACL,SAAS;IACV;GACD,MAAM,EAAE,OAAO,YAAY;GAC5B;EACD,QAAQ,EACN,MAAM,EAAE,OAAO,YAAY,EAC5B;EACF;CAED,OAAO;EACL,IAAI,EACF,MAAM;GACJ,UAAU;GACV,KAAK;GACN,EACF;EACD,IAAI,EACF,MAAM;GACJ,UAAU;GACV,KAAK;GACN,EACF;EACD,IAAI,EACF,MAAM;GACJ,UAAU;GACV,KAAK;GACN,EACF;EACF;CAED,WAAW;EACT;GACE,KAAK,EACH,MAAM;IACJ,WAAW,EACT,QAAQ,EACN,gBAAgB,OACjB,EACF;IACD,gBAAgB,EACd,iBAAiB,OAClB;IACF,EACF;GACD,SAAS;GACT,aAAa;GACd;EACD;GACE,KAAK,EACH,MAAM;IACJ,KAAK;IACL,WAAW,EACT,gBAAgB,OACjB;IACD,gBAAgB,EACd,gBAAgB,OACjB;IACF,EACF;GACD,SAAS;GACT,aAAa;GACd;EACD;GACE,KAAK;IACH,aAAa;KACX,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACD,MAAM;KACJ,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACF;GACD,MAAM;GACN,SAAS;GACV;EACD;GACE,KAAK;IACH,aAAa;KACX,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACD,MAAM;KACJ,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACF;GACD,MAAM;GACN,SAAS;GACV;EACD;GACE,KAAK;IACH,aAAa;KACX,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACD,MAAM;KACJ,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACF;GACD,MAAM;GACN,SAAS;GACV;EACF;CAED,cAAc;EACZ,MAAM;EACN,SAAS;EACT,aAAa;EACd;CACF,CAAC"}
+{"version":3,"file":"data-list.style.js","names":[],"sources":["../../../../src/components/data-list/data-list.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\n\nexport const dataListStyle = defineComponentSlotStyle({\n  base: {\n    description: {},\n    item: {},\n    root: {\n      display: \"grid\",\n      w: \"fit-content\",\n    },\n    term: {},\n  },\n\n  props: {\n    /**\n     * The orientation of the data list.\n     *\n     * @default 'horizontal'\n     */\n    orientation: {\n      horizontal: {\n        item: {\n          display: \"contents\",\n        },\n        root: {\n          gridTemplateColumns: \"repeat({--col}, auto)\",\n        },\n      },\n      vertical: {\n        item: {\n          display: \"flex\",\n          flexDirection: \"column\",\n          gap: \"xs\",\n        },\n        root: {\n          gridTemplateColumns: \"auto\",\n        },\n      },\n    },\n  },\n\n  variants: {\n    bold: {\n      description: {\n        color: \"fg.muted\",\n      },\n      term: {\n        fontWeight: \"semibold\",\n      },\n    },\n    grid: {\n      root: {\n        borderWidth: \"1px\",\n        gap: \"0\",\n        rounded: \"l2\",\n      },\n      term: { color: \"fg.muted\" },\n    },\n    subtle: {\n      term: { color: \"fg.muted\" },\n    },\n  },\n\n  sizes: {\n    sm: {\n      root: {\n        fontSize: \"xs\",\n        gap: \"2\",\n      },\n    },\n    md: {\n      root: {\n        fontSize: \"sm\",\n        gap: \"4\",\n      },\n    },\n    lg: {\n      root: {\n        fontSize: \"md\",\n        gap: \"6\",\n      },\n    },\n  },\n\n  compounds: [\n    {\n      css: {\n        item: {\n          _notFirst: {\n            _child: {\n              borderTopWidth: \"1px\",\n            },\n          },\n          _notFirstChild: {\n            borderLeftWidth: \"1px\",\n          },\n        },\n      },\n      variant: \"grid\",\n      orientation: \"horizontal\",\n    },\n    {\n      css: {\n        item: {\n          gap: \"0\",\n          _notFirst: {\n            borderTopWidth: \"1px\",\n          },\n          _notFirstChild: {\n            borderTopWidth: \"1px\",\n          },\n        },\n      },\n      variant: \"grid\",\n      orientation: \"vertical\",\n    },\n    {\n      css: {\n        description: {\n          lineHeight: \"shorter\",\n          px: \"2\",\n          py: \"1\",\n        },\n        term: {\n          lineHeight: \"shorter\",\n          px: \"2\",\n          py: \"1\",\n        },\n      },\n      size: \"sm\",\n      variant: \"grid\",\n    },\n    {\n      css: {\n        description: {\n          lineHeight: \"shorter\",\n          px: \"3\",\n          py: \"2\",\n        },\n        term: {\n          lineHeight: \"shorter\",\n          px: \"3\",\n          py: \"2\",\n        },\n      },\n      size: \"md\",\n      variant: \"grid\",\n    },\n    {\n      css: {\n        description: {\n          lineHeight: \"moderate\",\n          px: \"4\",\n          py: \"3\",\n        },\n        term: {\n          lineHeight: \"moderate\",\n          px: \"4\",\n          py: \"3\",\n        },\n      },\n      size: \"lg\",\n      variant: \"grid\",\n    },\n  ],\n\n  defaultProps: {\n    size: \"md\",\n    variant: \"subtle\",\n    orientation: \"horizontal\",\n  },\n})\n\nexport type DataListStyle = typeof dataListStyle\n"],"mappings":";;AAEA,MAAa,gBAAgB,yBAAyB;CACpD,MAAM;EACJ,aAAa,EAAE;EACf,MAAM,EAAE;EACR,MAAM;GACJ,SAAS;GACT,GAAG;GACJ;EACD,MAAM,EAAE;EACT;CAED,OAAO;;;;;;AAML,aAAa;EACX,YAAY;GACV,MAAM,EACJ,SAAS,YACV;GACD,MAAM,EACJ,qBAAqB,yBACtB;GACF;EACD,UAAU;GACR,MAAM;IACJ,SAAS;IACT,eAAe;IACf,KAAK;IACN;GACD,MAAM,EACJ,qBAAqB,QACtB;GACF;EACF,EACF;CAED,UAAU;EACR,MAAM;GACJ,aAAa,EACX,OAAO,YACR;GACD,MAAM,EACJ,YAAY,YACb;GACF;EACD,MAAM;GACJ,MAAM;IACJ,aAAa;IACb,KAAK;IACL,SAAS;IACV;GACD,MAAM,EAAE,OAAO,YAAY;GAC5B;EACD,QAAQ,EACN,MAAM,EAAE,OAAO,YAAY,EAC5B;EACF;CAED,OAAO;EACL,IAAI,EACF,MAAM;GACJ,UAAU;GACV,KAAK;GACN,EACF;EACD,IAAI,EACF,MAAM;GACJ,UAAU;GACV,KAAK;GACN,EACF;EACD,IAAI,EACF,MAAM;GACJ,UAAU;GACV,KAAK;GACN,EACF;EACF;CAED,WAAW;EACT;GACE,KAAK,EACH,MAAM;IACJ,WAAW,EACT,QAAQ,EACN,gBAAgB,OACjB,EACF;IACD,gBAAgB,EACd,iBAAiB,OAClB;IACF,EACF;GACD,SAAS;GACT,aAAa;GACd;EACD;GACE,KAAK,EACH,MAAM;IACJ,KAAK;IACL,WAAW,EACT,gBAAgB,OACjB;IACD,gBAAgB,EACd,gBAAgB,OACjB;IACF,EACF;GACD,SAAS;GACT,aAAa;GACd;EACD;GACE,KAAK;IACH,aAAa;KACX,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACD,MAAM;KACJ,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACF;GACD,MAAM;GACN,SAAS;GACV;EACD;GACE,KAAK;IACH,aAAa;KACX,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACD,MAAM;KACJ,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACF;GACD,MAAM;GACN,SAAS;GACV;EACD;GACE,KAAK;IACH,aAAa;KACX,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACD,MAAM;KACJ,YAAY;KACZ,IAAI;KACJ,IAAI;KACL;IACF;GACD,MAAM;GACN,SAAS;GACV;EACF;CAED,cAAc;EACZ,MAAM;EACN,SAAS;EACT,aAAa;EACd;CACF,CAAC"}

package/dist/esm/components/data-list/index.js

@@ -1,5 +1,4 @@
 import { dataListStyle } from "./data-list.style.js";
 import { DataListDescription, DataListItem, DataListPropsContext, DataListRoot, DataListTerm, useDataListPropsContext } from "./data-list.js";
 import { namespace_exports } from "./namespace.js";
-
-export { namespace_exports as DataList, DataListDescription, DataListItem, DataListPropsContext, DataListRoot, DataListTerm, dataListStyle, useDataListPropsContext };
+export { namespace_exports as DataList, DataListDescription, DataListItem, DataListPropsContext, DataListRoot, DataListTerm, dataListStyle, useDataListPropsContext };

package/dist/esm/components/data-list/namespace.js

@@ -1,6 +1,5 @@
-import { __exportAll } from "../../_virtual/rolldown_runtime.js";
+import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
 import { DataListDescription, DataListItem, DataListPropsContext, DataListRoot, DataListTerm, useDataListPropsContext } from "./data-list.js";
-
 //#region src/components/data-list/namespace.ts
 var namespace_exports = /* @__PURE__ */ __exportAll({
 	Description: () => DataListDescription,
@@ -10,7 +9,7 @@ var namespace_exports = /* @__PURE__ */ __exportAll({
 	Term: () => DataListTerm,
 	usePropsContext: () => useDataListPropsContext
 });
-
 //#endregion
 export { namespace_exports };
+
 //# sourceMappingURL=namespace.js.map

package/dist/esm/components/date-picker/date-picker.js

@@ -1,31 +1,23 @@
 "use client";
-
 import { mergeRefs } from "../../utils/ref.js";
 import { utils_exports } from "../../utils/index.js";
 import { styled } from "../../core/system/factory.js";
 import { mergeProps } from "../../core/components/props.js";
 import { createSlotComponent } from "../../core/components/create-component.js";
-import "../../core/index.js";
 import { CalendarIcon } from "../icon/icons/calendar-icon.js";
 import { XIcon } from "../icon/icons/x-icon.js";
-import "../icon/index.js";
 import { PopoverContent, PopoverRoot, PopoverTrigger, usePopoverStyleProps } from "../popover/popover.js";
-import "../popover/index.js";
 import { useGroupItemProps } from "../group/use-group.js";
-import "../group/index.js";
 import { useInputBorder } from "../input/use-input-border.js";
 import { useInputPropsContext } from "../input/input.js";
 import { InputElement } from "../input/input-element.js";
 import { InputGroupRoot } from "../input/input-group.js";
-import "../input/index.js";
 import { CalendarRoot } from "../calendar/calendar.js";
-import "../calendar/index.js";
 import { datePickerStyle } from "./date-picker.style.js";
 import { useFieldSizing } from "../../hooks/use-field-sizing/index.js";
 import { useDatePicker } from "./use-date-picker.js";
 import { useMemo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-
 //#region src/components/date-picker/date-picker.tsx
 const { ComponentContext, PropsContext: DatePickerPropsContext, useComponentContext, usePropsContext: useDatePickerPropsContext, withContext, withProvider } = createSlotComponent("date-picker", datePickerStyle);
 /**
@@ -149,7 +141,7 @@ const DatePickerIcon = withContext("div", "icon")(void 0, ({ children, icon, ...
 	...rest
 }));
 const DatePickerContent = withContext(PopoverContent, "content")();
-
 //#endregion
 export { DatePicker, DatePickerPropsContext, useDatePickerPropsContext };
+
 //# sourceMappingURL=date-picker.js.map

package/dist/esm/components/date-picker/date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.js","names":["Popover.Root","InputGroup.Root","Popover.Trigger","InputGroup.Element","Calendar.Root","Popover.Content"],"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, mergeProps, 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            {...mergeProps(\n              { className, css, colorScheme },\n              getRootProps(groupItemProps),\n              rootProps,\n            )()}\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 mergeProps(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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"}
+{"version":3,"file":"date-picker.js","names":["Popover.Root","InputGroup.Root","Popover.Trigger","InputGroup.Element","Calendar.Root","Popover.Content"],"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, mergeProps, 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            {...mergeProps(\n              { className, css, colorScheme },\n              getRootProps(groupItemProps),\n              rootProps,\n            )()}\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 mergeProps(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/esm/components/date-picker/date-picker.style.js

@@ -1,10 +1,6 @@
 import { defineComponentSlotStyle } from "../../core/system/config.js";
-import "../../core/index.js";
 import { nativeSelectStyle } from "../native-select/native-select.style.js";
-import "../native-select/index.js";
 import { autocompleteStyle } from "../autocomplete/autocomplete.style.js";
-import "../autocomplete/index.js";
-
 //#region src/components/date-picker/date-picker.style.ts
 const datePickerStyle = defineComponentSlotStyle({
 	base: {
@@ -43,7 +39,7 @@ const datePickerStyle = defineComponentSlotStyle({
 		variant: "outline"
 	}
 });
-
 //#endregion
 export { datePickerStyle };
+
 //# sourceMappingURL=date-picker.style.js.map

package/dist/esm/components/date-picker/date-picker.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.style.js","names":[],"sources":["../../../../src/components/date-picker/date-picker.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\nimport { autocompleteStyle } from \"../autocomplete\"\nimport { nativeSelectStyle } from \"../native-select\"\n\nexport const datePickerStyle = defineComponentSlotStyle({\n  base: {\n    ...nativeSelectStyle.base,\n    adjust: { fieldSizing: \"content\", flex: \"inherit\", w: \"fit-content\" },\n    content: { p: \"1\" },\n    field: autocompleteStyle.base?.field,\n    input: {\n      ...autocompleteStyle.base?.input,\n      '&[tabindex=\"-1\"]': { caret: \"transparent\" },\n    },\n    separator: { color: \"fg.subtle\", mx: \"{gap}\" },\n  },\n\n  variants: {\n    filled: autocompleteStyle.variants?.filled,\n    flushed: autocompleteStyle.variants?.flushed,\n    outline: autocompleteStyle.variants?.outline,\n    plain: autocompleteStyle.variants?.plain,\n  },\n\n  sizes: {\n    xs: nativeSelectStyle.sizes?.xs,\n    sm: nativeSelectStyle.sizes?.sm,\n    md: nativeSelectStyle.sizes?.md,\n    lg: nativeSelectStyle.sizes?.lg,\n    xl: nativeSelectStyle.sizes?.xl,\n  },\n\n  defaultProps: {\n    size: \"md\",\n    variant: \"outline\",\n  },\n})\n\nexport type DatePickerStyle = typeof datePickerStyle\n"],"mappings":";;;;;;;;AAIA,MAAa,kBAAkB,yBAAyB;CACtD,MAAM;EACJ,GAAG,kBAAkB;EACrB,QAAQ;GAAE,aAAa;GAAW,MAAM;GAAW,GAAG;GAAe;EACrE,SAAS,EAAE,GAAG,KAAK;EACnB,OAAO,kBAAkB,MAAM;EAC/B,OAAO;GACL,GAAG,kBAAkB,MAAM;GAC3B,sBAAoB,EAAE,OAAO,eAAe;GAC7C;EACD,WAAW;GAAE,OAAO;GAAa,IAAI;GAAS;EAC/C;CAED,UAAU;EACR,QAAQ,kBAAkB,UAAU;EACpC,SAAS,kBAAkB,UAAU;EACrC,SAAS,kBAAkB,UAAU;EACrC,OAAO,kBAAkB,UAAU;EACpC;CAED,OAAO;EACL,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC9B;CAED,cAAc;EACZ,MAAM;EACN,SAAS;EACV;CACF,CAAC"}
+{"version":3,"file":"date-picker.style.js","names":[],"sources":["../../../../src/components/date-picker/date-picker.style.ts"],"sourcesContent":["import { defineComponentSlotStyle } from \"../../core\"\nimport { autocompleteStyle } from \"../autocomplete\"\nimport { nativeSelectStyle } from \"../native-select\"\n\nexport const datePickerStyle = defineComponentSlotStyle({\n  base: {\n    ...nativeSelectStyle.base,\n    adjust: { fieldSizing: \"content\", flex: \"inherit\", w: \"fit-content\" },\n    content: { p: \"1\" },\n    field: autocompleteStyle.base?.field,\n    input: {\n      ...autocompleteStyle.base?.input,\n      '&[tabindex=\"-1\"]': { caret: \"transparent\" },\n    },\n    separator: { color: \"fg.subtle\", mx: \"{gap}\" },\n  },\n\n  variants: {\n    filled: autocompleteStyle.variants?.filled,\n    flushed: autocompleteStyle.variants?.flushed,\n    outline: autocompleteStyle.variants?.outline,\n    plain: autocompleteStyle.variants?.plain,\n  },\n\n  sizes: {\n    xs: nativeSelectStyle.sizes?.xs,\n    sm: nativeSelectStyle.sizes?.sm,\n    md: nativeSelectStyle.sizes?.md,\n    lg: nativeSelectStyle.sizes?.lg,\n    xl: nativeSelectStyle.sizes?.xl,\n  },\n\n  defaultProps: {\n    size: \"md\",\n    variant: \"outline\",\n  },\n})\n\nexport type DatePickerStyle = typeof datePickerStyle\n"],"mappings":";;;;AAIA,MAAa,kBAAkB,yBAAyB;CACtD,MAAM;EACJ,GAAG,kBAAkB;EACrB,QAAQ;GAAE,aAAa;GAAW,MAAM;GAAW,GAAG;GAAe;EACrE,SAAS,EAAE,GAAG,KAAK;EACnB,OAAO,kBAAkB,MAAM;EAC/B,OAAO;GACL,GAAG,kBAAkB,MAAM;GAC3B,sBAAoB,EAAE,OAAO,eAAe;GAC7C;EACD,WAAW;GAAE,OAAO;GAAa,IAAI;GAAS;EAC/C;CAED,UAAU;EACR,QAAQ,kBAAkB,UAAU;EACpC,SAAS,kBAAkB,UAAU;EACrC,SAAS,kBAAkB,UAAU;EACrC,OAAO,kBAAkB,UAAU;EACpC;CAED,OAAO;EACL,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC7B,IAAI,kBAAkB,OAAO;EAC9B;CAED,cAAc;EACZ,MAAM;EACN,SAAS;EACV;CACF,CAAC"}

package/dist/esm/components/date-picker/index.js

@@ -1,5 +1,4 @@
 import { datePickerStyle } from "./date-picker.style.js";
 import { useDatePicker } from "./use-date-picker.js";
 import { DatePicker, DatePickerPropsContext, useDatePickerPropsContext } from "./date-picker.js";
-
-export { DatePicker, DatePickerPropsContext, datePickerStyle, useDatePicker, useDatePickerPropsContext };
+export { DatePicker, DatePickerPropsContext, datePickerStyle, useDatePicker, useDatePickerPropsContext };

package/dist/esm/components/date-picker/use-date-picker.js

@@ -1,25 +1,18 @@
 "use client";
-
 import { isComposing, runKeyAction, visuallyHiddenAttributes } from "../../utils/dom.js";
 import { useUpdateEffect } from "../../utils/effect.js";
 import { mergeRefs } from "../../utils/ref.js";
 import { utils_exports } from "../../utils/index.js";
 import { useEnvironment } from "../../core/system/environment-provider.js";
-import "../../core/index.js";
 import { useControllableState } from "../../hooks/use-controllable-state/index.js";
 import { useI18n } from "../../providers/i18n-provider/i18n-provider.js";
-import "../../providers/i18n-provider/index.js";
 import { useFieldProps } from "../field/use-field-props.js";
-import "../field/index.js";
 import { useCombobox } from "../../hooks/use-combobox/index.js";
 import { useDateTimeFormat } from "../format/use-format-date-time.js";
-import "../format/index.js";
 import { DEFAULT_MAX_DATE, DEFAULT_MIN_DATE, getAdjustedMonth, isAfterDate, isBeforeDate, isIncludeDates, updateMaybeDateValue, useCalendarProps } from "../calendar/use-calendar.js";
-import "../calendar/index.js";
 import { cloneElement, isValidElement, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { jsxs } from "react/jsx-runtime";
 import dayjs from "dayjs";
-
 //#region src/components/date-picker/use-date-picker.tsx
 const defaultRender = ({ count, focused, index, max, separator, value }) => {
 	const last = count - 1 === index;
@@ -38,10 +31,10 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 	} : 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 } = useFieldProps(props);
 	const dateTimeFormat = useDateTimeFormat({ locale });
 	const { calendarFormat, inputFormat } = useMemo(() => {
-		const { input: inputFormat$1, ...calendarFormat$1 } = format ?? {};
+		const { input: inputFormat, ...calendarFormat } = format ?? {};
 		return {
-			calendarFormat: calendarFormat$1,
-			inputFormat: inputFormat$1 !== null ? inputFormat$1 ?? {
+			calendarFormat,
+			inputFormat: inputFormat !== null ? inputFormat ?? {
 				day: "numeric",
 				month: "long",
 				year: "numeric"
@@ -63,18 +56,18 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 	});
 	const [month, setMonth] = useControllableState({
 		defaultValue: () => {
-			let value$1 = defaultMonth;
-			if (dayjs(minDate).isAfter(dayjs(defaultMonth))) value$1 = dayjs(minDate).set("date", 1).toDate();
-			if (valueProp) value$1 = getAdjustedMonth(valueProp, value$1);
-			else if (defaultValue) value$1 = getAdjustedMonth(defaultValue, value$1);
-			return value$1;
+			let value = defaultMonth;
+			if (dayjs(minDate).isAfter(dayjs(defaultMonth))) value = dayjs(minDate).set("date", 1).toDate();
+			if (valueProp) value = getAdjustedMonth(valueProp, value);
+			else if (defaultValue) value = getAdjustedMonth(defaultValue, value);
+			return value;
 		},
 		value: monthProp,
 		onChange: onChangeMonthProp
 	});
-	const stringToDate = useCallback((value$1, start = minDate, end = maxDate) => {
-		let date = parseDate?.(value$1);
-		if (!date && dayjs(value$1).isValid()) date = dayjs(value$1).locale(locale).toDate();
+	const stringToDate = useCallback((value, start = minDate, end = maxDate) => {
+		let date = parseDate?.(value);
+		if (!date && dayjs(value).isValid()) date = dayjs(value).locale(locale).toDate();
 		if (date == null) return void 0;
 		if (excludeDate?.(date)) return void 0;
 		if (!allowInputBeyond) {
@@ -130,8 +123,8 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		if (!(0, utils_exports.isArray)(value)) return null;
 		const count = value.length;
 		return value.map((date, index) => {
-			const value$1 = dateToString(date);
-			const onClear$1 = (ev) => {
+			const value = dateToString(date);
+			const onClear = (ev) => {
 				ev?.preventDefault();
 				ev?.stopPropagation();
 				setValue((prev) => updateMaybeDateValue(date, max)(prev));
@@ -143,8 +136,8 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 				index,
 				max,
 				separator,
-				value: value$1,
-				onClear: onClear$1
+				value,
+				onClear
 			});
 			if (isValidElement(component)) return cloneElement(component, {
 				...component.props,
@@ -163,10 +156,10 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 	]);
 	const { endPlaceholder, startPlaceholder } = useMemo(() => {
 		if (range) {
-			const startPlaceholder$1 = placeholderProp ?? dateTimeFormat(/* @__PURE__ */ new Date(), inputFormat);
+			const startPlaceholder = placeholderProp ?? dateTimeFormat(/* @__PURE__ */ new Date(), inputFormat);
 			return {
 				endPlaceholder: placeholderProp ?? dateTimeFormat(dayjs().add(1, "day").toDate(), inputFormat),
-				startPlaceholder: startPlaceholder$1
+				startPlaceholder
 			};
 		} else {
 			const placeholder = placeholderProp ?? dateTimeFormat(/* @__PURE__ */ new Date(), inputFormat);
@@ -181,17 +174,17 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		placeholderProp,
 		range
 	]);
-	const onChange = useCallback((value$1) => {
-		setValue(value$1);
-		if ((0, utils_exports.isArray)(value$1)) setInputValue("");
-		else if ((0, utils_exports.isObject)(value$1) && !(0, utils_exports.isDate)(value$1)) setInputValue({
-			end: dateToString(value$1.end),
-			start: dateToString(value$1.start)
+	const onChange = useCallback((value) => {
+		setValue(value);
+		if ((0, utils_exports.isArray)(value)) setInputValue("");
+		else if ((0, utils_exports.isObject)(value) && !(0, utils_exports.isDate)(value)) setInputValue({
+			end: dateToString(value.end),
+			start: dateToString(value.start)
 		});
-		else setInputValue(dateToString(value$1));
+		else setInputValue(dateToString(value));
 		if (!closeOnSelect) return;
-		if ((0, utils_exports.isObject)(value$1) && !(0, utils_exports.isArray)(value$1) && !(0, utils_exports.isDate)(value$1)) {
-			if (value$1.end && value$1.start) onClose();
+		if ((0, utils_exports.isObject)(value) && !(0, utils_exports.isArray)(value) && !(0, utils_exports.isDate)(value)) {
+			if (value.end && value.start) onClose();
 		} else onClose();
 	}, [
 		setValue,
@@ -205,25 +198,25 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		if ((0, utils_exports.isArray)(value) && value.length === max) return;
 		if ((0, utils_exports.runIfFn)(closeOnChange, ev)) onClose();
 		else if ((0, utils_exports.runIfFn)(openOnChange, ev)) onOpen();
-		let inputValue$1 = ev.target.value;
-		if (pattern) inputValue$1 = inputValue$1.replace(pattern, "");
+		let inputValue = ev.target.value;
+		if (pattern) inputValue = inputValue.replace(pattern, "");
 		if ((0, utils_exports.isArray)(value)) {
-			const date = stringToDate(inputValue$1);
-			setInputValue(inputValue$1);
+			const date = stringToDate(inputValue);
+			setInputValue(inputValue);
 			if (date) setMonth(dayjs(date).set("date", 1).toDate());
 		} else if ((0, utils_exports.isObject)(value) && !(0, utils_exports.isDate)(value)) {
 			const align = (0, utils_exports.contains)(endInputRef.current, ev.target) ? "end" : "start";
-			const minDate$1 = value.start && align === "end" ? dayjs(value.start).add(1, "day").toDate() : void 0;
-			const maxDate$1 = value.end && align === "start" ? dayjs(value.end).subtract(1, "day").toDate() : void 0;
-			const date = stringToDate(inputValue$1, minDate$1, maxDate$1);
-			setInputValue((prev) => (0, utils_exports.isObject)(prev) ? Object.assign({}, prev, { [align]: inputValue$1 }) : prev);
+			const minDate = value.start && align === "end" ? dayjs(value.start).add(1, "day").toDate() : void 0;
+			const maxDate = value.end && align === "start" ? dayjs(value.end).subtract(1, "day").toDate() : void 0;
+			const date = stringToDate(inputValue, minDate, maxDate);
+			setInputValue((prev) => (0, utils_exports.isObject)(prev) ? Object.assign({}, prev, { [align]: inputValue }) : prev);
 			setValue((prev) => (0, utils_exports.isObject)(prev) && !(0, utils_exports.isDate)(prev) ? {
 				...prev,
 				[align]: date
 			} : prev);
 		} else {
-			const date = stringToDate(inputValue$1);
-			setInputValue(inputValue$1);
+			const date = stringToDate(inputValue);
+			setInputValue(inputValue);
 			setValue(date);
 		}
 	}, [
@@ -242,17 +235,17 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 	]);
 	const onKeyDown = useCallback((ev) => {
 		if (disabled || isComposing(ev)) return;
-		const inputValue$1 = (0, utils_exports.cast)(ev.target).value;
+		const inputValue = (0, utils_exports.cast)(ev.target).value;
 		runKeyAction(ev, {
-			Backspace: (ev$1) => {
+			Backspace: (ev) => {
 				if ((0, utils_exports.isArray)(value)) {
-					if (inputValue$1.length) return;
-					ev$1.preventDefault();
+					if (inputValue.length) return;
+					ev.preventDefault();
 					setValue((prev) => (0, utils_exports.isArray)(prev) ? prev.slice(0, -1) : prev);
 				} else if ((0, utils_exports.isObject)(value) && !(0, utils_exports.isDate)(value)) {
-					if (inputValue$1.length) return;
-					if (!(0, utils_exports.contains)(endInputRef.current, ev$1.target)) return;
-					ev$1.preventDefault();
+					if (inputValue.length) return;
+					if (!(0, utils_exports.contains)(endInputRef.current, ev.target)) return;
+					ev.preventDefault();
 					setInputValue({
 						end: "",
 						start: ""
@@ -264,13 +257,13 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 					startInputRef.current?.focus();
 				}
 			},
-			Enter: (ev$1) => {
-				if (!open || !inputValue$1.length) return;
+			Enter: (ev) => {
+				if (!open || !inputValue.length) return;
 				if ((0, utils_exports.isObject)(value) && !(0, utils_exports.isArray)(value) && !(0, utils_exports.isDate)(value)) {
-					const align = (0, utils_exports.contains)(endInputRef.current, ev$1.target) ? "end" : "start";
-					const date = stringToDate(inputValue$1, value.start && align === "end" ? dayjs(value.start).add(1, "day").toDate() : void 0, value.end && align === "start" ? dayjs(value.end).subtract(1, "day").toDate() : void 0);
+					const align = (0, utils_exports.contains)(endInputRef.current, ev.target) ? "end" : "start";
+					const date = stringToDate(inputValue, value.start && align === "end" ? dayjs(value.start).add(1, "day").toDate() : void 0, value.end && align === "start" ? dayjs(value.end).subtract(1, "day").toDate() : void 0);
 					if (!date) return;
-					ev$1.preventDefault();
+					ev.preventDefault();
 					setInputValue((prev) => (0, utils_exports.isObject)(prev) ? Object.assign({}, prev, { [align]: dateToString(date) }) : prev);
 					setValue((prev) => (0, utils_exports.isObject)(prev) && !(0, utils_exports.isDate)(prev) ? {
 						...prev,
@@ -278,9 +271,9 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 					} : prev);
 					if (align === "start") endInputRef.current?.focus();
 				} else {
-					const date = stringToDate(inputValue$1);
+					const date = stringToDate(inputValue);
 					if (!date) return;
-					ev$1.preventDefault();
+					ev.preventDefault();
 					if ((0, utils_exports.isArray)(value)) {
 						setInputValue("");
 						setValue((prev) => (0, utils_exports.isArray)(prev) && !isIncludeDates(date, prev) && (!(0, utils_exports.isNumber)(max) || prev.length < max) ? [...prev, date] : prev);
@@ -396,19 +389,19 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		});
 		else setInputValue(dateToString(valueProp));
 	}, [valueProp]);
-	const getRootProps = useCallback((props$1) => ({
+	const getRootProps = useCallback((props) => ({
 		"data-range": (0, utils_exports.dataAttr)(range),
 		...dataProps,
-		...props$1
+		...props
 	}), [dataProps, range]);
-	const getFieldProps = useCallback(({ ref: ref$1, ...props$1 } = {}) => getTriggerProps({
-		ref: mergeRefs(ref$1, fieldRef),
+	const getFieldProps = useCallback(({ ref, ...props } = {}) => getTriggerProps({
+		ref: mergeRefs(ref, fieldRef),
 		"aria-haspopup": "dialog",
 		tabIndex: !allowInput ? 0 : -1,
-		...props$1,
-		onClick: (0, utils_exports.handlerAll)(props$1.onClick, onClick),
-		onFocus: (0, utils_exports.handlerAll)(props$1.onFocus, onFieldFocus),
-		onMouseDown: (0, utils_exports.handlerAll)(props$1.onMouseDown, onMouseDown)
+		...props,
+		onClick: (0, utils_exports.handlerAll)(props.onClick, onClick),
+		onFocus: (0, utils_exports.handlerAll)(props.onFocus, onFieldFocus),
+		onMouseDown: (0, utils_exports.handlerAll)(props.onMouseDown, onMouseDown)
 	}), [
 		allowInput,
 		getTriggerProps,
@@ -416,11 +409,11 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		onFieldFocus,
 		onMouseDown
 	]);
-	const getInputProps = useCallback(({ align = "start", ...props$1 } = {}) => {
+	const getInputProps = useCallback(({ align = "start", ...props } = {}) => {
 		const inputProps = {
 			style: {
 				...!allowInput ? { pointerEvents: "none" } : {},
-				...props$1.style
+				...props.style
 			},
 			autoComplete: "off",
 			disabled,
@@ -428,20 +421,20 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 			required,
 			tabIndex: allowInput ? 0 : -1,
 			...dataProps,
-			...props$1,
-			onBlur: (0, utils_exports.handlerAll)(props$1.onBlur, onBlur),
-			onChange: (0, utils_exports.handlerAll)(props$1.onChange, onInputChange),
-			onFocus: (0, utils_exports.handlerAll)(props$1.onFocus, onInputFocus),
-			onKeyDown: (0, utils_exports.handlerAll)(props$1.onKeyDown, onKeyDown),
-			onMouseDown: (0, utils_exports.handlerAll)(props$1.onMouseDown, onMouseDown)
+			...props,
+			onBlur: (0, utils_exports.handlerAll)(props.onBlur, onBlur),
+			onChange: (0, utils_exports.handlerAll)(props.onChange, onInputChange),
+			onFocus: (0, utils_exports.handlerAll)(props.onFocus, onInputFocus),
+			onKeyDown: (0, utils_exports.handlerAll)(props.onKeyDown, onKeyDown),
+			onMouseDown: (0, utils_exports.handlerAll)(props.onMouseDown, onMouseDown)
 		};
 		if ((0, utils_exports.isObject)(inputValue)) {
 			if (align === "start") {
-				inputProps.ref = mergeRefs(props$1.ref, ref, startInputRef);
+				inputProps.ref = mergeRefs(props.ref, ref, startInputRef);
 				inputProps.value = inputValue.start;
 				inputProps.placeholder = startPlaceholder;
 			} else {
-				inputProps.ref = mergeRefs(props$1.ref, ref, endInputRef);
+				inputProps.ref = mergeRefs(props.ref, ref, endInputRef);
 				inputProps.value = inputValue.end;
 				inputProps.placeholder = endPlaceholder;
 			}
@@ -454,7 +447,7 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 				inputProps.name = name;
 			}
 		} else {
-			inputProps.ref = mergeRefs(props$1.ref, ref, startInputRef);
+			inputProps.ref = mergeRefs(props.ref, ref, startInputRef);
 			inputProps.value = inputValue;
 			inputProps.id = id;
 			inputProps.name = name;
@@ -489,12 +482,12 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		startPlaceholder,
 		value
 	]);
-	const getContentProps = useCallback(({ ref: ref$1, ...props$1 } = {}) => getComboboxContentProps({
-		ref: mergeRefs(ref$1, contentRef),
+	const getContentProps = useCallback(({ ref, ...props } = {}) => getComboboxContentProps({
+		ref: mergeRefs(ref, contentRef),
 		role: "dialog",
-		...props$1
+		...props
 	}), [getComboboxContentProps]);
-	const getCalendarProps = useCallback((props$1) => ({
+	const getCalendarProps = useCallback((props) => ({
 		disabled: !interactive,
 		format: calendarFormat,
 		locale,
@@ -508,7 +501,7 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		onChange,
 		onChangeMonth: setMonth,
 		...calendarProps,
-		...props$1
+		...props
 	}), [
 		interactive,
 		calendarFormat,
@@ -524,9 +517,9 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		setMonth,
 		calendarProps
 	]);
-	const getIconProps = useCallback((props$1) => ({
+	const getIconProps = useCallback((props) => ({
 		...dataProps,
-		...props$1
+		...props
 	}), [dataProps]);
 	return {
 		children,
@@ -543,14 +536,14 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		stringToDate,
 		value,
 		getCalendarProps,
-		getClearIconProps: useCallback((props$1 = {}) => getIconProps({
+		getClearIconProps: useCallback((props = {}) => getIconProps({
 			"aria-disabled": (0, utils_exports.ariaAttr)(!interactive),
 			"aria-label": t("Clear value"),
 			role: "button",
 			tabIndex: interactive ? 0 : -1,
-			...props$1,
-			onClick: (0, utils_exports.handlerAll)(props$1.onClick, onClear),
-			onKeyDown: (0, utils_exports.handlerAll)(props$1.onKeyDown, (ev) => runKeyAction(ev, {
+			...props,
+			onClick: (0, utils_exports.handlerAll)(props.onClick, onClear),
+			onKeyDown: (0, utils_exports.handlerAll)(props.onKeyDown, (ev) => runKeyAction(ev, {
 				Enter: onClear,
 				Space: onClear
 			}))
@@ -572,7 +565,7 @@ const useDatePicker = ({ maxDate = DEFAULT_MAX_DATE, minDate = DEFAULT_MIN_DATE,
 		onOpen
 	};
 };
-
 //#endregion
 export { useDatePicker };
+
 //# sourceMappingURL=use-date-picker.js.map