@vertebr/react 0.18.1 → 0.19.0

package/dist/components/admin/AdminContent.d.ts

@@ -1,5 +1,6 @@
 import type { CatalogResponse, ConfigResponse, EmailsBoardResponse, FontLibraryResponse, GalleryResponse, MetricsResponse, ResourceListResponse, VertebrClient } from "@vertebr/client";
 import type { MetricsRangeId } from "../../lib/metricsRanges";
+import type { TableSortState } from "../../lib/sort";
 import type { Selection } from "./types";
 export type AdminContentProps = {
     client: VertebrClient;
@@ -24,8 +25,11 @@ export type AdminContentProps = {
     emailsLoading: boolean;
     onRefreshEmails: () => Promise<void>;
     resourceData: ResourceListResponse | null;
+    resourceLoading?: boolean;
     resourceSearch?: string;
     onResourceSearchChange?: (q: string) => void;
+    resourceSort?: TableSortState | null;
+    onResourceSortChange?: (sort: TableSortState) => void;
     onRefreshResource: () => Promise<void>;
     onRefreshConfig?: () => Promise<void>;
     configData: ConfigResponse | null;
@@ -45,5 +49,5 @@ export type AdminContentProps = {
         onRefreshFonts?: () => Promise<void>;
     };
 };
-export declare function AdminContent({ client, catalog, selection, onSelectionChange, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, resourceSearch, onResourceSearchChange, onRefreshResource, onRefreshConfig, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }: AdminContentProps): import("react").JSX.Element;
+export declare function AdminContent({ client, catalog, selection, onSelectionChange, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, resourceLoading, resourceSearch, onResourceSearchChange, resourceSort, onResourceSortChange, onRefreshResource, onRefreshConfig, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }: AdminContentProps): import("react").JSX.Element;
 //# sourceMappingURL=AdminContent.d.ts.map

package/dist/components/admin/AdminContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminContent.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminContent.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"AdminContent.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminContent.tsx"],"names":[],"mappings":"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"}

package/dist/components/admin/AdminContent.js

@@ -57,8 +57,9 @@ function ConfigEditor({ client, catalog, configData, isPageSelection, previewPat
         };
     }, [client, configData.id, relatedKey, relatedAddons]);
     const onChange = useCallback((value) => {
-        setDraft(value);
-    }, []);
+        // Merge — react-hook-form watch can omit unchanged / empty keys.
+        setDraft((prev) => ({ ...(prev ?? configData.value), ...value }));
+    }, [configData.value]);
     const form = (_jsx(ConfigForm, { schema: configData.schema, value: configData.value, client: client, canWrite: canWrite, revisionsEnabled: showRevisions, canPublish: canPublish && Boolean(configData.draftRevisionId), onPublish: canPublish && configData.draftRevisionId
             ? async () => {
                 const published = await client.publishRevision(configData.id, configData.draftRevisionId);
@@ -76,7 +77,7 @@ function ConfigEditor({ client, catalog, configData, isPageSelection, previewPat
                             return (_jsxs("button", { type: "button", className: "vertebr-page-related-addon", "data-enabled": enabled ? "true" : "false", onClick: () => onSelectAddon?.(addon.id), children: [_jsx("span", { children: addon.label }), _jsx("em", { children: enabled ? "on" : "off" })] }, addon.id));
                         }) })] })) : null, showPreview && previewPath ? (_jsxs("div", { className: "vertebr-page-editor", children: [_jsx("div", { className: "vertebr-page-editor-form", children: form }), _jsx(PagePreviewPane, { previewPath: previewPath, controlId: configData.id, draft: draft ?? configData.value, relatedDrafts: Object.keys(relatedDrafts).length ? relatedDrafts : undefined })] })) : (form)] }));
 }
