@vertebr/react 0.18.0 → 0.19.0

package/dist/components/table/TableFilters.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef, useState } from "react";
+import { clearTableFilters, hasActiveFilters, setFilterValue, } from "./filterModel";
+import { ColumnVisibilityMenu, } from "../resources/ColumnVisibilityMenu";
+/**
+ * Host-declared filter chips (+ optional Columns chip).
+ * Selected values stay checked in each dropdown.
+ */
+export function TableFilters({ columns, selected, onChange, columnVisibility, }) {
+    const hasFieldFilters = columns.length > 0;
+    const hasColumns = Boolean(columnVisibility?.columns.length);
+    if (!hasFieldFilters && !hasColumns)
+        return null;
+    const active = hasActiveFilters(selected);
+    return (_jsxs("div", { className: "vertebr-table-filters", role: "group", "aria-label": "Filters", children: [columns.map((column) => (_jsx(TableFilterControl, { column: column, values: selected[column.id] ?? [], onToggle: (value) => onChange(setFilterValue(selected, column.id, value, column.multiselect)) }, column.id))), columnVisibility ? (_jsx(ColumnVisibilityMenu, { columns: columnVisibility.columns, visibility: columnVisibility.visibility, onChange: columnVisibility.onChange })) : null, active ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-table-filter-clear", onClick: () => onChange(clearTableFilters()), children: "Clear filters" })) : null] }));
+}
+function TableFilterControl({ column, values, onToggle, }) {
+    const listId = useId();
+    const rootRef = useRef(null);
+    const [open, setOpen] = useState(false);
+    const selected = new Set(values);
+    const count = values.length;
+    const filtering = count > 0;
+    useEffect(() => {
+        if (!open)
+            return;
+        const onPointer = (event) => {
+            if (!rootRef.current?.contains(event.target))
+                setOpen(false);
+        };
+        const onKey = (event) => {
+            if (event.key === "Escape")
+                setOpen(false);
+        };
+        window.addEventListener("mousedown", onPointer);
+        window.addEventListener("keydown", onKey);
+        return () => {
+            window.removeEventListener("mousedown", onPointer);
+            window.removeEventListener("keydown", onKey);
+        };
+    }, [open]);
+    return (_jsxs("div", { className: "vertebr-table-filter-control", ref: rootRef, "data-open": open ? "true" : undefined, "data-active": filtering ? "true" : undefined, "data-multiselect": column.multiselect ? "true" : "false", children: [_jsxs("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-table-filter-trigger", "aria-expanded": open, "aria-controls": listId, "aria-label": filtering
+                    ? `${column.label}, ${count} selected`
+                    : column.label, onClick: () => setOpen((next) => !next), children: [column.label, filtering ? (_jsx("span", { className: "vertebr-table-filter-count", children: count })) : null] }), open ? (_jsxs("div", { className: "vertebr-table-filter-menu", id: listId, role: "listbox", "aria-multiselectable": column.multiselect, children: [_jsxs("div", { className: "vertebr-table-filter-menu-head", children: [_jsx("span", { children: column.label }), filtering ? (_jsx("button", { type: "button", className: "vertebr-link-btn", onClick: () => {
+                                    for (const value of values)
+                                        onToggle(value);
+                                }, children: "Clear" })) : null] }), _jsx("ul", { className: "vertebr-table-filter-list", children: column.options.map((option) => {
+                            const on = selected.has(option.value);
+                            return (_jsx("li", { children: _jsxs("label", { className: "vertebr-table-filter-item", children: [_jsx("input", { type: column.multiselect ? "checkbox" : "radio", name: `filter-${column.id}`, checked: on, onChange: () => {
+                                                onToggle(option.value);
+                                                if (!column.multiselect)
+                                                    setOpen(false);
+                                            } }), _jsx("span", { children: option.label })] }) }, option.value));
+                        }) })] })) : null] }));
+}

package/dist/components/table/TableSearch.d.ts

@@ -0,0 +1,11 @@
+export type TableSearchProps = {
+    value: string;
+    onChange: (value: string) => void;
+    placeholder?: string;
+    "aria-label"?: string;
+};
+/** Default search field for Vertebr table toolbars / panel heads. */
+export declare function TableSearch({ value, onChange, placeholder, "aria-label": ariaLabel, }: TableSearchProps): import("react").JSX.Element;
+/** Case-insensitive substring match over a value or nested object/array. */
+export declare function matchesTableQuery(value: unknown, query: string): boolean;
+//# sourceMappingURL=TableSearch.d.ts.map

package/dist/components/table/TableSearch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSearch.d.ts","sourceRoot":"","sources":["../../../src/components/table/TableSearch.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,qEAAqE;AACrE,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,WAAuB,EACvB,YAAY,EAAE,SAA0B,GACzC,EAAE,gBAAgB,+BAWlB;AAED,4EAA4E;AAC5E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,OAAO,CAgBxE"}

package/dist/components/table/TableSearch.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/** Default search field for Vertebr table toolbars / panel heads. */
+export function TableSearch({ value, onChange, placeholder = "Search…", "aria-label": ariaLabel = "Search table", }) {
+    return (_jsx("input", { className: "vertebr-table-search", type: "search", placeholder: placeholder, value: value, onChange: (event) => onChange(event.target.value), "aria-label": ariaLabel }));
+}
+/** Case-insensitive substring match over a value or nested object/array. */
+export function matchesTableQuery(value, query) {
+    const q = query.trim().toLowerCase();
+    if (!q)
+        return true;
+    if (value == null)
+        return false;
+    if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") {
+        return String(value).toLowerCase().includes(q);
+    }
+    if (Array.isArray(value)) {
+        return value.some((item) => matchesTableQuery(item, q));
+    }
+    if (typeof value === "object") {
+        return Object.values(value).some((item) => matchesTableQuery(item, q));
+    }
+    return String(value).toLowerCase().includes(q);
+}

package/dist/components/table/TableSkeleton.d.ts

@@ -0,0 +1,16 @@
+export type TableSkeletonColumn = {
+    id: string;
+    label: string;
+};
+export type TableSkeletonProps = {
+    columns: TableSkeletonColumn[];
+    /** Number of placeholder rows. @default 6 */
+    rows?: number;
+    className?: string;
+};
+/**
+ * Lightweight table-shaped shimmer for initial load.
+ * Prefer a small fixed row count — enough to hold layout, not a fake dataset.
+ */
+export declare function TableSkeleton({ columns, rows, className, }: TableSkeletonProps): import("react").JSX.Element | null;
+//# sourceMappingURL=TableSkeleton.d.ts.map

package/dist/components/table/TableSkeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSkeleton.d.ts","sourceRoot":"","sources":["../../../src/components/table/TableSkeleton.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,6CAA6C;IAC7C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,IAAQ,EACR,SAAS,GACV,EAAE,kBAAkB,sCAwCpB"}

package/dist/components/table/TableSkeleton.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Lightweight table-shaped shimmer for initial load.
+ * Prefer a small fixed row count — enough to hold layout, not a fake dataset.
+ */
+export function TableSkeleton({ columns, rows = 6, className, }) {
+    if (columns.length === 0)
+        return null;
+    const wrapClass = className
+        ? `vertebr-table-wrap vertebr-table-skeleton ${className}`
+        : "vertebr-table-wrap vertebr-table-skeleton";
+    return (_jsxs("div", { className: wrapClass, "aria-busy": "true", "aria-live": "polite", children: [_jsxs("table", { className: "vertebr-table", children: [_jsx("thead", { children: _jsx("tr", { children: columns.map((column, colIndex) => (_jsx("th", { "aria-label": column.label, children: _jsx("span", { className: "vertebr-table-skeleton-cell vertebr-table-skeleton-header", "data-width": headerWidth(colIndex) }) }, column.id))) }) }), _jsx("tbody", { children: Array.from({ length: rows }, (_, rowIndex) => (_jsx("tr", { children: columns.map((column, colIndex) => (_jsx("td", { children: _jsx("span", { className: "vertebr-table-skeleton-cell", "data-width": skeletonWidth(rowIndex, colIndex) }) }, column.id))) }, rowIndex))) })] }), _jsx("span", { className: "vertebr-sr-only", children: "Loading table\u2026" })] }));
+}
+function skeletonWidth(row, col) {
+    const pattern = (row + col) % 3;
+    if (pattern === 0)
+        return "sm";
+    if (pattern === 1)
+        return "md";
+    return "lg";
+}
+function headerWidth(col) {
+    const pattern = col % 3;
+    if (pattern === 0)
+        return "sm";
+    if (pattern === 1)
+        return "md";
+    return "lg";
+}

package/dist/components/table/TableWrap.d.ts

@@ -0,0 +1,23 @@
+import { type ReactNode } from "react";
+import type { TableOverflow } from "./useTableOverflow";
+export type TableWrapProps = {
+    children: ReactNode;
+    className?: string;
+    /** From `useTableOverflow` — enables scroll edges + controls. */
+    overflow: Pick<TableOverflow, "wrapRef" | "overflow" | "canLeft" | "canRight">;
+    /**
+     * When this value changes (e.g. filter/search state), play a light
+     * row transition. Pass a stable serialized key.
+     */
+    transitionKey?: string | number;
+};
+/** Default scroll container for Vertebr tables (`overflow-x` + `overflow-y`). */
+export declare function TableWrap({ children, className, overflow, transitionKey, }: TableWrapProps): import("react").JSX.Element;
+export type TableScrollControlsProps = {
+    canLeft: boolean;
+    canRight: boolean;
+    onScroll: (direction: "left" | "right") => void;
+};
+/** Left/right column scroll buttons — place in toolbars / panel heads. */
+export declare function TableScrollControls({ canLeft, canRight, onScroll, }: TableScrollControlsProps): import("react").JSX.Element;
+//# sourceMappingURL=TableWrap.d.ts.map

package/dist/components/table/TableWrap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableWrap.d.ts","sourceRoot":"","sources":["../../../src/components/table/TableWrap.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAExD,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iEAAiE;IACjE,QAAQ,EAAE,IAAI,CACZ,aAAa,EACb,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,CAChD,CAAC;IACF;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACjC,CAAC;AAEF,iFAAiF;AACjF,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,aAAa,GACd,EAAE,cAAc,+BAkChB;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CACjD,CAAC;AAEF,0EAA0E;AAC1E,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,QAAQ,EACR,QAAQ,GACT,EAAE,wBAAwB,+BA2B1B"}

package/dist/components/table/TableWrap.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState, } from "react";
+/** Default scroll container for Vertebr tables (`overflow-x` + `overflow-y`). */
+export function TableWrap({ children, className, overflow, transitionKey, }) {
+    const [transitioning, setTransitioning] = useState(false);
+    const prevKey = useRef(transitionKey);
+    const skipFirst = useRef(true);
+    useEffect(() => {
+        if (skipFirst.current) {
+            skipFirst.current = false;
+            prevKey.current = transitionKey;
+            return;
+        }
+        if (prevKey.current === transitionKey)
+            return;
+        prevKey.current = transitionKey;
+        setTransitioning(true);
+        const handle = window.setTimeout(() => setTransitioning(false), 220);
+        return () => window.clearTimeout(handle);
+    }, [transitionKey]);
+    const classes = className
+        ? `vertebr-table-wrap ${className}`
+        : "vertebr-table-wrap";
+    return (_jsx("div", { ref: overflow.wrapRef, className: classes, "data-overflow": overflow.overflow ? "true" : undefined, "data-overflow-left": overflow.canLeft ? "true" : undefined, "data-overflow-right": overflow.canRight ? "true" : undefined, "data-transition": transitioning ? "true" : undefined, children: children }));
+}
+/** Left/right column scroll buttons — place in toolbars / panel heads. */
+export function TableScrollControls({ canLeft, canRight, onScroll, }) {
+    return (_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: !canLeft, onClick: () => onScroll("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: !canRight, onClick: () => onScroll("right"), "aria-label": "Scroll columns right", children: _jsx(ChevronRightIcon, {}) })] }));
+}
+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" }) }));
+}

package/dist/components/table/filterModel.d.ts

@@ -0,0 +1,35 @@
+import type { FieldFilterConfig, FieldSchema } from "@vertebr/client";
+export type TableFilterOption = {
+    value: string;
+    label: string;
+};
+export type TableFilterColumn = {
+    id: string;
+    label: string;
+    /** @default true */
+    multiselect: boolean;
+    options: TableFilterOption[];
+};
+/** Selected filter values keyed by column id. Empty / missing = no filter. */
+export type TableFilterState = Record<string, string[]>;
+export declare function filterValueKey(value: unknown): string | null;
+export declare function filterValueLabel(value: string, optionLabels?: Record<string, string>): string;
+/**
+ * Resolve a host-declared field filter into a table filter column.
+ * Returns null when the host did not opt in or options cannot be resolved.
+ */
+export declare function resolveFieldFilter(id: string, label: string, field: FieldSchema): TableFilterColumn | null;
+/**
+ * Resolve a host-declared audit column filter.
+ * Audit has no field.options — hosts must pass `filter.options`.
+ */
+export declare function resolveAuditFilter(id: string, label: string, filter: boolean | FieldFilterConfig | undefined): TableFilterColumn | null;
+/** Row matches when every active column filter includes at least one of its values. */
+export declare function matchesTableFilters<T>(row: T, selected: TableFilterState, getters: Record<string, (row: T) => unknown>): boolean;
+export declare function setFilterValue(selected: TableFilterState, columnId: string, value: string, multiselect: boolean): TableFilterState;
+export declare function removeFilterValue(selected: TableFilterState, columnId: string, value: string): TableFilterState;
+export declare function clearTableFilters(): TableFilterState;
+export declare function hasActiveFilters(selected: TableFilterState): boolean;
+/** @deprecated Use setFilterValue */
+export declare function toggleFilterValue(selected: TableFilterState, columnId: string, value: string): TableFilterState;
+//# sourceMappingURL=filterModel.d.ts.map

package/dist/components/table/filterModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filterModel.d.ts","sourceRoot":"","sources":["../../../src/components/table/filterModel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAEtE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,oBAAoB;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,iBAAiB,EAAE,CAAC;CAC9B,CAAC;AAEF,8EAA8E;AAC9E,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;AAExD,wBAAgB,cAAc,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAO5D;AAED,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,MAAM,EACb,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GACpC,MAAM,CAKR;AAUD;;;GAGG;AACH,wBAAgB,kBAAkB,CAChC,EAAE,EAAE,MAAM,EACV,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,WAAW,GACjB,iBAAiB,GAAG,IAAI,CA6B1B;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAChC,EAAE,EAAE,MAAM,EACV,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,OAAO,GAAG,iBAAiB,GAAG,SAAS,GAC9C,iBAAiB,GAAG,IAAI,CAc1B;AAED,uFAAuF;AACvF,wBAAgB,mBAAmB,CAAC,CAAC,EACnC,GAAG,EAAE,CAAC,EACN,QAAQ,EAAE,gBAAgB,EAC1B,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,OAAO,CAAC,GAC3C,OAAO,CAmBT;AAED,wBAAgB,cAAc,CAC5B,QAAQ,EAAE,gBAAgB,EAC1B,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,OAAO,GACnB,gBAAgB,CAmBlB;AAED,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,gBAAgB,EAC1B,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,MAAM,GACZ,gBAAgB,CAOlB;AAED,wBAAgB,iBAAiB,IAAI,gBAAgB,CAEpD;AAED,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,gBAAgB,GAAG,OAAO,CAEpE;AAED,qCAAqC;AACrC,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,gBAAgB,EAC1B,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,MAAM,GACZ,gBAAgB,CAElB"}

package/dist/components/table/filterModel.js

@@ -0,0 +1,150 @@
+export function filterValueKey(value) {
+    if (value == null || value === "")
+        return null;
+    if (typeof value === "boolean")
+        return value ? "true" : "false";
+    if (typeof value === "number")
+        return String(value);
+    if (typeof value === "string")
+        return value;
+    if (Array.isArray(value))
+        return null;
+    return String(value);
+}
+export function filterValueLabel(value, optionLabels) {
+    if (optionLabels?.[value])
+        return optionLabels[value];
+    if (value === "true")
+        return "Yes";
+    if (value === "false")
+        return "No";
+    return value;
+}
+function normalizeFilterConfig(filter) {
+    if (filter == null || filter === false)
+        return null;
+    if (filter === true)
+        return {};
+    return filter;
+}
+/**
+ * Resolve a host-declared field filter into a table filter column.
+ * Returns null when the host did not opt in or options cannot be resolved.
+ */
+export function resolveFieldFilter(id, label, field) {
+    const config = normalizeFilterConfig(field.filter);
+    if (!config)
+        return null;
+    const optionLabels = {
+        ...(field.optionLabels ?? {}),
+        ...(config.optionLabels ?? {}),
+    };
+    let options = config.options?.length
+        ? config.options
+        : field.options?.length
+            ? field.options
+            : field.type === "boolean"
+                ? ["true", "false"]
+                : [];
+    options = [...new Set(options.map(String).filter(Boolean))];
+    if (options.length === 0)
+        return null;
+    return {
+        id,
+        label,
+        multiselect: config.multiselect !== false,
+        options: options.map((value) => ({
+            value,
+            label: filterValueLabel(value, optionLabels),
+        })),
+    };
+}
+/**
+ * Resolve a host-declared audit column filter.
+ * Audit has no field.options — hosts must pass `filter.options`.
+ */
+export function resolveAuditFilter(id, label, filter) {
+    const config = normalizeFilterConfig(filter);
+    if (!config)
+        return null;
+    const options = [...new Set((config.options ?? []).map(String).filter(Boolean))];
+    if (options.length === 0)
+        return null;
+    return {
+        id,
+        label,
+        multiselect: config.multiselect !== false,
+        options: options.map((value) => ({
+            value,
+            label: filterValueLabel(value, config.optionLabels),
+        })),
+    };
+}
+/** Row matches when every active column filter includes at least one of its values. */
+export function matchesTableFilters(row, selected, getters) {
+    for (const [columnId, values] of Object.entries(selected)) {
+        if (!values?.length)
+            continue;
+        const getValue = getters[columnId];
+        if (!getValue)
+            continue;
+        const raw = getValue(row);
+        const keys = new Set();
+        if (Array.isArray(raw)) {
+            for (const item of raw) {
+                const key = filterValueKey(item);
+                if (key)
+                    keys.add(key);
+            }
+        }
+        else {
+            const key = filterValueKey(raw);
+            if (key)
+                keys.add(key);
+        }
+        if (![...values].some((value) => keys.has(value)))
+            return false;
+    }
+    return true;
+}
+export function setFilterValue(selected, columnId, value, multiselect) {
+    if (!multiselect) {
+        const current = selected[columnId] ?? [];
+        if (current.length === 1 && current[0] === value) {
+            const next = { ...selected };
+            delete next[columnId];
+            return next;
+        }
+        return { ...selected, [columnId]: [value] };
+    }
+    const current = selected[columnId] ?? [];
+    const nextValues = current.includes(value)
+        ? current.filter((item) => item !== value)
+        : [...current, value];
+    const next = { ...selected };
+    if (nextValues.length === 0)
+        delete next[columnId];
+    else
+        next[columnId] = nextValues;
+    return next;
+}
+export function removeFilterValue(selected, columnId, value) {
+    const current = selected[columnId] ?? [];
+    const nextValues = current.filter((item) => item !== value);
+    const next = { ...selected };
+    if (nextValues.length === 0)
+        delete next[columnId];
+    else
+        next[columnId] = nextValues;
+    return next;
+}
+export function clearTableFilters() {
+    return {};
+}
+export function hasActiveFilters(selected) {
+    return Object.values(selected).some((values) => values.length > 0);
+}
+/** @deprecated Use setFilterValue */
+export function toggleFilterValue(selected, columnId, value) {
+    return setFilterValue(selected, columnId, value, true);
+}

package/dist/components/table/index.d.ts

@@ -0,0 +1,13 @@
+export { TableSkeleton } from "./TableSkeleton";
+export type { TableSkeletonColumn, TableSkeletonProps } from "./TableSkeleton";
+export { useTableOverflow } from "./useTableOverflow";
+export type { TableOverflow, TableOverflowState } from "./useTableOverflow";
+export { TableWrap, TableScrollControls } from "./TableWrap";
+export type { TableWrapProps, TableScrollControlsProps } from "./TableWrap";
+export { TableSearch, matchesTableQuery } from "./TableSearch";
+export type { TableSearchProps } from "./TableSearch";
+export { TableFilters } from "./TableFilters";
+export type { TableFiltersProps, TableColumnVisibilityProps, } from "./TableFilters";
+export { clearTableFilters, filterValueKey, filterValueLabel, hasActiveFilters, matchesTableFilters, removeFilterValue, resolveAuditFilter, resolveFieldFilter, setFilterValue, toggleFilterValue, } from "./filterModel";
+export type { TableFilterColumn, TableFilterOption, TableFilterState, } from "./filterModel";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/table/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC/E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAC7D,YAAY,EAAE,cAAc,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAC5E,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAC/D,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EACV,iBAAiB,EACjB,0BAA0B,GAC3B,MAAM,gBAAgB,CAAC;AACxB,OAAO,EACL,iBAAiB,EACjB,cAAc,EACd,gBAAgB,EAChB,gBAAgB,EAChB,mBAAmB,EACnB,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,eAAe,CAAC"}

package/dist/components/table/index.js

@@ -0,0 +1,6 @@
+export { TableSkeleton } from "./TableSkeleton";
+export { useTableOverflow } from "./useTableOverflow";
+export { TableWrap, TableScrollControls } from "./TableWrap";
+export { TableSearch, matchesTableQuery } from "./TableSearch";
+export { TableFilters } from "./TableFilters";
+export { clearTableFilters, filterValueKey, filterValueLabel, hasActiveFilters, matchesTableFilters, removeFilterValue, resolveAuditFilter, resolveFieldFilter, setFilterValue, toggleFilterValue, } from "./filterModel";

package/dist/components/table/useTableOverflow.d.ts

@@ -0,0 +1,17 @@
+import { type RefObject } from "react";
+export type TableOverflowState = {
+    overflow: boolean;
+    canLeft: boolean;
+    canRight: boolean;
+};
+export type TableOverflow = TableOverflowState & {
+    wrapRef: RefObject<HTMLDivElement | null>;
+    scrollBy: (direction: "left" | "right") => void;
+    update: () => void;
+};
+/**
+ * Default horizontal overflow tracking for `.vertebr-table-wrap`.
+ * Pass `observeKey` (e.g. row count) so layout is remeasured when content changes.
+ */
+export declare function useTableOverflow(observeKey?: unknown): TableOverflow;
+//# sourceMappingURL=useTableOverflow.d.ts.map

package/dist/components/table/useTableOverflow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableOverflow.d.ts","sourceRoot":"","sources":["../../../src/components/table/useTableOverflow.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,kBAAkB,GAAG;IAC/C,OAAO,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC1C,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;IAChD,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEF;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,UAAU,CAAC,EAAE,OAAO,GAAG,aAAa,CAiDpE"}

package/dist/components/table/useTableOverflow.js

@@ -0,0 +1,54 @@
+import { useCallback, useEffect, useRef, useState, } from "react";
+/**
+ * Default horizontal overflow tracking for `.vertebr-table-wrap`.
+ * Pass `observeKey` (e.g. row count) so layout is remeasured when content changes.
+ */
+export function useTableOverflow(observeKey) {
+    const wrapRef = useRef(null);
+    const [state, setState] = useState({
+        overflow: false,
+        canLeft: false,
+        canRight: false,
+    });
+    const update = useCallback(() => {
+        const el = wrapRef.current;
+        if (!el) {
+            setState({ overflow: false, canLeft: false, canRight: false });
+            return;
+        }
+        const overflow = el.scrollWidth > el.clientWidth + 2;
+        setState({
+            overflow,
+            canLeft: overflow && el.scrollLeft > 2,
+            canRight: overflow && el.scrollLeft + el.clientWidth < el.scrollWidth - 2,
+        });
+    }, []);
+    useEffect(() => {
+        const el = wrapRef.current;
+        if (!el)
+            return;
+        update();
+        const onScroll = () => update();
+        el.addEventListener("scroll", onScroll, { passive: true });
+        const observer = new ResizeObserver(update);
+        observer.observe(el);
+        const table = el.querySelector("table");
+        if (table)
+            observer.observe(table);
+        return () => {
+            el.removeEventListener("scroll", onScroll);
+            observer.disconnect();
+        };
+    }, [update, observeKey]);
+    const scrollBy = useCallback((direction) => {
+        const el = wrapRef.current;
+        if (!el)
+            return;
+        const amount = Math.max(220, Math.round(el.clientWidth * 0.55));
+        el.scrollBy({
+            left: direction === "left" ? -amount : amount,
+            behavior: "smooth",
+        });
+    }, []);
+    return { wrapRef, ...state, scrollBy, update };
+}

package/dist/index.d.ts

@@ -11,6 +11,8 @@ export type { MultiCheckOption } from "./components/emails/MultiCheckSelect";
 export type { EmailsLibraryPanelProps } from "./components/emails/EmailsLibraryPanel";
 export type { EmailsActivityPanelProps } from "./components/emails/EmailsActivityPanel";
 export { ResourcePanel, ResourceTable } from "./components/resources/ResourceTable";
+export { SortableHeader } from "./components/resources/SortableHeader";
+export { compareFieldValues, nextTableSort, sortRows, type SortOrder, type TableSortState, } from "./lib/sort";
 export { ThemeToggle } from "./components/theme/ThemeToggle";
 export type { ThemeToggleProps } from "./components/theme/ThemeToggle";
 export { ConfigForm } from "./components/config/ConfigForm";

package/dist/index.d.ts.map

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

package/dist/index.js

@@ -5,6 +5,8 @@ export { FontLibraryBoard } from "./components/fonts/FontLibraryBoard";
 export { FontPickerField } from "./components/fonts/FontPickerField";
 export { EmailsBoard } from "./components/emails/EmailsBoard";
 export { ResourcePanel, ResourceTable } from "./components/resources/ResourceTable";
+export { SortableHeader } from "./components/resources/SortableHeader";
+export { compareFieldValues, nextTableSort, sortRows, } from "./lib/sort";
 export { ThemeToggle } from "./components/theme/ThemeToggle";
 export { ConfigForm } from "./components/config/ConfigForm";
 export { formatPrice, formatPriceInput, parsePriceInput, isCentsField, isPriceField, } from "./lib/price";

package/dist/lib/sort.d.ts

@@ -0,0 +1,10 @@
+import type { FieldSchema, FieldType } from "@vertebr/client";
+export type SortOrder = "asc" | "desc";
+export type TableSortState = {
+    field: string;
+    order: SortOrder;
+};
+export declare function compareFieldValues(left: unknown, right: unknown, type: FieldType | undefined, order: SortOrder): number;
+export declare function sortRows<T extends Record<string, unknown>>(rows: T[], sort: TableSortState | null | undefined, schema?: Record<string, FieldSchema>): T[];
+export declare function nextTableSort(current: TableSortState | null | undefined, field: string, preferredFirst?: SortOrder): TableSortState;
+//# sourceMappingURL=sort.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sort.d.ts","sourceRoot":"","sources":["../../src/lib/sort.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE9D,MAAM,MAAM,SAAS,GAAG,KAAK,GAAG,MAAM,CAAC;AAEvC,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AA8BF,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,OAAO,EACb,KAAK,EAAE,OAAO,EACd,IAAI,EAAE,SAAS,GAAG,SAAS,EAC3B,KAAK,EAAE,SAAS,GACf,MAAM,CAiBR;AAED,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACxD,IAAI,EAAE,CAAC,EAAE,EACT,IAAI,EAAE,cAAc,GAAG,IAAI,GAAG,SAAS,EACvC,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,GACnC,CAAC,EAAE,CAQL;AAED,wBAAgB,aAAa,CAC3B,OAAO,EAAE,cAAc,GAAG,IAAI,GAAG,SAAS,EAC1C,KAAK,EAAE,MAAM,EACb,cAAc,GAAE,SAAiB,GAChC,cAAc,CAKhB"}

package/dist/lib/sort.js

@@ -0,0 +1,59 @@
+function sortValue(value, type) {
+    if (value == null || value === "")
+        return null;
+    if (type === "number") {
+        const n = typeof value === "number" ? value : Number(value);
+        return Number.isFinite(n) ? n : null;
+    }
+    if (type === "datetime") {
+        const ms = typeof value === "number"
+            ? value
+            : Date.parse(typeof value === "string" ? value : String(value));
+        return Number.isFinite(ms) ? ms : null;
+    }
+    if (type === "boolean") {
+        return value === true || value === "true" || value === 1;
+    }
+    if (Array.isArray(value)) {
+        return value.map((item) => String(item ?? "")).join(", ");
+    }
+    if (typeof value === "object") {
+        return JSON.stringify(value);
+    }
+    return String(value);
+}
+export function compareFieldValues(left, right, type, order) {
+    const dir = order === "desc" ? -1 : 1;
+    const a = sortValue(left, type);
+    const b = sortValue(right, type);
+    if (a == null && b == null)
+        return 0;
+    if (a == null)
+        return 1;
+    if (b == null)
+        return -1;
+    if (typeof a === "number" && typeof b === "number") {
+        return (a - b) * dir;
+    }
+    if (typeof a === "boolean" && typeof b === "boolean") {
+        return (Number(a) - Number(b)) * dir;
+    }
+    return String(a).localeCompare(String(b), undefined, {
+        numeric: true,
+        sensitivity: "base",
+    }) * dir;
+}
+export function sortRows(rows, sort, schema) {
+    if (!sort?.field)
+        return rows;
+    const type = schema?.[sort.field]?.type;
+    const field = sort.field;
+    const order = sort.order;
+    return [...rows].sort((left, right) => compareFieldValues(left[field], right[field], type, order));
+}
+export function nextTableSort(current, field, preferredFirst = "asc") {
+    if (current?.field === field) {
+        return { field, order: current.order === "asc" ? "desc" : "asc" };
+    }
+    return { field, order: preferredFirst };
+}