@iress-oss/ids-components 6.3.0 → 6.4.0

package/dist/components/Popover/hooks/useFloatingPopover.js

@@ -1,91 +1,91 @@
 import { GlobalCSSClass as e } from "../../../enums.js";
 import { useControlledState as t } from "../../../hooks/useControlledState.js";
 import { focusableElements as n } from "../../../helpers/dom/focusableElements.js";
-import { C as r, E as i, S as a, T as o, d as s, g as c, l as ee, u as l, w as u, x as d, y as f } from "../../../floating-ui.react-TDMXDOBr.js";
-import { usePopoverNavigation as p } from "./usePopoverNavigation.js";
-import { usePopoverAria as m } from "./usePopoverAria.js";
-import { closestCrossShadow as h } from "../../../helpers/dom/closestCrossShadow.js";
-import { createContext as g, useCallback as _, useMemo as v, useRef as y } from "react";
+import { C as r, E as i, S as a, T as o, d as s, g as c, l, u, w as d, x as f, y as p } from "../../../floating-ui.react-DP-wD-Nz.js";
+import { usePopoverNavigation as m } from "./usePopoverNavigation.js";
+import { usePopoverAria as h } from "./usePopoverAria.js";
+import { closestCrossShadow as g } from "../../../helpers/dom/closestCrossShadow.js";
+import { createContext as _, useCallback as v, useMemo as y, useRef as b } from "react";
 //#region src/components/Popover/hooks/useFloatingPopover.tsx
