@object-ui/app-shell 6.2.3 → 7.1.0

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

@@ -0,0 +1,181 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * 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 { Input, Label } from '@object-ui/components';
+import { useMetadataClient } from '../useMetadata';
+import { useObjectFields } from '../previews/useObjectFields';
+/**
+ * Reference kinds backed by a flat metadata list (`client.list(type)`), mapped
+ * to their metadata-type name. `object-field` and `node` are resolved
+ * specially (not via a list) and are intentionally absent.
+ */
+const KIND_TO_META_TYPE = {
+    object: 'object',
+    flow: 'flow',
+    role: 'role',
+    user: 'user',
+    team: 'team',
+    queue: 'queue',
+    department: 'department',
+    connector: 'connector',
+    'email-template': 'email_template',
+};
+/**
+ * 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 function resolveRefKind(ref, sibling) {
+    if (!ref)
+        return undefined;
+    if (ref.kind)
+        return { kind: ref.kind, objectSource: ref.objectSource };
+    if (ref.kindFrom && ref.map) {
+        const disc = sibling(ref.kindFrom);
+        const k = typeof disc === 'string' ? ref.map[disc] : undefined;
+        if (k)
+            return { kind: k, objectSource: ref.objectSource };
+    }
+    return undefined;
+}
+/** Read `node.config[key]` as a non-empty string, else undefined. */
+function configString(node, key) {
+    const cfg = node?.config;
+    if (!cfg || typeof cfg !== 'object' || Array.isArray(cfg))
+        return undefined;
+    const v = cfg[key];
+    return typeof v === 'string' && v ? v : undefined;
+}
+/** Resolve the target object name for an `object-field` reference. */
+function resolveObjectName(kind, objectSource, ctx) {
+    if (kind !== 'object-field')
+        return undefined;
+    const src = objectSource || '$trigger';
+    if (src === '$trigger') {
+        const nodes = Array.isArray(ctx.draft.nodes) ? ctx.draft.nodes : [];
+        const start = nodes.find((n) => n?.type === 'start');
+        return configString(start, 'objectName');
+    }
+    // A sibling config key on the same node (CRUD nodes carry their own objectName).
+    return configString(ctx.node, src);
+}
+/**
+ * Fetch a metadata type's items as combobox options. `type === undefined`
+ * disables the fetch (returns empty), so the hook can be called
+ * unconditionally regardless of the reference kind.
+ */
+function useMetadataListOptions(type) {
+    const client = useMetadataClient();
+    const [state, setState] = React.useState({
+        options: [],
+        loading: !!type,
+    });
+    React.useEffect(() => {
+        if (!type) {
+            setState({ options: [], loading: false });
+            return;
+        }
+        let cancelled = false;
+        setState((s) => ({ ...s, loading: true }));
+        client
+            .list(type)
+            .then((rows) => {
+            if (cancelled)
+                return;
+            const options = (Array.isArray(rows) ? rows : [])
+                .filter((r) => r && typeof r.name === 'string' && r.name)
+                .map((r) => ({
+                value: String(r.name),
+                label: typeof r.label === 'string' && r.label && r.label !== r.name ? `${r.label} (${r.name})` : String(r.name),
+            }));
+            setState({ options, loading: false });
+        })
+            .catch(() => {
+            if (!cancelled)
+                setState({ options: [], loading: false });
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [client, type]);
+    return state;
+}
+/**
+ * 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 function ReferenceCombobox({ resolved, value, onCommit, onBlur, disabled, placeholder, context, showHint = true }) {
+    const listId = React.useId();
+    const ctx = context ?? { draft: {}, node: null };
+    const kind = resolved?.kind;
+    // object-field: resolve the target object, then its field catalog.
+    const objectName = resolved ? resolveObjectName(resolved.kind, resolved.objectSource, ctx) : undefined;
+    const { fields: objectFields } = useObjectFields(kind === 'object-field' ? objectName : undefined);
+    // Flat metadata-list kinds (object / flow / role / user / team / …).
+    const listType = kind && kind !== 'object-field' && kind !== 'node' ? KIND_TO_META_TYPE[kind] : undefined;
+    const { options: listOptions } = useMetadataListOptions(listType);
+    const options = React.useMemo(() => {
+        if (kind === 'object-field') {
+            return objectFields.map((f) => ({
+                value: f.name,
+                label: f.label && f.label !== f.name ? `${f.label} (${f.name})` : f.name,
+            }));
+        }
+        if (kind === 'node') {
+            const nodes = Array.isArray(ctx.draft.nodes) ? ctx.draft.nodes : [];
+            const currentId = typeof ctx.node?.id === 'string' ? ctx.node.id : undefined;
+            return nodes
+                .filter((n) => typeof n?.id === 'string' && n.id && n.id !== currentId)
+                .map((n) => {
+                const id = String(n.id);
+                const lbl = typeof n.label === 'string' && n.label ? `${n.label} (${id})` : id;
+                return { value: id, label: lbl };
+            });
+        }
+        if (listType)
+            return listOptions;
+        return [];
+    }, [kind, listType, objectFields, listOptions, ctx.draft, ctx.node]);
+    // For an object-field whose object can't be resolved, tell the author why the
+    // suggestions are empty — but still let them type a value.
+    const unresolvedObject = kind === 'object-field' && !objectName;
+    return (_jsxs("div", { className: "w-full space-y-1", children: [_jsx(Input, { list: options.length ? listId : undefined, value: value != null ? String(value) : '', onChange: (e) => onCommit(e.target.value), onBlur: onBlur, placeholder: placeholder, disabled: disabled, className: "h-8 text-sm" }), options.length > 0 && (_jsx("datalist", { id: listId, children: options.map((o) => (_jsx("option", { value: o.value, children: o.label }, o.value))) })), showHint && kind === 'object-field' && objectName && (_jsxs("p", { className: "text-[11px] leading-snug text-muted-foreground", children: ["Fields of ", objectName, "."] })), showHint && unresolvedObject && (_jsx("p", { className: "text-[11px] leading-snug text-muted-foreground", children: "Set the flow\u2019s trigger object (on the Start node) to list fields." }))] }));
+}
+/**
+ * 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 function FlowReferenceField({ field, value, onCommit, disabled, context }) {
+    const node = context?.node ?? null;
+    const resolved = resolveRefKind(field.ref, (key) => configString(node, key));
+    return (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: field.label }), _jsx(ReferenceCombobox, { resolved: resolved, value: value, onCommit: onCommit, disabled: disabled, placeholder: field.placeholder, context: context })] }));
+}

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

@@ -0,0 +1,21 @@
+/**
+ * FlowStringListField — a repeatable single-column editor for string-array
+ * config (e.g. a notification's `recipients`, a script's `outputVariables`).
+ *
+ * Mirrors FlowKeyValueField's local-draft pattern: rows live in LOCAL state
+ * with a STABLE id and only flush to `onCommit` on blur / Enter / add / remove,
+ * so editing never remounts a row mid-keystroke. Empty rows are dropped on
+ * flush; an empty list commits `undefined` so no empty array key is written.
+ */
+import * as React from 'react';
+export interface FlowStringListFieldProps {
+    label: string;
+    value: unknown;
+    onCommit: (value: string[] | undefined) => void;
+    disabled?: boolean;
+    addLabel: string;
+    itemLabel: string;
+    removeLabel: string;
+    emptyLabel: string;
+}
+export declare function FlowStringListField({ label, value, onCommit, disabled, addLabel, itemLabel, removeLabel, emptyLabel, }: FlowStringListFieldProps): React.JSX.Element;

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

@@ -0,0 +1,60 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * FlowStringListField — a repeatable single-column editor for string-array
+ * config (e.g. a notification's `recipients`, a script's `outputVariables`).
+ *
+ * Mirrors FlowKeyValueField's local-draft pattern: rows live in LOCAL state
+ * with a STABLE id and only flush to `onCommit` on blur / Enter / add / remove,
+ * so editing never remounts a row mid-keystroke. Empty rows are dropped on
+ * flush; an empty list commits `undefined` so no empty array key is written.
+ */
+import * as React from 'react';
+import { Plus, X } from 'lucide-react';
+import { Button, Input, Label } from '@object-ui/components';
+import { uniqueId } from './_shared';
+function toRows(list, existingIds) {
+    const ids = [...existingIds];
+    return list.map((value) => {
+        const id = uniqueId('sl', ids);
+        ids.push(id);
+        return { id, value };
+    });
+}
+function rowsToList(rows) {
+    return rows.map((r) => r.value.trim()).filter((v) => v !== '');
+}
+export function FlowStringListField({ label, value, onCommit, disabled, addLabel, itemLabel, removeLabel, emptyLabel, }) {
+    const external = React.useMemo(() => (Array.isArray(value) ? value.map((v) => String(v)) : []), [value]);
+    const [rows, setRows] = React.useState(() => toRows(external, []));
+    const lastCommitted = React.useRef(JSON.stringify(external));
+    React.useEffect(() => {
+        const next = JSON.stringify(external);
+        if (next !== lastCommitted.current) {
+            setRows(toRows(external, []));
+            lastCommitted.current = next;
+        }
+    }, [external]);
+    const flush = (nextRows) => {
+        const list = rowsToList(nextRows);
+        lastCommitted.current = JSON.stringify(list);
+        onCommit(list.length ? list : undefined);
+    };
+    const setRowValue = (id, v) => {
+        setRows((rs) => rs.map((r) => (r.id === id ? { ...r, value: v } : r)));
+    };
+    const addRow = () => {
+        setRows((rs) => [...rs, { id: uniqueId('sl', rs.map((r) => r.id)), value: '' }]);
+    };
+    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-1.5", children: [rows.length === 0 && (_jsx("p", { className: "text-[11px] italic text-muted-foreground", children: emptyLabel })), rows.map((row) => (_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Input, { value: row.value, onChange: (e) => setRowValue(row.id, e.target.value), onBlur: () => flush(rows), onKeyDown: (e) => {
+                                    if (e.key === 'Enter')
+                                        e.target.blur();
+                                }, placeholder: itemLabel, disabled: disabled, className: "h-8 flex-1 text-xs" }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "h-8 w-8 shrink-0 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" }) })] }, 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/InspectorComboField.d.ts

