@povio/ui 3.4.0-rc.19 → 3.4.0-rc.20

package/dist/components/inputs/Inputs/Form.js

@@ -1,45 +0,0 @@
-import { StringUtils } from "../../../utils/string.utils.js";
-import { ZodUtils } from "../../../utils/zod.utils.js";
-import { getDefaultInputComponentType } from "../../../helpers/dynamicInputs.js";
-import { InputItem } from "./InputItem.js";
-import { useMemo } from "react";
-import { jsx } from "react/jsx-runtime";
-import { z } from "zod";
-//#region src/components/inputs/Inputs/Form.tsx
-const createFieldComponent = (field, schemaKeyType, form) => {
-	return function FieldComponent({ inputType, label, placeholder, ...inputProps }) {
-		const inputDef = {
-			name: field,
-			type: inputType ?? getDefaultInputComponentType(schemaKeyType),
-			label,
-			placeholder,
-			props: {
-				...ZodUtils.unwrapZodType(schemaKeyType) instanceof z.ZodArray ? { selectionMode: "multiple" } : {},
-				...inputProps
-			}
-		};
-		return /* @__PURE__ */ jsx(InputItem, {
-			form,
-			inputDef
-		});
-	};
-};
-function Form({ form, schema, onSubmit, onError, className, children }) {
-	const components = useMemo(() => {
-		const fieldComponents = {};
-		const fields = Object.keys(schema.shape);
-		for (const field of fields) {
-			const componentName = StringUtils.capitalize(String(field));
-			const schemaKeyType = schema.shape[field];
-			fieldComponents[componentName] = createFieldComponent(field, schemaKeyType, form);
-		}
-		return fieldComponents;
-	}, [schema.shape, form]);
-	return /* @__PURE__ */ jsx("form", {
-		onSubmit: form.handleSubmit(onSubmit, onError),
-		className,
-		children: children(components)
-	});
-}
-//#endregion
-export { Form };

package/dist/components/inputs/Inputs/InputItem.d.ts

