@cronocode/react-box 3.1.3 → 3.1.6

package/components/dataGrid/components/dataGridColumnFilter.d.ts

@@ -0,0 +1,11 @@
+import { default as ColumnModel } from '../models/columnModel';
+import { default as GridModel } from '../models/gridModel';
+interface Props<TRow> {
+    column: ColumnModel<TRow>;
+    grid: GridModel<TRow>;
+}
+/**
+ * Main column filter component that renders the appropriate filter type
+ */
+export default function DataGridColumnFilter<TRow>(props: Props<TRow>): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/components/dataGrid/components/dataGridFilterCell.d.ts

@@ -0,0 +1,8 @@
+import { default as ColumnModel } from '../models/columnModel';
+import { default as GridModel } from '../models/gridModel';
+interface Props<TRow> {
+    column: ColumnModel<TRow>;
+    grid: GridModel<TRow>;
+}
+export default function DataGridFilterCell<TRow>(props: Props<TRow>): import("react/jsx-runtime").JSX.Element;
+export {};

package/components/dataGrid/components/dataGridFilterRow.d.ts

@@ -0,0 +1,6 @@
+import { default as GridModel } from '../models/gridModel';
+interface Props<TRow> {
+    grid: GridModel<TRow>;
+}
+export default function DataGridFilterRow<TRow>(props: Props<TRow>): import("react/jsx-runtime").JSX.Element[] | null;
+export {};

package/components/dataGrid/components/dataGridGlobalFilter.d.ts

@@ -0,0 +1,6 @@
+import { default as GridModel } from '../models/gridModel';
+interface Props<TRow> {
+    grid: GridModel<TRow>;
+}
+export default function DataGridGlobalFilter<TRow>(props: Props<TRow>): import("react/jsx-runtime").JSX.Element;
+export {};

package/components/dataGrid/contracts/dataGridContract.d.ts

