@cronocode/react-box 3.0.19 → 3.0.21

package/box.cjs

@@ -1 +1 @@
-"use strict";const t=require("react"),e=require("./core.cjs");function T(n,l){const{tag:c="div",children:a,props:m,className:x,style:i,disabled:B,required:p,checked:g,selected:f}=n,h=e.useStyles(n,c==="svg"),r=t.useMemo(()=>{const P=e.classNames(h,x).join(" "),s={...m,className:P};return e.BoxUtils.assignBooleanProp(B,"disabled",s),e.BoxUtils.assignBooleanProp(p,"required",s),e.BoxUtils.assignBooleanProp(g,"checked",s),e.BoxUtils.assignBooleanProp(f,"selected",s),i&&(s.style=i),l&&(s.ref=l),s},[n]),[v,u]=t.useState(!1),d=typeof a=="function";return d&&(r.onMouseEnter=()=>u(!0),r.onMouseLeave=()=>u(!1)),t.createElement(c,r,d?a({isHover:v}):a)}const o=t.memo(t.forwardRef(T));o.extend=e.BoxExtends.extend;o.components=e.BoxExtends.components;o.Theme=e.Theme;o.useTheme=e.Theme.useTheme;o.getVariableValue=e.Variables.getVariableValue;module.exports=o;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),e=require("./core.cjs");function v(t,l){const{tag:r="div",children:a,props:d,className:m,disabled:x,required:B,checked:g,selected:f}=t,y=e.useStyles(t,r==="svg"),i=n.useMemo(()=>{const h=e.classNames(y,m).join(" "),s={...d,className:h};return e.BoxUtils.assignBooleanProp(x,"disabled",s),e.BoxUtils.assignBooleanProp(B,"required",s),e.BoxUtils.assignBooleanProp(g,"checked",s),e.BoxUtils.assignBooleanProp(f,"selected",s),"style"in t&&(s.style=t.style),"id"in t&&(s.id=t.id),l&&(s.ref=l),s},[t]),[b,c]=n.useState(!1),u=typeof a=="function";return u&&(i.onMouseEnter=()=>c(!0),i.onMouseLeave=()=>c(!1)),n.createElement(r,i,u?a({isHover:b}):a)}const o=n.memo(n.forwardRef(v));o.displayName="Box";o.extend=e.BoxExtends.extend;o.components=e.BoxExtends.components;o.Theme=e.Theme;o.useTheme=e.Theme.useTheme;o.getVariableValue=e.Variables.getVariableValue;exports.useVisibility=e.useVisibility;exports.default=o;

package/box.d.ts

@@ -5,8 +5,9 @@ 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';
 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'>;
+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;
@@ -15,6 +16,7 @@ interface Props<TTag extends keyof React.JSX.IntrinsicElements, TKey extends key
     props?: TagPropsType<TTag>;
     className?: ClassNameType;
     style?: React.ComponentProps<TTag>['style'];
