@svgrid/grid 2.6.3 → 2.6.5

package/dist/filtering/row-predicate.js

@@ -0,0 +1,55 @@
+/**
+ * Apply a row predicate across a depth-ordered row list, keeping group banners
+ * consistent with what survives beneath them.
+ *
+ * The row list interleaves group banners with their descendants, banner first.
+ * A predicate written by a user is about DATA, so it is only tested against
+ * leaf rows; a banner then survives only if something under it did. Testing a
+ * banner directly would drop whole groups because its cells are aggregates, not
+ * row values.
+ *
+ * Note the existing column-filter and facet stages do test banners directly.
+ * That is a separate pre-existing inconsistency; this helper is written to be
+ * reusable if those are ever brought in line, but changing them is deliberately
+ * not bundled into the advanced filter.
+ */
+/** Apply `keep` to leaf rows, dropping banners left with no surviving child. */
+export function applyRowPredicate(rows, keep, isGroup) {
+    // Fast path: no grouping in play, so every row is a leaf.
+    let hasGroup = false;
+    for (const row of rows) {
+        if (isGroup(row)) {
+            hasGroup = true;
+            break;
+        }
+    }
+    if (!hasGroup)
+        return rows.filter(keep);
+    // One reverse pass. `survivorsBelow` counts leaves kept since we last closed
+    // out a banner, so a banner is kept when anything after it survived.
+    const keepFlags = new Array(rows.length).fill(false);
+    let survivorsSinceBanner = 0;
+    for (let i = rows.length - 1; i >= 0; i -= 1) {
+        const row = rows[i];
+        if (isGroup(row)) {
+            if (survivorsSinceBanner > 0) {
+                keepFlags[i] = true;
+                // The banner itself counts as surviving content for any banner above
+                // it, so nested groups keep their ancestors.
+                survivorsSinceBanner = 1;
+            }
+            else {
+                keepFlags[i] = false;
+            }
+        }
+        else if (keep(row)) {
+            keepFlags[i] = true;
+            survivorsSinceBanner += 1;
+        }
+    }
+    const out = [];
+    for (let i = 0; i < rows.length; i += 1)
+        if (keepFlags[i])
+            out.push(rows[i]);
+    return out;
+}

package/dist/grid-messages.d.ts

