@spaethtech/svelte-ui 0.18.0 → 0.18.1-dev.88.f4b29b6

package/.claude/skills/svelte-ui/SKILL.md

@@ -223,6 +223,9 @@ examples):
   the query, filters via **`matchesRow(row, ast)`** (the in-memory AST evaluator: cmp/and/or/not/
   match/in/range/search, honouring column `id`/`searchable`/`sortKey`), then sorts + paginates. Only a
   remote/DB backend needs to compile the AST itself; do NOT hand-roll a "strip `$` + substring" filter.
+  `createGrid` also takes **`selectableRow: (row) => boolean`** — rows returning `false` are locked out
+  of selection (disabled checkbox, excluded from select-all, never in `grid.selected`), so
+  `bulkActions(selected)` never sees them; don't filter locked ids in the handler.
   · **`Pagination`** (standalone
   pager styled like the DataTable footer: tinted band, per-page `Select`, range total, and a
   `First·Prev·[page]/N·Next·Last` stepper whose indicator is an editable `NumberInput` quick-jump;

package/dist/components/DataTable.svelte

@@ -387,6 +387,7 @@
                     {size}
                     aria-label={i18n.messages.selectRow}
                     checked={grid.isSelected(id)}
+                    disabled={!grid.isRowSelectable(id)}
                     onchange={() => grid.toggleRow(id)}
                   />
                 {/if}

package/dist/data/table/grid.svelte.d.ts

@@ -9,6 +9,9 @@ export type GridOptions<T> = {
     perPageOptions?: number[];
     initialQuery?: string;
     initialSort?: Sort | null;
+    /** Per-row selection lock. Return `false` to make a row non-selectable: its checkbox is disabled,
+     *  it's excluded from select-all, and `toggleRow`/`selected` never include it. Default: all selectable. */
+    selectableRow?: (row: T) => boolean;
 };
 /**
  * Shared, reactive controller for a data table. Implements {@link DataSet} (so any `<Query>` can
@@ -20,6 +23,7 @@ export declare class DataGrid<T> implements DataSet {
     readonly fetch: FetchFn<T>;
     readonly getRowId: (row: T) => string;
     readonly perPageOptions: number[];
+    readonly selectableRow: (row: T) => boolean;
     query: string;
     applied: string;
     error: string | null;
@@ -43,6 +47,10 @@ export declare class DataGrid<T> implements DataSet {
     setPage(p: number): void;
     setPerPage(n: number): void;
     get pageIds(): string[];
+    /** Whether a row may be selected (per `selectableRow`); unknown ids default selectable. */
+    isRowSelectable(id: string): boolean;
+    /** Current-page ids that are actually selectable — the set select-all operates over. */
+    get selectableIds(): string[];
     isSelected(id: string): boolean;
     toggleRow(id: string): void;
     get allSelected(): boolean;

package/dist/data/table/grid.svelte.js

@@ -10,6 +10,7 @@ export class DataGrid {
     fetch;
     getRowId;
     perPageOptions;
+    selectableRow;
     query = $state("");
     applied = $state("");
     error = $state(null);
@@ -25,6 +26,7 @@ export class DataGrid {
         this.columns = opts.columns;
         this.fetch = opts.fetch;
         this.getRowId = opts.getRowId ?? ((r) => String(r.id));
+        this.selectableRow = opts.selectableRow ?? (() => true);
         this.perPage = opts.perPage ?? 25;
         this.perPageOptions = opts.perPageOptions ?? [10, 25, 50, 100];
         this.sort = opts.initialSort ?? null;
@@ -86,24 +88,35 @@ export class DataGrid {
     get pageIds() {
         return this.rows.map((r) => this.getRowId(r));
     }
+    /** Whether a row may be selected (per `selectableRow`); unknown ids default selectable. */
+    isRowSelectable(id) {
+        const row = this.rows.find((r) => this.getRowId(r) === id);
+        return row === undefined ? true : this.selectableRow(row);
+    }
+    /** Current-page ids that are actually selectable — the set select-all operates over. */
+    get selectableIds() {
+        return this.rows.filter((r) => this.selectableRow(r)).map((r) => this.getRowId(r));
+    }
     isSelected(id) {
         return this.selected.has(id);
     }
     toggleRow(id) {
+        if (!this.isRowSelectable(id))
+            return; // locked rows never enter `selected`
         if (this.selected.has(id))
             this.selected.delete(id);
         else
             this.selected.add(id);
     }
     get allSelected() {
-        const ids = this.pageIds;
+        const ids = this.selectableIds;
         return ids.length > 0 && ids.every((id) => this.selected.has(id));
     }
     get someSelected() {
-        return this.pageIds.some((id) => this.selected.has(id)) && !this.allSelected;
+        return this.selectableIds.some((id) => this.selected.has(id)) && !this.allSelected;
     }
     toggleAll() {
-        const ids = this.pageIds;
+        const ids = this.selectableIds;
         if (this.allSelected)
             ids.forEach((id) => this.selected.delete(id));
         else

package/docs/components.md

@@ -384,6 +384,10 @@ Config-driven, responsive 12-column data table over a `DataGrid`.
 - **`rowActions` per row**: return `null`/`undefined`/`[]` for a row with no actions — the kebab still
   renders (the tail column stays aligned across rows) but is **disabled**, rather than opening an empty
   or all-greyed menu. Return items to enable it.
+- **Per-row selection lock**: pass **`selectableRow: (row) => boolean`** to `createGrid`. Rows where it
+  returns `false` get a disabled checkbox, are excluded from select-all (`toggleAll`/`allSelected`/
+  `someSelected` operate only over selectable rows), and can never enter `grid.selected` — so
+  `bulkActions(selected)` never sees them (no need to re-filter in the handler). Default: all selectable.
 - **Links in an expandable table**: wrap only the **text** in `<a>` inside your `cell` snippet (not the
   whole cell). The cell is a flex box, so a plain inline `<a>text</a>` is text-width — the rest of the
   cell stays an expand/collapse target. Row-click already ignores clicks on `a`/`button`/`input`/…, so

package/docs/usage.md

@@ -1119,7 +1119,6 @@ bar with `Query` over a `DataSet`.
 
 <DataTable
   {grid}
-  {columns}
   selectable
   rowActions={(row) => [{ label: "Edit", icon: IconPencil, onclick: () => edit(row) }]}
 />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spaethtech/svelte-ui",
-  "version": "0.18.0",
+  "version": "0.18.1-dev.88.f4b29b6",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/spaethtech/svelte-ui.git"