@vertebr/react 0.1.1 → 0.3.0

package/dist/components/resources/ResourceTable.d.ts

@@ -0,0 +1,34 @@
+import type { FieldSchema, GalleryItem, ResourceActionMeta, ResourceUploadMeta } from "@vertebr/client";
+type ResourcePanelProps = {
+    schema: Record<string, FieldSchema>;
+    items: Record<string, unknown>[];
+    permissions?: {
+        create?: boolean;
+        update?: boolean;
+        delete?: boolean;
+    };
+    actions?: Record<string, ResourceActionMeta>;
+    uploads?: Record<string, ResourceUploadMeta>;
+    rowIdKeys?: string[];
+    /** Persist column visibility under this key (e.g. resource id). */
+    storageKey?: string;
+    onUpdate?: (rowId: string, value: Record<string, unknown>) => Promise<void>;
+    onCreate?: (value: Record<string, unknown>) => Promise<void>;
+    onDelete?: (rowId: string) => Promise<void>;
+    onAction?: (rowId: string, actionId: string) => Promise<void>;
+    onUpload?: (field: string, files: File[]) => Promise<Array<{
+        url: string;
+        name?: string;
+    }>>;
+    galleryUpload?: Pick<ResourceUploadMeta, "accept" | "maxBytes">;
+    onListGallery?: () => Promise<GalleryItem[]>;
+    onUploadGallery?: (files: File[]) => Promise<GalleryItem[]>;
+};
+export declare function ResourcePanel({ schema, items, permissions, actions, uploads, rowIdKeys, storageKey, onUpdate, onCreate, onDelete, onAction, onUpload, galleryUpload, onListGallery, onUploadGallery, }: ResourcePanelProps): import("react").JSX.Element;
+/** @deprecated Prefer ResourcePanel */
+export declare function ResourceTable(props: {
+    schema: Record<string, FieldSchema>;
+    items: Record<string, unknown>[];
+}): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=ResourceTable.d.ts.map

package/dist/components/resources/ResourceTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceTable.d.ts","sourceRoot":"","sources":["../../../src/components/resources/ResourceTable.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,WAAW,EACX,WAAW,EACX,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAMzB,KAAK,kBAAkB,GAAG;IACxB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IACjC,WAAW,CAAC,EAAE;QACZ,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB,MAAM,CAAC,EAAE,OAAO,CAAC;KAClB,CAAC;IACF,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB,mEAAmE;IACnE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAC3B,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9D,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,KAAK,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IACpD,aAAa,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,QAAQ,GAAG,UAAU,CAAC,CAAC;IAChE,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC;IAC7C,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC;CAC7D,CAAC;AA+DF,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,KAAK,EACL,WAAW,EACX,OAAY,EACZ,OAAO,EACP,SAA0C,EAC1C,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,GAChB,EAAE,kBAAkB,+BA+ZpB;AAED,uCAAuC;AACvC,wBAAgB,aAAa,CAAC,KAAK,EAAE;IACnC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;CAClC,+BAEA"}

package/dist/components/resources/ResourceTable.js

