@cronocode/react-box 3.0.15 → 3.0.16

package/components/dataGrid/{dataGridCell.d.ts → components/dataGridCell.d.ts}

@@ -1,5 +1,5 @@
-import { BoxProps } from '../../box';
-import { default as ColumnModel } from './models/columnModel';
+import { BoxProps } from '../../../box';
+import { default as ColumnModel } from '../models/columnModel';
 interface Props<TRow> extends BoxProps {
     children?: React.ReactNode;
     column: ColumnModel<TRow>;

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

@@ -0,0 +1,6 @@
+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 {};

package/components/dataGrid/{dataGridGroupRow.d.ts → components/dataGridGroupRow.d.ts}

@@ -1,4 +1,4 @@
-import { default as GroupRowModel } from './models/groupRowModel';
+import { default as GroupRowModel } from '../models/groupRowModel';
 interface Props<TRow> {
     row: GroupRowModel<TRow>;
 }

package/components/dataGrid/{dataGridHeaderCell.d.ts → components/dataGridHeaderCell.d.ts}

@@ -1,4 +1,4 @@
-import { default as ColumnModel } from './models/columnModel';
+import { default as ColumnModel } from '../models/columnModel';
 interface Props<TRow> {
     column: ColumnModel<TRow>;
 }

package/components/dataGrid/{dataGridPagination.d.ts → components/dataGridPagination.d.ts}

@@ -1,4 +1,4 @@
-import { default as GridModel } from './models/gridModel';
+import { default as GridModel } from '../models/gridModel';
 interface Props<TRow> {
     grid: GridModel<TRow>;
 }

package/components/dataGrid/{dataGridRow.d.ts → components/dataGridRow.d.ts}

@@ -1,4 +1,4 @@
-import { default as RowModel } from './models/rowModel';
+import { default as RowModel } from '../models/rowModel';
 interface Props<TRow> {
     row: RowModel<TRow>;
 }

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

@@ -28,7 +28,6 @@ export interface ColumnType<TRow> {
 export interface GridDefinition<TRow> {
     rowKey?: KeysMatching<TRow, Key> | ((rowData: TRow) => Key);
     columns: ColumnType<TRow>[];
-    pagination?: Pagination;
 }
 export interface DataGridProps<TRow> {
     data: TRow[];

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

@@ -6,6 +6,7 @@ export default class ColumnModel<TRow> {
     private parent?;
     constructor(def: ColumnType<TRow>, grid: GridModel<TRow>, parent?: ColumnModel<TRow> | undefined);
     columns: ColumnModel<TRow>[];
+    get visibleColumns(): ColumnModel<TRow>[];
     get key(): import('../contracts/dataGridContract').Key;
     get header(): string | undefined;
     get align(): "center" | "right" | undefined;
@@ -22,6 +23,7 @@ export default class ColumnModel<TRow> {
     get left(): number;
     get right(): number;
     get isEdge(): boolean;
+    get isVisible(): boolean;
     get leafs(): ColumnModel<TRow>[];
     get groupColumnWidthVarName(): string;
     get widthVarName(): string;
@@ -33,4 +35,5 @@ export default class ColumnModel<TRow> {
     toggleGrouping: () => void;
     sortColumn: (sortDirection?: SortDirection) => void;
     setWidth: (width: number) => void;
+    toggleVisibility: () => void;
 }

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

@@ -2,10 +2,10 @@ import { DataGridProps, Key, PinPosition } from '../contracts/dataGridContract';
 import { default as ColumnModel } from './columnModel';
 import { default as GroupRowModel } from './groupRowModel';
 import { default as RowModel } from './rowModel';
-export declare const EMPTY_CELL_KEY = "empty-cell";
-export declare const ROW_NUMBER_CELL_KEY = "row-number-cell";
-export declare const ROW_SELECTION_CELL_KEY = "row-selection-cell";
-export declare const GROUPING_CELL_KEY = "grouping-cell";
+export declare const EMPTY_CELL_KEY: Key;
+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>;
     readonly update: () => void;
@@ -17,6 +17,8 @@ export default class GridModel<TRow> {
         right: ColumnModel<TRow>[];
         flat: ColumnModel<TRow>[];
         leafs: ColumnModel<TRow>[];
+        visibleLeafs: ColumnModel<TRow>[];
+        maxDeath: number;
     }>;
     readonly headerRows: import('../../../utils/memo').Memo<ColumnModel<TRow>[][]>;
     readonly gridTemplateColumns: import('../../../utils/memo').Memo<string>;
@@ -34,9 +36,12 @@ export default class GridModel<TRow> {
     setSortColumn: (columnKey: Key, sortDirection?: SortDirection) => void;
     pinColumn: (uniqueKey: string, pin?: PinPosition) => void;
     toggleGrouping: (columnKey: Key) => void;
+    unGroupAll: () => void;
     toggleGroupRow: (groupRowKey: Key) => void;
+    toggleColumnVisibility: (columnKey: Key) => void;
     setWidth: (columnKey: Key, width: number) => void;
     groupColumns: Key[];
+    hiddenColumns: Key[];
     private _sortColumn?;
     get sortColumn(): Key | undefined;
     private _sortDirection;

package/components/dataGrid.cjs

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