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

package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js

@@ -1,337 +0,0 @@
-import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-import { UIConfig } from "../../../../config/uiConfig.context.js";
-import { FieldController } from "../../shared/form.binding.js";
-import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
-import { inputBaseDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
-import { IntlUtils } from "../../../../utils/intl.utils.js";
-import { InputClear } from "../../shared/InputClear.js";
-import { InputFrame } from "../../Skeleton/InputFrame.js";
-import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
-import { getStaticNumberDisplayValue } from "../shared/numberStatic.utils.js";
-import { NumberRangeField } from "./NumberRangeField.js";
-import { c } from "react/compiler-runtime";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { useRef, useState } from "react";
-import { useLocale } from "react-aria-components";
-import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
-//#region src/components/inputs/Input/NumberRangeInput/NumberRangeInput.tsx
-var EMPTY_RANGE = {
-	min: null,
-	max: null
-};
-var normalizeRangeValue = (value, minValue, maxValue) => {
-	if (value) return value;
-	return {
-		min: minValue ?? null,
-		max: maxValue ?? null
-	};
-};
-var NumberRangeInputBase = (props) => {
-	const ui = UIConfig.useConfig();
-	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
-	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
-	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, className, inputClassName, minInputClassName, maxInputClassName, value, minValue, maxValue, minPlaceholder = "Min", maxPlaceholder = "Max", minLabel = "Minimum", maxLabel = "Maximum", invalidRangeError = "Minimum cannot be greater than maximum", hideInnerLabels = true, isDirty, autoFocusOnMount, onChange, onMinChange, onMaxChange, onBlur, isClearable: isClearableProps, as: asProp, variant: variantProps, size: sizeProps, hideLabel: hideLabelProps, ...rest } = props;
-	const isClearable = isClearableProps ?? ui.input.isClearable;
-	const as = asProp ?? ui.input.as;
-	const variant = variantProps ?? ui.input.variant;
-	const size = sizeProps ?? ui.input.size;
-	const hideLabel = hideLabelProps ?? ui.input.hideLabel;
-	const rangeValue = normalizeRangeValue(value, minValue, maxValue);
-	const isEmpty = rangeValue.min === null && rangeValue.max === null;
-	const rangeError = rangeValue.min !== null && rangeValue.max !== null && rangeValue.min > rangeValue.max ? invalidRangeError : void 0;
-	const effectiveError = error || rangeError;
-	const { hoverProps, isHovered } = useHover({ isDisabled });
-	const { isFocusVisible } = useFocusVisible();
-	const [isFocused, setIsFocused] = useState(false);
-	const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: setIsFocused });
-	const formFieldProps = {
-		error: effectiveError,
-		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
-	};
-	const updateRange = (side, nextValue) => {
-		const nextRange = {
-			...rangeValue,
-			[side]: nextValue
-		};
-		onChange?.(nextRange);
-		if (side === "min") onMinChange?.(nextValue);
-		else onMaxChange?.(nextValue);
-	};
-	const clearRangeSide = (side_0) => {
-		updateRange(side_0, null);
-		onBlur?.({ target: { value: "" } });
-	};
-	return /* @__PURE__ */ jsx(NumberRangeField, {
-		...rest,
-		ref,
-		as,
-		className,
-		inputClassName,
-		minInputClassName,
-		maxInputClassName,
-		inputBaseClassName: inputBaseCva({
-			variant,
-			as
-		}),
-		inputSizeClassName: inputSizeCva({
-			size,
-			as
-		}),
-		formFieldProps,
-		headerProps,
-		rangeValue,
-		effectiveError,
-		minPlaceholder,
-		maxPlaceholder,
-		minLabel,
-		maxLabel,
-		hideInnerLabels,
-		isDirty,
-		isClearable,
-		autoFocusOnMount,
-		isDisabled,
-		isRequired,
-		isEmpty,
-		isHovered,
-		isFocused,
-		isFocusVisible,
-		focusWithinProps,
-		hoverProps,
-		onRangeSideChange: updateRange,
-		onRangeSideClear: clearRangeSide,
-		onBlur
-	});
-};
-var NumberRangeInputInner = (t0) => {
-	const $ = c(5);
-	const { renderStaticInput, isFormControlDisabled, ...props } = t0;
-	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
-	const ui = UIConfig.useConfig();
-	const { locale } = useLocale();
-	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
-	const inputRef = useRef(null);
-	let t1;
-	if ($[0] !== renderInput) {
-		t1 = {
-			inputRef,
-			renderInput,
-			setRenderInput
-		};
-		$[0] = renderInput;
-		$[1] = t1;
-	} else t1 = $[1];
-	const { shouldFocus, renderRealInput } = useStaticInputHandoff(t1);
-	if (!renderInput) {
-		const staticValue = normalizeRangeValue(props.value, props.minValue, props.maxValue);
-		const formatOptions = props.formatOptions ?? ui.numberInput.formatOptions;
-		const formatter = IntlUtils.getNumberFormatter(locale, formatOptions);
-		const minDisplay = getStaticNumberDisplayValue(staticValue.min, formatter);
-		const maxDisplay = getStaticNumberDisplayValue(staticValue.max, formatter);
-		const hasValue = minDisplay !== null || maxDisplay !== null;
-		const rangeError = staticValue.min !== null && staticValue.max !== null && staticValue.min > staticValue.max ? props.invalidRangeError ?? "Minimum cannot be greater than maximum" : void 0;
-		const effectiveError = props.error || rangeError;
-		const as = props.as ?? ui.input.as;
-		const size = props.size ?? ui.input.size;
-		let isDisabled = !!props.isDisabled;
-		if (isFormControlDisabled) isDisabled = true;
-		const isClearable = props.isClearable ?? ui.input.isClearable;
-		const dataAttributes = {
-			dataIsEmpty: !hasValue,
-			dataIsFilled: hasValue,
-			dataIsDirty: props.isDirty,
-			dataIsRequired: props.isRequired,
-			dataIsDisabled: isDisabled,
-			dataDisabled: isDisabled,
-			dataInvalid: !!effectiveError,
-			dataHasSelection: hasValue
-		};
-		return /* @__PURE__ */ jsx(InputFrame, {
-			...props,
-			error: effectiveError,
-			isDisabled,
-			className: clsx("group w-full", as === "inline" && "h-full", props.className),
-			inputClassName: props.inputClassName,
-			contentClassName: "pr-0!",
-			trailingClassName: "py-0! pl-0!",
-			contentWrapperClassName: clsx("flex w-full items-center gap-input-gap-input-text-to-elements pr-0! py-0! px-0!", inputSizeCva({
-				size,
-				as
-			})),
-			dataAttributes,
-			onStaticInteract: renderRealInput,
-			isClearable: false,
-			labelPlacement: "content-wrapper",
-			children: (t2) => {
-				const { id, ...dataAttributeProps } = t2;
-				return /* @__PURE__ */ jsxs(Fragment, { children: [
-					/* @__PURE__ */ jsxs("div", {
-						className: "min-w-0 flex-1",
-						children: [/* @__PURE__ */ jsx(FormFieldLabel, {
-							label: props.minLabel ?? "Minimum",
-							isRequired: props.isRequired,
-							isDisabled,
-							className: clsx((props.hideInnerLabels ?? true) && "sr-only")
-						}), /* @__PURE__ */ jsxs("div", {
-							className: "flex items-center gap-input-gap-trailing-elements",
-							children: [/* @__PURE__ */ jsx("input", {
-								id,
-								readOnly: true,
-								disabled: isDisabled,
-								tabIndex: -1,
-								value: minDisplay ?? "",
-								placeholder: props.minPlaceholder ?? "Min",
-								className: clsx("w-full min-w-0 bg-transparent outline-none", props.minInputClassName),
-								...dataAttributeProps,
-								"data-rac": true
-							}), isClearable && /* @__PURE__ */ jsx(InputClear, {
-								onClear: _temp,
-								show: staticValue.min !== null,
-								renderStatic: true
-							})]
-						})]
-					}),
-					/* @__PURE__ */ jsx("span", {
-						className: "pointer-events-none shrink-0 select-none text-label-2 text-text-default-3",
-						children: "-"
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: "min-w-0 flex-1",
-						children: [/* @__PURE__ */ jsx(FormFieldLabel, {
-							label: props.maxLabel ?? "Maximum",
-							isRequired: props.isRequired,
-							isDisabled,
-							className: clsx((props.hideInnerLabels ?? true) && "sr-only")
-						}), /* @__PURE__ */ jsxs("div", {
-							className: "flex items-center gap-input-gap-trailing-elements",
-							children: [/* @__PURE__ */ jsx("input", {
-								id: `${id}-max`,
-								readOnly: true,
-								disabled: isDisabled,
-								tabIndex: -1,
-								value: maxDisplay ?? "",
-								placeholder: props.maxPlaceholder ?? "Max",
-								className: clsx("w-full min-w-0 bg-transparent outline-none", props.maxInputClassName),
-								...dataAttributeProps,
-								"data-rac": true
-							}), isClearable && /* @__PURE__ */ jsx(InputClear, {
-								onClear: _temp2,
-								show: staticValue.max !== null,
-								renderStatic: true
-							})]
-						})]
-					})
-				] });
-			}
-		});
-	}
-	let t2;
-	if ($[2] !== props || $[3] !== shouldFocus) {
-		t2 = /* @__PURE__ */ jsx(NumberRangeInputBase, {
-			...props,
-			autoFocusOnMount: shouldFocus
-		});
-		$[2] = props;
-		$[3] = shouldFocus;
-		$[4] = t2;
-	} else t2 = $[4];
-	return t2;
-};
-var NumberRangeInput = (t0) => {
-	const $ = c(19);
-	let props;
-	let renderStaticInput;
-	if ($[0] !== t0) {
-		({renderStaticInput, ...props} = t0);
-		$[0] = t0;
-		$[1] = props;
-		$[2] = renderStaticInput;
-	} else {
-		props = $[1];
-		renderStaticInput = $[2];
-	}
-	if ("field" in props && props.field) {
-		let field;
-		let innerProps;
-		if ($[3] !== props) {
-			({field, ...innerProps} = props);
-			$[3] = props;
-			$[4] = field;
-			$[5] = innerProps;
-		} else {
-			field = $[4];
-			innerProps = $[5];
-		}
-		const controlWithOptions = field.form;
-		let t1;
-		if ($[6] !== controlWithOptions._options?.disabled || $[7] !== innerProps || $[8] !== props.error || $[9] !== props.isDisabled || $[10] !== renderStaticInput) {
-			t1 = (t2) => {
-				const { field: field_0, fieldState: t3 } = t2;
-				const { error } = t3;
-				return /* @__PURE__ */ jsx(NumberRangeInputInner, {
-					...innerProps,
-					value: field_0.value ?? EMPTY_RANGE,
-					onChange: field_0.onChange,
-					onBlur: field_0.onBlur,
-					isDisabled: field_0.disabled || !!controlWithOptions._options?.disabled || props.isDisabled,
-					isFormControlDisabled: !!controlWithOptions._options?.disabled,
-					error: props.error ?? error?.message,
-					renderStaticInput
-				});
-			};
-			$[6] = controlWithOptions._options?.disabled;
-			$[7] = innerProps;
-			$[8] = props.error;
-			$[9] = props.isDisabled;
-			$[10] = renderStaticInput;
-			$[11] = t1;
-		} else t1 = $[11];
-		let t2;
-		if ($[12] !== field.form || $[13] !== field.name || $[14] !== t1) {
-			t2 = /* @__PURE__ */ jsx(FieldController, {
-				control: field.form,
-				name: field.name,
-				render: t1
-			});
-			$[12] = field.form;
-			$[13] = field.name;
-			$[14] = t1;
-			$[15] = t2;
-		} else t2 = $[15];
-		return t2;
-	}
-	let t1;
-	if ($[16] !== props || $[17] !== renderStaticInput) {
-		t1 = /* @__PURE__ */ jsx(NumberRangeInputInner, {
-			...props,
-			renderStaticInput
-		});
-		$[16] = props;
-		$[17] = renderStaticInput;
-		$[18] = t1;
-	} else t1 = $[18];
-	return t1;
-};
-function _temp() {}
-function _temp2() {}
-//#endregion
-export { NumberRangeInput };