-export function AdminContent({ client, catalog, selection, onSelectionChange, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, resourceSearch, onResourceSearchChange, onRefreshResource, onRefreshConfig, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }) {
+export function AdminContent({ client, catalog, selection, onSelectionChange, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, resourceLoading = false, resourceSearch, onResourceSearchChange, resourceSort = null, onResourceSortChange, onRefreshResource, onRefreshConfig, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }) {
     if (!catalog) {
         return (_jsx("div", { className: "vertebr-content", children: _jsx("section", { className: "vertebr-panel", children: _jsx("div", { className: "vertebr-empty", children: authRequired
                         ? "Authenticated access required for this environment."
@@ -84,7 +85,7 @@ export function AdminContent({ client, catalog, selection, onSelectionChange, au
                             ? "Loading…"
                             : "Unable to load catalog." }) }) }));
     }
-    return (_jsx("div", { className: "vertebr-content", children: _jsxs("section", { className: "vertebr-panel", children: [selection?.kind === "overview" ? (_jsx(MetricsBoard, { label: metricsData?.label ?? catalog.metrics?.label, windowLabel: metricsData?.windowLabel, compareLabel: metricsData?.compareLabel, metrics: metricsData?.metrics ?? [], charts: metricsData?.charts ?? [], range: metricsRange, onRangeChange: onMetricsRangeChange, loading: metricsLoading, onRefresh: () => void onRefreshMetrics() })) : null, selection?.kind === "audit" ? (_jsx(AuditBoard, { client: client, label: catalog.audit?.label })) : null, selection?.kind === "sync" ? (_jsx(AdminSyncPage, { client: client, catalog: catalog })) : null, selection?.kind === "gallery" && galleryData ? (_jsx(GalleryBoard, { label: galleryData.label, items: galleryData.items, accept: galleryData.accept, maxBytes: galleryData.maxBytes, canDelete: galleryData.canDelete, loading: galleryLoading, onRefresh: () => void onRefreshGallery(), onUpload: async (files) => {
+    return (_jsx("div", { className: "vertebr-content", children: _jsxs("section", { className: "vertebr-panel", children: [selection?.kind === "overview" ? (_jsx(MetricsBoard, { label: metricsData?.label ?? catalog.metrics?.label, windowLabel: metricsData?.windowLabel, compareLabel: metricsData?.compareLabel, metrics: metricsData?.metrics ?? [], charts: metricsData?.charts ?? [], range: metricsRange, onRangeChange: onMetricsRangeChange, loading: metricsLoading, onRefresh: () => void onRefreshMetrics() })) : null, selection?.kind === "audit" ? (_jsx(AuditBoard, { client: client, label: catalog.audit?.label, columns: catalog.audit?.columns })) : null, selection?.kind === "sync" ? (_jsx(AdminSyncPage, { client: client, catalog: catalog })) : null, selection?.kind === "gallery" && galleryData ? (_jsx(GalleryBoard, { label: galleryData.label, items: galleryData.items, accept: galleryData.accept, maxBytes: galleryData.maxBytes, canDelete: galleryData.canDelete, loading: galleryLoading, onRefresh: () => void onRefreshGallery(), onUpload: async (files) => {
                         for (const file of files) {
                             await client.uploadGalleryFile(file);
                         }
@@ -151,52 +152,76 @@ export function AdminContent({ client, catalog, selection, onSelectionChange, au
                         ? async (id) => {
                             await client.deleteEmailLibraryTemplate(id);
                         }
-                        : undefined })) : null, selection?.kind === "resource" && resourceData ? (_jsx(ResourcePanel, { schema: resourceData.schema, items: resourceData.items, label: resourceData.label, listQuery: resourceData.listQuery, total: resourceData.total, searchQuery: resourceSearch, onSearchChange: onResourceSearchChange, initialEditRowId: selection.rowId && selection.id === resourceData.id
-                        ? selection.rowId
-                        : undefined, onEditRowIdChange: (rowId) => {
-                        onSelectionChange?.({
-                            kind: "resource",
-                            id: resourceData.id,
-                            rowId: rowId ?? undefined,
-                        });
-                    }, permissions: resourceData.permissions, actions: resourceData.actions, collectionActions: resourceData.collectionActions, bulkActions: resourceData.bulkActions, uploads: resourceData.uploads, storageKey: resourceData.id, onUpdate: resourceData.permissions.update
-                        ? async (rowId, value) => {
-                            await client.updateResource(resourceData.id, rowId, value);
-                            await onRefreshResource();
-                        }
-                        : undefined, onCreate: resourceData.permissions.create
-                        ? async (value) => {
-                            await client.createResource(resourceData.id, value);
-                            await onRefreshResource();
-                        }
-                        : undefined, onDelete: resourceData.permissions.delete
-                        ? async (rowId) => {
-                            await client.deleteResource(resourceData.id, rowId);
-                            await onRefreshResource();
-                        }
-                        : undefined, onAction: async (rowId, actionId, input) => {
-                        await client.runResourceAction(resourceData.id, rowId, actionId, input);
-                    }, onActionDone: onRefreshResource, onPreviewMail: async (rowId, actionId, input) => {
-                        return client.previewResourceMail(resourceData.id, rowId, actionId, input);
-                    }, onCollectionAction: async (actionId, input) => {
-                        return client.runCollectionAction(resourceData.id, actionId, input);
-                    }, onBulkAction: resourceData.bulkActions
-                        ? async (actionId, rowIds, input) => {
-                            await client.runBulkAction(resourceData.id, actionId, {
-                                rowIds,
-                                input,
-                            });
-                        }
-                        : undefined, onUpload: resourceData.uploads
-                        ? async (field, files) => {
-                            const uploaded = [];
-                            for (const file of files) {
-                                const result = await client.uploadResourceFile(resourceData.id, field, file);
-                                uploaded.push({ url: result.url, name: result.name });
-                            }
-                            return uploaded;
-                        }
-                        : undefined, ...galleryPicker })) : null, selection?.kind === "addons" ? (_jsx(AddonOverview, { client: client, catalog: catalog, onSelectAddon: (id) => onSelectionChange?.({ kind: "addon", id }) })) : null, selection?.kind === "config" && configData ? (_jsx(ConfigEditor, { client: client, catalog: catalog, configData: configData, isPageSelection: isPageSelection, previewPath: catalog.configs.find((item) => item.id === configData.id)
+                        : undefined })) : null, selection?.kind === "resource"
+                    ? (() => {
+                        const catalogResource = catalog.resources.find((item) => item.id === selection.id);
+                        const ready = resourceData != null && resourceData.id === selection.id;
+                        const schema = ready
+                            ? resourceData.schema
+                            : (catalogResource?.schema ?? {});
+                        if (!ready && Object.keys(schema).length === 0)
+                            return null;
+                        return (_jsx(ResourcePanel, { schema: schema, items: ready ? resourceData.items : [], label: ready
+                                ? resourceData.label
+                                : (catalogResource?.label ?? selection.id), listQuery: ready
+                                ? resourceData.listQuery
+                                : catalogResource?.listQuery, total: ready ? resourceData.total : undefined, loading: resourceLoading || !ready, searchQuery: resourceSearch, onSearchChange: onResourceSearchChange, sort: resourceSort, onSortChange: onResourceSortChange, initialEditRowId: ready && selection.rowId ? selection.rowId : undefined, onEditRowIdChange: (rowId) => {
+                                onSelectionChange?.({
+                                    kind: "resource",
+                                    id: selection.id,
+                                    rowId: rowId ?? undefined,
+                                });
+                            }, permissions: ready
+                                ? resourceData.permissions
+                                : { create: false, update: false, delete: false }, actions: ready ? resourceData.actions : {}, collectionActions: ready ? resourceData.collectionActions : {}, bulkActions: ready ? resourceData.bulkActions : {}, uploads: ready ? resourceData.uploads : undefined, storageKey: selection.id, onUpdate: ready && resourceData.permissions.update
+                                ? async (rowId, value) => {
+                                    await client.updateResource(resourceData.id, rowId, value);
+                                    await onRefreshResource();
+                                }
+                                : undefined, onCreate: ready && resourceData.permissions.create
+                                ? async (value) => {
+                                    await client.createResource(resourceData.id, value);
+                                    await onRefreshResource();
+                                }
+                                : undefined, onDelete: ready && resourceData.permissions.delete
+                                ? async (rowId) => {
+                                    await client.deleteResource(resourceData.id, rowId);
+                                    await onRefreshResource();
+                                }
+                                : undefined, onAction: ready
+                                ? async (rowId, actionId, input) => {
+                                    await client.runResourceAction(resourceData.id, rowId, actionId, input);
+                                }
+                                : undefined, onActionDone: onRefreshResource, onPreviewMail: ready
+                                ? async (rowId, actionId, input) => {
+                                    return client.previewResourceMail(resourceData.id, rowId, actionId, input);
+                                }
+                                : undefined, onCollectionAction: ready
+                                ? async (actionId, input) => {
+                                    return client.runCollectionAction(resourceData.id, actionId, input);
+                                }
+                                : undefined, onBulkAction: ready && resourceData.bulkActions
+                                ? async (actionId, rowIds, input) => {
+                                    await client.runBulkAction(resourceData.id, actionId, {
+                                        rowIds,
+                                        input,
+                                    });
+                                }
+                                : undefined, onUpload: ready && resourceData.uploads
+                                ? async (field, files) => {
+                                    const uploaded = [];
+                                    for (const file of files) {
+                                        const result = await client.uploadResourceFile(resourceData.id, field, file);
+                                        uploaded.push({
+                                            url: result.url,
+                                            name: result.name,
+                                        });
+                                    }
+                                    return uploaded;
+                                }
+                                : undefined, ...galleryPicker }));
+                    })()
+                    : null, selection?.kind === "addons" ? (_jsx(AddonOverview, { client: client, catalog: catalog, onSelectAddon: (id) => onSelectionChange?.({ kind: "addon", id }) })) : null, selection?.kind === "config" && configData ? (_jsx(ConfigEditor, { client: client, catalog: catalog, configData: configData, isPageSelection: isPageSelection, previewPath: catalog.configs.find((item) => item.id === configData.id)
                         ?.previewPath, relatedAddons: catalog.configs.find((item) => item.id === configData.id)
                         ?.relatedAddons, onConfigSaved: onConfigSaved, onRefreshConfig: onRefreshConfig, onSelectAddon: (id) => onSelectionChange?.({ kind: "addon", id }), galleryPicker: galleryPicker, fontLibraryPicker: fontLibraryPicker }, configData.id)) : null, selection?.kind === "addon" && configData ? ((() => {
                     const addon = catalog.addons?.find((item) => item.id === configData.id);

package/dist/components/admin/AuditBoard.d.ts

@@ -1,7 +1,11 @@
-import type { VertebrClient } from "@vertebr/client";
+import type { AuditColumn, AuditEntry, VertebrClient } from "@vertebr/client";
 export type AuditBoardProps = {
     client: VertebrClient;
     label?: string;
+    /** From `catalog.audit.columns`. Omit for Vertebr defaults. */
+    columns?: AuditColumn[];
 };
-export declare function AuditBoard({ client, label }: AuditBoardProps): import("react").JSX.Element;
+/** Resolve a column path against an audit entry (`meta.x`, `target`, or field). */
+export declare function resolveAuditColumnValue(entry: AuditEntry, path: string): unknown;
+export declare function AuditBoard({ client, label, columns: columnsProp, }: AuditBoardProps): import("react").JSX.Element;
 //# sourceMappingURL=AuditBoard.d.ts.map

package/dist/components/admin/AuditBoard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AuditBoard.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AuditBoard.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAc,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEjE,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAaF,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,KAAe,EAAE,EAAE,eAAe,+BA4EtE"}
+{"version":3,"file":"AuditBoard.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AuditBoard.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,WAAW,EACX,UAAU,EACV,aAAa,EACd,MAAM,iBAAiB,CAAC;AAoBzB,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;CACzB,CAAC;AAsEF,mFAAmF;AACnF,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,UAAU,EACjB,IAAI,EAAE,MAAM,GACX,OAAO,CAST;AA6CD,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAe,EACf,OAAO,EAAE,WAAW,GACrB,EAAE,eAAe,+BA2LjB"}

package/dist/components/admin/AuditBoard.js

@@ -1,5 +1,46 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
+import { SortableHeader } from "../resources/SortableHeader";
+import { TableFilters, TableScrollControls, TableSearch, TableSkeleton, TableWrap, matchesTableFilters, matchesTableQuery, resolveAuditFilter, useTableOverflow, } from "../table";
+import { compareFieldValues, nextTableSort, } from "../../lib/sort";
+/** Fallback when catalog omits columns — keep in sync with `defaultAuditColumns`. */
+const DEFAULT_COLUMNS = [
+    { id: "at", label: "When", path: "at", type: "datetime" },
+    { id: "actor", label: "Email", path: "actor" },
+    {
+        id: "action",
+        label: "Action",
+        path: "action",
+        filter: {
+            options: [
+                "config.set",
+                "config.publish",
+                "config.revision.save",
+                "config.revision.publish",
+                "config.revision.restore",
+                "addon.publish",
+                "resource.create",
+                "resource.update",
+                "resource.delete",
+                "sync.run",
+            ],
+            optionLabels: {
+                "config.set": "Config set",
+                "config.publish": "Config publish",
+                "config.revision.save": "Revision save",
+                "config.revision.publish": "Revision publish",
+                "config.revision.restore": "Revision restore",
+                "addon.publish": "Addon publish",
+                "resource.create": "Resource create",
+                "resource.update": "Resource update",
+                "resource.delete": "Resource delete",
+                "sync.run": "Sync run",
+            },
+        },
+    },
+    { id: "target", label: "Target", path: "target" },
+    { id: "summary", label: "Summary", path: "summary" },
+];
 function formatWhen(at) {
     const date = new Date(at);
     if (Number.isNaN(date.getTime()))
@@ -11,10 +52,72 @@ function formatWhen(at) {
         minute: "2-digit",
     });
 }
-export function AuditBoard({ client, label = "Audit" }) {
+function formatCellDisplay(value, column) {
+    if (value == null || value === "")
+        return "—";
+    if (column.type === "datetime" || column.path === "at") {
+        return formatWhen(String(value));
+    }
+    if (column.type === "boolean") {
+        return value ? "Yes" : "No";
+    }
+    if (typeof value === "object") {
+        try {
+            return JSON.stringify(value);
+        }
+        catch {
+            return String(value);
+        }
+    }
+    return String(value);
+}
+/** Resolve a column path against an audit entry (`meta.x`, `target`, or field). */
+export function resolveAuditColumnValue(entry, path) {
+    if (path === "target") {
+        return `${entry.targetType}${entry.targetId ? ` · ${entry.targetId}` : ""}`;
+    }
+    if (path.startsWith("meta.")) {
+        const key = path.slice("meta.".length);
+        return entry.meta?.[key];
+    }
+    return entry[path];
+}
+function columnSortType(column) {
+    if (column.type === "datetime" || column.path === "at")
+        return "datetime";
+    if (column.type === "number")
+        return "number";
+    return "string";
+}
+function AuditCell({ entry, column, }) {
+    const value = resolveAuditColumnValue(entry, column.path);
+    const display = formatCellDisplay(value, column);
+    if (column.path === "at" || column.type === "datetime") {
+        return _jsx("td", { className: "vertebr-audit-when", children: display });
+    }
+    if (column.path === "actor") {
+        return _jsx("td", { className: "vertebr-audit-actor", children: display });
+    }
+    if (column.path === "action") {
+        return (_jsx("td", { children: display === "—" ? (display) : (_jsx("code", { className: "vertebr-audit-action", children: display })) }));
+    }
+    if (column.path === "target" || column.path === "targetType") {
+        return (_jsx("td", { children: _jsx("span", { className: "vertebr-audit-target", children: display }) }));
+    }
+    return _jsx("td", { children: display });
+}
+export function AuditBoard({ client, label = "Audit", columns: columnsProp, }) {
+    const columns = columnsProp && columnsProp.length > 0 ? columnsProp : DEFAULT_COLUMNS;
     const [items, setItems] = useState([]);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(null);
+    const [query, setQuery] = useState("");
+    const [filters, setFilters] = useState({});
+    const [sort, setSort] = useState(() => ({
+        field: columns.find((column) => column.path === "at")?.id ?? columns[0].id,
+        order: "desc",
+    }));
+    const tableOverflow = useTableOverflow(items.length);
     useEffect(() => {
         let cancelled = false;
         (async () => {
@@ -39,5 +142,44 @@ export function AuditBoard({ client, label = "Audit" }) {
             cancelled = true;
         };
     }, [client]);
-    return (_jsxs("div", { className: "vertebr-audit", children: [_jsxs("div", { className: "vertebr-panel-head", children: [_jsx("h2", { children: label }), _jsx("span", { className: "vertebr-count", children: loading ? "…" : `${items.length} events` })] }), error ? _jsx("div", { className: "vertebr-error", children: error }) : null, loading && items.length === 0 ? (_jsx("div", { className: "vertebr-empty", children: "Loading audit log\u2026" })) : items.length === 0 ? (_jsx("div", { className: "vertebr-empty", children: "No audit events yet." })) : (_jsx("div", { className: "vertebr-table-wrap", children: _jsxs("table", { className: "vertebr-table vertebr-audit-table", children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: "When" }), _jsx("th", { children: "Actor" }), _jsx("th", { children: "Action" }), _jsx("th", { children: "Target" }), _jsx("th", { children: "Summary" })] }) }), _jsx("tbody", { children: items.map((entry) => (_jsxs("tr", { children: [_jsx("td", { className: "vertebr-audit-when", children: formatWhen(entry.at) }), _jsx("td", { children: entry.actor ?? "—" }), _jsx("td", { children: _jsx("code", { className: "vertebr-audit-action", children: entry.action }) }), _jsx("td", { children: _jsxs("span", { className: "vertebr-audit-target", children: [entry.targetType, entry.targetId ? ` · ${entry.targetId}` : ""] }) }), _jsx("td", { children: entry.summary })] }, entry.id))) })] }) }))] }));
+    const filterColumns = useMemo(() => columns
+        .map((column) => resolveAuditFilter(column.id, column.label, column.filter))
+        .filter((column) => Boolean(column)), [columns]);
+    const filterGetters = useMemo(() => Object.fromEntries(filterColumns.map((column) => {
+        const source = columns.find((item) => item.id === column.id);
+        return [
+            column.id,
+            (entry) => resolveAuditColumnValue(entry, source?.path ?? column.id),
+        ];
+    })), [filterColumns, columns]);
+    const searchedItems = useMemo(() => {
+        if (!query.trim())
+            return items;
+        return items.filter((entry) => columns.some((col) => matchesTableQuery(resolveAuditColumnValue(entry, col.path), query)));
+    }, [items, query, columns]);
+    const sortedItems = useMemo(() => {
+        const column = columns.find((item) => item.id === sort.field) ?? columns[0];
+        const filtered = searchedItems.filter((entry) => matchesTableFilters(entry, filters, filterGetters));
+        if (!column)
+            return filtered;
+        const type = columnSortType(column);
+        return [...filtered].sort((left, right) => compareFieldValues(resolveAuditColumnValue(left, column.path), resolveAuditColumnValue(right, column.path), type, sort.order));
+    }, [searchedItems, sort, columns, filters, filterGetters]);
+    return (_jsxs("div", { className: "vertebr-audit", children: [_jsxs("div", { className: "vertebr-panel-head", children: [_jsx("h2", { children: label }), _jsxs("div", { className: "vertebr-panel-head-actions", children: [filterColumns.length > 0 ? (_jsx(TableFilters, { columns: filterColumns, selected: filters, onChange: setFilters })) : null, _jsx(TableSearch, { value: query, onChange: setQuery, "aria-label": "Search audit" }), _jsx(TableScrollControls, { canLeft: tableOverflow.canLeft, canRight: tableOverflow.canRight, onScroll: tableOverflow.scrollBy }), _jsx("span", { className: "vertebr-count", children: loading
+                                    ? "…"
+                                    : sortedItems.length !== items.length
+                                        ? `${sortedItems.length} of ${items.length}`
+                                        : `${items.length} events` })] })] }), error ? _jsx("div", { className: "vertebr-error", children: error }) : null, loading && items.length === 0 ? (_jsx(TableSkeleton, { columns: columns.map((column) => ({
+                    id: column.id,
+                    label: column.label,
+                })) })) : items.length === 0 ? (_jsx("div", { className: "vertebr-empty", children: "No audit events yet." })) : sortedItems.length === 0 ? (_jsx("div", { className: "vertebr-empty", children: "No matching events." })) : (_jsx(TableWrap, { overflow: tableOverflow, transitionKey: JSON.stringify(filters), children: _jsxs("table", { className: "vertebr-table vertebr-audit-table", children: [_jsx("thead", { children: _jsx("tr", { children: columns.map((column) => {
+                                    const sortable = column.sortable !== false;
+                                    const active = sort.field === column.id;
+                                    if (!sortable) {
+                                        return _jsx("th", { children: column.label }, column.id);
+                                    }
+                                    return (_jsx("th", { children: _jsx(SortableHeader, { label: column.label, active: active, order: active ? sort.order : undefined, onSort: () => setSort(nextTableSort(sort, column.id, column.type === "datetime" || column.path === "at"
+                                                ? "desc"
+                                                : "asc")) }) }, column.id));
+                                }) }) }), _jsx("tbody", { children: sortedItems.map((entry) => (_jsx("tr", { children: columns.map((column) => (_jsx(AuditCell, { entry: entry, column: column }, column.id))) }, entry.id))) })] }) }))] }));
 }

package/dist/components/admin/VertebrAdmin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VertebrAdmin.d.ts","sourceRoot":"","sources":["../../../src/components/admin/VertebrAdmin.tsx"],"names":[],"mappings":"AAwCA,OAAO,KAAK,EAGV,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD,wBAAgB,YAAY,CAAC,EAC3B,OAAsB,EACtB,QAAQ,EAAE,YAAY,EACtB,KAAuB,EACvB,aAA6B,EAC7B,eAAiC,EACjC,eAAiC,EACjC,sBAAgD,EAChD,cAAc,EACd,aAAa,EACb,SAAS,EACT,YAAY,EACZ,gBAAgB,GACjB,EAAE,iBAAiB,+BAiyBnB"}
+{"version":3,"file":"VertebrAdmin.d.ts","sourceRoot":"","sources":["../../../src/components/admin/VertebrAdmin.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,EAGV,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD,wBAAgB,YAAY,CAAC,EAC3B,OAAsB,EACtB,QAAQ,EAAE,YAAY,EACtB,KAAuB,EACvB,aAA6B,EAC7B,eAAiC,EACjC,eAAiC,EACjC,sBAAgD,EAChD,cAAc,EACd,aAAa,EACb,SAAS,EACT,YAAY,EACZ,gBAAgB,GACjB,EAAE,iBAAiB,+BA+yBnB"}

package/dist/components/admin/VertebrAdmin.js

@@ -40,7 +40,9 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
         });
     });
     const [resourceData, setResourceData] = useState(null);
+    const [resourceLoading, setResourceLoading] = useState(false);
     const [resourceSearch, setResourceSearch] = useState("");
+    const [resourceSort, setResourceSort] = useState(null);
     const [configData, setConfigData] = useState(null);
     const [metricsData, setMetricsData] = useState(null);
     const [metricsLoading, setMetricsLoading] = useState(false);
@@ -213,8 +215,12 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                     }
                 }
                 else if (selection.kind === "resource") {
+                    setResourceLoading(true);
                     const data = await client.listResource(selection.id, {
                         ...(resourceSearch.trim() ? { q: resourceSearch.trim() } : {}),
+                        ...(resourceSort
+                            ? { sort: resourceSort.field, order: resourceSort.order }
+                            : {}),
                         fresh: true,
                     });
                     if (!cancelled) {
@@ -272,16 +278,18 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                     setGalleryLoading(false);
                     setFontLibraryLoading(false);
                     setEmailsLoading(false);
+                    setResourceLoading(false);
                 }
             }
         })();
         return () => {
             cancelled = true;
         };
-    }, [client, selection, catalog, environment, metricsRange, resourceSearch]);
+    }, [client, selection, catalog, environment, metricsRange, resourceSearch, resourceSort]);
     const resourceSelectionId = selection?.kind === "resource" ? selection.id : null;
     useEffect(() => {
         setResourceSearch("");
+        setResourceSort(null);
     }, [resourceSelectionId]);
     const refreshHealth = useCallback(async () => {
         if (!catalog?.health) {
@@ -317,10 +325,13 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
             return;
         const data = await client.listResource(selection.id, {
             ...(resourceSearch.trim() ? { q: resourceSearch.trim() } : {}),
+            ...(resourceSort
+                ? { sort: resourceSort.field, order: resourceSort.order }
+                : {}),
             fresh: true,
         });
         setResourceData(data);
-    }, [client, selection, resourceSearch]);
+    }, [client, selection, resourceSearch, resourceSort]);
     const refreshConfig = useCallback(async () => {
         if (selection?.kind !== "config" && selection?.kind !== "addon")
             return;
@@ -669,5 +680,5 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
         : selection?.kind === "addon"
             ? catalog?.addons?.find((item) => item.id === selection.id)?.description
             : undefined;
-    return (_jsx(SaveBarProvider, { children: _jsx(ToastProvider, { children: _jsxs("div", { className: "vertebr-root", "data-env": environment, "data-sidebar-collapsed": sidebarCollapsed || undefined, children: [_jsx(AdminTopBar, { brand: bootstrap?.brand ?? catalog?.brand ?? "Vertebr", brandLogoUrl: brandLogoUrl, brandLogoUrlDark: brandLogoUrlDark, hostName: bootstrap?.appearance?.hostName ?? catalog?.appearance?.hostName, hostLogoUrl: bootstrap?.appearance?.hostLogoUrl ?? catalog?.appearance?.hostLogoUrl, envList: envList, environment: environment, onEnvironmentChange: switchEnvironment, authUserLabel: authUserLabel, onSignOut: onSignOut, getAccessToken: getAccessToken, authViaTokenOnly: authViaTokenOnly, authRequired: authRequired, token: token, tokenDraft: tokenDraft, onTokenDraftChange: setTokenDraft, onSaveToken: saveToken, onClearToken: clearToken, theme: theme, onThemeChange: setTheme, sidebarCollapsed: sidebarCollapsed, onToggleSidebar: () => setSidebarCollapsed((prev) => !prev), syncEnabled: syncEnabled, onOpenSync: () => setSelection({ kind: "sync" }), onOpenSearch: () => setSearchOpen(true), healthChecks: healthChecks, onRefreshHealth: catalog?.health ? refreshHealth : undefined }), catalog && searchOpen ? (_jsx(AdminCommandPalette, { catalog: catalog, onClose: () => setSearchOpen(false), onSelect: setSelection })) : null, _jsx(AdminSidebar, { navGroups: navGroups, collapsed: sidebarCollapsed }), _jsxs("main", { className: "vertebr-main", children: [_jsx(AdminHeader, { activeLabel: activeLabel ?? (catalog ? "Dashboard" : "Sign in"), catalogLoaded: Boolean(catalog), authRequired: authRequired, selection: selection, isPageSelection: isPageSelection, hasPagePreview: hasPagePreview, selectionDescription: selectionDescription, error: error, breadcrumbs: breadcrumbsForSelection(selection, catalog) }), _jsx(AdminContent, { client: client, catalog: catalog, selection: selection, onSelectionChange: setSelection, authRequired: authRequired, loading: loading, isPageSelection: isPageSelection, metricsData: metricsData, metricsLoading: metricsLoading, metricsRange: metricsRange, onMetricsRangeChange: changeMetricsRange, onRefreshMetrics: refreshMetrics, galleryData: galleryData, galleryLoading: galleryLoading, onRefreshGallery: refreshGallery, fontLibraryData: fontLibraryData, fontLibraryLoading: fontLibraryLoading, onRefreshFonts: refreshFonts, emailsData: emailsData, emailsLoading: emailsLoading, onRefreshEmails: refreshEmails, resourceData: resourceData, resourceSearch: resourceSearch, onResourceSearchChange: setResourceSearch, onRefreshResource: refreshResource, configData: configData, onConfigSaved: setConfigData, onRefreshConfig: refreshConfig, galleryPicker: galleryPicker, fontLibraryPicker: fontLibraryPicker }), _jsx(AdminSaveBar, {})] }), _jsx(AdminToastStack, {})] }) }) }));
+    return (_jsx(SaveBarProvider, { children: _jsx(ToastProvider, { children: _jsxs("div", { className: "vertebr-root", "data-env": environment, "data-sidebar-collapsed": sidebarCollapsed || undefined, children: [_jsx(AdminTopBar, { brand: bootstrap?.brand ?? catalog?.brand ?? "Vertebr", brandLogoUrl: brandLogoUrl, brandLogoUrlDark: brandLogoUrlDark, hostName: bootstrap?.appearance?.hostName ?? catalog?.appearance?.hostName, hostLogoUrl: bootstrap?.appearance?.hostLogoUrl ?? catalog?.appearance?.hostLogoUrl, envList: envList, environment: environment, onEnvironmentChange: switchEnvironment, authUserLabel: authUserLabel, onSignOut: onSignOut, getAccessToken: getAccessToken, authViaTokenOnly: authViaTokenOnly, authRequired: authRequired, token: token, tokenDraft: tokenDraft, onTokenDraftChange: setTokenDraft, onSaveToken: saveToken, onClearToken: clearToken, theme: theme, onThemeChange: setTheme, sidebarCollapsed: sidebarCollapsed, onToggleSidebar: () => setSidebarCollapsed((prev) => !prev), syncEnabled: syncEnabled, onOpenSync: () => setSelection({ kind: "sync" }), onOpenSearch: () => setSearchOpen(true), healthChecks: healthChecks, onRefreshHealth: catalog?.health ? refreshHealth : undefined }), catalog && searchOpen ? (_jsx(AdminCommandPalette, { catalog: catalog, onClose: () => setSearchOpen(false), onSelect: setSelection })) : null, _jsx(AdminSidebar, { navGroups: navGroups, collapsed: sidebarCollapsed }), _jsxs("main", { className: "vertebr-main", children: [_jsx(AdminHeader, { activeLabel: activeLabel ?? (catalog ? "Dashboard" : "Sign in"), catalogLoaded: Boolean(catalog), authRequired: authRequired, selection: selection, isPageSelection: isPageSelection, hasPagePreview: hasPagePreview, selectionDescription: selectionDescription, error: error, breadcrumbs: breadcrumbsForSelection(selection, catalog) }), _jsx(AdminContent, { client: client, catalog: catalog, selection: selection, onSelectionChange: setSelection, authRequired: authRequired, loading: loading, isPageSelection: isPageSelection, metricsData: metricsData, metricsLoading: metricsLoading, metricsRange: metricsRange, onMetricsRangeChange: changeMetricsRange, onRefreshMetrics: refreshMetrics, galleryData: galleryData, galleryLoading: galleryLoading, onRefreshGallery: refreshGallery, fontLibraryData: fontLibraryData, fontLibraryLoading: fontLibraryLoading, onRefreshFonts: refreshFonts, emailsData: emailsData, emailsLoading: emailsLoading, onRefreshEmails: refreshEmails, resourceData: resourceData, resourceLoading: resourceLoading, resourceSearch: resourceSearch, onResourceSearchChange: setResourceSearch, resourceSort: resourceSort, onResourceSortChange: setResourceSort, onRefreshResource: refreshResource, configData: configData, onConfigSaved: setConfigData, onRefreshConfig: refreshConfig, galleryPicker: galleryPicker, fontLibraryPicker: fontLibraryPicker }), _jsx(AdminSaveBar, {})] }), _jsx(AdminToastStack, {})] }) }) }));
 }

package/dist/components/config/EnumInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EnumInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/EnumInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,GACT,EAAE,cAAc,+BAkDhB"}
+{"version":3,"file":"EnumInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/EnumInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,GACT,EAAE,cAAc,+BAsEhB"}

package/dist/components/config/EnumInput.js

@@ -5,11 +5,18 @@ export function EnumInput({ id, value, field, readOnly, onChange, }) {
     const baseOptions = field.options?.filter(Boolean) ?? [];
     const raw = typeof value === "string" ? value : "";
     const options = raw && !baseOptions.includes(raw) ? [raw, ...baseOptions] : baseOptions;
-    const current = raw && options.includes(raw) ? raw : (options[0] ?? "");
+    const allowClear = field.required !== true;
+    // Required enums still fall back to the first option when empty.
+    // Optional enums keep an empty value so links/CTAs can be cleared.
+    const current = raw && options.includes(raw)
+        ? raw
+        : allowClear
+            ? ""
+            : (options[0] ?? "");
     if (options.length === 0) {
         return (_jsx("input", { id: id, type: "text", readOnly: readOnly, value: current, disabled: true }));
     }
-    return (_jsxs(Select.Root, { value: current, onValueChange: onChange, disabled: readOnly, children: [_jsxs(Select.Trigger, { id: id, className: "vertebr-select-trigger", children: [_jsx("span", { className: "vertebr-select-value", children: _jsx(Select.Value, { children: optionLabel(current, field) }) }), _jsx(Select.Icon, { className: "vertebr-select-icon", children: _jsx(ChevronIcon, {}) })] }), _jsx(Select.Portal, { children: _jsx(Select.Content, { className: "vertebr-select-content", position: "popper", sideOffset: 6, children: _jsx(Select.Viewport, { className: "vertebr-select-viewport", children: options.map((option) => (_jsxs(Select.Item, { value: option, className: "vertebr-select-item", children: [_jsx(Select.ItemText, { children: optionLabel(option, field) }), _jsx(Select.ItemIndicator, { className: "vertebr-select-check", children: _jsx(CheckIcon, {}) })] }, option))) }) }) })] }));
+    return (_jsxs("div", { className: "vertebr-enum", children: [_jsxs(Select.Root, { value: current || undefined, onValueChange: onChange, disabled: readOnly, children: [_jsxs(Select.Trigger, { id: id, className: "vertebr-select-trigger", children: [_jsx("span", { className: "vertebr-select-value", children: _jsx(Select.Value, { placeholder: "None" }) }), _jsx(Select.Icon, { className: "vertebr-select-icon", children: _jsx(ChevronIcon, {}) })] }), _jsx(Select.Portal, { children: _jsx(Select.Content, { className: "vertebr-select-content", position: "popper", sideOffset: 6, children: _jsx(Select.Viewport, { className: "vertebr-select-viewport", children: options.map((option) => (_jsxs(Select.Item, { value: option, className: "vertebr-select-item", children: [_jsx(Select.ItemText, { children: optionLabel(option, field) }), _jsx(Select.ItemIndicator, { className: "vertebr-select-check", children: _jsx(CheckIcon, {}) })] }, option))) }) }) })] }), allowClear && current && !readOnly ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-enum-clear", onClick: () => onChange(""), children: "Clear" })) : null] }));
 }
 function ChevronIcon() {
     return (_jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", "aria-hidden": "true", children: _jsx("path", { d: "M2.5 4.5 6 8l3.5-3.5", fill: "none", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round", strokeLinejoin: "round" }) }));

package/dist/components/config/form/ConfigForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigForm.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAkB,EAClB,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,KAAK,EACL,YAAY,EACZ,WAAW,EACX,cAAc,EACd,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAe,EACf,gBAAwB,EACxB,SAAS,EACT,UAAkB,GACnB,EAAE,eAAe,+BA2LjB"}
+{"version":3,"file":"ConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigForm.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAkB,EAClB,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,KAAK,EACL,YAAY,EACZ,WAAW,EACX,cAAc,EACd,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAe,EACf,gBAAwB,EACxB,SAAS,EACT,UAAkB,GACnB,EAAE,eAAe,+BAqMjB"}

package/dist/components/config/form/ConfigForm.js

@@ -28,11 +28,23 @@ export function ConfigForm({ schema, value, onSave, submitLabel, variant = "conf
         if (!onChange)
             return;
         const subscription = form.watch((values) => {
-            onChange((values ?? {}));
+            // Keep empty strings for optional fields so clears reach the host preview
+            // (react-hook-form can emit undefined for cleared optional inputs).
+            const next = { ...(values ?? {}) };
+            for (const [key, field] of Object.entries(editorSchema)) {
+                if (field.type !== "string" && field.type !== "richtext" && field.type !== "enum") {
+                    continue;
+                }
+                if (field.required)
+                    continue;
+                if (next[key] == null)
+                    next[key] = "";
+            }
+            onChange(next);
         });
         onChange((form.getValues() ?? {}));
         return () => subscription.unsubscribe();
-    }, [form, onChange]);
+    }, [form, onChange, editorSchema]);
     useEffect(() => {
         form.reset(editorValue);
     }, [editorValue, form]);

package/dist/components/emails/EmailsActivityPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmailsActivityPanel.d.ts","sourceRoot":"","sources":["../../../src/components/emails/EmailsActivityPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAEtE,MAAM,MAAM,wBAAwB,GAAG;IACrC,SAAS,EAAE,YAAY,EAAE,CAAC;IAC1B,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC1C,CAAC;AAqFF,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,OAAO,EACP,WAAW,EACX,UAAU,EACV,IAAI,EACJ,QAAQ,GACT,EAAE,wBAAwB,+BA6L1B"}
+{"version":3,"file":"EmailsActivityPanel.d.ts","sourceRoot":"","sources":["../../../src/components/emails/EmailsActivityPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAetE,MAAM,MAAM,wBAAwB,GAAG;IACrC,SAAS,EAAE,YAAY,EAAE,CAAC;IAC1B,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC1C,CAAC;AAgIF,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,OAAO,EACP,WAAW,EACX,UAAU,EACV,IAAI,EACJ,QAAQ,GACT,EAAE,wBAAwB,+BAyR1B"}