@povio/ui 3.4.0-rc.1 → 3.4.0-rc.3

package/dist/assets/locales/en/translation.json.d.ts

@@ -0,0 +1,158 @@
+declare const _default: {
+  "ui": {
+    "openAlt": "Open",
+    "closeAlt": "Close",
+    "clearAlt": "Clear",
+    "loadingState": {
+      "text": "Loading..."
+    },
+    "select": {
+      "closeAlt": "Close the menu",
+      "selectAll": "Select all",
+      "clearSelection": "Clear",
+      "allOption": "All",
+      "search": "Search",
+      "clearSearch": "Clear search"
+    },
+    "datePicker": {
+      "today": "Today",
+      "clear": "Clear",
+      "save": "Save",
+      "presets": {
+        "thisWeek": "This week",
+        "lastWeek": "Last week",
+        "thisAndLastWeek": "This & Last week",
+        "thisMonth": "This month",
+        "thisAndLastMonth": "This & Last month",
+        "thisYear": "This year",
+        "lastYear": "Last year",
+        "thisAndLastYear": "This & Last year",
+        "soFar": "So far"
+      },
+      "navigation": {
+        "previousMonth": "Previous month",
+        "nextMonth": "Next month",
+        "previousYear": "Previous year",
+        "nextYear": "Next year"
+      },
+      "errors": {
+        "endDateBeforeStart": "End date cannot be before start date"
+      }
+    },
+    "modal": {
+      "closeBtn": "Close"
+    },
+    "autocomplete": {
+      "createNewBtn": "Create"
+    },
+    "password": {
+      "reveal": "Reveal password",
+      "hide": "Hide password"
+    },
+    "textEditor": {
+      "textStyle": {
+        "label": "Text style",
+        "normal": "Normal text",
+        "heading1": "Heading 1",
+        "heading2": "Heading 2",
+        "heading3": "Heading 3",
+        "heading4": "Heading 4",
+        "heading5": "Heading 5",
+        "heading6": "Heading 6"
+      },
+      "marks": {
+        "bold": "Bold",
+        "italic": "Italic",
+        "underline": "Underline",
+        "strikethrough": "Strikethrough"
+      },
+      "textAlign": {
+        "label": "Text align",
+        "left": "Left",
+        "center": "Center",
+        "right": "Right",
+        "justify": "Justify"
+      },
+      "link": {
+        "label": "Hyperlink",
+        "apply": "Apply",
+        "remove": "Remove",
+        "urlLabel": "URL",
+        "urlPlaceholder": "Enter the URL"
+      }
+    },
+    "tag": {
+      "dismiss": "Dismiss"
+    },
+    "clearInput": "Clear input",
+    "pagination": {
+      "nextBtn": "Next",
+      "backBtn": "Previous",
+      "firstBtn": "First",
+      "lastBtn": "Last",
+      "resultsPerPage": "Results per page"
+    },
+    "confirmation": {
+      "cancel": "Cancel",
+      "confirm": "Confirm"
+    },
+    "fileUpload": {
+      "emptyText": "Upload file",
+      "uploadText": "Drag & drop files here or",
+      "browse": "Browse",
+      "noFileUploaded": "No file uploaded",
+      "upload": "Upload",
+      "uploadFile": "Upload file",
+      "or": "or",
+      "removeFile": "Remove file",
+      "cancel": "Cancel"
+    },
+    "table": {
+      "column": "Column",
+      "show": "Show",
+      "configureColumns": "Configure columns"
+    }
+  },
+  "zodErrors": {
+    "required": "Required",
+    "invalid": "Invalid",
+    "string": {
+      "includes": "Must include \"{{text}}\"",
+      "startsWith": "Must start with \"{{text}}\"",
+      "endsWith": "Must end with \"{{text}}\"",
+      "constraint": "Invalid {{text}}",
+      "contains": "Must contain exactly {{count}} character(s)",
+      "containsAtLeast": "Must contain at least {{count}} character(s)",
+      "containsOver": "Must contain over {{count}} character(s)",
+      "containsAtMost": "Must contain at most {{count}} character(s)",
+      "containsUnder": "Must contain under {{count}} character(s)"
+    },
+    "array": {
+      "contains": "Array must contain exactly {{count}} element(s)",
+      "containsAtLeast": "Array must contain at least {{count}} element(s)",
+      "containsMoreThan": "Array must contain more than {{count}} element(s)",
+      "containsAtMost": "Array must contain at most {{count}} element(s)",
+      "containsLessThan": "Array must contain less than {{count}} element(s)"
+    },
+    "number": {
+      "exact": "Number must be exactly equal to {{number}}",
+      "greaterThanOrEqual": "Number must be greater than or equal to {{number}}",
+      "greaterThan": "Number must be greater than {{number}}",
+      "over": "Number must be over {{number}}",
+      "lessThanOrEqual": "Number must be less than or equal to {{number}}",
+      "lessThan": "Number must be less than {{number}}",
+      "multipleOf": "Number must be a multiple of {{multipleOf}}"
+    },
+    "date": {
+      "invalid": "Invalid date",
+      "exact": "Date must be exactly equal to {{date}}",
+      "greaterThanOrEqual": "Date must be greater than or equal to {{date}}",
+      "greaterThan": "Date must be greater than {{date}}",
+      "smallerThanOrEqual": "Date must be smaller than or equal to {{date}}",
+      "smallerThan": "Date must be smaller than {{date}}"
+    }
+  }
+}
+;
+
+export default _default;

