@10x-media/form-builder 0.1.0-beta.0 → 0.1.0-beta.10

package/dist/client/FlowBuilder.js

@@ -0,0 +1,457 @@
+"use client";
+import { keys } from "../translations/keys.js";
+import { resolveMessage } from "../validation/message.js";
+import { useTranslation as useTranslation$1 } from "../translations/useTranslation.js";
+import { toStaticLabel } from "./toStaticLabel.js";
+import { ConditionBuilder } from "./ConditionBuilder.js";
+import { stepLabel } from "../flow/stepLabel.js";
+import { assignFieldToStep, fieldHolders, flowFieldEntries, nextFromSelectValue, nextSelectOptions, nextToSelectValue, otherStepSelectOptions, removeFieldFromStep, removeStepCascade, stepSelectOptions, unassignedEntries } from "./flowAuthoring.js";
+import { reduceFieldsToValues } from "payload/shared";
+import { Button, CheckboxInput, Collapsible, FieldLabel, ReactSelect, TextInput, useField, useFormFields } from "@payloadcms/ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useRef, useState } from "react";
+import "./admin.css";
+import { Popup, PopupList } from "@payloadcms/ui/elements/Popup";
+import { MoreIcon } from "@payloadcms/ui/icons/More";
+//#region src/client/FlowBuilder.tsx
+/** The row facets the flow builder keys and labels by, projected for a stable JSON identity. */
+const extractFieldRows = (data) => {
+	return (Array.isArray(data.fields) ? data.fields : []).map((row) => ({
+		blockType: row.blockType,
+		name: row.name,
+		id: row.id,
+		label: row.label,
+		content: row.content
+	}));
+};
+const TransitionRow = ({ transition, stepOptions, conditionTypes, isFirst, isLast, onChange, onRemove, onMoveUp, onMoveDown }) => {
+	const { t } = useTranslation$1();
+	const handleGotoChange = (selected) => {
+		const chosen = Array.isArray(selected) ? selected[0] : selected;
+		if (chosen) onChange({
+			...transition,
+			to: chosen.value
+		});
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: "fb-flow-transition",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "fb-flow-transition__header",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "fb-flow-transition__label",
+						children: t(keys.flowGoTo)
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "fb-flow-transition__goto",
+						children: /* @__PURE__ */ jsx(ReactSelect, {
+							options: stepOptions,
+							value: stepOptions.find((o) => o.value === transition.to) ?? void 0,
+							placeholder: t(keys.flowSelectStepPlaceholder),
+							isClearable: false,
+							onChange: handleGotoChange
+						})
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "fb-flow-transition__actions",
+						children: [
+							/* @__PURE__ */ jsx("button", {
+								type: "button",
+								className: "fb-flow__move-btn",
+								onClick: onMoveUp,
+								disabled: isFirst,
+								"aria-label": t(keys.flowMoveTransitionUp),
+								children: "↑"
+							}),
+							/* @__PURE__ */ jsx("button", {
+								type: "button",
+								className: "fb-flow__move-btn",
+								onClick: onMoveDown,
+								disabled: isLast,
+								"aria-label": t(keys.flowMoveTransitionDown),
+								children: "↓"
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								buttonStyle: "icon-label",
+								icon: "x",
+								onClick: onRemove,
+								margin: false,
+								"aria-label": t(keys.flowRemoveTransition)
+							})
+						]
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "fb-flow-transition__when-label",
+				children: t(keys.flowWhen)
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "fb-flow-transition__condition",
+				children: /* @__PURE__ */ jsx(ConditionBuilder, {
+					value: transition.when,
+					onChange: (when) => onChange({
+						...transition,
+						when
+					}),
+					conditionTypes
+				})
+			})
+		]
+	});
+};
+const StepCard = ({ step, stepKey, stepIndex, stepCount, otherStepOptions, holders, stepLabels, entries, conditionTypes, isExpanded, onToggle, onChange, onToggleField, onRemove, onMoveUp, onMoveDown, onAddAbove, onAddBelow }) => {
+	const { t } = useTranslation$1();
+	const nextOptions = nextSelectOptions({
+		sequentialLabel: t(keys.flowNextSequential),
+		terminalLabel: t(keys.flowNextTerminal),
+		otherSteps: otherStepOptions
+	});
+	const transitions = step.transitions ?? [];
+	const tKeysRef = useRef([]);
+	if (tKeysRef.current.length !== transitions.length) tKeysRef.current = transitions.map((_, i) => tKeysRef.current[i] ?? crypto.randomUUID());
+	const tKeys = tKeysRef.current;
+	const addTransition = () => {
+		const firstOtherStep = otherStepOptions[0]?.value;
+		if (firstOtherStep === void 0) return;
+		tKeysRef.current = [...tKeys, crypto.randomUUID()];
+		onChange({
+			...step,
+			transitions: [...transitions, {
+				when: {},
+				to: firstOtherStep
+			}]
+		});
+	};
+	const updateTransition = (index, next) => {
+		const updated = [...transitions];
+		updated[index] = next;
+		onChange({
+			...step,
+			transitions: updated
+		});
+	};
+	const removeTransition = (index) => {
+		tKeysRef.current = tKeys.filter((_, i) => i !== index);
+		const updated = transitions.filter((_, i) => i !== index);
+		onChange({
+			...step,
+			transitions: updated.length > 0 ? updated : void 0
+		});
+	};
+	const moveTransition = (from, to) => {
+		const updated = [...transitions];
+		const [item] = updated.splice(from, 1);
+		if (item !== void 0) updated.splice(to, 0, item);
+		const nextKeys = [...tKeys];
+		const [movedKey] = nextKeys.splice(from, 1);
+		if (movedKey !== void 0) nextKeys.splice(to, 0, movedKey);
+		tKeysRef.current = nextKeys;
+		onChange({
+			...step,
+			transitions: updated
+		});
+	};
+	const handleNextChange = (selected) => {
+		const chosen = Array.isArray(selected) ? selected[0] : selected;
+		if (chosen) onChange({
+			...step,
+			next: nextFromSelectValue(chosen.value)
+		});
+	};
+	const title = step.title?.trim() ?? "";
+	return /* @__PURE__ */ jsx(Collapsible, {
+		header: /* @__PURE__ */ jsxs("div", {
+			className: "fb-flow-step__header-content",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "fb-flow-step__index",
+				children: resolveMessage(t(keys.flowStepFallbackTitle), { n: stepIndex + 1 })
+			}), title.length > 0 ? /* @__PURE__ */ jsx("span", {
+				className: "fb-flow-step__title",
+				children: title
+			}) : null]
+		}),
+		actions: /* @__PURE__ */ jsx(Popup, {
+			button: /* @__PURE__ */ jsx(MoreIcon, {}),
+			buttonType: "default",
+			horizontalAlign: "right",
+			size: "fit-content",
+			verticalAlign: "bottom",
+			children: /* @__PURE__ */ jsxs(PopupList.ButtonGroup, { children: [
+				/* @__PURE__ */ jsx(PopupList.Button, {
+					onClick: onAddAbove,
+					children: t(keys.flowAddAbove)
+				}),
+				/* @__PURE__ */ jsx(PopupList.Button, {
+					onClick: onAddBelow,
+					children: t(keys.flowAddBelow)
+				}),
+				/* @__PURE__ */ jsx(PopupList.Button, {
+					onClick: onMoveUp,
+					disabled: stepIndex === 0,
+					children: "Move up"
+				}),
+				/* @__PURE__ */ jsx(PopupList.Button, {
+					onClick: onMoveDown,
+					disabled: stepIndex === stepCount - 1,
+					children: "Move down"
+				}),
+				/* @__PURE__ */ jsx(PopupList.Button, {
+					onClick: onRemove,
+					children: "Remove"
+				})
+			] })
+		}),
+		isCollapsed: !isExpanded,
+		onToggle: () => onToggle(),
+		className: "fb-flow-step",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "fb-flow-step__body",
+			children: [
+				/* @__PURE__ */ jsx(TextInput, {
+					path: `fb-flow-step-${stepKey}-title`,
+					label: t(keys.flowStepTitleLabel),
+					value: step.title ?? "",
+					onChange: (e) => onChange({
+						...step,
+						title: e.target.value.length > 0 ? e.target.value : void 0
+					})
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "fb-flow-step__row",
+					children: [/* @__PURE__ */ jsx(FieldLabel, { label: t(keys.flowFields) }), entries.length === 0 ? /* @__PURE__ */ jsx("p", {
+						className: "fb-flow-step__hint",
+						children: t(keys.flowNoFields)
+					}) : /* @__PURE__ */ jsx("div", {
+						className: "fb-flow-step__field-picker",
+						children: entries.map((entry) => {
+							const holder = holders.get(entry.key);
+							const inOtherStep = holder !== void 0 && holder !== stepIndex;
+							return /* @__PURE__ */ jsxs("div", {
+								className: "fb-flow-step__field-option",
+								children: [/* @__PURE__ */ jsx(CheckboxInput, {
+									label: entry.label,
+									checked: step.fields.includes(entry.key) || inOtherStep,
+									readOnly: inOtherStep,
+									onToggle: (e) => {
+										if (inOtherStep) return;
+										onToggleField(entry.key, e.target.checked);
+									}
+								}), inOtherStep ? /* @__PURE__ */ jsx("span", {
+									className: "fb-flow-step__field-hint",
+									children: resolveMessage(t(keys.flowFieldInStep), { step: stepLabels[holder] ?? "" })
+								}) : null]
+							}, entry.key);
+						})
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "fb-flow-step__row",
+					children: [/* @__PURE__ */ jsx(FieldLabel, { label: t(keys.flowDefaultNext) }), /* @__PURE__ */ jsx(ReactSelect, {
+						options: nextOptions,
+						value: nextOptions.find((o) => o.value === nextToSelectValue(step.next)) ?? void 0,
+						isClearable: false,
+						onChange: handleNextChange
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "fb-flow-step__transitions",
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "fb-flow-step__transitions-header",
+							children: [/* @__PURE__ */ jsx(FieldLabel, { label: t(keys.flowConditionalTransitions) }), /* @__PURE__ */ jsx("span", {
+								className: "fb-flow-step__hint",
+								children: t(keys.flowFirstMatchWins)
+							})]
+						}),
+						transitions.map((transition, tIndex) => {
+							const tKey = tKeys[tIndex];
+							if (tKey === void 0) return null;
+							return /* @__PURE__ */ jsx(TransitionRow, {
+								transition,
+								stepOptions: otherStepOptions,
+								conditionTypes,
+								isFirst: tIndex === 0,
+								isLast: tIndex === transitions.length - 1,
+								onChange: (next) => updateTransition(tIndex, next),
+								onRemove: () => removeTransition(tIndex),
+								onMoveUp: () => moveTransition(tIndex, tIndex - 1),
+								onMoveDown: () => moveTransition(tIndex, tIndex + 1)
+							}, tKey);
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							buttonStyle: "icon-label",
+							icon: "plus",
+							iconStyle: "with-border",
+							iconPosition: "left",
+							onClick: addTransition,
+							margin: false,
+							children: t(keys.flowAddTransition)
+						})
+					]
+				})
+			]
+		})
+	});
+};
+const FlowBuilder = (props) => {
+	const { setValue, value } = useField();
+	const { t } = useTranslation$1();
+	const label = toStaticLabel(props.field?.label ?? props.label);
+	const [expandedKeys, setExpandedKeys] = useState(/* @__PURE__ */ new Set());
+	const fieldRowsJson = useFormFields(([fields]) => JSON.stringify(extractFieldRows(reduceFieldsToValues(fields, true))));
+	const translatedBareLabels = useMemo(() => Object.fromEntries(Object.entries(props.bareTypeLabels ?? {}).map(([type, label]) => [type, t(label)])), [props.bareTypeLabels, t]);
+	const entries = useMemo(() => flowFieldEntries(JSON.parse(fieldRowsJson), translatedBareLabels), [fieldRowsJson, translatedBareLabels]);
+	const steps = value?.steps ?? [];
+	const fallbackTitle = t(keys.flowStepFallbackTitle);
+	const stepLabels = steps.map((step, index) => stepLabel(step, index, fallbackTitle));
+	const stepOptions = stepSelectOptions(steps, stepLabels);
+	const holders = fieldHolders(steps);
+	const unassigned = unassignedEntries(entries, steps);
+	const keysRef = useRef([]);
+	if (keysRef.current.length !== steps.length) keysRef.current = steps.map((_, i) => keysRef.current[i] ?? crypto.randomUUID());
+	const stepKeys = keysRef.current;
+	const toggleExpanded = (key) => {
+		setExpandedKeys((prev) => {
+			const next = new Set(prev);
+			if (next.has(key)) next.delete(key);
+			else next.add(key);
+			return next;
+		});
+	};
+	const emit = (nextSteps, nextKeys) => {
+		keysRef.current = nextKeys;
+		setValue({ steps: nextSteps });
+	};
+	const insertStep = (at) => {
+		const key = crypto.randomUUID();
+		const nextSteps = [...steps];
+		nextSteps.splice(at, 0, {
+			id: crypto.randomUUID(),
+			fields: []
+		});
+		const nextKeys = [...stepKeys];
+		nextKeys.splice(at, 0, key);
+		emit(nextSteps, nextKeys);
+		setExpandedKeys((prev) => new Set(prev).add(key));
+	};
+	const addStep = () => insertStep(steps.length);
+	const updateStep = (index, next) => {
+		emit(steps.map((s, i) => i === index ? next : s), stepKeys);
+	};
+	const toggleField = (stepIndex, key, checked) => {
+		emit(checked ? assignFieldToStep(steps, stepIndex, key) : removeFieldFromStep(steps, stepIndex, key), stepKeys);
+	};
+	const assignUnassignedField = (key, stepId) => {
+		const targetIndex = steps.findIndex((s) => s.id === stepId);
+		if (targetIndex === -1) return;
+		emit(assignFieldToStep(steps, targetIndex, key), stepKeys);
+	};
+	const removeStep = (index) => {
+		const removedKey = stepKeys[index];
+		emit(removeStepCascade(steps, index), stepKeys.filter((_, i) => i !== index));
+		if (removedKey !== void 0) setExpandedKeys((prev) => {
+			const next = new Set(prev);
+			next.delete(removedKey);
+			return next;
+		});
+	};
+	const moveStep = (from, to) => {
+		const nextSteps = [...steps];
+		const [movedStep] = nextSteps.splice(from, 1);
+		if (movedStep === void 0) return;
+		nextSteps.splice(to, 0, movedStep);
+		const nextKeys = [...stepKeys];
+		const [movedKey] = nextKeys.splice(from, 1);
+		if (movedKey !== void 0) nextKeys.splice(to, 0, movedKey);
+		emit(nextSteps, nextKeys);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: "field-type fb-flow-builder",
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "blocks-field__header",
+				children: /* @__PURE__ */ jsx("div", {
+					className: "blocks-field__header-wrap",
+					children: /* @__PURE__ */ jsx("h3", { children: typeof label === "string" ? label : t(keys.flowFallbackTitle) })
+				})
+			}),
+			/* @__PURE__ */ jsx("p", {
+				className: "fb-flow-builder__description",
+				children: t(keys.flowDescription)
+			}),
+			steps.length === 0 ? /* @__PURE__ */ jsx("p", {
+				className: "fb-flow-builder__hint",
+				children: t(keys.flowNoSteps)
+			}) : /* @__PURE__ */ jsx("div", {
+				className: "fb-flow-builder__steps",
+				children: steps.map((step, index) => {
+					const key = stepKeys[index];
+					if (key === void 0) return null;
+					const otherStepOptions = otherStepSelectOptions(stepOptions, step.id);
+					return /* @__PURE__ */ jsx(StepCard, {
+						stepKey: key,
+						step,
+						stepIndex: index,
+						stepCount: steps.length,
+						otherStepOptions,
+						holders,
+						stepLabels,
+						entries,
+						conditionTypes: props.conditionTypes,
+						isExpanded: expandedKeys.has(key),
+						onToggle: () => toggleExpanded(key),
+						onChange: (next) => updateStep(index, next),
+						onToggleField: (fieldKey, checked) => toggleField(index, fieldKey, checked),
+						onRemove: () => removeStep(index),
+						onMoveUp: () => moveStep(index, index - 1),
+						onMoveDown: () => moveStep(index, index + 1),
+						onAddAbove: () => insertStep(index),
+						onAddBelow: () => insertStep(index + 1)
+					}, key);
+				})
+			}),
+			steps.length > 0 && unassigned.length > 0 ? /* @__PURE__ */ jsxs("div", {
+				className: "fb-flow-unassigned",
+				children: [/* @__PURE__ */ jsx(FieldLabel, { label: t(keys.flowUnassigned) }), /* @__PURE__ */ jsx("div", {
+					className: "fb-flow-unassigned__rows",
+					children: unassigned.map((entry) => /* @__PURE__ */ jsxs("div", {
+						className: "fb-flow-unassigned__row",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "fb-flow-unassigned__name",
+							children: entry.label
+						}), /* @__PURE__ */ jsx("div", {
+							className: "fb-flow-unassigned__select",
+							children: /* @__PURE__ */ jsx(ReactSelect, {
+								options: stepOptions,
+								placeholder: t(keys.flowAssignToStep),
+								isClearable: false,
+								onChange: (selected) => {
+									const chosen = Array.isArray(selected) ? selected[0] : selected;
+									if (chosen) assignUnassignedField(entry.key, chosen.value);
+								}
+							})
+						})]
+					}, entry.key))
+				})]
+			}) : null,
+			/* @__PURE__ */ jsx("div", {
+				className: "fb-flow-builder__actions",
+				children: /* @__PURE__ */ jsx(Button, {
+					buttonStyle: "icon-label",
+					icon: "plus",
+					iconStyle: "with-border",
+					iconPosition: "left",
+					onClick: addStep,
+					margin: false,
+					children: "Add step"
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { FlowBuilder };
+
+//# sourceMappingURL=FlowBuilder.js.map

package/dist/client/FlowBuilder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlowBuilder.js","names":["useTranslation"],"sources":["../../src/client/FlowBuilder.tsx"],"sourcesContent":["'use client'\n\nimport {\n\tButton,\n\tCheckboxInput,\n\tCollapsible,\n\tFieldLabel,\n\tReactSelect,\n\ttype ReactSelectOption,\n\tTextInput,\n\tuseField,\n\tuseFormFields,\n} from '@payloadcms/ui'\nimport { Popup, PopupList } from '@payloadcms/ui/elements/Popup'\nimport { MoreIcon } from '@payloadcms/ui/icons/More'\nimport { reduceFieldsToValues } from 'payload/shared'\nimport type { ChangeEvent } from 'react'\nimport { useMemo, useRef, useState } from 'react'\nimport type { ConditionFieldType } from '../conditions/fieldTypes'\nimport type { FlowStep, FlowTransition, FormFlow } from '../flow/types'\nimport { keys, type TranslationKey } from '../translations/keys'\nimport { useTranslation } from '../translations/useTranslation'\nimport { resolveMessage } from '../validation/message'\nimport { ConditionBuilder } from './ConditionBuilder'\nimport {\n\tassignFieldToStep,\n\ttype FlowFieldEntry,\n\ttype FlowSelectOption,\n\tfieldHolders,\n\tflowFieldEntries,\n\tnextFromSelectValue,\n\tnextSelectOptions,\n\tnextToSelectValue,\n\totherStepSelectOptions,\n\tremoveFieldFromStep,\n\tremoveStepCascade,\n\tstepLabel,\n\tstepSelectOptions,\n\tunassignedEntries,\n} from './flowAuthoring'\nimport type { FieldRow } from './synthesizeClientField'\nimport { toStaticLabel } from './toStaticLabel'\nimport './admin.css'\n\nexport type FlowBuilderProps = {\n\tpath?: string\n\tfield?: { label?: unknown }\n\tlabel?: unknown\n\tconditionTypes: Record<string, ConditionFieldType>\n\t/** Bare (nameless) block slugs to their display label: an i18n key or a literal. */\n\tbareTypeLabels?: Record<string, string>\n}\n\n/** The row facets the flow builder keys and labels by, projected for a stable JSON identity. */\nconst extractFieldRows = (data: Record<string, unknown>): FieldRow[] => {\n\tconst rows = Array.isArray(data.fields) ? (data.fields as FieldRow[]) : []\n\treturn rows.map((row) => ({\n\t\tblockType: row.blockType,\n\t\tname: row.name,\n\t\tid: row.id,\n\t\tlabel: row.label,\n\t\tcontent: row.content,\n\t}))\n}\n\ntype TransitionRowProps = {\n\ttransition: FlowTransition\n\tstepOptions: FlowSelectOption[]\n\tconditionTypes: Record<string, ConditionFieldType>\n\tisFirst: boolean\n\tisLast: boolean\n\tonChange: (next: FlowTransition) => void\n\tonRemove: () => void\n\tonMoveUp: () => void\n\tonMoveDown: () => void\n}\n\nconst TransitionRow = ({\n\ttransition,\n\tstepOptions,\n\tconditionTypes,\n\tisFirst,\n\tisLast,\n\tonChange,\n\tonRemove,\n\tonMoveUp,\n\tonMoveDown,\n}: TransitionRowProps) => {\n\tconst { t } = useTranslation()\n\n\tconst handleGotoChange = (selected: ReactSelectOption | ReactSelectOption[]) => {\n\t\tconst chosen = Array.isArray(selected) ? selected[0] : selected\n\t\tif (chosen) onChange({ ...transition, to: chosen.value as string })\n\t}\n\n\treturn (\n\t\t<div className=\"fb-flow-transition\">\n\t\t\t<div className=\"fb-flow-transition__header\">\n\t\t\t\t<span className=\"fb-flow-transition__label\">{t(keys.flowGoTo)}</span>\n\t\t\t\t<div className=\"fb-flow-transition__goto\">\n\t\t\t\t\t<ReactSelect\n\t\t\t\t\t\toptions={stepOptions}\n\t\t\t\t\t\tvalue={stepOptions.find((o) => o.value === transition.to) ?? undefined}\n\t\t\t\t\t\tplaceholder={t(keys.flowSelectStepPlaceholder)}\n\t\t\t\t\t\tisClearable={false}\n\t\t\t\t\t\tonChange={handleGotoChange}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"fb-flow-transition__actions\">\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclassName=\"fb-flow__move-btn\"\n\t\t\t\t\t\tonClick={onMoveUp}\n\t\t\t\t\t\tdisabled={isFirst}\n\t\t\t\t\t\taria-label={t(keys.flowMoveTransitionUp)}\n\t\t\t\t\t>\n\t\t\t\t\t\t↑\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclassName=\"fb-flow__move-btn\"\n\t\t\t\t\t\tonClick={onMoveDown}\n\t\t\t\t\t\tdisabled={isLast}\n\t\t\t\t\t\taria-label={t(keys.flowMoveTransitionDown)}\n\t\t\t\t\t>\n\t\t\t\t\t\t↓\n\t\t\t\t\t</button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonStyle=\"icon-label\"\n\t\t\t\t\t\ticon=\"x\"\n\t\t\t\t\t\tonClick={onRemove}\n\t\t\t\t\t\tmargin={false}\n\t\t\t\t\t\taria-label={t(keys.flowRemoveTransition)}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<span className=\"fb-flow-transition__when-label\">{t(keys.flowWhen)}</span>\n\t\t\t<div className=\"fb-flow-transition__condition\">\n\t\t\t\t<ConditionBuilder\n\t\t\t\t\tvalue={transition.when}\n\t\t\t\t\tonChange={(when) => onChange({ ...transition, when })}\n\t\t\t\t\tconditionTypes={conditionTypes}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\ntype StepCardProps = {\n\tstep: FlowStep\n\tstepKey: string\n\tstepIndex: number\n\tstepCount: number\n\totherStepOptions: FlowSelectOption[]\n\tholders: Map<string, number>\n\tstepLabels: string[]\n\tentries: FlowFieldEntry[]\n\tconditionTypes: Record<string, ConditionFieldType>\n\tisExpanded: boolean\n\tonToggle: () => void\n\tonChange: (next: FlowStep) => void\n\tonToggleField: (key: string, checked: boolean) => void\n\tonRemove: () => void\n\tonMoveUp: () => void\n\tonMoveDown: () => void\n\tonAddAbove: () => void\n\tonAddBelow: () => void\n}\n\nconst StepCard = ({\n\tstep,\n\tstepKey,\n\tstepIndex,\n\tstepCount,\n\totherStepOptions,\n\tholders,\n\tstepLabels,\n\tentries,\n\tconditionTypes,\n\tisExpanded,\n\tonToggle,\n\tonChange,\n\tonToggleField,\n\tonRemove,\n\tonMoveUp,\n\tonMoveDown,\n\tonAddAbove,\n\tonAddBelow,\n}: StepCardProps) => {\n\tconst { t } = useTranslation()\n\n\tconst nextOptions = nextSelectOptions({\n\t\tsequentialLabel: t(keys.flowNextSequential),\n\t\tterminalLabel: t(keys.flowNextTerminal),\n\t\totherSteps: otherStepOptions,\n\t})\n\n\tconst transitions = step.transitions ?? []\n\n\t// Stable per-transition keys, mirroring the step-level scheme so transition reorder/remove\n\t// reconciles by identity rather than array position.\n\tconst tKeysRef = useRef<string[]>([])\n\tif (tKeysRef.current.length !== transitions.length) {\n\t\ttKeysRef.current = transitions.map((_, i) => tKeysRef.current[i] ?? crypto.randomUUID())\n\t}\n\tconst tKeys = tKeysRef.current\n\n\tconst addTransition = () => {\n\t\tconst firstOtherStep = otherStepOptions[0]?.value\n\t\tif (firstOtherStep === undefined) return\n\t\ttKeysRef.current = [...tKeys, crypto.randomUUID()]\n\t\tonChange({\n\t\t\t...step,\n\t\t\ttransitions: [...transitions, { when: {}, to: firstOtherStep }],\n\t\t})\n\t}\n\n\tconst updateTransition = (index: number, next: FlowTransition) => {\n\t\tconst updated = [...transitions]\n\t\tupdated[index] = next\n\t\tonChange({ ...step, transitions: updated })\n\t}\n\n\tconst removeTransition = (index: number) => {\n\t\ttKeysRef.current = tKeys.filter((_, i) => i !== index)\n\t\tconst updated = transitions.filter((_, i) => i !== index)\n\t\tonChange({ ...step, transitions: updated.length > 0 ? updated : undefined })\n\t}\n\n\tconst moveTransition = (from: number, to: number) => {\n\t\tconst updated = [...transitions]\n\t\tconst [item] = updated.splice(from, 1)\n\t\tif (item !== undefined) updated.splice(to, 0, item)\n\t\tconst nextKeys = [...tKeys]\n\t\tconst [movedKey] = nextKeys.splice(from, 1)\n\t\tif (movedKey !== undefined) nextKeys.splice(to, 0, movedKey)\n\t\ttKeysRef.current = nextKeys\n\t\tonChange({ ...step, transitions: updated })\n\t}\n\n\tconst handleNextChange = (selected: ReactSelectOption | ReactSelectOption[]) => {\n\t\tconst chosen = Array.isArray(selected) ? selected[0] : selected\n\t\tif (chosen) onChange({ ...step, next: nextFromSelectValue(chosen.value as string) })\n\t}\n\n\tconst title = step.title?.trim() ?? ''\n\n\tconst stepHeader = (\n\t\t<div className=\"fb-flow-step__header-content\">\n\t\t\t<span className=\"fb-flow-step__index\">\n\t\t\t\t{resolveMessage(t(keys.flowStepFallbackTitle), { n: stepIndex + 1 })}\n\t\t\t</span>\n\t\t\t{title.length > 0 ? <span className=\"fb-flow-step__title\">{title}</span> : null}\n\t\t</div>\n\t)\n\n\treturn (\n\t\t<Collapsible\n\t\t\theader={stepHeader}\n\t\t\tactions={\n\t\t\t\t<Popup\n\t\t\t\t\tbutton={<MoreIcon />}\n\t\t\t\t\tbuttonType=\"default\"\n\t\t\t\t\thorizontalAlign=\"right\"\n\t\t\t\t\tsize=\"fit-content\"\n\t\t\t\t\tverticalAlign=\"bottom\"\n\t\t\t\t>\n\t\t\t\t\t<PopupList.ButtonGroup>\n\t\t\t\t\t\t<PopupList.Button onClick={onAddAbove}>{t(keys.flowAddAbove)}</PopupList.Button>\n\t\t\t\t\t\t<PopupList.Button onClick={onAddBelow}>{t(keys.flowAddBelow)}</PopupList.Button>\n\t\t\t\t\t\t<PopupList.Button onClick={onMoveUp} disabled={stepIndex === 0}>\n\t\t\t\t\t\t\tMove up\n\t\t\t\t\t\t</PopupList.Button>\n\t\t\t\t\t\t<PopupList.Button onClick={onMoveDown} disabled={stepIndex === stepCount - 1}>\n\t\t\t\t\t\t\tMove down\n\t\t\t\t\t\t</PopupList.Button>\n\t\t\t\t\t\t<PopupList.Button onClick={onRemove}>Remove</PopupList.Button>\n\t\t\t\t\t</PopupList.ButtonGroup>\n\t\t\t\t</Popup>\n\t\t\t}\n\t\t\tisCollapsed={!isExpanded}\n\t\t\tonToggle={() => onToggle()}\n\t\t\tclassName=\"fb-flow-step\"\n\t\t>\n\t\t\t<div className=\"fb-flow-step__body\">\n\t\t\t\t<TextInput\n\t\t\t\t\tpath={`fb-flow-step-${stepKey}-title`}\n\t\t\t\t\tlabel={t(keys.flowStepTitleLabel)}\n\t\t\t\t\tvalue={step.title ?? ''}\n\t\t\t\t\tonChange={(e: ChangeEvent<HTMLInputElement>) =>\n\t\t\t\t\t\tonChange({ ...step, title: e.target.value.length > 0 ? e.target.value : undefined })\n\t\t\t\t\t}\n\t\t\t\t/>\n\n\t\t\t\t<div className=\"fb-flow-step__row\">\n\t\t\t\t\t<FieldLabel label={t(keys.flowFields)} />\n\t\t\t\t\t{entries.length === 0 ? (\n\t\t\t\t\t\t<p className=\"fb-flow-step__hint\">{t(keys.flowNoFields)}</p>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<div className=\"fb-flow-step__field-picker\">\n\t\t\t\t\t\t\t{entries.map((entry) => {\n\t\t\t\t\t\t\t\tconst holder = holders.get(entry.key)\n\t\t\t\t\t\t\t\tconst inOtherStep = holder !== undefined && holder !== stepIndex\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<div key={entry.key} className=\"fb-flow-step__field-option\">\n\t\t\t\t\t\t\t\t\t\t<CheckboxInput\n\t\t\t\t\t\t\t\t\t\t\tlabel={entry.label}\n\t\t\t\t\t\t\t\t\t\t\tchecked={step.fields.includes(entry.key) || inOtherStep}\n\t\t\t\t\t\t\t\t\t\t\treadOnly={inOtherStep}\n\t\t\t\t\t\t\t\t\t\t\tonToggle={(e) => {\n\t\t\t\t\t\t\t\t\t\t\t\tif (inOtherStep) return\n\t\t\t\t\t\t\t\t\t\t\t\tonToggleField(entry.key, e.target.checked)\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t{inOtherStep ? (\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"fb-flow-step__field-hint\">\n\t\t\t\t\t\t\t\t\t\t\t\t{resolveMessage(t(keys.flowFieldInStep), {\n\t\t\t\t\t\t\t\t\t\t\t\t\tstep: stepLabels[holder] ?? '',\n\t\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"fb-flow-step__row\">\n\t\t\t\t\t<FieldLabel label={t(keys.flowDefaultNext)} />\n\t\t\t\t\t<ReactSelect\n\t\t\t\t\t\toptions={nextOptions}\n\t\t\t\t\t\tvalue={nextOptions.find((o) => o.value === nextToSelectValue(step.next)) ?? undefined}\n\t\t\t\t\t\tisClearable={false}\n\t\t\t\t\t\tonChange={handleNextChange}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"fb-flow-step__transitions\">\n\t\t\t\t\t<div className=\"fb-flow-step__transitions-header\">\n\t\t\t\t\t\t<FieldLabel label={t(keys.flowConditionalTransitions)} />\n\t\t\t\t\t\t<span className=\"fb-flow-step__hint\">{t(keys.flowFirstMatchWins)}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t{transitions.map((transition, tIndex) => {\n\t\t\t\t\t\tconst tKey = tKeys[tIndex]\n\t\t\t\t\t\tif (tKey === undefined) return null\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<TransitionRow\n\t\t\t\t\t\t\t\tkey={tKey}\n\t\t\t\t\t\t\t\ttransition={transition}\n\t\t\t\t\t\t\t\tstepOptions={otherStepOptions}\n\t\t\t\t\t\t\t\tconditionTypes={conditionTypes}\n\t\t\t\t\t\t\t\tisFirst={tIndex === 0}\n\t\t\t\t\t\t\t\tisLast={tIndex === transitions.length - 1}\n\t\t\t\t\t\t\t\tonChange={(next) => updateTransition(tIndex, next)}\n\t\t\t\t\t\t\t\tonRemove={() => removeTransition(tIndex)}\n\t\t\t\t\t\t\t\tonMoveUp={() => moveTransition(tIndex, tIndex - 1)}\n\t\t\t\t\t\t\t\tonMoveDown={() => moveTransition(tIndex, tIndex + 1)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonStyle=\"icon-label\"\n\t\t\t\t\t\ticon=\"plus\"\n\t\t\t\t\t\ticonStyle=\"with-border\"\n\t\t\t\t\t\ticonPosition=\"left\"\n\t\t\t\t\t\tonClick={addTransition}\n\t\t\t\t\t\tmargin={false}\n\t\t\t\t\t>\n\t\t\t\t\t\t{t(keys.flowAddTransition)}\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Collapsible>\n\t)\n}\n\nexport const FlowBuilder = (props: FlowBuilderProps) => {\n\tconst { setValue, value } = useField<FormFlow | undefined>()\n\tconst { t } = useTranslation()\n\tconst label = toStaticLabel(props.field?.label ?? props.label)\n\tconst [expandedKeys, setExpandedKeys] = useState<Set<string>>(new Set())\n\n\tconst fieldRowsJson = useFormFields(([fields]) =>\n\t\tJSON.stringify(extractFieldRows(reduceFieldsToValues(fields, true) as Record<string, unknown>))\n\t)\n\t// Registry labels may be host-registered keys or literals; Payload's `t` returns unknown keys unchanged.\n\tconst translatedBareLabels = useMemo(\n\t\t() =>\n\t\t\tObject.fromEntries(\n\t\t\t\tObject.entries(props.bareTypeLabels ?? {}).map(([type, label]) => [\n\t\t\t\t\ttype,\n\t\t\t\t\tt(label as TranslationKey),\n\t\t\t\t])\n\t\t\t),\n\t\t[props.bareTypeLabels, t]\n\t)\n\tconst entries = useMemo(\n\t\t() => flowFieldEntries(JSON.parse(fieldRowsJson) as FieldRow[], translatedBareLabels),\n\t\t[fieldRowsJson, translatedBareLabels]\n\t)\n\n\tconst steps = value?.steps ?? []\n\tconst fallbackTitle = t(keys.flowStepFallbackTitle)\n\tconst stepLabels = steps.map((step, index) => stepLabel(step, index, fallbackTitle))\n\tconst stepOptions = stepSelectOptions(steps, stepLabels)\n\tconst holders = fieldHolders(steps)\n\tconst unassigned = unassignedEntries(entries, steps)\n\n\t// Stable per-step React keys, independent of step ids. Reorder/insert/remove reconcile by\n\t// identity so focused inputs and each step's expand state stay with their step instead of\n\t// jumping to whichever step now sits at that array position.\n\tconst keysRef = useRef<string[]>([])\n\tif (keysRef.current.length !== steps.length) {\n\t\tkeysRef.current = steps.map((_, i) => keysRef.current[i] ?? crypto.randomUUID())\n\t}\n\tconst stepKeys = keysRef.current\n\n\tconst toggleExpanded = (key: string) => {\n\t\tsetExpandedKeys((prev) => {\n\t\t\tconst next = new Set(prev)\n\t\t\tif (next.has(key)) next.delete(key)\n\t\t\telse next.add(key)\n\t\t\treturn next\n\t\t})\n\t}\n\n\tconst emit = (nextSteps: FlowStep[], nextKeys: string[]) => {\n\t\tkeysRef.current = nextKeys\n\t\tsetValue({ steps: nextSteps } as FormFlow)\n\t}\n\n\tconst insertStep = (at: number) => {\n\t\tconst key = crypto.randomUUID()\n\t\tconst nextSteps = [...steps]\n\t\tnextSteps.splice(at, 0, { id: crypto.randomUUID(), fields: [] })\n\t\tconst nextKeys = [...stepKeys]\n\t\tnextKeys.splice(at, 0, key)\n\t\temit(nextSteps, nextKeys)\n\t\tsetExpandedKeys((prev) => new Set(prev).add(key))\n\t}\n\n\tconst addStep = () => insertStep(steps.length)\n\n\tconst updateStep = (index: number, next: FlowStep) => {\n\t\temit(\n\t\t\tsteps.map((s, i) => (i === index ? next : s)),\n\t\t\tstepKeys\n\t\t)\n\t}\n\n\tconst toggleField = (stepIndex: number, key: string, checked: boolean) => {\n\t\tconst nextSteps = checked\n\t\t\t? assignFieldToStep(steps, stepIndex, key)\n\t\t\t: removeFieldFromStep(steps, stepIndex, key)\n\t\temit(nextSteps, stepKeys)\n\t}\n\n\tconst assignUnassignedField = (key: string, stepId: string) => {\n\t\tconst targetIndex = steps.findIndex((s) => s.id === stepId)\n\t\tif (targetIndex === -1) return\n\t\temit(assignFieldToStep(steps, targetIndex, key), stepKeys)\n\t}\n\n\tconst removeStep = (index: number) => {\n\t\tconst removedKey = stepKeys[index]\n\t\temit(\n\t\t\tremoveStepCascade(steps, index),\n\t\t\tstepKeys.filter((_, i) => i !== index)\n\t\t)\n\t\tif (removedKey !== undefined) {\n\t\t\tsetExpandedKeys((prev) => {\n\t\t\t\tconst next = new Set(prev)\n\t\t\t\tnext.delete(removedKey)\n\t\t\t\treturn next\n\t\t\t})\n\t\t}\n\t}\n\n\tconst moveStep = (from: number, to: number) => {\n\t\tconst nextSteps = [...steps]\n\t\tconst [movedStep] = nextSteps.splice(from, 1)\n\t\tif (movedStep === undefined) return\n\t\tnextSteps.splice(to, 0, movedStep)\n\t\tconst nextKeys = [...stepKeys]\n\t\tconst [movedKey] = nextKeys.splice(from, 1)\n\t\tif (movedKey !== undefined) nextKeys.splice(to, 0, movedKey)\n\t\temit(nextSteps, nextKeys)\n\t}\n\n\treturn (\n\t\t<div className=\"field-type fb-flow-builder\">\n\t\t\t<div className=\"blocks-field__header\">\n\t\t\t\t<div className=\"blocks-field__header-wrap\">\n\t\t\t\t\t<h3>{typeof label === 'string' ? label : t(keys.flowFallbackTitle)}</h3>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<p className=\"fb-flow-builder__description\">{t(keys.flowDescription)}</p>\n\t\t\t{steps.length === 0 ? (\n\t\t\t\t<p className=\"fb-flow-builder__hint\">{t(keys.flowNoSteps)}</p>\n\t\t\t) : (\n\t\t\t\t<div className=\"fb-flow-builder__steps\">\n\t\t\t\t\t{steps.map((step, index) => {\n\t\t\t\t\t\tconst key = stepKeys[index]\n\t\t\t\t\t\tif (key === undefined) return null\n\t\t\t\t\t\tconst otherStepOptions = otherStepSelectOptions(stepOptions, step.id)\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<StepCard\n\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\tstepKey={key}\n\t\t\t\t\t\t\t\tstep={step}\n\t\t\t\t\t\t\t\tstepIndex={index}\n\t\t\t\t\t\t\t\tstepCount={steps.length}\n\t\t\t\t\t\t\t\totherStepOptions={otherStepOptions}\n\t\t\t\t\t\t\t\tholders={holders}\n\t\t\t\t\t\t\t\tstepLabels={stepLabels}\n\t\t\t\t\t\t\t\tentries={entries}\n\t\t\t\t\t\t\t\tconditionTypes={props.conditionTypes}\n\t\t\t\t\t\t\t\tisExpanded={expandedKeys.has(key)}\n\t\t\t\t\t\t\t\tonToggle={() => toggleExpanded(key)}\n\t\t\t\t\t\t\t\tonChange={(next) => updateStep(index, next)}\n\t\t\t\t\t\t\t\tonToggleField={(fieldKey, checked) => toggleField(index, fieldKey, checked)}\n\t\t\t\t\t\t\t\tonRemove={() => removeStep(index)}\n\t\t\t\t\t\t\t\tonMoveUp={() => moveStep(index, index - 1)}\n\t\t\t\t\t\t\t\tonMoveDown={() => moveStep(index, index + 1)}\n\t\t\t\t\t\t\t\tonAddAbove={() => insertStep(index)}\n\t\t\t\t\t\t\t\tonAddBelow={() => insertStep(index + 1)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{steps.length > 0 && unassigned.length > 0 ? (\n\t\t\t\t<div className=\"fb-flow-unassigned\">\n\t\t\t\t\t<FieldLabel label={t(keys.flowUnassigned)} />\n\t\t\t\t\t<div className=\"fb-flow-unassigned__rows\">\n\t\t\t\t\t\t{unassigned.map((entry) => (\n\t\t\t\t\t\t\t<div key={entry.key} className=\"fb-flow-unassigned__row\">\n\t\t\t\t\t\t\t\t<span className=\"fb-flow-unassigned__name\">{entry.label}</span>\n\t\t\t\t\t\t\t\t<div className=\"fb-flow-unassigned__select\">\n\t\t\t\t\t\t\t\t\t<ReactSelect\n\t\t\t\t\t\t\t\t\t\toptions={stepOptions}\n\t\t\t\t\t\t\t\t\t\tplaceholder={t(keys.flowAssignToStep)}\n\t\t\t\t\t\t\t\t\t\tisClearable={false}\n\t\t\t\t\t\t\t\t\t\tonChange={(selected: ReactSelectOption | ReactSelectOption[]) => {\n\t\t\t\t\t\t\t\t\t\t\tconst chosen = Array.isArray(selected) ? selected[0] : selected\n\t\t\t\t\t\t\t\t\t\t\tif (chosen) assignUnassignedField(entry.key, chosen.value as string)\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t) : null}\n\t\t\t<div className=\"fb-flow-builder__actions\">\n\t\t\t\t<Button\n\t\t\t\t\tbuttonStyle=\"icon-label\"\n\t\t\t\t\ticon=\"plus\"\n\t\t\t\t\ticonStyle=\"with-border\"\n\t\t\t\t\ticonPosition=\"left\"\n\t\t\t\t\tonClick={addStep}\n\t\t\t\t\tmargin={false}\n\t\t\t\t>\n\t\t\t\t\tAdd step\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n"],"mappings":"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"}

package/dist/client/FormConditionField.d.ts

@@ -0,0 +1,21 @@
+import { ConditionFieldType } from "../conditions/fieldTypes.js";
+
+//#region src/client/FormConditionField.d.ts
+/** Props: standard JSON field client props plus the `conditionTypes` map we pass via clientProps. */
+type FormConditionFieldProps = {
+  path?: string;
+  field?: {
+    label?: unknown;
+    name?: string;
+  };
+  label?: unknown;
+  conditionTypes: Record<string, ConditionFieldType>;
+};
+/**
+ * The `Field` mounted on a form field's `visibleWhen`/`validateWhen` json column. Binds the field's own
+ * path with `useField<Where>()` (the QueryPresetsWhereField precedent) and renders the native builder.
+ */
+declare const FormConditionField: (props: FormConditionFieldProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { FormConditionField };
+//# sourceMappingURL=FormConditionField.d.ts.map

package/dist/client/FormConditionField.js

@@ -0,0 +1,30 @@
+"use client";
+import { toStaticLabel } from "./toStaticLabel.js";
+import { ConditionBuilder } from "./ConditionBuilder.js";
+import { FieldLabel, useField } from "@payloadcms/ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/client/FormConditionField.tsx
+/**
+* The `Field` mounted on a form field's `visibleWhen`/`validateWhen` json column. Binds the field's own
+* path with `useField<Where>()` (the QueryPresetsWhereField precedent) and renders the native builder.
+*/
+const FormConditionField = (props) => {
+	const { path, setValue, value } = useField();
+	return /* @__PURE__ */ jsxs("div", {
+		className: "field-type",
+		style: { marginBlockEnd: "1rem" },
+		children: [/* @__PURE__ */ jsx(FieldLabel, {
+			label: toStaticLabel(props.field?.label ?? props.label),
+			path
+		}), /* @__PURE__ */ jsx(ConditionBuilder, {
+			value: value ?? void 0,
+			onChange: setValue,
+			conditionTypes: props.conditionTypes,
+			selfName: props.field?.name
+		})]
+	});
+};
+//#endregion
+export { FormConditionField };
+
+//# sourceMappingURL=FormConditionField.js.map

package/dist/client/FormConditionField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormConditionField.js","names":[],"sources":["../../src/client/FormConditionField.tsx"],"sourcesContent":["'use client'\n\nimport { FieldLabel, useField } from '@payloadcms/ui'\nimport type { Where } from 'payload'\nimport type { ConditionFieldType } from '../conditions/fieldTypes'\nimport { ConditionBuilder } from './ConditionBuilder'\nimport { toStaticLabel } from './toStaticLabel'\n\n/** Props: standard JSON field client props plus the `conditionTypes` map we pass via clientProps. */\nexport type FormConditionFieldProps = {\n\tpath?: string\n\tfield?: { label?: unknown; name?: string }\n\tlabel?: unknown\n\tconditionTypes: Record<string, ConditionFieldType>\n}\n\n/**\n * The `Field` mounted on a form field's `visibleWhen`/`validateWhen` json column. Binds the field's own\n * path with `useField<Where>()` (the QueryPresetsWhereField precedent) and renders the native builder.\n */\nexport const FormConditionField = (props: FormConditionFieldProps) => {\n\tconst { path, setValue, value } = useField<Where>()\n\tconst label = toStaticLabel(props.field?.label ?? props.label)\n\treturn (\n\t\t<div className=\"field-type\" style={{ marginBlockEnd: '1rem' }}>\n\t\t\t<FieldLabel label={label} path={path} />\n\t\t\t<ConditionBuilder\n\t\t\t\tvalue={value ?? undefined}\n\t\t\t\tonChange={setValue}\n\t\t\t\tconditionTypes={props.conditionTypes}\n\t\t\t\tselfName={props.field?.name}\n\t\t\t/>\n\t\t</div>\n\t)\n}\n"],"mappings":";;;;;;;;;;AAoBA,MAAa,sBAAsB,UAAmC;CACrE,MAAM,EAAE,MAAM,UAAU,UAAU,SAAgB;CAElD,OACC,qBAAC,OAAD;EAAK,WAAU;EAAa,OAAO,EAAE,gBAAgB,OAAO;YAA5D,CACC,oBAAC,YAAD;GAAY,OAHA,cAAc,MAAM,OAAO,SAAS,MAAM,KAG/B;GAAS;EAAO,CAAA,GACvC,oBAAC,kBAAD;GACC,OAAO,SAAS,KAAA;GAChB,UAAU;GACV,gBAAgB,MAAM;GACtB,UAAU,MAAM,OAAO;EACvB,CAAA,CACG;;AAEP"}

package/dist/client/RecipientsSelect.d.ts

@@ -0,0 +1,31 @@
+import { TranslationKey } from "../translations/keys.js";
+
+//#region src/client/RecipientsSelect.d.ts
+type RecipientsSelectProps = {
+  path?: string;
+  field?: {
+    label?: unknown;
+    required?: boolean;
+    admin?: {
+      description?: unknown;
+      width?: string;
+    };
+  };
+  label?: unknown;
+  readOnly?: boolean; /** Endpoint subpath supplying preset address options (e.g. `'departments'`); omit for none. */
+  endpoint?: string; /** Allow free-typed emails (default true). */
+  allowCustom?: boolean; /** Offer the form's own fields as recipient tokens (default true). */
+  fieldTokens?: boolean; /** Field types eligible as tokens (default `['email']`). */
+  tokenFieldTypes?: string[];
+  descriptionKey?: TranslationKey;
+};
+/**
+ * A creatable, multi-value recipient field: pick a department (preset options from `endpoint`), pick a
+ * form-field token (`{{field}}`, offered when `fieldTokens`), or type any email and press Enter
+ * (`allowCustom`). Renders as native Payload badges (drag-reorderable), stores a `string[]`, honors
+ * `admin.width` and the standard field props. Unknown or legacy stored values stay selectable.
+ */
+declare const RecipientsSelect: (props: RecipientsSelectProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { RecipientsSelect };
+//# sourceMappingURL=RecipientsSelect.d.ts.map