@guiexpert/demo-table-models 1.1.93 → 1.1.96

package/index.js

@@ -1,81 +1,81 @@
-import { ColumnDef as t, px60 as f, px120 as g, px100 as c, px160 as ne, px200 as P, px140 as B, TableOptions as T, TableModelAndOptions as L, TableFactory as l, Size as p, AreaObjectMap as C, DateToIntlDDMMYYYYCellRenderer as v, MaleFemaleToIconCellRenderer as F, TreeFactory as E, DefaultRowHeights as me, AreaModelArrayOfArrays as Z, AreaModel as A, ColorRgb as D, ThreeColorGradientArg as se, GeCssColorUtil as ie, CellgroupFactory as z, AreaModelCellGroups as _, AreaModelObjectArrayWithColumndefs as M, px300 as de, px150 as K, px250 as ye, TrueFalseCellRenderer as W, DateToTecCellRenderer as pe, SelectionModel as k, TrueFn as d, CheckboxBooleanPropertyCellRenderer as j, px90 as X, ProgressBarCellRenderer as Y, StarRatingCellRenderer as J, NumberCellProgressBarCellRenderer as ue, FalseFn as U, px220 as Q, PositiveAndNegativeNumberRenderer as ce, px80 as ee, editInputPipeForNumber as le, NumberCellRenderer as ge, Renderer as be, SelectCellRenderer as Ne, px50 as fe, ValueLabel as R, px70 as Te, CellRange as S, AutoRestoreOptions as oe } from "@guiexpert/table";
-class he {
-  render(r, e, n, m, s, y, u) {
-    if (y) {
-      const i = Number(y);
-      i < 0 ? (r.innerHTML = "▾ " + i.toFixed(2) + "%", u.addClass(r, "ge-positive-text-color")) : (r.innerHTML = "▴ " + i.toFixed(2) + "%", u.addClass(r, "ge-negative-text-color"));
+import { ColumnDef as t, px60 as L, px120 as g, px100 as u, px160 as _, px200 as k, px140 as P, TableOptions as N, TableModelAndOptions as f, TableFactory as b, Size as c, AreaObjectMap as v, DateToIntlDDMMYYYYCellRenderer as R, MaleFemaleToIconCellRenderer as ne, TreeFactory as me, DefaultRowHeights as oe, AreaModelArrayOfArrays as M, AreaModel as K, ColorRgb as H, ThreeColorGradientArg as he, GeCssColorUtil as Se, CellgroupFactory as A, AreaModelCellGroups as se, AreaModelObjectArrayWithColumndefs as W, px300 as ie, px150 as de, px250 as Ce, TrueFalseCellRenderer as ye, DateToTecCellRenderer as Le, SelectionModel as C, TrueFn as y, CheckboxBooleanPropertyCellRenderer as pe, px90 as Z, ProgressBarCellRenderer as ue, StarRatingCellRenderer as ce, NumberCellProgressBarCellRenderer as Pe, RowNumberColumnDef as Ge, FalseFn as F, px220 as le, PositiveAndNegativeNumberRenderer as Ze, px80 as ge, RowGroupFactory as ze, px110 as $, PivotFactory as we, px130 as ve, editInputPipeForNumber as G, FocusModel as be, NumberCellRenderer as ke, Renderer as De, SelectCellRenderer as xe, px50 as Ue, ValueLabel as Y, px70 as qe, CellRange as z, AutoRestoreOptions as Be } from "@guiexpert/table";
+class Me {
+  render(e, r, n, m, s, i, p) {
+    if (i) {
+      const d = Number(i);
+      d < 0 ? (e.innerHTML = "▾ " + d.toFixed(2) + "%", p.addClass(e, "ge-positive-text-color")) : (e.innerHTML = "▴ " + d.toFixed(2) + "%", p.addClass(e, "ge-negative-text-color"));
     }
   }
 }
-class Se {
+class Ae {
   constructor() {
     this.formatter = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
   }
-  render(r, e, n, m, s, y, u) {
-    if (y) {
-      const i = Number(y);
-      r.innerText = this.formatter.format(i);
+  render(e, r, n, m, s, i, p) {
+    if (i) {
+      const d = Number(i);
+      e.innerText = this.formatter.format(d);
     }
   }
 }
-class Ce {
-  render(r, e, n, m, s, y, u) {
-    const i = s.getRowByIndex(e);
-    if (i) {
-      const N = i.name ?? i.symbol;
-      r.innerHTML = `
+class Ie {
+  render(e, r, n, m, s, i, p) {
+    const d = s.getRowByIndex(r);
+    if (d) {
+      const l = d.name ?? d.symbol;
+      e.innerHTML = `
       <div style="line-height: 1.2;padding: 10px 0 0 10px;">
-        ${N}<br>
-        ${i.symbol}
+        ${l}<br>
+        ${d.symbol}
       </div>
       `;
     }
   }
 }
-class Le {
+class Re {
   constructor() {
     this.formatterUsd = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }), this.formatter = new Intl.NumberFormat("en-US");
   }
-  render(r, e, n, m, s, y, u) {
-    const i = s.getRowByIndex(e);
-    if (i) {
-      const N = this.formatterUsd.format(i.volUsd), o = this.formatter.format(i.volBtc);
-      r.innerHTML = `
+  render(e, r, n, m, s, i, p) {
+    const d = s.getRowByIndex(r);
+    if (d) {
+      const l = this.formatterUsd.format(d.volUsd), T = this.formatter.format(d.volBtc);
+      e.innerHTML = `
       <div style="line-height: 1.2;padding: 10px 0 0 10px;">
-        ${N}<br>
-        ${o} BTC
+        ${l}<br>
+        ${T} BTC
       </div>
       `;
     }
   }
 }
-class Ge {
-  constructor(r = 120) {
-    this.maxWidth = r, this.formatter = new Intl.NumberFormat("en-US");
+class Oe {
+  constructor(e = 120) {
+    this.maxWidth = e, this.formatter = new Intl.NumberFormat("en-US");
   }
-  render(r, e, n, m, s, y, u) {
-    const i = s.getRowByIndex(e);
-    if (i) {
-      const N = this.formatter.format(i.circulatingSupply), o = i.maxSupply, h = [];
-      if (h.push('<div style="line-height: 1.2;padding: 10px 0 0 10px;">'), h.push(N), h.push("<br>"), o) {
-        const te = this.maxWidth * i.circulatingSupply / o;
-        h.push(`
+  render(e, r, n, m, s, i, p) {
+    const d = s.getRowByIndex(r);
+    if (d) {
+      const l = this.formatter.format(d.circulatingSupply), T = d.maxSupply, S = [];
+      if (S.push('<div style="line-height: 1.2;padding: 10px 0 0 10px;">'), S.push(l), S.push("<br>"), T) {
+        const D = this.maxWidth * d.circulatingSupply / T;
+        S.push(`
           <div style="width: ${this.maxWidth}px;height: 5px;background-color: #eee;margin:10px 0 0 10px">
-            <div style="width: ${te}px;height: 5px;background-color: #ccc;"></div>
+            <div style="width: ${D}px;height: 5px;background-color: #ccc;"></div>
           </div>
         `);
       }
-      h.push("</div>"), r.innerHTML = h.join("");
+      S.push("</div>"), e.innerHTML = S.join("");
     }
   }
 }
-class Pe {
-  render(r, e, n, m, s, y, u) {
-    const i = s.getRowByIndex(e);
-    i != null && i.id && (r.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 He {
+  render(e, r, n, m, s, i, p) {
+    const d = s.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 Ze = [
+const Ve = [
   {
     id: 1,
     name: "Bitcoin",
@@ -2810,14 +2810,14 @@ const Ze = [
     change90d: 12.43943602
   }
 ];
-function dr() {
-  const a = Ze, r = new he(), e = new Se(), n = new Ce(), m = new Le(), s = new Ge(120), y = new Pe(), u = [
+function Ir() {
+  const a = Ve, e = new Me(), r = new Ae(), n = new Ie(), m = new Re(), s = new Oe(120), i = new He(), p = [
     t.create({
       property: "symbol",
       headerLabel: "",
-      width: f,
+      width: L,
       bodyClasses: ["ge-table-text-align-left"],
-      bodyRenderer: y
+      bodyRenderer: i
     }),
     t.create({
       property: "symbol",
@@ -2830,24 +2830,24 @@ function dr() {
     t.create({
       property: "priceInUsd",
       headerLabel: "Price $",
-      width: c,
+      width: u,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     }),
-    new t("change1h", "1h %", c, void 0, t.bodyRenderer(r)),
-    new t("change24h", "24h %", c, void 0, t.bodyRenderer(r)),
-    new t("change7d", "7d %", c, void 0, t.bodyRenderer(r)),
+    new t("change1h", "1h %", u, void 0, t.bodyRenderer(e)),
+    new t("change24h", "24h %", u, void 0, t.bodyRenderer(e)),
+    new t("change7d", "7d %", u, void 0, t.bodyRenderer(e)),
     t.create({
       property: "marketCapUsd",
       headerLabel: "Market Cap",
-      width: ne,
+      width: _,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
-      bodyRenderer: e
+      bodyRenderer: r
     }),
     t.create({
       headerLabel: "Volumne (24h)",
-      width: P,
+      width: k,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       bodyRenderer: m
@@ -2855,15 +2855,15 @@ function dr() {
     t.create({
       property: "circulatingSupply",
       headerLabel: "Circulating Supply",
-      width: B,
+      width: P,
       bodyRenderer: s,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     })
   ];
-  u.forEach((N) => N.sortable = () => !0);
-  const i = {
-    ...new T(),
+  p.forEach((l) => l.sortable = () => !0);
+  const d = {
+    ...new N(),
     hoverColumnVisible: !1,
     verticalBorderVisible: !1,
     defaultRowHeights: {
@@ -2872,33 +2872,33 @@ function dr() {
       footer: 0
     }
   };
-  return new L(
-    l.createTableModel({
+  return new f(
+    b.createTableModel({
       rows: a,
-      columnDefs: u,
-      tableOptions: i
+      columnDefs: p,
+      tableOptions: d
     }),
-    i
+    d
   );
 }
-function yr(a = 1e3, r = 1e3) {
-  const e = Array.from(Array(a).keys()).map(
-    (s) => Array.from(Array(r).keys()).map((y) => `${s}/${y}`)
+function Rr(a = 1e3, e = 1e3) {
+  const r = Array.from(Array(a).keys()).map(
+    (s) => Array.from(Array(e).keys()).map((i) => `${s}/${i}`)
   ), n = Array.from(Array(2).keys()).map(
-    (s) => Array.from(Array(r).keys()).map((y) => `H${s}/${y}`)
+    (s) => Array.from(Array(e).keys()).map((i) => `H${s}/${i}`)
   ), m = Array.from(Array(2).keys()).map(
-    (s) => Array.from(Array(r).keys()).map((y) => `F${s}/${y}`)
+    (s) => Array.from(Array(e).keys()).map((i) => `F${s}/${i}`)
   );
-  return l.createTableModel({
+  return b.createTableModel({
     headerData: n,
-    bodyData: e,
+    bodyData: r,
     footerData: m,
     overridingColumnWidth: 110,
     fixedLeftColumnCount: 2,
     fixedRightColumnCount: 2
   });
 }
-const ze = [
+const Fe = [
   {
     id: 0,
     preName: "Prename0",
@@ -164772,9 +164772,9 @@ const ze = [
     friends: []
   }
 ];
-function pr() {
+function Or() {
   const a = {
-    ...new T(),
+    ...new N(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -164783,27 +164783,27 @@ function pr() {
     },
     showCheckboxWihoutExtraColumn: !0
     // <-- true: we will see the checkbox IN the first column after the arrow
-  }, r = [
+  }, e = [
     // new CheckboxColumn(), //  <--- not needed, because we have 'showCheckboxWihoutExtraColumn:true'
-    new t("lastName", "Last Name", new p(250, "px")),
-    new t("preName", "Pre Name", new p(120, "px")),
-    new t("birth", "Birthday", new p(100, "px"), new C(), new C(void 0, new v(), void 0), void 0, void 0),
-    new t("gender", " ", new p(50, "px"), new C(), new C(void 0, new F(), void 0), void 0, void 0),
-    new t("address.street", "Strasse", new p(150, "px")),
-    new t("address.number", "Nr", new p(70, "px")),
-    new t("address.zip", "Zip", new p(60, "px")),
-    new t("address.city", "City", new p(120, "px")),
-    new t("id", "ID", new p(60, "px"))
-  ], e = E.buildTreeRows(ze, "friends");
-  return l.createTableModel({
-    rows: e,
-    columnDefs: r,
+    new t("lastName", "Last Name", new c(250, "px")),
+    new t("preName", "Pre Name", new c(120, "px")),
+    new t("birth", "Birthday", new c(100, "px"), new v(), new v(void 0, new R(), void 0), void 0, void 0),
+    new t("gender", " ", new c(50, "px"), new v(), new v(void 0, new ne(), void 0), void 0, void 0),
+    new t("address.street", "Strasse", new c(150, "px")),
+    new t("address.number", "Nr", new c(70, "px")),
+    new t("address.zip", "Zip", new c(60, "px")),
+    new t("address.city", "City", new c(120, "px")),
+    new t("id", "ID", new c(60, "px"))
+  ], r = me.buildTreeRows(Fe, "friends");
+  return b.createTableModel({
+    rows: r,
+    columnDefs: e,
     tableOptions: a,
     fixedLeftColumnCount: 2,
     fixedRightColumnCount: 0
   });
 }
-const I = new me(34, 50, 0), H = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "), we = `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 j = new oe(34, 50, 0), X = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "), $e = `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
@@ -164813,39 +164813,39 @@ const I = new me(34, 50, 0), H = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov
 2016 34.5 37.7 48.9 53.3 62.8 72.3 78.7 79.2 71.8 58.8 49.8 38.3
 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(
-  (a) => a.split(" ").map((r) => Number(r))
-), ve = 27.9, ke = 77.4;
-class V {
-  constructor(r, e, n) {
-    this.r = r, this.g = e, this.b = n;
+  (a) => a.split(" ").map((e) => Number(e))
+), Ee = 27.9, _e = 77.4;
+class J {
+  constructor(e, r, n) {
+    this.r = e, this.g = r, this.b = n;
   }
 }
-function De(a, r, e, n, m) {
-  return (a - r) / (e - r) * (m - n) + n;
+function Ke(a, e, r, n, m) {
+  return (a - e) / (r - e) * (m - n) + n;
 }
-function xe(a, r, e) {
-  var n = new V(255, 0, 0), m = new V(0, 0, 255), s = De(e, a, r, 0, 1), y = m.r - n.r, u = m.g - n.g, i = m.b - n.b;
-  return y = y * s + n.r, u = u * s + n.g, i = i * s + n.b, `rgb(${Math.round(y)}, ${Math.round(u)}, ${Math.round(i)})`;
+function We(a, e, r) {
+  var n = new J(255, 0, 0), m = new J(0, 0, 255), s = Ke(r, a, e, 0, 1), i = m.r - n.r, p = m.g - n.g, d = m.b - n.b;
+  return i = i * s + n.r, p = p * s + n.g, d = d * s + n.b, `rgb(${Math.round(i)}, ${Math.round(p)}, ${Math.round(d)})`;
 }
-function ur() {
-  const a = new Z("body", we, I.body), r = new Array(H.length).fill(50), e = new Z("header", [H], I.header);
+function Hr() {
+  const a = new M("body", $e, j.body), e = new Array(X.length).fill(50), r = new M("header", [X], j.header);
   return a.getCustomStyleAt = (n, m) => {
     let s = {};
     if (m > 0) {
-      const y = a.getValueAt(n, m);
+      const i = a.getValueAt(n, m);
       s = {
-        background: xe(ve, ke, y),
+        background: We(Ee, _e, i),
         color: "#fff"
       };
     }
     return s.paddingTop = "10px", s;
-  }, l.createTableModel({
-    headerAreaModel: e,
+  }, b.createTableModel({
+    headerAreaModel: r,
     bodyAreaModel: a,
-    columnSizes: r
+    columnSizes: e
   });
 }
-function Ue() {
+function Ye() {
   return [
     {
       date: "2010-01-01T01:00:00",
@@ -217403,12 +217403,12 @@ function Ue() {
     }
   ];
 }
-const re = 30, qe = 3, ae = Ue(), b = {};
-ae.forEach((a) => {
-  const [r, e] = a.date.split("T");
-  b[r] || (b[r] = {}), b[r][e.substring(0, 5)] = a;
+const Ne = 30, je = 3, fe = Ye(), h = {};
+fe.forEach((a) => {
+  const [e, r] = a.date.split("T");
+  h[e] || (h[e] = {}), h[e][r.substring(0, 5)] = a;
 });
-const q = Object.keys(b), G = [
+const E = Object.keys(h), x = [
   "06:00",
   "07:00",
   "08:00",
@@ -217434,76 +217434,76 @@ const q = Object.keys(b), G = [
   "04:00",
   "05:00"
 ];
-function Be() {
-  let a = 10, r = 0;
-  return ae.forEach((e) => {
-    a = Math.min(a, e.temperature), r = Math.max(r, e.temperature);
-  }), [a, r];
+function Xe() {
+  let a = 10, e = 0;
+  return fe.forEach((r) => {
+    a = Math.min(a, r.temperature), e = Math.max(e, r.temperature);
+  }), [a, e];
 }
-const [O, $] = Be();
-function cr() {
-  const a = new Ae(), r = new Me(), e = [60, ...new Array(q.length).fill(qe)];
-  return l.createTableModel({
+const [Q, ee] = Xe();
+function Vr() {
+  const a = new Je(), e = new Qe(), r = [60, ...new Array(E.length).fill(je)];
+  return b.createTableModel({
     bodyAreaModel: a,
-    footerAreaModel: r,
-    columnSizes: e,
+    footerAreaModel: e,
+    columnSizes: r,
     fixedLeftColumnCount: 1
   });
 }
-class Ae extends A {
+class Je extends K {
   getRowCount() {
-    return G.length;
+    return x.length;
   }
-  getRowHeight(r) {
-    return re;
+  getRowHeight(e) {
+    return Ne;
   }
-  getValueAt(r, e) {
-    return e === 0 ? G[r] : "";
+  getValueAt(e, r) {
+    return r === 0 ? x[e] : "";
   }
-  getTooltipAt(r, e) {
-    if (e === 0)
+  getTooltipAt(e, r) {
+    if (r === 0)
       return "";
-    e--;
-    const n = q[e], m = G[r];
-    return b[n] && b[n][m] ? `${n} ${m} → ${b[n][m].temperature}` : "";
+    r--;
+    const n = E[r], m = x[e];
+    return h[n] && h[n][m] ? `${n} ${m} → ${h[n][m].temperature}` : "";
   }
-  getCustomStyleAt(r, e) {
-    if (e === 0)
+  getCustomStyleAt(e, r) {
+    if (r === 0)
       return;
-    e--;
-    const n = q[e], m = G[r];
-    if (!b[n] || !b[n][m]) return;
-    const s = b[n][m].temperature, y = new D(67, 1, 84), u = new D(31, 144, 141), i = new D(250, 230, 37), N = ($ + O) / 2, o = new se(O, y, N, u, $, i);
+    r--;
+    const n = E[r], m = x[e];
+    if (!h[n] || !h[n][m]) return;
+    const s = h[n][m].temperature, i = new H(67, 1, 84), p = new H(31, 144, 141), d = new H(250, 230, 37), l = (ee + Q) / 2, T = new he(Q, i, l, p, ee, d);
     return {
-      background: ie.getThreeColorGradientRGB(s, o),
+      background: Se.getThreeColorGradientRGB(s, T),
       color: "transparent"
       // we only want to show the bg color
     };
   }
 }
-class Me extends A {
+class Qe extends K {
   getRowCount() {
     return 1;
   }
-  getRowHeight(r) {
-    return re;
+  getRowHeight(e) {
+    return Ne;
   }
-  getValueAt(r, e) {
-    return e === 1 ? "Jan" : e === 32 ? "Feb" : e === 60 ? "Mar" : e === 91 ? "Apr" : e === 121 ? "May" : e === 152 ? "Jun" : e === 182 ? "Jul" : e === 213 ? "Aug" : e === 244 ? "Sep" : e === 274 ? "Oct" : e === 305 ? "Nov" : e === 335 ? "Dec" : "";
+  getValueAt(e, r) {
+    return r === 1 ? "Jan" : r === 32 ? "Feb" : r === 60 ? "Mar" : r === 91 ? "Apr" : r === 121 ? "May" : r === 152 ? "Jun" : r === 182 ? "Jul" : r === 213 ? "Aug" : r === 244 ? "Sep" : r === 274 ? "Oct" : r === 305 ? "Nov" : r === 335 ? "Dec" : "";
   }
-  getColspanAt(r, e) {
-    return e === 1 ? 31 : e === 32 ? 28 : e === 60 ? 31 : e === 91 ? 30 : e === 121 ? 31 : e === 152 ? 30 : e === 182 || e === 213 ? 31 : e === 244 ? 30 : e === 274 ? 31 : e === 305 ? 30 : e === 335 ? 31 : 0;
+  getColspanAt(e, r) {
+    return r === 1 ? 31 : r === 32 ? 28 : r === 60 ? 31 : r === 91 ? 30 : r === 121 ? 31 : r === 152 ? 30 : r === 182 || r === 213 ? 31 : r === 244 ? 30 : r === 274 ? 31 : r === 305 ? 30 : r === 335 ? 31 : 0;
   }
   getMaxColspan() {
     return 32;
   }
-  getCustomStyleAt(r, e) {
+  getCustomStyleAt(e, r) {
     return {
-      "border-left": e > 2 ? "solid 1px #555" : "none"
+      "border-left": r > 2 ? "solid 1px #555" : "none"
     };
   }
 }
-const x = [
+const V = [
   {
     data: "Gold",
     toggle: !0,
@@ -217590,9 +217590,9 @@ const x = [
     ]
   }
 ];
-function lr() {
-  const r = z.buildGroupExts(x), e = z.buildColumnDefs(r), n = new _("header", x, e, 34);
-  console.info("headerGroups", x), console.info("columnDefs", e.map((y) => y.property));
+function Fr() {
+  const e = A.buildGroupExts(V), r = A.buildColumnDefs(e), n = new se("header", V, r, 34);
+  console.info("headerGroups", V), console.info("columnDefs", r.map((i) => i.property));
   const m = [
     {
       GOLD: 146,
@@ -217610,14 +217610,14 @@ function lr() {
       HOH_C: 53,
       HOH_D: 54
     }
-  ], s = new M("body", m, e, 34);
-  return l.createTableModel({
+  ], s = new W("body", m, r, 34);
+  return b.createTableModel({
     headerAreaModel: n,
     bodyAreaModel: s,
-    columnDefs: e
+    columnDefs: r
   });
 }
-const Re = [
+const er = [
   {
     data: "Team A",
     toggle: !0,
@@ -217638,9 +217638,9 @@ const Re = [
     ]
   }
 ];
-function gr(a = Re) {
-  const e = z.buildGroupExts(a), n = z.buildColumnDefs(e), m = new _("header", a, n, 34);
-  console.info("headerGroups", a), console.info("columnDefs", n.map((u) => u.property)), console.info("columnDefs", n);
+function $r(a = er) {
+  const r = A.buildGroupExts(a), n = A.buildColumnDefs(r), m = new se("header", a, n, 34);
+  console.info("headerGroups", a), console.info("columnDefs", n.map((p) => p.property)), console.info("columnDefs", n);
   const s = [
     {
       team_a: 0,
@@ -217648,14 +217648,14 @@ function gr(a = Re) {
       peter: 5,
       paul: 4
     }
-  ], y = new M("body", s, n, 34);
-  return l.createTableModel({
+  ], i = new W("body", s, n, 34);
+  return b.createTableModel({
     headerAreaModel: m,
-    bodyAreaModel: y,
+    bodyAreaModel: i,
     columnDefs: n
   });
 }
-function Ie() {
+function rr() {
   return [
     {
       id: 1,
@@ -217835,35 +217835,35 @@ function Ie() {
     }
   ];
 }
-function He() {
+function ar() {
   return [
     new t("firstName", "First Name", g),
     new t("lastName", "Last Name"),
     t.create({
       property: "gender",
       headerLabel: "Gender",
-      width: c,
+      width: u,
       bodyClasses: ["ge-table-text-align-left"]
     }),
     t.create({
       property: "email",
       headerLabel: "Email",
-      width: de,
+      width: ie,
       bodyClasses: ["ge-table-text-align-left"]
     }),
-    new t("ipAddress", "IP", K),
+    new t("ipAddress", "IP", de),
     t.create({
       property: "id",
       headerLabel: "ID",
-      width: ye,
+      width: Ce,
       // bodyRenderer: actionRenderer,
       bodyClasses: ["ge-table-text-align-left"]
     })
   ];
 }
-function Ve() {
+function tr() {
   return {
-    ...new T(),
+    ...new N(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 40,
@@ -217872,19 +217872,19 @@ function Ve() {
     }
   };
 }
-function br() {
-  const a = Ve(), r = Ie(), e = He();
-  return l.createTableModel({
-    rows: r,
-    columnDefs: e,
+function Er() {
+  const a = tr(), e = rr(), r = ar();
+  return b.createTableModel({
+    rows: e,
+    columnDefs: r,
     tableOptions: a,
     fixedLeftColumnCount: 0
   });
 }
-function Nr(a, r) {
-  a.rendererMap = new C(void 0, r, void 0);
+function _r(a, e) {
+  a.rendererMap = new v(void 0, e, void 0);
 }
-const Oe = [
+const nr = [
   {
     id: 1,
     city: "London",
@@ -218032,36 +218032,36 @@ const Oe = [
     team: { name: "Team TCC", active: !0 },
     data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
   }
-].map((a) => (a.updatedAt = /* @__PURE__ */ new Date(), a)), w = [
-  new t("city", "City", new p(90, "px")),
-  new t("location", "Location", new p(100, "px")),
-  new t("team.name", "Team", new p(100, "px")),
+].map((a) => (a.updatedAt = /* @__PURE__ */ new Date(), a)), I = [
+  new t("city", "City", new c(90, "px")),
+  new t("location", "Location", new c(100, "px")),
+  new t("team.name", "Team", new c(100, "px")),
   t.create({
     property: "team.active",
     headerLabel: "Active",
-    width: new p(60, "px"),
-    bodyRenderer: new W()
+    width: new c(60, "px"),
+    bodyRenderer: new ye()
   }),
-  new t("data.0", "00", new p(60, "px")),
-  new t("data.1", "15", new p(60, "px")),
-  new t("data.2", "30", new p(60, "px")),
-  new t("data.3", "45", new p(60, "px")),
-  new t("data.4", "00", new p(60, "px")),
-  new t("data.5", "15", new p(60, "px")),
-  new t("data.6", "30", new p(60, "px")),
-  new t("data.7", "45", new p(60, "px")),
-  new t("data.8", "00", new p(60, "px")),
-  new t("data.9", "15", new p(60, "px")),
-  new t("data.10", "30", new p(60, "px")),
-  new t("data.11", "45", new p(60, "px")),
+  new t("data.0", "00", new c(60, "px")),
+  new t("data.1", "15", new c(60, "px")),
+  new t("data.2", "30", new c(60, "px")),
+  new t("data.3", "45", new c(60, "px")),
+  new t("data.4", "00", new c(60, "px")),
+  new t("data.5", "15", new c(60, "px")),
+  new t("data.6", "30", new c(60, "px")),
+  new t("data.7", "45", new c(60, "px")),
+  new t("data.8", "00", new c(60, "px")),
+  new t("data.9", "15", new c(60, "px")),
+  new t("data.10", "30", new c(60, "px")),
+  new t("data.11", "45", new c(60, "px")),
   t.create({
     property: "updatedAt",
     headerLabel: "Updated at",
-    width: new p(175, "px"),
-    bodyRenderer: new pe()
+    width: new c(175, "px"),
+    bodyRenderer: new Le()
   })
-], fr = w.length - 1, $e = {
-  ...new T(),
+], Kr = I.length - 1, mr = {
+  ...new N(),
   hoverRowVisible: !1,
   hoverColumnVisible: !1,
   defaultRowHeights: {
@@ -218072,81 +218072,81 @@ const Oe = [
   columnsDraggable: !1,
   columnsResizable: !0
 };
-function Tr() {
-  const a = $e.defaultRowHeights;
-  return l.createTableModel({
-    headerAreaModel: new Ee(a.header),
-    bodyAreaModel: new Fe(a.body),
-    footerAreaModel: new _e(a.footer),
-    columnDefs: w,
+function Wr() {
+  const a = mr.defaultRowHeights;
+  return b.createTableModel({
+    headerAreaModel: new ir(a.header),
+    bodyAreaModel: new sr(a.body),
+    footerAreaModel: new dr(a.footer),
+    columnDefs: I,
     fixedLeftColumnCount: 2,
     fixedRightColumnCount: 1,
     defaultRowHeights: a,
-    columnCount: w.length
+    columnCount: I.length
   });
 }
-class Fe extends M {
-  constructor(r) {
-    super("body", Oe, w, r);
+class sr extends W {
+  constructor(e) {
+    super("body", nr, I, e);
   }
-  getRowspanAt(r, e) {
-    if (e === 0 || e == 1) {
-      const n = this.getValueAt(r, e);
-      if (r === 0 || n !== this.getValueAt(r - 1, e))
-        return this.countNextWithValue(r, e, n);
+  getRowspanAt(e, r) {
+    if (r === 0 || r == 1) {
+      const n = this.getValueAt(e, r);
+      if (e === 0 || n !== this.getValueAt(e - 1, r))
+        return this.countNextWithValue(e, r, n);
     }
     return 1;
   }
-  countNextWithValue(r, e, n) {
+  countNextWithValue(e, r, n) {
     let m = 1;
-    for (; n === this.getValueAt(r + m, e); )
+    for (; n === this.getValueAt(e + m, r); )
       m++;
     return m;
   }
 }
-class Ee extends Z {
-  constructor(r) {
+class ir extends M {
+  constructor(e) {
     super(
       "header",
       [
         ["City", "Location", "Team", "", "08:00 - 09:00", "", "", "", "09:00 - 10:00", "", "", "", "10:00 - 11:00", "", "", "", "Updated At"],
         ["", "", "Name", "Active", "00", "15", "30", "45", "00", "15", "30", "45", "00", "15", "30", "45", ""]
       ],
-      r
+      e
     );
   }
-  getColspanAt(r, e) {
-    if (r === 0) {
-      if (e === 2 || e === 2)
+  getColspanAt(e, r) {
+    if (e === 0) {
+      if (r === 2 || r === 2)
         return 2;
-      if (e === 4 || e === 8 || e === 12)
+      if (r === 4 || r === 8 || r === 12)
         return 4;
     }
     return 1;
   }
-  getRowspanAt(r, e) {
-    return r === 0 && (e === 0 || e === 1 || e === 16) ? 2 : 1;
+  getRowspanAt(e, r) {
+    return e === 0 && (r === 0 || r === 1 || r === 16) ? 2 : 1;
   }
-  getCustomClassesAt(r, e) {
+  getCustomClassesAt(e, r) {
     return ["ge-font-weight-bold"];
   }
 }
-class _e extends Z {
-  constructor(r) {
+class dr extends M {
+  constructor(e) {
     super(
       "footer",
       [["", "", "Sum of Quarters:", "", "123", "432", "", "", "", "", "", "", "", "", "", "", ""]],
-      r
+      e
     );
   }
-  getColspanAt(r, e) {
-    return e == 0 || e == 2 ? 2 : 1;
+  getColspanAt(e, r) {
+    return r == 0 || r == 2 ? 2 : 1;
   }
-  getCustomClassesAt(r, e) {
-    return e === 2 ? ["ge-text-align-right", "ge-font-weight-bold"] : [];
+  getCustomClassesAt(e, r) {
+    return r === 2 ? ["ge-text-align-right", "ge-font-weight-bold"] : [];
   }
 }
-const Ke = [
+const yr = [
   {
     id: "c8-34f1d5",
     company: "Equicom",
@@ -220084,10 +220084,10 @@ const Ke = [
     rating: 5
   }
 ];
-function We() {
-  return Ke;
+function pr() {
+  return yr;
 }
-function je() {
+function ur() {
   return [
     t.create({
       property: "company",
@@ -220095,15 +220095,15 @@ function je() {
       width: g,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "country",
       headerLabel: "Country",
-      width: B,
+      width: P,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "product",
@@ -220111,61 +220111,61 @@ function je() {
       width: g,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "sellDate",
       headerLabel: "Sell date",
-      width: c,
-      bodyRenderer: new v(),
+      width: u,
+      bodyRenderer: new R(),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "id",
       headerLabel: "Order ID",
       width: g,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "inStock",
       headerLabel: "In stock",
-      width: X,
-      bodyRenderer: new j("inStock", !0, !0),
+      width: Z,
+      bodyRenderer: new pe("inStock", !0, !0),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: f,
+      width: L,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "progress",
       headerLabel: "Progress",
-      width: c,
-      bodyRenderer: new Y("progress", 5, !0),
+      width: u,
+      bodyRenderer: new ue("progress", 5, !0),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "rating",
       headerLabel: "Rating",
-      width: c,
-      bodyRenderer: new J("rating"),
+      width: u,
+      bodyRenderer: new ce("rating"),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: d
+      sortable: y
     })
   ];
 }
-function Xe() {
-  const a = new k("row", "multi");
+function cr() {
+  const a = new C("row", "multi");
   return {
-    ...new T(),
+    ...new N(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 24,
@@ -220175,46 +220175,46 @@ function Xe() {
     getSelectionModel: () => a
   };
 }
-function or() {
-  const a = Xe(), r = We(), e = je();
-  return new L(
-    l.createTableModel({
-      rows: r,
-      columnDefs: e,
+function Yr() {
+  const a = cr(), e = pr(), r = ur();
+  return new f(
+    b.createTableModel({
+      rows: e,
+      columnDefs: r,
       tableOptions: a,
       fixedLeftColumnCount: 0
     }),
     a
   );
 }
-function Ye() {
+function re() {
   return [
     t.create({
       headerLabel: "ID",
       width: g,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: U
+      sortable: F
     }),
     t.create({
       headerLabel: "Value",
-      width: P,
+      width: k,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: U
+      sortable: F
     }),
     t.create({
       headerLabel: " ",
-      width: P,
+      width: k,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     })
   ];
 }
-function Je() {
-  const a = new k();
+function lr() {
+  const a = new C();
   return {
-    ...new T(),
+    ...new N(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 34,
@@ -220224,39 +220224,44 @@ function Je() {
     getSelectionModel: () => a
   };
 }
-function hr(a = 1e6) {
-  const r = Je(), e = Ye(), n = new Qe(a);
-  return new L(l.createTableModel({
-    bodyAreaModel: n,
-    columnDefs: e,
+function jr(a = 1e6, e = !1) {
+  const r = lr(), n = e ? [new Ge({ format: (i) => i.toLocaleString("en-US") }), ...re()] : re(), m = e ? 1 : 0, s = new gr(a, m);
+  return new f(b.createTableModel({
+    bodyAreaModel: s,
+    columnDefs: n,
     tableOptions: r,
-    fixedLeftColumnCount: 0
+    fixedLeftColumnCount: m
   }), r);
 }
-class Qe extends A {
-  constructor(r = 1e6) {
-    super(), this.rowcount = r, this.nf = new Intl.NumberFormat("en-Us", {}), this.barRenderer = new ue(r, !1);
+class gr extends K {
+  /**
+   * @param rowcount - number of rows
+   * @param columnOffset - columns in front of the data columns (1 for a RowNumberColumnDef)
+   */
+  constructor(e = 1e6, r = 0) {
+    super(), this.rowcount = e, this.columnOffset = r, this.nf = new Intl.NumberFormat("en-Us", {}), this.barRenderer = new Pe(e, !1);
   }
   getRowCount() {
     return this.rowcount;
   }
-  getRowHeight(r) {
+  getRowHeight(e) {
     return 34;
   }
   getConstantRowHeight() {
     return 34;
   }
-  getValueAt(r, e) {
-    return e === 0 ? "id" + r : e === 1 ? this.nf.format(r) : r;
+  getValueAt(e, r) {
+    const n = r - this.columnOffset;
+    return n < 0 ? "" : n === 0 ? "id" + e : n === 1 ? this.nf.format(e) : e;
   }
-  getCellRenderer(r, e) {
-    if (e == 2) return this.barRenderer;
+  getCellRenderer(e, r) {
+    if (r - this.columnOffset === 2) return this.barRenderer;
   }
-  getYPosByRowIndex(r) {
-    return r * this.getRowHeight(0);
+  getYPosByRowIndex(e) {
+    return e * this.getRowHeight(0);
   }
 }
-const er = [
+const br = [
   {
     id: "f0-bfbecb",
     company: "Medmex",
@@ -221728,69 +221733,69 @@ const er = [
     f2: 28.55122067
   }
 ];
-function rr(a = 75) {
-  return er.slice(0, a - 1);
+function Nr(a = 75) {
+  return br.slice(0, a - 1);
 }
-function ar(a) {
+function fr(a) {
   return [
     t.create({
       property: "company",
       headerLabel: "Company",
-      width: c,
+      width: u,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "country",
       headerLabel: "Country",
-      width: B,
+      width: P,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "product",
       headerLabel: "Name",
-      width: c,
+      width: u,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "birthday",
       headerLabel: "Birth Date",
-      width: c,
+      width: u,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "sellDate",
       headerLabel: "Sell date",
-      width: c,
-      bodyRenderer: new v(),
+      width: u,
+      bodyRenderer: new R(),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "lastVisit",
       headerLabel: "Last Visit",
-      width: Q,
+      width: le,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "time",
       headerLabel: "Time",
-      width: c,
+      width: u,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
@@ -221798,80 +221803,80 @@ function ar(a) {
       headerLabel: "Order ID",
       width: g,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "inStock",
       headerLabel: "In stock",
-      width: X,
-      bodyRenderer: new j("inStock", !0, !0),
+      width: Z,
+      bodyRenderer: new pe("inStock", !0, !0),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: f,
+      width: L,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "progress",
       headerLabel: "Progress",
-      width: c,
-      bodyRenderer: new Y("progress", 5, !0),
+      width: u,
+      bodyRenderer: new ue("progress", 5, !0),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "rating",
       headerLabel: "Rating",
-      width: c,
-      bodyRenderer: new J("rating"),
+      width: u,
+      bodyRenderer: new ce("rating"),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: d
+      sortable: y
     }),
     t.create({
       property: "price",
       headerLabel: "Price",
-      width: f,
+      width: L,
       bodyClasses: ["ge-table-text-align-right"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "active",
       headerLabel: "Active",
-      width: f,
-      bodyRenderer: new W(),
-      sortable: d,
+      width: L,
+      bodyRenderer: new ye(),
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "currency",
       headerLabel: "CCY",
-      width: f,
-      sortable: d,
+      width: L,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "average",
       headerLabel: "Average",
-      width: c,
+      width: u,
       bodyClasses: ["ge-table-text-align-right"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "f1",
       headerLabel: "F1",
-      width: ee,
+      width: ge,
       bodyClasses: ["ge-table-text-align-right"],
-      bodyRenderer: new ce(),
-      sortable: d,
+      bodyRenderer: new Ze(),
+      sortable: y,
       editable: () => a
     }),
     t.create({
@@ -221879,22 +221884,22 @@ function ar(a) {
       headerLabel: "F2",
       width: g,
       bodyClasses: ["ge-table-text-align-right"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     }),
     t.create({
       property: "lorem",
       headerLabel: "Lorem",
-      width: P,
+      width: k,
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: d,
+      sortable: y,
       editable: () => a
     })
   ];
 }
-function tr(a) {
+function Tr(a) {
   return {
-    ...new T(),
+    ...new N(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 32,
@@ -221904,17 +221909,358 @@ function tr(a) {
     getSelectionModel: () => a
   };
 }
-function Sr(a = new k("row", "multi"), r = 75, e = !1) {
-  const n = tr(a);
-  r = Math.max(10, Math.min(75, r));
-  const m = rr(r), s = ar(e);
-  return new L(l.createTableModel({
+function Xr(a = new C("row", "multi"), e = 75, r = !1) {
+  const n = Tr(a);
+  e = Math.max(10, Math.min(75, e));
+  const m = Nr(e), s = fr(r);
+  return new f(b.createTableModel({
     rows: m,
     columnDefs: s,
     tableOptions: n
   }), n);
 }
-const nr = [
+const or = [
+  ["Germany", "Hamburg"],
+  ["Germany", "Berlin"],
+  ["Germany", "Munich"],
+  ["Austria", "Vienna"],
+  ["Austria", "Graz"],
+  ["Switzerland", "Zurich"],
+  ["France", "Paris"],
+  ["France", "Lyon"],
+  ["Italy", "Milan"],
+  ["Spain", "Madrid"],
+  ["Poland", "Warsaw"],
+  ["Denmark", "Copenhagen"]
+], hr = [
+  ["Laptop", "Hardware", 1299],
+  ["Monitor", "Hardware", 349],
+  ["Keyboard", "Accessories", 89],
+  ["Mouse", "Accessories", 39],
+  ["Docking Station", "Accessories", 219],
+  ["Office License", "Software", 129],
+  ["Cloud Credits", "Services", 500],
+  ["Support Plan", "Services", 990]
+];
+function Sr(a) {
+  return () => {
+    a |= 0, a = a + 1831565813 | 0;
+    let e = Math.imul(a ^ a >>> 15, 1 | a);
+    return e = e + Math.imul(e ^ e >>> 7, 61 | e) ^ e, ((e ^ e >>> 14) >>> 0) / 4294967296;
+  };
+}
+function O(a, e = 42) {
+  const r = Sr(e), n = (s) => s[Math.floor(r() * s.length)], m = new Array(a);
+  for (let s = 0; s < a; s++) {
+    const [i, p] = n(or), [d, l, T] = n(hr), S = 1 + Math.floor(r() * 20), D = Math.round(T * (0.85 + r() * 0.3) * 100) / 100;
+    m[s] = { id: s + 1, country: i, city: p, product: d, category: l, quantity: S, price: D, total: Math.round(S * D * 100) / 100 };
+  }
+  return m;
+}
+const U = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"], sortable: y };
+function Te() {
+  return [
+    t.create({ property: "id", headerLabel: "Order", width: u, ...U }),
+    t.create({ property: "country", headerLabel: "Country", width: P, sortable: y }),
+    t.create({ property: "city", headerLabel: "City", width: P, sortable: y }),
+    t.create({ property: "product", headerLabel: "Product", width: _, sortable: y }),
+    t.create({ property: "category", headerLabel: "Category", width: P, sortable: y }),
+    t.create({ property: "quantity", headerLabel: "Qty", width: u, ...U }),
+    t.create({ property: "price", headerLabel: "Ø Price", width: $, ...U }),
+    t.create({ property: "total", headerLabel: "Total", width: P, ...U })
+  ];
+}
+function Jr(a = 5e4, e = ["country", "city"], r = 1) {
+  const n = new C("row", "multi"), m = {
+    ...new N(),
+    hoverColumnVisible: !1,
+    getSelectionModel: () => n
+  }, s = ze.createTableModel({
+    rows: O(a),
+    columnDefs: Te(),
+    groupBy: e,
+    aggregations: { quantity: "sum", price: "avg", total: "sum" },
+    expanded: r,
+    tableOptions: m
+  });
+  return new f(s, m);
+}
+const Cr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+class Lr {
+  render(e, r, n, m, s, i, p) {
+    if (typeof i == "number") {
+      const d = p.createElement("div");
+      p.addClass(d, "ge-table-label-div");
+      const l = p.createElement("div");
+      p.addClass(l, "ge-table-label"), p.appendChild(l, p.createText(Cr.format(i))), p.appendChild(d, l), p.appendChild(e, d);
+    }
+  }
+}
+function Qr(a = 5e4) {
+  const e = new C("range", "multi"), r = {
+    ...new N(),
+    hoverColumnVisible: !1,
+    getSelectionModel: () => e
+  }, n = Te(), m = new Lr();
+  for (const i of n)
+    (i.property === "price" || i.property === "total") && (i.rendererMap.body = m);
+  const s = b.createTableModel({
+    rows: O(a),
+    columnDefs: n,
+    footerAggregates: {
+      rows: [
+        {
+          label: (i) => `Sum · ${i.toLocaleString("en-US")} orders`,
+          aggregates: { quantity: "sum", total: "sum" }
+        },
+        { label: "Average", aggregates: { quantity: "avg", price: "avg", total: "avg" } },
+        { label: "Maximum", aggregates: { quantity: "max", price: "max", total: "max" } }
+      ],
+      labelProperty: "product"
+      // the widest text column holds the labels
+    },
+    tableOptions: r
+  });
+  return new f(s, r);
+}
+function Pr(a) {
+  return () => {
+    a |= 0, a = a + 1831565813 | 0;
+    let e = Math.imul(a ^ a >>> 15, 1 | a);
+    return e = e + Math.imul(e ^ e >>> 7, 61 | e) ^ e, ((e ^ e >>> 14) >>> 0) / 4294967296;
+  };
+}
+function Gr(a, e = 42) {
+  const r = Pr(e + 1), n = Date.UTC(2024, 0, 1), m = 3 * 365 + 1;
+  return O(a, e).map((s) => ({
+    ...s,
+    date: new Date(n + Math.floor(r() * m) * 864e5).toISOString().slice(0, 10)
+  }));
+}
+const Zr = { name: "year", label: "Year", value: (a) => Number(a.date.slice(0, 4)) }, zr = {
+  name: "quarter",
+  label: "Quarter",
+  value: (a) => Math.floor((Number(a.date.slice(5, 7)) - 1) / 3) + 1,
+  format: (a) => `Q${a}`
+};
+function ea(a = 5e4, e = [Zr, zr], r = 0) {
+  const n = new C("range", "multi"), m = {
+    ...new N(),
+    hoverColumnVisible: !1,
+    getSelectionModel: () => n
+  }, s = we.createTableModel({
+    rows: Gr(a),
+    rowFields: [{ value: "country", label: "Country" }, { value: "city", label: "City" }],
+    columnFields: e,
+    values: [
+      { value: "total", label: "Revenue", format: (i) => i === void 0 ? "" : Math.round(i).toLocaleString("en-US") },
+      { value: "id", aggregator: "count", label: "Orders" }
+    ],
+    expanded: r,
+    valueColumnWidth: g,
+    groupColumn: { showCount: !1 },
+    tableOptions: m
+  });
+  return new f(s, m);
+}
+const wr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+class vr {
+  render(e, r, n, m, s, i, p) {
+    if (i == null || i === "")
+      return;
+    const d = p.createElement("div");
+    p.addClass(d, "ge-table-label-div");
+    const l = p.createElement("div");
+    p.addClass(l, "ge-table-label");
+    const T = typeof i == "number" ? wr.format(i) : `${i}`;
+    p.appendChild(l, p.createText(T)), p.appendChild(d, l), p.appendChild(e, d);
+  }
+}
+function kr(a, e = 8) {
+  const r = [0, 0, 0, 5, 5, 10, 15];
+  return O(a, e).map((n, m) => ({
+    id: n.id,
+    country: n.country,
+    product: n.product,
+    quantity: n.quantity,
+    price: n.price,
+    discount: r[(m * 7 + n.quantity) % r.length]
+  }));
+}
+const o = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"], footerClasses: ["ge-table-text-align-right"] }, q = {
+  net: "ROUND([quantity] * [price] * (1 - [discount] / 100), 2)",
+  vat: "ROUND([net] * 0.19, 2)",
+  gross: "[net] + [vat]",
+  custom: 'IF([discount] > 0, ROUND([gross] / [quantity], 2), "–")'
+};
+function Dr(a = q.custom) {
+  const e = new vr();
+  return [
+    t.create({ property: "id", headerLabel: "Line", width: Z, ...o, sortable: y }),
+    t.create({ property: "country", headerLabel: "Country", width: ve, sortable: y }),
+    t.create({ property: "product", headerLabel: "Product", width: _, sortable: y }),
+    t.create({
+      property: "quantity",
+      headerLabel: "Qty",
+      width: Z,
+      ...o,
+      sortable: y,
+      editable: y,
+      editInputPipe: G
+    }),
+    t.create({
+      property: "price",
+      headerLabel: "Price",
+      width: $,
+      ...o,
+      sortable: y,
+      editable: y,
+      editInputPipe: G,
+      bodyRenderer: e
+    }),
+    t.create({
+      property: "discount",
+      headerLabel: "Disc. %",
+      width: Z,
+      ...o,
+      sortable: y,
+      editable: y,
+      editInputPipe: G
+    }),
+    t.create({
+      property: "net",
+      headerLabel: "Net",
+      width: g,
+      ...o,
+      sortable: y,
+      formula: q.net,
+      bodyRenderer: e,
+      footerRenderer: e
+    }),
+    t.create({
+      property: "vat",
+      headerLabel: "VAT 19%",
+      width: $,
+      ...o,
+      sortable: y,
+      formula: q.vat,
+      bodyRenderer: e,
+      footerRenderer: e
+    }),
+    t.create({
+      property: "gross",
+      headerLabel: "Gross",
+      width: g,
+      ...o,
+      sortable: y,
+      formula: q.gross,
+      bodyRenderer: e,
+      footerRenderer: e
+    }),
+    t.create({
+      property: "share",
+      headerLabel: "Share of net",
+      width: g,
+      ...o,
+      sortable: y,
+      formula: "[net]",
+      showValuesAs: { mode: "percentOfColumnTotal", fractionDigits: 2 }
+    }),
+    t.create({
+      property: "rank",
+      headerLabel: "Rank",
+      width: Z,
+      ...o,
+      sortable: y,
+      formula: "[gross]",
+      showValuesAs: "rank"
+    }),
+    t.create({
+      property: "custom",
+      headerLabel: "Custom formula",
+      width: P,
+      ...o,
+      sortable: y,
+      formula: a
+    })
+  ];
+}
+function ra(a = 2e3) {
+  const e = {
+    ...new N(),
+    hoverColumnVisible: !1
+  }, r = b.createTableModel({
+    rows: kr(a),
+    columnDefs: Dr(),
+    footerAggregates: {
+      rows: [{ label: (n) => `Sum · ${n.toLocaleString("en-US")} lines`, aggregates: { net: "sum", vat: "sum", gross: "sum" } }],
+      labelProperty: "product"
+    },
+    fixedLeftColumnCount: 1,
+    tableOptions: e
+  });
+  return new f(r, e);
+}
+const w = [
+  "Fix login timeout",
+  "Ship row drag",
+  "Write release notes",
+  "Review pull requests",
+  "Update dependencies",
+  "Dark mode for the dashboard",
+  "Export to Excel",
+  "Keyboard shortcuts help",
+  "Onboarding video",
+  "Fix flaky test",
+  "Translate settings page",
+  "Accessibility audit",
+  "Cache API responses",
+  "Remove old feature flags",
+  "Improve search ranking",
+  "Mobile layout of the table",
+  "Customer interview notes",
+  "Plan Q1 roadmap",
+  "Refactor date utils",
+  "Security headers"
+], ae = ["Anna", "Ben", "Chen", "Dana", "Emil"], te = ["todo", "doing", "todo", "done", "todo"];
+function xr(a = 20, e = !1) {
+  return Array.from({ length: a }, (r, n) => ({
+    id: n + 1,
+    title: n < w.length ? w[n] : `${w[n % w.length]} #${Math.floor(n / w.length) + 1}`,
+    owner: ae[n % ae.length],
+    status: te[n * 3 % te.length],
+    estimate: 1 + n * 7 % 13,
+    locked: e && n === 0
+  }));
+}
+function aa(a = xr(20, !0), e = {}) {
+  const r = new C("row", "multi"), n = new be("cell"), m = {
+    ...new N(),
+    hoverColumnVisible: !1,
+    getSelectionModel: () => r,
+    getFocusModel: () => n,
+    rowDragOptions: e,
+    ariaLabel: "Priority list"
+  }, s = b.createTableModel({
+    rows: a,
+    rowNumbersVisible: { headerLabel: "#" },
+    columnDefs: [
+      t.create({ property: "title", headerLabel: "Task", width: ie, rowDrag: (i) => !i.locked }),
+      t.create({ property: "owner", headerLabel: "Owner", width: g }),
+      t.create({ property: "status", headerLabel: "Status", width: u }),
+      t.create({
+        property: "estimate",
+        headerLabel: "Hours",
+        width: u,
+        headerClasses: ["ge-table-text-align-right"],
+        bodyClasses: ["ge-table-text-align-right"]
+      })
+    ],
+    tableOptions: m
+  });
+  return new f(s, m);
+}
+const Ur = [
   {
     id: 0,
     preName: "Prename0",
@@ -383788,10 +384134,10 @@ const nr = [
     friends: []
   }
 ];
-function mr(a = !1) {
-  const r = new k("range", "multi");
-  return a && (r.addSelection(new S(0, 0, 0, 2)), r.addSelection(new S(2, 1, 2, 2)), r.addSelection(new S(1, 5, 6, 7)), r.addSelection(new S(0, 8, 0, 8)), r.addSelection(new S(5, 6, 10, 10))), {
-    ...new T(),
+function qr(a = !1) {
+  const e = new C("range", "multi");
+  return a && (e.addSelection(new z(0, 0, 0, 2)), e.addSelection(new z(2, 1, 2, 2)), e.addSelection(new z(1, 5, 6, 7)), e.addSelection(new z(0, 8, 0, 8)), e.addSelection(new z(5, 6, 10, 10))), {
+    ...new N(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -383799,102 +384145,213 @@ function mr(a = !1) {
       footer: 0
     },
     autoRestoreOptions: {
-      ...new oe(),
+      ...new Be(),
       getStorageKeyFn: () => "TreetablePeopleComponent",
       autoRestoreCollapsedExpandedState: !0,
       autoRestoreScrollPosition: !0,
       autoRestoreSortingState: !0
     },
-    externalFilterFunction: (e, n, m) => !0,
-    getSelectionModel: () => r
+    externalFilterFunction: (r, n, m) => !0,
+    getSelectionModel: () => e
   };
 }
-function sr() {
+function Br() {
   return [
-    new t("lastName", "Last Name", Q),
+    new t("lastName", "Last Name", le),
     new t("preName", "Pre Name", g),
     t.create({
       property: "age",
       headerLabel: "Age",
-      width: ee,
-      bodyRenderer: new ge(),
-      editable: d,
+      width: ge,
+      bodyRenderer: new ke(),
+      editable: y,
       // editInputPipe: (value: any) => value ? Number(value) : ""
-      editInputPipe: le
+      editInputPipe: G
     }),
     new t(
       "birth",
       "Birthday",
-      c,
+      u,
       void 0,
-      be.bodyRenderer(new v())
+      De.bodyRenderer(new R())
     ),
     t.create({
       property: "gender",
       headerLabel: " ",
-      width: fe,
-      bodyRenderer: new F(),
-      editable: d,
-      getEditRenderer: () => new Ne([
-        new R("female", "♀"),
-        new R("male", "♂")
+      width: Ue,
+      bodyRenderer: new ne(),
+      editable: y,
+      getEditRenderer: () => new xe([
+        new Y("female", "♀"),
+        new Y("male", "♂")
       ])
     }),
-    new t("address.street", "Strasse", K),
-    new t("address.number", "Nr", Te),
-    new t("address.zip", "Zip", f),
+    new t("address.street", "Strasse", de),
+    new t("address.number", "Nr", qe),
+    new t("address.zip", "Zip", L),
     new t("address.city", "City", g),
     new t("address.country", "Country", g),
-    new t("id", "ID", f)
+    new t("id", "ID", L)
   ];
 }
-function Cr(a = !1) {
-  const r = mr(a), e = sr();
-  for (const s of e)
-    s.sortable = d, s.editable = d;
-  e[0].editable = U;
-  const n = E.buildTreeRows(nr, "friends"), m = l.createTableModel({
+function ta(a = !1) {
+  const e = qr(a), r = Br();
+  for (const s of r)
+    s.sortable = y, s.editable = y;
+  r[0].editable = F;
+  const n = me.buildTreeRows(Ur, "friends"), m = b.createTableModel({
     rows: n,
-    columnDefs: e,
-    tableOptions: r,
+    columnDefs: r,
+    tableOptions: e,
     fixedLeftColumnCount: 1,
     fixedRightColumnCount: 1
   });
-  return new L(
+  return new f(
     m,
-    r
+    e
   );
 }
+const B = [
+  ["Desk lamp", "Office"],
+  ["Standing desk", "Office"],
+  ["Office chair", "Office"],
+  ["Monitor arm", "Office"],
+  ["Notebook A5", "Paper"],
+  ["Sticky notes", "Paper"],
+  ["Printer paper", "Paper"],
+  ["Envelopes", "Paper"],
+  ["USB-C cable", "Tech"],
+  ["Keyboard", "Tech"],
+  ["Mouse", "Tech"],
+  ["Webcam", "Tech"],
+  ["Headset", "Tech"],
+  ["Coffee beans", "Kitchen"],
+  ["Tea selection", "Kitchen"],
+  ["Water bottle", "Kitchen"]
+];
+function Mr(a = 16) {
+  return Array.from({ length: a }, (e, r) => {
+    const [n, m] = B[r % B.length];
+    return {
+      id: r + 1,
+      sku: `SKU-${String(r + 1).padStart(3, "0")}`,
+      product: r < B.length ? n : `${n} ${Math.floor(r / B.length) + 1}`,
+      category: m,
+      validFrom: "2026-10-01",
+      price: Math.round((5 + (r * r * 37 + r * 11) % 150 + r * 13 % 10 / 10) * 100) / 100,
+      discount: r * 5 % 20,
+      stock: 10 + r * 17 % 90
+    };
+  });
+}
+function na(a = Mr(), e = !0, r = !0) {
+  const n = new C("range", "multi"), m = new be("cell"), s = {
+    ...new N(),
+    hoverColumnVisible: !1,
+    getSelectionModel: () => n,
+    getFocusModel: () => m,
+    fillHandle: r,
+    batchEdit: e,
+    ariaLabel: "Price list"
+  }, i = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"] }, p = b.createTableModel({
+    rows: a,
+    fixedLeftColumnCount: 1,
+    columnDefs: [
+      t.create({ property: "sku", headerLabel: "SKU", width: u }),
+      t.create({ property: "product", headerLabel: "Product", width: k, editable: y }),
+      t.create({ property: "category", headerLabel: "Category", width: u, editable: y }),
+      t.create({
+        property: "validFrom",
+        headerLabel: "Valid from",
+        width: g,
+        editable: y,
+        validate: (d) => /^\d{4}-\d{2}-\d{2}$/.test(String(d)) ? void 0 : "Date as YYYY-MM-DD"
+      }),
+      t.create({
+        property: "price",
+        headerLabel: "Price",
+        width: u,
+        editable: y,
+        editInputPipe: G,
+        ...i,
+        validate: (d) => typeof d == "number" && d >= 0 ? void 0 : "A price is a number ≥ 0"
+      }),
+      t.create({
+        property: "discount",
+        headerLabel: "Discount %",
+        width: u,
+        editable: y,
+        editInputPipe: G,
+        ...i,
+        validate: (d) => typeof d == "number" && d >= 0 && d <= 50 ? void 0 : "Discount 0 … 50 %"
+      }),
+      t.create({
+        property: "net",
+        headerLabel: "Net",
+        width: u,
+        ...i,
+        valueGetter: (d) => Math.round(d.price * (100 - d.discount)) / 100
+      }),
+      t.create({
+        property: "stock",
+        headerLabel: "Stock",
+        width: u,
+        editable: y,
+        editInputPipe: G,
+        ...i,
+        validate: (d) => Number.isInteger(d) && d >= 0 ? void 0 : "Stock is a whole number ≥ 0"
+      })
+    ],
+    tableOptions: s
+  });
+  return new f(p, s);
+}
 export {
-  fr as COL_IDX_UPDATED_AT,
-  he as ChangePercentageRenderer,
-  Ge as CirculatingSupplyRenderer,
-  Pe as CoinIconRenderer,
-  Qe as LargeBodyModel,
-  Ce as NameAndSymbolRenderer,
-  Se as UsdRenderer,
-  Le as Volumn24hRenderer,
-  Nr as applyBodyRenderer,
-  He as createColumnDefs,
-  dr as createCryptoModelAndOptions,
-  lr as createHeadergroupModel,
-  ur as createHeatMapModel,
-  cr as createHeatMapSeattleModel,
-  hr as createLargeModelAndOptions,
-  Sr as createManyTypesModelAndOptions,
-  or as createOrderModelAndOptions,
-  br as createSimplePersonModel,
-  Ve as createTableOptions,
-  Ie as createTableRows,
-  gr as createTeamHeadergroupModel,
-  Tr as createTimeTableModel,
-  sr as createTreePeopleColumnDefs,
-  Cr as createTreePeopleModelAndOptions,
-  mr as createTreePeopleTableOptions,
-  Ze as cryptoData,
-  Oe as data,
-  yr as generateSimpleModel,
-  pr as generateTreeCheckboxModel,
-  $e as tableOptions,
-  Re as teamHeaderGroups
+  Kr as COL_IDX_UPDATED_AT,
+  Me as ChangePercentageRenderer,
+  Oe as CirculatingSupplyRenderer,
+  He as CoinIconRenderer,
+  q as INVOICE_FORMULAS,
+  gr as LargeBodyModel,
+  Ie as NameAndSymbolRenderer,
+  Ae as UsdRenderer,
+  Re as Volumn24hRenderer,
+  _r as applyBodyRenderer,
+  Qr as createAggregationModelAndOptions,
+  ar as createColumnDefs,
+  Ir as createCryptoModelAndOptions,
+  ra as createFormulaModelAndOptions,
+  Fr as createHeadergroupModel,
+  Hr as createHeatMapModel,
+  Vr as createHeatMapSeattleModel,
+  Dr as createInvoiceColumnDefs,
+  jr as createLargeModelAndOptions,
+  Xr as createManyTypesModelAndOptions,
+  Yr as createOrderModelAndOptions,
+  ea as createPivotModelAndOptions,
+  na as createPriceListModelAndOptions,
+  aa as createRowDragModelAndOptions,
+  Jr as createRowGroupModelAndOptions,
+  Te as createSalesOrderColumnDefs,
+  Er as createSimplePersonModel,
+  tr as createTableOptions,
+  rr as createTableRows,
+  $r as createTeamHeadergroupModel,
+  Wr as createTimeTableModel,
+  Br as createTreePeopleColumnDefs,
+  ta as createTreePeopleModelAndOptions,
+  qr as createTreePeopleTableOptions,
+  Ve as cryptoData,
+  nr as data,
+  kr as generateInvoiceLines,
+  Gr as generatePivotOrders,
+  Mr as generatePriceItems,
+  O as generateSalesOrders,
+  Rr as generateSimpleModel,
+  xr as generateTasks,
+  Or as generateTreeCheckboxModel,
+  zr as pivotQuarter,
+  Zr as pivotYear,
+  mr as tableOptions,
+  er as teamHeaderGroups
 };