package/dist/assets/locales/sl/translation.json.d.ts

@@ -0,0 +1,154 @@
+declare const _default: {
+  "ui": {
+    "openAlt": "Odpri",
+    "closeAlt": "Zapri",
+    "clearAlt": "Sprazni",
+    "loadingState": {
+      "text": "Nalaganje..."
+    },
+    "select": {
+      "closeAlt": "Zapri meni",
+      "selectAll": "Izberi vse",
+      "clearSelection": "Sprazni",
+      "allOption": "Vse",
+      "search": "Išči",
+      "clearSearch": "Sprazni iskanje"
+    },
+    "datePicker": {
+      "today": "Danes",
+      "clear": "Sprazni",
+      "save": "Shrani",
+      "presets": {
+        "thisWeek": "Ta teden",
+        "lastWeek": "Prejšnji teden",
+        "thisAndLastWeek": "Ta in prejšnji teden",
+        "thisMonth": "Ta mesec",
+        "thisAndLastMonth": "Ta in prejšnji mesec",
+        "thisYear": "To leto",
+        "lastYear": "Prejšnje leto",
+        "thisAndLastYear": "To in prejšnje leto",
+        "soFar": "Od začetka"
+      },
+      "navigation": {
+        "previousMonth": "Prejšnji mesec",
+        "nextMonth": "Naslednji mesec",
+        "previousYear": "Prejšnje leto",
+        "nextYear": "Naslednje leto"
+      },
+      "errors": {
+        "endDateBeforeStart": "Datum konca ne more biti pred datumom začetka"
+      }
+    },
+    "modal": {
+      "closeBtn": "Zapri"
+    },
+    "autocomplete": {
+      "createNewBtn": "Ustvari"
+    },
+    "password": {
+      "reveal": "Prikaži geslo",
+      "hide": "Skrij geslo"
+    },
+    "textEditor": {
+      "textStyle": {
+        "label": "Vrsta besedila",
+        "normal": "Normalni tekst",
+        "heading1": "Naslov 1",
+        "heading2": "Naslov 2",
+        "heading3": "Naslov 3",
+        "heading4": "Naslov 4",
+        "heading5": "Naslov 5",
+        "heading6": "Naslov 6"
+      },
+      "marks": {
+        "bold": "Krepko",
+        "italic": "Poševno",
+        "underline": "Podčrtano",
+        "strikethrough": "Prečrtano"
+      },
+      "textAlign": {
+        "label": "Poravnava besedila",
+        "left": "Levo",
+        "center": "Sredina",
+        "right": "Desno",
+        "justify": "Obojestransko"
+      },
+      "link": {
+        "label": "Povezava",
+        "apply": "Ustvari",
+        "remove": "Odstrani",
+        "urlLabel": "URL",
+        "urlPlaceholder": "Vnesite URL"
+      }
+    },
+    "pagination": {
+      "nextBtn": "Naprej",
+      "backBtn": "Nazaj",
+      "firstBtn": "Prva",
+      "lastBtn": "Zadnja",
+      "resultsPerPage": "Rezultatov na stran"
+    },
+    "confirmation": {
+      "cancel": "Prekliči",
+      "confirm": "Potrdi"
+    },
+    "fileUpload": {
+      "emptyText": "Naloži datoteko",
+      "uploadText": "Povlecite datoteke sem ali",
+      "browse": "Izberi",
+      "noFileUploaded": "Ni datotek",
+      "upload": "Naloži",
+      "uploadFile": "Naloži datoteko",
+      "or": "ali",
+      "removeFile": "Odstrani datoteko",
+      "cancel": "Prekliči"
+    },
+    "table": {
+      "column": "Stolpec",
+      "show": "Prikaži",
+      "configureColumns": "Nastavi stolpce"
+    }
+  },
+  "zodErrors": {
+    "required": "Obvezno",
+    "invalid": "Neveljavno",
+    "string": {
+      "includes": "Mora vključevati \"{{text}}\"",
+      "startsWith": "Se mora začeti z \"{{text}}\"",
+      "endsWith": "Se mora končati z \"{{text}}\"",
+      "constraint": "Neveljaven {{text}}",
+      "contains": "Mora vsebovati natančno {{count}} znak(ov)",
+      "containsAtLeast": "Mora vsebovati vsaj {{count}} znak(ov)",
+      "containsOver": "Mora vsebovati več kot {{count}} znak(ov)",
+      "containsAtMost": "Mora vsebovati največ {{count}} znak(ov)",
+      "containsUnder": "Mora vsebovati manj kot {{count}} znak(ov)"
+    },
+    "array": {
+      "contains": "Polje mora vsebovati natančno {{count}} element(ov)",
+      "containsAtLeast": "Polje mora vsebovati vsaj {{count}} element(ov)",
+      "containsMoreThan": "Polje mora vsebovati več kot {{count}} element(ov)",
+      "containsAtMost": "Polje mora vsebovati največ {{count}} element(ov)",
+      "containsLessThan": "Polje mora vsebovati manj kot {{count}} element(ov)"
+    },
+    "number": {
+      "exact": "Število mora biti natančno enako {{number}}",
+      "greaterThanOrEqual": "Število mora biti večje ali enako {{number}}",
+      "greaterThan": "Število mora biti večje od {{number}}",
+      "over": "Število mora biti nad {{number}}",
+      "lessThanOrEqual": "Število mora biti manjše ali enako {{number}}",
+      "lessThan": "Število mora biti manjše od {{number}}",
+      "multipleOf": "Število mora biti večkratnik števila {{multipleOf}}"
+    },
+    "date": {
+      "invalid": "Neveljaven datum",
+      "exact": "Datum mora biti natančno enak {{date}}",
+      "greaterThanOrEqual": "Datum mora biti večji ali enak {{date}}",
+      "greaterThan": "Datum mora biti večji od {{date}}",
+      "smallerThanOrEqual": "Datum mora biti manjši ali enak {{date}}",
+      "smallerThan": "Datum mora biti manjši od {{date}}"
+    }
+  }
+}
+;
+
+export default _default;

