@vielzeug/refine 1.1.1

package/dist/inputs/combobox/combobox.types.d.ts

@@ -0,0 +1,45 @@
+import type { ChoiceChangeDetail, DropdownCloseReason, OverlayOpenDetail } from '../../headless';
+import type { SelectableFieldProps } from '../../shared';
+import type { VisualVariant } from '../../types';
+export type OreComboboxEvents = {
+    change: ChoiceChangeDetail;
+    close: {
+        reason: DropdownCloseReason;
+    };
+    open: OverlayOpenDetail;
+    search: {
+        query: string;
+    };
+};
+export type ComboboxOptionInput = {
+    disabled?: boolean;
+    iconEl?: Element | null;
+    label?: string;
+    value: string;
+};
+export type ComboboxOptionItem = {
+    disabled: boolean;
+    iconEl: Element | null;
+    label: string;
+    value: string;
+};
+export type OreComboboxProps = Omit<SelectableFieldProps<Exclude<VisualVariant, 'text' | 'frost'>>, 'label-placement' | 'value'> & {
+    /** Automatically close the dropdown after selecting an option (even in multiple mode) */
+    autoclose?: boolean;
+    /** Allow typing a new value to create a new option */
+    creatable?: boolean;
+    'label-placement'?: 'outside' | 'inset';
+    /** Show loading state in the dropdown */
+    loading?: boolean;
+    multiple?: boolean;
+    'no-filter'?: boolean;
+    options?: ComboboxOptionInput[];
+    value?: string | string[];
+};
+export type OreComboboxOptionProps = {
+    disabled?: boolean;
+    /** Explicit label text; falls back to the element's text content. */
+    label?: string;
+    value?: string;
+};
+//# sourceMappingURL=combobox.types.d.ts.map

package/dist/inputs/combobox/combobox.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox.types.d.ts","sourceRoot":"","sources":["../../../src/inputs/combobox/combobox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACjG,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,kBAAkB,CAAC;IAC3B,KAAK,EAAE;QAAE,MAAM,EAAE,mBAAmB,CAAA;KAAE,CAAC;IACvC,IAAI,EAAE,iBAAiB,CAAC;IACxB,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,IAAI,CACjC,oBAAoB,CAAC,OAAO,CAAC,aAAa,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC,EAC9D,iBAAiB,GAAG,OAAO,CAC5B,GAAG;IACF,yFAAyF;IACzF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sDAAsD;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IACxC,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC"}

package/dist/inputs/datagrid/datagrid-column.cjs

@@ -0,0 +1,2 @@
+const e=require("../../_dev.cjs");customElements.get(`ore-column`)||customElements.define(`ore-column`,class extends HTMLElement{connectedCallback(){this.getAttribute(`key`)||e.warn("ore-column: missing required `key` attribute"),this.getAttribute(`label`)||e.warn("ore-column: missing required `label` attribute")}});var t=`ore-column`,n=[`key`,`label`,`sortable`,`resizable`,`align`,`width`,`header-label`];function r(e){return Array.from(e.querySelectorAll(`:scope > ore-column`)).map(e=>({align:e.getAttribute(`align`)??void 0,headerLabel:e.getAttribute(`header-label`)??void 0,key:e.getAttribute(`key`)??``,label:e.getAttribute(`label`)??``,resizable:e.hasAttribute(`resizable`),sortable:e.hasAttribute(`sortable`),width:e.getAttribute(`width`)??void 0}))}exports.COLUMN_OBSERVED_ATTRS=n,exports.COLUMN_TAG=t,exports.parseColumnChildren=r;
+//# sourceMappingURL=datagrid-column.cjs.map

package/dist/inputs/datagrid/datagrid-column.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-column.cjs","names":[],"sources":["../../../src/inputs/datagrid/datagrid-column.ts"],"sourcesContent":["import type { DataGridColumn } from '../../headless';\n\nimport { warn } from '../../_dev';\n\n// ── Declarative ore-column element ────────────────────────────────────────────\n\n/**\n * Declarative column definition for `<ore-datagrid>`.\n * Use as a child element instead of setting the `columns` prop imperatively.\n *\n * @element ore-column\n *\n * @attr {string} key - Row property key (required)\n * @attr {string} label - Header display label (required)\n * @attr {boolean} sortable - Makes the column sortable\n * @attr {boolean} resizable - Adds a drag handle to resize the column\n * @attr {string} align - Text alignment: 'left' | 'center' | 'right'\n * @attr {string} width - CSS column width (e.g. '12rem')\n * @attr {string} header-label - Accessible label override for the column header\n *\n * @example\n * ```html\n * <ore-datagrid>\n *   <ore-column key=\"name\" label=\"Name\" sortable></ore-column>\n *   <ore-column key=\"email\" label=\"Email\" width=\"20rem\"></ore-column>\n * </ore-datagrid>\n * ```\n */\nif (!customElements.get('ore-column'))\n  customElements.define(\n    'ore-column',\n    class extends HTMLElement {\n      connectedCallback(): void {\n        if (!this.getAttribute('key')) {\n          warn('ore-column: missing required `key` attribute');\n        }\n\n        if (!this.getAttribute('label')) {\n          warn('ore-column: missing required `label` attribute');\n        }\n      }\n    },\n  );\n\nexport const COLUMN_TAG = 'ore-column' as const;\n\n/** Attributes observed by the column MutationObserver in ore-datagrid. */\nexport const COLUMN_OBSERVED_ATTRS = [\n  'key',\n  'label',\n  'sortable',\n  'resizable',\n  'align',\n  'width',\n  'header-label',\n] as const;\n\n/** Parse all `<ore-column>` direct children of `host` into DataGridColumn descriptors. */\nexport function parseColumnChildren(host: HTMLElement): DataGridColumn[] {\n  return Array.from(host.querySelectorAll(':scope > ore-column')).map((el) => ({\n    align: (el.getAttribute('align') as 'left' | 'center' | 'right' | null) ?? undefined,\n    headerLabel: el.getAttribute('header-label') ?? undefined,\n    key: el.getAttribute('key') ?? '',\n    label: el.getAttribute('label') ?? '',\n    resizable: el.hasAttribute('resizable'),\n    sortable: el.hasAttribute('sortable'),\n    width: el.getAttribute('width') ?? undefined,\n  }));\n}\n"],"mappings":"kCA4BK,eAAe,IAAI,YAAY,GAClC,eAAe,OACb,aACA,cAAc,WAAY,CACxB,mBAA0B,CACnB,KAAK,aAAa,KAAK,GAC1B,EAAA,KAAK,8CAA8C,EAGhD,KAAK,aAAa,OAAO,GAC5B,EAAA,KAAK,gDAAgD,CAEzD,CACF,CACF,EAEF,IAAa,EAAa,aAGb,EAAwB,CACnC,MACA,QACA,WACA,YACA,QACA,QACA,cACF,EAGA,SAAgB,EAAoB,EAAqC,CACvE,OAAO,MAAM,KAAK,EAAK,iBAAiB,qBAAqB,CAAC,CAAC,CAAC,IAAK,IAAQ,CAC3E,MAAQ,EAAG,aAAa,OAAO,GAA4C,IAAA,GAC3E,YAAa,EAAG,aAAa,cAAc,GAAK,IAAA,GAChD,IAAK,EAAG,aAAa,KAAK,GAAK,GAC/B,MAAO,EAAG,aAAa,OAAO,GAAK,GACnC,UAAW,EAAG,aAAa,WAAW,EACtC,SAAU,EAAG,aAAa,UAAU,EACpC,MAAO,EAAG,aAAa,OAAO,GAAK,IAAA,EACrC,EAAE,CACJ"}

package/dist/inputs/datagrid/datagrid-column.d.ts

@@ -0,0 +1,7 @@
+import type { DataGridColumn } from '../../headless';
+export declare const COLUMN_TAG: "ore-column";
+/** Attributes observed by the column MutationObserver in ore-datagrid. */
+export declare const COLUMN_OBSERVED_ATTRS: readonly ["key", "label", "sortable", "resizable", "align", "width", "header-label"];
+/** Parse all `<ore-column>` direct children of `host` into DataGridColumn descriptors. */
+export declare function parseColumnChildren(host: HTMLElement): DataGridColumn[];
+//# sourceMappingURL=datagrid-column.d.ts.map

package/dist/inputs/datagrid/datagrid-column.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-column.d.ts","sourceRoot":"","sources":["../../../src/inputs/datagrid/datagrid-column.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AA4CrD,eAAO,MAAM,UAAU,EAAG,YAAqB,CAAC;AAEhD,0EAA0E;AAC1E,eAAO,MAAM,qBAAqB,sFAQxB,CAAC;AAEX,0FAA0F;AAC1F,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,WAAW,GAAG,cAAc,EAAE,CAUvE"}

package/dist/inputs/datagrid/datagrid-column.js

@@ -0,0 +1,31 @@
+import { warn as e } from "../../_dev.js";
+//#region src/inputs/datagrid/datagrid-column.ts
+customElements.get("ore-column") || customElements.define("ore-column", class extends HTMLElement {
+	connectedCallback() {
+		this.getAttribute("key") || e("ore-column: missing required `key` attribute"), this.getAttribute("label") || e("ore-column: missing required `label` attribute");
+	}
+});
+var t = "ore-column", n = [
+	"key",
+	"label",
+	"sortable",
+	"resizable",
+	"align",
+	"width",
+	"header-label"
+];
+function r(e) {
+	return Array.from(e.querySelectorAll(":scope > ore-column")).map((e) => ({
+		align: e.getAttribute("align") ?? void 0,
+		headerLabel: e.getAttribute("header-label") ?? void 0,
+		key: e.getAttribute("key") ?? "",
+		label: e.getAttribute("label") ?? "",
+		resizable: e.hasAttribute("resizable"),
+		sortable: e.hasAttribute("sortable"),
+		width: e.getAttribute("width") ?? void 0
+	}));
+}
+//#endregion
+export { n as COLUMN_OBSERVED_ATTRS, t as COLUMN_TAG, r as parseColumnChildren };
+
+//# sourceMappingURL=datagrid-column.js.map

