@povio/ui 3.2.2-rc.6 → 3.2.2

package/dist/components/inputs/File/shared/FileUploadContentLoading.js

@@ -12,142 +12,175 @@ import { clsx } from "clsx";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/File/shared/FileUploadContentLoading.tsx
 var FileUploadContentLoading = (t0) => {
-	const $ = c(57);
-	const { index, variant, as, state, isDisabled, singleFile, onCancel } = t0;
+	const $ = c(72);
+	const { index, variant, as, state, isDisabled, singleFile, onCancel, cancelButtonProps } = t0;
 	const { t } = useTranslation("ui");
-	const t1 = variant === "vertical";
-	const t2 = variant === "horizontal";
-	const t3 = as === "button";
+	let t1;
+	if ($[0] !== cancelButtonProps) {
+		t1 = cancelButtonProps ?? {};
+		$[0] = cancelButtonProps;
+		$[1] = t1;
+	} else t1 = $[1];
+	let cancelButtonClassName;
+	let cancelButtonRestProps;
+	let t2;
+	let t3;
 	let t4;
-	if ($[0] !== t1 || $[1] !== t2 || $[2] !== t3) {
-		t4 = clsx("flex w-full flex-col items-center", {
-			"flex-col": t1,
-			"flex-row": t2,
-			"gap-file-upload-content-gap-content-to-button": t3
+	let t5;
+	if ($[2] !== t1) {
+		({className: cancelButtonClassName, color: t2, size: t3, variant: t4, width: t5, ...cancelButtonRestProps} = t1);
+		$[2] = t1;
+		$[3] = cancelButtonClassName;
+		$[4] = cancelButtonRestProps;
+		$[5] = t2;
+		$[6] = t3;
+		$[7] = t4;
+		$[8] = t5;
+	} else {
+		cancelButtonClassName = $[3];
+		cancelButtonRestProps = $[4];
+		t2 = $[5];
+		t3 = $[6];
+		t4 = $[7];
+		t5 = $[8];
+	}
+	const cancelButtonColor = t2 === void 0 ? "secondary" : t2;
+	const cancelButtonSize = t3 === void 0 ? "xs" : t3;
+	const cancelButtonVariant = t4 === void 0 ? "outlined" : t4;
+	const cancelButtonWidth = t5 === void 0 ? "hug" : t5;
+	const t6 = variant === "vertical";
+	const t7 = variant === "horizontal";
+	const t8 = as === "button";
+	let t9;
+	if ($[9] !== t6 || $[10] !== t7 || $[11] !== t8) {
+		t9 = clsx("flex w-full flex-col items-center", {
+			"flex-col": t6,
+			"flex-row": t7,
+			"gap-file-upload-content-gap-content-to-button": t8
 		});
-		$[0] = t1;
-		$[1] = t2;
-		$[2] = t3;
-		$[3] = t4;
-	} else t4 = $[3];
-	const t5 = variant === "vertical";
-	const t6 = variant === "horizontal";
-	let t7;
-	if ($[4] !== isDisabled || $[5] !== t5 || $[6] !== t6) {
-		t7 = clsx("flex w-full items-center justify-between", {
-			"flex-col gap-file-upload-content-gap-text-to-progress": t5,
-			"flex-row gap-file-upload-content-gap-left-to-right-content": t6,
+		$[9] = t6;
+		$[10] = t7;
+		$[11] = t8;
+		$[12] = t9;
+	} else t9 = $[12];
+	const t10 = variant === "vertical";
+	const t11 = variant === "horizontal";
+	let t12;
+	if ($[13] !== isDisabled || $[14] !== t10 || $[15] !== t11) {
+		t12 = clsx("flex w-full items-center justify-between", {
+			"flex-col gap-file-upload-content-gap-text-to-progress": t10,
+			"flex-row gap-file-upload-content-gap-left-to-right-content": t11,
 			"opacity-50": isDisabled
 		});
-		$[4] = isDisabled;
-		$[5] = t5;
-		$[6] = t6;
-		$[7] = t7;
-	} else t7 = $[7];
-	const t8 = variant === "vertical";
-	const t9 = variant === "horizontal";
-	let t10;
-	if ($[8] !== t8 || $[9] !== t9) {
-		t10 = clsx("flex items-center gap-file-upload-content-gap-icon-to-content", {
-			"w-full flex-col": t8,
-			"w-1/2": t9
+		$[13] = isDisabled;
+		$[14] = t10;
+		$[15] = t11;
+		$[16] = t12;
+	} else t12 = $[16];
+	const t13 = variant === "vertical";
+	const t14 = variant === "horizontal";
+	let t15;
+	if ($[17] !== t13 || $[18] !== t14) {
+		t15 = clsx("flex items-center gap-file-upload-content-gap-icon-to-content", {
+			"w-full flex-col": t13,
+			"w-1/2": t14
 		});
-		$[8] = t8;
-		$[9] = t9;
-		$[10] = t10;
-	} else t10 = $[10];
-	let t11;
-	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
-		t11 = /* @__PURE__ */ jsx(FileIcon, { className: "h-6 w-6 text-text-default-1" });
-		$[11] = t11;
-	} else t11 = $[11];
-	const t12 = variant === "vertical";
-	const t13 = variant === "horizontal";
-	let t14;
-	if ($[12] !== t12 || $[13] !== t13) {
-		t14 = clsx("flex flex-col", {
-			"max-w-full gap-file-upload-content-gap-icon-to-content text-center": t12,
-			"max-w-[calc(100%-32px)] gap-file-upload-content-gap-text-to-text": t13
-		});
-		$[12] = t12;
-		$[13] = t13;
-		$[14] = t14;
-	} else t14 = $[14];
-	const t15 = state.file?.name ?? state.displayName ?? "";
+		$[17] = t13;
+		$[18] = t14;
+		$[19] = t15;
+	} else t15 = $[19];
 	let t16;
-	if ($[15] !== t15) {
-		t16 = /* @__PURE__ */ jsx(Typography, {
+	if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+		t16 = /* @__PURE__ */ jsx(FileIcon, { className: "h-6 w-6 text-text-default-1" });
+		$[20] = t16;
+	} else t16 = $[20];
+	const t17 = variant === "vertical";
+	const t18 = variant === "horizontal";
+	let t19;
+	if ($[21] !== t17 || $[22] !== t18) {
+		t19 = clsx("flex flex-col", {
+			"max-w-full gap-file-upload-content-gap-icon-to-content text-center": t17,
+			"max-w-[calc(100%-32px)] gap-file-upload-content-gap-text-to-text": t18
+		});
+		$[21] = t17;
+		$[22] = t18;
+		$[23] = t19;
+	} else t19 = $[23];
+	const t20 = state.file?.name ?? state.displayName ?? "";
+	let t21;
+	if ($[24] !== t20) {
+		t21 = /* @__PURE__ */ jsx(Typography, {
 			variant: "prominent-1",
 			size: "label-1",
 			as: "span",
 			className: "self-stretch truncate text-center text-text-default-1",
-			children: t15
+			children: t20
 		});
-		$[15] = t15;
-		$[16] = t16;
-	} else t16 = $[16];
-	const t17 = singleFile ? "label-2" : "label-3";
-	let t18;
-	if ($[17] !== state) {
-		t18 = FileUtils.getFileDisplaySize(state);
-		$[17] = state;
-		$[18] = t18;
-	} else t18 = $[18];
-	let t19;
-	if ($[19] !== t17 || $[20] !== t18) {
-		t19 = /* @__PURE__ */ jsx(Typography, {
+		$[24] = t20;
+		$[25] = t21;
+	} else t21 = $[25];
+	const t22 = singleFile ? "label-2" : "label-3";
+	let t23;
+	if ($[26] !== state) {
+		t23 = FileUtils.getFileDisplaySize(state);
+		$[26] = state;
+		$[27] = t23;
+	} else t23 = $[27];
+	let t24;
+	if ($[28] !== t22 || $[29] !== t23) {
+		t24 = /* @__PURE__ */ jsx(Typography, {
 			variant: "default",
-			size: t17,
+			size: t22,
 			as: "span",
 			className: "text-text-default-2",
-			children: t18
+			children: t23
 		});
-		$[19] = t17;
-		$[20] = t18;
-		$[21] = t19;
-	} else t19 = $[21];
-	let t20;
-	if ($[22] !== t14 || $[23] !== t16 || $[24] !== t19) {
-		t20 = /* @__PURE__ */ jsxs("div", {
-			className: t14,
-			children: [t16, t19]
+		$[28] = t22;
+		$[29] = t23;
+		$[30] = t24;
+	} else t24 = $[30];
+	let t25;
+	if ($[31] !== t19 || $[32] !== t21 || $[33] !== t24) {
+		t25 = /* @__PURE__ */ jsxs("div", {
+			className: t19,
+			children: [t21, t24]
 		});
-		$[22] = t14;
-		$[23] = t16;
-		$[24] = t19;
-		$[25] = t20;
-	} else t20 = $[25];
-	let t21;
-	if ($[26] !== t10 || $[27] !== t20) {
-		t21 = /* @__PURE__ */ jsxs("div", {
-			className: t10,
-			children: [t11, t20]
+		$[31] = t19;
+		$[32] = t21;
+		$[33] = t24;
+		$[34] = t25;
+	} else t25 = $[34];
+	let t26;
+	if ($[35] !== t15 || $[36] !== t25) {
+		t26 = /* @__PURE__ */ jsxs("div", {
+			className: t15,
+			children: [t16, t25]
 		});
-		$[26] = t10;
-		$[27] = t20;
-		$[28] = t21;
-	} else t21 = $[28];
-	const t22 = variant === "horizontal";
-	const t23 = variant === "vertical";
-	let t24;
-	if ($[29] !== t22 || $[30] !== t23) {
-		t24 = clsx("flex items-center gap-1", {
-			"w-1/2": t22,
-			"w-full": t23
+		$[35] = t15;
+		$[36] = t25;
+		$[37] = t26;
+	} else t26 = $[37];
+	const t27 = variant === "horizontal";
+	const t28 = variant === "vertical";
+	let t29;
+	if ($[38] !== t27 || $[39] !== t28) {
+		t29 = clsx("flex items-center gap-1", {
+			"w-1/2": t27,
+			"w-full": t28
 		});
-		$[29] = t22;
-		$[30] = t23;
-		$[31] = t24;
-	} else t24 = $[31];
-	let t25;
-	if ($[32] !== state.progress) {
-		t25 = /* @__PURE__ */ jsx(ProgressBar, { progress: state.progress });
-		$[32] = state.progress;
-		$[33] = t25;
-	} else t25 = $[33];
-	let t26;
-	if ($[34] !== as || $[35] !== index || $[36] !== onCancel || $[37] !== variant) {
-		t26 = (as === "link" || variant === "horizontal") && /* @__PURE__ */ jsx(InlineIconButton, {
+		$[38] = t27;
+		$[39] = t28;
+		$[40] = t29;
+	} else t29 = $[40];
+	let t30;
+	if ($[41] !== state.progress) {
+		t30 = /* @__PURE__ */ jsx(ProgressBar, { progress: state.progress });
+		$[41] = state.progress;
+		$[42] = t30;
+	} else t30 = $[42];
+	let t31;
+	if ($[43] !== as || $[44] !== index || $[45] !== onCancel || $[46] !== variant) {
+		t31 = (as === "link" || variant === "horizontal") && /* @__PURE__ */ jsx(InlineIconButton, {
 			label: "Cancel",
 			color: "secondary",
 			onPress: () => {
@@ -155,65 +188,73 @@ var FileUploadContentLoading = (t0) => {
 			},
 			icon: CloseIcon
 		});
-		$[34] = as;
-		$[35] = index;
-		$[36] = onCancel;
-		$[37] = variant;
-		$[38] = t26;
-	} else t26 = $[38];
-	let t27;
-	if ($[39] !== t24 || $[40] !== t25 || $[41] !== t26) {
-		t27 = /* @__PURE__ */ jsxs("div", {
-			className: t24,
-			children: [t25, t26]
+		$[43] = as;
+		$[44] = index;
+		$[45] = onCancel;
+		$[46] = variant;
+		$[47] = t31;
+	} else t31 = $[47];
+	let t32;
+	if ($[48] !== t29 || $[49] !== t30 || $[50] !== t31) {
+		t32 = /* @__PURE__ */ jsxs("div", {
+			className: t29,
+			children: [t30, t31]
 		});
-		$[39] = t24;
-		$[40] = t25;
-		$[41] = t26;
-		$[42] = t27;
-	} else t27 = $[42];
-	let t28;
-	if ($[43] !== t21 || $[44] !== t27 || $[45] !== t7) {
-		t28 = /* @__PURE__ */ jsxs("div", {
-			className: t7,
-			children: [t21, t27]
+		$[48] = t29;
+		$[49] = t30;
+		$[50] = t31;
+		$[51] = t32;
+	} else t32 = $[51];
+	let t33;
+	if ($[52] !== t12 || $[53] !== t26 || $[54] !== t32) {
+		t33 = /* @__PURE__ */ jsxs("div", {
+			className: t12,
+			children: [t26, t32]
 		});
-		$[43] = t21;
-		$[44] = t27;
-		$[45] = t7;
-		$[46] = t28;
-	} else t28 = $[46];
-	let t29;
-	if ($[47] !== as || $[48] !== index || $[49] !== onCancel || $[50] !== t || $[51] !== variant) {
-		t29 = as === "button" && variant === "vertical" && /* @__PURE__ */ jsx(Button, {
-			variant: "outlined",
-			size: "xs",
-			color: "secondary",
-			width: "hug",
+		$[52] = t12;
+		$[53] = t26;
+		$[54] = t32;
+		$[55] = t33;
+	} else t33 = $[55];
+	let t34;
+	if ($[56] !== as || $[57] !== cancelButtonClassName || $[58] !== cancelButtonColor || $[59] !== cancelButtonRestProps || $[60] !== cancelButtonSize || $[61] !== cancelButtonVariant || $[62] !== cancelButtonWidth || $[63] !== index || $[64] !== onCancel || $[65] !== t || $[66] !== variant) {
+		t34 = as === "button" && variant === "vertical" && /* @__PURE__ */ jsx(Button, {
+			...cancelButtonRestProps,
+			variant: cancelButtonVariant,
+			size: cancelButtonSize,
+			color: cancelButtonColor,
+			width: cancelButtonWidth,
 			onPress: () => {
 				onCancel(index);
 			},
+			className: cancelButtonClassName,
 			children: t(_temp)
 		});
-		$[47] = as;
-		$[48] = index;
-		$[49] = onCancel;
-		$[50] = t;
-		$[51] = variant;
-		$[52] = t29;
-	} else t29 = $[52];
-	let t30;
-	if ($[53] !== t28 || $[54] !== t29 || $[55] !== t4) {
-		t30 = /* @__PURE__ */ jsxs("div", {
-			className: t4,
-			children: [t28, t29]
+		$[56] = as;
+		$[57] = cancelButtonClassName;
+		$[58] = cancelButtonColor;
+		$[59] = cancelButtonRestProps;
+		$[60] = cancelButtonSize;
+		$[61] = cancelButtonVariant;
+		$[62] = cancelButtonWidth;
+		$[63] = index;
+		$[64] = onCancel;
+		$[65] = t;
+		$[66] = variant;
+		$[67] = t34;
+	} else t34 = $[67];
+	let t35;
+	if ($[68] !== t33 || $[69] !== t34 || $[70] !== t9) {
+		t35 = /* @__PURE__ */ jsxs("div", {
+			className: t9,
+			children: [t33, t34]
 		});
-		$[53] = t28;
-		$[54] = t29;
-		$[55] = t4;
-		$[56] = t30;
-	} else t30 = $[56];
-	return t30;
+		$[68] = t33;
+		$[69] = t34;
+		$[70] = t9;
+		$[71] = t35;
+	} else t35 = $[71];
+	return t35;
 };
 function _temp($) {
 	return $.ui.fileUpload.cancel;

package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.js

@@ -19,14 +19,15 @@ var QueryAutocompleteContent = ({ query, queryParams, queryOptions, queryMap, re
 		value,
 		mapInitialToSelectItem: props.mapInitialToSelectItem
 	});
+	const shouldEnableInitialQuery = selectedIdsToResolve.count > 0;
 	const { items, totalItems, isLoading, handleEnableQuery, hasNextPage, fetchNextPage } = useQueryAutocomplete({
 		query,
 		queryParams,
 		queryOptions,
 		mapItems: (data) => getQueryItems(data, queryMap),
-		resolveSelectedItemsWithIds,
+		resolveSelectedItemsWithIds: resolveSelectedItemsWithIds ?? ui.queryAutocomplete?.resolveSelectedItemsWithIds,
 		search,
-		initialQueryState: selectedIdsToResolve.count > 0 ? false : props.isInitialQueryDisabled ?? ui.queryAutocomplete?.isInitialQueryDisabled,
+		initialQueryState: shouldEnableInitialQuery ? false : props.isInitialQueryDisabled ?? ui.queryAutocomplete?.isInitialQueryDisabled,
 		selectedIdsToResolve: selectedIdsToResolve.items
 	});
 	const handleChange = (value_0) => {
@@ -46,6 +47,7 @@ var QueryAutocompleteContent = ({ query, queryParams, queryOptions, queryMap, re
 		isClientSearchDisabled: true,
 		isLoading,
 		onChange: handleChange,
+		searchDebounceDelay: props.searchDebounceDelay ?? ui.queryAutocomplete?.searchDebounceDelay,
 		onMouseEnter: handleEnableQuery,
 		onFocusCapture: handleEnableQuery,
 		leadingContent,

package/dist/components/inputs/Selection/Select/QuerySelect.js

@@ -9,7 +9,7 @@ import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
 //#region src/components/inputs/Selection/Select/QuerySelect.tsx
 var QuerySelectContent = (t0) => {
-	const $ = c(30);
+	const $ = c(31);
 	const { query, queryParams, queryOptions, queryMap, resolveSelectedItemsWithIds, ...props } = t0;
 	const ui = UIConfig.useConfig();
 	const [search, setSearch] = useState("");
@@ -27,37 +27,38 @@ var QuerySelectContent = (t0) => {
 		$[0] = queryMap;
 		$[1] = t1;
 	} else t1 = $[1];
-	const t2 = isSearchable ? search : void 0;
-	const t3 = shouldEnableInitialQuery ? false : props.isInitialQueryDisabled ?? ui.querySelect?.isInitialQueryDisabled;
-	let t4;
-	if ($[2] !== query || $[3] !== queryOptions || $[4] !== queryParams || $[5] !== resolveSelectedItemsWithIds || $[6] !== selectedIdsToResolve.items || $[7] !== t1 || $[8] !== t2 || $[9] !== t3) {
-		t4 = {
+	const t2 = resolveSelectedItemsWithIds ?? ui.querySelect?.resolveSelectedItemsWithIds;
+	const t3 = isSearchable ? search : void 0;
+	const t4 = shouldEnableInitialQuery ? false : props.isInitialQueryDisabled ?? ui.querySelect?.isInitialQueryDisabled;
+	let t5;
+	if ($[2] !== query || $[3] !== queryOptions || $[4] !== queryParams || $[5] !== selectedIdsToResolve.items || $[6] !== t1 || $[7] !== t2 || $[8] !== t3 || $[9] !== t4) {
+		t5 = {
 			query,
 			queryParams,
 			queryOptions,
 			mapItems: t1,
-			resolveSelectedItemsWithIds,
-			search: t2,
-			initialQueryState: t3,
+			resolveSelectedItemsWithIds: t2,
+			search: t3,
+			initialQueryState: t4,
 			selectedIdsToResolve: selectedIdsToResolve.items
 		};
 		$[2] = query;
 		$[3] = queryOptions;
 		$[4] = queryParams;
-		$[5] = resolveSelectedItemsWithIds;
-		$[6] = selectedIdsToResolve.items;
-		$[7] = t1;
-		$[8] = t2;
-		$[9] = t3;
-		$[10] = t4;
-	} else t4 = $[10];
-	const { items, totalItems, isLoading, handleEnableQuery, hasNextPage, fetchNextPage } = useQueryAutocomplete(t4);
+		$[5] = selectedIdsToResolve.items;
+		$[6] = t1;
+		$[7] = t2;
+		$[8] = t3;
+		$[9] = t4;
+		$[10] = t5;
+	} else t5 = $[10];
+	const { items, totalItems, isLoading, handleEnableQuery, hasNextPage, fetchNextPage } = useQueryAutocomplete(t5);
 	let onSearchChange;
 	let selectProps;
 	if ($[11] !== props) {
-		const { isInitialQueryDisabled: _, onSearchChange: t5, ...t6 } = props;
-		onSearchChange = t5;
-		selectProps = t6;
+		const { isInitialQueryDisabled: _, onSearchChange: t6, ...t7 } = props;
+		onSearchChange = t6;
+		selectProps = t7;
 		$[11] = props;
 		$[12] = onSearchChange;
 		$[13] = selectProps;
@@ -65,9 +66,9 @@ var QuerySelectContent = (t0) => {
 		onSearchChange = $[12];
 		selectProps = $[13];
 	}
-	let t5;
+	let t6;
 	if ($[14] !== handleEnableQuery || $[15] !== onSearchChange || $[16] !== setSearch) {
-		t5 = (value_0) => {
+		t6 = (value_0) => {
 			setSearch(value_0);
 			handleEnableQuery();
 			onSearchChange?.(value_0);
@@ -75,31 +76,33 @@ var QuerySelectContent = (t0) => {
 		$[14] = handleEnableQuery;
 		$[15] = onSearchChange;
 		$[16] = setSearch;
-		$[17] = t5;
-	} else t5 = $[17];
-	const handleSearchChange = t5;
-	let t6;
+		$[17] = t6;
+	} else t6 = $[17];
+	const handleSearchChange = t6;
+	const t7 = props.searchDebounceDelay ?? ui.querySelect?.searchDebounceDelay;
+	let t8;
 	if ($[18] !== handleSearchChange || $[19] !== isSearchable) {
-		t6 = isSearchable && {
+		t8 = isSearchable && {
 			isClientSearchDisabled: true,
 			onSearchChange: handleSearchChange
 		};
 		$[18] = handleSearchChange;
 		$[19] = isSearchable;
-		$[20] = t6;
-	} else t6 = $[20];
-	let t7;
-	if ($[21] !== fetchNextPage || $[22] !== handleEnableQuery || $[23] !== hasNextPage || $[24] !== isLoading || $[25] !== items || $[26] !== selectProps || $[27] !== t6 || $[28] !== totalItems) {
-		t7 = /* @__PURE__ */ jsx(Select, {
+		$[20] = t8;
+	} else t8 = $[20];
+	let t9;
+	if ($[21] !== fetchNextPage || $[22] !== handleEnableQuery || $[23] !== hasNextPage || $[24] !== isLoading || $[25] !== items || $[26] !== selectProps || $[27] !== t7 || $[28] !== t8 || $[29] !== totalItems) {
+		t9 = /* @__PURE__ */ jsx(Select, {
 			...selectProps,
 			items,
 			isLoading,
 			totalItems,
 			hasLoadMore: hasNextPage,
 			onLoadMore: fetchNextPage,
+			searchDebounceDelay: t7,
 			onMouseEnter: handleEnableQuery,
 			onFocusCapture: handleEnableQuery,
-			...t6
+			...t8
 		});
 		$[21] = fetchNextPage;
 		$[22] = handleEnableQuery;
@@ -107,11 +110,12 @@ var QuerySelectContent = (t0) => {
 		$[24] = isLoading;
 		$[25] = items;
 		$[26] = selectProps;
-		$[27] = t6;
-		$[28] = totalItems;
-		$[29] = t7;
-	} else t7 = $[29];
-	return t7;
+		$[27] = t7;
+		$[28] = t8;
+		$[29] = totalItems;
+		$[30] = t9;
+	} else t9 = $[30];
+	return t9;
 };
 var QuerySelect = (props) => {
 	const $ = c(16);

package/dist/components/inputs/Selection/shared/SelectBase.d.ts

@@ -26,6 +26,8 @@ export type SelectBaseProps<TKey extends Key = Key, TInitialSelectItem = Default
     selectedTagsType?: "tags" | "list";
     collapseAfter?: number;
     fireBlurOnChange?: boolean;
+    searchDebounceDelay?: number;
+    multiSelectAutoConfirm?: boolean;
     onInputChange?: (value: string) => void;
     onSearchChange?: (value: string) => void;
     mapInitialToSelectItem?: (item: TInitialSelectItem) => SelectItem<TKey>;