@cronocode/react-box 3.0.21 → 3.1.2

package/box.d.ts

@@ -1,21 +1,26 @@
 import { default as React, RefAttributes } from 'react';
 import { ClassNameType } from './core/classNames';
 import { ExtractElementFromTag } from './core/coreTypes';
-import { BoxStyleProps, ComponentsAndVariants } from './types';
 import { default as BoxExtends } from './core/extends/boxExtends';
 import { default as Theme } from './core/theme/theme';
 import { default as Variables } from './core/variables';
 import { default as useVisibility } from './hooks/useVisibility';
+import { BoxStyleProps, ComponentsAndVariants } from './types';
 type AllProps<TTag extends keyof React.JSX.IntrinsicElements> = React.ComponentProps<TTag>;
 type TagPropsType<TTag extends keyof React.JSX.IntrinsicElements> = Omit<AllProps<TTag>, 'className' | 'style' | 'ref' | 'disabled' | 'required' | 'checked' | 'id'>;
 interface Props<TTag extends keyof React.JSX.IntrinsicElements, TKey extends keyof ComponentsAndVariants> extends BoxStyleProps<TKey> {
     children?: React.ReactNode | ((props: {
         isHover: boolean;
     }) => React.ReactNode);
+    /** html tag element */
     tag?: TTag;
+    /** props (attributes) related to html tag */
     props?: TagPropsType<TTag>;
+    /** classNames. supports conditional classNames. */
     className?: ClassNameType;
+    /** CSSProperties */
     style?: React.ComponentProps<TTag>['style'];
+    /** The HTML id attribute is used to specify a unique id for an HTML element. */
     id?: string;
 }
 interface BoxType {

package/box.mjs

@@ -1,9 +1,9 @@
 import T, { memo as V, forwardRef as v, useMemo as P, useState as N } from "react";
-import { B as d, T as m, V as C, u as E, c as H, a as o } from "./core.mjs";
+import { u as C, c as E, B as o, a as d, T as m, V as H } from "./core.mjs";
 import { b as U } from "./core.mjs";
 function M(s, i) {
-  const { tag: l = "div", children: t, props: u, className: f, disabled: g, required: x, checked: B, selected: y } = s, b = E(s, l === "svg"), n = P(() => {
-    const p = H(b, f).join(" "), e = {
+  const { tag: l = "div", children: t, props: u, className: f, disabled: g, required: x, checked: B, selected: y } = s, b = C(s, l === "svg"), n = P(() => {
+    const p = E(b, f).join(" "), e = {
       ...u,
       className: p
     };
@@ -17,7 +17,7 @@ a.extend = d.extend;
 a.components = d.components;
 a.Theme = m;
 a.useTheme = m.useTheme;
-a.getVariableValue = C.getVariableValue;
+a.getVariableValue = H.getVariableValue;
 export {
   a as default,
   U as useVisibility

package/components/baseSvg.cjs

@@ -1 +1 @@
-"use strict";const p=require("react/jsx-runtime"),g=require("react"),c=require("../box.cjs");function u(s,t){const{viewBox:r="0 0 24 24",width:o="1.5rem",height:n,props:i,...a}=s;return p.jsx(c.default,{tag:"svg",ref:t,props:{...i,viewBox:r,width:o,height:n,xmlns:"http://www.w3.org/2000/svg",fill:"none"},...a})}const e=g.forwardRef(u);e.displayName="BaseSvg";module.exports=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react/jsx-runtime"),l=require("react"),g=require("../box.cjs");function p(t,s){const{viewBox:r="0 0 24 24",width:o="1.5rem",height:a,props:i,...n}=t;return u.jsx(g.default,{tag:"svg",ref:s,props:{...i,viewBox:r,width:o,height:a,xmlns:"http://www.w3.org/2000/svg",fill:"none"},...n})}const e=l.forwardRef(p);e.displayName="BaseSvg";exports.default=e;

package/components/baseSvg.d.ts

@@ -1,7 +1,7 @@
 import { Ref } from 'react';
 import { BoxTagProps } from '../box';
-import { BoxStyleProps } from '../types';
 import { ClassNameType } from '../core/classNames';
+import { BoxStyleProps } from '../types';
 type BoxSvgTagProps = Omit<BoxTagProps<'svg'>, 'viewBox' | 'width' | 'height'>;
 interface Props extends Omit<BoxStyleProps, 'width' | 'height'> {
     children?: React.ReactNode | ((props: {

package/components/button.cjs

@@ -1 +1 @@
-"use strict";const r=require("react/jsx-runtime"),s=require("react"),u=require("../box.cjs"),c=require("../core.cjs"),i=["type","onClick"];function p(o,e){const n=c.ObjectUtils.buildProps(o,i);return r.jsx(u.default,{ref:e,tag:"button",component:"button",...n})}const t=s.forwardRef(p);t.displayName="Button";module.exports=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),u=require("react"),s=require("../box.cjs"),c=require("../core.cjs"),i=["type","onClick"];function l(e,o){const n=c.ObjectUtils.buildProps(e,i);return r.jsx(s.default,{ref:o,tag:"button",component:"button",...n})}const t=u.forwardRef(l);t.displayName="Button";exports.default=t;

package/components/checkbox.cjs

@@ -1 +1 @@
-"use strict";const a=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs"),s=require("../core.cjs"),d=["name","onInput","onChange","autoFocus","readOnly","value","defaultChecked"];function l(t,o){const i=s.ObjectUtils.buildProps(t,d,{type:"checkbox"}),r=Array.isArray(t.indeterminate)?t.indeterminate[0]:t.indeterminate,e=n.useRef(null);return n.useImperativeHandle(o,()=>e.current),n.useEffect(()=>{e.current&&(e.current.indeterminate=!!r)},[e,r]),a.jsx(u.default,{tag:"input",ref:e,component:"checkbox",...i})}const c=n.forwardRef(l);c.displayName="Checkbox";module.exports=c;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),n=require("react"),i=require("../box.cjs"),s=require("../core.cjs"),l=["name","onInput","onChange","autoFocus","readOnly","value","defaultChecked"];function d(t,c){const u=s.ObjectUtils.buildProps(t,l,{type:"checkbox"}),r=Array.isArray(t.indeterminate)?t.indeterminate[0]:t.indeterminate,e=n.useRef(null);return n.useImperativeHandle(c,()=>e.current),n.useEffect(()=>{e.current&&(e.current.indeterminate=!!r)},[e,r]),a.jsx(i.default,{tag:"input",ref:e,component:"checkbox",...u})}const o=n.forwardRef(d);o.displayName="Checkbox";exports.default=o;

package/components/dataGrid/components/dataGridBody.d.ts

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

package/components/dataGrid/components/dataGridBottomBar.d.ts

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

package/components/dataGrid/components/dataGridCellRowSelection.d.ts

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

package/components/dataGrid/components/dataGridCellText.d.ts

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

package/components/dataGrid/components/dataGridColumnGroups.d.ts

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

package/components/dataGrid/components/dataGridContent.d.ts

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

package/components/dataGrid/components/dataGridHeader.d.ts

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

package/components/dataGrid/components/dataGridHeaderCellContextMenu.d.ts

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

package/components/dataGrid/components/dataGridHeaderCellResizer.d.ts

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

package/components/dataGrid/components/dataGridPagination.d.ts

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

package/components/dataGrid/components/dataGridTopBar.d.ts

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

package/components/dataGrid/components/dataGridTopBarContextMenu.d.ts

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

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

@@ -1,3 +1,4 @@
+import { default as CellModel } from '../models/cellModel';
 export type Key = string | number;
 export type PinPosition = 'LEFT' | 'RIGHT';
 export declare const NO_PIN = "NO_PIN";
@@ -23,13 +24,33 @@ export interface ColumnType<TRow> {
     pin?: PinPosition;
     width?: number;
     columns?: ColumnType<TRow>[];
-    align?: 'right' | 'center';
+    align?: 'left' | 'right' | 'center';
+    Cell?: React.ComponentType<{
+        cell: CellModel<TRow>;
+    }>;
 }
 export interface GridDefinition<TRow> {
     rowKey?: KeysMatching<TRow, Key> | ((rowData: TRow) => Key);
     columns: ColumnType<TRow>[];
+    showRowNumber?: boolean | {
+        pinned?: boolean;
+    };
+    rowSelection?: boolean | {
+        pinned?: boolean;
+    };
+    rowHeight?: number;
+    visibleRowsCount?: number;
 }
 export interface DataGridProps<TRow> {
     data: TRow[];
     def: GridDefinition<TRow>;
+    loading?: boolean;
+    onSelectionChange?: (event: SelectionChangeEvent<TRow>) => void;
 }
+interface SelectionChangeEvent<TRow, TKey = TRow[keyof TRow] | number | string> {
+    action: 'select' | 'deselect';
+    selectedRowKeys: TKey[];
+    affectedRowKeys: TKey[];
+    isAllSelected: boolean;
+}
+export {};

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

@@ -6,5 +6,5 @@ export default class CellModel<TRow> {
     readonly row: RowModel<TRow>;
     readonly column: ColumnModel<TRow>;
     constructor(grid: GridModel<TRow>, row: RowModel<TRow>, column: ColumnModel<TRow>);
-    get value(): React.ReactNode;
+    get value(): number | TRow[keyof TRow];
 }

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

@@ -1,7 +1,7 @@
 import { ColumnType, PinPosition } from '../contracts/dataGridContract';
 import { default as GridModel } from './gridModel';
 export default class ColumnModel<TRow> {
-    private readonly def;
+    readonly def: ColumnType<TRow>;
     readonly grid: GridModel<TRow>;
     private parent?;
     constructor(def: ColumnType<TRow>, grid: GridModel<TRow>, parent?: ColumnModel<TRow> | undefined);
@@ -9,8 +9,11 @@ export default class ColumnModel<TRow> {
     get visibleColumns(): ColumnModel<TRow>[];
     get key(): import('../contracts/dataGridContract').Key;
     get header(): string | undefined;
-    get align(): "center" | "right" | undefined;
+    get align(): "center" | "right" | "left" | undefined;
     get isLeaf(): boolean;
+    get Cell(): import('react').ComponentType<{
+        cell: import('./cellModel').default<TRow>;
+    }> | undefined;
     private _pin?;
     get pin(): PinPosition | undefined;
     get uniqueKey(): string;

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

@@ -7,10 +7,10 @@ export declare const ROW_NUMBER_CELL_KEY: Key;
 export declare const ROW_SELECTION_CELL_KEY: Key;
 export declare const GROUPING_CELL_KEY: Key;
 export default class GridModel<TRow> {
-    readonly props: DataGridProps<TRow>;
+    props: DataGridProps<TRow>;
     readonly update: () => void;
     constructor(props: DataGridProps<TRow>, update: () => void);
-    private _sourceColumns;
+    readonly sourceColumns: import('../../../utils/memo').Memo<ColumnModel<TRow>[]>;
     readonly columns: import('../../../utils/memo').Memo<{
         left: ColumnModel<TRow>[];
         middle: ColumnModel<TRow>[];
@@ -24,26 +24,34 @@ export default class GridModel<TRow> {
     readonly gridTemplateColumns: import('../../../utils/memo').Memo<string>;
     readonly rows: import('../../../utils/memo').Memo<GroupRowModel<TRow>[] | RowModel<TRow>[]>;
     readonly flatRows: import('../../../utils/memo').Memo<(GroupRowModel<TRow> | RowModel<TRow>)[]>;
+    get rowHeight(): number;
     readonly sizes: import('../../../utils/memo').Memo<Record<string, string>>;
-    readonly ROW_HEIGHT = 12;
+    readonly DEFAULT_ROW_HEIGHT_PX = 48;
     readonly MIN_COLUMN_WIDTH_PX = 48;
     readonly DEFAULT_COLUMN_WIDTH_PX = 200;
     isResizeMode: boolean;
-    expandedGroupRow: Record<Key, boolean>;
+    expandedGroupRow: Set<Key>;
+    selectedRows: Set<Key>;
     get leftEdge(): number;
     get rightEdge(): number;
     readonly leftEdgeVarName = "--left-edge";
+    readonly rowHeightVarName = "--row-height";
+    private readonly _idMap;
+    getRowKey(row: TRow): Key;
     setSortColumn: (columnKey: Key, sortDirection?: SortDirection) => void;
     pinColumn: (uniqueKey: string, pin?: PinPosition) => void;
     toggleGrouping: (columnKey: Key) => void;
     unGroupAll: () => void;
     toggleGroupRow: (groupRowKey: Key) => void;
+    toggleRowSelection: (rowKey: Key) => void;
+    toggleRowsSelection: (rowKeys: Key[]) => void;
+    toggleSelectAllRows: () => void;
     toggleColumnVisibility: (columnKey: Key) => void;
     setWidth: (columnKey: Key, width: number) => void;
-    groupColumns: Key[];
-    hiddenColumns: Key[];
+    groupColumns: Set<Key>;
+    hiddenColumns: Set<Key>;
     private _sortColumn?;
     get sortColumn(): Key | undefined;
-    private _sortDirection;
-    get sortDirection(): SortDirection;
+    private _sortDirection?;
+    get sortDirection(): SortDirection | undefined;
 }

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

@@ -10,13 +10,14 @@ export default class GroupRowModel<TRow> {
     readonly rowIndex: number;
     readonly groupValue: Key;
     constructor(grid: GridModel<TRow>, groupColumn: ColumnModel<TRow>, rows: RowModel<TRow>[] | GroupRowModel<TRow>[], rowIndex: number, groupValue: Key);
-    get rowKey(): Key;
+    get key(): Key;
     parentRow?: GroupRowModel<TRow>;
     get cells(): GroupRowCellModel<TRow>[];
     get expanded(): boolean;
     get depth(): number;
     get count(): number;
     get flatRows(): (RowModel<TRow> | GroupRowModel<TRow>)[];
+    get allRows(): RowModel<TRow>[];
     get groupingColumn(): ColumnModel<TRow>;
     get groupingColumnGridColumn(): number;
     toggleRow(): void;

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

@@ -4,13 +4,14 @@ import { default as GridModel } from './gridModel';
 import { default as GroupRowModel } from './groupRowModel';
 export default class RowModel<TRow> {
     readonly grid: GridModel<TRow>;
-    readonly row: TRow;
+    readonly data: TRow;
     readonly rowIndex: number;
-    constructor(grid: GridModel<TRow>, row: TRow, rowIndex: number);
-    get rowKey(): Key;
+    constructor(grid: GridModel<TRow>, data: TRow, rowIndex: number);
+    readonly key: Key;
     parentRow?: GroupRowModel<TRow>;
+    readonly count = 1;
     get cells(): CellModel<TRow>[];
-    get count(): number;
-    get flatRows(): RowModel<TRow>[];
-    private getRowKey;
+    get selected(): boolean;
+    get flatRows(): this;
+    get allRows(): this;
 }

package/components/dataGrid.cjs

@@ -1 +1 @@
-"use strict";var ie=Object.defineProperty;var se=(a,e,t)=>e in a?ie(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t;var u=(a,e,t)=>se(a,typeof e!="symbol"?e+"":e,t);const n=require("react/jsx-runtime"),g=require("../box.cjs"),A=require("./grid.cjs"),p=require("react"),d=require("../core.cjs"),f=require("./button.cjs"),V=require("./checkbox.cjs"),w=require("./flex.cjs"),z=require("./tooltip.cjs"),oe=require("./baseSvg.cjs"),ne=require("./textbox.cjs"),re="NO_PIN";class G{constructor(e,t,i){u(this,"columns",[]);u(this,"_pin");u(this,"_inlineWidth");u(this,"resizeColumn",e=>{this.grid.isResizeMode=!0;const t=e.pageX,{MIN_COLUMN_WIDTH_PX:i,update:o}=this.grid,s=this.leafs.sumBy(c=>c.inlineWidth)-this.leafs.length*i,r=this.leafs.toRecord(c=>[c.key,c.inlineWidth]),h=d.FnUtils.throttle(c=>{const y=(c.pageX-t)*(this.pin==="RIGHT"?-1:1);this.leafs.forEach(x=>{const j=r[x.key],k=s>0?(j-i)/s*y:y/this.leafs.length,v=Math.round(j+k);x.setWidth(v<i?i:v)}),this.grid.headerRows.clear(),this.grid.sizes.clear(),o()},20),l=new AbortController,m=c=>{l.abort(),this.grid.isResizeMode=!1,o()};window.addEventListener("mousemove",h,l),window.addEventListener("mouseup",m,l)});u(this,"pinColumn",e=>{this.isLeaf?this._pin=e:this.columns.forEach(t=>t.pinColumn(e)),this.grid.pinColumn(this.uniqueKey,e)});u(this,"toggleGrouping",()=>{this.grid.toggleGrouping(this.key)});u(this,"sortColumn",(...e)=>{this.grid.setSortColumn(this.key,...e)});u(this,"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))});u(this,"toggleVisibility",()=>{this.grid.toggleColumnVisibility(this.key)});var o;this.def=e,this.grid=t,this.parent=i,this.columns=((o=e.columns)==null?void 0:o.map(s=>new G(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)}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 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 G({...this.def,pin:e},this.grid,this.parent);return t.columns=this.columns.filter(i=>i.hasPin(e)).map(i=>{const o=i.getPinnedColumn(e);return o.parent=t,o}).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}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,o=t.findIndex(s=>s===this);e+=t.sumBy((s,r)=>r<o?s.inlineWidth??0:0),e+=i}else{const t=this.grid.columns.value.left.filter(o=>o.isVisible),i=t.findIndex(o=>o===this);e+=t.sumBy((o,s)=>s<i?o.inlineWidth??0:0)}return e}get right(){let e=0;if(this.parent){const{visibleColumns:t}=this.parent,i=t.reverse(),o=i.findIndex(s=>s===this);e+=i.sumBy((s,r)=>r<o?s.inlineWidth??0:0),e+=this.parent.right}else{const i=this.grid.columns.value.right.filter(s=>s.isVisible).reverse(),o=i.findIndex(s=>s===this);e+=i.sumBy((s,r)=>r<o?s.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.includes(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}}class le{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===C?`> ${this.row.groupValue} (${this.row.count})`:null}}class F{constructor(e,t,i,o,s){u(this,"parentRow");this.grid=e,this.groupColumn=t,this.rows=i,this.rowIndex=o,this.groupValue=s,i.forEach(r=>r.parentRow=this)}get rowKey(){var e;return`${((e=this.parentRow)==null?void 0:e.rowKey)??""}${this.groupColumn.key}${this.groupValue}`}get cells(){return this.grid.columns.value.visibleLeafs.map(e=>new le(this.grid,this,e))}get expanded(){return this.grid.expandedGroupRow[this.rowKey]}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 groupingColumn(){return this.grid.columns.value.leafs.findOrThrow(e=>e.key===C)}get groupingColumnGridColumn(){const{visibleLeafs:e}=this.grid.columns.value,{groupingColumn:t}=this;return e.sumBy(o=>o.pin===t.pin&&o.key!==E&&o.key!==T&&o.key!==R?1:0)}toggleRow(){this.grid.toggleGroupRow(this.rowKey)}}class ue{constructor(e,t,i){this.grid=e,this.row=t,this.column=i}get value(){return this.column.key===E?null:this.column.key===R?this.row.rowIndex+1:this.row.row[this.column.key]}}class H{constructor(e,t,i){u(this,"parentRow");this.grid=e,this.row=t,this.rowIndex=i,this.grid=e,this.row=t}get rowKey(){return this.getRowKey()}get cells(){return this.grid.columns.value.visibleLeafs.map(e=>new ue(this.grid,this,e))}get count(){return 1}get flatRows(){return[this]}getRowKey(){var i;const{rowKey:e}=this.grid.props.def,t=e?typeof e=="function"?e(this.row):this.row[e]:this.rowIndex;return`${((i=this.parentRow)==null?void 0:i.rowKey)??""}${t}`}}const E="empty-cell",R="row-number-cell",T="row-selection-cell",C="grouping-cell";class ae{constructor(e,t){u(this,"_sourceColumns",[]);u(this,"columns",d.memo(()=>{const e=this._sourceColumns.map(l=>l.getPinnedColumn("LEFT")).filter(l=>!!l),t=this._sourceColumns.map(l=>l.getPinnedColumn()).filter(l=>!!l),i=this._sourceColumns.map(l=>l.getPinnedColumn("RIGHT")).filter(l=>!!l),o=[...e,...t,...i].flatMap(l=>l.flatColumns),s=o.filter(l=>l.isLeaf),r=o.filter(l=>l.isLeaf&&l.isVisible),h=o.maxBy(l=>l.death)+1;return{left:e,middle:t,right:i,flat:o,leafs:s,visibleLeafs:r,maxDeath:h}}));u(this,"headerRows",d.memo(()=>this.columns.value.flat.groupBy(t=>t.death).sortBy(t=>t.key).map(t=>{var o,s,r;const i=t.values.groupBy(h=>h.pin??re).toRecord(h=>[h.key,h.values]);return[...((o=i.LEFT)==null?void 0:o.filter(h=>h.isVisible))??[],...((s=i.NO_PIN)==null?void 0:s.filter(h=>h.isVisible))??[],...((r=i.RIGHT)==null?void 0:r.filter(h=>h.isVisible))??[]]})));u(this,"gridTemplateColumns",d.memo(()=>{const{visibleLeafs:e}=this.columns.value,t=e.sumBy(r=>r.pin==="RIGHT"?1:0),i=e.length-t-1,o=i>0?`repeat(${i}, max-content)`:"",s=t>0?`repeat(${t}, max-content)`:"";return`${o} auto ${s}`}));u(this,"rows",d.memo(()=>{let e=this.props.data;if(this._sortColumn&&(e=e.sortBy(t=>t[this._sortColumn],this._sortDirection)),this.groupColumns.length>0){const t=(i,o,s)=>{const r=o[0];o=o.removeBy(l=>l===r);const h=this.columns.value.leafs.findOrThrow(l=>l.key===r);return this._sortColumn===C&&(i=i.sortBy(l=>l[r],this._sortDirection)),i.groupBy(l=>l[r]).map(l=>{let m;o.length>0?m=t(l.values,o,s+1):m=l.values.map((y,x)=>new H(this,y,s+1+x));const c=new F(this,h,m,s,l.key);return s+=1,c.expanded&&(s+=m.length),c})};return t(e,this.groupColumns,0)}return e.map((t,i)=>new H(this,t,i))}));u(this,"flatRows",d.memo(()=>this.rows.value.flatMap(e=>e.flatRows)));u(this,"sizes",d.memo(()=>{console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid sizes memo");const e=this.columns.value.flat.reduce((o,s)=>{const{inlineWidth:r}=s;return typeof r=="number"&&(o[s.widthVarName]=`${s.inlineWidth}px`),s.pin==="LEFT"&&(o[s.leftVarName]=`${s.left}px`),s.pin==="RIGHT"&&(o[s.rightVarName]=`${s.right}px`),o},{});e[this.leftEdgeVarName]=`${this.leftEdge}px`;const{visibleLeafs:t}=this.columns.value,i=t.find(o=>o.key===C);if(i){const o=t.sumBy(s=>s.pin===i.pin&&s.key!==R&&s.key!==T?s.inlineWidth??0:0);e[i.groupColumnWidthVarName]=`${o}px`}return this.groupColumns.forEach(o=>{const s=this.columns.value.leafs.findOrThrow(r=>r.key===o);e[s.groupColumnWidthVarName]=`${t.sumBy(r=>r.pin===s.pin?r.inlineWidth??0:0)}px`}),e}));u(this,"ROW_HEIGHT",12);u(this,"MIN_COLUMN_WIDTH_PX",48);u(this,"DEFAULT_COLUMN_WIDTH_PX",200);u(this,"isResizeMode",!1);u(this,"expandedGroupRow",{});u(this,"leftEdgeVarName","--left-edge");u(this,"setSortColumn",(e,...t)=>{if(t.length>0)[this._sortDirection]=t,this._sortColumn=this._sortDirection?e:void 0;else{const{_sortColumn:i,_sortDirection:o}=this;this._sortColumn=i===e&&o==="DESC"?void 0:e,this._sortDirection=i===e&&o==="ASC"?"DESC":"ASC"}this.headerRows.clear(),this.rows.clear(),this.flatRows.clear(),this.update()});u(this,"pinColumn",(e,t)=>{const i=this.columns.value.flat.findOrThrow(o=>o.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()});u(this,"toggleGrouping",e=>{this.groupColumns.includes(e)?(this.groupColumns=this.groupColumns.removeBy(i=>i===e),this.hiddenColumns=this.hiddenColumns.removeBy(i=>i===e)):(this.groupColumns=this.groupColumns.add(e),this.hiddenColumns=this.hiddenColumns.add(e));const t=this._sourceColumns.find(i=>i.key===C);if(this.groupColumns.length>0&&!t){const i=this._sourceColumns.sumBy(o=>o.key===R||o.key===T?1:0);this._sourceColumns.splice(i,0,new G({key:C},this))}else this.groupColumns.length===0&&t&&(this._sourceColumns=this._sourceColumns.removeBy(i=>i.key===C));this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()});u(this,"unGroupAll",()=>{this.groupColumns=[],this._sourceColumns=this._sourceColumns.removeBy(e=>e.key===C),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()});u(this,"toggleGroupRow",e=>{e in this.expandedGroupRow?delete this.expandedGroupRow[e]:this.expandedGroupRow[e]=!0,this.rows.clear(),this.flatRows.clear(),this.update()});u(this,"toggleColumnVisibility",e=>{this.hiddenColumns.includes(e)?this.hiddenColumns=this.hiddenColumns.removeBy(t=>t===e):this.hiddenColumns=this.hiddenColumns.add(e),this.columns.clear(),this.headerRows.clear(),this.gridTemplateColumns.clear(),this.rows.clear(),this.flatRows.clear(),this.sizes.clear(),this.update()});u(this,"setWidth",(e,t)=>{const i=this.columns.value.leafs.find(s=>s.key===e);if(!i)throw new Error("Leaf column not found.");i.setWidth(t),this._sourceColumns.flatMap(s=>s.flatColumns).findOrThrow(s=>s.key===e).setWidth(t)});u(this,"groupColumns",[]);u(this,"hiddenColumns",[]);u(this,"_sortColumn");u(this,"_sortDirection","ASC");this.props=e,this.update=t,this._sourceColumns=e.def.columns.map(i=>new G(i,this)),this._sourceColumns.push(new G({key:E},this)),this._sourceColumns.unshift(new G({key:T,width:50,align:"center"},this)),this._sourceColumns.unshift(new G({key:R,pin:"LEFT",width:70,align:"right"},this))}get leftEdge(){return this.columns.value.left.sumBy(e=>e.inlineWidth??0)}get rightEdge(){return this.columns.value.right.sumBy(e=>e.inlineWidth??0)}get sortColumn(){return this._sortColumn}get sortDirection(){return this._sortDirection}}function he(a){const e=p.useMemo(()=>new ae(a,()=>i(s=>s+1)),[a]),[t,i]=p.useState(0);return p.useMemo(()=>Object.create(Object.getPrototypeOf(e),Object.getOwnPropertyDescriptors(e)),[e,t])}function ce(a){const{column:e}=a,{key:t,pin:i,left:o,right:s,isEdge:r,isLeaf:h,leafs:l,grid:m,header:c,gridRows:y,widthVarName:x,leftVarName:j,rightVarName:k,inlineWidth:v}=e,_=t===E,L=t===C,b=t===R,I=t===T,P=i==="LEFT",W=i==="RIGHT",M=P||i==="RIGHT",N=P&&o===0,B=P&&r,Y=W&&r,J=W&&s===0,S=h&&!_&&!b&&!I,Q=h?1:l.length,Z=!b&&!I,O=!b&&!I,ee=p.useMemo(()=>{if(b)return null;if(I)return n.jsx(V,{m:1});if(L){if(m.groupColumns.length===1){const $=m.columns.value.leafs.findOrThrow(te=>te.key===m.groupColumns[0]);return $.header??$.key}return"Group"}return c??t},[m.groupColumns]);return n.jsx(w,{component:"datagrid.header.cell",variant:{isRowNumber:b,isPinned:M,isFirstLeftPinned:N,isLastLeftPinned:B,isFirstRightPinned:Y,isLastRightPinned:J,isSortable:S},gridRow:y,gridColumn:Q,style:{width:`var(${x})`,left:P?`var(${j})`:void 0,right:W?`var(${k})`:void 0},children:!_&&n.jsxs(n.Fragment,{children:[n.jsx(w,{width:"fit",height:"fit",jc:e.align,props:{onClick:S?()=>e.sortColumn():void 0},children:n.jsxs(w,{overflow:"hidden",position:h?void 0:"sticky",ai:"center",transition:"none",pl:e.align?void 0:4,style:{left:i?void 0:`var(${m.leftEdgeVarName})`},children:[n.jsx(g.default,{overflow:"hidden",textOverflow:"ellipsis",textWrap:"nowrap",children:ee}),t===m.sortColumn&&n.jsx(g.default,{pl:(v??0)<58?0:2,children:n.jsx(d.ArrowIcon,{width:"16px",rotate:m.sortDirection==="ASC"?0:180,fill:"violet-950"})}),O&&n.jsx(g.default,{minWidth:10})]})}),Z&&n.jsx(de,{column:e}),O&&n.jsx(me,{column:e})]})})}function de(a){const{column:e}=a;return n.jsx(w,{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(g.default,{cursor:"col-resize",px:.75,className:"resizer",height:"fit",props:{onMouseDown:e.resizeColumn,onTouchStart:e.resizeColumn},children:n.jsx(g.default,{width:.5,height:"fit",bgColor:"gray-400",hoverGroup:{resizer:{bgColor:"gray-600"}}})})})}function me(a){const{column:e}=a,[t,i,o]=d.useVisibility({hideOnScroll:!0,event:"mousedown"}),[s,r]=p.useState({top:0,left:0}),h=p.useMemo(()=>s.left>window.innerWidth/2,[s.left]),l=e.isLeaf&&(e.grid.sortColumn!==e.key||e.grid.sortDirection==="DESC"),m=e.isLeaf&&(e.grid.sortColumn!==e.key||e.grid.sortDirection==="ASC"),c=e.isLeaf&&e.grid.sortColumn===e.key,y=e.pin!=="LEFT",x=e.pin!=="RIGHT",j=!!e.pin,k=e.isLeaf&&e.key!==C,v=e.isLeaf&&e.key===C,_=l||m||c,L=y||x||j;return n.jsx(w,{position:"absolute",right:e.pin==="RIGHT"?2.5:4,top:"1/2",translateY:-3,ai:"center",children:n.jsxs(f,{clean:!0,onClick:()=>i(!t),width:6,height:6,cursor:"pointer",userSelect:"none",borderRadius:1,borderColor:"gray-200",display:"flex",jc:"center",ai:"center",transition:"none",bgColor:"gray-200",hover:{bgColor:"gray-300"},children:[n.jsx(d.DotsIcon,{fill:"violet-950"}),t&&n.jsxs(z,{bgColor:"white",width:56,b:1,borderColor:"gray-300",borderRadius:1,display:"flex",d:"column",mt:4,py:2,overflow:"hidden",translateX:h?-55:-5,onPositionChange:r,ref:o,shadow:"medium-shadow",children:[l&&n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:()=>e.sortColumn("ASC"),children:[n.jsx(d.ArrowIcon,{width:"1rem",fill:"violet-950"}),"Sort Ascending"]}),m&&n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:()=>e.sortColumn("DESC"),children:[n.jsx(d.ArrowIcon,{width:"1rem",fill:"violet-950",rotate:180}),"Sort Descending"]}),c&&n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:()=>e.sortColumn(void 0),children:[n.jsx(g.default,{width:4}),"Clear Sort"]}),_&&(L||k||v)&&n.jsx(g.default,{bb:1,my:2,borderColor:"gray-300"}),y&&n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:()=>e.pinColumn("LEFT"),children:[n.jsx(d.PinIcon,{width:"1rem",fill:"violet-950"}),"Pin Left"]}),x&&n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:()=>e.pinColumn("RIGHT"),children:[n.jsx(d.PinIcon,{width:"1rem",fill:"violet-950",rotate:-90}),"Pin Right"]}),j&&n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:()=>e.pinColumn(),children:[n.jsx(g.default,{width:4}),"Unpin"]}),_&&L&&(k||v)&&n.jsx(g.default,{bb:1,my:2,borderColor:"gray-300"}),k&&n.jsxs(f,{clean:!0,display:"flex",ai:"center",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:e.toggleGrouping,children:[n.jsx(g.default,{children:n.jsx(d.GroupingIcon,{width:"1rem",fill:"violet-950"})}),n.jsxs(g.default,{textWrap:"nowrap",children:[" Group by ",e.header??e.key]})]}),v&&n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:e.grid.unGroupAll,children:[n.jsx(g.default,{children:n.jsx(d.GroupingIcon,{width:"1rem",fill:"violet-950"})}),n.jsx(g.default,{textWrap:"nowrap",children:" Un-Group All"})]})]})]})})}function D(a){const{children:e,column:t,style:i,...o}=a,{key:s,pin:r,left:h,right:l,isEdge:m,align:c,widthVarName:y,leftVarName:x,rightVarName:j}=t,k=s===E,v=s===R,_=s===T,L=r==="LEFT",b=r==="RIGHT",I=L||b,P=L&&h===0,W=L&&m,M=b&&m,N=b&&l===0,B=!_&&!k;return n.jsxs(w,{component:"datagrid.cell",props:{role:"cell"},variant:{isPinned:I,isFirstLeftPinned:P,isLastLeftPinned:W,isFirstRightPinned:M,isLastRightPinned:N,isRowNumber:v,isRowSelection:_},jc:c,style:{width:`var(${y})`,left:L?`var(${x})`:void 0,right:b?`var(${j})`:void 0,...i},...o,children:[B&&n.jsx(g.default,{px:4,textOverflow:"ellipsis",overflow:"hidden",textWrap:"nowrap",children:e}),_&&e]})}function ge(a){const{row:e}=a;return n.jsx(w,{className:"grid-row",display:"contents",props:{role:"rowgroup"},children:e.cells.map(t=>{const{key:i,pin:o,groupColumnWidthVarName:s}=t.column,r=o==="RIGHT";if(i===C)return n.jsx(D,{column:t.column,style:{width:`var(${s})`,right:r?"0":void 0},br:e.groupingColumn.pin==="LEFT"?1:void 0,gridColumn:e.groupingColumnGridColumn,pl:4*e.depth,children:n.jsx(f,{display:"contents",clean:!0,onClick:()=>e.toggleRow(),cursor:"pointer",children:t.value})},i);if(i===T)return n.jsx(D,{column:t.column,children:n.jsx(V,{m:1})},i);if(o!==e.groupingColumn.pin||i===E||i===R)return n.jsx(D,{column:t.column,children:t.value},i)})})}function pe(a){const{row:e}=a;return n.jsx(w,{className:"grid-row",display:"contents",props:{role:"row"},children:e.cells.map(t=>n.jsx(D,{column:t.column,children:t.column.key===T?n.jsx(V,{}):t.value},t.column.key))})}function fe(a){const{grid:e}=a,t=p.useMemo(()=>e.groupColumns.length===0?null:e.groupColumns.map((i,o)=>{const s=e.columns.value.leafs.findOrThrow(r=>r.key===i);return n.jsxs(p.Fragment,{children:[">",n.jsxs(w,{component:"datagrid.columnGroups.item",children:[s.header??s.key,n.jsx(f,{component:"datagrid.columnGroups.item.icon",onClick:()=>e.toggleGrouping(s.key),children:n.jsx(d.CloseSvg,{fill:"currentColor",width:"100%"})})]})]},i)}),[e.groupColumns]);return n.jsxs(w,{component:"datagrid.columnGroups",position:"relative",children:[n.jsx(Ce,{grid:e}),t&&n.jsx(d.GroupingIcon,{width:"1rem",fill:"violet-950"}),t,n.jsxs(w,{position:"absolute",justifySelf:"flex-end",right:2,top:2,className:"parent",children:[n.jsx(w,{position:"absolute",width:8,height:8,right:0,jc:"center",children:n.jsx(d.SearchIcon,{fill:"violet-950",width:"1rem"})}),n.jsx(ne,{placeholder:"Search...",height:8,width:50,zIndex:1,bgColor:"transparent"})]})]})}function Ce(a){const{grid:e}=a,[t,i,o]=d.useVisibility({event:"mousedown"}),s=p.useMemo(()=>e.columns.value.leafs.filter(r=>![E,R,T,C].includes(r.key)),[e.columns.value.leafs]);return n.jsxs(f,{clean:!0,cursor:"pointer",p:1,hover:{bgColor:"gray-200",borderRadius:1},onClick:()=>i(!t),children:[n.jsx(oe,{viewBox:"0 0 24 24",width:"20",fill:"currentColor",...a,children:n.jsx("path",{d:"M5 6h14M5 12h14M5 18h14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})}),t&&n.jsx(z,{bgColor:"white",width:56,b:1,borderColor:"gray-300",borderRadius:1,display:"flex",d:"column",mt:4,py:2,translateX:-1,shadow:"medium-shadow",ref:o,overflow:"auto",maxHeight:100,children:s.map(r=>n.jsxs(f,{clean:!0,display:"flex",gap:2,p:3,cursor:"pointer",hover:{bgColor:"gray-200"},onClick:h=>{h.stopPropagation(),r.toggleVisibility()},children:[n.jsx(V,{checked:r.isVisible,onChange:()=>{},focus:{outline:0}}),r.header??r.key]},r.key))})]})}function U(a){const e=he(a),{isResizeMode:t}=e,i=p.useMemo(()=>(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render headers"),e.headerRows.value.map(r=>r.map(h=>n.jsx(ce,{column:h},h.uniqueKey)))),[e.headerRows.value]),o=p.useRef(null),s=p.useCallback(d.FnUtils.throttle(r=>{var h;(h=o.current)==null||h.setScrollTop(r.target.scrollTop)},100),[o.current]);return console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render"),n.jsxs(g.default,{component:"datagrid",style:e.sizes.value,props:{role:"presentation"},children:[n.jsx(fe,{grid:e}),n.jsxs(g.default,{overflowX:"scroll",props:{onScroll:s},children:[n.jsx(A,{component:"datagrid.header",variant:{isResizeMode:t},style:{gridTemplateColumns:e.gridTemplateColumns.value},children:i}),n.jsx(X,{ref:o,grid:e})]}),n.jsxs(g.default,{p:3,bgColor:"gray-200",bt:1,borderColor:"gray-400",children:["Rows: ",a.data.length]})]})}U.displayName="DataGrid";const q=10,K=25,we=q+K*2;function ye(a,e){const{grid:t}=a,i=d.DEFAULT_REM_DIVIDER*t.ROW_HEIGHT,[o,s]=p.useState(0),r=Math.max(0,Math.floor(o/i)-K),h=p.useMemo(()=>(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render rows"),t.flatRows.value.take(we,r).map(c=>c instanceof F?n.jsx(ge,{row:c},c.rowKey):n.jsx(pe,{row:c},c.rowKey))),[t.flatRows.value,r]);p.useImperativeHandle(e,()=>({setScrollTop:s}));const l=t.flatRows.value.length;return n.jsx(g.default,{height:t.ROW_HEIGHT*q+4,children:n.jsx(g.default,{style:{height:`${l*i}px`},children:n.jsx(A,{width:"max-content",minWidth:"fit",transition:"none",style:{transform:`translateY(${r*i}px)`,gridTemplateColumns:t.gridTemplateColumns.value},children:h})})})}const X=p.forwardRef(ye);X.displayName="Rows";module.exports=U;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),h=require("../box.cjs"),f=require("./flex.cjs"),p=require("react"),c=require("../core.cjs"),$=require("./grid.cjs"),W=require("./checkbox.cjs"),w=require("./button.cjs"),L=require("./semantics.cjs"),F=require("./tooltip.cjs"),pe=require("./baseSvg.cjs");function ge(a){const{grid:e}=a;return n.jsxs(f.default,{component:"datagrid.bottomBar",children:[n.jsxs(h.default,{children:["Rows: ",e.props.data.length]}),e.props.def.rowSelection&&n.jsxs(h.default,{children:["Selected: ",e.selectedRows.size]})]})}function U(a){const{cell:e}=a,t=p.useCallback(()=>{e.grid.toggleRowSelection(e.row.key)},[e.grid,e.row.key]);return n.jsx(W.default,{variant:"datagrid",checked:e.row.selected,onChange:t})}U.displayName="DataGridCellRowSelection";const fe="NO_PIN";class D{constructor(e,t,i){this.def=e,this.grid=t,this.parent=i,this.columns=e.columns?.map(s=>new D(e.pin?{...s,pin:e.pin}:s,t,this))??[],this.isLeaf&&(this._inlineWidth=this.key==M?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 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(o=>o===this);e+=t.sumBy((o,r)=>r<s?o.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,o)=>o<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(o=>o===this);e+=i.sumBy((o,r)=>r<s?o.inlineWidth??0:0),e+=this.parent.right}else{const i=this.grid.columns.value.right.filter(o=>o.isVisible).reverse(),s=i.findIndex(o=>o===this);e+=i.sumBy((o,r)=>r<s?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:s}=this.grid,o=this.leafs.sumBy(u=>u.inlineWidth)-this.leafs.length*i,r=this.leafs.toRecord(u=>[u.key,u.inlineWidth]),m=c.FnUtils.throttle(u=>{const g=(u.pageX-t)*(this.pin==="RIGHT"?-1:1);this.leafs.forEach(C=>{const v=r[C.key],j=o>0?(v-i)/o*g:g/this.leafs.length,x=Math.round(v+j);C.setWidth(x<i?i:x)}),this.grid.sizes.clear(),s()},40),l=new AbortController,d=u=>{l.abort(),this.grid.isResizeMode=!1,s()};window.addEventListener("mousemove",m,l),window.addEventListener("mouseup",d,l)};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 we{constructor(e,t,i){this.grid=e,this.row=t,this.column=i}get value(){return this.column.key===k?this.row.rowIndex+1:this.row.data[this.column.key]}}class A{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 we(this.grid,this,e))}get selected(){return this.grid.selectedRows.has(this.key)}get flatRows(){return this}get allRows(){return this}}const M="empty-cell",k="row-number-cell",_="row-selection-cell",R="grouping-cell";class Ce{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 D({key:R},this)),t.push(...e.columns.map(i=>new D(i,this))),t.push(new D({key:M,Cell:()=>null},this)),e.rowSelection){const i=typeof e.rowSelection=="object"&&e.rowSelection.pinned?"LEFT":void 0;t.unshift(new D({key:_,pin:i,width:50,align:"center",Cell:U},this))}if(e.showRowNumber){const i=typeof e.showRowNumber=="object"&&e.showRowNumber.pinned?"LEFT":void 0;t.unshift(new D({key:k,pin:i,width:70,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(l=>l.getPinnedColumn("LEFT")).filter(l=>!!l),t=this.sourceColumns.value.map(l=>l.getPinnedColumn()).filter(l=>!!l),i=this.sourceColumns.value.map(l=>l.getPinnedColumn("RIGHT")).filter(l=>!!l),s=[...e,...t,...i].flatMap(l=>l.flatColumns),o=s.filter(l=>l.isLeaf),r=s.filter(l=>l.isLeaf&&l.isVisible),m=s.maxBy(l=>l.death)+1;return{left:e,middle:t,right:i,flat:s,leafs:o,visibleLeafs:r,maxDeath:m}});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??fe).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(r=>r.pin==="RIGHT"?1:0),i=e.length-t-1,s=i>0?`repeat(${i}, max-content)`:"",o=t>0?`repeat(${t}, max-content)`:"";return`${s} auto ${o}`});rows=c.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,s,o)=>{const r=s.values().next().value;s.delete(r);const m=this.columns.value.leafs.findOrThrow(l=>l.key===r);return this._sortColumn===R&&(i=i.sortBy(l=>l[r],this._sortDirection)),i.groupBy(l=>l[r]).map(l=>{let d;s.size>0?d=t(l.values,new Set(s),o+1):d=l.values.map((g,C)=>new A(this,g,o+1+C));const u=new q(this,m,d,o,l.key);return o+=1,u.expanded&&(o+=d.length),u})};return t(e,new Set(this.groupColumns),0)}return e.map((t,i)=>new A(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,o)=>{const{inlineWidth:r}=o;return typeof r=="number"&&(s[o.widthVarName]=`${o.inlineWidth}px`),o.pin==="LEFT"&&(s[o.leftVarName]=`${o.left}px`),o.pin==="RIGHT"&&(s[o.rightVarName]=`${o.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===R);if(i){const s=t.sumBy(o=>o.pin===i.pin&&o.key!==k&&o.key!==_?o.inlineWidth??0:0);e[i.groupColumnWidthVarName]=`${s}px`}return this.groupColumns.forEach(s=>{const o=this.columns.value.leafs.findOrThrow(r=>r.key===s);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: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=()=>{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 xe{constructor(e,t,i){this.grid=e,this.row=t,this.column=i}get value(){return this.column.key===k?this.row.rowIndex+1:this.column.key===R?`${this.row.groupValue} (${this.row.count})`:null}}class q{constructor(e,t,i,s,o){this.grid=e,this.groupColumn=t,this.rows=i,this.rowIndex=s,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 xe(this.grid,this,e))}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===R)}get groupingColumnGridColumn(){const{visibleLeafs:e}=this.grid.columns.value,{groupingColumn:t}=this;return e.sumBy(s=>s.pin===t.pin&&s.key!==M&&s.key!==_&&s.key!==k?1:0)}toggleRow(){this.grid.toggleGroupRow(this.key)}}function N(a){const{children:e,column:t,style:i,...s}=a,{key:o,pin:r,left:m,right:l,isEdge:d,align:u,widthVarName:g,leftVarName:C,rightVarName:v}=t;"align"in t.def&&(s.jc=u);const j=o===k,x=o===_,y=r==="LEFT",b=r==="RIGHT",G=y||b,S=y&&m===0,T=y&&d,B=b&&d,I=b&&l===0;return n.jsx(f.default,{component:"datagrid.cell",props:{role:"cell"},variant:{isPinned:G,isFirstLeftPinned:S,isLastLeftPinned:T,isFirstRightPinned:B,isLastRightPinned:I,isRowNumber:j,isRowSelection:x},style:{width:`var(${g})`,height:`var(${t.grid.rowHeightVarName})`,left:y?`var(${C})`:void 0,right:b?`var(${v})`:void 0,...i},...s,children:e})}N.displayName="DataGridCell";function X(a){const{row:e}=a,t=p.useCallback(()=>{e.grid.toggleRowsSelection(e.allRows.map(i=>i.key))},[]);return n.jsx(f.default,{className:"grid-row",display:"contents",props:{role:"rowgroup"},children:e.cells.map(i=>{const{key:s,pin:o,groupColumnWidthVarName:r}=i.column,m=o==="RIGHT";if(s===R)return n.jsx(N,{column:i.column,style:{width:`var(${r})`,right:m?"0":void 0},br:e.groupingColumn.pin==="LEFT"?1:void 0,gridColumn:e.groupingColumnGridColumn,pl:4*e.depth,overflow:"auto",children:n.jsx(h.default,{textWrap:"nowrap",px:4,children:n.jsxs(w.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:e.expanded?0:-90}),i.value]})})},s);if(s===_){const l=e.allRows,d=l.every(g=>g.selected),u=!d&&l.some(g=>g.selected);return n.jsx(N,{column:i.column,children:n.jsx(W.default,{variant:"datagrid",m:1,checked:d,indeterminate:u,onChange:t})},s)}if(s===M)return n.jsx(h.default,{},s);if(o!==e.groupingColumn.pin||s===k)return n.jsx(N,{column:i.column,px:4,children:i.value},s)})})}X.displayName="DataGridGroupRow";function Y(a){const{cell:e}=a;return n.jsx(f.default,{height:"fit",width:"fit",overflow:"auto",ai:"center",jc:e.column.align,children:n.jsx(h.default,{px:4,textOverflow:"ellipsis",overflow:"hidden",textWrap:"nowrap",children:e.value})})}Y.displayName="DataGridCellText";function K(a){const{row:e}=a;return n.jsx(f.default,{className:"grid-row",display:"contents",props:{role:"row"},children:e.cells.map(t=>n.jsx(N,{column:t.column,children:t.column.Cell?n.jsx(t.column.Cell,{cell:t}):n.jsx(Y,{cell:t})},t.column.key))})}K.displayName="DataGridRow";const ye=10,O=20;function J(a){const{grid:e,scrollTop:t}=a,i=e.flatRows.value.length,s=Math.max(0,Math.floor(t/e.rowHeight)-O),o=e.props.def.visibleRowsCount??ye,r=e.rowHeight*o+e.rowHeight/5,m=p.useMemo(()=>{if(console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render rows"),e.props.data.length===0)return n.jsx(f.default,{jc:"center",ai:"center",gridColumn:"full-row",style:{height:r},children:e.props.loading?"loading...":"empty"});const l=o+O*2;return e.flatRows.value.take(l,s).map(u=>u instanceof q?n.jsx(X,{row:u},u.key):n.jsx(K,{row:u},u.key))},[e.flatRows.value,e.props.data.length,e.props.loading,s,r,o]);return console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render DataGridBody"),n.jsx(h.default,{style:{height:r},children:n.jsx(h.default,{style:{height:`${i*e.rowHeight}px`},children:n.jsx($.default,{width:"max-content",minWidth:"fit",transition:"none",style:{transform:`translateY(${s*e.rowHeight}px)`,gridTemplateColumns:e.gridTemplateColumns.value},children:m})})})}J.displayName="DataGridBody";function Q(a){const{column:e}=a,[t,i,s]=c.useVisibility({hideOnScroll:!0,event:"mousedown"}),[o,r]=p.useState({top:0,left:0}),m=p.useMemo(()=>o.left>window.innerWidth/2,[o.left]),l=e.isLeaf&&(e.grid.sortColumn!==e.key||e.grid.sortDirection==="DESC"),d=e.isLeaf&&(e.grid.sortColumn!==e.key||e.grid.sortDirection==="ASC"),u=e.isLeaf&&e.grid.sortColumn===e.key,g=e.pin!=="LEFT",C=e.pin!=="RIGHT",v=!!e.pin,j=e.isLeaf&&e.key!==R,x=e.isLeaf&&e.key===R,y=l||d||u,b=g||C||v,G=e.align==="right"?2:void 0,S=e.align==="right"?void 0:e.pin==="RIGHT"?2.5:4;return n.jsx(f.default,{position:"absolute",left:G,right:S,top:"1/2",translateY:-3,ai:"center",children:n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu",onClick:()=>i(!t),children:[n.jsx(L.Span,{component:"datagrid.header.cell.contextMenu.icon",children:n.jsx(c.DotsIcon,{fill:"currentColor"})}),t&&n.jsxs(F.default,{component:"datagrid.header.cell.contextMenu.tooltip",variant:{openLeft:m},onPositionChange:r,ref:s,children:[l&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn("ASC"),children:[n.jsx(L.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(c.SortIcon,{width:"100%",fill:"currentColor"})}),"Sort Ascending"]}),d&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn("DESC"),children:[n.jsx(L.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(c.SortIcon,{width:"100%",fill:"currentColor",rotate:180})}),"Sort Descending"]}),u&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.sortColumn(void 0),children:[n.jsx(h.default,{width:4}),"Clear Sort"]}),y&&(b||j||x)&&n.jsx(h.default,{bb:1,my:2,borderColor:"gray-300"}),g&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn("LEFT"),children:[n.jsx(L.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(c.PinIcon,{width:"100%",fill:"currentColor"})}),"Pin Left"]}),C&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn("RIGHT"),children:[n.jsx(L.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(c.PinIcon,{width:"100%",fill:"currentColor",rotate:-90})}),"Pin Right"]}),v&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:()=>e.pinColumn(),children:[n.jsx(h.default,{width:4}),"Unpin"]}),y&&b&&(j||x)&&n.jsx(h.default,{bb:1,my:2,borderColor:"gray-300"}),j&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:e.toggleGrouping,children:[n.jsx(L.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(c.GroupingIcon,{width:"100%",fill:"currentColor"})}),n.jsxs(h.default,{textWrap:"nowrap",children:["Group by ",e.header??e.key]})]}),x&&n.jsxs(w.default,{component:"datagrid.header.cell.contextMenu.tooltip.item",onClick:e.grid.unGroupAll,children:[n.jsx(L.Span,{component:"datagrid.header.cell.contextMenu.tooltip.item.icon",children:n.jsx(c.GroupingIcon,{width:"100%",fill:"currentColor"})}),n.jsx(h.default,{textWrap:"nowrap",children:"Un-Group All"})]})]})]})})}Q.displayName="DataGridHeaderCellContextMenu";function Z(a){const{column:e}=a;return n.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:n.jsx(h.default,{cursor:"col-resize",px:.75,className:"resizer",height:"fit",props:{onMouseDown:e.resizeColumn,onTouchStart:e.resizeColumn},children:n.jsx(h.default,{component:"datagrid.header.cell.resizer"})})})}Z.displayName="DataGridHeaderCellResizer";function ee(a){const{column:e}=a,{key:t,pin:i,left:s,right:o,isEdge:r,isLeaf:m,leafs:l,grid:d,header:u,gridRows:g,widthVarName:C,leftVarName:v,rightVarName:j,inlineWidth:x}=e,y=t===M,b=t===R,G=t===k,S=t===_,T=i==="LEFT",B=i==="RIGHT",I=T||i==="RIGHT",le=T&&s===0,ae=T&&r,de=B&&r,ue=B&&o===0,V=m&&!y&&!G&&!S,ce=m?1:l.length,he=!G&&!S,H=!G&&!S,z=p.useCallback(()=>{d.toggleSelectAllRows()},[]),me=p.useMemo(()=>{if(G)return null;if(S){const E=d.selectedRows.size===d.props.data.length,P=!E&&d.selectedRows.size>0;return n.jsx(W.default,{variant:"datagrid",m:1,indeterminate:P,checked:E,onChange:z})}if(b){if(d.groupColumns.size===1){const E=d.columns.value.leafs.findOrThrow(P=>P.key===d.groupColumns.values().next().value);return E.header??E.key}return"Group"}return u??t},[d.groupColumns,d.selectedRows,z]);return n.jsx(f.default,{component:"datagrid.header.cell",variant:{isRowNumber:G,isPinned:I,isFirstLeftPinned:le,isLastLeftPinned:ae,isFirstRightPinned:de,isLastRightPinned:ue,isSortable:V},gridRow:g,gridColumn:ce,style:{width:`var(${C})`,left:T?`var(${v})`:void 0,right:B?`var(${j})`:void 0},children:!y&&n.jsxs(n.Fragment,{children:[n.jsx(f.default,{width:"fit",height:"fit",jc:e.align,props:{onClick:V?()=>e.sortColumn():void 0},children:n.jsxs(f.default,{overflow:"hidden",position:m?void 0:"sticky",ai:"center",transition:"none",pl:e.align==="right"?10:4,style:{left:i?void 0:`var(${d.leftEdgeVarName})`},children:[n.jsx(h.default,{overflow:"hidden",textOverflow:"ellipsis",textWrap:"nowrap",children:me}),t===d.sortColumn&&n.jsx(h.default,{pl:(x??0)<58?0:2,children:n.jsx(c.SortIcon,{width:"16px",rotate:d.sortDirection==="ASC"?0:180,fill:"currentColor"})}),H&&n.jsx(h.default,{minWidth:e.align==="right"?4:10})]})}),he&&n.jsx(Z,{column:e}),H&&n.jsx(Q,{column:e})]})})}ee.displayName="DataGridHeaderCell";function te(a){const{grid:e}=a,{isResizeMode:t}=e;return n.jsx($.default,{component:"datagrid.header",variant:{isResizeMode:t},style:{gridTemplateColumns:e.gridTemplateColumns.value},children:e.headerRows.value.map(i=>i.map(s=>n.jsx(ee,{column:s},s.uniqueKey)))})}te.displayName="DataGridHeader";function ie(a){const{grid:e}=a,[t,i]=p.useState(0),s=p.useCallback(c.FnUtils.throttle(o=>{i(o.target.scrollTop)},100),[]);return n.jsxs(h.default,{overflowX:"scroll",props:{onScroll:s},children:[n.jsx(te,{grid:e}),n.jsx(J,{grid:e,scrollTop:t})]})}ie.displayName="DataGridContent";function se(a){const{grid:e}=a;return e.groupColumns.size===0?null:n.jsxs(f.default,{component:"datagrid.topBar.columnGroups",children:[n.jsx(L.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(p.Fragment,{children:[n.jsx(c.ExpandIcon,{fill:"currentColor",width:"14px",height:"14px",rotate:-90}),n.jsxs(f.default,{component:"datagrid.topBar.columnGroups.item",children:[i.header??i.key,n.jsx(w.default,{component:"datagrid.topBar.columnGroups.item.icon",onClick:()=>e.toggleGrouping(i.key),children:n.jsx(c.CloseSvg,{fill:"currentColor",width:"100%"})})]})]},t)})]})}se.displayName="DataGridColumnGroups";function ne(a){const{grid:e}=a,[t,i,s]=c.useVisibility({event:"mousedown"}),o=p.useMemo(()=>e.columns.value.leafs.filter(r=>![M,k,_,R].includes(r.key)),[e.columns.value.leafs]);return n.jsxs(w.default,{component:"datagrid.topBar.contextMenu",onClick:()=>i(!t),children:[n.jsx(pe.default,{viewBox:"0 0 24 24",width:"20",fill:"currentColor",...a,children:n.jsx("path",{d:"M5 6h14M5 12h14M5 18h14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})}),t&&n.jsx(F.default,{component:"datagrid.topBar.contextMenu.tooltip",ref:s,children:o.map(r=>n.jsxs(w.default,{component:"datagrid.topBar.contextMenu.tooltip.item",onClick:m=>{m.stopPropagation(),r.toggleVisibility()},children:[n.jsx(W.default,{variant:"datagrid",checked:r.isVisible,onChange:()=>{},focus:{outline:0}}),r.header??r.key]},r.key))})]})}ne.displayName="DataGridTopBarContextMenu";function oe(a){const{grid:e}=a;return n.jsxs(f.default,{component:"datagrid.topBar",position:"relative",children:[n.jsx(ne,{grid:e}),n.jsx(se,{grid:e})]})}oe.displayName="DataGridTopBar";function Re(a){const[e,t]=p.useState(0),i=p.useRef();return i.current||(i.current=new Ce(a,()=>t(s=>s+1))),p.useEffect(()=>{i.current.props=a,i.current.rows.clear(),i.current.flatRows.clear(),i.current.update()},[a.data]),p.useEffect(()=>{i.current.props=a,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()},[a.def]),p.useEffect(()=>{i.current.props=a,i.current.update()},[a.loading]),i.current}function re(a){const e=Re(a);return console.debug("\x1B[36m%s\x1B[0m","[react-box]: DataGrid render"),n.jsxs(h.default,{component:"datagrid",style:e.sizes.value,props:{role:"presentation"},children:[n.jsx(oe,{grid:e}),n.jsx(ie,{grid:e}),n.jsx(ge,{grid:e})]})}re.displayName="DataGrid";exports.default=re;

package/components/dataGrid.d.ts

@@ -1,2 +1,2 @@
 import { DataGridProps } from './dataGrid/contracts/dataGridContract';
-export default function DataGrid<TRow extends {}>(props: DataGridProps<TRow>): import("react/jsx-runtime").JSX.Element;
+export default function DataGrid<TRow extends object>(props: DataGridProps<TRow>): import("react/jsx-runtime").JSX.Element;