package/dist/inputs/datagrid/datagrid-column.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-column.js","names":[],"sources":["../../../src/inputs/datagrid/datagrid-column.ts"],"sourcesContent":["import type { DataGridColumn } from '../../headless';\n\nimport { warn } from '../../_dev';\n\n// ── Declarative ore-column element ────────────────────────────────────────────\n\n/**\n * Declarative column definition for `<ore-datagrid>`.\n * Use as a child element instead of setting the `columns` prop imperatively.\n *\n * @element ore-column\n *\n * @attr {string} key - Row property key (required)\n * @attr {string} label - Header display label (required)\n * @attr {boolean} sortable - Makes the column sortable\n * @attr {boolean} resizable - Adds a drag handle to resize the column\n * @attr {string} align - Text alignment: 'left' | 'center' | 'right'\n * @attr {string} width - CSS column width (e.g. '12rem')\n * @attr {string} header-label - Accessible label override for the column header\n *\n * @example\n * ```html\n * <ore-datagrid>\n *   <ore-column key=\"name\" label=\"Name\" sortable></ore-column>\n *   <ore-column key=\"email\" label=\"Email\" width=\"20rem\"></ore-column>\n * </ore-datagrid>\n * ```\n */\nif (!customElements.get('ore-column'))\n  customElements.define(\n    'ore-column',\n    class extends HTMLElement {\n      connectedCallback(): void {\n        if (!this.getAttribute('key')) {\n          warn('ore-column: missing required `key` attribute');\n        }\n\n        if (!this.getAttribute('label')) {\n          warn('ore-column: missing required `label` attribute');\n        }\n      }\n    },\n  );\n\nexport const COLUMN_TAG = 'ore-column' as const;\n\n/** Attributes observed by the column MutationObserver in ore-datagrid. */\nexport const COLUMN_OBSERVED_ATTRS = [\n  'key',\n  'label',\n  'sortable',\n  'resizable',\n  'align',\n  'width',\n  'header-label',\n] as const;\n\n/** Parse all `<ore-column>` direct children of `host` into DataGridColumn descriptors. */\nexport function parseColumnChildren(host: HTMLElement): DataGridColumn[] {\n  return Array.from(host.querySelectorAll(':scope > ore-column')).map((el) => ({\n    align: (el.getAttribute('align') as 'left' | 'center' | 'right' | null) ?? undefined,\n    headerLabel: el.getAttribute('header-label') ?? undefined,\n    key: el.getAttribute('key') ?? '',\n    label: el.getAttribute('label') ?? '',\n    resizable: el.hasAttribute('resizable'),\n    sortable: el.hasAttribute('sortable'),\n    width: el.getAttribute('width') ?? undefined,\n  }));\n}\n"],"mappings":";;AA4BK,eAAe,IAAI,YAAY,KAClC,eAAe,OACb,cACA,cAAc,YAAY;CACxB,oBAA0B;EAKxB,AAJK,KAAK,aAAa,KAAK,KAC1B,EAAK,8CAA8C,GAGhD,KAAK,aAAa,OAAO,KAC5B,EAAK,gDAAgD;CAEzD;AACF,CACF;AAEF,IAAa,IAAa,cAGb,IAAwB;CACnC;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAGA,SAAgB,EAAoB,GAAqC;CACvE,OAAO,MAAM,KAAK,EAAK,iBAAiB,qBAAqB,CAAC,CAAC,CAAC,KAAK,OAAQ;EAC3E,OAAQ,EAAG,aAAa,OAAO,KAA4C,KAAA;EAC3E,aAAa,EAAG,aAAa,cAAc,KAAK,KAAA;EAChD,KAAK,EAAG,aAAa,KAAK,KAAK;EAC/B,OAAO,EAAG,aAAa,OAAO,KAAK;EACnC,WAAW,EAAG,aAAa,WAAW;EACtC,UAAU,EAAG,aAAa,UAAU;EACpC,OAAO,EAAG,aAAa,OAAO,KAAK,KAAA;CACrC,EAAE;AACJ"}

package/dist/inputs/datagrid/datagrid-controls.cjs

@@ -0,0 +1,2 @@
+let e=require("@vielzeug/ripple");var t=[{label:`Contains`,value:`contains`},{label:`Equals`,value:`equals`},{label:`Greater than`,value:`gt`},{label:`Less than`,value:`lt`}],n=n=>{let r=(0,e.signal)(``),i=(0,e.signal)(!1),a=(0,e.signal)(new Set),o=(0,e.signal)(new Set),s=(0,e.signal)(new Map),c=(0,e.computed)(()=>{let e=new Set((n.filterOptions.value??[]).map(e=>e.key)),t=[...o.value].filter(t=>!e.has(t));if(!t.length)return new Map;let r=n.rows.value,i=new Map;for(let e of t){let t=new Set,n=[];for(let i of r){let r=i[e],a=r==null?``:String(r);t.has(a)||(t.add(a),n.push({label:a||`(empty)`,value:a}))}i.set(e,n)}return i}),l=(0,e.computed)(()=>{let e=n.filterOptions.value??[],r=new Set(e.map(e=>e.key)),i=[...o.value].filter(e=>!r.has(e)).map(e=>({key:e,label:n.columns.value.find(t=>t.key===e)?.label??e,operators:t,options:c.value.get(e)??[]}));return[...e.map(e=>({...e,operators:e.operators??t})),...i]});(0,e.watch)((0,e.computed)(()=>new Set(n.columns.value.map(e=>e.key))),e=>{let t=new Set([...o.value].filter(t=>e.has(t)));t.size!==o.value.size&&(o.value=t);let n=new Map([...s.value].filter(([t])=>e.has(t)));n.size!==s.value.size&&(s.value=n)},{immediate:!1});let u=(0,e.computed)(()=>{let e=n.rows.value,t=r.value.trim().toLowerCase();return t?e.filter(e=>Object.values(e).some(e=>e!=null&&String(e).toLowerCase().includes(t))):e});return{activateFilterKey:e=>{o.value.has(e)||(o.value=new Set([...o.value,e]))},clearAllFilters:()=>{o.value=new Set,s.value=new Map},filterDefs:l,filteredRows:(0,e.computed)(()=>{let e=u.value,t=s.value;if(!t.size)return e;let r=new Set(n.columns.value.map(e=>e.key));return e.filter(e=>{for(let[n,i]of t){if(!i.values.size||!r.has(n))continue;let t=e[n],a=t==null?``:String(t);if(i.operator===`equals`){if(!i.values.has(a))return!1}else if(i.operator===`contains`){if(![...i.values].some(e=>a.toLowerCase().includes(e.toLowerCase())))return!1}else if(i.operator===`gt`||i.operator===`lt`){let e=parseFloat(a),t=[...i.values].map(parseFloat).filter(e=>!isNaN(e));if(!t.length)continue;if(i.operator===`gt`){if(!t.some(t=>e>t))return!1}else if(!t.some(t=>e<t))return!1}}return!0})}),filterValues:s,hiddenColumns:a,removeFilter:e=>{let t=new Set(o.value);t.delete(e),o.value=t;let n=new Map(s.value);n.delete(e),s.value=n},resetFilters:()=>{o.value=new Set,s.value=new Map},resetSearch:()=>{r.value=``,i.value=!1},searchActive:i,searchQuery:r,setActiveFilterKeys:e=>{let t=new Set(e);o.value=t;let n=new Map(s.value),r=!1;for(let e of n.keys())t.has(e)||(n.delete(e),r=!0);r&&(s.value=n)},setFilter:(e,t)=>{let n=new Map(s.value);if(t.length===0)n.delete(e);else{let r=n.get(e);n.set(e,{operator:r?.operator??`contains`,values:new Set(t)})}s.value=n},setFilterOperator:(e,t)=>{let n=new Map(s.value),r=n.get(e);r&&(n.set(e,{...r,operator:t}),s.value=n)},setSearchQuery:e=>{r.value=e},toggleColumnVisibility:e=>{let t=new Set(a.value);t.has(e)?t.delete(e):t.add(e),a.value=t},toggleSearch:()=>{i.value&&(r.value=``),i.value=!i.value}}};exports.createDataGridControls=n;
+//# sourceMappingURL=datagrid-controls.cjs.map

