@povio/ui 3.4.0-rc.10 → 3.4.0-rc.11

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

@@ -1,17 +1,17 @@
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { UIConfig } from "../../../config/uiConfig.context.js";
-import { FieldController } from "../shared/form.binding.js";
 import { FormFieldError } from "../FormField/FormFieldError.js";
 import { CheckContent } from "../shared/CheckContent.js";
 import { toggleContentClassName, toggleDefinition, toggleTypography } from "./toggle.cva.js";
-import { clsx } from "clsx";
-import { Switch } from "react-aria-components";
 import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { Switch } from "react-aria-components";
 import { mergeRefs } from "@react-aria/utils";
+import { Controller } from "react-hook-form";
 //#region src/components/inputs/Toggle/Toggle.tsx
 var ToggleBase = (props) => {
-	const $ = c(48);
+	const $ = c(50);
 	const ui = UIConfig.useConfig();
 	const toggleCva = UIOverrides.useCva("toggle.cva", toggleDefinition);
 	const toggleTypographyMap = UIOverrides.useMapper("toggle.typography", toggleTypography);
@@ -31,9 +31,10 @@ var ToggleBase = (props) => {
 	let t8;
 	let t9;
 	if ($[0] !== props || $[1] !== toggleContentClassNameMap || $[2] !== toggleCva || $[3] !== toggleTypographyMap || $[4] !== ui) {
-		const { className, children: t10, isDisabled, error, variant: variantProp, onChange, onBlur, ...rest } = props;
+		const { className, children: t10, isDisabled, error, variant: variantProp, fireBlurOnChange: fireBlurOnChangeProp, onChange, onBlur, ...rest } = props;
 		children = t10;
 		const variant = variantProp ?? ui.toggle.variant;
+		const fireBlurOnChange = fireBlurOnChangeProp ?? ui.toggle.fireBlurOnChange;
 		let t11;
 		if ($[19] !== error || $[20] !== isDisabled) {
 			t11 = {
@@ -46,13 +47,16 @@ var ToggleBase = (props) => {
 		} else t11 = $[21];
 		formFieldErrorProps = t11;
 		let t12;
-		if ($[22] !== onChange) {
+		if ($[22] !== fireBlurOnChange || $[23] !== onBlur || $[24] !== onChange) {
 			t12 = (isSelected) => {
 				onChange?.(isSelected);
+				if (fireBlurOnChange) onBlur?.({});
 			};
-			$[22] = onChange;
-			$[23] = t12;
-		} else t12 = $[23];
+			$[22] = fireBlurOnChange;
+			$[23] = onBlur;
+			$[24] = onChange;
+			$[25] = t12;
+		} else t12 = $[25];
 		const handleChange = t12;
 		T1 = Switch;
 		t2 = rest;
@@ -62,12 +66,12 @@ var ToggleBase = (props) => {
 		t6 = handleChange;
 		t7 = onBlur;
 		const t13 = !isDisabled && "cursor-pointer";
-		if ($[24] !== className || $[25] !== t13) {
+		if ($[26] !== className || $[27] !== t13) {
 			t8 = clsx("group flex items-center gap-2", t13, className);
-			$[24] = className;
-			$[25] = t13;
-			$[26] = t8;
-		} else t8 = $[26];
+			$[26] = className;
+			$[27] = t13;
+			$[28] = t8;
+		} else t8 = $[28];
 		t9 = /* @__PURE__ */ jsx("div", { className: toggleCva({
 			variant,
 			...rest
@@ -117,20 +121,20 @@ var ToggleBase = (props) => {
 		t9 = $[18];
 	}
 	let t10;
-	if ($[27] !== T0 || $[28] !== children || $[29] !== t0 || $[30] !== t1) {
+	if ($[29] !== T0 || $[30] !== children || $[31] !== t0 || $[32] !== t1) {
 		t10 = /* @__PURE__ */ jsx(T0, {
 			typography: t0,
 			contentClassName: t1,
 			children
 		});
-		$[27] = T0;
-		$[28] = children;
-		$[29] = t0;
-		$[30] = t1;
-		$[31] = t10;
-	} else t10 = $[31];
+		$[29] = T0;
+		$[30] = children;
+		$[31] = t0;
+		$[32] = t1;
+		$[33] = t10;
+	} else t10 = $[33];
 	let t11;
-	if ($[32] !== T1 || $[33] !== t10 || $[34] !== t2 || $[35] !== t3 || $[36] !== t4 || $[37] !== t5 || $[38] !== t6 || $[39] !== t7 || $[40] !== t8 || $[41] !== t9) {
+	if ($[34] !== T1 || $[35] !== t10 || $[36] !== t2 || $[37] !== t3 || $[38] !== t4 || $[39] !== t5 || $[40] !== t6 || $[41] !== t7 || $[42] !== t8 || $[43] !== t9) {
 		t11 = /* @__PURE__ */ jsxs(T1, {
 			...t2,
 			"data-is-dirty": t3,
@@ -141,64 +145,64 @@ var ToggleBase = (props) => {
 			className: t8,
 			children: [t9, t10]
 		});
-		$[32] = T1;
-		$[33] = t10;
-		$[34] = t2;
-		$[35] = t3;
-		$[36] = t4;
-		$[37] = t5;
-		$[38] = t6;
-		$[39] = t7;
-		$[40] = t8;
-		$[41] = t9;
-		$[42] = t11;
-	} else t11 = $[42];
+		$[34] = T1;
+		$[35] = t10;
+		$[36] = t2;
+		$[37] = t3;
+		$[38] = t4;
+		$[39] = t5;
+		$[40] = t6;
+		$[41] = t7;
+		$[42] = t8;
+		$[43] = t9;
+		$[44] = t11;
+	} else t11 = $[44];
 	let t12;
-	if ($[43] !== formFieldErrorProps) {
+	if ($[45] !== formFieldErrorProps) {
 		t12 = /* @__PURE__ */ jsx(FormFieldError, { ...formFieldErrorProps });
-		$[43] = formFieldErrorProps;
-		$[44] = t12;
-	} else t12 = $[44];
+		$[45] = formFieldErrorProps;
+		$[46] = t12;
+	} else t12 = $[46];
 	let t13;
-	if ($[45] !== t11 || $[46] !== t12) {
+	if ($[47] !== t11 || $[48] !== t12) {
 		t13 = /* @__PURE__ */ jsxs(Fragment, { children: [t11, t12] });
-		$[45] = t11;
-		$[46] = t12;
-		$[47] = t13;
-	} else t13 = $[47];
+		$[47] = t11;
+		$[48] = t12;
+		$[49] = t13;
+	} else t13 = $[49];
 	return t13;
 };
 var Toggle = (props) => {
 	const $ = c(15);
-	if ("field" in props && props.field) {
-		let field;
+	if ("formControl" in props && props.formControl) {
+		let formControl;
 		let innerProps;
 		let ref;
 		if ($[0] !== props) {
-			({field, ref, ...innerProps} = props);
+			({formControl, ref, ...innerProps} = props);
 			$[0] = props;
-			$[1] = field;
+			$[1] = formControl;
 			$[2] = innerProps;
 			$[3] = ref;
 		} else {
-			field = $[1];
+			formControl = $[1];
 			innerProps = $[2];
 			ref = $[3];
 		}
 		let t0;
 		if ($[4] !== innerProps || $[5] !== props.error || $[6] !== props.isDisabled || $[7] !== ref) {
 			t0 = (t1) => {
-				const { field: field_0, fieldState: t2 } = t1;
+				const { field, fieldState: t2 } = t1;
 				const { error, isDirty } = t2;
 				return /* @__PURE__ */ jsx(ToggleBase, {
 					...innerProps,
-					ref: mergeRefs(ref, field_0.ref),
-					isSelected: field_0.value,
-					onChange: field_0.onChange,
-					onBlur: field_0.onBlur,
-					name: field_0.name,
+					ref: mergeRefs(ref, field.ref),
+					isSelected: field.value,
+					onChange: field.onChange,
+					onBlur: field.onBlur,
+					name: field.name,
 					isDirty,
-					isDisabled: field_0.disabled || props.isDisabled,
+					isDisabled: field.disabled || props.isDisabled,
 					error: props.error ?? error?.message
 				});
 			};
@@ -209,14 +213,14 @@ var Toggle = (props) => {
 			$[8] = t0;
 		} else t0 = $[8];
 		let t1;
-		if ($[9] !== field.form || $[10] !== field.name || $[11] !== t0) {
-			t1 = /* @__PURE__ */ jsx(FieldController, {
-				control: field.form,
-				name: field.name,
+		if ($[9] !== formControl.control || $[10] !== formControl.name || $[11] !== t0) {
+			t1 = /* @__PURE__ */ jsx(Controller, {
+				control: formControl.control,
+				name: formControl.name,
 				render: t0
 			});
-			$[9] = field.form;
-			$[10] = field.name;
+			$[9] = formControl.control;
+			$[10] = formControl.name;
 			$[11] = t0;
 			$[12] = t1;
 		} else t1 = $[12];

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

@@ -1,8 +1,8 @@
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { typographyDefinition } from "../../text/Typography/typography.cva.js";
-import clsx$1 from "clsx";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
+import clsx$1 from "clsx";
 //#region src/components/inputs/shared/CheckContent.tsx
 var CheckContent = (t0) => {
 	const $ = c(3);

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

@@ -1,77 +1,63 @@
+import { CloseIcon } from "../../../assets/icons/Close.js";
 import { UIConfig } from "../../../config/uiConfig.context.js";
 import { InlineIconButton } from "../../buttons/InlineIconButton/InlineIconButton.js";
 import "../../../config/i18n.js";
-import { X } from "lucide-react";
-import { clsx } from "clsx";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/shared/InputClear.tsx
 var InputClear = (t0) => {
-	const $ = c(17);
+	const $ = c(12);
 	const { onClear, className, style, show, renderStatic } = t0;
-	const ui = UIConfig.useConfig();
-	const { t } = useTranslation("ui");
-	const alwaysShowClear = ui.input.alwaysShowClear;
+	const alwaysShowClear = UIConfig.useConfig().input.alwaysShowClear;
 	let clearClassName;
 	let t1;
-	if ($[0] !== alwaysShowClear || $[1] !== className || $[2] !== onClear || $[3] !== renderStatic || $[4] !== show || $[5] !== style || $[6] !== t) {
+	if ($[0] !== alwaysShowClear || $[1] !== className || $[2] !== renderStatic || $[3] !== show || $[4] !== style) {
 		t1 = Symbol.for("react.early_return_sentinel");
 		bb0: {
 			clearClassName = clsx("relative z-raised flex items-center", !alwaysShowClear && "md:invisible group-focus-within:visible group-hover/date-picker-content:visible group-hover/select-content:visible group-hover/text-area:visible group-hover:visible", "border-0!", !show && "invisible!", className);
 			if (renderStatic) {
 				let t2;
-				if ($[9] !== show || $[10] !== t) {
-					t2 = show ? t(_temp) : void 0;
-					$[9] = show;
-					$[10] = t;
-					$[11] = t2;
-				} else t2 = $[11];
-				let t3;
-				if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
-					t3 = /* @__PURE__ */ jsx(X, { className: "h-6 w-6 shrink-0" });
-					$[12] = t3;
-				} else t3 = $[12];
+				if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+					t2 = /* @__PURE__ */ jsx(CloseIcon, { className: "h-6 w-6 shrink-0" });
+					$[7] = t2;
+				} else t2 = $[7];
 				t1 = /* @__PURE__ */ jsx("button", {
 					type: "button",
-					"aria-hidden": !show,
-					"aria-label": t2,
-					"data-static-clear-action": true,
+					"aria-hidden": "true",
 					tabIndex: -1,
-					onClick: onClear,
 					className: clsx("group inline-flex items-center justify-center border border-solid border-support-transparent-outline", "rounded-button-rounding-s p-0 text-interactive-text-secondary-idle", clearClassName),
 					style,
-					children: t3
+					children: t2
 				});
 				break bb0;
 			}
 		}
 		$[0] = alwaysShowClear;
 		$[1] = className;
-		$[2] = onClear;
-		$[3] = renderStatic;
-		$[4] = show;
-		$[5] = style;
-		$[6] = t;
-		$[7] = clearClassName;
-		$[8] = t1;
+		$[2] = renderStatic;
+		$[3] = show;
+		$[4] = style;
+		$[5] = clearClassName;
+		$[6] = t1;
 	} else {
-		clearClassName = $[7];
-		t1 = $[8];
+		clearClassName = $[5];
+		t1 = $[6];
 	}
 	if (t1 !== Symbol.for("react.early_return_sentinel")) return t1;
 	let t2;
-	if ($[13] !== clearClassName || $[14] !== onClear || $[15] !== style) {
+	if ($[8] !== clearClassName || $[9] !== onClear || $[10] !== style) {
 		t2 = /* @__PURE__ */ jsx(InputClearButton, {
 			onClear,
 			className: clearClassName,
 			style
 		});
-		$[13] = clearClassName;
-		$[14] = onClear;
-		$[15] = style;
-		$[16] = t2;
-	} else t2 = $[16];
+		$[8] = clearClassName;
+		$[9] = onClear;
+		$[10] = style;
+		$[11] = t2;
+	} else t2 = $[11];
 	return t2;
 };
 var InputClearButton = (t0) => {
@@ -80,7 +66,7 @@ var InputClearButton = (t0) => {
 	const { t } = useTranslation("ui");
 	let t1;
 	if ($[0] !== t) {
-		t1 = t(_temp2);
+		t1 = t(_temp);
 		$[0] = t;
 		$[1] = t1;
 	} else t1 = $[1];
@@ -90,9 +76,9 @@ var InputClearButton = (t0) => {
 			color: "secondary",
 			className,
 			label: t1,
-			icon: X,
+			icon: CloseIcon,
 			onPress: onClear,
-			onMouseDown: _temp3,
+			onMouseDown: _temp2,
 			excludeFromTabOrder: true,
 			style
 		});
@@ -107,10 +93,7 @@ var InputClearButton = (t0) => {
 function _temp($) {
 	return $.ui.clearAlt;
 }
-function _temp2($) {
-	return $.ui.clearAlt;
-}
-function _temp3(e) {
+function _temp2(e) {
 	return e.preventDefault();
 }
 //#endregion

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

@@ -6,5 +6,5 @@ interface TooltipWrapperProps {
     triggerClassName?: string;
     triggerTabIndex?: number;
 }
-export declare const TooltipWrapper: (props: TooltipWrapperProps) => string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export declare const TooltipWrapper: (props: TooltipWrapperProps) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | null | undefined;
 export {};

package/dist/components/inputs/shared/form.types.d.ts

@@ -1,13 +1,12 @@
-import { DeepKeys, DeepValue, UIForm } from '../../../hooks/useForm';
+import { Control, FieldPath, FieldPathValue, FieldValues } from 'react-hook-form';
 export type ControlKeys<TProps, TValueProp extends keyof TProps = "value" extends keyof TProps ? "value" : never> = TValueProp | "onChange" | "onBlur";
-export interface FormControl<TFieldValues extends Record<string, unknown>, TType> {
-    form: UIForm<TFieldValues>;
+export interface FormControl<TFieldValues extends FieldValues, TType> {
+    control: Control<TFieldValues>;
     name: {
-        [K in DeepKeys<TFieldValues>]: DeepValue<TFieldValues, K> extends TType ? K : never;
-    }[DeepKeys<TFieldValues>];
+        [K in FieldPath<TFieldValues>]: FieldPathValue<TFieldValues, K> extends TType ? K : never;
+    }[FieldPath<TFieldValues>];
 }
-export type FormControlProps<TProps, TFieldValues extends Record<string, unknown>, TValueProp extends keyof TProps = "value" extends keyof TProps ? "value" : never> = {
-    field: FormControl<TFieldValues, TProps[TValueProp] | null>;
+export type FormControlProps<TProps, TFieldValues extends FieldValues, TValueProp extends keyof TProps = "value" extends keyof TProps ? "value" : never> = {
+    formControl: FormControl<TFieldValues, TProps[TValueProp] | null>;
 } & Omit<TProps, ControlKeys<TProps, TValueProp>> & Partial<Record<ControlKeys<TProps, TValueProp>, never>>;
-export type ControlProps<TProps, TFieldValues extends Record<string, unknown>, TValueProp extends keyof TProps = "value" extends keyof TProps ? "value" : never> = FormControlProps<TProps, TFieldValues, TValueProp> | TProps;
-export declare const getFieldError: (errors: unknown[]) => string | undefined;
+export type ControlProps<TProps, TFieldValues extends FieldValues, TValueProp extends keyof TProps = "value" extends keyof TProps ? "value" : never> = FormControlProps<TProps, TFieldValues, TValueProp> | TProps;

package/dist/components/inputs/shared/input.cva.js

@@ -1,7 +1,7 @@
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { uiOutlineClass } from "../../outline.clsx.js";
-import { clsx } from "clsx";
 import { c } from "react/compiler-runtime";
+import { clsx } from "clsx";
 //#region src/components/inputs/shared/input.cva.ts
 var inputBaseDefinition = UIOverrides.defineConfig({
 	base: [uiOutlineClass, "flex w-full not-[textarea]:truncate"],

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

@@ -1,33 +1,18 @@
-import { useLayoutEffect, useRef, useState } from "react";
 import { c } from "react/compiler-runtime";
+import { useLayoutEffect, useRef, useState } from "react";
 //#region src/components/inputs/shared/useStaticInputHandoff.ts
 var useStaticInputHandoff = (t0) => {
-	const $ = c(18);
+	const $ = c(16);
 	const { inputRef, renderInput, setRenderInput, getFocusTarget, getPressTarget } = t0;
 	const [shouldFocus, setShouldFocus] = useState(false);
 	const pendingStaticChangeRef = useRef(null);
 	const pendingStaticFocusTargetRef = useRef(null);
 	const resolvedFocusTargetRef = useRef(null);
 	const shouldReplayStaticPressRef = useRef(false);
-	const hoverHandoffFrameRef = useRef(null);
 	let t1;
 	let t2;
-	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-		t1 = () => () => {
-			if (hoverHandoffFrameRef.current !== null) cancelAnimationFrame(hoverHandoffFrameRef.current);
-		};
-		t2 = [];
-		$[0] = t1;
-		$[1] = t2;
-	} else {
-		t1 = $[0];
-		t2 = $[1];
-	}
-	useLayoutEffect(t1, t2);
-	let t3;
-	let t4;
-	if ($[2] !== getFocusTarget || $[3] !== getPressTarget || $[4] !== inputRef || $[5] !== renderInput || $[6] !== shouldFocus) {
-		t3 = () => {
+	if ($[0] !== getFocusTarget || $[1] !== getPressTarget || $[2] !== inputRef || $[3] !== renderInput || $[4] !== shouldFocus) {
+		t1 = () => {
 			if (!renderInput || !shouldFocus) return;
 			const focusRealInput = (replayPendingInteraction) => {
 				const input = inputRef.current;
@@ -60,79 +45,68 @@ var useStaticInputHandoff = (t0) => {
 				cancelAnimationFrame(frame);
 			};
 		};
-		t4 = [
+		t2 = [
 			getFocusTarget,
 			getPressTarget,
 			inputRef,
 			renderInput,
 			shouldFocus
 		];
-		$[2] = getFocusTarget;
-		$[3] = getPressTarget;
-		$[4] = inputRef;
-		$[5] = renderInput;
-		$[6] = shouldFocus;
-		$[7] = t3;
-		$[8] = t4;
+		$[0] = getFocusTarget;
+		$[1] = getPressTarget;
+		$[2] = inputRef;
+		$[3] = renderInput;
+		$[4] = shouldFocus;
+		$[5] = t1;
+		$[6] = t2;
 	} else {
-		t3 = $[7];
-		t4 = $[8];
+		t1 = $[5];
+		t2 = $[6];
 	}
-	useLayoutEffect(t3, t4);
+	useLayoutEffect(t1, t2);
+	let t3;
+	let t4;
 	let t5;
-	let t6;
-	let t7;
-	if ($[9] !== setRenderInput) {
-		t5 = (focus, target) => {
+	if ($[7] !== setRenderInput) {
+		t3 = (focus, target) => {
 			pendingStaticFocusTargetRef.current = target ?? null;
 			setShouldFocus(focus);
-			if (focus) {
-				if (hoverHandoffFrameRef.current !== null) {
-					cancelAnimationFrame(hoverHandoffFrameRef.current);
-					hoverHandoffFrameRef.current = null;
-				}
-				setRenderInput(true);
-				return;
-			}
-			hoverHandoffFrameRef.current = requestAnimationFrame(() => {
-				hoverHandoffFrameRef.current = null;
-				setRenderInput(true);
-			});
+			setRenderInput(true);
 		};
-		t6 = (value) => {
+		t4 = (value) => {
 			pendingStaticChangeRef.current = value;
 			setShouldFocus(true);
 			setRenderInput(true);
 		};
-		t7 = () => {
+		t5 = () => {
 			shouldReplayStaticPressRef.current = true;
 			setShouldFocus(true);
 			setRenderInput(true);
 		};
-		$[9] = setRenderInput;
+		$[7] = setRenderInput;
+		$[8] = t3;
+		$[9] = t4;
 		$[10] = t5;
-		$[11] = t6;
-		$[12] = t7;
 	} else {
+		t3 = $[8];
+		t4 = $[9];
 		t5 = $[10];
-		t6 = $[11];
-		t7 = $[12];
 	}
-	let t8;
-	if ($[13] !== shouldFocus || $[14] !== t5 || $[15] !== t6 || $[16] !== t7) {
-		t8 = {
+	let t6;
+	if ($[11] !== shouldFocus || $[12] !== t3 || $[13] !== t4 || $[14] !== t5) {
+		t6 = {
 			shouldFocus,
-			renderRealInput: t5,
-			replayStaticInputChange: t6,
-			replayStaticInputPress: t7
+			renderRealInput: t3,
+			replayStaticInputChange: t4,
+			replayStaticInputPress: t5
 		};
-		$[13] = shouldFocus;
+		$[11] = shouldFocus;
+		$[12] = t3;
+		$[13] = t4;
 		$[14] = t5;
 		$[15] = t6;
-		$[16] = t7;
-		$[17] = t8;
-	} else t8 = $[17];
-	return t8;
+	} else t6 = $[15];
+	return t6;
 };
 //#endregion
 export { useStaticInputHandoff };

package/dist/components/navigation/Accordion/Accordion.js

@@ -1,9 +1,9 @@
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { accordionDefinition } from "./accordion.cva.js";
 import { AccordionItem } from "./AccordionItem.js";
+import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { DisclosureGroup } from "react-aria-components";
-import { jsx } from "react/jsx-runtime";
 //#region src/components/navigation/Accordion/Accordion.tsx
 var Accordion = ({ items, variant = "filled", actionPosition = "right", allowsMultipleExpanded = false, expandedKeys, defaultExpandedKeys, onExpandedChange, className, disabled }) => {
 	return /* @__PURE__ */ jsx(DisclosureGroup, {

package/dist/components/navigation/Accordion/AccordionItem.js

@@ -1,9 +1,9 @@
+import { ChevronDownIcon } from "../../../assets/icons/ChevronDown.js";
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { Typography } from "../../text/Typography/Typography.js";
 import { accordionChevronDefinition, accordionHeadingDefinition, accordionHeadingSubtitleDefinition, accordionHeadingTitleDefinition, accordionIconDefinition, accordionItemDefinition, accordionPanelContentDefinition, accordionPanelDefinition, accordionTriggerDefinition } from "./accordion.cva.js";
-import { ChevronDown } from "lucide-react";
-import { Button, Disclosure, DisclosurePanel, Heading } from "react-aria-components";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button, Disclosure, DisclosurePanel, Heading } from "react-aria-components";
 //#region src/components/navigation/Accordion/AccordionItem.tsx
 var AccordionItem = ({ id, disabled, heading, subheading, children, icon: Icon, variant = "filled", actionPosition = "right", isSingle }) => {
 	const itemCva = UIOverrides.useCva("accordion.itemCva", accordionItemDefinition);
@@ -49,7 +49,7 @@ var AccordionItem = ({ id, disabled, heading, subheading, children, icon: Icon,
 						})
 					]
 				})
-			}), /* @__PURE__ */ jsx(ChevronDown, { className: chevronCva({ isExpanded }) })]
+			}), /* @__PURE__ */ jsx(ChevronDownIcon, { className: chevronCva({ isExpanded }) })]
 		}) }), /* @__PURE__ */ jsx(DisclosurePanel, {
 			className: panelCva({ isExpanded }),
 			children: /* @__PURE__ */ jsx("div", {

package/dist/components/navigation/Stepper/Stepper.js

@@ -2,8 +2,8 @@ import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { stepperDefinition } from "./stepper.cva.js";
 import { StepperItem } from "./StepperItem.js";
 import { StepperSeparator } from "./StepperSeparator.js";
-import { Fragment } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1 } from "react";
 //#region src/components/navigation/Stepper/Stepper.tsx
 var Stepper = ({ steps, currentStep, orientation = "horizontal", contentOrientation = "horizontal", iconsOnly, titlesOnly, onStepClick, className }) => {
 	return /* @__PURE__ */ jsx("div", {
@@ -15,7 +15,7 @@ var Stepper = ({ steps, currentStep, orientation = "horizontal", contentOrientat
 		"aria-label": "Progress",
 		children: steps.map((step, index) => {
 			const status = index < currentStep ? "completed" : index === currentStep ? "active" : "todo";
-			return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(StepperItem, {
+			return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(StepperItem, {
 				step,
 				stepNumber: index + 1,
 				status,

package/dist/components/navigation/Stepper/StepperItem.js

@@ -1,11 +1,11 @@
+import { CheckIcon } from "../../../assets/icons/Check.js";
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { Typography } from "../../text/Typography/Typography.js";
 import { stepperIconDefinition, stepperItemDefinition, stepperNumberDefinition, stepperSubtextDefinition, stepperTitleDefinition } from "./stepper.cva.js";
-import { Check } from "lucide-react";
-import { clsx } from "clsx";
-import { Button } from "react-aria-components";
 import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { Button } from "react-aria-components";
 //#region src/components/navigation/Stepper/StepperItem.tsx
 var StepperItem = (t0) => {
 	const $ = c(31);
@@ -26,7 +26,7 @@ var StepperItem = (t0) => {
 	} else t1 = $[2];
 	let t2;
 	if ($[3] !== status || $[4] !== stepNumber || $[5] !== stepperNumberCva) {
-		t2 = status === "completed" ? /* @__PURE__ */ jsx(Check, { className: "size-5 text-interactive-contained-primary-on-idle" }) : /* @__PURE__ */ jsx(Typography, {
+		t2 = status === "completed" ? /* @__PURE__ */ jsx(CheckIcon, { className: "size-5 text-interactive-contained-primary-on-idle" }) : /* @__PURE__ */ jsx(Typography, {
 			className: stepperNumberCva({ status }),
 			variant: "prominent-1",
 			size: "label-3",

package/dist/components/overlays/ActionModal/ActionModal.js

@@ -2,8 +2,8 @@ import { Typography } from "../../text/Typography/Typography.js";
 import { UIConfig } from "../../../config/uiConfig.context.js";
 import { Button } from "../../buttons/Button/Button.js";
 import { Modal } from "../Modal/Modal.js";
-import { clsx } from "clsx";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
 //#region src/components/overlays/ActionModal/ActionModal.tsx
 var textAlignClassMap = {
 	left: "text-left",