@povio/ui 3.4.0-rc.15 → 3.4.0-rc.17

package/dist/components/text/Typography/typography.cva.d.ts

@@ -1,49 +1,52 @@
-import { UIOverrides } from '../../../config/uiOverrides.context';
-export declare const typographyDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly size: {
-            readonly "headline-1": "md:text-desktop-headline-1";
-            readonly "title-1": "md:text-desktop-title-1";
-            readonly "title-2": "md:text-desktop-title-2";
-            readonly "title-3": "md:text-desktop-title-3";
-            readonly "title-4": "md:text-desktop-title-4";
-            readonly "title-5": "md:text-desktop-title-5";
-            readonly "title-6": "md:text-desktop-title-6";
-            readonly "body-1": "md:text-desktop-body-1";
-            readonly "body-2": "md:text-desktop-body-2";
-            readonly "body-3": "md:text-desktop-body-3";
-            readonly "body-4": "md:text-desktop-body-4";
-            readonly "label-1": "md:text-label-1";
-            readonly "label-2": "md:text-label-2";
-            readonly "label-3": "md:text-label-3";
-        };
-        readonly sizeMobile: {
-            readonly "headline-1": "text-mobile-headline-1";
-            readonly "title-1": "text-mobile-title-1";
-            readonly "title-2": "text-mobile-title-2";
-            readonly "title-3": "text-mobile-title-3";
-            readonly "title-4": "text-mobile-title-4";
-            readonly "title-5": "text-mobile-title-5";
-            readonly "title-6": "text-mobile-title-6";
-            readonly "body-1": "text-mobile-body-1";
-            readonly "body-2": "text-mobile-body-2";
-            readonly "body-3": "text-mobile-body-3";
-            readonly "body-4": "text-mobile-body-4";
-            readonly "label-1": "text-label-1";
-            readonly "label-2": "text-label-2";
-            readonly "label-3": "text-label-3";
-        };
-        readonly variant: {
-            readonly default: "";
-            readonly "prominent-1": "";
-            readonly "default-italic": "italic";
-            readonly "prominent-1-italic": "italic";
-            readonly "prominent-2": "";
-            readonly "prominent-2-italic": "italic";
-        };
-    }>;
+import { StyleMergeUtils } from "../../../utils/style-merge.util.js";
+import { UIOverrides } from "../../../config/uiOverrides.context.js";
+//#region src/components/text/Typography/typography.cva.d.ts
+declare const typographyDefinition: {
+  base: string[];
+  config: StyleMergeUtils.Config<{
+    readonly size: {
+      readonly "headline-1": "md:text-desktop-headline-1";
+      readonly "title-1": "md:text-desktop-title-1";
+      readonly "title-2": "md:text-desktop-title-2";
+      readonly "title-3": "md:text-desktop-title-3";
+      readonly "title-4": "md:text-desktop-title-4";
+      readonly "title-5": "md:text-desktop-title-5";
+      readonly "title-6": "md:text-desktop-title-6";
+      readonly "body-1": "md:text-desktop-body-1";
+      readonly "body-2": "md:text-desktop-body-2";
+      readonly "body-3": "md:text-desktop-body-3";
+      readonly "body-4": "md:text-desktop-body-4";
+      readonly "label-1": "md:text-label-1";
+      readonly "label-2": "md:text-label-2";
+      readonly "label-3": "md:text-label-3";
+    };
+    readonly sizeMobile: {
+      readonly "headline-1": "text-mobile-headline-1";
+      readonly "title-1": "text-mobile-title-1";
+      readonly "title-2": "text-mobile-title-2";
+      readonly "title-3": "text-mobile-title-3";
+      readonly "title-4": "text-mobile-title-4";
+      readonly "title-5": "text-mobile-title-5";
+      readonly "title-6": "text-mobile-title-6";
+      readonly "body-1": "text-mobile-body-1";
+      readonly "body-2": "text-mobile-body-2";
+      readonly "body-3": "text-mobile-body-3";
+      readonly "body-4": "text-mobile-body-4";
+      readonly "label-1": "text-label-1";
+      readonly "label-2": "text-label-2";
+      readonly "label-3": "text-label-3";
+    };
+    readonly variant: {
+      readonly default: "";
+      readonly "prominent-1": "";
+      readonly "default-italic": "italic";
+      readonly "prominent-1-italic": "italic";
+      readonly "prominent-2": "";
+      readonly "prominent-2-italic": "italic";
+    };
+  }>;
 };