@@ -0,0 +1,40 @@
+/**
+ * InspectorComboField — a searchable single-select for scoped inspectors that
+ * still lets the author type a value not in the list.
+ *
+ * Mainstream low-code dataset designers let you *pick* an object / relationship
+ * / field from the live schema instead of recalling its API name. This combo
+ * renders that picker (grouped, searchable) over a catalog the caller supplies,
+ * while keeping the power-user escape hatch: when the typed text matches no
+ * option, a "Use «text»" row commits the raw value verbatim (so an offline
+ * catalog, a computed path, or a server-only field is never a dead end).
+ *
+ * Self-filters (`shouldFilter={false}`) for predictable label+value matching.
+ */
+import * as React from 'react';
+export interface InspectorComboOption {
+    value: string;
+    label: string;
+    /** Small muted suffix, e.g. a field type. */
+    hint?: string;
+    /** Optional group heading; options sharing a group render together. */
+    group?: string;
+}
+export interface InspectorComboFieldProps {
+    label?: string;
+    value: string;
+    onCommit: (v: string) => void;
+    options: InspectorComboOption[];
+    placeholder?: string;
+    searchPlaceholder?: string;
+    emptyText?: string;
+    disabled?: boolean;
+    loading?: boolean;
+    /** Allow committing a typed value that matches no option (default true). */
+    allowCustom?: boolean;
+    /** Render the trigger value in a monospace font. */
+    mono?: boolean;
+    /** Override the trigger label for the currently-selected custom value. */
+    className?: string;
+}
+export declare function InspectorComboField({ label, value, onCommit, options, placeholder, searchPlaceholder, emptyText, disabled, loading, allowCustom, mono, className, }: InspectorComboFieldProps): React.JSX.Element;

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

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2026 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * InspectorComboField — a searchable single-select for scoped inspectors that
+ * still lets the author type a value not in the list.
+ *
+ * Mainstream low-code dataset designers let you *pick* an object / relationship
+ * / field from the live schema instead of recalling its API name. This combo
+ * renders that picker (grouped, searchable) over a catalog the caller supplies,
+ * while keeping the power-user escape hatch: when the typed text matches no
+ * option, a "Use «text»" row commits the raw value verbatim (so an offline
+ * catalog, a computed path, or a server-only field is never a dead end).
+ *
+ * Self-filters (`shouldFilter={false}`) for predictable label+value matching.
+ */
+import * as React from 'react';
+import { Check, ChevronsUpDown } from 'lucide-react';
+import { cn, Button, Label, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, Popover, PopoverContent, PopoverTrigger, } from '@object-ui/components';
+function matches(option, q) {
+    if (!q)
+        return true;
+    const needle = q.toLowerCase();
+    return (option.value.toLowerCase().includes(needle) ||
+        option.label.toLowerCase().includes(needle) ||
+        (option.group?.toLowerCase().includes(needle) ?? false));
+}
+export function InspectorComboField({ label, value, onCommit, options, placeholder = 'Select…', searchPlaceholder = 'Search or type…', emptyText = 'No match — keep typing to use a custom value.', disabled, loading, allowCustom = true, mono, className, }) {
+    const [open, setOpen] = React.useState(false);
+    const [search, setSearch] = React.useState('');
+    const selected = options.find((o) => o.value === value);
+    const triggerText = selected ? selected.label : value || (loading ? 'Loading…' : placeholder);
+    const filtered = React.useMemo(() => options.filter((o) => matches(o, search)), [options, search]);
+    const groups = React.useMemo(() => {
+        const order = [];
+        const byGroup = new Map();
+        for (const o of filtered) {
+            const g = o.group ?? '';
+            if (!byGroup.has(g)) {
+                byGroup.set(g, []);
+                order.push(g);
+            }
+            byGroup.get(g).push(o);
+        }
+        return order.map((g) => ({ heading: g, items: byGroup.get(g) }));
+    }, [filtered]);
+    const trimmed = search.trim();
+    const showCustom = allowCustom && !!trimmed && !options.some((o) => o.value === trimmed);
+    const commit = (v) => {
+        onCommit(v);
+        setOpen(false);
+        setSearch('');
+    };
+    const field = (_jsxs(Popover, { open: open, onOpenChange: (next) => {
+            setOpen(next);
+            if (!next)
+                setSearch('');
+        }, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { type: "button", variant: "outline", role: "combobox", "aria-expanded": open, disabled: disabled, className: cn('h-8 w-full justify-between px-2 text-sm font-normal', className), children: [_jsx("span", { className: cn('truncate', mono && 'font-mono', !selected && !value && 'text-muted-foreground'), children: triggerText }), _jsx(ChevronsUpDown, { className: "ml-2 h-3.5 w-3.5 shrink-0 opacity-50" })] }) }), _jsx(PopoverContent, { align: "start", className: "w-[var(--radix-popover-trigger-width)] min-w-[14rem] p-0", children: _jsxs(Command, { shouldFilter: false, children: [_jsx(CommandInput, { value: search, onValueChange: setSearch, placeholder: searchPlaceholder }), _jsxs(CommandList, { children: [!showCustom && filtered.length === 0 && _jsx(CommandEmpty, { children: emptyText }), showCustom && (_jsx(CommandGroup, { children: _jsx(CommandItem, { value: `__custom__${trimmed}`, onSelect: () => commit(trimmed), children: _jsxs("span", { className: "truncate", children: ["Use ", _jsxs("span", { className: "font-mono", children: ["\u201C", trimmed, "\u201D"] })] }) }) })), groups.map((g, gi) => (_jsx(CommandGroup, { heading: g.heading || undefined, children: g.items.map((o) => (_jsxs(CommandItem, { value: o.value, onSelect: () => commit(o.value), children: [_jsx(Check, { className: cn('h-3.5 w-3.5', o.value === value ? 'opacity-100' : 'opacity-0') }), _jsx("span", { className: "truncate font-mono", children: o.value }), o.label && o.label !== o.value && (_jsx("span", { className: "ml-1 truncate text-muted-foreground", children: o.label })), o.hint && _jsx("span", { className: "ml-auto pl-2 text-[10px] text-muted-foreground", children: o.hint })] }, o.value))) }, g.heading || `g${gi}`)))] })] }) })] }));
+    if (!label)
+        return field;
+    return (_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: label }), field] }));
+}

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

