@object-ui/app-shell 6.2.3 → 7.1.0

package/dist/views/metadata-admin/inspectors/FlowNodeConfigField.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { t } from '../i18n';
+import { InspectorTextField, InspectorNumberField, InspectorSelectField, InspectorCheckboxField, } from './_shared';
+import { Label } from '@object-ui/components';
+import { FlowKeyValueField } from './FlowKeyValueField';
+import { FlowStringListField } from './FlowStringListField';
+import { FlowObjectListField } from './FlowObjectListField';
+import { FlowReferenceField } from './FlowReferenceField';
+import { validateExpressionClient } from './expression-validate';
+export function FlowNodeConfigField({ field, value, onCommit, disabled, locale, context }) {
+    const control = (() => {
+        switch (field.kind) {
+            case 'reference':
+                return (_jsx(FlowReferenceField, { field: field, value: value, onCommit: (v) => onCommit(v), disabled: disabled, context: context }));
+            case 'keyValue':
+                return (_jsx(FlowKeyValueField, { label: field.label, value: value, onCommit: (v) => onCommit(v), disabled: disabled, addLabel: t('engine.inspector.flowNode.kv.add', locale), keyLabel: t('engine.inspector.flowNode.kv.key', locale), valueLabel: t('engine.inspector.flowNode.kv.value', locale), removeLabel: t('engine.inspector.flowNode.kv.remove', locale), emptyLabel: t('engine.inspector.flowNode.kv.empty', locale) }));
+            case 'stringList':
+                return (_jsx(FlowStringListField, { label: field.label, value: value, onCommit: (v) => onCommit(v), disabled: disabled, addLabel: t('engine.inspector.flowNode.list.add', locale), itemLabel: t('engine.inspector.flowNode.list.item', locale), removeLabel: t('engine.inspector.flowNode.list.remove', locale), emptyLabel: t('engine.inspector.flowNode.list.empty', locale) }));
+            case 'objectList':
+                return (_jsx(FlowObjectListField, { label: field.label, columns: field.columns ?? [], value: value, onCommit: (v) => onCommit(v), disabled: disabled, addLabel: t('engine.inspector.flowNode.list.add', locale), removeLabel: t('engine.inspector.flowNode.list.remove', locale), emptyLabel: t('engine.inspector.flowNode.list.empty', locale), context: context }));
+            case 'number':
+                return (_jsx(InspectorNumberField, { label: field.label, value: typeof value === 'number' ? value : value != null && value !== '' ? Number(value) : undefined, placeholder: field.placeholder, onCommit: (v) => onCommit(v), disabled: disabled }));
+            case 'boolean':
+                return (_jsx(InspectorCheckboxField, { label: field.label, value: value === true, onCommit: (v) => onCommit(v), disabled: disabled }));
+            case 'select':
+                return (_jsx(InspectorSelectField, { label: field.label, value: value != null ? String(value) : '', options: field.options ?? [], onCommit: (v) => onCommit(v), disabled: disabled }));
+            case 'textarea':
+                return (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: field.label }), _jsx("textarea", { value: value != null ? String(value) : '', onChange: (e) => onCommit(e.target.value), placeholder: field.placeholder, disabled: disabled, rows: 4, className: "w-full rounded border bg-background px-2 py-1.5 font-mono text-xs" })] }));
+            case 'expression':
+            case 'text':
+            default:
+                return (_jsx(InspectorTextField, { label: field.label, value: value != null ? String(value) : '', placeholder: field.placeholder, onCommit: (v) => onCommit(v), disabled: disabled, mono: field.kind === 'expression' }));
+        }
+    })();
+    // ADR-0032 — surface a malformed condition (e.g. the `{record.x}` brace-in-CEL
+    // mistake) inline, as the author types, with the same corrective message the
+    // build and the agent tool emit. Only checked for expression-bearing fields.
+    const exprIssue = field.kind === 'expression' ? validateExpressionClient('predicate', value) : null;
+    return (_jsxs("div", { className: "space-y-1", children: [control, exprIssue && (_jsx("p", { className: "text-[11px] leading-snug text-destructive", role: "alert", children: exprIssue.message })), field.help && !exprIssue && (_jsx("p", { className: "text-[11px] leading-snug text-muted-foreground", children: field.help }))] }));
+}

