@povio/ui 2.3.0-rc.4 → 2.3.0-rc.40

package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js

@@ -1,17 +1,19 @@
 import { UIStyle } from "../../../../config/uiStyle.context.js";
 import { UIConfig } from "../../../../config/uiConfig.context.js";
+import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
 import { InputClear } from "../../shared/InputClear.js";
 import { inputBase, inputSize } from "../../shared/input.cva.js";
 import { InputFrame } from "../../Skeleton/InputFrame.js";
 import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
 import { getStaticNumberDisplayValue } from "../shared/numberStatic.utils.js";
 import { NumberRangeField } from "./NumberRangeField.js";
+import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useRef, useState } from "react";
 import { useLocale } from "react-aria-components";
 import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
-import { Controller, useWatch } from "react-hook-form";
+import { Controller } from "react-hook-form";
 //#region src/components/inputs/Input/NumberRangeInput/NumberRangeInput.tsx
 var EMPTY_RANGE = {
 	min: null,
@@ -25,117 +27,359 @@ var normalizeRangeValue = (value, minValue, maxValue) => {
 	};
 };
 var NumberRangeInputBase = (props) => {
+	const $ = c(114);
 	const ui = UIConfig.useConfig();
 	const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
 	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
-	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, className, inputClassName, minInputClassName, maxInputClassName, value, minValue, maxValue, minPlaceholder = "Min", maxPlaceholder = "Max", minLabel = "Minimum", maxLabel = "Maximum", invalidRangeError = "Minimum cannot be greater than maximum", hideInnerLabels = true, isDirty, autoFocusOnMount, onChange, onMinChange, onMaxChange, onBlur, isClearable: isClearableProps, as: asProp, variant: variantProps, size: sizeProps, hideLabel: hideLabelProps, ...rest } = props;
+	let asProp;
+	let autoFocusOnMount;
+	let className;
+	let error;
+	let errorClassName;
+	let headerClassName;
+	let helperText;
+	let hideLabelProps;
+	let inputClassName;
+	let isClearableProps;
+	let isDirty;
+	let isDisabled;
+	let isHeaderHidden;
+	let isRequired;
+	let label;
+	let maxInputClassName;
+	let maxValue;
+	let minInputClassName;
+	let minValue;
+	let onBlur;
+	let onChange;
+	let onMaxChange;
+	let onMinChange;
+	let ref;
+	let rest;
+	let rightContent;
+	let sizeProps;
+	let t0;
+	let t1;
+	let t2;
+	let t3;
+	let t4;
+	let t5;
+	let tooltipText;
+	let value;
+	let variantProps;
+	if ($[0] !== props) {
+		({ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, className, inputClassName, minInputClassName, maxInputClassName, value, minValue, maxValue, minPlaceholder: t0, maxPlaceholder: t1, minLabel: t2, maxLabel: t3, invalidRangeError: t4, hideInnerLabels: t5, isDirty, autoFocusOnMount, onChange, onMinChange, onMaxChange, onBlur, isClearable: isClearableProps, as: asProp, variant: variantProps, size: sizeProps, hideLabel: hideLabelProps, ...rest} = props);
+		$[0] = props;
+		$[1] = asProp;
+		$[2] = autoFocusOnMount;
+		$[3] = className;
+		$[4] = error;
+		$[5] = errorClassName;
+		$[6] = headerClassName;
+		$[7] = helperText;
+		$[8] = hideLabelProps;
+		$[9] = inputClassName;
+		$[10] = isClearableProps;
+		$[11] = isDirty;
+		$[12] = isDisabled;
+		$[13] = isHeaderHidden;
+		$[14] = isRequired;
+		$[15] = label;
+		$[16] = maxInputClassName;
+		$[17] = maxValue;
+		$[18] = minInputClassName;
+		$[19] = minValue;
+		$[20] = onBlur;
+		$[21] = onChange;
+		$[22] = onMaxChange;
+		$[23] = onMinChange;
+		$[24] = ref;
+		$[25] = rest;
+		$[26] = rightContent;
+		$[27] = sizeProps;
+		$[28] = t0;
+		$[29] = t1;
+		$[30] = t2;
+		$[31] = t3;
+		$[32] = t4;
+		$[33] = t5;
+		$[34] = tooltipText;
+		$[35] = value;
+		$[36] = variantProps;
+	} else {
+		asProp = $[1];
+		autoFocusOnMount = $[2];
+		className = $[3];
+		error = $[4];
+		errorClassName = $[5];
+		headerClassName = $[6];
+		helperText = $[7];
+		hideLabelProps = $[8];
+		inputClassName = $[9];
+		isClearableProps = $[10];
+		isDirty = $[11];
+		isDisabled = $[12];
+		isHeaderHidden = $[13];
+		isRequired = $[14];
+		label = $[15];
+		maxInputClassName = $[16];
+		maxValue = $[17];
+		minInputClassName = $[18];
+		minValue = $[19];
+		onBlur = $[20];
+		onChange = $[21];
+		onMaxChange = $[22];
+		onMinChange = $[23];
+		ref = $[24];
+		rest = $[25];
+		rightContent = $[26];
+		sizeProps = $[27];
+		t0 = $[28];
+		t1 = $[29];
+		t2 = $[30];
+		t3 = $[31];
+		t4 = $[32];
+		t5 = $[33];
+		tooltipText = $[34];
+		value = $[35];
+		variantProps = $[36];
+	}
+	const minPlaceholder = t0 === void 0 ? "Min" : t0;
+	const maxPlaceholder = t1 === void 0 ? "Max" : t1;
+	const minLabel = t2 === void 0 ? "Minimum" : t2;
+	const maxLabel = t3 === void 0 ? "Maximum" : t3;
+	const invalidRangeError = t4 === void 0 ? "Minimum cannot be greater than maximum" : t4;
+	const hideInnerLabels = t5 === void 0 ? true : t5;
 	const isClearable = isClearableProps ?? ui.input.isClearable;
 	const as = asProp ?? ui.input.as;
 	const variant = variantProps ?? ui.input.variant;
 	const size = sizeProps ?? ui.input.size;
 	const hideLabel = hideLabelProps ?? ui.input.hideLabel;
