@parallelworks/ui 0.17.0 → 0.19.0

package/dist/form/index.js

@@ -1,1035 +1,504 @@
-import { AngleRightIcon, EyeIcon, EyeOffIcon, SuccessCheckmark, TrashIcon } from "../icons.js";
-import { l as useSlots, u as useStrings } from "../chunks/Provider-DHmZ3v9i.js";
-import { n as TOOLTIP_ID, r as TooltipInfo } from "../chunks/Tooltip-n9w7Tkt1.js";
+import { d as useWorkflowEngine, l as useSlots, u as useStrings } from "../chunks/Provider-CDYurraE.js";
+import { AngleRightIcon, EyeIcon, EyeOffIcon, TrashIcon } from "../icons.js";
+import { r as TooltipInfo } from "../chunks/Tooltip-K5HJr4_p.js";
+import { a as Dropdown, c as UncontrolledCollapsiblePanel, i as CustomListbox, n as SectionHeader, o as ControlledCollapsiblePanel, r as MultiSelectDropdown, t as SwitchToggle } from "../chunks/SwitchToggle-DShNdcao.js";
 import { c as isCategory, n as StatusDot } from "../chunks/StatusBadge-C1Blx_cW.js";
-import { a as UncontrolledCollapsiblePanel, c as Dropdown, n as SectionHeader, o as MultiSelectDropdown, r as ControlledCollapsiblePanel, s as CustomListbox, t as SwitchToggle } from "../chunks/SwitchToggle-BRQoEwLZ.js";
 import { t as Loader } from "../chunks/Loader-BXoXTZGc.js";
-import { n as Table } from "../chunks/Table-C6JdFFiJ.js";
-import { a as resolvedFlag, c as FieldWrapper, d as useFieldLabelledByProps, f as useFieldRequired, i as initializeValues, l as FieldProvider, n as flattenGroups, o as applySecondaryField, r as impureSetValueFromPath, s as findSecondaryOption, t as enforceOneMustBeTrue, u as useFieldControlProps } from "../chunks/lib-CUTRDpa6.js";
+import { n as Table } from "../chunks/Table-DU2MW8xz.js";
+import { a as initializeValues, c as findSecondaryOption, d as useFieldLabelledByProps, f as useFieldRequired, i as impureSetValueFromPath, l as FieldProvider, n as enforceOneMustBeTrue, o as resolvedFlag, r as flattenGroups, s as applySecondaryField, t as FieldWrapper, u as useFieldControlProps } from "../chunks/FieldWrapper-Cszwg-4B.js";
 import cx from "classnames";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import React, { Suspense, createContext, memo, useCallback, useContext, useEffect, useId, useMemo, useRef, useState } from "react";
