@corensystem/coren-ui 1.0.0-next.20260924.75108.887a9c2

package/dist/pages/state-machine.mjs

@@ -0,0 +1,2254 @@
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../accordion.mjs";
+import { Badge } from "../badge.mjs";
+import { HoverTooltip } from "../tooltip.mjs";
+import { Button } from "../button.mjs";
+import { Card, CardContent, CardHeader, CardTitle } from "../card.mjs";
+import { Empty } from "../empty.mjs";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "../tabs.mjs";
+import { Label } from "../label.mjs";
+import { Input } from "../input.mjs";
+import { Switch } from "../switch.mjs";
+import { Textarea } from "../textarea.mjs";
+import { Banner } from "../banner.mjs";
+import { ToggleGroup, ToggleGroupItem } from "../toggle-group.mjs";
+import { Combobox } from "../combobox.mjs";
+import { ConfirmDialog } from "../confirm-dialog.mjs";
+import { DataTable, DataTableColumnHeader } from "../data-table.mjs";
+import { GraphCanvas, Handle, MarkerType, Panel, Position, useEdgesState, useNodesState, useReactFlow } from "../graph-canvas.mjs";
+import { RecordDetailShell } from "../record-detail-shell.mjs";
+import { getObjectType } from "./wc3-ontology-data.mjs";
+import { Mono, TypeGlyphLabel, lineageNav } from "./wc3-lineage-shared.mjs";
+import { processRowAgeHours, processRowOverSla, processRowSlaHours, processStateOf, processTokens } from "./wc3-process-data.mjs";
+import { CustomTag, KindLegend, ProcessGlyphTile, ProcessProvenanceNote, ProductChip, ProposedTag, SlaModelBadge, StateChip, StateFlagBadges, TransitionKindBadge, WC3_PROCESS_EDIT_INITIAL, WC3_PROCESS_ICONS, WC3_PROCESS_MESSAGES, WC3_PROCESS_STATE_COLORS, addState, addTransition, checkTransition, deleteState, deleteTransition, formatHours, moveState, processFacts, processLayout, processRowKeys, processRowPk, processRowTitle, processSlaModel, rebindTransition, stateDeleteBlockReason, transitionAction, updateProcessMeta, updateState } from "./wc3-process-shared.mjs";
+import { PermitPolicySection, WC3_PERMIT_POLICY_INITIAL } from "./wc3-permit-policy.mjs";
+import { ProcessBottlenecksSection } from "./wc3-process-bottlenecks.mjs";
+import { cn } from "@corensystem/coren-utils";
+import { ArrowLeft, ArrowRight, ChevronDown, ChevronUp, CircleDot, ClipboardList, Clock, GitBranch, LayoutGrid, Plus, Rows3, Settings2, ShieldCheck, Trash2, TriangleAlert, Workflow, X, XCircle } from "lucide-react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/pages/state-machine.tsx
+const STATE_CATEGORIES = [
+	"draft",
+	"pending",
+	"active",
+	"terminal"
+];
+const STATE_TYPES = [
+	"initial",
+	"intermediate",
+	"terminal"
+];
+/**
+* How much of a state's identity colour goes into its node.
+*
+* Enough to tell two states apart at a glance and to match the dot the rail prints beside the same
+* state; not enough to fight the default node's own border or to stop the label reading. It is mixed
+* into React Flow's node background, so one number covers light and dark.
+*/
+const WC3_PROCESS_NODE_TINT = "14%";
+/** Stable identities, so an omitted prop does not change a memo's deps on every render. */
+const NO_ACTIONS = [];
+const NO_EFFECTS = [];
+const NO_ROWS = [];
+/**
+* The five behavioural flags, in the order the permit editor reads them out.
+*
+* These default to the built-in five rather than to empty, unlike the vocabularies above, and the
+* difference is real: `Wc3ProcessState.flags` is a closed union in the MODEL, so these are labels
+* for something the widget already understands rather than a list only the host can know. Pass
+* `stateFlags` to relabel them, to reorder them, or to offer fewer.
+*/
+const DEFAULT_STATE_FLAGS = [
+	{
+		flag: "monitored",
+		label: "Monitored"
+	},
+	{
+		flag: "authorizesWork",
+		label: "Authorizes work"
+	},
+	{
+		flag: "editableAnswers",
+		label: "Answers editable"
+	},
+	{
+		flag: "mutableReceiver",
+		label: "Receiver editable"
+	},
+	{
+		flag: "reopenable",
+		label: "Reopenable"
+	}
+];
+const StateMachineDataContext = createContext({
+	actions: NO_ACTIONS,
+	effects: NO_EFFECTS,
+	stateFlags: DEFAULT_STATE_FLAGS,
+	instances: NO_ROWS,
+	readOnly: false
+});
+/** Everything the host supplied, for the pieces too deep to prop-drill to. */
+function useStateMachineData() {
+	return useContext(StateMachineDataContext);
+}
+/** The bound-action picker's options, in Combobox shape. */
+const actionOptions = (actions) => actions.map((a) => ({
+	value: a.id,
+	label: a.label
+}));
+/**
+* A state on the canvas, drawn as React Flow's OWN default node.
+*
+* This used to paint a bespoke box: an identity colour strip, the category and graph role, the
+* custom / proposed markers, the behavioural flags, a live token pill and an SLA tint, all inside a
+* fixed 176×66 frame. Next to the graphs on reactflow.dev/examples it read as noise — five type
+* sizes in a box the size of a business card, a different stroke colour per transition kind, and
+* orthogonal wiring fighting the curves. The whole canvas is back on React Flow's defaults: default
+* node chrome, default `#b1b1b7` bezier edges, default handles, default selection. The readouts it
+* dropped are all still on the page — the rail's state inspector and the Instances section.
+*
+* Registered under the `default` KEY, not a name of our own, and that is what buys the default look:
+* React Flow classes every node `react-flow__node-<type>`, so `type: "default"` picks up the
+* library's own node CSS — fill, 1px border, radius, 150px width, 12px centred text, hover and
+* selected shadow — while this component still supplies the four handles below.
+*
+* FOUR explicit handles, not two. A self-transition and a backward edge only render when source and
+* target resolve to DIFFERENT handles: with in/out alone the extension loop would draw nothing and
+* every reject_loop / reopen edge would overlay the forward edge it runs beside.
+*/
+function ProcessFlowNode({ data }) {
+	const { state } = data;
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx(Handle, {
+			id: "in",
+			type: "target",
+			position: Position.Left,
+			title: "incoming"
+		}),
+		/* @__PURE__ */ jsx(Handle, {
+			id: "back-in",
+			type: "target",
+			position: Position.Top,
+			title: "incoming (loop / backward)"
+		}),
+		state.name,
+		/* @__PURE__ */ jsx(Handle, {
+			id: "out",
+			type: "source",
+			position: Position.Right,
+			title: "outgoing"
+		}),
+		/* @__PURE__ */ jsx(Handle, {
+			id: "back-out",
+			type: "source",
+			position: Position.Bottom,
+			title: "outgoing (loop / backward)"
+		})
+	] });
+}
+const PROCESS_NODE_TYPES = { default: ProcessFlowNode };
+function ProcessRailCard({ title, count, children }) {
+	return /* @__PURE__ */ jsxs(Card, {
+		className: "wwc:shrink-0",
+		children: [/* @__PURE__ */ jsx(CardHeader, {
+			className: "wwc:p-3",
+			children: /* @__PURE__ */ jsxs(CardTitle, {
+				className: "wwc:text-sm",
+				children: [title, count !== void 0 ? /* @__PURE__ */ jsxs("span", {
+					className: "wwc:font-normal wwc:text-muted-foreground",
+					children: [
+						" (",
+						count,
+						")"
+					]
+				}) : null]
+			})
+		}), /* @__PURE__ */ jsx(CardContent, {
+			className: "wwc:p-3 wwc:pt-0",
+			children
+		})]
+	});
+}
+/**
+* Mounted with `key={state.id}` so its uncontrolled inputs and its inline errors reset when the
+* selection moves — the same reason the pipeline's node inspector keys on its node.
+*/
+/**
+* The vocabulary "Add effect…" offers.
+*
+* FIXTURE, not a contract. The engine's real effect set is not modelled anywhere in this repo — the
+* permit process's own SLA note mentions `start_sla_timer` in passing and nothing else — so this is
+* a plausible list to author against, kept small and named the way the note names its one example.
+* Replace it with the engine's list when there is one; every consumer reads it from here.
+*/
+const WC3_PROCESS_EFFECTS = [
+	{
+		id: "start_sla_timer",
+		label: "start_sla_timer",
+		note: "Begins this state's SLA clock on the permit."
+	},
+	{
+		id: "stop_sla_timer",
+		label: "stop_sla_timer",
+		note: "Stops any running SLA clock."
+	},
+	{
+		id: "notify_receiver",
+		label: "notify_receiver",
+		note: "Notifies the permit's receiver."
+	},
+	{
+		id: "notify_issuer",
+		label: "notify_issuer",
+		note: "Notifies the issuing authority."
+	},
+	{
+		id: "lock_answers",
+		label: "lock_answers",
+		note: "Freezes the permit's answers against further edits."
+	},
+	{
+		id: "unlock_answers",
+		label: "unlock_answers",
+		note: "Reopens the permit's answers for editing."
+	},
+	{
+		id: "write_audit_entry",
+		label: "write_audit_entry",
+		note: "Writes an extra audit line beyond the implicit one."
+	}
+];
+/**
+* Mounted with `key={state.id}` so its uncontrolled inputs and its inline errors reset when the
+* selection moves — the same reason the pipeline's node inspector keys on its node.
+*
+* Entry requirements and effects are COLLAPSED by default. They are the deep end of a state — most
+* edits here are a rename or a flag — and an always-open pair of pickers would push the next state
+* in the list off the screen for the sake of two lines that usually read "none".
+*/
+function StateInspector({ process, state, onChange, onDelete, onSelectTransition, authoring = false }) {
+	const [nameErr, setNameErr] = useState(null);
+	const [slaErr, setSlaErr] = useState(null);
+	const [showEntry, setShowEntry] = useState(false);
+	const { actions, effects: effectOptions, stateFlags, instances } = useStateMachineData();
+	const objectType = getObjectType(process.objectTypeId);
+	const tokens = processTokens(process, state.id, [...instances]);
+	const outgoing = process.transitions.filter((t) => t.from === state.id);
+	const severityDriven = processSlaModel(process) === "severity";
+	const requirements = state.entryRequirements ?? [];
+	const effects = state.entryEffects ?? [];
+	const commitName = (value) => {
+		const next = value.trim();
+		if (!next) {
+			setNameErr(WC3_PROCESS_MESSAGES.nameRequired);
+			return;
+		}
+		if (process.states.some((s) => s.id !== state.id && (s.name.toLowerCase() === next.toLowerCase() || s.value.toLowerCase() === next.toLowerCase()))) {
+			setNameErr(WC3_PROCESS_MESSAGES.stateNameTaken);
+			return;
+		}
+		setNameErr(null);
+		onChange(updateState(process, state.id, { name: next }));
+	};
+	const commitSla = (raw) => {
+		const trimmed = raw.trim();
+		if (!trimmed) {
+			setSlaErr(null);
+			onChange(updateState(process, state.id, { slaHours: null }));
+			return;
+		}
+		const value = Number(trimmed);
+		if (!Number.isFinite(value) || value <= 0) {
+			setSlaErr(WC3_PROCESS_MESSAGES.slaPositive);
+			return;
+		}
+		setSlaErr(null);
+		onChange(updateState(process, state.id, { slaHours: value }));
+	};
+	const toggleFlag = (flag) => {
+		const next = state.flags.includes(flag) ? state.flags.filter((f) => f !== flag) : [...state.flags, flag];
+		onChange(updateState(process, state.id, { flags: next }));
+	};
+	const setRequirements = (next) => onChange(updateState(process, state.id, { entryRequirements: next }));
+	const setEffects = (next) => onChange(updateState(process, state.id, { entryEffects: next }));
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-3",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:grid wwc:gap-3 wwc:@md:grid-cols-2",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "wwc:space-y-1.5",
+						children: [/* @__PURE__ */ jsx(Label, {
+							htmlFor: `state-key-${state.id}`,
+							children: "Key (auto)"
+						}), /* @__PURE__ */ jsx(Input, {
+							id: `state-key-${state.id}`,
+							value: state.value,
+							disabled: true,
+							readOnly: true,
+							className: "wwc:font-mono wwc:text-xs"
+						})]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "wwc:space-y-1.5",
+						children: [
+							/* @__PURE__ */ jsx(Label, {
+								htmlFor: `state-label-${state.id}`,
+								children: "Label"
+							}),
+							/* @__PURE__ */ jsx(Input, {
+								id: `state-label-${state.id}`,
+								defaultValue: state.name,
+								"aria-invalid": nameErr !== null,
+								className: cn(nameErr && "wwc:border-destructive"),
+								onBlur: (event) => commitName(event.target.value)
+							}),
+							nameErr && /* @__PURE__ */ jsx("p", {
+								className: "wwc:text-xs wwc:text-destructive",
+								children: nameErr
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "wwc:space-y-1.5",
+						children: [/* @__PURE__ */ jsx(Label, { children: "Category" }), /* @__PURE__ */ jsx(Combobox, {
+							options: STATE_CATEGORIES.map((value) => ({
+								value,
+								label: value
+							})),
+							value: state.category,
+							onValueChange: (value) => onChange(updateState(process, state.id, { category: value })),
+							className: "wwc:w-full"
+						})]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "wwc:space-y-1.5",
+						children: [/* @__PURE__ */ jsx(Label, { children: "Type" }), /* @__PURE__ */ jsx(Combobox, {
+							options: STATE_TYPES.map((value) => ({
+								value,
+								label: value
+							})),
+							value: state.type,
+							onValueChange: (value) => onChange(updateState(process, state.id, { type: value })),
+							className: "wwc:w-full"
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "wwc:grid wwc:gap-2",
+				children: stateFlags.map(({ flag, label }) => /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:items-center wwc:gap-2",
+					children: [/* @__PURE__ */ jsx(Switch, {
+						id: `state-${state.id}-${flag}`,
+						checked: state.flags.includes(flag),
+						onCheckedChange: () => toggleFlag(flag)
+					}), /* @__PURE__ */ jsx(Label, {
+						htmlFor: `state-${state.id}-${flag}`,
+						className: "wwc:text-xs wwc:font-normal",
+						children: label
+					})]
+				}, flag))
+			}),
+			!authoring && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "wwc:space-y-1.5",
+					children: [
+						/* @__PURE__ */ jsx(Label, {
+							htmlFor: `state-sla-${state.id}`,
+							children: "SLA (hours)"
+						}),
+						/* @__PURE__ */ jsx(Input, {
+							id: `state-sla-${state.id}`,
+							defaultValue: state.slaHours ?? "",
+							disabled: severityDriven,
+							placeholder: "none",
+							"aria-invalid": slaErr !== null,
+							className: cn(slaErr && "wwc:border-destructive"),
+							onBlur: (event) => commitSla(event.target.value)
+						}),
+						slaErr && /* @__PURE__ */ jsx("p", {
+							className: "wwc:text-xs wwc:text-destructive",
+							children: slaErr
+						}),
+						severityDriven && /* @__PURE__ */ jsx("p", {
+							className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+							children: WC3_PROCESS_MESSAGES.severitySlaOverride
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "wwc:space-y-1.5",
+					children: [/* @__PURE__ */ jsx(Label, { children: "Colour" }), /* @__PURE__ */ jsx("div", {
+						className: "wwc:flex wwc:flex-wrap wwc:gap-1.5",
+						children: WC3_PROCESS_STATE_COLORS.map((color) => /* @__PURE__ */ jsx("button", {
+							type: "button",
+							"aria-label": color,
+							"aria-pressed": state.color === color,
+							className: cn("wwc:size-5 wwc:rounded-full wwc:border", state.color === color ? "wwc:border-primary wwc:ring-1 wwc:ring-primary" : "wwc:border-border"),
+							style: { background: color },
+							onClick: () => onChange(updateState(process, state.id, { color }))
+						}, color))
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "wwc:space-y-1 wwc:rounded-md wwc:border wwc:border-border wwc:p-2.5",
+					children: [/* @__PURE__ */ jsx("div", {
+						className: "wwc:text-[10px] wwc:font-semibold wwc:tracking-wider wwc:text-muted-foreground wwc:uppercase",
+						children: "Outgoing transitions"
+					}), outgoing.length === 0 ? /* @__PURE__ */ jsx("p", {
+						className: "wwc:text-xs wwc:text-muted-foreground",
+						children: "None. A non-terminal state without an outgoing transition fails rule L5."
+					}) : /* @__PURE__ */ jsx("div", {
+						className: "wwc:space-y-1",
+						children: outgoing.map((t) => /* @__PURE__ */ jsxs("button", {
+							type: "button",
+							className: "wwc:flex wwc:w-full wwc:items-center wwc:gap-1.5 wwc:text-left wwc:text-xs wwc:hover:underline",
+							onClick: () => onSelectTransition(t.id),
+							children: [/* @__PURE__ */ jsx(Mono, { children: t.key }), /* @__PURE__ */ jsx(TransitionKindBadge, { kind: t.kind })]
+						}, t.id))
+					})]
+				}),
+				/* @__PURE__ */ jsxs("p", {
+					className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+					children: [
+						tokens.length,
+						" live ",
+						objectType?.displayName ?? "row",
+						tokens.length === 1 ? "" : "s",
+						" in this state."
+					]
+				})
+			] }),
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:space-y-3 wwc:border-t wwc:border-border wwc:pt-3",
+				children: [/* @__PURE__ */ jsxs(Button, {
+					variant: "outline",
+					size: "sm",
+					"aria-expanded": showEntry,
+					className: "wwc:gap-1.5",
+					onClick: () => setShowEntry((open) => !open),
+					children: [/* @__PURE__ */ jsx(ChevronDown, { className: cn("wwc:h-3.5 wwc:w-3.5 wwc:transition-transform", showEntry && "wwc:rotate-180") }), "Entry requirements"]
+				}), showEntry && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(EntryList, {
+					title: "Entry requirements",
+					description: `Collected before a permit may REACH “${state.name}”, on any incoming transition.`,
+					empty: "None required here.",
+					placeholder: "Add required action…",
+					options: actionOptions(actions),
+					values: requirements,
+					labelOf: (id) => actions.find((a) => a.id === id)?.label ?? id,
+					onChange: setRequirements
+				}), /* @__PURE__ */ jsx(EntryList, {
+					title: "Entry effects",
+					description: `Applied in this order whenever a permit ENTERS “${state.name}”, in the commit phase and after the incoming edge’s own effects. Reordering them changes what the permit ends up with.`,
+					empty: "No effects beyond the implicit audit entry.",
+					placeholder: "Add effect…",
+					options: effectOptions.map((effect) => ({
+						value: effect.id,
+						label: effect.label
+					})),
+					values: effects,
+					labelOf: (id) => effectOptions.find((effect) => effect.id === id)?.label ?? id,
+					ordered: true,
+					onChange: setEffects
+				})] })]
+			}),
+			/* @__PURE__ */ jsxs(Button, {
+				variant: "outline",
+				size: "sm",
+				className: "wwc:w-full wwc:gap-1.5 wwc:text-destructive",
+				onClick: onDelete,
+				children: [/* @__PURE__ */ jsx(Trash2, { className: "wwc:h-3.5 wwc:w-3.5" }), "Delete state"]
+			})
+		]
+	});
+}
+/**
+* One entry list — requirements or effects. Same shape both times: a heading, what it means, the
+* current entries, and a picker that only offers what is not already in the list.
+*
+* `ordered` adds move-up / move-down, because for EFFECTS the order is the behaviour — the panel
+* says so in its own description — while a requirement is a set and numbering it would imply a
+* sequence that does not exist.
+*/
+function EntryList({ title, description, empty, placeholder, options, values, labelOf, ordered = false, onChange }) {
+	const remaining = options.filter((option) => !values.includes(option.value));
+	const move = (index, by) => {
+		const next = [...values];
+		const target = index + by;
+		if (target < 0 || target >= next.length) return;
+		[next[index], next[target]] = [next[target], next[index]];
+		onChange(next);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-1.5",
+		children: [
+			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("div", {
+				className: "wwc:text-xs wwc:font-semibold",
+				children: title
+			}), /* @__PURE__ */ jsx("p", {
+				className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+				children: description
+			})] }),
+			values.length === 0 ? /* @__PURE__ */ jsx("p", {
+				className: "wwc:text-xs wwc:text-muted-foreground",
+				children: empty
+			}) : /* @__PURE__ */ jsx("div", {
+				className: "wwc:space-y-1",
+				children: values.map((id, index) => /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:items-center wwc:gap-1.5 wwc:rounded-md wwc:border wwc:border-border wwc:px-2 wwc:py-1",
+					children: [
+						ordered && /* @__PURE__ */ jsx("span", {
+							className: "wwc:shrink-0 wwc:text-[10px] wwc:tabular-nums wwc:text-muted-foreground",
+							children: index + 1
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: "wwc:min-w-0 wwc:flex-1 wwc:truncate wwc:text-xs",
+							children: labelOf(id)
+						}),
+						ordered && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							icon: true,
+							"aria-label": "Move up",
+							disabled: index === 0,
+							className: "wwc:h-6 wwc:w-6",
+							onClick: () => move(index, -1),
+							children: /* @__PURE__ */ jsx(ChevronUp, { className: "wwc:h-3 wwc:w-3" })
+						}), /* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							icon: true,
+							"aria-label": "Move down",
+							disabled: index === values.length - 1,
+							className: "wwc:h-6 wwc:w-6",
+							onClick: () => move(index, 1),
+							children: /* @__PURE__ */ jsx(ChevronDown, { className: "wwc:h-3 wwc:w-3" })
+						})] }),
+						/* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							icon: true,
+							"aria-label": `Remove ${labelOf(id)}`,
+							className: "wwc:h-6 wwc:w-6 wwc:text-muted-foreground",
+							onClick: () => onChange(values.filter((value) => value !== id)),
+							children: /* @__PURE__ */ jsx(X, { className: "wwc:h-3 wwc:w-3" })
+						})
+					]
+				}, id))
+			}),
+			remaining.length > 0 && /* @__PURE__ */ jsx(Combobox, {
+				options: remaining,
+				value: "",
+				onValueChange: (value) => {
+					if (value) onChange([...values, value]);
+				},
+				placeholder,
+				className: "wwc:w-full"
+			})
+		]
+	});
+}
+function TransitionInspector({ process, transition, onChange, onDelete, onNavigate }) {
+	const from = process.states.find((s) => s.id === transition.from);
+	const to = process.states.find((s) => s.id === transition.to);
+	const { actions } = useStateMachineData();
+	const action = transitionAction(transition, actions);
+	const unbound = transition.actionTypeId === null;
+	const [showDetail, setShowDetail] = useState(false);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-3",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:flex-wrap wwc:items-center wwc:gap-1.5",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "wwc:text-sm wwc:font-semibold",
+						children: transition.key
+					}),
+					/* @__PURE__ */ jsx(TransitionKindBadge, { kind: transition.kind }),
+					transition.proposed && /* @__PURE__ */ jsx(ProposedTag, {})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:flex-wrap wwc:items-center wwc:gap-1.5 wwc:text-xs",
+				children: [
+					from ? /* @__PURE__ */ jsx(StateChip, { state: from }) : /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-muted-foreground wwc:italic",
+						children: "deleted"
+					}),
+					/* @__PURE__ */ jsx(ArrowRight, { className: "wwc:h-3.5 wwc:w-3.5 wwc:shrink-0 wwc:text-muted-foreground" }),
+					to ? /* @__PURE__ */ jsx(StateChip, { state: to }) : /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-muted-foreground wwc:italic",
+						children: "deleted"
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:space-y-1.5",
+				children: [
+					/* @__PURE__ */ jsx(Label, { children: "Bound action type" }),
+					/* @__PURE__ */ jsx(Combobox, {
+						options: actionOptions(actions),
+						value: transition.actionTypeId ?? "",
+						onValueChange: (value) => onChange(rebindTransition(process, transition.id, value)),
+						placeholder: "Select action type…",
+						className: "wwc:w-full"
+					}),
+					action ? /* @__PURE__ */ jsx("p", {
+						className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+						children: "Enforcement lives on the shared ontology action — parameter validation, submission criteria and guard functions. Run it from any projection and the same rules apply."
+					}) : unbound ? /* @__PURE__ */ jsx("p", {
+						className: "wwc:text-xs wwc:text-amber-700 wwc:dark:text-amber-400",
+						children: "Drawn, not bound. The edge is on the canvas and dashed until it binds; rule L7 holds the graph back from publishing until then."
+					}) : /* @__PURE__ */ jsx("p", {
+						className: "wwc:text-xs wwc:text-destructive",
+						children: "This binding does not resolve in the ontology — rule L7 flags it until it is rebound."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:space-y-3 wwc:border-t wwc:border-border wwc:pt-3",
+				children: [/* @__PURE__ */ jsxs(Button, {
+					variant: "outline",
+					size: "sm",
+					"aria-expanded": showDetail,
+					className: "wwc:gap-1.5",
+					onClick: () => setShowDetail((open) => !open),
+					children: [/* @__PURE__ */ jsx(ChevronDown, { className: cn("wwc:h-3.5 wwc:w-3.5 wwc:transition-transform", showDetail && "wwc:rotate-180") }), "Actor, guards and effects"]
+				}), showDetail && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+						children: ["actor role: ", transition.actorRole]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "wwc:space-y-1",
+						children: [/* @__PURE__ */ jsx("div", {
+							className: "wwc:text-[10px] wwc:font-semibold wwc:tracking-wider wwc:text-muted-foreground wwc:uppercase",
+							children: "Guards"
+						}), transition.guards.length === 0 ? /* @__PURE__ */ jsx("p", {
+							className: "wwc:text-xs wwc:text-muted-foreground",
+							children: "None declared on this edge."
+						}) : /* @__PURE__ */ jsx("div", {
+							className: "wwc:flex wwc:flex-wrap wwc:gap-1",
+							children: transition.guards.map((guard) => /* @__PURE__ */ jsx("span", {
+								className: "wwc:rounded wwc:bg-muted wwc:px-1.5 wwc:py-0.5",
+								children: /* @__PURE__ */ jsx(Mono, { children: guard })
+							}, guard))
+						})]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "wwc:space-y-1",
+						children: [/* @__PURE__ */ jsx("div", {
+							className: "wwc:text-[10px] wwc:font-semibold wwc:tracking-wider wwc:text-muted-foreground wwc:uppercase",
+							children: "Effects"
+						}), /* @__PURE__ */ jsx("p", {
+							className: "wwc:text-xs",
+							children: transition.note ?? /* @__PURE__ */ jsx("span", {
+								className: "wwc:text-muted-foreground",
+								children: "No effects beyond the implicit audit entry."
+							})
+						})]
+					})
+				] })]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:items-center wwc:justify-between wwc:gap-2",
+				children: [/* @__PURE__ */ jsxs(Button, {
+					variant: "destructive",
+					size: "sm",
+					className: "wwc:gap-1.5",
+					onClick: onDelete,
+					children: [/* @__PURE__ */ jsx(Trash2, { className: "wwc:h-3.5 wwc:w-3.5" }), "Delete transition…"]
+				}), action && onNavigate && /* @__PURE__ */ jsxs(Button, {
+					variant: "ghost",
+					size: "sm",
+					className: "wwc:h-6 wwc:gap-1 wwc:px-1.5 wwc:text-[11px]",
+					onClick: () => onNavigate(lineageNav.actionType(action.id)),
+					children: ["action type", /* @__PURE__ */ jsx(ArrowRight, { className: "wwc:h-3 wwc:w-3" })]
+				})]
+			})
+		]
+	});
+}
+/**
+* The rail's way to create a transition, for the edge you would rather type than draw. A canvas drag
+* is the other way and it commits on drop; neither needs a binding, which is nullable.
+*
+* The check runs LIVE on the current draft, so its refusal — or its rule-L6 note, which is a hint and
+* not a refusal — is readable before the button is pressed.
+*/
+/**
+* The in-place "add state" form.
+*
+* Name, category and role rather than name alone: a state added with only a name lands as an
+* intermediate/pending/custom guess that then has to be corrected in the inspector, and the two
+* fields that decide how the graph READS — where it starts and where it ends — are exactly the ones
+* worth asking for up front. Everything else (colour, SLA, flags) has a sensible default and is a
+* refinement, so it stays in the inspector.
+*/
+function AddStateForm({ onAdd, onCancel, error }) {
+	const [name, setName] = useState("");
+	const [category, setCategory] = useState("pending");
+	const [type, setType] = useState("intermediate");
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-2 wwc:rounded-md wwc:border wwc:border-border wwc:p-2.5",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:space-y-1.5",
+				children: [/* @__PURE__ */ jsx(Label, {
+					htmlFor: "new-state-name",
+					children: "Name"
+				}), /* @__PURE__ */ jsx(Input, {
+					id: "new-state-name",
+					value: name,
+					placeholder: "New state name…",
+					"aria-invalid": error !== null,
+					className: cn(error && "wwc:border-destructive"),
+					onChange: (event) => setName(event.target.value),
+					onKeyDown: (event) => {
+						if (event.key === "Enter") onAdd({
+							name,
+							category,
+							type
+						});
+						if (event.key === "Escape") onCancel();
+					}
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:grid wwc:grid-cols-2 wwc:gap-2",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "wwc:space-y-1.5",
+					children: [/* @__PURE__ */ jsx(Label, { children: "Category" }), /* @__PURE__ */ jsx(Combobox, {
+						options: STATE_CATEGORIES.map((value) => ({
+							value,
+							label: value
+						})),
+						value: category,
+						onValueChange: (value) => setCategory(value),
+						className: "wwc:w-full"
+					})]
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "wwc:space-y-1.5",
+					children: [/* @__PURE__ */ jsx(Label, { children: "Role" }), /* @__PURE__ */ jsx(Combobox, {
+						options: STATE_TYPES.map((value) => ({
+							value,
+							label: value
+						})),
+						value: type,
+						onValueChange: (value) => setType(value),
+						className: "wwc:w-full"
+					})]
+				})]
+			}),
+			error && /* @__PURE__ */ jsx("p", {
+				className: "wwc:text-xs wwc:text-destructive",
+				children: error
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:items-center wwc:gap-2",
+				children: [/* @__PURE__ */ jsxs(Button, {
+					size: "sm",
+					className: "wwc:gap-1.5",
+					onClick: () => onAdd({
+						name,
+						category,
+						type
+					}),
+					children: [/* @__PURE__ */ jsx(Plus, { className: "wwc:h-3.5 wwc:w-3.5" }), "Add state"]
+				}), /* @__PURE__ */ jsx(Button, {
+					variant: "ghost",
+					size: "sm",
+					onClick: onCancel,
+					children: "Cancel"
+				})]
+			}),
+			/* @__PURE__ */ jsx("p", {
+				className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+				children: "It lands custom, with no SLA and no outgoing edge — so rule L5 flags it until a transition is added."
+			})
+		]
+	});
+}
+function AddTransitionForm({ process, draft, onDraftChange, onAdd, onCancel }) {
+	const { actions } = useStateMachineData();
+	const stateOptions = process.states.map((s) => ({
+		value: s.id,
+		label: s.name
+	}));
+	const check = draft.from && draft.to ? checkTransition(process, draft.from, draft.to, draft.actionTypeId, actions) : null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-2",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:grid wwc:gap-2",
+				children: [
+					/* @__PURE__ */ jsx(Combobox, {
+						options: stateOptions,
+						value: draft.from ?? "",
+						onValueChange: (value) => onDraftChange({
+							...draft,
+							from: value
+						}),
+						placeholder: "from state…",
+						className: "wwc:w-full"
+					}),
+					/* @__PURE__ */ jsx(Combobox, {
+						options: stateOptions,
+						value: draft.to ?? "",
+						onValueChange: (value) => onDraftChange({
+							...draft,
+							to: value
+						}),
+						placeholder: "to state…",
+						className: "wwc:w-full"
+					}),
+					/* @__PURE__ */ jsx(Combobox, {
+						options: actionOptions(actions),
+						value: draft.actionTypeId ?? "",
+						onValueChange: (value) => onDraftChange({
+							...draft,
+							actionTypeId: value
+						}),
+						placeholder: "bound action (optional)…",
+						className: "wwc:w-full"
+					})
+				]
+			}),
+			check && !check.ok && /* @__PURE__ */ jsx("p", {
+				className: "wwc:text-xs wwc:text-destructive",
+				children: check.reason
+			}),
+			check?.ok && check.note && /* @__PURE__ */ jsx("p", {
+				className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+				children: check.note
+			}),
+			check?.ok && !check.note && /* @__PURE__ */ jsxs("p", {
+				className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+				children: [
+					"Will be created as kind ",
+					/* @__PURE__ */ jsx("b", { children: check.kind }),
+					" — derived from the graph, never asked for.",
+					!draft.actionTypeId && " Unbound, so rule L7 will hold the graph back from publishing until it binds."
+				]
+			}),
+			/* @__PURE__ */ jsxs(Button, {
+				size: "sm",
+				className: "wwc:gap-1.5",
+				disabled: !draft.from || !draft.to,
+				onClick: () => {
+					if (!draft.from || !draft.to) return;
+					onAdd({
+						from: draft.from,
+						to: draft.to,
+						actionTypeId: draft.actionTypeId
+					});
+				},
+				children: [/* @__PURE__ */ jsx(Plus, { className: "wwc:h-3.5 wwc:w-3.5" }), "Add transition"]
+			}),
+			onCancel && /* @__PURE__ */ jsx(Button, {
+				variant: "ghost",
+				size: "sm",
+				className: "wwc:ml-2",
+				onClick: onCancel,
+				children: "Cancel"
+			})
+		]
+	});
+}
+/** Present in at least one row — an optional column is shipped only when the data actually has it. */
+const rowsCarry = (rows, key) => rows.some((row) => row[key] !== void 0 && row[key] !== null && row[key] !== "");
+function InstancesSection({ process, selectedStateId, onSelectState, loading = false }) {
+	const [query, setQuery] = useState("");
+	const { instances } = useStateMachineData();
+	const objectType = getObjectType(process.objectTypeId);
+	const allRows = useMemo(() => [...instances], [instances]);
+	const scoped = useMemo(() => selectedStateId ? processTokens(process, selectedStateId, allRows) : allRows, [
+		process,
+		selectedStateId,
+		allRows
+	]);
+	const selectedState = selectedStateId ? process.states.find((s) => s.id === selectedStateId) : void 0;
+	const unclaimed = useMemo(() => allRows.filter((row) => processStateOf(process, row) === void 0).length, [process, allRows]);
+	const columns = useMemo(() => {
+		const keys = processRowKeys(process);
+		const defs = [
+			{
+				id: "id",
+				accessorFn: (row) => processRowPk(process, row),
+				header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+					column,
+					title: keys.pk || "Id"
+				}),
+				enableHiding: false,
+				cell: ({ row }) => /* @__PURE__ */ jsx(Mono, { children: processRowPk(process, row.original) })
+			},
+			{
+				id: "title",
+				accessorFn: (row) => processRowTitle(process, row),
+				header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+					column,
+					title: keys.title || "Title"
+				}),
+				cell: ({ row }) => /* @__PURE__ */ jsx("span", {
+					className: "wwc:text-xs",
+					children: processRowTitle(process, row.original)
+				})
+			},
+			{
+				id: "state",
+				accessorFn: (row) => processStateOf(process, row)?.name ?? "",
+				header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+					column,
+					title: "State"
+				}),
+				cell: ({ row }) => {
+					const state = processStateOf(process, row.original);
+					if (!state) return /* @__PURE__ */ jsxs("span", {
+						className: "wwc:text-xs wwc:text-muted-foreground wwc:italic",
+						children: ["no state matches ", String(row.original[process.statusProp] ?? "—")]
+					});
+					return /* @__PURE__ */ jsx(StateChip, { state });
+				}
+			}
+		];
+		if (rowsCarry(scoped, "severity_level")) defs.push({
+			id: "severity",
+			accessorFn: (row) => String(row.severity_level ?? ""),
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Severity"
+			}),
+			cell: ({ row }) => /* @__PURE__ */ jsx(Badge, {
+				variant: "neutralSoft",
+				children: String(row.original.severity_level ?? "—")
+			})
+		});
+		if (rowsCarry(scoped, "zone_id")) defs.push({
+			id: "zone",
+			accessorFn: (row) => String(row.zone_id ?? ""),
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Zone"
+			}),
+			cell: ({ row }) => /* @__PURE__ */ jsx(Mono, { children: String(row.original.zone_id ?? "—") })
+		});
+		if (rowsCarry(scoped, "assigned_to")) defs.push({
+			id: "assigned to",
+			accessorFn: (row) => String(row.assigned_to ?? ""),
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Assigned to"
+			}),
+			cell: ({ row }) => /* @__PURE__ */ jsx(Mono, { children: String(row.original.assigned_to ?? "unassigned") })
+		});
+		if (rowsCarry(scoped, "receiver_worker_id")) defs.push({
+			id: "receiver",
+			accessorFn: (row) => String(row.receiver_worker_id ?? ""),
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Receiver"
+			}),
+			cell: ({ row }) => /* @__PURE__ */ jsx(Mono, { children: String(row.original.receiver_worker_id ?? "—") })
+		});
+		defs.push({
+			id: "age",
+			accessorFn: (row) => processRowAgeHours(process, row),
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Age"
+			}),
+			meta: {
+				headerClassName: "wwc:text-right",
+				cellClassName: "wwc:text-right wwc:tabular-nums"
+			},
+			cell: ({ row }) => formatHours(processRowAgeHours(process, row.original))
+		}, {
+			id: "sla",
+			accessorFn: (row) => processRowSlaHours(process, row, processStateOf(process, row)) ?? 0,
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "SLA"
+			}),
+			meta: {
+				headerClassName: "wwc:text-right",
+				cellClassName: "wwc:text-right wwc:tabular-nums"
+			},
+			cell: ({ row }) => {
+				const sla = processRowSlaHours(process, row.original, processStateOf(process, row.original));
+				return sla === null ? /* @__PURE__ */ jsx("span", {
+					className: "wwc:text-muted-foreground",
+					children: "—"
+				}) : `${sla} h`;
+			}
+		}, {
+			id: "over sla",
+			accessorFn: (row) => processRowOverSla(process, row) ? 1 : 0,
+			header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, {
+				column,
+				title: "Over SLA"
+			}),
+			cell: ({ row }) => processRowOverSla(process, row.original) ? /* @__PURE__ */ jsxs(Badge, {
+				variant: "dangerSoft",
+				children: [/* @__PURE__ */ jsx(Clock, { className: "wwc:h-3 wwc:w-3" }), "over"]
+			}) : /* @__PURE__ */ jsx("span", {
+				className: "wwc:text-muted-foreground",
+				children: "—"
+			})
+		});
+		return defs;
+	}, [process, scoped]);
+	const data = useMemo(() => {
+		const needle = query.trim().toLowerCase();
+		if (!needle) return scoped;
+		return scoped.filter((row) => Object.values(row).map((value) => value === null ? "" : String(value)).join(" ").toLowerCase().includes(needle));
+	}, [scoped, query]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-4",
+		children: [
+			/* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(CardContent, {
+				className: "wwc:flex wwc:flex-wrap wwc:items-center wwc:gap-x-3 wwc:gap-y-1.5 wwc:px-3.5 wwc:py-2.5 wwc:text-xs",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "wwc:font-semibold",
+						children: selectedState ? `Tokens in “${selectedState.name}”` : "All tokens"
+					}),
+					/* @__PURE__ */ jsxs("span", {
+						className: "wwc:text-muted-foreground",
+						children: [
+							scoped.length,
+							" of ",
+							allRows.length,
+							" ",
+							objectType?.pluralName ?? "rows"
+						]
+					}),
+					/* @__PURE__ */ jsx(Combobox, {
+						options: process.states.map((s) => ({
+							value: s.id,
+							label: s.name
+						})),
+						value: selectedStateId ?? "",
+						onValueChange: (value) => onSelectState(value || null),
+						placeholder: "Scope to a state…",
+						className: "wwc:w-52"
+					}),
+					selectedStateId && /* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						size: "sm",
+						onClick: () => onSelectState(null),
+						children: "Clear scope"
+					}),
+					/* @__PURE__ */ jsx("span", { className: "wwc:flex-1" }),
+					/* @__PURE__ */ jsxs("span", {
+						className: "wwc:text-muted-foreground",
+						children: [
+							"a row sits in whichever state's ",
+							/* @__PURE__ */ jsx(Mono, { children: "value" }),
+							" matches its ",
+							/* @__PURE__ */ jsx(Mono, { children: process.statusProp })
+						]
+					})
+				]
+			}) }),
+			unclaimed > 0 && /* @__PURE__ */ jsx(Banner, {
+				variant: "info",
+				title: `${unclaimed} of ${allRows.length} rows sit in no state of this process`,
+				description: `Tokens are the live ${objectType?.pluralName ?? "instance"} rows of ${objectType?.displayName ?? process.objectTypeId}, shared by every process bound to that object type. A row sits in whichever state's value matches its ${process.statusProp} field — a state whose value matches nothing shows 0 tokens.`
+			}),
+			/* @__PURE__ */ jsx(DataTable, {
+				columns,
+				data,
+				search: query,
+				onSearchChange: setQuery,
+				searchPlaceholder: "Filter tokens…",
+				recordLabel: "token",
+				recordLabelPlural: "tokens",
+				pageSize: 25,
+				flushToolbar: true,
+				getRowId: (row) => processRowPk(process, row),
+				isLoading: loading,
+				emptyMessage: loading ? "Loading tokens…" : allRows.length === 0 ? `No ${objectType?.pluralName ?? "instance"} rows back this process, so it has no tokens.` : "No tokens match the current scope and search."
+			})
+		]
+	});
+}
+function SettingsSection({ process, onChange, onNavigate, identityExtra, authoring = false }) {
+	const [nameErr, setNameErr] = useState(false);
+	const facts = useMemo(() => processFacts(process), [process]);
+	const objectType = getObjectType(process.objectTypeId);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-4",
+		children: [/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
+			className: "wwc:p-3",
+			children: /* @__PURE__ */ jsx(CardTitle, {
+				className: "wwc:text-sm",
+				children: "Identity"
+			})
+		}), /* @__PURE__ */ jsxs(CardContent, {
+			className: "wwc:space-y-3 wwc:p-3 wwc:pt-0",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "wwc:space-y-1.5",
+					children: [
+						/* @__PURE__ */ jsx(Label, {
+							htmlFor: `proc-name-${process.id}`,
+							children: "Name"
+						}),
+						/* @__PURE__ */ jsx(Input, {
+							id: `proc-name-${process.id}`,
+							defaultValue: process.name,
+							"aria-invalid": nameErr,
+							className: cn(nameErr && "wwc:border-destructive"),
+							onBlur: (event) => {
+								const value = event.target.value.trim();
+								if (!value) {
+									setNameErr(true);
+									return;
+								}
+								setNameErr(false);
+								onChange(updateProcessMeta(process, { name: value }));
+							}
+						}),
+						nameErr && /* @__PURE__ */ jsx("p", {
+							className: "wwc:text-xs wwc:text-destructive",
+							children: WC3_PROCESS_MESSAGES.nameRequired
+						})
+					]
+				}),
+				!authoring && /* @__PURE__ */ jsxs("div", {
+					className: "wwc:space-y-1.5",
+					children: [/* @__PURE__ */ jsx(Label, { children: "Icon" }), /* @__PURE__ */ jsx(Combobox, {
+						options: WC3_PROCESS_ICONS.map((icon) => ({
+							value: icon,
+							label: icon
+						})),
+						value: process.icon,
+						onValueChange: (value) => onChange(updateProcessMeta(process, { icon: value })),
+						className: "wwc:w-full"
+					})]
+				}),
+				identityExtra,
+				!authoring && /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:flex-wrap wwc:items-center wwc:gap-x-4 wwc:gap-y-1.5 wwc:text-xs",
+					children: [
+						/* @__PURE__ */ jsx(Mono, { children: process.id }),
+						/* @__PURE__ */ jsxs("span", {
+							className: "wwc:flex wwc:items-center wwc:gap-1.5",
+							children: ["backing type", onNavigate ? /* @__PURE__ */ jsx("button", {
+								type: "button",
+								className: "wwc:underline wwc:underline-offset-2",
+								onClick: () => onNavigate(lineageNav.objectType(process.objectTypeId)),
+								children: /* @__PURE__ */ jsx(TypeGlyphLabel, { type: objectType })
+							}) : /* @__PURE__ */ jsx(TypeGlyphLabel, { type: objectType })]
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: "wwc:flex wwc:items-center wwc:gap-1.5",
+							children: ["status property ", /* @__PURE__ */ jsx(Mono, { children: process.statusProp })]
+						}),
+						/* @__PURE__ */ jsx(ProductChip, {
+							process,
+							onOpenProduct: onNavigate ? (key) => onNavigate(lineageNav.product(key)) : void 0
+						}),
+						/* @__PURE__ */ jsx(SlaModelBadge, { process })
+					]
+				})
+			]
+		})] }), !authoring && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+			/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
+				className: "wwc:p-3",
+				children: /* @__PURE__ */ jsxs(CardTitle, {
+					className: "wwc:text-sm",
+					children: ["Also touches", /* @__PURE__ */ jsxs("span", {
+						className: "wwc:font-normal wwc:text-muted-foreground",
+						children: [
+							" (",
+							facts.alsoTouches.length,
+							")"
+						]
+					})]
+				})
+			}), /* @__PURE__ */ jsx(CardContent, {
+				className: "wwc:p-3 wwc:pt-0",
+				children: facts.alsoTouches.length === 0 ? /* @__PURE__ */ jsx("p", {
+					className: "wwc:text-xs wwc:text-muted-foreground",
+					children: "This graph reads and writes only its own object type."
+				}) : /* @__PURE__ */ jsx("div", {
+					className: "wwc:flex wwc:flex-wrap wwc:gap-1.5",
+					children: facts.alsoTouches.map((touch) => /* @__PURE__ */ jsxs(Badge, {
+						variant: "neutralSoft",
+						children: [touch.displayName, touch.productKey ? ` · ${touch.productKey}` : ""]
+					}, touch.otId))
+				})
+			})] }),
+			/* @__PURE__ */ jsx(ProcessProvenanceNote, { process }),
+			facts.lint.length > 0 ? /* @__PURE__ */ jsx(Banner, {
+				variant: "warning",
+				title: "Graph validity (DWP engine rules L1–L7)",
+				items: facts.lint.map((error) => `${error.rule} · ${error.msg}`)
+			}) : /* @__PURE__ */ jsx(Banner, {
+				variant: "success",
+				title: "Graph is publishable",
+				description: "Every validity rule L1–L7 passes: one initial state, at least one terminal and one active state, no unreachable state, every non-terminal state has an outgoing edge, terminal states take only reopen edges, and every transition binds to an action type that exists."
+			}),
+			/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
+				className: "wwc:p-3",
+				children: /* @__PURE__ */ jsx(CardTitle, {
+					className: "wwc:text-sm",
+					children: "Transition kinds"
+				})
+			}), /* @__PURE__ */ jsxs(CardContent, {
+				className: "wwc:space-y-2 wwc:p-3 wwc:pt-0",
+				children: [/* @__PURE__ */ jsx(KindLegend, {}), /* @__PURE__ */ jsx("p", {
+					className: "wwc:text-[10.5px] wwc:text-muted-foreground",
+					children: "A kind is derived from the graph when a transition is added — a self edge is an extension loop, an edge leaving a terminal state is a reopen, an edge going back a column is a reject loop, everything else is forward."
+				})]
+			})] }),
+			/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
+				className: "wwc:p-3",
+				children: /* @__PURE__ */ jsx(CardTitle, {
+					className: "wwc:text-sm",
+					children: "States"
+				})
+			}), /* @__PURE__ */ jsx(CardContent, {
+				className: "wwc:space-y-2 wwc:p-3 wwc:pt-0",
+				children: process.states.map((state) => /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:flex-wrap wwc:items-center wwc:gap-2 wwc:border-b wwc:border-border wwc:pb-2 wwc:text-xs wwc:last:border-b-0 wwc:last:pb-0",
+					children: [
+						/* @__PURE__ */ jsx(StateChip, { state }),
+						/* @__PURE__ */ jsx(Badge, {
+							variant: "neutralSoft",
+							children: state.type
+						}),
+						state.custom && /* @__PURE__ */ jsx(CustomTag, {}),
+						state.proposed && /* @__PURE__ */ jsx(ProposedTag, {}),
+						/* @__PURE__ */ jsx(StateFlagBadges, { state }),
+						/* @__PURE__ */ jsx("span", { className: "wwc:flex-1" }),
+						/* @__PURE__ */ jsx(Mono, { children: state.value }),
+						/* @__PURE__ */ jsx("span", {
+							className: "wwc:text-muted-foreground",
+							children: state.slaHours === null ? "no SLA" : `${state.slaHours} h`
+						})
+					]
+				}, state.id))
+			})] })
+		] })]
+	});
+}
+/**
+* The permit's type and description, shown inside the General section's Identity card.
+*
+* They sit BESIDE the record's own Name and Icon rather than in a panel of their own: all four
+* answer "what is this permit", and splitting them across two surfaces would make the same question
+* take two places to answer.
+*/
+function PermitFields({ permit, onPermitChange, typeOptions }) {
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-1.5",
+		children: [/* @__PURE__ */ jsx(Label, { children: "Permit type" }), typeOptions.length === 0 ? /* @__PURE__ */ jsxs("p", {
+			className: "wwc:text-xs wwc:text-muted-foreground",
+			children: [
+				"This process's rows carry no ",
+				/* @__PURE__ */ jsx(Mono, { children: "permit_type" }),
+				", so there is no type to choose."
+			]
+		}) : /* @__PURE__ */ jsx(ToggleGroup, {
+			type: "single",
+			value: permit.type,
+			onValueChange: (next) => onPermitChange({
+				...permit,
+				type: next
+			}),
+			variant: "outline",
+			size: "sm",
+			className: "wwc:flex-wrap wwc:justify-start wwc:gap-2",
+			children: typeOptions.map((option) => {
+				const picked = permit.type === option.value;
+				return /* @__PURE__ */ jsxs(ToggleGroupItem, {
+					value: option.value,
+					"aria-label": option.label,
+					className: cn("wwc:gap-2 wwc:rounded-full wwc:px-3 wwc:capitalize", "wwc:data-[state=on]:border-primary wwc:data-[state=on]:bg-primary/10 wwc:data-[state=on]:font-semibold wwc:data-[state=on]:text-foreground wwc:data-[state=on]:ring-1 wwc:data-[state=on]:ring-primary"),
+					children: [/* @__PURE__ */ jsx("span", {
+						className: cn("wwc:size-2 wwc:shrink-0 wwc:rounded-full", !picked && "wwc:opacity-40"),
+						style: { background: option.dot }
+					}), option.label]
+				}, option.value);
+			})
+		})]
+	}), /* @__PURE__ */ jsxs("div", {
+		className: "wwc:space-y-1.5",
+		children: [/* @__PURE__ */ jsx(Label, {
+			htmlFor: "permit-description",
+			children: "Description"
+		}), /* @__PURE__ */ jsx(Textarea, {
+			id: "permit-description",
+			value: permit.description,
+			rows: 4,
+			placeholder: "What this permit covers, and when it applies…",
+			onChange: (event) => onPermitChange({
+				...permit,
+				description: event.target.value
+			})
+		})]
+	})] });
+}
+/**
+* Re-runs the auto-layout and re-frames the graph.
+*
+* Positions are owned by the drag once the record is seeded — nothing recomputes them, by design, or
+* every unrelated edit would snap a moved state back. That leaves no way out of a graph the user has
+* pulled apart, or one where three states added in a row have stacked in the last column. This is
+* that way out, and it is explicit, so it can never fight a drag.
+*
+* Mounted as a GraphCanvas CHILD, which puts it inside the ReactFlowProvider — the only place
+* `fitView` can be called from. Re-framing matters here: a tidy that moved every node off screen
+* would read as having deleted the graph.
+*/
+function TidyLayoutButton({ onTidy }) {
+	const { fitView } = useReactFlow();
+	return /* @__PURE__ */ jsx(Panel, {
+		position: "top-right",
+		children: /* @__PURE__ */ jsxs(Button, {
+			variant: "outline",
+			size: "sm",
+			className: "wwc:gap-1.5 wwc:bg-card",
+			onClick: () => {
+				onTidy();
+				requestAnimationFrame(() => void fitView({
+					padding: .12,
+					duration: 250
+				}));
+			},
+			children: [/* @__PURE__ */ jsx(LayoutGrid, { className: "wwc:h-3.5 wwc:w-3.5" }), "Tidy layout"]
+		})
+	});
+}
+/**
+* The canvas footer: whether the graph currently passes the engine's rules.
+*
+* It replaced a legend and a how-to-drag hint. Both were static text that said the same thing on
+* every visit; this line changes, and what it changes to is the one question an author actually has
+* open while wiring a graph — is this publishable yet.
+*
+* The check is INSTANT (processGraphLint is pure and local), so the "Checking…" state is not
+* hiding latency. It is there because a result that flips silently between two green sentences is
+* indistinguishable from a result that never ran: the brief pause is what makes the recheck visible,
+* and it is what a real server-side validation would occupy anyway.
+*/
+function WorkflowStatus({ lint, graphKey }) {
+	const [checking, setChecking] = useState(false);
+	useEffect(() => {
+		setChecking(true);
+		const timer = setTimeout(() => setChecking(false), 450);
+		return () => clearTimeout(timer);
+	}, [graphKey]);
+	if (checking) return /* @__PURE__ */ jsx("output", {
+		className: cn("wwc:text-xs wwc:text-transparent", "wwc:bg-[linear-gradient(90deg,var(--wwc-color-muted-foreground)_0%,var(--wwc-color-muted-foreground)_35%,var(--wwc-color-foreground)_50%,var(--wwc-color-muted-foreground)_65%,var(--wwc-color-muted-foreground)_100%)]", "wwc:bg-[length:200%_100%] wwc:bg-clip-text", "wwc:animate-text-shimmer wwc:motion-reduce:animate-none"),
+		children: "Checking workflow…"
+	});
+	if (lint.length === 0) return /* @__PURE__ */ jsx("output", {
+		className: "wwc:text-xs wwc:text-green-700 wwc:dark:text-green-400",
+		children: "Workflow validated — no blocking issues."
+	});
+	return /* @__PURE__ */ jsxs("output", {
+		className: "wwc:text-xs wwc:text-destructive",
+		children: [
+			lint.length,
+			" blocking issue",
+			lint.length === 1 ? "" : "s",
+			" — ",
+			lint.map((error) => error.rule).join(", "),
+			"."
+		]
+	});
+}
+/**
+* What each variant turns on.
+*
+* A record rather than a chain of `variant === "…"` tests: every behavioural difference between
+* variants is visible in one table, and a variant that has not opted into a trait cannot silently
+* inherit it from whichever branch happened to run. Add a trait as a new KEY here — never as an
+* inline test in the render.
+*/
+const VARIANT_TRAITS = {
+	connect: {
+		rail: true,
+		shell: true,
+		sections: [{ items: [
+			"canvas",
+			"instances",
+			"bottlenecks",
+			"general"
+		] }],
+		sectionLabels: { general: "Settings" },
+		permitFields: false
+	},
+	"work-permit": {
+		rail: true,
+		shell: true,
+		sections: [{ items: [
+			"general",
+			"canvas",
+			"form",
+			"policy"
+		] }, {
+			items: ["instances", "bottlenecks"],
+			divider: true
+		}],
+		permitFields: true
+	}
+};
+const SECTION_LABEL = {
+	canvas: "Canvas",
+	instances: "Instances",
+	bottlenecks: "Bottlenecks",
+	general: "General",
+	form: "Form",
+	policy: "Policy"
+};
+const SECTION_ICON = {
+	canvas: Workflow,
+	instances: Rows3,
+	bottlenecks: Clock,
+	general: Settings2,
+	form: ClipboardList,
+	policy: ShieldCheck
+};
+/**
+* Mirrors RecordDetailShell's non-flush content well (unpadded scroll owner outside, padded block
+* inside — see the comment there for why they nest). The shell is mounted `flush` here so the form
+* builder can stay a stable direct child across section switches (hidden, never unmounted); the
+* sections that want the classic padded well get it from this wrapper instead.
+*/
+function SectionWell({ children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "wwc:min-h-0 wwc:flex-1 wwc:overflow-auto",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "wwc:w-full wwc:space-y-4 wwc:p-6",
+			children
+		})
+	});
+}
+/**
+* The colour each permit type is known by, keyed by its raw `permit_type` value.
+*
+* ONE source for both surfaces that paint a type: the pills in this file and the table chips in
+* work-permit-templates.tsx. Two maps would drift, and a type that is red in a list and orange in
+* its editor is worse than a type with no colour at all.
+*
+* `dot` is a hex applied INLINE — legal here for the same reason WC3_PROCESS_STATE_COLORS is: it is
+* fixture identity, never chrome, and a dot carries no text so it has no contrast to lose. `chip`
+* has to be classes instead, because a chip DOES carry text and a single hex would be one value for
+* both themes.
+*/
+const PERMIT_TYPE_COLOR = {
+	hot_work: {
+		dot: "#dc2626",
+		chip: "wwc:border-red-600/25 wwc:bg-red-500/10 wwc:text-red-700 wwc:dark:text-red-400"
+	},
+	cold_work: {
+		dot: "#2563eb",
+		chip: "wwc:border-blue-600/25 wwc:bg-blue-500/10 wwc:text-blue-700 wwc:dark:text-blue-400"
+	},
+	confined_space: {
+		dot: "#7c3aed",
+		chip: "wwc:border-violet-600/25 wwc:bg-violet-500/10 wwc:text-violet-700 wwc:dark:text-violet-400"
+	},
+	work_at_height: {
+		dot: "#ea580c",
+		chip: "wwc:border-orange-600/25 wwc:bg-orange-500/10 wwc:text-orange-700 wwc:dark:text-orange-400"
+	},
+	electrical_work: {
+		dot: "#d97706",
+		chip: "wwc:border-amber-600/25 wwc:bg-amber-500/10 wwc:text-amber-700 wwc:dark:text-amber-400"
+	},
+	excavation: {
+		dot: "#059669",
+		chip: "wwc:border-emerald-600/25 wwc:bg-emerald-500/10 wwc:text-emerald-700 wwc:dark:text-emerald-400"
+	},
+	lifting: {
+		dot: "#0891b2",
+		chip: "wwc:border-cyan-600/25 wwc:bg-cyan-500/10 wwc:text-cyan-700 wwc:dark:text-cyan-400"
+	},
+	radiography: {
+		dot: "#db2777",
+		chip: "wwc:border-pink-600/25 wwc:bg-pink-500/10 wwc:text-pink-700 wwc:dark:text-pink-400"
+	}
+};
+/** Neutral rather than a random colour: an unrecognised type should read as unclassified, not as a
+*  type whose colour nobody can look up. */
+const PERMIT_TYPE_FALLBACK = {
+	dot: "var(--wwc-color-muted-foreground)",
+	chip: "wwc:border-border wwc:bg-muted wwc:text-muted-foreground"
+};
+const permitTypeColor = (value) => PERMIT_TYPE_COLOR[value] ?? PERMIT_TYPE_FALLBACK;
+/**
+* The permit types this process's OWN tokens carry, deduped and in first-seen order.
+*
+* Derived rather than declared: a hard-coded list would silently drift from the fixture the moment a
+* row is added. A process whose rows have no `permit_type` yields an empty list, and the field says
+* so instead of offering choices that mean nothing.
+*/
+function permitTypeOptions(process, instances = []) {
+	const seen = /* @__PURE__ */ new Set();
+	for (const row of instances) {
+		const value = row.permit_type;
+		if (typeof value === "string" && value !== "" && !seen.has(value)) seen.add(value);
+	}
+	return [...seen].map((value) => ({
+		value,
+		label: value.replace(/_/g, " "),
+		dot: permitTypeColor(value).dot
+	}));
+}
+/**
+* The state-machine authoring surface: header band, section rail, canvas and editing panel.
+*
+* Pick the cut with {@link StateMachineProps.variant} — `connect` or `work-permit`. Both render the
+* same canvas, the same editing panel and the same guards; they differ in the left rail alone.
+*
+* Height contract: the canvas fills its container, so the container MUST resolve a height. Placed in
+* a box with no resolved height the canvas collapses to a 0px strip — the same failure GraphCanvas
+* documents, inherited here because this widget is one.
+*
+* ```tsx
+* <div className="h-[42rem]">
+*   <StateMachine variant="connect" process={process} onChange={setProcess} />
+* </div>
+* ```
+*/
+function StateMachine({ process, onChange, variant = "connect", shell: shellProp, edit: editProp, onEditChange, onNavigate, permit: permitProp, onPermitChange, section: sectionProp, onSectionChange, onBack, formSlot, headerActions, railFooter, authoring = false, actions = NO_ACTIONS, effects = NO_EFFECTS, stateFlags = DEFAULT_STATE_FLAGS, instances = NO_ROWS, instancesLoading = false, readOnly = false, sections: sectionsProp, sectionLabels: sectionLabelsProp, className }) {
+	const traits = VARIANT_TRAITS[variant];
+	const shell = shellProp ?? traits.shell;
+	const sectionGroups = sectionsProp ?? traits.sections;
+	const sectionLabels = sectionLabelsProp ?? traits.sectionLabels;
+	const { permitFields } = traits;
+	const editing = shell && traits.rail && !readOnly;
+	const data = useMemo(() => ({
+		actions,
+		effects,
+		stateFlags,
+		instances,
+		readOnly
+	}), [
+		actions,
+		effects,
+		stateFlags,
+		instances,
+		readOnly
+	]);
+	/**
+	* Which section the rail opens on.
+	*
+	* AUTHORING ALWAYS OPENS ON THE CANVAS. A graph that is being written has nothing else worth
+	* landing on — Instances and Bottlenecks are dropped in that mode, and General is identity fields
+	* for a record whose whole point is the shape being drawn behind them. The work-permit cut is the
+	* one this changes: its rail leads with General, which is right for an existing template and
+	* wrong for a blank one.
+	*/
+	const defaultSection = authoring ? "canvas" : sectionGroups[0]?.items[0] ?? "canvas";
+	const [ownEdit, setOwnEdit] = useState(WC3_PROCESS_EDIT_INITIAL);
+	const controlled = editProp !== void 0;
+	const edit = editProp ?? ownEdit;
+	const setEdit = useCallback((update) => {
+		if (controlled) onEditChange?.(update(editProp));
+		else setOwnEdit(update);
+	}, [
+		controlled,
+		editProp,
+		onEditChange
+	]);
+	const [ownPermit, setOwnPermit] = useState(() => ({
+		name: process.name,
+		type: "",
+		description: "",
+		policy: WC3_PERMIT_POLICY_INITIAL
+	}));
+	const permit = permitProp ?? ownPermit;
+	const setPermit = (next) => {
+		if (permitProp === void 0) setOwnPermit(next);
+		onPermitChange?.(next);
+		if (next.name !== process.name) onChange(updateProcessMeta(process, { name: next.name }));
+	};
+	const [ownSection, setOwnSection] = useState(defaultSection);
+	const section = sectionProp ?? ownSection;
+	const setSection = (next) => {
+		if (sectionProp === void 0) setOwnSection(next);
+		onSectionChange?.(next);
+	};
+	const typeOptions = useMemo(() => permitTypeOptions(process, instances), [process, instances]);
+	const [pending, setPending] = useState(null);
+	const [railTab, setRailTab] = useState("state");
+	const [newStateErr, setNewStateErr] = useState(null);
+	const [addingState, setAddingState] = useState(false);
+	const [addingTransition, setAddingTransition] = useState(false);
+	useEffect(() => {
+		setOwnEdit(WC3_PROCESS_EDIT_INITIAL);
+		setOwnSection(defaultSection);
+		setRailTab("state");
+		setOwnPermit({
+			name: process.name,
+			type: "",
+			description: "",
+			policy: WC3_PERMIT_POLICY_INITIAL
+		});
+		setPending(null);
+		setNewStateErr(null);
+		setAddingState(false);
+		setAddingTransition(false);
+	}, [process.id]);
+	const rows = useMemo(() => [...instances], [instances]);
+	const facts = useMemo(() => processFacts(process, rows, actions), [
+		process,
+		rows,
+		actions
+	]);
+	/**
+	* What the validity check depends on: the SHAPE of the graph, not the record.
+	*
+	* Every commit deep-clones the process, so `process` itself changes identity when a state is
+	* merely dragged. Hashing the fields the rules actually read keeps the footer from re-checking on
+	* a move that cannot alter the answer.
+	*/
+	const graphKey = useMemo(() => [process.states.map((state) => `${state.id}:${state.type}:${state.category}:${state.flags.join("+")}`).join("|"), process.transitions.map((t) => `${t.id}:${t.from}>${t.to}:${t.actionTypeId}`).join("|")].join("//"), [process.states, process.transitions]);
+	const flowNodes = useMemo(() => process.states.map((state) => ({
+		id: state.id,
+		type: "default",
+		position: process.layout[state.id] ?? {
+			x: 36,
+			y: 34
+		},
+		selected: edit.stateSel === state.id,
+		style: { ["--xy-node-background-color"]: `color-mix(in srgb, ${state.color} ${WC3_PROCESS_NODE_TINT}, var(--xy-node-background-color-default))` },
+		data: { state }
+	})), [
+		process.states,
+		process.layout,
+		edit.stateSel
+	]);
+	const flowEdges = useMemo(() => {
+		const known = new Set(process.states.map((s) => s.id));
+		return process.transitions.map((t) => {
+			if (!known.has(t.from) || !known.has(t.to)) return null;
+			const selfLoop = t.from === t.to;
+			const backward = !selfLoop && (process.layout[t.to]?.x ?? 0) < (process.layout[t.from]?.x ?? 0);
+			return {
+				id: t.id,
+				source: t.from,
+				target: t.to,
+				sourceHandle: backward ? "back-out" : "out",
+				targetHandle: selfLoop || backward ? "back-in" : "in",
+				selected: edit.transSel === t.id,
+				...t.actionTypeId === null ? { style: { strokeDasharray: "5 4" } } : {},
+				markerEnd: { type: MarkerType.ArrowClosed }
+			};
+		}).filter((edge) => edge !== null);
+	}, [
+		process.states,
+		process.transitions,
+		process.layout,
+		edit.transSel
+	]);
+	const [nodes, setNodes, onNodesChange] = useNodesState(flowNodes);
+	const [edges, setEdges, onEdgesChange] = useEdgesState(flowEdges);
+	useEffect(() => setNodes(flowNodes), [flowNodes, setNodes]);
+	useEffect(() => setEdges(flowEdges), [flowEdges, setEdges]);
+	const openAddState = () => {
+		setNewStateErr(null);
+		setAddingState(true);
+	};
+	const addNewState = (draft) => {
+		const name = draft.name.trim();
+		if (!name) {
+			setNewStateErr(WC3_PROCESS_MESSAGES.nameRequired);
+			return;
+		}
+		if (process.states.some((s) => s.name.toLowerCase() === name.toLowerCase() || s.value.toLowerCase() === name.toLowerCase())) {
+			setNewStateErr(WC3_PROCESS_MESSAGES.stateNameTaken);
+			return;
+		}
+		setNewStateErr(null);
+		const { process: added, stateId } = addState(process, name);
+		onChange(updateState(added, stateId, {
+			category: draft.category,
+			type: draft.type
+		}));
+		setEdit((state) => ({
+			...state,
+			stateSel: stateId,
+			transSel: null,
+			graphErr: null
+		}));
+		setRailTab("state");
+		setAddingState(false);
+	};
+	const closeAddTransition = () => {
+		setAddingTransition(false);
+		setEdit((state) => ({
+			...state,
+			draftTransition: {
+				from: null,
+				to: null,
+				actionTypeId: null
+			},
+			graphErr: null
+		}));
+	};
+	const commitTransition = (args) => {
+		const check = checkTransition(process, args.from, args.to, args.actionTypeId, actions);
+		if (!check.ok) {
+			setEdit((state) => ({
+				...state,
+				graphErr: check.reason
+			}));
+			return;
+		}
+		const { process: next, transitionId } = addTransition(process, {
+			from: args.from,
+			to: args.to,
+			actionTypeId: args.actionTypeId
+		});
+		onChange(next);
+		setEdit((state) => ({
+			...state,
+			graphErr: null,
+			transSel: transitionId,
+			stateSel: null,
+			draftTransition: {
+				from: null,
+				to: null,
+				actionTypeId: null
+			}
+		}));
+		setRailTab("transition");
+		setAddingTransition(false);
+	};
+	/**
+	* The drag-time guards. Probed with a resolvable binding so guards 1 and 4 — the only two a drag
+	* can violate — decide the drop; the binding itself is checked when the form commits.
+	*/
+	const validateDrag = useCallback((connection) => checkTransition(process, connection.source, connection.target, null, actions), [process, actions]);
+	/**
+	* The refusal surface. `isValidConnection` blocks the drop, which means `onConnect` never fires for
+	* a refused edge and the reason would never be read — so the guards run again here, on the pair the
+	* drag actually ended on, and their message lands in the warn banner verbatim. Handles are resolved
+	* by TYPE, not by drag direction, so dragging target→source refuses for the same reason as
+	* source→target rather than for a spurious one.
+	*/
+	const onConnectEnd = useCallback((_event, state) => {
+		const { fromHandle, toHandle } = state;
+		if (!fromHandle || !toHandle) return;
+		const source = fromHandle.type === "source" ? fromHandle : toHandle;
+		const target = fromHandle.type === "source" ? toHandle : fromHandle;
+		if (!source.nodeId || !target.nodeId) return;
+		const check = checkTransition(process, source.nodeId, target.nodeId, null, actions);
+		setEdit((edited) => ({
+			...edited,
+			graphErr: check.ok ? null : check.reason
+		}));
+	}, [
+		process,
+		actions,
+		setEdit
+	]);
+	/**
+	* A LEGAL drop COMMITS, unbound.
+	*
+	* The drag supplies both endpoints; addTransition derives the key and the kind; the binding is
+	* left null and rule L7 carries it from there. Then the new edge is SELECTED and its inspector
+	* opened, so the field the drop could not fill is the field under the cursor — draw the line,
+	* finish it in place. One onChange, so undo drops the edge and nothing else.
+	*/
+	const onConnect = useCallback((connection) => {
+		if (!connection.source || !connection.target) return;
+		const { process: next, transitionId } = addTransition(process, {
+			from: connection.source,
+			to: connection.target,
+			actionTypeId: null
+		});
+		onChange(next);
+		setRailTab("transition");
+		setAddingTransition(false);
+		setEdit((state) => ({
+			...state,
+			graphErr: null,
+			stateSel: null,
+			transSel: transitionId,
+			draftTransition: {
+				from: null,
+				to: null,
+				actionTypeId: null
+			}
+		}));
+	}, [
+		process,
+		onChange,
+		setEdit
+	]);
+	const requestDeleteState = (stateId) => {
+		const reason = stateDeleteBlockReason(process, stateId, rows);
+		if (reason) {
+			setEdit((state) => ({
+				...state,
+				graphErr: reason
+			}));
+			return;
+		}
+		setPending({
+			kind: "state",
+			id: stateId
+		});
+	};
+	const confirmPending = () => {
+		if (!pending) return;
+		if (pending.kind === "state") {
+			onChange(deleteState(process, pending.id));
+			setEdit((state) => ({
+				...state,
+				stateSel: null,
+				graphErr: null
+			}));
+		} else {
+			onChange(deleteTransition(process, pending.id));
+			setEdit((state) => ({
+				...state,
+				transSel: null,
+				graphErr: null
+			}));
+		}
+		setPending(null);
+	};
+	const pendingState = pending?.kind === "state" ? process.states.find((s) => s.id === pending.id) : void 0;
+	const pendingTransition = pending?.kind === "transition" ? process.transitions.find((t) => t.id === pending.id) : void 0;
+	const workflowStage = /* @__PURE__ */ jsxs("div", {
+		className: cn("wwc:grid wwc:min-h-0 wwc:min-w-0 wwc:flex-1 wwc:overflow-hidden", editing && "wwc:lg:grid-cols-[minmax(0,1fr)_22rem]"),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "wwc:flex wwc:min-h-0 wwc:flex-col wwc:overflow-hidden wwc:bg-card",
+			children: [
+				edit.graphErr && /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:shrink-0 wwc:items-start wwc:gap-2 wwc:border-b wwc:border-amber-600/30 wwc:bg-amber-500/5 wwc:p-3 wwc:text-sm",
+					children: [/* @__PURE__ */ jsx(XCircle, { className: "wwc:mt-0.5 wwc:h-4 wwc:w-4 wwc:shrink-0 wwc:text-amber-600" }), /* @__PURE__ */ jsxs("span", { children: [
+						/* @__PURE__ */ jsx("b", { children: "Edit refused:" }),
+						" ",
+						edit.graphErr
+					] })]
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: "wwc:min-h-0 wwc:flex-1",
+					children: process.states.length === 0 ? /* @__PURE__ */ jsx(Empty, {
+						title: "No states",
+						description: "This process has no states left. Add one in the rail on the right — a graph needs one initial state, one terminal state and at least one active state to pass rules L1–L3."
+					}) : /* @__PURE__ */ jsx(GraphCanvas, {
+						layout: "free",
+						fitViewOptions: { padding: .12 },
+						nodes,
+						edges,
+						onNodesChange,
+						onEdgesChange,
+						nodeTypes: PROCESS_NODE_TYPES,
+						nodesConnectable: editing,
+						nodesDraggable: !readOnly,
+						onConnect: editing ? onConnect : void 0,
+						isValidConnection: (connection) => editing && validateDrag(connection).ok,
+						onConnectStart: () => setEdit((state) => ({
+							...state,
+							graphErr: null
+						})),
+						onConnectEnd,
+						onNodeClick: (_, node) => {
+							setRailTab("state");
+							setEdit((state) => ({
+								...state,
+								stateSel: state.stateSel === node.id ? null : node.id,
+								transSel: null
+							}));
+						},
+						onNodeDragStop: readOnly ? void 0 : (_, node) => onChange(moveState(process, node.id, node.position.x, node.position.y)),
+						onEdgeClick: (_, edge) => {
+							setRailTab("transition");
+							setEdit((state) => ({
+								...state,
+								transSel: state.transSel === edge.id ? null : edge.id,
+								stateSel: null
+							}));
+						},
+						onPaneClick: () => setEdit((state) => ({
+							...state,
+							stateSel: null,
+							transSel: null,
+							graphErr: null
+						})),
+						children: !readOnly && /* @__PURE__ */ jsx(TidyLayoutButton, { onTidy: () => onChange({
+							...process,
+							layout: processLayout(process)
+						}) })
+					})
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: "wwc:flex wwc:shrink-0 wwc:items-center wwc:justify-center wwc:border-t wwc:border-border wwc:px-3 wwc:py-2",
+					children: /* @__PURE__ */ jsx(WorkflowStatus, {
+						lint: facts.lint,
+						graphKey
+					})
+				})
+			]
+		}), editing && /* @__PURE__ */ jsxs("div", {
+			className: "wwc:flex wwc:min-h-0 wwc:flex-col wwc:gap-4 wwc:overflow-y-auto wwc:border-t wwc:border-border wwc:bg-card wwc:p-4 wwc:lg:border-t-0 wwc:lg:border-l",
+			children: [
+				/* @__PURE__ */ jsxs(Tabs, {
+					value: railTab,
+					onValueChange: (value) => setRailTab(value),
+					children: [
+						/* @__PURE__ */ jsxs(TabsList, {
+							className: "wwc:grid wwc:w-full wwc:grid-cols-2",
+							children: [/* @__PURE__ */ jsxs(TabsTrigger, {
+								value: "state",
+								className: "wwc:gap-1.5",
+								children: [/* @__PURE__ */ jsx(CircleDot, { className: "wwc:h-3.5 wwc:w-3.5" }), "State"]
+							}), /* @__PURE__ */ jsxs(TabsTrigger, {
+								value: "transition",
+								className: "wwc:gap-1.5",
+								children: [/* @__PURE__ */ jsx(ArrowRight, { className: "wwc:h-3.5 wwc:w-3.5" }), "Transition"]
+							})]
+						}),
+						/* @__PURE__ */ jsx(TabsContent, {
+							value: "state",
+							className: "wwc:mt-4 wwc:space-y-4",
+							children: /* @__PURE__ */ jsxs(ProcessRailCard, {
+								title: "States",
+								count: process.states.length,
+								children: [process.states.length === 0 ? /* @__PURE__ */ jsx("p", {
+									className: "wwc:text-xs wwc:text-muted-foreground",
+									children: "No states yet. Add the first one below — a graph needs an initial state, a terminal state and at least one active state to pass rules L1–L3."
+								}) : /* @__PURE__ */ jsx(Accordion, {
+									type: "single",
+									collapsible: true,
+									value: edit.stateSel ?? "",
+									onValueChange: (next) => setEdit((state) => ({
+										...state,
+										stateSel: next || null,
+										transSel: null,
+										graphErr: null
+									})),
+									children: process.states.map((state) => /* @__PURE__ */ jsxs(AccordionItem, {
+										value: state.id,
+										className: "wwc:last:border-b-0",
+										children: [/* @__PURE__ */ jsx(AccordionTrigger, {
+											className: "wwc:py-2.5 wwc:hover:no-underline",
+											children: /* @__PURE__ */ jsxs("span", {
+												className: "wwc:flex wwc:min-w-0 wwc:items-center wwc:gap-2",
+												children: [
+													/* @__PURE__ */ jsx("span", {
+														className: "wwc:size-2 wwc:shrink-0 wwc:rounded-full",
+														style: { background: state.color }
+													}),
+													/* @__PURE__ */ jsx("span", {
+														className: "wwc:truncate",
+														children: state.name
+													}),
+													/* @__PURE__ */ jsxs("span", {
+														className: "wwc:shrink-0 wwc:text-[10px] wwc:text-muted-foreground",
+														children: [state.category, state.type === "initial" ? " · initial" : state.type === "terminal" ? " · terminal" : ""]
+													})
+												]
+											})
+										}), /* @__PURE__ */ jsx(AccordionContent, {
+											className: "wwc:pb-4",
+											children: /* @__PURE__ */ jsx(StateInspector, {
+												process,
+												state,
+												authoring,
+												onChange,
+												onDelete: () => requestDeleteState(state.id),
+												onSelectTransition: (id) => {
+													setEdit((current) => ({
+														...current,
+														transSel: id,
+														stateSel: null,
+														graphErr: null
+													}));
+													setRailTab("transition");
+												}
+											})
+										})]
+									}, state.id))
+								}), /* @__PURE__ */ jsx("div", {
+									className: "wwc:mt-3",
+									children: addingState ? /* @__PURE__ */ jsx(AddStateForm, {
+										onCancel: () => setAddingState(false),
+										onAdd: addNewState,
+										error: newStateErr
+									}) : /* @__PURE__ */ jsxs(Button, {
+										variant: "outline",
+										size: "sm",
+										className: "wwc:w-full wwc:gap-1.5",
+										onClick: openAddState,
+										children: [/* @__PURE__ */ jsx(Plus, { className: "wwc:h-3.5 wwc:w-3.5" }), "Add state"]
+									})
+								})]
+							})
+						}),
+						/* @__PURE__ */ jsx(TabsContent, {
+							value: "transition",
+							className: "wwc:mt-4 wwc:space-y-4",
+							children: /* @__PURE__ */ jsxs(ProcessRailCard, {
+								title: "Transitions",
+								count: facts.transitionCount,
+								children: [process.transitions.length === 0 ? /* @__PURE__ */ jsx("p", {
+									className: "wwc:text-xs wwc:text-muted-foreground",
+									children: "No transitions yet. Add one below, or drag between two states on the canvas to pre-fill the form."
+								}) : /* @__PURE__ */ jsx(Accordion, {
+									type: "single",
+									collapsible: true,
+									value: edit.transSel ?? "",
+									onValueChange: (next) => setEdit((state) => ({
+										...state,
+										transSel: next || null,
+										stateSel: null,
+										graphErr: null
+									})),
+									children: process.transitions.map((transition) => {
+										const from = process.states.find((s) => s.id === transition.from);
+										const to = process.states.find((s) => s.id === transition.to);
+										return /* @__PURE__ */ jsxs(AccordionItem, {
+											value: transition.id,
+											className: "wwc:last:border-b-0",
+											children: [/* @__PURE__ */ jsx(AccordionTrigger, {
+												className: "wwc:py-2.5 wwc:hover:no-underline",
+												children: /* @__PURE__ */ jsxs("span", {
+													className: "wwc:flex wwc:min-w-0 wwc:flex-col wwc:items-start wwc:gap-0.5",
+													children: [/* @__PURE__ */ jsxs("span", {
+														className: "wwc:flex wwc:min-w-0 wwc:items-center wwc:gap-1.5",
+														children: [/* @__PURE__ */ jsx("span", {
+															className: "wwc:truncate",
+															children: transition.key
+														}), transition.proposed && /* @__PURE__ */ jsx(ProposedTag, {})]
+													}), /* @__PURE__ */ jsxs("span", {
+														className: "wwc:flex wwc:min-w-0 wwc:items-center wwc:gap-1 wwc:text-[10px] wwc:font-normal wwc:text-muted-foreground",
+														children: [
+															/* @__PURE__ */ jsx("span", {
+																className: "wwc:truncate",
+																children: from?.name ?? "deleted"
+															}),
+															/* @__PURE__ */ jsx(ArrowRight, { className: "wwc:h-3 wwc:w-3 wwc:shrink-0" }),
+															/* @__PURE__ */ jsx("span", {
+																className: "wwc:truncate",
+																children: to?.name ?? "deleted"
+															})
+														]
+													})]
+												})
+											}), /* @__PURE__ */ jsx(AccordionContent, {
+												className: "wwc:pb-4",
+												children: /* @__PURE__ */ jsx(TransitionInspector, {
+													process,
+													transition,
+													onChange,
+													onDelete: () => setPending({
+														kind: "transition",
+														id: transition.id
+													}),
+													onNavigate
+												})
+											})]
+										}, transition.id);
+									})
+								}), /* @__PURE__ */ jsx("div", {
+									className: "wwc:mt-3",
+									children: addingTransition ? /* @__PURE__ */ jsx(AddTransitionForm, {
+										process,
+										draft: edit.draftTransition,
+										onDraftChange: (next) => setEdit((state) => ({
+											...state,
+											draftTransition: next
+										})),
+										onAdd: commitTransition,
+										onCancel: closeAddTransition
+									}) : /* @__PURE__ */ jsxs(Button, {
+										variant: "outline",
+										size: "sm",
+										className: "wwc:w-full wwc:gap-1.5",
+										onClick: () => setAddingTransition(true),
+										children: [/* @__PURE__ */ jsx(Plus, { className: "wwc:h-3.5 wwc:w-3.5" }), "Add transition"]
+									})
+								})]
+							})
+						})
+					]
+				}),
+				facts.lint.length > 0 && /* @__PURE__ */ jsx(ProcessRailCard, {
+					title: "Graph validity",
+					count: facts.lint.length,
+					children: /* @__PURE__ */ jsx("div", {
+						className: "wwc:space-y-1",
+						children: facts.lint.map((error) => /* @__PURE__ */ jsxs("div", {
+							className: "wwc:flex wwc:gap-1.5 wwc:text-xs",
+							children: [/* @__PURE__ */ jsx(GitBranch, { className: "wwc:mt-0.5 wwc:h-3 wwc:w-3 wwc:shrink-0 wwc:text-muted-foreground" }), /* @__PURE__ */ jsxs("span", { children: [
+								/* @__PURE__ */ jsx("b", { children: error.rule }),
+								" ",
+								error.msg
+							] })]
+						}, `${error.rule}-${error.msg}`))
+					})
+				}),
+				railFooter
+			]
+		})]
+	});
+	const dialogs = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(ConfirmDialog, {
+		open: pending?.kind === "state",
+		onOpenChange: (next) => {
+			if (!next) setPending(null);
+		},
+		title: "Delete state",
+		description: WC3_PROCESS_MESSAGES.deleteState(pendingState?.name ?? "", process.transitions.filter((t) => t.from === pending?.id || t.to === pending?.id).length),
+		confirmLabel: "Delete",
+		destructive: true,
+		onConfirm: confirmPending
+	}), /* @__PURE__ */ jsx(ConfirmDialog, {
+		open: pending?.kind === "transition",
+		onOpenChange: (next) => {
+			if (!next) setPending(null);
+		},
+		title: "Delete transition",
+		description: WC3_PROCESS_MESSAGES.deleteTransition(pendingTransition?.key ?? ""),
+		confirmLabel: "Delete transition",
+		destructive: true,
+		onConfirm: confirmPending
+	})] });
+	if (!shell) return /* @__PURE__ */ jsx(StateMachineDataContext.Provider, {
+		value: data,
+		children: /* @__PURE__ */ jsxs("div", {
+			className: cn("wwc:flex wwc:min-h-0 wwc:min-w-0 wwc:flex-1 wwc:flex-col", className),
+			children: [workflowStage, dialogs]
+		})
+	});
+	const railGroups = (authoring ? sectionGroups.map((group) => ({
+		...group,
+		items: group.items.filter((id) => id !== "instances" && id !== "bottlenecks")
+	})).filter((group) => group.items.length > 0) : sectionGroups).map((group) => ({
+		divider: group.divider,
+		items: group.items.map((id) => ({
+			id,
+			label: sectionLabels?.[id] ?? SECTION_LABEL[id],
+			icon: SECTION_ICON[id],
+			count: id === "canvas" ? facts.stateCount : id === "instances" ? facts.tokenCount : id === "bottlenecks" ? facts.openCount : id === "general" && facts.lint.length > 0 ? facts.lint.length : void 0
+		}))
+	}));
+	const selectState = (stateId) => setEdit((state) => ({
+		...state,
+		stateSel: stateId,
+		transSel: null
+	}));
+	const shellBody = /* @__PURE__ */ jsxs("div", {
+		className: cn("wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col", className),
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "wwc:flex wwc:min-h-12 wwc:shrink-0 wwc:items-center wwc:justify-between wwc:gap-3 wwc:border-b wwc:border-border wwc:bg-card wwc:px-3",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:min-w-0 wwc:items-center wwc:gap-2.5",
+					children: [
+						onBack && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(Button, {
+							variant: "ghost",
+							size: "sm",
+							className: "wwc:gap-1.5",
+							onClick: onBack,
+							children: [/* @__PURE__ */ jsx(ArrowLeft, { className: "wwc:h-4 wwc:w-4" }), "Back"]
+						}), /* @__PURE__ */ jsx("div", { className: "wwc:h-5 wwc:w-px wwc:shrink-0 wwc:bg-border" })] }),
+						!authoring && /* @__PURE__ */ jsx(ProcessGlyphTile, { process }),
+						/* @__PURE__ */ jsx("h1", {
+							className: "wwc:truncate wwc:text-sm wwc:font-semibold",
+							children: process.name
+						}),
+						!authoring && /* @__PURE__ */ jsx(ProductChip, {
+							process,
+							onOpenProduct: onNavigate ? (key) => onNavigate(lineageNav.product(key)) : void 0
+						}),
+						!authoring && /* @__PURE__ */ jsx(SlaModelBadge, { process }),
+						!authoring && facts.lint.length > 0 && /* @__PURE__ */ jsx(HoverTooltip, {
+							content: facts.lint.map((error) => `${error.rule}: ${error.msg}`).join(" "),
+							children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsxs(Badge, {
+								variant: "warningSoft",
+								className: "wwc:gap-1 wwc:font-normal",
+								children: [
+									/* @__PURE__ */ jsx(TriangleAlert, { className: "wwc:h-3 wwc:w-3" }),
+									facts.lint.length,
+									" lint"
+								]
+							}) })
+						}),
+						!authoring && /* @__PURE__ */ jsxs("span", {
+							className: "wwc:hidden wwc:truncate wwc:text-[11px] wwc:text-muted-foreground wwc:lg:inline",
+							children: [
+								facts.stateCount,
+								" states · ",
+								facts.transitionCount,
+								" transitions · ",
+								facts.openCount,
+								" open tokens"
+							]
+						})
+					]
+				}), /* @__PURE__ */ jsx("div", {
+					className: "wwc:flex wwc:shrink-0 wwc:items-center wwc:gap-3",
+					children: headerActions
+				})]
+			}),
+			/* @__PURE__ */ jsxs(RecordDetailShell, {
+				title: "Process",
+				sections: railGroups,
+				activeSectionId: section,
+				onSectionChange: (id) => setSection(id),
+				flush: true,
+				children: [formSlot ? /* @__PURE__ */ jsx("div", {
+					className: cn("wwc:min-h-0 wwc:min-w-0 wwc:flex-1 wwc:flex-col", section === "form" ? "wwc:flex" : "wwc:hidden"),
+					children: formSlot
+				}) : null, section === "canvas" ? /* @__PURE__ */ jsx("div", {
+					className: "wwc:flex wwc:min-h-0 wwc:min-w-0 wwc:flex-1 wwc:flex-col",
+					children: workflowStage
+				}) : section === "general" ? /* @__PURE__ */ jsx(SectionWell, { children: /* @__PURE__ */ jsx(SettingsSection, {
+					process,
+					onChange,
+					onNavigate,
+					authoring,
+					identityExtra: permitFields ? /* @__PURE__ */ jsx(PermitFields, {
+						permit,
+						onPermitChange: setPermit,
+						typeOptions
+					}) : void 0
+				}) }) : section === "policy" ? /* @__PURE__ */ jsx(SectionWell, { children: /* @__PURE__ */ jsx(PermitPolicySection, {
+					policy: permit.policy,
+					onChange: (policy) => setPermit({
+						...permit,
+						policy
+					})
+				}) }) : section === "form" ? formSlot ? null : /* @__PURE__ */ jsx(SectionWell, { children: /* @__PURE__ */ jsx(Empty, {
+					title: "Form",
+					description: "Nothing here yet. This is where the permit's request form goes — the fields an applicant fills in before the workflow has anything to move. Pass `formSlot` to fill it."
+				}) }) : section === "instances" ? /* @__PURE__ */ jsx(SectionWell, { children: /* @__PURE__ */ jsx(InstancesSection, {
+					process,
+					selectedStateId: edit.stateSel,
+					onSelectState: selectState,
+					loading: instancesLoading
+				}) }) : /* @__PURE__ */ jsx(SectionWell, { children: /* @__PURE__ */ jsx(ProcessBottlenecksSection, {
+					process,
+					instances,
+					selectedStateId: edit.stateSel,
+					onSelectState: selectState,
+					onOpenInstances: (stateId) => {
+						selectState(stateId);
+						setSection("instances");
+					}
+				}) })]
+			}),
+			dialogs
+		]
+	});
+	return /* @__PURE__ */ jsx(StateMachineDataContext.Provider, {
+		value: data,
+		children: shellBody
+	});
+}
+//#endregion
+export { AddStateForm, AddTransitionForm, InstancesSection, PERMIT_TYPE_COLOR, PROCESS_NODE_TYPES, PermitFields, ProcessFlowNode, ProcessRailCard, SettingsSection, StateInspector, StateMachine, TransitionInspector, WC3_PROCESS_EFFECTS, permitTypeColor, permitTypeOptions };
+
+//# sourceMappingURL=state-machine.mjs.map