package/dist/inputs/datagrid/datagrid-controls.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-controls.cjs","names":[],"sources":["../../../src/inputs/datagrid/datagrid-controls.ts"],"sourcesContent":["import { computed, signal, type Readable, watch } from '@vielzeug/ripple';\n\nimport type { DataGridColumn } from '../../headless';\n\n// ── Types ──────────────────────────────────────────────────────────────────────\n\n/**\n * A single filter option definition — the available choices shown in the filter picker\n * for one column. When `filterOptions` is not provided on the grid, options are\n * auto-derived from the current row data.\n */\nexport type FilterOption = {\n  key: string;\n  label: string;\n  operators?: { label: string; value: string }[];\n  options: { label?: string; value: string }[];\n};\n\nexport type FilterOperator = 'contains' | 'equals' | 'gt' | 'lt';\n\nexport type FilterRule = {\n  operator: FilterOperator;\n  values: Set<string>;\n};\n\nexport type DataGridView = {\n  /** Unique identifier for this view. */\n  id: string;\n  /** Display label shown in the tab. */\n  label: string;\n};\n\nexport type DataGridControlsOptions = {\n  /** Reactive column definitions — used to auto-derive filter options and prune stale state. */\n  columns: Readable<DataGridColumn[]>;\n  /**\n   * Pre-defined filter option definitions per column key.\n   * When set, these replace auto-derived options for matching keys.\n   */\n  filterOptions: Readable<FilterOption[] | undefined>;\n  /** Reactive row data — searched and filtered to produce `filteredRows`. */\n  rows: Readable<Record<string, unknown>[]>;\n};\n\nexport type DataGridControlsHandle = {\n  /** Add a column key to the active filter set (makes its rule appear in the UI). */\n  activateFilterKey(key: string): void;\n  /** Clear all active filter rules and values. */\n  clearAllFilters(): void;\n  /**\n   * Merged filter option definitions (provided + user-activated auto-derived).\n   * A key's presence means its filter rule is visible in the UI.\n   */\n  readonly filterDefs: Readable<FilterOption[]>;\n  /**\n   * Rows after applying search and filter. Pass this as the `items` source\n   * to the table control so the headless module owns the full data pipeline.\n   */\n  readonly filteredRows: Readable<Record<string, unknown>[]>;\n  /** Unified filter state: column key → filter rule (operator + values). */\n  readonly filterValues: Readable<Map<string, FilterRule>>;\n  /** Set of column keys hidden by the user. */\n  readonly hiddenColumns: Readable<Set<string>>;\n  /** Remove a column's filter rule and clear its selected values. */\n  removeFilter(key: string): void;\n  /** Clear all active filter rules and values. Alias for clearAllFilters, provided for symmetry with resetSearch. */\n  resetFilters(): void;\n  /** Clear search state (query + active flag). Column visibility is a persistent preference and is never reset. */\n  resetSearch(): void;\n  /** Whether the inline search input is currently open. */\n  readonly searchActive: Readable<boolean>;\n  /** Current text search query. */\n  readonly searchQuery: Readable<string>;\n  /** Set the active filter keys at once, pruning stale values. */\n  setActiveFilterKeys(keys: string[]): void;\n  /** Apply or update a multi-select filter for a column. Pass [] to clear that column's values. */\n  setFilter(key: string, values: string[]): void;\n  /** Update the operator for a specific filter rule. */\n  setFilterOperator(key: string, operator: FilterOperator): void;\n  /** Set the raw search query text directly. */\n  setSearchQuery(q: string): void;\n  /** Toggle a column's visibility. */\n  toggleColumnVisibility(key: string): void;\n  /** Toggle search open/closed. Clears the query on close. */\n  toggleSearch(): void;\n};\n\n// ── Implementation ─────────────────────────────────────────────────────────────\n\nconst DEFAULT_OPERATORS: { label: string; value: FilterOperator }[] = [\n  { label: 'Contains', value: 'contains' },\n  { label: 'Equals', value: 'equals' },\n  { label: 'Greater than', value: 'gt' },\n  { label: 'Less than', value: 'lt' },\n];\n\n/**\n * Headless controls for ore-datagrid: search, filter, column visibility, and derived rows.\n *\n * Design notes:\n * - Filter state uses two signals: activeFilterKeys (Set) drives filterDefs and\n *   the filter rule DOM; filterValues (Map) tracks selected values per key.\n *   Separating them prevents filterDefs from recomputing on value changes, which\n *   would otherwise destroy and recreate the combobox mid-interaction.\n * - colOptions is computed lazily — only for columns with active filter rules,\n *   so the common case (no active filters) costs O(0) row iterations.\n * - filteredRows is derived here (not in the component) so the full data pipeline\n *   lives in one place and can be unit-tested end-to-end.\n */\nexport const createDataGridControls = (options: DataGridControlsOptions): DataGridControlsHandle => {\n  const searchQuery = signal('');\n  const searchActive = signal(false);\n  const hiddenColumns = signal(new Set<string>());\n\n  // Two-signal filter state: activeFilterKeys tracks which rules exist (drives\n  // filterDefs / DOM structure); filterValues tracks selected values per key.\n  // Separating them prevents filterDefs from recomputing — and the filter rule\n  // DOM from being torn down — every time a value is selected.\n  const activeFilterKeys = signal(new Set<string>());\n  const filterValues = signal(new Map<string, FilterRule>());\n\n  // Derive options only for columns that have an active filter rule and are not\n  // covered by externally-provided filterOptions. Lazy: O(activeRules × rows).\n  const colOptions = computed(() => {\n    const externalKeys = new Set((options.filterOptions.value ?? []).map((f) => f.key));\n    const activeKeys = [...activeFilterKeys.value].filter((k) => !externalKeys.has(k));\n\n    if (!activeKeys.length) return new Map<string, { label: string; value: string }[]>();\n\n    const rows = options.rows.value;\n    const map = new Map<string, { label: string; value: string }[]>();\n\n    for (const key of activeKeys) {\n      const seen = new Set<string>();\n      const opts: { label: string; value: string }[] = [];\n\n      for (const row of rows) {\n        const v = row[key];\n        const s = v == null ? '' : String(v);\n\n        if (!seen.has(s)) {\n          seen.add(s);\n          opts.push({ label: s || '(empty)', value: s });\n        }\n      }\n\n      map.set(key, opts);\n    }\n\n    return map;\n  });\n\n  // Merge provided filter options with auto-derived ones for active keys.\n  // Depends only on activeFilterKeys (not filterValues) so adding/removing a\n  // value does not tear down the filter rule DOM.\n  const filterDefs = computed<FilterOption[]>(() => {\n    const provided = options.filterOptions.value ?? [];\n    const providedKeys = new Set(provided.map((f) => f.key));\n    const derived = [...activeFilterKeys.value]\n      .filter((k) => !providedKeys.has(k))\n      .map((k) => {\n        const col = options.columns.value.find((c) => c.key === k);\n\n        return {\n          key: k,\n          label: col?.label ?? k,\n          operators: DEFAULT_OPERATORS,\n          options: colOptions.value.get(k) ?? [],\n        };\n      });\n\n    return [...provided.map((f) => ({ ...f, operators: f.operators ?? DEFAULT_OPERATORS })), ...derived];\n  });\n\n  // Prune stale filter rules when columns are removed.\n  watch(\n    computed(() => new Set(options.columns.value.map((c) => c.key))),\n    (keySet) => {\n      const prunedKeys = new Set([...activeFilterKeys.value].filter((k) => keySet.has(k)));\n\n      if (prunedKeys.size !== activeFilterKeys.value.size) activeFilterKeys.value = prunedKeys;\n\n      const prunedValues = new Map([...filterValues.value].filter(([k]) => keySet.has(k)));\n\n      if (prunedValues.size !== filterValues.value.size) filterValues.value = prunedValues;\n    },\n    { immediate: false },\n  );\n\n  // Full data pipeline: search then filter. Lives here so the headless module\n  // owns the complete input→output contract and can be tested end-to-end.\n  const searchedRows = computed(() => {\n    const rows = options.rows.value;\n    const q = searchQuery.value.trim().toLowerCase();\n\n    if (!q) return rows;\n\n    return rows.filter((row) => Object.values(row).some((v) => v != null && String(v).toLowerCase().includes(q)));\n  });\n\n  const filteredRows = computed(() => {\n    const rows = searchedRows.value;\n    const fv = filterValues.value;\n\n    if (!fv.size) return rows;\n\n    const currentKeys = new Set(options.columns.value.map((c) => c.key));\n\n    return rows.filter((row) => {\n      for (const [key, rule] of fv) {\n        if (!rule.values.size || !currentKeys.has(key)) continue;\n\n        const cell = row[key];\n        const cellValue = cell == null ? '' : String(cell);\n\n        if (rule.operator === 'equals') {\n          if (!rule.values.has(cellValue)) return false;\n        } else if (rule.operator === 'contains') {\n          if (![...rule.values].some((v) => cellValue.toLowerCase().includes(v.toLowerCase()))) return false;\n        } else if (rule.operator === 'gt' || rule.operator === 'lt') {\n          const num = parseFloat(cellValue);\n          const targets = [...rule.values].map(parseFloat).filter((n) => !isNaN(n));\n\n          if (!targets.length) continue;\n\n          if (rule.operator === 'gt') {\n            if (!targets.some((t) => num > t)) return false;\n          } else {\n            if (!targets.some((t) => num < t)) return false;\n          }\n        }\n      }\n\n      return true;\n    });\n  });\n\n  const setFilter = (key: string, values: string[]): void => {\n    const next = new Map(filterValues.value);\n\n    if (values.length === 0) {\n      next.delete(key);\n    } else {\n      const existing = next.get(key);\n\n      next.set(key, { operator: existing?.operator ?? 'contains', values: new Set(values) });\n    }\n\n    filterValues.value = next;\n  };\n\n  const setFilterOperator = (key: string, operator: FilterOperator): void => {\n    const next = new Map(filterValues.value);\n    const existing = next.get(key);\n\n    if (existing) {\n      next.set(key, { ...existing, operator });\n\n      filterValues.value = next;\n    }\n  };\n\n  const activateFilterKey = (key: string): void => {\n    if (activeFilterKeys.value.has(key)) return;\n\n    activeFilterKeys.value = new Set([...activeFilterKeys.value, key]);\n  };\n\n  const removeFilter = (key: string): void => {\n    const nextKeys = new Set(activeFilterKeys.value);\n\n    nextKeys.delete(key);\n    activeFilterKeys.value = nextKeys;\n\n    const nextValues = new Map(filterValues.value);\n\n    nextValues.delete(key);\n    filterValues.value = nextValues;\n  };\n\n  const clearAllFilters = (): void => {\n    activeFilterKeys.value = new Set();\n    filterValues.value = new Map();\n  };\n\n  const setSearchQuery = (q: string): void => {\n    searchQuery.value = q;\n  };\n\n  const setActiveFilterKeys = (keys: string[]): void => {\n    const nextKeys = new Set(keys);\n\n    activeFilterKeys.value = nextKeys;\n\n    // Prune values for keys that are no longer active.\n    const nextValues = new Map(filterValues.value);\n    let changed = false;\n\n    for (const k of nextValues.keys()) {\n      if (!nextKeys.has(k)) {\n        nextValues.delete(k);\n        changed = true;\n      }\n    }\n\n    if (changed) filterValues.value = nextValues;\n  };\n\n  const toggleColumnVisibility = (key: string): void => {\n    const next = new Set(hiddenColumns.value);\n\n    if (next.has(key)) {\n      next.delete(key);\n    } else {\n      next.add(key);\n    }\n\n    hiddenColumns.value = next;\n  };\n\n  const toggleSearch = (): void => {\n    if (searchActive.value) searchQuery.value = '';\n\n    searchActive.value = !searchActive.value;\n  };\n\n  const resetSearch = (): void => {\n    searchQuery.value = '';\n    searchActive.value = false;\n  };\n\n  const resetFilters = (): void => {\n    activeFilterKeys.value = new Set();\n    filterValues.value = new Map();\n  };\n\n  return {\n    activateFilterKey,\n    clearAllFilters,\n    filterDefs,\n    filteredRows,\n    filterValues,\n    hiddenColumns,\n    removeFilter,\n    resetFilters,\n    resetSearch,\n    searchActive,\n    searchQuery,\n    setActiveFilterKeys,\n    setFilter,\n    setFilterOperator,\n    setSearchQuery,\n    toggleColumnVisibility,\n    toggleSearch,\n  };\n};\n"],"mappings":"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"}