-	const rangeValue = normalizeRangeValue(value, minValue, maxValue);
+	let t6;
+	if ($[37] !== maxValue || $[38] !== minValue || $[39] !== value) {
+		t6 = normalizeRangeValue(value, minValue, maxValue);
+		$[37] = maxValue;
+		$[38] = minValue;
+		$[39] = value;
+		$[40] = t6;
+	} else t6 = $[40];
+	const rangeValue = t6;
 	const isEmpty = rangeValue.min === null && rangeValue.max === null;
 	const rangeError = rangeValue.min !== null && rangeValue.max !== null && rangeValue.min > rangeValue.max ? invalidRangeError : void 0;
 	const effectiveError = error || rangeError;
-	const { hoverProps, isHovered } = useHover({ isDisabled });
+	let t7;
+	if ($[41] !== isDisabled) {
+		t7 = { isDisabled };
+		$[41] = isDisabled;
+		$[42] = t7;
+	} else t7 = $[42];
+	const { hoverProps, isHovered } = useHover(t7);
 	const { isFocusVisible } = useFocusVisible();
 	const [isFocused, setIsFocused] = useState(false);
-	const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: setIsFocused });
-	const formFieldProps = {
-		error: effectiveError,
-		label,
-		tooltipText,
-		helperText,
-		isRequired,
-		rightContent,
-		isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
-		hideLabel,
-		isDisabled,
-		headerClassName,
-		errorClassName
-	};
-	const headerProps = {
-		label,
-		tooltipText,
-		helperText,
-		isRequired,
-		rightContent,
-		isHeaderHidden: hideLabel || isHeaderHidden,
-		isDisabled,
-		className: headerClassName
-	};
-	const updateRange = (side, nextValue) => {
-		const nextRange = {
-			...rangeValue,
-			[side]: nextValue
+	let t8;
+	if ($[43] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = { onFocusWithinChange: setIsFocused };
+		$[43] = t8;
+	} else t8 = $[43];
+	const { focusWithinProps } = useFocusWithin(t8);
+	const t9 = isHeaderHidden || as === "inline" || as === "filter" || as === "floating";
+	let t10;
+	if ($[44] !== effectiveError || $[45] !== errorClassName || $[46] !== headerClassName || $[47] !== helperText || $[48] !== hideLabel || $[49] !== isDisabled || $[50] !== isRequired || $[51] !== label || $[52] !== rightContent || $[53] !== t9 || $[54] !== tooltipText) {
+		t10 = {
+			error: effectiveError,
+			label,
+			tooltipText,
+			helperText,
+			isRequired,
+			rightContent,
+			isHeaderHidden: t9,
+			hideLabel,
+			isDisabled,
+			headerClassName,
+			errorClassName
 		};
-		onChange?.(nextRange);
-		if (side === "min") onMinChange?.(nextValue);
-		else onMaxChange?.(nextValue);
-	};
-	const clearRangeSide = (side) => {
-		updateRange(side, null);
-		onBlur?.({ target: { value: "" } });
-	};
-	return /* @__PURE__ */ jsx(NumberRangeField, {
-		...rest,
-		ref,
-		as,
-		className,
-		inputClassName,
-		minInputClassName,
-		maxInputClassName,
-		inputBaseClassName: inputBaseCva({
+		$[44] = effectiveError;
+		$[45] = errorClassName;
+		$[46] = headerClassName;
+		$[47] = helperText;
+		$[48] = hideLabel;
+		$[49] = isDisabled;
+		$[50] = isRequired;
+		$[51] = label;
+		$[52] = rightContent;
+		$[53] = t9;
+		$[54] = tooltipText;
+		$[55] = t10;
+	} else t10 = $[55];
+	const formFieldProps = t10;
+	const t11 = hideLabel || isHeaderHidden;
+	let t12;
+	if ($[56] !== headerClassName || $[57] !== helperText || $[58] !== isDisabled || $[59] !== isRequired || $[60] !== label || $[61] !== rightContent || $[62] !== t11 || $[63] !== tooltipText) {
+		t12 = {
+			label,
+			tooltipText,
+			helperText,
+			isRequired,
+			rightContent,
+			isHeaderHidden: t11,
+			isDisabled,
+			className: headerClassName
+		};
+		$[56] = headerClassName;
+		$[57] = helperText;
+		$[58] = isDisabled;
+		$[59] = isRequired;
+		$[60] = label;
+		$[61] = rightContent;
+		$[62] = t11;
+		$[63] = tooltipText;
+		$[64] = t12;
+	} else t12 = $[64];
+	const headerProps = t12;
+	let t13;
+	if ($[65] !== onChange || $[66] !== onMaxChange || $[67] !== onMinChange || $[68] !== rangeValue) {
+		t13 = (side, nextValue) => {
+			const nextRange = {
+				...rangeValue,
+				[side]: nextValue
+			};
+			onChange?.(nextRange);
+			if (side === "min") onMinChange?.(nextValue);
+			else onMaxChange?.(nextValue);
+		};
+		$[65] = onChange;
+		$[66] = onMaxChange;
+		$[67] = onMinChange;
+		$[68] = rangeValue;
+		$[69] = t13;
+	} else t13 = $[69];
+	const updateRange = t13;
+	let t14;
+	if ($[70] !== onBlur || $[71] !== updateRange) {
+		t14 = (side_0) => {
+			updateRange(side_0, null);
+			onBlur?.({ target: { value: "" } });
+		};
+		$[70] = onBlur;
+		$[71] = updateRange;
+		$[72] = t14;
+	} else t14 = $[72];
+	const clearRangeSide = t14;
+	let t15;
+	if ($[73] !== as || $[74] !== inputBaseCva || $[75] !== variant) {
+		t15 = inputBaseCva({
 			variant,
 			as
-		}),
-		inputSizeClassName: inputSizeCva({
+		});
+		$[73] = as;
+		$[74] = inputBaseCva;
+		$[75] = variant;
+		$[76] = t15;
+	} else t15 = $[76];
+	let t16;
+	if ($[77] !== as || $[78] !== inputSizeCva || $[79] !== size) {
+		t16 = inputSizeCva({
 			size,
 			as
-		}),
-		formFieldProps,
-		headerProps,
-		rangeValue,
-		effectiveError,
-		minPlaceholder,
-		maxPlaceholder,
-		minLabel,
-		maxLabel,
-		hideInnerLabels,
-		isDirty,
-		isClearable,
-		autoFocusOnMount,
-		isDisabled,
-		isRequired,
-		isEmpty,
-		isHovered,
-		isFocused,
-		isFocusVisible,
-		focusWithinProps,
-		hoverProps,
-		onRangeSideChange: updateRange,
-		onRangeSideClear: clearRangeSide,
-		onBlur
-	});
+		});
+		$[77] = as;
+		$[78] = inputSizeCva;
+		$[79] = size;
+		$[80] = t16;
+	} else t16 = $[80];
+	let t17;
+	if ($[81] !== as || $[82] !== autoFocusOnMount || $[83] !== className || $[84] !== clearRangeSide || $[85] !== effectiveError || $[86] !== focusWithinProps || $[87] !== formFieldProps || $[88] !== headerProps || $[89] !== hideInnerLabels || $[90] !== hoverProps || $[91] !== inputClassName || $[92] !== isClearable || $[93] !== isDirty || $[94] !== isDisabled || $[95] !== isEmpty || $[96] !== isFocusVisible || $[97] !== isFocused || $[98] !== isHovered || $[99] !== isRequired || $[100] !== maxInputClassName || $[101] !== maxLabel || $[102] !== maxPlaceholder || $[103] !== minInputClassName || $[104] !== minLabel || $[105] !== minPlaceholder || $[106] !== onBlur || $[107] !== rangeValue || $[108] !== ref || $[109] !== rest || $[110] !== t15 || $[111] !== t16 || $[112] !== updateRange) {
+		t17 = /* @__PURE__ */ jsx(NumberRangeField, {
+			...rest,
+			ref,
+			as,
+			className,
+			inputClassName,
+			minInputClassName,
+			maxInputClassName,
+			inputBaseClassName: t15,
+			inputSizeClassName: t16,
+			formFieldProps,
+			headerProps,
+			rangeValue,
+			effectiveError,
+			minPlaceholder,
+			maxPlaceholder,
+			minLabel,
+			maxLabel,
+			hideInnerLabels,
+			isDirty,
+			isClearable,
+			autoFocusOnMount,
+			isDisabled,
+			isRequired,
+			isEmpty,
+			isHovered,
+			isFocused,
+			isFocusVisible,
+			focusWithinProps,
+			hoverProps,
+			onRangeSideChange: updateRange,
+			onRangeSideClear: clearRangeSide,
+			onBlur
+		});
+		$[81] = as;
+		$[82] = autoFocusOnMount;
+		$[83] = className;
+		$[84] = clearRangeSide;
+		$[85] = effectiveError;
+		$[86] = focusWithinProps;
+		$[87] = formFieldProps;
+		$[88] = headerProps;
+		$[89] = hideInnerLabels;
+		$[90] = hoverProps;
+		$[91] = inputClassName;
+		$[92] = isClearable;
+		$[93] = isDirty;
+		$[94] = isDisabled;
+		$[95] = isEmpty;
+		$[96] = isFocusVisible;
+		$[97] = isFocused;
+		$[98] = isHovered;
+		$[99] = isRequired;
+		$[100] = maxInputClassName;
+		$[101] = maxLabel;
+		$[102] = maxPlaceholder;
+		$[103] = minInputClassName;
+		$[104] = minLabel;
+		$[105] = minPlaceholder;
+		$[106] = onBlur;
+		$[107] = rangeValue;
+		$[108] = ref;
+		$[109] = rest;
+		$[110] = t15;
+		$[111] = t16;
+		$[112] = updateRange;
+		$[113] = t17;
+	} else t17 = $[113];
+	return t17;
 };
