@povio/ui 2.2.8-rc → 2.2.9-rc.1

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

@@ -1,13 +1,15 @@
+import { UIStyle } from "../../../../config/uiStyle.context.js";
 import "../../../../config/i18n.js";
 import { CheckboxCheckmark } from "../../Checkbox/CheckboxCheckmark.js";
 import { SelectContext } from "./select.context.js";
+import { selectListBoxItemCva } from "./selectItem.cva.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { clsx } from "clsx";
 import { useMemo, useRef } from "react";
 import { ListBoxItem } from "react-aria-components";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/Selection/shared/SelectListBoxItem.tsx
 var SelectListBoxItem = ({ isSearchable, isNewItem, newItemRender, id, label, content, isDisabled }) => {
+	const selectListItemCva = UIStyle.useCva("select.listBoxItemCva", selectListBoxItemCva);
 	const ref = useRef(null);
 	const { t } = useTranslation("ui");
 	const { selectedIds, isMultiple } = SelectContext.useSelect();
@@ -26,7 +28,10 @@ var SelectListBoxItem = ({ isSearchable, isNewItem, newItemRender, id, label, co
 		id,
 		textValue: label,
 		isDisabled,
-		className: clsx(selectListBoxItemClass, !isMultiple && "selected:bg-interactive-contained-primary-idle selected:text-interactive-contained-primary-on-idle", isNewItem ? "text-interactive-text-primary-idle" : "text-interactive-text-secondary-idle"),
+		className: selectListItemCva({
+			isSingle: !isMultiple,
+			isNewItem
+		}),
 		children: [
 			isMultiple && !isSearchable && /* @__PURE__ */ jsx(CheckboxCheckmark, {
 				variant: "default",
@@ -45,6 +50,5 @@ var SelectListBoxItem = ({ isSearchable, isNewItem, newItemRender, id, label, co
 		]
 	});
 };
-var selectListBoxItemClass = clsx("group flex cursor-pointer items-center gap-2 px-list-side-item-left py-list-height-item", "border-b border-b-elevation-outline-default-1 outline-none", "font-labels-default text-interactive-text-secondary-idle text-label-2", "hover:text-interactive-text-secondary-hover", "focus-visible:bg-interactive-contained-primary-focus focus-visible:text-interactive-text-secondary-idle-inverted", "disabled:cursor-default disabled:text-interactive-text-secondary-disabled");
 //#endregion
-export { SelectListBoxItem, selectListBoxItemClass };
+export { SelectListBoxItem };

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

@@ -1,13 +1,15 @@
+import { UIStyle } from "../../../../config/uiStyle.context.js";
 import "../../../../config/i18n.js";
 import { CheckboxCheckmark } from "../../Checkbox/CheckboxCheckmark.js";
 import { SelectContext } from "./select.context.js";
-import { selectListBoxItemClass } from "./SelectListBoxItem.js";
+import { selectListBoxItemCva } from "./selectItem.cva.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useRef } from "react";
 import { ListBoxItem } from "react-aria-components";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/Selection/shared/SelectListBoxItemSelectAll.tsx
 var SelectListBoxItemSelectAll = ({ id, label, isDisabled }) => {
+	const selectListItemCva = UIStyle.useCva("select.listBoxItemCva", selectListBoxItemCva);
 	const ref = useRef(null);
 	const { t } = useTranslation("ui");
 	const { selectableListItems, selectedIds } = SelectContext.useSelect();
@@ -16,7 +18,7 @@ var SelectListBoxItemSelectAll = ({ id, label, isDisabled }) => {
 		id,
 		textValue: label || t(($) => $.ui.select.allOption),
 		isDisabled,
-		className: selectListBoxItemClass,
+		className: selectListItemCva({}),
 		children: [/* @__PURE__ */ jsx("div", {
 			className: "group",
 			"data-rac": "",
@@ -24,7 +26,7 @@ var SelectListBoxItemSelectAll = ({ id, label, isDisabled }) => {
 			"data-indeterminate": selectedIds.length > 0 && selectedIds.length < selectableListItems.length || void 0,
 			children: /* @__PURE__ */ jsx(CheckboxCheckmark, {
 				variant: "default",
-				className: "group-focus-visible:!outline-none"
+				className: "group-focus-visible:outline-none!"
 			})
 		}), t(($) => $.ui.select.allOption)]
 	});

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

@@ -1,7 +1,8 @@
+import { UIStyle } from "../../../../config/uiStyle.context.js";
 import { Loader } from "../../../status/Loader/Loader.js";
 import "../../../../config/i18n.js";
 import { SelectContext } from "./select.context.js";
-import { selectListBoxItemClass } from "./SelectListBoxItem.js";
+import { selectListBoxItemCva } from "./selectItem.cva.js";
 import { useIntersectionObserver } from "../../../../hooks/useIntersectionObserver.js";
 import { jsx } from "react/jsx-runtime";
 import { useCallback } from "react";
@@ -9,6 +10,7 @@ import { ListBoxItem } from "react-aria-components";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/Selection/shared/SelectListBoxLoadingItem.tsx
 var SelectListBoxLoadingItem = ({ id, label, onLoadMore }) => {
+	const selectListItemCva = UIStyle.useCva("select.listBoxItemCva", selectListBoxItemCva);
 	const { t } = useTranslation("ui");
 	const { isDebouncing, isLoading, hasLoadMore } = SelectContext.useSelect();
 	const { ref } = useIntersectionObserver({
@@ -26,7 +28,7 @@ var SelectListBoxLoadingItem = ({ id, label, onLoadMore }) => {
 		id,
 		textValue: label || t(($) => $.ui.loadingState.text),
 		isDisabled: true,
-		className: selectListBoxItemClass,
+		className: selectListItemCva({}),
 		children: /* @__PURE__ */ jsx("div", {
 			ref,
 			className: "flex flex-1 justify-center text-interactive-text-primary-idle",

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

@@ -14,7 +14,7 @@ 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, customTrigger, onBlur, ...props }) => {
-	const { label, tooltipText, helperText, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, hideSearchIcon, isSearchable, isClearable, as, collapseAfter, selectedTagsType } = 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;
 	const formFieldProps = {
 		error,
 		label,
@@ -68,6 +68,7 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 				placeholder,
 				variant,
 				as,
+				size,
 				isDisabled,
 				isInvalid: !!error,
 				className,
@@ -79,7 +80,9 @@ var SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containe
 				fieldProps,
 				headerProps,
 				collapseAfter,
-				selectedTagsType
+				selectedTagsType,
+				isRequired,
+				isDirty
 			}), /* @__PURE__ */ jsx(BottomSheet, {
 				isOpen,
 				onOpenChange: handleOpenChange,

package/dist/components/inputs/Selection/shared/selectItem.cva.d.ts

@@ -0,0 +1,6 @@
+import { VariantProps } from 'class-variance-authority';
+export declare const selectListBoxItemCva: (props?: ({
+    isSingle?: boolean | null | undefined;
+    isNewItem?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export type SelectListBoxItemCva = VariantProps<typeof selectListBoxItemCva>;

package/dist/components/inputs/Selection/shared/selectItem.cva.js

@@ -0,0 +1,21 @@
+import { cva } from "class-variance-authority";
+//#region src/components/inputs/Selection/shared/selectItem.cva.ts
+var selectListBoxItemCva = cva([
+	"group flex cursor-pointer items-center gap-2 px-list-side-item-left py-list-height-item",
+	"border-b border-b-elevation-outline-default-1 outline-none",
+	"font-labels-default text-label-2",
+	"hover:text-interactive-text-secondary-hover",
+	"focus-visible:bg-interactive-contained-primary-focus focus-visible:text-interactive-text-secondary-idle-inverted",
+	"disabled:cursor-default disabled:text-interactive-text-secondary-disabled"
+], {
+	variants: {
+		isSingle: { true: "selected:bg-interactive-contained-primary-idle selected:text-interactive-contained-primary-on-idle" },
+		isNewItem: {
+			true: "text-interactive-text-primary-idle",
+			false: "text-interactive-text-secondary-idle"
+		}
+	},
+	defaultVariants: { isNewItem: false }
+});
+//#endregion
+export { selectListBoxItemCva };

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

@@ -15,6 +15,7 @@ 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, onChange, onBlur }) => {
+var TextEditorBase = ({ ref, as = "default", placeholder, label, hideLabel, tooltipText, helperText, isRequired, rightContent, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, value, className, editorClassName, isDirty, onChange, onBlur }) => {
 	const contentRef = useRef(null);
 	const { hoverProps, isHovered } = useHover({ isDisabled });
 	const [isFocused, setIsFocused] = useState(false);
@@ -109,6 +109,8 @@ 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,
@@ -136,13 +138,15 @@ var TextEditor = (props) => {
 		return /* @__PURE__ */ jsx(Controller, {
 			control: formControl.control,
 			name: formControl.name,
-			render: ({ field }) => /* @__PURE__ */ jsx(TextEditorBase, {
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(TextEditorBase, {
 				...innerProps,
 				ref: mergeRefs(ref, field.ref),
 				value: field.value,
 				onChange: field.onChange,
 				onBlur: field.onBlur,
-				isDisabled: field.disabled || props.isDisabled
+				isDirty,
+				isDisabled: field.disabled || props.isDisabled,
+				error: props.error ?? error?.message
 			})
 		});
 	}

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

@@ -19,13 +19,12 @@ export declare namespace UIConfig {
         [P in keyof T]-?: T[P] extends object ? DeepRequired<T[P]> : Exclude<T[P], null | undefined>;
     };
     export interface Options {
-        renderStaticInput: boolean;
         input: Pick<TextInputProps, "variant" | "isClearable" | "hideLabel" | "as" | "size">;
         button: Pick<ButtonProps, "variant" | "size">;
         numberInput: Pick<NumberInputProps, "formatOptions">;
         radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel">;
         checkbox: Pick<CheckboxProps, "variant">;
-        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType" | "hideSearchIcon">;
+        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType" | "hideSearchIcon" | "fireBlurOnChange">;
         toggle: Pick<ToggleProps, "variant">;
         slider: Pick<SliderProps, "minValue" | "maxValue">;
         dateInput: Pick<DatePickerProps, "todayIcon" | "shouldForceLeadingZeros" | "disableManualEntry">;

package/dist/config/uiConfig.context.js

@@ -6,7 +6,6 @@ import { createContext, use } from "react";
 var UIConfig;
 (function(_UIConfig) {
 	const DEFAULT_CONFIG = {
-		renderStaticInput: true,
 		input: {
 			variant: "outlined",
 			as: "default",
@@ -32,7 +31,8 @@ var UIConfig;
 			isSearchable: false,
 			selectedTagsType: "list",
 			collapseAfter: 3,
-			hideSearchIcon: false
+			hideSearchIcon: false,
+			fireBlurOnChange: false
 		},
 		toggle: { variant: "default" },
 		slider: {

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

@@ -24,6 +24,7 @@ import { LinkVariantProps } from '../components/text/Link/link.cva';
 import { TagVariantProps } from '../components/text/Tag/tag.cva';
 import { TypographyVariantProps } from '../components/text/Typography/typography.cva';
 import { CompoundMapper, ConfigSchema } from '../utils/compoundMapper';
+import { SelectListBoxItemCva } from '../components/inputs/Selection/shared/selectItem.cva';
 export declare namespace UIStyle {
     export type Cva<T> = (props: (T & ClassProp) | ClassProp) => string;
     type OptionKey = {
@@ -147,6 +148,9 @@ export declare namespace UIStyle {
             errorLabelCva?: Cva<FormFieldErrorVariantProps>;
             helperLabelCva?: Cva<FormFieldHelperVariantProps>;
         };
+        select: {
+            listBoxItemCva?: Cva<SelectListBoxItemCva>;
+        };
     }
     interface ProviderProps {
         config?: Partial<Options>;

package/dist/utils/date-time.utils.d.ts

@@ -1,15 +1,5 @@
 import { CalendarDate, CalendarDateTime, DateValue, ZonedDateTime } from '@internationalized/date';
 export declare namespace DateTimeUtils {
-    function getDatePlaceholder(locale?: string): string;
-    function getTimePlaceholder(locale?: string): string;
-    function getDateTimePlaceholder(locale?: string): string;
-    function getDateRangePlaceholder(locale?: string): string;
-    function formatCalendarDateLocalized(calendarDate: CalendarDate, locale?: string): string;
-    function formatTimeLocalized(timeValue: {
-        hour: number;
-        minute: number;
-    }, locale?: string): string;
-    function formatCalendarDateTimeLocalized(calendarDateTime: Pick<CalendarDateTime, "day" | "month" | "year" | "hour" | "minute">, locale?: string): string;
     function fromISOtoZonedDateTime(isoString: string): ZonedDateTime;
     function fromDateValueToISO(dateValue: DateValue): string;
     function fromLocalToZonedDateTime(date: Date): ZonedDateTime;

package/dist/utils/date-time.utils.js

@@ -1,88 +1,7 @@
-import { CalendarDate, CalendarDateTime, DateFormatter, fromDate, getLocalTimeZone, parseAbsolute, parseAbsoluteToLocal } from "@internationalized/date";
+import { CalendarDate, CalendarDateTime, fromDate, getLocalTimeZone, parseAbsolute, parseAbsoluteToLocal } from "@internationalized/date";
 //#region src/utils/date-time.utils.ts
 var DateTimeUtils;
 (function(_DateTimeUtils) {
-	const DATE_SAMPLE_DATE_UTC = new Date(Date.UTC(2e3, 10, 22));
-	const TIME_SAMPLE_DATE_UTC = new Date(Date.UTC(2e3, 10, 22, 13, 45));
-	const getDatePlaceholderFormatter = (locale) => new Intl.DateTimeFormat(locale, {
-		day: "2-digit",
-		month: "2-digit",
-		year: "numeric"
-	});
-	const getTimePlaceholderFormatter = (locale) => new Intl.DateTimeFormat(locale, {
-		hour: "2-digit",
-		minute: "2-digit",
-		hourCycle: "h23"
-	});
-	const getResolvedLocale = (locale) => {
-		if (locale) return locale;
-		return new Intl.DateTimeFormat().resolvedOptions().locale;
-	};
-	const getDateFormatter = (locale) => new DateFormatter(getResolvedLocale(locale), {
-		day: "2-digit",
-		month: "2-digit",
-		year: "numeric",
-		timeZone: "UTC"
-	});
-	const getTimeFormatter = (locale) => new DateFormatter(getResolvedLocale(locale), {
-		hour: "2-digit",
-		minute: "2-digit",
-		hourCycle: "h23",
-		timeZone: "UTC"
-	});
-	const getDateTimeFormatter = (locale) => new DateFormatter(getResolvedLocale(locale), {
-		day: "2-digit",
-		month: "2-digit",
-		year: "numeric",
-		hour: "2-digit",
-		minute: "2-digit",
-		hourCycle: "h23",
-		timeZone: "UTC"
-	});
-	const mapTypeToPlaceholder = (type) => {
-		switch (type) {
-			case "day": return "dd";
-			case "month": return "mm";
-			case "year": return "yyyy";
-			case "hour": return "hh";
-			case "minute": return "mm";
-			default: return null;
-		}
-	};
-	const formatPlaceholder = (formatter, sampleDate) => {
-		return formatter.formatToParts(sampleDate).map((part) => mapTypeToPlaceholder(part.type) ?? part.value).join("");
-	};
-	function getDatePlaceholder(locale) {
-		return formatPlaceholder(getDatePlaceholderFormatter(locale), DATE_SAMPLE_DATE_UTC);
-	}
-	_DateTimeUtils.getDatePlaceholder = getDatePlaceholder;
-	function getTimePlaceholder(locale) {
-		return formatPlaceholder(getTimePlaceholderFormatter(locale), TIME_SAMPLE_DATE_UTC);
-	}
-	_DateTimeUtils.getTimePlaceholder = getTimePlaceholder;
-	function getDateTimePlaceholder(locale) {
-		return `${getDatePlaceholder(locale)}, ${getTimePlaceholder(locale)}`;
-	}
-	_DateTimeUtils.getDateTimePlaceholder = getDateTimePlaceholder;
-	function getDateRangePlaceholder(locale) {
-		const datePlaceholder = getDatePlaceholder(locale);
-		return `${datePlaceholder} – ${datePlaceholder}`;
-	}
-	_DateTimeUtils.getDateRangePlaceholder = getDateRangePlaceholder;
-	function formatCalendarDateLocalized(calendarDate, locale) {
-		return getDateFormatter(locale).format(calendarDate.toDate("UTC"));
-	}
-	_DateTimeUtils.formatCalendarDateLocalized = formatCalendarDateLocalized;
-	function formatTimeLocalized(timeValue, locale) {
-		const dateTime = new CalendarDateTime(2e3, 11, 22, timeValue.hour, timeValue.minute);
-		return getTimeFormatter(locale).format(dateTime.toDate("UTC"));
-	}
-	_DateTimeUtils.formatTimeLocalized = formatTimeLocalized;
-	function formatCalendarDateTimeLocalized(calendarDateTime, locale) {
-		const normalizedValue = new CalendarDateTime(calendarDateTime.year, calendarDateTime.month, calendarDateTime.day, calendarDateTime.hour, calendarDateTime.minute);
-		return getDateTimeFormatter(locale).format(normalizedValue.toDate("UTC"));
-	}
-	_DateTimeUtils.formatCalendarDateTimeLocalized = formatCalendarDateTimeLocalized;
 	function fromISOtoZonedDateTime(isoString) {
 		return parseAbsoluteToLocal(isoString);
 	}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@povio/ui",
-  "version": "2.2.8-rc",
+  "version": "2.2.9-rc.1",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",

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

@@ -1,18 +0,0 @@
-import { ReactNode } from 'react';
-import { FormFieldProps } from '../FormField/FormField';
-import { TextInputProps } from '../Input/TextInput/TextInput';
-import { InputSizeProps, InputVariantProps } from './input.cva';
-interface StaticInputProps extends FormFieldProps {
-    onInteract: (shouldFocus: boolean) => void;
-    as?: TextInputProps["as"];
-    size?: InputSizeProps["size"];
-    variant?: InputVariantProps["variant"];
-    placeholder?: ReactNode;
-    displayValue?: ReactNode;
-    isEmpty?: boolean;
-    leadingVisual?: ReactNode;
-    trailingVisual?: ReactNode;
-    inputClassName?: string;
-}
-export declare const StaticInput: ({ onInteract, as, size, variant, placeholder, displayValue, isEmpty, leadingVisual, trailingVisual, inputClassName, className, ...formFieldProps }: StaticInputProps) => import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -1,69 +0,0 @@
-import { UIStyle } from "../../../config/uiStyle.context.js";
-import { FormFieldLabel } from "../FormField/FormFieldLabel.js";
-import { inputBase, inputSize } from "./input.cva.js";
-import { FormField } from "../FormField/FormField.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { clsx } from "clsx";
-//#region src/components/inputs/shared/StaticInput.tsx
-var StaticInput = ({ onInteract, as, size, variant, placeholder, displayValue, isEmpty, leadingVisual, trailingVisual, inputClassName, className, ...formFieldProps }) => {
-	const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
-	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
-	let hasValue = !!displayValue;
-	if (isEmpty != null) hasValue = !isEmpty;
-	let staticDisplayContent = placeholder;
-	if (hasValue) staticDisplayContent = displayValue;
-	else if (as === "floating") staticDisplayContent = null;
-	const shouldRenderFloatingLineSpacer = as === "floating" && !hasValue;
-	return /* @__PURE__ */ jsx(FormField, {
-		...formFieldProps,
-		as,
-		className,
-		onMouseEnter: () => onInteract(false),
-		tabIndex: as === "inline" ? -1 : void 0,
-		children: /* @__PURE__ */ jsxs("div", {
-			tabIndex: formFieldProps.isDisabled ? -1 : 0,
-			onFocus: () => onInteract(true),
-			onClick: () => onInteract(true),
-			onPointerDown: () => onInteract(true),
-			"data-is-empty": !hasValue || void 0,
-			"data-disabled": formFieldProps.isDisabled || void 0,
-			"data-is-disabled": formFieldProps.isDisabled || void 0,
-			"data-has-selection": hasValue || void 0,
-			"data-rac": "",
-			className: clsx("group/static-input group/input-content group/select-content relative flex min-w-input-width-min-width items-center justify-between gap-input-gap-input-text-to-elements", inputBaseCva({
-				as,
-				variant
-			}), inputClassName),
-			children: [/* @__PURE__ */ jsxs("div", {
-				className: clsx(inputSizeCva({
-					size,
-					as
-				}), "flex w-full items-center gap-input-gap-input-text-to-elements pr-0!"),
-				children: [leadingVisual && /* @__PURE__ */ jsx("div", {
-					className: "pointer-events-none shrink-0",
-					children: leadingVisual
-				}), /* @__PURE__ */ jsxs("div", {
-					className: clsx("flex w-full truncate", as === "floating" && "flex-col", as === "filter" && "gap-input-gap-input-text-to-elements"),
-					children: [as && ["filter", "floating"].includes(as) && /* @__PURE__ */ jsx(FormFieldLabel, {
-						as,
-						size,
-						label: formFieldProps.label,
-						isRequired: formFieldProps.isRequired,
-						isDisabled: formFieldProps.isDisabled
-					}), /* @__PURE__ */ jsxs("div", {
-						className: clsx("truncate", !hasValue && "text-text-default-3"),
-						children: [staticDisplayContent, shouldRenderFloatingLineSpacer && /* @__PURE__ */ jsx(Fragment, { children: "\xA0" })]
-					})]
-				})]
-			}), trailingVisual && /* @__PURE__ */ jsx("div", {
-				className: clsx(inputSizeCva({
-					size,
-					as
-				}), "pointer-events-none flex items-center gap-input-gap-trailing-elements py-0! pl-0!"),
-				children: trailingVisual
-			})]
-		})
-	});
-};
-//#endregion
-export { StaticInput };