@@ -18,6 +18,46 @@ export interface PaginationState {
 export type Pagination = boolean | {
     pageSize: number;
 };
+/** Filter type for column-level filtering */
+export type ColumnFilterType = 'text' | 'number' | 'multiselect';
+/** Text filter configuration (fuzzy search) */
+export interface TextFilterValue {
+    type: 'text';
+    value: string;
+}
+/** Number filter configuration with comparison operators */
+export interface NumberFilterValue {
+    type: 'number';
+    operator: 'eq' | 'ne' | 'gt' | 'gte' | 'lt' | 'lte' | 'between';
+    value: number;
+    valueTo?: number;
+}
+/** Multi-select filter configuration */
+export interface MultiselectFilterValue {
+    type: 'multiselect';
+    values: (string | number | boolean | null)[];
+}
+/** Union type for all filter values */
+export type FilterValue = TextFilterValue | NumberFilterValue | MultiselectFilterValue;
+/** Column filters record - maps column key to filter value */
+export type ColumnFilters<TRow> = Partial<Record<keyof TRow | Key, FilterValue>>;
+/** Filter configuration for a column */
+export interface ColumnFilterConfig {
+    type: ColumnFilterType;
+    /** Placeholder text for input */
+    placeholder?: string;
+    /** For multiselect: custom options. If not provided, unique values are computed from data */
+    options?: {
+        label: string;
+        value: string | number | boolean | null;
+    }[];
+    /** For number: step value for input */
+    step?: number;
+    /** For number: min value */
+    min?: number;
+    /** For number: max value */
+    max?: number;
+}
 export interface ColumnType<TRow> {
     key: Key;
     header?: string;
@@ -28,6 +68,8 @@ export interface ColumnType<TRow> {
     Cell?: React.ComponentType<{
         cell: CellModel<TRow>;
     }>;
+    /** Enable filtering for this column. Set to true for default text filter, or provide config */
+    filterable?: boolean | ColumnFilterConfig;
 }
 export interface GridDefinition<TRow> {
     rowKey?: KeysMatching<TRow, Key> | ((rowData: TRow) => Key);
@@ -43,12 +85,24 @@ export interface GridDefinition<TRow> {
     visibleRowsCount?: number;
     topBar?: boolean;
     bottomBar?: boolean;
+    /** Enable global filter with fuzzy search */
+    globalFilter?: boolean;
+    /** Keys of columns to search in global filter. If not provided, all columns are searched */
+    globalFilterKeys?: (keyof TRow | Key)[];
 }
 export interface DataGridProps<TRow> {
     data: TRow[];
     def: GridDefinition<TRow>;
     loading?: boolean;
     onSelectionChange?: (event: SelectionChangeEvent<TRow>) => void;
+    /** Controlled global filter value */
+    globalFilterValue?: string;
+    /** Callback when global filter changes */
+    onGlobalFilterChange?: (value: string) => void;
+    /** Controlled column filters */
+    columnFilters?: ColumnFilters<TRow>;
+    /** Callback when column filters change */
+    onColumnFiltersChange?: (filters: ColumnFilters<TRow>) => void;
 }
 interface SelectionChangeEvent<TRow, TKey = TRow[keyof TRow] | number | string> {
     action: 'select' | 'deselect';

package/components/dataGrid/models/columnModel.d.ts

@@ -14,6 +14,7 @@ export default class ColumnModel<TRow> {
     get Cell(): import('react').ComponentType<{
         cell: import('./cellModel').default<TRow>;
     }> | undefined;
+    get filterable(): boolean | import('../contracts/dataGridContract').ColumnFilterConfig | undefined;
     private _pin?;
     get pin(): PinPosition | undefined;
     get uniqueKey(): string;

package/components/dataGrid/models/gridModel.d.ts

@@ -1,4 +1,4 @@
-import { DataGridProps, Key, PinPosition } from '../contracts/dataGridContract';
+import { ColumnFilters, DataGridProps, FilterValue, Key, PinPosition } from '../contracts/dataGridContract';
 import { default as ColumnModel } from './columnModel';
 import { default as GroupRowModel } from './groupRowModel';
 import { default as RowModel } from './rowModel';
@@ -23,6 +23,57 @@ export default class GridModel<TRow> {
     }>;
     readonly headerRows: import('../../../utils/memo').Memo<ColumnModel<TRow>[][]>;
     readonly gridTemplateColumns: import('../../../utils/memo').Memo<string>;
+    private _globalFilterValue;
+    get globalFilterValue(): string;
+    private _columnFilters;
+    get columnFilters(): ColumnFilters<TRow>;
+    /**
+     * Apply global filter (fuzzy search across all or specified columns)
+     */
+    private applyGlobalFilter;
+    /**
+     * Apply column-level filters
+     */
+    private applyColumnFilters;
+    /**
+     * Check if a cell value matches a filter
+     */
+    private matchesFilter;
+    /**
+     * Get filtered data (applies global filter then column filters)
+     */
+    get filteredData(): TRow[];
+    /**
+     * Set global filter value
+     */
+    setGlobalFilter: (value: string) => void;
+    /**
+     * Set a single column filter
+     */
+    setColumnFilter: (columnKey: Key, filter: FilterValue | undefined) => void;
+    /**
+     * Clear all column filters
+     */
+    clearColumnFilters: () => void;
+    /**
+     * Clear all filters (global + column)
+     */
+    clearAllFilters: () => void;
+    /**
+     * Get unique values for a column (used for multiselect filter options)
+     */
+    getColumnUniqueValues: (columnKey: Key) => (string | number | boolean | null)[];
+    /**
+     * Check if any filter is active
+     */
+    get hasActiveFilters(): boolean;
+    /**
+     * Get count of filtered rows vs total rows
+     */
+    get filterStats(): {
+        filtered: number;
+        total: number;
+    };
     readonly rows: import('../../../utils/memo').Memo<GroupRowModel<TRow>[] | RowModel<TRow>[]>;
     readonly flatRows: import('../../../utils/memo').Memo<(GroupRowModel<TRow> | RowModel<TRow>)[]>;
     get rowHeight(): number;

package/components/dataGrid.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),p=require("../box.cjs"),f=require("./flex.cjs"),g=require("react"),h=require("../core.cjs"),ee=require("./grid.cjs"),U=require("./checkbox.cjs"),C=require("./button.cjs"),_=require("./semantics.cjs"),te=require("./tooltip.cjs"),Re=require("./baseSvg.cjs");function ye(l){const{grid:e}=l;return s.jsxs(f.default,{component:"datagrid.bottomBar",children:[s.jsxs(p.default,{children:["Rows: ",e.props.data.length]}),e.props.def.rowSelection&&s.jsxs(p.default,{children:["Selected: ",e.selectedRows.size]})]})}function ie(l){const{cell:e}=l,t=g.useCallback(()=>{e.grid.toggleRowSelection(e.row.key)},[e.grid,e.row.key]);return s.jsx(U.default,{variant:"datagrid",checked:e.row.selected,onChange:t})}ie.displayName="DataGridCellRowSelection";const ve="NO_PIN";class D{constructor(e,t,i){this.def=e,this.grid=t,this.parent=i,this.columns=e.columns?.map(n=>new D(e.pin?{...n,pin:e.pin}:n,t,this))??[],this.isLeaf&&(this._inlineWidth=this.key==E?void 0:this.def.width??this.grid.DEFAULT_COLUMN_WIDTH_PX,this._pin=e.pin)}columns=[];get visibleColumns(){return this.columns.filter(e=>e.isVisible)}get key(){return this.def.key}get header(){return this.def.header}get align(){return this.def.align}get isLeaf(){return this.columns.length===0}get Cell(){return this.def.Cell}_pin;get pin(){if(this.isLeaf)return this._pin;const e=[...new Set(this.columns.flatMap(t=>t.pin))];if(e.length===1)return e[0]}get uniqueKey(){return`${this.key}${this.pin??""}`}getPinnedColumn(e){if(this.hasPin(e)){if(this.isLeaf)return this;const t=new D({...this.def,pin:e},this.grid,this.parent);return t.columns=this.columns.filter(i=>i.hasPin(e)).map(i=>{const n=i.getPinnedColumn(e);return n.parent=t,n}).filter(i=>!!i),t}}hasPin(e){return this.isLeaf?this._pin===e:this.columns.some(t=>t.hasPin(e))}get death(){return this.parent?this.parent.death+1:0}get flatColumns(){const e=[this];return e.push(...this.columns.flatMap(t=>t.flatColumns)),e}_inlineWidth;get inlineWidth(){if(this.isLeaf)return this._inlineWidth;const e=this.visibleColumns.map(t=>t.inlineWidth).filter(t=>typeof t=="number");if(e.length!==0)return e.sumBy(t=>t)}get left(){let e=0;if(this.parent){const{visibleColumns:t,left:i}=this.parent,n=t.findIndex(o=>o===this);e+=t.sumBy((o,r)=>r<n?o.inlineWidth??0:0),e+=i}else{const t=this.grid.columns.value.left.filter(n=>n.isVisible),i=t.findIndex(n=>n===this);e+=t.sumBy((n,o)=>o<i?n.inlineWidth??0:0)}return e}get right(){let e=0;if(this.parent){const{visibleColumns:t}=this.parent,i=t.reverse(),n=i.findIndex(o=>o===this);e+=i.sumBy((o,r)=>r<n?o.inlineWidth??0:0),e+=this.parent.right}else{const i=this.grid.columns.value.right.filter(o=>o.isVisible).reverse(),n=i.findIndex(o=>o===this);e+=i.sumBy((o,r)=>r<n?o.inlineWidth??0:0)}return e}get isEdge(){if(!this.pin)return!1;if(this.parent){const{visibleColumns:t}=this.parent;return(this.pin==="LEFT"?t.at(-1):t.at(0))===this&&this.parent.isEdge}return(this.pin==="LEFT"?this.grid.columns.value.left.filter(t=>t.isVisible).at(-1):this.grid.columns.value.right.filter(t=>t.isVisible).at(0))===this}get isVisible(){return this.isLeaf?!this.grid.hiddenColumns.has(this.key):this.leafs.some(e=>e.isVisible)}get leafs(){return this.isLeaf?[this]:this.visibleColumns.flatMap(e=>e.leafs)}get groupColumnWidthVarName(){return`--${this.uniqueKey}-group-width`}get widthVarName(){return`--${this.uniqueKey}-width`}get leftVarName(){return`--${this.uniqueKey}-left`}get rightVarName(){return`--${this.uniqueKey}-right`}get gridRows(){return this.isLeaf?this.grid.columns.value.maxDeath-this.death:1}resizeColumn=e=>{this.grid.isResizeMode=!0;const t=e.pageX,{MIN_COLUMN_WIDTH_PX:i,update:n}=this.grid,o=this.leafs.sumBy(d=>d.inlineWidth)-this.leafs.length*i,r=this.leafs.toRecord(d=>[d.key,d.inlineWidth]),c=h.FnUtils.throttle(d=>{const m=(d.pageX-t)*(this.pin==="RIGHT"?-1:1);this.leafs.forEach(w=>{const y=r[w.key],v=o>0?(y-i)/o*m:m/this.leafs.length,L=Math.round(y+v);w.setWidth(L<i?i:L)}),this.grid.sizes.clear(),n()},40),a=new AbortController,u=d=>{a.abort(),this.grid.isResizeMode=!1,n()};window.addEventListener("mousemove",c,a),window.addEventListener("mouseup",u,a)};pinColumn=e=>{this.isLeaf?this._pin=e:this.columns.forEach(t=>t.pinColumn(e)),this.grid.pinColumn(this.uniqueKey,e)};toggleGrouping=()=>{this.grid.toggleGrouping(this.key)};sortColumn=(...e)=>{this.grid.setSortColumn(this.key,...e)};setWidth=e=>{if(!this.isLeaf)throw new Error("Cannot set width for a parent column.");this._inlineWidth!==e&&(this._inlineWidth=e,this.grid.setWidth(this.key,e))};toggleVisibility=()=>{this.grid.toggleColumnVisibility(this.key)}}class be{constructor(e,t,i){this.grid=e,this.row=t,this.column=i}get value(){return this.column.key===R?this.row.rowIndex+1:this.row.data[this.column.key]}}class J{constructor(e,t,i){this.grid=e,this.data=t,this.rowIndex=i,this.grid=e,this.data=t,this.key=this.grid.getRowKey(t)}key;parentRow;count=1;get cells(){return this.grid.columns.value.visibleLeafs.map(e=>new be(this.grid,this,e))}get selected(){return this.grid.selectedRows.has(this.key)}get flatRows(){return this}get allRows(){return this}}const E="empty-cell",R="row-number-cell",Q=70,M="row-selection-cell",j="grouping-cell";class je{constructor(e,t){this.props=e,this.update=t,console.debug("\x1B[32m%s\x1B[0m","[react-box]: DataGrid GridModel ctor")}sourceColumns=h.memo(()=>{const{def:e}=this.props,t=[];if(this.groupColumns.size>0&&t.push(new D({key:j},this)),t.push(...e.columns.map(i=>new D(i,this))),t.push(new D({key:E,Cell:()=>null},this)),e.rowSelection){const i=typeof e.rowSelection=="object"&&e.rowSelection.pinned?"LEFT":void 0;t.unshift(new D({key:M,pin:i,width:50,align:"center",Cell:ie},this))}if(e.showRowNumber){let i,n=Q;typeof e.showRowNumber=="object"&&(e.showRowNumber.pinned&&(i="LEFT"),n=e.showRowNumber.width??Q),t.unshift(new D({key:R,pin:i,width:n,align:"right"},this))}return t});columns=h.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid columns memo");const e=this.sourceColumns.value.map(a=>a.getPinnedColumn("LEFT")).filter(a=>!!a),t=this.sourceColumns.value.map(a=>a.getPinnedColumn()).filter(a=>!!a),i=this.sourceColumns.value.map(a=>a.getPinnedColumn("RIGHT")).filter(a=>!!a),n=[...e,...t,...i].flatMap(a=>a.flatColumns),o=n.filter(a=>a.isLeaf),r=n.filter(a=>a.isLeaf&&a.isVisible),c=n.maxBy(a=>a.death)+1;return{left:e,middle:t,right:i,flat:n,leafs:o,visibleLeafs:r,maxDeath:c}});headerRows=h.memo(()=>(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid headerRows memo"),this.columns.value.flat.groupBy(t=>t.death).sortBy(t=>t.key).map(t=>{const i=t.values.groupBy(n=>n.pin??ve).toRecord(n=>[n.key,n.values]);return[...i.LEFT?.filter(n=>n.isVisible)??[],...i.NO_PIN?.filter(n=>n.isVisible)??[],...i.RIGHT?.filter(n=>n.isVisible)??[]]})));gridTemplateColumns=h.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid gridTemplateColumns memo");const{visibleLeafs:e}=this.columns.value,t=e.sumBy(r=>r.pin==="RIGHT"?1:0),i=e.length-t-1,n=i>0?`repeat(${i}, max-content)`:"",o=t>0?`repeat(${t}, max-content)`:"";return`${n} auto ${o}`});rows=h.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid rows memo");let e=this.props.data;if(this._sortColumn&&(e=e.sortBy(t=>t[this._sortColumn],this._sortDirection)),this.groupColumns.size>0){const t=(i,n,o)=>{const r=n.values().next().value;n.delete(r);const c=this.columns.value.leafs.findOrThrow(a=>a.key===r);return this._sortColumn===j&&(i=i.sortBy(a=>a[r],this._sortDirection)),i.groupBy(a=>a[r]).map(a=>{let u;n.size>0?u=t(a.values,new Set(n),o+1):u=a.values.map((m,w)=>new J(this,m,o+1+w));const d=new se(this,c,u,o,a.key);return o+=1,d.expanded&&(o+=u.length),d})};return t(e,new Set(this.groupColumns),0)}return e.map((t,i)=>new J(this,t,i))});flatRows=h.memo(()=>(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid flatRows memo"),this.rows.value.flatMap(e=>e.flatRows)));get rowHeight(){return this.props.def.rowHeight??this.DEFAULT_ROW_HEIGHT_PX}sizes=h.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid sizes memo");const e=this.columns.value.flat.reduce((n,o)=>{const{inlineWidth:r}=o;return typeof r=="number"&&(n[o.widthVarName]=`${o.inlineWidth}px`),o.pin==="LEFT"&&(n[o.leftVarName]=`${o.left}px`),o.pin==="RIGHT"&&(n[o.rightVarName]=`${o.right}px`),n},{});e[this.rowHeightVarName]=`${this.rowHeight}px`,e[this.leftEdgeVarName]=`${this.leftEdge}px`;const{visibleLeafs:t}=this.columns.value,i=t.find(n=>n.key===j);if(i){const n=t.sumBy(o=>o.pin===i.pin&&o.key!==R&&o.key!==M?o.inlineWidth??0:0);e[i.groupColumnWidthVarName]=`${n}px`}return this.groupColumns.forEach(n=>{const o=this.columns.value.leafs.findOrThrow(r=>r.key===n);e[o.groupColumnWidthVarName]=`${t.sumBy(r=>r.pin===o.pin?r.inlineWidth??0:0)}px`}),e});DEFAULT_ROW_HEIGHT_PX=48;MIN_COLUMN_WIDTH_PX=48;DEFAULT_COLUMN_WIDTH_PX=200;isResizeMode=!1;expandedGroupRow=new Set;selectedRows=new Set;get leftEdge(){return this.columns.value.left.sumBy(e=>e.inlineWidth??0)}get rightEdge(){return this.columns.value.right.sumBy(e=>e.inlineWidth??0)}leftEdgeVarName="--left-edge";rowHeightVarName="--row-height";_idMap=new WeakMap;getRowKey(e){const{rowKey:t}=this.props.def;return t?typeof t=="function"?t(e):e[t]:(this._idMap.has(e)||this._idMap.set(e,crypto.randomUUID()),this._idMap.get(e))}setSortColumn=(e,...t)=>{if(t.length>0)[this._sortDirection]=t,this._sortColumn=this._sortDirection?e:void 0;else{const{_sortColumn:i,_sortDirection:n}=this;this._sortColumn=i===e&&n==="DESC"?void 0:e,this._sortDirection=i===e&&n==="ASC"?"DESC":"ASC"}this.headerRows.clear(),this.rows.clear(),this.flatRows.clear(),this.update()};pinColumn=(e,t)=>{const i=this.columns.value.flat.findOrThrow(n=>n.uniqueKey===e);i.pin!==t&&i.pinColumn(t),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};toggleGrouping=e=>{this.groupColumns=new Set(this.groupColumns),this.hiddenColumns=new Set(this.hiddenColumns),this.groupColumns.has(e)?(this.groupColumns.delete(e),this.hiddenColumns.delete(e)):(this.groupColumns.add(e),this.hiddenColumns.add(e)),this.sourceColumns.clear(),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};unGroupAll=()=>{this.groupColumns=new Set,this.sourceColumns.clear(),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};toggleGroupRow=e=>{this.expandedGroupRow=new Set(this.expandedGroupRow),this.expandedGroupRow.has(e)?this.expandedGroupRow.delete(e):this.expandedGroupRow.add(e),this.rows.clear(),this.flatRows.clear(),this.update()};toggleRowSelection=e=>{this.toggleRowsSelection([e])};toggleRowsSelection=e=>{this.selectedRows=new Set(this.selectedRows);const t=e.every(i=>this.selectedRows.has(i));t?e.forEach(i=>this.selectedRows.delete(i)):e.forEach(i=>this.selectedRows.add(i)),this.flatRows.clear(),this.update(),this.props.onSelectionChange?.({action:t?"deselect":"select",affectedRowKeys:e,selectedRowKeys:Array.from(this.selectedRows),isAllSelected:this.selectedRows.size===this.props.data.length})};toggleSelectAllRows=()=>{this.toggleRowsSelection(this.props.data.map(e=>this.getRowKey(e)))};toggleColumnVisibility=e=>{this.hiddenColumns=new Set(this.hiddenColumns),this.hiddenColumns.has(e)?this.hiddenColumns.delete(e):this.hiddenColumns.add(e),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};setWidth=(e,t)=>{const i=this.columns.value.leafs.find(o=>o.key===e);if(!i)throw new Error("Leaf column not found.");i.setWidth(t),this.sourceColumns.value.flatMap(o=>o.flatColumns).findOrThrow(o=>o.key===e).setWidth(t)};groupColumns=new Set;hiddenColumns=new Set;_sortColumn;get sortColumn(){return this._sortColumn}_sortDirection="ASC";get sortDirection(){return this._sortDirection}}class Ge{constructor(e,t,i){this.grid=e,this.row=t,this.column=i}get value(){return this.column.key===R?this.row.rowIndex+1:this.column.key===j?`${this.row.groupValue} (${this.row.count})`:null}}class se{constructor(e,t,i,n,o){this.grid=e,this.groupColumn=t,this.rows=i,this.rowIndex=n,this.groupValue=o,i.forEach(r=>r.parentRow=this)}get key(){return`${this.parentRow?.key??""}${this.groupColumn.key}${this.groupValue}`}parentRow;get cells(){return this.grid.columns.value.visibleLeafs.map(e=>new Ge(this.grid,this,e))}get selected(){return this.allRows.every(e=>e.selected)}get indeterminate(){return!this.selected&&this.allRows.some(e=>e.selected)}get expanded(){return this.grid.expandedGroupRow.has(this.key)}get depth(){return this.parentRow?this.parentRow.depth+1:0}get count(){return this.rows.sumBy(e=>e.count,0)}get flatRows(){return this.expanded?[this,...this.rows.flatMap(e=>e.flatRows)]:[this]}get allRows(){return this.rows.flatMap(e=>e.allRows)}get groupingColumn(){return this.grid.columns.value.leafs.findOrThrow(e=>e.key===j)}get groupingColumnGridColumn(){const{visibleLeafs:e}=this.grid.columns.value,{groupingColumn:t}=this;return e.sumBy(n=>n.pin===t.pin&&n.key!==E&&n.key!==M&&n.key!==R?1:0)}toggleRow(){this.grid.toggleGroupRow(this.key)}}function A(l){const{children:e,column:t,style:i,...n}=l,{key:o,pin:r,left:c,right:a,isEdge:u,align:d,widthVarName:m,leftVarName:w,rightVarName:y}=t;"align"in t.def&&(n.jc=d);const v=o===R,L=o===M,G=r==="LEFT",k=r==="RIGHT",b=G||k,x=G&&c===0,S=G&&u,T=k&&u,N=k&&a===0;return s.jsx(f.default,{component:"datagrid.body.cell",props:{role:"cell"},variant:{isPinned:b,isFirstLeftPinned:x,isLastLeftPinned:S,isFirstRightPinned:T,isLastRightPinned:N,isRowSelection:L,isRowNumber:v},style:{width:`var(${m})`,height:`var(${t.grid.rowHeightVarName})`,left:G?`var(${w})`:void 0,right:k?`var(${y})`:void 0,...i},...n,children:e})}A.displayName="DataGridCell";function ne(l){const{row:e}=l,{selected:t,indeterminate:i,cells:n,groupingColumn:o,groupingColumnGridColumn:r,depth:c,expanded:a}=e,u=g.useCallback(()=>{e.grid.toggleRowsSelection(e.allRows.map(d=>d.key))},[]);return s.jsx(f.default,{className:"grid-row",selected:t,display:"contents",props:{role:"rowgroup"},children:n.map(d=>{const{key:m,pin:w,groupColumnWidthVarName:y}=d.column,v=w==="RIGHT";if(m===j)return s.jsx(A,{column:d.column,style:{width:`var(${y})`,right:v?"0":void 0},br:o.pin==="LEFT"?1:void 0,gridColumn:r,pl:4*c,overflow:"auto",children:s.jsx(p.default,{textWrap:"nowrap",px:3,children:s.jsxs(C.default,{clean:!0,onClick:()=>e.toggleRow(),cursor:"pointer",display:"flex",gap:1,ai:"center",children:[s.jsx(h.ExpandIcon,{fill:"currentColor",width:"14px",height:"14px",rotate:a?0:-90}),d.value]})})},m);if(m===M)return s.jsx(A,{column:d.column,children:s.jsx(U.default,{variant:"datagrid",m:1,checked:t,indeterminate:i,onChange:u})},m);if(w!==o.pin||m===R||m===E)return s.jsx(A,{column:d.column,px:m===R?3:void 0,children:d.value},m)})})}ne.displayName="DataGridGroupRow";function oe(l){const{cell:e}=l;return s.jsx(f.default,{height:"fit",width:"fit",overflow:"auto",ai:"center",jc:e.column.align,children:s.jsx(p.default,{px:3,textOverflow:"ellipsis",overflow:"hidden",textWrap:"nowrap",children:e.value})})}oe.displayName="DataGridCellText";function re(l){const{row:e}=l,{selected:t}=e;return s.jsx(f.default,{className:"grid-row",selected:t,display:"contents",props:{role:"row"},children:e.cells.map(i=>s.jsx(A,{column:i.column,children:i.column.Cell?s.jsx(i.column.Cell,{cell:i}):s.jsx(oe,{cell:i})},i.column.key))})}re.displayName="DataGridRow";const ke=10,Z=20;function le(l){const{grid:e,scrollTop:t}=l,i=e.flatRows.value.length,n=Math.max(0,Math.floor(t/e.rowHeight)-Z),o=e.props.def.visibleRowsCount??ke,r=e.rowHeight*o+e.rowHeight/5,c=g.useMemo(()=>{if(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render rows"),e.props.data.length===0)return s.jsx(f.default,{jc:"center",ai:"center",gridColumn:"full-row",style:{height:r},children:e.props.loading?"loading...":"empty"});const a=o+Z*2;return e.flatRows.value.take(a,n).map(d=>d instanceof se?s.jsx(ne,{row:d},d.key):s.jsx(re,{row:d},d.key))},[e.flatRows.value,e.props.data.length,e.props.loading,n,r,o]);return console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render DataGridBody"),s.jsx(p.default,{style:{height:r},children:s.jsx(p.default,{style:{height:`${i*e.rowHeight}px`},children:s.jsx(ee.default,{component:"datagrid.body",width:"max-content",minWidth:"fit",transition:"none",style:{transform:`translateY(${n*e.rowHeight}px)`,gridTemplateColumns:e.gridTemplateColumns.value},children:c})})})}le.displayName="DataGridBody";function ae(l){const{column:e}=l,{key:t,pin:i,left:n,right:o,isEdge:r,isLeaf:c,align:a,header:u,grid:d}=e,[m,w,y]=h.useVisibility({hideOnScroll:!0,event:"mousedown"}),[v,L]=g.useState({top:0,left:0}),G=g.useMemo(()=>v.left>window.innerWidth/2,[v.left]),k=c&&(d.sortColumn!==t||d.sortDirection==="DESC"),b=c&&(d.sortColumn!==t||d.sortDirection==="ASC"),x=c&&d.sortColumn===t,S=i!=="LEFT",T=i!=="RIGHT",N=!!i,P=c&&t!==j,I=c&&t===j,O=k||b||x,$=S||T||N,F=a==="right"?2:void 0,q=a==="right"?void 0:i==="RIGHT"?2.5:4,X=t===E,W=t===R,Y=t===M,H=i==="LEFT",V=i==="RIGHT",K=H||i==="RIGHT",B=H&&n===0,z=H&&r,we=V&&r,Ce=V&&o===0,xe=c&&!X&&!W&&!Y;return s.jsx(f.default,{position:"absolute",left:F,right:q,top:"1/2",translateY:-3,ai:"center",children:s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu",onClick:()=>w(!m),variant:{isPinned:K,isFirstLeftPinned:B,isLastLeftPinned:z,isFirstRightPinned:we,isLastRightPinned:Ce,isSortable:xe,isRowNumber:W},children:[s.jsx(_.Span,{component:"datagrid.header.cell.contextMenu.icon",children:s.jsx(h.DotsIcon,{fill:"currentColor"})}),m&&s.jsxs(te.default,{component:"datagrid.header.cell.contextMenu.tooltip",variant:{openLeft:G},onPositionChange:L,ref:y,children:[k&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn("ASC"),children:[s.jsx(_.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:s.jsx(h.SortIcon,{width:"100%",fill:"currentColor"})}),"Sort Ascending"]}),b&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn("DESC"),children:[s.jsx(_.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:s.jsx(h.SortIcon,{width:"100%",fill:"currentColor",rotate:180})}),"Sort Descending"]}),x&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn(void 0),children:[s.jsx(p.default,{width:4}),"Clear Sort"]}),O&&($||P||I)&&s.jsx(p.default,{bb:1,my:2,borderColor:"gray-300"}),S&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn("LEFT"),children:[s.jsx(_.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:s.jsx(h.PinIcon,{width:"100%",fill:"currentColor"})}),"Pin Left"]}),T&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn("RIGHT"),children:[s.jsx(_.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:s.jsx(h.PinIcon,{width:"100%",fill:"currentColor",rotate:-90})}),"Pin Right"]}),N&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn(),children:[s.jsx(p.default,{width:4}),"Unpin"]}),O&&$&&(P||I)&&s.jsx(p.default,{bb:1,my:2,borderColor:"gray-300"}),P&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:e.toggleGrouping,children:[s.jsx(_.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:s.jsx(h.GroupingIcon,{width:"100%",fill:"currentColor"})}),s.jsxs(p.default,{textWrap:"nowrap",children:["Group by ",u??t]})]}),I&&s.jsxs(C.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:d.unGroupAll,children:[s.jsx(_.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:s.jsx(h.GroupingIcon,{width:"100%",fill:"currentColor"})}),s.jsx(p.default,{textWrap:"nowrap",children:"Un-Group All"})]})]})]})})}ae.displayName="DataGridHeaderCellContextMenu";function de(l){const{column:e}=l;return s.jsx(f.default,{height:"fit",ai:"center",position:"absolute",right:e.pin==="RIGHT"?void 0:0,left:e.pin!=="RIGHT"?void 0:0,py:3,children:s.jsx(p.default,{cursor:"col-resize",px:.75,className:"resizer",height:"fit",props:{onMouseDown:e.resizeColumn,onTouchStart:e.resizeColumn},children:s.jsx(p.default,{component:"datagrid.header.cell.resizer"})})})}de.displayName="DataGridHeaderCellResizer";function ue(l){const{column:e}=l,{key:t,pin:i,left:n,right:o,isEdge:r,isLeaf:c,leafs:a,grid:u,header:d,gridRows:m,widthVarName:w,leftVarName:y,rightVarName:v,inlineWidth:L}=e,G=t===E,k=t===j,b=t===R,x=t===M,S=i==="LEFT",T=i==="RIGHT",N=S||i==="RIGHT",P=S&&n===0,I=S&&r,O=T&&r,$=T&&o===0,F=c&&!G&&!b&&!x,q=c?1:a.length,X=!b&&!x,W=!b&&!x,Y=x?void 0:e.align==="right"?10:3,H=x?void 0:e.align==="center"?3:void 0,V=g.useCallback(()=>{u.toggleSelectAllRows()},[]),K=g.useMemo(()=>{if(b)return null;if(x){const B=u.selectedRows.size===u.props.data.length,z=!B&&u.selectedRows.size>0;return s.jsx(U.default,{variant:"datagrid",m:1,indeterminate:z,checked:B,onChange:V})}if(k){if(u.groupColumns.size===1){const B=u.columns.value.leafs.findOrThrow(z=>z.key===u.groupColumns.values().next().value);return B.header??B.key}return"Group"}return d??t},[u.groupColumns,u.selectedRows,V]);return s.jsx(f.default,{props:{role:"columnheader"},component:"datagrid.header.cell",variant:{isPinned:N,isFirstLeftPinned:P,isLastLeftPinned:I,isFirstRightPinned:O,isLastRightPinned:$,isSortable:F,isRowNumber:b},gridRow:m,gridColumn:q,style:{width:`var(${w})`,left:S?`var(${y})`:void 0,right:T?`var(${v})`:void 0},children:!G&&s.jsxs(s.Fragment,{children:[s.jsx(f.default,{width:"fit",height:"fit",jc:e.align,props:{onClick:F?()=>e.sortColumn():void 0},children:s.jsxs(f.default,{overflow:"hidden",position:c?void 0:"sticky",ai:"center",transition:"none",pl:Y,pr:H,style:{left:i?void 0:`var(${u.leftEdgeVarName})`},children:[s.jsx(p.default,{overflow:"hidden",textOverflow:"ellipsis",textWrap:"nowrap",children:K}),t===u.sortColumn&&s.jsx(p.default,{pl:(L??0)<58?0:2,children:s.jsx(h.SortIcon,{width:"16px",rotate:u.sortDirection==="ASC"?0:180,fill:"currentColor"})}),W&&s.jsx(p.default,{minWidth:e.align==="right"?4:10})]})}),X&&s.jsx(de,{column:e}),W&&s.jsx(ae,{column:e})]})})}ue.displayName="DataGridHeaderCell";function ce(l){const{grid:e}=l,{isResizeMode:t}=e;return s.jsx(ee.default,{component:"datagrid.header",variant:{isResizeMode:t},style:{gridTemplateColumns:e.gridTemplateColumns.value},children:e.headerRows.value.map(i=>i.map(n=>s.jsx(ue,{column:n},n.uniqueKey)))})}ce.displayName="DataGridHeader";function he(l){const{grid:e}=l,[t,i]=g.useState(0),n=g.useCallback(h.FnUtils.throttle(o=>{i(o.target.scrollTop)},100),[]);return s.jsxs(p.default,{overflowX:"scroll",props:{onScroll:n},children:[s.jsx(ce,{grid:e}),s.jsx(le,{grid:e,scrollTop:t})]})}he.displayName="DataGridContent";function me(l){const{grid:e}=l;return e.groupColumns.size===0?null:s.jsxs(f.default,{component:"datagrid.topBar.columnGroups",children:[s.jsx(_.Span,{component:"datagrid.topBar.columnGroups.icon",children:s.jsx(h.GroupingIcon,{width:"100%",fill:"currentColor"})}),Array.from(e.groupColumns,t=>{const i=e.columns.value.leafs.findOrThrow(n=>n.key===t);return s.jsxs(g.Fragment,{children:[s.jsx(h.ExpandIcon,{fill:"currentColor",width:"14px",height:"14px",rotate:-90}),s.jsxs(f.default,{component:"datagrid.topBar.columnGroups.item",children:[i.header??i.key,s.jsx(C.default,{component:"datagrid.topBar.columnGroups.item.icon",onClick:()=>e.toggleGrouping(i.key),children:s.jsx(h.CloseSvg,{fill:"currentColor",width:"100%"})})]})]},t)})]})}me.displayName="DataGridColumnGroups";function pe(l){const{grid:e}=l,[t,i,n]=h.useVisibility({event:"mousedown"}),o=g.useMemo(()=>e.columns.value.leafs.filter(r=>![E,R,M,j].includes(r.key)),[e.columns.value.leafs]);return s.jsxs(C.default,{component:"datagrid.topBar.contextMenu",onClick:()=>i(!t),children:[s.jsx(Re.default,{viewBox:"0 0 24 24",width:"20",fill:"currentColor",...l,children:s.jsx("path",{d:"M5 6h14M5 12h14M5 18h14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})}),t&&s.jsx(te.default,{component:"datagrid.topBar.contextMenu.tooltip",ref:n,children:o.map(r=>s.jsxs(C.default,{component:"datagrid.topBar.contextMenu.tooltip.item",onClick:c=>{c.stopPropagation(),r.toggleVisibility()},children:[s.jsx(U.default,{variant:"datagrid",checked:r.isVisible,onChange:()=>{},focus:{outline:0}}),r.header??r.key]},r.key))})]})}pe.displayName="DataGridTopBarContextMenu";function ge(l){const{grid:e}=l;return s.jsxs(f.default,{component:"datagrid.topBar",position:"relative",children:[s.jsx(pe,{grid:e}),s.jsx(me,{grid:e})]})}ge.displayName="DataGridTopBar";function Se(l){const[e,t]=g.useState(0),i=g.useRef();return i.current||(i.current=new je(l,()=>t(n=>n+1))),g.useEffect(()=>{i.current.props=l,i.current.rows.clear(),i.current.flatRows.clear(),i.current.update()},[l.data]),g.useEffect(()=>{i.current.props=l,i.current.sourceColumns.clear(),i.current.columns.clear(),i.current.headerRows.clear(),i.current.gridTemplateColumns.clear(),i.current.rows.clear(),i.current.flatRows.clear(),i.current.sizes.clear(),i.current.update()},[l.def]),g.useEffect(()=>{i.current.props=l,i.current.update()},[l.loading]),i.current}function fe(l){const e=Se(l);return console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render"),s.jsxs(p.default,{component:"datagrid",style:e.sizes.value,props:{role:"presentation"},children:[e.props.def.topBar&&s.jsx(ge,{grid:e}),s.jsx(he,{grid:e}),e.props.def.bottomBar&&s.jsx(ye,{grid:e})]})}fe.displayName="DataGrid";exports.default=fe;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),f=require("../box.cjs"),m=require("./flex.cjs"),d=require("react"),ne=require("./grid.cjs"),C=require("../core.cjs"),X=require("./checkbox.cjs"),S=require("./button.cjs"),L=require("./dropdown.cjs"),O=require("./textbox.cjs"),M=require("./semantics.cjs"),se=require("./tooltip.cjs"),Ge=require("./baseSvg.cjs");function Fe(o){const{grid:e}=o,{filtered:t,total:i}=e.filterStats,s=e.hasActiveFilters;return n.jsxs(m.default,{component:"datagrid.bottomBar",children:[n.jsxs(f.default,{children:["Rows: ",s?`${t} / ${i}`:i]}),e.props.def.rowSelection&&n.jsxs(f.default,{children:["Selected: ",e.selectedRows.size]}),s&&n.jsx(f.default,{color:"blue-600",cursor:"pointer",hover:{textDecoration:"underline"},props:{onClick:e.clearAllFilters},children:"Clear filters"})]})}function re(o){const{cell:e}=o,t=d.useCallback(()=>{e.grid.toggleRowSelection(e.row.key)},[e.grid,e.row.key]);return n.jsx(X.default,{variant:"datagrid",checked:e.row.selected,onChange:t})}re.displayName="DataGridCellRowSelection";const Se="NO_PIN";class B{constructor(e,t,i){this.def=e,this.grid=t,this.parent=i,this.columns=e.columns?.map(s=>new B(e.pin?{...s,pin:e.pin}:s,t,this))??[],this.isLeaf&&(this._inlineWidth=this.key==E?void 0:this.def.width??this.grid.DEFAULT_COLUMN_WIDTH_PX,this._pin=e.pin)}columns=[];get visibleColumns(){return this.columns.filter(e=>e.isVisible)}get key(){return this.def.key}get header(){return this.def.header}get align(){return this.def.align}get isLeaf(){return this.columns.length===0}get Cell(){return this.def.Cell}get filterable(){return this.def.filterable}_pin;get pin(){if(this.isLeaf)return this._pin;const e=[...new Set(this.columns.flatMap(t=>t.pin))];if(e.length===1)return e[0]}get uniqueKey(){return`${this.key}${this.pin??""}`}getPinnedColumn(e){if(this.hasPin(e)){if(this.isLeaf)return this;const t=new B({...this.def,pin:e},this.grid,this.parent);return t.columns=this.columns.filter(i=>i.hasPin(e)).map(i=>{const s=i.getPinnedColumn(e);return s.parent=t,s}).filter(i=>!!i),t}}hasPin(e){return this.isLeaf?this._pin===e:this.columns.some(t=>t.hasPin(e))}get death(){return this.parent?this.parent.death+1:0}get flatColumns(){const e=[this];return e.push(...this.columns.flatMap(t=>t.flatColumns)),e}_inlineWidth;get inlineWidth(){if(this.isLeaf)return this._inlineWidth;const e=this.visibleColumns.map(t=>t.inlineWidth).filter(t=>typeof t=="number");if(e.length!==0)return e.sumBy(t=>t)}get left(){let e=0;if(this.parent){const{visibleColumns:t,left:i}=this.parent,s=t.findIndex(r=>r===this);e+=t.sumBy((r,l)=>l<s?r.inlineWidth??0:0),e+=i}else{const t=this.grid.columns.value.left.filter(s=>s.isVisible),i=t.findIndex(s=>s===this);e+=t.sumBy((s,r)=>r<i?s.inlineWidth??0:0)}return e}get right(){let e=0;if(this.parent){const{visibleColumns:t}=this.parent,i=t.reverse(),s=i.findIndex(r=>r===this);e+=i.sumBy((r,l)=>l<s?r.inlineWidth??0:0),e+=this.parent.right}else{const i=this.grid.columns.value.right.filter(r=>r.isVisible).reverse(),s=i.findIndex(r=>r===this);e+=i.sumBy((r,l)=>l<s?r.inlineWidth??0:0)}return e}get isEdge(){if(!this.pin)return!1;if(this.parent){const{visibleColumns:t}=this.parent;return(this.pin==="LEFT"?t.at(-1):t.at(0))===this&&this.parent.isEdge}return(this.pin==="LEFT"?this.grid.columns.value.left.filter(t=>t.isVisible).at(-1):this.grid.columns.value.right.filter(t=>t.isVisible).at(0))===this}get isVisible(){return this.isLeaf?!this.grid.hiddenColumns.has(this.key):this.leafs.some(e=>e.isVisible)}get leafs(){return this.isLeaf?[this]:this.visibleColumns.flatMap(e=>e.leafs)}get groupColumnWidthVarName(){return`--${this.uniqueKey}-group-width`}get widthVarName(){return`--${this.uniqueKey}-width`}get leftVarName(){return`--${this.uniqueKey}-left`}get rightVarName(){return`--${this.uniqueKey}-right`}get gridRows(){return this.isLeaf?this.grid.columns.value.maxDeath-this.death:1}resizeColumn=e=>{this.grid.isResizeMode=!0;const t=e.pageX,{MIN_COLUMN_WIDTH_PX:i,update:s}=this.grid,r=this.leafs.sumBy(u=>u.inlineWidth)-this.leafs.length*i,l=this.leafs.toRecord(u=>[u.key,u.inlineWidth]),c=C.FnUtils.throttle(u=>{const p=(u.pageX-t)*(this.pin==="RIGHT"?-1:1);this.leafs.forEach(w=>{const y=l[w.key],v=r>0?(y-i)/r*p:p/this.leafs.length,R=Math.round(y+v);w.setWidth(R<i?i:R)}),this.grid.sizes.clear(),s()},40),a=new AbortController,h=u=>{a.abort(),this.grid.isResizeMode=!1,s()};window.addEventListener("mousemove",c,a),window.addEventListener("mouseup",h,a)};pinColumn=e=>{this.isLeaf?this._pin=e:this.columns.forEach(t=>t.pinColumn(e)),this.grid.pinColumn(this.uniqueKey,e)};toggleGrouping=()=>{this.grid.toggleGrouping(this.key)};sortColumn=(...e)=>{this.grid.setSortColumn(this.key,...e)};setWidth=e=>{if(!this.isLeaf)throw new Error("Cannot set width for a parent column.");this._inlineWidth!==e&&(this._inlineWidth=e,this.grid.setWidth(this.key,e))};toggleVisibility=()=>{this.grid.toggleColumnVisibility(this.key)}}class Te{constructor(e,t,i){this.grid=e,this.row=t,this.column=i}get value(){return this.column.key===T?this.row.rowIndex+1:this.row.data[this.column.key]}}class Z{constructor(e,t,i){this.grid=e,this.data=t,this.rowIndex=i,this.grid=e,this.data=t,this.key=this.grid.getRowKey(t)}key;parentRow;count=1;get cells(){return this.grid.columns.value.visibleLeafs.map(e=>new Te(this.grid,this,e))}get selected(){return this.grid.selectedRows.has(this.key)}get flatRows(){return this}get allRows(){return this}}const E="empty-cell",T="row-number-cell",ee=70,N="row-selection-cell",_="grouping-cell";class Le{constructor(e,t){this.props=e,this.update=t,console.debug("\x1B[32m%s\x1B[0m","[react-box]: DataGrid GridModel ctor")}sourceColumns=C.memo(()=>{const{def:e}=this.props,t=[];if(this.groupColumns.size>0&&t.push(new B({key:_},this)),t.push(...e.columns.map(i=>new B(i,this))),t.push(new B({key:E,Cell:()=>null},this)),e.rowSelection){const i=typeof e.rowSelection=="object"&&e.rowSelection.pinned?"LEFT":void 0;t.unshift(new B({key:N,pin:i,width:50,align:"center",Cell:re},this))}if(e.showRowNumber){let i,s=ee;typeof e.showRowNumber=="object"&&(e.showRowNumber.pinned&&(i="LEFT"),s=e.showRowNumber.width??ee),t.unshift(new B({key:T,pin:i,width:s,align:"right"},this))}return t});columns=C.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid columns memo");const e=this.sourceColumns.value.map(a=>a.getPinnedColumn("LEFT")).filter(a=>!!a),t=this.sourceColumns.value.map(a=>a.getPinnedColumn()).filter(a=>!!a),i=this.sourceColumns.value.map(a=>a.getPinnedColumn("RIGHT")).filter(a=>!!a),s=[...e,...t,...i].flatMap(a=>a.flatColumns),r=s.filter(a=>a.isLeaf),l=s.filter(a=>a.isLeaf&&a.isVisible),c=s.maxBy(a=>a.death)+1;return{left:e,middle:t,right:i,flat:s,leafs:r,visibleLeafs:l,maxDeath:c}});headerRows=C.memo(()=>(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid headerRows memo"),this.columns.value.flat.groupBy(t=>t.death).sortBy(t=>t.key).map(t=>{const i=t.values.groupBy(s=>s.pin??Se).toRecord(s=>[s.key,s.values]);return[...i.LEFT?.filter(s=>s.isVisible)??[],...i.NO_PIN?.filter(s=>s.isVisible)??[],...i.RIGHT?.filter(s=>s.isVisible)??[]]})));gridTemplateColumns=C.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid gridTemplateColumns memo");const{visibleLeafs:e}=this.columns.value,t=e.sumBy(l=>l.pin==="RIGHT"?1:0),i=e.length-t-1,s=i>0?`repeat(${i}, max-content)`:"",r=t>0?`repeat(${t}, max-content)`:"";return`${s} auto ${r}`});_globalFilterValue="";get globalFilterValue(){return this.props.globalFilterValue??this._globalFilterValue}_columnFilters={};get columnFilters(){return this.props.columnFilters??this._columnFilters}applyGlobalFilter(e){const t=this.globalFilterValue.trim();if(!t)return e;const{globalFilterKeys:i}=this.props.def,s=i??this.columns.value.leafs.filter(r=>r.key!==E&&r.key!==T&&r.key!==N&&r.key!==_).map(r=>r.key);return e.filter(r=>s.some(l=>{const c=r[l];return c==null?!1:C.fuzzySearch(t,String(c))}))}applyColumnFilters(e){const t=this.columnFilters,i=Object.keys(t);return i.length===0?e:e.filter(s=>i.every(r=>{const l=t[r];if(!l)return!0;const c=s[r];return this.matchesFilter(c,l)}))}matchesFilter(e,t){switch(t.type){case"text":return t.value.trim()?e==null?!1:C.fuzzySearch(t.value,String(e)):!0;case"number":{if(e==null)return!1;const i=typeof e=="number"?e:parseFloat(String(e));if(isNaN(i))return!1;switch(t.operator){case"eq":return i===t.value;case"ne":return i!==t.value;case"gt":return i>t.value;case"gte":return i>=t.value;case"lt":return i<t.value;case"lte":return i<=t.value;case"between":return t.valueTo!==void 0?i>=t.value&&i<=t.valueTo:i>=t.value;default:return!0}}case"multiselect":return t.values.length===0?!0:t.values.includes(e);default:return!0}}get filteredData(){let e=this.props.data;return this.props.def.globalFilter&&(e=this.applyGlobalFilter(e)),e=this.applyColumnFilters(e),e}setGlobalFilter=e=>{this.props.onGlobalFilterChange?this.props.onGlobalFilterChange(e):this._globalFilterValue=e,this.rows.clear(),this.flatRows.clear(),this.update()};setColumnFilter=(e,t)=>{const i={...this.columnFilters};t===void 0?delete i[e]:i[e]=t,this.props.onColumnFiltersChange?this.props.onColumnFiltersChange(i):this._columnFilters=i,this.rows.clear(),this.flatRows.clear(),this.update()};clearColumnFilters=()=>{this.props.onColumnFiltersChange?this.props.onColumnFiltersChange({}):this._columnFilters={},this.rows.clear(),this.flatRows.clear(),this.update()};clearAllFilters=()=>{this.setGlobalFilter(""),this.clearColumnFilters()};getColumnUniqueValues=e=>{const t=new Set;return this.props.data.forEach(i=>{const s=i[e];s!==void 0&&t.add(s)}),Array.from(t).sort((i,s)=>i===null?1:s===null?-1:typeof i=="string"&&typeof s=="string"?i.localeCompare(s):typeof i=="number"&&typeof s=="number"?i-s:String(i).localeCompare(String(s)))};get hasActiveFilters(){return this.globalFilterValue.trim()!==""||Object.keys(this.columnFilters).length>0}get filterStats(){return{filtered:this.filteredData.length,total:this.props.data.length}}rows=C.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid rows memo");let e=this.filteredData;if(this._sortColumn&&(e=e.sortBy(t=>t[this._sortColumn],this._sortDirection)),this.groupColumns.size>0){const t=(i,s,r)=>{const l=s.values().next().value;s.delete(l);const c=this.columns.value.leafs.findOrThrow(a=>a.key===l);return this._sortColumn===_&&(i=i.sortBy(a=>a[l],this._sortDirection)),i.groupBy(a=>a[l]).map(a=>{let h;s.size>0?h=t(a.values,new Set(s),r+1):h=a.values.map((p,w)=>new Z(this,p,r+1+w));const u=new oe(this,c,h,r,a.key);return r+=1,u.expanded&&(r+=h.length),u})};return t(e,new Set(this.groupColumns),0)}return e.map((t,i)=>new Z(this,t,i))});flatRows=C.memo(()=>(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid flatRows memo"),this.rows.value.flatMap(e=>e.flatRows)));get rowHeight(){return this.props.def.rowHeight??this.DEFAULT_ROW_HEIGHT_PX}sizes=C.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid sizes memo");const e=this.columns.value.flat.reduce((s,r)=>{const{inlineWidth:l}=r;return typeof l=="number"&&(s[r.widthVarName]=`${r.inlineWidth}px`),r.pin==="LEFT"&&(s[r.leftVarName]=`${r.left}px`),r.pin==="RIGHT"&&(s[r.rightVarName]=`${r.right}px`),s},{});e[this.rowHeightVarName]=`${this.rowHeight}px`,e[this.leftEdgeVarName]=`${this.leftEdge}px`;const{visibleLeafs:t}=this.columns.value,i=t.find(s=>s.key===_);if(i){const s=t.sumBy(r=>r.pin===i.pin&&r.key!==T&&r.key!==N?r.inlineWidth??0:0);e[i.groupColumnWidthVarName]=`${s}px`}return this.groupColumns.forEach(s=>{const r=this.columns.value.leafs.findOrThrow(l=>l.key===s);e[r.groupColumnWidthVarName]=`${t.sumBy(l=>l.pin===r.pin?l.inlineWidth??0:0)}px`}),e});DEFAULT_ROW_HEIGHT_PX=48;MIN_COLUMN_WIDTH_PX=48;DEFAULT_COLUMN_WIDTH_PX=200;isResizeMode=!1;expandedGroupRow=new Set;selectedRows=new Set;get leftEdge(){return this.columns.value.left.sumBy(e=>e.inlineWidth??0)}get rightEdge(){return this.columns.value.right.sumBy(e=>e.inlineWidth??0)}leftEdgeVarName="--left-edge";rowHeightVarName="--row-height";_idMap=new WeakMap;getRowKey(e){const{rowKey:t}=this.props.def;return t?typeof t=="function"?t(e):e[t]:(this._idMap.has(e)||this._idMap.set(e,crypto.randomUUID()),this._idMap.get(e))}setSortColumn=(e,...t)=>{if(t.length>0)[this._sortDirection]=t,this._sortColumn=this._sortDirection?e:void 0;else{const{_sortColumn:i,_sortDirection:s}=this;this._sortColumn=i===e&&s==="DESC"?void 0:e,this._sortDirection=i===e&&s==="ASC"?"DESC":"ASC"}this.headerRows.clear(),this.rows.clear(),this.flatRows.clear(),this.update()};pinColumn=(e,t)=>{const i=this.columns.value.flat.findOrThrow(s=>s.uniqueKey===e);i.pin!==t&&i.pinColumn(t),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};toggleGrouping=e=>{this.groupColumns=new Set(this.groupColumns),this.hiddenColumns=new Set(this.hiddenColumns),this.groupColumns.has(e)?(this.groupColumns.delete(e),this.hiddenColumns.delete(e)):(this.groupColumns.add(e),this.hiddenColumns.add(e)),this.sourceColumns.clear(),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};unGroupAll=()=>{const e=new Set(this.groupColumns);this.groupColumns=new Set,this.hiddenColumns=new Set(Array.from(this.hiddenColumns).filter(t=>!e.has(t))),this.sourceColumns.clear(),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};toggleGroupRow=e=>{this.expandedGroupRow=new Set(this.expandedGroupRow),this.expandedGroupRow.has(e)?this.expandedGroupRow.delete(e):this.expandedGroupRow.add(e),this.rows.clear(),this.flatRows.clear(),this.update()};toggleRowSelection=e=>{this.toggleRowsSelection([e])};toggleRowsSelection=e=>{this.selectedRows=new Set(this.selectedRows);const t=e.every(i=>this.selectedRows.has(i));t?e.forEach(i=>this.selectedRows.delete(i)):e.forEach(i=>this.selectedRows.add(i)),this.flatRows.clear(),this.update(),this.props.onSelectionChange?.({action:t?"deselect":"select",affectedRowKeys:e,selectedRowKeys:Array.from(this.selectedRows),isAllSelected:this.selectedRows.size===this.props.data.length})};toggleSelectAllRows=()=>{this.toggleRowsSelection(this.props.data.map(e=>this.getRowKey(e)))};toggleColumnVisibility=e=>{this.hiddenColumns=new Set(this.hiddenColumns),this.hiddenColumns.has(e)?this.hiddenColumns.delete(e):this.hiddenColumns.add(e),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()};setWidth=(e,t)=>{const i=this.columns.value.leafs.find(r=>r.key===e);if(!i)throw new Error("Leaf column not found.");i.setWidth(t),this.sourceColumns.value.flatMap(r=>r.flatColumns).findOrThrow(r=>r.key===e).setWidth(t)};groupColumns=new Set;hiddenColumns=new Set;_sortColumn;get sortColumn(){return this._sortColumn}_sortDirection="ASC";get sortDirection(){return this._sortDirection}}class _e{constructor(e,t,i){this.grid=e,this.row=t,this.column=i}get value(){return this.column.key===T?this.row.rowIndex+1:this.column.key===_?`${this.row.groupValue} (${this.row.count})`:null}}class oe{constructor(e,t,i,s,r){this.grid=e,this.groupColumn=t,this.rows=i,this.rowIndex=s,this.groupValue=r,i.forEach(l=>l.parentRow=this)}get key(){return`${this.parentRow?.key??""}${this.groupColumn.key}${this.groupValue}`}parentRow;get cells(){return this.grid.columns.value.visibleLeafs.map(e=>new _e(this.grid,this,e))}get selected(){return this.allRows.every(e=>e.selected)}get indeterminate(){return!this.selected&&this.allRows.some(e=>e.selected)}get expanded(){return this.grid.expandedGroupRow.has(this.key)}get depth(){return this.parentRow?this.parentRow.depth+1:0}get count(){return this.rows.sumBy(e=>e.count,0)}get flatRows(){return this.expanded?[this,...this.rows.flatMap(e=>e.flatRows)]:[this]}get allRows(){return this.rows.flatMap(e=>e.allRows)}get groupingColumn(){return this.grid.columns.value.leafs.findOrThrow(e=>e.key===_)}get groupingColumnGridColumn(){const{visibleLeafs:e}=this.grid.columns.value,{groupingColumn:t}=this;return e.sumBy(s=>s.pin===t.pin&&s.key!==E&&s.key!==N&&s.key!==T?1:0)}toggleRow(){this.grid.toggleGroupRow(this.key)}}function $(o){const{children:e,column:t,style:i,...s}=o,{key:r,pin:l,left:c,right:a,isEdge:h,align:u,widthVarName:p,leftVarName:w,rightVarName:y}=t;"align"in t.def&&(s.jc=u);const v=r===T,R=r===N,G=l==="LEFT",j=l==="RIGHT",b=G||j,k=G&&c===0,g=G&&h,x=j&&h,F=j&&a===0;return n.jsx(m.default,{component:"datagrid.body.cell",props:{role:"cell"},variant:{isPinned:b,isFirstLeftPinned:k,isLastLeftPinned:g,isFirstRightPinned:x,isLastRightPinned:F,isRowSelection:R,isRowNumber:v},style:{width:`var(${p})`,height:`var(${t.grid.rowHeightVarName})`,left:G?`var(${w})`:void 0,right:j?`var(${y})`:void 0,...i},...s,children:e})}$.displayName="DataGridCell";function le(o){const{row:e}=o,{selected:t,indeterminate:i,cells:s,groupingColumn:r,groupingColumnGridColumn:l,depth:c,expanded:a}=e,h=d.useCallback(()=>{e.grid.toggleRowsSelection(e.allRows.map(u=>u.key))},[]);return n.jsx(m.default,{className:"grid-row",selected:t,display:"contents",props:{role:"rowgroup"},children:s.map(u=>{const{key:p,pin:w,groupColumnWidthVarName:y}=u.column,v=w==="RIGHT";if(p===_)return n.jsx($,{column:u.column,style:{width:`var(${y})`,right:v?"0":void 0},br:r.pin==="LEFT"?1:void 0,gridColumn:l,pl:4*c,overflow:"auto",children:n.jsx(f.default,{textWrap:"nowrap",px:3,children:n.jsxs(S.default,{clean:!0,onClick:()=>e.toggleRow(),cursor:"pointer",display:"flex",gap:1,ai:"center",children:[n.jsx(C.ExpandIcon,{fill:"currentColor",width:"14px",height:"14px",rotate:a?0:-90}),u.value]})})},p);if(p===N)return n.jsx($,{column:u.column,children:n.jsx(X.default,{variant:"datagrid",m:1,checked:t,indeterminate:i,onChange:h})},p);if(w!==r.pin||p===T||p===E)return n.jsx($,{column:u.column,px:p===T?3:void 0,children:u.value},p)})})}le.displayName="DataGridGroupRow";function ae(o){const{cell:e}=o;return n.jsx(m.default,{height:"fit",width:"fit",overflow:"auto",ai:"center",jc:e.column.align,children:n.jsx(f.default,{px:3,textOverflow:"ellipsis",overflow:"hidden",textWrap:"nowrap",children:e.value})})}ae.displayName="DataGridCellText";function ue(o){const{row:e}=o,{selected:t}=e;return n.jsx(m.default,{className:"grid-row",selected:t,display:"contents",props:{role:"row"},children:e.cells.map(i=>n.jsx($,{column:i.column,children:i.column.Cell?n.jsx(i.column.Cell,{cell:i}):n.jsx(ae,{cell:i})},i.column.key))})}ue.displayName="DataGridRow";const De=10,te=20;function ce(o){const{grid:e,scrollTop:t}=o,i=e.flatRows.value.length,s=Math.max(0,Math.floor(t/e.rowHeight)-te),r=e.props.def.visibleRowsCount??De,l=e.rowHeight*r+e.rowHeight/5,c=d.useMemo(()=>{if(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render rows"),e.props.data.length===0)return n.jsx(m.default,{jc:"center",ai:"center",gridColumn:"full-row",style:{height:l},children:e.props.loading?"loading...":"empty"});const a=r+te*2;return e.flatRows.value.take(a,s).map(u=>u instanceof oe?n.jsx(le,{row:u},u.key):n.jsx(ue,{row:u},u.key))},[e.flatRows.value,e.props.data.length,e.props.loading,s,l,r]);return console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render DataGridBody"),n.jsx(f.default,{style:{height:l},children:n.jsx(f.default,{style:{height:`${i*e.rowHeight}px`},children:n.jsx(ne.default,{component:"datagrid.body",width:"max-content",minWidth:"fit",transition:"none",style:{transform:`translate3d(0, ${s*e.rowHeight}px, 0)`,willChange:"transform",gridTemplateColumns:e.gridTemplateColumns.value},children:c})})})}ce.displayName="DataGridBody";function ie({column:o,grid:e}){const t=e.columnFilters[o.key],i=t?.type==="text"?t.value:"",[s,r]=d.useState(i),l=d.useRef(null);d.useEffect(()=>()=>{l.current&&clearTimeout(l.current)},[]);const c=d.useCallback(u=>{const p=u.target.value;r(p),l.current&&clearTimeout(l.current),l.current=setTimeout(()=>{p.trim()?e.setColumnFilter(o.key,{type:"text",value:p}):e.setColumnFilter(o.key,void 0),l.current=null},300)},[e,o.key]),a=d.useCallback(()=>{r(""),e.setColumnFilter(o.key,void 0)},[e,o.key]),h=typeof o.def.filterable=="object"?o.def.filterable:{};return n.jsxs(m.default,{ai:"center",position:"relative",width:"fit",children:[n.jsx(O.default,{width:"fit",variant:"compact",placeholder:h.placeholder??"Filter...",value:s,onChange:c}),s&&n.jsx(m.default,{position:"absolute",right:2,top:"1/2",translateY:"-1/2",cursor:"pointer",props:{onClick:a},children:n.jsx(f.default,{fontSize:10,color:"gray-400",hover:{color:"gray-600"},children:"✕"})})]})}function Ne({column:o,grid:e}){const t=e.columnFilters[o.key],i=t?.type==="number"?t.value:"",s=t?.type==="number"?t.operator:"eq",r=t?.type==="number"?t.valueTo:"",[l,c]=d.useState(i),[a,h]=d.useState(s),[u,p]=d.useState(r??""),w=d.useRef(null),y=d.useRef(null);d.useEffect(()=>()=>{w.current&&clearTimeout(w.current),y.current&&clearTimeout(y.current)},[]);const v=typeof o.def.filterable=="object"?o.def.filterable:{},R=d.useCallback((g,x,F)=>{const D=typeof x=="number"?x:parseFloat(x);if(isNaN(D)||x===""){e.setColumnFilter(o.key,void 0);return}const V={type:"number",operator:g,value:D};if(g==="between"&&F!==void 0&&F!==""){const P=typeof F=="number"?F:parseFloat(String(F));isNaN(P)||(V.valueTo=P)}e.setColumnFilter(o.key,V)},[e,o.key]),G=d.useCallback(g=>{const x=g.target.value;c(x),w.current&&clearTimeout(w.current),w.current=setTimeout(()=>{R(a,x,u),w.current=null},300)},[a,u,R]),j=d.useCallback(g=>{h(g),R(g,l,u)},[l,u,R]),b=d.useCallback(g=>{const x=g.target.value;p(x),y.current&&clearTimeout(y.current),y.current=setTimeout(()=>{R(a,l,x),y.current=null},300)},[a,l,R]),k=d.useCallback(()=>{c(""),p(""),h("eq"),e.setColumnFilter(o.key,void 0)},[e,o.key]);return n.jsxs(m.default,{ai:a==="between"?"start":"center",gap:1,width:"fit",children:[n.jsxs(L.default,{value:a,variant:"compact",onChange:g=>g&&j(g),minWidth:6,hideIcon:!0,children:[n.jsx(L.default.Item,{value:"eq",children:"="}),n.jsx(L.default.Item,{value:"ne",children:"≠"}),n.jsx(L.default.Item,{value:"gt",children:">"}),n.jsx(L.default.Item,{value:"gte",children:"≥"}),n.jsx(L.default.Item,{value:"lt",children:"<"}),n.jsx(L.default.Item,{value:"lte",children:"≤"}),n.jsx(L.default.Item,{value:"between",children:"↔"})]}),a==="between"?n.jsxs(m.default,{d:"column",gap:1,flex1:!0,children:[n.jsxs(m.default,{ai:"center",position:"relative",flex1:!0,children:[n.jsx(O.default,{type:"number",variant:"compact",placeholder:v.placeholder??"From",value:l,onChange:G,width:"fit",step:v.step}),(l!==""||u!=="")&&n.jsx(m.default,{position:"absolute",right:2,top:"1/2",translateY:"-1/2",cursor:"pointer",props:{onClick:k},children:n.jsx(f.default,{fontSize:10,color:"gray-400",hover:{color:"gray-600"},children:"✕"})})]}),n.jsx(m.default,{ai:"center",flex1:!0,children:n.jsx(O.default,{type:"number",variant:"compact",placeholder:"To",value:u,onChange:b,width:"fit",step:v.step})})]}):n.jsxs(m.default,{ai:"center",position:"relative",flex1:!0,children:[n.jsx(O.default,{type:"number",variant:"compact",placeholder:v.placeholder??"Value",value:l,onChange:G,width:"fit",step:v.step}),l!==""&&n.jsx(m.default,{position:"absolute",right:2,top:"1/2",translateY:"-1/2",cursor:"pointer",props:{onClick:k},children:n.jsx(f.default,{fontSize:10,color:"gray-400",hover:{color:"gray-600"},children:"✕"})})]})]})}function Ee({column:o,grid:e}){const t=e.columnFilters[o.key],i=t?.type==="multiselect"?t.values:[],s=typeof o.def.filterable=="object"?o.def.filterable:{},r=d.useMemo(()=>s.options?s.options:e.getColumnUniqueValues(o.key).map(a=>({label:a===null?"(empty)":String(a),value:a})),[s.options,e,o.key]),l=d.useCallback((c,a)=>{a.length===0?e.setColumnFilter(o.key,void 0):e.setColumnFilter(o.key,{type:"multiselect",values:a})},[e,o.key]);return n.jsxs(L.default,{multiple:!0,showCheckbox:!0,isSearchable:!0,searchPlaceholder:"Search...",value:i,width:"fit",minWidth:0,onChange:l,variant:"compact",children:[n.jsx(L.default.Unselect,{children:"Clear"}),n.jsx(L.default.SelectAll,{children:"Select All"}),r.map(c=>n.jsx(L.default.Item,{value:c.value,ai:"center",gap:2,children:c.label},String(c.value)))]})}function de(o){const{column:e,grid:t}=o,{filterable:i}=e.def;if(!i)return null;switch((typeof i=="object"?i:{type:"text"}).type){case"text":return n.jsx(ie,{column:e,grid:t});case"number":return n.jsx(Ne,{column:e,grid:t});case"multiselect":return n.jsx(Ee,{column:e,grid:t});default:return n.jsx(ie,{column:e,grid:t})}}de.displayName="DataGridColumnFilter";function he(o){const{column:e,grid:t}=o,{key:i,pin:s,left:r,right:l,isEdge:c,widthVarName:a,leftVarName:h,rightVarName:u,filterable:p}=e,w=i===E,G=w||i===_||i===T||i===N,j=s==="LEFT",b=s==="RIGHT",k=j||b,g=j&&r===0,x=j&&c,F=b&&c,D=b&&l===0;return n.jsx(m.default,{component:"datagrid.filter.cell",variant:{isPinned:k,isFirstLeftPinned:g,isLastLeftPinned:x,isFirstRightPinned:F,isLastRightPinned:D},px:w?0:2,style:{width:`var(${a})`,left:j?`var(${h})`:void 0,right:b?`var(${u})`:void 0},children:!G&&p&&n.jsx(de,{column:e,grid:t})})}he.displayName="DataGridFilterCell";function pe(o){const{grid:e}=o,{visibleLeafs:t}=e.columns.value;return t.some(s=>s.filterable)?t.map(s=>n.jsx(he,{column:s,grid:e},s.uniqueKey)):null}pe.displayName="DataGridFilterRow";function me(o){const{column:e}=o,{key:t,pin:i,left:s,right:r,isEdge:l,isLeaf:c,align:a,header:h,grid:u}=e,[p,w,y]=C.useVisibility({hideOnScroll:!0,event:"mousedown"}),[v,R]=d.useState({top:0,left:0}),G=d.useMemo(()=>v.left>window.innerWidth/2,[v.left]),j=c&&(u.sortColumn!==t||u.sortDirection==="DESC"),b=c&&(u.sortColumn!==t||u.sortDirection==="ASC"),k=c&&u.sortColumn===t,g=i!=="LEFT",x=i!=="RIGHT",F=!!i,D=c&&t!==_,V=c&&t===_,P=j||b||k,q=g||x||F,U=a==="right"?2:void 0,Y=a==="right"?void 0:i==="RIGHT"?2.5:4,K=t===E,W=t===T,J=t===N,H=i==="LEFT",A=i==="RIGHT",Q=H||i==="RIGHT",I=H&&s===0,z=H&&l,Re=A&&l,je=A&&r===0,ke=c&&!K&&!W&&!J;return n.jsx(m.default,{position:"absolute",left:U,right:Y,top:"1/2",translateY:-3,ai:"center",children:n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu",onClick:()=>w(!p),variant:{isPinned:Q,isFirstLeftPinned:I,isLastLeftPinned:z,isFirstRightPinned:Re,isLastRightPinned:je,isSortable:ke,isRowNumber:W},children:[n.jsx(M.Span,{component:"datagrid.header.cell.contextMenu.icon",children:n.jsx(C.DotsIcon,{fill:"currentColor"})}),p&&n.jsxs(se.default,{component:"datagrid.header.cell.contextMenu.tooltip",onPositionChange:R,ref:y,adjustTranslateX:G?"-100%":"-21px",adjustTranslateY:"16px",children:[j&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn("ASC"),children:[n.jsx(M.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(C.SortIcon,{width:"100%",fill:"currentColor"})}),"Sort Ascending"]}),b&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn("DESC"),children:[n.jsx(M.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(C.SortIcon,{width:"100%",fill:"currentColor",rotate:180})}),"Sort Descending"]}),k&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn(void 0),children:[n.jsx(f.default,{width:4}),"Clear Sort"]}),P&&(q||D||V)&&n.jsx(f.default,{bb:1,my:2,borderColor:"gray-300",component:"datagrid.header.cell.contextMenu.tooltip.item.separator"}),g&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn("LEFT"),children:[n.jsx(M.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(C.PinIcon,{width:"100%",fill:"currentColor"})}),"Pin Left"]}),x&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn("RIGHT"),children:[n.jsx(M.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(C.PinIcon,{width:"100%",fill:"currentColor",rotate:-90})}),"Pin Right"]}),F&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn(),children:[n.jsx(f.default,{width:4}),"Unpin"]}),P&&q&&(D||V)&&n.jsx(f.default,{component:"datagrid.header.cell.contextMenu.tooltip.item.separator"}),D&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:e.toggleGrouping,children:[n.jsx(M.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(C.GroupingIcon,{width:"100%",fill:"currentColor"})}),n.jsxs(f.default,{textWrap:"nowrap",children:["Group by ",h??t]})]}),V&&n.jsxs(S.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:u.unGroupAll,children:[n.jsx(M.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(C.GroupingIcon,{width:"100%",fill:"currentColor"})}),n.jsx(f.default,{textWrap:"nowrap",children:"Un-Group All"})]})]})]})})}me.displayName="DataGridHeaderCellContextMenu";function fe(o){const{column:e}=o;return n.jsx(m.default,{height:"fit",ai:"center",position:"absolute",right:e.pin==="RIGHT"?void 0:0,left:e.pin!=="RIGHT"?void 0:0,py:3,children:n.jsx(f.default,{cursor:"col-resize",px:.75,mt:-6,className:"resizer",height:"fit",props:{onMouseDown:e.resizeColumn,onTouchStart:e.resizeColumn},children:n.jsx(f.default,{component:"datagrid.header.cell.resizer"})})})}fe.displayName="DataGridHeaderCellResizer";function ge(o){const{column:e}=o,{key:t,pin:i,left:s,right:r,isEdge:l,isLeaf:c,leafs:a,grid:h,header:u,gridRows:p,widthVarName:w,leftVarName:y,rightVarName:v,inlineWidth:R}=e,G=t===E,j=t===_,b=t===T,k=t===N,g=i==="LEFT",x=i==="RIGHT",F=g||i==="RIGHT",D=g&&s===0,V=g&&l,P=x&&l,q=x&&r===0,U=c&&!G&&!b&&!k,Y=c?1:a.length,K=!b&&!k,W=!b&&!k,J=k?void 0:e.align==="right"?10:3,H=k?void 0:e.align==="center"?3:void 0,A=d.useCallback(()=>{h.toggleSelectAllRows()},[]),Q=d.useMemo(()=>{if(b)return null;if(k){const I=h.selectedRows.size===h.props.data.length,z=!I&&h.selectedRows.size>0;return n.jsx(X.default,{variant:"datagrid",m:1,indeterminate:z,checked:I,onChange:A})}if(j){if(h.groupColumns.size===1){const I=h.columns.value.leafs.findOrThrow(z=>z.key===h.groupColumns.values().next().value);return I.header??I.key}return"Group"}return u??t},[h.groupColumns,h.selectedRows,A]);return n.jsx(m.default,{props:{role:"columnheader"},component:"datagrid.header.cell",variant:{isPinned:F,isFirstLeftPinned:D,isLastLeftPinned:V,isFirstRightPinned:P,isLastRightPinned:q,isSortable:U,isRowNumber:b},gridRow:p,gridColumn:Y,style:{width:`var(${w})`,left:g?`var(${y})`:void 0,right:x?`var(${v})`:void 0},children:!G&&n.jsxs(n.Fragment,{children:[n.jsx(m.default,{width:"fit",height:"fit",jc:e.align,props:{onClick:U?()=>e.sortColumn():void 0},children:n.jsxs(m.default,{overflow:"hidden",position:c?void 0:"sticky",ai:"center",transition:"none",pl:J,pr:H,style:{left:i?void 0:`var(${h.leftEdgeVarName})`},children:[n.jsx(f.default,{overflow:"hidden",textOverflow:"ellipsis",textWrap:"nowrap",children:Q}),t===h.sortColumn&&n.jsx(f.default,{pl:(R??0)<58?0:2,children:n.jsx(C.SortIcon,{width:"16px",rotate:h.sortDirection==="ASC"?0:180,fill:"currentColor"})}),W&&n.jsx(f.default,{minWidth:e.align==="right"?4:10})]})}),K&&n.jsx(fe,{column:e}),W&&n.jsx(me,{column:e})]})})}ge.displayName="DataGridHeaderCell";function Ce(o){const{grid:e}=o,{isResizeMode:t}=e;return n.jsxs(ne.default,{component:"datagrid.header",variant:{isResizeMode:t},style:{gridTemplateColumns:e.gridTemplateColumns.value},children:[e.headerRows.value.map(i=>i.map(s=>n.jsx(ge,{column:s},s.uniqueKey))),n.jsx(pe,{grid:e})]})}Ce.displayName="DataGridHeader";function we(o){const{grid:e}=o,[t,i]=d.useState(0),s=d.useRef(null),r=d.useCallback(l=>{s.current!==null&&cancelAnimationFrame(s.current),s.current=requestAnimationFrame(()=>{i(l.target.scrollTop),s.current=null})},[]);return n.jsxs(f.default,{overflowX:"scroll",style:{willChange:"scroll-position"},props:{onScroll:r},children:[n.jsx(Ce,{grid:e}),n.jsx(ce,{grid:e,scrollTop:t})]})}we.displayName="DataGridContent";function xe(o){const{grid:e}=o;return e.groupColumns.size===0?null:n.jsxs(m.default,{component:"datagrid.topBar.columnGroups",children:[n.jsx(M.Span,{component:"datagrid.topBar.columnGroups.icon",children:n.jsx(C.GroupingIcon,{width:"100%",fill:"currentColor"})}),Array.from(e.groupColumns,t=>{const i=e.columns.value.leafs.findOrThrow(s=>s.key===t);return n.jsxs(d.Fragment,{children:[n.jsx(C.ExpandIcon,{fill:"currentColor",width:"14px",height:"14px",rotate:-90}),n.jsxs(m.default,{component:"datagrid.topBar.columnGroups.item",children:[i.header??i.key,n.jsx(S.default,{component:"datagrid.topBar.columnGroups.item.icon",onClick:()=>e.toggleGrouping(i.key),children:n.jsx(f.default,{fontSize:10,color:"gray-400",hover:{color:"gray-600"},children:"✕"})})]})]},t)})]})}xe.displayName="DataGridColumnGroups";function Ve(o){const{grid:e}=o,[t,i]=d.useState(e.globalFilterValue),s=d.useRef(null);d.useEffect(()=>()=>{s.current&&clearTimeout(s.current)},[]);const r=d.useCallback(u=>{const p=u.target.value;i(p),s.current&&clearTimeout(s.current),s.current=setTimeout(()=>{e.setGlobalFilter(p),s.current=null},300)},[e]),l=d.useCallback(()=>{i(""),e.setGlobalFilter("")},[e]),{filtered:c,total:a}=e.filterStats,h=e.hasActiveFilters&&c!==a;return n.jsxs(m.default,{component:"datagrid.topBar.globalFilter",children:[h&&n.jsxs(f.default,{component:"datagrid.topBar.globalFilter.stats",children:[c," / ",a]}),n.jsxs(m.default,{component:"datagrid.topBar.globalFilter.inputWrapper",children:[n.jsx(m.default,{component:"datagrid.topBar.globalFilter.inputWrapper.icon",children:n.jsx(C.SearchIcon,{fill:"currentColor",width:"1rem"})}),n.jsx(O.default,{component:"datagrid.topBar.globalFilter.inputWrapper.input",placeholder:"Search...",value:t,onChange:r,pl:8,pr:t?8:3,height:8,width:50}),t&&n.jsx(f.default,{component:"datagrid.topBar.globalFilter.inputWrapper.clear",props:{onClick:l},children:"✕"})]})]})}function ye(o){const{grid:e}=o,[t,i,s]=C.useVisibility({event:"mousedown"}),r=d.useMemo(()=>e.columns.value.leafs.filter(l=>![E,T,N,_].includes(l.key)),[e.columns.value.leafs]);return n.jsxs(S.default,{component:"datagrid.topBar.contextMenu",onClick:()=>i(!t),children:[n.jsx(Ge.default,{viewBox:"0 0 24 24",width:"20",fill:"currentColor",...o,children:n.jsx("path",{d:"M5 6h14M5 12h14M5 18h14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})}),t&&n.jsx(se.default,{component:"datagrid.topBar.contextMenu.tooltip",ref:s,children:r.map(l=>n.jsxs(S.default,{component:"datagrid.topBar.contextMenu.tooltip.item",onClick:c=>{c.stopPropagation(),l.toggleVisibility()},children:[n.jsx(X.default,{variant:"datagrid",checked:l.isVisible,onChange:()=>{},focus:{outline:0}}),l.header??l.key]},l.key))})]})}ye.displayName="DataGridTopBarContextMenu";function ve(o){const{grid:e}=o;return n.jsxs(m.default,{component:"datagrid.topBar",position:"relative",ai:"center",jc:"space-between",children:[n.jsxs(m.default,{ai:"center",gap:2,children:[n.jsx(ye,{grid:e}),n.jsx(xe,{grid:e})]}),e.props.def.globalFilter&&n.jsx(m.default,{position:"relative",pr:2,children:n.jsx(Ve,{grid:e})})]})}ve.displayName="DataGridTopBar";function Me(o){const[e,t]=d.useState(0),i=d.useRef();return i.current||(i.current=new Le(o,()=>t(s=>s+1))),d.useEffect(()=>{i.current.props=o,i.current.rows.clear(),i.current.flatRows.clear(),i.current.update()},[o.data]),d.useEffect(()=>{i.current.props=o,i.current.sourceColumns.clear(),i.current.columns.clear(),i.current.headerRows.clear(),i.current.gridTemplateColumns.clear(),i.current.rows.clear(),i.current.flatRows.clear(),i.current.sizes.clear(),i.current.update()},[o.def]),d.useEffect(()=>{i.current.props=o,i.current.update()},[o.loading]),d.useEffect(()=>{i.current.props=o,i.current.rows.clear(),i.current.flatRows.clear(),i.current.update()},[o.globalFilterValue,o.columnFilters]),i.current}function be(o){const e=Me(o);return console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render"),n.jsxs(f.default,{component:"datagrid",style:e.sizes.value,props:{role:"presentation"},children:[e.props.def.topBar&&n.jsx(ve,{grid:e}),n.jsx(we,{grid:e}),e.props.def.bottomBar&&n.jsx(Fe,{grid:e})]})}be.displayName="DataGrid";exports.default=be;