-var b = 200, x = ({ align: g = "auto", autoHighlight: x = !0, component: S = "IressPopover", defaultShow: C, focusStartIndex: w, hasInputActivator: T, matchActivatorWidth: E, nested: D, offset: O = 5, onActivated: k, onDeactivated: A, onNavigate: j, show: M, type: N, virtualFocus: P }) => {
-	let F = y(!1), I = y(null), { isControlled: L, setValue: R, value: z } = t({
-		component: S,
-		defaultValue: C,
+var x = 200, S = ({ align: _ = "auto", autoHighlight: S = !0, component: C = "IressPopover", defaultShow: w, focusStartIndex: T, hasInputActivator: E, matchActivatorWidth: D, nested: O, offset: k = 5, onActivated: A, onDeactivated: j, onNavigate: ee, show: te, type: M, virtualFocus: N }) => {
+	let P = b(!1), F = b(null), { isControlled: I, setValue: L, value: R } = t({
+		component: C,
+		defaultValue: w,
 		propName: "show",
-		value: M
-	}), B = s({
-		open: z,
+		value: te
+	}), z = y(() => {
+		let t = E ? [r(k), a({ padding: 5 })] : [
+			r(k),
+			_ === "auto" ? f() : a(),
+			d((t) => ({ mainAxis: !g(t.elements.reference, `.${e.Slideout}`) }))
+		];
+		return D ? [...t, o({
+			apply({ rects: e, availableHeight: t, elements: n }) {
+				requestAnimationFrame(() => {
+					Object.assign(n.floating.style, {
+						minWidth: `${e.reference.width}px`,
+						maxHeight: t > x ? `${t}px` : void 0
+					});
+				});
+			},
+			padding: 5
+		})] : t;
+	}, [
+		E,
+		k,
+		_,
+		D
+	]), B = s({
+		open: R,
 		onOpenChange: (e, t, n) => {
-			!e && n === "focus-out" && document.activeElement instanceof Element && document.activeElement.closest("[data-floating-ui-focusable]") != null || (R(e), e ? k?.(t, n, V) : A?.(t, n, V));
+			!e && n === "focus-out" && document.activeElement instanceof Element && document.activeElement.closest("[data-floating-ui-focusable]") != null || (L(e), e ? A?.(t, n, V) : j?.(t, n, V));
 		},
-		middleware: v(() => {
-			let t = T ? [r(O), a({ padding: 5 })] : [
-				r(O),
-				g === "auto" ? d() : a(),
-				u((t) => ({ mainAxis: !h(t.elements.reference, `.${e.Slideout}`) }))
-			];
-			return E ? [...t, o({
-				apply({ rects: e, availableHeight: t, elements: n }) {
-					requestAnimationFrame(() => {
-						Object.assign(n.floating.style, {
-							minWidth: `${e.reference.width}px`,
-							maxHeight: t > b ? `${t}px` : void 0
-						});
-					});
-				},
-				padding: 5
-			})] : t;
-		}, [
-			T,
-			O,
-			g,
-			E
-		]),
-		placement: g === "auto" ? void 0 : g,
+		middleware: z,
+		placement: _ === "auto" ? void 0 : _,
 		whileElementsMounted: i
-	}), { activeIndex: V, list: H, listNav: U, setActiveIndex: W } = p(B.context, N, {
-		focusItemOnOpen: x,
-		virtual: P
-	}, j, w), G = ee(B.context, { enabled: !T }), K = l(B.context, {
+	}), { activeIndex: V, list: H, listNav: U, setActiveIndex: W } = m(B.context, M, {
+		focusItemOnOpen: S,
+		virtual: N
+	}, ee, T), G = l(B.context, { enabled: !E }), K = u(B.context, {
 		enabled: !0,
-		escapeKey: !T
-	}), q = f(B.context, { role: N }), J = m(), Y = c([
+		escapeKey: !E
+	}), q = p(B.context, { role: M }), J = h(), Y = c([
 		G,
 		K,
 		q,
 		U
-	]), X = v(() => P ? {
-		getVirtualFocus: () => I.current,
+	]), X = y(() => N ? {
+		getVirtualFocus: () => F.current,
 		setVirtualFocus: (e) => {
-			I.current = e;
+			F.current = e;
 		}
-	} : {}, [P]), Z = _(() => {
+	} : {}, [N]), Z = v(() => {
 		let e = B.elements.reference;
 		return e?.querySelector("[role=combobox]") ?? n(e)[0];
-	}, [B.elements.reference]), Q = _((e) => !e || !z ? !1 : e === Z(), [Z, z]), $ = _(() => {
-		W(w ?? null);
-	}, [w, W]);
-	return v(() => ({
+	}, [B.elements.reference]), Q = v((e) => !e || !R ? !1 : e === Z(), [Z, R]), $ = v(() => {
+		W(T ?? null);
+	}, [T, W]);
+	return y(() => ({
 		activeIndex: V,
 		...J,
 		api: B,
 		getFocusableActivator: Z,
-		hasInnerRole: () => F.current,
+		hasInnerRole: () => P.current,
 		interactions: Y,
 		isActiveActivator: Q,
-		isControlled: L,
-		isVirtualFocus: !!P,
+		isControlled: I,
+		isVirtualFocus: !!N,
 		list: H,
-		nested: !!D,
+		nested: !!O,
 		resetActiveIndex: $,
 		setActiveIndex: W,
-		setShow: R,
+		setShow: L,
 		setShowWithReason: B.context.onOpenChange,
 		setHasInnerRole: (e) => {
-			F.current = e;
+			P.current = e;
 		},
-		show: !!z,
-		type: N,
+		show: !!R,
+		type: M,
 		...X
 	}), [
 		V,
@@ -94,17 +94,17 @@ var b = 200, x = ({ align: g = "auto", autoHighlight: x = !0, component: S = "Ir
 		Z,
 		Y,
 		Q,
-		L,
+		I,
 		H,
-		D,
+		O,
 		$,
 		W,
+		L,
 		R,
-		z,
-		N,
+		M,
 		X,
-		P
+		N
 	]);
-}, S = g(void 0);
+}, C = _(void 0);
 //#endregion
-export { S as FloatingPopoverContext, x as useFloatingPopover };
+export { C as FloatingPopoverContext, S as useFloatingPopover };

package/dist/components/Popover/hooks/usePopoverItem.js

@@ -1,4 +1,4 @@
-import { _ as e } from "../../../floating-ui.react-TDMXDOBr.js";
+import { _ as e } from "../../../floating-ui.react-DP-wD-Nz.js";
 import { FloatingPopoverContext as t } from "./useFloatingPopover.js";
 import { useContext as n, useEffect as r, useId as i, useMemo as a } from "react";
 //#region src/components/Popover/hooks/usePopoverItem.tsx

package/dist/components/Popover/hooks/usePopoverNavigation.js

@@ -1,4 +1,4 @@
-import { v as e } from "../../../floating-ui.react-TDMXDOBr.js";
+import { v as e } from "../../../floating-ui.react-DP-wD-Nz.js";
 import { useEffect as t, useMemo as n, useRef as r, useState as i } from "react";
 //#region src/components/Popover/hooks/usePopoverNavigation.tsx
 var a = (a, o, s, c, l = 0) => {

package/dist/components/Progress/Progress.js

@@ -1,7 +1,7 @@
-import { t as e } from "../../css-R34N3rft.js";
+import { t as e } from "../../css-BRrgGHqo.js";
 import { t } from "../../cx-QcEwjve6.js";
-import { n } from "../../is-valid-prop-BVyYPT21.js";
-import { t as r } from "../../factory-BKr3zaf6.js";
+import { n } from "../../is-valid-prop-CvqUuuBB.js";
+import { t as r } from "../../factory-Dbc35N0_.js";
 import { GlobalCSSClass as i } from "../../enums.js";
 import { stringReplacer as a } from "../../helpers/formatting/stringReplacer.js";
 import { progress as o } from "./Progress.styles.js";

package/dist/components/Progress/Progress.styles.js

@@ -1,4 +1,4 @@
-import { n as e } from "../../cva-DcOwIar2.js";
+import { n as e } from "../../cva-1V8NmPTA.js";
 //#region src/components/Progress/Progress.styles.ts
 var t = e({ base: {
 	contain: "layout style paint",

package/dist/components/Radio/Radio.js

@@ -1,7 +1,7 @@
-import { t as e } from "../../css-R34N3rft.js";
+import { t as e } from "../../css-BRrgGHqo.js";
 import { t } from "../../cx-QcEwjve6.js";
-import { n } from "../../is-valid-prop-BVyYPT21.js";
-import { t as r } from "../../factory-BKr3zaf6.js";
+import { n } from "../../is-valid-prop-CvqUuuBB.js";
+import { t as r } from "../../factory-Dbc35N0_.js";
 import { GlobalCSSClass as i } from "../../enums.js";
 import { IressText as a } from "../Text/Text.js";
 import { propagateTestid as o } from "../../helpers/utility/propagateTestid.js";

package/dist/components/Radio/Radio.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../sva-DGhdmNso.js";
+import { t as e } from "../../sva-CG-TbBow.js";
 //#region src/components/Radio/Radio.styles.ts
 var t = e({
 	slots: [

package/dist/components/RadioGroup/RadioGroup.js

@@ -1,5 +1,5 @@
 import { t as e } from "../../cx-QcEwjve6.js";
-import { t } from "../../factory-BKr3zaf6.js";
+import { t } from "../../factory-Dbc35N0_.js";
 import { GlobalCSSClass as n } from "../../enums.js";
 import { useControlledState as r } from "../../hooks/useControlledState.js";
 import { useNoDefaultValueInForms as i } from "../../patterns/Form/hooks/useNoDefaultValueInForms.js";

package/dist/components/RadioGroup/RadioGroup.styles.js

@@ -1,4 +1,4 @@
-import { n as e } from "../../cva-DcOwIar2.js";
+import { n as e } from "../../cva-1V8NmPTA.js";
 //#region src/components/RadioGroup/RadioGroup.styles.ts
 var t = e({
 	base: {},

package/dist/components/RadioMark/RadioMark.js

@@ -1,6 +1,6 @@
-import { t as e } from "../../css-R34N3rft.js";
+import { t as e } from "../../css-BRrgGHqo.js";
 import { t } from "../../cx-QcEwjve6.js";
-import { n } from "../../is-valid-prop-BVyYPT21.js";
+import { n } from "../../is-valid-prop-CvqUuuBB.js";
 import { GlobalCSSClass as r } from "../../enums.js";
 import { radioMark as i } from "./RadioMark.styles.js";
 import { jsx as a } from "react/jsx-runtime";

package/dist/components/RadioMark/RadioMark.styles.js

@@ -1,4 +1,4 @@
-import { n as e } from "../../cva-DcOwIar2.js";
+import { n as e } from "../../cva-1V8NmPTA.js";
 //#region src/components/RadioMark/RadioMark.styles.ts
 var t = e({
 	base: {

package/dist/components/Readonly/Readonly.js

@@ -1,8 +1,8 @@
-import { t as e } from "../../css-R34N3rft.js";
+import { t as e } from "../../css-BRrgGHqo.js";
 import { t } from "../../cx-QcEwjve6.js";
-import { n } from "../../is-valid-prop-BVyYPT21.js";
+import { n } from "../../is-valid-prop-CvqUuuBB.js";
 import { GlobalCSSClass as r } from "../../enums.js";
-import { t as i } from "../../Button-BY2qzshw.js";
+import { t as i } from "../../Button-x1_YRAyD.js";
 import { propagateTestid as a } from "../../helpers/utility/propagateTestid.js";
 import { IressSpinner as o } from "../Spinner/Spinner.js";
 import { getFormControlValueAsStringIfDefined as s } from "../../helpers/form/getFormControlValueAsStringIfDefined.js";

package/dist/components/Readonly/Readonly.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../sva-DGhdmNso.js";
+import { t as e } from "../../sva-CG-TbBow.js";
 //#region src/components/Readonly/Readonly.styles.ts
 var t = e({
 	slots: [

package/dist/components/Row/Row.js

@@ -1,5 +1,5 @@
 import { t as e } from "../../cx-QcEwjve6.js";
-import { t } from "../../factory-BKr3zaf6.js";
+import { t } from "../../factory-Dbc35N0_.js";
 import { GlobalCSSClass as n } from "../../enums.js";
 import { row as r } from "./Row.styles.js";
 import { jsx as i } from "react/jsx-runtime";

package/dist/components/Row/Row.styles.js

@@ -1,4 +1,4 @@
-import { n as e } from "../../cva-DcOwIar2.js";
+import { n as e } from "../../cva-1V8NmPTA.js";
 //#region src/components/Row/Row.styles.ts
 var t = e({ base: {
 	display: "flex",

package/dist/components/Select/Select.d.ts

@@ -21,6 +21,7 @@ type SelectChangeEvent<TMultiple extends boolean = false, TNative extends boolea
 }, value?: ControlledValue<FormControlValue, TMultiple>, labelValue?: ControlledValue<LabelValueMeta, TMultiple>) => void : (e: ChangeEvent<HTMLSelectElement>, value?: ControlledValue<FormControlValue, TMultiple>, labelValue?: ControlledValue<LabelValueMeta, TMultiple>) => void;
 export type SelectRef<TNative extends boolean | Breakpoints = false> = TNative extends false ? Partial<PopoverRef> & ReactHookFormCompatibleRef : ReactHookFormCompatibleRef<HTMLSelectElement>;
 type SelectProps<TNative extends boolean | Breakpoints = false> = TNative extends false ? Omit<IressPopoverProps, 'activator' | 'children' | 'contentClassName' | 'defaultShow' | 'defaultValue' | 'onChange' | 'matchActivatorWidth' | 'show' | 'width'> & Omit<AutocompleteSearchHookProps, 'disabled' | 'query'> & Pick<IressSelectActivatorProps, 'append' | 'prepend' | 'selectedOptionsText'> : Omit<NativeSelectProps, 'value' | 'onChange' | 'options'>;
+type SelectSearchInputProps = Pick<IressInputProps, 'className' | 'data-testid' | 'inputMode' | 'maxLength' | 'minLength' | 'pattern' | 'spellCheck'>;
 export type IressSelectProps<TMultiple extends boolean = false, TNative extends boolean | Breakpoints = false> = SelectProps<TNative> & {
     /**
      * Sets the alignment of the dropdown relative to the activator element.
@@ -91,6 +92,15 @@ export type IressSelectProps<TMultiple extends boolean = false, TNative extends
      * Completely customise the rendering of the select options.
      */
     renderOptions?: (props: SelectOptionsRenderProps<TMultiple>) => ReactNode;
+    /**
+     * Passive props to apply to the internal async search input shown when
+     * `options` is a function, such as input constraints and non-interactive
+     * presentation props. Supported keys are `className`, `data-testid`,
+     * `inputMode`, `maxLength`, `minLength`, `pattern`, and `spellCheck`.
+     * Selection state, query updates, built-in placeholder text, and
+     * accessibility labelling remain controlled by `IressSelect`.
+     */
+    searchInputProps?: SelectSearchInputProps;
     /**
      * Whether its required. Will be passed to the hidden input.
      */

package/dist/components/Select/Select.js

@@ -1,2 +1,2 @@
-import { n as e } from "../../Autocomplete-ZqkibVwt.js";
+import { n as e } from "../../Autocomplete-CfNw4UXr.js";
 export { e as IressSelect };

package/dist/components/Select/Select.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../sva-DGhdmNso.js";
+import { t as e } from "../../sva-CG-TbBow.js";
 //#region src/components/Select/Select.styles.ts
 var t = e({
 	slots: [

package/dist/components/Select/SelectBody/SelectBody.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../sva-DGhdmNso.js";
+import { t as e } from "../../../sva-CG-TbBow.js";
 //#region src/components/Select/SelectBody/SelectBody.styles.ts
 var t = e({
 	slots: ["selectBody", "children"],

package/dist/components/Select/SelectHeading/SelectHeading.js

@@ -1,6 +1,6 @@
 import { t as e } from "../../../cx-QcEwjve6.js";
 import { GlobalCSSClass as t } from "../../../enums.js";
-import { t as n } from "../../../Button-BY2qzshw.js";
+import { t as n } from "../../../Button-x1_YRAyD.js";
 import { usePopoverItem as r } from "../../Popover/hooks/usePopoverItem.js";
 import { select as i } from "../Select.styles.js";
 import { IressMenuHeading as a } from "../../Menu/MenuHeading/MenuHeading.js";

package/dist/components/Select/SelectLabel/SelectLabel.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../sva-DGhdmNso.js";
+import { t as e } from "../../../sva-CG-TbBow.js";
 //#region src/components/Select/SelectLabel/SelectLabel.styles.ts
 var t = e({
 	slots: [

package/dist/components/Select/SelectMenu/SelectMenu.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../sva-DGhdmNso.js";
+import { t as e } from "../../../sva-CG-TbBow.js";
 //#region src/components/Select/SelectMenu/SelectMenu.styles.ts
 var t = e({
 	slots: ["root"],

package/dist/components/Select/SelectSearch/SelectSearch.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../sva-DGhdmNso.js";
+import { t as e } from "../../../sva-CG-TbBow.js";
 //#region src/components/Select/SelectSearch/SelectSearch.styles.ts
 var t = e({
 	slots: ["root", "content"],

package/dist/components/Select/SelectSearchInput/SelectSearchInput.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../sva-DGhdmNso.js";
+import { t as e } from "../../../sva-CG-TbBow.js";
 //#region src/components/Select/SelectSearchInput/SelectSearchInput.styles.ts
 var t = e({
 	slots: ["root"],

package/dist/components/Select/SelectTags/SelectTags.js

@@ -1,7 +1,7 @@
 import { t as e } from "../../../cx-QcEwjve6.js";
 import { GlobalCSSClass as t } from "../../../enums.js";
 import { IressIcon as n } from "../../Icon/Icon.js";
-import { t as r } from "../../../Button-BY2qzshw.js";
+import { t as r } from "../../../Button-x1_YRAyD.js";
 import { IressText as i } from "../../Text/Text.js";
 import { propagateTestid as a } from "../../../helpers/utility/propagateTestid.js";
 import { toArray as o } from "../../../helpers/formatting/toArray.js";

package/dist/components/Select/SelectTags/SelectTags.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../sva-DGhdmNso.js";
+import { t as e } from "../../../sva-CG-TbBow.js";
 //#region src/components/Select/SelectTags/SelectTags.styles.ts
 var t = e({
 	slots: [

package/dist/components/Select/components/NativeSelect.js

@@ -1,6 +1,6 @@
-import { t as e } from "../../../css-R34N3rft.js";
+import { t as e } from "../../../css-BRrgGHqo.js";
 import { t } from "../../../cx-QcEwjve6.js";
-import { n } from "../../../is-valid-prop-BVyYPT21.js";
+import { n } from "../../../is-valid-prop-CvqUuuBB.js";
 import { GlobalCSSClass as r } from "../../../enums.js";
 import { propagateTestid as i } from "../../../helpers/utility/propagateTestid.js";
 import { useIdIfNeeded as a } from "../../../hooks/useIdIfNeeded.js";

package/dist/components/Select/components/NativeSelect.styles.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../../sva-DGhdmNso.js";
+import { t as e } from "../../../sva-CG-TbBow.js";
 var t = e({
 	slots: [
 		"wrapper",

package/dist/components/Select/components/SelectOptions.d.ts

@@ -1,11 +1,11 @@
 import { IressSelectProps, SelectOptionsRenderProps } from '../Select';
-interface SelectOptionsProps<TMultiple extends boolean = false> extends Pick<IressSelectProps<TMultiple, false>, 'autoHighlight' | 'errorText' | 'minSearchLength' | 'multiSelect' | 'onChange' | 'options' | 'renderOptions' | 'initialOptions'>, Omit<SelectOptionsRenderProps<TMultiple>, 'close' | 'handleClear' | 'handleMenuChange'> {
+interface SelectOptionsProps<TMultiple extends boolean = false> extends Pick<IressSelectProps<TMultiple, false>, 'autoHighlight' | 'errorText' | 'minSearchLength' | 'multiSelect' | 'onChange' | 'options' | 'renderOptions' | 'initialOptions' | 'searchInputProps'>, Omit<SelectOptionsRenderProps<TMultiple>, 'close' | 'handleClear' | 'handleMenuChange'> {
     setShow: (show: boolean) => void;
     shouldShowInstructions?: boolean;
     shouldShowNoResults?: boolean;
 }
 export declare const SelectOptions: {
-    <TMultiple extends boolean = false>({ autoHighlight, debouncedQuery, error, errorText, initialOptions: initialOptionsProp, loading, minSearchLength, multiSelect, onChange, options, query, renderOptions, results, setQuery, setShow, setValue, show, shouldShowInstructions, shouldShowNoResults, value, }: SelectOptionsProps<TMultiple>): string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+    <TMultiple extends boolean = false>({ autoHighlight, debouncedQuery, error, errorText, initialOptions: initialOptionsProp, loading, minSearchLength, multiSelect, onChange, options, query, renderOptions, results, searchInputProps, setQuery, setShow, setValue, show, shouldShowInstructions, shouldShowNoResults, value, }: SelectOptionsProps<TMultiple>): string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
     displayName: string;
 };
 export {};