package/dist/inputs/datagrid/datagrid-controls.d.ts

@@ -0,0 +1,98 @@
+import { type Readable } from '@vielzeug/ripple';
+import type { DataGridColumn } from '../../headless';
+/**
+ * A single filter option definition — the available choices shown in the filter picker
+ * for one column. When `filterOptions` is not provided on the grid, options are
+ * auto-derived from the current row data.
+ */
+export type FilterOption = {
+    key: string;
+    label: string;
+    operators?: {
+        label: string;
+        value: string;
+    }[];
+    options: {
+        label?: string;
+        value: string;
+    }[];
+};
+export type FilterOperator = 'contains' | 'equals' | 'gt' | 'lt';
+export type FilterRule = {
+    operator: FilterOperator;
+    values: Set<string>;
+};
+export type DataGridView = {
+    /** Unique identifier for this view. */
+    id: string;
+    /** Display label shown in the tab. */
+    label: string;
+};
+export type DataGridControlsOptions = {
+    /** Reactive column definitions — used to auto-derive filter options and prune stale state. */
+    columns: Readable<DataGridColumn[]>;
+    /**
+     * Pre-defined filter option definitions per column key.
+     * When set, these replace auto-derived options for matching keys.
+     */
+    filterOptions: Readable<FilterOption[] | undefined>;
+    /** Reactive row data — searched and filtered to produce `filteredRows`. */
+    rows: Readable<Record<string, unknown>[]>;
+};
+export type DataGridControlsHandle = {
+    /** Add a column key to the active filter set (makes its rule appear in the UI). */
+    activateFilterKey(key: string): void;
+    /** Clear all active filter rules and values. */
+    clearAllFilters(): void;
+    /**
+     * Merged filter option definitions (provided + user-activated auto-derived).
+     * A key's presence means its filter rule is visible in the UI.
+     */
+    readonly filterDefs: Readable<FilterOption[]>;
+    /**
+     * Rows after applying search and filter. Pass this as the `items` source
+     * to the table control so the headless module owns the full data pipeline.
+     */
+    readonly filteredRows: Readable<Record<string, unknown>[]>;
+    /** Unified filter state: column key → filter rule (operator + values). */
+    readonly filterValues: Readable<Map<string, FilterRule>>;
+    /** Set of column keys hidden by the user. */
+    readonly hiddenColumns: Readable<Set<string>>;
+    /** Remove a column's filter rule and clear its selected values. */
+    removeFilter(key: string): void;
+    /** Clear all active filter rules and values. Alias for clearAllFilters, provided for symmetry with resetSearch. */
+    resetFilters(): void;
+    /** Clear search state (query + active flag). Column visibility is a persistent preference and is never reset. */
+    resetSearch(): void;
+    /** Whether the inline search input is currently open. */
+    readonly searchActive: Readable<boolean>;
+    /** Current text search query. */
+    readonly searchQuery: Readable<string>;
+    /** Set the active filter keys at once, pruning stale values. */
+    setActiveFilterKeys(keys: string[]): void;
+    /** Apply or update a multi-select filter for a column. Pass [] to clear that column's values. */
+    setFilter(key: string, values: string[]): void;
+    /** Update the operator for a specific filter rule. */
+    setFilterOperator(key: string, operator: FilterOperator): void;
+    /** Set the raw search query text directly. */
+    setSearchQuery(q: string): void;
+    /** Toggle a column's visibility. */
+    toggleColumnVisibility(key: string): void;
+    /** Toggle search open/closed. Clears the query on close. */
+    toggleSearch(): void;
+};
+/**
+ * Headless controls for ore-datagrid: search, filter, column visibility, and derived rows.
+ *
+ * Design notes:
+ * - Filter state uses two signals: activeFilterKeys (Set) drives filterDefs and
+ *   the filter rule DOM; filterValues (Map) tracks selected values per key.
+ *   Separating them prevents filterDefs from recomputing on value changes, which
+ *   would otherwise destroy and recreate the combobox mid-interaction.
+ * - colOptions is computed lazily — only for columns with active filter rules,
+ *   so the common case (no active filters) costs O(0) row iterations.
+ * - filteredRows is derived here (not in the component) so the full data pipeline
+ *   lives in one place and can be unit-tested end-to-end.
+ */
+export declare const createDataGridControls: (options: DataGridControlsOptions) => DataGridControlsHandle;
+//# sourceMappingURL=datagrid-controls.d.ts.map

package/dist/inputs/datagrid/datagrid-controls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-controls.d.ts","sourceRoot":"","sources":["../../../src/inputs/datagrid/datagrid-controls.ts"],"names":[],"mappings":"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"}

package/dist/inputs/datagrid/datagrid-controls.js

@@ -0,0 +1,147 @@
+import { computed as e, signal as t, watch as n } from "@vielzeug/ripple";
+//#region src/inputs/datagrid/datagrid-controls.ts
+var r = [
+	{
+		label: "Contains",
+		value: "contains"
+	},
+	{
+		label: "Equals",
+		value: "equals"
+	},
+	{
+		label: "Greater than",
+		value: "gt"
+	},
+	{
+		label: "Less than",
+		value: "lt"
+	}
+], i = (i) => {
+	let a = t(""), o = t(!1), s = t(/* @__PURE__ */ new Set()), c = t(/* @__PURE__ */ new Set()), l = t(/* @__PURE__ */ new Map()), u = e(() => {
+		let e = new Set((i.filterOptions.value ?? []).map((e) => e.key)), t = [...c.value].filter((t) => !e.has(t));
+		if (!t.length) return /* @__PURE__ */ new Map();
+		let n = i.rows.value, r = /* @__PURE__ */ new Map();
+		for (let e of t) {
+			let t = /* @__PURE__ */ new Set(), i = [];
+			for (let r of n) {
+				let n = r[e], a = n == null ? "" : String(n);
+				t.has(a) || (t.add(a), i.push({
+					label: a || "(empty)",
+					value: a
+				}));
+			}
+			r.set(e, i);
+		}
+		return r;
+	}), d = e(() => {
+		let e = i.filterOptions.value ?? [], t = new Set(e.map((e) => e.key)), n = [...c.value].filter((e) => !t.has(e)).map((e) => ({
+			key: e,
+			label: i.columns.value.find((t) => t.key === e)?.label ?? e,
+			operators: r,
+			options: u.value.get(e) ?? []
+		}));
+		return [...e.map((e) => ({
+			...e,
+			operators: e.operators ?? r
+		})), ...n];
+	});
+	n(e(() => new Set(i.columns.value.map((e) => e.key))), (e) => {
+		let t = new Set([...c.value].filter((t) => e.has(t)));
+		t.size !== c.value.size && (c.value = t);
+		let n = new Map([...l.value].filter(([t]) => e.has(t)));
+		n.size !== l.value.size && (l.value = n);
+	}, { immediate: !1 });
+	let f = e(() => {
+		let e = i.rows.value, t = a.value.trim().toLowerCase();
+		return t ? e.filter((e) => Object.values(e).some((e) => e != null && String(e).toLowerCase().includes(t))) : e;
+	});
+	return {
+		activateFilterKey: (e) => {
+			c.value.has(e) || (c.value = /* @__PURE__ */ new Set([...c.value, e]));
+		},
+		clearAllFilters: () => {
+			c.value = /* @__PURE__ */ new Set(), l.value = /* @__PURE__ */ new Map();
+		},
+		filterDefs: d,
+		filteredRows: e(() => {
+			let e = f.value, t = l.value;
+			if (!t.size) return e;
+			let n = new Set(i.columns.value.map((e) => e.key));
+			return e.filter((e) => {
+				for (let [r, i] of t) {
+					if (!i.values.size || !n.has(r)) continue;
+					let t = e[r], a = t == null ? "" : String(t);
+					if (i.operator === "equals") {
+						if (!i.values.has(a)) return !1;
+					} else if (i.operator === "contains") {
+						if (![...i.values].some((e) => a.toLowerCase().includes(e.toLowerCase()))) return !1;
+					} else if (i.operator === "gt" || i.operator === "lt") {
+						let e = parseFloat(a), t = [...i.values].map(parseFloat).filter((e) => !isNaN(e));
+						if (!t.length) continue;
+						if (i.operator === "gt") {
+							if (!t.some((t) => e > t)) return !1;
+						} else if (!t.some((t) => e < t)) return !1;
+					}
+				}
+				return !0;
+			});
+		}),
+		filterValues: l,
+		hiddenColumns: s,
+		removeFilter: (e) => {
+			let t = new Set(c.value);
+			t.delete(e), c.value = t;
+			let n = new Map(l.value);
+			n.delete(e), l.value = n;
+		},
+		resetFilters: () => {
+			c.value = /* @__PURE__ */ new Set(), l.value = /* @__PURE__ */ new Map();
+		},
+		resetSearch: () => {
+			a.value = "", o.value = !1;
+		},
+		searchActive: o,
+		searchQuery: a,
+		setActiveFilterKeys: (e) => {
+			let t = new Set(e);
+			c.value = t;
+			let n = new Map(l.value), r = !1;
+			for (let e of n.keys()) t.has(e) || (n.delete(e), r = !0);
+			r && (l.value = n);
+		},
+		setFilter: (e, t) => {
+			let n = new Map(l.value);
+			if (t.length === 0) n.delete(e);
+			else {
+				let r = n.get(e);
+				n.set(e, {
+					operator: r?.operator ?? "contains",
+					values: new Set(t)
+				});
+			}
+			l.value = n;
+		},
+		setFilterOperator: (e, t) => {
+			let n = new Map(l.value), r = n.get(e);
+			r && (n.set(e, {
+				...r,
+				operator: t
+			}), l.value = n);
+		},
+		setSearchQuery: (e) => {
+			a.value = e;
+		},
+		toggleColumnVisibility: (e) => {
+			let t = new Set(s.value);
+			t.has(e) ? t.delete(e) : t.add(e), s.value = t;
+		},
+		toggleSearch: () => {
+			o.value && (a.value = ""), o.value = !o.value;
+		}
+	};
+};
+//#endregion
+export { i as createDataGridControls };
+
+//# sourceMappingURL=datagrid-controls.js.map