-var NumberRangeInput = ({ renderStaticInput, ...props }) => {
+var NumberRangeInputInner = (t0) => {
+	const $ = c(5);
+	const { renderStaticInput, isFormControlDisabled, ...props } = t0;
+	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
 	const ui = UIConfig.useConfig();
 	const { locale } = useLocale();
 	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
-	const { shouldFocus, renderRealInput } = useStaticInputHandoff({
-		inputRef: useRef(null),
-		renderInput,
-		setRenderInput
-	});
-	const watchedValue = "formControl" in props && props.formControl ? useWatch({
-		control: props.formControl.control,
-		name: props.formControl.name
-	}) : props.value;
-	let isFormControlDisabled = false;
-	if ("formControl" in props && props.formControl) isFormControlDisabled = !!props.formControl.control._options?.disabled;
+	const inputRef = useRef(null);
+	let t1;
+	if ($[0] !== renderInput) {
+		t1 = {
+			inputRef,
+			renderInput,
+			setRenderInput
+		};
+		$[0] = renderInput;
+		$[1] = t1;
+	} else t1 = $[1];
+	const { shouldFocus, renderRealInput } = useStaticInputHandoff(t1);
 	if (!renderInput) {
-		const staticValue = normalizeRangeValue(watchedValue, props.minValue, props.maxValue);
+		const staticValue = normalizeRangeValue(props.value, props.minValue, props.maxValue);
 		const formatOptions = props.formatOptions ?? ui.numberInput.formatOptions;
 		const formatter = new Intl.NumberFormat(locale, formatOptions);
 		const minDisplay = getStaticNumberDisplayValue(staticValue.min, formatter);
@@ -144,6 +388,7 @@ var NumberRangeInput = ({ renderStaticInput, ...props }) => {
 		const rangeError = staticValue.min !== null && staticValue.max !== null && staticValue.min > staticValue.max ? props.invalidRangeError ?? "Minimum cannot be greater than maximum" : void 0;
 		const effectiveError = props.error || rangeError;
 		const as = props.as ?? ui.input.as;
+		const size = props.size ?? ui.input.size;
 		let isDisabled = !!props.isDisabled;
 		if (isFormControlDisabled) isDisabled = true;
 		const isClearable = props.isClearable ?? ui.input.isClearable;
@@ -165,71 +410,166 @@ var NumberRangeInput = ({ renderStaticInput, ...props }) => {
 			inputClassName: props.inputClassName,
 			contentClassName: "pr-0!",
 			trailingClassName: "py-0! pl-0!",
-			contentWrapperClassName: "flex w-full items-center gap-input-gap-input-text-to-elements",
+			contentWrapperClassName: clsx("flex w-full items-center gap-input-gap-input-text-to-elements pr-0! py-0! px-0!", inputSizeCva({
+				size,
+				as
+			})),
 			dataAttributes,
 			renderStatic: true,
 			onStaticInteract: renderRealInput,
 			isClearable: false,
-			labelPlacement: "content-row",
-			children: ({ id, ...dataAttributeProps }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-				/* @__PURE__ */ jsx("input", {
-					id,
-					readOnly: true,
-					disabled: isDisabled,
-					tabIndex: -1,
-					value: minDisplay ?? "",
-					placeholder: props.minPlaceholder ?? "Min",
-					className: clsx("w-full bg-transparent outline-none placeholder:text-text-default-3 disabled:text-interactive-text-secondary-disabled", props.minInputClassName),
-					...dataAttributeProps,
-					"data-rac": true
-				}),
-				isClearable && /* @__PURE__ */ jsx(InputClear, {
-					onClear: () => {},
-					renderStatic: true
-				}),
-				/* @__PURE__ */ jsx("span", {
-					className: "pointer-events-none shrink-0 select-none text-label-2 text-text-default-3",
-					children: "-"
-				}),
-				/* @__PURE__ */ jsx("input", {
-					id: `${id}-max`,
-					readOnly: true,
-					disabled: isDisabled,
-					tabIndex: -1,
-					value: maxDisplay ?? "",
-					placeholder: props.maxPlaceholder ?? "Max",
-					className: clsx("w-full bg-transparent outline-none placeholder:text-text-default-3 disabled:text-interactive-text-secondary-disabled", props.maxInputClassName),
-					...dataAttributeProps,
-					"data-rac": true
-				}),
-				isClearable && /* @__PURE__ */ jsx(InputClear, {
-					onClear: () => {},
-					renderStatic: true
-				})
-			] })
+			labelPlacement: "content-wrapper",
+			children: (t2) => {
+				const { id, ...dataAttributeProps } = t2;
+				return /* @__PURE__ */ jsxs(Fragment, { children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "min-w-0 flex-1",
+						children: [/* @__PURE__ */ jsx(FormFieldLabel, {
+							label: props.minLabel ?? "Minimum",
+							isRequired: props.isRequired,
+							isDisabled,
+							className: clsx((props.hideInnerLabels ?? true) && "sr-only")
+						}), /* @__PURE__ */ jsxs("div", {
+							className: "flex items-center gap-input-gap-trailing-elements",
+							children: [/* @__PURE__ */ jsx("input", {
+								id,
+								readOnly: true,
+								disabled: isDisabled,
+								tabIndex: -1,
+								value: minDisplay ?? "",
+								placeholder: props.minPlaceholder ?? "Min",
+								className: clsx("w-full min-w-0 bg-transparent outline-none", props.minInputClassName),
+								...dataAttributeProps,
+								"data-rac": true
+							}), isClearable && /* @__PURE__ */ jsx(InputClear, {
+								onClear: _temp,
+								show: staticValue.min !== null,
+								renderStatic: true
+							})]
+						})]
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "pointer-events-none shrink-0 select-none text-label-2 text-text-default-3",
+						children: "-"
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "min-w-0 flex-1",
+						children: [/* @__PURE__ */ jsx(FormFieldLabel, {
+							label: props.maxLabel ?? "Maximum",
+							isRequired: props.isRequired,
+							isDisabled,
+							className: clsx((props.hideInnerLabels ?? true) && "sr-only")
+						}), /* @__PURE__ */ jsxs("div", {
+							className: "flex items-center gap-input-gap-trailing-elements",
+							children: [/* @__PURE__ */ jsx("input", {
+								id: `${id}-max`,
+								readOnly: true,
+								disabled: isDisabled,
+								tabIndex: -1,
+								value: maxDisplay ?? "",
+								placeholder: props.maxPlaceholder ?? "Max",
+								className: clsx("w-full min-w-0 bg-transparent outline-none", props.maxInputClassName),
+								...dataAttributeProps,
+								"data-rac": true
+							}), isClearable && /* @__PURE__ */ jsx(InputClear, {
+								onClear: _temp2,
+								show: staticValue.max !== null,
+								renderStatic: true
+							})]
+						})]
+					})
+				] });
+			}
 		});
 	}