package/dist/views/metadata-admin/inspectors/FlowNodeInspector.d.ts

@@ -0,0 +1,14 @@
+/**
+ * FlowNodeInspector — scoped editor for the selected flow node.
+ *
+ * Selection shape:  { kind: 'node', id: <nodeId> }
+ * Patches:           draft.nodes[i] = {...node, ...updates}
+ *
+ * Beyond id / label / type / description, each node type exposes a set of
+ * typed form fields (see `flow-node-config`) that edit scalar keys on
+ * `node.config`. Any remaining config keys (objects, arrays, bespoke flags)
+ * are surfaced in an "Advanced (JSON)" block so authors are never locked out.
+ */
+import * as React from 'react';
+import type { MetadataInspectorProps } from '../inspector-registry';
+export declare function FlowNodeInspector({ selection, draft, onPatch, onClearSelection, locale, readOnly }: MetadataInspectorProps): React.JSX.Element;

package/dist/views/metadata-admin/inspectors/FlowNodeInspector.js

@@ -0,0 +1,205 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * FlowNodeInspector — scoped editor for the selected flow node.
+ *
+ * Selection shape:  { kind: 'node', id: <nodeId> }
+ * Patches:           draft.nodes[i] = {...node, ...updates}
+ *
+ * Beyond id / label / type / description, each node type exposes a set of
+ * typed form fields (see `flow-node-config`) that edit scalar keys on
+ * `node.config`. Any remaining config keys (objects, arrays, bespoke flags)
+ * are surfaced in an "Advanced (JSON)" block so authors are never locked out.
+ */
+import * as React from 'react';
+import { Plus } from 'lucide-react';
+import { t } from '../i18n';
+import { InspectorShell, InspectorTextField, InspectorSelectField, InspectorRemoveButton, InspectorEmptyState, spliceArray, } from './_shared';
+import { fieldsForNodeType, isFieldVisible, getFieldValue, configKeyOf, FLOW_NODE_TYPE_OPTIONS, } from './flow-node-config';
+import { jsonSchemaToFlowFields } from './json-schema-to-fields';
+import { useActionConfigSchemas } from '../previews/useFlowNodePalette';
+import { FlowNodeConfigField } from './FlowNodeConfigField';
+import { ScreenPreview } from '../previews/ScreenPreview';
+/**
+ * Mirror a decision node's `conditions` (branches) onto its outgoing sequence
+ * edges, in declared order: branch i -> the i-th out-edge. A branch whose
+ * expression is `true` marks its edge as the default/else path; an empty
+ * expression clears the guard. Fault / back edges are left untouched.
+ *
+ * This is what lets a decision authored entirely in Studio actually route at
+ * runtime: the engine and the simulator branch on `edge.condition`, NOT on
+ * `node.config.conditions` (which is only a node-local branch list). Without
+ * the mirror, every out-edge stays unconditional and all branches fire.
+ */
+function syncDecisionEdges(decisionId, conditions, edges) {
+    const branches = Array.isArray(conditions) ? conditions : [];
+    let bi = 0;
+    return edges.map((e) => {
+        if (e.source !== decisionId || e.type === 'fault' || e.type === 'back')
+            return e;
+        const branch = branches[bi++];
+        if (!branch || typeof branch !== 'object')
+            return e;
+        const expr = typeof branch.expression === 'string' ? branch.expression.trim() : '';
+        const label = typeof branch.label === 'string' ? branch.label.trim() : '';
+        const next = { ...e };
+        if (label)
+            next.label = label;
+        else
+            delete next.label;
+        if (expr && expr !== 'true') {
+            next.condition = expr;
+            delete next.isDefault;
+        }
+        else if (expr === 'true') {
+            next.isDefault = true;
+            delete next.condition;
+        }
+        else {
+            delete next.condition;
+            delete next.isDefault;
+        }
+        return next;
+    });
+}
+function asConfig(node) {
+    const c = node?.config;
+    return c && typeof c === 'object' && !Array.isArray(c) ? c : {};
+}
+/**
+ * Immutably set `value` at `path` on a plain object, pruning any intermediate
+ * object that becomes empty (so e.g. clearing the last `waitEventConfig` key
+ * removes the whole block). Empty string / null / undefined deletes the leaf.
+ */
+function setAtPath(obj, path, value) {
+    const [head, ...rest] = path;
+    const next = { ...obj };
+    if (rest.length === 0) {
+        if (value === undefined || value === null || value === '')
+            delete next[head];
+        else
+            next[head] = value;
+    }
+    else {
+        const cur = next[head];
+        const base = cur && typeof cur === 'object' && !Array.isArray(cur) ? cur : {};
+        const child = setAtPath(base, rest, value);
+        if (Object.keys(child).length === 0)
+            delete next[head];
+        else
+            next[head] = child;
+    }
+    return next;
+}
+export function FlowNodeInspector({ selection, draft, onPatch, onClearSelection, locale, readOnly }) {
+    const nodes = Array.isArray(draft.nodes) ? draft.nodes : [];
+    const index = nodes.findIndex((n) => n?.id === selection.id);
+    const node = index >= 0 ? nodes[index] : null;
+    // Server-driven property form: when the running engine publishes a config
+    // JSON Schema for this node type (ADR-0018 §configSchema — e.g. the ADR-0019
+    // approval node), derive the form from it so the designer stays in lock-step
+    // with the backend. Falls back to the hardcoded field group when no schema is
+    // published (offline / plugin absent / older backend).
+    const configSchemas = useActionConfigSchemas();
+    const fields = React.useMemo(() => {
+        const schema = node?.type ? configSchemas[node.type] : undefined;
+        const serverFields = schema !== undefined ? jsonSchemaToFlowFields(schema) : null;
+        return serverFields ?? fieldsForNodeType(node?.type);
+    }, [configSchemas, node?.type]);
+    const config = asConfig(node);
+    const visibleFields = fields.filter((f) => isFieldVisible(f, node, fields));
+    // `{var}` interpolation source for the screen preview — the flow's declared
+    // variables and their defaults (the designer has no live run state).
+    const screenVars = React.useMemo(() => {
+        const decls = Array.isArray(draft.variables) ? draft.variables : [];
+        const out = {};
+        for (const v of decls)
+            if (v && typeof v.name === 'string')
+                out[v.name] = v.defaultValue;
+        return out;
+    }, [draft]);
+    // Only fields stored under `config` "own" a config key; spec-structured
+    // blocks (waitEventConfig, etc.) and top-level timeoutMs never suppress an
+    // Advanced key.
+    const ownedConfigKeys = React.useMemo(() => {
+        const s = new Set();
+        for (const f of fields) {
+            const k = configKeyOf(f);
+            if (k)
+                s.add(k);
+        }
+        return s;
+    }, [fields]);
+    const extraJson = React.useMemo(() => {
+        const extra = Object.fromEntries(Object.entries(config).filter(([k]) => !ownedConfigKeys.has(k)));
+        return Object.keys(extra).length ? JSON.stringify(extra, null, 2) : '';
+        // Recompute when the node identity changes (patch) or the known keys change.
+    }, [node, ownedConfigKeys]); // eslint-disable-line react-hooks/exhaustive-deps
+    const [advText, setAdvText] = React.useState(extraJson);
+    const [advError, setAdvError] = React.useState(null);
+    const [advOpen, setAdvOpen] = React.useState(extraJson.trim() !== '');
+    // Reveals the optional custom-keys editor on nodes that currently have none.
+    const [advReveal, setAdvReveal] = React.useState(false);
+    React.useEffect(() => {
+        setAdvText(extraJson);
+        setAdvError(null);
+        setAdvOpen(extraJson.trim() !== '');
+        setAdvReveal(false);
+    }, [extraJson]);
+    if (!node) {
+        return (_jsx(InspectorShell, { kindLabel: t('engine.inspector.flowNode.kind', locale), title: selection.label ?? selection.id, onClose: onClearSelection, closeLabel: t('engine.inspector.flowNode.close', locale), children: _jsx(InspectorEmptyState, { message: selection.id }) }));
+    }
+    const patchNode = (updates) => {
+        onPatch({ nodes: spliceArray(nodes, index, { ...node, ...updates }) });
+    };
+    const hasExtras = extraJson.trim() !== '';
+    // Screen nodes (and the `user_task` alias) get a live end-user preview.
+    const isScreen = node.type === 'screen' || node.type === 'user_task';
+    const setField = (path, value) => {
+        const nextNode = setAtPath(node, path, value);
+        const patch = { nodes: spliceArray(nodes, index, nextNode) };
+        // Decision branches drive routing — mirror them onto the node's outgoing
+        // edges so the engine/simulator can actually branch (they read
+        // edge.condition, not node.config.conditions).
+        if (node.type === 'decision' && path.length === 2 && path[0] === 'config' && path[1] === 'conditions') {
+            const draftEdges = Array.isArray(draft.edges)
+                ? (draft.edges)
+                : [];
+            patch.edges = syncDecisionEdges(node.id, value, draftEdges);
+        }
+        onPatch(patch);
+    };
+    const commitAdvanced = () => {
+        try {
+            const parsed = advText.trim() === '' ? {} : JSON.parse(advText);
+            if (!parsed || typeof parsed !== 'object' || Array.isArray(parsed))
+                throw new Error('Must be a JSON object');
+            // Form-owned config keys always win: the Advanced block may only set keys
+            // that no form field owns, so it can never overwrite or resurrect one.
+            const knownPart = Object.fromEntries(Object.entries(config).filter(([k]) => ownedConfigKeys.has(k)));
+            const extrasPart = Object.fromEntries(Object.entries(parsed).filter(([k]) => !ownedConfigKeys.has(k)));
+            const merged = { ...knownPart, ...extrasPart };
+            setAdvError(null);
+            const nextNode = { ...node };
+            if (Object.keys(merged).length === 0)
+                delete nextNode.config;
+            else
+                nextNode.config = merged;
+            onPatch({ nodes: spliceArray(nodes, index, nextNode) });
+        }
+        catch (e) {
+            setAdvError(String(e.message));
+        }
+    };
+    const remove = () => {
+        onPatch({ nodes: spliceArray(nodes, index, null) });
+        onClearSelection();
+    };
+    const typeOptions = FLOW_NODE_TYPE_OPTIONS.includes(node.type)
+        ? [...FLOW_NODE_TYPE_OPTIONS]
+        : [...FLOW_NODE_TYPE_OPTIONS, node.type ?? ''].filter(Boolean);
+    return (_jsxs(InspectorShell, { kindLabel: t('engine.inspector.flowNode.kind', locale), title: node.label || node.id, onClose: onClearSelection, closeLabel: t('engine.inspector.flowNode.close', locale), footer: _jsx(InspectorRemoveButton, { label: t('engine.inspector.flowNode.remove', locale), onClick: remove, disabled: readOnly }), children: [_jsx(InspectorTextField, { label: t('engine.inspector.flowNode.id', locale), value: node.id, onCommit: (v) => patchNode({ id: v }), disabled: readOnly, mono: true }), _jsx(InspectorTextField, { label: t('engine.inspector.flowNode.label', locale), value: node.label ?? '', onCommit: (v) => patchNode({ label: v }), disabled: readOnly }), _jsx(InspectorSelectField, { label: t('engine.inspector.flowNode.type', locale), value: node.type, options: typeOptions.map((v) => ({ value: v, label: v })), onCommit: (v) => patchNode({ type: v }), disabled: readOnly }), _jsx(InspectorTextField, { label: t('engine.inspector.flowNode.description', locale), value: node.description ?? '', onCommit: (v) => patchNode({ description: v || undefined }), disabled: readOnly }), fields.length === 0 ? (_jsx("p", { className: "pt-1 text-xs italic text-muted-foreground", children: t('engine.inspector.flowNode.noConfig', locale) })) : (visibleFields.length > 0 && (_jsxs("div", { className: "flex items-center gap-2 pt-1", children: [_jsx("span", { className: "text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: t('engine.inspector.flowNode.configuration', locale) }), _jsx("span", { className: "h-px flex-1 bg-border", "aria-hidden": true })] }))), visibleFields.map((field) => (_jsx(FlowNodeConfigField, { field: field, value: getFieldValue(node, field), onCommit: (v) => setField(field.path, v), disabled: readOnly, locale: locale, context: { draft, node } }, field.id))), isScreen && _jsx(ScreenPreview, { node: node, variables: screenVars, className: "mt-1" }), hasExtras || advReveal ? (_jsxs("details", { className: "group rounded border bg-muted/20", open: advOpen, onToggle: (e) => setAdvOpen(e.target.open), children: [_jsx("summary", { className: "cursor-pointer select-none px-2 py-1.5 text-xs font-medium text-muted-foreground", children: t('engine.inspector.flowNode.advanced', locale) }), _jsxs("div", { className: "space-y-1 border-t p-2", children: [_jsx("p", { className: "text-[11px] leading-snug text-muted-foreground", children: t('engine.inspector.flowNode.advancedHint', locale) }), _jsx("textarea", { value: advText, onChange: (e) => setAdvText(e.target.value), onBlur: commitAdvanced, disabled: readOnly, rows: 6, placeholder: "{ }", className: "w-full rounded border bg-background px-2 py-1.5 font-mono text-xs" }), advError && _jsx("div", { className: "text-xs text-destructive", children: advError })] })] })) : (!readOnly && (_jsxs("button", { type: "button", onClick: () => {
+                    setAdvReveal(true);
+                    setAdvOpen(true);
+                }, className: "inline-flex items-center gap-1 self-start text-[11px] text-muted-foreground transition-colors hover:text-foreground", children: [_jsx(Plus, { className: "h-3 w-3" }), t('engine.inspector.flowNode.advanced', locale)] })))] }));
+}

package/dist/views/metadata-admin/inspectors/FlowObjectListField.d.ts

@@ -0,0 +1,26 @@
+/**
+ * FlowObjectListField — a repeatable array-of-objects editor driven by a column
+ * schema (e.g. a screen node's `fields`: a list of `{name,label,type,required,
+ * visibleWhen}` definitions).
+ *
+ * Like the sibling key/value and string-list editors, rows are held in LOCAL
+ * state with a STABLE id and flushed on blur / Enter / add / remove so a row
+ * never remounts mid-keystroke. Empty per-cell values are pruned; a row with no
+ * populated cells is dropped on flush; an empty list commits `undefined`.
+ */
+import * as React from 'react';
+import type { FlowConfigColumn } from './flow-node-config';
+import { type FlowReferenceContext } from './FlowReferenceField';
+export interface FlowObjectListFieldProps {
+    label: string;
+    columns: FlowConfigColumn[];
+    value: unknown;
+    onCommit: (value: Array<Record<string, unknown>> | undefined) => void;
+    disabled?: boolean;
+    addLabel: string;
+    removeLabel: string;
+    emptyLabel: string;
+    /** Draft + node context so `reference` columns can resolve their options. */
+    context?: FlowReferenceContext;
+}
+export declare function FlowObjectListField({ label, columns, value, onCommit, disabled, addLabel, removeLabel, emptyLabel, context, }: FlowObjectListFieldProps): React.JSX.Element;

package/dist/views/metadata-admin/inspectors/FlowObjectListField.js

@@ -0,0 +1,105 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * FlowObjectListField — a repeatable array-of-objects editor driven by a column
+ * schema (e.g. a screen node's `fields`: a list of `{name,label,type,required,
+ * visibleWhen}` definitions).
+ *
+ * Like the sibling key/value and string-list editors, rows are held in LOCAL
+ * state with a STABLE id and flushed on blur / Enter / add / remove so a row
+ * never remounts mid-keystroke. Empty per-cell values are pruned; a row with no
+ * populated cells is dropped on flush; an empty list commits `undefined`.
+ */
+import * as React from 'react';
+import { Plus, X } from 'lucide-react';
+import { Button, Input, Label, Checkbox } from '@object-ui/components';
+import { uniqueId } from './_shared';
+import { ReferenceCombobox, resolveRefKind } from './FlowReferenceField';
+function toRows(list, columns) {
+    const ids = [];
+    return list.map((item) => {
+        const id = uniqueId('ol', ids);
+        ids.push(id);
+        const values = {};
+        for (const col of columns) {
+            const v = item[col.key];
+            if (col.kind === 'boolean')
+                values[col.key] = v === true;
+            else if (v != null)
+                values[col.key] = String(v);
+            else
+                values[col.key] = '';
+        }
+        return { id, values };
+    });
+}
+function rowsToList(rows, columns) {
+    const out = [];
+    for (const row of rows) {
+        const obj = {};
+        let hasValue = false;
+        for (const col of columns) {
+            const v = row.values[col.key];
+            if (col.kind === 'boolean') {
+                if (v === true) {
+                    obj[col.key] = true;
+                    hasValue = true;
+                }
+            }
+            else if (typeof v === 'string' && v.trim() !== '') {
+                obj[col.key] = v.trim();
+                hasValue = true;
+            }
+        }
+        if (hasValue)
+            out.push(obj);
+    }
+    return out;
+}
+export function FlowObjectListField({ label, columns, value, onCommit, disabled, addLabel, removeLabel, emptyLabel, context, }) {
+    const external = React.useMemo(() => Array.isArray(value)
+        ? value.filter((v) => v && typeof v === 'object')
+        : [], [value]);
+    const [rows, setRows] = React.useState(() => toRows(external, columns));
+    const lastCommitted = React.useRef(JSON.stringify(external));
+    React.useEffect(() => {
+        const next = JSON.stringify(external);
+        if (next !== lastCommitted.current) {
+            setRows(toRows(external, columns));
+            lastCommitted.current = next;
+        }
+    }, [external, columns]);
+    const flush = (nextRows) => {
+        const list = rowsToList(nextRows, columns);
+        lastCommitted.current = JSON.stringify(list);
+        onCommit(list.length ? list : undefined);
+    };
+    const setCell = (id, key, v) => {
+        setRows((rs) => rs.map((r) => (r.id === id ? { ...r, values: { ...r.values, [key]: v } } : r)));
+    };
+    const addRow = () => {
+        const values = {};
+        for (const col of columns)
+            values[col.key] = col.kind === 'boolean' ? false : '';
+        setRows((rs) => [...rs, { id: uniqueId('ol', rs.map((r) => r.id)), values }]);
+    };
+    const removeRow = (id) => {
+        setRows((rs) => {
+            const next = rs.filter((r) => r.id !== id);
+            flush(next);
+            return next;
+        });
+    };
+    return (_jsxs("div", { className: "space-y-1.5", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: label }), _jsxs("div", { className: "space-y-2", children: [rows.length === 0 && (_jsx("p", { className: "text-[11px] italic text-muted-foreground", children: emptyLabel })), rows.map((row) => (_jsxs("div", { className: "rounded border bg-muted/30 p-2", children: [_jsx("div", { className: "mb-1 flex justify-end", children: _jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "h-6 w-6 p-0 text-muted-foreground", onClick: () => removeRow(row.id), disabled: disabled, "aria-label": removeLabel, title: removeLabel, children: _jsx(X, { className: "h-3.5 w-3.5" }) }) }), _jsx("div", { className: "space-y-1.5", children: columns.map((col) => (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Label, { className: "w-24 shrink-0 text-[11px] text-muted-foreground", children: col.label }), col.kind === 'boolean' ? (_jsx(Checkbox, { checked: row.values[col.key] === true, onCheckedChange: (c) => {
+                                                setRows((rs) => {
+                                                    const next = rs.map((r) => r.id === row.id
+                                                        ? { ...r, values: { ...r.values, [col.key]: c === true } }
+                                                        : r);
+                                                    flush(next);
+                                                    return next;
+                                                });
+                                            }, disabled: disabled })) : col.kind === 'reference' ? (_jsx("div", { className: "flex-1", children: _jsx(ReferenceCombobox, { resolved: resolveRefKind(col.ref, (k) => row.values[k]), value: typeof row.values[col.key] === 'string' ? row.values[col.key] : '', onCommit: (v) => setCell(row.id, col.key, typeof v === 'string' ? v : ''), onBlur: () => flush(rows), placeholder: col.placeholder, disabled: disabled, context: context, showHint: false }) })) : (_jsx(Input, { value: typeof row.values[col.key] === 'string' ? row.values[col.key] : '', onChange: (e) => setCell(row.id, col.key, e.target.value), onBlur: () => flush(rows), onKeyDown: (e) => {
+                                                if (e.key === 'Enter')
+                                                    e.target.blur();
+                                            }, placeholder: col.placeholder, disabled: disabled, className: `h-8 flex-1 text-xs${col.kind === 'expression' ? ' font-mono' : ''}` }))] }, col.key))) })] }, row.id)))] }), _jsxs(Button, { type: "button", variant: "outline", size: "sm", className: "h-7 w-full text-xs", onClick: addRow, disabled: disabled, children: [_jsx(Plus, { className: "mr-1 h-3.5 w-3.5" }), addLabel] })] }));
+}

package/dist/views/metadata-admin/inspectors/FlowReferenceField.d.ts

@@ -0,0 +1,83 @@
+/**
+ * FlowReferenceField — an *editable combobox* for flow-node config values that
+ * are really references (an object's field, an object/flow/role/user/… by name,
+ * a connector, an email template, or another node in this flow) rather than
+ * free-form strings.
+ *
+ * Why a combobox and not a strict dropdown: the designer must never trap the
+ * author. The control suggests known values (fetched per {@link ReferenceKind})
+ * but always accepts free text, so a field that doesn't exist yet, a role the
+ * current tenant hasn't populated, or an empty catalog all still let the author
+ * type a value. Implemented with a native `<datalist>` for exactly that
+ * suggest-but-allow-anything behaviour, zero extra dependencies, and built-in
+ * accessibility.
+ *
+ * Two layers:
+ *   • {@link ReferenceCombobox} — the bare control, given an already-resolved
+ *     concrete kind. Reused by the `objectList` repeater for per-row reference
+ *     cells (e.g. an approver's value).
+ *   • {@link FlowReferenceField} — the inspector field wrapper (label + hint),
+ *     resolving a *polymorphic* reference against the node's own sibling config.
+ *
+ * Data sources are resolved lazily from the running backend (the same source of
+ * truth as the rest of the designer); `object-field` additionally needs to know
+ * *which* object — resolved from the reference's `objectSource` against the
+ * flow draft (trigger object) or the node's sibling config.
+ */
+import * as React from 'react';
+import type { FlowReferenceSpec, ReferenceKind } from './flow-node-config';
+/** Context the reference picker needs to resolve dynamic option sources. */
+export interface FlowReferenceContext {
+    /** The whole flow draft — used for `$trigger` object + the node list. */
+    draft: Record<string, unknown>;
+    /** The node currently being edited — used to resolve sibling config keys. */
+    node: Record<string, unknown> | null;
+}
+/** A concrete (non-polymorphic) reference resolution. */
+export interface ResolvedRef {
+    kind: ReferenceKind;
+    objectSource?: string;
+}
+/**
+ * Resolve a (possibly polymorphic) reference spec to a concrete kind. For a
+ * polymorphic spec, `sibling(key)` supplies the discriminator value (the row's
+ * `type`, or a sibling config key). Returns undefined when nothing resolves —
+ * the caller then renders plain free text.
+ */
+export declare function resolveRefKind(ref: FlowReferenceSpec | undefined, sibling: (key: string) => unknown): ResolvedRef | undefined;
+export interface ReferenceComboboxProps {
+    /** The resolved concrete reference, or undefined → plain free text. */
+    resolved: ResolvedRef | undefined;
+    value: unknown;
+    onCommit: (value: unknown) => void;
+    /** Optional blur handler (the `objectList` repeater flushes rows on blur). */
+    onBlur?: () => void;
+    disabled?: boolean;
+    placeholder?: string;
+    context?: FlowReferenceContext;
+    /** Show the "Fields of X." / unresolved hint under the control (default true). */
+    showHint?: boolean;
+}
+/**
+ * The bare reference combobox — suggestions for `resolved.kind`, always
+ * free-text editable. Hooks are called unconditionally (kind-gated args) so the
+ * component is safe to use in a repeater where the kind changes per row.
+ */
+export declare function ReferenceCombobox({ resolved, value, onCommit, onBlur, disabled, placeholder, context, showHint }: ReferenceComboboxProps): React.JSX.Element;
+export interface FlowReferenceFieldProps {
+    field: {
+        label: string;
+        placeholder?: string;
+        ref?: FlowReferenceSpec;
+    };
+    value: unknown;
+    onCommit: (value: unknown) => void;
+    disabled?: boolean;
+    context?: FlowReferenceContext;
+}
+/**
+ * Inspector field wrapper: a labelled reference combobox. A polymorphic ref is
+ * resolved against the node's own sibling config keys (e.g. the script node's
+ * `template` follows `actionType`).
+ */
+export declare function FlowReferenceField({ field, value, onCommit, disabled, context }: FlowReferenceFieldProps): React.JSX.Element;