@@ -0,0 +1,249 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { flexRender, getCoreRowModel, useReactTable, } from "@tanstack/react-table";
+import { ConfigForm } from "../config/ConfigForm";
+import { BulkImageUploadModal } from "./BulkImageUploadModal";
+import { ColumnVisibilityMenu } from "./ColumnVisibilityMenu";
+import { ResourceCell } from "./ResourceCell";
+import { ResourceViewModal } from "./ResourceViewModal";
+function resolveRowId(row, keys) {
+    for (const key of keys) {
+        const value = row[key];
+        if (typeof value === "string" && value.trim())
+            return value;
+        if (typeof value === "number")
+            return String(value);
+    }
+    return null;
+}
+function humanizeKey(key) {
+    return key
+        .replace(/([a-z])([A-Z])/g, "$1 $2")
+        .replace(/[_-]+/g, " ")
+        .replace(/\bcents\b/i, "")
+        .trim();
+}
+function rowTitle(row, keys) {
+    for (const key of ["name", "title", "label", ...keys]) {
+        const value = row[key];
+        if (typeof value === "string" && value.trim())
+            return value;
+    }
+    return "Record";
+}
+function readVisibility(storageKey) {
+    if (!storageKey || typeof localStorage === "undefined")
+        return {};
+    try {
+        const raw = localStorage.getItem(`vertebr:columns:${storageKey}`);
+        if (!raw)
+            return {};
+        const parsed = JSON.parse(raw);
+        if (!parsed || typeof parsed !== "object")
+            return {};
+        return parsed;
+    }
+    catch {
+        return {};
+    }
+}
+function writeVisibility(storageKey, value) {
+    if (!storageKey || typeof localStorage === "undefined")
+        return;
+    try {
+        localStorage.setItem(`vertebr:columns:${storageKey}`, JSON.stringify(value));
+    }
+    catch {
+        /* ignore quota / private mode */
+    }
+}
+function titleFromFilename(name) {
+    return name
+        .replace(/\.[^.]+$/, "")
+        .replace(/[_-]+/g, " ")
+        .replace(/\s+/g, " ")
+        .trim();
+}
+export function ResourcePanel({ schema, items, permissions, actions = {}, uploads, rowIdKeys = ["id", "slug", "uid", "email"], storageKey, onUpdate, onCreate, onDelete, onAction, onUpload, galleryUpload, onListGallery, onUploadGallery, }) {
+    const [editing, setEditing] = useState(null);
+    const [viewing, setViewing] = useState(null);
+    const [bulkOpen, setBulkOpen] = useState(false);
+    const [busyAction, setBusyAction] = useState(null);
+    const tableWrapRef = useRef(null);
+    const [tableOverflow, setTableOverflow] = useState({
+        overflow: false,
+        canLeft: false,
+        canRight: false,
+    });
+    const [columnVisibility, setColumnVisibility] = useState(() => readVisibility(storageKey));
+    const canUpdate = Boolean(permissions?.update && onUpdate);
+    const canCreate = Boolean(permissions?.create && onCreate);
+    const canDelete = Boolean(permissions?.delete && onDelete);
+    const canUpload = Boolean(uploads && onUpload && Object.keys(uploads).length);
+    const actionEntries = Object.entries(actions);
+    const fieldKeys = Object.keys(schema);
+    useEffect(() => {
+        setColumnVisibility(readVisibility(storageKey));
+    }, [storageKey]);
+    useEffect(() => {
+        writeVisibility(storageKey, columnVisibility);
+    }, [storageKey, columnVisibility]);
+    const updateTableOverflow = useCallback(() => {
+        const el = tableWrapRef.current;
+        if (!el) {
+            setTableOverflow({ overflow: false, canLeft: false, canRight: false });
+            return;
+        }
+        const overflow = el.scrollWidth > el.clientWidth + 2;
+        setTableOverflow({
+            overflow,
+            canLeft: overflow && el.scrollLeft > 2,
+            canRight: overflow && el.scrollLeft + el.clientWidth < el.scrollWidth - 2,
+        });
+    }, []);
+    useEffect(() => {
+        const el = tableWrapRef.current;
+        if (!el)
+            return;
+        updateTableOverflow();
+        const onScroll = () => updateTableOverflow();
+        el.addEventListener("scroll", onScroll, { passive: true });
+        const observer = new ResizeObserver(updateTableOverflow);
+        observer.observe(el);
+        return () => {
+            el.removeEventListener("scroll", onScroll);
+            observer.disconnect();
+        };
+    }, [updateTableOverflow, items.length, columnVisibility]);
+    const scrollTable = (direction) => {
+        const el = tableWrapRef.current;
+        if (!el)
+            return;
+        const amount = Math.max(220, Math.round(el.clientWidth * 0.55));
+        el.scrollBy({
+            left: direction === "left" ? -amount : amount,
+            behavior: "smooth",
+        });
+    };
+    const columnOptions = useMemo(() => fieldKeys.map((key) => ({
+        id: key,
+        label: schema[key]?.label ?? humanizeKey(key),
+    })), [fieldKeys, schema]);
+    const columns = useMemo(() => {
+        const defs = fieldKeys.length === 0
+            ? [
+                {
+                    id: "raw",
+                    header: "Item",
+                    cell: ({ row }) => (_jsx(ResourceCell, { fieldKey: "raw", value: row.original })),
+                },
+            ]
+            : fieldKeys.map((key) => {
+                const field = schema[key];
+                const isImage = /(image|img|photo|avatar|thumbnail|thumb|cover)/i.test(key) ||
+                    /(image|img|photo)/i.test(field?.label ?? "");
+                return {
+                    id: key,
+                    accessorKey: key,
+                    header: field?.label ?? humanizeKey(key),
+                    meta: { fieldKey: key, field },
+                    cell: ({ getValue }) => (_jsx(ResourceCell, { fieldKey: key, field: field, value: getValue() })),
+                    size: isImage ? 220 : undefined,
+                };
+            });
+        defs.push({
+            id: "_actions",
+            header: () => _jsx("span", { className: "vertebr-sr-only", children: "Actions" }),
+            enableHiding: false,
+            cell: ({ row }) => {
+                const rowId = resolveRowId(row.original, rowIdKeys);
+                return (_jsxs("div", { className: "vertebr-row-actions", onClick: (event) => event.stopPropagation(), onKeyDown: (event) => event.stopPropagation(), children: [_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet", onClick: () => setViewing(row.original), children: "View" }), canUpdate ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet", onClick: () => setEditing(row.original), children: "Edit" })) : null, rowId
+                            ? actionEntries.map(([actionId, meta]) => (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet", disabled: busyAction === `${rowId}:${actionId}`, onClick: () => {
+                                    if (!onAction)
+                                        return;
+                                    setBusyAction(`${rowId}:${actionId}`);
+                                    void onAction(rowId, actionId).finally(() => setBusyAction(null));
+                                }, children: meta.label }, actionId)))
+                            : null, canDelete && rowId ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-btn-danger-quiet", onClick: () => {
+                                if (window.confirm("Delete this row? This cannot be undone.")) {
+                                    void onDelete?.(rowId);
+                                }
+                            }, children: "Delete" })) : null] }));
+            },
+        });
+        return defs;
+    }, [
+        schema,
+        fieldKeys,
+        canUpdate,
+        canDelete,
+        actionEntries,
+        busyAction,
+        onAction,
+        onDelete,
+        rowIdKeys,
+    ]);
+    const table = useReactTable({
+        data: items,
+        columns,
+        state: { columnVisibility },
+        onColumnVisibilityChange: setColumnVisibility,
+        getCoreRowModel: getCoreRowModel(),
+    });
+    const editingId = editing ? resolveRowId(editing, rowIdKeys) : null;
+    if (editing && editingId && onUpdate) {
+        const editableSchema = Object.fromEntries(Object.entries(schema).filter(([, field]) => !field.readOnly));
+        const title = rowTitle(editing, rowIdKeys);
+        return (_jsxs("div", { className: "vertebr-resource-edit", children: [_jsxs("div", { className: "vertebr-resource-edit-head", children: [_jsxs("div", { className: "vertebr-resource-edit-heading", children: [_jsx("p", { className: "vertebr-resource-edit-eyebrow", children: "Editing record" }), _jsx("h2", { children: title }), _jsx("p", { className: "vertebr-resource-edit-id", children: editingId })] }), _jsx("button", { type: "button", className: "vertebr-btn", onClick: () => setEditing(null), children: "Back" })] }), _jsx(ConfigForm, { variant: "record", schema: editableSchema, value: editing, uploads: uploads, onUpload: onUpload, galleryUpload: galleryUpload, onListGallery: onListGallery, onUploadGallery: onUploadGallery, onSave: async (next) => {
+                        await onUpdate(editingId, next);
+                        setEditing(null);
+                    } })] }));
+    }
+    const toolbar = (_jsxs("div", { className: "vertebr-table-toolbar", children: [_jsxs("div", { className: "vertebr-table-toolbar-start", children: [columnOptions.length > 0 ? (_jsx(ColumnVisibilityMenu, { columns: columnOptions, visibility: columnVisibility, onChange: setColumnVisibility })) : null, canUpload ? (_jsxs("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-btn-icon", onClick: () => setBulkOpen(true), children: [_jsx(ImageUploadIcon, {}), "Bulk upload"] })) : null] }), tableOverflow.overflow ? (_jsxs("div", { className: "vertebr-table-scroll-controls", role: "group", "aria-label": "Scroll columns", children: [_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-btn-icon vertebr-table-scroll-btn", disabled: !tableOverflow.canLeft, onClick: () => scrollTable("left"), "aria-label": "Scroll columns left", children: _jsx(ChevronLeftIcon, {}) }), _jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-btn-icon vertebr-table-scroll-btn", disabled: !tableOverflow.canRight, onClick: () => scrollTable("right"), "aria-label": "Scroll columns right", children: _jsx(ChevronRightIcon, {}) })] })) : null] }));
+    const bulkModal = bulkOpen && uploads && onUpload ? (_jsx(BulkImageUploadModal, { uploads: uploads, canCreate: canCreate, fieldLabels: Object.fromEntries(Object.keys(uploads).map((key) => [
+            key,
+            schema[key]?.label ?? humanizeKey(key),
+        ])), onClose: () => setBulkOpen(false), onUpload: onUpload, onCreateFromUploads: canCreate && onCreate
+            ? async (field, files) => {
+                for (const file of files) {
+                    const name = titleFromFilename(file.name ?? "Image");
+                    await onCreate({
+                        [field]: file.url,
+                        name,
+                        title: name,
+                    });
+                }
+            }
+            : undefined })) : null;
+    if (items.length === 0) {
+        return (_jsxs("div", { className: "vertebr-resource-body", children: [_jsxs("div", { className: "vertebr-panel-head", children: [_jsx("h2", { children: "Records" }), _jsx("span", { className: "vertebr-count", children: "0" })] }), canUpload || columnOptions.length > 0 ? toolbar : null, _jsx("div", { className: "vertebr-empty", children: "No rows yet." }), bulkModal] }));
+    }
+    return (_jsxs("div", { className: "vertebr-resource-body", children: [_jsxs("div", { className: "vertebr-panel-head", children: [_jsx("h2", { children: "Records" }), _jsx("span", { className: "vertebr-count", children: items.length })] }), toolbar, _jsx("div", { className: "vertebr-table-wrap", ref: tableWrapRef, "data-overflow": tableOverflow.overflow ? "true" : undefined, "data-overflow-left": tableOverflow.canLeft ? "true" : undefined, "data-overflow-right": tableOverflow.canRight ? "true" : undefined, children: _jsxs("table", { className: "vertebr-table", children: [_jsx("thead", { children: table.getHeaderGroups().map((headerGroup) => (_jsx("tr", { children: headerGroup.headers.map((header) => (_jsx("th", { className: header.column.id === "_actions"
+                                        ? "vertebr-col-actions"
+                                        : undefined, children: header.isPlaceholder
+                                        ? null
+                                        : flexRender(header.column.columnDef.header, header.getContext()) }, header.id))) }, headerGroup.id))) }), _jsx("tbody", { children: table.getRowModel().rows.map((row) => (_jsx("tr", { className: "vertebr-table-row-clickable", tabIndex: 0, onClick: () => setViewing(row.original), onKeyDown: (event) => {
+                                    if (event.key === "Enter" || event.key === " ") {
+                                        event.preventDefault();
+                                        setViewing(row.original);
+                                    }
+                                }, children: row.getVisibleCells().map((cell) => (_jsx("td", { className: cell.column.id === "_actions"
+                                        ? "vertebr-col-actions"
+                                        : undefined, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id))) })] }) }), viewing ? (_jsx(ResourceViewModal, { schema: schema, row: viewing, title: rowTitle(viewing, rowIdKeys), canEdit: canUpdate, onClose: () => setViewing(null), onEdit: () => {
+                    setEditing(viewing);
+                    setViewing(null);
+                } })) : null, bulkModal] }));
+}
+/** @deprecated Prefer ResourcePanel */
+export function ResourceTable(props) {
+    return _jsx(ResourcePanel, { ...props });
+}
+function ChevronLeftIcon() {
+    return (_jsx("svg", { className: "vertebr-btn-glyph", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: _jsx("path", { d: "m15 18-6-6 6-6" }) }));
+}
+function ChevronRightIcon() {
+    return (_jsx("svg", { className: "vertebr-btn-glyph", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: _jsx("path", { d: "m9 18 6-6-6-6" }) }));
+}
+function ImageUploadIcon() {
+    return (_jsxs("svg", { className: "vertebr-btn-glyph", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("path", { d: "M16 5h6" }), _jsx("path", { d: "M19 2v6" }), _jsx("rect", { x: "3", y: "7", width: "14", height: "14", rx: "2" }), _jsx("circle", { cx: "8.5", cy: "12.5", r: "1.5" }), _jsx("path", { d: "m17 21-4.5-4.5L7 21" })] }));
+}

package/dist/components/resources/ResourceViewModal.d.ts

@@ -0,0 +1,11 @@
+import type { FieldSchema } from "@vertebr/client";
+export type ResourceViewModalProps = {
+    schema: Record<string, FieldSchema>;
+    row: Record<string, unknown>;
+    title: string;
+    canEdit?: boolean;
+    onClose: () => void;
+    onEdit?: () => void;
+};
+export declare function ResourceViewModal({ schema, row, title, canEdit, onClose, onEdit, }: ResourceViewModalProps): import("react").JSX.Element;
+//# sourceMappingURL=ResourceViewModal.d.ts.map

package/dist/components/resources/ResourceViewModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceViewModal.d.ts","sourceRoot":"","sources":["../../../src/components/resources/ResourceViewModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,MAAM,MAAM,sBAAsB,GAAG;IACnC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IACpC,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AA4BF,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,GAAG,EACH,KAAK,EACL,OAAO,EACP,OAAO,EACP,MAAM,GACP,EAAE,sBAAsB,+BAsFxB"}

package/dist/components/resources/ResourceViewModal.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { ResourceCell } from "./ResourceCell";
+function humanizeKey(key) {
+    return key
+        .replace(/([a-z])([A-Z])/g, "$1 $2")
+        .replace(/[_-]+/g, " ")
+        .replace(/\bcents\b/i, "")
+        .trim();
+}
+function findHeroImage(schema, row) {
+    for (const [key, value] of Object.entries(row)) {
+        if (typeof value !== "string" || !/^https?:\/\//i.test(value))
+            continue;
+        const field = schema[key];
+        if (/(image|img|photo|avatar|thumbnail|thumb|cover)/i.test(key) ||
+            /(image|img|photo)/i.test(field?.label ?? "") ||
+            /(image|img|media|cdn|photo)/i.test(value)) {
+            return value;
+        }
+    }
+    return null;
+}
+export function ResourceViewModal({ schema, row, title, canEdit, onClose, onEdit, }) {
+    const fields = Object.keys(schema);
+    const entries = fields.length > 0
+        ? fields.map((key) => [key, row[key]])
+        : Object.entries(row);
+    const hero = findHeroImage(schema, row);
+    useEffect(() => {
+        const onKeyDown = (event) => {
+            if (event.key === "Escape")
+                onClose();
+        };
+        window.addEventListener("keydown", onKeyDown);
+        const previous = document.body.style.overflow;
+        document.body.style.overflow = "hidden";
+        return () => {
+            window.removeEventListener("keydown", onKeyDown);
+            document.body.style.overflow = previous;
+        };
+    }, [onClose]);
+    return (_jsx("div", { className: "vertebr-modal-backdrop", role: "presentation", onClick: onClose, children: _jsxs("div", { className: "vertebr-modal", role: "dialog", "aria-modal": "true", "aria-label": title, onClick: (event) => event.stopPropagation(), children: [_jsxs("header", { className: "vertebr-modal-head", children: [_jsxs("div", { className: "vertebr-modal-heading", children: [_jsx("p", { className: "vertebr-modal-eyebrow", children: "Record" }), _jsx("h2", { children: title })] }), _jsxs("div", { className: "vertebr-modal-actions", children: [canEdit && onEdit ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-primary", onClick: onEdit, children: "Edit" })) : null, _jsx("button", { type: "button", className: "vertebr-btn", onClick: onClose, "aria-label": "Close", children: "Close" })] })] }), _jsxs("div", { className: "vertebr-modal-body", children: [hero ? (_jsx("div", { className: "vertebr-modal-hero", children: _jsx("img", { src: hero, alt: "" }) })) : null, _jsx("dl", { className: "vertebr-modal-fields", children: entries.map(([key, value]) => (_jsxs("div", { className: "vertebr-modal-field", children: [_jsx("dt", { children: schema[key]?.label ?? humanizeKey(key) }), _jsx("dd", { children: _jsx(ResourceCell, { fieldKey: key, field: schema[key], value: value, variant: "detail" }) })] }, key))) })] })] }) }));
+}

package/dist/components/theme/ThemeToggle.d.ts

@@ -0,0 +1,7 @@
+import type { VbTheme } from "../../hooks/useVertebrTheme";
+export type ThemeToggleProps = {
+    theme: VbTheme;
+    onChange: (theme: VbTheme) => void;
+};
+export declare function ThemeToggle({ theme, onChange }: ThemeToggleProps): import("react").JSX.Element;
+//# sourceMappingURL=ThemeToggle.d.ts.map

package/dist/components/theme/ThemeToggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeToggle.d.ts","sourceRoot":"","sources":["../../../src/components/theme/ThemeToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AAE3D,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,gBAAgB,+BAgChE"}

package/dist/components/theme/ThemeToggle.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function ThemeToggle({ theme, onChange }) {
+    return (_jsxs("div", { className: "vertebr-theme", children: [_jsx("div", { className: "vertebr-nav-label", children: "Appearance" }), _jsxs("div", { className: "vertebr-theme-toggle", role: "group", "aria-label": "Color theme", children: [_jsxs("button", { type: "button", className: "vertebr-theme-option", "data-active": theme === "light", "aria-pressed": theme === "light", onClick: () => onChange("light"), children: [_jsx(ThemeSunIcon, {}), "Light"] }), _jsxs("button", { type: "button", className: "vertebr-theme-option", "data-active": theme === "dark", "aria-pressed": theme === "dark", onClick: () => onChange("dark"), children: [_jsx(ThemeMoonIcon, {}), "Dark"] })] })] }));
+}
+function ThemeSunIcon() {
+    return (_jsxs("svg", { className: "vertebr-theme-icon", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("circle", { cx: "12", cy: "12", r: "4" }), _jsx("path", { d: "M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41" })] }));
+}
+function ThemeMoonIcon() {
+    return (_jsx("svg", { className: "vertebr-theme-icon", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: _jsx("path", { d: "M21 14.5A8.5 8.5 0 0 1 9.5 3 7 7 0 1 0 21 14.5z" }) }));
+}

package/dist/hooks/index.d.ts

@@ -0,0 +1,5 @@
+export { useVertebrTheme } from "./useVertebrTheme";
+export type { VbTheme } from "./useVertebrTheme";
+export { VertebrControlsProvider, useVertebrConfig, useVertebrControls, } from "./useVertebrControls";
+export type { VertebrControlsProviderProps } from "./useVertebrControls";
+//# sourceMappingURL=index.d.ts.map

package/dist/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,kBAAkB,GACnB,MAAM,sBAAsB,CAAC;AAC9B,YAAY,EAAE,4BAA4B,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/hooks/index.js

@@ -0,0 +1,2 @@
+export { useVertebrTheme } from "./useVertebrTheme";
+export { VertebrControlsProvider, useVertebrConfig, useVertebrControls, } from "./useVertebrControls";

package/dist/{useVertebrControls.d.ts → hooks/useVertebrControls.d.ts}

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-export type VertebrControlsMap = Record<string, Record<string, unknown>>;
+import { type VertebrControlsMap } from "@vertebr/client";
 type ControlsContextValue = {
     environment: string;
     controls: VertebrControlsMap;
@@ -14,6 +14,7 @@ export type VertebrControlsProviderProps = {
     environment: string;
     children: ReactNode;
 };
+export type { VertebrControlsMap };
 /**
  * Loads all public Vertebr controls for the storefront once and shares them.
  */
@@ -30,5 +31,4 @@ export declare function useVertebrConfig<T extends Record<string, unknown>>(id:
 };
 /** Access the full public controls map (for gates like comingSoon). */
 export declare function useVertebrControls(): ControlsContextValue;
-export {};
 //# sourceMappingURL=useVertebrControls.d.ts.map

package/dist/hooks/useVertebrControls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVertebrControls.d.ts","sourceRoot":"","sources":["../../src/hooks/useVertebrControls.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EAAuB,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE/E,KAAK,oBAAoB,GAAG;IAC1B,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAAC;AAIF,MAAM,MAAM,4BAA4B,GAAG;IACzC,2CAA2C;IAC3C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,kDAAkD;IAClD,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,YAAY,EAAE,kBAAkB,EAAE,CAAC;AAEnC;;GAEG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,OAAsB,EACtB,WAAW,EACX,QAAQ,GACT,EAAE,4BAA4B,+BAyC9B;AAYD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAChE,EAAE,EAAE,MAAM,EACV,QAAQ,EAAE,CAAC,GACV;IACD,IAAI,EAAE,CAAC,CAAC;IACR,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAMA;AAED,uEAAuE;AACvE,wBAAgB,kBAAkB,IAAI,oBAAoB,CAEzD"}

package/dist/{useVertebrControls.js → hooks/useVertebrControls.js}

@@ -1,22 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext, useCallback, useContext, useEffect, useMemo, useState, } from "react";
-import { VERTEBR_ENV_HEADER } from "./client";
+import { createVertebrClient } from "@vertebr/client";
 const ControlsContext = createContext(null);
-async function fetchPublicControls(apiBase, environment) {
-    const base = apiBase.replace(/\/$/, "");
-    const response = await fetch(`${base}/public/controls`, {
-        headers: {
-            Accept: "application/json",
-            [VERTEBR_ENV_HEADER]: environment,
-        },
-    });
-    if (!response.ok) {
-        const text = await response.text();
-        throw new Error(text || `Failed to load controls (${response.status})`);
-    }
-    const body = (await response.json());
-    return body.configs ?? {};
-}
 /**
  * Loads all public Vertebr controls for the storefront once and shares them.
  */
@@ -24,11 +9,15 @@ export function VertebrControlsProvider({ apiBase = "/admin/api", environment, c
     const [controls, setControls] = useState({});
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(null);
-    const refresh = useCallback(async () => {
+    const client = useMemo(() => createVertebrClient({
+        apiBase,
+        getEnvironment: () => environment,
+    }), [apiBase, environment]);
+    const load = useCallback(async (opts) => {
         setLoading(true);
         setError(null);
         try {
-            const next = await fetchPublicControls(apiBase, environment);
+            const next = await client.getPublicControls(opts);
             setControls(next);
         }
         catch (err) {
@@ -37,10 +26,11 @@ export function VertebrControlsProvider({ apiBase = "/admin/api", environment, c
         finally {
             setLoading(false);
         }
-    }, [apiBase, environment]);
+    }, [client]);
+    const refresh = useCallback(() => load({ fresh: true }), [load]);
     useEffect(() => {
-        void refresh();
-    }, [refresh]);
+        void load();
+    }, [load]);
     const value = useMemo(() => ({ environment, controls, loading, error, refresh }), [environment, controls, loading, error, refresh]);
     return (_jsx(ControlsContext.Provider, { value: value, children: children }));
 }

package/dist/hooks/useVertebrTheme.d.ts

@@ -0,0 +1,7 @@
+export type VbTheme = "light" | "dark";
+export declare function useVertebrTheme(storageKey?: string): {
+    theme: VbTheme;
+    setTheme: (next: VbTheme) => void;
+    toggleTheme: () => void;
+};
+//# sourceMappingURL=useVertebrTheme.d.ts.map

package/dist/hooks/useVertebrTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVertebrTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useVertebrTheme.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AA0BvC,wBAAgB,eAAe,CAAC,UAAU,SAAsB;;qBAU1B,OAAO;;EAS5C"}

package/dist/hooks/useVertebrTheme.js

@@ -0,0 +1,38 @@
+import { useCallback, useEffect, useState } from "react";
+const DEFAULT_STORAGE_KEY = "vertebr:theme";
+function readStoredTheme(key) {
+    try {
+        const value = localStorage.getItem(key);
+        if (value === "light" || value === "dark")
+            return value;
+    }
+    catch {
+        // ignore
+    }
+    return null;
+}
+function writeStoredTheme(key, theme) {
+    try {
+        localStorage.setItem(key, theme);
+    }
+    catch {
+        // ignore
+    }
+}
+function applyTheme(theme) {
+    document.documentElement.setAttribute("data-vb-theme", theme);
+}
+export function useVertebrTheme(storageKey = DEFAULT_STORAGE_KEY) {
+    const [theme, setThemeState] = useState(() => readStoredTheme(storageKey) ?? "dark");
+    useEffect(() => {
+        applyTheme(theme);
+        writeStoredTheme(storageKey, theme);
+    }, [theme, storageKey]);
+    const setTheme = useCallback((next) => {
+        setThemeState(next);
+    }, []);
+    const toggleTheme = useCallback(() => {
+        setThemeState((current) => (current === "dark" ? "light" : "dark"));
+    }, []);
+    return { theme, setTheme, toggleTheme };
+}

package/dist/index.d.ts

@@ -1,11 +1,21 @@
-export { VertebrAdmin } from "./VertebrAdmin";
-export type { VertebrAdminProps } from "./VertebrAdmin";
-export { createVertebrClient } from "./client";
-export type { VertebrClient } from "./client";
-export { MetricsBoard } from "./MetricsBoard";
-export { ResourcePanel, ResourceTable } from "./ResourceTable";
-export { VertebrControlsProvider, useVertebrConfig, useVertebrControls, } from "./useVertebrControls";
-export type { VertebrControlsProviderProps, VertebrControlsMap, } from "./useVertebrControls";
-export type { AdminEnvironment, BootstrapResponse, CatalogResponse, CatalogResource, CatalogConfig, EnvironmentAuthPublic, FieldSchema, FieldType, MetricCard, MetricsResponse, ResourceListResponse, ResourceActionMeta, ConfigResponse, } from "./types";
-export { VERTEBR_ENV_HEADER } from "./client";
+export { VertebrAdmin } from "./components/admin/VertebrAdmin";
+export type { VertebrAdminProps } from "./components/admin/VertebrAdmin";
+export { MetricsBoard } from "./components/metrics/MetricsBoard";
+export { GalleryBoard } from "./components/gallery/GalleryBoard";
+export { ResourcePanel, ResourceTable } from "./components/resources/ResourceTable";
+export { ThemeToggle } from "./components/theme/ThemeToggle";
+export type { ThemeToggleProps } from "./components/theme/ThemeToggle";
+export { ConfigForm } from "./components/config/ConfigForm";
+export { formatPrice, formatPriceInput, parsePriceInput, isCentsField, isPriceField, } from "./lib/price";
+export { isDescriptionField, descriptionStats, applyMarkdown, } from "./lib/description";
+export type { MarkdownCommand, MarkdownEdit } from "./lib/description";
+export { EnvSelect } from "./components/env/EnvSelect";
+export { useVertebrTheme } from "./hooks/useVertebrTheme";
+export type { VbTheme } from "./hooks/useVertebrTheme";
+export { VertebrControlsProvider, useVertebrConfig, useVertebrControls, } from "./hooks/useVertebrControls";
+export type { VertebrControlsProviderProps } from "./hooks/useVertebrControls";
+export { createVertebrClient, VERTEBR_ENV_HEADER, renderMarkdown, } from "@vertebr/client";
+export { VertebrMarkdown } from "@vertebr/client/react";
+export type { VertebrMarkdownProps } from "@vertebr/client/react";
+export type { VertebrClient, VertebrClientOptions, VertebrReadOptions, AdminEnvironment, BootstrapResponse, CatalogResponse, CatalogResource, CatalogConfig, CatalogConfigSection, EnvironmentAuthPublic, FieldSchema, FieldType, GalleryItem, GalleryMeta, GalleryResponse, MetricCard, MetricsResponse, ResourceListResponse, ResourceActionMeta, ResourceUploadMeta, ResourceUploadResponse, ResourceBulkUploadResponse, ConfigResponse, VertebrControlsMap, } from "@vertebr/client";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAC/C,YAAY,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,kBAAkB,GACnB,MAAM,sBAAsB,CAAC;AAC9B,YAAY,EACV,4BAA4B,EAC5B,kBAAkB,GACnB,MAAM,sBAAsB,CAAC;AAC9B,YAAY,EACV,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,aAAa,EACb,qBAAqB,EACrB,WAAW,EACX,SAAS,EACT,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,kBAAkB,EAClB,cAAc,GACf,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,YAAY,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AACpF,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,YAAY,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,YAAY,EACZ,YAAY,GACb,MAAM,aAAa,CAAC;AACrB,OAAO,EACL,kBAAkB,EAClB,gBAAgB,EAChB,aAAa,GACd,MAAM,mBAAmB,CAAC;AAC3B,YAAY,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,YAAY,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,kBAAkB,GACnB,MAAM,4BAA4B,CAAC;AACpC,YAAY,EAAE,4BAA4B,EAAE,MAAM,4BAA4B,CAAC;AAG/E,OAAO,EACL,mBAAmB,EACnB,kBAAkB,EAClB,cAAc,GACf,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,YAAY,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,YAAY,EACV,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,aAAa,EACb,oBAAoB,EACpB,qBAAqB,EACrB,WAAW,EACX,SAAS,EACT,WAAW,EACX,WAAW,EACX,eAAe,EACf,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,sBAAsB,EACtB,0BAA0B,EAC1B,cAAc,EACd,kBAAkB,GACnB,MAAM,iBAAiB,CAAC"}

package/dist/index.js

@@ -1,6 +1,14 @@
-export { VertebrAdmin } from "./VertebrAdmin";
-export { createVertebrClient } from "./client";
-export { MetricsBoard } from "./MetricsBoard";
-export { ResourcePanel, ResourceTable } from "./ResourceTable";
-export { VertebrControlsProvider, useVertebrConfig, useVertebrControls, } from "./useVertebrControls";
-export { VERTEBR_ENV_HEADER } from "./client";
+export { VertebrAdmin } from "./components/admin/VertebrAdmin";
+export { MetricsBoard } from "./components/metrics/MetricsBoard";
+export { GalleryBoard } from "./components/gallery/GalleryBoard";
+export { ResourcePanel, ResourceTable } from "./components/resources/ResourceTable";
+export { ThemeToggle } from "./components/theme/ThemeToggle";
+export { ConfigForm } from "./components/config/ConfigForm";
+export { formatPrice, formatPriceInput, parsePriceInput, isCentsField, isPriceField, } from "./lib/price";
+export { isDescriptionField, descriptionStats, applyMarkdown, } from "./lib/description";
+export { EnvSelect } from "./components/env/EnvSelect";
+export { useVertebrTheme } from "./hooks/useVertebrTheme";
+export { VertebrControlsProvider, useVertebrConfig, useVertebrControls, } from "./hooks/useVertebrControls";
+// Re-export the framework-agnostic client for convenience.
+export { createVertebrClient, VERTEBR_ENV_HEADER, renderMarkdown, } from "@vertebr/client";
+export { VertebrMarkdown } from "@vertebr/client/react";

package/dist/lib/description.d.ts

@@ -0,0 +1,18 @@
+import type { FieldSchema } from "@vertebr/client";
+export declare function isDescriptionField(key: string, field?: Pick<FieldSchema, "label" | "type">): boolean;
+export declare function descriptionStats(value: unknown): {
+    characters: number;
+    words: number;
+};
+export type MarkdownCommand = "bold" | "italic" | "heading" | "ul" | "ol" | "link";
+export type MarkdownEdit = {
+    next: string;
+    inserted: string;
+    replaceStart: number;
+    replaceEnd: number;
+    selectionStart: number;
+    selectionEnd: number;
+};
+/** Apply a markdown format command around the current selection. */
+export declare function applyMarkdown(text: string, start: number, end: number, command: MarkdownCommand): MarkdownEdit;
+//# sourceMappingURL=description.d.ts.map

package/dist/lib/description.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"description.d.ts","sourceRoot":"","sources":["../../src/lib/description.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAKnD,wBAAgB,kBAAkB,CAChC,GAAG,EAAE,MAAM,EACX,KAAK,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,MAAM,CAAC,GAC1C,OAAO,CAIT;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,GAAG;IAChD,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf,CAOA;AAED,MAAM,MAAM,eAAe,GACvB,MAAM,GACN,QAAQ,GACR,SAAS,GACT,IAAI,GACJ,IAAI,GACJ,MAAM,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AA8CF,oEAAoE;AACpE,wBAAgB,aAAa,CAC3B,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,eAAe,GACvB,YAAY,CAsCd"}