@svgrid/grid 2.6.1 → 2.6.2

package/dist/filtering/excel-filters.js

@@ -118,60 +118,90 @@ function scanInTokens(value) {
     }
     return { tokens, trailing: take() };
 }
-export function applyExcelFilter(cellValue, filter, options) {
-    const text = String(cellValue ?? '');
-    const normalizedText = normalizeForFilter(text, options?.locale);
-    const normalizedValue = normalizeForFilter(String(filter.value ?? ''), options?.locale);
+/**
+ * Compile a filter once, then test many rows against it.
+ *
+ * Everything that depends only on the FILTER - folding the needle, splitting
+ * `in` tokens, building the regex, coercing range endpoints - happens here,
+ * so the per-row closure does the minimum. Filtering 100k rows used to redo
+ * all of it 100k times.
+ *
+ * `applyExcelFilter` is defined in terms of this, so there is exactly one
+ * copy of the operator semantics.
+ */
+export function compileExcelFilter(filter, options) {
+    const locale = options?.locale;
+    const fold = (v) => normalizeForFilter(String(v ?? ''), locale);
+    const needle = fold(filter.value);
     switch (filter.operator) {
         case 'contains':
-            return normalizedText.includes(normalizedValue);
+            return (cellValue) => fold(cellValue).includes(needle);
         case 'notContains':
             // An empty needle is no constraint (mirrors `contains` returning true),
             // so nothing is excluded until the user types something.
-            return normalizedValue === '' || !normalizedText.includes(normalizedValue);
+            if (needle === '')
+                return () => true;
+            return (cellValue) => !fold(cellValue).includes(needle);
         case 'equals':
-            return normalizedText === normalizedValue;
+            return (cellValue) => fold(cellValue) === needle;
         case 'notEquals':
-            return normalizedValue === '' || normalizedText !== normalizedValue;
+            if (needle === '')
+                return () => true;
+            return (cellValue) => fold(cellValue) !== needle;
         case 'startsWith':
-            return normalizedText.startsWith(normalizedValue);
+            return (cellValue) => fold(cellValue).startsWith(needle);
         case 'endsWith':
-            return normalizedText.endsWith(normalizedValue);
+            return (cellValue) => fold(cellValue).endsWith(needle);
         case 'regex': {
             // Case-insensitive by default (matches the accent/case-folded feel of
             // the other text operators). An invalid pattern matches nothing rather
             // than throwing, so a half-typed regex never crashes the row model.
+            // Note this tests the RAW text, not the folded text.
             const pattern = String(filter.value ?? '');
             if (!pattern)
-                return true;
+                return () => true;
+            let re;
             try {
-                return new RegExp(pattern, 'i').test(text);
+                re = new RegExp(pattern, 'i');
             }
             catch {
-                return false;
+                return () => false;
             }
+            return (cellValue) => re.test(String(cellValue ?? ''));
         }
         case 'in':
         case 'notIn': {
             const tokens = splitInTokens(filter.value);
             if (tokens.length === 0)
-                return true;
-            const hit = tokens.some((t) => normalizeForFilter(t, options?.locale) === normalizedText);
-            return filter.operator === 'in' ? hit : !hit;
+                return () => true;
+            // A Set of pre-folded tokens turns the old per-row `tokens.some(...)`
+            // (which re-folded every token for every row) into one lookup.
+            const wanted = new Set(tokens.map((t) => normalizeForFilter(t, locale)));
+            if (filter.operator === 'in')
+                return (cellValue) => wanted.has(fold(cellValue));
+            return (cellValue) => !wanted.has(fold(cellValue));
         }
         case 'greaterThan': {
-            const a = Number(cellValue);
             const b = Number(filter.value);
-            if (Number.isFinite(a) && Number.isFinite(b))
-                return a > b;
-            return String(cellValue ?? '') > String(filter.value ?? '');
+            const bFinite = Number.isFinite(b);
+            const bText = String(filter.value ?? '');
+            return (cellValue) => {
+                const a = Number(cellValue);
+                if (bFinite && Number.isFinite(a))
+                    return a > b;
+                return String(cellValue ?? '') > bText;
+            };
         }
         case 'lessThan': {
-            const a = Number(cellValue);
             const b = Number(filter.value);
-            if (Number.isFinite(a) && Number.isFinite(b))
-                return a < b;
-            return String(cellValue ?? '') < String(filter.value ?? '');
+            const bFinite = Number.isFinite(b);
+            const bText = String(filter.value ?? '');
+            return (cellValue) => {
+                const a = Number(cellValue);
+                if (bFinite && Number.isFinite(a))
+                    return a < b;
+                return String(cellValue ?? '') < bText;
+            };
         }
         case 'between': {
             // Two paths: numeric (coerce both endpoints with the historical
@@ -181,21 +211,26 @@ export function applyExcelFilter(cellValue, filter, options) {
             // see the historical inclusive-range behaviour.
             const lo = filter.value == null ? 0 : Number(filter.value);
             const hi = filter.valueTo == null ? 0 : Number(filter.valueTo);
-            const a = Number(cellValue ?? 0);
-            if (Number.isFinite(a) && Number.isFinite(lo) && Number.isFinite(hi)) {
-                return a >= lo && a <= hi;
-            }
+            const rangeFinite = Number.isFinite(lo) && Number.isFinite(hi);
             // Either endpoint is non-numeric (ISO date string, etc). Compare
             // lexicographically - YYYY-MM-DD orders chronologically so the
             // result matches user intent.
-            const s = String(cellValue ?? '');
             const sl = String(filter.value ?? '');
             const sh = String(filter.valueTo ?? '');
-            return s >= sl && s <= sh;
+            return (cellValue) => {
+                const a = Number(cellValue ?? 0);
+                if (rangeFinite && Number.isFinite(a))
+                    return a >= lo && a <= hi;
+                const s = String(cellValue ?? '');
+                return s >= sl && s <= sh;
+            };
         }
         case 'isBlank':
-            return text.trim().length === 0;
+            return (cellValue) => String(cellValue ?? '').trim().length === 0;
         case 'isNotBlank':
-            return text.trim().length > 0;
+            return (cellValue) => String(cellValue ?? '').trim().length > 0;
     }
 }
+export function applyExcelFilter(cellValue, filter, options) {
+    return compileExcelFilter(filter, options)(cellValue);
+}

package/dist/index.d.ts

@@ -214,7 +214,7 @@ export { createColumnVirtualizer } from './virtualization/column-virtualizer';
 export type { VirtualItem, VirtualizerOptions, VirtualizerState } from './virtualization/types';
 export type { SvGridApi, SvGridFilterOperator, SvGridWrapperProps } from './svgrid-wrapper.types';
 export { parseEditorValue, normalizeEditorOptions, type CellEditorType, type CellEditorOption, } from './editors/cell-editors';
-export { applyExcelFilter, normalizeForFilter, splitInTokens, joinInTokens, trailingInToken, type ExcelFilter, type ExcelFilterOperator, type ExcelFilterOptions, } from './filtering/excel-filters';
+export { applyExcelFilter, compileExcelFilter, normalizeForFilter, splitInTokens, joinInTokens, trailingInToken, type CompiledExcelFilter, type ExcelFilter, type ExcelFilterOperator, type ExcelFilterOptions, } from './filtering/excel-filters';
 export { getGridCellDomId, getGridCellA11yProps, getGridHeaderA11yProps, getGridRootA11yProps, getGridRowA11yProps, type GridCellA11yInput, type GridColumnA11yInput, type GridSortDirection, } from './a11y';
 /**
  * Compatibility alias for teams migrating from `createTable`.

package/dist/index.js

@@ -249,7 +249,7 @@ export { createVirtualizer } from './virtualization/virtualizer';
 export { createSvelteVirtualizer } from './virtualization/svelte-virtualizer.svelte';
 export { createColumnVirtualizer } from './virtualization/column-virtualizer';
 export { parseEditorValue, normalizeEditorOptions, } from './editors/cell-editors';
-export { applyExcelFilter, normalizeForFilter, splitInTokens, joinInTokens, trailingInToken, } from './filtering/excel-filters';
+export { applyExcelFilter, compileExcelFilter, normalizeForFilter, splitInTokens, joinInTokens, trailingInToken, } from './filtering/excel-filters';
 export { getGridCellDomId, getGridCellA11yProps, getGridHeaderA11yProps, getGridRootA11yProps, getGridRowA11yProps, } from './a11y';
 /**
  * Compatibility alias for teams migrating from `createTable`.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svgrid/grid",
-  "version": "2.6.1",
+  "version": "2.6.2",
   "description": "Svelte 5-native data grid and data table. Headless-first engine with virtual scrolling for 100k+ rows, Excel-style filtering, inline editing, grouping, tree data, pivot, and server-side data. Drop-in <SvGrid> component. TypeScript, SSR-ready.",
   "author": "jQWidgets <boikom@jqwidgets.com>",
   "license": "MIT",
@@ -98,6 +98,15 @@
     "src",
     "themes"
   ],
+  "scripts": {
+    "clean": "rimraf ./build && rimraf ./dist",
+    "test:eslint": "eslint ./src",
+    "test:types": "svelte-check --tsconfig ./tsconfig.json",
+    "test:lib": "vitest run --coverage",
+    "test:build": "publint --strict",
+    "build": "svelte-package --input ./src --output ./dist && node ../../tools/strip-dist-tests.mjs ./dist && node ./scripts/build-cdn.mjs && node ./scripts/build-themes.mjs",
+    "lint": "eslint ./src"
+  },
   "devDependencies": {
     "@sveltejs/package": "^2.5.7",
     "@sveltejs/vite-plugin-svelte": "^7.0.0",
@@ -110,14 +119,5 @@
   },
   "peerDependencies": {
     "svelte": "^5.0.0"
-  },
-  "scripts": {
-    "clean": "rimraf ./build && rimraf ./dist",
-    "test:eslint": "eslint ./src",
-    "test:types": "svelte-check --tsconfig ./tsconfig.json",
-    "test:lib": "vitest run --coverage",
-    "test:build": "publint --strict",
-    "build": "svelte-package --input ./src --output ./dist && node ../../tools/strip-dist-tests.mjs ./dist && node ./scripts/build-cdn.mjs && node ./scripts/build-themes.mjs",
-    "lint": "eslint ./src"
   }
-}
+}

package/src/FlexRender.svelte

@@ -1,96 +1,96 @@
-<script
-  lang="ts"
-  generics="TData extends RowData"
->
-  import { isFunction } from './core'
-  import {
-    RenderComponentConfig,
-    RenderSnippetConfig,
-  } from './render-component'
-  import type {
-    Cell,
-    CellContext,
-    ColumnDefTemplate,
-    Header,
-    HeaderContext,
-    RowData,
-  } from './core'
-
-  type Props =
-    | {
-        content?: ColumnDefTemplate<
-          | HeaderContext<TData>
-          | CellContext<TData>
-        >
-        context:
-          | HeaderContext<TData>
-          | CellContext<TData>
-        cell?: never
-        header?: never
-        footer?: never
-      }
-    | {
-        cell: Cell<TData>
-        content?: never
-        context?: never
-        header?: never
-        footer?: never
-      }
-    | {
-        header: Header<TData>
-        content?: never
-        context?: never
-        cell?: never
-        footer?: never
-      }
-    | {
-        footer: Header<TData>
-        content?: never
-        context?: never
-        cell?: never
-        header?: never
-      }
-
-  let props: Props = $props()
-
-  const resolved = $derived.by(() => {
-    if ('cell' in props && props.cell) {
-      return {
-        content: props.cell.column.columnDef.cell,
-        context: props.cell.getContext(),
-      }
-    }
-    if ('header' in props && props.header) {
-      return {
-        content: props.header.column.columnDef.header,
-        context: props.header.getContext(),
-      }
-    }
-    if ('footer' in props && props.footer) {
-      return {
-        content: props.footer.column.columnDef.footer,
-        context: props.footer.getContext(),
-      }
-    }
-    return {
-      content: props.content,
-      context: props.context,
-    }
-  })
-
-  const result = $derived(
-    isFunction(resolved.content)
-      ? resolved.content(resolved.context as any)
-      : undefined,
-  )
-</script>
-
-{#if typeof resolved.content === 'string'}
-  {resolved.content}
-{:else if result instanceof RenderComponentConfig}
-  <result.component {...result.props} />
-{:else if result instanceof RenderSnippetConfig}
-  {@render result.snippet(result.params)}
-{:else if result !== undefined}
-  {result}
-{/if}
+<script
+  lang="ts"
+  generics="TData extends RowData"
+>
+  import { isFunction } from './core'
+  import {
+    RenderComponentConfig,
+    RenderSnippetConfig,
+  } from './render-component'
+  import type {
+    Cell,
+    CellContext,
+    ColumnDefTemplate,
+    Header,
+    HeaderContext,
+    RowData,
+  } from './core'
+
+  type Props =
+    | {
+        content?: ColumnDefTemplate<
+          | HeaderContext<TData>
+          | CellContext<TData>
+        >
+        context:
+          | HeaderContext<TData>
+          | CellContext<TData>
+        cell?: never
+        header?: never
+        footer?: never
+      }
+    | {
+        cell: Cell<TData>
+        content?: never
+        context?: never
+        header?: never
+        footer?: never
+      }
+    | {
+        header: Header<TData>
+        content?: never
+        context?: never
+        cell?: never
+        footer?: never
+      }
+    | {
+        footer: Header<TData>
+        content?: never
+        context?: never
+        cell?: never
+        header?: never
+      }
+
+  let props: Props = $props()
+
+  const resolved = $derived.by(() => {
+    if ('cell' in props && props.cell) {
+      return {
+        content: props.cell.column.columnDef.cell,
+        context: props.cell.getContext(),
+      }
+    }
+    if ('header' in props && props.header) {
+      return {
+        content: props.header.column.columnDef.header,
+        context: props.header.getContext(),
+      }
+    }
+    if ('footer' in props && props.footer) {
+      return {
+        content: props.footer.column.columnDef.footer,
+        context: props.footer.getContext(),
+      }
+    }
+    return {
+      content: props.content,
+      context: props.context,
+    }
+  })
+
+  const result = $derived(
+    isFunction(resolved.content)
+      ? resolved.content(resolved.context as any)
+      : undefined,
+  )
+</script>
+
+{#if typeof resolved.content === 'string'}
+  {resolved.content}
+{:else if result instanceof RenderComponentConfig}
+  <result.component {...result.props} />
+{:else if result instanceof RenderSnippetConfig}
+  {@render result.snippet(result.params)}
+{:else if result !== undefined}
+  {result}
+{/if}