@@ -22,6 +22,13 @@ export type GridMessages = {
     total: string;
     rowsSuffix: string;
     rowSuffix: string;
+    announceFilterResults: string;
+    announceNoMatches: string;
+    announceFiltersCleared: string;
+    announceRowsSelected: string;
+    announceSelectionCleared: string;
+    advancedFilterActive: string;
+    advancedFilterClear: string;
     opContains: string;
     opNotContains: string;
     opEquals: string;

package/dist/grid-messages.js

@@ -33,6 +33,13 @@ export const defaultGridMessages = {
     total: 'Total',
     rowsSuffix: 'rows',
     rowSuffix: 'row',
+    announceFilterResults: '{visible} of {total} rows match the current filters',
+    announceNoMatches: 'No rows match the current filters',
+    announceFiltersCleared: 'Filters cleared, showing all {total} rows',
+    announceRowsSelected: '{count} rows selected',
+    announceSelectionCleared: 'Selection cleared',
+    advancedFilterActive: 'Advanced filter',
+    advancedFilterClear: 'Clear advanced filter',
     menuCopy: 'Copy',
     menuCut: 'Cut',
     menuPaste: 'Paste',

package/dist/index.d.ts

@@ -215,6 +215,10 @@ export type { VirtualItem, VirtualizerOptions, VirtualizerState } from './virtua
 export type { SvGridApi, SvGridFilterOperator, SvGridWrapperProps } from './svgrid-wrapper.types';
 export { parseEditorValue, normalizeEditorOptions, type CellEditorType, type CellEditorOption, } from './editors/cell-editors';
 export { applyExcelFilter, compileExcelFilter, normalizeForFilter, splitInTokens, joinInTokens, trailingInToken, type CompiledExcelFilter, type ExcelFilter, type ExcelFilterOperator, type ExcelFilterOptions, } from './filtering/excel-filters';
+export { ALL_FILTER_OPERATORS, SET_OPERATOR_IDS, VALUELESS_OPERATOR_IDS, RANGE_OPERATOR_IDS, isSetOperator, isValuelessOperator, isRangeOperator, type FilterValueType, } from './filtering/filter-operator-catalogue';
+export { applyRowPredicate } from './filtering/row-predicate';
+export type { GridPredicateExpr, GridScalarExpr, GridComparisonOp, GridArithmeticOp, GridAggFn, } from './filtering/predicate-expr';
+export { registerAdvancedFilterEngine, getAdvancedFilterEngine, hasAdvancedFilterEngine, type AdvancedFilterEngine, type AdvancedFilterCompileContext, type CompiledRowPredicate, } from './advanced-filter.svelte';
 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

@@ -250,6 +250,11 @@ export { createSvelteVirtualizer } from './virtualization/svelte-virtualizer.sve
 export { createColumnVirtualizer } from './virtualization/column-virtualizer';
 export { parseEditorValue, normalizeEditorOptions, } from './editors/cell-editors';
 export { applyExcelFilter, compileExcelFilter, normalizeForFilter, splitInTokens, joinInTokens, trailingInToken, } from './filtering/excel-filters';
+export { ALL_FILTER_OPERATORS, SET_OPERATOR_IDS, VALUELESS_OPERATOR_IDS, RANGE_OPERATOR_IDS, isSetOperator, isValuelessOperator, isRangeOperator, } from './filtering/filter-operator-catalogue';
+export { applyRowPredicate } from './filtering/row-predicate';
+// Advanced-filter seam: enterprise registers the compiler, the grid owns the
+// state and the pipeline slot.
+export { registerAdvancedFilterEngine, getAdvancedFilterEngine, hasAdvancedFilterEngine, } from './advanced-filter.svelte';
 export { getGridCellDomId, getGridCellA11yProps, getGridHeaderA11yProps, getGridRootA11yProps, getGridRowA11yProps, } from './a11y';
 /**
  * Compatibility alias for teams migrating from `createTable`.

package/dist/server-data-source.d.ts

@@ -15,6 +15,7 @@
  * non-optimistic for now - the grid reflects a change only after the
  * follow-up re-fetch of the current page lands.
  */
+import type { GridPredicateExpr } from './filtering/predicate-expr';
 export type ServerSortModel = Array<{
     id: string;
     desc: boolean;
@@ -33,6 +34,24 @@ export type ServerFilterModel = {
         valueTo?: string;
         selectedValues?: string[];
     }>;
+    /**
+     * Advanced-filter predicate (Pro), as a JSON AST. Expresses what `columns`
+     * cannot: OR across columns, nesting, negation, two conditions on one
+     * column, cross-column comparison, and aggregates.
+     *
+     * CONTRACT - all or nothing. A backend that receives this MUST either:
+     *
+     *   (a) translate the WHOLE expression into its query, make `rowCount`
+     *       reflect it, and set `appliedExpression: true` on the result; or
+     *   (b) apply none of it and leave `appliedExpression` unset.
+     *
+     * Partial application is a contract violation, not a degraded mode: it
+     * returns a SUPERSET of the requested rows while the UI says the filter is
+     * on. That is strictly worse than not filtering, because nothing about the
+     * result looks wrong. When the ack is missing the grid says so rather than
+     * filtering the loaded page itself - see `ServerState.expressionUnapplied`.
+     */
+    expression?: GridPredicateExpr;
 };
 /** A value column to roll up per group. */
 export type ServerAggregation = {
@@ -137,6 +156,12 @@ export type ServerResult<TData> = {
     rows: ReadonlyArray<TData>;
     /** Total row count after filtering (for the pager). */
     rowCount: number;
+    /**
+     * Set `true` ONLY when `filterModel.expression` was applied in full. Leave it
+     * unset if you ignored the expression; the grid then warns rather than
+     * pretending the filter ran. See the contract on `ServerFilterModel.expression`.
+     */
+    appliedExpression?: boolean;
 };
 export type ServerDataSource<TData> = {
     getRows(request: ServerRequest): Promise<ServerResult<TData>>;
@@ -162,6 +187,15 @@ export type ServerState<TData> = {
     pageCount: number;
     sortModel: ServerSortModel;
     filterModel: ServerFilterModel;
+    /**
+     * True when an advanced-filter expression was sent but the source did not
+     * acknowledge applying it - so `rows` is unfiltered and the UI should say so.
+     * Surface this rather than hiding it: the rows look perfectly normal.
+     *
+     * Optional so existing code that builds a `ServerState` literal keeps
+     * compiling; the controller always sets it.
+     */
+    expressionUnapplied?: boolean;
 };
 export type ServerController<TData> = {
     /** Re-fetch the current page (e.g. after a mutation). */

package/dist/server-data-source.js

@@ -10,11 +10,15 @@ export function createServerDataSource(source, options) {
         pageCount: 1,
         sortModel: [],
         filterModel: {},
+        expressionUnapplied: false,
     };
     // Monotonic request id: only the latest fetch is allowed to land, so a slow
     // response for an old sort/filter can't clobber a newer one.
     let requestSeq = 0;
     let disposed = false;
+    // Once per controller: a misconfigured backend would otherwise log on every
+    // page, scroll and filter change.
+    let warnedExpressionUnapplied = false;
     const emit = () => {
         state.pageCount = Math.max(1, Math.ceil(state.total / state.pageSize));
         options.onChange({ ...state });
@@ -44,6 +48,21 @@ export function createServerDataSource(source, options) {
                 return; // stale
             state.rows = result.rows;
             state.total = result.rowCount;
+            // An expression was sent but the backend did not acknowledge applying it,
+            // so these rows are a SUPERSET of what was asked for. Say so instead of
+            // filtering the loaded page here: filtering one page would turn
+            // "3 of 1,000,000 match" into a confident lie and make paging incoherent,
+            // since page 2 would re-filter a different slice.
+            state.expressionUnapplied =
+                state.filterModel.expression != null && result.appliedExpression !== true;
+            if (state.expressionUnapplied && !warnedExpressionUnapplied) {
+                warnedExpressionUnapplied = true;
+                console.warn('[svgrid] The data source was sent filterModel.expression but did not ' +
+                    'return `appliedExpression: true`, so the advanced filter is NOT applied ' +
+                    'and the rows shown are unfiltered. Apply the whole expression and ' +
+                    'acknowledge it, or clear the advanced filter. ' +
+                    'See https://svgrid.com/docs/help/server/server-filtering');
+            }
             state.loading = false;
             emit();
         }

package/dist/svgrid-wrapper.types.d.ts

@@ -2,6 +2,7 @@ import type { CellFormatConfig, ColumnDef, RowData, SvGridOptions, TableFeatures
 import type { FilterOperator, Props } from './SvGrid.types';
 import type { GridExportOptions, GridClipboardOptions } from './export-format';
 import type { ChartSpec, ChartType } from './chart';
+import type { GridPredicateExpr } from './filtering/predicate-expr';
 export type SvGridFilterOperator = FilterOperator;
 /**
  * A serializable snapshot of everything that makes up the current "view":
@@ -36,6 +37,13 @@ export type SvGridViewState = {
     }>;
     /** Facet (Excel-style value checklist) selections, keyed by column id. */
     facetFilters: Record<string, string[]>;
+    /**
+     * Advanced-filter expression (Pro). OPTIONAL, and omitted entirely when no
+     * advanced filter is set - so views saved before this feature existed, and
+     * views from grids that never use it, round-trip byte-identical. An explicit
+     * `null` clears the filter on `setState`.
+     */
+    advancedFilter?: GridPredicateExpr | null;
     /** Built-in chart panel state (present only when `charting` is on): the
      *  ACTIVE chart, for back-compat + spread-and-tweak. */
     chart?: {
@@ -218,10 +226,25 @@ export type SvGridApi<TFeatures extends TableFeatures, TData extends RowData> =
      */
     refreshEditorOptions(columnId?: string): void;
     /**
-     * Clear every active column filter (menu, filter-row, set-list, and global).
-     * Resets the grid to "no filtering" in a single call.
+     * Clear every active column filter (menu, filter-row, set-list, global, and
+     * the advanced filter). Resets the grid to "no filtering" in a single call.
      */
     clearAllFilters(): void;
+    /**
+     * Set the advanced-filter expression (Pro). `null` clears it. Composed with
+     * AND after the global, column and facet filters.
+     *
+     * Rows are only removed once `@svgrid/enterprise`'s `enableAdvancedFilter()`
+     * has registered a compiler. Without it the expression is stored but nothing
+     * is filtered - use `isAdvancedFilterActive()` to tell the two apart.
+     */
+    setAdvancedFilter(expr: GridPredicateExpr | null): void;
+    /** The current advanced-filter expression, or `null`. */
+    getAdvancedFilter(): GridPredicateExpr | null;
+    /** Clear the advanced filter, leaving other filter surfaces untouched. */
+    clearAdvancedFilter(): void;
+    /** Whether an expression is set AND an engine is registered to run it. */
+    isAdvancedFilterActive(): boolean;
     /**
      * Read the active column-menu filters as a snapshot. Keyed by column id.
      * Returns an empty object when nothing is filtered. `valueTo` is only
@@ -233,9 +256,15 @@ export type SvGridApi<TFeatures extends TableFeatures, TData extends RowData> =
         valueTo?: string;
     }>;
     /**
-     * Snapshot of the rows the grid is actually displaying right now -
-     * after filtering, sorting, grouping, and pagination have been applied.
-     * Use this when you need to export the visible result set (e.g. CSV).
+     * Snapshot of the DATA rows the grid is displaying right now - after
+     * filtering, sorting, grouping and pagination. Use this when you need the
+     * visible result set (e.g. to export it as CSV).
+     *
+     * Group banner rows are not included: the return type is `TData`, and a
+     * banner is not one of your rows. That matters while grouping is on, because
+     * with every group collapsed this returns an EMPTY array even though the
+     * grid visibly shows a banner per group. Count banners from `getState()`
+     * rather than from the length of this.
      */
     getDisplayedRows(): ReadonlyArray<TData>;
     /** Snapshot of the current data array (pre-pipeline). */
@@ -256,6 +285,9 @@ export type SvGridApi<TFeatures extends TableFeatures, TData extends RowData> =
         format?: CellFormatConfig;
         /** Effective horizontal alignment ('left' | 'center' | 'right'). */
         align?: 'left' | 'center' | 'right';
+        /** The column's declared `editorType`, when set. Lets a filter or
+         *  expression UI offer type-appropriate operators. */
+        editorType?: string;
     }>;
     /**
      * Export the grid to a **CSV** file. Free in the community grid; the

package/dist/themes/index.js

@@ -81,16 +81,24 @@ export const themePresets = [
         light: { bg: '#ffffff', fg: '#282a30', muted: '#6b6f76', border: '#e9e9eb', headerBg: '#f7f8f8', headerFg: '#6b6f76', accent: '#5e6ad2', rowAlt: '#fbfbfc', rowHover: '#f4f4f5', selectionBg: '#e8eafd' },
         dark: { bg: '#08090a', fg: '#f7f8f8', muted: '#8a8f98', border: '#23252a', headerBg: '#0f1011', headerFg: '#8a8f98', accent: '#5e6ad2', rowAlt: '#0f1011', rowHover: '#1a1b1e', selectionBg: '#2a2d4a' } },
     { id: 'notion', name: 'Notion', radius: 4, font: 'ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif',
-        light: { bg: '#ffffff', fg: '#37352f', muted: '#787774', border: '#e9e9e7', headerBg: '#f7f6f3', headerFg: '#787774', accent: '#2383e2', rowAlt: '#fbfbfa', rowHover: '#f1f1ef', selectionBg: '#d9eaf7' },
+        // muted + headerFg darkened from #787774, which sat at 4.48:1 on white and
+        // 4.14:1 on the header fill - both just under AA. #6b6a67 keeps the warm
+        // grey and clears it at 5.41:1 / 5:1.
+        light: { bg: '#ffffff', fg: '#37352f', muted: '#6b6a67', border: '#e9e9e7', headerBg: '#f7f6f3', headerFg: '#6b6a67', accent: '#2383e2', rowAlt: '#fbfbfa', rowHover: '#f1f1ef', selectionBg: '#d9eaf7' },
         dark: { bg: '#191919', fg: '#d4d4d4', muted: '#9b9b9b', border: '#2f2f2f', headerBg: '#202020', headerFg: '#9b9b9b', accent: '#529cca', rowAlt: '#1c1c1c', rowHover: '#252525', selectionBg: '#20415c' } },
     { id: 'nord', name: 'Nord', radius: 4, font: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
         light: { bg: '#eceff4', fg: '#2e3440', muted: '#4c566a', border: '#d8dee9', headerBg: '#e5e9f0', headerFg: '#2e3440', accent: '#5579a5', rowAlt: '#e5e9f0', rowHover: '#dde3ec', selectionBg: '#d8dee9' },
-        dark: { bg: '#2e3440', fg: '#d8dee9', muted: '#4c566a', border: '#434c5e', headerBg: '#3b4252', headerFg: '#e5e9f0', accent: '#88c0d0', rowAlt: '#333b48', rowHover: '#3b4252', selectionBg: '#434c5e' } },
+        // muted lightened from Nord's #4c566a (nord3): on the nord0 background that
+        // is 1.69:1, effectively invisible. #97a0b0 keeps the Nord hue at 4.74:1.
+        dark: { bg: '#2e3440', fg: '#d8dee9', muted: '#97a0b0', border: '#434c5e', headerBg: '#3b4252', headerFg: '#e5e9f0', accent: '#88c0d0', rowAlt: '#333b48', rowHover: '#3b4252', selectionBg: '#434c5e' } },
     { id: 'dracula', name: 'Dracula', radius: 6, font: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
         light: { bg: '#fffbeb', fg: '#1f1f1f', muted: '#6c664b', border: '#dedccf', headerBg: '#ece9df', headerFg: '#1f1f1f', accent: '#644ac9', rowAlt: '#fffdf5', rowHover: '#f2efe3', selectionBg: '#cfcfde' },
-        dark: { bg: '#282a36', fg: '#f8f8f2', muted: '#6272a4', border: '#44475a', headerBg: '#21222c', headerFg: '#f8f8f2', accent: '#bd93f9', rowAlt: '#2d2f3b', rowHover: '#343746', selectionBg: '#44475a' } },
+        // muted lightened from Dracula's comment colour #6272a4 (3.03:1) to 5.04:1.
+        dark: { bg: '#282a36', fg: '#f8f8f2', muted: '#8b98c9', border: '#44475a', headerBg: '#21222c', headerFg: '#f8f8f2', accent: '#bd93f9', rowAlt: '#2d2f3b', rowHover: '#343746', selectionBg: '#44475a' } },
     { id: 'catppuccin', name: 'Catppuccin', radius: 8, font: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
-        light: { bg: '#eff1f5', fg: '#4c4f69', muted: '#6c6f85', border: '#ccd0da', headerBg: '#e6e9ef', headerFg: '#4c4f69', accent: '#8839ef', rowAlt: '#e6e9ef', rowHover: '#dce0e8', selectionBg: '#dce0e8' },
+        // muted moved from Latte subtext0 (#6c6f85, 4.37:1) to subtext1 (#5c5f77),
+        // still an official Catppuccin colour, at 5.53:1.
+        light: { bg: '#eff1f5', fg: '#4c4f69', muted: '#5c5f77', border: '#ccd0da', headerBg: '#e6e9ef', headerFg: '#4c4f69', accent: '#8839ef', rowAlt: '#e6e9ef', rowHover: '#dce0e8', selectionBg: '#dce0e8' },
         dark: { bg: '#1e1e2e', fg: '#cdd6f4', muted: '#a6adc8', border: '#313244', headerBg: '#181825', headerFg: '#cdd6f4', accent: '#cba6f7', rowAlt: '#1a1a28', rowHover: '#313244', selectionBg: '#45475a' } },
 ];
 /** The default preset (used when nothing is chosen). */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svgrid/grid",
-  "version": "2.6.3",
+  "version": "2.6.5",
   "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",
@@ -111,6 +111,7 @@
     "@sveltejs/package": "^2.5.7",
     "@sveltejs/vite-plugin-svelte": "^7.0.0",
     "@vitest/coverage-v8": "^4.1.5",
+    "axe-core": "^4.13.0",
     "eslint-plugin-svelte": "^3.17.1",
     "jsdom": "^29.1.1",
     "publint": "^0.3.21",

package/src/SvGrid.controller.svelte.ts

@@ -1,7 +1,10 @@
 import {
     applyGroupAggregate,
+    applyRowPredicate,
     compileExcelFilter,
     type CompiledExcelFilter,
+    getAdvancedFilterEngine,
+    type GridPredicateExpr,
     normalizeForFilter,
     createColumnVirtualizer,
     createCoreRowModel,
@@ -94,6 +97,11 @@ import {
     createClipboard,
   } from "./clipboard";
 import { resolveGridMessages } from "./grid-messages";
+import { announce } from "./a11y/live-region";
+import {
+  filterAnnouncement,
+  selectionAnnouncement,
+} from "./a11y/grid-announcements";
 import { getPivotEngine, hasPivotEngine } from "./pivot-view.svelte";
 import {
     filterOperatorOptions,
@@ -324,6 +332,13 @@ export function createSvGridController<
   let globalFilter = $state("");
   let scrollContainer: HTMLDivElement | null = $state(null);
   let gridRootEl: HTMLElement | null = $state(null);
+  // Advanced filter (Pro). Seeded once from `initialAdvancedFilter` and driven
+  // thereafter through the API - deliberately NOT a live prop, so it cannot
+  // repeat the `externalFilter` trap of looking controlled while being read
+  // exactly once.
+  let advancedFilter = $state<GridPredicateExpr | null>(
+    props.initialAdvancedFilter ?? null,
+  );
   let filterRowValues = $state<Record<string, string>>({});
   let filterMenuValues = $state<
     Record<
@@ -712,13 +727,15 @@ export function createSvGridController<
     },
     state: {
       columnFilters: [],
-      grouping: [],
+      // svelte-ignore state_referenced_locally
+      grouping: treeDataConfig ? [] : [...(props.groupBy ?? [])],
       // svelte-ignore state_referenced_locally
       sorting: props.initialSorting ?? [],
       // svelte-ignore state_referenced_locally
       pagination: { pageIndex: 0, pageSize: props.pageSize ?? 10 },
       rowSelection: {},
-      expanded: {},
+      // svelte-ignore state_referenced_locally
+      expanded: { ...(props.expanded ?? {}) },
       activeCell: { rowIndex: 0, colIndex: 0, cellId: null },
     },
   });
@@ -781,6 +798,42 @@ export function createSvGridController<
     userColumnOrder = props.columnOrder ? [...props.columnOrder] : [];
   });
 
+  // `groupBy` prop -> engine grouping state. Same shape as the `columnOrder`
+  // re-seed above: we only write when the PROP itself changes, so a group-by
+  // set from the column menu or `api.setGroupBy()` is not clobbered on the next
+  // unrelated re-render.
+  let lastSeededGroupBy = (props.groupBy ?? []).join("|");
+  $effect(() => {
+    if (treeDataConfig) return;
+    const incoming = (props.groupBy ?? []).join("|");
+    if (incoming === lastSeededGroupBy) return;
+    lastSeededGroupBy = incoming;
+    grid.setGrouping(() => [...(props.groupBy ?? [])]);
+  });
+
+  // `expanded` prop -> engine expansion state, and the store -> the
+  // `onExpandedChange` callback. `lastSeededExpanded` is written from BOTH
+  // directions so a controlled parent that echoes the callback value straight
+  // back into the prop does not trigger a redundant re-seed (and so no
+  // prop -> state -> callback -> prop loop can form).
+  let lastSeededExpanded = JSON.stringify(props.expanded ?? {});
+  $effect(() => {
+    const incoming = JSON.stringify(props.expanded ?? {});
+    if (incoming === lastSeededExpanded) return;
+    lastSeededExpanded = incoming;
+    grid.setExpanded(() => ({ ...(props.expanded ?? {}) }));
+  });
+  $effect(() => {
+    let previous = grid.getState().expanded ?? {};
+    return grid.store.subscribe(() => {
+      const next = grid.getState().expanded ?? {};
+      if (next === previous) return;
+      previous = next;
+      lastSeededExpanded = JSON.stringify(next);
+      props.onExpandedChange?.({ ...next });
+    });
+  });
+
   // Declared here rather than beside the other pagination/state derivations:
   // the auto-group column pipeline below reads it, and a `const` used above its
   // declaration is a type error even though `$derived` is lazy enough at runtime.
@@ -1345,6 +1398,32 @@ export function createSvGridController<
       );
     }
 
+    // --- Advanced filter (Pro) ---------------------------------------------
+    // Runs LAST for two reasons: it evaluates over the smallest row set, and
+    // its aggregates (`SUM(amount) > 1000`) fold over what the user is
+    // currently looking at rather than the raw dataset. Composed with AND
+    // against the three stages above.
+    //
+    // Fails OPEN throughout. No engine registered (enterprise absent), an
+    // expression the engine cannot compile, or a throw from inside it all
+    // leave `rows` untouched. A half-applied filter that quietly shows the
+    // wrong rows is worse than one that visibly did nothing.
+    if (advancedFilter) {
+      const engine = getAdvancedFilterEngine();
+      if (engine) {
+        try {
+          const predicate = engine(advancedFilter, {
+            getValue: getRowColumnValue,
+            locale: props.filterLocale ?? props.localization?.locale,
+            rows,
+          });
+          if (predicate) rows = applyRowPredicate(rows, predicate, isGroupRow);
+        } catch {
+          // Malformed expression: leave the rows alone.
+        }
+      }
+    }
+
     return rows;
   });
 
