@svgrid/grid 3.0.4 → 4.0.0

package/dist/SvGrid.types.d.ts

@@ -1,4 +1,5 @@
 import type { Snippet } from "svelte";
+import type { GridRowModel } from "./row-model.js";
 import type { CellEditorType, ColumnDef, RowData, SvGridApi, TableFeatures } from "./index.js";
 import type { ConditionalFormat } from "./conditional-formatting.js";
 import type { GroupDisplayType } from "./group-display.js";
@@ -1075,7 +1076,13 @@ export type SchedulerConfig<TFeatures extends TableFeatures = TableFeatures, TDa
     searchPlaceholder?: string;
 };
 export type Props<TFeatures extends TableFeatures = TableFeatures, TData extends RowData = RowData> = {
-    data: ReadonlyArray<TData>;
+    /**
+     * The rows to render.
+     *
+     * Optional only because `rowModel` can supply them instead; a grid with
+     * neither renders empty. When both are present `data` wins.
+     */
+    data?: ReadonlyArray<TData>;
     columns: Array<ColumnDef<TFeatures, TData>>;
     /**
      * Kanban board mode. When set, the grid renders its rows as cards in
@@ -2078,6 +2085,99 @@ export type Props<TFeatures extends TableFeatures = TableFeatures, TData extends
         scrollHeight: number;
         clientHeight: number;
     }) => void;
+    /**
+     * Fires when the range of rows on screen changes, with the first and last
+     * row INDEX (not pixels). Coalesced to one call per frame, so it is cheap
+     * to wire to something that fetches.
+     *
+     * This is the hook a block-loading data source needs and
+     * `onScrollBottomReached` cannot give it: "the user is looking at rows
+     * 4,000-4,020" answers which block to fetch and which to keep, while
+     * "they hit the bottom" only ever means "append more". Both are free; use
+     * this one with `createServerDataSource({ mode: 'infinite' })`, or let
+     * `rowModel` wire it for you.
+     *
+     * Reports `0, data.length - 1` when virtualization is off, since every row
+     * really is rendered.
+     */
+    onVisibleRangeChange?: (range: {
+        startIndex: number;
+        endIndex: number;
+    }) => void;
+    /**
+     * Marks a row as one whose data has not arrived: `"loading"` draws a
+     * shimmer in every cell, `"failed"` draws a full-width "could not load"
+     * row with a Retry button, and `null` (the default for every row) renders
+     * normally.
+     *
+     * Placeholder rows are inert - not selectable, not editable, and skipped
+     * by cell navigation - because there is nothing there to act on yet.
+     *
+     * `createServerDataSource` in `infinite` mode fills the gaps with rows this
+     * recognises, so the usual wiring is `rowPlaceholder={rowPlaceholderState}`
+     * (or nothing at all, via `rowModel`).
+     */
+    rowPlaceholder?: (row: TData, rowIndex: number) => "loading" | "failed" | null;
+    /** Called by the Retry button on a `"failed"` placeholder row. */
+    onRetryRow?: (row: TData, rowIndex: number) => void;
+    /**
+     * Hand selection over to an external model.
+     *
+     * The grid normally tracks selection as a record of the row ids it has
+     * seen, which is right until the rows it has seen are a window onto a
+     * million on a server: "select all" then means 20 ticked checkboxes rather
+     * than a million, and the header checkbox cannot honestly say `all`. A
+     * model that stores the RULE ("everything except these three") can answer
+     * both, so when this is set the header checkbox, the row checkboxes and
+     * `api.selectAllRows()` all route through it instead.
+     *
+     * `@svgrid/enterprise` ships one for the server-side row model; this is the
+     * seam it plugs into.
+     */
+    /**
+     * Drive the grid from a row model instead of wiring a dozen props.
+     *
+     * `createServerDataSource` returns one, and so does the Enterprise
+     * server-side row model, so server-backed grids become:
+     *
+     * ```svelte
+     * <SvGrid rowModel={ctl} {columns} />
+     * ```
+     *
+     * The model supplies `data`, `loading`, `getRowId`, the external sort
+     * and filter wiring, the visible range, placeholder rows, group
+     * accessors, selection and paging - each one only if it implements that
+     * part. A prop written explicitly on the grid always wins, so you can
+     * adopt it and still override one piece.
+     */
+    rowModel?: GridRowModel<TData>;
+    /**
+     * Columns that REPLACE `columns` while set. The server-side row model
+     * supplies them in pivot mode - one column per pivoted value, grouped
+     * under a header per pivot key - and clears them when pivot mode ends,
+     * so `columns` stays the app's own list. Rarely set by hand.
+     */
+    pivotResultColumns?: Array<ColumnDef<TFeatures, TData>> | null;
+    rowSelectionModel?: {
+        isSelected: (rowId: string, row: TData) => boolean;
+        /** Whether the header checkbox shows empty, indeterminate, or ticked. */
+        headerState: () => "none" | "some" | "all";
+        toggle: (rowId: string, row: TData, next: boolean) => void;
+        /** The header checkbox: select or clear everything, loaded or not. */
+        toggleAll: (next: boolean) => void;
+        /**
+         * How many rows the rule selects, counting the ones the grid never
+         * loaded; `null` when it cannot say. The selection bar shows this
+         * instead of counting ticked rows on screen.
+         */
+        selectedCount?: () => number | null;
+        /**
+         * Apply one patch to every selected row, loaded or not. When present,
+         * the bulk-edit drawer sends its edits here instead of writing the
+         * loaded cells. Resolves with how many rows changed.
+         */
+        bulkUpdate?: (patch: Record<string, unknown>) => Promise<number>;
+    };
     /**
      * Marks a row as an expandable "detail row". When this returns true the
      * grid renders that row as a SINGLE full-width cell (colspan across every
@@ -2101,8 +2201,10 @@ export type Props<TFeatures extends TableFeatures = TableFeatures, TData extends
      * Server-side group / tree keyboard + accessibility, built into the grid. When
      * set, the grid uses the treegrid role and marks matching rows with
      * `aria-level` / `aria-expanded`, and ArrowRight / ArrowLeft expand / collapse
-     * the focused group row (no app-level key handling). Pair with `serverGroupRows`
-     * + `SvGroupCell` for the visual expander. Every accessor receives the row data.
+     * the focused group row (no app-level key handling). Pair with
+     * `serverGroupRows` + `SvGroupCell` from `@svgrid/enterprise` for the visual
+     * expander, or drive it from your own tree state. Every accessor receives the
+     * row data.
      */
     serverGroup?: {
         /** Whether a row is an expandable group / branch. */

package/dist/build-api.js

@@ -691,11 +691,10 @@ export function createGridApi(ctx) {
                 });
             },
             selectAllRows() {
-                const next = {};
-                for (const row of ctx.allRows)
-                    if (!isGroupRow(row))
-                        next[row.id] = true;
-                ctx.grid.setRowSelection(() => next);
+                // One implementation of "select everything", shared with the header
+                // checkbox, so it knows about an external selection model and about
+                // rows whose data has not arrived.
+                ctx.setSelectAllRows(true);
             },
             toggleRowSelected(id) {
                 ctx.toggleRowSelectionById(id);
@@ -703,7 +702,13 @@ export function createGridApi(ctx) {
             // ---- Pagination
             getPageInfo() {
                 const { pageIndex, pageSize } = ctx.paginationState;
-                const total = ctx.allRowsBeforePagination.length;
+                // Under external pagination the grid holds ONE page, so counting the
+                // rows in hand would report a 95-row table as a 20-row one. The
+                // consumer tells us the real total through rowCount, which is what
+                // the footer has always shown.
+                const total = ctx.externalPaginationEnabled
+                    ? (ctx.props.rowCount ?? ctx.allRowsBeforePagination.length)
+                    : ctx.allRowsBeforePagination.length;
                 const pageCount = Math.max(1, Math.ceil(total / Math.max(1, pageSize)));
                 return { pageIndex, pageSize, pageCount, total };
             },

package/dist/cdn/{GridMenus-7kbpnnBW.js → GridMenus-CLI93jke.js}

@@ -1,4 +1,4 @@
-import { $a as e, Vn as t, eo as n } from "./src-V1uu8iE9.js";
+import { Ln as e, Xa as t, Ya as n } from "./src-C6Iowdvs.js";
 import { D as r, E as i, F as a, G as o, H as s, I as c, L as l, N as u, Q as d, R as f, U as p, V as m, X as h, Y as g, Z as _, _ as v, at as y, b, d as x, et as S, f as C, ft as w, g as ee, h as T, it as E, j as D, k as O, lt as k, m as te, mt as ne, nt as A, o as re, pt as j, st as M, t as ie, tt as N, u as P, ut as ae, v as F, w as oe } from "./disclose-version-Dr7rEVv-.js";
 import { S as se, _ as ce, j as le, k as ue } from "./editor-registry-BhgE3S84.js";
 import { r as I } from "./dismissable-DAHetSNk.js";
@@ -6,7 +6,7 @@ import { r as I } from "./dismissable-DAHetSNk.js";
 var de = l("<option> </option>"), fe = l("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), pe = l("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), me = l("<option> </option>"), he = l("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), ge = l("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), _e = l("<div class=\"sv-grid-menu-join\" role=\"radiogroup\" aria-label=\"Combine conditions\"><button type=\"button\">AND</button> <button type=\"button\">OR</button> <button type=\"button\" class=\"sv-grid-menu-join-x\" title=\"Remove second condition\" aria-label=\"Remove second condition\"><!></button></div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Second filter condition\"></select> <!>", 1), ve = l("<button type=\"button\" class=\"sv-grid-menu-add-cond\">+ Add condition</button>"), ye = l("<!>  <!>", 1), be = l("<span class=\"sv-grid-menu-head-note\">and the condition above</span>"), xe = l("<span class=\"sv-grid-menu-head-note\"> </span>"), Se = l("<div class=\"sv-grid-facet-empty\">No values</div>"), Ce = l("<div class=\"sv-grid-facet-note\"> </div>"), we = l("<div class=\"sv-grid-menu-filter\"><div class=\"sv-grid-menu-filter-head\"><span class=\"sv-grid-header-icon\"><!></span> Filter\n        condition</div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Filter condition\"></select> <!> <div class=\"sv-grid-menu-sep\"></div> <div class=\"sv-grid-menu-filter-head\">Values <!></div> <span class=\"sv-grid-menu-search-wrap\"><!> <input class=\"sv-grid-menu-search\" placeholder=\"Search values...\"/></span> <label class=\"sv-grid-facet sv-grid-facet-all\"><input type=\"checkbox\"/> <span class=\"sv-grid-facet-label\"> </span></label> <!> <!> <div class=\"sv-grid-menu-actions\"><button type=\"button\" class=\"sv-grid-menu-btn\">Clear filter</button> <button type=\"button\" class=\"sv-grid-menu-btn sv-grid-menu-btn-primary\">Done</button></div></div>"), Te = l("<div role=\"tooltip\"> </div>"), Ee = l("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div>"), De = l("<button type=\"button\" role=\"tab\">Filter</button>"), L = l("<div class=\"sv-grid-menu-tabs\" role=\"tablist\"><button type=\"button\" role=\"tab\">General</button> <!> <button type=\"button\" role=\"tab\">Columns</button></div>"), Oe = l("<div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!>", 1), ke = l("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          ascending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          descending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove sort</button>", 1), Ae = l("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to left</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to right</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Unpin column</button>", 1), R = l("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n          this column</button>"), je = l("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Group\n          by this column</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove grouping</button>", 1), Me = l("<button type=\"button\" role=\"menuitem\" aria-haspopup=\"menu\"><span class=\"sv-grid-header-icon\"><!></span> Choose columns <span class=\"sv-grid-header-icon sv-grid-menu-item-chevron\"><!></span></button>"), z = l("<!> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n        all columns</button> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Reset columns</button>", 1), B = l("<div class=\"sv-grid-menu sv-grid-column-menu\" role=\"menu\"><!> <!></div>"), Ne = l("<div class=\"sv-grid-menu sv-grid-filter-menu\" role=\"menu\" tabindex=\"-1\"><!></div>"), Pe = l("<div class=\"sv-grid-menu sv-grid-choose-columns-menu\" role=\"menu\"><div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!></div>"), Fe = l("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitemradio\"><span class=\"sv-grid-header-icon\"><!></span> </button>"), Ie = l("<div class=\"sv-grid-menu sv-grid-operator-menu\" role=\"menu\"></div>"), Le = l("<div class=\"sv-grid-facet-empty\">No values</div>"), Re = l("<div class=\"sv-grid-menu sv-grid-in-suggest\"><!></div>"), ze = l("<div class=\"sv-grid-menu-sep\"></div>"), Be = f("<path></path>"), V = f("<svg class=\"sv-grid-menu-icon-own\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"></svg>"), Ve = l("<span class=\"sv-grid-menu-icon\" aria-hidden=\"true\"><!></span>"), He = l("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><!><span class=\"sv-grid-menu-label\"> </span></button>"), Ue = l("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-context-menu\" role=\"menu\"></div>", 1), We = l("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-comment-editor\" role=\"dialog\" aria-label=\"Edit comment\"><textarea class=\"sv-grid-comment-textarea\" rows=\"3\" placeholder=\"Add a comment…\"></textarea> <div class=\"sv-grid-comment-actions\"><button type=\"button\" class=\"sv-grid-comment-remove\">Remove</button> <span class=\"sv-grid-comment-spacer\"></span> <button type=\"button\" class=\"sv-grid-comment-cancel\">Cancel</button> <button type=\"button\" class=\"sv-grid-comment-save\">Save</button></div></div>", 1), Ge = l("<!> <!>  <!> <!> <!> <!> <!> <!> <!>", 1);
 function H(l, f) {
 	ae(f, !0);
-	let m = (e, n = ne) => {
+	let m = (t, n = ne) => {
 		let r = M(() => o(Y).find((e) => e.id === n())), l = M(() => o(lt)(o(r))), d = M(() => o(U)[n()]?.operator ?? o(X)(o(r))), m = M(() => se(o(r)?.columnDef.editorType ?? "text")), h = M(() => le(o(r)?.columnDef.editorType) && o(d) !== "isBlank" && o(d) !== "isNotBlank" && o(d) !== "regex" && o(d) !== "in" && o(d) !== "notIn"), _ = M(() => o(wt).length !== o(Ct).length), v = M(() => o(d) === "isBlank" || o(d) === "isNotBlank" || (o(U)[n()]?.value ?? "").trim().length > 0), y = M(() => o(Mt).size), b = M(() => o(Ct).length);
 		var E = we(), k = S(E), ie = S(k), ae = S(ie);
 		D(ae, () => f.icon, () => "filter"), j(ie), w(), j(k);
@@ -176,10 +176,10 @@ function H(l, f) {
 		P(B);
 		var Ne = A(B, 2), Pe = S(Ne, !0);
 		j(Ne), j(z);
-		var Fe = A(z, 2), Ie = (e) => {
+		var Fe = A(z, 2), Ie = (t) => {
 			{
 				let r = M(() => o(jt).length > Bt);
-				t(e, {
+				e(t, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
@@ -220,7 +220,7 @@ function H(l, f) {
 			Te !== (Te = o(d)) && (I.value = (I.__value = o(d)) ?? "", ee(I, o(d))), C(B, e), u(Pe, o(_) ? "(Select all results)" : "(Select all)"), V.disabled = t;
 		}, [() => o(Rt)(n()), () => !o(mt)(n())]), s("change", I, (e) => o(ot)(n(), e.currentTarget.value)), re(Me, () => H().columnMenuSearch, (e) => H().columnMenuSearch = e), s("change", B, () => o(zt)(n())), s("click", V, () => o(Kt)(n())), s("click", Ve, function(...e) {
 			o(Q)?.apply(this, e);
-		}), a(e, E);
+		}), a(t, E);
 	}, H = ie(f, "ctrl", 7), Ke = M(() => H().groupingControlsEnabled), U = M(() => H().filterMenuValues), W = M(() => H().tooltip), G = M(() => H().columnMenuFor), K = M(() => H().columnMenuPos), q = M(() => H().filterMenuFor), qe = M(() => H().filterMenuPos), Je = M(() => H().operatorMenuFor), Ye = M(() => H().operatorMenuPos), J = M(() => H().chooseColumnsPos), Xe = M(() => H().showColumnFiltersEffective), Ze = M(() => H().props.columnMenuTabs === !0), Qe = M(() => H().grid), Y = M(() => H().allColumns), $e = M(() => H().isColumnPinned), et = M(() => H().pinColumnLeft), tt = M(() => H().pinColumnRight), nt = M(() => H().unpinColumn), rt = M(() => H().sortDirectionByColumn), it = M(() => H().groupingColumns), at = M(() => H().columnVirtualizationEnabled), ot = M(() => H().updateFilterOperator), st = M(() => H().updateFilterMenuValue), ct = M(() => H().updateFilterMenuValueTo), lt = M(() => H().operatorsForColumn), X = M(() => H().defaultOperatorFor), ut = M(() => H().operatorLabelFor), dt = M(() => H().filterRowValues), ft = M(() => H().inSuggestFor), pt = M(() => H().inSuggestPos);
 	function Z(e, t) {
 		let n = o(Y).find((t) => t.id === e), r = H().filterMenuValues[e] ?? {
@@ -279,11 +279,11 @@ function H(l, f) {
 		t?.closest(".sv-listbox") || t?.tagName === "BUTTON" || (e.preventDefault(), o(Q)());
 	}
 	let jt = M(() => H().columnMenuFacetOptions), Mt = M(() => H().columnMenuSelectedFacets), Nt = M(() => H().setFacetSelection), Pt = M(() => H().setFilterTokens), Ft = M(() => H().inSuggestOptions), It = M(() => H().openInSuggest), Lt = M(() => H().closeInSuggest), Rt = M(() => H().isAllFacetsChecked), zt = M(() => H().toggleAllFacets), Bt = 40;
-	function Vt(e, t) {
-		o(It)(e, t), H().inSuggestQuery = n(e.value);
+	function Vt(e, n) {
+		o(It)(e, n), H().inSuggestQuery = t(e.value);
 	}
-	function Ht(e, t) {
-		H().inSuggestQuery = n(e.value), H().inSuggestFor !== t && o(It)(e, t);
+	function Ht(e, n) {
+		H().inSuggestQuery = t(e.value), H().inSuggestFor !== n && o(It)(e, n);
 	}
 	function Ut(e) {
 		return e.map((e) => ({
@@ -322,7 +322,7 @@ function H(l, f) {
 	O(rn, (e) => {
 		(o(G) || o(q) || o(Je) || o(J)) && e(an);
 	});
-	var on = A(rn, 2), sn = (e) => {
+	var on = A(rn, 2), sn = (t) => {
 		let n = M(() => o(G)), r = M(() => o(Y).find((e) => e.id === o(n))), i = M(() => o(r)?.getCanSort?.() ?? !1), c = M(() => o(r)?.columnDef.field != null && o(r)?.columnDef.filterable !== !1), l = M(() => H().columnMenuTab);
 		var u = B(), d = S(u), p = (e) => {
 			var t = L(), n = S(t);
@@ -348,17 +348,17 @@ function H(l, f) {
 		});
 		var h = A(d, 2), _ = (e) => {
 			m(e, () => o(n));
-		}, y = (e) => {
+		}, y = (t) => {
 			let n = M(() => o(Qe).getAllColumns());
 			var r = Oe(), i = A(N(r), 2);
 			{
-				let e = M(() => o(n).length > 40), r = M(() => Ut(o(n))), a = M(() => Wt(o(n)));
-				t(i, {
+				let t = M(() => o(n).length > 40), r = M(() => Ut(o(n))), a = M(() => Wt(o(n)));
+				e(i, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
 					get virtual() {
-						return o(e);
+						return o(t);
 					},
 					rows: 9,
 					rowHeight: 24,
@@ -373,7 +373,7 @@ function H(l, f) {
 					onChange: (e) => Gt(o(n), e)
 				});
 			}
-			a(e, r);
+			a(t, r);
 		}, b = (e) => {
 			var t = z(), r = N(t), c = (e) => {
 				var t = ke(), r = N(t), i = S(r), c = S(i);
@@ -446,7 +446,7 @@ function H(l, f) {
 			o(Ze) && o(l) === "filter" && o(c) && o(Xe) ? e(_) : o(Ze) && o(l) === "columns" ? e(y, 1) : e(b, -1);
 		}), j(u), g(() => {
 			x(u, "data-svgrid-menu", H().gridDomId), v(u, `left: ${o(K).x}px; top: ${o(K).y}px; max-height: calc(100vh - ${o(K).y}px - 12px);`);
-		}), a(e, u);
+		}), a(t, u);
 	};
 	O(on, (e) => {
 		o(G) && e(sn);
@@ -460,17 +460,17 @@ function H(l, f) {
 	O(cn, (e) => {
 		o(q) && o(Xe) && e(ln);
 	});
-	var un = A(cn, 2), dn = (e) => {
+	var un = A(cn, 2), dn = (t) => {
 		let n = M(() => o(Qe).getAllColumns());
 		var r = Pe(), i = A(S(r), 2);
 		{
-			let e = M(() => o(n).length > 40), r = M(() => Ut(o(n))), a = M(() => Wt(o(n)));
-			t(i, {
+			let t = M(() => o(n).length > 40), r = M(() => Ut(o(n))), a = M(() => Wt(o(n)));
+			e(i, {
 				block: !0,
 				checkbox: !0,
 				multiple: !0,
 				get virtual() {
-					return o(e);
+					return o(t);
 				},
 				rows: 11,
 				rowHeight: 24,
@@ -487,7 +487,7 @@ function H(l, f) {
 		}
 		j(r), g(() => {
 			x(r, "data-svgrid-menu", H().gridDomId), v(r, `left: ${o(J).x}px; top: ${o(J).y}px;`);
-		}), a(e, r);
+		}), a(t, r);
 	};
 	O(un, (e) => {
 		o(J) && e(dn);
@@ -512,11 +512,11 @@ function H(l, f) {
 		o(Je) && e(pn);
 	});
 	var mn = A(fn, 2), hn = (r) => {
-		let i = M(() => o(ft)), c = M(() => new Set(e(o(dt)[o(i)] ?? "")));
-		var l = Re(), u = S(l), d = (e) => {
+		let i = M(() => o(ft)), c = M(() => new Set(n(o(dt)[o(i)] ?? "")));
+		var l = Re(), u = S(l), d = (n) => {
 			{
 				let r = M(() => o(Ft).length > 40);
-				t(e, {
+				e(n, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
@@ -534,8 +534,8 @@ function H(l, f) {
 						return o(c);
 					},
 					onChange: (e) => {
-						let t = new Set(e), r = n(o(dt)[o(i)] ?? "");
-						r && t.delete(r), o(Pt)(o(i), [...t]), H().inSuggestQuery = "";
+						let n = new Set(e), r = t(o(dt)[o(i)] ?? "");
+						r && n.delete(r), o(Pt)(o(i), [...n]), H().inSuggestQuery = "";
 					}
 				});
 			}

package/dist/cdn/{GridMenus-BL7ZgQvU.js → GridMenus-CwooL3QA.js}

@@ -1,4 +1,4 @@
-import { $a as e, Vn as t, eo as n } from "./src-BKhZ6eXd.js";
+import { Ln as e, Xa as t, Ya as n } from "./src-B6HXdfHY.js";
 import { S as r, _ as i, j as a, k as o } from "./editor-registry-BhgE3S84.js";
 import { r as s } from "./dismissable-DAHetSNk.js";
 import * as c from "svelte/internal/client";
@@ -7,7 +7,7 @@ import "svelte/internal/disclose-version";
 var l = c.from_html("<option> </option>"), u = c.from_html("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), d = c.from_html("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), f = c.from_html("<option> </option>"), p = c.from_html("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), m = c.from_html("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), ee = c.from_html("<div class=\"sv-grid-menu-join\" role=\"radiogroup\" aria-label=\"Combine conditions\"><button type=\"button\">AND</button> <button type=\"button\">OR</button> <button type=\"button\" class=\"sv-grid-menu-join-x\" title=\"Remove second condition\" aria-label=\"Remove second condition\"><!></button></div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Second filter condition\"></select> <!>", 1), h = c.from_html("<button type=\"button\" class=\"sv-grid-menu-add-cond\">+ Add condition</button>"), g = c.from_html("<!>  <!>", 1), _ = c.from_html("<span class=\"sv-grid-menu-head-note\">and the condition above</span>"), v = c.from_html("<span class=\"sv-grid-menu-head-note\"> </span>"), y = c.from_html("<div class=\"sv-grid-facet-empty\">No values</div>"), b = c.from_html("<div class=\"sv-grid-facet-note\"> </div>"), te = c.from_html("<div class=\"sv-grid-menu-filter\"><div class=\"sv-grid-menu-filter-head\"><span class=\"sv-grid-header-icon\"><!></span> Filter\n        condition</div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Filter condition\"></select> <!> <div class=\"sv-grid-menu-sep\"></div> <div class=\"sv-grid-menu-filter-head\">Values <!></div> <span class=\"sv-grid-menu-search-wrap\"><!> <input class=\"sv-grid-menu-search\" placeholder=\"Search values...\"/></span> <label class=\"sv-grid-facet sv-grid-facet-all\"><input type=\"checkbox\"/> <span class=\"sv-grid-facet-label\"> </span></label> <!> <!> <div class=\"sv-grid-menu-actions\"><button type=\"button\" class=\"sv-grid-menu-btn\">Clear filter</button> <button type=\"button\" class=\"sv-grid-menu-btn sv-grid-menu-btn-primary\">Done</button></div></div>"), ne = c.from_html("<div role=\"tooltip\"> </div>"), x = c.from_html("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div>"), S = c.from_html("<button type=\"button\" role=\"tab\">Filter</button>"), re = c.from_html("<div class=\"sv-grid-menu-tabs\" role=\"tablist\"><button type=\"button\" role=\"tab\">General</button> <!> <button type=\"button\" role=\"tab\">Columns</button></div>"), ie = c.from_html("<div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!>", 1), ae = c.from_html("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          ascending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          descending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove sort</button>", 1), oe = c.from_html("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to left</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to right</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Unpin column</button>", 1), se = c.from_html("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n          this column</button>"), C = c.from_html("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Group\n          by this column</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove grouping</button>", 1), w = c.from_html("<button type=\"button\" role=\"menuitem\" aria-haspopup=\"menu\"><span class=\"sv-grid-header-icon\"><!></span> Choose columns <span class=\"sv-grid-header-icon sv-grid-menu-item-chevron\"><!></span></button>"), ce = c.from_html("<!> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n        all columns</button> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Reset columns</button>", 1), le = c.from_html("<div class=\"sv-grid-menu sv-grid-column-menu\" role=\"menu\"><!> <!></div>"), T = c.from_html("<div class=\"sv-grid-menu sv-grid-filter-menu\" role=\"menu\" tabindex=\"-1\"><!></div>"), ue = c.from_html("<div class=\"sv-grid-menu sv-grid-choose-columns-menu\" role=\"menu\"><div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!></div>"), E = c.from_html("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitemradio\"><span class=\"sv-grid-header-icon\"><!></span> </button>"), de = c.from_html("<div class=\"sv-grid-menu sv-grid-operator-menu\" role=\"menu\"></div>"), D = c.from_html("<div class=\"sv-grid-facet-empty\">No values</div>"), fe = c.from_html("<div class=\"sv-grid-menu sv-grid-in-suggest\"><!></div>"), pe = c.from_html("<div class=\"sv-grid-menu-sep\"></div>"), me = c.from_svg("<path></path>"), O = c.from_svg("<svg class=\"sv-grid-menu-icon-own\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\"></svg>"), he = c.from_html("<span class=\"sv-grid-menu-icon\" aria-hidden=\"true\"><!></span>"), ge = c.from_html("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><!><span class=\"sv-grid-menu-label\"> </span></button>"), k = c.from_html("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-context-menu\" role=\"menu\"></div>", 1), A = c.from_html("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-comment-editor\" role=\"dialog\" aria-label=\"Edit comment\"><textarea class=\"sv-grid-comment-textarea\" rows=\"3\" placeholder=\"Add a comment…\"></textarea> <div class=\"sv-grid-comment-actions\"><button type=\"button\" class=\"sv-grid-comment-remove\">Remove</button> <span class=\"sv-grid-comment-spacer\"></span> <button type=\"button\" class=\"sv-grid-comment-cancel\">Cancel</button> <button type=\"button\" class=\"sv-grid-comment-save\">Save</button></div></div>", 1), j = c.from_html("<!> <!>  <!> <!> <!> <!> <!> <!> <!>", 1);
 function _e(_e, M) {
 	c.push(M, !0);
-	let N = (e, n = c.noop) => {
+	let N = (t, n = c.noop) => {
 		let s = c.derived(() => c.get(W).find((e) => e.id === n())), ne = c.derived(() => c.get(Me)(c.get(s))), x = c.derived(() => c.get(F)[n()]?.operator ?? c.get(G)(c.get(s))), S = c.derived(() => r(c.get(s)?.columnDef.editorType ?? "text")), re = c.derived(() => a(c.get(s)?.columnDef.editorType) && c.get(x) !== "isBlank" && c.get(x) !== "isNotBlank" && c.get(x) !== "regex" && c.get(x) !== "in" && c.get(x) !== "notIn"), ie = c.derived(() => c.get(Ke).length !== c.get(J).length), ae = c.derived(() => c.get(x) === "isBlank" || c.get(x) === "isNotBlank" || (c.get(F)[n()]?.value ?? "").trim().length > 0), oe = c.derived(() => c.get(Qe).size), se = c.derived(() => c.get(J).length);
 		var C = te(), w = c.child(C), ce = c.child(w), le = c.child(ce);
 		c.snippet(le, () => M.icon, () => "filter"), c.reset(ce), c.next(), c.reset(w);
@@ -177,10 +177,10 @@ function _e(_e, M) {
 		c.remove_input_defaults(A);
 		var j = c.sibling(A, 2), _e = c.child(j, !0);
 		c.reset(j), c.reset(k);
-		var N = c.sibling(k, 2), ve = (e) => {
+		var N = c.sibling(k, 2), ve = (t) => {
 			{
 				let r = c.derived(() => c.get(Ze).length > at);
-				t(e, {
+				e(t, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
@@ -221,7 +221,7 @@ function _e(_e, M) {
 			ue !== (ue = c.get(x)) && (T.value = (T.__value = c.get(x)) ?? "", c.select_option(T, c.get(x))), c.set_checked(A, e), c.set_text(_e, c.get(ie) ? "(Select all results)" : "(Select all)"), B.disabled = t;
 		}, [() => c.get(rt)(n()), () => !c.get(Le)(n())]), c.delegated("change", T, (e) => c.get(ke)(n(), e.currentTarget.value)), c.bind_value(ge, () => P().columnMenuSearch, (e) => P().columnMenuSearch = e), c.delegated("change", A, () => c.get(it)(n())), c.delegated("click", B, () => c.get(dt)(n())), c.delegated("click", V, function(...e) {
 			c.get(q)?.apply(this, e);
-		}), c.append(e, C);
+		}), c.append(t, C);
 	}, P = c.prop(M, "ctrl", 7), ve = c.derived(() => P().groupingControlsEnabled), F = c.derived(() => P().filterMenuValues), I = c.derived(() => P().tooltip), L = c.derived(() => P().columnMenuFor), R = c.derived(() => P().columnMenuPos), z = c.derived(() => P().filterMenuFor), B = c.derived(() => P().filterMenuPos), V = c.derived(() => P().operatorMenuFor), ye = c.derived(() => P().operatorMenuPos), H = c.derived(() => P().chooseColumnsPos), be = c.derived(() => P().showColumnFiltersEffective), U = c.derived(() => P().props.columnMenuTabs === !0), xe = c.derived(() => P().grid), W = c.derived(() => P().allColumns), Se = c.derived(() => P().isColumnPinned), Ce = c.derived(() => P().pinColumnLeft), we = c.derived(() => P().pinColumnRight), Te = c.derived(() => P().unpinColumn), Ee = c.derived(() => P().sortDirectionByColumn), De = c.derived(() => P().groupingColumns), Oe = c.derived(() => P().columnVirtualizationEnabled), ke = c.derived(() => P().updateFilterOperator), Ae = c.derived(() => P().updateFilterMenuValue), je = c.derived(() => P().updateFilterMenuValueTo), Me = c.derived(() => P().operatorsForColumn), G = c.derived(() => P().defaultOperatorFor), Ne = c.derived(() => P().operatorLabelFor), Pe = c.derived(() => P().filterRowValues), Fe = c.derived(() => P().inSuggestFor), Ie = c.derived(() => P().inSuggestPos);
 	function K(e, t) {
 		let n = c.get(W).find((t) => t.id === e), r = P().filterMenuValues[e] ?? {
@@ -280,11 +280,11 @@ function _e(_e, M) {
 		t?.closest(".sv-listbox") || t?.tagName === "BUTTON" || (e.preventDefault(), c.get(q)());
 	}
 	let Ze = c.derived(() => P().columnMenuFacetOptions), Qe = c.derived(() => P().columnMenuSelectedFacets), $e = c.derived(() => P().setFacetSelection), et = c.derived(() => P().setFilterTokens), Z = c.derived(() => P().inSuggestOptions), tt = c.derived(() => P().openInSuggest), nt = c.derived(() => P().closeInSuggest), rt = c.derived(() => P().isAllFacetsChecked), it = c.derived(() => P().toggleAllFacets), at = 40;
-	function ot(e, t) {
-		c.get(tt)(e, t), P().inSuggestQuery = n(e.value);
+	function ot(e, n) {
+		c.get(tt)(e, n), P().inSuggestQuery = t(e.value);
 	}
-	function st(e, t) {
-		P().inSuggestQuery = n(e.value), P().inSuggestFor !== t && c.get(tt)(e, t);
+	function st(e, n) {
+		P().inSuggestQuery = t(e.value), P().inSuggestFor !== n && c.get(tt)(e, n);
 	}
 	function ct(e) {
 		return e.map((e) => ({
@@ -323,7 +323,7 @@ function _e(_e, M) {
 	c.if(xt, (e) => {
 		(c.get(L) || c.get(z) || c.get(V) || c.get(H)) && e(St);
 	});
-	var Ct = c.sibling(xt, 2), wt = (e) => {
+	var Ct = c.sibling(xt, 2), wt = (t) => {
 		let n = c.derived(() => c.get(L)), r = c.derived(() => c.get(W).find((e) => e.id === c.get(n))), i = c.derived(() => c.get(r)?.getCanSort?.() ?? !1), a = c.derived(() => c.get(r)?.columnDef.field != null && c.get(r)?.columnDef.filterable !== !1), o = c.derived(() => P().columnMenuTab);
 		var s = le(), l = c.child(s), u = (e) => {
 			var t = re(), n = c.child(t);
@@ -349,17 +349,17 @@ function _e(_e, M) {
 		});
 		var d = c.sibling(l, 2), f = (e) => {
 			N(e, () => c.get(n));
-		}, p = (e) => {
+		}, p = (t) => {
 			let n = c.derived(() => c.get(xe).getAllColumns());
 			var r = ie(), i = c.sibling(c.first_child(r), 2);
 			{
-				let e = c.derived(() => c.get(n).length > 40), r = c.derived(() => ct(c.get(n))), a = c.derived(() => lt(c.get(n)));
-				t(i, {
+				let t = c.derived(() => c.get(n).length > 40), r = c.derived(() => ct(c.get(n))), a = c.derived(() => lt(c.get(n)));
+				e(i, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
 					get virtual() {
-						return c.get(e);
+						return c.get(t);
 					},
 					rows: 9,
 					rowHeight: 24,
@@ -374,7 +374,7 @@ function _e(_e, M) {
 					onChange: (e) => ut(c.get(n), e)
 				});
 			}
-			c.append(e, r);
+			c.append(t, r);
 		}, m = (e) => {
 			var t = ce(), r = c.first_child(t), a = (e) => {
 				var t = ae(), r = c.first_child(t), i = c.child(r), a = c.child(i);
@@ -447,7 +447,7 @@ function _e(_e, M) {
 			c.get(U) && c.get(o) === "filter" && c.get(a) && c.get(be) ? e(f) : c.get(U) && c.get(o) === "columns" ? e(p, 1) : e(m, -1);
 		}), c.reset(s), c.template_effect(() => {
 			c.set_attribute(s, "data-svgrid-menu", P().gridDomId), c.set_style(s, `left: ${c.get(R).x}px; top: ${c.get(R).y}px; max-height: calc(100vh - ${c.get(R).y}px - 12px);`);
-		}), c.append(e, s);
+		}), c.append(t, s);
 	};
 	c.if(Ct, (e) => {
 		c.get(L) && e(wt);
@@ -461,17 +461,17 @@ function _e(_e, M) {
 	c.if(Tt, (e) => {
 		c.get(z) && c.get(be) && e(Et);
 	});
-	var Dt = c.sibling(Tt, 2), Ot = (e) => {
+	var Dt = c.sibling(Tt, 2), Ot = (t) => {
 		let n = c.derived(() => c.get(xe).getAllColumns());
 		var r = ue(), i = c.sibling(c.child(r), 2);
 		{
-			let e = c.derived(() => c.get(n).length > 40), r = c.derived(() => ct(c.get(n))), a = c.derived(() => lt(c.get(n)));
-			t(i, {
+			let t = c.derived(() => c.get(n).length > 40), r = c.derived(() => ct(c.get(n))), a = c.derived(() => lt(c.get(n)));
+			e(i, {
 				block: !0,
 				checkbox: !0,
 				multiple: !0,
 				get virtual() {
-					return c.get(e);
+					return c.get(t);
 				},
 				rows: 11,
 				rowHeight: 24,
@@ -488,7 +488,7 @@ function _e(_e, M) {
 		}
 		c.reset(r), c.template_effect(() => {
 			c.set_attribute(r, "data-svgrid-menu", P().gridDomId), c.set_style(r, `left: ${c.get(H).x}px; top: ${c.get(H).y}px;`);
-		}), c.append(e, r);
+		}), c.append(t, r);
 	};
 	c.if(Dt, (e) => {
 		c.get(H) && e(Ot);
@@ -513,11 +513,11 @@ function _e(_e, M) {
 		c.get(V) && e(At);
 	});
 	var jt = c.sibling(kt, 2), Mt = (r) => {
-		let i = c.derived(() => c.get(Fe)), a = c.derived(() => new Set(e(c.get(Pe)[c.get(i)] ?? "")));
-		var o = fe(), s = c.child(o), l = (e) => {
+		let i = c.derived(() => c.get(Fe)), a = c.derived(() => new Set(n(c.get(Pe)[c.get(i)] ?? "")));
+		var o = fe(), s = c.child(o), l = (n) => {
 			{
 				let r = c.derived(() => c.get(Z).length > 40);
-				t(e, {
+				e(n, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
@@ -535,8 +535,8 @@ function _e(_e, M) {
 						return c.get(a);
 					},
 					onChange: (e) => {
-						let t = new Set(e), r = n(c.get(Pe)[c.get(i)] ?? "");
-						r && t.delete(r), c.get(et)(c.get(i), [...t]), P().inSuggestQuery = "";
+						let n = new Set(e), r = t(c.get(Pe)[c.get(i)] ?? "");
+						r && n.delete(r), c.get(et)(c.get(i), [...n]), P().inSuggestQuery = "";
 					}
 				});
 			}