@object-ui/app-shell 6.0.4 → 6.2.0

package/dist/views/metadata-admin/DirectoryPage.js

@@ -0,0 +1,135 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * MetadataDirectoryPage — registry-driven landing page (Phase 3c).
+ *
+ * Replaces the Phase 3b placeholder. Improvements:
+ *   • Search across type id + label + description.
+ *   • Domain filter chips with counts.
+ *   • "Writable only" toggle for admins triaging permissions work.
+ *   • Tiles show: label, machine name, item count (lazy fetched per
+ *     type when in view), badges (writable / overlay), description.
+ *
+ * Item counts are lazy — we only fetch when the user lands on a
+ * domain that has it. For MVP we just show "—" until the user clicks
+ * into a type. Pre-fetching all 27 counts on page load is wasteful.
+ */
+import * as React from 'react';
+import { Link } from 'react-router-dom';
+import { Search, Database, Layers, Workflow, Sparkles, Settings, ShieldCheck, Box } from 'lucide-react';
+import { Input } from '@object-ui/components';
+import { Button } from '@object-ui/components';
+import { Badge } from '@object-ui/components';
+import { Kbd } from '@object-ui/components';
+import { Empty, EmptyTitle, EmptyDescription } from '@object-ui/components';
+import { useMetadataClient, useMetadataTypes, } from './useMetadata';
+import { MetadataQuickFind } from './QuickFind';
+import { translateMetadataType, translateMetadataDomain, t, tFormat, detectLocale, } from './i18n';
+const DOMAIN_ICONS = {
+    data: Database,
+    ui: Layers,
+    automation: Workflow,
+    ai: Sparkles,
+    system: Settings,
+    platform: Settings,
+    identity: ShieldCheck,
+    security: ShieldCheck,
+};
+const DOMAIN_ORDER = [
+    'data',
+    'ui',
+    'automation',
+    'ai',
+    'identity',
+    'security',
+    'system',
+    'platform',
+    'other',
+];
+/**
+ * Types intentionally hidden from the directory + list views.
+ *
+ * `field` is managed in-context via the parent object's edit form
+ * (master-detail widget). A flat global list of every field across
+ * every object is rarely useful and clutters the admin surface.
+ */
+const HIDDEN_TYPES = new Set(['field']);
+export function MetadataDirectoryPage() {
+    const client = useMetadataClient();
+    const { loading, error, entries } = useMetadataTypes(client);
+    const locale = React.useMemo(() => detectLocale(), []);
+    const [query, setQuery] = React.useState('');
+    const [domainFilter, setDomainFilter] = React.useState('all');
+    const [writableOnly, setWritableOnly] = React.useState(false);
+    // Counts per domain for the filter chip bar.
+    const domainCounts = React.useMemo(() => {
+        const visible = entries.filter((e) => !HIDDEN_TYPES.has(e.type));
+        const c = { all: visible.length };
+        for (const e of visible) {
+            const d = e.domain ?? 'other';
+            c[d] = (c[d] ?? 0) + 1;
+        }
+        return c;
+    }, [entries]);
+    const writableCount = entries.filter((e) => !HIDDEN_TYPES.has(e.type) && e.allowOrgOverride).length;
+    const filtered = entries.filter((e) => {
+        if (HIDDEN_TYPES.has(e.type))
+            return false;
+        if (writableOnly && !e.allowOrgOverride)
+            return false;
+        if (domainFilter !== 'all' && (e.domain ?? 'other') !== domainFilter)
+            return false;
+        if (query) {
+            const q = query.toLowerCase();
+            const hit = e.type.toLowerCase().includes(q) ||
+                (e.label ?? '').toLowerCase().includes(q) ||
+                (e.description ?? '').toLowerCase().includes(q);
+            if (!hit)
+                return false;
+        }
+        return true;
+    });
+    // Group filtered by domain for display.
+    const grouped = React.useMemo(() => {
+        var _a;
+        const map = {};
+        for (const e of filtered)
+            (map[_a = e.domain ?? 'other'] ?? (map[_a] = [])).push(e);
+        return Object.entries(map).sort(([a], [b]) => {
+            const ai = DOMAIN_ORDER.indexOf(a);
+            const bi = DOMAIN_ORDER.indexOf(b);
+            return (ai === -1 ? 99 : ai) - (bi === -1 ? 99 : bi);
+        });
+    }, [filtered]);
+    if (loading) {
+        return _jsx("div", { className: "p-6 text-sm text-muted-foreground", children: t('engine.directory.loading', locale) });
+    }
+    if (error) {
+        return (_jsxs("div", { className: "p-6 text-sm text-destructive", children: [t('engine.directory.loadFailed', locale), ": ", error] }));
+    }
+    return (_jsxs("div", { className: "flex flex-col h-full overflow-hidden", children: [_jsxs("div", { className: "px-6 pt-5 pb-4 border-b bg-background", children: [_jsx("h1", { className: "text-xl font-semibold", children: t('engine.directory.title', locale) }), _jsx("p", { className: "text-sm text-muted-foreground mt-1 max-w-3xl", dangerouslySetInnerHTML: {
+                            __html: tFormat('engine.directory.description', locale, {
+                                count: `<strong class="text-foreground">${entries.filter((e) => !HIDDEN_TYPES.has(e.type)).length}</strong>`,
+                                writable: writableCount,
+                            }),
+                        } }), _jsxs("div", { className: "flex items-center gap-3 mt-4 flex-wrap", children: [_jsxs("div", { className: "relative flex-1 min-w-[240px] max-w-lg", children: [_jsx(Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted-foreground" }), _jsx(Input, { className: "pl-8", placeholder: t('engine.directory.search', locale), value: query, onChange: (e) => setQuery(e.target.value) })] }), _jsxs(Button, { variant: writableOnly ? 'default' : 'outline', size: "sm", onClick: () => setWritableOnly((w) => !w), children: [t('engine.directory.writableOnly', locale), " (", writableCount, ")"] }), _jsxs("div", { className: "text-xs text-muted-foreground flex items-center gap-1.5", children: [t('engine.directory.quickFind', locale), " ", _jsx(Kbd, { children: "\u2318" }), _jsx(Kbd, { children: "\u21E7" }), _jsx(Kbd, { children: "M" })] })] }), _jsxs("div", { className: "flex items-center gap-1.5 mt-3 flex-wrap", children: [_jsx(DomainChip, { domain: "all", label: t('engine.directory.all', locale), active: domainFilter === 'all', count: domainCounts.all ?? 0, onClick: () => setDomainFilter('all') }), DOMAIN_ORDER.filter((d) => domainCounts[d]).map((d) => (_jsx(DomainChip, { domain: d, label: translateMetadataDomain(d, locale), active: domainFilter === d, count: domainCounts[d] ?? 0, onClick: () => setDomainFilter(d) }, d)))] })] }), _jsxs("div", { className: "flex-1 overflow-auto p-6 space-y-6", children: [filtered.length === 0 && (_jsxs(Empty, { children: [_jsx(EmptyTitle, { children: t('engine.directory.noMatches', locale) }), _jsx(EmptyDescription, { children: t('engine.directory.noMatchesHint', locale) })] })), grouped.map(([domain, group]) => {
+                        const Icon = DOMAIN_ICONS[domain] ?? Box;
+                        return (_jsxs("section", { className: "space-y-2", children: [_jsxs("h2", { className: "text-xs font-semibold uppercase tracking-wider text-muted-foreground flex items-center gap-1.5", children: [_jsx(Icon, { className: "h-3.5 w-3.5" }), translateMetadataDomain(domain, locale), " (", group.length, ")"] }), _jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3", children: group.map((e) => (_jsx(TypeTile, { entry: e, locale: locale }, e.type))) })] }, domain));
+                    })] }), _jsx(MetadataQuickFind, {})] }));
+}
+function DomainChip({ domain, label, active, count, onClick, }) {
+    return (_jsxs("button", { type: "button", onClick: onClick, className: 'px-2.5 py-1 rounded-full text-xs border transition-colors ' +
+            (active
+                ? 'bg-primary text-primary-foreground border-primary'
+                : 'bg-background hover:bg-accent border-border text-muted-foreground'), children: [label ?? domain, " ", _jsxs("span", { className: "opacity-70 ml-0.5", children: ["(", count, ")"] })] }));
+}
+function TypeTile({ entry, locale }) {
+    // Prefer the locale-table translation; fall back to server's `label` (typically English).
+    const label = translateMetadataType(entry.type, locale, entry.label);
+    return (_jsxs(Link, { to: `../component/metadata/resource?type=${encodeURIComponent(entry.type)}`, className: "block p-4 border rounded-lg hover:border-primary hover:bg-accent transition-colors", children: [_jsxs("div", { className: "flex items-start justify-between gap-2", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "font-medium truncate", children: label }), _jsx("code", { className: "text-xs text-muted-foreground font-mono", children: entry.type })] }), entry.allowOrgOverride ? (_jsx(Badge, { className: 'text-[10px] shrink-0 ' +
+                            (entry.overrideSource === 'env'
+                                ? 'bg-amber-100 text-amber-800 hover:bg-amber-100'
+                                : 'bg-emerald-100 text-emerald-800 hover:bg-emerald-100'), title: entry.overrideSource === 'env'
+                            ? 'Writable via OBJECTSTACK_METADATA_WRITABLE env var'
+                            : 'Writable per ADR-0005 overlay opt-in', children: "writable" })) : (_jsx(Badge, { variant: "outline", className: "text-[10px] shrink-0 text-muted-foreground", children: "read-only" }))] }), entry.description && (_jsx("div", { className: "text-xs text-muted-foreground mt-2 line-clamp-2", children: entry.description }))] }));
+}

package/dist/views/metadata-admin/LayeredDiff.d.ts

@@ -0,0 +1,6 @@
+import type { MetadataLayered } from '@object-ui/data-objectstack';
+export interface LayeredDiffProps {
+    layered: MetadataLayered<Record<string, unknown>> | null;
+    loading?: boolean;
+}
+export declare function LayeredDiff({ layered, loading }: LayeredDiffProps): import("react/jsx-runtime").JSX.Element;

package/dist/views/metadata-admin/LayeredDiff.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tabs, TabsContent, TabsList, TabsTrigger, } from '@object-ui/components';
+import { Badge } from '@object-ui/components';
+export function LayeredDiff({ layered, loading }) {
+    if (loading) {
+        return (_jsx("div", { className: "p-4 text-sm text-muted-foreground", children: "Loading layers\u2026" }));
+    }
+    if (!layered) {
+        return (_jsx("div", { className: "p-4 text-sm text-muted-foreground", children: "Layered view unavailable for this item." }));
+    }
+    const hasOverlay = layered.overlay != null;
+    return (_jsxs(Tabs, { defaultValue: "effective", className: "w-full", children: [_jsxs(TabsList, { className: "grid grid-cols-3 w-fit", children: [_jsxs(TabsTrigger, { value: "code", children: ["Code", _jsx(Badge, { variant: "outline", className: "ml-1.5 text-[10px]", children: "artifact" })] }), _jsxs(TabsTrigger, { value: "overlay", children: ["Overlay", hasOverlay ? (_jsx(Badge, { className: "ml-1.5 text-[10px] bg-emerald-600 text-emerald-50", children: layered.overlayScope ?? 'set' })) : (_jsx(Badge, { variant: "outline", className: "ml-1.5 text-[10px] text-muted-foreground", children: "none" }))] }), _jsxs(TabsTrigger, { value: "effective", children: ["Effective", _jsx(Badge, { variant: "outline", className: "ml-1.5 text-[10px]", children: "merged" })] })] }), _jsx(TabsContent, { value: "code", className: "mt-3", children: _jsx(LayerPanel, { payload: layered.code, emptyHint: "No code-level artifact for this item. It may have been created at runtime as a pure overlay." }) }), _jsx(TabsContent, { value: "overlay", className: "mt-3", children: _jsx(LayerPanel, { payload: layered.overlay, emptyHint: "No overlay set. The runtime is using the code-level value as-is." }) }), _jsx(TabsContent, { value: "effective", className: "mt-3", children: _jsx(LayerPanel, { payload: layered.effective, emptyHint: "No effective value resolved." }) })] }));
+}
+function LayerPanel({ payload, emptyHint, }) {
+    if (payload == null) {
+        return (_jsx("div", { className: "rounded border bg-muted/30 p-4 text-xs text-muted-foreground", children: emptyHint }));
+    }
+    let pretty;
+    try {
+        pretty = JSON.stringify(payload, null, 2);
+    }
+    catch {
+        pretty = String(payload);
+    }
+    return (_jsx("pre", { className: "rounded border bg-muted/30 p-3 text-xs font-mono overflow-auto max-h-[420px]", children: pretty }));
+}

package/dist/views/metadata-admin/PageShell.d.ts

@@ -0,0 +1,34 @@
+/**
+ * PageShell — common hero / breadcrumb / action bar for every metadata
+ * admin page (Phase 3c).
+ *
+ * Layout (top → bottom):
+ *   1. Breadcrumb: All Metadata Types › <type> [ › <item> ]
+ *   2. Hero: icon + label + writable badge + count chip
+ *   3. Description (one line)
+ *   4. Action toolbar (Create / Refresh / Reset / Delete)
+ *   5. Child content (list / form / history)
+ *
+ * Keeping the chrome here means every page looks consistent and
+ * page bodies stay focused on their domain logic.
+ */
+import * as React from 'react';
+import type { RichMetadataTypeEntry } from './useMetadata';
+export interface PageShellProps {
+    /** The type entry from `/meta/types` (or a synthesized stub). */
+    entry: RichMetadataTypeEntry | undefined;
+    /** Optional item name (shown in breadcrumb on edit/history). */
+    itemName?: string;
+    /** Sub-label below the title — e.g. "Edit overlay" / "Version history". */
+    subtitle?: string;
+    /** Right-side stat chips. */
+    stats?: Array<{
+        label: string;
+        value: React.ReactNode;
+    }>;
+    /** Right-side action buttons. */
+    actions?: React.ReactNode;
+    /** Page body. */
+    children: React.ReactNode;
+}
+export declare function PageShell({ entry, itemName, subtitle, stats, actions, children, }: PageShellProps): import("react/jsx-runtime").JSX.Element;

package/dist/views/metadata-admin/PageShell.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * PageShell — common hero / breadcrumb / action bar for every metadata
+ * admin page (Phase 3c).
+ *
+ * Layout (top → bottom):
+ *   1. Breadcrumb: All Metadata Types › <type> [ › <item> ]
+ *   2. Hero: icon + label + writable badge + count chip
+ *   3. Description (one line)
+ *   4. Action toolbar (Create / Refresh / Reset / Delete)
+ *   5. Child content (list / form / history)
+ *
+ * Keeping the chrome here means every page looks consistent and
+ * page bodies stay focused on their domain logic.
+ */
+import * as React from 'react';
+import { Link } from 'react-router-dom';
+import { Badge } from '@object-ui/components';
+import { ChevronRight } from 'lucide-react';
+import { detectLocale, t, translateMetadataType } from './i18n';
+export function PageShell({ entry, itemName, subtitle, stats, actions, children, }) {
+    const type = entry?.type ?? '';
+    const locale = React.useMemo(() => detectLocale(), []);
+    // Prefer locale-table translation over server's English label.
+    const label = translateMetadataType(type, locale, entry?.label);
+    return (_jsxs("div", { className: "flex flex-col h-full overflow-hidden", children: [_jsxs("div", { className: "px-6 pt-5 pb-4 border-b bg-background", children: [_jsxs("nav", { className: "flex items-center gap-1.5 text-xs text-muted-foreground mb-2", children: [_jsx(Link, { to: "../component/metadata/directory", className: "hover:text-foreground", children: t('engine.breadcrumb.allTypes', locale) }), _jsx(ChevronRight, { className: "h-3 w-3" }), _jsx(Link, { to: `../component/metadata/resource?type=${encodeURIComponent(type)}`, className: "hover:text-foreground", children: label }), itemName && (_jsxs(_Fragment, { children: [_jsx(ChevronRight, { className: "h-3 w-3" }), _jsx("span", { className: "text-foreground font-medium font-mono", children: itemName })] }))] }), _jsxs("div", { className: "flex items-start justify-between gap-3 flex-wrap", children: [_jsxs("div", { className: "min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [_jsx("h1", { className: "text-xl font-semibold truncate", children: label }), _jsx("code", { className: "text-xs font-mono text-muted-foreground", children: type }), entry?.domain && (_jsx(Badge, { variant: "outline", className: "text-[10px] uppercase tracking-wider", children: entry.domain })), entry?.allowOrgOverride ? (_jsx(Badge, { className: 'text-[10px] ' +
+                                                    (entry.overrideSource === 'env'
+                                                        ? 'bg-amber-100 text-amber-800 hover:bg-amber-100'
+                                                        : 'bg-emerald-100 text-emerald-800 hover:bg-emerald-100'), title: entry.overrideSource === 'env'
+                                                    ? 'Writable via OBJECTSTACK_METADATA_WRITABLE env var'
+                                                    : 'Writable per ADR-0005 overlay opt-in', children: "writable" })) : (_jsx(Badge, { variant: "outline", className: "text-[10px] text-muted-foreground", children: "read-only" }))] }), subtitle && (_jsx("div", { className: "text-sm text-muted-foreground mt-1", children: subtitle })), !subtitle && entry?.description && (_jsx("div", { className: "text-sm text-muted-foreground mt-1 max-w-3xl", children: entry.description }))] }), _jsxs("div", { className: "flex items-center gap-2", children: [stats?.map((s, i) => (_jsxs("div", { className: "flex flex-col items-end px-3 py-1 rounded border bg-muted/30 min-w-[64px]", children: [_jsx("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground", children: s.label }), _jsx("span", { className: "text-sm font-semibold tabular-nums", children: s.value })] }, i))), actions] })] })] }), _jsx("div", { className: "flex-1 overflow-auto", children: children })] }));
+}