@@ -1639,6 +1718,92 @@ export function createSvGridController<
   // map every consumer (SvGrid.svelte, GridFooter, menus, filter labels) reads.
   const gridMessages = $derived(resolveGridMessages(props.localization?.text));
 
+  // ---- Screen-reader status announcements (WCAG 4.1.3) ----
+  // Only genuine status messages belong here: information no focus change
+  // reveals. `a11y/grid-announcements.ts` documents what is deliberately left
+  // unsaid, and why saying it would make the grid talk over itself.
+
+  /** Data rows before any local filtering - the denominator in "12 of 250". */
+  const unfilteredRowTotal = $derived.by(() => {
+    dataStateVersion;
+    void internalData;
+    return grid.getRowModel().rows.length;
+  });
+
+  /** Whether any of the five filter surfaces is currently narrowing the rows. */
+  const anyFilterActive = $derived(
+    globalFilter !== "" ||
+      advancedFilter !== null ||
+      Object.keys(filterRowValues).length > 0 ||
+      Object.keys(filterMenuValues).length > 0 ||
+      Object.keys(valueFilters).length > 0,
+  );
+
+  let filtersWereActive = false;
+  let filterAnnounceTimer: ReturnType<typeof setTimeout> | undefined;
+
+  $effect(() => {
+    // In external-filter mode the server decides what matched, so the local
+    // counts describe only the page in hand. Announcing them would misreport
+    // the result set, which is worse than staying silent.
+    if (externalFilterEnabled) return;
+
+    const visible = paginatedRowTotal;
+    const total = unfilteredRowTotal;
+    const active = anyFilterActive;
+    const messages = gridMessages;
+
+    untrack(() => {
+      const message = filterAnnouncement(
+        visible,
+        total,
+        active,
+        filtersWereActive,
+        messages,
+      );
+      filtersWereActive = active;
+      if (!message) return;
+      // Typing in the global filter re-runs this per keystroke. A polite region
+      // queues rather than replaces, so without a debounce the user hears the
+      // count for every prefix they typed before the one they care about.
+      clearTimeout(filterAnnounceTimer);
+      filterAnnounceTimer = setTimeout(() => announce(message), 400);
+    });
+
+    return () => clearTimeout(filterAnnounceTimer);
+  });
+
+  // Forward advanced-filter changes to the consumer. Same dedupe-and-skip-first
+  // pattern as the selection forwarder: the panel that authors the expression
+  // lives outside the grid, so a change the grid makes itself (the toolbar's
+  // clear, clearAllFilters) is invisible to it otherwise.
+  let lastAdvancedFilterSerialized = JSON.stringify(
+    untrack(() => advancedFilter) ?? null,
+  );
+  $effect(() => {
+    const serialized = JSON.stringify(advancedFilter ?? null);
+    if (serialized === untrack(() => lastAdvancedFilterSerialized)) return;
+    untrack(() => {
+      lastAdvancedFilterSerialized = serialized;
+      props.onAdvancedFilterChange?.(advancedFilter ?? null);
+    });
+  });
+
+  let lastAnnouncedSelectionCount = 0;
+  $effect(() => {
+    const count = Object.values(rowSelectionState).filter(Boolean).length;
+    const messages = gridMessages;
+    untrack(() => {
+      const message = selectionAnnouncement(
+        lastAnnouncedSelectionCount,
+        count,
+        messages,
+      );
+      lastAnnouncedSelectionCount = count;
+      if (message) announce(message);
+    });
+  });
+
   // ---- In-grid pivot mode ----
   // The pivot ENGINE ships in @svgrid/enterprise (registered via the pivot-view
   // seam). When `pivot` is set and the engine is present, the grid runs it over
