@povio/ui 3.4.0-rc.4 → 3.4.0-rc.41

package/dist/Segment-DBEeDt5Z.js

@@ -0,0 +1,348 @@
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { f as $5dc95899b306f630$export$c9058316764c140e } from "./utils-D-KKbY-n.js";
+import { i as $4547d1bf40011fdf$export$dd5580ae642f110f, n as $84b7d8702d4ff4a8$export$40258cc1d95ff477, r as $ad999b7f496648d1$export$8deac67f4addf270, t as $efde0372d7a700fe$export$d2b052e7b4be1756 } from "./ToggleButton-C01P8reg.js";
+import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
+import { t as Typography } from "./Typography-AcUd9df8.js";
+import { t as FieldController } from "./form.binding-DLKteDiq.js";
+import { t as FormField } from "./FormField-Cl-t5Wi1.js";
+import { Fragment, useRef } from "react";
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/segment/segment.cva.ts
+const segmentDefinition = UIOverrides.defineConfig({ base: [
+	"group/segment grid w-fit items-center gap-segmented-control-side-segmented-control p-segmented-control-side-segmented-control",
+	"bg-elevation-fill-default-3",
+	"rounded-segmented-control-rounding-segmented-control"
+] });
+const segmentItemDefinition = UIOverrides.defineConfig({
+	base: [
+		"flex items-center justify-center gap-segmented-control-gap-content-icon-to-text transition-all duration-200",
+		"border border-support-transparent-outline",
+		"py-segmented-control-height-segment",
+		"rounded-segmented-control-rounding-segment",
+		"text-interactive-subtle-secondary-on-idle",
+		"hover:border-interactive-subtle-secondary-hover hover:bg-interactive-subtle-secondary-hover hover:text-interactive-subtle-secondary-on-hover",
+		"pressed:border-interactive-subtle-secondary-pressed pressed:bg-interactive-subtle-secondary-pressed pressed:text-interactive-subtle-secondary-on-pressed",
+		"disabled:border-support-transparent-outline disabled:text-interactive-subtle-secondary-on-disabled",
+		"selected:border-interactive-subtle-secondary-toggled-idle selected:bg-interactive-subtle-secondary-toggled-idle selected:text-interactive-subtle-secondary-on-toggled-idle",
+		"selected:disabled:border-interactive-subtle-secondary-toggled-disabled selected:disabled:bg-interactive-subtle-secondary-toggled-disabled selected:disabled:text-interactive-subtle-secondary-on-toggled-disabled"
+	],
+	config: {
+		variants: { iconOnly: {
+			true: "px-segmented-control-height-segment",
+			false: "px-segmented-control-side-segment"
+		} },
+		defaultVariants: { iconOnly: false }
+	}
+});
+//#endregion
+//#region src/components/segment/SegmentItem.tsx
+const SegmentItem = (t0) => {
+	const $ = c(23);
+	let className;
+	let icon;
+	let id;
+	let isDisabled;
+	let label;
+	let props;
+	if ($[0] !== t0) {
+		({label, icon, id, isDisabled, className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = icon;
+		$[3] = id;
+		$[4] = isDisabled;
+		$[5] = label;
+		$[6] = props;
+	} else {
+		className = $[1];
+		icon = $[2];
+		id = $[3];
+		isDisabled = $[4];
+		label = $[5];
+		props = $[6];
+	}
+	const IconComponent = icon;
+	const iconOnly = !!(icon && !label);
+	const segmentItemCva = UIOverrides.useCva("segment.itemCva", segmentItemDefinition);
+	let t1;
+	if ($[7] !== className || $[8] !== iconOnly || $[9] !== segmentItemCva) {
+		t1 = segmentItemCva({
+			iconOnly,
+			className
+		});
+		$[7] = className;
+		$[8] = iconOnly;
+		$[9] = segmentItemCva;
+		$[10] = t1;
+	} else t1 = $[10];
+	let t2;
+	if ($[11] !== IconComponent || $[12] !== icon) {
+		t2 = icon && /* @__PURE__ */ jsx(IconComponent, { className: "size-6" });
+		$[11] = IconComponent;
+		$[12] = icon;
+		$[13] = t2;
+	} else t2 = $[13];
+	let t3;
+	if ($[14] !== label) {
+		t3 = label && /* @__PURE__ */ jsx(Typography, {
+			size: "label-2",
+			as: "span",
+			className: "overflow-hidden text-ellipsis text-center",
+			children: label
+		});
+		$[14] = label;
+		$[15] = t3;
+	} else t3 = $[15];
+	let t4;
+	if ($[16] !== id || $[17] !== isDisabled || $[18] !== props || $[19] !== t1 || $[20] !== t2 || $[21] !== t3) {
+		t4 = /* @__PURE__ */ jsxs($efde0372d7a700fe$export$d2b052e7b4be1756, {
+			...props,
+			id,
+			className: t1,
+			isDisabled,
+			children: [t2, t3]
+		});
+		$[16] = id;
+		$[17] = isDisabled;
+		$[18] = props;
+		$[19] = t1;
+		$[20] = t2;
+		$[21] = t3;
+		$[22] = t4;
+	} else t4 = $[22];
+	return t4;
+};
+//#endregion
+//#region src/components/segment/Segment.tsx
+const SegmentBase = (t0) => {
+	const $ = c(49);
+	let className;
+	let defaultValue;
+	let error;
+	let items;
+	let onChange;
+	let rest;
+	let segmentItemClassName;
+	let value;
+	if ($[0] !== t0) {
+		({className, items, error, onChange, value, defaultValue, segmentItemClassName, ...rest} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = defaultValue;
+		$[3] = error;
+		$[4] = items;
+		$[5] = onChange;
+		$[6] = rest;
+		$[7] = segmentItemClassName;
+		$[8] = value;
+	} else {
+		className = $[1];
+		defaultValue = $[2];
+		error = $[3];
+		items = $[4];
+		onChange = $[5];
+		rest = $[6];
+		segmentItemClassName = $[7];
+		value = $[8];
+	}
+	let t1;
+	if ($[9] !== defaultValue) {
+		t1 = defaultValue ? Array.isArray(defaultValue) ? defaultValue : [defaultValue] : void 0;
+		$[9] = defaultValue;
+		$[10] = t1;
+	} else t1 = $[10];
+	let t2;
+	if ($[11] !== value) {
+		t2 = value ? Array.isArray(value) ? value : [value] : void 0;
+		$[11] = value;
+		$[12] = t2;
+	} else t2 = $[12];
+	let t3;
+	if ($[13] !== rest || $[14] !== t1 || $[15] !== t2) {
+		t3 = {
+			...rest,
+			defaultSelectedKeys: t1,
+			selectedKeys: t2
+		};
+		$[13] = rest;
+		$[14] = t1;
+		$[15] = t2;
+		$[16] = t3;
+	} else t3 = $[16];
+	const props = t3;
+	const buttonGroupRef = useRef(null);
+	const state = $ad999b7f496648d1$export$8deac67f4addf270(props);
+	const { groupProps } = $4547d1bf40011fdf$export$dd5580ae642f110f(props, state, buttonGroupRef);
+	const segmentCva = UIOverrides.useCva("segment.cva", segmentDefinition);
+	let t4;
+	if ($[17] !== error || $[18] !== props.isDisabled) {
+		t4 = {
+			error,
+			label: "",
+			hideLabel: true,
+			isDisabled: props.isDisabled
+		};
+		$[17] = error;
+		$[18] = props.isDisabled;
+		$[19] = t4;
+	} else t4 = $[19];
+	const formFieldProps = t4;
+	let t5;
+	if ($[20] !== onChange || $[21] !== props.selectionMode) {
+		t5 = (keys) => {
+			if (props.selectionMode === "multiple") onChange?.(Array.from(keys.values()));
+			else onChange?.(Array.from(keys.values())[0]);
+		};
+		$[20] = onChange;
+		$[21] = props.selectionMode;
+		$[22] = t5;
+	} else t5 = $[22];
+	const onSelectionChange = t5;
+	let t6;
+	if ($[23] !== items.length) {
+		t6 = items.length > 2 ? Array.from({ length: items.length * 2 - 1 }, _temp).join(" ") : `repeat(${items.length}, 1fr)`;
+		$[23] = items.length;
+		$[24] = t6;
+	} else t6 = $[24];
+	const gridTemplateColumns = t6;
+	let t7;
+	if ($[25] !== className) {
+		t7 = clsx("relative w-full", className);
+		$[25] = className;
+		$[26] = t7;
+	} else t7 = $[26];
+	let t8;
+	if ($[27] !== className || $[28] !== props || $[29] !== segmentCva) {
+		t8 = segmentCva({
+			...props,
+			className
+		});
+		$[27] = className;
+		$[28] = props;
+		$[29] = segmentCva;
+		$[30] = t8;
+	} else t8 = $[30];
+	let t9;
+	if ($[31] !== gridTemplateColumns) {
+		t9 = { gridTemplateColumns };
+		$[31] = gridTemplateColumns;
+		$[32] = t9;
+	} else t9 = $[32];
+	let t10;
+	if ($[33] !== items || $[34] !== props.isDisabled || $[35] !== segmentItemClassName || $[36] !== state) {
+		t10 = items.map((item, index) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SegmentItem, {
+			...item,
+			className: clsx(item.className, segmentItemClassName),
+			isDisabled: item.isDisabled || props.isDisabled,
+			isSelected: state.selectedKeys.has(item.id),
+			onPress: () => {
+				state.toggleKey(item.id);
+			}
+		}), index !== items.length - 1 && items.length > 2 && /* @__PURE__ */ jsx("div", {
+			className: clsx("h-5 w-px rounded-2xl", !state.selectedKeys.has(item.id) && !state.selectedKeys.has(items[index + 1].id) && "bg-elevation-outline-default-1"),
+			children: /* @__PURE__ */ jsx("span", { className: "flex h-full w-px" })
+		})] }, item.id));
+		$[33] = items;
+		$[34] = props.isDisabled;
+		$[35] = segmentItemClassName;
+		$[36] = state;
+		$[37] = t10;
+	} else t10 = $[37];
+	let t11;
+	if ($[38] !== groupProps || $[39] !== onSelectionChange || $[40] !== props || $[41] !== t10 || $[42] !== t8 || $[43] !== t9) {
+		t11 = /* @__PURE__ */ jsx($84b7d8702d4ff4a8$export$40258cc1d95ff477, {
+			...props,
+			...groupProps,
+			ref: buttonGroupRef,
+			onSelectionChange,
+			className: t8,
+			style: t9,
+			children: t10
+		});
+		$[38] = groupProps;
+		$[39] = onSelectionChange;
+		$[40] = props;
+		$[41] = t10;
+		$[42] = t8;
+		$[43] = t9;
+		$[44] = t11;
+	} else t11 = $[44];
+	let t12;
+	if ($[45] !== formFieldProps || $[46] !== t11 || $[47] !== t7) {
+		t12 = /* @__PURE__ */ jsx(FormField, {
+			...formFieldProps,
+			className: t7,
+			children: t11
+		});
+		$[45] = formFieldProps;
+		$[46] = t11;
+		$[47] = t7;
+		$[48] = t12;
+	} else t12 = $[48];
+	return t12;
+};
+const Segment = (props) => {
+	const $ = c(15);
+	if ("field" in props && props.field) {
+		let field;
+		let innerProps;
+		let ref;
+		if ($[0] !== props) {
+			({field, ref, ...innerProps} = props);
+			$[0] = props;
+			$[1] = field;
+			$[2] = innerProps;
+			$[3] = ref;
+		} else {
+			field = $[1];
+			innerProps = $[2];
+			ref = $[3];
+		}
+		let t0;
+		if ($[4] !== innerProps || $[5] !== props.error || $[6] !== props.isDisabled || $[7] !== ref) {
+			t0 = (t1) => {
+				const { field: field_0, fieldState: t2 } = t1;
+				const { error } = t2;
+				return /* @__PURE__ */ jsx(SegmentBase, {
+					...innerProps,
+					ref: $5dc95899b306f630$export$c9058316764c140e(ref, field_0.ref),
+					value: field_0.value,
+					onChange: field_0.onChange,
+					isDisabled: field_0.disabled || props.isDisabled,
+					error: props.error ?? error?.message
+				});
+			};
+			$[4] = innerProps;
+			$[5] = props.error;
+			$[6] = props.isDisabled;
+			$[7] = ref;
+			$[8] = t0;
+		} else t0 = $[8];
+		let t1;
+		if ($[9] !== field.form || $[10] !== field.name || $[11] !== t0) {
+			t1 = /* @__PURE__ */ jsx(FieldController, {
+				control: field.form,
+				name: field.name,
+				render: t0
+			});
+			$[9] = field.form;
+			$[10] = field.name;
+			$[11] = t0;
+			$[12] = t1;
+		} else t1 = $[12];
+		return t1;
+	}
+	let t0;
+	if ($[13] !== props) {
+		t0 = /* @__PURE__ */ jsx(SegmentBase, { ...props });
+		$[13] = props;
+		$[14] = t0;
+	} else t0 = $[14];
+	return t0;
+};
+function _temp(_, i) {
+	return i % 2 === 0 ? "1fr" : "auto";
+}
+//#endregion
+export { segmentDefinition as n, segmentItemDefinition as r, Segment as t };