package/dist/inputs/datagrid/datagrid-controls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-controls.js","names":[],"sources":["../../../src/inputs/datagrid/datagrid-controls.ts"],"sourcesContent":["import { computed, signal, type Readable, watch } from '@vielzeug/ripple';\n\nimport type { DataGridColumn } from '../../headless';\n\n// ── Types ──────────────────────────────────────────────────────────────────────\n\n/**\n * A single filter option definition — the available choices shown in the filter picker\n * for one column. When `filterOptions` is not provided on the grid, options are\n * auto-derived from the current row data.\n */\nexport type FilterOption = {\n  key: string;\n  label: string;\n  operators?: { label: string; value: string }[];\n  options: { label?: string; value: string }[];\n};\n\nexport type FilterOperator = 'contains' | 'equals' | 'gt' | 'lt';\n\nexport type FilterRule = {\n  operator: FilterOperator;\n  values: Set<string>;\n};\n\nexport type DataGridView = {\n  /** Unique identifier for this view. */\n  id: string;\n  /** Display label shown in the tab. */\n  label: string;\n};\n\nexport type DataGridControlsOptions = {\n  /** Reactive column definitions — used to auto-derive filter options and prune stale state. */\n  columns: Readable<DataGridColumn[]>;\n  /**\n   * Pre-defined filter option definitions per column key.\n   * When set, these replace auto-derived options for matching keys.\n   */\n  filterOptions: Readable<FilterOption[] | undefined>;\n  /** Reactive row data — searched and filtered to produce `filteredRows`. */\n  rows: Readable<Record<string, unknown>[]>;\n};\n\nexport type DataGridControlsHandle = {\n  /** Add a column key to the active filter set (makes its rule appear in the UI). */\n  activateFilterKey(key: string): void;\n  /** Clear all active filter rules and values. */\n  clearAllFilters(): void;\n  /**\n   * Merged filter option definitions (provided + user-activated auto-derived).\n   * A key's presence means its filter rule is visible in the UI.\n   */\n  readonly filterDefs: Readable<FilterOption[]>;\n  /**\n   * Rows after applying search and filter. Pass this as the `items` source\n   * to the table control so the headless module owns the full data pipeline.\n   */\n  readonly filteredRows: Readable<Record<string, unknown>[]>;\n  /** Unified filter state: column key → filter rule (operator + values). */\n  readonly filterValues: Readable<Map<string, FilterRule>>;\n  /** Set of column keys hidden by the user. */\n  readonly hiddenColumns: Readable<Set<string>>;\n  /** Remove a column's filter rule and clear its selected values. */\n  removeFilter(key: string): void;\n  /** Clear all active filter rules and values. Alias for clearAllFilters, provided for symmetry with resetSearch. */\n  resetFilters(): void;\n  /** Clear search state (query + active flag). Column visibility is a persistent preference and is never reset. */\n  resetSearch(): void;\n  /** Whether the inline search input is currently open. */\n  readonly searchActive: Readable<boolean>;\n  /** Current text search query. */\n  readonly searchQuery: Readable<string>;\n  /** Set the active filter keys at once, pruning stale values. */\n  setActiveFilterKeys(keys: string[]): void;\n  /** Apply or update a multi-select filter for a column. Pass [] to clear that column's values. */\n  setFilter(key: string, values: string[]): void;\n  /** Update the operator for a specific filter rule. */\n  setFilterOperator(key: string, operator: FilterOperator): void;\n  /** Set the raw search query text directly. */\n  setSearchQuery(q: string): void;\n  /** Toggle a column's visibility. */\n  toggleColumnVisibility(key: string): void;\n  /** Toggle search open/closed. Clears the query on close. */\n  toggleSearch(): void;\n};\n\n// ── Implementation ─────────────────────────────────────────────────────────────\n\nconst DEFAULT_OPERATORS: { label: string; value: FilterOperator }[] = [\n  { label: 'Contains', value: 'contains' },\n  { label: 'Equals', value: 'equals' },\n  { label: 'Greater than', value: 'gt' },\n  { label: 'Less than', value: 'lt' },\n];\n\n/**\n * Headless controls for ore-datagrid: search, filter, column visibility, and derived rows.\n *\n * Design notes:\n * - Filter state uses two signals: activeFilterKeys (Set) drives filterDefs and\n *   the filter rule DOM; filterValues (Map) tracks selected values per key.\n *   Separating them prevents filterDefs from recomputing on value changes, which\n *   would otherwise destroy and recreate the combobox mid-interaction.\n * - colOptions is computed lazily — only for columns with active filter rules,\n *   so the common case (no active filters) costs O(0) row iterations.\n * - filteredRows is derived here (not in the component) so the full data pipeline\n *   lives in one place and can be unit-tested end-to-end.\n */\nexport const createDataGridControls = (options: DataGridControlsOptions): DataGridControlsHandle => {\n  const searchQuery = signal('');\n  const searchActive = signal(false);\n  const hiddenColumns = signal(new Set<string>());\n\n  // Two-signal filter state: activeFilterKeys tracks which rules exist (drives\n  // filterDefs / DOM structure); filterValues tracks selected values per key.\n  // Separating them prevents filterDefs from recomputing — and the filter rule\n  // DOM from being torn down — every time a value is selected.\n  const activeFilterKeys = signal(new Set<string>());\n  const filterValues = signal(new Map<string, FilterRule>());\n\n  // Derive options only for columns that have an active filter rule and are not\n  // covered by externally-provided filterOptions. Lazy: O(activeRules × rows).\n  const colOptions = computed(() => {\n    const externalKeys = new Set((options.filterOptions.value ?? []).map((f) => f.key));\n    const activeKeys = [...activeFilterKeys.value].filter((k) => !externalKeys.has(k));\n\n    if (!activeKeys.length) return new Map<string, { label: string; value: string }[]>();\n\n    const rows = options.rows.value;\n    const map = new Map<string, { label: string; value: string }[]>();\n\n    for (const key of activeKeys) {\n      const seen = new Set<string>();\n      const opts: { label: string; value: string }[] = [];\n\n      for (const row of rows) {\n        const v = row[key];\n        const s = v == null ? '' : String(v);\n\n        if (!seen.has(s)) {\n          seen.add(s);\n          opts.push({ label: s || '(empty)', value: s });\n        }\n      }\n\n      map.set(key, opts);\n    }\n\n    return map;\n  });\n\n  // Merge provided filter options with auto-derived ones for active keys.\n  // Depends only on activeFilterKeys (not filterValues) so adding/removing a\n  // value does not tear down the filter rule DOM.\n  const filterDefs = computed<FilterOption[]>(() => {\n    const provided = options.filterOptions.value ?? [];\n    const providedKeys = new Set(provided.map((f) => f.key));\n    const derived = [...activeFilterKeys.value]\n      .filter((k) => !providedKeys.has(k))\n      .map((k) => {\n        const col = options.columns.value.find((c) => c.key === k);\n\n        return {\n          key: k,\n          label: col?.label ?? k,\n          operators: DEFAULT_OPERATORS,\n          options: colOptions.value.get(k) ?? [],\n        };\n      });\n\n    return [...provided.map((f) => ({ ...f, operators: f.operators ?? DEFAULT_OPERATORS })), ...derived];\n  });\n\n  // Prune stale filter rules when columns are removed.\n  watch(\n    computed(() => new Set(options.columns.value.map((c) => c.key))),\n    (keySet) => {\n      const prunedKeys = new Set([...activeFilterKeys.value].filter((k) => keySet.has(k)));\n\n      if (prunedKeys.size !== activeFilterKeys.value.size) activeFilterKeys.value = prunedKeys;\n\n      const prunedValues = new Map([...filterValues.value].filter(([k]) => keySet.has(k)));\n\n      if (prunedValues.size !== filterValues.value.size) filterValues.value = prunedValues;\n    },\n    { immediate: false },\n  );\n\n  // Full data pipeline: search then filter. Lives here so the headless module\n  // owns the complete input→output contract and can be tested end-to-end.\n  const searchedRows = computed(() => {\n    const rows = options.rows.value;\n    const q = searchQuery.value.trim().toLowerCase();\n\n    if (!q) return rows;\n\n    return rows.filter((row) => Object.values(row).some((v) => v != null && String(v).toLowerCase().includes(q)));\n  });\n\n  const filteredRows = computed(() => {\n    const rows = searchedRows.value;\n    const fv = filterValues.value;\n\n    if (!fv.size) return rows;\n\n    const currentKeys = new Set(options.columns.value.map((c) => c.key));\n\n    return rows.filter((row) => {\n      for (const [key, rule] of fv) {\n        if (!rule.values.size || !currentKeys.has(key)) continue;\n\n        const cell = row[key];\n        const cellValue = cell == null ? '' : String(cell);\n\n        if (rule.operator === 'equals') {\n          if (!rule.values.has(cellValue)) return false;\n        } else if (rule.operator === 'contains') {\n          if (![...rule.values].some((v) => cellValue.toLowerCase().includes(v.toLowerCase()))) return false;\n        } else if (rule.operator === 'gt' || rule.operator === 'lt') {\n          const num = parseFloat(cellValue);\n          const targets = [...rule.values].map(parseFloat).filter((n) => !isNaN(n));\n\n          if (!targets.length) continue;\n\n          if (rule.operator === 'gt') {\n            if (!targets.some((t) => num > t)) return false;\n          } else {\n            if (!targets.some((t) => num < t)) return false;\n          }\n        }\n      }\n\n      return true;\n    });\n  });\n\n  const setFilter = (key: string, values: string[]): void => {\n    const next = new Map(filterValues.value);\n\n    if (values.length === 0) {\n      next.delete(key);\n    } else {\n      const existing = next.get(key);\n\n      next.set(key, { operator: existing?.operator ?? 'contains', values: new Set(values) });\n    }\n\n    filterValues.value = next;\n  };\n\n  const setFilterOperator = (key: string, operator: FilterOperator): void => {\n    const next = new Map(filterValues.value);\n    const existing = next.get(key);\n\n    if (existing) {\n      next.set(key, { ...existing, operator });\n\n      filterValues.value = next;\n    }\n  };\n\n  const activateFilterKey = (key: string): void => {\n    if (activeFilterKeys.value.has(key)) return;\n\n    activeFilterKeys.value = new Set([...activeFilterKeys.value, key]);\n  };\n\n  const removeFilter = (key: string): void => {\n    const nextKeys = new Set(activeFilterKeys.value);\n\n    nextKeys.delete(key);\n    activeFilterKeys.value = nextKeys;\n\n    const nextValues = new Map(filterValues.value);\n\n    nextValues.delete(key);\n    filterValues.value = nextValues;\n  };\n\n  const clearAllFilters = (): void => {\n    activeFilterKeys.value = new Set();\n    filterValues.value = new Map();\n  };\n\n  const setSearchQuery = (q: string): void => {\n    searchQuery.value = q;\n  };\n\n  const setActiveFilterKeys = (keys: string[]): void => {\n    const nextKeys = new Set(keys);\n\n    activeFilterKeys.value = nextKeys;\n\n    // Prune values for keys that are no longer active.\n    const nextValues = new Map(filterValues.value);\n    let changed = false;\n\n    for (const k of nextValues.keys()) {\n      if (!nextKeys.has(k)) {\n        nextValues.delete(k);\n        changed = true;\n      }\n    }\n\n    if (changed) filterValues.value = nextValues;\n  };\n\n  const toggleColumnVisibility = (key: string): void => {\n    const next = new Set(hiddenColumns.value);\n\n    if (next.has(key)) {\n      next.delete(key);\n    } else {\n      next.add(key);\n    }\n\n    hiddenColumns.value = next;\n  };\n\n  const toggleSearch = (): void => {\n    if (searchActive.value) searchQuery.value = '';\n\n    searchActive.value = !searchActive.value;\n  };\n\n  const resetSearch = (): void => {\n    searchQuery.value = '';\n    searchActive.value = false;\n  };\n\n  const resetFilters = (): void => {\n    activeFilterKeys.value = new Set();\n    filterValues.value = new Map();\n  };\n\n  return {\n    activateFilterKey,\n    clearAllFilters,\n    filterDefs,\n    filteredRows,\n    filterValues,\n    hiddenColumns,\n    removeFilter,\n    resetFilters,\n    resetSearch,\n    searchActive,\n    searchQuery,\n    setActiveFilterKeys,\n    setFilter,\n    setFilterOperator,\n    setSearchQuery,\n    toggleColumnVisibility,\n    toggleSearch,\n  };\n};\n"],"mappings":"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"}