@@ -3089,6 +3254,8 @@ export function createSvGridController<
     set filterRowValues(v) { filterRowValues = v as never; },
     get filterMenuValues() { return filterMenuValues; },
     set filterMenuValues(v) { filterMenuValues = v as never; },
+    get advancedFilter() { return advancedFilter; },
+    set advancedFilter(v) { advancedFilter = v as never; },
     get verticalScrollbarEl() { return verticalScrollbarEl; },
     set verticalScrollbarEl(v) { verticalScrollbarEl = v as never; },
     get horizontalScrollbarEl() { return horizontalScrollbarEl; },

package/src/SvGrid.css

@@ -122,6 +122,38 @@
   border-color: var(--sg-accent, #2563eb);
   color: #fff;
 }
+/* Advanced-filter indicator. Reads as state rather than as another action, so
+   it uses the accent fill the toolbar buttons reserve for `is-active` instead
+   of the neutral button shell. */
+.sv-grid-advf-chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 5px 6px 5px 11px;
+  border-radius: 999px;
+  border: 1px solid color-mix(in srgb, var(--sg-accent, #2563eb) 35%, transparent);
+  background: color-mix(in srgb, var(--sg-accent, #2563eb) 12%, transparent);
+  color: var(--sg-accent, #2563eb);
+  font-size: 12.5px;
+  font-weight: 600;
+}
+.sv-grid-advf-clear {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 18px;
+  height: 18px;
+  border: 0;
+  border-radius: 999px;
+  background: transparent;
+  color: inherit;
+  font-size: 11px;
+  cursor: pointer;
+  transition: background-color 120ms ease;
+}
+.sv-grid-advf-clear:hover {
+  background: color-mix(in srgb, var(--sg-accent, #2563eb) 25%, transparent);
+}
 .sv-grid-tool-panel {
   position: absolute;
   top: 0;