@svgrid/grid 2.5.2 → 2.6.2

package/dist/SvCountryInput.svelte

@@ -37,6 +37,7 @@
     name,
     size = 'md',
     ariaLabel,
+    block = false,
     invalid = false,
     required = false,
     error,
@@ -93,7 +94,7 @@
 </script>
 
 <SvField id={uid} {label} {hint} {error} {required} {dir}>
-  <button bind:this={triggerEl} class="sv-country sv-country--{size}" class:is-open={ci.open} class:is-disabled={disabled} class:is-invalid={invalid} {...ci.triggerProps()}>
+  <button bind:this={triggerEl} class="sv-country sv-country--{size}" class:is-block={block} class:is-open={ci.open} class:is-disabled={disabled} class:is-invalid={invalid} {...ci.triggerProps()}>
     {#if selected}
       <span class="sv-country__flag" aria-hidden="true">{flagEmoji(selected.code)}</span>
       <span class="sv-country__name">{selected.name}</span>
@@ -157,4 +158,6 @@
   :global(.sv-country__opt) { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 6px; cursor: pointer; font-size: 13px; }
   :global(.sv-country__opt.is-active) { background: var(--sg-row-hover-bg, #f1f5f9); }
   :global(.sv-country__opt.is-selected) { color: var(--sg-accent, #2563eb); font-weight: 600; }
+  /* Fill the container - see `block` in SvEditorProps. */
+  .sv-country.is-block { width: 100%; max-width: 100%; }
 </style>

package/dist/SvGrid.controller.svelte.js

@@ -1,4 +1,4 @@
-import { applyExcelFilter, applyGroupAggregate, normalizeForFilter, createColumnVirtualizer, createCoreRowModel, createExpandedRowModel, createFilteredRowModel, createGroupedRowModel, createTreeRowModel, createSvelteVirtualizer, createSortedRowModel, createSvGrid, getGridCellDomId, sortFns, } from "./index";
+import { applyGroupAggregate, compileExcelFilter, normalizeForFilter, createColumnVirtualizer, createCoreRowModel, createExpandedRowModel, createFilteredRowModel, createGroupedRowModel, createTreeRowModel, createSvelteVirtualizer, createSortedRowModel, createSvGrid, getGridCellDomId, sortFns, } from "./index";
 import { createRowScrollScaling, resolveMaxDomHeight, } from "./virtualization/scroll-scaling";
 import "./sv-grid-scrollbar";
 import { computeColumnStat, formatsNeedingStats, formatNeedsStats, } from "./conditional-formatting";
@@ -976,7 +976,11 @@ export function createSvGridController(rawProps, domIdBase) {
                 return value.trim().length > 0 && (valueTo ?? "").trim().length > 0;
             return value.trim().length > 0;
         };
-        const evalCond = (cellValue, columnId, op, value, valueTo) => applyExcelFilter(cellValue, { id: columnId, operator: op, value, valueTo: op === "between" ? valueTo : undefined }, { locale: (props.filterLocale ?? props.localization?.locale) });
+        // Compile a condition ONCE per filter change rather than once per row.
+        // Folding the needle, splitting `in` tokens and building a regex all
+        // depend only on the filter, so over 100k rows this used to be 100k
+        // redundant passes.
+        const compileCond = (columnId, op, value, valueTo) => compileExcelFilter({ id: columnId, operator: op, value, valueTo: op === "between" ? valueTo : undefined }, { locale: (props.filterLocale ?? props.localization?.locale) });
         // A column filter is active if either of its (up to two) conditions is.
         const menuFilters = Object.entries(filterMenuValues).filter(([_, f]) => {
             const a = condActive(f.operator, f.value, f.valueTo);
@@ -984,19 +988,27 @@ export function createSvGridController(rawProps, domIdBase) {
             return a || b;
         });
         if (menuFilters.length) {
-            rows = rows.filter((row) => menuFilters.every(([columnId, f]) => {
+            // Hoisted out of the row loop: each column's (up to two) conditions
+            // become compiled predicates before a single row is tested.
+            const compiledMenuFilters = menuFilters.map(([columnId, f]) => ({
+                columnId,
+                join: f.join,
+                a: condActive(f.operator, f.value, f.valueTo)
+                    ? compileCond(columnId, f.operator, f.value, f.valueTo)
+                    : null,
+                b: !!f.operator2 && condActive(f.operator2, f.value2 ?? "", f.valueTo2)
+                    ? compileCond(columnId, f.operator2, f.value2 ?? "", f.valueTo2)
+                    : null,
+            }));
+            rows = rows.filter((row) => compiledMenuFilters.every(({ columnId, join, a, b }) => {
                 const cellValue = getRowColumnValue(row, columnId);
-                const aActive = condActive(f.operator, f.value, f.valueTo);
-                const bActive = !!f.operator2 && condActive(f.operator2, f.value2 ?? "", f.valueTo2);
-                const ra = aActive ? evalCond(cellValue, columnId, f.operator, f.value, f.valueTo) : null;
-                const rb = bActive
-                    ? evalCond(cellValue, columnId, f.operator2, f.value2 ?? "", f.valueTo2)
-                    : null;
+                const ra = a ? a(cellValue) : null;
+                const rb = b ? b(cellValue) : null;
                 if (ra === null)
                     return rb ?? true;
                 if (rb === null)
                     return ra;
-                return f.join === "OR" ? ra || rb : ra && rb;
+                return join === "OR" ? ra || rb : ra && rb;
             }));
         }
         const valueFilterEntries = Object.entries(valueFilters);

package/dist/SvSlider.svelte

@@ -44,6 +44,7 @@
     orientation = 'horizontal',
     name,
     ariaLabel,
+    block = false,
     invalid = false,
     required = false,
     error,
@@ -109,7 +110,7 @@
 
 <SvField id={uid} {label} {hint} {error} {required} {dir}>
 <div
-  class="sv-slider sv-slider--{orientation} sv-slider--{size}"
+  class="sv-slider sv-slider--{orientation} sv-slider--{size}" class:is-block={block}
   class:is-disabled={disabled}
   class:is-readonly={readonly}
   dir={resolvedDir}
@@ -197,4 +198,6 @@
   .sv-slider__tick { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: var(--sg-muted, #94a3b8); }
   .sv-slider--horizontal .sv-slider__tick { inset-inline-start: var(--p); top: 50%; transform: translate(-50%, -50%); }
   .sv-slider--vertical .sv-slider__tick { bottom: var(--p); left: 50%; transform: translate(-50%, 50%); }
+  /* Fill the container - see `block` in SvEditorProps. */
+  .sv-slider--horizontal.is-block { width: 100%; max-width: 100%; }
 </style>

package/dist/SvTagsInput.svelte

@@ -36,6 +36,7 @@
     size = 'md',
     name,
     ariaLabel,
+    block = false,
     invalid = false,
     required = false,
     error,
@@ -69,7 +70,7 @@
 </script>
 
 <SvField id={uid} {label} {hint} {error} {required} {dir}>
-  <div class="sv-tags sv-tags--{size}" class:is-disabled={disabled} class:is-invalid={invalid} {...ti.rootProps()}>
+  <div class="sv-tags sv-tags--{size}" class:is-block={block} class:is-disabled={disabled} class:is-invalid={invalid} {...ti.rootProps()}>
     {#each value as tag, i (tag + i)}
       <span class="sv-tags__chip" {...ti.tagProps(i)}>
         <span class="sv-tags__label">{tag}</span>
@@ -109,4 +110,6 @@
   .sv-tags__x { background: none; border: 0; color: inherit; cursor: pointer; font-size: 15px; line-height: 1; padding: 0 2px; opacity: 0.7; }
   .sv-tags__x:hover { opacity: 1; }
   .sv-tags__input { flex: 1; min-width: 80px; border: 0; background: none; outline: none; color: inherit; font: inherit; font-size: var(--_fs); height: 24px; }
+  /* Fill the container - see `block` in SvEditorProps. */
+  .sv-tags.is-block { width: 100%; max-width: 100%; }
 </style>

package/dist/cdn/{GridMenus-oQYElQll.js → GridMenus-BoVKgAv8.js}

@@ -1,4 +1,4 @@
-import { Gn as e, io as t, no as n, ro as r } from "./src-72QTH8lh.js";
+import { Gn as e, ao as t, io as n, ro as r } from "./src-CEpw6Ato.js";
 import { l as i } from "./SvDateTimePicker-CHnUkWcH.js";
 import * as a from "svelte/internal/client";
 import "svelte/internal/disclose-version";
@@ -173,10 +173,10 @@ function oe(oe, N) {
 	});
 	let Ee = a.derived(() => P().autosizeColumn), De = a.derived(() => P().autosizeAllColumns), Oe = a.derived(() => P().resetColumns), ke = a.derived(() => P().openChooseColumns), Ae = a.derived(() => P().sortColumnFromMenu), je = a.derived(() => P().clearColumnSort), Me = a.derived(() => P().groupByColumnFromMenu), Ne = a.derived(() => P().clearGroupingFromMenu), Pe = a.derived(() => P().columnMenuFacetValues), Fe = a.derived(() => P().columnMenuVisibleFacets), X = a.derived(() => P().columnMenuFacetOptions), Ie = a.derived(() => P().columnMenuSelectedFacets), Le = a.derived(() => P().setFacetSelection), Re = a.derived(() => P().setFilterTokens), Z = a.derived(() => P().inSuggestOptions), ze = a.derived(() => P().openInSuggest), Be = a.derived(() => P().closeInSuggest), Ve = a.derived(() => P().isAllFacetsChecked), He = a.derived(() => P().toggleAllFacets), Ue = 40;
 	function We(e, t) {
-		a.get(ze)(e, t), P().inSuggestQuery = r(e.value);
+		a.get(ze)(e, t), P().inSuggestQuery = n(e.value);
 	}
 	function Ge(e, t) {
-		P().inSuggestQuery = r(e.value), P().inSuggestFor !== t && a.get(ze)(e, t);
+		P().inSuggestQuery = n(e.value), P().inSuggestFor !== t && a.get(ze)(e, t);
 	}
 	function Ke(e) {
 		return e.map((e) => ({
@@ -392,16 +392,16 @@ function oe(oe, N) {
 		a.get(V) && e(mt);
 	});
 	var ht = a.sibling(pt, 2), gt = (t) => {
-		let i = a.derived(() => a.get(Ce)), o = a.derived(() => new Set(n(a.get(Se)[a.get(i)] ?? "")));
+		let i = a.derived(() => a.get(Ce)), o = a.derived(() => new Set(r(a.get(Se)[a.get(i)] ?? "")));
 		var s = re(), c = a.child(s), l = (t) => {
 			{
-				let n = a.derived(() => a.get(Z).length > 40);
+				let r = a.derived(() => a.get(Z).length > 40);
 				e(t, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
 					get virtual() {
-						return a.get(n);
+						return a.get(r);
 					},
 					rows: 8,
 					rowHeight: 26,
@@ -414,8 +414,8 @@ function oe(oe, N) {
 						return a.get(o);
 					},
 					onChange: (e) => {
-						let t = new Set(e), n = r(a.get(Se)[a.get(i)] ?? "");
-						n && t.delete(n), a.get(Re)(a.get(i), [...t]), P().inSuggestQuery = "";
+						let t = new Set(e), r = n(a.get(Se)[a.get(i)] ?? "");
+						r && t.delete(r), a.get(Re)(a.get(i), [...t]), P().inSuggestQuery = "";
 					}
 				});
 			}

package/dist/cdn/{GridMenus-T-bZNprc.js → GridMenus-DL1zrDwf.js}

@@ -1,4 +1,4 @@
-import { Gn as e, io as t, no as n, ro as r } from "./src-Cm7C_WOZ.js";
+import { Gn as e, ao as t, io as n, ro as r } from "./src-M2NfKnjX.js";
 import { E as i, F as a, G as o, H as s, I as c, L as l, N as u, Q as d, U as f, V as p, X as m, Y as h, Z as g, _, d as v, et as y, f as b, ft as x, g as S, h as ee, j as C, k as w, lt as T, m as E, mt as D, nt as O, o as k, pt as A, st as j, t as te, tt as M, u as N, ut as P, v as F } from "./disclose-version-Dr7rEVv-.js";
 import { l as ne } from "./SvDateTimePicker-CRQH_U7E.js";
 //#region src/GridMenus.svelte
@@ -172,10 +172,10 @@ function V(l, p) {
 	});
 	let $e = j(() => H().autosizeColumn), et = j(() => H().autosizeAllColumns), tt = j(() => H().resetColumns), nt = j(() => H().openChooseColumns), rt = j(() => H().sortColumnFromMenu), it = j(() => H().clearColumnSort), at = j(() => H().groupByColumnFromMenu), ot = j(() => H().clearGroupingFromMenu), st = j(() => H().columnMenuFacetValues), ct = j(() => H().columnMenuVisibleFacets), lt = j(() => H().columnMenuFacetOptions), ut = j(() => H().columnMenuSelectedFacets), dt = j(() => H().setFacetSelection), ft = j(() => H().setFilterTokens), pt = j(() => H().inSuggestOptions), mt = j(() => H().openInSuggest), ht = j(() => H().closeInSuggest), gt = j(() => H().isAllFacetsChecked), _t = j(() => H().toggleAllFacets), vt = 40;
 	function yt(e, t) {
-		o(mt)(e, t), H().inSuggestQuery = r(e.value);
+		o(mt)(e, t), H().inSuggestQuery = n(e.value);
 	}
 	function bt(e, t) {
-		H().inSuggestQuery = r(e.value), H().inSuggestFor !== t && o(mt)(e, t);
+		H().inSuggestQuery = n(e.value), H().inSuggestFor !== t && o(mt)(e, t);
 	}
 	function xt(e) {
 		return e.map((e) => ({
@@ -391,16 +391,16 @@ function V(l, p) {
 		o(q) && e(Gt);
 	});
 	var Kt = O(Wt, 2), qt = (t) => {
-		let i = j(() => o(Xe)), c = j(() => new Set(n(o(Ye)[o(i)] ?? "")));
+		let i = j(() => o(Xe)), c = j(() => new Set(r(o(Ye)[o(i)] ?? "")));
 		var l = Te(), u = y(l), d = (t) => {
 			{
-				let n = j(() => o(pt).length > 40);
+				let r = j(() => o(pt).length > 40);
 				e(t, {
 					block: !0,
 					checkbox: !0,
 					multiple: !0,
 					get virtual() {
-						return o(n);
+						return o(r);
 					},
 					rows: 8,
 					rowHeight: 26,
@@ -413,8 +413,8 @@ function V(l, p) {
 						return o(c);
 					},
 					onChange: (e) => {
-						let t = new Set(e), n = r(o(Ye)[o(i)] ?? "");
-						n && t.delete(n), o(ft)(o(i), [...t]), H().inSuggestQuery = "";
+						let t = new Set(e), r = n(o(Ye)[o(i)] ?? "");
+						r && t.delete(r), o(ft)(o(i), [...t]), H().inSuggestQuery = "";
 					}
 				});
 			}