package/dist/inputs/datagrid/datagrid-nav.cjs

@@ -0,0 +1,2 @@
+let e=require("@vielzeug/ripple");var t=`.dg-td, .dg-th`;function n(e){return Array.from(e.querySelectorAll(`tr`)).map(e=>Array.from(e.querySelectorAll(t))).filter(e=>e.length>0)}function r(r,i){let a=(0,e.signal)({col:0,row:0}),o=e=>{let t=n(i),r=Math.max(0,Math.min(e.row,t.length-1)),o=t[r];if(!o)return;let s=Math.max(0,Math.min(e.col,o.length-1)),c=o[s];if(c){for(let e of t)for(let t of e)t.setAttribute(`tabindex`,`-1`);c.setAttribute(`tabindex`,`0`),c.focus(),a.value={col:s,row:r}}},s=e=>{let r=i.activeElement;if(!r?.matches(t))return;let a=n(i),s=a.findIndex(e=>e.includes(r));if(s===-1)return;let c=a[s].indexOf(r),l=a.length-1,u=a[s].length-1,d=s,f=c;if(e.key===`ArrowRight`)f=c+1;else if(e.key===`ArrowLeft`)f=c-1;else if(e.key===`ArrowDown`)d=s+1;else if(e.key===`ArrowUp`)d=s-1;else if(e.key===`Home`)f=0,e.ctrlKey&&(d=0);else if(e.key===`End`)f=u,e.ctrlKey&&(d=l);else return;e.preventDefault(),o({col:Math.max(0,Math.min(f,(a[Math.max(0,Math.min(d,l))]?.length??1)-1)),row:Math.max(0,Math.min(d,l))})};return r.addEventListener(`keydown`,s),{cleanup:()=>r.removeEventListener(`keydown`,s),handle:{activeCell:a,focusCell:o}}}exports.createGridNav=r;
+//# sourceMappingURL=datagrid-nav.cjs.map