-	if ("formControl" in props && props.formControl) {
-		const { formControl, ref, ...innerProps } = props;
-		return /* @__PURE__ */ jsx(Controller, {
-			control: formControl.control,
-			name: formControl.name,
-			render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsx(NumberRangeInputBase, {
-				...innerProps,
-				ref,
-				value: field.value ?? EMPTY_RANGE,
-				onChange: field.onChange,
-				onBlur: field.onBlur,
-				isDisabled: field.disabled || props.isDisabled,
-				error: props.error ?? error?.message,
-				autoFocusOnMount: shouldFocus
-			})
+	let t2;
+	if ($[2] !== props || $[3] !== shouldFocus) {
+		t2 = /* @__PURE__ */ jsx(NumberRangeInputBase, {
+			...props,
+			autoFocusOnMount: shouldFocus
 		});
+		$[2] = props;
+		$[3] = shouldFocus;
+		$[4] = t2;
+	} else t2 = $[4];
+	return t2;
+};
+var NumberRangeInput = (t0) => {
+	const $ = c(19);
+	let props;
+	let renderStaticInput;
+	if ($[0] !== t0) {
+		({renderStaticInput, ...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+		$[2] = renderStaticInput;
+	} else {
+		props = $[1];
+		renderStaticInput = $[2];
+	}
+	if ("formControl" in props && props.formControl) {
+		let formControl;
+		let innerProps;
+		if ($[3] !== props) {
+			({formControl, ...innerProps} = props);
+			$[3] = props;
+			$[4] = formControl;
+			$[5] = innerProps;
+		} else {
+			formControl = $[4];
+			innerProps = $[5];
+		}
+		const controlWithOptions = formControl.control;
+		let t1;
+		if ($[6] !== controlWithOptions._options?.disabled || $[7] !== innerProps || $[8] !== props.error || $[9] !== props.isDisabled || $[10] !== renderStaticInput) {
+			t1 = (t2) => {
+				const { field, fieldState: t3 } = t2;
+				const { error } = t3;
+				return /* @__PURE__ */ jsx(NumberRangeInputInner, {
+					...innerProps,
+					value: field.value ?? EMPTY_RANGE,
+					onChange: field.onChange,
+					onBlur: field.onBlur,
+					isDisabled: field.disabled || !!controlWithOptions._options?.disabled || props.isDisabled,
+					isFormControlDisabled: !!controlWithOptions._options?.disabled,
+					error: props.error ?? error?.message,
+					renderStaticInput
+				});
+			};
+			$[6] = controlWithOptions._options?.disabled;
+			$[7] = innerProps;
+			$[8] = props.error;
+			$[9] = props.isDisabled;
+			$[10] = renderStaticInput;
+			$[11] = t1;
+		} else t1 = $[11];
+		let t2;
+		if ($[12] !== formControl.control || $[13] !== formControl.name || $[14] !== t1) {
+			t2 = /* @__PURE__ */ jsx(Controller, {
+				control: formControl.control,
+				name: formControl.name,
+				render: t1
+			});
+			$[12] = formControl.control;
+			$[13] = formControl.name;
+			$[14] = t1;
+			$[15] = t2;
+		} else t2 = $[15];
+		return t2;
 	}
-	return /* @__PURE__ */ jsx(NumberRangeInputBase, {
-		...props,
-		autoFocusOnMount: shouldFocus
-	});
+	let t1;
+	if ($[16] !== props || $[17] !== renderStaticInput) {
+		t1 = /* @__PURE__ */ jsx(NumberRangeInputInner, {
+			...props,
+			renderStaticInput
+		});
+		$[16] = props;
+		$[17] = renderStaticInput;
+		$[18] = t1;
+	} else t1 = $[18];
+	return t1;
 };
+function _temp() {}
+function _temp2() {}
 //#endregion
 export { NumberRangeInput };