-export type TypographyConfig = NonNullable<typeof typographyDefinition.config>;
-export interface TypographyVariantProps extends UIOverrides.VariantProps<TypographyConfig> {
-}
+type TypographyConfig = NonNullable<typeof typographyDefinition.config>;
+interface TypographyVariantProps extends UIOverrides.VariantProps<TypographyConfig> {}
+//#endregion
+export { TypographyConfig, TypographyVariantProps, typographyDefinition };

package/dist/components/text/Typography/typography.cva.js

@@ -1,6 +1,6 @@
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 //#region src/components/text/Typography/typography.cva.ts
-var typographyDefinition = UIOverrides.defineConfig({
+const typographyDefinition = UIOverrides.defineConfig({
 	base: [""],
 	config: {
 		variants: {

package/dist/components/text-area.d.ts

@@ -0,0 +1,21 @@
+import { FieldValues } from "./inputs/shared/form.binding.js";
+import { ControlProps } from "./inputs/shared/form.types.js";
+import { InputVariantProps } from "./inputs/shared/input.cva.js";
+import { FormFieldProps } from "./form-field.js";
+import { Ref } from "react";
+import { TextAreaProps as TextAreaProps$1 } from "react-aria-components";
+import { AriaTextFieldProps } from "react-aria";
+//#region src/components/inputs/Input/TextArea/TextArea.d.ts
+interface TextAreaBaseProps extends FormFieldProps, InputVariantProps, Omit<TextAreaProps$1, "value" | "defaultValue" | "onChange" | "disabled" | "required" | "className" | keyof AriaTextFieldProps>, Omit<AriaTextFieldProps<HTMLTextAreaElement>, "label"> {
+  ref?: Ref<HTMLTextAreaElement>;
+  isClearable?: boolean;
+  isClearableIfDisabled?: boolean;
+  isDirty?: boolean;
+  inputClassName?: string;
+}
+interface TextAreaProps extends TextAreaBaseProps {}
+type ControlledTextAreaProps<TFieldValues extends FieldValues> = ControlProps<TextAreaProps, TFieldValues>;
+declare const TextAreaComponent: <TFieldValues extends FieldValues>(props: ControlledTextAreaProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+declare const TextArea: typeof TextAreaComponent;
+//#endregion
+export { ControlledTextAreaProps, TextArea, TextAreaProps };

package/dist/components/text-area.js

@@ -0,0 +1,138 @@
+import { UIOverrides } from "../config/uiOverrides.context.js";
+import { UIConfig } from "../config/uiConfig.context.js";
+import { FieldController } from "./inputs/shared/form.binding.js";
+import { FormFieldLabel } from "./inputs/FormField/FormFieldLabel.js";
+import { FormField } from "./form-field.js";
+import { inputSideDefinition, inputSizeDefinition, useInputCva } from "./inputs/shared/input.cva.js";
+import { InputClear } from "./inputs/shared/InputClear.js";
+import { TooltipWrapper } from "./inputs/shared/TooltipWrapper.js";
+import { textAreaWrapperDefinition } from "./inputs/Input/TextArea/TextArea.cva.js";
+import { clsx } from "clsx";
+import { memo, useRef } from "react";
+import { TextArea as TextArea$1 } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTextField } from "react-aria";
+import { mergeRefs } from "@react-aria/utils";
+//#region src/components/inputs/Input/TextArea/TextArea.tsx
+const TextAreaBase = (props) => {
+	const ui = UIConfig.useConfig();
+	const inputCva = useInputCva();
+	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
+	const inputSideCva = UIOverrides.useCva("input.sideCva", inputSideDefinition);
+	const textAreaWrapperCva = UIOverrides.useCva("textArea.wrapperCva", textAreaWrapperDefinition);
+	const { ref, className, inputClassName, error, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, value, onChange, onBlur, as: asProp, hideLabel: hideLabelProp, variant: variantProp, isClearable: isClearableProp, isClearableIfDisabled, ...rest } = props;
+	const as = asProp ?? ui.input.as;
+	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
+	const variant = variantProp ?? ui.input.variant;
+	const isClearable = isClearableProp ?? ui.input.isClearable;
+	const textFieldRef = useRef(null);
+	const textFieldProps = {
+		...rest,
+		label,
+		isDisabled,
+		isInvalid: !!error,
+		isRequired,
+		value,
+		onChange,
+		onBlur
+	};
+	const { labelProps, inputProps } = useTextField(textFieldProps, textFieldRef);
+	const formFieldProps = {
+		error,
+		label,
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
+		hideLabel,
+		isDisabled,
+		headerClassName,
+		errorClassName
+	};
+	const headerProps = {
+		label,
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: hideLabel || isHeaderHidden,
+		isDisabled,
+		className: headerClassName,
+		labelProps
+	};
+	const showClear = isClearable && value != null && value !== "" && (!isDisabled || isClearableIfDisabled === true);
+	return /* @__PURE__ */ jsx(TooltipWrapper, {
+		as,
+		error,
+		triggerTabIndex: as === "inline" ? -1 : void 0,
+		children: /* @__PURE__ */ jsx(FormField, {
+			...formFieldProps,
+			as,
+			labelProps,
+			className: clsx("group w-full flex flex-col", className),
+			tabIndex: as === "inline" ? -1 : void 0,
+			children: /* @__PURE__ */ jsxs("div", {
+				className: textAreaWrapperCva({}),
+				"data-text-area": true,
+				children: [
+					as === "floating" && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
+						as,
+						...headerProps,
+						className: clsx(headerProps.className, inputSideCva({
+							size: "default",
+							type: "left"
+						}))
+					}),
+					/* @__PURE__ */ jsx(TextArea$1, {
+						...inputProps,
+						"data-is-dirty": isDirty || void 0,
+						"data-is-required": isRequired || void 0,
+						"data-is-empty": value?.trim() === "" || value === null || value === void 0 || void 0,
+						placeholder: as === "floating" ? "" : inputProps.placeholder,
+						className: inputCva({
+							variant,
+							as,
+							...rest,
+							className: clsx("block h-full min-h-8", inputClassName)
+						}),
+						ref
+					}),
+					showClear && /* @__PURE__ */ jsx("span", {
+						className: clsx("absolute top-0 right-0", inputSizeCva({ size: "default" })),
+						children: /* @__PURE__ */ jsx(InputClear, {
+							onClear: () => {
+								onChange?.("");
+								onBlur?.(null);
+							},
+							show: true
+						})
+					})
+				]
+			})
+		})
+	});
+};
+const TextAreaComponent = (props) => {
+	if ("field" in props && props.field) {
+		const { field, ref, ...innerProps } = props;
+		return /* @__PURE__ */ jsx(FieldController, {
+			control: field.form,
+			name: field.name,
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(TextAreaBase, {
+				...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
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx(TextAreaBase, { ...props });
+};
+const TextArea = memo(TextAreaComponent);
+//#endregion
+export { TextArea };

package/dist/components/text-button.d.ts

@@ -0,0 +1,15 @@
+import { LinkNavigationProps } from "./link.js";
+import { ButtonVariantProps } from "./buttons/Button/button.cva.js";
+import { ButtonContentVariantProps } from "./buttons/shared/buttonContent.cva.js";
+import { ButtonIconProps } from "./buttons/Button/Button.js";
+import { ReactNode } from "react";
+import { ButtonProps } from "react-aria-components";
+//#region src/components/buttons/TextButton/TextButton.d.ts
+type TextButtonProps = Omit<ButtonVariantProps, "variant"> & ButtonContentVariantProps & ButtonProps & ButtonIconProps<true | false> & {
+  children: ReactNode;
+  isLoading?: boolean;
+  link?: LinkNavigationProps;
+};
+declare const TextButton: ({ children, ...props }: TextButtonProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { TextButton, TextButtonProps };

package/dist/components/{buttons/TextButton/TextButton.js → text-button.js}

@@ -1,8 +1,8 @@
-import { Button } from "../Button/Button.js";
+import { Button } from "./buttons/Button/Button.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/buttons/TextButton/TextButton.tsx
-var TextButton = (t0) => {
+const TextButton = (t0) => {
 	const $ = c(7);
 	let children;
 	let props;

package/dist/components/text-input.d.ts

@@ -0,0 +1,27 @@
+import { FieldValues } from "./inputs/shared/form.binding.js";
+import { ControlProps } from "./inputs/shared/form.types.js";
+import { InputVariantProps } from "./inputs/shared/input.cva.js";
+import { InputContentProps } from "./inputs/Input/shared/InputContent.js";
+import { FormFieldProps } from "./form-field.js";
+import { Ref } from "react";
+import { InputProps } from "react-aria-components";
+import { AriaTextFieldProps } from "react-aria";
+//#region src/components/inputs/Input/TextInput/TextInput.d.ts
+type AllowedHTMLInputTypeAttribute = "email" | "hidden" | "tel" | "text" | "url";
+interface TextInputBaseProps extends FormFieldProps, InputVariantProps, Omit<InputContentProps, "ref" | "value" | "onChange" | "onBlur">, Omit<InputProps, "value" | "defaultValue" | "onChange" | "disabled" | "required" | "type" | "size" | "className" | keyof AriaTextFieldProps>, Omit<AriaTextFieldProps<HTMLInputElement>, "label"> {
+  ref?: Ref<HTMLInputElement>;
+  inputClassName?: string;
+  type?: AllowedHTMLInputTypeAttribute;
+  todayIcon?: boolean;
+  isDirty?: boolean;
+  autoFocusOnMount?: boolean;
+}
+interface TextInputProps extends TextInputBaseProps {
+  renderStaticInput?: boolean;
+}
+type ControlledTextInputProps<TFieldValues extends Record<string, unknown>> = ControlProps<TextInputProps, TFieldValues>;
+/** @internal Exported for production render benchmarks. */
+declare const TextInputComponent: <TFieldValues extends FieldValues>({ renderStaticInput, ...props }: ControlledTextInputProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+declare const TextInput: typeof TextInputComponent;
+//#endregion
+export { ControlledTextInputProps, TextInput, TextInputComponent, TextInputProps };

package/dist/components/text-input.js

@@ -0,0 +1,241 @@
+import { UIOverrides } from "../config/uiOverrides.context.js";
+import { UIConfig } from "../config/uiConfig.context.js";
+import { FieldController } from "./inputs/shared/form.binding.js";
+import { FormField } from "./form-field.js";
+import { inputBaseDefinition } from "./inputs/shared/input.cva.js";
+import { TooltipWrapper } from "./inputs/shared/TooltipWrapper.js";
+import { InputFrame } from "./inputs/Skeleton/InputFrame.js";
+import { useStaticInputHandoff } from "./inputs/shared/useStaticInputHandoff.js";
+import { InputContent } from "./inputs/Input/shared/InputContent.js";
+import { useFieldAccessibility } from "./inputs/shared/useFieldAccessibility.js";
+import { clsx } from "clsx";
+import { memo, useEffect, useRef, useState } from "react";
+import { Input } from "react-aria-components";
+import { jsx } from "react/jsx-runtime";
+import { useFocusVisible, useTextField } from "react-aria";
+import { mergeRefs } from "@react-aria/utils";
+//#region src/components/inputs/Input/TextInput/TextInput.tsx
+const TextInputBase = (props) => {
+	"use no memo";
+	const ui = UIConfig.useConfig();
+	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
+	const inputRef = useRef(null);
+	const { ref, inputClassName, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, className, unit, isLoading, action, leadingIcon, trailingIcon, value, onChange, onBlur, as: asProp, hideLabel: hideLabelProp, variant: variantProp, size: sizeProp, isClearable: isClearableProp, isClearableIfDisabled, autoFocusOnMount, ...rest } = props;
+	const as = asProp ?? ui.input.as;
+	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
+	const variant = variantProp ?? ui.input.variant;
+	const size = sizeProp ?? ui.input.size;
+	const isClearable = isClearableProp ?? ui.input.isClearable;
+	const { isFocusVisible } = useFocusVisible();
+	const inputValue = value ?? "";
+	const textFieldRef = useRef(null);
+	const textFieldProps = {
+		...rest,
+		label,
+		isDisabled,
+		isInvalid: !!error,
+		isRequired,
+		value: inputValue,
+		onChange,
+		onBlur
+	};
+	const { labelProps, inputProps } = useTextField(textFieldProps, textFieldRef);
+	const { describedBy, errorMessageId, helperTextId } = useFieldAccessibility({
+		describedBy: inputProps["aria-describedby"],
+		error,
+		helperText
+	});
+	useEffect(() => {
+		if (!autoFocusOnMount || isDisabled) return;
+		requestAnimationFrame(() => inputRef.current?.focus());
+	}, [autoFocusOnMount, isDisabled]);
+	const formFieldProps = {
+		errorMessageId,
+		error,
+		label,
+		tooltipText,
+		helperText,
+		helperTextId,
+		isRequired,
+		rightContent,
+		isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
+		hideLabel,
+		isDisabled,
+		headerClassName,
+		errorClassName
+	};
+	const inputContentProps = {
+		unit,
+		isLoading,
+		isDisabled,
+		action,
+		leadingIcon,
+		trailingIcon,
+		isClearable,
+		isClearableIfDisabled,
+		value: inputValue,
+		onChange,
+		onBlur
+	};
+	const headerProps = {
+		label,
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: hideLabel || isHeaderHidden,
+		isDisabled,
+		className: headerClassName,
+		labelProps
+	};
+	const dataIsDisabled = isDisabled || void 0;
+	return /* @__PURE__ */ jsx(TooltipWrapper, {
+		as,
+		error,
+		triggerTabIndex: as === "inline" ? -1 : void 0,
+		children: /* @__PURE__ */ jsx(FormField, {
+			...formFieldProps,
+			as,
+			labelProps,
+			className: clsx("group w-full", as === "inline" && "h-full", className),
+			tabIndex: as === "inline" ? -1 : void 0,
+			"data-is-empty": value === "" || value === null || value === void 0 || void 0,
+			"data-is-required": isRequired || void 0,
+			children: /* @__PURE__ */ jsx("div", {
+				className: clsx("relative flex cursor-text has-disabled:cursor-default", inputBaseCva({
+					variant,
+					as,
+					...rest
+				}), inputClassName),
+				onClick: () => inputRef.current?.focus(),
+				"data-is-empty": value === "" || value === null || value === void 0 || void 0,
+				"data-is-required": isRequired || void 0,
+				"data-is-disabled": dataIsDisabled,
+				children: /* @__PURE__ */ jsx(InputContent, {
+					...inputContentProps,
+					headerProps,
+					as,
+					size,
+					children: /* @__PURE__ */ jsx(Input, {
+						...inputProps,
+						"aria-describedby": describedBy,
+						"aria-errormessage": errorMessageId,
+						ref: mergeRefs(ref, inputRef),
+						"data-is-empty": value === "" || value === null || value === void 0 || void 0,
+						"data-is-filled": !(value === "" || value === null || value === void 0) || void 0,
+						"data-is-dirty": isDirty || void 0,
+						"data-is-required": isRequired || void 0,
+						"data-is-disabled": dataIsDisabled,
+						placeholder: as === "floating" ? "\xA0" : inputProps.placeholder,
+						className: "w-full bg-transparent outline-none",
+						onFocus: (e) => {
+							inputProps.onFocus?.(e);
+							if (isFocusVisible) e.target.select();
+						}
+					})
+				})
+			})
+		})
+	});
+};
+const TextInputInner = ({ renderStaticInput, isFormControlDisabled, ...props }) => {
+	"use no memo";
+	const ui = UIConfig.useConfig();
+	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
+	const inputRef = useRef(null);
+	const { shouldFocus, renderRealInput, replayStaticInputChange, replayStaticInputPress } = useStaticInputHandoff({
+		inputRef,
+		renderInput,
+		setRenderInput,
+		getPressTarget: (input) => {
+			let element = input;
+			for (let depth = 0; element && depth < 6; depth += 1) {
+				const action = element.querySelector("[data-static-press-action]");
+				if (action) return action;
+				element = element.parentElement;
+			}
+			return null;
+		}
+	});
+	if (!renderInput) {
+		const staticValue = props.value ?? props.defaultValue ?? "";
+		const inputType = props.type;
+		const as = props.as ?? ui.input.as;
+		let isDisabled = !!props.isDisabled;
+		if (isFormControlDisabled) isDisabled = true;
+		const maskedPasswordValue = inputType === "password" && `${staticValue}`.length > 0 ? "•".repeat(`${staticValue}`.length) : staticValue;
+		const displayValue = maskedPasswordValue == null ? "" : `${maskedPasswordValue}`;
+		const hasValue = displayValue !== "";
+		const dataAttributes = {
+			dataIsEmpty: !hasValue,
+			dataIsFilled: hasValue,
+			dataIsDirty: props.isDirty,
+			dataIsRequired: props.isRequired,
+			dataIsDisabled: isDisabled,
+			dataDisabled: isDisabled,
+			dataInvalid: !!props.error,
+			dataHasSelection: hasValue
+		};
+		return /* @__PURE__ */ jsx(InputFrame, {
+			...props,
+			isDisabled,
+			className: clsx("group w-full", as === "inline" && "h-full", props.className),
+			dataAttributes,
+			onStaticInteract: renderRealInput,
+			onStaticPress: props.action ? replayStaticInputPress : void 0,
+			staticPressTarget: "action",
+			inputClassName: props.inputClassName,
+			contentClassName: clsx(as === "inline" && "h-full", "pr-0!"),
+			trailingClassName: "py-0! pl-0!",
+			wrapContentAndTrailing: true,
+			reserveTrailingContent: true,
+			children: (dataAttributeProps) => /* @__PURE__ */ jsx("input", {
+				ref: inputRef,
+				type: inputType === "hidden" ? "password" : inputType,
+				disabled: isDisabled,
+				tabIndex: -1,
+				value: displayValue,
+				placeholder: as === "floating" ? "" : props.placeholder,
+				className: "w-full bg-transparent outline-none",
+				onChange: (event) => replayStaticInputChange(event.target.value),
+				...dataAttributeProps,
+				"data-rac": true
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx(TextInputBase, {
+		...props,
+		ref: mergeRefs(props.ref, inputRef),
+		autoFocusOnMount: shouldFocus
+	});
+};
+/** @internal Exported for production render benchmarks. */
+const TextInputComponent = ({ renderStaticInput, ...props }) => {
+	"use no memo";
+	if ("field" in props && props.field) {
+		const { field, ref, ...innerProps } = props;
+		return /* @__PURE__ */ jsx(FieldController, {
+			control: field.form,
+			name: field.name,
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(TextInputInner, {
+				...innerProps,
+				ref: mergeRefs(ref, field.ref),
+				value: field.value,
+				onChange: field.onChange,
+				onBlur: field.onBlur,
+				isDirty,
+				isDisabled: field.disabled || props.isDisabled,
+				isFormControlDisabled: field.disabled,
+				error: props.error ?? error?.message,
+				renderStaticInput
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx(TextInputInner, {
+		...props,
+		renderStaticInput
+	});
+};
+const TextInput = memo(TextInputComponent);
+//#endregion
+export { TextInput, TextInputComponent };

package/dist/components/time-picker.d.ts

@@ -0,0 +1,2 @@
+import { ControlledTimePickerProps, TimePicker, TimePickerProps } from "./inputs/DateTime/TimePicker/TimePicker.js";
+export { type ControlledTimePickerProps, TimePicker, type TimePickerProps };

package/dist/components/time-picker.js

@@ -0,0 +1,2 @@
+import { TimePicker } from "./inputs/DateTime/TimePicker/TimePicker.js";
+export { TimePicker };

package/dist/components/toast.d.ts

@@ -0,0 +1,17 @@
+import { ToastVariantProps } from "./status/Toast/toast.cva.js";
+import { FC, ReactNode, SVGProps } from "react";
+//#region src/components/status/Toast/Toast.d.ts
+interface ToastAction {
+  text: string;
+  onPress: () => void;
+}
+interface ToastProps extends ToastVariantProps {
+  text: ReactNode;
+  isLoading?: boolean;
+  icon?: FC<SVGProps<SVGSVGElement>>;
+  actions?: ToastAction[];
+}
+declare const Toast: ({ text, isLoading, actions, icon: Icon, ...props }: ToastProps) => import("react/jsx-runtime").JSX.Element;
+declare const ToastContainer: () => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { Toast, ToastAction, ToastContainer, ToastProps };

package/dist/components/{status/Toast/Toast.js → toast.js}

@@ -1,14 +1,14 @@
-import { UIOverrides } from "../../../config/uiOverrides.context.js";
-import { Typography } from "../../text/Typography/Typography.js";
-import { Loader } from "../Loader/Loader.js";
-import { UIConfig } from "../../../config/uiConfig.context.js";
-import { Button } from "../../buttons/Button/Button.js";
-import { buttonColorVariant, statusIconDefinition, statusSeparatorDefinition, toastContainerDefinition, toastDefinition, toastWrapper } from "./toast.cva.js";
+import { UIOverrides } from "../config/uiOverrides.context.js";
+import { Typography } from "./typography.js";
+import { Loader } from "./loader.js";
+import { UIConfig } from "../config/uiConfig.context.js";
+import { Button } from "./buttons/Button/Button.js";
+import { buttonColorVariant, statusIconDefinition, statusSeparatorDefinition, toastContainerDefinition, toastDefinition, toastWrapper } from "./status/Toast/toast.cva.js";
 import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { ToastContainer } from "react-toastify";
+import { ToastContainer as ToastContainer$1 } from "react-toastify";
 //#region src/components/status/Toast/Toast.tsx
-var Toast = ({ text, isLoading = false, actions = [], icon: Icon, ...props }) => {
+const Toast = ({ text, isLoading = false, actions = [], icon: Icon, ...props }) => {
 	const uiConfig = UIConfig.useConfig();
 	const { variant = uiConfig.toast.variant, ...restProps } = props;
 	const toastCva = UIOverrides.useCva("toast.cva", toastDefinition);
@@ -47,7 +47,7 @@ var Toast = ({ text, isLoading = false, actions = [], icon: Icon, ...props }) =>
 		})] })]
 	});
 };
-var ToastContainer$1 = () => {
+const ToastContainer = () => {
 	const $ = c(6);
 	const uiConfig = UIConfig.useConfig();
 	const containerCva = UIOverrides.useCva("toast.containerCva", toastContainerDefinition);
@@ -63,7 +63,7 @@ var ToastContainer$1 = () => {
 	} else t0 = $[2];
 	let t1;
 	if ($[3] !== t0 || $[4] !== uiConfig.toast.position) {
-		t1 = /* @__PURE__ */ jsx(ToastContainer, {
+		t1 = /* @__PURE__ */ jsx(ToastContainer$1, {
 			position: uiConfig.toast.position,
 			className: t0,
 			toastClassName: toastWrapper,
@@ -79,4 +79,4 @@ var ToastContainer$1 = () => {
 	return t1;
 };
 //#endregion
-export { Toast, ToastContainer$1 as ToastContainer };
+export { Toast, ToastContainer };

package/dist/components/toggle-button.d.ts

@@ -0,0 +1,12 @@
+import { ButtonVariantProps } from "./buttons/Button/button.cva.js";
+import { ButtonContentVariantProps } from "./buttons/shared/buttonContent.cva.js";
+import { ButtonIconProps } from "./buttons/Button/Button.js";
+import { ReactNode } from "react";
+import { ToggleButtonProps as ToggleButtonProps$1 } from "react-aria-components";
+//#region src/components/buttons/ToggleButton/ToggleButton.d.ts
+type ToggleButtonProps = ButtonVariantProps & ButtonContentVariantProps & ToggleButtonProps$1 & ButtonIconProps<true | false> & {
+  children: ReactNode;
+};
+declare const ToggleButton: ({ children, ...props }: ToggleButtonProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { ToggleButton, ToggleButtonProps };