package/dist/inputs/datagrid/datagrid-nav.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-nav.cjs","names":[],"sources":["../../../src/inputs/datagrid/datagrid-nav.ts"],"sourcesContent":["import { type Readable, signal } from '@vielzeug/ripple';\n\n// ── Types ──────────────────────────────────────────────────────────────────────\n\n/** Position in the 2D grid model (0-based row/col indices). */\nexport type GridCellPos = { col: number; row: number };\n\n/** Handle returned by createGridNav for programmatic control. */\nexport type GridNavHandle = {\n  /** Current active cell position. Reactive signal. */\n  readonly activeCell: Readable<GridCellPos>;\n  /**\n   * Move focus to a specific cell by position.\n   * Clamps to valid grid bounds; no-ops for invalid positions.\n   */\n  focusCell(pos: GridCellPos): void;\n};\n\n// ── Selector ───────────────────────────────────────────────────────────────────\n\nconst CELL_SELECTOR = '.dg-td, .dg-th';\n\n/** Build a 2D array of focusable cells from the shadow root. One sub-array per <tr>. */\nfunction getGrid(shadow: ShadowRoot): HTMLElement[][] {\n  return Array.from(shadow.querySelectorAll<HTMLElement>('tr'))\n    .map((tr) => Array.from(tr.querySelectorAll<HTMLElement>(CELL_SELECTOR)))\n    .filter((row) => row.length > 0);\n}\n\n// ── Factory ────────────────────────────────────────────────────────────────────\n\n/**\n * Keyboard navigation for the ARIA grid pattern (roving tabindex).\n *\n * - Arrow keys move focus between cells.\n * - Home/End move to the first/last cell in the row.\n * - Ctrl+Home/Ctrl+End move to the first/last cell in the grid.\n * - Only the active cell has `tabindex=\"0\"`; all others have `\"-1\"`.\n *\n * @param table - The `.dg-table` element to attach the keydown listener to.\n * @param shadow - The shadow root containing the grid cells.\n * @returns A handle with `focusCell` and a reactive `activeCell` signal, plus a cleanup fn.\n */\nexport function createGridNav(table: HTMLElement, shadow: ShadowRoot): { cleanup: () => void; handle: GridNavHandle } {\n  const activeCell = signal<GridCellPos>({ col: 0, row: 0 });\n\n  const focusCell = (pos: GridCellPos): void => {\n    const grid = getGrid(shadow);\n    const rowIdx = Math.max(0, Math.min(pos.row, grid.length - 1));\n    const row = grid[rowIdx];\n\n    if (!row) return;\n\n    const colIdx = Math.max(0, Math.min(pos.col, row.length - 1));\n    const target = row[colIdx];\n\n    if (!target) return;\n\n    for (const r of grid) {\n      for (const cell of r) cell.setAttribute('tabindex', '-1');\n    }\n\n    target.setAttribute('tabindex', '0');\n    target.focus();\n    activeCell.value = { col: colIdx, row: rowIdx };\n  };\n\n  const handleArrow = (e: KeyboardEvent): void => {\n    const active = shadow.activeElement as HTMLElement | null;\n\n    if (!active?.matches(CELL_SELECTOR)) return;\n\n    const grid = getGrid(shadow);\n    const rowIdx = grid.findIndex((row) => row.includes(active));\n\n    if (rowIdx === -1) return;\n\n    const colIdx = grid[rowIdx].indexOf(active);\n    const lastRow = grid.length - 1;\n    const lastCol = grid[rowIdx].length - 1;\n\n    let nextRow = rowIdx;\n    let nextCol = colIdx;\n\n    if (e.key === 'ArrowRight') nextCol = colIdx + 1;\n    else if (e.key === 'ArrowLeft') nextCol = colIdx - 1;\n    else if (e.key === 'ArrowDown') nextRow = rowIdx + 1;\n    else if (e.key === 'ArrowUp') nextRow = rowIdx - 1;\n    else if (e.key === 'Home') {\n      nextCol = 0;\n\n      if (e.ctrlKey) nextRow = 0;\n    } else if (e.key === 'End') {\n      nextCol = lastCol;\n\n      if (e.ctrlKey) nextRow = lastRow;\n    } else return;\n\n    e.preventDefault();\n    focusCell({\n      col: Math.max(0, Math.min(nextCol, (grid[Math.max(0, Math.min(nextRow, lastRow))]?.length ?? 1) - 1)),\n      row: Math.max(0, Math.min(nextRow, lastRow)),\n    });\n  };\n\n  table.addEventListener('keydown', handleArrow);\n\n  return {\n    cleanup: () => table.removeEventListener('keydown', handleArrow),\n    handle: { activeCell, focusCell },\n  };\n}\n"],"mappings":"kCAoBA,IAAM,EAAgB,iBAGtB,SAAS,EAAQ,EAAqC,CACpD,OAAO,MAAM,KAAK,EAAO,iBAA8B,IAAI,CAAC,CAAC,CAC1D,IAAK,GAAO,MAAM,KAAK,EAAG,iBAA8B,CAAa,CAAC,CAAC,CAAC,CACxE,OAAQ,GAAQ,EAAI,OAAS,CAAC,CACnC,CAgBA,SAAgB,EAAc,EAAoB,EAAoE,CACpH,IAAM,GAAA,EAAA,EAAA,OAAA,CAAiC,CAAE,IAAK,EAAG,IAAK,CAAE,CAAC,EAEnD,EAAa,GAA2B,CAC5C,IAAM,EAAO,EAAQ,CAAM,EACrB,EAAS,KAAK,IAAI,EAAG,KAAK,IAAI,EAAI,IAAK,EAAK,OAAS,CAAC,CAAC,EACvD,EAAM,EAAK,GAEjB,GAAI,CAAC,EAAK,OAEV,IAAM,EAAS,KAAK,IAAI,EAAG,KAAK,IAAI,EAAI,IAAK,EAAI,OAAS,CAAC,CAAC,EACtD,EAAS,EAAI,GAEd,KAEL,KAAK,IAAM,KAAK,EACd,IAAK,IAAM,KAAQ,EAAG,EAAK,aAAa,WAAY,IAAI,EAG1D,EAAO,aAAa,WAAY,GAAG,EACnC,EAAO,MAAM,EACb,EAAW,MAAQ,CAAE,IAAK,EAAQ,IAAK,CAAO,CALY,CAM5D,EAEM,EAAe,GAA2B,CAC9C,IAAM,EAAS,EAAO,cAEtB,GAAI,CAAC,GAAQ,QAAQ,CAAa,EAAG,OAErC,IAAM,EAAO,EAAQ,CAAM,EACrB,EAAS,EAAK,UAAW,GAAQ,EAAI,SAAS,CAAM,CAAC,EAE3D,GAAI,IAAW,GAAI,OAEnB,IAAM,EAAS,EAAK,EAAO,CAAC,QAAQ,CAAM,EACpC,EAAU,EAAK,OAAS,EACxB,EAAU,EAAK,EAAO,CAAC,OAAS,EAElC,EAAU,EACV,EAAU,EAEd,GAAI,EAAE,MAAQ,aAAc,EAAU,EAAS,OAC1C,GAAI,EAAE,MAAQ,YAAa,EAAU,EAAS,OAC9C,GAAI,EAAE,MAAQ,YAAa,EAAU,EAAS,OAC9C,GAAI,EAAE,MAAQ,UAAW,EAAU,EAAS,OAC5C,GAAI,EAAE,MAAQ,OACjB,EAAU,EAEN,EAAE,UAAS,EAAU,QACpB,GAAI,EAAE,MAAQ,MACnB,EAAU,EAEN,EAAE,UAAS,EAAU,QACpB,OAEP,EAAE,eAAe,EACjB,EAAU,CACR,IAAK,KAAK,IAAI,EAAG,KAAK,IAAI,GAAU,EAAK,KAAK,IAAI,EAAG,KAAK,IAAI,EAAS,CAAO,CAAC,EAAE,EAAE,QAAU,GAAK,CAAC,CAAC,EACpG,IAAK,KAAK,IAAI,EAAG,KAAK,IAAI,EAAS,CAAO,CAAC,CAC7C,CAAC,CACH,EAIA,OAFA,EAAM,iBAAiB,UAAW,CAAW,EAEtC,CACL,YAAe,EAAM,oBAAoB,UAAW,CAAW,EAC/D,OAAQ,CAAE,aAAY,WAAU,CAClC,CACF"}

package/dist/inputs/datagrid/datagrid-nav.d.ts

@@ -0,0 +1,33 @@
+import { type Readable } from '@vielzeug/ripple';
+/** Position in the 2D grid model (0-based row/col indices). */
+export type GridCellPos = {
+    col: number;
+    row: number;
+};
+/** Handle returned by createGridNav for programmatic control. */
+export type GridNavHandle = {
+    /** Current active cell position. Reactive signal. */
+    readonly activeCell: Readable<GridCellPos>;
+    /**
+     * Move focus to a specific cell by position.
+     * Clamps to valid grid bounds; no-ops for invalid positions.
+     */
+    focusCell(pos: GridCellPos): void;
+};
+/**
+ * Keyboard navigation for the ARIA grid pattern (roving tabindex).
+ *
+ * - Arrow keys move focus between cells.
+ * - Home/End move to the first/last cell in the row.
+ * - Ctrl+Home/Ctrl+End move to the first/last cell in the grid.
+ * - Only the active cell has `tabindex="0"`; all others have `"-1"`.
+ *
+ * @param table - The `.dg-table` element to attach the keydown listener to.
+ * @param shadow - The shadow root containing the grid cells.
+ * @returns A handle with `focusCell` and a reactive `activeCell` signal, plus a cleanup fn.
+ */
+export declare function createGridNav(table: HTMLElement, shadow: ShadowRoot): {
+    cleanup: () => void;
+    handle: GridNavHandle;
+};
+//# sourceMappingURL=datagrid-nav.d.ts.map

package/dist/inputs/datagrid/datagrid-nav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-nav.d.ts","sourceRoot":"","sources":["../../../src/inputs/datagrid/datagrid-nav.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAU,MAAM,kBAAkB,CAAC;AAIzD,+DAA+D;AAC/D,MAAM,MAAM,WAAW,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAEvD,iEAAiE;AACjE,MAAM,MAAM,aAAa,GAAG;IAC1B,qDAAqD;IACrD,QAAQ,CAAC,UAAU,EAAE,QAAQ,CAAC,WAAW,CAAC,CAAC;IAC3C;;;OAGG;IACH,SAAS,CAAC,GAAG,EAAE,WAAW,GAAG,IAAI,CAAC;CACnC,CAAC;AAeF;;;;;;;;;;;GAWG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,GAAG;IAAE,OAAO,EAAE,MAAM,IAAI,CAAC;IAAC,MAAM,EAAE,aAAa,CAAA;CAAE,CAoEpH"}

package/dist/inputs/datagrid/datagrid-nav.js

