@guiexpert/demo-table-models 1.0.9 → 1.0.10

package/index.js

@@ -1,4 +1,4 @@
-function O(s) {
+function $(s) {
   return s && s.type === "TreeRow";
 }
 function be(s) {
@@ -76,14 +76,14 @@ class S {
   }
 }
 class Te {
-  render(e, r, a, t, n, m, d) {
+  render(e, r, a, t, n, m, i) {
     if (n.isEditable(r, a)) {
-      d.addClass(e, "ge-table-row-input-div");
-      const i = n.getValueAt(r, a);
+      i.addClass(e, "ge-table-row-input-div");
+      const d = n.getValueAt(r, a);
       e.innerHTML = `
             <input
                 type="text"
-                value="${i}"
+                value="${d}"
                 autofocus
                 onfocus="this.setSelectionRange(0, this.value.length)"
                 data-listen="change"
@@ -96,7 +96,7 @@ class Te {
     }
   }
 }
-class W {
+class q {
   constructor(e = "none", r = "single") {
     this.selectionType = e, this.selectionMode = r, this.ranges = [], this.negativeRanges = [], this.allSelected = !1;
   }
@@ -163,8 +163,8 @@ class oe {
     return [this.rowIndex, this.columnIndex];
   }
 }
-const he = new W(), Se = new oe("cell");
-class w {
+const he = new q(), Se = new oe("cell");
+class Z {
   constructor() {
     this.overflowX = "auto", this.overflowY = "auto", this.horizontalBorderVisible = !0, this.verticalBorderVisible = !0, this.footerSeparatorBorderVisible = !0, this.headerSeparatorBorderVisible = !0, this.fixedEastSeparatorBorderVisible = !0, this.fixedWestSeparatorBorderVisible = !0, this.tableTopBorderVisible = !0, this.tableBottomBorderVisible = !0, this.hoverRowVisible = !0, this.hoverColumnVisible = !0, this.columnsResizable = !0, this.columnsDraggable = !0, this.columnResizeHandleWidthInPx = 4, this.defaultRowHeights = {
       header: 34,
@@ -173,9 +173,9 @@ class w {
     }, this.footerVerticalSeparator = !1, this.headerToggleExpandCollapseIcons = !1, this.headerVerticalSeparator = !1, this.treeOptions = new Ne(), this.showCheckboxWihoutExtraColumn = !1, this.externalFilterFunction = void 0, this.sortedOptions = new fe(), this.sortOrder = ["asc", "desc"], this.getEditRenderer = (e, r) => new Te(), this.getSelectionModel = () => he, this.getFocusModel = () => Se;
   }
 }
-class J {
-  constructor(e, r = !0, a, t, n = 0, m = !1, d = !1) {
-    this.data = e, this.expanded = r, this.children = a, this.parent = t, this.deep = n, this.checked = m, this.keep = d, this.type = "TreeRow";
+class Q {
+  constructor(e, r = !0, a, t, n = 0, m = !1, i = !1) {
+    this.data = e, this.expanded = r, this.children = a, this.parent = t, this.deep = n, this.checked = m, this.keep = i, this.type = "TreeRow";
   }
 }
 class A {
@@ -185,16 +185,16 @@ class A {
       t.push(A.buildTreeRow(n, r, void 0, 0, a));
     return t;
   }
-  static buildTreeRow(e, r = "children", a = new J(e, !0, [], void 0, 0), t = 0, n = 12) {
-    var d;
+  static buildTreeRow(e, r = "children", a = new Q(e, !0, [], void 0, 0), t = 0, n = 12) {
+    var i;
     if (t > n)
       return console.warn("Max deep limit reached: ", t), a;
     const m = e[r];
     if (m)
-      for (const i of m) {
-        const p = new J(i, !0, [], a, t + 1);
-        if ((d = a.children) == null || d.push(p), A.buildTreeRow(
-          i,
+      for (const d of m) {
+        const p = new Q(d, !0, [], a, t + 1);
+        if ((i = a.children) == null || i.push(p), A.buildTreeRow(
+          d,
           r,
           p,
           t + 1
@@ -214,10 +214,10 @@ class u {
     this.value = e, this.unit = r;
   }
 }
-const f = () => !0, E = () => !1;
+const f = () => !0, U = () => !1;
 class y {
-  constructor(e, r, a = new u(100, "px"), t = new S(), n = new S(), m = new u(100, "px"), d = new u(100, "px"), i, p, l, c, b, P, z, x, g = () => this.visible) {
-    this.property = e, this.headerLabel = r, this.width = a, this.classes = t, this.rendererMap = n, this.minWidth = m, this.maxWidth = d, this.sortable = i, this.sortComparator = p, this.sortState = l, this.sortStatesOrder = c, this.sortIconVisible = b, this.editable = P, this.getEditRenderer = z, this.editInputPipe = x, this.isVisible = g, this.visible = !0;
+  constructor(e, r, a = new u(100, "px"), t = new S(), n = new S(), m = new u(100, "px"), i = new u(100, "px"), d, p, l, c, b, P, w, x, g = () => this.visible) {
+    this.property = e, this.headerLabel = r, this.width = a, this.classes = t, this.rendererMap = n, this.minWidth = m, this.maxWidth = i, this.sortable = d, this.sortComparator = p, this.sortState = l, this.sortStatesOrder = c, this.sortIconVisible = b, this.editable = P, this.getEditRenderer = w, this.editInputPipe = x, this.isVisible = g, this.visible = !0;
   }
   static bodyRenderer(e) {
     return new S(
@@ -235,7 +235,7 @@ class y {
       e.headerClasses,
       e.bodyClasses,
       e.footerClasses
-    ), t = e.sortIconVisible ?? e.sortable ?? E, n = e.editable ?? e.editable ?? E, m = e.isVisible ?? e.isVisible ?? f;
+    ), t = e.sortIconVisible ?? e.sortable ?? U, n = e.editable ?? e.editable ?? U, m = e.isVisible ?? e.isVisible ?? f;
     return new y(
       e.property ?? "",
       e.headerLabel ?? "",
@@ -256,8 +256,8 @@ class y {
     );
   }
 }
-const Ce = new u(300, "px"), Pe = new u(250, "px"), Le = new u(220, "px"), V = new u(200, "px"), Ge = new u(160, "px"), de = new u(150, "px"), ye = new u(140, "px"), Z = new u(120, "px"), G = new u(100, "px"), ze = new u(90, "px"), Ze = new u(80, "px"), we = new u(70, "px"), D = new u(60, "px"), xe = new u(50, "px");
-class j {
+const Ce = new u(300, "px"), Pe = new u(250, "px"), Le = new u(220, "px"), D = new u(200, "px"), Ge = new u(160, "px"), ye = new u(150, "px"), ue = new u(140, "px"), z = new u(120, "px"), G = new u(100, "px"), ze = new u(90, "px"), Ze = new u(80, "px"), we = new u(70, "px"), I = new u(60, "px"), xe = new u(50, "px");
+class X {
   constructor(e, r = [], a = -1) {
     this.areaIdent = e, this.columnDefs = r, this.defaultRowHeight = a, this.rowSelectionModel = void 0, this.yPositions = [], this.cellRenderers = r.map((t) => t.rendererMap[e]);
   }
@@ -317,8 +317,8 @@ class j {
     return this.columnDefs && r < this.columnDefs.length && this.columnDefs[r].editable ? this.columnDefs[r].editable() : !1;
   }
   setValue(e, r, a) {
-    var d;
-    const t = (d = this.columnDefs[r]) == null ? void 0 : d.editInputPipe;
+    var i;
+    const t = (i = this.columnDefs[r]) == null ? void 0 : i.editInputPipe;
     t && (a = t(a, e, r));
     const n = this.getRowByIndex(e), m = this.columnDefs[r].property;
     return m.includes(".") ? this.setPropertyValue(n, m.split("."), a) : (n[m] = a, !0);
@@ -348,7 +348,7 @@ class j {
       this.yPositions[r + 1] = this.getRowHeight(r) + this.yPositions[r];
   }
 }
-class o extends j {
+class o extends X {
   constructor(e, r, a, t = []) {
     super(e, t, a), this.areaIdent = e, this.arr = r, this.defaultRowHeight = a, this.columnDefs = t, this.filteredArr = [...r];
   }
@@ -456,7 +456,7 @@ class ke {
     return e.parent ? e.parent.expanded ? this.isVisible(e.parent) : !1 : !0;
   }
 }
-class ue {
+class pe {
   genericSortComparator(e, r, a) {
     if (typeof e == "number" && typeof r == "number")
       return a * (e - r);
@@ -474,9 +474,9 @@ class ue {
     return a * ("" + e).localeCompare("" + r);
   }
 }
-class Q extends j {
+class ee extends X {
   constructor(e, r, a, t = []) {
-    super(e, t, a), this.areaIdent = e, this.rows = r, this.defaultRowHeight = a, this.columnDefs = t, this.type = "AreaModelTree", this.sorterService = new ue(), this.service = new ke(), this.properties = t.map((n) => n.property), this.flattenRows = this.service.flattenTree(r), this.filteredFlattenRows = [...this.flattenRows];
+    super(e, t, a), this.areaIdent = e, this.rows = r, this.defaultRowHeight = a, this.columnDefs = t, this.type = "AreaModelTree", this.sorterService = new pe(), this.service = new ke(), this.properties = t.map((n) => n.property), this.flattenRows = this.service.flattenTree(r), this.filteredFlattenRows = [...this.flattenRows];
   }
   changeColumnOrder(e, r) {
     this.arrayMove(this.properties, e, r), super.changeColumnOrder(e, r);
@@ -533,8 +533,8 @@ class Q extends j {
     t && (a = t(a, e, r));
     const n = this.getRowByIndex(e);
     if (n) {
-      const d = n.data, i = this.columnDefs[r].property;
-      return i.includes(".") ? this.setPropertyValue(d, i.split("."), a) : (d[i] = a, !0);
+      const i = n.data, d = this.columnDefs[r].property;
+      return d.includes(".") ? this.setPropertyValue(i, d.split("."), a) : (i[d] = a, !0);
     }
     return !1;
   }
@@ -578,7 +578,7 @@ class Q extends j {
       t.children && this.treeSort(t.children, r, a);
   }
 }
-class ee {
+class re {
   constructor(e = []) {
     this.allRootNodes = e;
   }
@@ -638,7 +638,7 @@ class ee {
       a.checked && r.push(a), a.children && this.addSelectedRecursive(a.children, r);
   }
 }
-class re {
+class ae {
   constructor(e = 0, r = 0, a = 0, t = 0) {
     this.top = e, this.right = r, this.bottom = a, this.left = t;
   }
@@ -674,11 +674,11 @@ class ve {
     }
   }
 }
-class _ {
-  constructor(e, r, a, t = 0, n = 0, m = !1, d = new v(), i = [], p = [], l = -1, c = 0, b = 400, P = () => {
+class V {
+  constructor(e, r, a, t = 0, n = 0, m = !1, i = new v(), d = [], p = [], l = -1, c = 0, b = 400, P = () => {
   }) {
-    var z, x, g, B;
-    this.headerAreaModel = e, this.bodyAreaModel = r, this.footerAreaModel = a, this.fixedLeftColumnCount = t, this.fixedRightColumnCount = n, this.rowCheckboxVisible = m, this.defaultRowHeights = d, this.columnDefs = i, this.columnSizes = p, this.overridingColumnWidth = l, this.columnCount = c, this.parentSize = b, this.getSelectionModel = P, this.rowCount = 0, this.contentHeightInPx = 0, this.contentWidthInPx = 0, this.padding = new re(0, 0, 0, 0), this.xPositions = [], e.areaIdent = "header", r.areaIdent = "body", a.areaIdent = "footer", this.columnCount || ((z = this.columnDefs) != null && z.length ? this.columnCount = this.columnDefs.length : (x = this.columnSizes) != null && x.length && (this.columnCount = (g = this.columnSizes) == null ? void 0 : g.length)), (B = this.columnDefs) != null && B.length && be(this.columnDefs[0]) && !r.rowSelectionModel && (r.rowSelectionModel = new ve());
+    var w, x, g, O;
+    this.headerAreaModel = e, this.bodyAreaModel = r, this.footerAreaModel = a, this.fixedLeftColumnCount = t, this.fixedRightColumnCount = n, this.rowCheckboxVisible = m, this.defaultRowHeights = i, this.columnDefs = d, this.columnSizes = p, this.overridingColumnWidth = l, this.columnCount = c, this.parentSize = b, this.getSelectionModel = P, this.rowCount = 0, this.contentHeightInPx = 0, this.contentWidthInPx = 0, this.padding = new ae(0, 0, 0, 0), this.xPositions = [], e.areaIdent = "header", r.areaIdent = "body", a.areaIdent = "footer", this.columnCount || ((w = this.columnDefs) != null && w.length ? this.columnCount = this.columnDefs.length : (x = this.columnSizes) != null && x.length && (this.columnCount = (g = this.columnSizes) == null ? void 0 : g.length)), (O = this.columnDefs) != null && O.length && be(this.columnDefs[0]) && !r.rowSelectionModel && (r.rowSelectionModel = new ve());
   }
   init() {
     this.recalcSize(this.parentSize), this.overridingColumnWidth === -1 && this.calcXPositions(), this.headerAreaModel && this.headerAreaModel.init(), this.bodyAreaModel && this.bodyAreaModel.init(), this.footerAreaModel && this.footerAreaModel.init();
@@ -759,7 +759,7 @@ class _ {
    */
   recalcPadding() {
     const e = this.getSideAreaWidth("west"), r = this.getSideAreaWidth("east"), a = this.getAreaHeight("header"), t = this.getAreaHeight("footer");
-    this.padding = new re(
+    this.padding = new ae(
       a,
       r,
       t,
@@ -997,12 +997,12 @@ class _ {
       if (n.width.unit === "%" && e) {
         let m = Math.floor(n.width.value * e / 100);
         if (n.minWidth) {
-          let d = n.minWidth.unit === "px" ? n.minWidth.value : Math.floor(n.minWidth.value * e / 100);
-          m = Math.max(d, m);
+          let i = n.minWidth.unit === "px" ? n.minWidth.value : Math.floor(n.minWidth.value * e / 100);
+          m = Math.max(i, m);
         }
         if (n.maxWidth) {
-          let d = n.maxWidth.unit === "px" ? n.maxWidth.value : Math.floor(n.maxWidth.value * e / 100);
-          m = Math.min(d, m);
+          let i = n.maxWidth.unit === "px" ? n.maxWidth.value : Math.floor(n.maxWidth.value * e / 100);
+          m = Math.min(i, m);
         }
         return m;
       }
@@ -1023,9 +1023,9 @@ class _ {
       this.xPositions[r + 1] = this.getColumnWidth(r) + this.xPositions[r];
   }
 }
-class Re extends j {
+class Re extends X {
   constructor(e, r, a, t = []) {
-    super(e, t, a), this.areaIdent = e, this.rows = r, this.defaultRowHeight = a, this.columnDefs = t, this.sorterService = new ue(), this.filteredRows = [...r], this.properties = t.map((n) => n.property);
+    super(e, t, a), this.areaIdent = e, this.rows = r, this.defaultRowHeight = a, this.columnDefs = t, this.sorterService = new pe(), this.filteredRows = [...r], this.properties = t.map((n) => n.property);
   }
   getRowCount() {
     var e;
@@ -1034,7 +1034,7 @@ class Re extends j {
   getValueAt(e, r) {
     const a = this.properties[r];
     let t = this.filteredRows[e];
-    return O(t) && (t = t.data), t ? this.getValueByT(t, a) : "";
+    return $(t) && (t = t.data), t ? this.getValueByT(t, a) : "";
   }
   getFilteredRows() {
     return this.filteredRows;
@@ -1076,7 +1076,7 @@ class Re extends j {
     return t && r.length ? this.getPropertyValue(t, r) : t;
   }
 }
-class I extends Re {
+class B extends Re {
   constructor(e, r, a, t) {
     super(
       e,
@@ -1088,7 +1088,7 @@ class I extends Re {
 }
 class N {
   static createTableModel(e) {
-    var r, a, t, n, m, d, i, p, l, c, b, P, z, x;
+    var r, a, t, n, m, i, d, p, l, c, b, P, w, x;
     if (e.defaultRowHeights === void 0)
       if ((r = e.tableOptions) != null && r.defaultRowHeights)
         e.defaultRowHeights = e.tableOptions.defaultRowHeights;
@@ -1106,7 +1106,7 @@ class N {
           g > -1 && (e.defaultRowHeights.footer = g);
         }
       }
-    if (e.columnDefs === void 0 && ((a = e.properties) != null && a.length ? e.columnDefs = e.properties.map((g) => new y(g, g.toUpperCase(), V)) : (t = e.rows) != null && t.length ? e.columnDefs = Object.keys(e.rows[0]).map((g) => new y(g, g.toUpperCase(), V)) : e.columnDefs = []), e.columnCount === void 0 && ((n = e.columnDefs) != null && n.length ? e.columnCount = e.columnDefs.length : (m = e.headerData) != null && m.length ? e.columnCount = e.headerData[0].length : (d = e.columnSizes) != null && d.length ? e.columnCount = (i = e.columnSizes) == null ? void 0 : i.length : console.warn('Property "columnCount" is missing and cannot be derived from other properties.')), e.headerAreaModel || ((p = e.headerData) != null && p.length ? e.headerAreaModel = new o(
+    if (e.columnDefs === void 0 && ((a = e.properties) != null && a.length ? e.columnDefs = e.properties.map((g) => new y(g, g.toUpperCase(), D)) : (t = e.rows) != null && t.length ? e.columnDefs = Object.keys(e.rows[0]).map((g) => new y(g, g.toUpperCase(), D)) : e.columnDefs = []), e.columnCount === void 0 && ((n = e.columnDefs) != null && n.length ? e.columnCount = e.columnDefs.length : (m = e.headerData) != null && m.length ? e.columnCount = e.headerData[0].length : (i = e.columnSizes) != null && i.length ? e.columnCount = (d = e.columnSizes) == null ? void 0 : d.length : console.warn('Property "columnCount" is missing and cannot be derived from other properties.')), e.headerAreaModel || ((p = e.headerData) != null && p.length ? e.headerAreaModel = new o(
       "header",
       e.headerData,
       e.defaultRowHeights.header,
@@ -1123,16 +1123,16 @@ class N {
       e.columnDefs
     ) : e.footerAreaModel = new L("footer")), !e.bodyAreaModel)
       if (e.rows)
-        if ((b = e.rows) != null && b.length && O(e.rows[0])) {
+        if ((b = e.rows) != null && b.length && $(e.rows[0])) {
           const g = e.rows;
-          e.bodyAreaModel = new Q(
+          e.bodyAreaModel = new ee(
             "body",
             g,
             e.defaultRowHeights.body,
             e.columnDefs
-          ), (e.columnDefs[0].property === "CheckboxColumn" || (P = e.tableOptions) != null && P.showCheckboxWihoutExtraColumn) && (e.bodyAreaModel.rowSelectionModel = new ee(g));
+          ), (e.columnDefs[0].property === "CheckboxColumn" || (P = e.tableOptions) != null && P.showCheckboxWihoutExtraColumn) && (e.bodyAreaModel.rowSelectionModel = new re(g));
         } else
-          e.bodyAreaModel = new I(
+          e.bodyAreaModel = new B(
             "body",
             e.rows,
             e.columnDefs,
@@ -1144,7 +1144,7 @@ class N {
           e.bodyData,
           e.defaultRowHeights.body
         ) : e.bodyAreaModel = new L("body");
-    return e.fixedLeftColumnCount === void 0 && (e.fixedLeftColumnCount = 0), e.fixedRightColumnCount === void 0 && (e.fixedRightColumnCount = 0), e.rowCheckboxVisible === void 0 && (e.rowCheckboxVisible = !1), e.overridingColumnWidth === void 0 && (e.overridingColumnWidth = -1), !e.getSelectionModel && ((z = e.tableOptions) != null && z.getSelectionModel) && (e.getSelectionModel = (x = e.tableOptions) == null ? void 0 : x.getSelectionModel), new _(
+    return e.fixedLeftColumnCount === void 0 && (e.fixedLeftColumnCount = 0), e.fixedRightColumnCount === void 0 && (e.fixedRightColumnCount = 0), e.rowCheckboxVisible === void 0 && (e.rowCheckboxVisible = !1), e.overridingColumnWidth === void 0 && (e.overridingColumnWidth = -1), !e.getSelectionModel && ((w = e.tableOptions) != null && w.getSelectionModel) && (e.getSelectionModel = (x = e.tableOptions) == null ? void 0 : x.getSelectionModel), new V(
       e.headerAreaModel,
       e.bodyAreaModel,
       e.footerAreaModel,
@@ -1164,21 +1164,21 @@ class N {
     return N.buildByTypedRows(
       e.rows ?? [],
       e.columnDefs,
-      e.tableOptions ?? new w(),
+      e.tableOptions ?? new Z(),
       e.fixedLeftColumnCount ?? 0,
       e.fixedRightColumnCount ?? 0
     );
   }
-  static buildByTypedRows(e, r, a = new w(), t = 0, n = 0) {
-    const m = a.defaultRowHeights, d = r[0].property === "CheckboxColumn";
-    if (e != null && e.length && O(e[0])) {
-      const i = e, p = new Q(
+  static buildByTypedRows(e, r, a = new Z(), t = 0, n = 0) {
+    const m = a.defaultRowHeights, i = r[0].property === "CheckboxColumn";
+    if (e != null && e.length && $(e[0])) {
+      const d = e, p = new ee(
         "body",
-        i,
+        d,
         m.body,
         r
       );
-      return (d || a.showCheckboxWihoutExtraColumn) && (p.rowSelectionModel = new ee(i)), N.createByAreaModelsParam({
+      return (i || a.showCheckboxWihoutExtraColumn) && (p.rowSelectionModel = new re(d)), N.createByAreaModelsParam({
         headerAreaModel: new o("header", [r.map((l) => l.headerLabel)], m.header),
         bodyAreaModel: p,
         footerAreaModel: new o("footer", [], m.footer),
@@ -1214,16 +1214,16 @@ class N {
       e.columnSizes ?? []
     );
   }
-  static createByAreaModels(e = new L(), r, a = new L(), t = 0, n = 0, m = !1, d = new v(), i, p = [], l = -1, c) {
-    return new _(
+  static createByAreaModels(e = new L(), r, a = new L(), t = 0, n = 0, m = !1, i = new v(), d, p = [], l = -1, c) {
+    return new V(
       e,
       r,
       a,
       t,
       n,
       m,
-      d,
       i,
+      d,
       p,
       l,
       c
@@ -1244,29 +1244,29 @@ class N {
       e.columnCount ?? 0
     );
   }
-  static createByObjectArray(e, r = [], a = [], t = 0, n = 0, m = !1, d = new v(), i, p = []) {
+  static createByObjectArray(e, r = [], a = [], t = 0, n = 0, m = !1, i = new v(), d, p = []) {
     let l;
-    r != null && r.length ? l = new o("header", r, d.header, i) : i != null && i.length ? l = new o("header", [i.map((P) => P.headerLabel)], d.header, i) : l = new L();
-    const c = a ? new o("footer", a, d.footer, i) : new L(), b = new I("body", e, i, d.body);
-    return new _(
+    r != null && r.length ? l = new o("header", r, i.header, d) : d != null && d.length ? l = new o("header", [d.map((P) => P.headerLabel)], i.header, d) : l = new L();
+    const c = a ? new o("footer", a, i.footer, d) : new L(), b = new B("body", e, d, i.body);
+    return new V(
       l,
       b,
       c,
       t,
       n,
       m,
-      d,
       i,
+      d,
       p
     );
   }
 }
-class X {
+class H {
   constructor(e, r) {
     this.tableModel = e, this.tableOptions = r;
   }
 }
-class F {
+class W {
   constructor(e, r) {
     this.value = e, this.label = r;
   }
@@ -1387,8 +1387,8 @@ class De extends Ue {
       colCount:${t}
       rowSpan:${n}
       pc:${m}`.replace(/[ \n]+/g, " ")), this.children)
-      for (const d of this.children)
-        d.log(e);
+      for (const i of this.children)
+        i.log(e);
   }
 }
 class h {
@@ -1424,8 +1424,8 @@ class h {
   static buildGroupExts(e, r = [], a = 0, t) {
     let n;
     for (let m = 0; m < e.length; m++) {
-      const d = e[m], i = new De(d, a, m, t);
-      n && (i.leftNeighbour = n, n.rightNeighbour = i), r.push(i), d.children && (i.children = h.buildGroupExts(d.children, [], a + 1, i)), n = i;
+      const i = e[m], d = new De(i, a, m, t);
+      n && (d.leftNeighbour = n, n.rightNeighbour = d), r.push(d), i.children && (d.children = h.buildGroupExts(i.children, [], a + 1, d)), n = d;
     }
     return r;
   }
@@ -1447,15 +1447,15 @@ class h {
     for (const m of e) {
       if (m.rowIndex <= t) {
         a++;
-        for (let d = 0; d < r.length; d++)
-          r[d][a] = null;
+        for (let i = 0; i < r.length; i++)
+          r[i][a] = null;
       }
       if (r[m.rowIndex][a] = m, t = m.rowIndex, m.ownColumn() && ((n = m.children) != null && n.length)) {
-        for (let d = m.rowIndex + 1; d < r.length; d++)
-          r[d][a] = void 0;
+        for (let i = m.rowIndex + 1; i < r.length; i++)
+          r[i][a] = void 0;
         a++;
-        for (let d = 0; d < r.length; d++)
-          r[d][a] = null;
+        for (let i = 0; i < r.length; i++)
+          r[i][a] = null;
       }
     }
     return r;
@@ -1466,7 +1466,7 @@ class h {
       e.push(t.data + "    rowIndex:" + t.rowIndex), (a = t.children) != null && a.length && h.iterateThrowColumns(e, t.children);
   }
 }
-class pe {
+class K {
   constructor() {
     this.areaIdent = "body", this.rowSelectionModel = void 0;
   }
@@ -1533,16 +1533,16 @@ class pe {
     return !1;
   }
 }
-class Ie {
-  render(e, r, a, t, n, m, d) {
-    const i = m != null && m.data ? m.data : "";
-    e.innerHTML = `${i}`;
+class Me {
+  render(e, r, a, t, n, m, i) {
+    const d = m != null && m.data ? m.data : "";
+    e.innerHTML = `${d}`;
   }
 }
-class Me {
+class Ie {
   constructor(e = "header", r, a = [], t) {
     var n;
-    this.areaIdent = e, this.groups = r, this.columnDefs = a, this.defaultRowHeight = t, this.gammaCells = !0, this.groupExts = [], this.cellGroupExtCellRenderer = new Ie(), this.groupExts = h.buildGroupExts(r), console.info(this.groupExts), console.info(this.getAllLeafs()), console.info(this.getMaxRowCount());
+    this.areaIdent = e, this.groups = r, this.columnDefs = a, this.defaultRowHeight = t, this.gammaCells = !0, this.groupExts = [], this.cellGroupExtCellRenderer = new Me(), this.groupExts = h.buildGroupExts(r), console.info(this.groupExts), console.info(this.getAllLeafs()), console.info(this.getMaxRowCount());
     for (const m of this.groupExts)
       m.log(this.getMaxRowCount());
     this.arr = this.buildArray(), !((n = this.columnDefs) != null && n.length) && e === "header" && (this.columnDefs = h.buildColumnDefs(r)), console.info("this.columnDefs", this.columnDefs), console.info("this.arr", this.arr);
@@ -1557,11 +1557,11 @@ class Me {
   buildArray() {
     console.info("");
     let e = h.flattenGroupExts(this.groupExts);
-    const r = e.length, a = 1 + Math.max(...e.map((d) => d.rowIndex));
+    const r = e.length, a = 1 + Math.max(...e.map((i) => i.rowIndex));
     console.info("max  row/col:", a + "/" + r);
     const t = [];
     h.iterateThrowColumns(t, this.groupExts), console.info(t);
-    const n = Array.from(Array(a).keys()).map((d) => []);
+    const n = Array.from(Array(a).keys()).map((i) => []);
     let m = h.buildArrayOfArrays(e, n);
     return console.table(m), m;
   }
@@ -1646,11 +1646,11 @@ class _e {
   constructor(e, r = !0, a = !1) {
     this.property = e, this.skipCheckableCheck = r, this.readonly = a;
   }
-  render(e, r, a, t, n, m, d) {
+  render(e, r, a, t, n, m, i) {
     if (this.readonly || this.skipCheckableCheck || n.isRowCheckable(r)) {
-      d.addClass(e, "ge-table-row-checkbox-div");
-      const i = n.getRowByIndex(r), l = n.getValueByT(i, this.property) === !0 ? "checked" : "", c = this.readonly ? " readonly " : "";
-      if (d.addClass(e, "ge-padding-property-checkbox"), e.innerHTML = `
+      i.addClass(e, "ge-table-row-checkbox-div");
+      const d = n.getRowByIndex(r), l = n.getValueByT(d, this.property) === !0 ? "checked" : "", c = this.readonly ? " readonly " : "";
+      if (i.addClass(e, "ge-padding-property-checkbox"), e.innerHTML = `
         <input
           type="checkbox"
           data-area="${t}"
@@ -1662,12 +1662,12 @@ class _e {
           ${c}
           class="ge-input-checkbox">`, !this.readonly) {
         const b = e.querySelector(".ge-input-checkbox");
-        b && b.addEventListener("click", (P, z) => (i[this.property] = !i[this.property], !0));
+        b && b.addEventListener("click", (P, w) => (d[this.property] = !d[this.property], !0));
       }
     }
   }
 }
-class K {
+class Y {
   constructor() {
     this.formatter = new Intl.DateTimeFormat("de-DE", {
       year: "numeric",
@@ -1675,51 +1675,81 @@ class K {
       day: "2-digit"
     });
   }
-  render(e, r, a, t, n, m, d) {
+  render(e, r, a, t, n, m, i) {
     if (m) {
-      let i = "";
+      let d = "";
       try {
-        i = this.formatter.format(new Date(m));
+        d = this.formatter.format(new Date(m));
       } catch {
-        i = m;
+        d = m;
       }
       e.innerHTML = `
           <div class="ge-table-label-div" data-row-index="${r}" data-col-index="${a}" data-area="${t}" style="position: relative; background: transparent; width: 100%; height: 100%;">
-            <div class="ge-table-label" data-row-index="${r}" data-col-index="${a}" data-area="${t}">${i}</div>
+            <div class="ge-table-label" data-row-index="${r}" data-col-index="${a}" data-area="${t}">${d}</div>
           </div>`;
     }
   }
 }
 class le {
-  render(e, r, a, t, n, m, d) {
+  render(e, r, a, t, n, m, i) {
     m === "male" || m === "m" ? e.innerText = "♂" : (m === "female" || m === "f") && (e.innerText = "♀");
   }
 }
 class qe {
-  render(e, r, a, t, n, m, d) {
-    m === "true" || m === !0 ? e.innerHTML = '<span class="ge-true-text-color">✅</span>' : m === "false" || m === !1 ? e.innerHTML = '<span class="ge-false-text-color">❌</span>' : e.innerText = "";
+  constructor(e = 100, r = !1) {
+    this.maxValue = e, this.labelVisible = r;
+  }
+  render(e, r, a, t, n, m, i) {
+    if (i.addClass(e, "ge-progressbar-div"), !isNaN(m)) {
+      const p = Number(m) * 100 / this.maxValue, l = this.labelVisible ? Math.round(p) + "%" : "";
+      e.innerHTML = `
+        <div class="ge-table-label-div"
+          data-row-index="${r}"
+          data-col-index="${a}"
+          data-area="${t}"
+          title="${l}"
+          style="position: relative; background: transparent; width: 100%; height: 100%;">
+              <div class="ge-table-progress-container"
+                  style="width:100%;height:50%;padding:0;margin-top:6px;"
+                  data-row-index="${r}"
+                  data-col-index="${a}"
+                  data-area="${t}">
+                  <div class="ge-table-progress-bar"
+                      style="width:${p}%;height:100%;padding:0;margin:0;"
+                      data-row-index="${r}"
+                      data-col-index="${a}"
+                      data-area="${t}">&nbsp;
+                  </div>
+              </div>
+          </div>`;
+    }
   }
 }
 class He {
-  render(e, r, a, t, n, m, d) {
-    m && (e.innerText = new Date(m).toISOString().replace(/T/g, " ").replace(/\..*/g, ""));
+  render(e, r, a, t, n, m, i) {
+    m === "true" || m === !0 ? e.innerHTML = '<span class="ge-true-text-color">✅</span>' : m === "false" || m === !1 ? e.innerHTML = '<span class="ge-false-text-color">❌</span>' : e.innerText = "";
   }
 }
 class Oe {
+  render(e, r, a, t, n, m, i) {
+    m && (e.innerText = new Date(m).toISOString().replace(/T/g, " ").replace(/\..*/g, ""));
+  }
+}
+class Ve {
   constructor(e = Number.MIN_SAFE_INTEGER, r = Number.MAX_SAFE_INTEGER) {
     this.min = e, this.max = r;
   }
-  render(e, r, a, t, n, m, d) {
-    m && (e.innerText = m, (typeof m == "string" || isNaN(m) || m < this.min || m > this.max) && d.addClass(e, "ge-cell-error"));
+  render(e, r, a, t, n, m, i) {
+    m && (e.innerText = m, (typeof m == "string" || isNaN(m) || m < this.min || m > this.max) && i.addClass(e, "ge-cell-error"));
   }
 }
 class Ee {
   constructor(e) {
     this.property = e;
   }
-  render(e, r, a, t, n, m, d) {
-    d.addClass(e, "ge-star-rating-div");
-    const i = n.getRowByIndex(r), p = +("" + n.getValueByT(i, this.property));
+  render(e, r, a, t, n, m, i) {
+    i.addClass(e, "ge-star-rating-div");
+    const d = n.getRowByIndex(r), p = +("" + n.getValueByT(d, this.property));
     if (!isNaN(p)) {
       const l = [];
       for (let b = 0; b < p; b++)
@@ -1732,13 +1762,13 @@ class Ee {
     }
   }
 }
-class Ve {
+class Fe {
   constructor(e, r = 100, a = !1) {
     this.property = e, this.maxValue = r, this.labelVisible = a;
   }
-  render(e, r, a, t, n, m, d) {
-    d.addClass(e, "ge-star-rating-div");
-    const i = n.getRowByIndex(r), p = +("" + n.getValueByT(i, this.property));
+  render(e, r, a, t, n, m, i) {
+    i.addClass(e, "ge-star-rating-div");
+    const d = n.getRowByIndex(r), p = +("" + n.getValueByT(d, this.property));
     if (!isNaN(p)) {
       const l = p * 100 / this.maxValue, c = this.labelVisible ? Math.round(l) + "%" : "";
       e.innerHTML = `
@@ -1764,32 +1794,32 @@ class Ve {
     }
   }
 }
-const Fe = function(s, e, r) {
+const $e = function(s, e, r) {
   return s ? Number(s) : "";
 };
-class Y {
+class J {
   constructor(e) {
     this.options = e;
   }
   static create(e) {
-    return new Y(
-      e.map((r) => new F(r, r))
+    return new J(
+      e.map((r) => new W(r, r))
     );
   }
-  render(e, r, a, t, n, m, d) {
+  render(e, r, a, t, n, m, i) {
     if (n.isEditable(r, a)) {
-      d.addClass(e, "ge-table-row-select-div");
-      const i = n.getValueAt(r, a);
+      i.addClass(e, "ge-table-row-select-div");
+      const d = n.getValueAt(r, a);
       let p = [];
       for (let c of this.options) {
-        const b = c.value === i ? " selected " : "";
+        const b = c.value === d ? " selected " : "";
         p.push(`<option value="${c.value}" ${b}>${c.label}</option>`);
       }
       const l = p.join("");
       e.innerHTML = `
             <select
                 type="text"
-                value="${i}"
+                value="${d}"
                 autofocus
                 data-listen="change"
                 data-area="${t}"
@@ -1801,12 +1831,12 @@ class Y {
     }
   }
 }
-class q {
+class E {
   constructor(e, r, a) {
     this.r = e, this.g = r, this.b = a;
   }
 }
-class ae {
+class te {
   constructor(e, r, a, t) {
     this.minValue = e, this.minColor = r, this.maxValue = a, this.maxColor = t;
   }
@@ -1816,59 +1846,59 @@ class R {
     return (e - r) / (a - r) * (n - t) + t;
   }
   static getTwoColorGradientRGB(e, r) {
-    const a = R.normalize(e, r.minValue, r.maxValue, 0, 1), t = r.maxColor.r - r.minColor.r, n = r.maxColor.g - r.minColor.g, m = r.maxColor.b - r.minColor.b, d = t * a + r.minColor.r, i = n * a + r.minColor.g, p = m * a + r.minColor.b;
-    return `rgb(${Math.round(d)}, ${Math.round(i)}, ${Math.round(p)})`;
+    const a = R.normalize(e, r.minValue, r.maxValue, 0, 1), t = r.maxColor.r - r.minColor.r, n = r.maxColor.g - r.minColor.g, m = r.maxColor.b - r.minColor.b, i = t * a + r.minColor.r, d = n * a + r.minColor.g, p = m * a + r.minColor.b;
+    return `rgb(${Math.round(i)}, ${Math.round(d)}, ${Math.round(p)})`;
   }
   static getThreeColorGradientRGB(e, r) {
-    return e < r.middleValue ? R.getTwoColorGradientRGB(e, new ae(r.minValue, r.minColor, r.middleValue, r.middleColor)) : e > r.middleValue ? R.getTwoColorGradientRGB(e, new ae(r.middleValue, r.middleColor, r.maxValue, r.maxColor)) : `rgb(${r.middleColor.r}, ${r.middleColor.g}, ${r.middleColor.b})`;
+    return e < r.middleValue ? R.getTwoColorGradientRGB(e, new te(r.minValue, r.minColor, r.middleValue, r.middleColor)) : e > r.middleValue ? R.getTwoColorGradientRGB(e, new te(r.middleValue, r.middleColor, r.maxValue, r.maxColor)) : `rgb(${r.middleColor.r}, ${r.middleColor.g}, ${r.middleColor.b})`;
   }
 }
-class $e {
+class We {
   constructor(e, r, a, t, n, m) {
     this.minValue = e, this.minColor = r, this.middleValue = a, this.middleColor = t, this.maxValue = n, this.maxColor = m;
   }
 }
-class We {
-  render(e, r, a, t, n, m, d) {
+class je {
+  render(e, r, a, t, n, m, i) {
     if (m) {
-      const i = Number(m);
-      i < 0 ? (e.innerHTML = "▾ " + i.toFixed(2) + "%", d.addClass(e, "ge-positive-text-color")) : (e.innerHTML = "▴ " + i.toFixed(2) + "%", d.addClass(e, "ge-negative-text-color"));
+      const d = Number(m);
+      d < 0 ? (e.innerHTML = "▾ " + d.toFixed(2) + "%", i.addClass(e, "ge-positive-text-color")) : (e.innerHTML = "▴ " + d.toFixed(2) + "%", i.addClass(e, "ge-negative-text-color"));
     }
   }
 }
-class je {
+class Xe {
   constructor() {
     this.formatter = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
   }
-  render(e, r, a, t, n, m, d) {
+  render(e, r, a, t, n, m, i) {
     if (m) {
-      const i = Number(m);
-      e.innerText = this.formatter.format(i);
+      const d = Number(m);
+      e.innerText = this.formatter.format(d);
     }
   }
 }
-class Xe {
-  render(e, r, a, t, n, m, d) {
-    const i = n.getRowByIndex(r);
-    if (i) {
-      const p = i.name ?? i.symbol;
+class Ke {
+  render(e, r, a, t, n, m, i) {
+    const d = n.getRowByIndex(r);
+    if (d) {
+      const p = d.name ?? d.symbol;
       e.innerHTML = `
       <div style="line-height: 1.2;padding: 10px 0 0 10px;">
         ${p}<br>
-        ${i.symbol}
+        ${d.symbol}
       </div>
       `;
     }
   }
 }
-class Ke {
+class Ye {
   constructor() {
     this.formatterUsd = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }), this.formatter = new Intl.NumberFormat("en-US");
   }
-  render(e, r, a, t, n, m, d) {
-    const i = n.getRowByIndex(r);
-    if (i) {
-      const p = this.formatterUsd.format(i.volUsd), l = this.formatter.format(i.volBtc);
+  render(e, r, a, t, n, m, i) {
+    const d = n.getRowByIndex(r);
+    if (d) {
+      const p = this.formatterUsd.format(d.volUsd), l = this.formatter.format(d.volBtc);
       e.innerHTML = `
       <div style="line-height: 1.2;padding: 10px 0 0 10px;">
         ${p}<br>
@@ -1878,16 +1908,16 @@ class Ke {
     }
   }
 }
-class Ye {
+class Je {
   constructor(e = 120) {
     this.maxWidth = e, this.formatter = new Intl.NumberFormat("en-US");
   }
-  render(e, r, a, t, n, m, d) {
-    const i = n.getRowByIndex(r);
-    if (i) {
-      const p = this.formatter.format(i.circulatingSupply), l = i.maxSupply, c = [];
+  render(e, r, a, t, n, m, i) {
+    const d = n.getRowByIndex(r);
+    if (d) {
+      const p = this.formatter.format(d.circulatingSupply), l = d.maxSupply, c = [];
       if (c.push('<div style="line-height: 1.2;padding: 10px 0 0 10px;">'), c.push(p), c.push("<br>"), l) {
-        const b = this.maxWidth * i.circulatingSupply / l;
+        const b = this.maxWidth * d.circulatingSupply / l;
         c.push(`
           <div style="width: ${this.maxWidth}px;height: 5px;background-color: #eee;margin:10px 0 0 10px">
             <div style="width: ${b}px;height: 5px;background-color: #ccc;"></div>
@@ -1898,13 +1928,13 @@ class Ye {
     }
   }
 }
-class Je {
-  render(e, r, a, t, n, m, d) {
-    const i = n.getRowByIndex(r);
-    i != null && i.id && (e.innerHTML = `<img src="https://s2.coinmarketcap.com/static/img/coins/64x64/${i.id}.png" style="width:30px;height: 30px;margin: 10px 10px 0 20px;">`);
+class Qe {
+  render(e, r, a, t, n, m, i) {
+    const d = n.getRowByIndex(r);
+    d != null && d.id && (e.innerHTML = `<img src="https://s2.coinmarketcap.com/static/img/coins/64x64/${d.id}.png" style="width:30px;height: 30px;margin: 10px 10px 0 20px;">`);
   }
 }
-const Qe = [
+const er = [
   {
     id: 1,
     name: "Bitcoin",
@@ -4639,19 +4669,19 @@ const Qe = [
     change90d: 12.43943602
   }
 ];
-function zr() {
-  const s = Qe, e = new We(), r = new je(), a = new Xe(), t = new Ke(), n = new Ye(120), m = new Je(), d = [
+function kr() {
+  const s = er, e = new je(), r = new Xe(), a = new Ke(), t = new Ye(), n = new Je(120), m = new Qe(), i = [
     y.create({
       property: "symbol",
       headerLabel: "",
-      width: D,
+      width: I,
       bodyClasses: ["ge-table-text-align-left"],
       bodyRenderer: m
     }),
     y.create({
       property: "symbol",
       headerLabel: "Name",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       bodyRenderer: a
@@ -4676,7 +4706,7 @@ function zr() {
     }),
     y.create({
       headerLabel: "Volumne (24h)",
-      width: V,
+      width: D,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       bodyRenderer: t
@@ -4684,15 +4714,15 @@ function zr() {
     y.create({
       property: "circulatingSupply",
       headerLabel: "Circulating Supply",
-      width: ye,
+      width: ue,
       bodyRenderer: n,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     })
   ];
-  d.forEach((p) => p.sortable = () => !0);
-  const i = {
-    ...new w(),
+  i.forEach((p) => p.sortable = () => !0);
+  const d = {
+    ...new Z(),
     hoverColumnVisible: !1,
     verticalBorderVisible: !1,
     defaultRowHeights: {
@@ -4701,16 +4731,16 @@ function zr() {
       footer: 0
     }
   };
-  return new X(
+  return new H(
     N.createTableModel({
       rows: s,
-      columnDefs: d,
-      tableOptions: i
+      columnDefs: i,
+      tableOptions: d
     }),
-    i
+    d
   );
 }
-function Zr(s = 1e3, e = 1e3) {
+function vr(s = 1e3, e = 1e3) {
   const r = Array.from(Array(s).keys()).map(
     (n) => Array.from(Array(e).keys()).map((m) => `${n}/${m}`)
   ), a = Array.from(Array(2).keys()).map(
@@ -4727,7 +4757,7 @@ function Zr(s = 1e3, e = 1e3) {
     fixedRightColumnCount: 2
   });
 }
-const er = [
+const rr = [
   {
     id: 0,
     preName: "Prename0",
@@ -166601,9 +166631,9 @@ const er = [
     friends: []
   }
 ];
-function wr() {
+function Rr() {
   const s = {
-    ...new w(),
+    ...new Z(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -166616,14 +166646,14 @@ function wr() {
     // new CheckboxColumn(), //  <--- not needed, because we have 'showCheckboxWihoutExtraColumn:true'
     new y("lastName", "Last Name", new u(250, "px")),
     new y("preName", "Pre Name", new u(120, "px")),
-    new y("birth", "Birthday", new u(100, "px"), new S(), new S(void 0, new K(), void 0), void 0, void 0),
+    new y("birth", "Birthday", new u(100, "px"), new S(), new S(void 0, new Y(), void 0), void 0, void 0),
     new y("gender", " ", new u(50, "px"), new S(), new S(void 0, new le(), void 0), void 0, void 0),
     new y("address.street", "Strasse", new u(150, "px")),
     new y("address.number", "Nr", new u(70, "px")),
     new y("address.zip", "Zip", new u(60, "px")),
     new y("address.city", "City", new u(120, "px")),
     new y("id", "ID", new u(60, "px"))
-  ], r = A.buildTreeRows(er, "friends");
+  ], r = A.buildTreeRows(rr, "friends");
   return N.createTableModel({
     rows: r,
     columnDefs: e,
@@ -166632,7 +166662,7 @@ function wr() {
     fixedRightColumnCount: 0
   });
 }
-const te = new v(34, 50, 0), ne = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "), rr = `2009 27.9 36.7 42.4 54.5 62.5 67.5 72.7 75.7 66.3 55.0 51.2 35.9
+const ne = new v(34, 50, 0), me = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "), ar = `2009 27.9 36.7 42.4 54.5 62.5 67.5 72.7 75.7 66.3 55.0 51.2 35.9
 2010 32.5 33.1 48.2 57.9 65.3 74.7 81.3 77.4 71.1 58.1 47.9 32.8
 2011 29.7 36.0 42.3 54.3 64.5 72.3 80.2 75.3 70.0 57.1 51.9 43.3
 2012 37.3 40.9 50.9 54.8 65.1 71.0 78.8 76.7 68.8 58.0 43.9 41.5
@@ -166643,27 +166673,27 @@ const te = new v(34, 50, 0), ne = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov
 2017 38.0 41.6 39.2 57.2 61.1 72.0 76.8 74.0 70.5 64.1 46.6 33.4`.split(`
 `).map(
   (s) => s.split(" ").map((e) => Number(e))
-), ar = 27.9, tr = 77.4;
-class me {
+), tr = 27.9, nr = 77.4;
+class se {
   constructor(e, r, a) {
     this.r = e, this.g = r, this.b = a;
   }
 }
-function nr(s, e, r, a, t) {
+function mr(s, e, r, a, t) {
   return (s - e) / (r - e) * (t - a) + a;
 }
-function mr(s, e, r) {
-  var a = new me(255, 0, 0), t = new me(0, 0, 255), n = nr(r, s, e, 0, 1), m = t.r - a.r, d = t.g - a.g, i = t.b - a.b;
-  return m = m * n + a.r, d = d * n + a.g, i = i * n + a.b, `rgb(${Math.round(m)}, ${Math.round(d)}, ${Math.round(i)})`;
+function sr(s, e, r) {
+  var a = new se(255, 0, 0), t = new se(0, 0, 255), n = mr(r, s, e, 0, 1), m = t.r - a.r, i = t.g - a.g, d = t.b - a.b;
+  return m = m * n + a.r, i = i * n + a.g, d = d * n + a.b, `rgb(${Math.round(m)}, ${Math.round(i)}, ${Math.round(d)})`;
 }
-function xr() {
-  const s = new o("body", rr, te.body), e = new Array(ne.length).fill(50), r = new o("header", [ne], te.header);
+function Ar() {
+  const s = new o("body", ar, ne.body), e = new Array(me.length).fill(50), r = new o("header", [me], ne.header);
   return s.getCustomStyleAt = (a, t) => {
     let n = {};
     if (t > 0) {
       const m = s.getValueAt(a, t);
       n = {
-        background: mr(ar, tr, m),
+        background: sr(tr, nr, m),
         color: "#fff"
       };
     }
@@ -166674,7 +166704,7 @@ function xr() {
     columnSizes: e
   });
 }
-function sr() {
+function ir() {
   return [
     {
       date: "2010-01-01T01:00:00",
@@ -219232,12 +219262,12 @@ function sr() {
     }
   ];
 }
-const ce = 30, ir = 3, ge = sr(), C = {};
+const ce = 30, dr = 3, ge = ir(), C = {};
 ge.forEach((s) => {
   const [e, r] = s.date.split("T");
   C[e] || (C[e] = {}), C[e][r.substring(0, 5)] = s;
 });
-const $ = Object.keys(C), U = [
+const j = Object.keys(C), M = [
   "06:00",
   "07:00",
   "08:00",
@@ -219263,15 +219293,15 @@ const $ = Object.keys(C), U = [
   "04:00",
   "05:00"
 ];
-function dr() {
+function yr() {
   let s = 10, e = 0;
   return ge.forEach((r) => {
     s = Math.min(s, r.temperature), e = Math.max(e, r.temperature);
   }), [s, e];
 }
-const [se, ie] = dr();
-function kr() {
-  const s = new yr(), e = new ur(), r = [60, ...new Array($.length).fill(ir)];
+const [ie, de] = yr();
+function Ur() {
+  const s = new ur(), e = new pr(), r = [60, ...new Array(j.length).fill(dr)];
   return N.createTableModel({
     bodyAreaModel: s,
     footerAreaModel: e,
@@ -219279,31 +219309,31 @@ function kr() {
     fixedLeftColumnCount: 1
   });
 }
-class yr extends pe {
+class ur extends K {
   getRowCount() {
-    return U.length;
+    return M.length;
   }
   getRowHeight(e) {
     return ce;
   }
   getValueAt(e, r) {
-    return r === 0 ? U[e] : "";
+    return r === 0 ? M[e] : "";
   }
   getTooltipAt(e, r) {
     if (r === 0)
       return "";
     r--;
-    const a = $[r], t = U[e];
+    const a = j[r], t = M[e];
     return C[a] && C[a][t] ? `${a} ${t} → ${C[a][t].temperature}` : "";
   }
   getCustomStyleAt(e, r) {
     if (r === 0)
       return;
     r--;
-    const a = $[r], t = U[e];
+    const a = j[r], t = M[e];
     if (!C[a] || !C[a][t])
       return;
-    const n = C[a][t].temperature, m = new q(67, 1, 84), d = new q(31, 144, 141), i = new q(250, 230, 37), p = (ie + se) / 2, l = new $e(se, m, p, d, ie, i);
+    const n = C[a][t].temperature, m = new E(67, 1, 84), i = new E(31, 144, 141), d = new E(250, 230, 37), p = (de + ie) / 2, l = new We(ie, m, p, i, de, d);
     return {
       background: R.getThreeColorGradientRGB(n, l),
       color: "transparent"
@@ -219311,7 +219341,7 @@ class yr extends pe {
     };
   }
 }
-class ur extends pe {
+class pr extends K {
   getRowCount() {
     return 1;
   }
@@ -219333,7 +219363,7 @@ class ur extends pe {
     };
   }
 }
-const H = [
+const F = [
   {
     data: "Gold",
     toggle: !0,
@@ -219420,9 +219450,9 @@ const H = [
     ]
   }
 ];
-function vr() {
-  const e = h.buildGroupExts(H), r = h.buildColumnDefs(e), a = new Me("header", H, r, 34);
-  console.info("headerGroups", H), console.info("columnDefs", r.map((m) => m.property));
+function Dr() {
+  const e = h.buildGroupExts(F), r = h.buildColumnDefs(e), a = new Ie("header", F, r, 34);
+  console.info("headerGroups", F), console.info("columnDefs", r.map((m) => m.property));
   const t = [
     {
       GOLD: 146,
@@ -219440,14 +219470,14 @@ function vr() {
       HOH_C: 53,
       HOH_D: 54
     }
-  ], n = new I("body", t, r, 34);
+  ], n = new B("body", t, r, 34);
   return N.createTableModel({
     headerAreaModel: a,
     bodyAreaModel: n,
     columnDefs: r
   });
 }
-function pr() {
+function lr() {
   return [
     {
       id: 1,
@@ -219627,9 +219657,9 @@ function pr() {
     }
   ];
 }
-function lr() {
+function cr() {
   return [
-    new y("firstName", "First Name", Z),
+    new y("firstName", "First Name", z),
     new y("lastName", "Last Name"),
     y.create({
       property: "gender",
@@ -219643,7 +219673,7 @@ function lr() {
       width: Ce,
       bodyClasses: ["ge-table-text-align-left"]
     }),
-    new y("ipAddress", "IP", de),
+    new y("ipAddress", "IP", ye),
     y.create({
       property: "id",
       headerLabel: "ID",
@@ -219653,9 +219683,9 @@ function lr() {
     })
   ];
 }
-function cr() {
+function gr() {
   return {
-    ...new w(),
+    ...new Z(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 40,
@@ -219664,8 +219694,8 @@ function cr() {
     }
   };
 }
-function Rr() {
-  const s = cr(), e = pr(), r = lr();
+function Mr() {
+  const s = gr(), e = lr(), r = cr();
   return N.createTableModel({
     rows: e,
     columnDefs: r,
@@ -219673,10 +219703,10 @@ function Rr() {
     fixedLeftColumnCount: 0
   });
 }
-function Ar(s, e) {
+function Ir(s, e) {
   s.rendererMap = new S(void 0, e, void 0);
 }
-const gr = [
+const br = [
   {
     id: 1,
     city: "London",
@@ -219824,7 +219854,7 @@ const gr = [
     team: { name: "Team TCC", active: !0 },
     data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
   }
-].map((s) => (s.updatedAt = /* @__PURE__ */ new Date(), s)), M = [
+].map((s) => (s.updatedAt = /* @__PURE__ */ new Date(), s)), _ = [
   new y("city", "City", new u(90, "px")),
   new y("location", "Location", new u(100, "px")),
   new y("team.name", "Team", new u(100, "px")),
@@ -219832,7 +219862,7 @@ const gr = [
     property: "team.active",
     headerLabel: "Active",
     width: new u(60, "px"),
-    bodyRenderer: new qe()
+    bodyRenderer: new He()
   }),
   new y("data.0", "00", new u(60, "px")),
   new y("data.1", "15", new u(60, "px")),
@@ -219850,10 +219880,10 @@ const gr = [
     property: "updatedAt",
     headerLabel: "Updated at",
     width: new u(175, "px"),
-    bodyRenderer: new He()
+    bodyRenderer: new Oe()
   })
-], Ur = M.length - 1, br = {
-  ...new w(),
+], Br = _.length - 1, Nr = {
+  ...new Z(),
   hoverRowVisible: !1,
   hoverColumnVisible: !1,
   defaultRowHeights: {
@@ -219864,22 +219894,22 @@ const gr = [
   columnsDraggable: !1,
   columnsResizable: !0
 };
-function Dr() {
-  const s = br.defaultRowHeights;
+function _r() {
+  const s = Nr.defaultRowHeights;
   return N.createTableModel({
-    headerAreaModel: new fr(s.header),
-    bodyAreaModel: new Nr(s.body),
-    footerAreaModel: new Tr(s.footer),
-    columnDefs: M,
+    headerAreaModel: new Tr(s.header),
+    bodyAreaModel: new fr(s.body),
+    footerAreaModel: new or(s.footer),
+    columnDefs: _,
     fixedLeftColumnCount: 2,
     fixedRightColumnCount: 1,
     defaultRowHeights: s,
-    columnCount: M.length
+    columnCount: _.length
   });
 }
-class Nr extends I {
+class fr extends B {
   constructor(e) {
-    super("body", gr, M, e);
+    super("body", br, _, e);
   }
   getRowspanAt(e, r) {
     if (r === 0 || r == 1) {
@@ -219896,7 +219926,7 @@ class Nr extends I {
     return t;
   }
 }
-class fr extends o {
+class Tr extends o {
   constructor(e) {
     super(
       "header",
@@ -219923,7 +219953,7 @@ class fr extends o {
     return ["ge-font-weight-bold"];
   }
 }
-class Tr extends o {
+class or extends o {
   constructor(e) {
     super(
       "footer",
@@ -219938,7 +219968,7 @@ class Tr extends o {
     return r === 2 ? ["ge-text-align-right", "ge-font-weight-bold"] : [];
   }
 }
-const or = [
+const hr = [
   {
     id: "c8-34f1d5",
     company: "Equicom",
@@ -221876,15 +221906,15 @@ const or = [
     rating: 5
   }
 ];
-function hr() {
-  return or;
-}
 function Sr() {
+  return hr;
+}
+function Cr() {
   return [
     y.create({
       property: "company",
       headerLabel: "Company",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       sortable: f
@@ -221892,7 +221922,7 @@ function Sr() {
     y.create({
       property: "country",
       headerLabel: "Country",
-      width: ye,
+      width: ue,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       sortable: f
@@ -221900,7 +221930,7 @@ function Sr() {
     y.create({
       property: "product",
       headerLabel: "Name",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       sortable: f
@@ -221909,14 +221939,14 @@ function Sr() {
       property: "sellDate",
       headerLabel: "Sell date",
       width: G,
-      bodyRenderer: new K(),
+      bodyRenderer: new Y(),
       bodyClasses: ["ge-table-text-align-center"],
       sortable: f
     }),
     y.create({
       property: "id",
       headerLabel: "Order ID",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-center"],
       sortable: f
     }),
@@ -221931,7 +221961,7 @@ function Sr() {
     y.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: D,
+      width: I,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       sortable: f
@@ -221940,7 +221970,7 @@ function Sr() {
       property: "progress",
       headerLabel: "Progress",
       width: G,
-      bodyRenderer: new Ve("progress", 5, !0),
+      bodyRenderer: new Fe("progress", 5, !0),
       bodyClasses: ["ge-table-text-align-left"],
       sortable: f
     }),
@@ -221954,10 +221984,10 @@ function Sr() {
     })
   ];
 }
-function Cr() {
-  const s = new W("row", "multi");
+function Pr() {
+  const s = new q("row", "multi");
   return {
-    ...new w(),
+    ...new Z(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 24,
@@ -221967,9 +221997,9 @@ function Cr() {
     getSelectionModel: () => s
   };
 }
-function Ir() {
-  const s = Cr(), e = hr(), r = Sr();
-  return new X(
+function qr() {
+  const s = Pr(), e = Sr(), r = Cr();
+  return new H(
     N.createTableModel({
       rows: e,
       columnDefs: r,
@@ -221979,7 +222009,74 @@ function Ir() {
     s
   );
 }
-const Pr = [
+function Lr() {
+  return [
+    y.create({
+      headerLabel: "ID",
+      width: z,
+      bodyClasses: ["ge-table-text-align-left"],
+      headerClasses: ["ge-table-text-align-left"],
+      sortable: U
+    }),
+    y.create({
+      headerLabel: "Value",
+      width: D,
+      bodyClasses: ["ge-table-text-align-left"],
+      headerClasses: ["ge-table-text-align-left"],
+      sortable: U
+    }),
+    y.create({
+      headerLabel: " ",
+      width: D,
+      bodyClasses: ["ge-table-text-align-right"],
+      headerClasses: ["ge-table-text-align-right"]
+    })
+  ];
+}
+function Gr() {
+  const s = new q();
+  return {
+    ...new Z(),
+    hoverColumnVisible: !1,
+    defaultRowHeights: {
+      header: 34,
+      body: 34,
+      footer: 0
+    },
+    getSelectionModel: () => s
+  };
+}
+function Hr(s = 1e6) {
+  const e = Gr(), r = Lr(), a = new zr(s);
+  return new H(N.createTableModel({
+    bodyAreaModel: a,
+    columnDefs: r,
+    tableOptions: e,
+    fixedLeftColumnCount: 0
+  }), e);
+}
+class zr extends K {
+  constructor(e = 1e6) {
+    super(), this.rowcount = e, this.nf = new Intl.NumberFormat("en-Us", {}), this.barRenderer = new qe(e, !1);
+  }
+  getRowCount() {
+    return this.rowcount;
+  }
+  getRowHeight(e) {
+    return 34;
+  }
+  getValueAt(e, r) {
+    return r === 0 ? "id" + e : r === 1 ? this.nf.format(e) : e;
+  }
+  getCellRenderer(e, r) {
+    if (r == 2)
+      return this.barRenderer;
+  }
+  getYPosByRowIndex(e) {
+    return e * this.getRowHeight(0);
+  }
+}
+const Zr = [
   {
     id: 0,
     preName: "Prename0",
@@ -383853,10 +383950,10 @@ const Pr = [
     friends: []
   }
 ];
-function Lr(s = !1) {
-  const e = new W("range", "multi");
+function wr(s = !1) {
+  const e = new q("range", "multi");
   return s && (e.addSelection(new T(0, 0, 0, 2)), e.addSelection(new T(2, 1, 2, 2)), e.addSelection(new T(1, 5, 6, 7)), e.addSelection(new T(0, 8, 0, 8)), e.addSelection(new T(5, 6, 10, 10))), {
-    ...new w(),
+    ...new Z(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -383874,25 +383971,25 @@ function Lr(s = !1) {
     getSelectionModel: () => e
   };
 }
-function Gr() {
+function xr() {
   return [
     new y("lastName", "Last Name", Le),
-    new y("preName", "Pre Name", Z),
+    new y("preName", "Pre Name", z),
     y.create({
       property: "age",
       headerLabel: "Age",
       width: Ze,
-      bodyRenderer: new Oe(),
+      bodyRenderer: new Ve(),
       editable: f,
       // editInputPipe: (value: any) => value ? Number(value) : ""
-      editInputPipe: Fe
+      editInputPipe: $e
     }),
     new y(
       "birth",
       "Birthday",
       G,
       void 0,
-      Be.bodyRenderer(new K())
+      Be.bodyRenderer(new Y())
     ),
     y.create({
       property: "gender",
@@ -383900,61 +383997,63 @@ function Gr() {
       width: xe,
       bodyRenderer: new le(),
       editable: f,
-      getEditRenderer: () => new Y([
-        new F("female", "♀"),
-        new F("male", "♂")
+      getEditRenderer: () => new J([
+        new W("female", "♀"),
+        new W("male", "♂")
       ])
     }),
-    new y("address.street", "Strasse", de),
+    new y("address.street", "Strasse", ye),
     new y("address.number", "Nr", we),
-    new y("address.zip", "Zip", D),
-    new y("address.city", "City", Z),
-    new y("address.country", "Country", Z),
-    new y("id", "ID", D)
+    new y("address.zip", "Zip", I),
+    new y("address.city", "City", z),
+    new y("address.country", "Country", z),
+    new y("id", "ID", I)
   ];
 }
-function Mr(s = !1) {
-  const e = Lr(s), r = Gr();
+function Or(s = !1) {
+  const e = wr(s), r = xr();
   for (const n of r)
     n.sortable = f, n.editable = f;
-  r[0].editable = E;
-  const a = A.buildTreeRows(Pr, "friends"), t = N.createTableModel({
+  r[0].editable = U;
+  const a = A.buildTreeRows(Zr, "friends"), t = N.createTableModel({
     rows: a,
     columnDefs: r,
     tableOptions: e,
     fixedLeftColumnCount: 1,
     fixedRightColumnCount: 1
   });
-  return new X(
+  return new H(
     t,
     e
   );
 }
 export {
-  Ur as COL_IDX_UPDATED_AT,
-  We as ChangePercentageRenderer,
-  Ye as CirculatingSupplyRenderer,
-  Je as CoinIconRenderer,
-  Xe as NameAndSymbolRenderer,
-  je as UsdRenderer,
-  Ke as Volumn24hRenderer,
-  Ar as applyBodyRenderer,
-  lr as createColumnDefs,
-  zr as createCryptoModelAndOptions,
-  vr as createHeadergroupModel,
-  xr as createHeatMapModel,
-  kr as createHeatMapSeattleModel,
-  Ir as createOrderModelAndOptions,
-  Rr as createSimplePersonModel,
-  cr as createTableOptions,
-  pr as createTableRows,
-  Dr as createTimeTableModel,
-  Gr as createTreePeopleColumnDefs,
-  Mr as createTreePeopleModelAndOptions,
-  Lr as createTreePeopleTableOptions,
-  Qe as cryptoData,
-  gr as data,
-  Zr as generateSimpleModel,
-  wr as generateTreeCheckboxModel,
-  br as tableOptions
+  Br as COL_IDX_UPDATED_AT,
+  je as ChangePercentageRenderer,
+  Je as CirculatingSupplyRenderer,
+  Qe as CoinIconRenderer,
+  zr as LargeBodyModel,
+  Ke as NameAndSymbolRenderer,
+  Xe as UsdRenderer,
+  Ye as Volumn24hRenderer,
+  Ir as applyBodyRenderer,
+  cr as createColumnDefs,
+  kr as createCryptoModelAndOptions,
+  Dr as createHeadergroupModel,
+  Ar as createHeatMapModel,
+  Ur as createHeatMapSeattleModel,
+  Hr as createLargeModelAndOptions,
+  qr as createOrderModelAndOptions,
+  Mr as createSimplePersonModel,
+  gr as createTableOptions,
+  lr as createTableRows,
+  _r as createTimeTableModel,
+  xr as createTreePeopleColumnDefs,
+  Or as createTreePeopleModelAndOptions,
+  wr as createTreePeopleTableOptions,
+  er as cryptoData,
+  br as data,
+  vr as generateSimpleModel,
+  Rr as generateTreeCheckboxModel,
+  Nr as tableOptions
 };