+import React, { Suspense, createContext, memo, useCallback, useContext, useEffect, useEffectEvent, useId, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import deepEqual from "fast-deep-equal";
 import { Duration } from "luxon";
-import { callWhenParserInitialized, convertToDynamicForm, extractInputDeps, initializeParseStringsOfObj, parseStringsOfObj, parseStringsOfObjReady } from "@parallelworks/workflow-parser";
-import { Field, Form, Formik, getIn, useField, useFormikContext } from "formik";
+import { Field, Form, Formik, useField, useFormikContext } from "formik";
 import { NumericFormat } from "react-number-format";
-//#region src/form/utils/getValueUsingPath.ts
-function getValueUsingPath(obj, path) {
-	if (typeof path !== "string" || !path) return;
-	const keys = path.split(".");
-	let current = obj;
-	for (const key of keys) {
-		if (!current || typeof current !== "object") return;
-		const container = current;
-		if (key.includes("[")) {
-			const [arrayKey = "", indexStr = ""] = key.split("[");
-			const index = parseInt(indexStr.slice(0, -1), 10);
-			const list = container[arrayKey];
-			if (!Array.isArray(list) || isNaN(index)) return;
-			current = list[index];
-		} else {
-			if (!(key in container)) return;
-			current = container[key];
-		}
-	}
-	return current;
+//#region src/form/Fields/durationValidity.ts
+var invalidPaths = /* @__PURE__ */ new Set();
+function setDurationValidity(path, valid) {
+	if (valid) invalidPaths.delete(path);
+	else invalidPaths.add(path);
 }
-//#endregion
-//#region src/form/utils/checkShowIfObject.ts
-function checkShowIfObject(showIfObject, formValues, index) {
-	const valueList = [];
-	for (let [key, value] of Object.entries(showIfObject)) {
-		if (index !== void 0) key = key.replace("[index]", `[${index}]`);
-		const dependsOnValue = getValueUsingPath(formValues, key);
-		if (typeof value === "boolean" || typeof value === "string" || typeof value === "number") valueList.push(dependsOnValue !== null && dependsOnValue !== void 0 && dependsOnValue.toString() === value.toString());
-		else if (Array.isArray(value)) valueList.push(value.includes(dependsOnValue));
-	}
-	return valueList;
+function getInvalidDurationPaths() {
+	return [...invalidPaths];
 }
 //#endregion
-//#region src/form/utils/getParentValue.ts
-function getParentValue(index, targetField, values, dependentPath, field) {
-	let parentValue;
-	if (typeof targetField === "object" && targetField !== null && !Array.isArray(targetField)) parentValue = !checkShowIfObject(targetField, values, index).includes(false);
-	else if (field.depends_on) {
-		dependentPath = field.depends_on;
-		if (index !== void 0) dependentPath = field.depends_on.replace("[index]", `[${index}]`);
-		const dependsOnValue = getValueUsingPath(values, dependentPath);
-		const dependsOnText = dependsOnValue === null || dependsOnValue === void 0 ? void 0 : String(dependsOnValue);
-		if (Array.isArray(targetField)) parentValue = targetField.includes(dependsOnValue) || targetField.includes(dependsOnText);
-		else if (typeof targetField === "string") parentValue = dependsOnText !== void 0 && targetField.includes(dependsOnText);
-		else parentValue = targetField === dependsOnValue;
-	} else {
-		dependentPath = typeof targetField === "string" ? targetField : "";
-		if (index !== void 0 && typeof targetField === "string") dependentPath = targetField.replace("[index]", `[${index}]`);
-		parentValue = getValueUsingPath(values, dependentPath);
-	}
-	return parentValue;
+//#region src/form/SpecialTypes/FormikCustomDropdown.tsx
+function toComparableOptions(options) {
+	return options?.map((option) => {
+		if (typeof option === "string") return option;
+		if (isCategory(option)) return {
+			category: option.category,
+			options: option.options.map((o) => {
+				const base = {
+					label: o.label,
+					value: o.value,
+					disabled: o.disabled
+				};
+				return o.description !== void 0 ? {
+					...base,
+					description: o.description
+				} : base;
+			})
+		};
+		const base = {
+			label: option.label,
+			value: option.value,
+			disabled: option.disabled
+		};
+		return option.description !== void 0 ? {
+			...base,
+			description: option.description
+		} : base;
+	});
 }
-//#endregion
-//#region src/form/useParsedOpts.ts
-var EMPTY_VARS = {};
-var EMPTY_KEYS = [];
-/**
-* useMemo won't work here — Formik values changes on every keystroke, so this hook extracts which inputs.* keys the schema references and re-parses only when those change. Defaults `userVars`/`secretKeys` to empty — callers in React scope should pass them from `useUserVars()` so the parser leaves `${{ var.SECRET }}` literal during template eval (otherwise the recursive substitution turns `"https://${{ var.PAT }}@host/"` into `"https://@host/"`).
-*/
-function useParsedOpts(rawOptions, values, organizationVariables, userVars = EMPTY_VARS, secretKeys = EMPTY_KEYS) {
-	const c = useRef({
-		rawOptions: null,
-		orgVars: void 0,
-		userVars: null,
-		secretKeys: null,
-		converted: {},
-		inputDeps: /* @__PURE__ */ new Set(),
-		hasExpressions: false,
-		relevantSnapshot: {},
-		result: null
-	}).current;
-	if (rawOptions !== c.rawOptions) {
-		c.rawOptions = rawOptions;
-		c.converted = convertToDynamicForm(rawOptions);
-		const { inputDeps, hasExpressions } = extractInputDeps(c.converted);
-		c.inputDeps = inputDeps;
-		c.hasExpressions = hasExpressions;
-		c.result = null;
-	}
-	if (organizationVariables !== c.orgVars) {
-		c.orgVars = organizationVariables;
-		c.result = null;
-	}
-	if (userVars !== c.userVars || secretKeys !== c.secretKeys) {
-		c.userVars = userVars;
-		c.secretKeys = secretKeys;
-		c.result = null;
-	}
-	if (c.result !== null) {
-		if (c.inputDeps.size === 0) return c.result;
-		let inputsChanged = false;
-		for (const key of c.inputDeps) if (!deepEqual(values[key], c.relevantSnapshot[key])) {
-			inputsChanged = true;
-			break;
+function arePropsEqual(prev, next) {
+	for (const key of Object.keys(next)) if (key === "options") {
+		if (!deepEqual(toComparableOptions(prev.options), toComparableOptions(next.options))) return false;
+	} else if (prev[key] !== next[key]) return false;
+	return true;
+}
+var FormikCustomDropdown_default = memo(function FormikCustomDropdown({ name, ariaLabel, options, setFormDirty, onChange, parentValue, className, secondaryField, disabled = false, loading = false, invalid = false, autoselect, value, allowCustomValue = false, customValueLabel, placeholder, currentValue, setFieldValue, setFieldTouched }) {
+	const required = useFieldRequired();
+	const controlProps = useFieldControlProps();
+	const prevParentRef = useRef(parentValue);
+	const handleChange = (val) => {
+		if (secondaryField && typeof options[0] !== "string") {
+			const option = findSecondaryOption(options, val);
+			if (option) applySecondaryField(secondaryField, option.secondaryValue, setFieldValue);
+		}
+		if (onChange) onChange(val);
+		setFieldValue(name, val);
+		setFieldTouched(name, true);
+		setFormDirty(true);
+	};
+	useEffect(() => {
+		prevParentRef.current = parentValue;
+	});
+	const prevOptions = useRef(null);
+	const syncAutoselect = useEffectEvent((options, autoselect) => {
+		if (deepEqual(prevOptions.current, toComparableOptions(options))) return;
+		if (prevOptions.current === null && currentValue !== void 0 && currentValue !== null) {
+			prevOptions.current = toComparableOptions(options);
+			return;
+		}
+		prevOptions.current = toComparableOptions(options);
+		if (autoselect === false || !options?.length) return;
+		if (autoselect === void 0) {
+			if (options.length && isCategory(options[0])) {
+				let optionCount = 0;
+				for (const category of options) {
+					if (isCategory(category)) optionCount += category.options.length;
+					if (optionCount > 1) return;
+				}
+			} else if (options.length !== 1) return;
+		}
+		if (!options?.find((option) => {
+			if (typeof option === "string") return option === currentValue;
+			else if (isCategory(option)) return option.options.some((subOption) => {
+				return subOption.value === currentValue;
+			});
+			return option.value === currentValue;
+		}) || autoselect) {
+			let val;
+			for (const option of options) if (typeof option === "string") {
+				val = option;
+				break;
+			} else if (isCategory(option)) {
+				const enabled = option.options.find((o) => !o.disabled);
+				if (enabled) {
+					val = enabled.value;
+					break;
+				}
+			} else if (!option.disabled) {
+				val = option.value;
+				break;
+			}
+			if (val !== void 0) handleChange(val);
 		}
-		if (!inputsChanged) return c.result;
-	}
-	const parsed = parseStringsOfObj({
-		inputs: values,
-		obj: c.converted,
-		orgVars: organizationVariables,
-		userVars,
-		secretKeys
 	});
-	c.result = parsed;
-	c.relevantSnapshot = {};
-	for (const key of c.inputDeps) c.relevantSnapshot[key] = values[key];
-	return parsed;
-}
-//#endregion
-//#region src/form/usePrevious.ts
-function usePrevious(value) {
-	const ref = useRef(void 0);
 	useEffect(() => {
-		ref.current = value;
+		syncAutoselect(options, autoselect);
+	}, [options, autoselect]);
+	return /* @__PURE__ */ jsx(Dropdown, {
+		...controlProps,
+		textBoxClassName: cx(className, invalid && "invalid"),
+		ariaLabel,
+		required,
+		onChange: (val) => handleChange(val),
+		value: options?.length === 0 && !allowCustomValue ? value : currentValue,
+		options,
+		placeholder,
+		disabled,
+		loading,
+		allowCustomValue,
+		customValueLabel
 	});
-	return ref.current;
-}
+}, arePropsEqual);
 //#endregion
-//#region src/form/Wizard/WizardNavigation.tsx
-function WizardNavigation({ currentStep, stepOrder, canGoToNext, canGoBack, isCurrentStepValid, nextLabel, prevLabel, submitLabel = "Submit", onNext, onPrevious, onSubmit }) {
-	const [isLoading, setIsLoading] = useState(false);
-	const [error, setError] = useState(null);
-	const isLastStep = stepOrder.indexOf(currentStep) === stepOrder.length - 1;
-	const handleNext = async () => {
-		setIsLoading(true);
-		setError(null);
+//#region src/form/SpecialTypes/FormikCustomInput.tsx
+var DEBOUNCE_MS$2 = 500;
+function FormikCustomInput({ name, type, step, placeholder, onChange, disabled, min, max, sanitize, invalid = false, lowercase = false, minLength, maxLength, defaultValue = "", value }) {
+	const [field] = useField(name);
+	const required = useFieldRequired();
+	const controlProps = useFieldControlProps();
+	const { setFieldValue, setFieldTouched } = useFormikContext();
+	const [showPassword, setShowPassword] = useState(false);
+	const isPassword = type === "password";
+	const [localValue, setLocalValue] = useState(value ?? field.value);
+	const isFocused = useRef(false);
+	const debounceRef = useRef(null);
+	useEffect(() => {
+		if (!isFocused.current) setLocalValue(value ?? field.value);
+	}, [field.value, value]);
+	const sanitizeName = useCallback((val) => {
+		if (sanitize === void 0) return lowercase ? val.toLowerCase() : val;
 		try {
-			if (!await onNext()) setError("Please fix errors before proceeding");
-		} catch (err) {
-			setError(err instanceof Error ? err.message : "An error occurred");
-		} finally {
-			setIsLoading(false);
+			const regexp = new RegExp(sanitize);
+			if (lowercase) val = val.toLowerCase();
+			return val.replace(regexp, "");
+		} catch {
+			console.error("Invalid regex for sanitization:", sanitize);
 		}
-	};
-	const handleSubmit = async () => {
-		setIsLoading(true);
-		setError(null);
-		try {
-			await onSubmit();
-		} catch (err) {
-			setError(err instanceof Error ? err.message : "An error occurred");
-		} finally {
-			setIsLoading(false);
+		return val;
+	}, [sanitize, lowercase]);
+	const flushToFormik = useCallback((val) => {
+		if (onChange) onChange(val);
+		setFieldTouched(name, true);
+		setFieldValue(name, val);
+	}, [
+		name,
+		onChange,
+		setFieldTouched,
+		setFieldValue
+	]);
+	const handleChange = (e) => {
+		const text = sanitize ? sanitizeName(e.target.value) : e.target.value;
+		let val = text;
+		if (type === "number") {
+			const parsed = parseFloat(text);
+			val = isNaN(parsed) ? void 0 : parsed;
 		}
+		if (type === "password" && val === "") val = defaultValue;
+		setLocalValue(val);
+		clearTimeout(debounceRef.current ?? void 0);
+		debounceRef.current = setTimeout(() => flushToFormik(val), DEBOUNCE_MS$2);
 	};
-	return /* @__PURE__ */ jsxs("div", { children: [error && /* @__PURE__ */ jsx("div", {
-		className: "mb-4 p-3 bg-red-50 border border-red-200 rounded text-sm text-red-700",
-		children: error
-	}), /* @__PURE__ */ jsxs("div", {
-		className: "flex gap-3 justify-between pt-4",
-		children: [/* @__PURE__ */ jsx("button", {
-			type: "button",
-			onClick: onPrevious,
-			disabled: !canGoBack || isLoading,
-			className: "px-6 py-3 rounded-lg font-medium transition-all duration-200 border flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
-			style: {
-				color: "var(--theme-app)",
-				borderColor: "var(--theme-border)",
-				backgroundColor: "var(--theme-app-bg)"
-			},
-			onMouseEnter: (e) => {
-				if (!(!canGoBack || isLoading)) e.currentTarget.style.backgroundColor = "var(--theme-hover)";
-			},
-			onMouseLeave: (e) => {
-				e.currentTarget.style.backgroundColor = "var(--theme-app-bg)";
-			},
-			"aria-label": "Go to previous step",
-			children: prevLabel || "← Previous"
-		}), isLastStep ? /* @__PURE__ */ jsxs("button", {
-			type: "button",
-			onClick: handleSubmit,
-			disabled: !isCurrentStepValid || isLoading,
-			className: "px-8 py-3 rounded-lg font-medium transition-all duration-200 text-white flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed shadow-md hover:shadow-lg",
-			style: { backgroundColor: "var(--theme-element)" },
-			onMouseEnter: (e) => {
-				if (!(!isCurrentStepValid || isLoading)) e.currentTarget.style.filter = "brightness(0.9)";
-			},
-			onMouseLeave: (e) => {
-				e.currentTarget.style.filter = "brightness(1)";
-			},
-			"aria-label": submitLabel,
-			children: [isLoading && /* @__PURE__ */ jsx(Loader, {
-				size: 16,
-				full: false
-			}), submitLabel]
-		}) : /* @__PURE__ */ jsxs("button", {
+	const handleFocus = () => {
+		isFocused.current = true;
+	};
+	const handleBlur = () => {
+		isFocused.current = false;
+		clearTimeout(debounceRef.current ?? void 0);
+		const current = localValue;
+		if (current === void 0 || current === null) return;
+		const text = current.toString();
+		let val = text;
+		if (type === "number") {
+			const parsed = parseFloat(text);
+			if (Number.isNaN(parsed)) val = void 0;
+			else if (min !== void 0 && parsed < min) val = min;
+			else if (max !== void 0 && parsed > max) val = max;
+			else val = parsed;
+		}
+		setLocalValue(val);
+		flushToFormik(val);
+	};
+	const displayValue = isPassword && localValue === defaultValue ? "" : localValue ?? "";
+	const resolvedType = isPassword ? showPassword ? "text" : "password" : type === "string" ? "text" : type;
+	const input = /* @__PURE__ */ jsx("input", {
+		...controlProps,
+		"data-1p-ignore": true,
+		className: cx("w-full", disabled && "disabled", invalid && "invalid", isPassword && "pr-8"),
+		name,
+		value: displayValue,
+		type: resolvedType,
+		"aria-required": required || void 0,
+		disabled,
+		placeholder,
+		minLength,
+		maxLength,
+		onChange: handleChange,
+		onFocus: handleFocus,
+		onBlur: handleBlur,
+		min,
+		max,
+		step
+	});
+	if (!isPassword) return input;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "relative w-full",
+		children: [input, /* @__PURE__ */ jsx("button", {
 			type: "button",
-			onClick: handleNext,
-			disabled: !canGoToNext || isLoading,
-			className: "px-8 py-3 rounded-lg font-medium transition-all duration-200 text-white flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed shadow-md hover:shadow-lg",
-			style: { backgroundColor: "var(--theme-element)" },
-			onMouseEnter: (e) => {
-				if (!(!canGoToNext || isLoading)) e.currentTarget.style.filter = "brightness(0.9)";
-			},
-			onMouseLeave: (e) => {
-				e.currentTarget.style.filter = "brightness(1)";
-			},
-			"aria-label": "Go to next step",
-			children: [isLoading && /* @__PURE__ */ jsx(Loader, {
-				size: 16,
-				full: false
-			}), nextLabel || "Next →"]
+			className: "absolute right-2 top-1/2 -translate-y-1/2 theme-muted-text",
+			onClick: () => setShowPassword((prev) => !prev),
+			disabled,
+			tabIndex: -1,
+			"aria-label": showPassword ? "Hide value" : "Show value",
+			children: showPassword ? /* @__PURE__ */ jsx(EyeOffIcon, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(EyeIcon, { className: "h-4 w-4" })
 		})]
-	})] });
-}
-//#endregion
-//#region src/form/Wizard/WizardStepContent.tsx
-function WizardStepContent({ currentStep, stepConfig, flatten = true, values, onValuesChange, setFormDirty, setFieldValue, setFieldTouched, ...fieldsProps }) {
-	if (!stepConfig?.options) return null;
-	return /* @__PURE__ */ jsxs("div", {
-		className: "mb-4 w-full",
-		children: [
-			stepConfig.title && /* @__PURE__ */ jsx("h2", {
-				className: "text-2xl font-bold mb-2",
-				style: { color: "var(--theme-app)" },
-				children: stepConfig.title
-			}),
-			stepConfig.description && /* @__PURE__ */ jsx("p", {
-				className: "mb-4 leading-relaxed",
-				style: { color: "var(--theme-muted-text-color)" },
-				children: stepConfig.description
-			}),
-			/* @__PURE__ */ jsx(FieldsFromOptions, {
-				options: stepConfig.options,
-				values,
-				setFormDirty,
-				setFieldValue,
-				setFieldTouched,
-				...flatten === false ? { parentInfo: {
-					parentName: currentStep,
-					fieldNamePrefix: `${currentStep}.`
-				} } : {},
-				...fieldsProps
-			}, currentStep)
-		]
 	});
 }
 //#endregion
-//#region src/form/Wizard/WizardStepIndicator.tsx
-function WizardStepIndicator({ stepOrder, currentStep, steps, visitedSteps, invalidSteps, onStepClick, allowJump = false, hideStepNumbers = false }) {
-	const currentIndex = useMemo(() => stepOrder.indexOf(currentStep), [stepOrder, currentStep]);
-	const getStepStatus = (stepKey, index) => {
-		if (stepKey === currentStep) return "active";
-		if (index < currentIndex) return "completed";
-		return "upcoming";
-	};
-	const handleStepClick = (stepKey) => {
-		if (!allowJump || !visitedSteps.has(stepKey)) return;
-		onStepClick?.(stepKey);
+//#region src/form/SpecialTypes/FormikNumericInput.tsx
+var DEBOUNCE_MS$1 = 500;
+function FormikNumericInput({ name, placeholder, onChange, disabled, min, max, invalid = false }) {
+	const [field] = useField(name);
+	const required = useFieldRequired();
+	const controlProps = useFieldControlProps();
+	const { setFieldValue, setFieldTouched } = useFormikContext();
+	const [localValue, setLocalValue] = useState(field.value);
+	const isFocused = useRef(false);
+	const debounceRef = useRef(null);
+	useEffect(() => {
+		if (!isFocused.current) setLocalValue(field.value);
+	}, [field.value]);
+	const flush = (val) => {
+		onChange?.(val);
+		setFieldTouched(name, true);
+		setFieldValue(name, val);
 	};
-	const isClickable = (stepKey) => {
-		return allowJump && visitedSteps.has(stepKey) && stepKey !== currentStep;
+	const handleBlur = () => {
+		isFocused.current = false;
+		clearTimeout(debounceRef.current ?? void 0);
+		let val = localValue;
+		if (val !== void 0) {
+			if (min !== void 0 && val < min) val = min;
+			if (max !== void 0 && val > max) val = max;
+		}
+		setLocalValue(val);
+		flush(val);
 	};
-	return /* @__PURE__ */ jsx("div", {
-		className: "flex items-start justify-between w-full mb-2 gap-4 py-2",
-		children: stepOrder.map((stepKey, index) => {
-			const stepConfig = steps[stepKey];
-			const status = getStepStatus(stepKey, index);
-			const isInvalid = invalidSteps.has(stepKey);
-			const isClickable_ = isClickable(stepKey);
-			const isDotActive = status === "active";
-			const isDotCompleted = status === "completed";
-			const isDotUpcoming = status === "upcoming";
-			return /* @__PURE__ */ jsxs("div", {
-				className: "flex flex-col items-center flex-1 relative",
-				children: [
-					/* @__PURE__ */ jsxs("button", {
-						type: "button",
-						onClick: () => handleStepClick(stepKey),
-						disabled: !isClickable_,
-						className: cx("w-12 h-12 rounded-full border-3 flex items-center justify-center font-bold text-base transition-all duration-300 flex-shrink-0 relative", {
-							"cursor-pointer": isClickable_,
-							"cursor-not-allowed": !isClickable_
-						}, {
-							"text-white": isDotActive,
-							"bg-green-500 border-green-600 text-white shadow-md": isDotCompleted && !isInvalid,
-							"bg-(--theme-border) theme-border theme-muted-text shadow-sm": isDotUpcoming && !isInvalid,
-							"bg-(--theme-muted-panel-bg) theme-border theme-muted-text shadow-sm": !isDotActive && !isDotCompleted && !isDotUpcoming && !isInvalid,
-							"bg-red-50 border-red-500 text-red-600 shadow-sm": isInvalid && status !== "active"
-						}),
-						style: isDotActive ? {
-							backgroundColor: "var(--theme-element)",
-							borderColor: "var(--theme-element)",
-							color: "var(--theme-element-text)",
-							boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
-							zIndex: 10
-						} : { zIndex: 10 },
-						"aria-label": `Step ${index + 1}: ${stepConfig?.title}`,
-						title: stepConfig?.title,
-						children: [!hideStepNumbers && /* @__PURE__ */ jsx("span", {
-							className: cx({ hidden: status === "completed" }),
-							children: index + 1
-						}), status === "completed" && /* @__PURE__ */ jsx("svg", {
-							"aria-hidden": "true",
-							className: "w-4 h-4",
-							fill: "none",
-							stroke: "currentColor",
-							viewBox: "0 0 24 24",
-							children: /* @__PURE__ */ jsx("path", {
-								strokeLinecap: "round",
-								strokeLinejoin: "round",
-								strokeWidth: 3,
-								d: "M5 13l4 4L19 7"
-							})
-						})]
-					}),
-					index < stepOrder.length - 1 && /* @__PURE__ */ jsx("div", {
-						className: cx("absolute h-1 transition-all duration-300", {
-							"bg-green-500": index < currentIndex,
-							"bg-(--theme-border)": index >= currentIndex,
-							"opacity-25": index >= currentIndex
-						}),
-						style: {
-							top: "24px",
-							left: "calc(50% + 24px)",
-							right: "-50%",
-							boxShadow: index < currentIndex ? "0 1px 2px rgba(34, 197, 94, 0.2)" : "none"
-						},
-						"aria-hidden": "true"
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: "mt-2 text-center",
-						children: [/* @__PURE__ */ jsx("div", {
-							className: cx("text-sm text-center transition-colors duration-300 max-w-30", {
-								"font-bold text-green-600": isDotCompleted && !isInvalid,
-								"font-bold text-red-600": isInvalid && status !== "active",
-								"font-semibold theme-muted-text": !isDotActive && !isDotCompleted && !isInvalid,
-								"font-bold text-white": isDotActive
-							}),
-							style: isDotActive ? { color: "var(--theme-element)" } : {},
-							children: stepConfig?.title
-						}), stepConfig?.description && /* @__PURE__ */ jsx("div", {
-							className: "text-xs theme-muted-text mt-1 text-center max-w-30",
-							children: stepConfig.description
-						})]
-					})
-				]
-			}, stepKey);
-		})
+	return /* @__PURE__ */ jsx(NumericFormat, {
+		...controlProps,
+		"data-1p-ignore": true,
+		className: cx("w-full", disabled && "disabled", invalid && "invalid"),
+		name,
+		...localValue === void 0 ? {} : { value: localValue },
+		"aria-required": required || void 0,
+		thousandSeparator: ",",
+		decimalScale: 20,
+		allowNegative: true,
+		disabled,
+		placeholder,
+		onValueChange: (v) => {
+			setLocalValue(v.floatValue);
+			clearTimeout(debounceRef.current ?? void 0);
+			debounceRef.current = setTimeout(() => flush(v.floatValue), DEBOUNCE_MS$1);
+		},
+		onFocus: () => {
+			isFocused.current = true;
+		},
+		onBlur: handleBlur
 	});
 }
 //#endregion
-//#region src/form/Wizard/useWizardState.ts
-function useWizardState({ stepOrder, steps, validateStep, initialStep }) {
-	const firstStep = initialStep || stepOrder[0] || "";
-	const [currentStep, setCurrentStep] = useState(firstStep);
-	const [visitedSteps, setVisitedSteps] = useState(new Set([firstStep]));
-	const [invalidSteps, setInvalidSteps] = useState(/* @__PURE__ */ new Set());
-	const currentStepIndex = stepOrder.indexOf(currentStep);
-	const isLastStep = currentStepIndex === stepOrder.length - 1;
-	const canGoBack = currentStepIndex > 0;
-	/**
-	* Mark step as visited
-	*/
-	const markStepVisited = useCallback((stepKey) => {
-		setVisitedSteps((prev) => new Set([...prev, stepKey]));
-	}, []);
-	/**
-	* Mark step as invalid
-	*/
-	const markStepInvalid = useCallback((stepKey, invalid) => {
-		setInvalidSteps((prev) => {
-			const next = new Set(prev);
-			if (invalid) next.add(stepKey);
-			else next.delete(stepKey);
-			return next;
-		});
-	}, []);
-	const goToNext = useCallback(async () => {
-		if (isLastStep) return false;
-		if (steps[currentStep]?.validateOnNext !== false) {
-			if (!await validateStep(currentStep)) {
-				markStepInvalid(currentStep, true);
-				return false;
-			}
-		}
-		markStepInvalid(currentStep, false);
-		const nextStepKey = stepOrder[currentStepIndex + 1];
-		setCurrentStep(nextStepKey ?? "");
-		markStepVisited(nextStepKey ?? "");
-		return true;
-	}, [
-		currentStep,
-		currentStepIndex,
-		isLastStep,
-		steps,
-		stepOrder,
-		validateStep,
-		markStepInvalid,
-		markStepVisited
-	]);
-	const goToPrevious = useCallback(() => {
-		if (!canGoBack) return;
-		const prevStepKey = stepOrder[currentStepIndex - 1];
-		setCurrentStep(prevStepKey ?? "");
-	}, [
-		canGoBack,
-		currentStepIndex,
-		stepOrder
-	]);
-	const jumpToStep = useCallback((stepKey) => {
-		if (!stepOrder.includes(stepKey)) return false;
-		if (!visitedSteps.has(stepKey) && stepKey !== currentStep) return false;
-		setCurrentStep(stepKey);
-		return true;
-	}, [
-		stepOrder,
-		visitedSteps,
-		currentStep
-	]);
-	/**
-	* Reset wizard to initial state
-	*/
-	const reset = useCallback(() => {
-		setCurrentStep(firstStep);
-		setVisitedSteps(new Set([firstStep]));
-		setInvalidSteps(/* @__PURE__ */ new Set());
-	}, [firstStep]);
-	/**
-	* Get current wizard state
-	*/
-	const getState = useCallback(() => {
-		return {
-			currentStep,
-			visitedSteps,
-			invalidSteps,
-			stepOrder,
-			totalSteps: stepOrder.length,
-			isLastStep,
-			canProceedToNext: !isLastStep,
-			canGoBack
-		};
+//#region src/form/utils/getPlaceholder.ts
+/** `placeholder=""` (empty string) intentionally overrides the default; undefined does not. */
+function getPlaceholder(placeholder, defaultValue) {
+	if (placeholder !== void 0) return placeholder;
+	if (defaultValue && (typeof defaultValue === "string" || typeof defaultValue === "number")) return defaultValue.toString();
+	return "";
+}
+//#endregion
+//#region src/form/Fields/NumberField.tsx
+function NumberField(props) {
+	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact } = props;
+	const [fieldState] = useField(field.name);
+	const { setFieldValue } = useFormikContext();
+	useEffect(() => {
+		if (field.prefillDefault && field.default !== void 0 && (fieldState.value === void 0 || fieldState.value === null || fieldState.value === "")) setFieldValue(field.name, field.default);
 	}, [
-		currentStep,
-		visitedSteps,
-		invalidSteps,
-		stepOrder,
-		isLastStep,
-		canGoBack
+		field.prefillDefault,
+		field.default,
+		field.name,
+		fieldState.value,
+		setFieldValue
 	]);
-	return {
-		currentStep,
-		visitedSteps,
-		invalidSteps,
-		isLastStep,
-		canGoBack,
-		currentStepIndex,
-		totalSteps: stepOrder.length,
-		goToNext,
-		goToPrevious,
-		jumpToStep,
-		reset,
-		markStepVisited,
-		markStepInvalid,
-		getState
-	};
+	return /* @__PURE__ */ jsx(FieldWrapper, {
+		optional: field.optional,
+		label,
+		tooltipComponent,
+		labelPosition,
+		spaceCompact,
+		children: field.thousandsSeparator ? /* @__PURE__ */ jsx(FormikNumericInput, {
+			invalid: missing,
+			name: field.name,
+			placeholder: getPlaceholder(field.placeholder, field.default),
+			disabled,
+			min: field.min,
+			max: field.max,
+			...onChange && { onChange }
+		}, field.name) : /* @__PURE__ */ jsx(FormikCustomInput, {
+			invalid: missing,
+			name: field.name,
+			type: "number",
+			placeholder: getPlaceholder(field.placeholder, field.default),
+			disabled,
+			step: field.step,
+			min: field.min,
+			max: field.max,
+			defaultValue: field.default,
+			...onChange && { onChange }
+		}, field.name)
+	});
 }
 //#endregion
-//#region src/form/Wizard/WizardContainer.tsx
-function hasNestedError(stepErrors, fieldName) {
-	return typeof stepErrors === "object" && stepErrors !== null && fieldName in stepErrors;
-}
-function WizardContainer({ wizardConfig, values, onChange, onSubmit, className = "", labelPosition = "left", missingFields = [], spaceCompact = false, workflowForm = false, setFieldValue, setFieldTouched }) {
-	const { validateForm, setTouched, touched } = useFormikContext();
-	const { config, steps, stepOrder } = wizardConfig;
-	const { currentStep, visitedSteps, invalidSteps, isLastStep, canGoBack, goToNext, goToPrevious, jumpToStep } = useWizardState({
-		stepOrder,
-		steps,
-		validateStep: useCallback(async (stepKey) => {
-			const stepConfig = steps[stepKey];
-			if (!stepConfig?.options) return true;
-			const stepFieldNames = Object.keys(stepConfig.options);
-			const shouldFlatten = config.flatten !== false;
-			const errors = await validateForm();
-			const hasStepErrors = shouldFlatten ? stepFieldNames.some((fieldName) => errors[fieldName]) : stepFieldNames.some((fieldName) => hasNestedError(errors[stepKey], fieldName));
-			if (hasStepErrors) {
-				const touchedFields = stepFieldNames.reduce((acc, fieldName) => {
-					acc[fieldName] = true;
-					return acc;
-				}, {});
-				if (shouldFlatten) setTouched({
-					...touched,
-					...touchedFields
-				}, false);
-				else setTouched({
-					...touched,
-					[stepKey]: touchedFields
-				}, false);
+//#region src/form/Fields/ResourceOptionIcon.tsx
+function ResourceOptionIcon({ imageUrl, fallbackIcon, alt, variant = "success", dotSize = 6 }) {
+	return /* @__PURE__ */ jsxs("span", {
+		className: "flex items-center gap-1.5 shrink-0",
+		children: [/* @__PURE__ */ jsx(StatusDot, {
+			variant,
+			size: dotSize
+		}), /* @__PURE__ */ jsx("img", {
+			src: imageUrl || fallbackIcon,
+			alt,
+			className: "h-4 w-4 object-contain",
+			onError: (e) => {
+				e.currentTarget.src = fallbackIcon;
 			}
-			return !hasStepErrors;
-		}, [
-			steps,
-			validateForm,
-			setTouched,
-			touched
-		])
+		})]
 	});
-	const currentStepConfig = steps[currentStep];
-	const config_ = config.navigation || {};
-	const handleGoToNext = useCallback(async () => {
-		const success = await goToNext();
-		if (success) onChange?.(values);
-		return success;
-	}, [
-		goToNext,
-		values,
-		onChange
-	]);
-	const handleJumpToStep = useCallback((stepKey) => {
-		if (!config_.allowJump || !visitedSteps.has(stepKey)) return false;
-		return jumpToStep(stepKey);
-	}, [
-		jumpToStep,
-		config_.allowJump,
-		visitedSteps
-	]);
-	const handleSubmit = useCallback(async () => {
-		if (!isLastStep) return;
-		const errors = await validateForm();
-		if (Object.keys(errors).length > 0) {
-			const touchedFields = Object.keys(values).reduce((acc, fieldName) => {
-				acc[fieldName] = true;
-				return acc;
-			}, {});
-			setTouched({
-				...touched,
-				...touchedFields
-			}, false);
-			throw new Error("Please fix errors before submitting");
-		}
-		await onSubmit?.(values);
-	}, [
-		isLastStep,
-		validateForm,
-		values,
-		setTouched,
-		touched,
-		onSubmit
-	]);
-	return /* @__PURE__ */ jsxs("div", {
-		className,
-		children: [
-			config_.showSteps !== false && /* @__PURE__ */ jsx(WizardStepIndicator, {
-				stepOrder,
-				currentStep,
-				steps,
-				visitedSteps,
-				invalidSteps,
-				onStepClick: handleJumpToStep,
-				allowJump: config_.allowJump,
-				hideStepNumbers: config_.hideStepNumbers
-			}),
-			currentStepConfig && /* @__PURE__ */ jsx("div", {
-				className: "mb-4",
-				children: /* @__PURE__ */ jsx(WizardStepContent, {
-					currentStep,
-					stepConfig: currentStepConfig,
-					flatten: config.flatten,
-					values,
-					onValuesChange: onChange,
-					labelPosition,
-					missingFields,
-					spaceCompact,
-					setFormDirty: () => onChange?.(values),
-					workflowForm,
-					setFieldValue,
-					setFieldTouched
-				})
-			}),
-			/* @__PURE__ */ jsx(WizardNavigation, {
-				currentStep,
-				stepOrder,
-				canGoToNext: !isLastStep,
-				canGoBack,
-				isCurrentStepValid: !invalidSteps.has(currentStep),
-				nextLabel: currentStepConfig?.nextLabel,
-				prevLabel: currentStepConfig?.prevLabel,
-				submitLabel: config.submitLabel || "Execute",
-				onNext: handleGoToNext,
-				onPrevious: goToPrevious,
-				onSubmit: handleSubmit
-			})
-		]
+}
+//#endregion
+//#region src/form/Fields/BooleanField.tsx
+function BooleanField(props) {
+	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty } = props;
+	const [fieldState] = useField(field.name);
+	const { setFieldValue, setFieldTouched } = useFormikContext();
+	const handleChange = (val) => {
+		if (disabled) return;
+		if (onChange) onChange(val);
+		setFieldTouched(field.name, true);
+		setFieldValue(field.name, val);
+		setFormDirty(true);
+	};
+	const value = fieldState.value;
+	const options = field.options ? {
+		onOption: String(field.options.onOption ?? true),
+		offOption: String(field.options.offOption ?? false)
+	} : void 0;
+	const displayLabel = (option) => option.charAt(0).toUpperCase() + option.slice(1).toLowerCase();
+	return /* @__PURE__ */ jsx(FieldWrapper, {
+		optional: true,
+		label,
+		tooltipComponent: /* @__PURE__ */ jsx("div", { children: tooltipComponent }),
+		description: field.description,
+		labelPosition,
+		spaceCompact,
+		children: ({ id, describedBy }) => options ? /* @__PURE__ */ jsx(SwitchToggle, {
+			id,
+			"aria-describedby": describedBy,
+			onChange: (on) => handleChange(on ? options.onOption : options.offOption),
+			value: value === true || value === options.onOption,
+			yesLabel: displayLabel(options.onOption),
+			noLabel: displayLabel(options.offOption),
+			disabled,
+			invalid: missing
+		}) : /* @__PURE__ */ jsx(SwitchToggle, {
+			id,
+			"aria-describedby": describedBy,
+			datatip: field.disabled_message,
+			onChange: handleChange,
+			value: value === true || value === "true",
+			disabled,
+			invalid: missing
+		})
 	});
 }
 //#endregion
-//#region src/form/Wizard/utils.ts
-function isWizardMeta(value) {
-	return typeof value === "object" && value !== null && "wizard" in value;
+//#region src/form/Fields/CheckboxGroupField.tsx
+function impliedFrom(values, implies = {}) {
+	const result = /* @__PURE__ */ new Set();
+	for (const value of values) for (const target of implies[value] ?? []) result.add(target);
+	return result;
 }
-function isStepField(field) {
-	return typeof field === "object" && field !== null && "type" in field && field.type === "step";
+function union(manual, forced) {
+	return [...manual, ...[...forced].filter((v) => !manual.includes(v))];
 }
-function parseWizardConfig(options) {
-	const meta = options["$meta"];
-	const wizardConfig = isWizardMeta(meta) ? meta.wizard : void 0;
-	if (!wizardConfig || wizardConfig.mode !== "wizard") return null;
-	const steps = {};
-	const stepOrder = [];
-	const otherFields = {};
-	Object.entries(options).forEach(([key, field]) => {
-		if (key === "$meta") return;
-		if (isStepField(field)) {
-			steps[key] = field;
-			stepOrder.push(key);
-		} else otherFields[key] = field;
+function CheckboxGroupField({ field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty }) {
+	const [fieldState] = useField(field.name);
+	const { setFieldValue, setFieldTouched } = useFormikContext();
+	const implies = field.implies;
+	const [manual, setManual] = useState(() => {
+		const saved = fieldState.value || [];
+		const impliedBySaved = impliedFrom(saved, implies);
+		return saved.filter((v) => !impliedBySaved.has(v));
 	});
-	if (stepOrder.length === 0) {
-		console.warn("Wizard mode enabled but no steps found");
-		return null;
-	}
-	return {
-		config: wizardConfig,
-		steps,
-		stepOrder,
-		otherFields
+	const forced = impliedFrom(manual, implies);
+	const handleToggle = (value) => {
+		if (disabled) return;
+		const nextManual = manual.includes(value) ? manual.filter((v) => v !== value) : [...manual, value];
+		const next = union(nextManual, impliedFrom(nextManual, implies));
+		setManual(nextManual);
+		setFieldTouched(field.name, true);
+		setFieldValue(field.name, next);
+		if (onChange) onChange(next);
+		setFormDirty(true);
 	};
-}
-//#endregion
-//#region src/form/SpecialTypes/FormikCustomDropdown.tsx
-function toComparableOptions(options) {
-	return options?.map((option) => {
-		if (typeof option === "string") return option;
-		if (isCategory(option)) return {
-			category: option.category,
-			options: option.options.map((o) => {
-				const base = {
-					label: o.label,
-					value: o.value,
-					disabled: o.disabled
-				};
-				return o.description !== void 0 ? {
-					...base,
-					description: o.description
-				} : base;
+	return /* @__PURE__ */ jsx(FieldWrapper, {
+		optional: field.optional,
+		label,
+		tooltipComponent,
+		labelPosition,
+		spaceCompact,
+		children: ({ labelId, describedBy }) => /* @__PURE__ */ jsx("fieldset", {
+			"aria-labelledby": labelId,
+			"aria-describedby": describedBy,
+			className: "flex min-w-0 max-w-lg flex-col gap-1",
+			children: field.options?.map((option) => {
+				const locked = forced.has(option.value);
+				const optionDisabled = disabled || locked;
+				return /* @__PURE__ */ jsxs("label", {
+					className: cx("-mx-2 flex items-start gap-2.5 rounded-md px-2 py-1.5 transition-colors", optionDisabled ? "cursor-not-allowed opacity-60" : "cursor-pointer hover:bg-(--theme-hover) has-[:focus-visible]:bg-(--theme-hover)"),
+					children: [/* @__PURE__ */ jsx("input", {
+						type: "checkbox",
+						checked: manual.includes(option.value) || locked,
+						disabled: optionDisabled,
+						onChange: () => handleToggle(option.value),
+						className: cx("mt-px h-4 w-4 rounded accent-(--theme-link)", optionDisabled ? "cursor-not-allowed" : "cursor-pointer", missing && "invalid")
+					}), /* @__PURE__ */ jsxs("div", {
+						className: "flex min-w-0 flex-col",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "font-medium leading-tight theme-text",
+							children: option.label
+						}), option.description && /* @__PURE__ */ jsx("span", {
+							className: "mt-0.5 text-xs leading-snug theme-muted-text",
+							children: option.description
+						})]
+					})]
+				}, field.name + option.value);
 			})
-		};
-		const base = {
-			label: option.label,
-			value: option.value,
-			disabled: option.disabled
-		};
-		return option.description !== void 0 ? {
-			...base,
-			description: option.description
-		} : base;
+		})
 	});
 }
-function arePropsEqual(prev, next) {
-	for (const key of Object.keys(next)) if (key === "options") {
-		if (!deepEqual(toComparableOptions(prev.options), toComparableOptions(next.options))) return false;
-	} else if (prev[key] !== next[key]) return false;
-	return true;
-}
-var FormikCustomDropdown_default = memo(function FormikCustomDropdown({ name, ariaLabel, options, setFormDirty, onChange, parentValue, className, secondaryField, disabled = false, loading = false, invalid = false, autoselect, value, allowCustomValue = false, customValueLabel, placeholder, currentValue, setFieldValue, setFieldTouched }) {
-	const required = useFieldRequired();
-	const controlProps = useFieldControlProps();
-	const prevParentRef = useRef(parentValue);
-	const handleChange = (val) => {
-		if (secondaryField && typeof options[0] !== "string") {
-			const option = findSecondaryOption(options, val);
-			if (option) applySecondaryField(secondaryField, option.secondaryValue, setFieldValue);
-		}
-		if (onChange) onChange(val);
-		setFieldValue(name, val);
-		setFieldTouched(name, true);
-		setFormDirty(true);
-	};
-	useEffect(() => {
-		prevParentRef.current = parentValue;
-	});
-	const prevOptions = useRef(null);
-	useEffect(() => {
-		if (deepEqual(prevOptions.current, toComparableOptions(options))) return;
-		if (prevOptions.current === null && currentValue !== void 0 && currentValue !== null) {
-			prevOptions.current = toComparableOptions(options);
-			return;
-		}
-		prevOptions.current = toComparableOptions(options);
-		if (autoselect === false || !options?.length) return;
-		if (autoselect === void 0) {
-			if (options.length && isCategory(options[0])) {
-				let optionCount = 0;
-				for (const category of options) {
-					if (isCategory(category)) optionCount += category.options.length;
-					if (optionCount > 1) return;
-				}
-			} else if (options.length !== 1) return;
-		}
-		if (!options?.find((option) => {
-			if (typeof option === "string") return option === currentValue;
-			else if (isCategory(option)) return option.options.some((subOption) => {
-				return subOption.value === currentValue;
-			});
-			return option.value === currentValue;
-		}) || autoselect) {
-			let val;
-			for (const option of options) if (typeof option === "string") {
-				val = option;
-				break;
-			} else if (isCategory(option)) {
-				const enabled = option.options.find((o) => !o.disabled);
-				if (enabled) {
-					val = enabled.value;
-					break;
-				}
-			} else if (!option.disabled) {
-				val = option.value;
-				break;
-			}
-			if (val !== void 0) handleChange(val);
-		}
-	}, [
-		parentValue,
-		options,
-		autoselect
-	]);
-	return /* @__PURE__ */ jsx(Dropdown, {
-		...controlProps,
-		textBoxClassName: cx(className, invalid && "invalid"),
-		ariaLabel,
-		required,
-		onChange: (val) => handleChange(val),
-		value: options?.length === 0 && !allowCustomValue ? value : currentValue,
-		options,
-		placeholder,
-		disabled,
-		loading,
-		allowCustomValue,
-		customValueLabel
-	});
-}, arePropsEqual);
 //#endregion
-//#region src/form/SpecialTypes/FormikCustomInput.tsx
-var DEBOUNCE_MS$2 = 500;
-function FormikCustomInput({ name, type, step, placeholder, onChange, disabled, min, max, sanitize, invalid = false, lowercase = false, minLength, maxLength, defaultValue = "", value }) {
-	const [field] = useField(name);
-	const required = useFieldRequired();
-	const controlProps = useFieldControlProps();
+//#region src/form/Fields/ColorField.tsx
+function ColorField(props) {
+	const { field, label, labelPosition, onChange, tooltipComponent, spaceCompact } = props;
+	const [fieldState] = useField(field.name);
 	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const [showPassword, setShowPassword] = useState(false);
-	const isPassword = type === "password";
-	const [localValue, setLocalValue] = useState(value ?? field.value);
-	const isFocused = useRef(false);
-	const debounceRef = useRef(null);
-	useEffect(() => {
-		if (!isFocused.current) setLocalValue(value ?? field.value);
-	}, [field.value, value]);
-	const sanitizeName = useCallback((val) => {
-		if (sanitize === void 0) return lowercase ? val.toLowerCase() : val;
-		try {
-			const regexp = new RegExp(sanitize);
-			if (lowercase) val = val.toLowerCase();
-			return val.replace(regexp, "");
-		} catch {
-			console.error("Invalid regex for sanitization:", sanitize);
-		}
-		return val;
-	}, [sanitize, lowercase]);
-	const flushToFormik = useCallback((val) => {
-		if (onChange) onChange(val);
-		setFieldTouched(name, true);
-		setFieldValue(name, val);
-	}, [
-		name,
-		onChange,
-		setFieldTouched,
-		setFieldValue
-	]);
 	const handleChange = (e) => {
-		const text = sanitize ? sanitizeName(e.target.value) : e.target.value;
-		let val = text;
-		if (type === "number") {
-			const parsed = parseFloat(text);
-			val = isNaN(parsed) ? void 0 : parsed;
-		}
-		if (type === "password" && val === "") val = defaultValue;
-		setLocalValue(val);
-		clearTimeout(debounceRef.current ?? void 0);
-		debounceRef.current = setTimeout(() => flushToFormik(val), DEBOUNCE_MS$2);
-	};
-	const handleFocus = () => {
-		isFocused.current = true;
-	};
-	const handleBlur = () => {
-		isFocused.current = false;
-		clearTimeout(debounceRef.current ?? void 0);
-		const current = localValue;
-		if (current === void 0 || current === null) return;
-		const text = current.toString();
-		let val = text;
-		if (type === "number") {
-			const parsed = parseFloat(text);
-			if (Number.isNaN(parsed)) val = void 0;
-			else if (min !== void 0 && parsed < min) val = min;
-			else if (max !== void 0 && parsed > max) val = max;
-			else val = parsed;
-		}
-		setLocalValue(val);
-		flushToFormik(val);
-	};
-	const displayValue = isPassword && localValue === defaultValue ? "" : localValue ?? "";
-	const resolvedType = isPassword ? showPassword ? "text" : "password" : type === "string" ? "text" : type;
-	const input = /* @__PURE__ */ jsx("input", {
-		...controlProps,
-		"data-1p-ignore": true,
-		className: cx("w-full", disabled && "disabled", invalid && "invalid", isPassword && "pr-8"),
-		name,
-		value: displayValue,
-		type: resolvedType,
-		"aria-required": required || void 0,
-		disabled,
-		placeholder,
-		minLength,
-		maxLength,
-		onChange: handleChange,
-		onFocus: handleFocus,
-		onBlur: handleBlur,
-		min,
-		max,
-		step
-	});
-	if (!isPassword) return input;
-	return /* @__PURE__ */ jsxs("div", {
-		className: "relative w-full",
-		children: [input, /* @__PURE__ */ jsx("button", {
-			type: "button",
-			className: "absolute right-2 top-1/2 -translate-y-1/2 theme-muted-text",
-			onClick: () => setShowPassword((prev) => !prev),
-			disabled,
-			tabIndex: -1,
-			"aria-label": showPassword ? "Hide value" : "Show value",
-			children: showPassword ? /* @__PURE__ */ jsx(EyeOffIcon, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(EyeIcon, { className: "h-4 w-4" })
-		})]
-	});
-}
-//#endregion
-//#region src/form/SpecialTypes/FormikNumericInput.tsx
-var DEBOUNCE_MS$1 = 500;
-function FormikNumericInput({ name, placeholder, onChange, disabled, min, max, invalid = false }) {
-	const [field] = useField(name);
-	const required = useFieldRequired();
-	const controlProps = useFieldControlProps();
-	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const [localValue, setLocalValue] = useState(field.value);
-	const isFocused = useRef(false);
-	const debounceRef = useRef(null);
-	useEffect(() => {
-		if (!isFocused.current) setLocalValue(field.value);
-	}, [field.value]);
-	const flush = (val) => {
-		onChange?.(val);
-		setFieldTouched(name, true);
-		setFieldValue(name, val);
-	};
-	const handleBlur = () => {
-		isFocused.current = false;
-		clearTimeout(debounceRef.current ?? void 0);
-		let val = localValue;
-		if (val !== void 0) {
-			if (min !== void 0 && val < min) val = min;
-			if (max !== void 0 && val > max) val = max;
-		}
-		setLocalValue(val);
-		flush(val);
+		const val = e.target.value;
+		if (onChange) onChange(val);
+		setFieldTouched(field.name, true);
+		setFieldValue(field.name, val);
 	};
-	return /* @__PURE__ */ jsx(NumericFormat, {
-		...controlProps,
-		"data-1p-ignore": true,
-		className: cx("w-full", disabled && "disabled", invalid && "invalid"),
-		name,
-		...localValue === void 0 ? {} : { value: localValue },
-		"aria-required": required || void 0,
-		thousandSeparator: ",",
-		decimalScale: 20,
-		allowNegative: true,
-		disabled,
-		placeholder,
-		onValueChange: (v) => {
-			setLocalValue(v.floatValue);
-			clearTimeout(debounceRef.current ?? void 0);
-			debounceRef.current = setTimeout(() => flush(v.floatValue), DEBOUNCE_MS$1);
-		},
-		onFocus: () => {
-			isFocused.current = true;
-		},
-		onBlur: handleBlur
-	});
-}
-//#endregion
-//#region src/form/utils/getPlaceholder.ts
-/** `placeholder=""` (empty string) intentionally overrides the default; undefined does not. */
-function getPlaceholder(placeholder, defaultValue) {
-	if (placeholder !== void 0) return placeholder;
-	if (defaultValue && (typeof defaultValue === "string" || typeof defaultValue === "number")) return defaultValue.toString();
-	return "";
-}
-//#endregion
-//#region src/form/Fields/StringField.tsx
-var StringField_default = memo(function StringField(props) {
-	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, currentValue } = props;
-	const value = field.prefillDefault ? currentValue : void 0;
 	return /* @__PURE__ */ jsx(FieldWrapper, {
 		optional: field.optional,
 		label,
 		tooltipComponent,
-		description: field.description,
 		labelPosition,
 		spaceCompact,
-		children: /* @__PURE__ */ jsx(FormikCustomInput, {
-			invalid: missing,
-			name: field.name,
-			type: field.type,
-			lowercase: field.lowercase,
-			placeholder: field.type === "password" && field.placeholder === void 0 ? "•".repeat((field.default ?? "").toString().length > 0 ? 16 : 0) : getPlaceholder(field.placeholder, field.default),
-			disabled,
-			step: field.step,
-			min: field.min,
-			max: field.max,
-			minLength: field.minLength,
-			maxLength: field.maxLength,
-			sanitize: field.sanitize,
-			defaultValue: field.default,
-			value,
-			...onChange && { onChange }
-		}, field.name)
-	});
-});
-//#endregion
-//#region src/form/Fields/NumberField.tsx
-function NumberField(props) {
-	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact } = props;
-	const [fieldState] = useField(field.name);
-	const { setFieldValue } = useFormikContext();
-	useEffect(() => {
-		if (field.prefillDefault && field.default !== void 0 && (fieldState.value === void 0 || fieldState.value === null || fieldState.value === "")) setFieldValue(field.name, field.default);
-	}, [
-		field.prefillDefault,
-		field.default,
-		field.name,
-		fieldState.value,
-		setFieldValue
-	]);
-	return /* @__PURE__ */ jsx(FieldWrapper, {
-		optional: field.optional,
-		label,
-		tooltipComponent,
-		labelPosition,
-		spaceCompact,
-		children: field.thousandsSeparator ? /* @__PURE__ */ jsx(FormikNumericInput, {
-			invalid: missing,
-			name: field.name,
-			placeholder: getPlaceholder(field.placeholder, field.default),
-			disabled,
-			min: field.min,
-			max: field.max,
-			...onChange && { onChange }
-		}, field.name) : /* @__PURE__ */ jsx(FormikCustomInput, {
-			invalid: missing,
-			name: field.name,
-			type: "number",
-			placeholder: getPlaceholder(field.placeholder, field.default),
-			disabled,
-			step: field.step,
-			min: field.min,
-			max: field.max,
-			defaultValue: field.default,
-			...onChange && { onChange }
-		}, field.name)
-	});
-}
-//#endregion
-//#region src/form/Fields/BooleanField.tsx
-function BooleanField(props) {
-	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty } = props;
-	const [fieldState] = useField(field.name);
-	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const handleChange = (val) => {
-		if (disabled) return;
-		if (onChange) onChange(val);
-		setFieldTouched(field.name, true);
-		setFieldValue(field.name, val);
-		setFormDirty(true);
-	};
-	const value = fieldState.value;
-	const options = field.options ? {
-		onOption: String(field.options.onOption ?? true),
-		offOption: String(field.options.offOption ?? false)
-	} : void 0;
-	const displayLabel = (option) => option.charAt(0).toUpperCase() + option.slice(1).toLowerCase();
-	return /* @__PURE__ */ jsx(FieldWrapper, {
-		optional: true,
-		label,
-		tooltipComponent: /* @__PURE__ */ jsx("div", { children: tooltipComponent }),
-		description: field.description,
-		labelPosition,
-		spaceCompact,
-		children: ({ id, describedBy }) => options ? /* @__PURE__ */ jsx(SwitchToggle, {
-			id,
-			"aria-describedby": describedBy,
-			onChange: (on) => handleChange(on ? options.onOption : options.offOption),
-			value: value === true || value === options.onOption,
-			yesLabel: displayLabel(options.onOption),
-			noLabel: displayLabel(options.offOption),
-			disabled,
-			invalid: missing
-		}) : /* @__PURE__ */ jsx(SwitchToggle, {
+		children: ({ id }) => /* @__PURE__ */ jsx(Field, {
+			className: "theme-input h-8 w-18 rounded border border-neutral-400 placeholder:text-xs",
 			id,
-			"aria-describedby": describedBy,
-			datatip: field.disabled_message,
-			onChange: handleChange,
-			value: value === true || value === "true",
-			disabled,
-			invalid: missing
+			name: field.name,
+			value: fieldState.value || "#fbbf24",
+			type: "color",
+			"aria-required": field.optional ? void 0 : true,
+			onChange: handleChange
 		})
 	});
 }
@@ -1078,88 +547,10 @@ function DropdownField(props) {
 	});
 }
 //#endregion
-//#region src/form/Fields/TextAreaField.tsx
-function TextAreaField(props) {
-	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact } = props;
-	return /* @__PURE__ */ jsx(FieldWrapper, {
-		optional: field.optional,
-		label,
-		tooltipComponent,
-		description: field.description,
-		labelPosition,
-		spaceCompact,
-		children: ({ id, describedBy }) => /* @__PURE__ */ jsx(Field, {
-			className: cx("theme-input h-[82px] w-full rounded leading-4 overflow-y-scroll", disabled && "disabled", missing && "border-red-600 focus:border-red-600 focus:ring-red-500"),
-			as: "textarea",
-			id,
-			"aria-describedby": describedBy,
-			"aria-required": field.optional ? void 0 : true,
-			name: field.name,
-			type: "search",
-			placeholder: getPlaceholder(field.placeholder, field.default),
-			disabled,
-			...onChange && { onChange }
-		}, field.name)
-	});
-}
-//#endregion
-//#region src/form/Fields/RangeField.tsx
-function RangeField(props) {
-	const { field, label, labelPosition, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty } = props;
-	const [fieldState] = useField(field.name);
-	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const handleChange = (e) => {
-		let val = e.target.valueAsNumber;
-		if (!isNaN(val)) {
-			val = Math.max(field.min, Math.min(field.max, val));
-			setFieldValue(field.name, val);
-			if (onChange) onChange(val);
-			setFieldTouched(field.name, true);
-			setFormDirty(true);
-		}
-	};
-	const seedValue = field.default ?? field.min;
-	if ((fieldState.value === void 0 || fieldState.value === null) && seedValue !== void 0) setFieldValue(field.name, seedValue);
-	const currentValue = fieldState.value !== void 0 ? fieldState.value : seedValue;
-	return /* @__PURE__ */ jsx(FieldWrapper, {
-		optional: field.optional,
-		label,
-		tooltipComponent,
-		labelPosition,
-		spaceCompact,
-		children: ({ id, labelId }) => /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center",
-			children: [/* @__PURE__ */ jsx(Field, {
-				className: cx("theme-input h-7 w-1/3 mr-5 text-center rounded border", disabled && "disabled"),
-				id,
-				type: "number",
-				value: currentValue,
-				min: field.min,
-				max: field.max,
-				step: field.step || 1,
-				disabled,
-				onChange: handleChange
-			}), /* @__PURE__ */ jsx(Field, {
-				className: cx("rounded w-full", disabled && "disabled"),
-				name: field.name,
-				value: currentValue,
-				type: "range",
-				"aria-labelledby": labelId,
-				"aria-required": field.optional ? void 0 : true,
-				min: field.min,
-				max: field.max,
-				step: field.step || 1,
-				disabled,
-				onChange: handleChange
-			})]
-		})
-	});
-}
-//#endregion
-//#region src/form/utils/slurmDuration.ts
+//#region src/form/utils/duration.ts
 var WITH_DAYS = /^(\d+)-(\d{1,2})(?::(\d{1,2})(?::(\d{1,2}))?)?$/;
 var WITHOUT_DAYS = /^(\d+):(\d{1,2}):(\d{1,2})$/;
-function parseSlurmDuration(text) {
+function parseDuration(text) {
 	const trimmed = text.trim();
 	let days = 0;
 	let hours;
@@ -1182,7 +573,7 @@ function parseSlurmDuration(text) {
 	if (minutes > 59 || seconds > 59) return null;
 	return days * 86400 + hours * 3600 + minutes * 60 + seconds;
 }
-function formatSecondsAsSlurmDuration(totalSeconds) {
+function formatDuration(totalSeconds) {
 	if (!Number.isFinite(totalSeconds) || totalSeconds < 0) return "";
 	const parts = Duration.fromObject({ seconds: Math.floor(totalSeconds) }).shiftTo("days", "hours", "minutes", "seconds");
 	const pad = (n) => String(n).padStart(2, "0");
@@ -1223,22 +614,12 @@ function collectPartitionDurationIssues(partitions, invalidDurationPaths) {
 	return [...issues];
 }
 //#endregion
-//#region src/form/Fields/durationValidity.ts
-var invalidPaths = /* @__PURE__ */ new Set();
-function setDurationValidity(path, valid) {
-	if (valid) invalidPaths.delete(path);
-	else invalidPaths.add(path);
-}
-function getInvalidDurationPaths() {
-	return [...invalidPaths];
-}
-//#endregion
 //#region src/form/Fields/DurationField.tsx
 var DEBOUNCE_MS = 500;
 var isNumericString = (value) => typeof value === "string" && /^\d+$/.test(value.trim());
 var toDisplay = (value) => {
-	if (typeof value === "number") return formatSecondsAsSlurmDuration(value);
-	if (isNumericString(value)) return formatSecondsAsSlurmDuration(Number(value));
+	if (typeof value === "number") return formatDuration(value);
+	if (isNumericString(value)) return formatDuration(Number(value));
 	return "";
 };
 var DurationField_default = memo(function DurationField({ field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty, currentValue, setFieldValue, setFieldTouched }) {
@@ -1262,11 +643,11 @@ var DurationField_default = memo(function DurationField({ field, label, labelPos
 		if (!focusedRef.current) setText(toDisplay(currentValue));
 	}, [currentValue]);
 	const trimmed = text.trim();
-	const parsed = trimmed === "" ? null : parseSlurmDuration(trimmed);
+	const parsed = trimmed === "" ? null : parseDuration(trimmed);
 	let error = null;
 	if (!isSentinel && trimmed !== "") {
 		if (parsed === null) error = t.invalidDuration;
-		else if (parsed < min || parsed > max) error = Number.isFinite(max) ? t.durationOutOfRange(formatSecondsAsSlurmDuration(Math.max(min, 0)), formatSecondsAsSlurmDuration(max)) : t.durationBelowMin(formatSecondsAsSlurmDuration(Math.max(min, 0)));
+		else if (parsed < min || parsed > max) error = Number.isFinite(max) ? t.durationOutOfRange(formatDuration(Math.max(min, 0)), formatDuration(max)) : t.durationBelowMin(formatDuration(Math.max(min, 0)));
 	}
 	useEffect(() => {
 		setDurationValidity(name, error === null);
@@ -1294,7 +675,7 @@ var DurationField_default = memo(function DurationField({ field, label, labelPos
 		setFormDirty(true);
 		clearTimeout(debounceRef.current ?? void 0);
 		const rawTrimmed = raw.trim();
-		const value = rawTrimmed === "" ? "" : parseSlurmDuration(rawTrimmed);
+		const value = rawTrimmed === "" ? "" : parseDuration(rawTrimmed);
 		if (value === "" || typeof value === "number" && value >= min && value <= max) debounceRef.current = setTimeout(() => flushToFormik(value), DEBOUNCE_MS);
 	};
 	const handleFocus = () => {
@@ -1307,7 +688,7 @@ var DurationField_default = memo(function DurationField({ field, label, labelPos
 			setText("");
 			flushToFormik("");
 		} else if (parsed !== null && parsed >= min && parsed <= max) {
-			setText(formatSecondsAsSlurmDuration(parsed));
+			setText(formatDuration(parsed));
 			flushToFormik(parsed);
 		}
 	};
@@ -1318,7 +699,7 @@ var DurationField_default = memo(function DurationField({ field, label, labelPos
 		labelPosition,
 		spaceCompact: spaceCompact ?? false,
 		...field.description !== void 0 && { description: field.description },
-		children: ({ id, describedBy }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+		children: ({ id, describedBy }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
 			!isSentinel && /* @__PURE__ */ jsx("input", {
 				"data-1p-ignore": true,
 				className: cx("w-full", disabled && "disabled", (missing || error !== null) && "invalid"),
@@ -1355,49 +736,6 @@ var DurationField_default = memo(function DurationField({ field, label, labelPos
 	});
 });
 //#endregion
-//#region src/form/Fields/RadioField.tsx
-function RadioField(props) {
-	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty } = props;
-	const uid = useId();
-	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const handleChange = (val) => {
-		if (disabled) return;
-		if (onChange) onChange(val);
-		setFieldTouched(field.name, true);
-		setFieldValue(field.name, val);
-		setFormDirty(true);
-	};
-	return /* @__PURE__ */ jsx(FieldWrapper, {
-		optional: field.optional,
-		label,
-		tooltipComponent,
-		labelPosition,
-		spaceCompact,
-		children: ({ labelId, describedBy }) => /* @__PURE__ */ jsx("div", {
-			role: "radiogroup",
-			"aria-labelledby": labelId,
-			"aria-describedby": describedBy,
-			"aria-required": field.optional ? void 0 : true,
-			className: cx("flex", field.optionLabelPosition === "top" ? "flex-col" : "flex-row"),
-			children: field.options?.map((option) => /* @__PURE__ */ jsxs("label", {
-				htmlFor: `${uid}-${option}`,
-				className: "capitalize",
-				children: [/* @__PURE__ */ jsx(Field, {
-					id: `${uid}-${option}`,
-					className: cx("theme-input mr-1", disabled && "disabled", missing && "invalid"),
-					name: field.name,
-					type: "radio",
-					value: option,
-					disabled,
-					onChange: (e) => {
-						handleChange(e.target.value);
-					}
-				}), option]
-			}, field.name + option))
-		})
-	});
-}
-//#endregion
 //#region src/form/Fields/LabelField.tsx
 function LabelField(props) {
 	const { field, label } = props;
@@ -1414,35 +752,6 @@ function LabelField(props) {
 	});
 }
 //#endregion
-//#region src/form/Fields/ColorField.tsx
-function ColorField(props) {
-	const { field, label, labelPosition, onChange, tooltipComponent, spaceCompact } = props;
-	const [fieldState] = useField(field.name);
-	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const handleChange = (e) => {
-		const val = e.target.value;
-		if (onChange) onChange(val);
-		setFieldTouched(field.name, true);
-		setFieldValue(field.name, val);
-	};
-	return /* @__PURE__ */ jsx(FieldWrapper, {
-		optional: field.optional,
-		label,
-		tooltipComponent,
-		labelPosition,
-		spaceCompact,
-		children: ({ id }) => /* @__PURE__ */ jsx(Field, {
-			className: "theme-input h-8 w-18 rounded border border-neutral-400 placeholder:text-xs",
-			id,
-			name: field.name,
-			value: fieldState.value || "#fbbf24",
-			type: "color",
-			"aria-required": field.optional ? void 0 : true,
-			onChange: handleChange
-		})
-	});
-}
-//#endregion
 //#region src/form/Fields/MultiDropdownField.tsx
 function MultiDropdownField({ field, label, tooltipComponent, labelPosition, spaceCompact, disabled, missing, setFormDirty, onChange }) {
 	let parentValue = field.parentValue;
@@ -1478,33 +787,64 @@ function MultiDropdownField({ field, label, tooltipComponent, labelPosition, spa
 	});
 }
 //#endregion
-//#region src/form/Fields/CheckboxGroupField.tsx
-function impliedFrom(values, implies = {}) {
-	const result = /* @__PURE__ */ new Set();
-	for (const value of values) for (const target of implies[value] ?? []) result.add(target);
-	return result;
-}
-function union(manual, forced) {
-	return [...manual, ...[...forced].filter((v) => !manual.includes(v))];
+//#region src/form/Fields/ObjectField.tsx
+function ObjectField({ field, label, tooltipComponent, missingFields, setFormDirty, workflowForm, labelPosition, spaceCompact }) {
+	const [open, setOpen] = useState(field.collapsed !== void 0 ? !field.collapsed : true);
+	const { values, setFieldValue, setFieldTouched } = useFormikContext();
+	const meta = resolveMetaOverrides(field.options, labelPosition, spaceCompact ?? false);
+	const HeaderElement = field.noCollapse ? React.Fragment : ControlledCollapsiblePanel;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col w-full",
+		children: [field.noCollapse && /* @__PURE__ */ jsx("div", {
+			className: "flex items-center w-full mb-[15px]",
+			children: /* @__PURE__ */ jsxs("h3", {
+				className: "flex items-center gap-1 text-md font-bold",
+				children: [
+					label,
+					" ",
+					tooltipComponent
+				]
+			})
+		}), /* @__PURE__ */ jsx(HeaderElement, {
+			open,
+			setOpen,
+			title: /* @__PURE__ */ jsx(GroupHeader, {
+				open,
+				setOpen,
+				title: field.label || label
+			}),
+			children: /* @__PURE__ */ jsx("div", {
+				className: "w-full",
+				children: /* @__PURE__ */ jsx(FieldsFromOptions, {
+					options: field.options,
+					values,
+					setFormDirty,
+					setFieldValue,
+					setFieldTouched,
+					missingFields,
+					workflowForm,
+					labelPosition: meta.labelPosition,
+					spaceCompact: meta.spaceCompact,
+					parentInfo: {
+						parentName: field.name,
+						fieldNamePrefix: `${field.name}.`
+					}
+				})
+			})
+		})]
+	});
 }
-function CheckboxGroupField({ field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty }) {
-	const [fieldState] = useField(field.name);
+//#endregion
+//#region src/form/Fields/RadioField.tsx
+function RadioField(props) {
+	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty } = props;
+	const uid = useId();
 	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const implies = field.implies;
-	const [manual, setManual] = useState(() => {
-		const saved = fieldState.value || [];
-		const impliedBySaved = impliedFrom(saved, implies);
-		return saved.filter((v) => !impliedBySaved.has(v));
-	});
-	const forced = impliedFrom(manual, implies);
-	const handleToggle = (value) => {
+	const handleChange = (val) => {
 		if (disabled) return;
-		const nextManual = manual.includes(value) ? manual.filter((v) => v !== value) : [...manual, value];
-		const next = union(nextManual, impliedFrom(nextManual, implies));
-		setManual(nextManual);
+		if (onChange) onChange(val);
 		setFieldTouched(field.name, true);
-		setFieldValue(field.name, next);
-		if (onChange) onChange(next);
+		setFieldValue(field.name, val);
 		setFormDirty(true);
 	};
 	return /* @__PURE__ */ jsx(FieldWrapper, {
@@ -1513,156 +853,797 @@ function CheckboxGroupField({ field, label, labelPosition, missing, disabled, on
 		tooltipComponent,
 		labelPosition,
 		spaceCompact,
-		children: ({ labelId, describedBy }) => /* @__PURE__ */ jsx("fieldset", {
+		children: ({ labelId, describedBy }) => /* @__PURE__ */ jsx("div", {
+			role: "radiogroup",
 			"aria-labelledby": labelId,
 			"aria-describedby": describedBy,
-			className: "flex min-w-0 max-w-lg flex-col gap-1",
-			children: field.options?.map((option) => {
-				const locked = forced.has(option.value);
-				const optionDisabled = disabled || locked;
-				return /* @__PURE__ */ jsxs("label", {
-					className: cx("-mx-2 flex items-start gap-2.5 rounded-md px-2 py-1.5 transition-colors", optionDisabled ? "cursor-not-allowed opacity-60" : "cursor-pointer hover:bg-(--theme-hover) has-[:focus-visible]:bg-(--theme-hover)"),
-					children: [/* @__PURE__ */ jsx("input", {
-						type: "checkbox",
-						checked: manual.includes(option.value) || locked,
-						disabled: optionDisabled,
-						onChange: () => handleToggle(option.value),
-						className: cx("mt-px h-4 w-4 rounded accent-(--theme-link)", optionDisabled ? "cursor-not-allowed" : "cursor-pointer", missing && "invalid")
-					}), /* @__PURE__ */ jsxs("div", {
-						className: "flex min-w-0 flex-col",
-						children: [/* @__PURE__ */ jsx("span", {
-							className: "font-medium leading-tight theme-text",
-							children: option.label
-						}), option.description && /* @__PURE__ */ jsx("span", {
-							className: "mt-0.5 text-xs leading-snug theme-muted-text",
-							children: option.description
-						})]
-					})]
-				}, field.name + option.value);
-			})
+			"aria-required": field.optional ? void 0 : true,
+			className: cx("flex", field.optionLabelPosition === "top" ? "flex-col" : "flex-row"),
+			children: field.options?.map((option) => /* @__PURE__ */ jsxs("label", {
+				htmlFor: `${uid}-${option}`,
+				className: "capitalize",
+				children: [/* @__PURE__ */ jsx(Field, {
+					id: `${uid}-${option}`,
+					className: cx("theme-input mr-1", disabled && "disabled", missing && "invalid"),
+					name: field.name,
+					type: "radio",
+					value: option,
+					disabled,
+					onChange: (e) => {
+						handleChange(e.target.value);
+					}
+				}), option]
+			}, field.name + option))
+		})
+	});
+}
+//#endregion
+//#region src/form/Fields/RangeField.tsx
+function RangeField(props) {
+	const { field, label, labelPosition, disabled, onChange, tooltipComponent, spaceCompact, setFormDirty } = props;
+	const [fieldState] = useField(field.name);
+	const { setFieldValue, setFieldTouched } = useFormikContext();
+	const handleChange = (e) => {
+		let val = e.target.valueAsNumber;
+		if (!isNaN(val)) {
+			val = Math.max(field.min, Math.min(field.max, val));
+			setFieldValue(field.name, val);
+			if (onChange) onChange(val);
+			setFieldTouched(field.name, true);
+			setFormDirty(true);
+		}
+	};
+	const seedValue = field.default ?? field.min;
+	if ((fieldState.value === void 0 || fieldState.value === null) && seedValue !== void 0) setFieldValue(field.name, seedValue);
+	const currentValue = fieldState.value !== void 0 ? fieldState.value : seedValue;
+	return /* @__PURE__ */ jsx(FieldWrapper, {
+		optional: field.optional,
+		label,
+		tooltipComponent,
+		labelPosition,
+		spaceCompact,
+		children: ({ id, labelId }) => /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center",
+			children: [/* @__PURE__ */ jsx(Field, {
+				className: cx("theme-input h-7 w-1/3 mr-5 text-center rounded border", disabled && "disabled"),
+				id,
+				type: "number",
+				value: currentValue,
+				min: field.min,
+				max: field.max,
+				step: field.step || 1,
+				disabled,
+				onChange: handleChange
+			}), /* @__PURE__ */ jsx(Field, {
+				className: cx("rounded w-full", disabled && "disabled"),
+				name: field.name,
+				value: currentValue,
+				type: "range",
+				"aria-labelledby": labelId,
+				"aria-required": field.optional ? void 0 : true,
+				min: field.min,
+				max: field.max,
+				step: field.step || 1,
+				disabled,
+				onChange: handleChange
+			})]
+		})
+	});
+}
+//#endregion
+//#region src/form/Fields/StepField.tsx
+function StepField(_props) {
+	return null;
+}
+//#endregion
+//#region src/form/Fields/StringField.tsx
+var StringField_default = memo(function StringField(props) {
+	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact, currentValue } = props;
+	const value = field.prefillDefault ? currentValue : void 0;
+	return /* @__PURE__ */ jsx(FieldWrapper, {
+		optional: field.optional,
+		label,
+		tooltipComponent,
+		description: field.description,
+		labelPosition,
+		spaceCompact,
+		children: /* @__PURE__ */ jsx(FormikCustomInput, {
+			invalid: missing,
+			name: field.name,
+			type: field.type,
+			lowercase: field.lowercase,
+			placeholder: field.type === "password" && field.placeholder === void 0 ? "•".repeat((field.default ?? "").toString().length > 0 ? 16 : 0) : getPlaceholder(field.placeholder, field.default),
+			disabled,
+			step: field.step,
+			min: field.min,
+			max: field.max,
+			minLength: field.minLength,
+			maxLength: field.maxLength,
+			sanitize: field.sanitize,
+			defaultValue: field.default,
+			value,
+			...onChange && { onChange }
+		}, field.name)
+	});
+});
+//#endregion
+//#region src/form/Fields/TextAreaField.tsx
+function TextAreaField(props) {
+	const { field, label, labelPosition, missing, disabled, onChange, tooltipComponent, spaceCompact } = props;
+	return /* @__PURE__ */ jsx(FieldWrapper, {
+		optional: field.optional,
+		label,
+		tooltipComponent,
+		description: field.description,
+		labelPosition,
+		spaceCompact,
+		children: ({ id, describedBy }) => /* @__PURE__ */ jsx(Field, {
+			className: cx("theme-input h-[82px] w-full rounded leading-4 overflow-y-scroll", disabled && "disabled", missing && "border-red-600 focus:border-red-600 focus:ring-red-500"),
+			as: "textarea",
+			id,
+			"aria-describedby": describedBy,
+			"aria-required": field.optional ? void 0 : true,
+			name: field.name,
+			type: "search",
+			placeholder: getPlaceholder(field.placeholder, field.default),
+			disabled,
+			...onChange && { onChange }
+		}, field.name)
+	});
+}
+//#endregion
+//#region src/form/fieldRegistry.tsx
+var CORE_FIELD_COMPONENTS = {
+	string: StringField_default,
+	password: StringField_default,
+	number: NumberField,
+	boolean: BooleanField,
+	dropdown: DropdownField,
+	textarea: TextAreaField,
+	range: RangeField,
+	duration: DurationField_default,
+	radio: RadioField,
+	label: LabelField,
+	color: ColorField,
+	"multi-dropdown": MultiDropdownField,
+	"checkbox-group": CheckboxGroupField,
+	object: ObjectField,
+	step: StepField
+};
+var FieldRegistryContext = createContext({});
+/** Returns null for field types no registry knows. Per-form `fields` win over
+* the provider's `slots.formFields`, which win over the core registry. */
+function Registry(props) {
+	const injected = useContext(FieldRegistryContext);
+	const { formFields } = useSlots();
+	const Component = injected[props.field.type] ?? formFields?.[props.field.type] ?? CORE_FIELD_COMPONENTS[props.field.type];
+	if (!Component) return null;
+	return /* @__PURE__ */ jsx(Suspense, {
+		fallback: null,
+		children: /* @__PURE__ */ jsx(Component, { ...props })
+	});
+}
+//#endregion
+//#region src/form/useParsedOpts.ts
+var EMPTY_VARS = {};
+var EMPTY_KEYS = [];
+/**
+* useMemo won't work here — Formik values changes on every keystroke, so this hook extracts which inputs.* keys the schema references and re-parses only when those change. Defaults `userVars`/`secretKeys` to empty — callers in React scope should pass them from `useUserVars()` so the parser leaves `${{ var.SECRET }}` literal during template eval (otherwise the recursive substitution turns `"https://${{ var.PAT }}@host/"` into `"https://@host/"`).
+*/
+function useParsedOpts(rawOptions, values, organizationVariables, userVars = EMPTY_VARS, secretKeys = EMPTY_KEYS, remoteVars = EMPTY_VARS) {
+	const engine = useWorkflowEngine();
+	const c = useRef({
+		rawOptions: null,
+		orgVars: void 0,
+		userVars: null,
+		secretKeys: null,
+		remoteVars: null,
+		converted: {},
+		inputDeps: /* @__PURE__ */ new Set(),
+		hasExpressions: false,
+		relevantSnapshot: {},
+		result: null
+	}).current;
+	if (rawOptions !== c.rawOptions) {
+		c.rawOptions = rawOptions;
+		c.converted = engine.convertInputs(rawOptions);
+		const { inputDeps, hasExpressions } = engine.inputDependencies(c.converted);
+		c.inputDeps = inputDeps;
+		c.hasExpressions = hasExpressions;
+		c.result = null;
+	}
+	if (organizationVariables !== c.orgVars || userVars !== c.userVars || secretKeys !== c.secretKeys || remoteVars !== c.remoteVars) {
+		c.orgVars = organizationVariables;
+		c.userVars = userVars;
+		c.secretKeys = secretKeys;
+		c.remoteVars = remoteVars;
+		c.result = null;
+	}
+	if (c.result !== null) {
+		if (c.inputDeps.size === 0) return c.result;
+		let inputsChanged = false;
+		for (const key of c.inputDeps) if (!deepEqual(values[key], c.relevantSnapshot[key])) {
+			inputsChanged = true;
+			break;
+		}
+		if (!inputsChanged) return c.result;
+	}
+	const parsed = engine.evaluate({
+		inputs: values,
+		obj: c.converted,
+		orgVars: organizationVariables,
+		userVars,
+		secretKeys,
+		remoteVars
+	});
+	c.result = parsed;
+	c.relevantSnapshot = {};
+	for (const key of c.inputDeps) c.relevantSnapshot[key] = values[key];
+	return parsed;
+}
+//#endregion
+//#region src/form/usePrevious.ts
+function usePrevious(value) {
+	const ref = useRef(void 0);
+	useEffect(() => {
+		ref.current = value;
+	});
+	return ref.current;
+}
+//#endregion
+//#region src/form/utils/getValueUsingPath.ts
+function getValueUsingPath(obj, path) {
+	if (typeof path !== "string" || !path) return;
+	const keys = path.split(".");
+	let current = obj;
+	for (const key of keys) {
+		if (!current || typeof current !== "object") return;
+		const container = current;
+		if (key.includes("[")) {
+			const [arrayKey = "", indexStr = ""] = key.split("[");
+			const index = parseInt(indexStr.slice(0, -1), 10);
+			const list = container[arrayKey];
+			if (!Array.isArray(list) || isNaN(index)) return;
+			current = list[index];
+		} else {
+			if (!(key in container)) return;
+			current = container[key];
+		}
+	}
+	return current;
+}
+//#endregion
+//#region src/form/utils/checkShowIfObject.ts
+function checkShowIfObject(showIfObject, formValues, index) {
+	const valueList = [];
+	for (let [key, value] of Object.entries(showIfObject)) {
+		if (index !== void 0) key = key.replace("[index]", `[${index}]`);
+		const dependsOnValue = getValueUsingPath(formValues, key);
+		if (typeof value === "boolean" || typeof value === "string" || typeof value === "number") valueList.push(dependsOnValue !== null && dependsOnValue !== void 0 && dependsOnValue.toString() === value.toString());
+		else if (Array.isArray(value)) valueList.push(value.includes(dependsOnValue));
+	}
+	return valueList;
+}
+//#endregion
+//#region src/form/utils/getParentValue.ts
+function getParentValue(index, targetField, values, dependentPath, field) {
+	let parentValue;
+	if (typeof targetField === "object" && targetField !== null && !Array.isArray(targetField)) parentValue = !checkShowIfObject(targetField, values, index).includes(false);
+	else if (field.depends_on) {
+		dependentPath = field.depends_on;
+		if (index !== void 0) dependentPath = field.depends_on.replace("[index]", `[${index}]`);
+		const dependsOnValue = getValueUsingPath(values, dependentPath);
+		const dependsOnText = dependsOnValue === null || dependsOnValue === void 0 ? void 0 : String(dependsOnValue);
+		if (Array.isArray(targetField)) parentValue = targetField.includes(dependsOnValue) || targetField.includes(dependsOnText);
+		else if (typeof targetField === "string") parentValue = dependsOnText !== void 0 && targetField.includes(dependsOnText);
+		else parentValue = targetField === dependsOnValue;
+	} else {
+		dependentPath = typeof targetField === "string" ? targetField : "";
+		if (index !== void 0 && typeof targetField === "string") dependentPath = targetField.replace("[index]", `[${index}]`);
+		parentValue = getValueUsingPath(values, dependentPath);
+	}
+	return parentValue;
+}
+//#endregion
+//#region src/form/Wizard/utils.ts
+function isWizardMeta(value) {
+	return typeof value === "object" && value !== null && "wizard" in value;
+}
+function isStepField(field) {
+	return typeof field === "object" && field !== null && "type" in field && field.type === "step";
+}
+function parseWizardConfig(options) {
+	const meta = options["$meta"];
+	const wizardConfig = isWizardMeta(meta) ? meta.wizard : void 0;
+	if (!wizardConfig || wizardConfig.mode !== "wizard") return null;
+	const steps = {};
+	const stepOrder = [];
+	const otherFields = {};
+	Object.entries(options).forEach(([key, field]) => {
+		if (key === "$meta") return;
+		if (isStepField(field)) {
+			steps[key] = field;
+			stepOrder.push(key);
+		} else otherFields[key] = field;
+	});
+	if (stepOrder.length === 0) {
+		console.warn("Wizard mode enabled but no steps found");
+		return null;
+	}
+	return {
+		config: wizardConfig,
+		steps,
+		stepOrder,
+		otherFields
+	};
+}
+//#endregion
+//#region src/form/Wizard/useWizardState.ts
+function useWizardState({ stepOrder, steps, validateStep, initialStep }) {
+	const firstStep = initialStep || stepOrder[0] || "";
+	const [currentStep, setCurrentStep] = useState(firstStep);
+	const [visitedSteps, setVisitedSteps] = useState(/* @__PURE__ */ new Set([firstStep]));
+	const [invalidSteps, setInvalidSteps] = useState(/* @__PURE__ */ new Set());
+	const currentStepIndex = stepOrder.indexOf(currentStep);
+	const isLastStep = currentStepIndex === stepOrder.length - 1;
+	const canGoBack = currentStepIndex > 0;
+	/**
+	* Mark step as visited
+	*/
+	const markStepVisited = useCallback((stepKey) => {
+		setVisitedSteps((prev) => /* @__PURE__ */ new Set([...prev, stepKey]));
+	}, []);
+	/**
+	* Mark step as invalid
+	*/
+	const markStepInvalid = useCallback((stepKey, invalid) => {
+		setInvalidSteps((prev) => {
+			const next = new Set(prev);
+			if (invalid) next.add(stepKey);
+			else next.delete(stepKey);
+			return next;
+		});
+	}, []);
+	const goToNext = useCallback(async () => {
+		if (isLastStep) return false;
+		if (steps[currentStep]?.validateOnNext !== false) {
+			if (!await validateStep(currentStep)) {
+				markStepInvalid(currentStep, true);
+				return false;
+			}
+		}
+		markStepInvalid(currentStep, false);
+		const nextStepKey = stepOrder[currentStepIndex + 1];
+		setCurrentStep(nextStepKey ?? "");
+		markStepVisited(nextStepKey ?? "");
+		return true;
+	}, [
+		currentStep,
+		currentStepIndex,
+		isLastStep,
+		steps,
+		stepOrder,
+		validateStep,
+		markStepInvalid,
+		markStepVisited
+	]);
+	const goToPrevious = useCallback(() => {
+		if (!canGoBack) return;
+		const prevStepKey = stepOrder[currentStepIndex - 1];
+		setCurrentStep(prevStepKey ?? "");
+	}, [
+		canGoBack,
+		currentStepIndex,
+		stepOrder
+	]);
+	const jumpToStep = useCallback((stepKey) => {
+		if (!stepOrder.includes(stepKey)) return false;
+		if (!visitedSteps.has(stepKey) && stepKey !== currentStep) return false;
+		setCurrentStep(stepKey);
+		return true;
+	}, [
+		stepOrder,
+		visitedSteps,
+		currentStep
+	]);
+	/**
+	* Reset wizard to initial state
+	*/
+	const reset = useCallback(() => {
+		setCurrentStep(firstStep);
+		setVisitedSteps(/* @__PURE__ */ new Set([firstStep]));
+		setInvalidSteps(/* @__PURE__ */ new Set());
+	}, [firstStep]);
+	/**
+	* Get current wizard state
+	*/
+	const getState = useCallback(() => {
+		return {
+			currentStep,
+			visitedSteps,
+			invalidSteps,
+			stepOrder,
+			totalSteps: stepOrder.length,
+			isLastStep,
+			canProceedToNext: !isLastStep,
+			canGoBack
+		};
+	}, [
+		currentStep,
+		visitedSteps,
+		invalidSteps,
+		stepOrder,
+		isLastStep,
+		canGoBack
+	]);
+	return {
+		currentStep,
+		visitedSteps,
+		invalidSteps,
+		isLastStep,
+		canGoBack,
+		currentStepIndex,
+		totalSteps: stepOrder.length,
+		goToNext,
+		goToPrevious,
+		jumpToStep,
+		reset,
+		markStepVisited,
+		markStepInvalid,
+		getState
+	};
+}
+//#endregion
+//#region src/form/Wizard/WizardNavigation.tsx
+function WizardNavigation({ currentStep, stepOrder, canGoToNext, canGoBack, isCurrentStepValid, nextLabel, prevLabel, submitLabel = "Submit", onNext, onPrevious, onSubmit }) {
+	const [isLoading, setIsLoading] = useState(false);
+	const [error, setError] = useState(null);
+	const isLastStep = stepOrder.indexOf(currentStep) === stepOrder.length - 1;
+	const handleNext = async () => {
+		setIsLoading(true);
+		setError(null);
+		try {
+			if (!await onNext()) setError("Please fix errors before proceeding");
+		} catch (err) {
+			setError(err instanceof Error ? err.message : "An error occurred");
+		} finally {
+			setIsLoading(false);
+		}
+	};
+	const handleSubmit = async () => {
+		setIsLoading(true);
+		setError(null);
+		try {
+			await onSubmit();
+		} catch (err) {
+			setError(err instanceof Error ? err.message : "An error occurred");
+		} finally {
+			setIsLoading(false);
+		}
+	};
+	return /* @__PURE__ */ jsxs("div", { children: [error && /* @__PURE__ */ jsx("div", {
+		className: "mb-4 p-3 bg-red-50 border border-red-200 rounded text-sm text-red-700",
+		children: error
+	}), /* @__PURE__ */ jsxs("div", {
+		className: "flex gap-3 justify-between pt-4",
+		children: [/* @__PURE__ */ jsx("button", {
+			type: "button",
+			onClick: onPrevious,
+			disabled: !canGoBack || isLoading,
+			className: "px-6 py-3 rounded-lg font-medium transition-all duration-200 border flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
+			style: {
+				color: "var(--theme-app)",
+				borderColor: "var(--theme-border)",
+				backgroundColor: "var(--theme-app-bg)"
+			},
+			onMouseEnter: (e) => {
+				if (!(!canGoBack || isLoading)) e.currentTarget.style.backgroundColor = "var(--theme-hover)";
+			},
+			onMouseLeave: (e) => {
+				e.currentTarget.style.backgroundColor = "var(--theme-app-bg)";
+			},
+			"aria-label": "Go to previous step",
+			children: prevLabel || "← Previous"
+		}), isLastStep ? /* @__PURE__ */ jsxs("button", {
+			type: "button",
+			onClick: handleSubmit,
+			disabled: !isCurrentStepValid || isLoading,
+			className: "px-8 py-3 rounded-lg font-medium transition-all duration-200 text-white flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed shadow-md hover:shadow-lg",
+			style: { backgroundColor: "var(--theme-element)" },
+			onMouseEnter: (e) => {
+				if (!(!isCurrentStepValid || isLoading)) e.currentTarget.style.filter = "brightness(0.9)";
+			},
+			onMouseLeave: (e) => {
+				e.currentTarget.style.filter = "brightness(1)";
+			},
+			"aria-label": submitLabel,
+			children: [isLoading && /* @__PURE__ */ jsx(Loader, {
+				size: 16,
+				full: false
+			}), submitLabel]
+		}) : /* @__PURE__ */ jsxs("button", {
+			type: "button",
+			onClick: handleNext,
+			disabled: !canGoToNext || isLoading,
+			className: "px-8 py-3 rounded-lg font-medium transition-all duration-200 text-white flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed shadow-md hover:shadow-lg",
+			style: { backgroundColor: "var(--theme-element)" },
+			onMouseEnter: (e) => {
+				if (!(!canGoToNext || isLoading)) e.currentTarget.style.filter = "brightness(0.9)";
+			},
+			onMouseLeave: (e) => {
+				e.currentTarget.style.filter = "brightness(1)";
+			},
+			"aria-label": "Go to next step",
+			children: [isLoading && /* @__PURE__ */ jsx(Loader, {
+				size: 16,
+				full: false
+			}), nextLabel || "Next →"]
+		})]
+	})] });
+}
+//#endregion
+//#region src/form/Wizard/WizardStepContent.tsx
+function WizardStepContent({ currentStep, stepConfig, flatten = true, values, onValuesChange, setFormDirty, setFieldValue, setFieldTouched, ...fieldsProps }) {
+	if (!stepConfig?.options) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "mb-4 w-full",
+		children: [
+			stepConfig.title && /* @__PURE__ */ jsx("h2", {
+				className: "text-2xl font-bold mb-2",
+				style: { color: "var(--theme-app)" },
+				children: stepConfig.title
+			}),
+			stepConfig.description && /* @__PURE__ */ jsx("p", {
+				className: "mb-4 leading-relaxed",
+				style: { color: "var(--theme-muted-text-color)" },
+				children: stepConfig.description
+			}),
+			/* @__PURE__ */ jsx(FieldsFromOptions, {
+				options: stepConfig.options,
+				values,
+				setFormDirty,
+				setFieldValue,
+				setFieldTouched,
+				...flatten === false ? { parentInfo: {
+					parentName: currentStep,
+					fieldNamePrefix: `${currentStep}.`
+				} } : {},
+				...fieldsProps
+			}, currentStep)
+		]
+	});
+}
+//#endregion
+//#region src/form/Wizard/WizardStepIndicator.tsx
+function WizardStepIndicator({ stepOrder, currentStep, steps, visitedSteps, invalidSteps, onStepClick, allowJump = false, hideStepNumbers = false }) {
+	const currentIndex = useMemo(() => stepOrder.indexOf(currentStep), [stepOrder, currentStep]);
+	const getStepStatus = (stepKey, index) => {
+		if (stepKey === currentStep) return "active";
+		if (index < currentIndex) return "completed";
+		return "upcoming";
+	};
+	const handleStepClick = (stepKey) => {
+		if (!allowJump || !visitedSteps.has(stepKey)) return;
+		onStepClick?.(stepKey);
+	};
+	const isClickable = (stepKey) => {
+		return allowJump && visitedSteps.has(stepKey) && stepKey !== currentStep;
+	};
+	return /* @__PURE__ */ jsx("div", {
+		className: "flex items-start justify-between w-full mb-2 gap-4 py-2",
+		children: stepOrder.map((stepKey, index) => {
+			const stepConfig = steps[stepKey];
+			const status = getStepStatus(stepKey, index);
+			const isInvalid = invalidSteps.has(stepKey);
+			const isClickable_ = isClickable(stepKey);
+			const isDotActive = status === "active";
+			const isDotCompleted = status === "completed";
+			const isDotUpcoming = status === "upcoming";
+			return /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col items-center flex-1 relative",
+				children: [
+					/* @__PURE__ */ jsxs("button", {
+						type: "button",
+						onClick: () => handleStepClick(stepKey),
+						disabled: !isClickable_,
+						className: cx("w-12 h-12 rounded-full border-3 flex items-center justify-center font-bold text-base transition-all duration-300 flex-shrink-0 relative", {
+							"cursor-pointer": isClickable_,
+							"cursor-not-allowed": !isClickable_
+						}, {
+							"text-white": isDotActive,
+							"bg-green-500 border-green-600 text-white shadow-md": isDotCompleted && !isInvalid,
+							"bg-(--theme-border) theme-border theme-muted-text shadow-sm": isDotUpcoming && !isInvalid,
+							"bg-(--theme-muted-panel-bg) theme-border theme-muted-text shadow-sm": !isDotActive && !isDotCompleted && !isDotUpcoming && !isInvalid,
+							"bg-red-50 border-red-500 text-red-600 shadow-sm": isInvalid && status !== "active"
+						}),
+						style: isDotActive ? {
+							backgroundColor: "var(--theme-element)",
+							borderColor: "var(--theme-element)",
+							color: "var(--theme-element-text)",
+							boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
+							zIndex: 10
+						} : { zIndex: 10 },
+						"aria-label": `Step ${index + 1}: ${stepConfig?.title}`,
+						title: stepConfig?.title,
+						children: [!hideStepNumbers && /* @__PURE__ */ jsx("span", {
+							className: cx({ hidden: status === "completed" }),
+							children: index + 1
+						}), status === "completed" && /* @__PURE__ */ jsx("svg", {
+							"aria-hidden": "true",
+							className: "w-4 h-4",
+							fill: "none",
+							stroke: "currentColor",
+							viewBox: "0 0 24 24",
+							children: /* @__PURE__ */ jsx("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								strokeWidth: 3,
+								d: "M5 13l4 4L19 7"
+							})
+						})]
+					}),
+					index < stepOrder.length - 1 && /* @__PURE__ */ jsx("div", {
+						className: cx("absolute h-1 transition-all duration-300", {
+							"bg-green-500": index < currentIndex,
+							"bg-(--theme-border)": index >= currentIndex,
+							"opacity-25": index >= currentIndex
+						}),
+						style: {
+							top: "24px",
+							left: "calc(50% + 24px)",
+							right: "-50%",
+							boxShadow: index < currentIndex ? "0 1px 2px rgba(34, 197, 94, 0.2)" : "none"
+						},
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "mt-2 text-center",
+						children: [/* @__PURE__ */ jsx("div", {
+							className: cx("text-sm text-center transition-colors duration-300 max-w-30", {
+								"font-bold text-green-600": isDotCompleted && !isInvalid,
+								"font-bold text-red-600": isInvalid && status !== "active",
+								"font-semibold theme-muted-text": !isDotActive && !isDotCompleted && !isInvalid,
+								"font-bold text-white": isDotActive
+							}),
+							style: isDotActive ? { color: "var(--theme-element)" } : {},
+							children: stepConfig?.title
+						}), stepConfig?.description && /* @__PURE__ */ jsx("div", {
+							className: "text-xs theme-muted-text mt-1 text-center max-w-30",
+							children: stepConfig.description
+						})]
+					})
+				]
+			}, stepKey);
 		})
 	});
 }
 //#endregion
-//#region src/form/Fields/ObjectField.tsx
-function ObjectField({ field, label, tooltipComponent, missingFields, setFormDirty, workflowForm, labelPosition, spaceCompact }) {
-	const [open, setOpen] = useState(field.collapsed !== void 0 ? !field.collapsed : true);
-	const { values, setFieldValue, setFieldTouched } = useFormikContext();
-	const meta = resolveMetaOverrides(field.options, labelPosition, spaceCompact ?? false);
-	const HeaderElement = field.noCollapse ? React.Fragment : ControlledCollapsiblePanel;
+//#region src/form/Wizard/WizardContainer.tsx
+function hasNestedError(stepErrors, fieldName) {
+	return typeof stepErrors === "object" && stepErrors !== null && fieldName in stepErrors;
+}
+function WizardContainer({ wizardConfig, values, onChange, onSubmit, className = "", labelPosition = "left", missingFields = [], spaceCompact = false, workflowForm = false, setFieldValue, setFieldTouched }) {
+	const { validateForm, setTouched, touched } = useFormikContext();
+	const { config, steps, stepOrder } = wizardConfig;
+	const { currentStep, visitedSteps, invalidSteps, isLastStep, canGoBack, goToNext, goToPrevious, jumpToStep } = useWizardState({
+		stepOrder,
+		steps,
+		validateStep: useCallback(async (stepKey) => {
+			const stepConfig = steps[stepKey];
+			if (!stepConfig?.options) return true;
+			const stepFieldNames = Object.keys(stepConfig.options);
+			const shouldFlatten = config.flatten !== false;
+			const errors = await validateForm();
+			const hasStepErrors = shouldFlatten ? stepFieldNames.some((fieldName) => errors[fieldName]) : stepFieldNames.some((fieldName) => hasNestedError(errors[stepKey], fieldName));
+			if (hasStepErrors) {
+				const touchedFields = stepFieldNames.reduce((acc, fieldName) => {
+					acc[fieldName] = true;
+					return acc;
+				}, {});
+				if (shouldFlatten) setTouched({
+					...touched,
+					...touchedFields
+				}, false);
+				else setTouched({
+					...touched,
+					[stepKey]: touchedFields
+				}, false);
+			}
+			return !hasStepErrors;
+		}, [
+			steps,
+			config,
+			validateForm,
+			setTouched,
+			touched
+		])
+	});
+	const currentStepConfig = steps[currentStep];
+	const config_ = config.navigation || {};
+	const handleGoToNext = useCallback(async () => {
+		const success = await goToNext();
+		if (success) onChange?.(values);
+		return success;
+	}, [
+		goToNext,
+		values,
+		onChange
+	]);
+	const handleJumpToStep = useCallback((stepKey) => {
+		if (!config_.allowJump || !visitedSteps.has(stepKey)) return false;
+		return jumpToStep(stepKey);
+	}, [
+		jumpToStep,
+		config_.allowJump,
+		visitedSteps
+	]);
+	const handleSubmit = useCallback(async () => {
+		if (!isLastStep) return;
+		const errors = await validateForm();
+		if (Object.keys(errors).length > 0) {
+			const touchedFields = Object.keys(values).reduce((acc, fieldName) => {
+				acc[fieldName] = true;
+				return acc;
+			}, {});
+			setTouched({
+				...touched,
+				...touchedFields
+			}, false);
+			throw new Error("Please fix errors before submitting");
+		}
+		await onSubmit?.(values);
+	}, [
+		isLastStep,
+		validateForm,
+		values,
+		setTouched,
+		touched,
+		onSubmit
+	]);
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col w-full",
-		children: [field.noCollapse && /* @__PURE__ */ jsx("div", {
-			className: "flex items-center w-full mb-[15px]",
-			children: /* @__PURE__ */ jsxs("h3", {
-				className: "flex items-center gap-1 text-md font-bold",
-				children: [
-					label,
-					" ",
-					tooltipComponent
-				]
-			})
-		}), /* @__PURE__ */ jsx(HeaderElement, {
-			open,
-			setOpen,
-			title: /* @__PURE__ */ jsx(GroupHeader, {
-				open,
-				setOpen,
-				title: field.label || label
+		className,
+		children: [
+			config_.showSteps !== false && /* @__PURE__ */ jsx(WizardStepIndicator, {
+				stepOrder,
+				currentStep,
+				steps,
+				visitedSteps,
+				invalidSteps,
+				onStepClick: handleJumpToStep,
+				allowJump: config_.allowJump,
+				hideStepNumbers: config_.hideStepNumbers
 			}),
-			children: /* @__PURE__ */ jsx("div", {
-				className: "w-full",
-				children: /* @__PURE__ */ jsx(FieldsFromOptions, {
-					options: field.options,
+			currentStepConfig && /* @__PURE__ */ jsx("div", {
+				className: "mb-4",
+				children: /* @__PURE__ */ jsx(WizardStepContent, {
+					currentStep,
+					stepConfig: currentStepConfig,
+					flatten: config.flatten,
 					values,
-					setFormDirty,
-					setFieldValue,
-					setFieldTouched,
+					onValuesChange: onChange,
+					labelPosition,
 					missingFields,
+					spaceCompact,
+					setFormDirty: () => onChange?.(values),
 					workflowForm,
-					labelPosition: meta.labelPosition,
-					spaceCompact: meta.spaceCompact,
-					parentInfo: {
-						parentName: field.name,
-						fieldNamePrefix: `${field.name}.`
-					}
+					setFieldValue,
+					setFieldTouched
 				})
+			}),
+			/* @__PURE__ */ jsx(WizardNavigation, {
+				currentStep,
+				stepOrder,
+				canGoToNext: !isLastStep,
+				canGoBack,
+				isCurrentStepValid: !invalidSteps.has(currentStep),
+				nextLabel: currentStepConfig?.nextLabel,
+				prevLabel: currentStepConfig?.prevLabel,
+				submitLabel: config.submitLabel || "Execute",
+				onNext: handleGoToNext,
+				onPrevious: goToPrevious,
+				onSubmit: handleSubmit
 			})
-		})]
-	});
-}
-//#endregion
-//#region src/form/Fields/StepField.tsx
-function StepField(_props) {
-	return null;
-}
-//#endregion
-//#region src/form/Fields/BucketReadOnlyField.tsx
-function BucketReadOnlyField({ field, disabled, missing, labelPosition, setFormDirty }) {
-	const { form: t } = useStrings();
-	const [fieldState] = useField(field.name);
-	const { setFieldTouched, setFieldValue, values } = useFormikContext();
-	const accessFieldName = field.name?.replace(/readOnly$/, "bucketAccessWritable");
-	const forced = fieldState.value === true && !!accessFieldName && getIn(values, accessFieldName) === false;
-	return /* @__PURE__ */ jsx(FieldWrapper, {
-		optional: true,
-		label: t.readOnly,
-		description: t.readOnlyDescription,
-		labelPosition,
-		children: ({ id, describedBy }) => /* @__PURE__ */ jsxs("div", {
-			className: "flex flex-col gap-2",
-			children: [/* @__PURE__ */ jsx(SwitchToggle, {
-				id,
-				"aria-describedby": describedBy,
-				onChange: (value) => {
-					if (disabled) return;
-					setFieldTouched(field.name, true);
-					setFieldValue(field.name, value);
-					setFormDirty(true);
-				},
-				value: fieldState.value === true,
-				disabled,
-				invalid: missing,
-				yesLabel: t.readOnly,
-				noLabel: t.readWrite
-			}), /* @__PURE__ */ jsx("p", {
-				className: cx("theme-muted-text max-w-[65ch]", !forced && "hidden"),
-				children: t.readOnlyForced
-			})]
-		})
-	});
-}
-//#endregion
-//#region src/form/fieldRegistry.tsx
-var CORE_FIELD_COMPONENTS = {
-	string: StringField_default,
-	password: StringField_default,
-	number: NumberField,
-	boolean: BooleanField,
-	dropdown: DropdownField,
-	textarea: TextAreaField,
-	range: RangeField,
-	duration: DurationField_default,
-	radio: RadioField,
-	label: LabelField,
-	color: ColorField,
-	"multi-dropdown": MultiDropdownField,
-	"checkbox-group": CheckboxGroupField,
-	object: ObjectField,
-	step: StepField,
-	"bucket-read-only": BucketReadOnlyField
-};
-var FieldRegistryContext = createContext({});
-/** Returns null for field types no registry knows. Per-form `fields` win over
-* the provider's `slots.formFields`, which win over the core registry. */
-function Registry(props) {
-	const injected = useContext(FieldRegistryContext);
-	const { formFields } = useSlots();
-	const Component = injected[props.field.type] ?? formFields?.[props.field.type] ?? CORE_FIELD_COMPONENTS[props.field.type];
-	if (!Component) return null;
-	return /* @__PURE__ */ jsx(Suspense, {
-		fallback: null,
-		children: /* @__PURE__ */ jsx(Component, { ...props })
+		]
 	});
 }
 //#endregion
@@ -1759,15 +1740,16 @@ function defaultReferencesField(defaultValue, fieldPath) {
 function findSelfReferencingFieldNames(schema, values = {}) {
 	return collectFieldsWithDefaults(schema, values).filter(({ name, defaultValue }) => defaultReferencesField(defaultValue, name)).map(({ name }) => name);
 }
-/** Resolves schema defaults into form values as dependencies change. Store-agnostic so the legacy
-* form (Formik) and the cluster wizard (its own store) share one implementation. */
+/** Resolves schema defaults into form values as dependencies change. Store-agnostic so the Formik
+* form and hosts with their own store share one implementation. */
 function useDynamicDefaultsSync({ options, values, setValue, isTouched }) {
+	const engine = useWorkflowEngine();
 	const listSig = useMemo(() => listLengthsSignature(options, values), [options, values]);
 	const fieldsWithDefaults = useMemo(() => collectFieldsWithDefaults(options, values).map((f) => {
 		if (typeof f.defaultValue !== "string" || !f.defaultValue.includes("${{")) return f;
 		const lastRowIndex = [...f.name.matchAll(/\[(\d+)\]/g)].at(-1)?.[1];
 		const index = lastRowIndex === void 0 ? -1 : Number(lastRowIndex);
-		const parsed = parseStringsOfObj({
+		const parsed = engine.evaluate({
 			inputs: values,
 			obj: { v: f.defaultValue },
 			orgVars: {},
@@ -1863,7 +1845,7 @@ function deleteFieldByPath(obj, path) {
 		if (acc && typeof acc === "object") return acc[curr];
 		return {};
 	}, obj);
-	if (parent && typeof parent === "object" && Object.prototype.hasOwnProperty.call(parent, fieldToRemove)) delete parent[fieldToRemove];
+	if (parent && typeof parent === "object" && Object.hasOwn(parent, fieldToRemove)) delete parent[fieldToRemove];
 }
 function getClosestParentIndex(parentPath) {
 	for (let i = parentPath.length - 1; i >= 0; i--) if (parentPath[i] === "]") {
@@ -1872,33 +1854,6 @@ function getClosestParentIndex(parentPath) {
 		return parseInt(parentPath.slice(j + 1, i));
 	}
 }
-function getInstanceTypesForForm(instances) {
-	return Object.entries(instances).map(([name, instance]) => {
-		const flexLabel = instance.isFlex ? ", Flex" : "";
-		const localDisk = instance.localDiskSizeGb ? ` , ${instance.localDiskSizeGb} GB Local Disk` : "";
-		return {
-			value: name,
-			label: `${name} (${instance.vcpus} vCPUs, ${instance.memoryGb} GB Memory, ${instance.arch}${localDisk}${flexLabel})`,
-			secondaryValue: [
-				instance.arch,
-				!!instance.acceleratedNetworking,
-				!!instance.acceleratedNetworking,
-				!!instance.localDiskSizeGb,
-				!!instance.isFlex
-			]
-		};
-	});
-}
-function StatusBlock({ status }) {
-	return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("div", {
-		"data-tooltip-id": TOOLTIP_ID,
-		"data-tooltip-content": status ? "Storage has been attached." : "Attaching the storage to cluster...",
-		children: status ? /* @__PURE__ */ jsx(SuccessCheckmark, {}) : /* @__PURE__ */ jsx(Loader, {
-			size: 13,
-			full: false
-		})
-	}) });
-}
 function MultiSelectionDropdown({ name, label = "", invalid = false, options: initialOptions = [], setFormDirty, onChange, parentValue }) {
 	const [field] = useField(name);
 	const required = useFieldRequired();
@@ -1925,15 +1880,21 @@ function MultiSelectionDropdown({ name, label = "", invalid = false, options: in
 	};
 	const t = useStrings().common;
 	const handleRemoveOption = (key) => {
-		setFieldValue(name, [...field.value.filter((item) => item !== key)]);
+		const selected = [...field.value.filter((item) => item !== key)];
+		setFieldValue(name, selected);
 		if (onChange) onChange(options);
 		setFormDirty(true);
 	};
 	const prevParent = usePrevious(parentValue);
 	useEffect(() => {
 		if (prevParent && parentValue && prevParent !== parentValue) setFieldValue(name, []);
-	}, [parentValue]);
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(CustomListbox, {
+	}, [
+		parentValue,
+		prevParent,
+		name,
+		setFieldValue
+	]);
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(CustomListbox, {
 		...controlProps,
 		options,
 		required,
@@ -1942,7 +1903,7 @@ function MultiSelectionDropdown({ name, label = "", invalid = false, options: in
 		className: "mb-3",
 		invalid,
 		closeOnSelect: false
-	}), /* @__PURE__ */ jsx(Table, { children: field.value && field.value.length > 0 ? options.filter((option) => option.selected).map((option, index) => {
+	}), /* @__PURE__ */ jsx(Table, { children: field.value && field.value.length > 0 ? options.filter((option) => option.selected).map((option) => {
 		return /* @__PURE__ */ jsxs("tr", { children: [/* @__PURE__ */ jsx(Table.Item, {
 			className: "w-full",
 			children: option?.label
@@ -1952,7 +1913,7 @@ function MultiSelectionDropdown({ name, label = "", invalid = false, options: in
 			className: "inline-flex bg-transparent p-0 cursor-pointer",
 			onClick: () => handleRemoveOption(option.value),
 			children: /* @__PURE__ */ jsx(TrashIcon, { className: "link mr-4" })
-		}) })] }, index);
+		}) })] }, String(option.value));
 	}) : /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsxs(Table.Item, { children: [
 		"No ",
 		label !== "" ? label.toLowerCase() : "options",
@@ -1974,11 +1935,12 @@ var InputField = React.memo(function InputField({ label, field, setFormDirty, on
 			text: typeof fieldObj.tooltip === "string" ? fieldObj.tooltip.replace(/\r/g, "") : fieldObj.tooltip.filter(Boolean).join("\n")
 		});
 	}, [fieldObj.tooltip]);
+	const missing = missingFields.includes(fieldObj.name ?? "");
 	return /* @__PURE__ */ jsx(Registry, {
 		field: fieldObj,
 		label,
 		labelPosition,
-		missing: missingFields.includes(fieldObj.name ?? ""),
+		missing,
 		missingFields,
 		values,
 		setFormDirty,
@@ -2020,6 +1982,7 @@ function DirtyStateBridge({ setFormDirty }) {
 }
 /** Three-tier cache: no expressions → raw pass-through; input-dep expressions → re-parse on dep change; org-var/path expressions → parse once. */
 function useFieldParse(optionsField, values, arrayIndex) {
+	const engine = useWorkflowEngine();
 	const c = useRef({
 		lastOptField: null,
 		convertedField: null,
@@ -2031,8 +1994,8 @@ function useFieldParse(optionsField, values, arrayIndex) {
 	}).current;
 	if (optionsField !== c.lastOptField) {
 		c.lastOptField = optionsField;
-		c.convertedField = convertToDynamicForm(asRecord(optionsField));
-		const { inputDeps, hasExpressions } = extractInputDeps(c.convertedField);
+		c.convertedField = engine.convertInputs(asRecord(optionsField));
+		const { inputDeps, hasExpressions } = engine.inputDependencies(c.convertedField);
 		c.inputDeps = inputDeps;
 		c.hasExpressions = hasExpressions;
 		c.result = null;
@@ -2051,7 +2014,7 @@ function useFieldParse(optionsField, values, arrayIndex) {
 		}
 		if (!changed) return c.result;
 	}
-	c.result = parseStringsOfObj({
+	c.result = engine.evaluate({
 		inputs: values,
 		obj: c.convertedField,
 		orgVars: {},
@@ -2088,8 +2051,10 @@ var FormField = React.memo(function FormField({ id, optionsField, fieldName, val
 	}
 	if (field.show_if !== void 0 || field.show_if_not !== void 0) {
 		let index;
-		if (parentInfo) if (!parentInfo?.arrayIndex) index = getClosestParentIndex(parentInfo.fieldNamePrefix);
-		else index = parentInfo.arrayIndex;
+		if (parentInfo) {
+			if (!parentInfo?.arrayIndex) index = getClosestParentIndex(parentInfo.fieldNamePrefix);
+			else index = parentInfo.arrayIndex;
+		}
 		let shouldShowField = true;
 		if (field.show_if !== void 0) shouldShowField = !!getParentValue(index, field.show_if, values, "", field);
 		if (shouldShowField && field.show_if_not !== void 0) shouldShowField = !getParentValue(index, field.show_if_not, values, "", field);
@@ -2161,8 +2126,10 @@ var FormField = React.memo(function FormField({ id, optionsField, fieldName, val
 		if (prevParentValue !== void 0 && prevParentValue !== parentValue) deleteFieldByPath(values, fieldObj["name"]);
 		field.prevParentValue = parentValue;
 	}
-	if (field.secondaryField) if (Array.isArray(field.secondaryField)) fieldObj["secondaryField"] = field.secondaryField.map((secondaryField) => fieldNamePrefix + secondaryField);
-	else fieldObj["secondaryField"] = fieldNamePrefix + field.secondaryField;
+	if (field.secondaryField) {
+		if (Array.isArray(field.secondaryField)) fieldObj["secondaryField"] = field.secondaryField.map((secondaryField) => fieldNamePrefix + secondaryField);
+		else fieldObj["secondaryField"] = fieldNamePrefix + field.secondaryField;
+	}
 	return /* @__PURE__ */ jsx("div", {
 		className: cx("flex w-full", labelPosition === "left" ? "mb-[15px]" : "mb-[5px]"),
 		children: /* @__PURE__ */ jsx(InputField, {
@@ -2206,17 +2173,17 @@ function FieldsFromOptions({ options = {}, values, setFormDirty, setFieldValue,
 		missingFields,
 		spaceCompact,
 		workflowForm
-	}, idx));
+	}, fieldName));
 }
 var noop = () => {};
-function DynamicFormContent({ options, setValues, setFormDirty, labelPosition, missingFields, spaceCompact, organizationVariables, workflowForm, onSubmit, submitLabel, values, contextKey }) {
+function DynamicFormContent({ options, setValues, setFormDirty, labelPosition, missingFields, spaceCompact, organizationVariables, remoteVars, workflowForm, onSubmit, submitLabel, values, contextKey }) {
 	const { setFieldValue, setFieldTouched } = useFormikContext();
-	const opts = useParsedOpts(options, values, organizationVariables);
+	const opts = useParsedOpts(options, values, organizationVariables, void 0, void 0, remoteVars);
 	const handleChange = useCallback((state) => {
 		if (setValues) setValues(state);
 	}, [setValues]);
 	const wizardConfig = parseWizardConfig(opts);
-	return /* @__PURE__ */ jsxs(Fragment, { children: [
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
 		/* @__PURE__ */ jsx(DirtyStateBridge, { setFormDirty }),
 		/* @__PURE__ */ jsx(FormikStateBridge, { onChange: handleChange }),
 		/* @__PURE__ */ jsx(DynamicDefaultsSync, { options: opts }, contextKey ?? ""),
@@ -2231,7 +2198,7 @@ function DynamicFormContent({ options, setValues, setFormDirty, labelPosition, m
 			workflowForm,
 			setFieldValue,
 			setFieldTouched
-		}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(FieldsFromOptions, {
+		}) : /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(FieldsFromOptions, {
 			...resolveMetaOverrides(options, labelPosition, spaceCompact),
 			options: opts,
 			values,
@@ -2251,17 +2218,19 @@ function DynamicFormContent({ options, setValues, setFormDirty, labelPosition, m
 	] });
 }
 var NO_FIELDS = {};
-function DynamicForm({ formJSONs: options = {}, reinitialize = false, initialValues, setValues, setFormDirty = noop, formikRef, labelPosition = "left", missingFields = [], spaceCompact = false, organizationVariables, needsOrganizationVariables = false, onSubmit = void 0, submitLabel = "Submit", className = "w-full", workflowForm = false, contextKey, skipValueParse = false, fields = NO_FIELDS }) {
-	const [parseReady, setParseReady] = useState(parseStringsOfObjReady);
+function DynamicForm({ formJSONs: options = {}, reinitialize = false, initialValues, setValues, setFormDirty = noop, formikRef, labelPosition = "left", missingFields = [], spaceCompact = false, organizationVariables, remoteVars, needsOrganizationVariables = false, onSubmit = void 0, submitLabel = "Submit", className = "w-full", workflowForm = false, contextKey, skipValueParse = false, fields = NO_FIELDS }) {
+	const engine = useWorkflowEngine();
+	const [parseReady, setParseReady] = useState(() => engine.isReady());
 	useEffect(() => {
-		initializeParseStringsOfObj();
-		return callWhenParserInitialized(setParseReady);
-	}, []);
+		engine.init();
+		return engine.onReady(setParseReady);
+	}, [engine]);
 	if (!parseReady) return /* @__PURE__ */ jsx(Loader, {});
-	const parsedInitVals = skipValueParse ? initialValues : initialValues && parseStringsOfObj({
+	const parsedInitVals = skipValueParse ? initialValues : initialValues && engine.evaluate({
 		inputs: initialValues,
 		obj: initialValues,
-		orgVars: organizationVariables
+		orgVars: organizationVariables,
+		remoteVars
 	});
 	return /* @__PURE__ */ jsx(FieldRegistryContext.Provider, {
 		value: fields,
@@ -2286,6 +2255,7 @@ function DynamicForm({ formJSONs: options = {}, reinitialize = false, initialVal
 						missingFields,
 						spaceCompact,
 						organizationVariables,
+						remoteVars,
 						workflowForm,
 						onSubmit,
 						submitLabel,
@@ -2349,95 +2319,4 @@ function FormikMultiSelectDropdown({ name, options, setFormDirty, onChange, disa
 	});
 }
 //#endregion
-//#region src/form/utils/pwResolver.ts
-function resolvePwString(raw, options, fallbackUsername, opts) {
-	let inputForm = null;
-	let owner;
-	let name;
-	if (typeof raw === "string" && raw.startsWith("pw://")) {
-		const parts = raw.slice(5).split("/");
-		if (parts.length === 1 && parts[0]) {
-			inputForm = "shorthand";
-			name = parts[0];
-			owner = fallbackUsername;
-		} else if (parts.length === 2 && parts[0] && parts[1]) {
-			inputForm = "full";
-			owner = parts[0];
-			name = parts[1];
-		}
-	} else if (raw !== null && typeof raw === "object" && !Array.isArray(raw)) {
-		const obj = raw;
-		if (typeof obj["uri"] === "string" && obj["uri"].startsWith("pw://")) {
-			const parts = obj["uri"].slice(5).split("/");
-			if (parts.length === 1 && parts[0]) {
-				inputForm = "shorthand";
-				name = parts[0];
-				owner = fallbackUsername;
-			} else if (parts.length === 2 && parts[0] && parts[1]) {
-				inputForm = "full";
-				owner = parts[0];
-				name = parts[1];
-			}
-		} else if (typeof obj["name"] === "string") {
-			name = obj["name"];
-			const ownerVal = typeof obj["user"] === "string" ? obj["user"] : typeof obj["namespace"] === "string" ? obj["namespace"] : void 0;
-			if (obj["type"] === "managed-cluster" || !ownerVal) {
-				inputForm = "shorthand";
-				owner = fallbackUsername;
-			} else {
-				inputForm = "full";
-				owner = ownerVal;
-			}
-		} else if (typeof obj["id"] === "string" && obj["id"]) {
-			inputForm = "shorthand";
-			name = obj["id"];
-			owner = fallbackUsername;
-		}
-	}
-	if (!inputForm || !name || !owner) return raw;
-	const special = opts.specialCase?.(name, owner);
-	if (special !== void 0) return special;
-	const find = (pred) => {
-		for (const category of options) for (const opt of category.options) if (opt.value && pred(opt.value)) return opt.value;
-	};
-	if (inputForm === "full") return find((v) => v.name === name && v[opts.ownerKey] === owner) ?? raw;
-	const managed = find((v) => v.name === name && v.type === "managed-cluster");
-	if (managed) return managed;
-	const ownedByCaller = find((v) => v.name === name && v[opts.ownerKey] === fallbackUsername);
-	if (ownedByCaller) return ownedByCaller;
-	const sharedWithCaller = find((v) => v.name === name && typeof v[opts.ownerKey] === "string" && v[opts.ownerKey] !== fallbackUsername);
-	if (sharedWithCaller) return sharedWithCaller;
-	return raw;
-}
-function resolvePwValue(currentValue, options, fallbackUsername, opts) {
-	if (Array.isArray(currentValue)) {
-		let changed = false;
-		const next = currentValue.map((v) => {
-			const resolved = resolvePwString(v, options, fallbackUsername, opts);
-			if (resolved !== v) changed = true;
-			return resolved;
-		});
-		return changed ? next : currentValue;
-	}
-	return resolvePwString(currentValue, options, fallbackUsername, opts);
-}
-//#endregion
-//#region src/form/Fields/ResourceOptionIcon.tsx
-function ResourceOptionIcon({ imageUrl, fallbackIcon, alt, variant = "success", dotSize = 6 }) {
-	return /* @__PURE__ */ jsxs("span", {
-		className: "flex items-center gap-1.5 shrink-0",
-		children: [/* @__PURE__ */ jsx(StatusDot, {
-			variant,
-			size: dotSize
-		}), /* @__PURE__ */ jsx("img", {
-			src: imageUrl || fallbackIcon,
-			alt,
-			className: "h-4 w-4 object-contain",
-			onError: (e) => {
-				e.currentTarget.src = fallbackIcon;
-			}
-		})]
-	});
-}
-//#endregion
-export { DropdownWrapper, DynamicDefaultsSync, DynamicForm, FLEX_MAX_DURATION_RANGE, FLEX_WAIT_TIME_RANGE, FieldProvider, FieldRegistryContext, FieldWrapper, FieldsFromOptions, FormikCustomDropdown_default as FormikCustomDropdown, FormikCustomInput, FormikMultiSelectDropdown, FormikNumericInput, GroupHeader, MultiSelectionDropdown, NumberField, Registry, ResourceOptionIcon, STANDARD_MAX_DURATION_RANGE, StatusBlock, applySecondaryField, collectFieldsWithDefaults, collectPartitionDurationIssues, enforceOneMustBeTrue, findSecondaryOption, findSelfReferencingFieldNames, flattenGroups, formatSecondsAsSlurmDuration, getInstanceTypesForForm, getInvalidDurationPaths, getPlaceholder, impureSetValueFromPath, initializeValues, parseSlurmDuration, resolveMetaOverrides, resolvePwString, resolvePwValue, resolvedFlag, setDurationValidity, useDynamicDefaultsSync, useFieldControlProps, useFieldLabelledByProps, useFieldRequired, useParsedOpts };
+export { DropdownWrapper, DynamicDefaultsSync, DynamicForm, FLEX_MAX_DURATION_RANGE, FLEX_WAIT_TIME_RANGE, FieldProvider, FieldRegistryContext, FieldWrapper, FieldsFromOptions, FormikCustomDropdown_default as FormikCustomDropdown, FormikCustomInput, FormikMultiSelectDropdown, FormikNumericInput, GroupHeader, MultiSelectionDropdown, NumberField, Registry, ResourceOptionIcon, STANDARD_MAX_DURATION_RANGE, applySecondaryField, collectFieldsWithDefaults, collectPartitionDurationIssues, enforceOneMustBeTrue, findSecondaryOption, findSelfReferencingFieldNames, flattenGroups, formatDuration, getInvalidDurationPaths, getPlaceholder, impureSetValueFromPath, initializeValues, parseDuration, resolveMetaOverrides, resolvedFlag, setDurationValidity, useDynamicDefaultsSync, useFieldControlProps, useFieldLabelledByProps, useFieldRequired, useParsedOpts };