@povio/ui 3.3.0 → 3.3.1

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

@@ -38,101 +38,403 @@ 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 = (t0) => {
+	const $ = c(132);
+	const { ref, as: t1, placeholder, label, hideLabel, tooltipText, helperText, isRequired, rightContent, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, value, className, editorClassName, isDirty, onChange, onBlur } = t0;
+	const as = t1 === void 0 ? "default" : t1;
 	const contentRef = useRef(null);
-	const { hoverProps, isHovered } = useHover({ isDisabled });
+	let t2;
+	if ($[0] !== isDisabled) {
+		t2 = { isDisabled };
+		$[0] = isDisabled;
+		$[1] = t2;
+	} else t2 = $[1];
+	const { hoverProps, isHovered } = useHover(t2);
 	const [isFocused, setIsFocused] = useState(false);
-	const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: setIsFocused });
+	let t3;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = { onFocusWithinChange: setIsFocused };
+		$[2] = t3;
+	} else t3 = $[2];
+	const { focusWithinProps } = useFocusWithin(t3);
 	const { isFocusVisible } = useFocusVisible();
 	const inputSideCva = UIOverrides.useCva("input.sideCva", inputSideDefinition);
-	const formFieldProps = {
-		error,
-		label,
-		tooltipText,
-		helperText,
-		isRequired,
-		rightContent,
-		isHeaderHidden: isHeaderHidden || as === "filter" || as === "floating",
-		hideLabel,
-		isDisabled,
-		headerClassName,
-		errorClassName
-	};
-	const { labelProps, fieldProps } = useLabel({ label });
-	const editor = useEditor({
-		extensions: [...extensions, Placeholder.configure({ placeholder: as === "floating" ? "" : placeholder })],
-		editorProps: { attributes: { class: clsx("min-h-40 rounded-b-sm p-2 outline-none", editorClassName) } },
-		onUpdate: (event) => {
+	const t4 = isHeaderHidden || as === "filter" || as === "floating";
+	let t5;
+	if ($[3] !== error || $[4] !== errorClassName || $[5] !== headerClassName || $[6] !== helperText || $[7] !== hideLabel || $[8] !== isDisabled || $[9] !== isRequired || $[10] !== label || $[11] !== rightContent || $[12] !== t4 || $[13] !== tooltipText) {
+		t5 = {
+			error,
+			label,
+			tooltipText,
+			helperText,
+			isRequired,
+			rightContent,
+			isHeaderHidden: t4,
+			hideLabel,
+			isDisabled,
+			headerClassName,
+			errorClassName
+		};
+		$[3] = error;
+		$[4] = errorClassName;
+		$[5] = headerClassName;
+		$[6] = helperText;
+		$[7] = hideLabel;
+		$[8] = isDisabled;
+		$[9] = isRequired;
+		$[10] = label;
+		$[11] = rightContent;
+		$[12] = t4;
+		$[13] = tooltipText;
+		$[14] = t5;
+	} else t5 = $[14];
+	const formFieldProps = t5;
+	let t6;
+	if ($[15] !== label) {
+		t6 = { label };
+		$[15] = label;
+		$[16] = t6;
+	} else t6 = $[16];
+	const { labelProps, fieldProps } = useLabel(t6);
+	let t7;
+	if ($[17] !== as || $[18] !== placeholder) {
+		t7 = Placeholder.configure({ placeholder: as === "floating" ? "" : placeholder });
+		$[17] = as;
+		$[18] = placeholder;
+		$[19] = t7;
+	} else t7 = $[19];
+	let t8;
+	if ($[20] !== t7) {
+		t8 = [...extensions, t7];
+		$[20] = t7;
+		$[21] = t8;
+	} else t8 = $[21];
+	let t9;
+	if ($[22] !== editorClassName) {
+		t9 = clsx("min-h-40 rounded-b-sm p-2 outline-none", editorClassName);
+		$[22] = editorClassName;
+		$[23] = t9;
+	} else t9 = $[23];
+	let t10;
+	if ($[24] !== t9) {
+		t10 = { attributes: { class: t9 } };
+		$[24] = t9;
+		$[25] = t10;
+	} else t10 = $[25];
+	let t11;
+	if ($[26] !== onChange) {
+		t11 = (event) => {
 			onChange?.({
 				json: event.editor.getJSON(),
 				html: event.editor.getHTML()
 			});
-		},
-		immediatelyRender: false,
-		editable: !isDisabled,
-		onBlur
-	}, [isDisabled, editorClassName]);
-	useEffect(() => {
-		const content = value?.json ?? null;
-		if (editor) {
-			if (!isEqual(content, editor.getJSON())) editor.commands.setContent(content);
-		} else if (!isEqual(content, contentRef.current)) contentRef.current = content ?? null;
-	}, [value]);
-	useEffect(() => {
-		if (editor && contentRef.current) {
-			editor.commands.setContent(contentRef.current);
-			contentRef.current = null;
-		}
-	}, [editor]);
-	const headerProps = {
-		label,
-		tooltipText,
-		helperText,
-		isRequired,
-		rightContent,
-		isHeaderHidden: hideLabel || isHeaderHidden,
-		isDisabled,
-		className: headerClassName,
-		labelProps
-	};
-	return /* @__PURE__ */ jsx(FormField, {
-		...formFieldProps,
-		ref,
-		as,
-		labelProps,
-		className: clsx("group w-full", className),
-		children: /* @__PURE__ */ jsxs("div", {
-			className: clsx("group/text-editor relative", "h-full w-full rounded-sm border border-elevation-outline-default-2 border-solid bg-elevation-fill-default-1", uiOutlineClass, "focus-within:border focus-within:border-input-outlined-outline-active", "focus-visible:outline-interactive-contained-primary-focus", "hover:border hover:border-input-outlined-outline-hover"),
-			"data-text-editor": true,
-			"data-rac": "",
-			"data-hovered": isHovered || void 0,
-			"data-disabled": isDisabled || void 0,
-			"data-is-disabled": isDisabled || void 0,
-			"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,
-			children: [/* @__PURE__ */ jsx(TextEditorToolbar, { editor }), /* @__PURE__ */ jsxs("div", {
-				className: clsx("relative overflow-auto", as === "floating" && "pt-3"),
-				children: [as === "floating" && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
-					as,
-					...headerProps,
-					className: clsx(headerProps.className, inputSideCva({
-						size: "default",
-						type: "left"
-					}))
-				}), /* @__PURE__ */ jsx(EditorContent, {
-					editor,
-					placeholder: as === "floating" ? "" : placeholder,
-					className: clsx(as === "floating" && editor?.isEmpty && "[&_p:before]:opacity-0")
-				})]
-			})]
-		})
-	});
+		};
+		$[26] = onChange;
+		$[27] = t11;
+	} else t11 = $[27];
+	const t12 = !isDisabled;
+	let t13;
+	if ($[28] !== onBlur || $[29] !== t10 || $[30] !== t11 || $[31] !== t12 || $[32] !== t8) {
+		t13 = {
+			extensions: t8,
+			editorProps: t10,
+			onUpdate: t11,
+			immediatelyRender: false,
+			editable: t12,
+			onBlur
+		};
+		$[28] = onBlur;
+		$[29] = t10;
+		$[30] = t11;
+		$[31] = t12;
+		$[32] = t8;
+		$[33] = t13;
+	} else t13 = $[33];
+	let t14;
+	if ($[34] !== editorClassName || $[35] !== isDisabled) {
+		t14 = [isDisabled, editorClassName];
+		$[34] = editorClassName;
+		$[35] = isDisabled;
+		$[36] = t14;
+	} else t14 = $[36];
+	const editor = useEditor(t13, t14);
+	let t15;
+	if ($[37] !== editor || $[38] !== value?.json) {
+		t15 = () => {
+			const content = value?.json ?? null;
+			if (editor) {
+				if (!isEqual(content, editor.getJSON())) editor.commands.setContent(content);
+			} else if (!isEqual(content, contentRef.current)) contentRef.current = content ?? null;
+		};
+		$[37] = editor;
+		$[38] = value?.json;
+		$[39] = t15;
+	} else t15 = $[39];
+	let t16;
+	if ($[40] !== value) {
+		t16 = [value];
+		$[40] = value;
+		$[41] = t16;
+	} else t16 = $[41];
+	useEffect(t15, t16);
+	let t17;
+	let t18;
+	if ($[42] !== editor) {
+		t17 = () => {
+			if (editor && contentRef.current) {
+				editor.commands.setContent(contentRef.current);
+				contentRef.current = null;
+			}
+		};
+		t18 = [editor];
+		$[42] = editor;
+		$[43] = t17;
+		$[44] = t18;
+	} else {
+		t17 = $[43];
+		t18 = $[44];
+	}
+	useEffect(t17, t18);
+	const t19 = hideLabel || isHeaderHidden;
+	let T0;
+	let t20;
+	let t21;
+	let t22;
+	let t23;
+	let t24;
+	let t25;
+	let t26;
+	let t27;
+	let t28;
+	let t29;
+	let t30;
+	let t31;
+	let t32;
+	let t33;
+	let t34;
+	let t35;
+	let t36;
+	let t37;
+	let t38;
+	let t39;
+	let t40;
+	let t41;
+	if ($[45] !== as || $[46] !== className || $[47] !== editor || $[48] !== fieldProps || $[49] !== focusWithinProps || $[50] !== formFieldProps || $[51] !== headerClassName || $[52] !== helperText || $[53] !== hoverProps || $[54] !== inputSideCva || $[55] !== isDirty || $[56] !== isDisabled || $[57] !== isFocusVisible || $[58] !== isFocused || $[59] !== isHovered || $[60] !== isRequired || $[61] !== label || $[62] !== labelProps || $[63] !== ref || $[64] !== rightContent || $[65] !== t19 || $[66] !== tooltipText) {
+		const headerProps = {
+			label,
+			tooltipText,
+			helperText,
+			isRequired,
+			rightContent,
+			isHeaderHidden: t19,
+			isDisabled,
+			className: headerClassName,
+			labelProps
+		};
+		T0 = FormField;
+		t37 = formFieldProps;
+		t38 = ref;
+		t39 = as;
+		t40 = labelProps;
+		if ($[90] !== className) {
+			t41 = clsx("group w-full", className);
+			$[90] = className;
+			$[91] = t41;
+		} else t41 = $[91];
+		if ($[92] === Symbol.for("react.memo_cache_sentinel")) {
+			t22 = clsx("group/text-editor relative", "h-full w-full rounded-sm border border-elevation-outline-default-2 border-solid bg-elevation-fill-default-1", uiOutlineClass, "focus-within:border focus-within:border-input-outlined-outline-active", "focus-visible:outline-interactive-contained-primary-focus", "hover:border hover:border-input-outlined-outline-hover");
+			$[92] = t22;
+		} else t22 = $[92];
+		t23 = true;
+		t24 = "";
+		t25 = isHovered || void 0;
+		t26 = isDisabled || void 0;
+		t27 = isDisabled || void 0;
+		t28 = isFocused || void 0;
+		t29 = isFocused && isFocusVisible || void 0;
+		t30 = !editor?.isEmpty;
+		t31 = isRequired || void 0;
+		t32 = isDirty || void 0;
+		t33 = hoverProps;
+		t34 = focusWithinProps;
+		t35 = fieldProps;
+		if ($[93] !== editor) {
+			t36 = /* @__PURE__ */ jsx(TextEditorToolbar, { editor });
+			$[93] = editor;
+			$[94] = t36;
+		} else t36 = $[94];
+		const t42 = as === "floating" && "pt-3";
+		if ($[95] !== t42) {
+			t20 = clsx("relative overflow-auto", t42);
+			$[95] = t42;
+			$[96] = t20;
+		} else t20 = $[96];
+		t21 = as === "floating" && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
+			as,
+			...headerProps,
+			className: clsx(headerProps.className, inputSideCva({
+				size: "default",
+				type: "left"
+			}))
+		});
+		$[45] = as;
+		$[46] = className;
+		$[47] = editor;
+		$[48] = fieldProps;
+		$[49] = focusWithinProps;
+		$[50] = formFieldProps;
+		$[51] = headerClassName;
+		$[52] = helperText;
+		$[53] = hoverProps;
+		$[54] = inputSideCva;
+		$[55] = isDirty;
+		$[56] = isDisabled;
+		$[57] = isFocusVisible;
+		$[58] = isFocused;
+		$[59] = isHovered;
+		$[60] = isRequired;
+		$[61] = label;
+		$[62] = labelProps;
+		$[63] = ref;
+		$[64] = rightContent;
+		$[65] = t19;
+		$[66] = tooltipText;
+		$[67] = T0;
+		$[68] = t20;
+		$[69] = t21;
+		$[70] = t22;
+		$[71] = t23;
+		$[72] = t24;
+		$[73] = t25;
+		$[74] = t26;
+		$[75] = t27;
+		$[76] = t28;
+		$[77] = t29;
+		$[78] = t30;
+		$[79] = t31;
+		$[80] = t32;
+		$[81] = t33;
+		$[82] = t34;
+		$[83] = t35;
+		$[84] = t36;
+		$[85] = t37;
+		$[86] = t38;
+		$[87] = t39;
+		$[88] = t40;
+		$[89] = t41;
+	} else {
+		T0 = $[67];
+		t20 = $[68];
+		t21 = $[69];
+		t22 = $[70];
+		t23 = $[71];
+		t24 = $[72];
+		t25 = $[73];
+		t26 = $[74];
+		t27 = $[75];
+		t28 = $[76];
+		t29 = $[77];
+		t30 = $[78];
+		t31 = $[79];
+		t32 = $[80];
+		t33 = $[81];
+		t34 = $[82];
+		t35 = $[83];
+		t36 = $[84];
+		t37 = $[85];
+		t38 = $[86];
+		t39 = $[87];
+		t40 = $[88];
+		t41 = $[89];
+	}
+	const t42 = as === "floating" ? "" : placeholder;
+	const t43 = as === "floating" && editor?.isEmpty && "[&_p:before]:opacity-0";
+	let t44;
+	if ($[97] !== t43) {
+		t44 = clsx(t43);
+		$[97] = t43;
+		$[98] = t44;
+	} else t44 = $[98];
+	let t45;
+	if ($[99] !== editor || $[100] !== t42 || $[101] !== t44) {
+		t45 = /* @__PURE__ */ jsx(EditorContent, {
+			editor,
+			placeholder: t42,
+			className: t44
+		});
+		$[99] = editor;
+		$[100] = t42;
+		$[101] = t44;
+		$[102] = t45;
+	} else t45 = $[102];
+	let t46;
+	if ($[103] !== t20 || $[104] !== t21 || $[105] !== t45) {
+		t46 = /* @__PURE__ */ jsxs("div", {
+			className: t20,
+			children: [t21, t45]
+		});
+		$[103] = t20;
+		$[104] = t21;
+		$[105] = t45;
+		$[106] = t46;
+	} else t46 = $[106];
+	let t47;
+	if ($[107] !== t22 || $[108] !== t23 || $[109] !== t24 || $[110] !== t25 || $[111] !== t26 || $[112] !== t27 || $[113] !== t28 || $[114] !== t29 || $[115] !== t30 || $[116] !== t31 || $[117] !== t32 || $[118] !== t33 || $[119] !== t34 || $[120] !== t35 || $[121] !== t36 || $[122] !== t46) {
+		t47 = /* @__PURE__ */ jsxs("div", {
+			className: t22,
+			"data-text-editor": t23,
+			"data-rac": t24,
+			"data-hovered": t25,
+			"data-disabled": t26,
+			"data-is-disabled": t27,
+			"data-focus-within": t28,
+			"data-focus-visible": t29,
+			"data-is-filled": t30,
+			"data-is-required": t31,
+			"data-is-dirty": t32,
+			...t33,
+			...t34,
+			...t35,
+			children: [t36, t46]
+		});
+		$[107] = t22;
+		$[108] = t23;
+		$[109] = t24;
+		$[110] = t25;
+		$[111] = t26;
+		$[112] = t27;
+		$[113] = t28;
+		$[114] = t29;
+		$[115] = t30;
+		$[116] = t31;
+		$[117] = t32;
+		$[118] = t33;
+		$[119] = t34;
+		$[120] = t35;
+		$[121] = t36;
+		$[122] = t46;
+		$[123] = t47;
+	} else t47 = $[123];
+	let t48;
+	if ($[124] !== T0 || $[125] !== t37 || $[126] !== t38 || $[127] !== t39 || $[128] !== t40 || $[129] !== t41 || $[130] !== t47) {
+		t48 = /* @__PURE__ */ jsx(T0, {
+			...t37,
+			ref: t38,
+			as: t39,
+			labelProps: t40,
+			className: t41,
+			children: t47
+		});
+		$[124] = T0;
+		$[125] = t37;
+		$[126] = t38;
+		$[127] = t39;
+		$[128] = t40;
+		$[129] = t41;
+		$[130] = t47;
+		$[131] = t48;
+	} else t48 = $[131];
+	return t48;
 };
 var TextEditor = (props) => {
 	const $ = c(15);

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

@@ -1,34 +1,81 @@
 import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { accordionDefinition } from "./accordion.cva.js";
 import { AccordionItem } from "./AccordionItem.js";
+import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { DisclosureGroup } from "react-aria-components";
 //#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, {
-		allowsMultipleExpanded,
-		expandedKeys,
-		defaultExpandedKeys,
-		onExpandedChange,
-		className: clsx(UIOverrides.useCva("accordion.cva", accordionDefinition)({
+var Accordion = (t0) => {
+	const $ = c(23);
+	const { items, variant: t1, actionPosition: t2, allowsMultipleExpanded: t3, expandedKeys, defaultExpandedKeys, onExpandedChange, className, disabled } = t0;
+	const variant = t1 === void 0 ? "filled" : t1;
+	const actionPosition = t2 === void 0 ? "right" : t2;
+	const allowsMultipleExpanded = t3 === void 0 ? false : t3;
+	const accordionCva = UIOverrides.useCva("accordion.cva", accordionDefinition);
+	const t4 = items.length === 1;
+	let t5;
+	if ($[0] !== accordionCva || $[1] !== className || $[2] !== t4 || $[3] !== variant) {
+		t5 = clsx(accordionCva({
 			className,
 			variant,
-			singleItem: items.length === 1
-		})),
-		isDisabled: disabled,
-		children: items.map((item) => /* @__PURE__ */ jsx(AccordionItem, {
-			id: item.id,
-			heading: item.heading,
-			subheading: item.subheading,
-			icon: item.icon,
-			variant,
-			actionPosition,
-			disabled: item.disabled || disabled,
-			isSingle: items.length === 1,
-			children: item.children
-		}, item.id))
-	});
+			singleItem: t4
+		}));
+		$[0] = accordionCva;
+		$[1] = className;
+		$[2] = t4;
+		$[3] = variant;
+		$[4] = t5;
+	} else t5 = $[4];
+	let t6;
+	if ($[5] !== actionPosition || $[6] !== disabled || $[7] !== items || $[8] !== variant) {
+		let t7;
+		if ($[10] !== actionPosition || $[11] !== disabled || $[12] !== items.length || $[13] !== variant) {
+			t7 = (item) => /* @__PURE__ */ jsx(AccordionItem, {
+				id: item.id,
+				heading: item.heading,
+				subheading: item.subheading,
+				icon: item.icon,
+				variant,
+				actionPosition,
+				disabled: item.disabled || disabled,
+				isSingle: items.length === 1,
+				children: item.children
+			}, item.id);
+			$[10] = actionPosition;
+			$[11] = disabled;
+			$[12] = items.length;
+			$[13] = variant;
+			$[14] = t7;
+		} else t7 = $[14];
+		t6 = items.map(t7);
+		$[5] = actionPosition;
+		$[6] = disabled;
+		$[7] = items;
+		$[8] = variant;
+		$[9] = t6;
+	} else t6 = $[9];
+	let t7;
+	if ($[15] !== allowsMultipleExpanded || $[16] !== defaultExpandedKeys || $[17] !== disabled || $[18] !== expandedKeys || $[19] !== onExpandedChange || $[20] !== t5 || $[21] !== t6) {
+		t7 = /* @__PURE__ */ jsx(DisclosureGroup, {
+			allowsMultipleExpanded,
+			expandedKeys,
+			defaultExpandedKeys,
+			onExpandedChange,
+			className: t5,
+			isDisabled: disabled,
+			children: t6
+		});
+		$[15] = allowsMultipleExpanded;
+		$[16] = defaultExpandedKeys;
+		$[17] = disabled;
+		$[18] = expandedKeys;
+		$[19] = onExpandedChange;
+		$[20] = t5;
+		$[21] = t6;
+		$[22] = t7;
+	} else t7 = $[22];
+	return t7;
 };
 //#endregion
 export { Accordion };