@@ -0,0 +1,21 @@
+/**
+ * ObjectDefaultInspector — the "home" panel for the object designer,
+ * shown when no field is selected.
+ *
+ * Without it, deselecting a field falls back to the generic whole-draft
+ * SchemaForm, which (a) exposes a raw `fields` JSON editor the canvas
+ * already owns, and (b) only renders whatever properties the server's
+ * `/meta/types` schema happens to declare (often just `name`). This
+ * curated panel instead edits the object-level basics directly, in the
+ * active locale, in both create and edit.
+ *
+ * Create-mode niceties:
+ *   • `name` is editable only while creating (it's the immutable PK once
+ *     saved) and auto-derives a snake_case slug from the label until the
+ *     author edits it directly — mirroring the protocol create form.
+ *
+ * All edits flow through `onPatch` as shallow draft patches.
+ */
+import * as React from 'react';
+import type { MetadataDefaultInspectorProps } from '../default-inspector-registry';
+export declare function ObjectDefaultInspector({ name, draft, onPatch, readOnly, locale, }: MetadataDefaultInspectorProps): React.JSX.Element;

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

@@ -0,0 +1,55 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * ObjectDefaultInspector — the "home" panel for the object designer,
+ * shown when no field is selected.
+ *
+ * Without it, deselecting a field falls back to the generic whole-draft
+ * SchemaForm, which (a) exposes a raw `fields` JSON editor the canvas
+ * already owns, and (b) only renders whatever properties the server's
+ * `/meta/types` schema happens to declare (often just `name`). This
+ * curated panel instead edits the object-level basics directly, in the
+ * active locale, in both create and edit.
+ *
+ * Create-mode niceties:
+ *   • `name` is editable only while creating (it's the immutable PK once
+ *     saved) and auto-derives a snake_case slug from the label until the
+ *     author edits it directly — mirroring the protocol create form.
+ *
+ * All edits flow through `onPatch` as shallow draft patches.
+ */
+import * as React from 'react';
+import { InspectorShell, InspectorTextField } from './_shared';
+import { Label } from '@object-ui/components';
+import { toFieldNameLoose } from '../previews/object-fields-io';
+import { slugify } from '../createDerive';
+import { t } from '../i18n';
+export function ObjectDefaultInspector({ name, draft, onPatch, readOnly, locale, }) {
+    const tr = React.useCallback((key) => t(key, locale), [locale]);
+    // The host passes an empty `name` only while creating a new object.
+    const createMode = !name;
+    const str = (key) => (typeof draft[key] === 'string' ? draft[key] : '');
+    // Auto-derive name from label until the user edits name directly.
+    const nameTouched = React.useRef(false);
+    const setLabel = (v) => {
+        const patch = { label: v || undefined };
+        if (createMode && !nameTouched.current)
+            patch.name = slugify(v);
+        onPatch(patch);
+    };
+    const setName = (v) => {
+        nameTouched.current = true;
+        onPatch({ name: toFieldNameLoose(v) });
+    };
+    const nameValue = createMode ? str('name') : name || str('name');
+    const title = str('label') || name || tr('designer.object.kind');
+    return (_jsx(InspectorShell, { kindLabel: tr('designer.object.kind'), title: title, onClose: () => { }, hideClose: true, children: _jsxs(Section, { title: tr('designer.object.section.basic'), hint: tr('designer.object.section.basicHint'), children: [_jsx(Field, { hint: tr('designer.object.nameHint'), children: _jsx(InspectorTextField, { label: tr('designer.object.name'), value: nameValue, onCommit: setName, disabled: readOnly || !createMode, mono: true, testId: "object-name-input", placeholder: tr('designer.object.namePlaceholder') }) }), _jsx(InspectorTextField, { label: tr('designer.object.label'), value: str('label'), onCommit: setLabel, disabled: readOnly, placeholder: tr('designer.object.labelPlaceholder') }), _jsx(InspectorTextField, { label: tr('designer.object.pluralLabel'), value: str('pluralLabel'), onCommit: (v) => onPatch({ pluralLabel: v || undefined }), disabled: readOnly, placeholder: tr('designer.object.pluralPlaceholder') }), _jsx(Field, { hint: tr('designer.object.iconHint'), children: _jsx(InspectorTextField, { label: tr('designer.object.icon'), value: str('icon'), onCommit: (v) => onPatch({ icon: v || undefined }), disabled: readOnly, mono: true, placeholder: "building" }) }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { className: "text-xs text-muted-foreground", children: tr('designer.object.description') }), _jsx("textarea", { value: str('description'), disabled: readOnly, rows: 2, placeholder: tr('designer.object.descriptionPlaceholder'), onChange: (e) => onPatch({ description: e.target.value || undefined }), className: "w-full text-sm rounded-md border bg-background px-2 py-1.5 focus:outline-none focus:ring-1 focus:ring-primary" })] })] }) }));
+}
+/* ─────────────── Sub-components ─────────────── */
+function Section({ title, hint, children, }) {
+    return (_jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "border-b pb-1", children: [_jsx("div", { className: "text-[10px] font-semibold uppercase tracking-wider text-muted-foreground", children: title }), hint && _jsx("div", { className: "text-[10px] normal-case text-muted-foreground/70 mt-0.5", children: hint })] }), _jsx("div", { className: "space-y-2", children: children })] }));
+}
+/** Wraps a field with a small help line below it. */
+function Field({ hint, children }) {
+    return (_jsxs("div", { className: "space-y-1", children: [children, hint && _jsx("p", { className: "text-[11px] text-muted-foreground/80 px-0.5 leading-snug", children: hint })] }));
+}

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

@@ -0,0 +1,23 @@
+/**
+ * ObjectFieldInspector — scoped editor for the selected Object field.
+ *
+ * Selection shape:  { kind: 'field', id: '<field_name>' }
+ *
+ * The inspector edits one field at a time. Sections:
+ *   • Basic     — name (rename), label, type, required, unique, description
+ *   • Specific  — picklist options / lookup target / formula / numeric
+ *                 precision / max length, conditional on type
+ *   • Advanced  — readonly, hidden, indexed, externalId, group
+ *
+ * All edits are applied as immutable splices of `draft.fields` via
+ * the object-fields-io helpers, preserving the original array-vs-record
+ * shape AND any unknown keys on the field definition.
+ *
+ * Rename: changing the `name` rewrites the field's key in-place and
+ * re-issues the selection so the inspector stays bound to the same
+ * field. Other fields/options that reference the old name are NOT
+ * auto-rewritten — callers should re-validate downstream.
+ */
+import * as React from 'react';
+import type { MetadataInspectorProps } from '../inspector-registry';
+export declare function ObjectFieldInspector({ selection, draft, onPatch, onClearSelection, onSelectionChange, readOnly, locale, }: MetadataInspectorProps): React.JSX.Element;