package/dist/Select-Bm2C6tHz.d.ts

@@ -0,0 +1,15 @@
+import { x as Key } from "./types-ZbFfCz06.js";
+import { n as FieldValues } from "./form.binding-Cu03pQ8Y.js";
+import { a as SelectAsyncProps, n as GroupedSelectControlProps, o as SelectBaseProps, r as GroupedSelectProps, t as DefaultInitialSelectItem } from "./SelectBase-DD8_4B-r.js";
+import { s as OmitDiscriminatedUnion } from "./common-UBFya8WY.js";
+import { ReactElement } from "react";
+//#region src/components/inputs/Selection/Select/Select.d.ts
+type SelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = OmitDiscriminatedUnion<SelectBaseProps<TKey, TInitialSelectItem>, keyof SelectAsyncProps> & {
+  renderStaticInput?: boolean;
+};
+type ControlledSelectProps<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = Omit<SelectProps<TKey, TInitialSelectItem>, keyof GroupedSelectProps> & GroupedSelectControlProps<TFieldValues, TKey, TInitialSelectItem>;
+declare function SelectComponent<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: SelectProps<TKey, TInitialSelectItem>): ReactElement;
+declare function SelectComponent<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: ControlledSelectProps<TFieldValues, TKey, TInitialSelectItem>): ReactElement;
+declare const Select: typeof SelectComponent;
+//#endregion
+export { Select as n, SelectProps as r, ControlledSelectProps as t };