package/dist/components/inputs/DateTime/DatePicker/DatePicker.js

@@ -340,6 +340,7 @@ var DatePickerInner = ({ fullIso = true, granularity = "day", minValue, maxValue
 		});
 		return /* @__PURE__ */ jsx(InputFrame, {
 			...props,
+			onClear: () => props.onChange?.(null),
 			isDisabled,
 			className: clsx("group relative inline-flex w-full flex-col text-left", props.className),
 			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
@@ -394,7 +395,7 @@ var DatePicker = ({ fullIso = true, granularity = "day", minValue, maxValue, ren
 				...innerProps,
 				ref: mergeRefs(ref, field_0.ref),
 				value: field_0.value ?? null,
-				onChange: field_0.onChange,
+				onChange: (value) => field_0.onChange(value ?? null),
 				onBlur: field_0.onBlur,
 				isDirty,
 				isDisabled: field_0.disabled || props.isDisabled,

package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js

@@ -804,6 +804,7 @@ var DateRangePickerInner = ({ fullIso = true, minValue, maxValue, renderStaticIn
 		});
 		return /* @__PURE__ */ jsx(InputFrame, {
 			...props,
+			onClear: () => props.onChange?.(null),
 			isDisabled,
 			className: clsx("group relative inline-flex w-full flex-col text-left", props.className),
 			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
@@ -857,7 +858,7 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
 				...innerProps,
 				ref: mergeRefs(ref, field_0.ref),
 				value: field_0.value ?? null,
-				onChange: field_0.onChange,
+				onChange: (value) => field_0.onChange(value ?? null),
 				onBlur: field_0.onBlur,
 				isDirty,
 				isDisabled: field_0.disabled || props.isDisabled,

package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js

@@ -122,9 +122,10 @@ var DateTimePickerBase = (props) => {
 		labelProps
 	};
 	const onApply = () => {
-		const newValue = dialogState.value;
-		state.setValue(newValue);
-		state.toggle();
+		const newValue = dialogState.value ?? null;
+		onChange?.(newValue);
+		dialogState.setValue(newValue);
+		state.close();
 	};
 	const onMonthYearChange = (selectedDate) => {
 		if (!shouldUpdateDateOnMonthYearChange) return;
@@ -307,6 +308,7 @@ var DateTimePickerInner = ({ fullIso: _fullIso = true, renderStaticInput, isForm
 		});
 		return /* @__PURE__ */ jsx(InputFrame, {
 			...props,
+			onClear: () => props.onChange?.(null),
 			isDisabled,
 			className: clsx("group relative inline-flex w-full flex-col text-left", props.className),
 			inputClassName: clsx(props.shouldShrinkInput ? "min-w-0" : "min-w-input-width-min-width", props.inputClassName),
@@ -359,7 +361,7 @@ var DateTimePicker = ({ fullIso = true, renderStaticInput, ...props }) => {
 				...innerProps,
 				ref: mergeRefs(ref, field_0.ref),
 				value: field_0.value ?? null,
-				onChange: field_0.onChange,
+				onChange: (value) => field_0.onChange(value ?? null),
 				onBlur: field_0.onBlur,
 				isDirty,
 				isDisabled: field_0.disabled || props.isDisabled,

package/dist/components/inputs/DateTime/TimePicker/TimePicker.js

@@ -494,6 +494,7 @@ var TimePickerInner = (t0) => {
 		});
 		return /* @__PURE__ */ jsx(InputFrame, {
 			...props,
+			onClear: () => props.onChange?.(null),
 			isDisabled,
 			className: clsx("group relative inline-flex w-full flex-col text-left", props.className),
 			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
@@ -589,7 +590,7 @@ var TimePicker = (t0) => {
 					...innerProps,
 					ref: mergeRefs(ref, field_0.ref),
 					value: field_0.value ?? null,
-					onChange: field_0.onChange,
+					onChange: (value) => field_0.onChange(value ?? null),
 					onBlur: field_0.onBlur,
 					isDirty,
 					isDisabled: field_0.disabled || props.isDisabled,

package/dist/components/inputs/DateTime/shared/DateField.d.ts

@@ -15,6 +15,7 @@ interface DateFieldProps extends Omit<DateFieldStateOptions, "locale" | "createC
     timeZone?: string;
     segmentGroup?: string;
     shouldAutoFixYear?: boolean;
+    preserveNullValue?: boolean;
 }
-export declare const DateField: ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, dateGranularity, isTimeOptional, format, timeZone, segmentGroup, shouldAutoFixYear, ...props }: DateFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DateField: ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, dateGranularity, isTimeOptional, format, timeZone, segmentGroup, shouldAutoFixYear, preserveNullValue, ...props }: DateFieldProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/inputs/DateTime/shared/DateField.js

@@ -9,10 +9,10 @@ import { DateTime } from "luxon";
 import { useDateFieldState } from "react-stately";
 //#region src/components/inputs/DateTime/shared/DateField.tsx
 var omitNullValue = ({ value: _value, ...props }) => props;
-var DateField = ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, dateGranularity = "day", isTimeOptional = false, format, timeZone, segmentGroup, shouldAutoFixYear = false, ...props }) => {
+var DateField = ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, dateGranularity = "day", isTimeOptional = false, format, timeZone, segmentGroup, shouldAutoFixYear = false, preserveNullValue = false, ...props }) => {
 	const { locale } = useLocale();
 	const previousValueRef = useRef(props.value);
-	const dateFieldProps = props.value == null ? omitNullValue(props) : props;
+	const dateFieldProps = props.value == null && !preserveNullValue ? omitNullValue(props) : props;
 	const state = useDateFieldState({
 		...dateFieldProps,
 		isDisabled,

package/dist/components/inputs/DateTime/shared/DatePickerInput.js

@@ -51,10 +51,10 @@ var DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, fieldVa
 		shouldAutoFixYear: autoFixYear
 	} : void 0;
 	const clearInput = useCallback(() => {
-		dateFieldRef.current?.clearField();
-		endDateFieldRef.current?.clearField();
 		if (onClearProp) onClearProp();
 		else {
+			dateFieldRef.current?.clearField();
+			endDateFieldRef.current?.clearField();
 			fieldProps.onChange?.(null);
 			endFieldProps?.onChange?.(null);
 		}
@@ -150,6 +150,7 @@ var DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, fieldVa
 							disableManualEntry,
 							dateGranularity,
 							isTimeOptional,
+							preserveNullValue: isValueControlled && !endFieldProps,
 							format,
 							timeZone: effectiveTimeZone,
 							segmentGroup: normalizedEndFieldProps ? "start" : void 0

package/dist/components/inputs/DateTime/shared/TimePickerInput.js

@@ -150,8 +150,8 @@ var TimePickerInput = (t0) => {
 	if ($[33] !== canClear || $[34] !== isClearable || $[35] !== onClear || $[36] !== state) {
 		t23 = isClearable && /* @__PURE__ */ jsx(InputClear, {
 			onClear: () => {
-				state.setValue(null);
-				onClear?.();
+				if (onClear) onClear();
+				else state.setValue(null);
 			},
 			show: canClear
 		});

package/dist/components/inputs/Inputs/Form.js

@@ -1,7 +1,7 @@
-import { InputItem } from "./InputItem.js";
 import { StringUtils } from "../../../utils/string.utils.js";
 import { ZodUtils } from "../../../utils/zod.utils.js";
 import { getDefaultInputComponentType } from "../../../helpers/dynamicInputs.js";
+import { InputItem } from "./InputItem.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 import { z } from "zod";

package/dist/components/inputs/Inputs/InputItem.d.ts

@@ -18,7 +18,7 @@ declare const componentRegistry: {
     readonly querySelect: <TFieldValues extends import('../shared/form.binding').FieldValues, TQueryFn extends import('../Selection/shared/querySelect.utils').QueryFn, TKey extends import('react-aria').Key = import('react-aria').Key, TInitialSelectItem = import('../../..').DefaultInitialSelectItem<TKey>>(props: import('../Selection/Select/QuerySelect').QuerySelectProps<TFieldValues, TQueryFn, TKey, TInitialSelectItem>) => import("react/jsx-runtime").JSX.Element;
     readonly autocomplete: typeof Autocomplete;
     readonly queryAutocomplete: <TFieldValues extends import('../shared/form.binding').FieldValues, TSelectItem extends import('../../..').SelectItem<any>, TQueryFn extends import('../Selection/Autocomplete/queryAutocomplete.types').QueryFn>(props: import('../Selection/Autocomplete/queryAutocomplete.types').QueryAutocompleteProps<TFieldValues, TSelectItem, TQueryFn>) => import("react/jsx-runtime").JSX.Element;
-    readonly segment: <TFieldValues extends import('../shared/form.binding').FieldValues, TKey extends import('react-aria').Key = import('react-aria').Key>(props: import('../../..').ControlledSegmentProps<TFieldValues, TKey>) => import("react/jsx-runtime").JSX.Element;
+    readonly segment: <TFieldValues extends import('../shared/form.binding').FieldValues, TKey extends import('react-aria').Key = import('react-aria').Key>(props: import('../../segment/segment.types').ControlledSegmentProps<TFieldValues, TKey>) => import("react/jsx-runtime").JSX.Element;
     readonly datePicker: <TFieldValues extends import('../shared/form.binding').FieldValues>({ fullIso, granularity, minValue, maxValue, renderStaticInput, ...props }: import('../DateTime/DatePicker/DatePicker').ControlledDatePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
     readonly dateTimePicker: <TFieldValues extends import('../shared/form.binding').FieldValues>({ fullIso, renderStaticInput, ...props }: import('../DateTime/DateTimePicker/DateTimePicker').ControlledDateTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
     readonly timePicker: <TFieldValues extends import('../shared/form.binding').FieldValues>({ renderStaticInput, ...props }: import('../DateTime/TimePicker/TimePicker').ControlledTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/Inputs/InputItem.js

@@ -12,10 +12,10 @@ import { PasswordInput } from "../Input/PasswordInput/PasswordInput.js";
 import { TextArea } from "../Input/TextArea/TextArea.js";
 import { Autocomplete } from "../Selection/Autocomplete/Autocomplete.js";
 import { QueryAutocomplete } from "../Selection/Autocomplete/QueryAutocomplete.js";
+import { QuerySelect } from "../Selection/Select/QuerySelect.js";
 import { Slider } from "../Slider/Slider.js";
 import { Toggle } from "../Toggle/Toggle.js";
 import { Segment } from "../../segment/Segment.js";
-import { QuerySelect } from "../Selection/Select/QuerySelect.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/inputs/Inputs/InputItem.tsx

package/dist/components/inputs/Selection/shared/select.context.js

@@ -12,11 +12,24 @@ var SelectContext;
 	});
 	_SelectContext.Provider = ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, ignoreInputValueFiltering, searchDebounceDelay, multiSelectAutoConfirm = false, onBlur: fieldOnBlur, children, mapInitialToSelectItem = defaultMapInitialToSelectItem, ...props }) => {
 		const isMultiple = props.selectionMode === "multiple";
+		const initialSelection = props.initialSelection;
+		const controlledValue = props.value;
+		const hasControlledValue = Object.hasOwn(props, "value");
 		const initialSelectedItems = useMemo(() => {
-			if (!props.initialSelection) return null;
-			if (Array.isArray(props.initialSelection)) return props.initialSelection.map(mapInitialToSelectItem);
-			return mapInitialToSelectItem(props.initialSelection);
-		}, [props.initialSelection, mapInitialToSelectItem]);
+			if (!initialSelection) return null;
+			const controlledIds = Array.isArray(controlledValue) ? new Set(controlledValue) : controlledValue != null ? new Set([controlledValue]) : /* @__PURE__ */ new Set();
+			const mapMatchingInitialItem = (item) => {
+				const mappedItem = mapInitialToSelectItem(item);
+				return !hasControlledValue || controlledIds.has(mappedItem.id) ? mappedItem : null;
+			};
+			if (Array.isArray(initialSelection)) return initialSelection.map(mapMatchingInitialItem).filter((item_0) => item_0 !== null);
+			return mapMatchingInitialItem(initialSelection);
+		}, [
+			controlledValue,
+			hasControlledValue,
+			initialSelection,
+			mapInitialToSelectItem
+		]);
 		const [isOpen, setIsOpen] = useState(false);
 		const [fieldState, setFieldState] = useState({
 			value: props.value ?? (isMultiple ? [] : null),
@@ -45,15 +58,15 @@ var SelectContext;
 			isClientSearchDisabled: ignoreInputValueFiltering ?? isClientSearchDisabled
 		});
 		const selectedItems = useMemo(() => {
-			const getItem = (id) => allItems.find((item) => item.id === id) ?? null;
-			if (Array.isArray(fieldState.value)) return fieldState.value.map((id_0) => getItem(id_0)).filter((item_0) => item_0 !== null);
+			const getItem = (id) => allItems.find((item_1) => item_1.id === id) ?? null;
+			if (Array.isArray(fieldState.value)) return fieldState.value.map((id_0) => getItem(id_0)).filter((item_2) => item_2 !== null);
 			const selectedItem = fieldState.value != null ? getItem(fieldState.value) : null;
 			return selectedItem ? [selectedItem] : [];
 		}, [allItems, fieldState.value]);
 		const selectedIds = useMemo(() => selectedItems.map(({ id: id_1 }) => id_1), [selectedItems]);
-		const getItem_0 = useCallback((value) => allItems.find((item_1) => item_1 && item_1.id === value) ?? null, [allItems]);
+		const getItem_0 = useCallback((value) => allItems.find((item_3) => item_3 && item_3.id === value) ?? null, [allItems]);
 		const updateValue = useCallback((value_0) => {
-			if (Array.isArray(value_0)) valueRef.current = value_0.map((id_2) => getItem_0(id_2)).filter((item_2) => item_2 !== null);
+			if (Array.isArray(value_0)) valueRef.current = value_0.map((id_2) => getItem_0(id_2)).filter((item_4) => item_4 !== null);
 			else valueRef.current = getItem_0(value_0);
 		}, [getItem_0]);
 		const getValueIds = () => Array.isArray(valueRef.current) ? valueRef.current.map(({ id: id_3 }) => id_3) : valueRef.current?.id ?? null;

package/dist/components/inputs/Skeleton/InputFrame.js

@@ -103,7 +103,7 @@ var InputFrame = (props) => {
 		hasClear && /* @__PURE__ */ jsx(InputClear, {
 			onClear: () => onClear?.(),
 			className: clearClassName,
-			show: !!showClear,
+			show: !!showClear && !isDisabled,
 			renderStatic: true
 		}),
 		trailingContent,
@@ -152,6 +152,7 @@ var InputFrame = (props) => {
 	}) : /* @__PURE__ */ jsxs(Fragment, { children: [contentRow, trailingRow] });
 	const shouldReplayStaticPress = (target) => staticPressTarget === "frame" || target instanceof Element && !!target.closest("[data-static-press-action]");
 	const isStaticPressActionTarget = (target_0) => target_0 instanceof Element && !!target_0.closest("[data-static-press-action]");
+	const isStaticClearActionTarget = (target_1) => target_1 instanceof Element && !!target_1.closest("[data-static-clear-action]");
 	return /* @__PURE__ */ jsx(TooltipWrapper, {
 		as,
 		error,
@@ -170,7 +171,7 @@ var InputFrame = (props) => {
 			},
 			onFocusCapture: (event_0) => {
 				onFocusCapture?.(event_0);
-				if (pendingStaticPressPointerIdRef.current == null) onStaticInteract?.(true, event_0.target);
+				if (pendingStaticPressPointerIdRef.current == null && !isStaticClearActionTarget(event_0.target)) onStaticInteract?.(true, event_0.target);
 			},
 			children: /* @__PURE__ */ jsx("div", {
 				ref,
@@ -181,9 +182,10 @@ var InputFrame = (props) => {
 				}), inputClassName),
 				tabIndex: isDisabled ? -1 : 0,
 				onFocus: (event_1) => {
-					if (pendingStaticPressPointerIdRef.current == null) onStaticInteract?.(true, event_1.target);
+					if (pendingStaticPressPointerIdRef.current == null && !isStaticClearActionTarget(event_1.target)) onStaticInteract?.(true, event_1.target);
 				},
 				onClick: (event_2) => {
+					if (isStaticClearActionTarget(event_2.target)) return;
 					if (onStaticPress && shouldReplayStaticPress(event_2.target)) {
 						onStaticPress();
 						return;
@@ -194,6 +196,7 @@ var InputFrame = (props) => {
 					if (onStaticPress && shouldReplayStaticPress(event_3.target) || isStaticPressActionTarget(event_3.target)) pendingStaticPressPointerIdRef.current = event_3.pointerId;
 				},
 				onPointerDown: (event_4) => {
+					if (isStaticClearActionTarget(event_4.target)) return;
 					if (pendingStaticPressPointerIdRef.current === event_4.pointerId) return;
 					if (onStaticPress && shouldReplayStaticPress(event_4.target)) {
 						pendingStaticPressPointerIdRef.current = event_4.pointerId;