@povio/ui 3.2.4-rc.1 → 3.2.4-rc.10

package/dist/components/inputs/Selection/shared/SelectInput.js

@@ -18,8 +18,8 @@ import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/Selection/shared/SelectInput.tsx
 var SelectInput = (t0) => {
-	const $0 = c(136);
-	const { ref, placeholder, variant, as, size, isDisabled, isInvalid, className, hideDropdownIcon, isSearchable, isClearable, showSelectionContent, inputClassName, fieldProps, headerProps, selectedTagsType, collapseAfter, isRequired, isDirty, onCloseComboBox, onBlur, leadingContent, trailingContent, onMouseEnter, onFocusCapture, ...props } = t0;
+	const $0 = c(139);
+	const { ref, placeholder, variant, as, size, isDisabled, isInvalid, className, hideDropdownIcon, isSearchable, isClearable, showSelectionContent, inputClassName, fieldProps, headerProps, selectedTagsType, collapseAfter, isRequired, isDirty, onCloseComboBox, onTriggerPointerDown, onBlur, leadingContent, trailingContent, onMouseEnter, onFocusCapture, ...props } = t0;
 	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
 	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
 	const inputClearClassCva = UIOverrides.useCva("input.clearClassCva", inputClearClassDefinition);
@@ -240,35 +240,44 @@ var SelectInput = (t0) => {
 	const t30 = isRequired || void 0;
 	const t31 = isDirty || void 0;
 	const t32 = "";
-	const t33 = clsx("relative flex flex-1 items-center gap-input-gap-input-text-to-elements truncate", !isDisabled && isSearchable && "cursor-text", !isDisabled && !isSearchable && "cursor-pointer", inputSizeCva({
+	let t33;
+	if ($0[50] !== onTriggerPointerDown) {
+		t33 = (event) => {
+			const trigger = event.currentTarget.querySelector("[aria-expanded]");
+			onTriggerPointerDown?.(trigger?.getAttribute("aria-expanded") === "true");
+		};
+		$0[50] = onTriggerPointerDown;
+		$0[51] = t33;
+	} else t33 = $0[51];
+	const t34 = clsx("relative flex flex-1 items-center gap-input-gap-input-text-to-elements truncate", !isDisabled && isSearchable && "cursor-text", !isDisabled && !isSearchable && "cursor-pointer", inputSizeCva({
 		as,
 		size,
 		...props
 	}));
-	let t34;
-	if ($0[50] !== as || $0[51] !== headerProps || $0[52] !== labelProps) {
-		t34 = as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
+	let t35;
+	if ($0[52] !== as || $0[53] !== headerProps || $0[54] !== labelProps) {
+		t35 = as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
 			as,
 			...headerProps,
 			labelProps
 		});
-		$0[50] = as;
-		$0[51] = headerProps;
-		$0[52] = labelProps;
-		$0[53] = t34;
-	} else t34 = $0[53];
-	let t35;
-	if ($0[54] !== leadingContent) {
-		t35 = leadingContent && /* @__PURE__ */ jsx("div", {
-			className: "ml-input-side-default flex shrink-0 items-center",
-			children: leadingContent
-		});
-		$0[54] = leadingContent;
+		$0[52] = as;
+		$0[53] = headerProps;
+		$0[54] = labelProps;
 		$0[55] = t35;
 	} else t35 = $0[55];
 	let t36;
-	if ($0[56] !== as || $0[57] !== collapseAfter || $0[58] !== fieldProps || $0[59] !== inputClassName || $0[60] !== isDisabled || $0[61] !== isSearchable || $0[62] !== onBlur || $0[63] !== onKeyDown || $0[64] !== onRemove || $0[65] !== placeholder || $0[66] !== selectInputTagsContentWrapperCva || $0[67] !== selectedItems || $0[68] !== selectedTagsType || $0[69] !== showTags) {
-		t36 = (showTags || isSearchable) && /* @__PURE__ */ jsxs("div", {
+	if ($0[56] !== leadingContent) {
+		t36 = leadingContent && /* @__PURE__ */ jsx("div", {
+			className: "ml-input-side-default flex shrink-0 items-center",
+			children: leadingContent
+		});
+		$0[56] = leadingContent;
+		$0[57] = t36;
+	} else t36 = $0[57];
+	let t37;
+	if ($0[58] !== as || $0[59] !== collapseAfter || $0[60] !== fieldProps || $0[61] !== inputClassName || $0[62] !== isDisabled || $0[63] !== isSearchable || $0[64] !== onBlur || $0[65] !== onKeyDown || $0[66] !== onRemove || $0[67] !== placeholder || $0[68] !== selectInputTagsContentWrapperCva || $0[69] !== selectedItems || $0[70] !== selectedTagsType || $0[71] !== showTags) {
+		t37 = (showTags || isSearchable) && /* @__PURE__ */ jsxs("div", {
 			className: selectInputTagsContentWrapperCva({ isSearchable }),
 			children: [showTags && /* @__PURE__ */ jsx(SelectInputTags, {
 				selectedItems,
@@ -285,25 +294,25 @@ var SelectInput = (t0) => {
 				...fieldProps
 			})]
 		});
-		$0[56] = as;
-		$0[57] = collapseAfter;
-		$0[58] = fieldProps;
-		$0[59] = inputClassName;
-		$0[60] = isDisabled;
-		$0[61] = isSearchable;
-		$0[62] = onBlur;
-		$0[63] = onKeyDown;
-		$0[64] = onRemove;
-		$0[65] = placeholder;
-		$0[66] = selectInputTagsContentWrapperCva;
-		$0[67] = selectedItems;
-		$0[68] = selectedTagsType;
-		$0[69] = showTags;
-		$0[70] = t36;
-	} else t36 = $0[70];
-	let t37;
-	if ($0[71] !== as || $0[72] !== fieldProps || $0[73] !== isDisabled || $0[74] !== isEmpty || $0[75] !== isMultiple || $0[76] !== isOpen || $0[77] !== isSearchable || $0[78] !== onBlur || $0[79] !== onTriggerKeyDown || $0[80] !== placeholder || $0[81] !== selectedItems[0] || $0[82] !== setIsOpen || $0[83] !== showSelectionContent || $0[84] !== showTags) {
-		t37 = !isSearchable && /* @__PURE__ */ jsxs(Button, {
+		$0[58] = as;
+		$0[59] = collapseAfter;
+		$0[60] = fieldProps;
+		$0[61] = inputClassName;
+		$0[62] = isDisabled;
+		$0[63] = isSearchable;
+		$0[64] = onBlur;
+		$0[65] = onKeyDown;
+		$0[66] = onRemove;
+		$0[67] = placeholder;
+		$0[68] = selectInputTagsContentWrapperCva;
+		$0[69] = selectedItems;
+		$0[70] = selectedTagsType;
+		$0[71] = showTags;
+		$0[72] = t37;
+	} else t37 = $0[72];
+	let t38;
+	if ($0[73] !== as || $0[74] !== fieldProps || $0[75] !== isDisabled || $0[76] !== isEmpty || $0[77] !== isMultiple || $0[78] !== isOpen || $0[79] !== isSearchable || $0[80] !== onBlur || $0[81] !== onTriggerKeyDown || $0[82] !== placeholder || $0[83] !== selectedItems[0] || $0[84] !== setIsOpen || $0[85] !== showSelectionContent || $0[86] !== showTags) {
+		t38 = !isSearchable && /* @__PURE__ */ jsxs(Button, {
 			isDisabled,
 			onPress: () => setIsOpen(!isOpen),
 			onBlur,
@@ -317,71 +326,71 @@ var SelectInput = (t0) => {
 				children: [isEmpty && placeholder, !isEmpty && (showSelectionContent ? selectedItems[0].content : selectedItems[0].label)]
 			})]
 		});
-		$0[71] = as;
-		$0[72] = fieldProps;
-		$0[73] = isDisabled;
-		$0[74] = isEmpty;
-		$0[75] = isMultiple;
-		$0[76] = isOpen;
-		$0[77] = isSearchable;
-		$0[78] = onBlur;
-		$0[79] = onTriggerKeyDown;
-		$0[80] = placeholder;
-		$0[81] = selectedItems[0];
-		$0[82] = setIsOpen;
-		$0[83] = showSelectionContent;
-		$0[84] = showTags;
-		$0[85] = t37;
-	} else t37 = $0[85];
-	let t38;
-	if ($0[86] !== onClick || $0[87] !== t33 || $0[88] !== t34 || $0[89] !== t35 || $0[90] !== t36 || $0[91] !== t37) {
-		t38 = /* @__PURE__ */ jsxs("div", {
-			className: t33,
+		$0[73] = as;
+		$0[74] = fieldProps;
+		$0[75] = isDisabled;
+		$0[76] = isEmpty;
+		$0[77] = isMultiple;
+		$0[78] = isOpen;
+		$0[79] = isSearchable;
+		$0[80] = onBlur;
+		$0[81] = onTriggerKeyDown;
+		$0[82] = placeholder;
+		$0[83] = selectedItems[0];
+		$0[84] = setIsOpen;
+		$0[85] = showSelectionContent;
+		$0[86] = showTags;
+		$0[87] = t38;
+	} else t38 = $0[87];
+	let t39;
+	if ($0[88] !== onClick || $0[89] !== t34 || $0[90] !== t35 || $0[91] !== t36 || $0[92] !== t37 || $0[93] !== t38) {
+		t39 = /* @__PURE__ */ jsxs("div", {
+			className: t34,
 			onClick,
 			children: [
-				t34,
 				t35,
 				t36,
-				t37
+				t37,
+				t38
 			]
 		});
-		$0[86] = onClick;
-		$0[87] = t33;
-		$0[88] = t34;
-		$0[89] = t35;
-		$0[90] = t36;
-		$0[91] = t37;
-		$0[92] = t38;
-	} else t38 = $0[92];
-	let t39;
-	if ($0[93] !== as || $0[94] !== inputClearClassCva || $0[95] !== isClearable || $0[96] !== isDisabled || $0[97] !== onClear || $0[98] !== showClearButton) {
-		t39 = isClearable && !isDisabled && /* @__PURE__ */ jsx(InputClear, {
+		$0[88] = onClick;
+		$0[89] = t34;
+		$0[90] = t35;
+		$0[91] = t36;
+		$0[92] = t37;
+		$0[93] = t38;
+		$0[94] = t39;
+	} else t39 = $0[94];
+	let t40;
+	if ($0[95] !== as || $0[96] !== inputClearClassCva || $0[97] !== isClearable || $0[98] !== isDisabled || $0[99] !== onClear || $0[100] !== showClearButton) {
+		t40 = isClearable && !isDisabled && /* @__PURE__ */ jsx(InputClear, {
 			onClear: () => {
 				onClear();
 			},
 			className: inputClearClassCva({ as }),
 			show: showClearButton
 		});
-		$0[93] = as;
-		$0[94] = inputClearClassCva;
-		$0[95] = isClearable;
-		$0[96] = isDisabled;
-		$0[97] = onClear;
-		$0[98] = showClearButton;
-		$0[99] = t39;
-	} else t39 = $0[99];
-	let t40;
-	if ($0[100] !== trailingContent) {
-		t40 = trailingContent && /* @__PURE__ */ jsx("div", {
-			className: "flex shrink-0 items-center",
-			children: trailingContent
-		});
-		$0[100] = trailingContent;
+		$0[95] = as;
+		$0[96] = inputClearClassCva;
+		$0[97] = isClearable;
+		$0[98] = isDisabled;
+		$0[99] = onClear;
+		$0[100] = showClearButton;
 		$0[101] = t40;
 	} else t40 = $0[101];
 	let t41;
-	if ($0[102] !== hideDropdownIcon || $0[103] !== inputSizeCva || $0[104] !== isDisabled || $0[105] !== isOpen || $0[106] !== isSearchable || $0[107] !== setIsOpen || $0[108] !== size || $0[109] !== t) {
-		t41 = !hideDropdownIcon && /* @__PURE__ */ jsx(Button, {
+	if ($0[102] !== trailingContent) {
+		t41 = trailingContent && /* @__PURE__ */ jsx("div", {
+			className: "flex shrink-0 items-center",
+			children: trailingContent
+		});
+		$0[102] = trailingContent;
+		$0[103] = t41;
+	} else t41 = $0[103];
+	let t42;
+	if ($0[104] !== hideDropdownIcon || $0[105] !== inputSizeCva || $0[106] !== isDisabled || $0[107] !== isOpen || $0[108] !== isSearchable || $0[109] !== setIsOpen || $0[110] !== size || $0[111] !== t) {
+		t42 = !hideDropdownIcon && /* @__PURE__ */ jsx(Button, {
 			excludeFromTabOrder: true,
 			"aria-label": t(($) => isOpen ? $.ui.closeAlt : $.ui.openAlt),
 			className: clsx("self-stretch pl-1-5 outline-none", inputSizeCva({ size })),
@@ -394,19 +403,19 @@ var SelectInput = (t0) => {
 				"aria-hidden": "true"
 			})
 		});
-		$0[102] = hideDropdownIcon;
-		$0[103] = inputSizeCva;
-		$0[104] = isDisabled;
-		$0[105] = isOpen;
-		$0[106] = isSearchable;
-		$0[107] = setIsOpen;
-		$0[108] = size;
-		$0[109] = t;
-		$0[110] = t41;
-	} else t41 = $0[110];
-	let t42;
-	if ($0[111] !== focusWithinProps || $0[112] !== hoverProps || $0[113] !== onFocusCapture || $0[114] !== onMouseEnter || $0[115] !== ref || $0[116] !== t16 || $0[117] !== t18 || $0[118] !== t19 || $0[119] !== t20 || $0[120] !== t21 || $0[121] !== t22 || $0[122] !== t23 || $0[123] !== t24 || $0[124] !== t25 || $0[125] !== t26 || $0[126] !== t27 || $0[127] !== t28 || $0[128] !== t29 || $0[129] !== t30 || $0[130] !== t31 || $0[131] !== t38 || $0[132] !== t39 || $0[133] !== t40 || $0[134] !== t41) {
-		t42 = /* @__PURE__ */ jsxs("div", {
+		$0[104] = hideDropdownIcon;
+		$0[105] = inputSizeCva;
+		$0[106] = isDisabled;
+		$0[107] = isOpen;
+		$0[108] = isSearchable;
+		$0[109] = setIsOpen;
+		$0[110] = size;
+		$0[111] = t;
+		$0[112] = t42;
+	} else t42 = $0[112];
+	let t43;
+	if ($0[113] !== focusWithinProps || $0[114] !== hoverProps || $0[115] !== onFocusCapture || $0[116] !== onMouseEnter || $0[117] !== ref || $0[118] !== t16 || $0[119] !== t18 || $0[120] !== t19 || $0[121] !== t20 || $0[122] !== t21 || $0[123] !== t22 || $0[124] !== t23 || $0[125] !== t24 || $0[126] !== t25 || $0[127] !== t26 || $0[128] !== t27 || $0[129] !== t28 || $0[130] !== t29 || $0[131] !== t30 || $0[132] !== t31 || $0[133] !== t33 || $0[134] !== t39 || $0[135] !== t40 || $0[136] !== t41 || $0[137] !== t42) {
+		t43 = /* @__PURE__ */ jsxs("div", {
 			ref,
 			className: t16,
 			"data-rac": t17,
@@ -426,43 +435,45 @@ var SelectInput = (t0) => {
 			"data-is-dirty": t31,
 			"data-select-input": t32,
 			onMouseEnter,
+			onPointerDownCapture: t33,
 			onFocusCapture,
 			...hoverProps,
 			...focusWithinProps,
 			children: [
-				t38,
 				t39,
 				t40,
-				t41
+				t41,
+				t42
 			]
 		});
-		$0[111] = focusWithinProps;
-		$0[112] = hoverProps;
-		$0[113] = onFocusCapture;
-		$0[114] = onMouseEnter;
-		$0[115] = ref;
-		$0[116] = t16;
-		$0[117] = t18;
-		$0[118] = t19;
-		$0[119] = t20;
-		$0[120] = t21;
-		$0[121] = t22;
-		$0[122] = t23;
-		$0[123] = t24;
-		$0[124] = t25;
-		$0[125] = t26;
-		$0[126] = t27;
-		$0[127] = t28;
-		$0[128] = t29;
-		$0[129] = t30;
-		$0[130] = t31;
-		$0[131] = t38;
-		$0[132] = t39;
-		$0[133] = t40;
-		$0[134] = t41;
-		$0[135] = t42;
-	} else t42 = $0[135];
-	return t42;
+		$0[113] = focusWithinProps;
+		$0[114] = hoverProps;
+		$0[115] = onFocusCapture;
+		$0[116] = onMouseEnter;
+		$0[117] = ref;
+		$0[118] = t16;
+		$0[119] = t18;
+		$0[120] = t19;
+		$0[121] = t20;
+		$0[122] = t21;
+		$0[123] = t22;
+		$0[124] = t23;
+		$0[125] = t24;
+		$0[126] = t25;
+		$0[127] = t26;
+		$0[128] = t27;
+		$0[129] = t28;
+		$0[130] = t29;
+		$0[131] = t30;
+		$0[132] = t31;
+		$0[133] = t33;
+		$0[134] = t39;
+		$0[135] = t40;
+		$0[136] = t41;
+		$0[137] = t42;
+		$0[138] = t43;
+	} else t43 = $0[138];
+	return t43;
 };
 //#endregion
 export { SelectInput };

package/dist/components/inputs/Selection/shared/querySelect.utils.d.ts

@@ -9,6 +9,7 @@ export declare const getSelectionIdsToResolve: <TInitialSelectItem, TKey extends
     mapInitialToSelectItem?: (item: TInitialSelectItem) => SelectItem<TKey>;
 }) => {
     count: number;
+    isResolvedByInitialSelection: boolean;
     items: TKey[];
 };
 export declare const getQueryItems: <TQueryFn extends QueryFn, TKey extends Key = Key>(data: QueryDataType<TQueryFn> | undefined, queryMap?: (data: QueryDataType<TQueryFn>) => SelectItem<TKey>[]) => SelectItem<TKey>[];

package/dist/components/inputs/Selection/shared/querySelect.utils.js

@@ -26,6 +26,7 @@ var getSelectionIdsToResolve = ({ initialSelection, value, mapInitialToSelectIte
 	const items = Array.from(new Set([...missingLabelInitialSelectionIds, ...values.filter((id) => !labeledInitialSelectionIds.has(id))]));
 	return {
 		count: items.length,
+		isResolvedByInitialSelection: values.length > 0 && values.every((id) => labeledInitialSelectionIds.has(id)),
 		items
 	};
 };

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

@@ -135,16 +135,26 @@ var SelectContext;
 			triggerBlurOnChange
 		]);
 		const onClear = useCallback(() => {
-			if (!valueRef.current || Array.isArray(valueRef.current) && valueRef.current.length === 0) {
-				setFieldState((prev) => ({
-					...prev,
-					inputValue: ""
-				}));
+			if (selectedIds.length === 0) {
+				const newFieldState_2 = {
+					...fieldState,
+					inputValue: "",
+					searchValue: ""
+				};
+				setFieldState(newFieldState_2);
+				emitStateChanges(newFieldState_2, true);
+				setShowAll(true);
 				return;
 			}
 			if (isMultiple) onChange([]);
 			else onChange(null);
-		}, [isMultiple, onChange]);
+		}, [
+			emitStateChanges,
+			fieldState,
+			isMultiple,
+			onChange,
+			selectedIds.length
+		]);
 		const onSelectAll = useCallback(() => {
 			onChange(selectableListItems.map(({ id: id_4 }) => id_4));
 		}, [selectableListItems, onChange]);
@@ -157,13 +167,13 @@ var SelectContext;
 		]);
 		const onBlur = useCallback(() => {
 			if (props.isSearchable && isMultiple && fieldState.searchValue !== "") {
-				const newFieldState_2 = {
+				const newFieldState_3 = {
 					...fieldState,
 					inputValue: "",
 					searchValue: ""
 				};
-				setFieldState(newFieldState_2);
-				emitStateChanges(newFieldState_2);
+				setFieldState(newFieldState_3);
+				emitStateChanges(newFieldState_3);
 				setShowAll(true);
 			}
 			fieldOnBlur?.({});

package/dist/components/inputs/shared/input.cva.js

@@ -210,7 +210,7 @@ var inputSizeDefinition = UIOverrides.defineConfig({
 	}
 });
 var inputContentWrapperDefinition = UIOverrides.defineConfig({
-	base: ["flex w-full"],
+	base: ["flex min-w-0 w-full"],
 	config: {
 		variants: { as: {
 			default: "",

package/dist/components/shared/pagination/minWidth.cva.d.ts

@@ -1,3 +1,3 @@
 export declare const minWidth: (props?: ({
-    size?: "s" | "xs" | "m" | "l" | "xxs" | null | undefined;
+    size?: "xs" | "s" | "m" | "l" | "xxs" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/helpers/dynamicColumns.js

@@ -1,3 +1,4 @@
+import { IntlUtils } from "../utils/intl.utils.js";
 import { StringUtils } from "../utils/string.utils.js";
 import { ZodUtils } from "../utils/zod.utils.js";
 import { DateUtils } from "../utils/date.utils.js";
@@ -11,7 +12,7 @@ var FORMAT_MAP = {
 		return `${DateUtils.formatDate(new Date(value.start))} - ${DateUtils.formatDate(new Date(value.end))}`;
 	},
 	enum: (value) => StringUtils.capitalize(value),
-	number: (value) => value.toLocaleString(i18next.language),
+	number: (value) => IntlUtils.getNumberFormatter(i18next.language).format(value),
 	string: (value) => String(value),
 	boolean: (value) => {
 		const key = `${DEFAULT_NAMESPACE}.${value ? "yes" : "no"}`;

package/dist/index.d.ts

@@ -253,6 +253,7 @@ export { DateTimeUtils } from './utils/date-time.utils';
 export { DomUtils } from './utils/dom.utils';
 export { FileUtils } from './utils/file.utils';
 export { isEqual } from './utils/isEqual';
+export { IntlUtils } from './utils/intl.utils';
 export { logger } from './utils/logger';
 export { ObjectUtils } from './utils/object.utils';
 export { QueriesUtils } from './utils/queries.utils';

package/dist/index.js

@@ -82,6 +82,7 @@ import { inputBaseDefinition, inputClearClassDefinition, inputContentWrapperDefi
 import { CheckboxGroup } from "./components/inputs/Checkbox/CheckboxGroup.js";
 import { useLongPressRepeat } from "./hooks/useLongPressRepeat.js";
 import { useScrollableListBox } from "./hooks/useScrollableListBox.js";
+import { IntlUtils } from "./utils/intl.utils.js";
 import { DateTimeUtils } from "./utils/date-time.utils.js";
 import { datePickerInputContentRowDefinition } from "./components/inputs/DateTime/shared/datePickerInput.cva.js";
 import { popoverDefinition } from "./components/shared/popover.cva.js";
@@ -176,4 +177,4 @@ import { useSorting } from "./hooks/useSorting.js";
 import { useTableColumnConfig } from "./hooks/useTableColumnConfig.js";
 import { ArrayUtils } from "./utils/array.utils.js";
 import { QueriesUtils } from "./utils/queries.utils.js";
-export { Accordion, ActionModal, Alert, AlignCenterIcon, AlignLeftIcon, AlignLeftRightIcon, AlignRightIcon, ArrayUtils, ArrowDropDownIcon, ArrowDropUpIcon, ArrowLeftIcon, ArrowRightIcon, Autocomplete, BoldIcon, BottomSheet, Breadcrumbs, BulletedListIcon, Button, CalendarIcon, CellText, CheckIcon, Checkbox, CheckboxCheckmarkIcon, CheckboxGroup, CheckboxIndeterminateIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ClockIcon, CloseIcon, ColumnConfigModal, Confirmation, DatePicker, DateRangePicker, DateTimeIcon, DateTimePicker, DateTimeUtils, DateUtils, DomUtils, Drawer, FileUpload, FileUploadContainer, FileUtils, Form, FormField, HeaderText, HighlightIcon, HighlightOnIcon, HomeIcon, IconButton, InfiniteTable, InfoIcon, InlineIconButton, InputUpload, Inputs, ItalicIcon, Link, LinkContext, LinkIcon, Loader, Menu, MenuIcon, MenuItem, MenuPopover, Modal, NumberInput, NumberRangeInput, NumberedListIcon, ObjectUtils, PaginatedTable, Pagination, PaginationList, PasswordInput, Pill, PillButton, PointerHorizontalIcon, PointerVerticalIcon, ProgressBar, QueriesUtils, QueryAutocomplete, QuerySelect, RadioGroup, ResponsivePopover, RestUtils, RoutingUtils, Segment, Select, SendIcon, Slider, SplitButton, Stepper, StrikethroughIcon, StringUtils, Table, Tag, TextArea, TextButton, TextColorIcon, TextInput, ThemeContext, TimePicker, Toast, ToastContainer, Toggle, ToggleButton, Tooltip, TooltipEllipsis, Typography, UIConfig, UIOverrides, UIRouter, UnderlinedIcon, VisibilityIcon, VisibilityOffIcon, ZodUtils, accordionChevronDefinition, accordionDefinition, accordionHeadingDefinition, accordionHeadingSubtitleDefinition, accordionHeadingTitleDefinition, accordionIconDefinition, accordionItemDefinition, accordionPanelContentDefinition, accordionPanelDefinition, accordionTriggerDefinition, alertDefinition, breadcrumbChevronDefinition, breadcrumbIconDefinition, breadcrumbItemDefinition, breadcrumbSegmentDefinition, breadcrumbsDefinition, buttonContentDefinition, buttonDefinition, buttonIconSizeDefinition, buttonSizeDefinition, checkboxContentRowDefinition, checkboxContentWrapperDefinition, checkboxDefinition, checkboxGroupLabelDefinition, checkboxIconDefinition, compoundMapper, createKeyInteractionsHandler, datePickerInputContentRowDefinition, dynamicColumns, dynamicInputs, fileUploadDropZoneDefinition, formFieldErrorDefinition, formFieldHeaderDefinition, formFieldHelperDefinition, getKeyInteractionAction, inputBaseDefinition, inputClearClassDefinition, inputContentWrapperDefinition, inputSideDefinition, inputSizeDefinition, inputUploadButtonDefinition, inputUploadDropZoneDefinition, isEqual, labelDefinition, linkDefinition, loaderDefinition, loaderWrapperDefinition, logger, menuDefinition, menuItemDefinition, menuPopoverDefinition, menuPopoverWrapperDefinition, modalContentDefinition, modalMainDefinition, modalOverlayDefinition, ns, pillButtonContentDefinition, pillButtonDefinition, popoverDefinition, progressBarDefinition, progressBarFillDefinition, progressBarTrackDefinition, progressBarTrackWrapperDefinition, progressBarValueDefinition, radioContentRowDefinition, radioContentWrapperDefinition, radioDefinition, resources, segmentDefinition, segmentItemDefinition, selectInputTagsContentWrapperDefinition, selectListBoxItemDefinition, selectPopoverDefinition, statusIconDefinition, statusSeparatorDefinition, stepperDefinition, stepperIconDefinition, stepperItemDefinition, stepperNumberDefinition, stepperSeparatorDefinition, stepperSubtextDefinition, stepperTitleDefinition, tableCellTextDefinition, tableDataDefinition, tableHeadDataDefinition, tableHeadRowDefinition, tableHeaderTextDefinition, tableRowDefinition, tagDefinition, textAreaWrapperDefinition, toastDefinition, statusIconDefinition$1 as toastStatusIconDefinition, statusSeparatorDefinition$1 as toastStatusSeparatorDefinition, toggleDefinition, tooltipDefinition, tooltipPointerHorizontalDefinition, tooltipPointerVerticalDefinition, tooltipTextDefinition, tooltipWrapperTriggerDefinition, typographyDefinition, uiOutlineClass, useAutosave, useBreakpoint, useDebounceCallback, useDeepCompareEffect, useDeepCompareLayoutEffect, useDeepCompareMemo, useFilters, useForm, useFormAutosave, useIntersectionObserver, useKeyInteractions, useLocalStorage, useLongPressRepeat, usePagination, useScrollableListBox, useSorting, useStateAndRef, useTableColumnConfig, useTableNav, useToast, useTranslationMemo };
+export { Accordion, ActionModal, Alert, AlignCenterIcon, AlignLeftIcon, AlignLeftRightIcon, AlignRightIcon, ArrayUtils, ArrowDropDownIcon, ArrowDropUpIcon, ArrowLeftIcon, ArrowRightIcon, Autocomplete, BoldIcon, BottomSheet, Breadcrumbs, BulletedListIcon, Button, CalendarIcon, CellText, CheckIcon, Checkbox, CheckboxCheckmarkIcon, CheckboxGroup, CheckboxIndeterminateIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ClockIcon, CloseIcon, ColumnConfigModal, Confirmation, DatePicker, DateRangePicker, DateTimeIcon, DateTimePicker, DateTimeUtils, DateUtils, DomUtils, Drawer, FileUpload, FileUploadContainer, FileUtils, Form, FormField, HeaderText, HighlightIcon, HighlightOnIcon, HomeIcon, IconButton, InfiniteTable, InfoIcon, InlineIconButton, InputUpload, Inputs, IntlUtils, ItalicIcon, Link, LinkContext, LinkIcon, Loader, Menu, MenuIcon, MenuItem, MenuPopover, Modal, NumberInput, NumberRangeInput, NumberedListIcon, ObjectUtils, PaginatedTable, Pagination, PaginationList, PasswordInput, Pill, PillButton, PointerHorizontalIcon, PointerVerticalIcon, ProgressBar, QueriesUtils, QueryAutocomplete, QuerySelect, RadioGroup, ResponsivePopover, RestUtils, RoutingUtils, Segment, Select, SendIcon, Slider, SplitButton, Stepper, StrikethroughIcon, StringUtils, Table, Tag, TextArea, TextButton, TextColorIcon, TextInput, ThemeContext, TimePicker, Toast, ToastContainer, Toggle, ToggleButton, Tooltip, TooltipEllipsis, Typography, UIConfig, UIOverrides, UIRouter, UnderlinedIcon, VisibilityIcon, VisibilityOffIcon, ZodUtils, accordionChevronDefinition, accordionDefinition, accordionHeadingDefinition, accordionHeadingSubtitleDefinition, accordionHeadingTitleDefinition, accordionIconDefinition, accordionItemDefinition, accordionPanelContentDefinition, accordionPanelDefinition, accordionTriggerDefinition, alertDefinition, breadcrumbChevronDefinition, breadcrumbIconDefinition, breadcrumbItemDefinition, breadcrumbSegmentDefinition, breadcrumbsDefinition, buttonContentDefinition, buttonDefinition, buttonIconSizeDefinition, buttonSizeDefinition, checkboxContentRowDefinition, checkboxContentWrapperDefinition, checkboxDefinition, checkboxGroupLabelDefinition, checkboxIconDefinition, compoundMapper, createKeyInteractionsHandler, datePickerInputContentRowDefinition, dynamicColumns, dynamicInputs, fileUploadDropZoneDefinition, formFieldErrorDefinition, formFieldHeaderDefinition, formFieldHelperDefinition, getKeyInteractionAction, inputBaseDefinition, inputClearClassDefinition, inputContentWrapperDefinition, inputSideDefinition, inputSizeDefinition, inputUploadButtonDefinition, inputUploadDropZoneDefinition, isEqual, labelDefinition, linkDefinition, loaderDefinition, loaderWrapperDefinition, logger, menuDefinition, menuItemDefinition, menuPopoverDefinition, menuPopoverWrapperDefinition, modalContentDefinition, modalMainDefinition, modalOverlayDefinition, ns, pillButtonContentDefinition, pillButtonDefinition, popoverDefinition, progressBarDefinition, progressBarFillDefinition, progressBarTrackDefinition, progressBarTrackWrapperDefinition, progressBarValueDefinition, radioContentRowDefinition, radioContentWrapperDefinition, radioDefinition, resources, segmentDefinition, segmentItemDefinition, selectInputTagsContentWrapperDefinition, selectListBoxItemDefinition, selectPopoverDefinition, statusIconDefinition, statusSeparatorDefinition, stepperDefinition, stepperIconDefinition, stepperItemDefinition, stepperNumberDefinition, stepperSeparatorDefinition, stepperSubtextDefinition, stepperTitleDefinition, tableCellTextDefinition, tableDataDefinition, tableHeadDataDefinition, tableHeadRowDefinition, tableHeaderTextDefinition, tableRowDefinition, tagDefinition, textAreaWrapperDefinition, toastDefinition, statusIconDefinition$1 as toastStatusIconDefinition, statusSeparatorDefinition$1 as toastStatusSeparatorDefinition, toggleDefinition, tooltipDefinition, tooltipPointerHorizontalDefinition, tooltipPointerVerticalDefinition, tooltipTextDefinition, tooltipWrapperTriggerDefinition, typographyDefinition, uiOutlineClass, useAutosave, useBreakpoint, useDebounceCallback, useDeepCompareEffect, useDeepCompareLayoutEffect, useDeepCompareMemo, useFilters, useForm, useFormAutosave, useIntersectionObserver, useKeyInteractions, useLocalStorage, useLongPressRepeat, usePagination, useScrollableListBox, useSorting, useStateAndRef, useTableColumnConfig, useTableNav, useToast, useTranslationMemo };

package/dist/utils/date-time.utils.js

@@ -1,3 +1,4 @@
+import { IntlUtils } from "./intl.utils.js";
 import { CalendarDate, CalendarDateTime, DateFormatter, fromDate, getLocalTimeZone, parseAbsolute } from "@internationalized/date";
 import { DateTime } from "luxon";
 //#region src/utils/date-time.utils.ts
@@ -5,33 +6,42 @@ var DateTimeUtils;
 (function(_DateTimeUtils) {
 	const DATE_SAMPLE_DATE_UTC = new Date(Date.UTC(2e3, 10, 22));
 	const TIME_SAMPLE_DATE_UTC = new Date(Date.UTC(2e3, 10, 22, 6, 45));
+	const timeFormatters = /* @__PURE__ */ new Map();
 	const getDayMonthFormat = (shouldForceLeadingZeros = false) => shouldForceLeadingZeros ? "2-digit" : "numeric";
 	const getTimeHourFormat = (shouldForceLeadingZeros = false) => shouldForceLeadingZeros ? "2-digit" : "numeric";
-	const getDatePlaceholderFormatter = (locale, options) => new Intl.DateTimeFormat(locale, {
+	const getDatePlaceholderFormatter = (locale, options) => IntlUtils.getDateTimeFormatter(locale, {
 		day: getDayMonthFormat(options?.shouldForceLeadingZeros),
 		month: getDayMonthFormat(options?.shouldForceLeadingZeros),
 		year: "numeric"
 	});
-	const getTimePlaceholderFormatter = (locale) => new Intl.DateTimeFormat(locale, {
+	const getTimePlaceholderFormatter = (locale) => IntlUtils.getDateTimeFormatter(locale, {
 		hour: "2-digit",
 		minute: "2-digit"
 	});
 	const getResolvedLocale = (locale) => {
 		if (locale) return locale;
-		return new Intl.DateTimeFormat().resolvedOptions().locale;
+		return IntlUtils.getDateTimeFormatter().resolvedOptions().locale;
 	};
-	const getDateFormatter = (locale, options) => new Intl.DateTimeFormat(getResolvedLocale(locale), {
+	const getDateFormatter = (locale, options) => IntlUtils.getDateTimeFormatter(getResolvedLocale(locale), {
 		day: getDayMonthFormat(options?.shouldForceLeadingZeros),
 		month: getDayMonthFormat(options?.shouldForceLeadingZeros),
 		year: "numeric",
 		timeZone: "UTC"
 	});
-	const getTimeFormatter = (locale, options) => new DateFormatter(getResolvedLocale(locale), {
-		hour: getTimeHourFormat(options?.shouldForceLeadingZeros),
-		minute: "2-digit",
-		timeZone: "UTC"
-	});
-	const getDateTimeFormatter = (locale, options) => new Intl.DateTimeFormat(getResolvedLocale(locale), {
+	const getTimeFormatter = (locale, options) => {
+		const resolvedLocale = getResolvedLocale(locale);
+		const key = `${resolvedLocale}|${options?.shouldForceLeadingZeros ?? false}`;
+		const cachedFormatter = timeFormatters.get(key);
+		if (cachedFormatter) return cachedFormatter;
+		const formatter = new DateFormatter(resolvedLocale, {
+			hour: getTimeHourFormat(options?.shouldForceLeadingZeros),
+			minute: "2-digit",
+			timeZone: "UTC"
+		});
+		timeFormatters.set(key, formatter);
+		return formatter;
+	};
+	const getDateTimeFormatter = (locale, options) => IntlUtils.getDateTimeFormatter(getResolvedLocale(locale), {
 		day: getDayMonthFormat(options?.shouldForceLeadingZeros),
 		month: getDayMonthFormat(options?.shouldForceLeadingZeros),
 		year: "numeric",
@@ -40,7 +50,7 @@ var DateTimeUtils;
 		timeZone: "UTC"
 	});
 	const repeatLocalizedFieldLabel = (type, length, locale) => {
-		const placeholderChar = new Intl.DisplayNames(getResolvedLocale(locale), { type: "dateTimeField" }).of(type)?.trim().charAt(0).toLocaleLowerCase(getResolvedLocale(locale));
+		const placeholderChar = IntlUtils.getDisplayNamesFormatter(getResolvedLocale(locale), { type: "dateTimeField" }).of(type)?.trim().charAt(0).toLocaleLowerCase(getResolvedLocale(locale));
 		if (!placeholderChar) return null;
 		return placeholderChar.repeat(length);
 	};

package/dist/utils/intl.utils.d.ts

@@ -0,0 +1,7 @@
+type IntlLocale = Intl.LocalesArgument;
+export declare namespace IntlUtils {
+    const getDateTimeFormatter: (locale?: IntlLocale, options?: Intl.DateTimeFormatOptions) => Intl.DateTimeFormat;
+    const getDisplayNamesFormatter: (locale: IntlLocale, options: Intl.DisplayNamesOptions) => Intl.DisplayNames;
+    const getNumberFormatter: (locale?: IntlLocale, options?: Intl.NumberFormatOptions) => Intl.NumberFormat;
+}
+export {};

package/dist/utils/intl.utils.js

@@ -0,0 +1,38 @@
+//#region src/utils/intl.utils.ts
+var formatterCacheKey = (locale, options) => {
+	const locales = Array.isArray(locale) ? locale.map(String) : locale ? [String(locale)] : [];
+	const normalizedOptions = Object.entries(options ?? {}).sort(([left], [right]) => left.localeCompare(right));
+	return JSON.stringify([locales, normalizedOptions]);
+};
+var IntlUtils;
+(function(_IntlUtils) {
+	const dateTimeFormatters = /* @__PURE__ */ new Map();
+	const displayNamesFormatters = /* @__PURE__ */ new Map();
+	const numberFormatters = /* @__PURE__ */ new Map();
+	_IntlUtils.getDateTimeFormatter = (locale, options) => {
+		const key = formatterCacheKey(locale, options);
+		const cachedFormatter = dateTimeFormatters.get(key);
+		if (cachedFormatter) return cachedFormatter;
+		const formatter = new Intl.DateTimeFormat(locale, options);
+		dateTimeFormatters.set(key, formatter);
+		return formatter;
+	};
+	_IntlUtils.getDisplayNamesFormatter = (locale, options) => {
+		const key = formatterCacheKey(locale, options);
+		const cachedFormatter = displayNamesFormatters.get(key);
+		if (cachedFormatter) return cachedFormatter;
+		const formatter = new Intl.DisplayNames(locale, options);
+		displayNamesFormatters.set(key, formatter);
+		return formatter;
+	};
+	_IntlUtils.getNumberFormatter = (locale, options) => {
+		const key = formatterCacheKey(locale, options);
+		const cachedFormatter = numberFormatters.get(key);
+		if (cachedFormatter) return cachedFormatter;
+		const formatter = new Intl.NumberFormat(locale, options);
+		numberFormatters.set(key, formatter);
+		return formatter;
+	};
+})(IntlUtils || (IntlUtils = {}));
+//#endregion
+export { IntlUtils };

package/dist/utils/intl.utils.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@povio/ui",
-  "version": "3.2.4-rc.1",
+  "version": "3.2.4-rc.10",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",

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

@@ -1,2 +0,0 @@
-import { RefObject } from 'react';
-export declare const usePreserveExternalFocusOnUnmount: (containerRef: RefObject<HTMLElement | null>) => void;