package/dist/components/inputs/Input/PasswordInput/PasswordInput.d.ts

@@ -1,7 +0,0 @@
-import { FieldValues } from '../../shared/form.binding';
-import { TextInputProps } from '../TextInput/TextInput';
-import { ControlProps } from '../../shared/form.types';
-export interface PasswordInputProps extends Omit<TextInputProps, "type" | "action" | "trailingIcon" | "unit"> {
-}
-export type ControlledPasswordInputProps<TFieldValues extends FieldValues> = ControlProps<PasswordInputProps, TFieldValues>;
-export declare const PasswordInput: <TFieldValues extends FieldValues>(props: ControlledPasswordInputProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/Input/PasswordInput/PasswordInput.js

@@ -1,62 +0,0 @@
-import { VisibilityIcon } from "../../../../assets/icons/Visibility.js";
-import { VisibilityOffIcon } from "../../../../assets/icons/VisibilityOff.js";
-import "../../../../config/i18n.js";
-import { TextInput } from "../TextInput/TextInput.js";
-import { c } from "react/compiler-runtime";
-import { jsx } from "react/jsx-runtime";
-import { useState } from "react";
-import { useTranslation } from "react-i18next";
-//#region src/components/inputs/Input/PasswordInput/PasswordInput.tsx
-var PasswordInput = (props) => {
-	const $0 = c(15);
-	const { t } = useTranslation("ui");
-	const [isRevealed, setIsRevealed] = useState(false);
-	const t0 = isRevealed ? "text" : "password";
-	const t1 = isRevealed ? VisibilityIcon : VisibilityOffIcon;
-	let t2;
-	if ($0[0] !== isRevealed) {
-		t2 = ($) => isRevealed ? $.ui.password.hide : $.ui.password.reveal;
-		$0[0] = isRevealed;
-		$0[1] = t2;
-	} else t2 = $0[1];
-	let t3;
-	if ($0[2] !== t || $0[3] !== t2) {
-		t3 = t(t2);
-		$0[2] = t;
-		$0[3] = t2;
-		$0[4] = t3;
-	} else t3 = $0[4];
-	let t4;
-	if ($0[5] !== isRevealed) {
-		t4 = () => setIsRevealed(!isRevealed);
-		$0[5] = isRevealed;
-		$0[6] = t4;
-	} else t4 = $0[6];
-	let t5;
-	if ($0[7] !== t1 || $0[8] !== t3 || $0[9] !== t4) {
-		t5 = {
-			icon: t1,
-			altText: t3,
-			onClick: t4
-		};
-		$0[7] = t1;
-		$0[8] = t3;
-		$0[9] = t4;
-		$0[10] = t5;
-	} else t5 = $0[10];
-	let t6;
-	if ($0[11] !== props || $0[12] !== t0 || $0[13] !== t5) {
-		t6 = /* @__PURE__ */ jsx(TextInput, {
-			...props,
-			type: t0,
-			action: t5
-		});
-		$0[11] = props;
-		$0[12] = t0;
-		$0[13] = t5;
-		$0[14] = t6;
-	} else t6 = $0[14];
-	return t6;
-};
-//#endregion
-export { PasswordInput };

package/dist/components/inputs/Input/TextArea/TextArea.cva.d.ts

@@ -1,8 +0,0 @@
-import { UIOverrides } from '../../../../config/uiOverrides.context';
-export declare const textAreaWrapperDefinition: {
-    base: string[];
-    config?: import("../../../../utils/style-merge.util").StyleMergeUtils.Config<Record<never, never>>;
-};
-export type TextAreaWrapperConfig = NonNullable<typeof textAreaWrapperDefinition.config>;
-export interface TextAreaWrapperVariantProps extends UIOverrides.VariantProps<TextAreaWrapperConfig> {
-}

package/dist/components/inputs/Input/TextArea/TextArea.cva.js

@@ -1,5 +0,0 @@
-import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-//#region src/components/inputs/Input/TextArea/TextArea.cva.ts
-var textAreaWrapperDefinition = UIOverrides.defineConfig({ base: ["group/text-area relative h-full"] });
-//#endregion
-export { textAreaWrapperDefinition };

package/dist/components/inputs/Input/TextArea/TextArea.d.ts

@@ -1,18 +0,0 @@
-import { Ref } from 'react';
-import { AriaTextFieldProps } from 'react-aria';
-import { TextAreaProps as AriaTextAreaProps } from 'react-aria-components';
-import { FieldValues } from '../../shared/form.binding';
-import { FormFieldProps } from '../../FormField/FormField';
-import { ControlProps } from '../../shared/form.types';
-import { InputVariantProps } from '../../shared/input.cva';
-interface TextAreaBaseProps extends FormFieldProps, InputVariantProps, Omit<AriaTextAreaProps, "value" | "defaultValue" | "onChange" | "disabled" | "required" | "className" | keyof AriaTextFieldProps>, Omit<AriaTextFieldProps<HTMLTextAreaElement>, "label"> {
-    ref?: Ref<HTMLTextAreaElement>;
-    isClearable?: boolean;
-    isDirty?: boolean;
-    inputClassName?: string;
-}
-export interface TextAreaProps extends TextAreaBaseProps {
-}
-export type ControlledTextAreaProps<TFieldValues extends FieldValues> = ControlProps<TextAreaProps, TFieldValues>;
-export declare const TextArea: <TFieldValues extends FieldValues>(props: ControlledTextAreaProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-export {};