+    id?: string;
 }
 interface BoxType {
     <TTag extends keyof React.JSX.IntrinsicElements = 'div', TKey extends keyof ComponentsAndVariants = never>(props: Props<TTag, TKey> & RefAttributes<ExtractElementFromTag<TTag>>): React.ReactNode;
@@ -28,3 +30,4 @@ declare const Box: BoxType;
 export default Box;
 export type BoxProps<TTag extends keyof React.JSX.IntrinsicElements = 'div', TKey extends keyof ComponentsAndVariants = never> = React.ComponentProps<typeof Box<TTag, TKey>>;
 export type BoxTagProps<TTag extends keyof React.JSX.IntrinsicElements = 'div', TKey extends keyof ComponentsAndVariants = never> = Required<BoxProps<TTag, TKey>>['props'];
+export { useVisibility };

package/box.mjs

@@ -1,21 +1,24 @@
-import V, { memo as b, forwardRef as y, useMemo as N, useState as C } from "react";
-import { B as u, T as d, V as E, u as H, c as M, a as o } from "./core.mjs";
-function S(a, r) {
-  const { tag: l = "div", children: t, props: p, className: f, style: c, disabled: g, required: B, checked: x, selected: h } = a, v = H(a, l === "svg"), n = N(() => {
-    const T = M(v, f).join(" "), e = {
-      ...p,
-      className: T
+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 { 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 = {
+      ...u,
+      className: p
     };
-    return o.assignBooleanProp(g, "disabled", e), o.assignBooleanProp(B, "required", e), o.assignBooleanProp(x, "checked", e), o.assignBooleanProp(h, "selected", e), c && (e.style = c), r && (e.ref = r), e;
-  }, [a]), [P, i] = C(!1), m = typeof t == "function";
-  return m && (n.onMouseEnter = () => i(!0), n.onMouseLeave = () => i(!1)), V.createElement(l, n, m ? t({ isHover: P }) : t);
+    return o.assignBooleanProp(g, "disabled", e), o.assignBooleanProp(x, "required", e), o.assignBooleanProp(B, "checked", e), o.assignBooleanProp(y, "selected", e), "style" in s && (e.style = s.style), "id" in s && (e.id = s.id), i && (e.ref = i), e;
+  }, [s]), [h, r] = N(!1), c = typeof t == "function";
+  return c && (n.onMouseEnter = () => r(!0), n.onMouseLeave = () => r(!1)), T.createElement(l, n, c ? t({ isHover: h }) : t);
 }
-const s = b(y(S));
-s.extend = u.extend;
-s.components = u.components;
-s.Theme = d;
-s.useTheme = d.useTheme;
-s.getVariableValue = E.getVariableValue;
+const a = V(v(M));
+a.displayName = "Box";
+a.extend = d.extend;
+a.components = d.components;
+a.Theme = m;
+a.useTheme = m.useTheme;
+a.getVariableValue = C.getVariableValue;
 export {
-  s as default
+  a as default,
+  U as useVisibility
 };

package/components/baseSvg.cjs

@@ -1 +1 @@
-"use strict";const c=require("react/jsx-runtime"),g=require("react"),p=require("../box.cjs");function u(s,e){const{viewBox:r="0 0 24 24",width:t="1.5rem",height:o,props:n,...i}=s;return c.jsx(p,{tag:"svg",ref:e,props:{...n,viewBox:r,width:t,height:o,xmlns:"http://www.w3.org/2000/svg",fill:"none"},...i})}const w=g.forwardRef(u);module.exports=w;
+"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;

package/components/baseSvg.d.ts

@@ -14,7 +14,7 @@ interface Props extends Omit<BoxStyleProps, 'width' | 'height'> {
     width?: string;
     height?: string;
 }
-declare function BaseSvg(props: Props, ref: Ref<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
-declare const _default: import('react').ForwardRefExoticComponent<Props & import('react').RefAttributes<SVGSVGElement>>;
-export default _default;
-export type BaseSvgProps = React.ComponentProps<typeof BaseSvg>;
+declare function BaseSvgImpl(props: Props, ref: Ref<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+declare const BaseSvg: import('react').ForwardRefExoticComponent<Props & import('react').RefAttributes<SVGSVGElement>>;
+export default BaseSvg;
+export type BaseSvgProps = React.ComponentProps<typeof BaseSvgImpl>;

package/components/baseSvg.mjs

@@ -1,19 +1,20 @@
-import { jsx as g } from "react/jsx-runtime";
-import { forwardRef as i } from "react";
-import m from "../box.mjs";
-function n(o, r) {
-  const { viewBox: t = "0 0 24 24", width: s = "1.5rem", height: e, props: p, ...f } = o;
-  return /* @__PURE__ */ g(
-    m,
+import { jsx as m } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import i from "../box.mjs";
+function f(o, r) {
+  const { viewBox: s = "0 0 24 24", width: t = "1.5rem", height: e, props: p, ...a } = o;
+  return /* @__PURE__ */ m(
+    i,
     {
       tag: "svg",
       ref: r,
-      props: { ...p, viewBox: t, width: s, height: e, xmlns: "http://www.w3.org/2000/svg", fill: "none" },
-      ...f
+      props: { ...p, viewBox: s, width: t, height: e, xmlns: "http://www.w3.org/2000/svg", fill: "none" },
+      ...a
     }
   );
 }
-const x = i(n);
+const n = g(f);
+n.displayName = "BaseSvg";
 export {
-  x as default
+  n as default
 };

package/components/button.cjs

@@ -1 +1 @@
-"use strict";const n=require("react/jsx-runtime"),r=require("react"),s=require("../box.cjs"),c=require("../core.cjs"),u=["type","onClick"];function i(t,o){const e=c.ObjectUtils.buildProps(t,u);return n.jsx(s,{ref:o,tag:"button",component:"button",...e})}const p=r.forwardRef(i);module.exports=p;
+"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;

package/components/button.mjs

@@ -1,13 +1,14 @@
 import { jsx as n } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
-import s from "../box.mjs";
-import { O as m } from "../core.mjs";
+import m from "../box.mjs";
+import { O as s } from "../core.mjs";
 const e = ["type", "onClick"];
-function f(o, t) {
-  const r = m.buildProps(o, e);
-  return /* @__PURE__ */ n(s, { ref: t, tag: "button", component: "button", ...r });
+function i(t, o) {
+  const r = s.buildProps(t, e);
+  return /* @__PURE__ */ n(m, { ref: o, tag: "button", component: "button", ...r });
 }
-const b = p(f);
+const u = p(i);
+u.displayName = "Button";
 export {
-  b as default
+  u as default
 };

package/components/checkbox.cjs

@@ -1 +1 @@
-"use strict";const i=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs"),a=require("../core.cjs"),s=["name","onInput","onChange","autoFocus","readOnly","value","defaultChecked"];function d(t,c){const o=a.ObjectUtils.buildProps(t,s,{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]),i.jsx(u,{tag:"input",ref:e,component:"checkbox",...o})}const f=n.forwardRef(d);module.exports=f;
+"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;

package/components/checkbox.mjs

@@ -1,15 +1,16 @@
 import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as c, useRef as i, useImperativeHandle as u, useEffect as m } from "react";
+import { forwardRef as c, useRef as i, useImperativeHandle as m, useEffect as u } from "react";
 import f from "../box.mjs";
 import { O as s } from "../core.mjs";
 const d = ["name", "onInput", "onChange", "autoFocus", "readOnly", "value", "defaultChecked"];
-function l(t, r) {
-  const o = s.buildProps(t, d, { type: "checkbox" }), n = Array.isArray(t.indeterminate) ? t.indeterminate[0] : t.indeterminate, e = i(null);
-  return u(r, () => e.current), m(() => {
+function l(t, o) {
+  const r = s.buildProps(t, d, { type: "checkbox" }), n = Array.isArray(t.indeterminate) ? t.indeterminate[0] : t.indeterminate, e = i(null);
+  return m(o, () => e.current), u(() => {
     e.current && (e.current.indeterminate = !!n);
-  }, [e, n]), /* @__PURE__ */ a(f, { tag: "input", ref: e, component: "checkbox", ...o });
+  }, [e, n]), /* @__PURE__ */ a(f, { tag: "input", ref: e, component: "checkbox", ...r });
 }
-const k = c(l);
+const p = c(l);
+p.displayName = "Checkbox";
 export {
-  k as default
+  p as default
 };

package/components/dataGrid.cjs

@@ -1 +1 @@
-"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;
+"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;