package/dist/views/metadata-admin/PermissionMatrixEditor.d.ts

@@ -0,0 +1,5 @@
+export interface PermissionMatrixEditPageProps {
+    type: string;
+    name: string;
+}
+export declare function PermissionMatrixEditPage({ type, name }: PermissionMatrixEditPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/views/metadata-admin/PermissionMatrixEditor.js

@@ -0,0 +1,288 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.
+/**
+ * PermissionMatrixEditor — custom editor for `type=permission` (Phase 3e).
+ *
+ * Renders the Salesforce-style matrix that lives behind a Permission
+ * Set / Profile metadata item:
+ *
+ *   • Top section — object-level CRUD + VAMA (View All / Modify All)
+ *     + lifecycle (Transfer / Restore / Purge).
+ *   • Lower section — field-level R/W for the fields of any object
+ *     selected from the table above.
+ *
+ * Data model (matches `PermissionSetSchema` in
+ * `packages/spec/src/security/permission.zod.ts`):
+ *
+ *   {
+ *     name: string,
+ *     label?: string,
+ *     isProfile?: boolean,
+ *     objects: { [object_name]: ObjectPermission },
+ *     fields?:  { [`${object_name}.${field_name}`]: FieldPermission },
+ *     systemPermissions?: string[],
+ *     tabPermissions?: Record<string, 'visible'|'hidden'|'default_on'|'default_off'>,
+ *   }
+ *
+ * Wiring: registered from `builtinComponents.tsx` as
+ *   registerMetadataResource({ type: 'permission', EditPage: PermissionMatrixEditPage })
+ *
+ * The component reads `/api/v1/meta/object` + `/api/v1/meta/field` to
+ * enumerate available objects and their fields. Saves through the
+ * standard metadata save flow (overlay-aware, OCC, destructive-change
+ * dialog already provided by the generic engine — we go through
+ * client.save() directly).
+ */
+import * as React from 'react';
+import { useNavigate } from 'react-router-dom';
+import { Save, Loader2, History as HistoryIcon, AlertTriangle, ChevronDown, ChevronRight, } from 'lucide-react';
+import { Button } from '@object-ui/components';
+import { Badge } from '@object-ui/components';
+import { Input } from '@object-ui/components';
+import { Label } from '@object-ui/components';
+import { Switch } from '@object-ui/components';
+import { Checkbox } from '@object-ui/components';
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from '@object-ui/components';
+import { PageShell } from './PageShell';
+import { useMetadataClient, useMetadataTypes } from './useMetadata';
+import { resolveResourceConfig } from './registry';
+import { t as translate, detectLocale } from './i18n';
+function getObjectActions(locale) {
+    return [
+        { key: 'allowCreate', short: 'C', tip: translate('perm.action.create', locale) },
+        { key: 'allowRead', short: 'R', tip: translate('perm.action.read', locale) },
+        { key: 'allowEdit', short: 'U', tip: translate('perm.action.edit', locale) },
+        { key: 'allowDelete', short: 'D', tip: translate('perm.action.delete', locale) },
+        { key: 'allowTransfer', short: 'Tr', tip: translate('perm.action.transfer', locale) },
+        { key: 'allowRestore', short: 'Re', tip: translate('perm.action.restore', locale) },
+        { key: 'allowPurge', short: 'Pu', tip: translate('perm.action.purge', locale) },
+        { key: 'viewAllRecords', short: 'VA', tip: translate('perm.action.viewAll', locale) },
+        { key: 'modifyAllRecords', short: 'MA', tip: translate('perm.action.modifyAll', locale) },
+    ];
+}
+/* ────────────────────────────────────────────────────────────────── */
+/* Component                                                          */
+/* ────────────────────────────────────────────────────────────────── */
+export function PermissionMatrixEditPage({ type, name }) {
+    const navigate = useNavigate();
+    const client = useMetadataClient();
+    const { entries } = useMetadataTypes(client);
+    const entry = entries.find((t) => t.type === type);
+    const resolved = resolveResourceConfig(type, entry);
+    const writable = !!resolved.allowOrgOverride;
+    const locale = React.useMemo(() => detectLocale(), []);
+    const t = React.useCallback((k) => translate(k, locale), [locale]);
+    const OBJECT_ACTIONS = React.useMemo(() => getObjectActions(locale), [locale]);
+    const [draft, setDraft] = React.useState({
+        name,
+        objects: {},
+        fields: {},
+    });
+    const [objects, setObjects] = React.useState([]);
+    const [fieldsByObject, setFieldsByObject] = React.useState({});
+    const [expanded, setExpanded] = React.useState(new Set());
+    const [loading, setLoading] = React.useState(true);
+    const [saving, setSaving] = React.useState(false);
+    const [error, setError] = React.useState(null);
+    const [destructive, setDestructive] = React.useState(null);
+    const [filter, setFilter] = React.useState('');
+    const [showOnlyEnabled, setShowOnlyEnabled] = React.useState(false);
+    /* ── Load draft + object catalog ───────────────────────────── */
+    React.useEffect(() => {
+        let cancelled = false;
+        setLoading(true);
+        (async () => {
+            try {
+                const [lay, objList] = await Promise.all([
+                    client.layered(type, name).catch(() => null),
+                    client.list('object').catch(() => []),
+                ]);
+                if (cancelled)
+                    return;
+                const effective = (lay?.effective ??
+                    lay?.code ?? { name, objects: {} });
+                setDraft({
+                    ...effective,
+                    name: String(effective?.name ?? name),
+                    objects: effective?.objects ?? {},
+                    fields: effective?.fields ?? {},
+                });
+                const list = (objList ?? [])
+                    .map((row) => {
+                    const item = row?.item ?? row;
+                    return { name: String(item?.name ?? ''), label: item?.label };
+                })
+                    .filter((o) => !!o.name)
+                    .sort((a, b) => a.name.localeCompare(b.name));
+                setObjects(list);
+            }
+            catch (err) {
+                setError(err?.message ?? String(err));
+            }
+            finally {
+                if (!cancelled)
+                    setLoading(false);
+            }
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [client, type, name]);
+    /* ── Lazy-load fields when an object is expanded ─────────── */
+    async function ensureFields(objectName) {
+        if (fieldsByObject[objectName])
+            return;
+        try {
+            // Fields are stored as `${object}__${field}` keys under the
+            // `field` metadata type. We resolve by listing then filtering
+            // on the `object` attribute of the item.
+            const items = await client.list('field');
+            const list = (items ?? [])
+                .map((row) => row?.item ?? row)
+                .filter((f) => String(f?.object ?? '') === objectName)
+                .map((f) => ({ name: String(f?.name ?? ''), label: f?.label }))
+                .filter((f) => !!f.name)
+                .sort((a, b) => a.name.localeCompare(b.name));
+            setFieldsByObject((prev) => ({ ...prev, [objectName]: list }));
+        }
+        catch {
+            setFieldsByObject((prev) => ({ ...prev, [objectName]: [] }));
+        }
+    }
+    function toggleExpand(objectName) {
+        setExpanded((prev) => {
+            const next = new Set(prev);
+            if (next.has(objectName))
+                next.delete(objectName);
+            else {
+                next.add(objectName);
+                ensureFields(objectName);
+            }
+            return next;
+        });
+    }
+    /* ── Mutators ───────────────────────────────────────────── */
+    function updateObjectPerm(objectName, action, value) {
+        setDraft((prev) => {
+            const cur = prev.objects[objectName] ?? {};
+            const nextObj = { ...cur, [action]: value };
+            // Cascade: viewAllRecords implies allowRead.
+            if (action === 'viewAllRecords' && value)
+                nextObj.allowRead = true;
+            if (action === 'modifyAllRecords' && value) {
+                nextObj.allowEdit = true;
+                nextObj.allowRead = true;
+            }
+            return {
+                ...prev,
+                objects: { ...prev.objects, [objectName]: nextObj },
+            };
+        });
+    }
+    function bulkSetObject(objectName, action) {
+        setDraft((prev) => {
+            const next = action === 'none'
+                ? {}
+                : action === 'all'
+                    ? Object.fromEntries(OBJECT_ACTIONS.map((a) => [a.key, true]))
+                    : action === 'crud'
+                        ? { allowCreate: true, allowRead: true, allowEdit: true, allowDelete: true }
+                        : { allowRead: true };
+            return {
+                ...prev,
+                objects: { ...prev.objects, [objectName]: next },
+            };
+        });
+    }
+    function updateFieldPerm(objectName, fieldName, action, value) {
+        const key = `${objectName}.${fieldName}`;
+        setDraft((prev) => {
+            const fields = { ...(prev.fields ?? {}) };
+            const cur = fields[key] ?? { readable: true, editable: false };
+            const next = { ...cur, [action]: value };
+            // Cascade: !readable implies !editable.
+            if (action === 'readable' && !value)
+                next.editable = false;
+            // Cascade: editable implies readable.
+            if (action === 'editable' && value)
+                next.readable = true;
+            fields[key] = next;
+            return { ...prev, fields };
+        });
+    }
+    /* ── Save ────────────────────────────────────────────────── */
+    async function doSave(force, pending) {
+        const payload = pending ?? draft;
+        setSaving(true);
+        setError(null);
+        try {
+            await client.save(type, payload.name, payload, {
+                force,
+            });
+            const lay = await client.layered(type, payload.name);
+            setDraft((lay.effective ?? payload));
+            setDestructive(null);
+        }
+        catch (err) {
+            if (err?.status === 409 && err?.code === 'destructive_change') {
+                const issues = err?.body?.issues ?? [];
+                setDestructive({ issues: Array.isArray(issues) ? issues : [], pending: payload });
+            }
+            else {
+                setError(err?.message ?? String(err));
+            }
+        }
+        finally {
+            setSaving(false);
+        }
+    }
+    /* ── Render helpers ──────────────────────────────────────── */
+    const filteredObjects = React.useMemo(() => {
+        const q = filter.trim().toLowerCase();
+        return objects.filter((o) => {
+            if (showOnlyEnabled) {
+                const perm = draft.objects[o.name];
+                if (!perm || !Object.values(perm).some(Boolean))
+                    return false;
+            }
+            if (!q)
+                return true;
+            return (o.name.toLowerCase().includes(q) ||
+                (o.label ?? '').toLowerCase().includes(q));
+        });
+    }, [objects, filter, showOnlyEnabled, draft.objects]);
+    const stats = [
+        {
+            label: t('perm.stat.objectsGranted'),
+            value: Object.values(draft.objects).filter((p) => Object.values(p).some(Boolean)).length,
+        },
+        {
+            label: t('perm.stat.fieldOverrides'),
+            value: Object.keys(draft.fields ?? {}).length,
+        },
+    ];
+    if (loading) {
+        return (_jsx(PageShell, { entry: entry, itemName: name, children: _jsxs("div", { className: "p-6 text-sm text-muted-foreground flex items-center gap-2", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), " ", t('perm.loading').replace('{name}', name)] }) }));
+    }
+    return (_jsxs(PageShell, { entry: entry ?? { type, label: type }, itemName: name, subtitle: draft.isProfile ? t('perm.subtitle.profile') : t('perm.subtitle.set'), stats: stats, actions: _jsxs(_Fragment, { children: [_jsxs(Button, { variant: "ghost", size: "sm", onClick: () => navigate(`./history?type=${encodeURIComponent(type)}`), children: [_jsx(HistoryIcon, { className: "h-4 w-4 mr-1" }), " ", t('engine.edit.history')] }), writable && (_jsxs(Button, { size: "sm", onClick: () => doSave(false), disabled: saving, children: [saving ? (_jsx(Loader2, { className: "h-4 w-4 mr-1 animate-spin" })) : (_jsx(Save, { className: "h-4 w-4 mr-1" })), t('engine.edit.save')] }))] }), children: [_jsxs("div", { className: "flex flex-col h-full overflow-hidden", children: [error && (_jsxs("div", { className: "m-4 rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive flex items-start gap-2", children: [_jsx(AlertTriangle, { className: "h-4 w-4 mt-0.5 shrink-0" }), _jsx("span", { children: error })] })), _jsxs("div", { className: "px-6 py-3 border-b bg-muted/30 flex flex-wrap items-end gap-4", children: [_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "perm-name", className: "text-xs", children: t('perm.field.name') }), _jsx(Input, { id: "perm-name", value: draft.name, disabled: !writable, onChange: (e) => setDraft((p) => ({ ...p, name: e.target.value })), className: "h-8 w-56" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { htmlFor: "perm-label", className: "text-xs", children: t('perm.field.label') }), _jsx(Input, { id: "perm-label", value: draft.label ?? '', disabled: !writable, onChange: (e) => setDraft((p) => ({ ...p, label: e.target.value })), className: "h-8 w-72" })] }), _jsxs("div", { className: "flex items-center gap-2 pb-1", children: [_jsx(Switch, { id: "perm-is-profile", checked: !!draft.isProfile, disabled: !writable, onCheckedChange: (v) => setDraft((p) => ({ ...p, isProfile: !!v })) }), _jsx(Label, { htmlFor: "perm-is-profile", className: "text-xs", children: t('perm.field.isProfile') })] }), !writable && (_jsx(Badge, { variant: "secondary", className: "ml-auto", children: t('perm.readOnly') }))] }), _jsxs("div", { className: "px-6 py-3 border-b flex items-center gap-3", children: [_jsx(Input, { placeholder: t('perm.filter.placeholder'), value: filter, onChange: (e) => setFilter(e.target.value), className: "h-8 w-72" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Switch, { id: "only-enabled", checked: showOnlyEnabled, onCheckedChange: (v) => setShowOnlyEnabled(!!v) }), _jsx(Label, { htmlFor: "only-enabled", className: "text-xs", children: t('perm.filter.onlyGranted') })] }), _jsxs("span", { className: "text-xs text-muted-foreground ml-auto", children: [filteredObjects.length, " / ", objects.length, " ", t('perm.stat.objectsSuffix')] })] }), _jsx("div", { className: "flex-1 overflow-auto", children: _jsx(PermissionTable, { objects: filteredObjects, draft: draft, expanded: expanded, fieldsByObject: fieldsByObject, writable: writable, objectActions: OBJECT_ACTIONS, t: t, onToggleExpand: toggleExpand, onObjectPerm: updateObjectPerm, onFieldPerm: updateFieldPerm, onBulkSet: bulkSetObject }) })] }), _jsx(Dialog, { open: !!destructive, onOpenChange: (open) => !open && setDestructive(null), children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center gap-2", children: [_jsx(AlertTriangle, { className: "h-4 w-4 text-amber-500" }), " ", t('engine.edit.destructive')] }), _jsx(DialogDescription, { children: t('engine.edit.destructiveHint') })] }), _jsx("ul", { className: "text-sm space-y-1 max-h-64 overflow-auto", children: destructive?.issues.map((i, idx) => (_jsxs("li", { className: "border-l-2 border-amber-500 pl-2", children: [i.kind && _jsx(Badge, { variant: "outline", className: "mr-2", children: i.kind }), i.message ?? JSON.stringify(i)] }, idx))) }), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "ghost", onClick: () => setDestructive(null), children: t('engine.cancel') }), _jsxs(Button, { variant: "destructive", onClick: () => destructive && doSave(true, destructive.pending), disabled: saving, children: [saving && _jsx(Loader2, { className: "h-4 w-4 mr-1 animate-spin" }), t('engine.edit.forceSave')] })] })] }) })] }));
+}
+function PermissionTable({ objects, draft, expanded, fieldsByObject, writable, objectActions, t, onToggleExpand, onObjectPerm, onFieldPerm, onBulkSet, }) {
+    return (_jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "sticky top-0 bg-background border-b z-10", children: _jsxs("tr", { children: [_jsx("th", { className: "text-left px-4 py-2 font-medium w-72", children: t('perm.col.object') }), objectActions.map((a) => (_jsx("th", { className: "px-2 py-2 font-medium text-center w-14", title: a.tip, children: a.short }, a.key))), _jsx("th", { className: "px-2 py-2 font-medium w-44 text-right", children: t('perm.col.bulk') })] }) }), _jsxs("tbody", { children: [objects.length === 0 && (_jsx("tr", { children: _jsx("td", { colSpan: objectActions.length + 2, className: "px-4 py-8 text-center text-muted-foreground", children: t('perm.filter.empty') }) })), objects.map((o) => {
+                        const perm = draft.objects[o.name] ?? {};
+                        const open = expanded.has(o.name);
+                        return (_jsxs(React.Fragment, { children: [_jsxs("tr", { className: "border-b hover:bg-muted/30", children: [_jsx("td", { className: "px-2 py-1.5 align-middle", children: _jsxs("button", { type: "button", onClick: () => onToggleExpand(o.name), className: "inline-flex items-center gap-1.5 hover:text-foreground", children: [open ? (_jsx(ChevronDown, { className: "h-3.5 w-3.5" })) : (_jsx(ChevronRight, { className: "h-3.5 w-3.5" })), _jsx("span", { className: "font-medium", children: o.label ?? o.name }), o.label && (_jsxs("span", { className: "text-xs text-muted-foreground", children: ["(", o.name, ")"] }))] }) }), objectActions.map((a) => (_jsx("td", { className: "text-center px-2 py-1.5", children: _jsx(Checkbox, { checked: !!perm[a.key], disabled: !writable, onCheckedChange: (v) => onObjectPerm(o.name, a.key, !!v), "aria-label": `${o.name} ${a.tip}` }) }, a.key))), _jsxs("td", { className: "px-2 py-1.5 text-right space-x-1", children: [_jsx(Button, { variant: "ghost", size: "sm", className: "h-6 px-1.5 text-xs", disabled: !writable, onClick: () => onBulkSet(o.name, 'read'), children: t('perm.bulk.read') }), _jsx(Button, { variant: "ghost", size: "sm", className: "h-6 px-1.5 text-xs", disabled: !writable, onClick: () => onBulkSet(o.name, 'crud'), children: t('perm.bulk.crud') }), _jsx(Button, { variant: "ghost", size: "sm", className: "h-6 px-1.5 text-xs", disabled: !writable, onClick: () => onBulkSet(o.name, 'all'), children: t('perm.bulk.all') }), _jsx(Button, { variant: "ghost", size: "sm", className: "h-6 px-1.5 text-xs", disabled: !writable, onClick: () => onBulkSet(o.name, 'none'), children: t('perm.bulk.none') })] })] }), open && (_jsx("tr", { className: "bg-muted/10", children: _jsx("td", { colSpan: objectActions.length + 2, className: "px-12 py-3", children: _jsx(FieldsSubTable, { objectName: o.name, fields: fieldsByObject[o.name], fieldsState: draft.fields ?? {}, writable: writable, t: t, onFieldPerm: onFieldPerm }) }) }))] }, o.name));
+                    })] })] }));
+}
+function FieldsSubTable({ objectName, fields, fieldsState, writable, t, onFieldPerm, }) {
+    if (!fields) {
+        return (_jsxs("div", { className: "text-xs text-muted-foreground flex items-center gap-2", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin" }), " ", t('perm.field.loading')] }));
+    }
+    if (fields.length === 0) {
+        return _jsx("div", { className: "text-xs text-muted-foreground", children: t('perm.field.empty') });
+    }
+    return (_jsxs("table", { className: "w-full text-xs", children: [_jsx("thead", { children: _jsxs("tr", { className: "text-muted-foreground", children: [_jsx("th", { className: "text-left py-1 font-medium", children: t('perm.field.col.name') }), _jsx("th", { className: "px-2 py-1 font-medium w-16 text-center", title: t('perm.field.read'), children: t('perm.field.read') }), _jsx("th", { className: "px-2 py-1 font-medium w-16 text-center", title: t('perm.field.edit'), children: t('perm.field.edit') })] }) }), _jsx("tbody", { children: fields.map((f) => {
+                    const key = `${objectName}.${f.name}`;
+                    const cur = fieldsState[key] ?? { readable: true, editable: false };
+                    return (_jsxs("tr", { className: "border-t border-muted", children: [_jsxs("td", { className: "py-1", children: [f.label ?? f.name, f.label && (_jsxs("span", { className: "ml-1 text-muted-foreground", children: ["(", f.name, ")"] }))] }), _jsx("td", { className: "px-2 py-1 text-center", children: _jsx(Checkbox, { checked: !!cur.readable, disabled: !writable, onCheckedChange: (v) => onFieldPerm(objectName, f.name, 'readable', !!v), "aria-label": `${objectName}.${f.name} readable` }) }), _jsx("td", { className: "px-2 py-1 text-center", children: _jsx(Checkbox, { checked: !!cur.editable, disabled: !writable, onCheckedChange: (v) => onFieldPerm(objectName, f.name, 'editable', !!v), "aria-label": `${objectName}.${f.name} editable` }) })] }, f.name));
+                }) })] }));
+}

package/dist/views/metadata-admin/QuickFind.d.ts

@@ -0,0 +1,5 @@
+export interface MetadataQuickFindProps {
+    /** Optional app slug for routing; defaults to "setup" if unknown. */
+    appSlug?: string;
+}
+export declare function MetadataQuickFind({ appSlug }?: MetadataQuickFindProps): import("react/jsx-runtime").JSX.Element;