@guiexpert/demo-table-models 1.1.96 → 1.1.98

package/index.js

@@ -1,5 +1,5 @@
-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 {
+import { ColumnDef as t, px60 as P, px120 as g, px100 as c, px160 as I, px200 as Z, px140 as L, TableOptions as f, TableModelAndOptions as o, TableFactory as N, Size as l, AreaObjectMap as D, DateToIntlDDMMYYYYCellRenderer as O, MaleFemaleToIconCellRenderer as ue, TreeFactory as ce, DefaultRowHeights as Ze, AreaModelArrayOfArrays as B, AreaModel as Y, ColorRgb as $, ThreeColorGradientArg as ze, GeCssColorUtil as we, CellgroupFactory as A, AreaModelCellGroups as le, AreaModelObjectArrayWithColumndefs as j, px300 as ge, px150 as be, px250 as ve, TrueFalseCellRenderer as Ne, DateToTecCellRenderer as ke, SelectionModel as h, TrueFn as y, CheckboxBooleanPropertyCellRenderer as fe, px90 as z, ProgressBarCellRenderer as Te, StarRatingCellRenderer as oe, NumberCellProgressBarCellRenderer as De, RowNumberColumnDef as xe, FalseFn as _, px220 as he, PositiveAndNegativeNumberRenderer as Ue, px80 as Se, RowGroupFactory as qe, px110 as K, PivotFactory as Me, px130 as Be, editInputPipeForNumber as G, FocusModel as H, NumberCellRenderer as Ae, Renderer as Re, SelectCellRenderer as Ie, px50 as Oe, ValueLabel as X, px70 as He, CellRange as v, AutoRestoreOptions as Ve } from "@guiexpert/table";
+class $e {
   render(e, r, n, m, s, i, p) {
     if (i) {
       const d = Number(i);
@@ -7,7 +7,7 @@ class Me {
     }
   }
 }
-class Ae {
+class Fe {
   constructor() {
     this.formatter = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
   }
@@ -18,64 +18,64 @@ class Ae {
     }
   }
 }
-class Ie {
+class Ee {
   render(e, r, n, m, s, i, p) {
     const d = s.getRowByIndex(r);
     if (d) {
-      const l = d.name ?? d.symbol;
+      const u = d.name ?? d.symbol;
       e.innerHTML = `
       <div style="line-height: 1.2;padding: 10px 0 0 10px;">
-        ${l}<br>
+        ${u}<br>
         ${d.symbol}
       </div>
       `;
     }
   }
 }
-class Re {
+class _e {
   constructor() {
     this.formatterUsd = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }), this.formatter = new Intl.NumberFormat("en-US");
   }
   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);
+      const u = this.formatterUsd.format(d.volUsd), b = this.formatter.format(d.volBtc);
       e.innerHTML = `
       <div style="line-height: 1.2;padding: 10px 0 0 10px;">
-        ${l}<br>
-        ${T} BTC
+        ${u}<br>
+        ${b} BTC
       </div>
       `;
     }
   }
 }
