@povio/ui 2.2.9-rc.9 → 2.2.10

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

@@ -13,8 +13,8 @@ import { ComboBox, DialogTrigger, Popover } from "react-aria-components";
 import { useLabel, usePreventScroll } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 //#region src/components/inputs/Selection/shared/SelectDesktop.tsx
-var 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, isLoading, as, size, collapseAfter, selectedTagsType } = props;
+var SelectDesktop = ({ ref, error, ignoreTriggerWidth, showSelectionContent, inputClassName, containerClassName, customTrigger, onBlur, ...props }) => {
+	const { label, tooltipText, helperText, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, isSearchable, isClearable, isLoading, as, size, collapseAfter, selectedTagsType } = props;
 	const popoverCva = UIStyle.useCva("popover.cva", popover);
 	const formFieldProps = {
 		error,
@@ -119,8 +119,6 @@ var SelectDesktop = ({ ref, error, ignoreTriggerWidth, showSelectionContent, inp
 					children: /* @__PURE__ */ jsx("div", {
 						...fieldProps,
 						ref: mergeRefs(ref, triggerRef),
-						onMouseEnter,
-						onFocusCapture,
 						children: customTrigger
 					})
 				}) : /* @__PURE__ */ jsx(SelectInput, {
@@ -137,12 +135,8 @@ var SelectDesktop = ({ ref, error, ignoreTriggerWidth, showSelectionContent, inp
 					isClearable,
 					showSelectionContent,
 					inputClassName,
-					leadingContent,
-					trailingContent,
 					collapseAfter,
 					selectedTagsType,
-					isRequired,
-					isDirty,
 					onBlur,
 					onCloseComboBox: (state) => {
 						if (isSearchable) closeComboBoxRef.current = state;

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

@@ -4,12 +4,12 @@ import { FormFieldHeaderProps } from '../../FormField/FormFieldHeader';
 import { SelectBaseProps } from './SelectBase';
 import { SelectItem } from './select.types';
 import { InputVariantProps } from '../../shared/input.cva';
-interface SelectInputProps extends InputVariantProps, Pick<SelectBaseProps, "ref" | "placeholder" | "isDisabled" | "hideDropdownIcon" | "isSearchable" | "isClearable" | "onBlur" | "showSelectionContent" | "inputClassName" | "selectedTagsType" | "collapseAfter" | "isRequired" | "isDirty" | "fireBlurOnChange" | "leadingContent" | "trailingContent" | "onMouseEnter" | "onFocusCapture"> {
+interface SelectInputProps extends InputVariantProps, Pick<SelectBaseProps, "ref" | "placeholder" | "isDisabled" | "hideDropdownIcon" | "isSearchable" | "isClearable" | "onBlur" | "showSelectionContent" | "inputClassName" | "selectedTagsType" | "collapseAfter"> {
     isInvalid?: boolean;
     className?: string;
     fieldProps?: AriaFieldProps;
     headerProps?: FormFieldHeaderProps;
     onCloseComboBox?: (state: ComboBoxState<SelectItem> | null) => void;
 }
-export declare const SelectInput: ({ ref, placeholder, variant, as, size, isDisabled, isInvalid, className, hideDropdownIcon, isSearchable, isClearable, showSelectionContent, inputClassName, fieldProps, headerProps, selectedTagsType, collapseAfter, isRequired, isDirty, onCloseComboBox, onBlur, fireBlurOnChange, leadingContent, trailingContent, onMouseEnter, onFocusCapture, ...props }: SelectInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectInput: ({ ref, placeholder, variant, as, size, isDisabled, isInvalid, className, hideDropdownIcon, isSearchable, isClearable, showSelectionContent, inputClassName, fieldProps, headerProps, selectedTagsType, collapseAfter, onCloseComboBox, onBlur, ...props }: SelectInputProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -14,7 +14,7 @@ import { Button, ComboBoxStateContext, Input } from "react-aria-components";
 import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/Selection/shared/SelectInput.tsx
-var SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvalid, className, hideDropdownIcon, isSearchable, isClearable, showSelectionContent, inputClassName, fieldProps, headerProps, selectedTagsType, collapseAfter, isRequired, isDirty, onCloseComboBox, onBlur, fireBlurOnChange, leadingContent, trailingContent, onMouseEnter, onFocusCapture, ...props }) => {
+var SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvalid, className, hideDropdownIcon, isSearchable, isClearable, showSelectionContent, inputClassName, fieldProps, headerProps, selectedTagsType, collapseAfter, onCloseComboBox, onBlur, ...props }) => {
 	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
 	const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
 	const { t } = useTranslation("ui");
@@ -44,13 +44,9 @@ var SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvalid,
 		if (e.key === "Enter" && !isMultiple && !isLoading && listItems.length === 1 && !listItems[0].isDisabled) {
 			e.preventDefault();
 			onChange(listItems[0].id);
-			if (fireBlurOnChange) onBlur?.({});
 			onCloseComboBox?.(state);
 		}
-		if (e.key === "Backspace" && isMultiple && fieldState.inputValue === "" && Array.isArray(fieldState.value) && fieldState.value.length > 0) {
-			onChange(fieldState.value.slice(0, -1));
-			if (fireBlurOnChange) onBlur?.({});
-		}
+		if (e.key === "Backspace" && isMultiple && fieldState.inputValue === "" && Array.isArray(fieldState.value) && fieldState.value.length > 0) onChange(fieldState.value.slice(0, -1));
 	};
 	const onClick = () => {
 		if (isDisabled) return;
@@ -79,12 +75,7 @@ var SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvalid,
 		"data-has-search": fieldState.searchValue !== "" || void 0,
 		"data-invalid": isInvalid || void 0,
 		"data-is-empty": isEmpty || void 0,
-		"data-is-filled": !isEmpty || void 0,
-		"data-is-required": isRequired || void 0,
-		"data-is-dirty": isDirty || void 0,
 		"data-select-input": "",
-		onMouseEnter,
-		onFocusCapture,
 		...hoverProps,
 		...focusWithinProps,
 		children: [
@@ -101,10 +92,6 @@ var SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvalid,
 						...headerProps,
 						labelProps
 					}),
-					leadingContent && /* @__PURE__ */ jsx("div", {
-						className: "ml-input-side-default flex shrink-0 items-center",
-						children: leadingContent
-					}),
 					(showTags || isSearchable) && /* @__PURE__ */ jsxs("div", {
 						className: clsx("flex flex-1 flex-wrap gap-input-gap-input-text-to-elements truncate", !isSearchable && "pointer-events-none z-1"),
 						children: [showTags && /* @__PURE__ */ jsx(SelectInputTags, {
@@ -137,15 +124,8 @@ var SelectInput = ({ ref, placeholder, variant, as, size, isDisabled, isInvalid,
 					})
 				]
 			}),
-			trailingContent && /* @__PURE__ */ jsx("div", {
-				className: "flex shrink-0 items-center",
-				children: trailingContent
-			}),
 			isClearable && /* @__PURE__ */ jsx(InputClear, {
-				onClear: () => {
-					onClear();
-					if (fireBlurOnChange) onBlur?.({});
-				},
+				onClear,
 				show: showClearButton
 			}),
 			!hideDropdownIcon && /* @__PURE__ */ jsx(Button, {

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

@@ -1,5 +1,5 @@
 import { Key } from 'react-aria-components';
 import { SelectBaseProps } from './SelectBase';
 type SelectMobileProps<TKey extends Key = Key> = SelectBaseProps<TKey>;
-export declare const SelectMobile: <TKey extends Key = Key>({ ref, error, showSelectionContent, inputClassName, containerClassName, leadingContent, trailingContent, customTrigger, onBlur, onMouseEnter, onFocusCapture, ...props }: SelectMobileProps<TKey>) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectMobile: <TKey extends Key = Key>({ ref, error, showSelectionContent, inputClassName, containerClassName, customTrigger, onBlur, ...props }: SelectMobileProps<TKey>) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -13,8 +13,8 @@ import { useRef } from "react";
 import { DialogTrigger } from "react-aria-components";
 import { useLabel } from "react-aria";
 //#region src/components/inputs/Selection/shared/SelectMobile.tsx
-var SelectMobile = ({ ref, error, 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, hideSearchIcon, isSearchable, isClearable, as, size, collapseAfter, selectedTagsType } = props;
+var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containerClassName, customTrigger, onBlur, ...props }) => {
+	const { label, tooltipText, helperText, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, hideSearchIcon, isSearchable, isClearable, as, size, collapseAfter, selectedTagsType } = props;
 	const formFieldProps = {
 		error,
 		label,
@@ -62,8 +62,6 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 			children: [customTrigger ? /* @__PURE__ */ jsx("div", {
 				...fieldProps,
 				ref,
-				onMouseEnter,
-				onFocusCapture,
 				children: customTrigger
 			}) : /* @__PURE__ */ jsx(SelectInput, {
 				ref,
@@ -81,12 +79,8 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 				onBlur: void 0,
 				fieldProps,
 				headerProps,
-				leadingContent,
-				trailingContent,
 				collapseAfter,
-				selectedTagsType,
-				isRequired,
-				isDirty
+				selectedTagsType
 			}), /* @__PURE__ */ jsx(BottomSheet, {
 				isOpen,
 				onOpenChange: handleOpenChange,
@@ -108,7 +102,8 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 						rightContent: /* @__PURE__ */ jsx(FormFieldHeaderClose, { onClose: close }),
 						inputClassName,
 						className: "mb-list-height-title-bottom px-list-side-title",
-						leadingIcon: !hideSearchIcon ? /* @__PURE__ */ jsx(SearchIcon, { className: "size-6" }) : void 0
+						leadingIcon: !hideSearchIcon ? /* @__PURE__ */ jsx(SearchIcon, { className: "size-6" }) : void 0,
+						size: "default"
 					}), /* @__PURE__ */ jsx(SelectListBox, {
 						...props,
 						autoFocus: !isSearchable,

package/dist/components/inputs/Selection/shared/select.context.d.ts

@@ -17,15 +17,14 @@ export declare namespace SelectContext {
         onClear: () => void;
         onSelectAll: () => void;
         onRemove: (val: Key) => void;
-        onBlur: () => void;
         listItems: ExtendedSelectItem[];
         selectableListItems: SelectItem[];
         selectedItems: SelectItem[];
         selectedIds: Key[];
         isMultiple: boolean;
     } & Pick<SelectBaseProps, "onInputChange" | "isLoading" | "hasLoadMore">;
-    export type ProviderProps = GroupedSelectProps & Pick<SelectBaseProps, "items" | "onInputChange" | "onSearchChange" | "showSelectAllOption" | "showNewItemOption" | "newItemMinLength" | "onNewItemOption" | "isLoading" | "hasLoadMore" | "mapInitialToSelectItem" | "isSearchable" | "isClientSearchDisabled" | "ignoreInputValueFiltering">;
-    export const Provider: ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, ignoreInputValueFiltering, children, mapInitialToSelectItem, ...props }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
+    export type ProviderProps = GroupedSelectProps & Pick<SelectBaseProps, "items" | "onInputChange" | "onSearchChange" | "showSelectAllOption" | "showNewItemOption" | "newItemMinLength" | "onNewItemOption" | "isLoading" | "hasLoadMore" | "mapInitialToSelectItem" | "isSearchable" | "isClientSearchDisabled">;
+    export const Provider: ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, children, mapInitialToSelectItem, ...props }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
     export const useSelect: () => Type;
     export {};
 }

package/dist/components/inputs/Selection/shared/select.context.js

@@ -1,5 +1,5 @@
-import { useDebounceCallback } from "../../../../hooks/useDebounceCallback.js";
 import { useSelectItems } from "./useSelectItems.js";
+import { useDebounceCallback } from "../../../../hooks/useDebounceCallback.js";
 import { jsx } from "react/jsx-runtime";
 import { createContext, use, useCallback, useEffect, useMemo, useRef, useState } from "react";
 //#region src/components/inputs/Selection/shared/select.context.tsx
@@ -10,7 +10,7 @@ var SelectContext;
 		id: item.id,
 		label: item.label ?? item.name ?? ""
 	});
-	_SelectContext.Provider = ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, ignoreInputValueFiltering, children, mapInitialToSelectItem = defaultMapInitialToSelectItem, ...props }) => {
+	_SelectContext.Provider = ({ items, onInputChange, onSearchChange, showSelectAllOption, showNewItemOption, newItemMinLength, onNewItemOption, isLoading, hasLoadMore, isClientSearchDisabled, children, mapInitialToSelectItem = defaultMapInitialToSelectItem, ...props }) => {
 		const isMultiple = props.selectionMode === "multiple";
 		const initialSelectedItems = useMemo(() => {
 			if (!props.initialSelection) return null;
@@ -42,7 +42,7 @@ var SelectContext;
 			newItemMinLength,
 			isLoading,
 			hasLoadMore,
-			isClientSearchDisabled: ignoreInputValueFiltering ?? isClientSearchDisabled
+			isClientSearchDisabled
 		});
 		const selectedItems = useMemo(() => allItems.filter(({ id }) => Array.isArray(fieldState.value) ? fieldState.value.includes(id) : id === fieldState.value), [allItems, fieldState.value]);
 		const selectedIds = useMemo(() => selectedItems.map(({ id }) => id), [selectedItems]);
@@ -84,7 +84,7 @@ var SelectContext;
 			else updateValue(value);
 		}, [props.value]);
 		useEffect(() => {
-			if (!isMultiple && props.value !== null && props.value !== void 0 && fieldState.value !== null && fieldState.value !== void 0 && fieldState.inputValue === "" && getItem(fieldState.value)?.label) syncFieldState(fieldState.value);
+			if (!isMultiple && fieldState.value && fieldState.inputValue === "" && getItem(fieldState.value)?.label) syncFieldState(fieldState.value);
 		}, [allListItems]);
 		const handleInputChange = useCallback((inputValue) => {
 			const newFieldState = {
@@ -144,22 +144,6 @@ var SelectContext;
 			fieldState.value,
 			onChange
 		]);
-		const onBlur = useCallback(() => {
-			if (props.isSearchable && isMultiple && fieldState.searchValue !== "") {
-				const newFieldState = {
-					...fieldState,
-					inputValue: "",
-					searchValue: ""
-				};
-				setFieldState(newFieldState);
-				emitStateChanges(newFieldState);
-				setShowAll(true);
-			}
-		}, [
-			props.isSearchable,
-			isMultiple,
-			fieldState
-		]);
 		const value = useMemo(() => ({
 			fieldState,
 			isOpen,
@@ -170,7 +154,6 @@ var SelectContext;
 			onClear,
 			onSelectAll,
 			onRemove,
-			onBlur,
 			listItems,
 			selectableListItems,
 			selectedItems,
@@ -188,7 +171,6 @@ var SelectContext;
 			onClear,
 			onSelectAll,
 			onRemove,
-			onBlur,
 			listItems,
 			selectableListItems,
 			selectedIds,

package/dist/components/inputs/Selection/shared/select.types.d.ts

@@ -1,11 +1,11 @@
-import { ReactElement, ReactNode } from 'react';
+import { ReactElement } from 'react';
 import { Key } from 'react-aria-components';
 import { FieldValues } from 'react-hook-form';
 import { ControlProps } from '../../shared/form.types';
 export interface SelectItem<TKey extends Key = Key> {
     id: TKey;
     label: string;
-    content?: string | ReactNode;
+    content?: string | ReactElement;
     isDisabled?: boolean;
 }
 export interface ExtendedSelectItem<TKey extends Key = Key> extends SelectItem<TKey> {

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

@@ -15,7 +15,6 @@ export interface TextEditorBaseProps extends FormFieldProps {
     onBlur?: () => void;
     as?: "default" | "filter" | "floating" | "inline" | null;
     editorClassName?: string;
-    isDirty?: boolean;
 }
 export type TextEditorProps = TextEditorBaseProps;
 export type ControlledTextEditorProps<TFieldValues extends FieldValues> = ControlProps<TextEditorProps, TFieldValues>;

package/dist/components/inputs/TextEditor/TextEditor.js

@@ -37,7 +37,7 @@ var extensions = [
 		defaultProtocol: "https"
 	})
 ];
-var TextEditorBase = ({ ref, as = "default", placeholder, label, hideLabel, tooltipText, helperText, isRequired, rightContent, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, value, className, editorClassName, isDirty, onChange, onBlur }) => {
+var TextEditorBase = ({ ref, as = "default", placeholder, label, hideLabel, tooltipText, helperText, isRequired, rightContent, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, value, className, editorClassName, onChange, onBlur }) => {
 	const contentRef = useRef(null);
 	const { hoverProps, isHovered } = useHover({ isDisabled });
 	const [isFocused, setIsFocused] = useState(false);
@@ -109,8 +109,6 @@ var TextEditorBase = ({ ref, as = "default", placeholder, label, hideLabel, tool
 			"data-focus-within": isFocused || void 0,
 			"data-focus-visible": isFocused && isFocusVisible || void 0,
 			"data-is-filled": !editor?.isEmpty,
-			"data-is-required": isRequired || void 0,
-			"data-is-dirty": isDirty || void 0,
 			...hoverProps,
 			...focusWithinProps,
 			...fieldProps,
@@ -138,15 +136,13 @@ var TextEditor = (props) => {
 		return /* @__PURE__ */ jsx(Controller, {
 			control: formControl.control,
 			name: formControl.name,
-			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(TextEditorBase, {
+			render: ({ field }) => /* @__PURE__ */ jsx(TextEditorBase, {
 				...innerProps,
 				ref: mergeRefs(ref, field.ref),
 				value: field.value,
 				onChange: field.onChange,
 				onBlur: field.onBlur,
-				isDirty,
-				isDisabled: field.disabled || props.isDisabled,
-				error: props.error ?? error?.message
+				isDisabled: field.disabled || props.isDisabled
 			})
 		});
 	}

package/dist/components/inputs/Toggle/Toggle.js

@@ -2,7 +2,7 @@ import { UIStyle } from "../../../config/uiStyle.context.js";
 import { UIConfig } from "../../../config/uiConfig.context.js";
 import { FormFieldError } from "../FormField/FormFieldError.js";
 import { CheckContent } from "../shared/CheckContent.js";
-import { toggle, toggleContentClassName, toggleTypography } from "./toggle.cva.js";
+import { toggle, toggleTypography } from "./toggle.cva.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { Switch } from "react-aria-components";
@@ -13,7 +13,6 @@ var ToggleBase = (props) => {
 	const ui = UIConfig.useConfig();
 	const toggleCva = UIStyle.useCva("toggle.cva", toggle);
 	const toggleTypographyMap = UIStyle.useMapper("toggle.typography", toggleTypography);
-	const toggleContentClassNameMap = UIStyle.useMapper("toggle.contentClassName", toggleContentClassName);
 	const { className, children, isDisabled, error, variant = ui.toggle.variant, ...rest } = props;
 	const formFieldErrorProps = {
 		error,
@@ -33,10 +32,6 @@ var ToggleBase = (props) => {
 				variant,
 				...rest
 			}),
-			contentClassName: toggleContentClassNameMap({
-				variant,
-				...rest
-			}),
 			children
 		})]
 	}), /* @__PURE__ */ jsx(FormFieldError, { ...formFieldErrorProps })] });

package/dist/components/inputs/Toggle/toggle.cva.d.ts

@@ -8,6 +8,3 @@ export interface ToggleVariantProps extends VariantProps<typeof toggle> {
 export declare const toggleTypography: (props: {
     variant?: "default" | null | undefined;
 }) => TypographyVariantProps | undefined;
-export declare const toggleContentClassName: (props: {
-    variant?: "default" | null | undefined;
-}) => string | undefined;

package/dist/components/inputs/Toggle/toggle.cva.js

@@ -26,6 +26,5 @@ var toggleTypography = compoundMapper({ default: {
 	sizeMobile: "label-1",
 	variant: "default"
 } });
-var toggleContentClassName = compoundMapper({ default: "text-text-default-2" });
 //#endregion
-export { toggle, toggleContentClassName, toggleTypography };
+export { toggle, toggleTypography };

package/dist/components/inputs/shared/CheckContent.d.ts

@@ -3,7 +3,6 @@ import { TypographyVariantProps } from '../../text/Typography/typography.cva';
 interface CheckContentProps {
     typography?: TypographyVariantProps;
     className?: string;
-    contentClassName?: string;
 }
-export declare const CheckContent: ({ children, className, contentClassName, ...props }: PropsWithChildren<CheckContentProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const CheckContent: ({ children, className, ...props }: PropsWithChildren<CheckContentProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/inputs/shared/CheckContent.js

@@ -3,14 +3,15 @@ import { typography } from "../../text/Typography/typography.cva.js";
 import { jsx } from "react/jsx-runtime";
 import clsx$1 from "clsx";
 //#region src/components/inputs/shared/CheckContent.tsx
-var CheckContent = ({ children, className, contentClassName, ...props }) => {
+var CheckContent = ({ children, className, ...props }) => {
 	return /* @__PURE__ */ jsx("div", {
 		className: clsx$1(UIStyle.useCva("typography.cva", typography)({
 			size: "label-1",
 			sizeMobile: "label-1",
 			variant: "default",
-			...props.typography
-		}), contentClassName, className),
+			...props.typography,
+			className: "text-text-default-2"
+		}), className),
 		children
 	});
 };

package/dist/components/overlays/BottomSheet/BottomSheet.js

@@ -76,10 +76,9 @@ var BottomSheetBase = ({ isOpen, onOpenChange, onStateChange, isDismissable = tr
 	return /* @__PURE__ */ jsx(AnimatePresence, { children: isOpen && /* @__PURE__ */ jsxs(MotionModalOverlay, {
 		isOpen: true,
 		UNSTABLE_portalContainer: portalContainerRef?.current,
-		className: clsx("fixed top-0 left-0 z-10 w-screen", containerClassName),
+		className: clsx("fixed top-0 left-0 z-10 w-screen h-dvh", containerClassName),
 		onOpenChange,
 		isDismissable,
-		style: { height: viewport.height },
 		ref: overlayRef,
 		shouldCloseOnInteractOutside,
 		children: [/* @__PURE__ */ jsx(motion.div, {

package/dist/components/overlays/Tooltip/TooltipEllipsis.d.ts

@@ -1,6 +1,6 @@
-import { JSX, Ref } from 'react';
+import { JSX, ReactNode, Ref } from 'react';
 export interface TooltipEllipsisProps {
-    text: string;
+    text: ReactNode;
     children: (ref: Ref<HTMLElement> | undefined) => JSX.Element;
     isDisabled?: boolean;
     isNonInteractiveTrigger?: boolean;

package/dist/config/link.context.js

@@ -1,11 +1,13 @@
 import { jsx } from "react/jsx-runtime";
-import { createContext, use } from "react";
+import { createContext, use, useMemo } from "react";
 //#region src/config/link.context.tsx
 var LinkContext;
 (function(_LinkContext) {
 	const LinkContextInternal = createContext(null);
 	_LinkContext.LinkContextProvider = ({ children, LinkComponent }) => {
-		const value = { LinkComponent };
+		const value = useMemo(() => {
+			return { LinkComponent };
+		}, [LinkComponent]);
 		return /* @__PURE__ */ jsx(LinkContextInternal.Provider, {
 			value,
 			children

package/dist/config/uiConfig.context.d.ts

@@ -24,16 +24,10 @@ export declare namespace UIConfig {
         numberInput: Pick<NumberInputProps, "formatOptions">;
         radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel">;
         checkbox: Pick<CheckboxProps, "variant">;
-        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType" | "hideSearchIcon" | "fireBlurOnChange">;
-        queryAutocomplete: {
-            isInitialQueryDisabled?: boolean;
-        };
-        querySelect: {
-            isInitialQueryDisabled?: boolean;
-        };
+        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType" | "hideSearchIcon">;
         toggle: Pick<ToggleProps, "variant">;
         slider: Pick<SliderProps, "minValue" | "maxValue">;
-        dateInput: Pick<DatePickerProps, "todayIcon" | "todayIconButtonSize" | "shouldForceLeadingZeros" | "disableManualEntry" | "autoFixYear">;
+        dateInput: Pick<DatePickerProps, "todayIcon" | "shouldForceLeadingZeros" | "disableManualEntry" | "shouldUpdateDateOnMonthYearChange" | "granularity" | "autoFixYear">;
         actionModal: Pick<ActionModalProps, "titleTypography" | "descriptionTypography">;
         bottomSheet: Pick<BottomSheetProps, "closeDragThreshold" | "closeVelocityThreshold" | "hideThumb" | "headerTypography">;
         tableHeaderText: Pick<HeaderTextProps, "variant" | "size">;

package/dist/config/uiConfig.context.js

@@ -31,11 +31,8 @@ var UIConfig;
 			isSearchable: false,
 			selectedTagsType: "list",
 			collapseAfter: 3,
-			hideSearchIcon: false,
-			fireBlurOnChange: false
+			hideSearchIcon: false
 		},
-		queryAutocomplete: { isInitialQueryDisabled: false },
-		querySelect: { isInitialQueryDisabled: false },
 		toggle: { variant: "default" },
 		slider: {
 			minValue: 0,
@@ -43,9 +40,10 @@ var UIConfig;
 		},
 		dateInput: {
 			todayIcon: false,
-			todayIconButtonSize: "none",
 			shouldForceLeadingZeros: false,
 			disableManualEntry: false,
+			shouldUpdateDateOnMonthYearChange: false,
+			granularity: "day",
 			autoFixYear: false
 		},
 		actionModal: {

package/dist/config/uiStyle.context.d.ts

@@ -5,7 +5,6 @@ import { ButtonVariantProps } from '../components/buttons/Button/button.cva';
 import { PillButtonVariants } from '../components/buttons/PillButton/pillButton.cva';
 import { CheckboxIconVariantProps, CheckboxVariantProps } from '../components/inputs/Checkbox/checkbox.cva';
 import { FormFieldErrorVariantProps } from '../components/inputs/FormField/formFieldError.cva';
-import { FormFieldHeaderVariantProps } from '../components/inputs/FormField/formFieldHeader.cva';
 import { FormFieldHelperVariantProps } from '../components/inputs/FormField/formFieldHelper.cva';
 import { RadioVariantProps } from '../components/inputs/RadioGroup/radio.cva';
 import { InputBaseProps, InputSideProps, InputSizeProps } from '../components/inputs/shared/input.cva';
@@ -31,7 +30,7 @@ export declare namespace UIStyle {
     type OptionKey = {
         [K in keyof Options]: Options[K] extends object ? `${K & string}.${keyof Options[K] & string}` : never;
     }[keyof Options];
-    export interface Options {
+    interface Options {
         button: {
             cva?: Cva<ButtonVariantProps>;
             sizeCva?: Cva<ButtonVariantProps>;
@@ -47,12 +46,10 @@ export declare namespace UIStyle {
             cva?: Cva<CheckboxVariantProps>;
             iconCva?: Cva<CheckboxIconVariantProps>;
             typography?: CompoundMapper<TypographyVariantProps, CheckboxVariantProps>;
-            contentClassName?: CompoundMapper<string, CheckboxVariantProps>;
         };
         radio: {
             cva?: Cva<RadioVariantProps>;
             typography?: CompoundMapper<TypographyVariantProps, RadioVariantProps>;
-            contentClassName?: CompoundMapper<string, RadioVariantProps>;
         };
         status: {
             iconCva?: Cva<ToastVariantProps>;
@@ -77,7 +74,6 @@ export declare namespace UIStyle {
         toggle: {
             cva?: Cva<ToggleVariantProps>;
             typography?: CompoundMapper<TypographyVariantProps, ToggleVariantProps>;
-            contentClassName?: CompoundMapper<string, ToggleVariantProps>;
         };
         typography: {
             cva?: Cva<TypographyVariantProps>;
@@ -149,7 +145,6 @@ export declare namespace UIStyle {
             cva?: Cva<PopoverVariantProps>;
         };
         formField: {
-            headerCva?: Cva<FormFieldHeaderVariantProps>;
             errorLabelCva?: Cva<FormFieldErrorVariantProps>;
             helperLabelCva?: Cva<FormFieldHelperVariantProps>;
         };

package/dist/helpers/dynamicInputs.d.ts

@@ -21,14 +21,14 @@ export type AllowedComponentType<TZodType extends z.ZodType> = ZodUtils.ZodTypeS
     datetime: "datePicker" | "dateTimePicker" | "timePicker";
     dateRange: "dateRangePicker";
     boolean: "toggle" | "checkbox";
-    number: "numberInput" | "slider" | "select" | "querySelect" | "autocomplete" | "queryAutocomplete" | "segment";
-    enum: "select" | "querySelect" | "autocomplete" | "segment";
-    string: "textInput" | "passwordInput" | "textArea" | "textEditor" | "select" | "querySelect" | "autocomplete" | "queryAutocomplete" | "segment";
+    number: "numberInput" | "slider" | "select" | "autocomplete" | "queryAutocomplete" | "segment";
+    enum: "select" | "autocomplete" | "segment";
+    string: "textInput" | "passwordInput" | "textArea" | "select" | "autocomplete" | "queryAutocomplete" | "segment";
     email: "textInput";
-    array: "select" | "querySelect" | "autocomplete" | "queryAutocomplete" | "segment";
+    array: "select" | "autocomplete" | "queryAutocomplete" | "segment";
     object: InputComponentType;
     unknown: InputComponentType;
-    uuid: "select" | "querySelect" | "autocomplete" | "queryAutocomplete" | "segment";
+    uuid: "select" | "autocomplete" | "queryAutocomplete" | "segment";
 }>;
 interface DynamicInputDefBase<TProps> {
     label?: string;

package/dist/helpers/dynamicInputs.js

@@ -81,7 +81,6 @@ var getDefaultProps = (componentType, keyType) => {
 	].includes(componentType)) props.items = getDefaultSelectionItems(unwrappedType);
 	if ([
 		"select",
-		"querySelect",
 		"autocomplete",
 		"queryAutocomplete",
 		"segment"
@@ -147,8 +146,6 @@ var populateInputDef = (schema, schemaKey, value, options) => {
 	const inputWrapper = value.inputWrapper ?? options.globalInputWrapper;
 	if ("render" in value) return {
 		name,
-		label,
-		placeholder,
 		render: value.render
 	};
 	const schemaKeyType = schema.shape[schemaKey];

package/dist/index.d.ts

@@ -94,10 +94,6 @@ export type { RadioVariantProps } from './components/inputs/RadioGroup/radio.cva
 export type { AutocompleteProps, ControlledAutocompleteProps, } from './components/inputs/Selection/Autocomplete/Autocomplete';
 export { Autocomplete } from './components/inputs/Selection/Autocomplete/Autocomplete';
 export { QueryAutocomplete } from './components/inputs/Selection/Autocomplete/QueryAutocomplete';
-export type { SelectBaseProps } from './components/inputs/Selection/shared/SelectBase';
-export type { DefaultInitialSelectItem, SelectAsyncProps, SelectItem, } from './components/inputs/Selection/shared/select.types';
-export type { QuerySelectProps } from './components/inputs/Selection/Select/QuerySelect';
-export { QuerySelect } from './components/inputs/Selection/Select/QuerySelect';
 export type { ControlledSelectProps, SelectProps } from './components/inputs/Selection/Select/Select';
 export { Select } from './components/inputs/Selection/Select/Select';
 export type { ControlledSliderProps, SliderProps } from './components/inputs/Slider/Slider';

package/dist/index.js

@@ -68,10 +68,10 @@ import { Checkbox } from "./components/inputs/Checkbox/Checkbox.js";
 import { useLongPressRepeat } from "./hooks/useLongPressRepeat.js";
 import { useScrollableListBox } from "./hooks/useScrollableListBox.js";
 import { FormField } from "./components/inputs/FormField/FormField.js";
-import { useDebounceCallback } from "./hooks/useDebounceCallback.js";
 import { DateTimeUtils } from "./utils/date-time.utils.js";
 import { DatePicker } from "./components/inputs/DateTime/DatePicker/DatePicker.js";
 import { Tag } from "./components/text/Tag/Tag.js";
+import { useDebounceCallback } from "./hooks/useDebounceCallback.js";
 import { useIntersectionObserver } from "./hooks/useIntersectionObserver.js";
 import { TextInput } from "./components/inputs/Input/TextInput/TextInput.js";
 import { Select } from "./components/inputs/Selection/Select/Select.js";
@@ -92,8 +92,6 @@ import { QueryAutocomplete } from "./components/inputs/Selection/Autocomplete/Qu
 import { Slider } from "./components/inputs/Slider/Slider.js";
 import { Toggle } from "./components/inputs/Toggle/Toggle.js";
 import { Segment } from "./components/segment/Segment.js";
-import { QuerySelect } from "./components/inputs/Selection/Select/QuerySelect.js";
-import { ResponsivePopover } from "./components/overlays/ResponsivePopover/ResponsivePopover.js";
 import { StringUtils } from "./utils/string.utils.js";
 import { dynamicInputs } from "./helpers/dynamicInputs.js";
 import { Form } from "./components/inputs/Inputs/Form.js";
@@ -104,6 +102,7 @@ import { Stepper } from "./components/navigation/Stepper/Stepper.js";
 import { Modal } from "./components/overlays/Modal/Modal.js";
 import { ActionModal } from "./components/overlays/ActionModal/ActionModal.js";
 import { Drawer } from "./components/overlays/Drawer/Drawer.js";
+import { ResponsivePopover } from "./components/overlays/ResponsivePopover/ResponsivePopover.js";
 import { TooltipEllipsis } from "./components/overlays/Tooltip/TooltipEllipsis.js";
 import { PaginationList } from "./components/shared/pagination/PaginationList.js";
 import { Pagination } from "./components/shared/pagination/Pagination.js";
@@ -136,4 +135,4 @@ import { useTableColumnConfig } from "./hooks/useTableColumnConfig.js";
 import { ArrayUtils } from "./utils/array.utils.js";
 import { QueriesUtils } from "./utils/queries.utils.js";
 import { RoutingUtils } from "./utils/routing.utils.js";
-export { Accordion, ActionModal, Alert, AlignCenterIcon, AlignLeftIcon, AlignLeftRightIcon, AlignRightIcon, ArrayUtils, ArrowDropDownIcon, ArrowDropUpIcon, ArrowLeftIcon, ArrowRightIcon, Autocomplete, BoldIcon, BottomSheet, Breadcrumbs, BulletedListIcon, Button, CalendarIcon, CellText, CheckIcon, Checkbox, CheckboxCheckmarkIcon, CheckboxIndeterminateIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ClockIcon, CloseIcon, ColumnConfigModal, Confirmation, DatePicker, DateRangePicker, DateTimeIcon, DateTimePicker, DateTimeUtils, DateUtils, DomUtils, Drawer, FileUpload, FileUploadContainer, FileUtils, Form, FormField, HeaderText, HighlightIcon, HighlightOnIcon, HomeIcon, IconButton, InfiniteTable, InfoIcon, InlineIconButton, InputUpload, Inputs, ItalicIcon, Link, LinkContext, LinkIcon, Loader, Menu, MenuIcon, MenuItem, MenuPopover, Modal, NumberInput, NumberedListIcon, ObjectUtils, PaginatedTable, Pagination, PaginationList, PasswordInput, PillButton, PointerHorizontalIcon, PointerVerticalIcon, ProgressBar, QueriesUtils, QueryAutocomplete, QuerySelect, RadioGroup, ResponsivePopover, RestUtils, RoutingUtils, Segment, Select, SendIcon, Slider, SplitButton, Stepper, StrikethroughIcon, StringUtils, Table, Tag, TextArea, TextButton, TextColorIcon, TextInput, ThemeContext, TimePicker, Toast, ToastContainer, Toggle, ToggleButton, Tooltip, TooltipEllipsis, Typography, UIConfig, UIRouter, UIStyle, UnderlinedIcon, VisibilityIcon, VisibilityOffIcon, compoundMapper, dynamicColumns, dynamicInputs, isEqual, logger, ns, resources, uiOutlineClass, useAutosave, useBreakpoint, useDebounceCallback, useDeepCompareEffect, useDeepCompareLayoutEffect, useDeepCompareMemo, useFilters, useForm, useFormAutosave, useIntersectionObserver, useLocalStorage, useLongPressRepeat, usePagination, useScrollableListBox, useSorting, useStateAndRef, useTableColumnConfig, useTableNav, useToast, useTranslationMemo };
+export { Accordion, ActionModal, Alert, AlignCenterIcon, AlignLeftIcon, AlignLeftRightIcon, AlignRightIcon, ArrayUtils, ArrowDropDownIcon, ArrowDropUpIcon, ArrowLeftIcon, ArrowRightIcon, Autocomplete, BoldIcon, BottomSheet, Breadcrumbs, BulletedListIcon, Button, CalendarIcon, CellText, CheckIcon, Checkbox, CheckboxCheckmarkIcon, CheckboxIndeterminateIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ClockIcon, CloseIcon, ColumnConfigModal, Confirmation, DatePicker, DateRangePicker, DateTimeIcon, DateTimePicker, DateTimeUtils, DateUtils, DomUtils, Drawer, FileUpload, FileUploadContainer, FileUtils, Form, FormField, HeaderText, HighlightIcon, HighlightOnIcon, HomeIcon, IconButton, InfiniteTable, InfoIcon, InlineIconButton, InputUpload, Inputs, ItalicIcon, Link, LinkContext, LinkIcon, Loader, Menu, MenuIcon, MenuItem, MenuPopover, Modal, NumberInput, NumberedListIcon, ObjectUtils, PaginatedTable, Pagination, PaginationList, PasswordInput, PillButton, PointerHorizontalIcon, PointerVerticalIcon, ProgressBar, QueriesUtils, QueryAutocomplete, RadioGroup, ResponsivePopover, RestUtils, RoutingUtils, Segment, Select, SendIcon, Slider, SplitButton, Stepper, StrikethroughIcon, StringUtils, Table, Tag, TextArea, TextButton, TextColorIcon, TextInput, ThemeContext, TimePicker, Toast, ToastContainer, Toggle, ToggleButton, Tooltip, TooltipEllipsis, Typography, UIConfig, UIRouter, UIStyle, UnderlinedIcon, VisibilityIcon, VisibilityOffIcon, compoundMapper, dynamicColumns, dynamicInputs, isEqual, logger, ns, resources, uiOutlineClass, useAutosave, useBreakpoint, useDebounceCallback, useDeepCompareEffect, useDeepCompareLayoutEffect, useDeepCompareMemo, useFilters, useForm, useFormAutosave, useIntersectionObserver, useLocalStorage, useLongPressRepeat, usePagination, useScrollableListBox, useSorting, useStateAndRef, useTableColumnConfig, useTableNav, useToast, useTranslationMemo };