package/dist/Select-CEAQyS48.js

@@ -0,0 +1,155 @@
+import { t as UIConfig } from "./uiConfig.context-BG4jfp9p.js";
+import { l as selectInputTagsContentWrapperDefinition, n as StaticSelectTrailingContent, r as SelectBase, t as getStaticSelectValue } from "./staticSelect.utils-C_e1tJ3T.js";
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { f as $5dc95899b306f630$export$c9058316764c140e } from "./utils-D-KKbY-n.js";
+import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
+import { t as Typography } from "./Typography-AcUd9df8.js";
+import { t as FieldController } from "./form.binding-DLKteDiq.js";
+import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-9V4kd391.js";
+import { memo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/inputs/Selection/Select/Select.tsx
+function SelectInner({ renderStaticInput, isFormControlDisabled, ...props }) {
+	const ui = UIConfig.useConfig();
+	const selectInputTagsContentWrapperCva = UIOverrides.useCva("select.tagsContentWrapperCva", selectInputTagsContentWrapperDefinition);
+	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.select.renderStaticInput ?? ui.renderStaticInput));
+	const rootRef = useRef(null);
+	const { renderRealInput, replayStaticInputChange, replayStaticInputPress } = useStaticInputHandoff({
+		inputRef: rootRef,
+		renderInput,
+		setRenderInput,
+		getFocusTarget: (root) => root.querySelector("[data-type='select-trigger'], input, button, [tabindex]")
+	});
+	const currentValue = props.value;
+	if (!renderInput && props.selectionMode !== "multiple" && !!props.showSelectionContent && currentValue != null) setRenderInput(true);
+	if (!renderInput && !!props.customTrigger) setRenderInput(true);
+	if (!renderInput) {
+		const as = props.as ?? ui.input.as;
+		const size = props.size ?? ui.input.size;
+		let isDisabled = !!props.isDisabled;
+		if (isFormControlDisabled) isDisabled = true;
+		const mode = props.selectionMode ?? ui.select.selectionMode;
+		const isMultiple = mode === "multiple";
+		const { selectedItem, displayValue, isEmpty } = getStaticSelectValue({
+			items: props.items,
+			value: currentValue,
+			selectionMode: mode,
+			initialSelection: props.initialSelection,
+			mapInitialToSelectItem: props.mapInitialToSelectItem,
+			showSelectionContent: props.showSelectionContent,
+			isDisabled,
+			collapseAfter: props.collapseAfter ?? ui.select.collapseAfter,
+			selectedTagsType: props.selectedTagsType ?? ui.select.selectedTagsType
+		});
+		const isSearchable = props.isSearchable ?? ui.select.isSearchable;
+		const trailingContent = /* @__PURE__ */ jsx(StaticSelectTrailingContent, {
+			trailingContent: props.trailingContent,
+			hideDropdownIcon: props.hideDropdownIcon,
+			isDisabled,
+			size
+		});
+		const placeholder = as === "floating" ? null : props.placeholder;
+		const inputValue = !isMultiple && selectedItem ? selectedItem.label : "";
+		const shouldRenderPlaceholderAfterValue = isMultiple && props.placeholder && !isEmpty;
+		const dataAttributes = {
+			dataIsEmpty: isEmpty,
+			dataIsFilled: !isEmpty,
+			dataIsDirty: props.isDirty,
+			dataIsRequired: props.isRequired,
+			dataIsDisabled: isDisabled,
+			dataDisabled: isDisabled,
+			dataInvalid: !!props.error,
+			dataHasSelection: !isEmpty,
+			dataHasSearch: false
+		};
+		const buttonContent = isMultiple && !isEmpty ? /* @__PURE__ */ jsx(Fragment$1, { children: "\xA0" }) : isEmpty ? /* @__PURE__ */ jsx(Typography, {
+			size: "label-1",
+			as: "span",
+			className: "block truncate text-text-default-3",
+			children: placeholder
+		}) : /* @__PURE__ */ jsx(Typography, {
+			size: "label-1",
+			as: "span",
+			className: "block truncate",
+			children: displayValue
+		});
+		return /* @__PURE__ */ jsx(InputFrame, {
+			...props,
+			isDisabled,
+			isLoading: false,
+			className: clsx("w-full", props.containerClassName),
+			inputClassName: clsx(props.className, props.inputClassName),
+			contentWrapperClassName: selectInputTagsContentWrapperCva({ isSearchable }),
+			contentGroup: "select",
+			typographySize: "label-1",
+			labelPlacement: "content-row",
+			dataAttributes,
+			wrapTrailingContent: false,
+			onStaticInteract: renderRealInput,
+			onStaticPress: replayStaticInputPress,
+			leadingContent: props.leadingContent && /* @__PURE__ */ jsx("div", {
+				className: "ml-input-side-default flex shrink-0 items-center",
+				children: props.leadingContent
+			}),
+			showClear: false,
+			trailingContent,
+			children: (dataAttributeProps) => /* @__PURE__ */ jsxs(Fragment$1, { children: [isMultiple && !isEmpty && displayValue, isSearchable ? /* @__PURE__ */ jsx("input", {
+				disabled: isDisabled,
+				tabIndex: -1,
+				role: "combobox",
+				"aria-autocomplete": "list",
+				"aria-controls": `${dataAttributeProps.id}-listbox`,
+				"aria-expanded": false,
+				value: inputValue,
+				placeholder: shouldRenderPlaceholderAfterValue ? props.placeholder : placeholder ?? void 0,
+				className: clsx("w-full flex-1 bg-transparent outline-none placeholder:text-text-default-3 disabled:text-interactive-text-secondary-disabled", props.inputClassName),
+				onChange: (event) => replayStaticInputChange(event.target.value),
+				...dataAttributeProps,
+				"data-rac": true
+			}) : /* @__PURE__ */ jsx("button", {
+				type: "button",
+				disabled: isDisabled,
+				tabIndex: -1,
+				"data-type": "select-trigger",
+				className: clsx("w-full truncate bg-transparent text-start outline-none disabled:text-interactive-text-secondary-disabled", isMultiple && !isEmpty && "absolute inset-0 z-0"),
+				onClick: replayStaticInputPress,
+				...dataAttributeProps,
+				"data-rac": true,
+				children: buttonContent
+			})] })
+		});
+	}
+	return /* @__PURE__ */ jsx(SelectBase, {
+		...props,
+		ref: $5dc95899b306f630$export$c9058316764c140e(props.ref, rootRef)
+	});
+}
+function SelectComponent({ renderStaticInput, ...props }) {
+	if ("field" in props && props.field) {
+		const { field, ref, ...innerProps } = props;
+		const controlWithOptions = field.form;
+		return /* @__PURE__ */ jsx(FieldController, {
+			control: field.form,
+			name: field.name,
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(SelectInner, {
+				...innerProps,
+				ref: $5dc95899b306f630$export$c9058316764c140e(ref, field.ref),
+				value: field.value,
+				onChange: field.onChange,
+				onBlur: field.onBlur,
+				isDirty,
+				isDisabled: field.disabled || props.isDisabled,
+				isFormControlDisabled: !!controlWithOptions._options?.disabled,
+				error: props.error ?? error?.message,
+				renderStaticInput
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx(SelectInner, {
+		...props,
+		renderStaticInput
+	});
+}
+const Select = memo(SelectComponent);
+//#endregion
+export { Select as t };

package/dist/SelectBase-DD8_4B-r.d.ts

@@ -0,0 +1,96 @@
+import { y as AriaButtonProps } from "./types-BT18i837.js";
+import { x as Key } from "./types-ZbFfCz06.js";
+import { t as BottomSheetProps } from "./BottomSheet-BZXBtOHF.js";
+import { n as FieldValues } from "./form.binding-Cu03pQ8Y.js";
+import { t as ControlProps } from "./form.types-qEwMTXTZ.js";
+import { n as FormFieldProps } from "./FormField-Iy2O8A4g.js";
+import { n as InputVariantProps } from "./input.cva-CfgCOIQW.js";
+import { FocusEventHandler, MouseEventHandler, ReactElement, ReactNode, Ref } from "react";
+//#region src/components/inputs/Selection/shared/select.types.d.ts
+type SelectBaseProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = FormFieldProps & GroupedSelectProps<TKey, TInitialSelectItem> & SelectNewItemProps & SelectAsyncProps & SelectVirtualizationProps & InputVariantProps & Pick<AriaButtonProps, "onBlur"> & {
+  ref?: Ref<HTMLDivElement>;
+  className?: string;
+  isDirty?: boolean;
+  placeholder?: string;
+  hideDropdownIcon?: boolean;
+  hideSearchIcon?: boolean;
+  isSearchable?: boolean;
+  isClearable?: boolean;
+  isClearableIfDisabled?: boolean;
+  isClientSearchDisabled?: boolean;
+  ignoreInputValueFiltering?: boolean;
+  ignoreTriggerWidth?: boolean;
+  items: SelectItem<TKey>[];
+  inputClassName?: string;
+  containerClassName?: string;
+  leadingContent?: ReactNode;
+  trailingContent?: ReactNode;
+  customTrigger?: ReactElement;
+  selectedTagsType?: "tags" | "list";
+  collapseAfter?: number;
+  searchDebounceDelay?: number;
+  multiSelectAutoConfirm?: boolean;
+  onInputChange?: (value: string) => void;
+  onSearchChange?: (value: string) => void;
+  mapInitialToSelectItem?: (item: TInitialSelectItem) => SelectItem<TKey>;
+  onMouseEnter?: MouseEventHandler<HTMLDivElement>;
+  onFocusCapture?: FocusEventHandler<HTMLDivElement>;
+  bottomSheetProps?: Partial<Omit<BottomSheetProps, "children" | "isOpen" | "onOpenChange" | "onStateChange" | "label" | "footer">>;
+};
+interface SelectItem<TKey extends Key = Key> {
+  id: TKey;
+  label: string;
+  content?: string | ReactNode;
+  isDisabled?: boolean;
+}
+interface DefaultInitialSelectItem<TKey extends Key = Key> {
+  id: TKey;
+  label?: string;
+  name?: string;
+}
+interface SingleSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> {
+  selectionMode?: "single";
+  value?: TKey | undefined | null;
+  onChange?: (value: TKey | null) => void;
+  showSelectionBar?: never;
+  showSelectAllOption?: never;
+  initialSelection?: TInitialSelectItem | null;
+  showSelectionContent?: boolean;
+}
+interface MultiSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> {
+  selectionMode: "multiple";
+  value?: TKey[];
+  onChange?: (value: TKey[]) => void;
+  showSelectionBar?: boolean;
+  showSelectAllOption?: boolean;
+  initialSelection?: TInitialSelectItem[] | null;
+  showSelectionContent?: never;
+}
+type GroupedSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = MultiSelectProps<TKey, TInitialSelectItem> | SingleSelectProps<TKey, TInitialSelectItem>;
+type GroupedSelectControlProps<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = ({
+  selectionMode: MultiSelectProps["selectionMode"];
+} & ControlProps<MultiSelectProps<TKey, TInitialSelectItem>, TFieldValues>) | ({
+  selectionMode?: SingleSelectProps["selectionMode"];
+} & ControlProps<SingleSelectProps<TKey, TInitialSelectItem>, TFieldValues>);
+interface SelectNewItemProps {
+  showNewItemOption?: boolean;
+  newItemMinLength?: number;
+  onNewItemOption?: (value: string) => void;
+  newItemRender?: (label: string) => ReactElement;
+}
+interface SelectAsyncProps {
+  isLoading?: boolean;
+  hasLoadMore?: boolean;
+  onLoadMore?: () => void;
+}
+interface SelectVirtualizationProps {
+  totalItems?: number;
+  virtualizerOptions?: {
+    rowHeight?: number;
+    estimatedRowHeight?: number;
+    padding?: number;
+    gap?: number;
+  };
+}
+//#endregion
+export { SelectAsyncProps as a, SingleSelectProps as c, MultiSelectProps as i, GroupedSelectControlProps as n, SelectBaseProps as o, GroupedSelectProps as r, SelectItem as s, DefaultInitialSelectItem as t };