@@ -1,86 +0,0 @@
-import { UIForm } from "../../../hooks/useForm.js";
-import { FieldValues } from "../shared/form.binding.js";
-import { ControlledCheckboxProps } from "../../checkbox.js";
-import { TextInputComponent } from "../../text-input.js";
-import { ControlledCheckboxGroupProps } from "../../checkbox-group.js";
-import { NumberInputComponent } from "../../number-input.js";
-import { ControlledNumberRangeInputProps } from "../../number-range-input.js";
-import { ControlledPasswordInputProps } from "../../password-input.js";
-import { ControlledTextAreaProps } from "../../text-area.js";
-import { DefaultInitialSelectItem, SelectItem } from "../Selection/shared/select.types.js";
-import { HasRequiredProperty } from "../../../types/common.js";
-import { AutocompleteProps, ControlledAutocompleteProps } from "../../autocomplete.js";
-import { QueryAutocompleteProps, QueryFn } from "../Selection/Autocomplete/queryAutocomplete.types.js";
-import { ControlledSelectProps, SelectProps } from "../Selection/Select/Select.js";
-import { QueryFn as QueryFn$1 } from "../Selection/shared/querySelect.utils.js";
-import { QuerySelectProps } from "../../query-select.js";
-import { ControlledSliderProps } from "../../slider.js";
-import { ControlledToggleProps } from "../../toggle.js";
-import { ControlledDatePickerProps } from "../DateTime/DatePicker/DatePicker.js";
-import { ControlledDateRangePickerProps } from "../DateTime/DateRangePicker/DateRangePicker.js";
-import { ControlledDateTimePickerProps } from "../DateTime/DateTimePicker/DateTimePicker.js";
-import { ControlledTimePickerProps } from "../DateTime/TimePicker/TimePicker.js";
-import "../../../index.js";
-import { Segment } from "../../segment/Segment.js";
-import { ComponentProps, JSXElementConstructor, ReactElement, ReactNode } from "react";
-import { z } from "zod";
-//#region src/components/inputs/Inputs/InputItem.d.ts
-declare const componentRegistry: {
-  readonly toggle: <TFieldValues extends FieldValues>(props: ControlledToggleProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly checkbox: <TFieldValues extends FieldValues>(props: ControlledCheckboxProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly checkboxGroup: <TFieldValues extends FieldValues>(props: ControlledCheckboxGroupProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly numberInput: typeof NumberInputComponent;
-  readonly numberRangeInput: <TFieldValues extends FieldValues>({ renderStaticInput, ...props }: ControlledNumberRangeInputProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly slider: <TFieldValues extends FieldValues, IsRange extends boolean = false>(props: ControlledSliderProps<TFieldValues, IsRange>) => import("react/jsx-runtime").JSX.Element;
-  readonly textInput: typeof TextInputComponent;
-  readonly passwordInput: <TFieldValues extends FieldValues>(props: ControlledPasswordInputProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly textArea: <TFieldValues extends FieldValues>(props: ControlledTextAreaProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly select: {
-    <TKey extends import("react-aria").Key = import("react-aria").Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: SelectProps<TKey, TInitialSelectItem>): ReactElement;
-    <TFieldValues extends FieldValues, TKey extends import("react-aria").Key = import("react-aria").Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: ControlledSelectProps<TFieldValues, TKey, TInitialSelectItem>): ReactElement;
-  };
-  readonly querySelect: <TFieldValues extends FieldValues, TQueryFn extends QueryFn$1, TKey extends import("react-aria").Key = import("react-aria").Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: QuerySelectProps<TFieldValues, TQueryFn, TKey, TInitialSelectItem>) => import("react/jsx-runtime").JSX.Element;
-  readonly autocomplete: {
-    <TKey extends import("react-aria").Key = import("react-aria").Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: AutocompleteProps<TKey, TInitialSelectItem>): ReactElement;
-    <TFieldValues extends FieldValues, TKey extends import("react-aria").Key = import("react-aria").Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: ControlledAutocompleteProps<TFieldValues, TKey, TInitialSelectItem>): ReactElement;
-  };
-  readonly queryAutocomplete: <TFieldValues extends FieldValues, TSelectItem extends SelectItem<any>, TQueryFn extends QueryFn>(props: QueryAutocompleteProps<TFieldValues, TSelectItem, TQueryFn>) => import("react/jsx-runtime").JSX.Element;
-  readonly segment: typeof Segment;
-  readonly datePicker: <TFieldValues extends FieldValues>({ fullIso, granularity, minValue, maxValue, renderStaticInput, ...props }: ControlledDatePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly dateTimePicker: <TFieldValues extends FieldValues>({ fullIso, renderStaticInput, ...props }: ControlledDateTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly timePicker: <TFieldValues extends FieldValues>({ renderStaticInput, ...props }: ControlledTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly dateRangePicker: <TFieldValues extends FieldValues>({ fullIso, minValue, maxValue, renderStaticInput, ...props }: ControlledDateRangePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-  readonly unknown: null;
-};
-type InputComponentRegistry = typeof componentRegistry;
-type InputComponentType = keyof InputComponentRegistry;
-type InputDef<TSchemaType extends Record<string, any>> = { [T in InputComponentType]: T extends "unknown" ? never : { [K in keyof TSchemaType]: TypeBasedInputDef<TSchemaType, T, K> | RenderBasedInputDef<TSchemaType, K>; }[keyof TSchemaType]; }[InputComponentType];
-type TypeBasedInputDef<TSchemaType extends Record<string, any>, T extends InputComponentType, K extends keyof TSchemaType> = {
-  type: T;
-  name: K;
-  label: string;
-  placeholder?: string;
-  inputWrapper?: InputWrapperType;
-  render?: never;
-} & (HasRequiredProperty<InputDefBaseProps<InputComponentProps<T>>> extends true ? {
-  props?: InputDefBaseProps<InputComponentProps<T>>;
-} : {
-  props: InputDefBaseProps<InputComponentProps<T>>;
-});
-interface RenderBasedInputDef<TSchemaType extends Record<string, any>, K extends keyof TSchemaType> {
-  type?: never;
-  name: K;
-  label?: string;
-  placeholder?: string;
-  props?: never;
-  inputWrapper?: never;
-  render: (field: {
-    form: UIForm<TSchemaType>;
-    name: K;
-  }, form: UIForm<TSchemaType>) => ReactElement;
-}
-type InputWrapperType = (children: ReactNode, label: string) => ReactElement;
-type InputComponentProps<T extends InputComponentType> = InputComponentRegistry[T] extends keyof React.JSX.IntrinsicElements | JSXElementConstructor<any> ? ComponentProps<InputComponentRegistry[T]> : null;
-type InputDefBaseProps<TProps> = Omit<TProps, "field" | "label" | "placeholder" | "children">;
-//#endregion
-export { InputComponentProps, InputComponentRegistry, InputComponentType, InputDef, InputDefBaseProps, InputWrapperType };

package/dist/components/inputs/Inputs/Inputs.d.ts

@@ -1,13 +0,0 @@
-import { UIForm } from "../../../hooks/useForm.js";
-import { InputDef } from "./InputItem.js";
-import { ReactNode } from "react";
-import { z } from "zod";
-//#region src/components/inputs/Inputs/Inputs.d.ts
-interface InputsProps<TSchema extends z.ZodObject<any>, TSchemaType extends Record<string, any> = z.infer<TSchema>> {
-  form: UIForm<TSchemaType>;
-  inputDefs: Array<InputDef<TSchemaType>>;
-  children?: (inputs: Record<keyof TSchemaType, ReactNode>) => ReactNode;
-}
-declare function Inputs<TSchema extends z.ZodObject<any>, TSchemaType extends Record<string, any> = z.infer<TSchema>>({ form, inputDefs, children }: InputsProps<TSchema, TSchemaType>): string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element[] | Iterable<ReactNode> | Promise<string | number | bigint | boolean | Iterable<ReactNode> | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | import("react").ReactPortal | null | undefined> | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null | undefined;
-//#endregion
-export { Inputs, InputsProps };

package/dist/components/inputs/RadioGroup/radio.cva.js

@@ -1,85 +0,0 @@
-import { UIOverrides } from "../../../config/uiOverrides.context.js";
-import { uiGroupOutlineClass } from "../../outline.clsx.js";
-import { compoundMapper } from "../../../utils/compoundMapper.js";
-//#region src/components/inputs/RadioGroup/radio.cva.ts
-const radioDefinition = UIOverrides.defineConfig({
-	base: [
-		"flex items-center justify-center border-2",
-		"relative size-3-5 rounded-full p-1-5",
-		"before:absolute before:hidden before:size-1 before:rounded-full",
-		uiGroupOutlineClass
-	],
-	config: {
-		variants: { variant: { default: [
-			"border-interactive-outlined-secondary-on-idle",
-			"group-disabled:border-interactive-outlined-secondary-on-disabled",
-			"group-hover:border-interactive-outlined-secondary-on-hover",
-			"group-pressed:border-interactive-outlined-secondary-on-pressed",
-			"group-selected:border-interactive-contained-primary-idle",
-			"group-selected:bg-interactive-contained-primary-idle",
-			"group-selected:group-disabled:bg-interactive-contained-primary-disabled",
-			"group-selected:group-disabled:border-interactive-contained-primary-disabled",
-			"group-invalid:border-interactive-outlined-error-on-idle",
-			"group-focus-visible:outline-interactive-contained-primary-focus",
-			"before:bg-interactive-contained-primary-on-idle",
-			"group-hover:before:bg-interactive-contained-primary-on-hover",
-			"group-selected:before:block"
-		] } },
-		defaultVariants: { variant: "default" }
-	}
-});
-const radioContentWrapperDefinition = UIOverrides.defineConfig({
-	base: ["relative flex"],
-	config: {
-		variants: {
-			variant: { default: "" },
-			as: {
-				default: "flex-col",
-				floating: "flex-col",
-				filter: "flex-row flex-wrap items-center gap-2",
-				inline: "flex-row flex-wrap items-center gap-2"
-			},
-			hasInputFrame: {
-				true: "gap-2",
-				false: ""
-			}
-		},
-		defaultVariants: {
-			variant: "default",
-			as: "default",
-			hasInputFrame: false
-		}
-	}
-});
-const radioContentRowDefinition = UIOverrides.defineConfig({
-	base: ["flex"],
-	config: {
-		variants: {
-			variant: { default: "" },
-			as: {
-				default: "flex-col",
-				floating: "flex-col",
-				filter: "flex-row flex-wrap items-center gap-2",
-				inline: "flex-row flex-wrap items-center gap-2"
-			},
-			hasInputFrame: {
-				true: "gap-2",
-				false: ""
-			}
-		},
-		defaultVariants: {
-			variant: "default",
-			as: "default",
-			hasInputFrame: false
-		}
-	}
-});
-const radioIndicatorClass = "group flex items-center gap-2";
-const radioTypography = compoundMapper({ default: {
-	size: "label-1",
-	sizeMobile: "label-1",
-	variant: "default"
-} });
-const radioContentClassName = compoundMapper({ default: "text-text-default-2" });
-//#endregion
-export { radioContentClassName, radioContentRowDefinition, radioContentWrapperDefinition, radioDefinition, radioIndicatorClass, radioTypography };

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

@@ -1,40 +0,0 @@
-import { BottomSheetProps } from "../../../bottom-sheet.js";
-import { InputVariantProps } from "../../shared/input.cva.js";
-import { FormFieldProps } from "../../../form-field.js";
-import { DefaultInitialSelectItem, GroupedSelectProps, SelectAsyncProps, SelectItem, SelectNewItemProps, SelectVirtualizationProps } from "./select.types.js";
-import { FocusEventHandler, MouseEventHandler, ReactElement, ReactNode, Ref } from "react";
-import { Key } from "react-aria-components";
-import { AriaButtonProps } from "react-aria";
-//#region src/components/inputs/Selection/shared/SelectBase.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">>;
-};
-//#endregion
-export { SelectBaseProps };

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

@@ -1,38 +0,0 @@
-import { UIConfig } from "../../../../config/uiConfig.context.js";
-import { useBreakpoint } from "../../../../hooks/useBreakpoint.js";
-import { SelectContext } from "./select.context.js";
-import { SelectDesktop } from "./SelectDesktop.js";
-import { SelectMobile } from "./SelectMobile.js";
-import { useMemo } from "react";
-import { jsx } from "react/jsx-runtime";
-//#region src/components/inputs/Selection/shared/SelectBase.tsx
-const SelectBase = (dProps) => {
-	const ui = UIConfig.useConfig();
-	const props = useMemo(() => ({
-		...dProps,
-		selectionMode: dProps.selectionMode ?? ui.select.selectionMode,
-		variant: dProps.variant ?? ui.input.variant,
-		as: dProps.as ?? ui.input.as,
-		size: dProps.size ?? ui.input.size,
-		hideLabel: dProps.hideLabel ?? ui.input.hideLabel,
-		isClearable: dProps.isClearable ?? ui.input.isClearable,
-		isSearchable: dProps.isSearchable ?? ui.select.isSearchable,
-		selectedTagsType: dProps.selectedTagsType ?? ui.select.selectedTagsType,
-		ignoreTriggerWidth: dProps.virtualizerOptions || (dProps.totalItems ?? 0) > 100 || dProps.hasLoadMore ? false : dProps.ignoreTriggerWidth ?? false,
-		collapseAfter: dProps.collapseAfter ?? ui.select.collapseAfter,
-		hideSearchIcon: dProps.hideSearchIcon ?? ui.select.hideSearchIcon,
-		multiSelectAutoConfirm: dProps.multiSelectAutoConfirm ?? ui.select.multiSelectAutoConfirm,
-		isClientSearchDisabled: dProps.ignoreInputValueFiltering ?? dProps.isClientSearchDisabled
-	}), [
-		dProps,
-		ui.input,
-		ui.select
-	]);
-	const isDesktop = useBreakpoint("md");
-	return /* @__PURE__ */ jsx(SelectContext.Provider, {
-		...props,
-		children: isDesktop ? /* @__PURE__ */ jsx(SelectDesktop, { ...props }) : /* @__PURE__ */ jsx(SelectMobile, { ...props })
-	});
-};
-//#endregion
-export { SelectBase };

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

@@ -1,173 +0,0 @@
-import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-import { FormField } from "../../../form-field.js";
-import "./useSelectItems.js";
-import { SelectContext } from "./select.context.js";
-import { SelectInput } from "./SelectInput.js";
-import { SelectListBox } from "./SelectListBox.js";
-import { selectPopoverDefinition } from "./selectDesktop.cva.js";
-import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
-import { popoverDefinition } from "../../../shared/popover.cva.js";
-import { clsx } from "clsx";
-import { Fragment, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { ComboBox, DialogTrigger, Popover } from "react-aria-components";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useLabel, usePreventScroll } from "react-aria";
-import { mergeRefs } from "@react-aria/utils";
-//#region src/components/inputs/Selection/shared/SelectDesktop.tsx
-const SelectDesktop = ({ ref, error, ignoreTriggerWidth, showSelectionContent, inputClassName, containerClassName, leadingContent, trailingContent, customTrigger, onBlur, onMouseEnter, onFocusCapture, ...props }) => {
-	const { label, tooltipText, helperText, isDirty, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, isSearchable, isClearable, isClearableIfDisabled, isLoading, as, size, collapseAfter, selectedTagsType } = props;
-	const popoverCva = UIOverrides.useCva("popover.cva", popoverDefinition);
-	const selectPopoverCva = UIOverrides.useCva("select.popoverCva", selectPopoverDefinition);
-	const formFieldProps = {
-		error,
-		label,
-		tooltipText,
-		helperText,
-		isRequired,
-		rightContent,
-		isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
-		hideLabel,
-		isDisabled,
-		headerClassName,
-		errorClassName
-	};
-	const { labelProps, fieldProps } = useLabel({ label });
-	const triggerRef = useRef(null);
-	const closeComboBoxRef = useRef(null);
-	const wrapperRef = useRef(null);
-	const [popoverWidth, setPopoverWidth] = useState(void 0);
-	const { fieldState, isOpen, setIsOpen, onInputChange, onChange, onClear, onSelectAll, listItems, selectableListItems, selectedIds, isMultiple } = SelectContext.useSelect();
-	usePreventScroll({ isDisabled: !isOpen });
-	useLayoutEffect(() => {
-		if (!isOpen || !wrapperRef.current) return;
-		setPopoverWidth(wrapperRef.current.getBoundingClientRect().width);
-		const observer = new ResizeObserver((entries) => {
-			setPopoverWidth(entries[0].contentRect.width);
-		});
-		observer.observe(wrapperRef.current);
-		return () => {
-			observer.disconnect();
-		};
-	}, [isOpen]);
-	const onSelectionChange = (value) => {
-		if (!value) return;
-		if (value === "all-item-id") {
-			if (selectedIds.length === selectableListItems.length) onClear();
-			else onSelectAll();
-			return;
-		}
-		if (!isMultiple) {
-			onChange(value);
-			return;
-		}
-		if (!Array.isArray(fieldState.value)) {
-			onChange([value]);
-			return;
-		}
-		if (fieldState.value.includes(value)) onChange(fieldState.value.filter((id) => id !== value));
-		else onChange(fieldState.value.concat(value));
-	};
-	const openChangeHandler = (value) => {
-		if (closeComboBoxRef.current && value) {
-			closeComboBoxRef.current.setOpen(false);
-			closeComboBoxRef.current = null;
-		} else setIsOpen(value);
-	};
-	const WrapperComponent = isSearchable ? ComboBox : Fragment;
-	const comboBoxProps = {
-		items: listItems,
-		selectedKey: isMultiple ? null : fieldState.value,
-		onSelectionChange,
-		inputValue: fieldState.inputValue,
-		onInputChange,
-		onOpenChange: openChangeHandler,
-		allowsEmptyCollection: true,
-		isDisabled,
-		isInvalid: !!error,
-		menuTrigger: "focus",
-		className: clsx("group w-full", containerClassName)
-	};
-	const headerProps = {
-		label,
-		tooltipText,
-		helperText,
-		isRequired,
-		rightContent,
-		isHeaderHidden: hideLabel || isHeaderHidden,
-		isDisabled,
-		className: headerClassName,
-		labelProps
-	};
-	const dialogTriggerProps = {
-		isOpen,
-		onOpenChange: setIsOpen
-	};
-	const showPopover = useMemo(() => listItems.filter((item) => !item.isSelectAllItem).length > 0 || isLoading, [listItems, isLoading]);
-	return /* @__PURE__ */ jsx(TooltipWrapper, {
-		as,
-		error,
-		children: /* @__PURE__ */ jsx(WrapperComponent, {
-			...isSearchable ? comboBoxProps : {},
-			children: /* @__PURE__ */ jsxs(FormField, {
-				...formFieldProps,
-				...!isSearchable && {
-					labelProps,
-					className: clsx("group w-full", containerClassName)
-				},
-				as,
-				onMouseEnter,
-				onFocusCapture,
-				ref: wrapperRef,
-				children: [customTrigger ? /* @__PURE__ */ jsx(DialogTrigger, {
-					...dialogTriggerProps,
-					children: /* @__PURE__ */ jsx("div", {
-						...fieldProps,
-						ref: mergeRefs(ref, triggerRef),
-						children: customTrigger
-					})
-				}) : /* @__PURE__ */ jsx(SelectInput, {
-					ref: mergeRefs(ref, triggerRef),
-					placeholder,
-					variant,
-					as,
-					size,
-					isDisabled,
-					isInvalid: !!error,
-					className,
-					hideDropdownIcon,
-					isSearchable,
-					isClearable,
-					isClearableIfDisabled,
-					showSelectionContent,
-					inputClassName,
-					leadingContent,
-					trailingContent,
-					collapseAfter,
-					selectedTagsType,
-					isRequired,
-					isDirty,
-					onBlur,
-					onCloseComboBox: (state) => {
-						if (isSearchable) closeComboBoxRef.current = state;
-					},
-					fieldProps,
-					headerProps
-				}), (!isSearchable || showPopover) && /* @__PURE__ */ jsx(Popover, {
-					triggerRef,
-					isOpen,
-					onOpenChange: setIsOpen,
-					className: selectPopoverCva({}),
-					style: { width: !ignoreTriggerWidth ? popoverWidth : void 0 },
-					offset: 0,
-					children: /* @__PURE__ */ jsx(SelectListBox, {
-						...props,
-						className: clsx(popoverCva({}), "max-h-80! [scrollbar-width:thin]"),
-						autoFocus: !isSearchable
-					})
-				})]
-			})
-		})
-	});
-};
-//#endregion
-export { SelectDesktop };