@mantine/dates 9.0.2 → 9.1.0

package/cjs/components/MonthPicker/MonthPicker.cjs

@@ -2,14 +2,35 @@
 require("../../_virtual/_rolldown/runtime.cjs");
 const require_use_dates_state = require("../../hooks/use-dates-state/use-dates-state.cjs");
 const require_Calendar = require("../Calendar/Calendar.cjs");
+const require_pick_calendar_levels_props = require("../Calendar/pick-calendar-levels-props/pick-calendar-levels-props.cjs");
+const require_MonthPicker_module = require("./MonthPicker.module.cjs");
+let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _mantine_core = require("@mantine/core");
 //#region packages/@mantine/dates/src/components/MonthPicker/MonthPicker.tsx
+const varsResolver = (0, _mantine_core.createVarsResolver)((_, { size }) => ({ monthPickerRoot: { "--preset-font-size": (0, _mantine_core.getFontSize)(size) } }));
 const defaultProps = { type: "default" };
 const MonthPicker = (0, _mantine_core.factory)((_props) => {
 	const props = (0, _mantine_core.useProps)("MonthPicker", defaultProps, _props);
-	const { classNames, styles, vars, type, defaultValue, value, onChange, __staticSelector, getMonthControlProps, allowSingleDateInRange, allowDeselect, onMouseLeave, onMonthSelect, __updateDateOnMonthSelect, onLevelChange, ...others } = props;
-	const { onDateChange, onRootMouseLeave, onHoveredDateChange, getControlProps } = require_use_dates_state.useDatesState({
+	const { classNames, styles, vars, type, defaultValue, value, onChange, __staticSelector, getMonthControlProps, allowSingleDateInRange, allowDeselect, onMouseLeave, onMonthSelect, __updateDateOnMonthSelect, __onPresetSelect, __stopPropagation, presets, className, style, unstyled, size, attributes, onLevelChange, ...rest } = props;
+	const { calendarProps, others } = require_pick_calendar_levels_props.pickCalendarProps(rest);
+	const setDateRef = (0, react.useRef)(null);
+	const setLevelRef = (0, react.useRef)(null);
+	const getStyles = (0, _mantine_core.useStyles)({
+		name: __staticSelector || "MonthPicker",
+		classes: require_MonthPicker_module.default,
+		props,
+		className,
+		style,
+		classNames,
+		styles,
+		unstyled,
+		attributes,
+		rootSelector: presets ? "monthPickerRoot" : void 0,
+		varsResolver,
+		vars
+	});
+	const { onDateChange, onRootMouseLeave, onHoveredDateChange, getControlProps, setValue } = require_use_dates_state.useDatesState({
 		type,
 		level: "month",
 		allowDeselect,
@@ -24,7 +45,12 @@ const MonthPicker = (0, _mantine_core.factory)((_props) => {
 		styles,
 		props
 	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Calendar.Calendar, {
+	const calendar = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Calendar.Calendar, {
+		classNames: resolvedClassNames,
+		styles: resolvedStyles,
+		size,
+		...calendarProps,
+		...!presets ? others : {},
 		minLevel: "year",
 		__updateDateOnMonthSelect: __updateDateOnMonthSelect ?? false,
 		__staticSelector: __staticSelector || "MonthPicker",
@@ -38,13 +64,47 @@ const MonthPicker = (0, _mantine_core.factory)((_props) => {
 			...getControlProps(date),
 			...getMonthControlProps?.(date)
 		}),
-		classNames: resolvedClassNames,
-		styles: resolvedStyles,
 		onLevelChange,
-		...others
+		__setDateRef: setDateRef,
+		__setLevelRef: setLevelRef,
+		__stopPropagation,
+		attributes,
+		...!presets ? {
+			className,
+			style
+		} : {}
+	});
+	if (!presets) return calendar;
+	const handlePresetSelect = (val) => {
+		const _val = Array.isArray(val) ? val[0] : val;
+		if (_val !== void 0) {
+			setDateRef.current?.(_val);
+			setLevelRef.current?.("year");
+			__onPresetSelect ? __onPresetSelect(_val) : setValue(val);
+		}
+	};
+	const presetButtons = presets.map((preset, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.UnstyledButton, {
+		...getStyles("presetButton"),
+		onClick: () => handlePresetSelect(preset.value),
+		onMouseDown: (event) => event.preventDefault(),
+		"data-mantine-stop-propagation": __stopPropagation || void 0,
+		children: preset.label
+	}, index));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mantine_core.Box, {
+		...getStyles("monthPickerRoot"),
+		size,
+		...others,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			...getStyles("presetsList"),
+			children: presetButtons
+		}), calendar]
 	});
 });
-MonthPicker.classes = require_Calendar.Calendar.classes;
+MonthPicker.classes = {
+	...require_Calendar.Calendar.classes,
+	...require_MonthPicker_module.default
+};
+MonthPicker.varsResolver = varsResolver;
 MonthPicker.displayName = "@mantine/dates/MonthPicker";
 //#endregion
 exports.MonthPicker = MonthPicker;

package/cjs/components/MonthPicker/MonthPicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MonthPicker.cjs","names":["useDatesState","Calendar"],"sources":["../../../src/components/MonthPicker/MonthPicker.tsx"],"sourcesContent":["import {\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  MantineComponentStaticProperties,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n} from '@mantine/core';\nimport { useDatesState } from '../../hooks';\nimport { CalendarLevel, DatePickerType, DateStringValue, PickerBaseProps } from '../../types';\nimport { Calendar, CalendarBaseProps } from '../Calendar';\nimport { DecadeLevelBaseSettings } from '../DecadeLevel';\nimport { DecadeLevelGroupStylesNames } from '../DecadeLevelGroup';\nimport { YearLevelBaseSettings } from '../YearLevel';\nimport { YearLevelGroupStylesNames } from '../YearLevelGroup';\n\nexport type MonthPickerStylesNames = DecadeLevelGroupStylesNames | YearLevelGroupStylesNames;\n\ntype MonthPickerLevel = Exclude<CalendarLevel, 'month'>;\n\nexport interface MonthPickerBaseProps<Type extends DatePickerType = 'default'>\n  extends\n    PickerBaseProps<Type>,\n    DecadeLevelBaseSettings,\n    YearLevelBaseSettings,\n    Omit<CalendarBaseProps, 'onNextMonth' | 'onPreviousMonth' | 'hasNextLevel'> {\n  /** Max level that user can go up to @default 'decade' */\n  maxLevel?: CalendarLevel;\n\n  /** Initial displayed level (uncontrolled) */\n  defaultLevel?: CalendarLevel;\n\n  /** Current displayed level (controlled) */\n  level?: CalendarLevel;\n\n  /** Called when level changes */\n  onLevelChange?: (level: MonthPickerLevel) => void;\n}\n\nexport interface MonthPickerProps<Type extends DatePickerType = 'default'>\n  extends\n    BoxProps,\n    MonthPickerBaseProps<Type>,\n    StylesApiProps<MonthPickerFactory>,\n    ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n  /** Called when month is selected */\n  onMonthSelect?: (date: DateStringValue) => void;\n}\n\nexport type MonthPickerFactory = Factory<{\n  props: MonthPickerProps;\n  ref: HTMLDivElement;\n  stylesNames: MonthPickerStylesNames;\n}>;\n\nconst defaultProps = {\n  type: 'default',\n} satisfies Partial<MonthPickerProps>;\n\ntype MonthPickerComponent = (<Type extends DatePickerType = 'default'>(\n  props: MonthPickerProps<Type> & { ref?: React.Ref<HTMLDivElement> }\n) => React.JSX.Element) & {\n  displayName?: string;\n} & MantineComponentStaticProperties<MonthPickerFactory>;\n\nexport const MonthPicker: MonthPickerComponent = factory<MonthPickerFactory>((_props) => {\n  const props = useProps('MonthPicker', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    vars,\n    type,\n    defaultValue,\n    value,\n    onChange,\n    __staticSelector,\n    getMonthControlProps,\n    allowSingleDateInRange,\n    allowDeselect,\n    onMouseLeave,\n    onMonthSelect,\n    __updateDateOnMonthSelect,\n    onLevelChange,\n    ...others\n  } = props;\n\n  const { onDateChange, onRootMouseLeave, onHoveredDateChange, getControlProps } = useDatesState({\n    type: type as any,\n    level: 'month',\n    allowDeselect,\n    allowSingleDateInRange,\n    value,\n    defaultValue,\n    onChange: onChange as any,\n    onMouseLeave,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MonthPickerFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Calendar\n      minLevel=\"year\"\n      __updateDateOnMonthSelect={__updateDateOnMonthSelect ?? false}\n      __staticSelector={__staticSelector || 'MonthPicker'}\n      onMouseLeave={onRootMouseLeave}\n      onMonthMouseEnter={(_event, date) => onHoveredDateChange(date)}\n      onMonthSelect={(date) => {\n        onDateChange(date);\n        onMonthSelect?.(date);\n      }}\n      getMonthControlProps={(date) => ({\n        ...getControlProps(date),\n        ...getMonthControlProps?.(date),\n      })}\n      classNames={resolvedClassNames}\n      styles={resolvedStyles}\n      onLevelChange={onLevelChange as any}\n      {...others}\n    />\n  );\n}) as any;\n\nMonthPicker.classes = Calendar.classes;\nMonthPicker.displayName = '@mantine/dates/MonthPicker';\n\nexport namespace MonthPicker {\n  export type Props<Type extends DatePickerType = 'default'> = MonthPickerProps<Type>;\n  export type StylesNames = MonthPickerStylesNames;\n  export type Factory = MonthPickerFactory;\n}\n"],"mappings":";;;;;;;AAyDA,MAAM,eAAe,EACnB,MAAM,WACP;AAQD,MAAa,eAAA,GAAA,cAAA,UAAiE,WAAW;CACvF,MAAM,SAAA,GAAA,cAAA,UAAiB,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,QACA,MACA,MACA,cACA,OACA,UACA,kBACA,sBACA,wBACA,eACA,cACA,eACA,2BACA,eACA,GAAG,WACD;CAEJ,MAAM,EAAE,cAAc,kBAAkB,qBAAqB,oBAAoBA,wBAAAA,cAAc;EACvF;EACN,OAAO;EACP;EACA;EACA;EACA;EACU;EACV;EACD,CAAC;CAEF,MAAM,EAAE,oBAAoB,oBAAA,GAAA,cAAA,sBAA4D;EACtF;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,iBAAAA,UAAD;EACE,UAAS;EACT,2BAA2B,6BAA6B;EACxD,kBAAkB,oBAAoB;EACtC,cAAc;EACd,oBAAoB,QAAQ,SAAS,oBAAoB,KAAK;EAC9D,gBAAgB,SAAS;AACvB,gBAAa,KAAK;AAClB,mBAAgB,KAAK;;EAEvB,uBAAuB,UAAU;GAC/B,GAAG,gBAAgB,KAAK;GACxB,GAAG,uBAAuB,KAAK;GAChC;EACD,YAAY;EACZ,QAAQ;EACO;EACf,GAAI;EACJ,CAAA;EAEJ;AAEF,YAAY,UAAUA,iBAAAA,SAAS;AAC/B,YAAY,cAAc"}
+{"version":3,"file":"MonthPicker.cjs","names":["pickCalendarProps","useDatesState","Calendar","UnstyledButton","Box","classes"],"sources":["../../../src/components/MonthPicker/MonthPicker.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  MantineComponentStaticProperties,\n  StylesApiProps,\n  UnstyledButton,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesState } from '../../hooks';\nimport {\n  CalendarLevel,\n  DatePickerType,\n  DateStringValue,\n  DateValue,\n  PickerBaseProps,\n} from '../../types';\nimport { Calendar, CalendarBaseProps, pickCalendarProps } from '../Calendar';\nimport { DecadeLevelBaseSettings } from '../DecadeLevel';\nimport { DecadeLevelGroupStylesNames } from '../DecadeLevelGroup';\nimport { YearLevelBaseSettings } from '../YearLevel';\nimport { YearLevelGroupStylesNames } from '../YearLevelGroup';\nimport classes from './MonthPicker.module.css';\n\nexport interface MonthPickerPreset<Type extends DatePickerType> {\n  value: Type extends 'range'\n    ? [DateStringValue | null, DateStringValue | null]\n    : Type extends 'multiple'\n      ? DateStringValue[]\n      : DateStringValue | null;\n  label: React.ReactNode;\n}\n\nexport type MonthPickerCssVariables = {\n  monthPickerRoot: '--preset-font-size';\n};\n\nexport type MonthPickerStylesNames =\n  | DecadeLevelGroupStylesNames\n  | YearLevelGroupStylesNames\n  | 'presetsList'\n  | 'presetButton'\n  | 'monthPickerRoot';\n\ntype MonthPickerLevel = Exclude<CalendarLevel, 'month'>;\n\nexport interface MonthPickerBaseProps<Type extends DatePickerType = 'default'>\n  extends\n    PickerBaseProps<Type>,\n    DecadeLevelBaseSettings,\n    YearLevelBaseSettings,\n    Omit<CalendarBaseProps, 'onNextMonth' | 'onPreviousMonth' | 'hasNextLevel'> {\n  /** Max level that user can go up to @default 'decade' */\n  maxLevel?: CalendarLevel;\n\n  /** Initial displayed level (uncontrolled) */\n  defaultLevel?: CalendarLevel;\n\n  /** Current displayed level (controlled) */\n  level?: CalendarLevel;\n\n  /** Called when level changes */\n  onLevelChange?: (level: MonthPickerLevel) => void;\n\n  /** Predefined values to pick from */\n  presets?: MonthPickerPreset<Type>[];\n\n  /** If defined, called with preset value, suppresses `onChange` call */\n  __onPresetSelect?: (\n    preset: Type extends 'range'\n      ? [DateStringValue | null, DateStringValue | null]\n      : DateStringValue | null\n  ) => void;\n}\n\nexport interface MonthPickerProps<Type extends DatePickerType = 'default'>\n  extends\n    BoxProps,\n    MonthPickerBaseProps<Type>,\n    StylesApiProps<MonthPickerFactory>,\n    ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n  /** Called when month is selected */\n  onMonthSelect?: (date: DateStringValue) => void;\n}\n\nexport type MonthPickerFactory = Factory<{\n  props: MonthPickerProps;\n  ref: HTMLDivElement;\n  stylesNames: MonthPickerStylesNames;\n  vars: MonthPickerCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<MonthPickerFactory>((_, { size }) => ({\n  monthPickerRoot: {\n    '--preset-font-size': getFontSize(size),\n  },\n}));\n\nconst defaultProps = {\n  type: 'default',\n} satisfies Partial<MonthPickerProps>;\n\ntype MonthPickerComponent = (<Type extends DatePickerType = 'default'>(\n  props: MonthPickerProps<Type> & { ref?: React.Ref<HTMLDivElement> }\n) => React.JSX.Element) & {\n  displayName?: string;\n} & MantineComponentStaticProperties<MonthPickerFactory>;\n\nexport const MonthPicker: MonthPickerComponent = factory<MonthPickerFactory>((_props) => {\n  const props = useProps('MonthPicker', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    vars,\n    type,\n    defaultValue,\n    value,\n    onChange,\n    __staticSelector,\n    getMonthControlProps,\n    allowSingleDateInRange,\n    allowDeselect,\n    onMouseLeave,\n    onMonthSelect,\n    __updateDateOnMonthSelect,\n    __onPresetSelect,\n    __stopPropagation,\n    presets,\n    className,\n    style,\n    unstyled,\n    size,\n    attributes,\n    onLevelChange,\n    ...rest\n  } = props;\n\n  const { calendarProps, others } = pickCalendarProps(rest);\n  const setDateRef = useRef<((date: DateValue) => void) | null>(null);\n  const setLevelRef = useRef<((level: CalendarLevel) => void) | null>(null);\n\n  const getStyles = useStyles<MonthPickerFactory>({\n    name: __staticSelector || 'MonthPicker',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: presets ? 'monthPickerRoot' : undefined,\n    varsResolver,\n    vars,\n  });\n\n  const { onDateChange, onRootMouseLeave, onHoveredDateChange, getControlProps, setValue } =\n    useDatesState({\n      type: type as any,\n      level: 'month',\n      allowDeselect,\n      allowSingleDateInRange,\n      value,\n      defaultValue,\n      onChange: onChange as any,\n      onMouseLeave,\n    });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MonthPickerFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const calendar = (\n    <Calendar\n      classNames={resolvedClassNames}\n      styles={resolvedStyles}\n      size={size}\n      {...calendarProps}\n      {...(!presets ? others : {})}\n      minLevel=\"year\"\n      __updateDateOnMonthSelect={__updateDateOnMonthSelect ?? false}\n      __staticSelector={__staticSelector || 'MonthPicker'}\n      onMouseLeave={onRootMouseLeave}\n      onMonthMouseEnter={(_event, date) => onHoveredDateChange(date)}\n      onMonthSelect={(date) => {\n        onDateChange(date);\n        onMonthSelect?.(date);\n      }}\n      getMonthControlProps={(date) => ({\n        ...getControlProps(date),\n        ...getMonthControlProps?.(date),\n      })}\n      onLevelChange={onLevelChange as any}\n      __setDateRef={setDateRef}\n      __setLevelRef={setLevelRef}\n      __stopPropagation={__stopPropagation}\n      attributes={attributes}\n      {...(!presets ? { className, style } : {})}\n    />\n  );\n\n  if (!presets) {\n    return calendar;\n  }\n\n  const handlePresetSelect = (\n    val: DateStringValue | null | [DateStringValue | null, DateStringValue | null]\n  ) => {\n    const _val = Array.isArray(val) ? val[0] : val;\n    if (_val !== undefined) {\n      setDateRef.current?.(_val);\n      setLevelRef.current?.('year');\n      __onPresetSelect ? __onPresetSelect(_val) : setValue(val);\n    }\n  };\n\n  const presetButtons = presets.map((preset, index) => (\n    <UnstyledButton\n      key={index}\n      {...getStyles('presetButton')}\n      onClick={() => handlePresetSelect(preset.value)}\n      onMouseDown={(event) => event.preventDefault()}\n      data-mantine-stop-propagation={__stopPropagation || undefined}\n    >\n      {preset.label}\n    </UnstyledButton>\n  ));\n\n  return (\n    <Box {...getStyles('monthPickerRoot')} size={size} {...others}>\n      <div {...getStyles('presetsList')}>{presetButtons}</div>\n      {calendar}\n    </Box>\n  );\n}) as any;\n\nMonthPicker.classes = { ...Calendar.classes, ...classes };\nMonthPicker.varsResolver = varsResolver;\nMonthPicker.displayName = '@mantine/dates/MonthPicker';\n\nexport namespace MonthPicker {\n  export type Props<Type extends DatePickerType = 'default'> = MonthPickerProps<Type>;\n  export type StylesNames = MonthPickerStylesNames;\n  export type Factory = MonthPickerFactory;\n}\n"],"mappings":";;;;;;;;;;AAmGA,MAAM,gBAAA,GAAA,cAAA,qBAAuD,GAAG,EAAE,YAAY,EAC5E,iBAAiB,EACf,uBAAA,GAAA,cAAA,aAAkC,KAAK,EACxC,EACF,EAAE;AAEH,MAAM,eAAe,EACnB,MAAM,WACP;AAQD,MAAa,eAAA,GAAA,cAAA,UAAiE,WAAW;CACvF,MAAM,SAAA,GAAA,cAAA,UAAiB,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,QACA,MACA,MACA,cACA,OACA,UACA,kBACA,sBACA,wBACA,eACA,cACA,eACA,2BACA,kBACA,mBACA,SACA,WACA,OACA,UACA,MACA,YACA,eACA,GAAG,SACD;CAEJ,MAAM,EAAE,eAAe,WAAWA,mCAAAA,kBAAkB,KAAK;CACzD,MAAM,cAAA,GAAA,MAAA,QAAwD,KAAK;CACnE,MAAM,eAAA,GAAA,MAAA,QAA8D,KAAK;CAEzE,MAAM,aAAA,GAAA,cAAA,WAA0C;EAC9C,MAAM,oBAAoB;EAC1B,SAAA,2BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc,UAAU,oBAAoB,KAAA;EAC5C;EACA;EACD,CAAC;CAEF,MAAM,EAAE,cAAc,kBAAkB,qBAAqB,iBAAiB,aAC5EC,wBAAAA,cAAc;EACN;EACN,OAAO;EACP;EACA;EACA;EACA;EACU;EACV;EACD,CAAC;CAEJ,MAAM,EAAE,oBAAoB,oBAAA,GAAA,cAAA,sBAA4D;EACtF;EACA;EACA;EACD,CAAC;CAEF,MAAM,WACJ,iBAAA,GAAA,kBAAA,KAACC,iBAAAA,UAAD;EACE,YAAY;EACZ,QAAQ;EACF;EACN,GAAI;EACJ,GAAK,CAAC,UAAU,SAAS,EAAE;EAC3B,UAAS;EACT,2BAA2B,6BAA6B;EACxD,kBAAkB,oBAAoB;EACtC,cAAc;EACd,oBAAoB,QAAQ,SAAS,oBAAoB,KAAK;EAC9D,gBAAgB,SAAS;AACvB,gBAAa,KAAK;AAClB,mBAAgB,KAAK;;EAEvB,uBAAuB,UAAU;GAC/B,GAAG,gBAAgB,KAAK;GACxB,GAAG,uBAAuB,KAAK;GAChC;EACc;EACf,cAAc;EACd,eAAe;EACI;EACP;EACZ,GAAK,CAAC,UAAU;GAAE;GAAW;GAAO,GAAG,EAAE;EACzC,CAAA;AAGJ,KAAI,CAAC,QACH,QAAO;CAGT,MAAM,sBACJ,QACG;EACH,MAAM,OAAO,MAAM,QAAQ,IAAI,GAAG,IAAI,KAAK;AAC3C,MAAI,SAAS,KAAA,GAAW;AACtB,cAAW,UAAU,KAAK;AAC1B,eAAY,UAAU,OAAO;AAC7B,sBAAmB,iBAAiB,KAAK,GAAG,SAAS,IAAI;;;CAI7D,MAAM,gBAAgB,QAAQ,KAAK,QAAQ,UACzC,iBAAA,GAAA,kBAAA,KAACC,cAAAA,gBAAD;EAEE,GAAI,UAAU,eAAe;EAC7B,eAAe,mBAAmB,OAAO,MAAM;EAC/C,cAAc,UAAU,MAAM,gBAAgB;EAC9C,iCAA+B,qBAAqB,KAAA;YAEnD,OAAO;EACO,EAPV,MAOU,CACjB;AAEF,QACE,iBAAA,GAAA,kBAAA,MAACC,cAAAA,KAAD;EAAK,GAAI,UAAU,kBAAkB;EAAQ;EAAM,GAAI;YAAvD,CACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,cAAc;aAAG;GAAoB,CAAA,EACvD,SACG;;EAER;AAEF,YAAY,UAAU;CAAE,GAAGF,iBAAAA,SAAS;CAAS,GAAGG,2BAAAA;CAAS;AACzD,YAAY,eAAe;AAC3B,YAAY,cAAc"}

package/cjs/components/MonthPicker/MonthPicker.module.cjs

@@ -0,0 +1,11 @@
+"use client";
+//#region packages/@mantine/dates/src/components/MonthPicker/MonthPicker.module.css
+var MonthPicker_module_default = {
+	"monthPickerRoot": "m_53c9e871",
+	"presetsList": "m_cccb8ff3",
+	"presetButton": "m_7b4fbf50"
+};
+//#endregion
+exports.default = MonthPicker_module_default;
+
+//# sourceMappingURL=MonthPicker.module.cjs.map

package/cjs/components/MonthPicker/MonthPicker.module.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthPicker.module.cjs","names":[],"sources":["../../../src/components/MonthPicker/MonthPicker.module.css"],"sourcesContent":[".monthPickerRoot {\n  display: flex;\n  font-size: var(--preset-font-size);\n}\n\n.presetsList {\n  display: flex;\n  flex-direction: column;\n  border-inline-end: 1px solid;\n  padding-inline-end: 0.5em;\n  margin-inline-end: 0.5em;\n\n  @mixin where-light {\n    border-color: var(--mantine-color-gray-2);\n  }\n\n  @mixin where-dark {\n    border-color: var(--mantine-color-dark-5);\n  }\n}\n\n.presetButton {\n  padding: 0.52em 0.8em;\n  border-radius: var(--mantine-radius-default);\n  font-size: var(--preset-font-size);\n  white-space: nowrap;\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-0);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n}\n"],"mappings":""}

package/cjs/components/MonthPickerInput/MonthPickerInput.cjs

@@ -18,7 +18,7 @@ const defaultProps = {
 };
 const MonthPickerInput = (0, _mantine_core.factory)((_props) => {
 	const props = (0, _mantine_core.useProps)("MonthPickerInput", defaultProps, _props);
-	const { type, value, defaultValue, onChange, valueFormat, labelSeparator, locale, classNames, styles, unstyled, closeOnChange, size, variant, dropdownType, sortDates, minDate, maxDate, vars, valueFormatter, attributes, ...rest } = props;
+	const { type, value, defaultValue, onChange, valueFormat, labelSeparator, locale, classNames, styles, unstyled, closeOnChange, size, variant, dropdownType, sortDates, minDate, maxDate, vars, valueFormatter, presets, attributes, ...rest } = props;
 	const { resolvedClassNames, resolvedStyles } = (0, _mantine_core.useResolvedStylesApi)({
 		classNames,
 		styles,
@@ -76,6 +76,7 @@ const MonthPickerInput = (0, _mantine_core.factory)((_props) => {
 			__stopPropagation: dropdownType === "popover",
 			minDate,
 			maxDate,
+			presets,
 			attributes
 		})
 	});

package/cjs/components/MonthPickerInput/MonthPickerInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MonthPickerInput.cjs","names":["pickCalendarProps","useDatesInput","PickerInputBase","MonthPicker","getDefaultClampedDate"],"sources":["../../../src/components/MonthPickerInput/MonthPickerInput.tsx"],"sourcesContent":["import {\n  __InputStylesNames,\n  BoxProps,\n  factory,\n  Factory,\n  InputVariant,\n  MantineComponentStaticProperties,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n} from '@mantine/core';\nimport { useDatesInput } from '../../hooks';\nimport { DatePickerType } from '../../types';\nimport { getDefaultClampedDate } from '../../utils';\nimport { pickCalendarProps } from '../Calendar';\nimport { MonthPicker, MonthPickerBaseProps, MonthPickerStylesNames } from '../MonthPicker';\nimport { DateInputSharedProps, PickerInputBase } from '../PickerInputBase';\n\nexport type MonthPickerInputStylesNames =\n  | __InputStylesNames\n  | 'placeholder'\n  | MonthPickerStylesNames;\n\nexport interface MonthPickerInputProps<Type extends DatePickerType = 'default'>\n  extends\n    BoxProps,\n    DateInputSharedProps,\n    MonthPickerBaseProps<Type>,\n    StylesApiProps<MonthPickerInputFactory> {\n  /** `dayjs` format for input value @default \"MMMM YYYY\" */\n  valueFormat?: string;\n}\n\nexport type MonthPickerInputFactory = Factory<{\n  props: MonthPickerInputProps;\n  ref: HTMLButtonElement;\n  stylesNames: MonthPickerInputStylesNames;\n  variant: InputVariant;\n}>;\n\nconst defaultProps = {\n  type: 'default',\n  size: 'sm',\n  valueFormat: 'MMMM YYYY',\n  closeOnChange: true,\n  sortDates: true,\n  dropdownType: 'popover',\n} satisfies Partial<MonthPickerInputProps>;\n\ntype MonthPickerInputComponent = (<Type extends DatePickerType = 'default'>(\n  props: MonthPickerInputProps<Type> & { ref?: React.Ref<HTMLButtonElement> }\n) => React.JSX.Element) & {\n  displayName?: string;\n} & MantineComponentStaticProperties<MonthPickerInputFactory>;\n\nexport const MonthPickerInput: MonthPickerInputComponent = factory<MonthPickerInputFactory>(\n  (_props) => {\n    const props = useProps('MonthPickerInput', defaultProps, _props);\n    const {\n      type,\n      value,\n      defaultValue,\n      onChange,\n      valueFormat,\n      labelSeparator,\n      locale,\n      classNames,\n      styles,\n      unstyled,\n      closeOnChange,\n      size,\n      variant,\n      dropdownType,\n      sortDates,\n      minDate,\n      maxDate,\n      vars,\n      valueFormatter,\n      attributes,\n      ...rest\n    } = props;\n\n    const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MonthPickerInputFactory>({\n      classNames,\n      styles,\n      props,\n    });\n\n    const { calendarProps, others } = pickCalendarProps(rest);\n\n    const {\n      _value,\n      setValue,\n      formattedValue,\n      dropdownHandlers,\n      dropdownOpened,\n      onClear,\n      shouldClear,\n    } = useDatesInput({\n      type: type as any,\n      value,\n      defaultValue,\n      onChange: onChange as any,\n      locale,\n      format: valueFormat,\n      labelSeparator,\n      closeOnChange,\n      sortDates,\n      valueFormatter,\n    });\n\n    return (\n      <PickerInputBase\n        formattedValue={formattedValue}\n        dropdownOpened={dropdownOpened}\n        dropdownHandlers={dropdownHandlers}\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        onClear={onClear}\n        shouldClear={shouldClear}\n        value={_value}\n        size={size}\n        variant={variant}\n        dropdownType={dropdownType}\n        {...others}\n        attributes={attributes}\n        type={type as any}\n        __staticSelector=\"MonthPickerInput\"\n      >\n        <MonthPicker\n          {...calendarProps}\n          size={size}\n          variant={variant}\n          type={type}\n          value={_value}\n          defaultDate={\n            calendarProps.defaultDate ||\n            (Array.isArray(_value)\n              ? _value[0] || getDefaultClampedDate({ maxDate, minDate })\n              : _value || getDefaultClampedDate({ maxDate, minDate }))\n          }\n          onChange={setValue}\n          locale={locale}\n          classNames={resolvedClassNames}\n          styles={resolvedStyles}\n          unstyled={unstyled}\n          __staticSelector=\"MonthPickerInput\"\n          __stopPropagation={dropdownType === 'popover'}\n          minDate={minDate}\n          maxDate={maxDate}\n          attributes={attributes}\n        />\n      </PickerInputBase>\n    );\n  }\n) as any;\n\nMonthPickerInput.classes = { ...PickerInputBase.classes, ...MonthPicker.classes };\nMonthPickerInput.displayName = '@mantine/dates/MonthPickerInput';\n\nexport namespace MonthPickerInput {\n  export type Props<Type extends DatePickerType = 'default'> = MonthPickerInputProps<Type>;\n  export type StylesNames = MonthPickerInputStylesNames;\n  export type Factory = MonthPickerInputFactory;\n}\n"],"mappings":";;;;;;;;;;AAwCA,MAAM,eAAe;CACnB,MAAM;CACN,MAAM;CACN,aAAa;CACb,eAAe;CACf,WAAW;CACX,cAAc;CACf;AAQD,MAAa,oBAAA,GAAA,cAAA,UACV,WAAW;CACV,MAAM,SAAA,GAAA,cAAA,UAAiB,oBAAoB,cAAc,OAAO;CAChE,MAAM,EACJ,MACA,OACA,cACA,UACA,aACA,gBACA,QACA,YACA,QACA,UACA,eACA,MACA,SACA,cACA,WACA,SACA,SACA,MACA,gBACA,YACA,GAAG,SACD;CAEJ,MAAM,EAAE,oBAAoB,oBAAA,GAAA,cAAA,sBAAiE;EAC3F;EACA;EACA;EACD,CAAC;CAEF,MAAM,EAAE,eAAe,WAAWA,mCAAAA,kBAAkB,KAAK;CAEzD,MAAM,EACJ,QACA,UACA,gBACA,kBACA,gBACA,SACA,gBACEC,wBAAAA,cAAc;EACV;EACN;EACA;EACU;EACV;EACA,QAAQ;EACR;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,wBAAAA,iBAAD;EACkB;EACA;EACE;EAClB,YAAY;EACZ,QAAQ;EACE;EACD;EACI;EACb,OAAO;EACD;EACG;EACK;EACd,GAAI;EACQ;EACN;EACN,kBAAiB;YAEjB,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;GACE,GAAI;GACE;GACG;GACH;GACN,OAAO;GACP,aACE,cAAc,gBACb,MAAM,QAAQ,OAAO,GAClB,OAAO,MAAMC,iCAAAA,sBAAsB;IAAE;IAAS;IAAS,CAAC,GACxD,UAAUA,iCAAAA,sBAAsB;IAAE;IAAS;IAAS,CAAC;GAE3D,UAAU;GACF;GACR,YAAY;GACZ,QAAQ;GACE;GACV,kBAAiB;GACjB,mBAAmB,iBAAiB;GAC3B;GACA;GACG;GACZ,CAAA;EACc,CAAA;EAGvB;AAED,iBAAiB,UAAU;CAAE,GAAGF,wBAAAA,gBAAgB;CAAS,GAAGC,oBAAAA,YAAY;CAAS;AACjF,iBAAiB,cAAc"}
+{"version":3,"file":"MonthPickerInput.cjs","names":["pickCalendarProps","useDatesInput","PickerInputBase","MonthPicker","getDefaultClampedDate"],"sources":["../../../src/components/MonthPickerInput/MonthPickerInput.tsx"],"sourcesContent":["import {\n  __InputStylesNames,\n  BoxProps,\n  factory,\n  Factory,\n  InputVariant,\n  MantineComponentStaticProperties,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n} from '@mantine/core';\nimport { useDatesInput } from '../../hooks';\nimport { DatePickerType } from '../../types';\nimport { getDefaultClampedDate } from '../../utils';\nimport { pickCalendarProps } from '../Calendar';\nimport { MonthPicker, MonthPickerBaseProps, MonthPickerStylesNames } from '../MonthPicker';\nimport { DateInputSharedProps, PickerInputBase } from '../PickerInputBase';\n\nexport type MonthPickerInputStylesNames =\n  | __InputStylesNames\n  | 'placeholder'\n  | MonthPickerStylesNames;\n\nexport interface MonthPickerInputProps<Type extends DatePickerType = 'default'>\n  extends\n    BoxProps,\n    DateInputSharedProps,\n    MonthPickerBaseProps<Type>,\n    StylesApiProps<MonthPickerInputFactory> {\n  /** `dayjs` format for input value @default \"MMMM YYYY\" */\n  valueFormat?: string;\n}\n\nexport type MonthPickerInputFactory = Factory<{\n  props: MonthPickerInputProps;\n  ref: HTMLButtonElement;\n  stylesNames: MonthPickerInputStylesNames;\n  variant: InputVariant;\n}>;\n\nconst defaultProps = {\n  type: 'default',\n  size: 'sm',\n  valueFormat: 'MMMM YYYY',\n  closeOnChange: true,\n  sortDates: true,\n  dropdownType: 'popover',\n} satisfies Partial<MonthPickerInputProps>;\n\ntype MonthPickerInputComponent = (<Type extends DatePickerType = 'default'>(\n  props: MonthPickerInputProps<Type> & { ref?: React.Ref<HTMLButtonElement> }\n) => React.JSX.Element) & {\n  displayName?: string;\n} & MantineComponentStaticProperties<MonthPickerInputFactory>;\n\nexport const MonthPickerInput: MonthPickerInputComponent = factory<MonthPickerInputFactory>(\n  (_props) => {\n    const props = useProps('MonthPickerInput', defaultProps, _props);\n    const {\n      type,\n      value,\n      defaultValue,\n      onChange,\n      valueFormat,\n      labelSeparator,\n      locale,\n      classNames,\n      styles,\n      unstyled,\n      closeOnChange,\n      size,\n      variant,\n      dropdownType,\n      sortDates,\n      minDate,\n      maxDate,\n      vars,\n      valueFormatter,\n      presets,\n      attributes,\n      ...rest\n    } = props;\n\n    const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MonthPickerInputFactory>({\n      classNames,\n      styles,\n      props,\n    });\n\n    const { calendarProps, others } = pickCalendarProps(rest);\n\n    const {\n      _value,\n      setValue,\n      formattedValue,\n      dropdownHandlers,\n      dropdownOpened,\n      onClear,\n      shouldClear,\n    } = useDatesInput({\n      type: type as any,\n      value,\n      defaultValue,\n      onChange: onChange as any,\n      locale,\n      format: valueFormat,\n      labelSeparator,\n      closeOnChange,\n      sortDates,\n      valueFormatter,\n    });\n\n    return (\n      <PickerInputBase\n        formattedValue={formattedValue}\n        dropdownOpened={dropdownOpened}\n        dropdownHandlers={dropdownHandlers}\n        classNames={resolvedClassNames}\n        styles={resolvedStyles}\n        unstyled={unstyled}\n        onClear={onClear}\n        shouldClear={shouldClear}\n        value={_value}\n        size={size}\n        variant={variant}\n        dropdownType={dropdownType}\n        {...others}\n        attributes={attributes}\n        type={type as any}\n        __staticSelector=\"MonthPickerInput\"\n      >\n        <MonthPicker\n          {...calendarProps}\n          size={size}\n          variant={variant}\n          type={type}\n          value={_value}\n          defaultDate={\n            calendarProps.defaultDate ||\n            (Array.isArray(_value)\n              ? _value[0] || getDefaultClampedDate({ maxDate, minDate })\n              : _value || getDefaultClampedDate({ maxDate, minDate }))\n          }\n          onChange={setValue}\n          locale={locale}\n          classNames={resolvedClassNames}\n          styles={resolvedStyles}\n          unstyled={unstyled}\n          __staticSelector=\"MonthPickerInput\"\n          __stopPropagation={dropdownType === 'popover'}\n          minDate={minDate}\n          maxDate={maxDate}\n          presets={presets}\n          attributes={attributes}\n        />\n      </PickerInputBase>\n    );\n  }\n) as any;\n\nMonthPickerInput.classes = { ...PickerInputBase.classes, ...MonthPicker.classes };\nMonthPickerInput.displayName = '@mantine/dates/MonthPickerInput';\n\nexport namespace MonthPickerInput {\n  export type Props<Type extends DatePickerType = 'default'> = MonthPickerInputProps<Type>;\n  export type StylesNames = MonthPickerInputStylesNames;\n  export type Factory = MonthPickerInputFactory;\n}\n"],"mappings":";;;;;;;;;;AAwCA,MAAM,eAAe;CACnB,MAAM;CACN,MAAM;CACN,aAAa;CACb,eAAe;CACf,WAAW;CACX,cAAc;CACf;AAQD,MAAa,oBAAA,GAAA,cAAA,UACV,WAAW;CACV,MAAM,SAAA,GAAA,cAAA,UAAiB,oBAAoB,cAAc,OAAO;CAChE,MAAM,EACJ,MACA,OACA,cACA,UACA,aACA,gBACA,QACA,YACA,QACA,UACA,eACA,MACA,SACA,cACA,WACA,SACA,SACA,MACA,gBACA,SACA,YACA,GAAG,SACD;CAEJ,MAAM,EAAE,oBAAoB,oBAAA,GAAA,cAAA,sBAAiE;EAC3F;EACA;EACA;EACD,CAAC;CAEF,MAAM,EAAE,eAAe,WAAWA,mCAAAA,kBAAkB,KAAK;CAEzD,MAAM,EACJ,QACA,UACA,gBACA,kBACA,gBACA,SACA,gBACEC,wBAAAA,cAAc;EACV;EACN;EACA;EACU;EACV;EACA,QAAQ;EACR;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,wBAAAA,iBAAD;EACkB;EACA;EACE;EAClB,YAAY;EACZ,QAAQ;EACE;EACD;EACI;EACb,OAAO;EACD;EACG;EACK;EACd,GAAI;EACQ;EACN;EACN,kBAAiB;YAEjB,iBAAA,GAAA,kBAAA,KAACC,oBAAAA,aAAD;GACE,GAAI;GACE;GACG;GACH;GACN,OAAO;GACP,aACE,cAAc,gBACb,MAAM,QAAQ,OAAO,GAClB,OAAO,MAAMC,iCAAAA,sBAAsB;IAAE;IAAS;IAAS,CAAC,GACxD,UAAUA,iCAAAA,sBAAsB;IAAE;IAAS;IAAS,CAAC;GAE3D,UAAU;GACF;GACR,YAAY;GACZ,QAAQ;GACE;GACV,kBAAiB;GACjB,mBAAmB,iBAAiB;GAC3B;GACA;GACA;GACG;GACZ,CAAA;EACc,CAAA;EAGvB;AAED,iBAAiB,UAAU;CAAE,GAAGF,wBAAAA,gBAAgB;CAAS,GAAGC,oBAAAA,YAAY;CAAS;AACjF,iBAAiB,cAAc"}

package/cjs/components/SpinInput/SpinInput.cjs

@@ -5,7 +5,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 let _mantine_hooks = require("@mantine/hooks");
 //#region packages/@mantine/dates/src/components/SpinInput/SpinInput.tsx
 const getMaxDigit = (max) => Number(max.toFixed(0)[0]);
-function SpinInput({ value, min, max, onChange, focusable, step, onNextInput, onPreviousInput, onFocus, readOnly, allowTemporaryZero = false, placeholder = "--", ...others }) {
+function SpinInput({ value, min, max, onChange, focusable, step, onNextInput, onPreviousInput, onFocus, readOnly, allowTemporaryZero = false, placeholder = "--", disableAutoAdvance = false, ...others }) {
 	const maxDigit = getMaxDigit(max);
 	const arrowsMax = max + 1 - step;
 	const handleChange = (value) => {
@@ -15,7 +15,7 @@ function SpinInput({ value, min, max, onChange, focusable, step, onNextInput, on
 			const parsedValue = parseInt(clearValue, 10);
 			const clampedValue = allowTemporaryZero && parsedValue === 0 && min > 0 ? 0 : (0, _mantine_hooks.clamp)(parsedValue, min, max);
 			onChange(clampedValue);
-			if (clampedValue > maxDigit || value.startsWith("00")) onNextInput?.();
+			if (!disableAutoAdvance && (clampedValue > maxDigit || value.startsWith("00"))) onNextInput?.();
 		}
 	};
 	const handleKeyDown = (event) => {

package/cjs/components/SpinInput/SpinInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SpinInput.cjs","names":["padTime"],"sources":["../../../src/components/SpinInput/SpinInput.tsx"],"sourcesContent":["import { clamp } from '@mantine/hooks';\nimport { padTime } from '../TimePicker/utils/pad-time/pad-time';\n\ninterface SpinInputProps extends Omit<React.ComponentProps<'input'>, 'onChange' | 'value'> {\n  value: number | null;\n  min: number;\n  max: number;\n  onChange: (value: number | null) => void;\n  focusable: boolean;\n  step: number;\n  onNextInput?: () => void;\n  onPreviousInput?: () => void;\n  allowTemporaryZero?: boolean;\n  placeholder?: string;\n}\n\nconst getMaxDigit = (max: number) => Number(max.toFixed(0)[0]);\n\nexport function SpinInput({\n  value,\n  min,\n  max,\n  onChange,\n  focusable,\n  step,\n  onNextInput,\n  onPreviousInput,\n  onFocus,\n  readOnly,\n  allowTemporaryZero = false,\n  placeholder = '--',\n  ...others\n}: SpinInputProps) {\n  const maxDigit = getMaxDigit(max);\n  const arrowsMax = max + 1 - step;\n\n  const handleChange = (value: string) => {\n    if (readOnly) {\n      return;\n    }\n\n    const clearValue = value.replace(/\\D/g, '');\n    if (clearValue !== '') {\n      const parsedValue = parseInt(clearValue, 10);\n      const clampedValue =\n        allowTemporaryZero && parsedValue === 0 && min > 0 ? 0 : clamp(parsedValue, min, max);\n\n      onChange(clampedValue);\n\n      if (clampedValue > maxDigit || value.startsWith('00')) {\n        onNextInput?.();\n      }\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (readOnly) {\n      return;\n    }\n\n    if (event.key === '0' || event.key === 'Num0') {\n      if (value === 0) {\n        event.preventDefault();\n        onNextInput?.();\n      }\n    }\n\n    if (event.key === 'Home') {\n      event.preventDefault();\n      onChange(min);\n    }\n\n    if (event.key === 'End') {\n      event.preventDefault();\n      onChange(max);\n    }\n\n    if (event.key === 'Backspace' || event.key === 'Delete') {\n      event.preventDefault();\n\n      if (value !== null) {\n        onChange(null);\n      } else {\n        onPreviousInput?.();\n      }\n    }\n\n    if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      onNextInput?.();\n    }\n\n    if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      onPreviousInput?.();\n    }\n\n    if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      const newValue = value === null ? min : clamp(value + step, min, arrowsMax);\n      onChange(newValue);\n    }\n\n    if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      const newValue = value === null ? arrowsMax : clamp(value - step, min, arrowsMax);\n      onChange(newValue);\n    }\n  };\n\n  return (\n    <input\n      type=\"text\"\n      role=\"spinbutton\"\n      aria-valuemin={min}\n      aria-valuemax={max}\n      aria-valuenow={value === null ? 0 : value}\n      data-empty={value === null || undefined}\n      inputMode=\"numeric\"\n      placeholder={placeholder}\n      value={value === null ? '' : padTime(value)}\n      onChange={(event) => handleChange(event.currentTarget.value)}\n      onKeyDown={handleKeyDown}\n      onFocus={(event) => {\n        event.currentTarget.select();\n        onFocus?.(event);\n      }}\n      onClick={(event) => {\n        event.stopPropagation();\n        event.currentTarget.select();\n      }}\n      onMouseDown={(event) => event.stopPropagation()}\n      {...others}\n    />\n  );\n}\n\nSpinInput.displayName = '@mantine/dates/SpinInput';\n"],"mappings":";;;;;;AAgBA,MAAM,eAAe,QAAgB,OAAO,IAAI,QAAQ,EAAE,CAAC,GAAG;AAE9D,SAAgB,UAAU,EACxB,OACA,KACA,KACA,UACA,WACA,MACA,aACA,iBACA,SACA,UACA,qBAAqB,OACrB,cAAc,MACd,GAAG,UACc;CACjB,MAAM,WAAW,YAAY,IAAI;CACjC,MAAM,YAAY,MAAM,IAAI;CAE5B,MAAM,gBAAgB,UAAkB;AACtC,MAAI,SACF;EAGF,MAAM,aAAa,MAAM,QAAQ,OAAO,GAAG;AAC3C,MAAI,eAAe,IAAI;GACrB,MAAM,cAAc,SAAS,YAAY,GAAG;GAC5C,MAAM,eACJ,sBAAsB,gBAAgB,KAAK,MAAM,IAAI,KAAA,GAAA,eAAA,OAAU,aAAa,KAAK,IAAI;AAEvF,YAAS,aAAa;AAEtB,OAAI,eAAe,YAAY,MAAM,WAAW,KAAK,CACnD,gBAAe;;;CAKrB,MAAM,iBAAiB,UAAiD;AACtE,MAAI,SACF;AAGF,MAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ;OACjC,UAAU,GAAG;AACf,UAAM,gBAAgB;AACtB,mBAAe;;;AAInB,MAAI,MAAM,QAAQ,QAAQ;AACxB,SAAM,gBAAgB;AACtB,YAAS,IAAI;;AAGf,MAAI,MAAM,QAAQ,OAAO;AACvB,SAAM,gBAAgB;AACtB,YAAS,IAAI;;AAGf,MAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,UAAU;AACvD,SAAM,gBAAgB;AAEtB,OAAI,UAAU,KACZ,UAAS,KAAK;OAEd,oBAAmB;;AAIvB,MAAI,MAAM,QAAQ,cAAc;AAC9B,SAAM,gBAAgB;AACtB,kBAAe;;AAGjB,MAAI,MAAM,QAAQ,aAAa;AAC7B,SAAM,gBAAgB;AACtB,sBAAmB;;AAGrB,MAAI,MAAM,QAAQ,WAAW;AAC3B,SAAM,gBAAgB;AAEtB,YADiB,UAAU,OAAO,OAAA,GAAA,eAAA,OAAY,QAAQ,MAAM,KAAK,UAAU,CACzD;;AAGpB,MAAI,MAAM,QAAQ,aAAa;AAC7B,SAAM,gBAAgB;AAEtB,YADiB,UAAU,OAAO,aAAA,GAAA,eAAA,OAAkB,QAAQ,MAAM,KAAK,UAAU,CAC/D;;;AAItB,QACE,iBAAA,GAAA,kBAAA,KAAC,SAAD;EACE,MAAK;EACL,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe,UAAU,OAAO,IAAI;EACpC,cAAY,UAAU,QAAQ,KAAA;EAC9B,WAAU;EACG;EACb,OAAO,UAAU,OAAO,KAAKA,iBAAAA,QAAQ,MAAM;EAC3C,WAAW,UAAU,aAAa,MAAM,cAAc,MAAM;EAC5D,WAAW;EACX,UAAU,UAAU;AAClB,SAAM,cAAc,QAAQ;AAC5B,aAAU,MAAM;;EAElB,UAAU,UAAU;AAClB,SAAM,iBAAiB;AACvB,SAAM,cAAc,QAAQ;;EAE9B,cAAc,UAAU,MAAM,iBAAiB;EAC/C,GAAI;EACJ,CAAA;;AAIN,UAAU,cAAc"}
+{"version":3,"file":"SpinInput.cjs","names":["padTime"],"sources":["../../../src/components/SpinInput/SpinInput.tsx"],"sourcesContent":["import { clamp } from '@mantine/hooks';\nimport { padTime } from '../TimePicker/utils/pad-time/pad-time';\n\ninterface SpinInputProps extends Omit<React.ComponentProps<'input'>, 'onChange' | 'value'> {\n  value: number | null;\n  min: number;\n  max: number;\n  onChange: (value: number | null) => void;\n  focusable: boolean;\n  step: number;\n  onNextInput?: () => void;\n  onPreviousInput?: () => void;\n  allowTemporaryZero?: boolean;\n  placeholder?: string;\n  disableAutoAdvance?: boolean;\n}\n\nconst getMaxDigit = (max: number) => Number(max.toFixed(0)[0]);\n\nexport function SpinInput({\n  value,\n  min,\n  max,\n  onChange,\n  focusable,\n  step,\n  onNextInput,\n  onPreviousInput,\n  onFocus,\n  readOnly,\n  allowTemporaryZero = false,\n  placeholder = '--',\n  disableAutoAdvance = false,\n  ...others\n}: SpinInputProps) {\n  const maxDigit = getMaxDigit(max);\n  const arrowsMax = max + 1 - step;\n\n  const handleChange = (value: string) => {\n    if (readOnly) {\n      return;\n    }\n\n    const clearValue = value.replace(/\\D/g, '');\n    if (clearValue !== '') {\n      const parsedValue = parseInt(clearValue, 10);\n      const clampedValue =\n        allowTemporaryZero && parsedValue === 0 && min > 0 ? 0 : clamp(parsedValue, min, max);\n\n      onChange(clampedValue);\n\n      if (!disableAutoAdvance && (clampedValue > maxDigit || value.startsWith('00'))) {\n        onNextInput?.();\n      }\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (readOnly) {\n      return;\n    }\n\n    if (event.key === '0' || event.key === 'Num0') {\n      if (value === 0) {\n        event.preventDefault();\n        onNextInput?.();\n      }\n    }\n\n    if (event.key === 'Home') {\n      event.preventDefault();\n      onChange(min);\n    }\n\n    if (event.key === 'End') {\n      event.preventDefault();\n      onChange(max);\n    }\n\n    if (event.key === 'Backspace' || event.key === 'Delete') {\n      event.preventDefault();\n\n      if (value !== null) {\n        onChange(null);\n      } else {\n        onPreviousInput?.();\n      }\n    }\n\n    if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      onNextInput?.();\n    }\n\n    if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      onPreviousInput?.();\n    }\n\n    if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      const newValue = value === null ? min : clamp(value + step, min, arrowsMax);\n      onChange(newValue);\n    }\n\n    if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      const newValue = value === null ? arrowsMax : clamp(value - step, min, arrowsMax);\n      onChange(newValue);\n    }\n  };\n\n  return (\n    <input\n      type=\"text\"\n      role=\"spinbutton\"\n      aria-valuemin={min}\n      aria-valuemax={max}\n      aria-valuenow={value === null ? 0 : value}\n      data-empty={value === null || undefined}\n      inputMode=\"numeric\"\n      placeholder={placeholder}\n      value={value === null ? '' : padTime(value)}\n      onChange={(event) => handleChange(event.currentTarget.value)}\n      onKeyDown={handleKeyDown}\n      onFocus={(event) => {\n        event.currentTarget.select();\n        onFocus?.(event);\n      }}\n      onClick={(event) => {\n        event.stopPropagation();\n        event.currentTarget.select();\n      }}\n      onMouseDown={(event) => event.stopPropagation()}\n      {...others}\n    />\n  );\n}\n\nSpinInput.displayName = '@mantine/dates/SpinInput';\n"],"mappings":";;;;;;AAiBA,MAAM,eAAe,QAAgB,OAAO,IAAI,QAAQ,EAAE,CAAC,GAAG;AAE9D,SAAgB,UAAU,EACxB,OACA,KACA,KACA,UACA,WACA,MACA,aACA,iBACA,SACA,UACA,qBAAqB,OACrB,cAAc,MACd,qBAAqB,OACrB,GAAG,UACc;CACjB,MAAM,WAAW,YAAY,IAAI;CACjC,MAAM,YAAY,MAAM,IAAI;CAE5B,MAAM,gBAAgB,UAAkB;AACtC,MAAI,SACF;EAGF,MAAM,aAAa,MAAM,QAAQ,OAAO,GAAG;AAC3C,MAAI,eAAe,IAAI;GACrB,MAAM,cAAc,SAAS,YAAY,GAAG;GAC5C,MAAM,eACJ,sBAAsB,gBAAgB,KAAK,MAAM,IAAI,KAAA,GAAA,eAAA,OAAU,aAAa,KAAK,IAAI;AAEvF,YAAS,aAAa;AAEtB,OAAI,CAAC,uBAAuB,eAAe,YAAY,MAAM,WAAW,KAAK,EAC3E,gBAAe;;;CAKrB,MAAM,iBAAiB,UAAiD;AACtE,MAAI,SACF;AAGF,MAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ;OACjC,UAAU,GAAG;AACf,UAAM,gBAAgB;AACtB,mBAAe;;;AAInB,MAAI,MAAM,QAAQ,QAAQ;AACxB,SAAM,gBAAgB;AACtB,YAAS,IAAI;;AAGf,MAAI,MAAM,QAAQ,OAAO;AACvB,SAAM,gBAAgB;AACtB,YAAS,IAAI;;AAGf,MAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,UAAU;AACvD,SAAM,gBAAgB;AAEtB,OAAI,UAAU,KACZ,UAAS,KAAK;OAEd,oBAAmB;;AAIvB,MAAI,MAAM,QAAQ,cAAc;AAC9B,SAAM,gBAAgB;AACtB,kBAAe;;AAGjB,MAAI,MAAM,QAAQ,aAAa;AAC7B,SAAM,gBAAgB;AACtB,sBAAmB;;AAGrB,MAAI,MAAM,QAAQ,WAAW;AAC3B,SAAM,gBAAgB;AAEtB,YADiB,UAAU,OAAO,OAAA,GAAA,eAAA,OAAY,QAAQ,MAAM,KAAK,UAAU,CACzD;;AAGpB,MAAI,MAAM,QAAQ,aAAa;AAC7B,SAAM,gBAAgB;AAEtB,YADiB,UAAU,OAAO,aAAA,GAAA,eAAA,OAAkB,QAAQ,MAAM,KAAK,UAAU,CAC/D;;;AAItB,QACE,iBAAA,GAAA,kBAAA,KAAC,SAAD;EACE,MAAK;EACL,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe,UAAU,OAAO,IAAI;EACpC,cAAY,UAAU,QAAQ,KAAA;EAC9B,WAAU;EACG;EACb,OAAO,UAAU,OAAO,KAAKA,iBAAAA,QAAQ,MAAM;EAC3C,WAAW,UAAU,aAAa,MAAM,cAAc,MAAM;EAC5D,WAAW;EACX,UAAU,UAAU;AAClB,SAAM,cAAc,QAAQ;AAC5B,aAAU,MAAM;;EAElB,UAAU,UAAU;AAClB,SAAM,iBAAiB;AACvB,SAAM,cAAc,QAAQ;;EAE9B,cAAc,UAAU,MAAM,iBAAiB;EAC/C,GAAI;EACJ,CAAA;;AAIN,UAAU,cAAc"}

package/cjs/components/TimePicker/TimePicker.cjs

@@ -1,5 +1,6 @@
 "use client";
 require("../../_virtual/_rolldown/runtime.cjs");
+const require_pad_time = require("./utils/pad-time/pad-time.cjs");
 const require_SpinInput = require("../SpinInput/SpinInput.cjs");
 const require_TimePicker_context = require("./TimePicker.context.cjs");
 const require_AmPmInput = require("./AmPmInput/AmPmInput.cjs");
@@ -17,6 +18,7 @@ let _mantine_core = require("@mantine/core");
 let _mantine_hooks = require("@mantine/hooks");
 //#region packages/@mantine/dates/src/components/TimePicker/TimePicker.tsx
 const defaultProps = {
+	type: "time",
 	hoursStep: 1,
 	minutesStep: 1,
 	secondsStep: 1,
@@ -29,12 +31,16 @@ const defaultProps = {
 	maxDropdownContentHeight: 200,
 	hoursPlaceholder: "--",
 	minutesPlaceholder: "--",
-	secondsPlaceholder: "--"
+	secondsPlaceholder: "--",
+	minHoursDigits: 2
 };
 const varsResolver = (0, _mantine_core.createVarsResolver)((_theme, { size }) => ({ dropdown: { "--control-font-size": (0, _mantine_core.getFontSize)(size) } }));
 const TimePicker = (0, _mantine_core.factory)((_props) => {
 	const props = (0, _mantine_core.useProps)("TimePicker", defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, vars, onClick, format, value, defaultValue, onChange, hoursStep, minutesStep, secondsStep, withSeconds, hoursInputLabel, minutesInputLabel, secondsInputLabel, amPmInputLabel, amPmLabels, clearable, clearSectionMode, onMouseDown, onFocusCapture, onBlurCapture, min, max, popoverProps, withDropdown, rightSection, onFocus, onBlur, clearButtonProps, hoursInputProps, minutesInputProps, secondsInputProps, amPmSelectProps, readOnly, disabled, size, name, form, hiddenInputProps, labelProps, pasteSplit, hoursRef, minutesRef, secondsRef, amPmRef, presets, maxDropdownContentHeight, scrollAreaProps, attributes, reverseTimeControlsList, hoursPlaceholder, minutesPlaceholder, secondsPlaceholder, ...others } = props;
+	const { classNames, className, style, styles, unstyled, vars, onClick, type, format: _format, value, defaultValue, onChange, hoursStep, minutesStep, secondsStep, withSeconds, hoursInputLabel, minutesInputLabel, secondsInputLabel, amPmInputLabel, amPmLabels, clearable, clearSectionMode, onMouseDown, onFocusCapture, onBlurCapture, min, max, popoverProps, withDropdown, rightSection, onFocus, onBlur, clearButtonProps, hoursInputProps, minutesInputProps, secondsInputProps, amPmSelectProps, readOnly, disabled, size, name, form, hiddenInputProps, labelProps, pasteSplit, hoursRef, minutesRef, secondsRef, amPmRef, presets, maxDropdownContentHeight, scrollAreaProps, attributes, reverseTimeControlsList, hoursPlaceholder, minutesPlaceholder, secondsPlaceholder, minHoursDigits, ...others } = props;
+	const isDuration = type === "duration";
+	const format = isDuration ? "24h" : _format;
+	const resolvedHoursPlaceholder = isDuration && hoursPlaceholder === "--" ? "-".repeat(minHoursDigits) : hoursPlaceholder;
 	const { resolvedClassNames, resolvedStyles } = (0, _mantine_core.useResolvedStylesApi)({
 		classNames,
 		styles,
@@ -65,7 +71,8 @@ const TimePicker = (0, _mantine_core.factory)((_props) => {
 		clearable,
 		disabled,
 		readOnly,
-		pasteSplit
+		pasteSplit,
+		type
 	});
 	const _hoursRef = (0, _mantine_hooks.useMergedRef)(controller.refs.hours, hoursRef);
 	const _minutesRef = (0, _mantine_hooks.useMergedRef)(controller.refs.minutes, minutesRef);
@@ -108,7 +115,7 @@ const TimePicker = (0, _mantine_core.factory)((_props) => {
 			transitionProps: { duration: 0 },
 			position: "bottom-start",
 			withRoles: false,
-			disabled: disabled || readOnly || !withDropdown,
+			disabled: disabled || readOnly || !withDropdown || isDuration,
 			...popoverProps,
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Popover.Target, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mantine_core.InputBase, {
 				component: "div",
@@ -168,14 +175,18 @@ const TimePicker = (0, _mantine_core.factory)((_props) => {
 								...hoursInputProps,
 								...getStyles("field", {
 									className: hoursInputProps?.className,
-									style: hoursInputProps?.style
+									style: isDuration ? {
+										width: `calc(${Math.max(minHoursDigits, require_pad_time.padTime(controller.values.hours ?? 0).length)}ch + 0.3em)`,
+										...hoursInputProps?.style
+									} : hoursInputProps?.style
 								}),
 								value: controller.values.hours,
 								onChange: controller.setHours,
 								onNextInput: () => controller.focus("minutes"),
 								min: format === "12h" ? 1 : 0,
-								max: format === "12h" ? 12 : 23,
+								max: isDuration ? 9999 : format === "12h" ? 12 : 23,
 								allowTemporaryZero: format === "12h",
+								disableAutoAdvance: isDuration,
 								focusable: true,
 								step: hoursStep,
 								ref: _hoursRef,
@@ -192,7 +203,7 @@ const TimePicker = (0, _mantine_core.factory)((_props) => {
 									if (format === "12h" && (actualInputValue ? parseInt(actualInputValue, 10) : null) === 0) controller.setHours(12);
 									hoursInputProps?.onBlur?.(event);
 								},
-								placeholder: hoursPlaceholder
+								placeholder: resolvedHoursPlaceholder
 							}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: ":" }),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SpinInput.SpinInput, {
@@ -247,7 +258,7 @@ const TimePicker = (0, _mantine_core.factory)((_props) => {
 								},
 								placeholder: secondsPlaceholder
 							})] }),
-							format === "12h" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AmPmInput.AmPmInput, {
+							format === "12h" && !isDuration && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AmPmInput.AmPmInput, {
 								...amPmSelectProps,
 								inputType: withDropdown ? "input" : "select",
 								labels: amPmLabels,

package/cjs/components/TimePicker/TimePicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.cjs","names":["getParsedTime","useTimePicker","getTimeString","clampTime","TimePickerProvider","Popover","InputBase","CloseButton","SpinInput","AmPmInput","TimePresets","TimeControlsList","AmPmControlsList","classes"],"sources":["../../../src/components/TimePicker/TimePicker.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  BoxProps,\n  ClearSectionMode,\n  CloseButton,\n  CloseButtonProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  InputBase,\n  InputVariant,\n  Popover,\n  PopoverProps,\n  ScrollAreaProps,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { useId, useMergedRef } from '@mantine/hooks';\nimport { SpinInput } from '../SpinInput';\nimport { AmPmInput } from './AmPmInput/AmPmInput';\nimport { AmPmControlsList } from './TimeControlsList/AmPmControlsList';\nimport { TimeControlsList } from './TimeControlsList/TimeControlsList';\nimport { TimePickerProvider } from './TimePicker.context';\nimport {\n  TimePickerAmPmLabels,\n  TimePickerFormat,\n  TimePickerPasteSplit,\n  TimePickerPresets,\n} from './TimePicker.types';\nimport { TimePresets } from './TimePresets/TimePresets';\nimport { useTimePicker } from './use-time-picker';\nimport { clampTime } from './utils/clamp-time/clamp-time';\nimport { getParsedTime } from './utils/get-parsed-time/get-parsed-time';\nimport { getTimeString } from './utils/get-time-string/get-time-string';\nimport classes from './TimePicker.module.css';\n\nexport type TimePickerStylesNames =\n  | 'fieldsRoot'\n  | 'fieldsGroup'\n  | 'field'\n  | 'controlsList'\n  | 'controlsListGroup'\n  | 'control'\n  | 'dropdown'\n  | 'presetsRoot'\n  | 'presetsGroup'\n  | 'presetsGroupLabel'\n  | 'presetControl'\n  | 'scrollarea'\n  | __InputStylesNames;\n\nexport type TimePickerCssVariables = {\n  dropdown: '--control-font-size';\n};\n\nexport interface TimePickerProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    StylesApiProps<TimePickerFactory>,\n    ElementProps<'div', 'onChange' | 'defaultValue'> {\n  /** Controlled component value */\n  value?: string;\n\n  /** Uncontrolled component default value */\n  defaultValue?: string;\n\n  /** Called when the value changes */\n  onChange?: (value: string) => void;\n\n  /** Determines whether the clear button should be displayed @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** `name` prop passed down to the hidden input */\n  name?: string;\n\n  /** `form` prop passed down to the hidden input */\n  form?: string;\n\n  /** Min possible time value in `hh:mm:ss` format */\n  min?: string;\n\n  /** Max possible time value in `hh:mm:ss` format */\n  max?: string;\n\n  /** Time format, `'24h'` by default */\n  format?: TimePickerFormat;\n\n  /** Number by which hours are incremented/decremented @default 1 */\n  hoursStep?: number;\n\n  /** Number by which minutes are incremented/decremented @default 1 */\n  minutesStep?: number;\n\n  /** Number by which seconds are incremented/decremented @default 1 */\n  secondsStep?: number;\n\n  /** Determines whether the seconds input should be displayed @default false */\n  withSeconds?: boolean;\n\n  /** `aria-label` of hours input */\n  hoursInputLabel?: string;\n\n  /** `aria-label` of minutes input */\n  minutesInputLabel?: string;\n\n  /** `aria-label` of seconds input */\n  secondsInputLabel?: string;\n\n  /** `aria-label` of am/pm input */\n  amPmInputLabel?: string;\n\n  /** Labels used for am/pm values @default { am: 'AM', pm: 'PM' } */\n  amPmLabels?: TimePickerAmPmLabels;\n\n  /** Determines whether the dropdown with time controls list should be visible when the input has focus @default false */\n  withDropdown?: boolean;\n\n  /** Props passed down to `Popover` component */\n  popoverProps?: PopoverProps;\n\n  /** Called once when one of the inputs is focused, not called when focused is shifted between hours, minutes, seconds and am/pm inputs */\n  onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;\n\n  /** Called once when the focus is no longer on any of the inputs */\n  onBlur?: (event: React.FocusEvent<HTMLDivElement>) => void;\n\n  /** Props passed down to clear button */\n  clearButtonProps?: CloseButtonProps & ElementProps<'button'> & DataAttributes;\n\n  /** Props passed down to hours input */\n  hoursInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Props passed down to minutes input */\n  minutesInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Props passed down to seconds input */\n  secondsInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Props passed down to am/pm select */\n  amPmSelectProps?: React.ComponentProps<'select'> & DataAttributes;\n\n  /** If set, the value cannot be updated */\n  readOnly?: boolean;\n\n  /** If set, the component becomes disabled */\n  disabled?: boolean;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** A function to transform paste values, by default time in 24h format can be parsed on paste for example `23:34:22` */\n  pasteSplit?: TimePickerPasteSplit;\n\n  /** A ref object to get node reference of the hours input */\n  hoursRef?: React.Ref<HTMLInputElement>;\n\n  /** A ref object to get node reference of the minutes input */\n  minutesRef?: React.Ref<HTMLInputElement>;\n\n  /** A ref object to get node reference of the seconds input */\n  secondsRef?: React.Ref<HTMLInputElement>;\n\n  /** A ref object to get node reference of the am/pm select */\n  amPmRef?: React.Ref<HTMLSelectElement>;\n\n  /** Time presets to display in the dropdown */\n  presets?: TimePickerPresets;\n\n  /** Maximum height of the content displayed in the dropdown in px @default 200 */\n  maxDropdownContentHeight?: number;\n\n  /** Props passed down to all underlying `ScrollArea` components */\n  scrollAreaProps?: ScrollAreaProps;\n\n  /** If set, the time controls list are reversed, @default false */\n  reverseTimeControlsList?: boolean;\n\n  /** Hours input placeholder, @default -- */\n  hoursPlaceholder?: string;\n\n  /** Minutes input placeholder, @default -- */\n  minutesPlaceholder?: string;\n\n  /** Seconds input placeholder, @default -- */\n  secondsPlaceholder?: string;\n}\n\nexport type TimePickerFactory = Factory<{\n  props: TimePickerProps;\n  ref: HTMLDivElement;\n  stylesNames: TimePickerStylesNames;\n  vars: TimePickerCssVariables;\n  variant: InputVariant;\n}>;\n\nconst defaultProps = {\n  hoursStep: 1,\n  minutesStep: 1,\n  secondsStep: 1,\n  format: '24h',\n  amPmLabels: { am: 'AM', pm: 'PM' },\n  pasteSplit: getParsedTime,\n  maxDropdownContentHeight: 200,\n  hoursPlaceholder: '--',\n  minutesPlaceholder: '--',\n  secondsPlaceholder: '--',\n} satisfies Partial<TimePickerProps>;\n\nconst varsResolver = createVarsResolver<TimePickerFactory>((_theme, { size }) => ({\n  dropdown: {\n    '--control-font-size': getFontSize(size),\n  },\n}));\n\nexport const TimePicker = factory<TimePickerFactory>((_props) => {\n  const props = useProps('TimePicker', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    onClick,\n    format,\n    value,\n    defaultValue,\n    onChange,\n    hoursStep,\n    minutesStep,\n    secondsStep,\n    withSeconds,\n    hoursInputLabel,\n    minutesInputLabel,\n    secondsInputLabel,\n    amPmInputLabel,\n    amPmLabels,\n    clearable,\n    clearSectionMode,\n    onMouseDown,\n    onFocusCapture,\n    onBlurCapture,\n    min,\n    max,\n    popoverProps,\n    withDropdown,\n    rightSection,\n    onFocus,\n    onBlur,\n    clearButtonProps,\n    hoursInputProps,\n    minutesInputProps,\n    secondsInputProps,\n    amPmSelectProps,\n    readOnly,\n    disabled,\n    size,\n    name,\n    form,\n    hiddenInputProps,\n    labelProps,\n    pasteSplit,\n    hoursRef,\n    minutesRef,\n    secondsRef,\n    amPmRef,\n    presets,\n    maxDropdownContentHeight,\n    scrollAreaProps,\n    attributes,\n    reverseTimeControlsList,\n    hoursPlaceholder,\n    minutesPlaceholder,\n    secondsPlaceholder,\n    ...others\n  } = props;\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<TimePickerFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const getStyles = useStyles<TimePickerFactory>({\n    name: 'TimePicker',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const controller = useTimePicker({\n    value,\n    defaultValue,\n    onChange,\n    format,\n    amPmLabels,\n    withSeconds,\n    min,\n    max,\n    clearable,\n    disabled,\n    readOnly,\n    pasteSplit,\n  });\n\n  const _hoursRef = useMergedRef(controller.refs.hours, hoursRef);\n  const _minutesRef = useMergedRef(controller.refs.minutes, minutesRef);\n  const _secondsRef = useMergedRef(controller.refs.seconds, secondsRef);\n  const _amPmRef = useMergedRef(controller.refs.amPm, amPmRef);\n\n  const hoursInputId = useId();\n  const hasFocusRef = useRef(false);\n  const [dropdownOpened, setDropdownOpened] = useState(false);\n\n  const handleFocus = (event: React.FocusEvent<any>) => {\n    if (!hasFocusRef.current) {\n      hasFocusRef.current = true;\n      onFocus?.(event);\n    }\n  };\n\n  const handleBlur = (event: React.FocusEvent<HTMLDivElement>) => {\n    if (!event.currentTarget.contains(event.relatedTarget)) {\n      const computedValue = controller.values;\n      const timeString = getTimeString({\n        ...computedValue,\n        format,\n        amPmLabels,\n        withSeconds: !!withSeconds,\n      });\n\n      if (timeString.valid && (min || max)) {\n        const clamped = clampTime(timeString.value, min, max);\n\n        if (clamped.timeString !== timeString.value) {\n          controller.setTimeString(clamped.timeString);\n        }\n      }\n      hasFocusRef.current = false;\n      onBlur?.(event);\n    }\n  };\n\n  return (\n    <TimePickerProvider value={{ getStyles, scrollAreaProps, maxDropdownContentHeight }}>\n      <Popover\n        opened={dropdownOpened}\n        transitionProps={{ duration: 0 }}\n        position=\"bottom-start\"\n        withRoles={false}\n        disabled={disabled || readOnly || !withDropdown}\n        {...popoverProps}\n      >\n        <Popover.Target>\n          <InputBase\n            component=\"div\"\n            size={size}\n            disabled={disabled}\n            onClick={(event) => {\n              onClick?.(event);\n              controller.focus('hours');\n            }}\n            onMouseDown={(event) => {\n              event.preventDefault();\n              onMouseDown?.(event);\n            }}\n            onFocusCapture={(event) => {\n              setDropdownOpened(true);\n              onFocusCapture?.(event);\n            }}\n            onBlurCapture={(event) => {\n              setDropdownOpened(false);\n              onBlurCapture?.(event);\n            }}\n            rightSection={rightSection}\n            __clearSection={\n              <CloseButton\n                {...clearButtonProps}\n                size={size}\n                onClick={(event) => {\n                  controller.clear();\n                  clearButtonProps?.onClick?.(event);\n                }}\n                onMouseDown={(event) => {\n                  event.preventDefault();\n                  clearButtonProps?.onMouseDown?.(event);\n                }}\n              />\n            }\n            __clearable={controller.isClearable}\n            __clearSectionMode={clearSectionMode}\n            labelProps={{ htmlFor: hoursInputId, ...labelProps }}\n            style={style}\n            className={className}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            attributes={attributes}\n            __staticSelector=\"TimePicker\"\n            {...others}\n          >\n            <div {...getStyles('fieldsRoot')} dir=\"ltr\">\n              <div {...getStyles('fieldsGroup')} onBlur={handleBlur}>\n                <SpinInput\n                  id={hoursInputId}\n                  {...hoursInputProps}\n                  {...getStyles('field', {\n                    className: hoursInputProps?.className,\n                    style: hoursInputProps?.style,\n                  })}\n                  value={controller.values.hours}\n                  onChange={controller.setHours}\n                  onNextInput={() => controller.focus('minutes')}\n                  min={format === '12h' ? 1 : 0}\n                  max={format === '12h' ? 12 : 23}\n                  allowTemporaryZero={format === '12h'}\n                  focusable\n                  step={hoursStep}\n                  ref={_hoursRef}\n                  aria-label={hoursInputLabel}\n                  readOnly={readOnly}\n                  disabled={disabled}\n                  onPaste={controller.onPaste}\n                  onFocus={(event) => {\n                    handleFocus(event);\n                    hoursInputProps?.onFocus?.(event);\n                  }}\n                  onBlur={(event) => {\n                    const actualInputValue = event.currentTarget.value;\n                    const numericValue = actualInputValue ? parseInt(actualInputValue, 10) : null;\n\n                    if (format === '12h' && numericValue === 0) {\n                      controller.setHours(12);\n                    }\n                    hoursInputProps?.onBlur?.(event);\n                  }}\n                  placeholder={hoursPlaceholder}\n                />\n                <span>:</span>\n                <SpinInput\n                  {...minutesInputProps}\n                  {...getStyles('field', {\n                    className: minutesInputProps?.className,\n                    style: minutesInputProps?.style,\n                  })}\n                  value={controller.values.minutes}\n                  onChange={controller.setMinutes}\n                  min={0}\n                  max={59}\n                  focusable\n                  step={minutesStep}\n                  ref={_minutesRef}\n                  onPreviousInput={() => controller.focus('hours')}\n                  onNextInput={() =>\n                    withSeconds ? controller.focus('seconds') : controller.focus('amPm')\n                  }\n                  aria-label={minutesInputLabel}\n                  tabIndex={-1}\n                  readOnly={readOnly}\n                  disabled={disabled}\n                  onPaste={controller.onPaste}\n                  onFocus={(event) => {\n                    handleFocus(event);\n                    minutesInputProps?.onFocus?.(event);\n                  }}\n                  placeholder={minutesPlaceholder}\n                />\n\n                {withSeconds && (\n                  <>\n                    <span>:</span>\n                    <SpinInput\n                      {...secondsInputProps}\n                      {...getStyles('field', {\n                        className: secondsInputProps?.className,\n                        style: secondsInputProps?.style,\n                      })}\n                      value={controller.values.seconds}\n                      onChange={controller.setSeconds}\n                      min={0}\n                      max={59}\n                      focusable\n                      step={secondsStep}\n                      ref={_secondsRef}\n                      onPreviousInput={() => controller.focus('minutes')}\n                      onNextInput={() => controller.focus('amPm')}\n                      aria-label={secondsInputLabel}\n                      tabIndex={-1}\n                      readOnly={readOnly}\n                      disabled={disabled}\n                      onPaste={controller.onPaste}\n                      onFocus={(event) => {\n                        handleFocus(event);\n                        secondsInputProps?.onFocus?.(event);\n                      }}\n                      placeholder={secondsPlaceholder}\n                    />\n                  </>\n                )}\n\n                {format === '12h' && (\n                  <AmPmInput\n                    {...amPmSelectProps}\n                    inputType={withDropdown ? 'input' : 'select'}\n                    labels={amPmLabels}\n                    value={controller.values.amPm}\n                    onChange={controller.setAmPm}\n                    ref={_amPmRef}\n                    aria-label={amPmInputLabel}\n                    onPreviousInput={() =>\n                      withSeconds ? controller.focus('seconds') : controller.focus('minutes')\n                    }\n                    readOnly={readOnly}\n                    disabled={disabled}\n                    tabIndex={-1}\n                    onPaste={controller.onPaste}\n                    onFocus={(event) => {\n                      handleFocus(event);\n                      amPmSelectProps?.onFocus?.(event);\n                    }}\n                  />\n                )}\n              </div>\n            </div>\n\n            <input\n              type=\"hidden\"\n              name={name}\n              form={form}\n              value={controller.hiddenInputValue}\n              {...hiddenInputProps}\n            />\n          </InputBase>\n        </Popover.Target>\n        <Popover.Dropdown\n          {...getStyles('dropdown')}\n          onMouseDown={(event) => event.preventDefault()}\n        >\n          {presets ? (\n            <TimePresets\n              value={controller.hiddenInputValue}\n              onChange={controller.setTimeString}\n              format={format}\n              presets={presets}\n              amPmLabels={amPmLabels}\n              withSeconds={withSeconds || false}\n            />\n          ) : (\n            <div {...getStyles('controlsListGroup')}>\n              <TimeControlsList\n                min={format === '12h' ? 1 : 0}\n                max={format === '12h' ? 12 : 23}\n                step={hoursStep}\n                value={controller.values.hours}\n                onSelect={controller.setHours}\n                reversed={reverseTimeControlsList}\n              />\n              <TimeControlsList\n                min={0}\n                max={59}\n                step={minutesStep}\n                value={controller.values.minutes}\n                onSelect={controller.setMinutes}\n                reversed={reverseTimeControlsList}\n              />\n              {withSeconds && (\n                <TimeControlsList\n                  min={0}\n                  max={59}\n                  step={secondsStep}\n                  value={controller.values.seconds}\n                  onSelect={controller.setSeconds}\n                  reversed={reverseTimeControlsList}\n                />\n              )}\n              {format === '12h' && (\n                <AmPmControlsList\n                  labels={amPmLabels}\n                  value={controller.values.amPm}\n                  onSelect={controller.setAmPm}\n                />\n              )}\n            </div>\n          )}\n        </Popover.Dropdown>\n      </Popover>\n    </TimePickerProvider>\n  );\n});\n\nTimePicker.displayName = '@mantine/dates/TimePicker';\nTimePicker.classes = classes;\nTimePicker.varsResolver = varsResolver;\n\nexport namespace TimePicker {\n  export type Props = TimePickerProps;\n  export type StylesNames = TimePickerStylesNames;\n  export type Factory = TimePickerFactory;\n  export type CssVariables = TimePickerCssVariables;\n  export type Format = TimePickerFormat;\n  export type AmPmLabels = TimePickerAmPmLabels;\n  export type PasteSplit = TimePickerPasteSplit;\n  export type Presets = TimePickerPresets;\n}\n"],"mappings":"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"}
+{"version":3,"file":"TimePicker.cjs","names":["getParsedTime","useTimePicker","getTimeString","clampTime","TimePickerProvider","Popover","InputBase","CloseButton","SpinInput","padTime","AmPmInput","TimePresets","TimeControlsList","AmPmControlsList","classes"],"sources":["../../../src/components/TimePicker/TimePicker.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport {\n  __BaseInputProps,\n  __InputStylesNames,\n  BoxProps,\n  ClearSectionMode,\n  CloseButton,\n  CloseButtonProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  getFontSize,\n  InputBase,\n  InputVariant,\n  Popover,\n  PopoverProps,\n  ScrollAreaProps,\n  StylesApiProps,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { useId, useMergedRef } from '@mantine/hooks';\nimport { SpinInput } from '../SpinInput';\nimport { AmPmInput } from './AmPmInput/AmPmInput';\nimport { AmPmControlsList } from './TimeControlsList/AmPmControlsList';\nimport { TimeControlsList } from './TimeControlsList/TimeControlsList';\nimport { TimePickerProvider } from './TimePicker.context';\nimport {\n  TimePickerAmPmLabels,\n  TimePickerFormat,\n  TimePickerPasteSplit,\n  TimePickerPresets,\n  TimePickerType,\n} from './TimePicker.types';\nimport { TimePresets } from './TimePresets/TimePresets';\nimport { useTimePicker } from './use-time-picker';\nimport { clampTime } from './utils/clamp-time/clamp-time';\nimport { getParsedTime } from './utils/get-parsed-time/get-parsed-time';\nimport { getTimeString } from './utils/get-time-string/get-time-string';\nimport { padTime } from './utils/pad-time/pad-time';\nimport classes from './TimePicker.module.css';\n\nexport type TimePickerStylesNames =\n  | 'fieldsRoot'\n  | 'fieldsGroup'\n  | 'field'\n  | 'controlsList'\n  | 'controlsListGroup'\n  | 'control'\n  | 'dropdown'\n  | 'presetsRoot'\n  | 'presetsGroup'\n  | 'presetsGroupLabel'\n  | 'presetControl'\n  | 'scrollarea'\n  | __InputStylesNames;\n\nexport type TimePickerCssVariables = {\n  dropdown: '--control-font-size';\n};\n\nexport interface TimePickerProps\n  extends\n    BoxProps,\n    __BaseInputProps,\n    StylesApiProps<TimePickerFactory>,\n    ElementProps<'div', 'onChange' | 'defaultValue'> {\n  /** TimePicker type, `'time'` for regular time input, `'duration'` for duration input that allows values greater than 24 hours @default 'time' */\n  type?: TimePickerType;\n\n  /** Controlled component value */\n  value?: string;\n\n  /** Uncontrolled component default value */\n  defaultValue?: string;\n\n  /** Called when the value changes */\n  onChange?: (value: string) => void;\n\n  /** Determines whether the clear button should be displayed @default false */\n  clearable?: boolean;\n\n  /** Determines how the clear button and rightSection are rendered @default 'both' */\n  clearSectionMode?: ClearSectionMode;\n\n  /** `name` prop passed down to the hidden input */\n  name?: string;\n\n  /** `form` prop passed down to the hidden input */\n  form?: string;\n\n  /** Min possible time value in `hh:mm:ss` format */\n  min?: string;\n\n  /** Max possible time value in `hh:mm:ss` format */\n  max?: string;\n\n  /** Time format, `'24h'` by default */\n  format?: TimePickerFormat;\n\n  /** Number by which hours are incremented/decremented @default 1 */\n  hoursStep?: number;\n\n  /** Number by which minutes are incremented/decremented @default 1 */\n  minutesStep?: number;\n\n  /** Number by which seconds are incremented/decremented @default 1 */\n  secondsStep?: number;\n\n  /** Determines whether the seconds input should be displayed @default false */\n  withSeconds?: boolean;\n\n  /** `aria-label` of hours input */\n  hoursInputLabel?: string;\n\n  /** `aria-label` of minutes input */\n  minutesInputLabel?: string;\n\n  /** `aria-label` of seconds input */\n  secondsInputLabel?: string;\n\n  /** `aria-label` of am/pm input */\n  amPmInputLabel?: string;\n\n  /** Labels used for am/pm values @default { am: 'AM', pm: 'PM' } */\n  amPmLabels?: TimePickerAmPmLabels;\n\n  /** Determines whether the dropdown with time controls list should be visible when the input has focus @default false */\n  withDropdown?: boolean;\n\n  /** Props passed down to `Popover` component */\n  popoverProps?: PopoverProps;\n\n  /** Called once when one of the inputs is focused, not called when focused is shifted between hours, minutes, seconds and am/pm inputs */\n  onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;\n\n  /** Called once when the focus is no longer on any of the inputs */\n  onBlur?: (event: React.FocusEvent<HTMLDivElement>) => void;\n\n  /** Props passed down to clear button */\n  clearButtonProps?: CloseButtonProps & ElementProps<'button'> & DataAttributes;\n\n  /** Props passed down to hours input */\n  hoursInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Props passed down to minutes input */\n  minutesInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Props passed down to seconds input */\n  secondsInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** Props passed down to am/pm select */\n  amPmSelectProps?: React.ComponentProps<'select'> & DataAttributes;\n\n  /** If set, the value cannot be updated */\n  readOnly?: boolean;\n\n  /** If set, the component becomes disabled */\n  disabled?: boolean;\n\n  /** Props passed down to the hidden input */\n  hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;\n\n  /** A function to transform paste values, by default time in 24h format can be parsed on paste for example `23:34:22` */\n  pasteSplit?: TimePickerPasteSplit;\n\n  /** A ref object to get node reference of the hours input */\n  hoursRef?: React.Ref<HTMLInputElement>;\n\n  /** A ref object to get node reference of the minutes input */\n  minutesRef?: React.Ref<HTMLInputElement>;\n\n  /** A ref object to get node reference of the seconds input */\n  secondsRef?: React.Ref<HTMLInputElement>;\n\n  /** A ref object to get node reference of the am/pm select */\n  amPmRef?: React.Ref<HTMLSelectElement>;\n\n  /** Time presets to display in the dropdown */\n  presets?: TimePickerPresets;\n\n  /** Maximum height of the content displayed in the dropdown in px @default 200 */\n  maxDropdownContentHeight?: number;\n\n  /** Props passed down to all underlying `ScrollArea` components */\n  scrollAreaProps?: ScrollAreaProps;\n\n  /** If set, the time controls list are reversed, @default false */\n  reverseTimeControlsList?: boolean;\n\n  /** Hours input placeholder, @default -- */\n  hoursPlaceholder?: string;\n\n  /** Minutes input placeholder, @default -- */\n  minutesPlaceholder?: string;\n\n  /** Seconds input placeholder, @default -- */\n  secondsPlaceholder?: string;\n\n  /** Minimum number of digits displayed in the hours input, applicable only when `type=\"duration\"` is set @default 2 */\n  minHoursDigits?: number;\n}\n\nexport type TimePickerFactory = Factory<{\n  props: TimePickerProps;\n  ref: HTMLDivElement;\n  stylesNames: TimePickerStylesNames;\n  vars: TimePickerCssVariables;\n  variant: InputVariant;\n}>;\n\nconst defaultProps = {\n  type: 'time',\n  hoursStep: 1,\n  minutesStep: 1,\n  secondsStep: 1,\n  format: '24h',\n  amPmLabels: { am: 'AM', pm: 'PM' },\n  pasteSplit: getParsedTime,\n  maxDropdownContentHeight: 200,\n  hoursPlaceholder: '--',\n  minutesPlaceholder: '--',\n  secondsPlaceholder: '--',\n  minHoursDigits: 2,\n} satisfies Partial<TimePickerProps>;\n\nconst varsResolver = createVarsResolver<TimePickerFactory>((_theme, { size }) => ({\n  dropdown: {\n    '--control-font-size': getFontSize(size),\n  },\n}));\n\nexport const TimePicker = factory<TimePickerFactory>((_props) => {\n  const props = useProps('TimePicker', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    onClick,\n    type,\n    format: _format,\n    value,\n    defaultValue,\n    onChange,\n    hoursStep,\n    minutesStep,\n    secondsStep,\n    withSeconds,\n    hoursInputLabel,\n    minutesInputLabel,\n    secondsInputLabel,\n    amPmInputLabel,\n    amPmLabels,\n    clearable,\n    clearSectionMode,\n    onMouseDown,\n    onFocusCapture,\n    onBlurCapture,\n    min,\n    max,\n    popoverProps,\n    withDropdown,\n    rightSection,\n    onFocus,\n    onBlur,\n    clearButtonProps,\n    hoursInputProps,\n    minutesInputProps,\n    secondsInputProps,\n    amPmSelectProps,\n    readOnly,\n    disabled,\n    size,\n    name,\n    form,\n    hiddenInputProps,\n    labelProps,\n    pasteSplit,\n    hoursRef,\n    minutesRef,\n    secondsRef,\n    amPmRef,\n    presets,\n    maxDropdownContentHeight,\n    scrollAreaProps,\n    attributes,\n    reverseTimeControlsList,\n    hoursPlaceholder,\n    minutesPlaceholder,\n    secondsPlaceholder,\n    minHoursDigits,\n    ...others\n  } = props;\n\n  const isDuration = type === 'duration';\n  const format = isDuration ? '24h' : _format!;\n  const resolvedHoursPlaceholder =\n    isDuration && hoursPlaceholder === '--' ? '-'.repeat(minHoursDigits!) : hoursPlaceholder;\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<TimePickerFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const getStyles = useStyles<TimePickerFactory>({\n    name: 'TimePicker',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const controller = useTimePicker({\n    value,\n    defaultValue,\n    onChange,\n    format,\n    amPmLabels,\n    withSeconds,\n    min,\n    max,\n    clearable,\n    disabled,\n    readOnly,\n    pasteSplit,\n    type: type!,\n  });\n\n  const _hoursRef = useMergedRef(controller.refs.hours, hoursRef);\n  const _minutesRef = useMergedRef(controller.refs.minutes, minutesRef);\n  const _secondsRef = useMergedRef(controller.refs.seconds, secondsRef);\n  const _amPmRef = useMergedRef(controller.refs.amPm, amPmRef);\n\n  const hoursInputId = useId();\n  const hasFocusRef = useRef(false);\n  const [dropdownOpened, setDropdownOpened] = useState(false);\n\n  const handleFocus = (event: React.FocusEvent<any>) => {\n    if (!hasFocusRef.current) {\n      hasFocusRef.current = true;\n      onFocus?.(event);\n    }\n  };\n\n  const handleBlur = (event: React.FocusEvent<HTMLDivElement>) => {\n    if (!event.currentTarget.contains(event.relatedTarget)) {\n      const computedValue = controller.values;\n      const timeString = getTimeString({\n        ...computedValue,\n        format,\n        amPmLabels,\n        withSeconds: !!withSeconds,\n      });\n\n      if (timeString.valid && (min || max)) {\n        const clamped = clampTime(timeString.value, min, max);\n\n        if (clamped.timeString !== timeString.value) {\n          controller.setTimeString(clamped.timeString);\n        }\n      }\n      hasFocusRef.current = false;\n      onBlur?.(event);\n    }\n  };\n\n  return (\n    <TimePickerProvider value={{ getStyles, scrollAreaProps, maxDropdownContentHeight }}>\n      <Popover\n        opened={dropdownOpened}\n        transitionProps={{ duration: 0 }}\n        position=\"bottom-start\"\n        withRoles={false}\n        disabled={disabled || readOnly || !withDropdown || isDuration}\n        {...popoverProps}\n      >\n        <Popover.Target>\n          <InputBase\n            component=\"div\"\n            size={size}\n            disabled={disabled}\n            onClick={(event) => {\n              onClick?.(event);\n              controller.focus('hours');\n            }}\n            onMouseDown={(event) => {\n              event.preventDefault();\n              onMouseDown?.(event);\n            }}\n            onFocusCapture={(event) => {\n              setDropdownOpened(true);\n              onFocusCapture?.(event);\n            }}\n            onBlurCapture={(event) => {\n              setDropdownOpened(false);\n              onBlurCapture?.(event);\n            }}\n            rightSection={rightSection}\n            __clearSection={\n              <CloseButton\n                {...clearButtonProps}\n                size={size}\n                onClick={(event) => {\n                  controller.clear();\n                  clearButtonProps?.onClick?.(event);\n                }}\n                onMouseDown={(event) => {\n                  event.preventDefault();\n                  clearButtonProps?.onMouseDown?.(event);\n                }}\n              />\n            }\n            __clearable={controller.isClearable}\n            __clearSectionMode={clearSectionMode}\n            labelProps={{ htmlFor: hoursInputId, ...labelProps }}\n            style={style}\n            className={className}\n            classNames={resolvedClassNames}\n            styles={resolvedStyles}\n            attributes={attributes}\n            __staticSelector=\"TimePicker\"\n            {...others}\n          >\n            <div {...getStyles('fieldsRoot')} dir=\"ltr\">\n              <div {...getStyles('fieldsGroup')} onBlur={handleBlur}>\n                <SpinInput\n                  id={hoursInputId}\n                  {...hoursInputProps}\n                  {...getStyles('field', {\n                    className: hoursInputProps?.className,\n                    style: isDuration\n                      ? {\n                          width: `calc(${Math.max(minHoursDigits!, padTime(controller.values.hours ?? 0).length)}ch + 0.3em)`,\n                          ...hoursInputProps?.style,\n                        }\n                      : hoursInputProps?.style,\n                  })}\n                  value={controller.values.hours}\n                  onChange={controller.setHours}\n                  onNextInput={() => controller.focus('minutes')}\n                  min={format === '12h' ? 1 : 0}\n                  max={isDuration ? 9999 : format === '12h' ? 12 : 23}\n                  allowTemporaryZero={format === '12h'}\n                  disableAutoAdvance={isDuration}\n                  focusable\n                  step={hoursStep}\n                  ref={_hoursRef}\n                  aria-label={hoursInputLabel}\n                  readOnly={readOnly}\n                  disabled={disabled}\n                  onPaste={controller.onPaste}\n                  onFocus={(event) => {\n                    handleFocus(event);\n                    hoursInputProps?.onFocus?.(event);\n                  }}\n                  onBlur={(event) => {\n                    const actualInputValue = event.currentTarget.value;\n                    const numericValue = actualInputValue ? parseInt(actualInputValue, 10) : null;\n\n                    if (format === '12h' && numericValue === 0) {\n                      controller.setHours(12);\n                    }\n                    hoursInputProps?.onBlur?.(event);\n                  }}\n                  placeholder={resolvedHoursPlaceholder}\n                />\n                <span>:</span>\n                <SpinInput\n                  {...minutesInputProps}\n                  {...getStyles('field', {\n                    className: minutesInputProps?.className,\n                    style: minutesInputProps?.style,\n                  })}\n                  value={controller.values.minutes}\n                  onChange={controller.setMinutes}\n                  min={0}\n                  max={59}\n                  focusable\n                  step={minutesStep}\n                  ref={_minutesRef}\n                  onPreviousInput={() => controller.focus('hours')}\n                  onNextInput={() =>\n                    withSeconds ? controller.focus('seconds') : controller.focus('amPm')\n                  }\n                  aria-label={minutesInputLabel}\n                  tabIndex={-1}\n                  readOnly={readOnly}\n                  disabled={disabled}\n                  onPaste={controller.onPaste}\n                  onFocus={(event) => {\n                    handleFocus(event);\n                    minutesInputProps?.onFocus?.(event);\n                  }}\n                  placeholder={minutesPlaceholder}\n                />\n\n                {withSeconds && (\n                  <>\n                    <span>:</span>\n                    <SpinInput\n                      {...secondsInputProps}\n                      {...getStyles('field', {\n                        className: secondsInputProps?.className,\n                        style: secondsInputProps?.style,\n                      })}\n                      value={controller.values.seconds}\n                      onChange={controller.setSeconds}\n                      min={0}\n                      max={59}\n                      focusable\n                      step={secondsStep}\n                      ref={_secondsRef}\n                      onPreviousInput={() => controller.focus('minutes')}\n                      onNextInput={() => controller.focus('amPm')}\n                      aria-label={secondsInputLabel}\n                      tabIndex={-1}\n                      readOnly={readOnly}\n                      disabled={disabled}\n                      onPaste={controller.onPaste}\n                      onFocus={(event) => {\n                        handleFocus(event);\n                        secondsInputProps?.onFocus?.(event);\n                      }}\n                      placeholder={secondsPlaceholder}\n                    />\n                  </>\n                )}\n\n                {format === '12h' && !isDuration && (\n                  <AmPmInput\n                    {...amPmSelectProps}\n                    inputType={withDropdown ? 'input' : 'select'}\n                    labels={amPmLabels}\n                    value={controller.values.amPm}\n                    onChange={controller.setAmPm}\n                    ref={_amPmRef}\n                    aria-label={amPmInputLabel}\n                    onPreviousInput={() =>\n                      withSeconds ? controller.focus('seconds') : controller.focus('minutes')\n                    }\n                    readOnly={readOnly}\n                    disabled={disabled}\n                    tabIndex={-1}\n                    onPaste={controller.onPaste}\n                    onFocus={(event) => {\n                      handleFocus(event);\n                      amPmSelectProps?.onFocus?.(event);\n                    }}\n                  />\n                )}\n              </div>\n            </div>\n\n            <input\n              type=\"hidden\"\n              name={name}\n              form={form}\n              value={controller.hiddenInputValue}\n              {...hiddenInputProps}\n            />\n          </InputBase>\n        </Popover.Target>\n        <Popover.Dropdown\n          {...getStyles('dropdown')}\n          onMouseDown={(event) => event.preventDefault()}\n        >\n          {presets ? (\n            <TimePresets\n              value={controller.hiddenInputValue}\n              onChange={controller.setTimeString}\n              format={format}\n              presets={presets}\n              amPmLabels={amPmLabels}\n              withSeconds={withSeconds || false}\n            />\n          ) : (\n            <div {...getStyles('controlsListGroup')}>\n              <TimeControlsList\n                min={format === '12h' ? 1 : 0}\n                max={format === '12h' ? 12 : 23}\n                step={hoursStep}\n                value={controller.values.hours}\n                onSelect={controller.setHours}\n                reversed={reverseTimeControlsList}\n              />\n              <TimeControlsList\n                min={0}\n                max={59}\n                step={minutesStep}\n                value={controller.values.minutes}\n                onSelect={controller.setMinutes}\n                reversed={reverseTimeControlsList}\n              />\n              {withSeconds && (\n                <TimeControlsList\n                  min={0}\n                  max={59}\n                  step={secondsStep}\n                  value={controller.values.seconds}\n                  onSelect={controller.setSeconds}\n                  reversed={reverseTimeControlsList}\n                />\n              )}\n              {format === '12h' && (\n                <AmPmControlsList\n                  labels={amPmLabels}\n                  value={controller.values.amPm}\n                  onSelect={controller.setAmPm}\n                />\n              )}\n            </div>\n          )}\n        </Popover.Dropdown>\n      </Popover>\n    </TimePickerProvider>\n  );\n});\n\nTimePicker.displayName = '@mantine/dates/TimePicker';\nTimePicker.classes = classes;\nTimePicker.varsResolver = varsResolver;\n\nexport namespace TimePicker {\n  export type Props = TimePickerProps;\n  export type StylesNames = TimePickerStylesNames;\n  export type Factory = TimePickerFactory;\n  export type CssVariables = TimePickerCssVariables;\n  export type Format = TimePickerFormat;\n  export type AmPmLabels = TimePickerAmPmLabels;\n  export type PasteSplit = TimePickerPasteSplit;\n  export type Presets = TimePickerPresets;\n}\n"],"mappings":"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"}

package/cjs/components/TimePicker/use-time-picker.cjs

@@ -6,7 +6,7 @@ const require_get_time_string = require("./utils/get-time-string/get-time-string
 let react = require("react");
 let _mantine_hooks = require("@mantine/hooks");
 //#region packages/@mantine/dates/src/components/TimePicker/use-time-picker.ts
-function useTimePicker({ value, defaultValue, onChange, format, amPmLabels, withSeconds = false, min, max, clearable, readOnly, disabled, pasteSplit }) {
+function useTimePicker({ value, defaultValue, onChange, format, amPmLabels, withSeconds = false, min, max, clearable, readOnly, disabled, pasteSplit, type }) {
 	const parsedTime = require_get_parsed_time.getParsedTime({
 		time: value || defaultValue || "",
 		amPmLabels,
@@ -132,7 +132,8 @@ function useTimePicker({ value, defaultValue, onChange, format, amPmLabels, with
 		});
 		if (timeString.valid) {
 			acceptChange.current = false;
-			const clamped = require_clamp_time.clampTime(timeString.value, min || "00:00:00", max || "23:59:59");
+			const defaultMax = type === "duration" ? "9999:59:59" : "23:59:59";
+			const clamped = require_clamp_time.clampTime(timeString.value, min || "00:00:00", max || defaultMax);
 			onChange?.(clamped.timeString);
 			setHours(parsedTime.hours);
 			setMinutes(parsedTime.minutes);

package/cjs/components/TimePicker/use-time-picker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-time-picker.cjs","names":["getParsedTime","getTimeString","clampTime"],"sources":["../../../src/components/TimePicker/use-time-picker.ts"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { useDidUpdate } from '@mantine/hooks';\nimport type {\n  TimePickerAmPmLabels,\n  TimePickerFormat,\n  TimePickerPasteSplit,\n} from './TimePicker.types';\nimport { clampTime } from './utils/clamp-time/clamp-time';\nimport { getParsedTime } from './utils/get-parsed-time/get-parsed-time';\nimport { getTimeString } from './utils/get-time-string/get-time-string';\n\ninterface UseTimePickerInput {\n  value: string | undefined;\n  defaultValue: string | undefined;\n  onChange: ((value: string) => void) | undefined;\n  format: TimePickerFormat;\n  amPmLabels: TimePickerAmPmLabels;\n  withSeconds: boolean | undefined;\n  min: string | undefined;\n  max: string | undefined;\n  readOnly: boolean | undefined;\n  disabled: boolean | undefined;\n  clearable: boolean | undefined;\n  pasteSplit: TimePickerPasteSplit | undefined;\n}\n\nexport function useTimePicker({\n  value,\n  defaultValue,\n  onChange,\n  format,\n  amPmLabels,\n  withSeconds = false,\n  min,\n  max,\n  clearable,\n  readOnly,\n  disabled,\n  pasteSplit,\n}: UseTimePickerInput) {\n  const parsedTime = getParsedTime({\n    time: value || defaultValue || '',\n    amPmLabels,\n    format,\n  });\n\n  const initialTimeString = getTimeString({\n    hours: parsedTime.hours,\n    minutes: parsedTime.minutes,\n    seconds: parsedTime.seconds,\n    format,\n    withSeconds,\n    amPm: parsedTime.amPm,\n    amPmLabels,\n  });\n\n  const acceptChange = useRef(true);\n  const wasInvalidBefore = useRef(!initialTimeString.valid);\n\n  const [hours, setHours] = useState<number | null>(parsedTime.hours);\n  const [minutes, setMinutes] = useState<number | null>(parsedTime.minutes);\n  const [seconds, setSeconds] = useState<number | null>(parsedTime.seconds);\n  const [amPm, setAmPm] = useState<string | null>(parsedTime.amPm);\n\n  const isClearable =\n    clearable &&\n    !readOnly &&\n    !disabled &&\n    (hours !== null || minutes !== null || seconds !== null || amPm !== null);\n\n  const hoursRef = useRef<HTMLInputElement>(null);\n  const minutesRef = useRef<HTMLInputElement>(null);\n  const secondsRef = useRef<HTMLInputElement>(null);\n  const amPmRef = useRef<HTMLSelectElement>(null);\n\n  const focus = (field: 'hours' | 'minutes' | 'seconds' | 'amPm') => {\n    if (field === 'hours') {\n      hoursRef.current?.focus();\n    }\n\n    if (field === 'minutes') {\n      minutesRef.current?.focus();\n    }\n\n    if (field === 'seconds') {\n      secondsRef.current?.focus();\n    }\n\n    if (field === 'amPm') {\n      amPmRef.current?.focus();\n    }\n  };\n\n  const handleTimeChange = (field: 'hours' | 'minutes' | 'seconds' | 'amPm', val: any) => {\n    const computedValue = { hours, minutes, seconds, amPm, [field]: val };\n\n    const timeString = getTimeString({ ...computedValue, format, withSeconds, amPmLabels });\n\n    if (timeString.valid) {\n      acceptChange.current = false;\n      wasInvalidBefore.current = false;\n      if (field === 'hours') {\n        setHours(val);\n      }\n      if (field === 'minutes') {\n        setMinutes(val);\n      }\n      if (field === 'seconds') {\n        setSeconds(val);\n      }\n      if (field === 'amPm') {\n        setAmPm(val);\n      }\n\n      onChange?.(timeString.value);\n    } else {\n      acceptChange.current = false;\n      if (!wasInvalidBefore.current) {\n        onChange?.('');\n        wasInvalidBefore.current = true;\n      }\n    }\n  };\n\n  const setTimeString = (timeString: string) => {\n    acceptChange.current = false;\n\n    const parsedTime = getParsedTime({ time: timeString, amPmLabels, format });\n    setHours(parsedTime.hours);\n    setMinutes(parsedTime.minutes);\n    setSeconds(parsedTime.seconds);\n    setAmPm(parsedTime.amPm);\n\n    const next = getTimeString({ ...parsedTime, format, withSeconds, amPmLabels });\n    wasInvalidBefore.current = !next.valid;\n    onChange?.(timeString);\n  };\n\n  const onHoursChange = (value: number | null) => {\n    let adjustedValue = value;\n    if (format === '12h' && typeof value === 'number' && value > 12) {\n      adjustedValue = ((value - 1) % 12) + 1;\n    }\n\n    setHours(adjustedValue);\n    handleTimeChange('hours', adjustedValue);\n    focus('hours');\n  };\n\n  const onMinutesChange = (value: number | null) => {\n    setMinutes(value);\n    handleTimeChange('minutes', value);\n    focus('minutes');\n  };\n\n  const onSecondsChange = (value: number | null) => {\n    setSeconds(value);\n    handleTimeChange('seconds', value);\n    focus('seconds');\n  };\n\n  const onAmPmChange = (value: string | null) => {\n    setAmPm(value);\n    handleTimeChange('amPm', value);\n    focus('amPm');\n  };\n\n  const clear = () => {\n    acceptChange.current = false;\n    setHours(null);\n    setMinutes(null);\n    setSeconds(null);\n    setAmPm(null);\n    onChange?.('');\n    wasInvalidBefore.current = true;\n    focus('hours');\n  };\n\n  const onPaste = (event: React.ClipboardEvent<any>) => {\n    event.preventDefault();\n    const pastedValue = event.clipboardData.getData('text');\n    const parsedTime = (pasteSplit || getParsedTime)({ time: pastedValue, format, amPmLabels });\n    const timeString = getTimeString({ ...parsedTime, format, withSeconds, amPmLabels });\n    if (timeString.valid) {\n      acceptChange.current = false;\n      const clamped = clampTime(timeString.value, min || '00:00:00', max || '23:59:59');\n      onChange?.(clamped.timeString);\n      setHours(parsedTime.hours);\n      setMinutes(parsedTime.minutes);\n      setSeconds(parsedTime.seconds);\n      setAmPm(parsedTime.amPm);\n    }\n  };\n\n  const hiddenInputValue = getTimeString({\n    hours,\n    minutes,\n    seconds,\n    format,\n    withSeconds,\n    amPm,\n    amPmLabels: amPmLabels!,\n  });\n\n  useDidUpdate(() => {\n    if (value === '') {\n      acceptChange.current = false;\n      setHours(null);\n      setMinutes(null);\n      setSeconds(null);\n      setAmPm(null);\n      acceptChange.current = true;\n      return;\n    }\n\n    if (acceptChange.current && typeof value === 'string') {\n      const parsedTime = getParsedTime({ time: value || '', amPmLabels, format });\n      setHours(parsedTime.hours);\n      setMinutes(parsedTime.minutes);\n      setSeconds(parsedTime.seconds);\n      setAmPm(parsedTime.amPm);\n    }\n    acceptChange.current = true;\n  }, [value]);\n\n  return {\n    refs: { hours: hoursRef, minutes: minutesRef, seconds: secondsRef, amPm: amPmRef },\n    values: { hours, minutes, seconds, amPm },\n    setHours: onHoursChange,\n    setMinutes: onMinutesChange,\n    setSeconds: onSecondsChange,\n    setAmPm: onAmPmChange,\n    focus,\n    clear,\n    onPaste,\n    setTimeString,\n    isClearable,\n    hiddenInputValue: hiddenInputValue.value,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"use-time-picker.cjs","names":["getParsedTime","getTimeString","clampTime"],"sources":["../../../src/components/TimePicker/use-time-picker.ts"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { useDidUpdate } from '@mantine/hooks';\nimport type {\n  TimePickerAmPmLabels,\n  TimePickerFormat,\n  TimePickerPasteSplit,\n  TimePickerType,\n} from './TimePicker.types';\nimport { clampTime } from './utils/clamp-time/clamp-time';\nimport { getParsedTime } from './utils/get-parsed-time/get-parsed-time';\nimport { getTimeString } from './utils/get-time-string/get-time-string';\n\ninterface UseTimePickerInput {\n  value: string | undefined;\n  defaultValue: string | undefined;\n  onChange: ((value: string) => void) | undefined;\n  format: TimePickerFormat;\n  amPmLabels: TimePickerAmPmLabels;\n  withSeconds: boolean | undefined;\n  min: string | undefined;\n  max: string | undefined;\n  readOnly: boolean | undefined;\n  disabled: boolean | undefined;\n  clearable: boolean | undefined;\n  pasteSplit: TimePickerPasteSplit | undefined;\n  type: TimePickerType;\n}\n\nexport function useTimePicker({\n  value,\n  defaultValue,\n  onChange,\n  format,\n  amPmLabels,\n  withSeconds = false,\n  min,\n  max,\n  clearable,\n  readOnly,\n  disabled,\n  pasteSplit,\n  type,\n}: UseTimePickerInput) {\n  const parsedTime = getParsedTime({\n    time: value || defaultValue || '',\n    amPmLabels,\n    format,\n  });\n\n  const initialTimeString = getTimeString({\n    hours: parsedTime.hours,\n    minutes: parsedTime.minutes,\n    seconds: parsedTime.seconds,\n    format,\n    withSeconds,\n    amPm: parsedTime.amPm,\n    amPmLabels,\n  });\n\n  const acceptChange = useRef(true);\n  const wasInvalidBefore = useRef(!initialTimeString.valid);\n\n  const [hours, setHours] = useState<number | null>(parsedTime.hours);\n  const [minutes, setMinutes] = useState<number | null>(parsedTime.minutes);\n  const [seconds, setSeconds] = useState<number | null>(parsedTime.seconds);\n  const [amPm, setAmPm] = useState<string | null>(parsedTime.amPm);\n\n  const isClearable =\n    clearable &&\n    !readOnly &&\n    !disabled &&\n    (hours !== null || minutes !== null || seconds !== null || amPm !== null);\n\n  const hoursRef = useRef<HTMLInputElement>(null);\n  const minutesRef = useRef<HTMLInputElement>(null);\n  const secondsRef = useRef<HTMLInputElement>(null);\n  const amPmRef = useRef<HTMLSelectElement>(null);\n\n  const focus = (field: 'hours' | 'minutes' | 'seconds' | 'amPm') => {\n    if (field === 'hours') {\n      hoursRef.current?.focus();\n    }\n\n    if (field === 'minutes') {\n      minutesRef.current?.focus();\n    }\n\n    if (field === 'seconds') {\n      secondsRef.current?.focus();\n    }\n\n    if (field === 'amPm') {\n      amPmRef.current?.focus();\n    }\n  };\n\n  const handleTimeChange = (field: 'hours' | 'minutes' | 'seconds' | 'amPm', val: any) => {\n    const computedValue = { hours, minutes, seconds, amPm, [field]: val };\n\n    const timeString = getTimeString({ ...computedValue, format, withSeconds, amPmLabels });\n\n    if (timeString.valid) {\n      acceptChange.current = false;\n      wasInvalidBefore.current = false;\n      if (field === 'hours') {\n        setHours(val);\n      }\n      if (field === 'minutes') {\n        setMinutes(val);\n      }\n      if (field === 'seconds') {\n        setSeconds(val);\n      }\n      if (field === 'amPm') {\n        setAmPm(val);\n      }\n\n      onChange?.(timeString.value);\n    } else {\n      acceptChange.current = false;\n      if (!wasInvalidBefore.current) {\n        onChange?.('');\n        wasInvalidBefore.current = true;\n      }\n    }\n  };\n\n  const setTimeString = (timeString: string) => {\n    acceptChange.current = false;\n\n    const parsedTime = getParsedTime({ time: timeString, amPmLabels, format });\n    setHours(parsedTime.hours);\n    setMinutes(parsedTime.minutes);\n    setSeconds(parsedTime.seconds);\n    setAmPm(parsedTime.amPm);\n\n    const next = getTimeString({ ...parsedTime, format, withSeconds, amPmLabels });\n    wasInvalidBefore.current = !next.valid;\n    onChange?.(timeString);\n  };\n\n  const onHoursChange = (value: number | null) => {\n    let adjustedValue = value;\n    if (format === '12h' && typeof value === 'number' && value > 12) {\n      adjustedValue = ((value - 1) % 12) + 1;\n    }\n\n    setHours(adjustedValue);\n    handleTimeChange('hours', adjustedValue);\n    focus('hours');\n  };\n\n  const onMinutesChange = (value: number | null) => {\n    setMinutes(value);\n    handleTimeChange('minutes', value);\n    focus('minutes');\n  };\n\n  const onSecondsChange = (value: number | null) => {\n    setSeconds(value);\n    handleTimeChange('seconds', value);\n    focus('seconds');\n  };\n\n  const onAmPmChange = (value: string | null) => {\n    setAmPm(value);\n    handleTimeChange('amPm', value);\n    focus('amPm');\n  };\n\n  const clear = () => {\n    acceptChange.current = false;\n    setHours(null);\n    setMinutes(null);\n    setSeconds(null);\n    setAmPm(null);\n    onChange?.('');\n    wasInvalidBefore.current = true;\n    focus('hours');\n  };\n\n  const onPaste = (event: React.ClipboardEvent<any>) => {\n    event.preventDefault();\n    const pastedValue = event.clipboardData.getData('text');\n    const parsedTime = (pasteSplit || getParsedTime)({ time: pastedValue, format, amPmLabels });\n    const timeString = getTimeString({ ...parsedTime, format, withSeconds, amPmLabels });\n    if (timeString.valid) {\n      acceptChange.current = false;\n      const defaultMax = type === 'duration' ? '9999:59:59' : '23:59:59';\n      const clamped = clampTime(timeString.value, min || '00:00:00', max || defaultMax);\n      onChange?.(clamped.timeString);\n      setHours(parsedTime.hours);\n      setMinutes(parsedTime.minutes);\n      setSeconds(parsedTime.seconds);\n      setAmPm(parsedTime.amPm);\n    }\n  };\n\n  const hiddenInputValue = getTimeString({\n    hours,\n    minutes,\n    seconds,\n    format,\n    withSeconds,\n    amPm,\n    amPmLabels: amPmLabels!,\n  });\n\n  useDidUpdate(() => {\n    if (value === '') {\n      acceptChange.current = false;\n      setHours(null);\n      setMinutes(null);\n      setSeconds(null);\n      setAmPm(null);\n      acceptChange.current = true;\n      return;\n    }\n\n    if (acceptChange.current && typeof value === 'string') {\n      const parsedTime = getParsedTime({ time: value || '', amPmLabels, format });\n      setHours(parsedTime.hours);\n      setMinutes(parsedTime.minutes);\n      setSeconds(parsedTime.seconds);\n      setAmPm(parsedTime.amPm);\n    }\n    acceptChange.current = true;\n  }, [value]);\n\n  return {\n    refs: { hours: hoursRef, minutes: minutesRef, seconds: secondsRef, amPm: amPmRef },\n    values: { hours, minutes, seconds, amPm },\n    setHours: onHoursChange,\n    setMinutes: onMinutesChange,\n    setSeconds: onSecondsChange,\n    setAmPm: onAmPmChange,\n    focus,\n    clear,\n    onPaste,\n    setTimeString,\n    isClearable,\n    hiddenInputValue: hiddenInputValue.value,\n  };\n}\n"],"mappings":";;;;;;;;AA4BA,SAAgB,cAAc,EAC5B,OACA,cACA,UACA,QACA,YACA,cAAc,OACd,KACA,KACA,WACA,UACA,UACA,YACA,QACqB;CACrB,MAAM,aAAaA,wBAAAA,cAAc;EAC/B,MAAM,SAAS,gBAAgB;EAC/B;EACA;EACD,CAAC;CAEF,MAAM,oBAAoBC,wBAAAA,cAAc;EACtC,OAAO,WAAW;EAClB,SAAS,WAAW;EACpB,SAAS,WAAW;EACpB;EACA;EACA,MAAM,WAAW;EACjB;EACD,CAAC;CAEF,MAAM,gBAAA,GAAA,MAAA,QAAsB,KAAK;CACjC,MAAM,oBAAA,GAAA,MAAA,QAA0B,CAAC,kBAAkB,MAAM;CAEzD,MAAM,CAAC,OAAO,aAAA,GAAA,MAAA,UAAoC,WAAW,MAAM;CACnE,MAAM,CAAC,SAAS,eAAA,GAAA,MAAA,UAAsC,WAAW,QAAQ;CACzE,MAAM,CAAC,SAAS,eAAA,GAAA,MAAA,UAAsC,WAAW,QAAQ;CACzE,MAAM,CAAC,MAAM,YAAA,GAAA,MAAA,UAAmC,WAAW,KAAK;CAEhE,MAAM,cACJ,aACA,CAAC,YACD,CAAC,aACA,UAAU,QAAQ,YAAY,QAAQ,YAAY,QAAQ,SAAS;CAEtE,MAAM,YAAA,GAAA,MAAA,QAAoC,KAAK;CAC/C,MAAM,cAAA,GAAA,MAAA,QAAsC,KAAK;CACjD,MAAM,cAAA,GAAA,MAAA,QAAsC,KAAK;CACjD,MAAM,WAAA,GAAA,MAAA,QAAoC,KAAK;CAE/C,MAAM,SAAS,UAAoD;AACjE,MAAI,UAAU,QACZ,UAAS,SAAS,OAAO;AAG3B,MAAI,UAAU,UACZ,YAAW,SAAS,OAAO;AAG7B,MAAI,UAAU,UACZ,YAAW,SAAS,OAAO;AAG7B,MAAI,UAAU,OACZ,SAAQ,SAAS,OAAO;;CAI5B,MAAM,oBAAoB,OAAiD,QAAa;EAGtF,MAAM,aAAaA,wBAAAA,cAAc;GAFT;GAAO;GAAS;GAAS;IAAO,QAAQ;GAEX;GAAQ;GAAa;GAAY,CAAC;AAEvF,MAAI,WAAW,OAAO;AACpB,gBAAa,UAAU;AACvB,oBAAiB,UAAU;AAC3B,OAAI,UAAU,QACZ,UAAS,IAAI;AAEf,OAAI,UAAU,UACZ,YAAW,IAAI;AAEjB,OAAI,UAAU,UACZ,YAAW,IAAI;AAEjB,OAAI,UAAU,OACZ,SAAQ,IAAI;AAGd,cAAW,WAAW,MAAM;SACvB;AACL,gBAAa,UAAU;AACvB,OAAI,CAAC,iBAAiB,SAAS;AAC7B,eAAW,GAAG;AACd,qBAAiB,UAAU;;;;CAKjC,MAAM,iBAAiB,eAAuB;AAC5C,eAAa,UAAU;EAEvB,MAAM,aAAaD,wBAAAA,cAAc;GAAE,MAAM;GAAY;GAAY;GAAQ,CAAC;AAC1E,WAAS,WAAW,MAAM;AAC1B,aAAW,WAAW,QAAQ;AAC9B,aAAW,WAAW,QAAQ;AAC9B,UAAQ,WAAW,KAAK;AAGxB,mBAAiB,UAAU,CADdC,wBAAAA,cAAc;GAAE,GAAG;GAAY;GAAQ;GAAa;GAAY,CAAC,CAC7C;AACjC,aAAW,WAAW;;CAGxB,MAAM,iBAAiB,UAAyB;EAC9C,IAAI,gBAAgB;AACpB,MAAI,WAAW,SAAS,OAAO,UAAU,YAAY,QAAQ,GAC3D,kBAAkB,QAAQ,KAAK,KAAM;AAGvC,WAAS,cAAc;AACvB,mBAAiB,SAAS,cAAc;AACxC,QAAM,QAAQ;;CAGhB,MAAM,mBAAmB,UAAyB;AAChD,aAAW,MAAM;AACjB,mBAAiB,WAAW,MAAM;AAClC,QAAM,UAAU;;CAGlB,MAAM,mBAAmB,UAAyB;AAChD,aAAW,MAAM;AACjB,mBAAiB,WAAW,MAAM;AAClC,QAAM,UAAU;;CAGlB,MAAM,gBAAgB,UAAyB;AAC7C,UAAQ,MAAM;AACd,mBAAiB,QAAQ,MAAM;AAC/B,QAAM,OAAO;;CAGf,MAAM,cAAc;AAClB,eAAa,UAAU;AACvB,WAAS,KAAK;AACd,aAAW,KAAK;AAChB,aAAW,KAAK;AAChB,UAAQ,KAAK;AACb,aAAW,GAAG;AACd,mBAAiB,UAAU;AAC3B,QAAM,QAAQ;;CAGhB,MAAM,WAAW,UAAqC;AACpD,QAAM,gBAAgB;EACtB,MAAM,cAAc,MAAM,cAAc,QAAQ,OAAO;EACvD,MAAM,cAAc,cAAcD,wBAAAA,eAAe;GAAE,MAAM;GAAa;GAAQ;GAAY,CAAC;EAC3F,MAAM,aAAaC,wBAAAA,cAAc;GAAE,GAAG;GAAY;GAAQ;GAAa;GAAY,CAAC;AACpF,MAAI,WAAW,OAAO;AACpB,gBAAa,UAAU;GACvB,MAAM,aAAa,SAAS,aAAa,eAAe;GACxD,MAAM,UAAUC,mBAAAA,UAAU,WAAW,OAAO,OAAO,YAAY,OAAO,WAAW;AACjF,cAAW,QAAQ,WAAW;AAC9B,YAAS,WAAW,MAAM;AAC1B,cAAW,WAAW,QAAQ;AAC9B,cAAW,WAAW,QAAQ;AAC9B,WAAQ,WAAW,KAAK;;;CAI5B,MAAM,mBAAmBD,wBAAAA,cAAc;EACrC;EACA;EACA;EACA;EACA;EACA;EACY;EACb,CAAC;AAEF,EAAA,GAAA,eAAA,oBAAmB;AACjB,MAAI,UAAU,IAAI;AAChB,gBAAa,UAAU;AACvB,YAAS,KAAK;AACd,cAAW,KAAK;AAChB,cAAW,KAAK;AAChB,WAAQ,KAAK;AACb,gBAAa,UAAU;AACvB;;AAGF,MAAI,aAAa,WAAW,OAAO,UAAU,UAAU;GACrD,MAAM,aAAaD,wBAAAA,cAAc;IAAE,MAAM,SAAS;IAAI;IAAY;IAAQ,CAAC;AAC3E,YAAS,WAAW,MAAM;AAC1B,cAAW,WAAW,QAAQ;AAC9B,cAAW,WAAW,QAAQ;AAC9B,WAAQ,WAAW,KAAK;;AAE1B,eAAa,UAAU;IACtB,CAAC,MAAM,CAAC;AAEX,QAAO;EACL,MAAM;GAAE,OAAO;GAAU,SAAS;GAAY,SAAS;GAAY,MAAM;GAAS;EAClF,QAAQ;GAAE;GAAO;GAAS;GAAS;GAAM;EACzC,UAAU;EACV,YAAY;EACZ,YAAY;EACZ,SAAS;EACT;EACA;EACA;EACA;EACA;EACA,kBAAkB,iBAAiB;EACpC"}