@toolbox-web/grid 1.23.4 → 1.24.0

package/lib/plugins/filtering/types.d.ts

@@ -300,27 +300,191 @@ export interface FilterModel {
     /** Secondary value for 'between' operator */
     valueTo?: unknown;
 }
-/** Parameters passed to custom filter panel renderer */
+/**
+ * Parameters passed to a custom {@link FilterPanelRenderer} when the filter panel
+ * opens for a column. Provides all the state and action callbacks needed to build
+ * a fully custom filter UI.
+ *
+ * The object is created fresh each time the panel opens and captures the current
+ * filter state for the column. Use the action methods (`applySetFilter`,
+ * `applyTextFilter`, `clearFilter`, `closePanel`) to drive filtering — they
+ * handle state updates, re-rendering, and panel lifecycle automatically.
+ *
+ * **Resolution priority** for filter panel renderers:
+ * 1. Plugin-level `filterPanelRenderer` (in `FilterConfig`)
+ * 2. Type-level `filterPanelRenderer` (in `typeDefaults`)
+ * 3. Built-in default panel (checkbox set filter, number range, or date range)
+ *
+ * Returning `undefined` from a plugin-level renderer falls through to the next
+ * level, so you can override only specific columns/fields while keeping defaults
+ * for the rest.
+ *
+ * **Framework adapters** wrap this for idiomatic usage:
+ * - **Angular**: Extend `BaseFilterPanel` — params are available as a signal input.
+ * - **React**: Use a single-argument `(params) => ReactNode` signature.
+ * - **Vue**: Use a single-argument `(params) => VNode` signature.
+ *
+ * @example
+ * ```typescript
+ * // Vanilla: radio-button filter for a "status" column, default for everything else
+ * new FilteringPlugin({
+ *   filterPanelRenderer: (container, params) => {
+ *     if (params.field !== 'status') return undefined; // fall through to default
+ *
+ *     const options = ['All', ...params.uniqueValues.map(String)];
+ *     options.forEach(opt => {
+ *       const label = document.createElement('label');
+ *       label.style.display = 'block';
+ *       const radio = document.createElement('input');
+ *       radio.type = 'radio';
+ *       radio.name = 'status';
+ *       radio.checked = opt === 'All' && params.excludedValues.size === 0;
+ *       radio.addEventListener('change', () => {
+ *         if (opt === 'All') params.clearFilter();
+ *         else params.applySetFilter(
+ *           params.uniqueValues.filter(v => String(v) !== opt) as unknown[]
+ *         );
+ *       });
+ *       label.append(radio, ` ${opt}`);
+ *       container.appendChild(label);
+ *     });
+ *   },
+ * });
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // React: custom slider filter via single-argument signature
+ * <DataGrid
+ *   filtering={{
+ *     filterPanelRenderer: (params) => (
+ *       <MySliderFilter
+ *         min={0} max={100}
+ *         currentFilter={params.currentFilter}
+ *         onApply={(min, max) => params.applyTextFilter('between', min, max)}
+ *         onClear={() => params.clearFilter()}
+ *       />
+ *     ),
+ *   }}
+ * />
+ * ```
+ */
 export interface FilterPanelParams {
-    /** The field being filtered */
+    /**
+     * The field name (column key) being filtered.
+     * Matches {@link ColumnConfig.field} — use it to conditionally render
+     * different UIs for different columns in a shared renderer.
+     */
     field: string;
-    /** The column configuration */
+    /**
+     * The full column configuration for the filtered column.
+     * Useful for reading `column.type`, `column.filterParams`, `column.header`,
+     * or any other column metadata to tailor the filter panel UI.
+     */
     column: ColumnConfig;
-    /** All unique values for this field */
+    /**
+     * All unique values present in the current dataset for this field,
+     * sorted and de-duplicated. For columns with a `filterValue` extractor,
+     * these are the extracted/flattened values (not the raw cell values).
+     *
+     * When a `valuesHandler` is provided in the plugin config, this array
+     * contains the values returned by the handler instead of locally-extracted ones.
+     *
+     * Typical use: render checkboxes, radio buttons, or a searchable list.
+     */
     uniqueValues: unknown[];
-    /** Currently excluded values (for set filter) */
+    /**
+     * Currently excluded values for set-type (`notIn`) filters.
+     * An empty `Set` means no values are excluded (i.e., all values are shown).
+     *
+     * Use this to restore checkbox/toggle states when the panel re-opens.
+     * A value present in this set should appear **unchecked** in a set filter UI.
+     */
     excludedValues: Set<unknown>;
-    /** Current search text */
+    /**
+     * The current search text the user has typed into the filter panel's
+     * search input (if any). Persisted across panel open/close cycles for
+     * the same field. Defaults to `''` when no search has been performed.
+     *
+     * Use this to pre-populate a search box if your custom panel includes one.
+     */
     searchText: string;
-    /** Current active filter model for this field, if any */
+    /**
+     * The currently active {@link FilterModel} for this field, or `undefined`
+     * if no filter is applied. Inspect this to reflect the active filter state
+     * in your UI (e.g., highlight the active operator, show the current value).
+     *
+     * @example
+     * ```typescript
+     * if (params.currentFilter?.operator === 'between') {
+     *   minInput.value = String(params.currentFilter.value);
+     *   maxInput.value = String(params.currentFilter.valueTo);
+     * }
+     * ```
+     */
     currentFilter?: FilterModel;
-    /** Apply a set filter (exclude these values). Pass optional `valueTo` metadata (e.g. a selected range) to store alongside the filter. */
+    /**
+     * Apply a **set filter** (`notIn` operator) that excludes the given values.
+     * Rows whose field value is in `excludedValues` will be hidden.
+     *
+     * Calling this automatically closes the panel and triggers a filter-change event.
+     *
+     * Pass an empty array to clear the set filter (show all values).
+     *
+     * @param excludedValues - Array of values to exclude.
+     * @param valueTo - Optional metadata stored alongside the filter
+     *   (e.g., a label, date range, or selected category). Accessible later
+     *   via `FilterModel.valueTo` in the `filter-change` event or `currentFilter`.
+     *
+     * @example
+     * ```typescript
+     * // Exclude "Inactive" and "Archived" statuses
+     * params.applySetFilter(['Inactive', 'Archived']);
+     *
+     * // Exclude everything except the selected value
+     * const excluded = params.uniqueValues.filter(v => v !== selectedValue);
+     * params.applySetFilter(excluded as unknown[]);
+     * ```
+     */
     applySetFilter: (excludedValues: unknown[], valueTo?: unknown) => void;
-    /** Apply a text/number/date filter */
+    /**
+     * Apply a **text, number, or date filter** with the given operator and value(s).
+     *
+     * Calling this automatically closes the panel and triggers a filter-change event.
+     *
+     * @param operator - The filter operator to apply (e.g., `'contains'`,
+     *   `'greaterThan'`, `'between'`). See {@link FilterOperator} for all options.
+     * @param value - The primary filter value.
+     * @param valueTo - Secondary value required by the `'between'` operator
+     *   (defines the upper bound of the range).
+     *
+     * @example
+     * ```typescript
+     * // Text: contains search
+     * params.applyTextFilter('contains', searchInput.value);
+     *
+     * // Number: range between 10 and 100
+     * params.applyTextFilter('between', 10, 100);
+     *
+     * // Date: after a specific date
+     * params.applyTextFilter('greaterThan', '2025-01-01');
+     * ```
+     */
     applyTextFilter: (operator: FilterOperator, value: string | number, valueTo?: string | number) => void;
-    /** Clear the filter for this field */
+    /**
+     * Clear the active filter for this field entirely and close the panel.
+     * After calling, the column will show all rows (as if no filter was ever applied).
+     *
+     * Equivalent to removing the field's entry from the filter model.
+     */
     clearFilter: () => void;
-    /** Close the filter panel */
+    /**
+     * Close the filter panel **without** applying or clearing any filter.
+     * Use this for a "Cancel" / dismiss action where the user abandons changes.
+     *
+     * Note: `applySetFilter`, `applyTextFilter`, and `clearFilter` already close
+     * the panel automatically — you only need `closePanel` for explicit dismiss.
+     */
     closePanel: () => void;
 }
 /** Custom filter panel renderer function. Return undefined to use default panel for this column. */