-class Oe {
+class Ke {
   constructor(e = 120) {
     this.maxWidth = e, this.formatter = new Intl.NumberFormat("en-US");
   }
   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(`
+      const u = this.formatter.format(d.circulatingSupply), b = d.maxSupply, T = [];
+      if (T.push('<div style="line-height: 1.2;padding: 10px 0 0 10px;">'), T.push(u), T.push("<br>"), b) {
+        const w = this.maxWidth * d.circulatingSupply / b;
+        T.push(`
           <div style="width: ${this.maxWidth}px;height: 5px;background-color: #eee;margin:10px 0 0 10px">
-            <div style="width: ${D}px;height: 5px;background-color: #ccc;"></div>
+            <div style="width: ${w}px;height: 5px;background-color: #ccc;"></div>
           </div>
         `);
       }
-      S.push("</div>"), e.innerHTML = S.join("");
+      T.push("</div>"), e.innerHTML = T.join("");
     }
   }
 }
-class He {
+class We {
   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 Ve = [
+const Ye = [
   {
     id: 1,
     name: "Bitcoin",
@@ -2810,12 +2810,12 @@ const Ve = [
     change90d: 12.43943602
   }
 ];
-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 = [
+function Yr() {
+  const a = Ye, e = new $e(), r = new Fe(), n = new Ee(), m = new _e(), s = new Ke(120), i = new We(), p = [
     t.create({
       property: "symbol",
       headerLabel: "",
-      width: L,
+      width: P,
       bodyClasses: ["ge-table-text-align-left"],
       bodyRenderer: i
     }),
@@ -2830,24 +2830,24 @@ function Ir() {
     t.create({
       property: "priceInUsd",
       headerLabel: "Price $",
-      width: u,
+      width: c,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     }),
-    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)),
+    new t("change1h", "1h %", c, void 0, t.bodyRenderer(e)),
+    new t("change24h", "24h %", c, void 0, t.bodyRenderer(e)),
+    new t("change7d", "7d %", c, void 0, t.bodyRenderer(e)),
     t.create({
       property: "marketCapUsd",
       headerLabel: "Market Cap",
-      width: _,
+      width: I,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       bodyRenderer: r
     }),
     t.create({
       headerLabel: "Volumne (24h)",
-      width: k,
+      width: Z,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       bodyRenderer: m
@@ -2855,15 +2855,15 @@ function Ir() {
     t.create({
       property: "circulatingSupply",
       headerLabel: "Circulating Supply",
-      width: P,
+      width: L,
       bodyRenderer: s,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     })
   ];
-  p.forEach((l) => l.sortable = () => !0);
+  p.forEach((u) => u.sortable = () => !0);
   const d = {
-    ...new N(),
+    ...new f(),
     hoverColumnVisible: !1,
     verticalBorderVisible: !1,
     defaultRowHeights: {
@@ -2872,8 +2872,8 @@ function Ir() {
       footer: 0
     }
   };
-  return new f(
-    b.createTableModel({
+  return new o(
+    N.createTableModel({
       rows: a,
       columnDefs: p,
       tableOptions: d
@@ -2881,7 +2881,7 @@ function Ir() {
     d
   );
 }
-function Rr(a = 1e3, e = 1e3) {
+function jr(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(
@@ -2889,7 +2889,7 @@ function Rr(a = 1e3, e = 1e3) {
   ), m = Array.from(Array(2).keys()).map(
     (s) => Array.from(Array(e).keys()).map((i) => `F${s}/${i}`)
   );
-  return b.createTableModel({
+  return N.createTableModel({
     headerData: n,
     bodyData: r,
     footerData: m,
@@ -2898,7 +2898,7 @@ function Rr(a = 1e3, e = 1e3) {
     fixedRightColumnCount: 2
   });
 }
-const Fe = [
+const je = [
   {
     id: 0,
     preName: "Prename0",
@@ -164772,9 +164772,9 @@ const Fe = [
     friends: []
   }
 ];
-function Or() {
+function Xr() {
   const a = {
-    ...new N(),
+    ...new f(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -164785,17 +164785,17 @@ function Or() {
     // <-- true: we will see the checkbox IN the first column after the arrow
   }, e = [
     // new CheckboxColumn(), //  <--- not needed, because we have 'showCheckboxWihoutExtraColumn:true'
-    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({
+    new t("lastName", "Last Name", new l(250, "px")),
+    new t("preName", "Pre Name", new l(120, "px")),
+    new t("birth", "Birthday", new l(100, "px"), new D(), new D(void 0, new O(), void 0), void 0, void 0),
+    new t("gender", " ", new l(50, "px"), new D(), new D(void 0, new ue(), void 0), void 0, void 0),
+    new t("address.street", "Strasse", new l(150, "px")),
+    new t("address.number", "Nr", new l(70, "px")),
+    new t("address.zip", "Zip", new l(60, "px")),
+    new t("address.city", "City", new l(120, "px")),
+    new t("id", "ID", new l(60, "px"))
+  ], r = ce.buildTreeRows(je, "friends");
+  return N.createTableModel({
     rows: r,
     columnDefs: e,
     tableOptions: a,
@@ -164803,7 +164803,7 @@ function Or() {
     fixedRightColumnCount: 0
   });
 }
-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
+const J = new Ze(34, 50, 0), Q = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "), Xe = `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
@@ -164814,38 +164814,38 @@ const j = new oe(34, 50, 0), X = "_ 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(
   (a) => a.split(" ").map((e) => Number(e))
-), Ee = 27.9, _e = 77.4;
-class J {
+), Je = 27.9, Qe = 77.4;
+class ee {
   constructor(e, r, n) {
     this.r = e, this.g = r, this.b = n;
   }
 }
-function Ke(a, e, r, n, m) {
+function er(a, e, r, n, m) {
   return (a - e) / (r - e) * (m - n) + n;
 }
-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;
+function rr(a, e, r) {
+  var n = new ee(255, 0, 0), m = new ee(0, 0, 255), s = er(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 Hr() {
-  const a = new M("body", $e, j.body), e = new Array(X.length).fill(50), r = new M("header", [X], j.header);
+function Jr() {
+  const a = new B("body", Xe, J.body), e = new Array(Q.length).fill(50), r = new B("header", [Q], J.header);
   return a.getCustomStyleAt = (n, m) => {
     let s = {};
     if (m > 0) {
       const i = a.getValueAt(n, m);
       s = {
-        background: We(Ee, _e, i),
+        background: rr(Je, Qe, i),
         color: "#fff"
       };
     }
     return s.paddingTop = "10px", s;
-  }, b.createTableModel({
+  }, N.createTableModel({
     headerAreaModel: r,
     bodyAreaModel: a,
     columnSizes: e
   });
 }
-function Ye() {
+function ar() {
   return [
     {
       date: "2010-01-01T01:00:00",
@@ -217403,12 +217403,12 @@ function Ye() {
     }
   ];
 }
-const Ne = 30, je = 3, fe = Ye(), h = {};
-fe.forEach((a) => {
+const Ce = 30, tr = 3, Le = ar(), C = {};
+Le.forEach((a) => {
   const [e, r] = a.date.split("T");
-  h[e] || (h[e] = {}), h[e][r.substring(0, 5)] = a;
+  C[e] || (C[e] = {}), C[e][r.substring(0, 5)] = a;
 });
-const E = Object.keys(h), x = [
+const W = Object.keys(C), x = [
   "06:00",
   "07:00",
   "08:00",
@@ -217434,28 +217434,28 @@ const E = Object.keys(h), x = [
   "04:00",
   "05:00"
 ];
-function Xe() {
+function nr() {
   let a = 10, e = 0;
-  return fe.forEach((r) => {
+  return Le.forEach((r) => {
     a = Math.min(a, r.temperature), e = Math.max(e, r.temperature);
   }), [a, e];
 }
-const [Q, ee] = Xe();
-function Vr() {
-  const a = new Je(), e = new Qe(), r = [60, ...new Array(E.length).fill(je)];
-  return b.createTableModel({
+const [re, ae] = nr();
+function Qr() {
+  const a = new mr(), e = new sr(), r = [60, ...new Array(W.length).fill(tr)];
+  return N.createTableModel({
     bodyAreaModel: a,
     footerAreaModel: e,
     columnSizes: r,
     fixedLeftColumnCount: 1
   });
 }
-class Je extends K {
+class mr extends Y {
   getRowCount() {
     return x.length;
   }
   getRowHeight(e) {
-    return Ne;
+    return Ce;
   }
   getValueAt(e, r) {
     return r === 0 ? x[e] : "";
@@ -217464,29 +217464,29 @@ class Je extends K {
     if (r === 0)
       return "";
     r--;
-    const n = E[r], m = x[e];
-    return h[n] && h[n][m] ? `${n} ${m} → ${h[n][m].temperature}` : "";
+    const n = W[r], m = x[e];
+    return C[n] && C[n][m] ? `${n} ${m} → ${C[n][m].temperature}` : "";
   }
   getCustomStyleAt(e, r) {
     if (r === 0)
       return;
     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);
+    const n = W[r], m = x[e];
+    if (!C[n] || !C[n][m]) return;
+    const s = C[n][m].temperature, i = new $(67, 1, 84), p = new $(31, 144, 141), d = new $(250, 230, 37), u = (ae + re) / 2, b = new ze(re, i, u, p, ae, d);
     return {
-      background: Se.getThreeColorGradientRGB(s, T),
+      background: we.getThreeColorGradientRGB(s, b),
       color: "transparent"
       // we only want to show the bg color
     };
   }
 }
-class Qe extends K {
+class sr extends Y {
   getRowCount() {
     return 1;
   }
   getRowHeight(e) {
-    return Ne;
+    return Ce;
   }
   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" : "";
@@ -217503,7 +217503,7 @@ class Qe extends K {
     };
   }
 }
-const V = [
+const F = [
   {
     data: "Gold",
     toggle: !0,
@@ -217590,9 +217590,9 @@ const V = [
     ]
   }
 ];
-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));
+function ea() {
+  const e = A.buildGroupExts(F), r = A.buildColumnDefs(e), n = new le("header", F, r, 34);
+  console.info("headerGroups", F), console.info("columnDefs", r.map((i) => i.property));
   const m = [
     {
       GOLD: 146,
@@ -217610,14 +217610,14 @@ function Fr() {
       HOH_C: 53,
       HOH_D: 54
     }
-  ], s = new W("body", m, r, 34);
-  return b.createTableModel({
+  ], s = new j("body", m, r, 34);
+  return N.createTableModel({
     headerAreaModel: n,
     bodyAreaModel: s,
     columnDefs: r
   });
 }
-const er = [
+const ir = [
   {
     data: "Team A",
     toggle: !0,
@@ -217638,8 +217638,8 @@ const er = [
     ]
   }
 ];
-function $r(a = er) {
-  const r = A.buildGroupExts(a), n = A.buildColumnDefs(r), m = new se("header", a, n, 34);
+function ra(a = ir) {
+  const r = A.buildGroupExts(a), n = A.buildColumnDefs(r), m = new le("header", a, n, 34);
   console.info("headerGroups", a), console.info("columnDefs", n.map((p) => p.property)), console.info("columnDefs", n);
   const s = [
     {
@@ -217648,14 +217648,14 @@ function $r(a = er) {
       peter: 5,
       paul: 4
     }
-  ], i = new W("body", s, n, 34);
-  return b.createTableModel({
+  ], i = new j("body", s, n, 34);
+  return N.createTableModel({
     headerAreaModel: m,
     bodyAreaModel: i,
     columnDefs: n
   });
 }
-function rr() {
+function dr() {
   return [
     {
       id: 1,
@@ -217835,35 +217835,35 @@ function rr() {
     }
   ];
 }
-function ar() {
+function yr() {
   return [
     new t("firstName", "First Name", g),
     new t("lastName", "Last Name"),
     t.create({
       property: "gender",
       headerLabel: "Gender",
-      width: u,
+      width: c,
       bodyClasses: ["ge-table-text-align-left"]
     }),
     t.create({
       property: "email",
       headerLabel: "Email",
-      width: ie,
+      width: ge,
       bodyClasses: ["ge-table-text-align-left"]
     }),
-    new t("ipAddress", "IP", de),
+    new t("ipAddress", "IP", be),
     t.create({
       property: "id",
       headerLabel: "ID",
-      width: Ce,
+      width: ve,
       // bodyRenderer: actionRenderer,
       bodyClasses: ["ge-table-text-align-left"]
     })
   ];
 }
-function tr() {
+function pr() {
   return {
-    ...new N(),
+    ...new f(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 40,
@@ -217872,19 +217872,19 @@ function tr() {
     }
   };
 }
-function Er() {
-  const a = tr(), e = rr(), r = ar();
-  return b.createTableModel({
+function aa() {
+  const a = pr(), e = dr(), r = yr();
+  return N.createTableModel({
     rows: e,
     columnDefs: r,
     tableOptions: a,
     fixedLeftColumnCount: 0
   });
 }
-function _r(a, e) {
-  a.rendererMap = new v(void 0, e, void 0);
+function ta(a, e) {
+  a.rendererMap = new D(void 0, e, void 0);
 }
-const nr = [
+const ur = [
   {
     id: 1,
     city: "London",
@@ -218032,36 +218032,36 @@ const nr = [
     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)), 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")),
+].map((a) => (a.updatedAt = /* @__PURE__ */ new Date(), a)), R = [
+  new t("city", "City", new l(90, "px")),
+  new t("location", "Location", new l(100, "px")),
+  new t("team.name", "Team", new l(100, "px")),
   t.create({
     property: "team.active",
     headerLabel: "Active",
-    width: new c(60, "px"),
-    bodyRenderer: new ye()
+    width: new l(60, "px"),
+    bodyRenderer: new Ne()
   }),
-  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")),
+  new t("data.0", "00", new l(60, "px")),
+  new t("data.1", "15", new l(60, "px")),
+  new t("data.2", "30", new l(60, "px")),
+  new t("data.3", "45", new l(60, "px")),
+  new t("data.4", "00", new l(60, "px")),
+  new t("data.5", "15", new l(60, "px")),
+  new t("data.6", "30", new l(60, "px")),
+  new t("data.7", "45", new l(60, "px")),
+  new t("data.8", "00", new l(60, "px")),
+  new t("data.9", "15", new l(60, "px")),
+  new t("data.10", "30", new l(60, "px")),
+  new t("data.11", "45", new l(60, "px")),
   t.create({
     property: "updatedAt",
     headerLabel: "Updated at",
-    width: new c(175, "px"),
-    bodyRenderer: new Le()
+    width: new l(175, "px"),
+    bodyRenderer: new ke()
   })
-], Kr = I.length - 1, mr = {
-  ...new N(),
+], na = R.length - 1, cr = {
+  ...new f(),
   hoverRowVisible: !1,
   hoverColumnVisible: !1,
   defaultRowHeights: {
@@ -218072,22 +218072,22 @@ const nr = [
   columnsDraggable: !1,
   columnsResizable: !0
 };
-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,
+function ma() {
+  const a = cr.defaultRowHeights;
+  return N.createTableModel({
+    headerAreaModel: new gr(a.header),
+    bodyAreaModel: new lr(a.body),
+    footerAreaModel: new br(a.footer),
+    columnDefs: R,
     fixedLeftColumnCount: 2,
     fixedRightColumnCount: 1,
     defaultRowHeights: a,
-    columnCount: I.length
+    columnCount: R.length
   });
 }
-class sr extends W {
+class lr extends j {
   constructor(e) {
-    super("body", nr, I, e);
+    super("body", ur, R, e);
   }
   getRowspanAt(e, r) {
     if (r === 0 || r == 1) {
@@ -218104,7 +218104,7 @@ class sr extends W {
     return m;
   }
 }
-class ir extends M {
+class gr extends B {
   constructor(e) {
     super(
       "header",
@@ -218131,7 +218131,7 @@ class ir extends M {
     return ["ge-font-weight-bold"];
   }
 }
-class dr extends M {
+class br extends B {
   constructor(e) {
     super(
       "footer",
@@ -218146,7 +218146,7 @@ class dr extends M {
     return r === 2 ? ["ge-text-align-right", "ge-font-weight-bold"] : [];
   }
 }
-const yr = [
+const Nr = [
   {
     id: "c8-34f1d5",
     company: "Equicom",
@@ -220084,10 +220084,10 @@ const yr = [
     rating: 5
   }
 ];
-function pr() {
-  return yr;
+function fr() {
+  return Nr;
 }
-function ur() {
+function Tr() {
   return [
     t.create({
       property: "company",
@@ -220100,7 +220100,7 @@ function ur() {
     t.create({
       property: "country",
       headerLabel: "Country",
-      width: P,
+      width: L,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       sortable: y
@@ -220116,8 +220116,8 @@ function ur() {
     t.create({
       property: "sellDate",
       headerLabel: "Sell date",
-      width: u,
-      bodyRenderer: new R(),
+      width: c,
+      bodyRenderer: new O(),
       bodyClasses: ["ge-table-text-align-center"],
       sortable: y
     }),
@@ -220131,15 +220131,15 @@ function ur() {
     t.create({
       property: "inStock",
       headerLabel: "In stock",
-      width: Z,
-      bodyRenderer: new pe("inStock", !0, !0),
+      width: z,
+      bodyRenderer: new fe("inStock", !0, !0),
       bodyClasses: ["ge-table-text-align-center"],
       sortable: y
     }),
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: L,
+      width: P,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       sortable: y
@@ -220147,25 +220147,25 @@ function ur() {
     t.create({
       property: "progress",
       headerLabel: "Progress",
-      width: u,
-      bodyRenderer: new ue("progress", 5, !0),
+      width: c,
+      bodyRenderer: new Te("progress", 5, !0),
       bodyClasses: ["ge-table-text-align-left"],
       sortable: y
     }),
     t.create({
       property: "rating",
       headerLabel: "Rating",
-      width: u,
-      bodyRenderer: new ce("rating"),
+      width: c,
+      bodyRenderer: new oe("rating"),
       bodyClasses: ["ge-table-text-align-left"],
       sortable: y
     })
   ];
 }
-function cr() {
-  const a = new C("row", "multi");
+function or() {
+  const a = new h("row", "multi");
   return {
-    ...new N(),
+    ...new f(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 24,
@@ -220175,10 +220175,10 @@ function cr() {
     getSelectionModel: () => a
   };
 }
-function Yr() {
-  const a = cr(), e = pr(), r = ur();
-  return new f(
-    b.createTableModel({
+function sa() {
+  const a = or(), e = fr(), r = Tr();
+  return new o(
+    N.createTableModel({
       rows: e,
       columnDefs: r,
       tableOptions: a,
@@ -220187,34 +220187,34 @@ function Yr() {
     a
   );
 }
-function re() {
+function te() {
   return [
     t.create({
       headerLabel: "ID",
       width: g,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: F
+      sortable: _
     }),
     t.create({
       headerLabel: "Value",
-      width: k,
+      width: Z,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: F
+      sortable: _
     }),
     t.create({
       headerLabel: " ",
-      width: k,
+      width: Z,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     })
   ];
 }
-function lr() {
-  const a = new C();
+function hr() {
+  const a = new h();
   return {
-    ...new N(),
+    ...new f(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 34,
@@ -220224,22 +220224,22 @@ function lr() {
     getSelectionModel: () => a
   };
 }
-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({
+function ia(a = 1e6, e = !1) {
+  const r = hr(), n = e ? [new xe({ format: (i) => i.toLocaleString("en-US") }), ...te()] : te(), m = e ? 1 : 0, s = new Sr(a, m);
+  return new o(N.createTableModel({
     bodyAreaModel: s,
     columnDefs: n,
     tableOptions: r,
     fixedLeftColumnCount: m
   }), r);
 }
-class gr extends K {
+class Sr extends Y {
   /**
    * @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);
+    super(), this.rowcount = e, this.columnOffset = r, this.nf = new Intl.NumberFormat("en-Us", {}), this.barRenderer = new De(e, !1);
   }
   getRowCount() {
     return this.rowcount;
@@ -220261,7 +220261,7 @@ class gr extends K {
     return e * this.getRowHeight(0);
   }
 }
-const br = [
+const Cr = [
   {
     id: "f0-bfbecb",
     company: "Medmex",
@@ -221733,15 +221733,15 @@ const br = [
     f2: 28.55122067
   }
 ];
-function Nr(a = 75) {
-  return br.slice(0, a - 1);
+function Lr(a = 75) {
+  return Cr.slice(0, a - 1);
 }
-function fr(a) {
+function Pr(a) {
   return [
     t.create({
       property: "company",
       headerLabel: "Company",
-      width: u,
+      width: c,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       sortable: y,
@@ -221750,7 +221750,7 @@ function fr(a) {
     t.create({
       property: "country",
       headerLabel: "Country",
-      width: P,
+      width: L,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       sortable: y,
@@ -221759,7 +221759,7 @@ function fr(a) {
     t.create({
       property: "product",
       headerLabel: "Name",
-      width: u,
+      width: c,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       sortable: y,
@@ -221768,7 +221768,7 @@ function fr(a) {
     t.create({
       property: "birthday",
       headerLabel: "Birth Date",
-      width: u,
+      width: c,
       bodyClasses: ["ge-table-text-align-center"],
       sortable: y,
       editable: () => a
@@ -221776,8 +221776,8 @@ function fr(a) {
     t.create({
       property: "sellDate",
       headerLabel: "Sell date",
-      width: u,
-      bodyRenderer: new R(),
+      width: c,
+      bodyRenderer: new O(),
       bodyClasses: ["ge-table-text-align-center"],
       sortable: y,
       editable: () => a
@@ -221785,7 +221785,7 @@ function fr(a) {
     t.create({
       property: "lastVisit",
       headerLabel: "Last Visit",
-      width: le,
+      width: he,
       bodyClasses: ["ge-table-text-align-center"],
       sortable: y,
       editable: () => a
@@ -221793,7 +221793,7 @@ function fr(a) {
     t.create({
       property: "time",
       headerLabel: "Time",
-      width: u,
+      width: c,
       bodyClasses: ["ge-table-text-align-center"],
       sortable: y,
       editable: () => a
@@ -221808,8 +221808,8 @@ function fr(a) {
     t.create({
       property: "inStock",
       headerLabel: "In stock",
-      width: Z,
-      bodyRenderer: new pe("inStock", !0, !0),
+      width: z,
+      bodyRenderer: new fe("inStock", !0, !0),
       bodyClasses: ["ge-table-text-align-center"],
       sortable: y,
       editable: () => a
@@ -221817,7 +221817,7 @@ function fr(a) {
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: L,
+      width: P,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       sortable: y,
@@ -221826,23 +221826,23 @@ function fr(a) {
     t.create({
       property: "progress",
       headerLabel: "Progress",
-      width: u,
-      bodyRenderer: new ue("progress", 5, !0),
+      width: c,
+      bodyRenderer: new Te("progress", 5, !0),
       bodyClasses: ["ge-table-text-align-left"],
       sortable: y
     }),
     t.create({
       property: "rating",
       headerLabel: "Rating",
-      width: u,
-      bodyRenderer: new ce("rating"),
+      width: c,
+      bodyRenderer: new oe("rating"),
       bodyClasses: ["ge-table-text-align-left"],
       sortable: y
     }),
     t.create({
       property: "price",
       headerLabel: "Price",
-      width: L,
+      width: P,
       bodyClasses: ["ge-table-text-align-right"],
       sortable: y,
       editable: () => a
@@ -221850,22 +221850,22 @@ function fr(a) {
     t.create({
       property: "active",
       headerLabel: "Active",
-      width: L,
-      bodyRenderer: new ye(),
+      width: P,
+      bodyRenderer: new Ne(),
       sortable: y,
       editable: () => a
     }),
     t.create({
       property: "currency",
       headerLabel: "CCY",
-      width: L,
+      width: P,
       sortable: y,
       editable: () => a
     }),
     t.create({
       property: "average",
       headerLabel: "Average",
-      width: u,
+      width: c,
       bodyClasses: ["ge-table-text-align-right"],
       sortable: y,
       editable: () => a
@@ -221873,9 +221873,9 @@ function fr(a) {
     t.create({
       property: "f1",
       headerLabel: "F1",
-      width: ge,
+      width: Se,
       bodyClasses: ["ge-table-text-align-right"],
-      bodyRenderer: new Ze(),
+      bodyRenderer: new Ue(),
       sortable: y,
       editable: () => a
     }),
@@ -221890,16 +221890,16 @@ function fr(a) {
     t.create({
       property: "lorem",
       headerLabel: "Lorem",
-      width: k,
+      width: Z,
       bodyClasses: ["ge-table-text-align-left"],
       sortable: y,
       editable: () => a
     })
   ];
 }
-function Tr(a) {
+function Gr(a) {
   return {
-    ...new N(),
+    ...new f(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 32,
@@ -221909,17 +221909,17 @@ function Tr(a) {
     getSelectionModel: () => a
   };
 }
-function Xr(a = new C("row", "multi"), e = 75, r = !1) {
-  const n = Tr(a);
+function da(a = new h("row", "multi"), e = 75, r = !1) {
+  const n = Gr(a);
   e = Math.max(10, Math.min(75, e));
-  const m = Nr(e), s = fr(r);
-  return new f(b.createTableModel({
+  const m = Lr(e), s = Pr(r);
+  return new o(N.createTableModel({
     rows: m,
     columnDefs: s,
     tableOptions: n
   }), n);
 }
-const or = [
+const Zr = [
   ["Germany", "Hamburg"],
   ["Germany", "Berlin"],
   ["Germany", "Munich"],
@@ -221932,7 +221932,7 @@ const or = [
   ["Spain", "Madrid"],
   ["Poland", "Warsaw"],
   ["Denmark", "Copenhagen"]
-], hr = [
+], zr = [
   ["Laptop", "Hardware", 1299],
   ["Monitor", "Hardware", 349],
   ["Keyboard", "Accessories", 89],
@@ -221942,70 +221942,70 @@ const or = [
   ["Cloud Credits", "Services", 500],
   ["Support Plan", "Services", 990]
 ];
-function Sr(a) {
+function wr(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);
+function V(a, e = 42) {
+  const r = wr(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 };
+    const [i, p] = n(Zr), [d, u, b] = n(zr), T = 1 + Math.floor(r() * 20), w = Math.round(b * (0.85 + r() * 0.3) * 100) / 100;
+    m[s] = { id: s + 1, country: i, city: p, product: d, category: u, quantity: T, price: w, total: Math.round(T * w * 100) / 100 };
   }
   return m;
 }
 const U = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"], sortable: y };
-function Te() {
+function Pe() {
   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 })
+    t.create({ property: "id", headerLabel: "Order", width: c, ...U }),
+    t.create({ property: "country", headerLabel: "Country", width: L, sortable: y }),
+    t.create({ property: "city", headerLabel: "City", width: L, sortable: y }),
+    t.create({ property: "product", headerLabel: "Product", width: I, sortable: y }),
+    t.create({ property: "category", headerLabel: "Category", width: L, sortable: y }),
+    t.create({ property: "quantity", headerLabel: "Qty", width: c, ...U }),
+    t.create({ property: "price", headerLabel: "Ø Price", width: K, ...U }),
+    t.create({ property: "total", headerLabel: "Total", width: L, ...U })
   ];
 }
-function Jr(a = 5e4, e = ["country", "city"], r = 1) {
-  const n = new C("row", "multi"), m = {
-    ...new N(),
+function ya(a = 5e4, e = ["country", "city"], r = 1) {
+  const n = new h("row", "multi"), m = {
+    ...new f(),
     hoverColumnVisible: !1,
     getSelectionModel: () => n
-  }, s = ze.createTableModel({
-    rows: O(a),
-    columnDefs: Te(),
+  }, s = qe.createTableModel({
+    rows: V(a),
+    columnDefs: Pe(),
     groupBy: e,
     aggregations: { quantity: "sum", price: "avg", total: "sum" },
     expanded: r,
     tableOptions: m
   });
-  return new f(s, m);
+  return new o(s, m);
 }
-const Cr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-class Lr {
+const vr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+class kr {
   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);
+      const u = p.createElement("div");
+      p.addClass(u, "ge-table-label"), p.appendChild(u, p.createText(vr.format(i))), p.appendChild(d, u), p.appendChild(e, d);
     }
   }
 }
-function Qr(a = 5e4) {
-  const e = new C("range", "multi"), r = {
-    ...new N(),
+function pa(a = 5e4) {
+  const e = new h("range", "multi"), r = {
+    ...new f(),
     hoverColumnVisible: !1,
     getSelectionModel: () => e
-  }, n = Te(), m = new Lr();
+  }, n = Pe(), m = new kr();
   for (const i of n)
     (i.property === "price" || i.property === "total") && (i.rendererMap.body = m);
-  const s = b.createTableModel({
-    rows: O(a),
+  const s = N.createTableModel({
+    rows: V(a),
     columnDefs: n,
     footerAggregates: {
       rows: [
@@ -222021,35 +222021,35 @@ function Qr(a = 5e4) {
     },
     tableOptions: r
   });
-  return new f(s, r);
+  return new o(s, r);
 }
-function Pr(a) {
+function Dr(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) => ({
+function xr(a, e = 42) {
+  const r = Dr(e + 1), n = Date.UTC(2024, 0, 1), m = 3 * 365 + 1;
+  return V(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 = {
+const Ur = { name: "year", label: "Year", value: (a) => Number(a.date.slice(0, 4)) }, qr = {
   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(),
+function ua(a = 5e4, e = [Ur, qr], r = 0) {
+  const n = new h("range", "multi"), m = {
+    ...new f(),
     hoverColumnVisible: !1,
     getSelectionModel: () => n
-  }, s = we.createTableModel({
-    rows: Gr(a),
+  }, s = Me.createTableModel({
+    rows: xr(a),
     rowFields: [{ value: "country", label: "Country" }, { value: "city", label: "City" }],
     columnFields: e,
     values: [
@@ -222061,24 +222061,24 @@ function ea(a = 5e4, e = [Zr, zr], r = 0) {
     groupColumn: { showCount: !1 },
     tableOptions: m
   });
-  return new f(s, m);
+  return new o(s, m);
 }
-const wr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-class vr {
+const Mr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+class Br {
   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);
+    const u = p.createElement("div");
+    p.addClass(u, "ge-table-label");
+    const b = typeof i == "number" ? Mr.format(i) : `${i}`;
+    p.appendChild(u, p.createText(b)), p.appendChild(d, u), p.appendChild(e, d);
   }
 }
-function kr(a, e = 8) {
+function Ar(a, e = 8) {
   const r = [0, 0, 0, 5, 5, 10, 15];
-  return O(a, e).map((n, m) => ({
+  return V(a, e).map((n, m) => ({
     id: n.id,
     country: n.country,
     product: n.product,
@@ -222087,23 +222087,23 @@ function kr(a, e = 8) {
     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 = {
+const S = { 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();
+function Rr(a = q.custom) {
+  const e = new Br();
   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: "id", headerLabel: "Line", width: z, ...S, sortable: y }),
+    t.create({ property: "country", headerLabel: "Country", width: Be, sortable: y }),
+    t.create({ property: "product", headerLabel: "Product", width: I, sortable: y }),
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: Z,
-      ...o,
+      width: z,
+      ...S,
       sortable: y,
       editable: y,
       editInputPipe: G
@@ -222111,8 +222111,8 @@ function Dr(a = q.custom) {
     t.create({
       property: "price",
       headerLabel: "Price",
-      width: $,
-      ...o,
+      width: K,
+      ...S,
       sortable: y,
       editable: y,
       editInputPipe: G,
@@ -222121,8 +222121,8 @@ function Dr(a = q.custom) {
     t.create({
       property: "discount",
       headerLabel: "Disc. %",
-      width: Z,
-      ...o,
+      width: z,
+      ...S,
       sortable: y,
       editable: y,
       editInputPipe: G
@@ -222131,7 +222131,7 @@ function Dr(a = q.custom) {
       property: "net",
       headerLabel: "Net",
       width: g,
-      ...o,
+      ...S,
       sortable: y,
       formula: q.net,
       bodyRenderer: e,
@@ -222140,8 +222140,8 @@ function Dr(a = q.custom) {
     t.create({
       property: "vat",
       headerLabel: "VAT 19%",
-      width: $,
-      ...o,
+      width: K,
+      ...S,
       sortable: y,
       formula: q.vat,
       bodyRenderer: e,
@@ -222151,7 +222151,7 @@ function Dr(a = q.custom) {
       property: "gross",
       headerLabel: "Gross",
       width: g,
-      ...o,
+      ...S,
       sortable: y,
       formula: q.gross,
       bodyRenderer: e,
@@ -222161,7 +222161,7 @@ function Dr(a = q.custom) {
       property: "share",
       headerLabel: "Share of net",
       width: g,
-      ...o,
+      ...S,
       sortable: y,
       formula: "[net]",
       showValuesAs: { mode: "percentOfColumnTotal", fractionDigits: 2 }
@@ -222169,8 +222169,8 @@ function Dr(a = q.custom) {
     t.create({
       property: "rank",
       headerLabel: "Rank",
-      width: Z,
-      ...o,
+      width: z,
+      ...S,
       sortable: y,
       formula: "[gross]",
       showValuesAs: "rank"
@@ -222178,20 +222178,20 @@ function Dr(a = q.custom) {
     t.create({
       property: "custom",
       headerLabel: "Custom formula",
-      width: P,
-      ...o,
+      width: L,
+      ...S,
       sortable: y,
       formula: a
     })
   ];
 }
-function ra(a = 2e3) {
+function ca(a = 2e3) {
   const e = {
-    ...new N(),
+    ...new f(),
     hoverColumnVisible: !1
-  }, r = b.createTableModel({
-    rows: kr(a),
-    columnDefs: Dr(),
+  }, r = N.createTableModel({
+    rows: Ar(a),
+    columnDefs: Rr(),
     footerAggregates: {
       rows: [{ label: (n) => `Sum · ${n.toLocaleString("en-US")} lines`, aggregates: { net: "sum", vat: "sum", gross: "sum" } }],
       labelProperty: "product"
@@ -222199,9 +222199,9 @@ function ra(a = 2e3) {
     fixedLeftColumnCount: 1,
     tableOptions: e
   });
-  return new f(r, e);
+  return new o(r, e);
 }
-const w = [
+const k = [
   "Fix login timeout",
   "Ship row drag",
   "Write release notes",
@@ -222222,45 +222222,45 @@ const w = [
   "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) {
+], ne = ["Anna", "Ben", "Chen", "Dana", "Emil"], me = ["todo", "doing", "todo", "done", "todo"];
+function Ir(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],
+    title: n < k.length ? k[n] : `${k[n % k.length]} #${Math.floor(n / k.length) + 1}`,
+    owner: ne[n % ne.length],
+    status: me[n * 3 % me.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(),
+function la(a = Ir(20, !0), e = {}) {
+  const r = new h("row", "multi"), n = new H("cell"), m = {
+    ...new f(),
     hoverColumnVisible: !1,
     getSelectionModel: () => r,
     getFocusModel: () => n,
     rowDragOptions: e,
     ariaLabel: "Priority list"
-  }, s = b.createTableModel({
+  }, s = N.createTableModel({
     rows: a,
     rowNumbersVisible: { headerLabel: "#" },
     columnDefs: [
-      t.create({ property: "title", headerLabel: "Task", width: ie, rowDrag: (i) => !i.locked }),
+      t.create({ property: "title", headerLabel: "Task", width: ge, rowDrag: (i) => !i.locked }),
       t.create({ property: "owner", headerLabel: "Owner", width: g }),
-      t.create({ property: "status", headerLabel: "Status", width: u }),
+      t.create({ property: "status", headerLabel: "Status", width: c }),
       t.create({
         property: "estimate",
         headerLabel: "Hours",
-        width: u,
+        width: c,
         headerClasses: ["ge-table-text-align-right"],
         bodyClasses: ["ge-table-text-align-right"]
       })
     ],
     tableOptions: m
   });
-  return new f(s, m);
+  return new o(s, m);
 }
-const Ur = [
+const Or = [
   {
     id: 0,
     preName: "Prename0",
@@ -384134,10 +384134,10 @@ const Ur = [
     friends: []
   }
 ];
-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(),
+function Hr(a = !1) {
+  const e = new h("range", "multi");
+  return a && (e.addSelection(new v(0, 0, 0, 2)), e.addSelection(new v(2, 1, 2, 2)), e.addSelection(new v(1, 5, 6, 7)), e.addSelection(new v(0, 8, 0, 8)), e.addSelection(new v(5, 6, 10, 10))), {
+    ...new f(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -384145,7 +384145,7 @@ function qr(a = !1) {
       footer: 0
     },
     autoRestoreOptions: {
-      ...new Be(),
+      ...new Ve(),
       getStorageKeyFn: () => "TreetablePeopleComponent",
       autoRestoreCollapsedExpandedState: !0,
       autoRestoreScrollPosition: !0,
@@ -384155,15 +384155,15 @@ function qr(a = !1) {
     getSelectionModel: () => e
   };
 }
-function Br() {
+function Vr() {
   return [
-    new t("lastName", "Last Name", le),
+    new t("lastName", "Last Name", he),
     new t("preName", "Pre Name", g),
     t.create({
       property: "age",
       headerLabel: "Age",
-      width: ge,
-      bodyRenderer: new ke(),
+      width: Se,
+      bodyRenderer: new Ae(),
       editable: y,
       // editInputPipe: (value: any) => value ? Number(value) : ""
       editInputPipe: G
@@ -384171,47 +384171,47 @@ function Br() {
     new t(
       "birth",
       "Birthday",
-      u,
+      c,
       void 0,
-      De.bodyRenderer(new R())
+      Re.bodyRenderer(new O())
     ),
     t.create({
       property: "gender",
       headerLabel: " ",
-      width: Ue,
-      bodyRenderer: new ne(),
+      width: Oe,
+      bodyRenderer: new ue(),
       editable: y,
-      getEditRenderer: () => new xe([
-        new Y("female", "♀"),
-        new Y("male", "♂")
+      getEditRenderer: () => new Ie([
+        new X("female", "♀"),
+        new X("male", "♂")
       ])
     }),
-    new t("address.street", "Strasse", de),
-    new t("address.number", "Nr", qe),
-    new t("address.zip", "Zip", L),
+    new t("address.street", "Strasse", be),
+    new t("address.number", "Nr", He),
+    new t("address.zip", "Zip", P),
     new t("address.city", "City", g),
     new t("address.country", "Country", g),
-    new t("id", "ID", L)
+    new t("id", "ID", P)
   ];
 }
-function ta(a = !1) {
-  const e = qr(a), r = Br();
+function ga(a = !1) {
+  const e = Hr(a), r = Vr();
   for (const s of r)
     s.sortable = y, s.editable = y;
-  r[0].editable = F;
-  const n = me.buildTreeRows(Ur, "friends"), m = b.createTableModel({
+  r[0].editable = _;
+  const n = ce.buildTreeRows(Or, "friends"), m = N.createTableModel({
     rows: n,
     columnDefs: r,
     tableOptions: e,
     fixedLeftColumnCount: 1,
     fixedRightColumnCount: 1
   });
-  return new f(
+  return new o(
     m,
     e
   );
 }
-const B = [
+const M = [
   ["Desk lamp", "Office"],
   ["Standing desk", "Office"],
   ["Office chair", "Office"],
@@ -384229,13 +384229,13 @@ const B = [
   ["Tea selection", "Kitchen"],
   ["Water bottle", "Kitchen"]
 ];
-function Mr(a = 16) {
+function $r(a = 16) {
   return Array.from({ length: a }, (e, r) => {
-    const [n, m] = B[r % B.length];
+    const [n, m] = M[r % M.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}`,
+      product: r < M.length ? n : `${n} ${Math.floor(r / M.length) + 1}`,
       category: m,
       validFrom: "2026-10-01",
       price: Math.round((5 + (r * r * 37 + r * 11) % 150 + r * 13 % 10 / 10) * 100) / 100,
@@ -384244,22 +384244,22 @@ function Mr(a = 16) {
     };
   });
 }
-function na(a = Mr(), e = !0, r = !0) {
-  const n = new C("range", "multi"), m = new be("cell"), s = {
-    ...new N(),
+function ba(a = $r(), e = !0, r = !0) {
+  const n = new h("range", "multi"), m = new H("cell"), s = {
+    ...new f(),
     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({
+  }, i = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"] }, p = N.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: "sku", headerLabel: "SKU", width: c }),
+      t.create({ property: "product", headerLabel: "Product", width: Z, editable: y }),
+      t.create({ property: "category", headerLabel: "Category", width: c, editable: y }),
       t.create({
         property: "validFrom",
         headerLabel: "Valid from",
@@ -384270,7 +384270,7 @@ function na(a = Mr(), e = !0, r = !0) {
       t.create({
         property: "price",
         headerLabel: "Price",
-        width: u,
+        width: c,
         editable: y,
         editInputPipe: G,
         ...i,
@@ -384279,7 +384279,7 @@ function na(a = Mr(), e = !0, r = !0) {
       t.create({
         property: "discount",
         headerLabel: "Discount %",
-        width: u,
+        width: c,
         editable: y,
         editInputPipe: G,
         ...i,
@@ -384288,14 +384288,14 @@ function na(a = Mr(), e = !0, r = !0) {
       t.create({
         property: "net",
         headerLabel: "Net",
-        width: u,
+        width: c,
         ...i,
         valueGetter: (d) => Math.round(d.price * (100 - d.discount)) / 100
       }),
       t.create({
         property: "stock",
         headerLabel: "Stock",
-        width: u,
+        width: c,
         editable: y,
         editInputPipe: G,
         ...i,
@@ -384304,54 +384304,246 @@ function na(a = Mr(), e = !0, r = !0) {
     ],
     tableOptions: s
   });
-  return new f(p, s);
+  return new o(p, s);
+}
+const se = [
+  "Ada Lovelace",
+  "Alan Turing",
+  "Grace Hopper",
+  "Linus Torvalds",
+  "Margaret Hamilton",
+  "Dennis Ritchie",
+  "Barbara Liskov",
+  "Ken Thompson",
+  "Katherine Johnson",
+  "Tim Berners-Lee"
+], ie = ["Berlin", "Hamburg", "Munich", "Cologne", "Vienna", "Zurich"], de = ["open", "paid", "shipped", "delivered"], ye = [
+  ["Desk lamp", 39.9],
+  ["Standing desk", 499],
+  ["Office chair", 289],
+  ["Monitor arm", 89.5],
+  ["Notebook A5", 4.2],
+  ["USB-C cable", 12.9],
+  ["Keyboard", 79],
+  ["Mouse", 39],
+  ["Webcam", 99],
+  ["Headset", 149],
+  ["Coffee beans", 15.5],
+  ["Water bottle", 19.9]
+];
+function Fr(a = 1e3) {
+  let e = 20261016;
+  const r = () => (e = e * 16807 % 2147483647) / 2147483647, n = [];
+  for (let m = 0; m < a; m++) {
+    const s = [], i = 1 + Math.floor(r() * 8);
+    for (let d = 0; d < i; d++) {
+      const [u, b] = ye[Math.floor(r() * ye.length)];
+      s.push({ sku: `SKU-${String(1 + Math.floor(r() * 900)).padStart(3, "0")}`, product: u, quantity: 1 + Math.floor(r() * 5), unitPrice: b });
+    }
+    const p = 1 + m % 28;
+    n.push({
+      id: m + 1,
+      orderNo: `ORD-${String(10001 + m)}`,
+      customer: se[Math.floor(r() * se.length)],
+      city: ie[m % ie.length],
+      date: `2026-${String(1 + m % 9).padStart(2, "0")}-${String(p).padStart(2, "0")}`,
+      status: de[Math.floor(r() * de.length)],
+      total: Math.round(s.reduce((d, u) => d + u.quantity * u.unitPrice, 0) * 100) / 100,
+      items: s
+    });
+  }
+  return n;
+}
+function Er(a) {
+  return N.createTableModel({
+    rows: a.items,
+    columnDefs: [
+      t.create({ property: "sku", headerLabel: "SKU", width: c }),
+      t.create({ property: "product", headerLabel: "Product", width: Z }),
+      t.create({ property: "quantity", headerLabel: "Qty", width: c, bodyClasses: ["ge-table-text-align-right"] }),
+      t.create({ property: "unitPrice", headerLabel: "Unit price", width: g, bodyClasses: ["ge-table-text-align-right"] })
+    ]
+  });
+}
+function Na(a = Fr(1e5), e = {}) {
+  const r = N.createTableModel({
+    rows: a,
+    columnDefs: [
+      t.create({ property: "orderNo", headerLabel: "Order", width: I }),
+      t.create({ property: "date", headerLabel: "Date", width: g, sortable: () => !0 }),
+      t.create({ property: "customer", headerLabel: "Customer", width: Z, sortable: () => !0 }),
+      t.create({ property: "city", headerLabel: "City", width: g, sortable: () => !0 }),
+      t.create({ property: "status", headerLabel: "Status", width: c }),
+      t.create({ property: "total", headerLabel: "Total", width: g, sortable: () => !0, bodyClasses: ["ge-table-text-align-right"] })
+    ],
+    fixedLeftColumnCount: 1
+  }), n = new H("cell"), m = new h("row", "multi"), s = {
+    ...new f(),
+    hoverColumnVisible: !1,
+    getFocusModel: () => n,
+    getSelectionModel: () => m,
+    ariaLabel: "Orders",
+    masterDetail: {
+      detailHeight: 222,
+      // header + 5 rows, borders, padding of the detail cell
+      detailRenderer: (i, p, d) => {
+        d.createTable({ tableModel: Er(p) });
+      },
+      getRowId: (i) => i.id,
+      ...e
+    }
+  };
+  return new o(r, s);
+}
+const E = [
+  ["الرياض", "السعودية", "RUH"],
+  ["جدة", "السعودية", "JED"],
+  ["مكة", "السعودية", "MKK"],
+  ["الدمام", "السعودية", "DMM"],
+  ["دبي", "الإمارات", "DXB"],
+  ["أبوظبي", "الإمارات", "AUH"],
+  ["الشارقة", "الإمارات", "SHJ"],
+  ["الدوحة", "قطر", "DOH"],
+  ["الكويت", "الكويت", "KWI"],
+  ["المنامة", "البحرين", "BAH"],
+  ["مسقط", "عُمان", "MCT"],
+  ["القاهرة", "مصر", "CAI"],
+  ["الإسكندرية", "مصر", "ALY"],
+  ["عمّان", "الأردن", "AMM"],
+  ["بيروت", "لبنان", "BEY"],
+  ["بغداد", "العراق", "BGW"],
+  ["تونس", "تونس", "TUN"],
+  ["الجزائر", "الجزائر", "ALG"],
+  ["الرباط", "المغرب", "RBA"],
+  ["الدار البيضاء", "المغرب", "CMN"]
+], pe = ["يناير", "فبراير", "مارس", "أبريل", "مايو", "يونيو", "يوليو", "أغسطس", "سبتمبر", "أكتوبر", "نوفمبر", "ديسمبر"];
+function _r(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 Kr(a = 2e3, e = 7) {
+  const r = _r(e);
+  return Array.from({ length: a }, (n, m) => {
+    const [s, i, p] = E[m % E.length], d = 5e3 + Math.round(r() * 25e3), u = () => Math.round(d * (0.7 + r() * 0.6));
+    return {
+      id: m + 1,
+      city: s,
+      country: i,
+      branch: `فرع ${p}-${String(Math.floor(m / E.length) + 1).padStart(2, "0")}`,
+      m1: u(),
+      m2: u(),
+      m3: u(),
+      m4: u(),
+      m5: u(),
+      m6: u(),
+      m7: u(),
+      m8: u(),
+      m9: u(),
+      m10: u(),
+      m11: u(),
+      m12: u()
+    };
+  });
+}
+function fa(a = "rtl", e = Kr()) {
+  const r = new h("range", "multi"), n = new H("cell"), m = {
+    ...new f(),
+    direction: a,
+    hoverColumnVisible: !1,
+    getSelectionModel: () => r,
+    getFocusModel: () => n,
+    ariaLabel: "المبيعات حسب المدينة"
+  }, s = ["ge-table-text-align-right"], i = pe.map((b, T) => t.create({
+    property: `m${T + 1}`,
+    headerLabel: b,
+    width: c,
+    bodyClasses: s,
+    footerClasses: s,
+    sortable: () => !0
+  })), p = [
+    t.create({ property: "city", headerLabel: "المدينة", width: g, sortable: () => !0 }),
+    t.create({ property: "country", headerLabel: "البلد", width: g, sortable: () => !0 }),
+    t.create({ property: "branch", headerLabel: "الفرع", width: L }),
+    ...i,
+    t.create({
+      property: "total",
+      headerLabel: "المجموع",
+      width: g,
+      bodyClasses: s,
+      footerClasses: s,
+      sortable: () => !0,
+      valueGetter: (b) => pe.reduce((T, w, Ge) => T + b[`m${Ge + 1}`], 0)
+    })
+  ], d = Object.fromEntries([...i.map((b) => b.property), "total"].map((b) => [b, "sum"])), u = N.createTableModel({
+    rows: e,
+    columnDefs: p,
+    rowNumbersVisible: !0,
+    fixedLeftColumnCount: 1,
+    // the city stays at the start (right)
+    fixedRightColumnCount: 1,
+    // the total stays at the end (left)
+    footerAggregates: {
+      rows: [{ label: "المجموع", aggregates: d }],
+      labelProperty: "branch"
+    },
+    tableOptions: m
+  });
+  return new o(u, m);
 }
 export {
-  Kr as COL_IDX_UPDATED_AT,
-  Me as ChangePercentageRenderer,
-  Oe as CirculatingSupplyRenderer,
-  He as CoinIconRenderer,
+  na as COL_IDX_UPDATED_AT,
+  $e as ChangePercentageRenderer,
+  Ke as CirculatingSupplyRenderer,
+  We 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
+  Sr as LargeBodyModel,
+  Ee as NameAndSymbolRenderer,
+  Fe as UsdRenderer,
+  _e as Volumn24hRenderer,
+  ta as applyBodyRenderer,
+  pa as createAggregationModelAndOptions,
+  yr as createColumnDefs,
+  Yr as createCryptoModelAndOptions,
+  ca as createFormulaModelAndOptions,
+  ea as createHeadergroupModel,
+  Jr as createHeatMapModel,
+  Qr as createHeatMapSeattleModel,
+  Rr as createInvoiceColumnDefs,
+  ia as createLargeModelAndOptions,
+  da as createManyTypesModelAndOptions,
+  Na as createMasterDetailModelAndOptions,
+  Er as createOrderItemsModel,
+  sa as createOrderModelAndOptions,
+  ua as createPivotModelAndOptions,
+  ba as createPriceListModelAndOptions,
+  la as createRowDragModelAndOptions,
+  ya as createRowGroupModelAndOptions,
+  fa as createRtlCitiesModelAndOptions,
+  Pe as createSalesOrderColumnDefs,
+  aa as createSimplePersonModel,
+  pr as createTableOptions,
+  dr as createTableRows,
+  ra as createTeamHeadergroupModel,
+  ma as createTimeTableModel,
+  Vr as createTreePeopleColumnDefs,
+  ga as createTreePeopleModelAndOptions,
+  Hr as createTreePeopleTableOptions,
+  Ye as cryptoData,
+  ur as data,
+  Ar as generateInvoiceLines,
+  Fr as generateMasterOrders,
+  xr as generatePivotOrders,
+  $r as generatePriceItems,
+  Kr as generateRtlCitySales,
+  V as generateSalesOrders,
+  jr as generateSimpleModel,
+  Ir as generateTasks,
+  Xr as generateTreeCheckboxModel,
+  qr as pivotQuarter,
+  Ur as pivotYear,
+  cr as tableOptions,
+  ir as teamHeaderGroups
 };