@iress-oss/ids-components 6.0.1 → 6.2.0

package/dist/{sva-DOLIp5Dd.js → sva-DGhdmNso.js}

@@ -1,6 +1,6 @@
-import { a as e, c as t, f as n, l as r } from "./css-D3KwXbP0.js";
-import { t as i } from "./cx-CZ8IJJTy.js";
-import { n as a } from "./cva-BWFp4eLV.js";
+import { a as e, c as t, f as n, l as r } from "./css-R34N3rft.js";
+import { t as i } from "./cx-QcEwjve6.js";
+import { n as a } from "./cva-DcOwIar2.js";
 //#region src/styled-system/css/sva.mjs
 function o(o) {
 	let s = Object.entries(t(o)).map(([e, t]) => [e, a(t)]), c = o.defaultVariants ?? {}, l = s.reduce((e, [t, n]) => (o.className && (e[t] = n.config.className), e), {});

package/dist/{useAutocompleteSearch-BJ_hhoKp.js → useAutocompleteSearch-BYzUn7Ag.js}

@@ -79,7 +79,7 @@ function l(e, t, r) {
 }
 //#endregion
 //#region src/components/Autocomplete/hooks/useAutocompleteSearch.tsx
-var u = 500, d = 1, f = (e) => e instanceof Error && e.message ? e.message : typeof e == "string" ? e : !0, p = () => {
+var u = 300, d = 1, f = 250, p = (e) => e instanceof Error && e.message ? e.message : typeof e != "string" || e, m = () => {
 	let [t, r] = o(!1), [i, a] = o(!1), [s, c] = o([]), [l, u] = o(!1);
 	return {
 		loading: t,
@@ -108,75 +108,81 @@ var u = 500, d = 1, f = (e) => e instanceof Error && e.message ? e.message : typ
 			a(!1);
 		}, [])
 	};
-}, m = (e, r) => {
-	let i = a(""), o = n((e) => i.current === e, []), s = n((e) => {
-		i.current = e;
+}, h = (e, r, i) => {
+	let o = a(""), s = a(null), c = n(() => {
+		s.current &&= (clearTimeout(s.current), null);
+	}, []), l = n((e) => o.current === e, []), u = n((e) => {
+		o.current = e;
 	}, []);
 	return {
-		handleAsync: n(async (t, n, i, a = !1) => {
-			if (o(n) && !a) return;
-			let c = ++r.current;
-			if (s(n), n.length >= i || a) {
-				e.setLoadingState(!0), e.clearErrorState();
+		handleAsync: n(async (t, n, a, o = !1) => {
+			if (l(n) && !o) return;
+			let d = ++r.current;
+			if (u(n), n.length >= a || o) {
+				c(), e.clearErrorState(), s.current = setTimeout(() => {
+					e.setLoadingState(!0);
+				}, i);
 				try {
 					let i = await t(n);
-					if (c !== r.current) return;
-					e.setSearched(!0), e.updateWithResults(i, n);
+					if (d !== r.current) return;
+					c(), e.setSearched(!0), e.updateWithResults(i, n);
 				} catch (t) {
-					if (c !== r.current) return;
-					e.setSearched(!0), e.updateWithError(f(t));
+					if (d !== r.current) return;
+					c(), e.setSearched(!0), e.updateWithError(p(t));
 				}
-			} else e.reset();
+			} else c(), e.reset();
 		}, [
 			e,
-			o,
-			s,
-			r
+			l,
+			u,
+			r,
+			c,
+			i
 		]),
 		handleSync: n((n, r, i, a = !1) => {
-			if (!(o(r) && !a)) if (s(r), r.length >= i || a) {
+			if (!(l(r) && !a)) if (u(r), r.length >= i || a) {
 				e.setSearched(!0);
 				let i = t(r, n);
 				e.updateWithResults(i, r);
 			} else e.reset();
 		}, [
 			e,
-			o,
-			s
+			l,
+			u
 		])
 	};
-}, h = ({ debounceThreshold: e = u, disabled: t = !1, initialOptions: i = [], minSearchLength: o = d, options: s = [], query: c = "" }) => {
-	let f = p(), h = m(f, a(0)), [g] = l(c, e), _ = n((e = !1) => {
+}, g = ({ debounceThreshold: e = u, disabled: t = !1, initialOptions: i = [], loadingDelay: o = f, minSearchLength: s = d, options: c = [], query: p = "" }) => {
+	let g = m(), _ = h(g, a(0), o), [v] = l(p, e), y = n((e = !1) => {
 		if (!t) {
-			if (typeof s == "function") {
-				h.handleAsync(s, g, o, e);
+			if (typeof c == "function") {
+				_.handleAsync(c, v, s, e);
 				return;
 			}
-			h.handleSync(s, g, o, e);
+			_.handleSync(c, v, s, e);
 		}
 	}, [
 		t,
-		g,
-		o,
+		v,
 		s,
-		h
+		c,
+		_
 	]);
 	r(() => {
-		t || _();
-	}, [t, _]);
-	let v;
-	return v = t ? Array.isArray(s) ? s : i ?? [] : f.results.length ? f.results : g.length ? [] : i ?? [], {
-		clearError: f.clearError,
-		debouncedQuery: g,
-		error: f.error,
-		loading: t ? !1 : f.loading,
-		shouldShowInstructions: !t && c.length < o && !f.results.length && !i?.length,
-		shouldShowDebounceWaiting: !t && c.length >= o && g.length < o && !f.loading && !f.hasSearched,
-		shouldShowNoResults: !t && f.hasSearched && !f.loading && f.results.length === 0 && c.length >= o,
-		results: v,
-		startSearch: _,
-		stopSearch: f.reset
+		t || y();
+	}, [t, y]);
+	let b;
+	return b = t ? Array.isArray(c) ? c : i ?? [] : g.results.length ? g.results : v.length ? [] : i ?? [], {
+		clearError: g.clearError,
+		debouncedQuery: v,
+		error: g.error,
+		loading: !t && g.loading,
+		shouldShowInstructions: !t && p.length < s && !g.results.length && !i?.length,
+		shouldShowDebounceWaiting: !t && p.length >= s && v.length < s && !g.loading && !g.hasSearched,
+		shouldShowNoResults: !t && g.hasSearched && !g.loading && g.results.length === 0 && p.length >= s,
+		results: b,
+		startSearch: y,
+		stopSearch: g.reset
 	};
 };
 //#endregion
-export { h as t };
+export { g as t };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iress-oss/ids-components",
-  "version": "6.0.1",
+  "version": "6.2.0",
   "description": "Iress React Component Library",
   "license": "Apache-2.0",
   "type": "module",
@@ -43,36 +43,36 @@
     "@types/query-selector-shadow-dom": "1.0.4",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^6.0.1",
-    "@vitest/coverage-v8": "4.1.5",
-    "@vitest/ui": "4.1.5",
+    "@vitejs/plugin-react": "^6.0.3",
+    "@vitest/coverage-v8": "4.1.10",
+    "@vitest/ui": "4.1.10",
     "concurrently": "^9.2.1",
-    "dompurify": "^3.4.1",
-    "eslint": "10.3.0",
+    "dompurify": "^3.4.11",
+    "eslint": "10.6.0",
     "eslint-plugin-file-progress": "^4.0.0",
-    "eslint-plugin-mdx": "3.7.0",
-    "eslint-plugin-prettier": "5.5.5",
+    "eslint-plugin-mdx": "3.8.1",
+    "eslint-plugin-prettier": "5.5.6",
     "eslint-plugin-react-hooks": "^7.1.1",
-    "eslint-plugin-react-refresh": "^0.5.2",
+    "eslint-plugin-react-refresh": "^0.5.3",
     "eslint-plugin-sonarjs": "^4.0.3",
     "glob": "13.0.6",
     "jest-axe": "10.0.0",
     "jsdom": "29.1.1",
     "lightningcss": "^1.32.0",
-    "postcss": "8.5.15",
+    "postcss": "8.5.17",
     "prettier": "^3.8.2",
     "react": "^19.2.6",
     "react-dom": "^19.2.6",
     "react-dropzone": "15.0.0",
     "react-hook-form": "7.72.1",
     "rimraf": "^6.1.3",
-    "storybook": "10.3.6",
+    "storybook": "10.4.6",
     "typescript": "6.0.3",
-    "vite": "8.0.11",
+    "vite": "8.1.4",
     "vite-bundle-visualizer": "^1.2.1",
-    "vite-plugin-dts": "5.0.0",
-    "vite-plugin-static-copy": "4.1.0",
-    "vitest": "4.1.5"
+    "vite-plugin-dts": "5.0.3",
+    "vite-plugin-static-copy": "4.1.1",
+    "vitest": "4.1.10"
   },
   "dependencies": {
     "@floating-ui/react": "0.27.19",
@@ -81,7 +81,7 @@
     "@tanstack/react-virtual": "3.13.12",
     "@types/mdx": "^2.0.13",
     "fuzzysort": "3.1.0",
-    "material-symbols": "0.44.6",
+    "material-symbols": "0.45.6",
     "query-selector-shadow-dom": "1.0.1",
     "use-debounce": "10.1.1"
   },

package/dist/Autocomplete-CuUjmIAw.js

@@ -1,308 +0,0 @@
-import { t as e } from "./cx-CZ8IJJTy.js";
-import { GlobalCSSClass as t } from "./enums.js";
-import { idsLogger as n } from "./helpers/utility/idsLogger.js";
-import { IressIcon as r } from "./components/Icon/Icon.js";
-import { propagateTestid as i } from "./helpers/utility/propagateTestid.js";
-import { toArray as a } from "./helpers/formatting/toArray.js";
-import { useControlledState as o } from "./hooks/useControlledState.js";
-import { useResponsiveProps as ee } from "./hooks/useResponsiveProps.js";
-import { IressPopover as te } from "./components/Popover/Popover.js";
-import { IressInputPopover as s } from "./components/Popover/InputPopover/InputPopover.js";
-import { IressAlert as ne } from "./components/Alert/Alert.js";
-import { autoComplete as re } from "./components/Autocomplete/Autocomplete.styles.js";
-import { getFormControlValueAsStringIfDefined as c } from "./helpers/form/getFormControlValueAsStringIfDefined.js";
-import { useNoDefaultValueInForms as ie } from "./patterns/Form/hooks/useNoDefaultValueInForms.js";
-import { IressReadonly as ae } from "./components/Readonly/Readonly.js";
-import { IressInput as oe } from "./components/Input/Input.js";
-import { getValueAsEvent as l } from "./helpers/form/getValueAsEvent.js";
-import { t as se } from "./useAutocompleteSearch-BJ_hhoKp.js";
-import { AutocompleteInstructions as u } from "./components/Autocomplete/components/AutocompleteInstructions.js";
-import { select as d } from "./components/Select/Select.styles.js";
-import { SelectActivator as f } from "./components/Select/components/SelectActivator.js";
-import { IressSelectMenu as p } from "./components/Select/SelectMenu/SelectMenu.js";
-import { SelectOptions as m } from "./components/Select/components/SelectOptions.js";
-import { SelectHiddenInput as ce } from "./components/Select/components/SelectHiddenInput.js";
-import { NativeSelect as le } from "./components/Select/components/NativeSelect.js";
-import { useSelectState as ue } from "./components/Select/hooks/useSelectState.js";
-import { forwardRef as h, useCallback as g, useEffect as _, useImperativeHandle as de, useMemo as v, useRef as y, useState as b } from "react";
-import { Fragment as fe, jsx as x, jsxs as S } from "react/jsx-runtime";
-//#region src/components/Select/Select.tsx
-var C = (e) => typeof e == "object" && !!e && "label" in e, w = (e, t) => {
-	for (let n of t) if (n.children) {
-		let t = w(e, n.children);
-		if (t) return t;
-	} else if (n.value !== void 0 && n.value === e) return n;
-}, T = (e, t) => {
-	if (C(e)) return e;
-	if (typeof t != "function") return w(e, t) ?? (typeof e == "number" ? w(String(e), t) : void 0);
-}, E = (e, t) => {
-	if (e !== void 0) {
-		if (Array.isArray(e)) {
-			let r = e, i = r.map((e) => T(e, t)).filter((e) => e !== void 0);
-			return i.length < r.length && typeof t != "function" && n(`IressSelect: ${r.length - i.length} value(s) could not be resolved to matching options and were dropped.`, "warn"), i;
-		}
-		return T(e, t);
-	}
-}, D = h(({ align: r = "bottom-start", autoHighlight: i = !0, className: a, defaultValue: o, disabled: s, footer: ne, header: re, id: c, matchActivatorWidth: oe = !0, multiSelect: l, multiSelectLimit: u, name: p, onChange: h, onBlur: w, options: T, native: D, placeholder: O, readOnly: k, renderHiddenInput: A, renderLabel: j, renderOptions: pe, required: M, type: me, value: N, virtualFocus: P, width: F, ...I }, L) => {
-	ie({
-		component: "IressSelect",
-		defaultValue: o
-	});
-	let [R, z] = b(!1), B = R && !s, [V, he] = b(""), H = v(() => E(N, T), [N, T]), ge = v(() => E(o, T), [o, T]);
-	_(() => {
-		N !== void 0 && !C(N) && H === void 0 && typeof T == "function" && n("IressSelect: A primitive value was passed but cannot be resolved because options are asynchronous. Pass a LabelValueMeta object instead when using async options, otherwise the component will behave as uncontrolled.", "warn");
-	}, [
-		N,
-		H,
-		T
-	]);
-	let { value: U, setValue: W, getValuesString: G, getLabelsString: _e } = ue({
-		component: "IressSelect",
-		defaultValue: ge,
-		multiple: l,
-		value: H
-	}), K = y(null), q = y(null), J = y(null), { value: Y } = ee(typeof D == "string" ? {
-		xs: !0,
-		[D]: !1
-	} : { xs: D }, { disabled: !D }), { append: ve, debounceThreshold: X, initialOptions: ye, minSearchLength: be, onActivated: xe, onDeactivated: Se, prepend: Ce, selectedOptionsText: we, ...Z } = I, { debouncedQuery: Te, error: Ee, results: De, stopSearch: Oe, loading: ke, shouldShowInstructions: Ae, shouldShowNoResults: je } = se({
-		debounceThreshold: X,
-		disabled: !R || !!Y,
-		initialOptions: ye,
-		minSearchLength: be,
-		options: T,
-		query: V
-	});
-	de(L, () => Y ? {
-		focus: () => q.current?.focus(),
-		blur: () => q.current?.blur(),
-		input: q.current ?? null
-	} : K.current ? {
-		...K.current,
-		focus: () => K.current?.getActivator()?.focus(),
-		blur: () => K.current?.getActivator()?.blur(),
-		hiddenInput: J.current ?? void 0,
-		input: J.current ?? null
-	} : {
-		hiddenInput: J.current ?? void 0,
-		input: J.current ?? null,
-		focus: () => J.current?.focus(),
-		blur: () => J.current?.blur()
-	}, [Y]), _(() => {
-		R ? xe?.() : Se?.();
-	}, [
-		xe,
-		Se,
-		R
-	]);
-	let Me = g((e) => {
-		if (!w) return;
-		let t = e.currentTarget, n = e.relatedTarget;
-		!R && (!n || !t.contains(n)) && w(e), e.stopPropagation();
-	}, [w, R]);
-	if (k) return /* @__PURE__ */ x(ae, {
-		value: G(),
-		ref: J,
-		variant: k,
-		name: p,
-		disabled: s,
-		required: M,
-		children: _e(", ")
-	});
-	if (Y) {
-		if (T instanceof Function) throw Error("[IressSelect] The native select does not support asynchronous options. Please provide options as an array.");
-		if (l) throw Error("[IressSelect] The native select does not support multiple selection. Please remove the multiSelect prop or use the non-native select.");
-		return /* @__PURE__ */ x(le, {
-			className: e(a, t.Select),
-			"data-testid": Z["data-testid"],
-			disabled: s,
-			id: c,
-			name: p,
-			onChange: (e, t) => {
-				h?.(e, t?.value ?? null, t), W(t);
-			},
-			options: T,
-			placeholder: typeof D == "string" ? O ?? "" : O,
-			style: Z.style,
-			value: U,
-			width: F,
-			ref: q
-		});
-	}
-	let Q = typeof T == "function", Ne = P ?? !Q, Pe = me ?? (Q ? void 0 : "listbox"), $ = d({ width: F }), Fe = () => {
-		z(!0);
-	}, Ie = () => {
-		z(!1), Oe();
-	};
-	return /* @__PURE__ */ S(fe, { children: [/* @__PURE__ */ x(ce, {
-		"data-testid": Z["data-testid"],
-		getValuesString: G,
-		name: p,
-		renderHiddenInput: A,
-		required: M,
-		value: U,
-		disabled: s,
-		ref: J
-	}), /* @__PURE__ */ x(te, {
-		...Z,
-		activator: /* @__PURE__ */ x(f, {
-			append: ve,
-			async: Q,
-			disabled: s,
-			error: Ee,
-			id: c,
-			loading: ke,
-			multiSelect: l,
-			multiSelectLimit: u,
-			onChange: h,
-			placeholder: O,
-			prepend: Ce,
-			renderLabel: j,
-			selectedOptionsText: we,
-			setValue: W,
-			setShow: z,
-			show: R,
-			value: U
-		}),
-		align: r,
-		className: e(a, $.root, t.Select),
-		contentClassName: e($.popoverContent),
-		contentStyle: {
-			...Z.contentStyle,
-			p: "none"
-		},
-		matchActivatorWidth: oe,
-		onActivated: Fe,
-		onDeactivated: Ie,
-		ref: K,
-		show: B,
-		type: Pe,
-		virtualFocus: Ne,
-		onBlur: Me,
-		children: /* @__PURE__ */ S("div", {
-			className: $.wrapper,
-			children: [
-				re,
-				/* @__PURE__ */ x(m, {
-					autoHighlight: i,
-					debouncedQuery: Te,
-					error: Ee,
-					initialOptions: ye,
-					loading: ke,
-					minSearchLength: be,
-					multiSelect: l,
-					onChange: h,
-					options: T,
-					query: V,
-					renderOptions: pe,
-					results: De,
-					setQuery: he,
-					setShow: z,
-					setValue: W,
-					shouldShowInstructions: Ae,
-					shouldShowNoResults: je,
-					show: B,
-					value: U
-				}),
-				ne
-			]
-		})
-	})] });
-});
-D.displayName = "IressSelect";
-//#endregion
-//#region src/components/Autocomplete/Autocomplete.tsx
-var O = h(({ alwaysShowOnFocus: n, append: ee = /* @__PURE__ */ x(r, { name: "search" }), autoComplete: te = "off", autoSelect: ie = !0, className: d, clearable: f = !0, "data-testid": m, debounceThreshold: ce, defaultValue: le, errorText: ue = /* @__PURE__ */ x(ne, {
-	status: "danger",
-	mb: "none",
-	borderRadius: "radius.system.form",
-	children: "An unknown error occurred. Please contact support if the error persists."
-}), initialOptions: h, limitDesktop: g = 12, limitMobile: de = 6, minSearchLength: v, noResultsText: y, onChange: C, onClear: w, onFocus: T, options: E, popoverProps: { autoHighlight: D = !1, append: O, prepend: k, ...A } = {}, readOnly: j, value: pe, ...M }, me) => {
-	let [N, P] = b(!1), { value: F, setValue: I } = o({
-		component: "IressAutocomplete",
-		defaultValue: le,
-		value: pe
-	}), [L, R] = b(!1), { clearError: z, debouncedQuery: B, error: V, loading: he, results: H, startSearch: ge, stopSearch: U, shouldShowInstructions: W, shouldShowNoResults: G } = se({
-		debounceThreshold: ce,
-		initialOptions: h,
-		minSearchLength: v,
-		options: E,
-		query: c(F)
-	});
-	if (_(() => {
-		L && !N && H.length > 0 && F && P(!0);
-	}, [
-		H.length,
-		N,
-		L,
-		F
-	]), _(() => {
-		V && P(!0);
-	}, [V]), j) return /* @__PURE__ */ x(ae, {
-		value: F,
-		variant: j
-	});
-	let _e = (e, t) => {
-		C?.(e, t), I(t), R(!!t);
-	}, K = (e) => {
-		w?.(e), I("");
-	}, q = (e) => {
-		T?.(e), h?.length && P(!0);
-	}, J = (e) => {
-		let t = a(e)?.[0];
-		C?.(l(t?.label), t?.label, t), I(t?.label), P(!1), R(!1);
-	}, Y = () => {
-		(!n || !F) && U(), z(), P(!1), F && R(!1);
-	}, ve = (e) => {
-		M.onKeyDown?.(e), e.key === "ArrowDown" && (!N || !L) && (H.length || ge(!0), R(!0), P(!0));
-	}, X = re({ isEmpty: H.length === 0 && !V && !W && !G });
-	return /* @__PURE__ */ S(s, {
-		...A,
-		activator: /* @__PURE__ */ x(oe, {
-			...M,
-			append: ee,
-			autoComplete: te,
-			clearable: f,
-			"data-testid": i(m, "input"),
-			loading: he,
-			onChange: _e,
-			onClear: K,
-			onFocus: q,
-			onKeyDown: ve,
-			value: F,
-			ref: me
-		}),
-		autoHighlight: D,
-		className: e(d, A.className, X.root, t.Autocomplete),
-		contentClassName: e(A.contentClassName, X.popoverContent),
-		contentStyle: A.contentStyle,
-		"data-testid": m,
-		minLength: 0,
-		onActivated: () => (L || n) && P(!0),
-		onDeactivated: Y,
-		show: N,
-		type: "listbox",
-		focusStartIndex: 0,
-		children: [
-			H.length > 0 && /* @__PURE__ */ S(fe, { children: [
-				k,
-				/* @__PURE__ */ x(p, {
-					changeOnBlur: ie,
-					className: e(X.optionList),
-					"data-testid": i(m, "menu"),
-					items: H,
-					limitDesktop: g,
-					limitMobile: de,
-					onChange: J,
-					selected: { label: B }
-				}),
-				O
-			] }),
-			V && ue,
-			W && !V && /* @__PURE__ */ x(u, { minSearchLength: v ?? 1 }),
-			G && !V && y
-		]
-	});
-});
-O.displayName = "IressAutocomplete";
-//#endregion
-export { D as n, O as t };