@rozie-ui/data-table-solid 0.7.4 → 0.8.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rozie-ui/data-table-solid",
-  "version": "0.7.4",
+  "version": "0.8.1",
   "type": "module",
   "private": false,
   "license": "MIT",
@@ -48,7 +48,7 @@
   ],
   "dependencies": {
     "@solid-primitives/keyed": "^1.5.3",
-    "@rozie/runtime-solid": "^0.10.0"
+    "@rozie/runtime-solid": "^0.10.1"
   },
   "peerDependencies": {
     "solid-js": "^1.8",

package/src/Column.tsx

@@ -45,6 +45,14 @@ interface ColumnProps {
    * The table-core aggregation for this column inside a group-header cell. Either a built-in name string — `'sum'` | `'min'` | `'max'` | `'extent'` | `'mean'` | `'median'` | `'unique'` | `'uniqueCount'` | `'count'` — or a custom function `(columnId, leafRows, childRows) => any` (defensively wrapped by the parent so a throw cannot crash grouping). Null → no aggregation (the group-header cell renders as a placeholder).
    */
   aggregationFn?: (string | ((...args: any[]) => any)) | null;
+  /**
+   * The table-core filter rule for this column. Either a built-in name string (e.g. `'arrIncludesSome'`, `'equalsString'`) or a custom function `(value, filterValue, row) => boolean`, where `row` is the original data object. Null → table-core's auto rule for the column's value type.
+   */
+  filterFn?: (string | ((...args: any[]) => any)) | null;
+  /**
+   * The table-core sort rule for this column. Either a built-in name string (e.g. `'alphanumeric'`, `'basic'`) or a custom ascending comparator `(a, b, rowA, rowB) => number` over the cell values, with the original data objects as `rowA` / `rowB`. Null → table-core's auto rule for the column's value type.
+   */
+  sortingFn?: (string | ((...args: any[]) => any)) | null;
   /**
    * Whether this column's cells are editable (opt-in). Default `false` → the column is read-only and the display↔editor branch never mounts an editor. Bind `:editable="true"` (a bare attr only coerces on Vue+Lit).
    */
@@ -64,11 +72,13 @@ interface ColumnProps {
 }
 
 export default function Column(_props: ColumnProps): JSX.Element {
-  const _merged = mergeProps({ id: '', field: '', header: '', sortable: false, filterable: false, pinned: '', width: '', expandable: false, groupable: true, aggregationFn: null, editable: false, editor: 'text', editorOptions: (() => [])() as any[], validate: null }, _props);
-  const [local, attrs] = splitProps(_merged, ['id', 'field', 'header', 'sortable', 'filterable', 'pinned', 'width', 'expandable', 'groupable', 'aggregationFn', 'editable', 'editor', 'editorOptions', 'validate']);
+  const _merged = mergeProps({ id: '', field: '', header: '', sortable: false, filterable: false, pinned: '', width: '', expandable: false, groupable: true, aggregationFn: null, filterFn: null, sortingFn: null, editable: false, editor: 'text', editorOptions: (() => [])() as any[], validate: null }, _props);
+  const [local, attrs] = splitProps(_merged, ['id', 'field', 'header', 'sortable', 'filterable', 'pinned', 'width', 'expandable', 'groupable', 'aggregationFn', 'filterFn', 'sortingFn', 'editable', 'editor', 'editorOptions', 'validate']);
 
   const registry = useContext(rozieContext("data-table:columns"));
-  createEffect(on(() => (() => [local.id, local.field, local.header, local.sortable, local.filterable, local.pinned, local.width, local.expandable, local.groupable, local.aggregationFn, local.editable, local.editor, local.editorOptions, local.validate])(), (v) => untrack(() => (() => {
+  createEffect(on(() => (() => [local.id, local.field, local.header, local.sortable, local.filterable, local.pinned, local.width, local.expandable, local.groupable, local.aggregationFn, local.filterFn, local.sortingFn, local.editable, local.editor, local.editorOptions, local.validate])(), (v) => untrack(() => (() => {
+    latestFilterFn = local.filterFn;
+    latestSortingFn = local.sortingFn;
     if (reg) reg.registerColumn(colId(), buildSpec());
   })()), { defer: true }));
   onMount(() => {
@@ -109,6 +119,24 @@ export default function Column(_props: ColumnProps): JSX.Element {
   // REQ-30) and the $onMount registration never double-register the column.
   let registered = false;
 
+  // Stable trampolines for custom filterFn/sortingFn. An inline arrow is a new identity every
+  // consumer render; registering it directly would defeat the registerColumn equivalence guard
+  // (a function compares by source, but table-core would hold a stale closure). The spec holds
+  // ONE trampoline per column that always calls the latest function, refreshed in the re-register
+  // watch below BEFORE the equivalence check. A mutable top-level `let` (a ref on React).
+  // table-core reads `autoRemove` / `resolveFilterValue` OFF the filter function itself, so the
+  // filter trampoline carries stable forwarders that read the CURRENT latestFilterFn (absent on
+  // the consumer's fn => table-core's own defaults: never auto-remove, value passes through).
+  let latestFilterFn: any = null;
+  let latestSortingFn: any = null;
+  const filterTrampoline: any = Object.assign((...args: any[]) => typeof latestFilterFn === 'function' ? latestFilterFn(...args) : true, {
+    autoRemove: (value: any, column: any) => typeof latestFilterFn === 'function' && typeof latestFilterFn.autoRemove === 'function' ? latestFilterFn.autoRemove(value, column) : false,
+    resolveFilterValue: (value: any) => typeof latestFilterFn === 'function' && typeof latestFilterFn.resolveFilterValue === 'function' ? latestFilterFn.resolveFilterValue(value) : value
+  });
+  function sortingTrampoline(...args: any[]) {
+    return typeof latestSortingFn === 'function' ? latestSortingFn(...args) : 0;
+  }
+
   // the column SPEC builder — shared by the $onMount register and the late-context
   // $onUpdate below. Carries METADATA ONLY (no cell/header render callbacks — D-A moved
   // per-cell rendering to the parent's #cell/#header scoped slot, dispatched by columnId).
@@ -116,6 +144,9 @@ export default function Column(_props: ColumnProps): JSX.Element {
     return local.id !== '' ? local.id : local.field;
   }
   function buildSpec() {
+    // Seed the trampolines' targets at first registration (Lit props may not exist earlier).
+    latestFilterFn = local.filterFn;
+    latestSortingFn = local.sortingFn;
     return {
       id: colId(),
       field: local.field !== '' ? local.field : colId(),
@@ -131,6 +162,8 @@ export default function Column(_props: ColumnProps): JSX.Element {
       // custom fn) and filters groupableColumns by `groupable`.
       groupable: local.groupable,
       aggregationFn: local.aggregationFn,
+      filterFn: typeof local.filterFn === 'function' ? filterTrampoline : local.filterFn,
+      sortingFn: typeof local.sortingFn === 'function' ? sortingTrampoline : local.sortingFn,
       // Editable-cell config (Phase 51) — carried into ColumnDef.meta via the parent
       // registry (the existing per-column metadata path; NO parallel registry).
       editable: local.editable,