@@ -0,0 +1,51 @@
+import { signal as e } from "@vielzeug/ripple";
+//#region src/inputs/datagrid/datagrid-nav.ts
+var t = ".dg-td, .dg-th";
+function n(e) {
+	return Array.from(e.querySelectorAll("tr")).map((e) => Array.from(e.querySelectorAll(t))).filter((e) => e.length > 0);
+}
+function r(r, i) {
+	let a = e({
+		col: 0,
+		row: 0
+	}), o = (e) => {
+		let t = n(i), r = Math.max(0, Math.min(e.row, t.length - 1)), o = t[r];
+		if (!o) return;
+		let s = Math.max(0, Math.min(e.col, o.length - 1)), c = o[s];
+		if (c) {
+			for (let e of t) for (let t of e) t.setAttribute("tabindex", "-1");
+			c.setAttribute("tabindex", "0"), c.focus(), a.value = {
+				col: s,
+				row: r
+			};
+		}
+	}, s = (e) => {
+		let r = i.activeElement;
+		if (!r?.matches(t)) return;
+		let a = n(i), s = a.findIndex((e) => e.includes(r));
+		if (s === -1) return;
+		let c = a[s].indexOf(r), l = a.length - 1, u = a[s].length - 1, d = s, f = c;
+		if (e.key === "ArrowRight") f = c + 1;
+		else if (e.key === "ArrowLeft") f = c - 1;
+		else if (e.key === "ArrowDown") d = s + 1;
+		else if (e.key === "ArrowUp") d = s - 1;
+		else if (e.key === "Home") f = 0, e.ctrlKey && (d = 0);
+		else if (e.key === "End") f = u, e.ctrlKey && (d = l);
+		else return;
+		e.preventDefault(), o({
+			col: Math.max(0, Math.min(f, (a[Math.max(0, Math.min(d, l))]?.length ?? 1) - 1)),
+			row: Math.max(0, Math.min(d, l))
+		});
+	};
+	return r.addEventListener("keydown", s), {
+		cleanup: () => r.removeEventListener("keydown", s),
+		handle: {
+			activeCell: a,
+			focusCell: o
+		}
+	};
+}
+//#endregion
+export { r as createGridNav };
+
+//# sourceMappingURL=datagrid-nav.js.map

package/dist/inputs/datagrid/datagrid-nav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid-nav.js","names":[],"sources":["../../../src/inputs/datagrid/datagrid-nav.ts"],"sourcesContent":["import { type Readable, signal } from '@vielzeug/ripple';\n\n// ── Types ──────────────────────────────────────────────────────────────────────\n\n/** Position in the 2D grid model (0-based row/col indices). */\nexport type GridCellPos = { col: number; row: number };\n\n/** Handle returned by createGridNav for programmatic control. */\nexport type GridNavHandle = {\n  /** Current active cell position. Reactive signal. */\n  readonly activeCell: Readable<GridCellPos>;\n  /**\n   * Move focus to a specific cell by position.\n   * Clamps to valid grid bounds; no-ops for invalid positions.\n   */\n  focusCell(pos: GridCellPos): void;\n};\n\n// ── Selector ───────────────────────────────────────────────────────────────────\n\nconst CELL_SELECTOR = '.dg-td, .dg-th';\n\n/** Build a 2D array of focusable cells from the shadow root. One sub-array per <tr>. */\nfunction getGrid(shadow: ShadowRoot): HTMLElement[][] {\n  return Array.from(shadow.querySelectorAll<HTMLElement>('tr'))\n    .map((tr) => Array.from(tr.querySelectorAll<HTMLElement>(CELL_SELECTOR)))\n    .filter((row) => row.length > 0);\n}\n\n// ── Factory ────────────────────────────────────────────────────────────────────\n\n/**\n * Keyboard navigation for the ARIA grid pattern (roving tabindex).\n *\n * - Arrow keys move focus between cells.\n * - Home/End move to the first/last cell in the row.\n * - Ctrl+Home/Ctrl+End move to the first/last cell in the grid.\n * - Only the active cell has `tabindex=\"0\"`; all others have `\"-1\"`.\n *\n * @param table - The `.dg-table` element to attach the keydown listener to.\n * @param shadow - The shadow root containing the grid cells.\n * @returns A handle with `focusCell` and a reactive `activeCell` signal, plus a cleanup fn.\n */\nexport function createGridNav(table: HTMLElement, shadow: ShadowRoot): { cleanup: () => void; handle: GridNavHandle } {\n  const activeCell = signal<GridCellPos>({ col: 0, row: 0 });\n\n  const focusCell = (pos: GridCellPos): void => {\n    const grid = getGrid(shadow);\n    const rowIdx = Math.max(0, Math.min(pos.row, grid.length - 1));\n    const row = grid[rowIdx];\n\n    if (!row) return;\n\n    const colIdx = Math.max(0, Math.min(pos.col, row.length - 1));\n    const target = row[colIdx];\n\n    if (!target) return;\n\n    for (const r of grid) {\n      for (const cell of r) cell.setAttribute('tabindex', '-1');\n    }\n\n    target.setAttribute('tabindex', '0');\n    target.focus();\n    activeCell.value = { col: colIdx, row: rowIdx };\n  };\n\n  const handleArrow = (e: KeyboardEvent): void => {\n    const active = shadow.activeElement as HTMLElement | null;\n\n    if (!active?.matches(CELL_SELECTOR)) return;\n\n    const grid = getGrid(shadow);\n    const rowIdx = grid.findIndex((row) => row.includes(active));\n\n    if (rowIdx === -1) return;\n\n    const colIdx = grid[rowIdx].indexOf(active);\n    const lastRow = grid.length - 1;\n    const lastCol = grid[rowIdx].length - 1;\n\n    let nextRow = rowIdx;\n    let nextCol = colIdx;\n\n    if (e.key === 'ArrowRight') nextCol = colIdx + 1;\n    else if (e.key === 'ArrowLeft') nextCol = colIdx - 1;\n    else if (e.key === 'ArrowDown') nextRow = rowIdx + 1;\n    else if (e.key === 'ArrowUp') nextRow = rowIdx - 1;\n    else if (e.key === 'Home') {\n      nextCol = 0;\n\n      if (e.ctrlKey) nextRow = 0;\n    } else if (e.key === 'End') {\n      nextCol = lastCol;\n\n      if (e.ctrlKey) nextRow = lastRow;\n    } else return;\n\n    e.preventDefault();\n    focusCell({\n      col: Math.max(0, Math.min(nextCol, (grid[Math.max(0, Math.min(nextRow, lastRow))]?.length ?? 1) - 1)),\n      row: Math.max(0, Math.min(nextRow, lastRow)),\n    });\n  };\n\n  table.addEventListener('keydown', handleArrow);\n\n  return {\n    cleanup: () => table.removeEventListener('keydown', handleArrow),\n    handle: { activeCell, focusCell },\n  };\n}\n"],"mappings":";;AAoBA,IAAM,IAAgB;AAGtB,SAAS,EAAQ,GAAqC;CACpD,OAAO,MAAM,KAAK,EAAO,iBAA8B,IAAI,CAAC,CAAC,CAC1D,KAAK,MAAO,MAAM,KAAK,EAAG,iBAA8B,CAAa,CAAC,CAAC,CAAC,CACxE,QAAQ,MAAQ,EAAI,SAAS,CAAC;AACnC;AAgBA,SAAgB,EAAc,GAAoB,GAAoE;CACpH,IAAM,IAAa,EAAoB;EAAE,KAAK;EAAG,KAAK;CAAE,CAAC,GAEnD,KAAa,MAA2B;EAC5C,IAAM,IAAO,EAAQ,CAAM,GACrB,IAAS,KAAK,IAAI,GAAG,KAAK,IAAI,EAAI,KAAK,EAAK,SAAS,CAAC,CAAC,GACvD,IAAM,EAAK;EAEjB,IAAI,CAAC,GAAK;EAEV,IAAM,IAAS,KAAK,IAAI,GAAG,KAAK,IAAI,EAAI,KAAK,EAAI,SAAS,CAAC,CAAC,GACtD,IAAS,EAAI;EAEd,OAEL;QAAK,IAAM,KAAK,GACd,KAAK,IAAM,KAAQ,GAAG,EAAK,aAAa,YAAY,IAAI;GAK1D,AAFA,EAAO,aAAa,YAAY,GAAG,GACnC,EAAO,MAAM,GACb,EAAW,QAAQ;IAAE,KAAK;IAAQ,KAAK;GAAO;EALY;CAM5D,GAEM,KAAe,MAA2B;EAC9C,IAAM,IAAS,EAAO;EAEtB,IAAI,CAAC,GAAQ,QAAQ,CAAa,GAAG;EAErC,IAAM,IAAO,EAAQ,CAAM,GACrB,IAAS,EAAK,WAAW,MAAQ,EAAI,SAAS,CAAM,CAAC;EAE3D,IAAI,MAAW,IAAI;EAEnB,IAAM,IAAS,EAAK,EAAO,CAAC,QAAQ,CAAM,GACpC,IAAU,EAAK,SAAS,GACxB,IAAU,EAAK,EAAO,CAAC,SAAS,GAElC,IAAU,GACV,IAAU;EAEd,IAAI,EAAE,QAAQ,cAAc,IAAU,IAAS;OAC1C,IAAI,EAAE,QAAQ,aAAa,IAAU,IAAS;OAC9C,IAAI,EAAE,QAAQ,aAAa,IAAU,IAAS;OAC9C,IAAI,EAAE,QAAQ,WAAW,IAAU,IAAS;OAC5C,IAAI,EAAE,QAAQ,QAGjB,AAFA,IAAU,GAEN,EAAE,YAAS,IAAU;OACpB,IAAI,EAAE,QAAQ,OAGnB,AAFA,IAAU,GAEN,EAAE,YAAS,IAAU;OACpB;EAGP,AADA,EAAE,eAAe,GACjB,EAAU;GACR,KAAK,KAAK,IAAI,GAAG,KAAK,IAAI,IAAU,EAAK,KAAK,IAAI,GAAG,KAAK,IAAI,GAAS,CAAO,CAAC,EAAE,EAAE,UAAU,KAAK,CAAC,CAAC;GACpG,KAAK,KAAK,IAAI,GAAG,KAAK,IAAI,GAAS,CAAO,CAAC;EAC7C,CAAC;CACH;CAIA,OAFA,EAAM,iBAAiB,WAAW,CAAW,GAEtC;EACL,eAAe,EAAM,oBAAoB,WAAW,CAAW;EAC/D,QAAQ;GAAE;GAAY;EAAU;CAClC;AACF"}