@@ -367,17 +531,163 @@ export type FilterValuesHandler = (field: string, column: ColumnConfig) => Promi
  * ```
  */
 export type FilterHandler<TRow = unknown> = (filters: FilterModel[], currentRows: TRow[]) => TRow[] | Promise<TRow[]>;
-/** Configuration options for the filtering plugin */
+/**
+ * Configuration options for the {@link FilteringPlugin}.
+ *
+ * Pass this object to the `FilteringPlugin` constructor to customize filtering
+ * behavior, panel rendering, server-side integration, and state persistence.
+ *
+ * @typeParam TRow - The row data type. Inferred when using a typed `filterHandler`.
+ *
+ * @example
+ * ```typescript
+ * // Basic usage with defaults
+ * new FilteringPlugin()
+ *
+ * // Customized local filtering
+ * new FilteringPlugin({
+ *   debounceMs: 200,
+ *   caseSensitive: true,
+ *   trackColumnState: true,
+ * })
+ *
+ * // Server-side filtering with custom values
+ * new FilteringPlugin<Employee>({
+ *   valuesHandler: async (field) => {
+ *     const res = await fetch(`/api/employees/distinct/${field}`);
+ *     return res.json();
+ *   },
+ *   filterHandler: async (filters) => {
+ *     const params = new URLSearchParams();
+ *     filters.forEach(f => params.append(f.field, `${f.operator}:${f.value}`));
+ *     const res = await fetch(`/api/employees?${params}`);
+ *     return res.json();
+ *   },
+ * })
+ * ```
+ */
 export interface FilterConfig<TRow = unknown> {
-    /** Debounce delay in ms for filter input (default: 300) */
+    /**
+     * Debounce delay in milliseconds for the search input inside the default
+     * filter panel. Controls how long the panel waits after the user stops
+     * typing before re-filtering the unique values list.
+     *
+     * Lower values feel more responsive but cause more DOM updates.
+     * Higher values reduce work for columns with many unique values.
+     *
+     * @default 300
+     *
+     * @example
+     * ```typescript
+     * // Faster response for small datasets
+     * new FilteringPlugin({ debounceMs: 100 })
+     *
+     * // Slower debounce for columns with thousands of unique values
+     * new FilteringPlugin({ debounceMs: 500 })
+     * ```
+     */
     debounceMs?: number;
-    /** Whether text filtering is case sensitive (default: false) */
+    /**
+     * Whether text-based filtering comparisons are case-sensitive.
+     *
+     * When `false` (default), `"alice"` matches `"Alice"`, `"ALICE"`, etc.
+     * When `true`, only exact case matches pass the filter.
+     *
+     * Affects both:
+     * - The core `filterRows()` logic (text operators like `contains`, `equals`, etc.)
+     * - The search input inside the default filter panel (value list filtering)
+     *
+     * @default false
+     *
+     * @example
+     * ```typescript
+     * // Enable case-sensitive filtering
+     * new FilteringPlugin({ caseSensitive: true })
+     * ```
+     */
     caseSensitive?: boolean;
-    /** Whether to trim whitespace from filter input (default: true) */
+    /**
+     * Whether to trim leading/trailing whitespace from filter input values
+     * before applying them.
+     *
+     * @default true
+     *
+     * @remarks
+     * **Reserved for future use.** This option is accepted in configuration
+     * but not yet applied in the current filtering implementation.
+     */
     trimInput?: boolean;
-    /** Use Web Worker for filtering large datasets >1000 rows (default: true) */
+    /**
+     * Whether to offload filtering to a Web Worker for large datasets.
+     *
+     * @default true
+     *
+     * @remarks
+     * **Reserved for future use.** This option is accepted in configuration
+     * but not yet implemented. Filtering currently runs synchronously on
+     * the main thread for all dataset sizes. Performance is excellent for
+     * most use cases — the grid handles 10,000+ rows without noticeable delay
+     * thanks to result caching and debounced input.
+     *
+     * When implemented, this will automatically offload `filterRows()` to a
+     * Web Worker when the row count exceeds an internal threshold, keeping
+     * the main thread responsive during heavy filtering operations.
+     */
     useWorker?: boolean;
-    /** Custom filter panel renderer (replaces default panel content) */
+    /**
+     * Custom filter panel renderer that replaces the built-in panel content
+     * for **all** columns (unless you return `undefined` for specific columns
+     * to fall through to the next level).
+     *
+     * **Resolution priority** (first non-empty result wins):
+     * 1. This plugin-level `filterPanelRenderer`
+     * 2. Type-level `filterPanelRenderer` (in `gridConfig.typeDefaults[type]`)
+     * 3. Built-in panel (checkbox set filter, number range slider, or date picker)
+     *
+     * The renderer receives the panel container element and a {@link FilterPanelParams}
+     * object with state and action callbacks. Append your UI to the container.
+     *
+     * **Return `undefined`** (or leave the container empty) to fall through to
+     * the next resolution level. This lets you override only specific fields.
+     *
+     * @example
+     * ```typescript
+     * // Override only the "status" column, use defaults for everything else
+     * new FilteringPlugin({
+     *   filterPanelRenderer: (container, params) => {
+     *     if (params.field !== 'status') return undefined; // fall through
+     *
+     *     params.uniqueValues.forEach(val => {
+     *       const btn = document.createElement('button');
+     *       btn.textContent = String(val);
+     *       btn.onclick = () => {
+     *         const excluded = params.uniqueValues.filter(v => v !== val);
+     *         params.applySetFilter(excluded as unknown[]);
+     *       };
+     *       container.appendChild(btn);
+     *     });
+     *   },
+     * })
+     * ```
+     *
+     * @example
+     * ```typescript
+     * // Replace ALL filter panels with a custom component
+     * new FilteringPlugin({
+     *   filterPanelRenderer: (container, params) => {
+     *     const myFilter = new MyCustomFilterElement();
+     *     myFilter.field = params.field;
+     *     myFilter.values = params.uniqueValues;
+     *     myFilter.onApply = (excluded) => params.applySetFilter(excluded);
+     *     myFilter.onClear = () => params.clearFilter();
+     *     container.appendChild(myFilter);
+     *   },
+     * })
+     * ```
+     *
+     * @see {@link FilterPanelParams} for all available state and action callbacks.
+     * @see {@link FilterPanelRenderer} for the function signature.
+     */
     filterPanelRenderer?: FilterPanelRenderer;
     /**
      * Whether filter state should be included in column state persistence.
@@ -385,28 +695,119 @@ export interface FilterConfig<TRow = unknown> {
      * When `true`:
      * - `getColumnState()` includes filter data for each column
      * - Filter changes fire the `column-state-change` event (debounced)
-     * - `applyColumnState()` restores filter state
+     * - `applyColumnState()` restores filter state from a saved snapshot
      *
      * When `false` (default):
      * - Filters are excluded from column state entirely
-     * - Filter changes do not fire `column-state-change`
+     * - Filter changes do **not** fire `column-state-change`
+     *
+     * Enable this when you persist column state (e.g., to localStorage or a server)
+     * and want filter selections to survive page reloads.
      *
      * @default false
+     *
+     * @example
+     * ```typescript
+     * // Persist filters alongside column order, widths, and sort state
+     * new FilteringPlugin({ trackColumnState: true })
+     *
+     * // Save/restore cycle:
+     * const state = grid.getColumnState();   // includes filter data
+     * localStorage.setItem('grid-state', JSON.stringify(state));
+     * // ... later ...
+     * grid.applyColumnState(JSON.parse(localStorage.getItem('grid-state')!));
+     * ```
      */
     trackColumnState?: boolean;
     /**
-     * Async handler for fetching unique values from a server.
-     * When provided, this is called instead of extracting values from local rows.
-     * Useful for server-side datasets where not all data is loaded.
+     * Async handler for fetching unique filter values from a server.
+     *
+     * When provided, this handler is called **each time a filter panel opens**
+     * instead of extracting unique values from the locally-loaded rows. The panel
+     * shows a loading indicator while the handler resolves.
+     *
+     * Use this for server-side or paginated datasets where the client only holds
+     * a subset of the data and the local unique values would be incomplete.
+     *
+     * The returned values populate `FilterPanelParams.uniqueValues` and appear
+     * in the checkbox list (or are passed to your custom `filterPanelRenderer`).
+     *
+     * @example
+     * ```typescript
+     * new FilteringPlugin({
+     *   valuesHandler: async (field, column) => {
+     *     const res = await fetch(`/api/data/distinct/${field}`);
+     *     return res.json(); // ['Engineering', 'Marketing', 'Sales', ...]
+     *   },
+     * })
+     * ```
+     *
+     * @example
+     * ```typescript
+     * // Combine with filterHandler for full server-side filtering
+     * new FilteringPlugin<Employee>({
+     *   valuesHandler: async (field) => {
+     *     const res = await fetch(`/api/employees/distinct/${field}`);
+     *     return res.json();
+     *   },
+     *   filterHandler: async (filters) => {
+     *     const body = JSON.stringify(filters);
+     *     const res = await fetch('/api/employees/filter', { method: 'POST', body });
+     *     return res.json();
+     *   },
+     * })
+     * ```
+     *
+     * @see {@link FilterValuesHandler} for the full type signature.
      */
     valuesHandler?: FilterValuesHandler;
     /**
-     * Async handler for applying filters on a server.
-     * When provided, filtering is delegated to the server instead of local filtering.
-     * Should return the filtered rows from the server.
+     * Async handler for delegating filtering to a server.
+     *
+     * When provided, the plugin's `processRows()` hook becomes a **passthrough**
+     * (returns rows unfiltered) and instead calls this handler whenever the
+     * active filters change. The handler should return the filtered rows, which
+     * replace the grid's current data.
+     *
+     * This enables full server-side filtering for large datasets that can't be
+     * loaded into the browser. The handler receives the complete list of active
+     * {@link FilterModel} objects and the current row array (useful for optimistic
+     * updates or reference).
+     *
+     * The handler may return rows synchronously (plain array) or asynchronously
+     * (Promise). While an async handler is pending, the grid retains its current
+     * rows until the new data arrives.
+     *
+     * @example
+     * ```typescript
+     * // Server-side filtering with query params
+     * new FilteringPlugin<Employee>({
+     *   filterHandler: async (filters, currentRows) => {
+     *     const params = new URLSearchParams();
+     *     filters.forEach(f => params.append(f.field, `${f.operator}:${f.value}`));
+     *     const res = await fetch(`/api/employees?${params}`);
+     *     return res.json();
+     *   },
+     * })
+     * ```
+     *
+     * @example
+     * ```typescript
+     * // POST-based filtering with full filter models
+     * new FilteringPlugin<Product>({
+     *   filterHandler: async (filters) => {
+     *     const res = await fetch('/api/products/filter', {
+     *       method: 'POST',
+     *       headers: { 'Content-Type': 'application/json' },
+     *       body: JSON.stringify({ filters }),
+     *     });
+     *     return res.json();
+     *   },
+     * })
+     * ```
      *
-     * Note: When using filterHandler, processRows() becomes a passthrough
-     * and the returned rows replace the grid's data.
+     * @see {@link FilterHandler} for the full type signature.
+     * @see {@link FilterChangeDetail} for the event emitted after filter changes.
      */
     filterHandler?: FilterHandler<TRow>;
 }

package/lib/plugins/filtering/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/filtering/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/filtering/types.ts"],"names":[],"mappings":"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"}

package/lib/plugins/grouping-columns/index.d.ts

@@ -2,7 +2,7 @@
  * Grouping Columns Plugin Entry Point
  * Re-exports plugin class and types for tree-shakeable imports.
  *
- * @module Plugins/Column Grouping
+ * @module Plugins/Grouping Columns
  */
 export { GroupingColumnsPlugin } from './GroupingColumnsPlugin';
 export type { ColumnGroup, ColumnGroupDefinition, GroupingColumnsConfig } from './types';

package/lib/plugins/grouping-columns/index.js

@@ -1,2 +1,2 @@
-const e='<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>',t={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:e,filterActive:e,print:"🖨️"};class r{static dependencies;static manifest;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}attach(e){this.#e?.abort(),this.#e=new AbortController,this.grid=e,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#e?.abort(),this.#e=void 0}getPlugin(e){return this.grid?.getPlugin(e)}emit(e,t){this.grid?.dispatchEvent?.(new CustomEvent(e,{detail:t,bubbles:!0}))}emitCancelable(e,t){const r=new CustomEvent(e,{detail:t,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(r),r.defaultPrevented}on(e,t){this.grid?._pluginManager?.subscribe(this,e,t)}off(e){this.grid?._pluginManager?.unsubscribe(this,e)}emitPluginEvent(e,t){this.grid?._pluginManager?.emitPluginEvent(e,t)}requestRender(){this.grid?.requestRender?.()}requestColumnsRender(){this.grid?.requestColumnsRender?.()}requestRenderWithFocus(){this.grid?.requestRenderWithFocus?.()}requestAfterRender(){this.grid?.requestAfterRender?.()}get rows(){return this.grid?.rows??[]}get sourceRows(){return this.grid?.sourceRows??[]}get columns(){return this.grid?.columns??[]}get visibleColumns(){return this.grid?._visibleColumns??[]}get gridElement(){return this.grid}get disconnectSignal(){return this.#e?.signal??this.grid?.disconnectSignal}get gridIcons(){const e=this.grid?.gridConfig?.icons??{};return{...t,...e}}get isAnimationEnabled(){const e=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===e||"off"===e)return!1;if(!0===e||"on"===e)return!0;const t=this.gridElement;if(t){return"0"!==getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const e=this.gridElement;if(e){const t=getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(),r=parseInt(t,10);if(!isNaN(r))return r}return 200}resolveIcon(e,t){return void 0!==t?t:this.gridIcons[e]}setIcon(e,t){"string"==typeof t?e.innerHTML=t:t instanceof HTMLElement&&(e.innerHTML="",e.appendChild(t.cloneNode(!0)))}warn(e){console.warn(`[tbw-grid:${this.name}] ${e}`)}}function o(e){if(!e.length)return[];const t=/* @__PURE__ */new Map,r=[],o=(e,t)=>{if(!t.length)return;const o=r[r.length-1];o&&o.implicit&&o.firstIndex+o.columns.length===e?o.columns.push(...t):r.push({id:"__implicit__"+e,label:void 0,columns:t,firstIndex:e,implicit:!0})};let i=[],n=0;return e.forEach((e,s)=>{const l=e.group;if(!l)return 0===i.length&&(n=s),void i.push(e);i.length&&(o(n,i.slice()),i=[]);const d="string"==typeof l?l:l.id;let u=t.get(d);u||(u={id:d,label:"string"==typeof l?void 0:l.label,columns:[],firstIndex:s},t.set(d,u),r.push(u)),u.columns.push(e)}),i.length&&o(n,i),1===r.length&&r[0].implicit&&r[0].columns.length===e.length?[]:r}function i(e,t){const r=e.columns[0],o=e.columns[e.columns.length-1],i=r?t.findIndex(e=>e.field===r.field):-1,n=o?t.findIndex(e=>e.field===o.field):-1;return-1!==i&&-1!==n?[i,n]:null}function n(e,t){const r=/* @__PURE__ */new Set,o=[];for(const n of e){if(String(n.id).startsWith("__implicit__"))continue;const e=i(n,t);e&&o.push(e)}for(const n of e){if(!String(n.id).startsWith("__implicit__"))continue;const e=i(n,t);if(!e)continue;const[s,l]=e;o.some(([e,t])=>s>=e&&l<=t)&&r.add(String(n.id))}return r}class s extends r{static manifest={ownedProperties:[{property:"group",level:"column",description:'the "group" column property'},{property:"columnGroups",level:"config",description:'the "columnGroups" config property',isUsed:e=>Array.isArray(e)&&e.length>0}],queries:[{type:"getColumnGrouping",description:"Returns column group metadata for the visibility panel"}]};name="groupingColumns";styles="@layer tbw-plugins{.header-group-row{display:grid;grid-auto-flow:column;background:var(--tbw-grouping-columns-header-bg, var(--tbw-color-header-bg));border-bottom:1px solid var(--tbw-grouping-columns-border, var(--tbw-color-border))}.header-group-cell{display:flex;align-items:center;justify-content:center;padding:var(--tbw-button-padding-sm, .25rem .5rem);font-weight:600;font-size:var(--tbw-font-size-sm, .9em);text-transform:uppercase;letter-spacing:.5px;border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-group-cell:last-child{border-right:none}.header-row .cell.grouped{border-top:none}.header-row .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-row .cell.group-end:last-child{border-right:none}.rows .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.rows .cell.group-end:last-child{border-right:none}.header-group-row.no-borders{border-bottom:none}.header-group-row.no-borders .header-group-cell{border-right:none}.header-row.no-group-borders .cell.group-end{border-right:1px solid var(--tbw-color-border)}}";get defaultConfig(){return{showGroupBorders:!0,lockGroupOrder:!1}}groups=[];isActive=!1;#t=/* @__PURE__ */new Set;attach(e){super.attach(e),e.addEventListener("column-move",this.#r,{signal:this.disconnectSignal})}detach(){this.groups=[],this.isActive=!1,this.#t.clear()}#r=e=>{if(!this.isActive)return;const t=e,{field:r,columnOrder:o}=t.detail;if(this.config.lockGroupOrder)for(const i of this.groups)if(!i.id.startsWith("__implicit__")&&!this.#o(i,o))return t.preventDefault(),void this.#i(r);this.#n(o)};#n(e){this.#t.clear();const t=this.#s(e);for(const r of this.groups){const o=new Set(r.columns.map(e=>e.field));for(let r=e.length-1;r>=0;r--)if(o.has(e[r])){const o=e[r];o!==t&&this.#t.add(o);break}}}#s(e){if(0===this.groups.length)return null;for(let t=e.length-1;t>=0;t--){const r=e[t];for(const t of this.groups)if(t.columns.some(e=>e.field===r)){const r=new Set(t.columns.map(e=>e.field));for(let t=e.length-1;t>=0;t--)if(r.has(e[t]))return e[t]}}return null}#o(e,t){const r=e.columns.map(e=>t.indexOf(e.field)).filter(e=>-1!==e).sort((e,t)=>e-t);return r.length<=1||r.length===r[r.length-1]-r[0]+1}#i(e){const t=this.gridElement?.querySelector(`.header-row [part~="header-cell"][data-field="${e}"]`);t&&(t.style.setProperty("--_flash-color","var(--tbw-color-error)"),t.animate([{backgroundColor:"rgba(from var(--_flash-color) r g b / 30%)"},{backgroundColor:"transparent"}],{duration:400,easing:"ease-out"}))}handleQuery(e){if("getColumnGrouping"===e.type)return this.#l()}#l(){let e;const t=this.grid?.gridConfig?.columnGroups;if(t&&Array.isArray(t)&&t.length>0)e=t.filter(e=>e.children.length>0).map(e=>({id:e.id,label:e.header,fields:[...e.children]}));else if(this.isActive&&this.groups.length>0){e=this.groups.filter(e=>!e.id.startsWith("__implicit__")).map(e=>({id:e.id,label:e.label??e.id,fields:e.columns.map(e=>e.field)}));const t=this.columns;for(const r of t)if(r.hidden&&r.group){const t="string"==typeof r.group?r.group:r.group.id,o="string"==typeof r.group?r.group:r.group.label??r.group.id,i=e.find(e=>e.id===t);i?i.fields.includes(r.field)||i.fields.push(r.field):e.push({id:t,label:o,fields:[r.field]})}}else{const t=this.columns,r=/* @__PURE__ */new Map;for(const e of t){if(!e.group)continue;const t="string"==typeof e.group?e.group:e.group.id,o="string"==typeof e.group?e.group:e.group.label??e.group.id,i=r.get(t);i?i.fields.includes(e.field)||i.fields.push(e.field):r.set(t,{id:t,label:o,fields:[e.field]})}e=Array.from(r.values())}const r=this.grid?.getColumnOrder();if(r&&r.length>0){const t=new Map(r.map((e,t)=>[e,t]));for(const r of e)r.fields.sort((e,r)=>(t.get(e)??1/0)-(t.get(r)??1/0))}return e}static detect(e,t){if(t?.columnGroups&&Array.isArray(t.columnGroups)&&t.columnGroups.length>0)return!0;const r=t?.columns;return!!Array.isArray(r)&&function(e){return e.some(e=>null!=e.group)}(r)}processColumns(e){const t=this.grid?.gridConfig?.columnGroups;let r;if(t&&Array.isArray(t)&&t.length>0){const o=/* @__PURE__ */new Map;for(const e of t)for(const t of e.children)o.set(t,{id:e.id,label:e.header});r=e.map(e=>{const t=o.get(e.field);return t&&!e.group?{...e,group:t}:e})}else r=[...e];const i=o(r);if(0===i.length)return this.isActive=!1,this.groups=[],r;this.isActive=!0,this.groups=i,this.#t.clear();for(const o of i){const e=o.columns[o.columns.length-1];e?.field&&this.#t.add(e.field)}return r}afterRender(){if(!this.isActive){const e=this.gridElement?.querySelector(".header"),t=e?.querySelector(".header-group-row");return void(t&&t.remove())}const e=this.gridElement?.querySelector(".header");if(!e)return;const t=e.querySelector(".header-group-row");t&&t.remove();const r=this.visibleColumns,s=o(r);if(0===s.length)return;this.#t.clear();const l=n(s,r);for(let o=0;o<s.length;o++){const e=s[o];if(String(e.id).startsWith("__implicit__")&&l.has(String(e.id)))continue;const t=e.columns[e.columns.length-1];t?.field&&o<s.length-1&&this.#t.add(t.field)}const d=function(e,t){if(0===e.length)return null;const r=document.createElement("div");r.className="header-group-row",r.setAttribute("role","row");const o=n(e,t);for(const n of e){const e=String(n.id),s=e.startsWith("__implicit__");if(s&&o.has(e))continue;const l=i(n,t);if(!l)continue;const[d,u]=l,c=u-d+1,g=s?"":n.label||n.id,a=document.createElement("div");a.className="cell header-group-cell",s&&a.classList.add("implicit-group"),a.setAttribute("data-group",e),a.style.gridColumn=`${d+1} / span ${c}`,a.textContent=g,r.appendChild(a)}return r}(s,r);if(d){d.classList.toggle("no-borders",!this.config.showGroupBorders);const t=e.querySelector(".header-row");t?e.insertBefore(d,t):e.appendChild(d)}const u=e.querySelector(".header-row");u&&(u.classList.toggle("no-group-borders",!this.config.showGroupBorders),function(e,t,r){if(!t.length||!e)return;const o=n(t,r),i=/* @__PURE__ */new Map;for(const n of t)if(!String(n.id).startsWith("__implicit__")||!o.has(String(n.id)))for(const e of n.columns)e.field&&i.set(e.field,n.id);const s=Array.from(e.querySelectorAll(".cell[data-field]"));s.forEach(e=>{const t=e.getAttribute("data-field")||"",r=i.get(t);r&&(e.classList.add("grouped"),e.getAttribute("data-group")||e.setAttribute("data-group",r))});for(const n of t){if(String(n.id).startsWith("__implicit__")&&o.has(String(n.id)))continue;const e=n.columns[n.columns.length-1],t=s.find(t=>t.getAttribute("data-field")===e.field);t&&t.classList.add("group-end")}}(u,s,r))}afterCellRender(e){this.isActive&&this.config.showGroupBorders&&e.cellElement.classList.toggle("group-end",this.#t.has(e.column.field))}isGroupingActive(){return this.isActive}getGroups(){return this.groups}getGroupColumns(e){const t=this.groups.find(t=>t.id===e);return t?t.columns:[]}refresh(){this.requestRender()}}export{s as GroupingColumnsPlugin};
+const e='<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>',t={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:e,filterActive:e,print:"🖨️"};class r{static dependencies;static manifest;aliases;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}attach(e){this.#e?.abort(),this.#e=new AbortController,this.grid=e,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#e?.abort(),this.#e=void 0}getPlugin(e){return this.grid?.getPlugin(e)}emit(e,t){this.grid?.dispatchEvent?.(new CustomEvent(e,{detail:t,bubbles:!0}))}emitCancelable(e,t){const r=new CustomEvent(e,{detail:t,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(r),r.defaultPrevented}on(e,t){this.grid?._pluginManager?.subscribe(this,e,t)}off(e){this.grid?._pluginManager?.unsubscribe(this,e)}emitPluginEvent(e,t){this.grid?._pluginManager?.emitPluginEvent(e,t)}requestRender(){this.grid?.requestRender?.()}requestColumnsRender(){this.grid?.requestColumnsRender?.()}requestRenderWithFocus(){this.grid?.requestRenderWithFocus?.()}requestAfterRender(){this.grid?.requestAfterRender?.()}get rows(){return this.grid?.rows??[]}get sourceRows(){return this.grid?.sourceRows??[]}get columns(){return this.grid?.columns??[]}get visibleColumns(){return this.grid?._visibleColumns??[]}get gridElement(){return this.grid}get disconnectSignal(){return this.#e?.signal??this.grid?.disconnectSignal}get gridIcons(){const e=this.grid?.gridConfig?.icons??{};return{...t,...e}}get isAnimationEnabled(){const e=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===e||"off"===e)return!1;if(!0===e||"on"===e)return!0;const t=this.gridElement;if(t){return"0"!==getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const e=this.gridElement;if(e){const t=getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(),r=parseInt(t,10);if(!isNaN(r))return r}return 200}resolveIcon(e,t){return void 0!==t?t:this.gridIcons[e]}setIcon(e,t){"string"==typeof t?e.innerHTML=t:t instanceof HTMLElement&&(e.innerHTML="",e.appendChild(t.cloneNode(!0)))}warn(e){console.warn(`[tbw-grid:${this.name}] ${e}`)}}function o(e){if(!e.length)return[];const t=/* @__PURE__ */new Map,r=[],o=(e,t)=>{if(!t.length)return;const o=r[r.length-1];o&&o.implicit&&o.firstIndex+o.columns.length===e?o.columns.push(...t):r.push({id:"__implicit__"+e,label:void 0,columns:t,firstIndex:e,implicit:!0})};let i=[],n=0;return e.forEach((e,s)=>{const l=e.group;if(!l)return 0===i.length&&(n=s),void i.push(e);i.length&&(o(n,i.slice()),i=[]);const d="string"==typeof l?l:l.id;let u=t.get(d);u||(u={id:d,label:"string"==typeof l?void 0:l.label,columns:[],firstIndex:s},t.set(d,u),r.push(u)),u.columns.push(e)}),i.length&&o(n,i),1===r.length&&r[0].implicit&&r[0].columns.length===e.length?[]:r}function i(e,t){const r=e.columns[0],o=e.columns[e.columns.length-1],i=r?t.findIndex(e=>e.field===r.field):-1,n=o?t.findIndex(e=>e.field===o.field):-1;return-1!==i&&-1!==n?[i,n]:null}function n(e,t){const r=/* @__PURE__ */new Set,o=[];for(const n of e){if(String(n.id).startsWith("__implicit__"))continue;const e=i(n,t);e&&o.push(e)}for(const n of e){if(!String(n.id).startsWith("__implicit__"))continue;const e=i(n,t);if(!e)continue;const[s,l]=e;o.some(([e,t])=>s>=e&&l<=t)&&r.add(String(n.id))}return r}class s extends r{static manifest={ownedProperties:[{property:"group",level:"column",description:'the "group" column property'},{property:"columnGroups",level:"config",description:'the "columnGroups" config property',isUsed:e=>Array.isArray(e)&&e.length>0}],queries:[{type:"getColumnGrouping",description:"Returns column group metadata for the visibility panel"}]};name="groupingColumns";styles="@layer tbw-plugins{.header-group-row{display:grid;grid-auto-flow:column;background:var(--tbw-grouping-columns-header-bg, var(--tbw-color-header-bg));border-bottom:1px solid var(--tbw-grouping-columns-border, var(--tbw-color-border))}.header-group-cell{display:flex;align-items:center;justify-content:center;padding:var(--tbw-button-padding-sm, .25rem .5rem);font-weight:600;font-size:var(--tbw-font-size-sm, .9em);text-transform:uppercase;letter-spacing:.5px;border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-group-cell:last-child{border-right:none}.header-row .cell.grouped{border-top:none}.header-row .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-row .cell.group-end:last-child{border-right:none}.rows .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.rows .cell.group-end:last-child{border-right:none}.header-group-row.no-borders{border-bottom:none}.header-group-row.no-borders .header-group-cell{border-right:none}.header-row.no-group-borders .cell.group-end{border-right:1px solid var(--tbw-color-border)}}";get defaultConfig(){return{showGroupBorders:!0,lockGroupOrder:!1}}groups=[];isActive=!1;#t=/* @__PURE__ */new Set;attach(e){super.attach(e),e.addEventListener("column-move",this.#r,{signal:this.disconnectSignal})}detach(){this.groups=[],this.isActive=!1,this.#t.clear()}#r=e=>{if(!this.isActive)return;const t=e,{field:r,columnOrder:o}=t.detail;if(this.config.lockGroupOrder)for(const i of this.groups)if(!i.id.startsWith("__implicit__")&&!this.#o(i,o))return t.preventDefault(),void this.#i(r);this.#n(o)};#n(e){this.#t.clear();const t=this.#s(e);for(const r of this.groups){const o=new Set(r.columns.map(e=>e.field));for(let r=e.length-1;r>=0;r--)if(o.has(e[r])){const o=e[r];o!==t&&this.#t.add(o);break}}}#s(e){if(0===this.groups.length)return null;for(let t=e.length-1;t>=0;t--){const r=e[t];for(const t of this.groups)if(t.columns.some(e=>e.field===r)){const r=new Set(t.columns.map(e=>e.field));for(let t=e.length-1;t>=0;t--)if(r.has(e[t]))return e[t]}}return null}#o(e,t){const r=e.columns.map(e=>t.indexOf(e.field)).filter(e=>-1!==e).sort((e,t)=>e-t);return r.length<=1||r.length===r[r.length-1]-r[0]+1}#i(e){const t=this.gridElement?.querySelector(`.header-row [part~="header-cell"][data-field="${e}"]`);t&&(t.style.setProperty("--_flash-color","var(--tbw-color-error)"),t.animate([{backgroundColor:"rgba(from var(--_flash-color) r g b / 30%)"},{backgroundColor:"transparent"}],{duration:400,easing:"ease-out"}))}handleQuery(e){if("getColumnGrouping"===e.type)return this.#l()}#l(){let e;const t=this.grid?.gridConfig?.columnGroups;if(t&&Array.isArray(t)&&t.length>0)e=t.filter(e=>e.children.length>0).map(e=>({id:e.id,label:e.header,fields:[...e.children]}));else if(this.isActive&&this.groups.length>0){e=this.groups.filter(e=>!e.id.startsWith("__implicit__")).map(e=>({id:e.id,label:e.label??e.id,fields:e.columns.map(e=>e.field)}));const t=this.columns;for(const r of t)if(r.hidden&&r.group){const t="string"==typeof r.group?r.group:r.group.id,o="string"==typeof r.group?r.group:r.group.label??r.group.id,i=e.find(e=>e.id===t);i?i.fields.includes(r.field)||i.fields.push(r.field):e.push({id:t,label:o,fields:[r.field]})}}else{const t=this.columns,r=/* @__PURE__ */new Map;for(const e of t){if(!e.group)continue;const t="string"==typeof e.group?e.group:e.group.id,o="string"==typeof e.group?e.group:e.group.label??e.group.id,i=r.get(t);i?i.fields.includes(e.field)||i.fields.push(e.field):r.set(t,{id:t,label:o,fields:[e.field]})}e=Array.from(r.values())}const r=this.grid?.getColumnOrder();if(r&&r.length>0){const t=new Map(r.map((e,t)=>[e,t]));for(const r of e)r.fields.sort((e,r)=>(t.get(e)??1/0)-(t.get(r)??1/0))}return e}static detect(e,t){if(t?.columnGroups&&Array.isArray(t.columnGroups)&&t.columnGroups.length>0)return!0;const r=t?.columns;return!!Array.isArray(r)&&function(e){return e.some(e=>null!=e.group)}(r)}processColumns(e){const t=this.grid?.gridConfig?.columnGroups;let r;if(t&&Array.isArray(t)&&t.length>0){const o=/* @__PURE__ */new Map;for(const e of t)for(const t of e.children)o.set(t,{id:e.id,label:e.header});r=e.map(e=>{const t=o.get(e.field);return t&&!e.group?{...e,group:t}:e})}else r=[...e];const i=o(r);if(0===i.length)return this.isActive=!1,this.groups=[],r;this.isActive=!0,this.groups=i,this.#t.clear();for(const o of i){const e=o.columns[o.columns.length-1];e?.field&&this.#t.add(e.field)}return r}afterRender(){if(!this.isActive){const e=this.gridElement?.querySelector(".header"),t=e?.querySelector(".header-group-row");return void(t&&t.remove())}const e=this.gridElement?.querySelector(".header");if(!e)return;const t=e.querySelector(".header-group-row");t&&t.remove();const r=this.visibleColumns,s=o(r);if(0===s.length)return;this.#t.clear();const l=n(s,r);for(let o=0;o<s.length;o++){const e=s[o];if(String(e.id).startsWith("__implicit__")&&l.has(String(e.id)))continue;const t=e.columns[e.columns.length-1];t?.field&&o<s.length-1&&this.#t.add(t.field)}const d=function(e,t){if(0===e.length)return null;const r=document.createElement("div");r.className="header-group-row",r.setAttribute("role","row");const o=n(e,t);for(const n of e){const e=String(n.id),s=e.startsWith("__implicit__");if(s&&o.has(e))continue;const l=i(n,t);if(!l)continue;const[d,u]=l,c=u-d+1,g=s?"":n.label||n.id,a=document.createElement("div");a.className="cell header-group-cell",s&&a.classList.add("implicit-group"),a.setAttribute("data-group",e),a.style.gridColumn=`${d+1} / span ${c}`,a.textContent=g,r.appendChild(a)}return r}(s,r);if(d){d.classList.toggle("no-borders",!this.config.showGroupBorders);const t=e.querySelector(".header-row");t?e.insertBefore(d,t):e.appendChild(d)}const u=e.querySelector(".header-row");u&&(u.classList.toggle("no-group-borders",!this.config.showGroupBorders),function(e,t,r){if(!t.length||!e)return;const o=n(t,r),i=/* @__PURE__ */new Map;for(const n of t)if(!String(n.id).startsWith("__implicit__")||!o.has(String(n.id)))for(const e of n.columns)e.field&&i.set(e.field,n.id);const s=Array.from(e.querySelectorAll(".cell[data-field]"));s.forEach(e=>{const t=e.getAttribute("data-field")||"",r=i.get(t);r&&(e.classList.add("grouped"),e.getAttribute("data-group")||e.setAttribute("data-group",r))});for(const n of t){if(String(n.id).startsWith("__implicit__")&&o.has(String(n.id)))continue;const e=n.columns[n.columns.length-1],t=s.find(t=>t.getAttribute("data-field")===e.field);t&&t.classList.add("group-end")}}(u,s,r))}afterCellRender(e){this.isActive&&this.config.showGroupBorders&&e.cellElement.classList.toggle("group-end",this.#t.has(e.column.field))}isGroupingActive(){return this.isActive}getGroups(){return this.groups}getGroupColumns(e){const t=this.groups.find(t=>t.id===e);return t?t.columns:[]}refresh(){this.requestRender()}}export{s as GroupingColumnsPlugin};
 //# sourceMappingURL=index.js.map