@guiexpert/demo-table-models 1.1.104 → 1.1.106

package/index.js

@@ -1,25 +1,25 @@
-import { ColumnDef as t, px60 as P, px120 as g, px100 as c, px160 as R, 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 Ie, SelectCellRenderer as Re, px50 as Oe, ValueLabel as X, px70 as He, CellRange as v, AutoRestoreOptions as Ve, SpreadsheetFactory as $e } from "@guiexpert/table";
-class Fe {
-  render(e, r, n, m, s, i, p) {
+import { ColumnDef as t, px60 as G, px120 as b, px100 as c, px160 as $, px200 as z, px140 as P, TableOptions as T, TableModelAndOptions as o, TableFactory as f, Size as l, AreaObjectMap as D, DateToIntlDDMMYYYYCellRenderer as V, MaleFemaleToIconCellRenderer as Pe, TreeFactory as Ge, DefaultRowHeights as Ie, AreaModelArrayOfArrays as R, AreaModel as re, ColorRgb as j, ThreeColorGradientArg as Re, GeCssColorUtil as Oe, CellgroupFactory as O, AreaModelCellGroups as Ze, AreaModelObjectArrayWithColumndefs as ae, px300 as ze, px150 as we, px250 as He, TrueFalseCellRenderer as ve, DateToTecCellRenderer as $e, SelectionModel as h, TrueFn as p, CheckboxBooleanPropertyCellRenderer as ke, px90 as w, ProgressBarCellRenderer as xe, StarRatingCellRenderer as De, NumberCellProgressBarCellRenderer as Ve, RowNumberColumnDef as Fe, FalseFn as J, px220 as Ue, PositiveAndNegativeNumberRenderer as Ee, px80 as qe, RowGroupFactory as _e, px110 as Q, PivotFactory as Ke, px130 as We, editInputPipeForNumber as Z, FocusModel as F, NumberCellRenderer as je, Renderer as Ye, SelectCellRenderer as Xe, px50 as Je, ValueLabel as me, px70 as Qe, CellRange as k, AutoRestoreOptions as er, SpreadsheetFactory as rr, CoverGridFactory as se } from "@guiexpert/table";
+class ar {
+  render(e, r, n, m, s, i, y) {
     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"));
+      d < 0 ? (e.innerHTML = "▾ " + d.toFixed(2) + "%", y.addClass(e, "ge-positive-text-color")) : (e.innerHTML = "▴ " + d.toFixed(2) + "%", y.addClass(e, "ge-negative-text-color"));
     }
   }
 }
-class Ee {
+class tr {
   constructor() {
     this.formatter = new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" });
   }
-  render(e, r, n, m, s, i, p) {
+  render(e, r, n, m, s, i, y) {
     if (i) {
       const d = Number(i);
       e.innerText = this.formatter.format(d);
     }
   }
 }
-class _e {
-  render(e, r, n, m, s, i, p) {
+class nr {
+  render(e, r, n, m, s, i, y) {
     const d = s.getRowByIndex(r);
     if (d) {
       const u = d.name ?? d.symbol;
@@ -32,50 +32,50 @@ class _e {
     }
   }
 }
-class Ke {
+class mr {
   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) {
+  render(e, r, n, m, s, i, y) {
     const d = s.getRowByIndex(r);
     if (d) {
-      const u = this.formatterUsd.format(d.volUsd), b = this.formatter.format(d.volBtc);
+      const u = this.formatterUsd.format(d.volUsd), g = this.formatter.format(d.volBtc);
       e.innerHTML = `
       <div style="line-height: 1.2;padding: 10px 0 0 10px;">
         ${u}<br>
-        ${b} BTC
+        ${g} BTC
       </div>
       `;
     }
   }
 }
-class We {
+class sr {
   constructor(e = 120) {
     this.maxWidth = e, this.formatter = new Intl.NumberFormat("en-US");
   }
-  render(e, r, n, m, s, i, p) {
+  render(e, r, n, m, s, i, y) {
     const d = s.getRowByIndex(r);
     if (d) {
-      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(`
+      const u = this.formatter.format(d.circulatingSupply), g = d.maxSupply, N = [];
+      if (N.push('<div style="line-height: 1.2;padding: 10px 0 0 10px;">'), N.push(u), N.push("<br>"), g) {
+        const S = this.maxWidth * d.circulatingSupply / g;
+        N.push(`
           <div style="width: ${this.maxWidth}px;height: 5px;background-color: #eee;margin:10px 0 0 10px">
-            <div style="width: ${w}px;height: 5px;background-color: #ccc;"></div>
+            <div style="width: ${S}px;height: 5px;background-color: #ccc;"></div>
           </div>
         `);
       }
-      T.push("</div>"), e.innerHTML = T.join("");
+      N.push("</div>"), e.innerHTML = N.join("");
     }
   }
 }
-class Ye {
-  render(e, r, n, m, s, i, p) {
+class ir {
+  render(e, r, n, m, s, i, y) {
     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 je = [
+const dr = [
   {
     id: 1,
     name: "Bitcoin",
@@ -2810,19 +2810,19 @@ const je = [
     change90d: 12.43943602
   }
 ];
-function Xr() {
-  const a = je, e = new Fe(), r = new Ee(), n = new _e(), m = new Ke(), s = new We(120), i = new Ye(), p = [
+function ua() {
+  const a = dr, e = new ar(), r = new tr(), n = new nr(), m = new mr(), s = new sr(120), i = new ir(), y = [
     t.create({
       property: "symbol",
       headerLabel: "",
-      width: P,
+      width: G,
       bodyClasses: ["ge-table-text-align-left"],
       bodyRenderer: i
     }),
     t.create({
       property: "symbol",
       headerLabel: "Name",
-      width: g,
+      width: b,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
       bodyRenderer: n
@@ -2840,14 +2840,14 @@ function Xr() {
     t.create({
       property: "marketCapUsd",
       headerLabel: "Market Cap",
-      width: R,
+      width: $,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       bodyRenderer: r
     }),
     t.create({
       headerLabel: "Volumne (24h)",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
       bodyRenderer: m
@@ -2855,15 +2855,15 @@ function Xr() {
     t.create({
       property: "circulatingSupply",
       headerLabel: "Circulating Supply",
-      width: L,
+      width: P,
       bodyRenderer: s,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     })
   ];
-  p.forEach((u) => u.sortable = () => !0);
+  y.forEach((u) => u.sortable = () => !0);
   const d = {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     verticalBorderVisible: !1,
     defaultRowHeights: {
@@ -2873,15 +2873,15 @@ function Xr() {
     }
   };
   return new o(
-    N.createTableModel({
+    f.createTableModel({
       rows: a,
-      columnDefs: p,
+      columnDefs: y,
       tableOptions: d
     }),
     d
   );
 }
-function Jr(a = 1e3, e = 1e3) {
+function ca(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 Jr(a = 1e3, e = 1e3) {
   ), m = Array.from(Array(2).keys()).map(
     (s) => Array.from(Array(e).keys()).map((i) => `F${s}/${i}`)
   );
-  return N.createTableModel({
+  return f.createTableModel({
     headerData: n,
     bodyData: r,
     footerData: m,
@@ -2898,7 +2898,7 @@ function Jr(a = 1e3, e = 1e3) {
     fixedRightColumnCount: 2
   });
 }
-const Xe = [
+const yr = [
   {
     id: 0,
     preName: "Prename0",
@@ -164772,9 +164772,9 @@ const Xe = [
     friends: []
   }
 ];
-function Qr() {
+function la() {
   const a = {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -164787,15 +164787,15 @@ function Qr() {
     // new CheckboxColumn(), //  <--- not needed, because we have 'showCheckboxWihoutExtraColumn:true'
     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("birth", "Birthday", new l(100, "px"), new D(), new D(void 0, new V(), void 0), void 0, void 0),
+    new t("gender", " ", new l(50, "px"), new D(), new D(void 0, new Pe(), 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(Xe, "friends");
-  return N.createTableModel({
+  ], r = Ge.buildTreeRows(yr, "friends");
+  return f.createTableModel({
     rows: r,
     columnDefs: e,
     tableOptions: a,
@@ -164803,7 +164803,7 @@ function Qr() {
     fixedRightColumnCount: 0
   });
 }
-const J = new Ze(34, 50, 0), Q = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "), Je = `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 ie = new Ie(34, 50, 0), de = "_ Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "), pr = `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 Ze(34, 50, 0), Q = "_ 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))
-), Qe = 27.9, er = 77.4;
-class ee {
+), ur = 27.9, cr = 77.4;
+class ye {
   constructor(e, r, n) {
     this.r = e, this.g = r, this.b = n;
   }
 }
-function rr(a, e, r, n, m) {
+function lr(a, e, r, n, m) {
   return (a - e) / (r - e) * (m - n) + n;
 }
-function ar(a, e, r) {
-  var n = new ee(255, 0, 0), m = new ee(0, 0, 255), s = rr(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 gr(a, e, r) {
+  var n = new ye(255, 0, 0), m = new ye(0, 0, 255), s = lr(r, a, e, 0, 1), i = m.r - n.r, y = m.g - n.g, d = m.b - n.b;
+  return i = i * s + n.r, y = y * s + n.g, d = d * s + n.b, `rgb(${Math.round(i)}, ${Math.round(y)}, ${Math.round(d)})`;
 }
-function ea() {
-  const a = new B("body", Je, J.body), e = new Array(Q.length).fill(50), r = new B("header", [Q], J.header);
+function ga() {
+  const a = new R("body", pr, ie.body), e = new Array(de.length).fill(50), r = new R("header", [de], ie.header);
   return a.getCustomStyleAt = (n, m) => {
     let s = {};
     if (m > 0) {
       const i = a.getValueAt(n, m);
       s = {
-        background: ar(Qe, er, i),
+        background: gr(ur, cr, i),
         color: "#fff"
       };
     }
     return s.paddingTop = "10px", s;
-  }, N.createTableModel({
+  }, f.createTableModel({
     headerAreaModel: r,
     bodyAreaModel: a,
     columnSizes: e
   });
 }
-function tr() {
+function br() {
   return [
     {
       date: "2010-01-01T01:00:00",
@@ -217403,12 +217403,12 @@ function tr() {
     }
   ];
 }
-const Ce = 30, nr = 3, Le = tr(), C = {};
-Le.forEach((a) => {
+const Me = 30, Nr = 3, Be = br(), L = {};
+Be.forEach((a) => {
   const [e, r] = a.date.split("T");
-  C[e] || (C[e] = {}), C[e][r.substring(0, 5)] = a;
+  L[e] || (L[e] = {}), L[e][r.substring(0, 5)] = a;
 });
-const W = Object.keys(C), x = [
+const ee = Object.keys(L), U = [
   "06:00",
   "07:00",
   "08:00",
@@ -217434,59 +217434,59 @@ const W = Object.keys(C), x = [
   "04:00",
   "05:00"
 ];
-function mr() {
+function fr() {
   let a = 10, e = 0;
-  return Le.forEach((r) => {
+  return Be.forEach((r) => {
     a = Math.min(a, r.temperature), e = Math.max(e, r.temperature);
   }), [a, e];
 }
-const [re, ae] = mr();
-function ra() {
-  const a = new sr(), e = new ir(), r = [60, ...new Array(W.length).fill(nr)];
-  return N.createTableModel({
+const [pe, ue] = fr();
+function ba() {
+  const a = new Tr(), e = new or(), r = [60, ...new Array(ee.length).fill(Nr)];
+  return f.createTableModel({
     bodyAreaModel: a,
     footerAreaModel: e,
     columnSizes: r,
     fixedLeftColumnCount: 1
   });
 }
-class sr extends Y {
+class Tr extends re {
   getRowCount() {
-    return x.length;
+    return U.length;
   }
   getRowHeight(e) {
-    return Ce;
+    return Me;
   }
   getValueAt(e, r) {
-    return r === 0 ? x[e] : "";
+    return r === 0 ? U[e] : "";
   }
   getTooltipAt(e, r) {
     if (r === 0)
       return "";
     r--;
-    const n = W[r], m = x[e];
-    return C[n] && C[n][m] ? `${n} ${m} → ${C[n][m].temperature}` : "";
+    const n = ee[r], m = U[e];
+    return L[n] && L[n][m] ? `${n} ${m} → ${L[n][m].temperature}` : "";
   }
   getCustomStyleAt(e, r) {
     if (r === 0)
       return;
     r--;
-    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);
+    const n = ee[r], m = U[e];
+    if (!L[n] || !L[n][m]) return;
+    const s = L[n][m].temperature, i = new j(67, 1, 84), y = new j(31, 144, 141), d = new j(250, 230, 37), u = (ue + pe) / 2, g = new Re(pe, i, u, y, ue, d);
     return {
-      background: we.getThreeColorGradientRGB(s, b),
+      background: Oe.getThreeColorGradientRGB(s, g),
       color: "transparent"
       // we only want to show the bg color
     };
   }
 }
-class ir extends Y {
+class or extends re {
   getRowCount() {
     return 1;
   }
   getRowHeight(e) {
-    return Ce;
+    return Me;
   }
   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 ir extends Y {
     };
   }
 }
-const F = [
+const Y = [
   {
     data: "Gold",
     toggle: !0,
@@ -217590,9 +217590,9 @@ const F = [
     ]
   }
 ];
-function aa() {
-  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));
+function Na() {
+  const e = O.buildGroupExts(Y), r = O.buildColumnDefs(e), n = new Ze("header", Y, r, 34);
+  console.info("headerGroups", Y), console.info("columnDefs", r.map((i) => i.property));
   const m = [
     {
       GOLD: 146,
@@ -217610,14 +217610,14 @@ function aa() {
       HOH_C: 53,
       HOH_D: 54
     }
-  ], s = new j("body", m, r, 34);
-  return N.createTableModel({
+  ], s = new ae("body", m, r, 34);
+  return f.createTableModel({
     headerAreaModel: n,
     bodyAreaModel: s,
     columnDefs: r
   });
 }
-const dr = [
+const hr = [
   {
     data: "Team A",
     toggle: !0,
@@ -217638,9 +217638,9 @@ const dr = [
     ]
   }
 ];
-function ta(a = dr) {
-  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);
+function fa(a = hr) {
+  const r = O.buildGroupExts(a), n = O.buildColumnDefs(r), m = new Ze("header", a, n, 34);
+  console.info("headerGroups", a), console.info("columnDefs", n.map((y) => y.property)), console.info("columnDefs", n);
   const s = [
     {
       team_a: 0,
@@ -217648,14 +217648,14 @@ function ta(a = dr) {
       peter: 5,
       paul: 4
     }
-  ], i = new j("body", s, n, 34);
-  return N.createTableModel({
+  ], i = new ae("body", s, n, 34);
+  return f.createTableModel({
     headerAreaModel: m,
     bodyAreaModel: i,
     columnDefs: n
   });
 }
-function yr() {
+function Sr() {
   return [
     {
       id: 1,
@@ -217835,9 +217835,9 @@ function yr() {
     }
   ];
 }
-function pr() {
+function Cr() {
   return [
-    new t("firstName", "First Name", g),
+    new t("firstName", "First Name", b),
     new t("lastName", "Last Name"),
     t.create({
       property: "gender",
@@ -217848,22 +217848,22 @@ function pr() {
     t.create({
       property: "email",
       headerLabel: "Email",
-      width: ge,
+      width: ze,
       bodyClasses: ["ge-table-text-align-left"]
     }),
-    new t("ipAddress", "IP", be),
+    new t("ipAddress", "IP", we),
     t.create({
       property: "id",
       headerLabel: "ID",
-      width: ve,
+      width: He,
       // bodyRenderer: actionRenderer,
       bodyClasses: ["ge-table-text-align-left"]
     })
   ];
 }
-function ur() {
+function Lr() {
   return {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 40,
@@ -217872,19 +217872,19 @@ function ur() {
     }
   };
 }
-function na() {
-  const a = ur(), e = yr(), r = pr();
-  return N.createTableModel({
+function Ta() {
+  const a = Lr(), e = Sr(), r = Cr();
+  return f.createTableModel({
     rows: e,
     columnDefs: r,
     tableOptions: a,
     fixedLeftColumnCount: 0
   });
 }
-function ma(a, e) {
+function oa(a, e) {
   a.rendererMap = new D(void 0, e, void 0);
 }
-const cr = [
+const Pr = [
   {
     id: 1,
     city: "London",
@@ -218032,7 +218032,7 @@ const cr = [
     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 = [
+].map((a) => (a.updatedAt = /* @__PURE__ */ new Date(), a)), H = [
   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")),
@@ -218040,7 +218040,7 @@ const cr = [
     property: "team.active",
     headerLabel: "Active",
     width: new l(60, "px"),
-    bodyRenderer: new Ne()
+    bodyRenderer: new ve()
   }),
   new t("data.0", "00", new l(60, "px")),
   new t("data.1", "15", new l(60, "px")),
@@ -218058,10 +218058,10 @@ const cr = [
     property: "updatedAt",
     headerLabel: "Updated at",
     width: new l(175, "px"),
-    bodyRenderer: new ke()
+    bodyRenderer: new $e()
   })
-], sa = I.length - 1, lr = {
-  ...new f(),
+], ha = H.length - 1, Gr = {
+  ...new T(),
   hoverRowVisible: !1,
   hoverColumnVisible: !1,
   defaultRowHeights: {
@@ -218072,22 +218072,22 @@ const cr = [
   columnsDraggable: !1,
   columnsResizable: !0
 };
-function ia() {
-  const a = lr.defaultRowHeights;
-  return N.createTableModel({
-    headerAreaModel: new br(a.header),
-    bodyAreaModel: new gr(a.body),
-    footerAreaModel: new Nr(a.footer),
-    columnDefs: I,
+function Sa() {
+  const a = Gr.defaultRowHeights;
+  return f.createTableModel({
+    headerAreaModel: new zr(a.header),
+    bodyAreaModel: new Zr(a.body),
+    footerAreaModel: new wr(a.footer),
+    columnDefs: H,
     fixedLeftColumnCount: 2,
     fixedRightColumnCount: 1,
     defaultRowHeights: a,
-    columnCount: I.length
+    columnCount: H.length
   });
 }
-class gr extends j {
+class Zr extends ae {
   constructor(e) {
-    super("body", cr, I, e);
+    super("body", Pr, H, e);
   }
   getRowspanAt(e, r) {
     if (r === 0 || r == 1) {
@@ -218104,7 +218104,7 @@ class gr extends j {
     return m;
   }
 }
-class br extends B {
+class zr extends R {
   constructor(e) {
     super(
       "header",
@@ -218131,7 +218131,7 @@ class br extends B {
     return ["ge-font-weight-bold"];
   }
 }
-class Nr extends B {
+class wr extends R {
   constructor(e) {
     super(
       "footer",
@@ -218146,7 +218146,7 @@ class Nr extends B {
     return r === 2 ? ["ge-text-align-right", "ge-font-weight-bold"] : [];
   }
 }
-const fr = [
+const vr = [
   {
     id: "c8-34f1d5",
     company: "Equicom",
@@ -220084,88 +220084,88 @@ const fr = [
     rating: 5
   }
 ];
-function Tr() {
-  return fr;
+function kr() {
+  return vr;
 }
-function or() {
+function xr() {
   return [
     t.create({
       property: "company",
       headerLabel: "Company",
-      width: g,
+      width: b,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "country",
       headerLabel: "Country",
-      width: L,
+      width: P,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "product",
       headerLabel: "Name",
-      width: g,
+      width: b,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "sellDate",
       headerLabel: "Sell date",
       width: c,
-      bodyRenderer: new O(),
+      bodyRenderer: new V(),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "id",
       headerLabel: "Order ID",
-      width: g,
+      width: b,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "inStock",
       headerLabel: "In stock",
-      width: z,
-      bodyRenderer: new fe("inStock", !0, !0),
+      width: w,
+      bodyRenderer: new ke("inStock", !0, !0),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: P,
+      width: G,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "progress",
       headerLabel: "Progress",
       width: c,
-      bodyRenderer: new Te("progress", 5, !0),
+      bodyRenderer: new xe("progress", 5, !0),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "rating",
       headerLabel: "Rating",
       width: c,
-      bodyRenderer: new oe("rating"),
+      bodyRenderer: new De("rating"),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: y
+      sortable: p
     })
   ];
 }
-function hr() {
+function Dr() {
   const a = new h("row", "multi");
   return {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 24,
@@ -220175,10 +220175,10 @@ function hr() {
     getSelectionModel: () => a
   };
 }
-function da() {
-  const a = hr(), e = Tr(), r = or();
+function Ca() {
+  const a = Dr(), e = kr(), r = xr();
   return new o(
-    N.createTableModel({
+    f.createTableModel({
       rows: e,
       columnDefs: r,
       tableOptions: a,
@@ -220187,34 +220187,34 @@ function da() {
     a
   );
 }
-function te() {
+function ce() {
   return [
     t.create({
       headerLabel: "ID",
-      width: g,
+      width: b,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: _
+      sortable: J
     }),
     t.create({
       headerLabel: "Value",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: _
+      sortable: J
     }),
     t.create({
       headerLabel: " ",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"]
     })
   ];
 }
-function Sr() {
+function Ur() {
   const a = new h();
   return {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 34,
@@ -220224,22 +220224,22 @@ function Sr() {
     getSelectionModel: () => a
   };
 }
-function ya(a = 1e6, e = !1) {
-  const r = Sr(), n = e ? [new xe({ format: (i) => i.toLocaleString("en-US") }), ...te()] : te(), m = e ? 1 : 0, s = new Cr(a, m);
-  return new o(N.createTableModel({
+function La(a = 1e6, e = !1) {
+  const r = Ur(), n = e ? [new Fe({ format: (i) => i.toLocaleString("en-US") }), ...ce()] : ce(), m = e ? 1 : 0, s = new qr(a, m);
+  return new o(f.createTableModel({
     bodyAreaModel: s,
     columnDefs: n,
     tableOptions: r,
     fixedLeftColumnCount: m
   }), r);
 }
-class Cr extends Y {
+class qr extends re {
   /**
    * @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 De(e, !1);
+    super(), this.rowcount = e, this.columnOffset = r, this.nf = new Intl.NumberFormat("en-Us", {}), this.barRenderer = new Ve(e, !1);
   }
   getRowCount() {
     return this.rowcount;
@@ -220261,7 +220261,7 @@ class Cr extends Y {
     return e * this.getRowHeight(0);
   }
 }
-const Lr = [
+const Mr = [
   {
     id: "f0-bfbecb",
     company: "Medmex",
@@ -221733,10 +221733,10 @@ const Lr = [
     f2: 28.55122067
   }
 ];
-function Pr(a = 75) {
-  return Lr.slice(0, a - 1);
+function Br(a = 75) {
+  return Mr.slice(0, a - 1);
 }
-function Gr(a) {
+function Ar(a) {
   return [
     t.create({
       property: "company",
@@ -221744,16 +221744,16 @@ function Gr(a) {
       width: c,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "country",
       headerLabel: "Country",
-      width: L,
+      width: P,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
@@ -221762,7 +221762,7 @@ function Gr(a) {
       width: c,
       bodyClasses: ["ge-table-text-align-left"],
       headerClasses: ["ge-table-text-align-left"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
@@ -221770,24 +221770,24 @@ function Gr(a) {
       headerLabel: "Birth Date",
       width: c,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "sellDate",
       headerLabel: "Sell date",
       width: c,
-      bodyRenderer: new O(),
+      bodyRenderer: new V(),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "lastVisit",
       headerLabel: "Last Visit",
-      width: he,
+      width: Ue,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
@@ -221795,71 +221795,71 @@ function Gr(a) {
       headerLabel: "Time",
       width: c,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "id",
       headerLabel: "Order ID",
-      width: g,
+      width: b,
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "inStock",
       headerLabel: "In stock",
-      width: z,
-      bodyRenderer: new fe("inStock", !0, !0),
+      width: w,
+      bodyRenderer: new ke("inStock", !0, !0),
       bodyClasses: ["ge-table-text-align-center"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: P,
+      width: G,
       bodyClasses: ["ge-table-text-align-right"],
       headerClasses: ["ge-table-text-align-right"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "progress",
       headerLabel: "Progress",
       width: c,
-      bodyRenderer: new Te("progress", 5, !0),
+      bodyRenderer: new xe("progress", 5, !0),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "rating",
       headerLabel: "Rating",
       width: c,
-      bodyRenderer: new oe("rating"),
+      bodyRenderer: new De("rating"),
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: y
+      sortable: p
     }),
     t.create({
       property: "price",
       headerLabel: "Price",
-      width: P,
+      width: G,
       bodyClasses: ["ge-table-text-align-right"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "active",
       headerLabel: "Active",
-      width: P,
-      bodyRenderer: new Ne(),
-      sortable: y,
+      width: G,
+      bodyRenderer: new ve(),
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "currency",
       headerLabel: "CCY",
-      width: P,
-      sortable: y,
+      width: G,
+      sortable: p,
       editable: () => a
     }),
     t.create({
@@ -221867,39 +221867,39 @@ function Gr(a) {
       headerLabel: "Average",
       width: c,
       bodyClasses: ["ge-table-text-align-right"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "f1",
       headerLabel: "F1",
-      width: Se,
+      width: qe,
       bodyClasses: ["ge-table-text-align-right"],
-      bodyRenderer: new Ue(),
-      sortable: y,
+      bodyRenderer: new Ee(),
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "f2",
       headerLabel: "F2",
-      width: g,
+      width: b,
       bodyClasses: ["ge-table-text-align-right"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     }),
     t.create({
       property: "lorem",
       headerLabel: "Lorem",
-      width: Z,
+      width: z,
       bodyClasses: ["ge-table-text-align-left"],
-      sortable: y,
+      sortable: p,
       editable: () => a
     })
   ];
 }
-function Zr(a) {
+function Ir(a) {
   return {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 32,
@@ -221909,17 +221909,17 @@ function Zr(a) {
     getSelectionModel: () => a
   };
 }
-function pa(a = new h("row", "multi"), e = 75, r = !1) {
-  const n = Zr(a);
+function Pa(a = new h("row", "multi"), e = 75, r = !1) {
+  const n = Ir(a);
   e = Math.max(10, Math.min(75, e));
-  const m = Pr(e), s = Gr(r);
-  return new o(N.createTableModel({
+  const m = Br(e), s = Ar(r);
+  return new o(f.createTableModel({
     rows: m,
     columnDefs: s,
     tableOptions: n
   }), n);
 }
-const zr = [
+const Rr = [
   ["Germany", "Hamburg"],
   ["Germany", "Berlin"],
   ["Germany", "Munich"],
@@ -221932,7 +221932,7 @@ const zr = [
   ["Spain", "Madrid"],
   ["Poland", "Warsaw"],
   ["Denmark", "Copenhagen"]
-], wr = [
+], Or = [
   ["Laptop", "Hardware", 1299],
   ["Monitor", "Hardware", 349],
   ["Keyboard", "Accessories", 89],
@@ -221942,42 +221942,42 @@ const zr = [
   ["Cloud Credits", "Services", 500],
   ["Support Plan", "Services", 990]
 ];
-function vr(a) {
+function Hr(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 V(a, e = 42) {
-  const r = vr(e), n = (s) => s[Math.floor(r() * s.length)], m = new Array(a);
+function E(a, e = 42) {
+  const r = Hr(e), n = (s) => s[Math.floor(r() * s.length)], m = new Array(a);
   for (let s = 0; s < a; s++) {
-    const [i, p] = n(zr), [d, u, b] = n(wr), 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 };
+    const [i, y] = n(Rr), [d, u, g] = n(Or), N = 1 + Math.floor(r() * 20), S = Math.round(g * (0.85 + r() * 0.3) * 100) / 100;
+    m[s] = { id: s + 1, country: i, city: y, product: d, category: u, quantity: N, price: S, total: Math.round(N * S * 100) / 100 };
   }
   return m;
 }
-const U = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"], sortable: y };
-function Pe() {
+const q = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"], sortable: p };
+function Ae() {
   return [
-    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: R, 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 })
+    t.create({ property: "id", headerLabel: "Order", width: c, ...q }),
+    t.create({ property: "country", headerLabel: "Country", width: P, sortable: p }),
+    t.create({ property: "city", headerLabel: "City", width: P, sortable: p }),
+    t.create({ property: "product", headerLabel: "Product", width: $, sortable: p }),
+    t.create({ property: "category", headerLabel: "Category", width: P, sortable: p }),
+    t.create({ property: "quantity", headerLabel: "Qty", width: c, ...q }),
+    t.create({ property: "price", headerLabel: "Ø Price", width: Q, ...q }),
+    t.create({ property: "total", headerLabel: "Total", width: P, ...q })
   ];
 }
-function ua(a = 5e4, e = ["country", "city"], r = 1) {
+function Ga(a = 5e4, e = ["country", "city"], r = 1) {
   const n = new h("row", "multi"), m = {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     getSelectionModel: () => n
-  }, s = qe.createTableModel({
-    rows: V(a),
-    columnDefs: Pe(),
+  }, s = _e.createTableModel({
+    rows: E(a),
+    columnDefs: Ae(),
     groupBy: e,
     aggregations: { quantity: "sum", price: "avg", total: "sum" },
     expanded: r,
@@ -221985,27 +221985,27 @@ function ua(a = 5e4, e = ["country", "city"], r = 1) {
   });
   return new o(s, m);
 }
-const kr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-class Dr {
-  render(e, r, n, m, s, i, p) {
+const $r = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+class Vr {
+  render(e, r, n, m, s, i, y) {
     if (typeof i == "number") {
-      const d = p.createElement("div");
-      p.addClass(d, "ge-table-label-div");
-      const u = p.createElement("div");
-      p.addClass(u, "ge-table-label"), p.appendChild(u, p.createText(kr.format(i))), p.appendChild(d, u), p.appendChild(e, d);
+      const d = y.createElement("div");
+      y.addClass(d, "ge-table-label-div");
+      const u = y.createElement("div");
+      y.addClass(u, "ge-table-label"), y.appendChild(u, y.createText($r.format(i))), y.appendChild(d, u), y.appendChild(e, d);
     }
   }
 }
-function ca(a = 5e4) {
+function Za(a = 5e4) {
   const e = new h("range", "multi"), r = {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     getSelectionModel: () => e
-  }, n = Pe(), m = new Dr();
+  }, n = Ae(), m = new Vr();
   for (const i of n)
     (i.property === "price" || i.property === "total") && (i.rendererMap.body = m);
-  const s = N.createTableModel({
-    rows: V(a),
+  const s = f.createTableModel({
+    rows: E(a),
     columnDefs: n,
     footerAggregates: {
       rows: [
@@ -222023,33 +222023,33 @@ function ca(a = 5e4) {
   });
   return new o(s, r);
 }
-function xr(a) {
+function Fr(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 Ur(a, e = 42) {
-  const r = xr(e + 1), n = Date.UTC(2024, 0, 1), m = 3 * 365 + 1;
-  return V(a, e).map((s) => ({
+function Er(a, e = 42) {
+  const r = Fr(e + 1), n = Date.UTC(2024, 0, 1), m = 3 * 365 + 1;
+  return E(a, e).map((s) => ({
     ...s,
     date: new Date(n + Math.floor(r() * m) * 864e5).toISOString().slice(0, 10)
   }));
 }
-const qr = { name: "year", label: "Year", value: (a) => Number(a.date.slice(0, 4)) }, Mr = {
+const _r = { name: "year", label: "Year", value: (a) => Number(a.date.slice(0, 4)) }, Kr = {
   name: "quarter",
   label: "Quarter",
   value: (a) => Math.floor((Number(a.date.slice(5, 7)) - 1) / 3) + 1,
   format: (a) => `Q${a}`
 };
-function la(a = 5e4, e = [qr, Mr], r = 0) {
+function za(a = 5e4, e = [_r, Kr], r = 0) {
   const n = new h("range", "multi"), m = {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1,
     getSelectionModel: () => n
-  }, s = Me.createTableModel({
-    rows: Ur(a),
+  }, s = Ke.createTableModel({
+    rows: Er(a),
     rowFields: [{ value: "country", label: "Country" }, { value: "city", label: "City" }],
     columnFields: e,
     values: [
@@ -222057,28 +222057,28 @@ function la(a = 5e4, e = [qr, Mr], r = 0) {
       { value: "id", aggregator: "count", label: "Orders" }
     ],
     expanded: r,
-    valueColumnWidth: g,
+    valueColumnWidth: b,
     groupColumn: { showCount: !1 },
     tableOptions: m
   });
   return new o(s, m);
 }
-const Br = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-class Ar {
-  render(e, r, n, m, s, i, p) {
+const Wr = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+class jr {
+  render(e, r, n, m, s, i, y) {
     if (i == null || i === "")
       return;
-    const d = p.createElement("div");
-    p.addClass(d, "ge-table-label-div");
-    const u = p.createElement("div");
-    p.addClass(u, "ge-table-label");
-    const b = typeof i == "number" ? Br.format(i) : `${i}`;
-    p.appendChild(u, p.createText(b)), p.appendChild(d, u), p.appendChild(e, d);
+    const d = y.createElement("div");
+    y.addClass(d, "ge-table-label-div");
+    const u = y.createElement("div");
+    y.addClass(u, "ge-table-label");
+    const g = typeof i == "number" ? Wr.format(i) : `${i}`;
+    y.appendChild(u, y.createText(g)), y.appendChild(d, u), y.appendChild(e, d);
   }
 }
-function Ir(a, e = 8) {
+function Yr(a, e = 8) {
   const r = [0, 0, 0, 5, 5, 10, 15];
-  return V(a, e).map((n, m) => ({
+  return E(a, e).map((n, m) => ({
     id: n.id,
     country: n.country,
     product: n.product,
@@ -222087,111 +222087,111 @@ function Ir(a, e = 8) {
     discount: r[(m * 7 + n.quantity) % r.length]
   }));
 }
-const S = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"], footerClasses: ["ge-table-text-align-right"] }, q = {
+const C = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"], footerClasses: ["ge-table-text-align-right"] }, M = {
   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 Rr(a = q.custom) {
-  const e = new Ar();
+function Xr(a = M.custom) {
+  const e = new jr();
   return [
-    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: R, sortable: y }),
+    t.create({ property: "id", headerLabel: "Line", width: w, ...C, sortable: p }),
+    t.create({ property: "country", headerLabel: "Country", width: We, sortable: p }),
+    t.create({ property: "product", headerLabel: "Product", width: $, sortable: p }),
     t.create({
       property: "quantity",
       headerLabel: "Qty",
-      width: z,
-      ...S,
-      sortable: y,
-      editable: y,
-      editInputPipe: G
+      width: w,
+      ...C,
+      sortable: p,
+      editable: p,
+      editInputPipe: Z
     }),
     t.create({
       property: "price",
       headerLabel: "Price",
-      width: K,
-      ...S,
-      sortable: y,
-      editable: y,
-      editInputPipe: G,
+      width: Q,
+      ...C,
+      sortable: p,
+      editable: p,
+      editInputPipe: Z,
       bodyRenderer: e
     }),
     t.create({
       property: "discount",
       headerLabel: "Disc. %",
-      width: z,
-      ...S,
-      sortable: y,
-      editable: y,
-      editInputPipe: G
+      width: w,
+      ...C,
+      sortable: p,
+      editable: p,
+      editInputPipe: Z
     }),
     t.create({
       property: "net",
       headerLabel: "Net",
-      width: g,
-      ...S,
-      sortable: y,
-      formula: q.net,
+      width: b,
+      ...C,
+      sortable: p,
+      formula: M.net,
       bodyRenderer: e,
       footerRenderer: e
     }),
     t.create({
       property: "vat",
       headerLabel: "VAT 19%",
-      width: K,
-      ...S,
-      sortable: y,
-      formula: q.vat,
+      width: Q,
+      ...C,
+      sortable: p,
+      formula: M.vat,
       bodyRenderer: e,
       footerRenderer: e
     }),
     t.create({
       property: "gross",
       headerLabel: "Gross",
-      width: g,
-      ...S,
-      sortable: y,
-      formula: q.gross,
+      width: b,
+      ...C,
+      sortable: p,
+      formula: M.gross,
       bodyRenderer: e,
       footerRenderer: e
     }),
     t.create({
       property: "share",
       headerLabel: "Share of net",
-      width: g,
-      ...S,
-      sortable: y,
+      width: b,
+      ...C,
+      sortable: p,
       formula: "[net]",
       showValuesAs: { mode: "percentOfColumnTotal", fractionDigits: 2 }
     }),
     t.create({
       property: "rank",
       headerLabel: "Rank",
-      width: z,
-      ...S,
-      sortable: y,
+      width: w,
+      ...C,
+      sortable: p,
       formula: "[gross]",
       showValuesAs: "rank"
     }),
     t.create({
       property: "custom",
       headerLabel: "Custom formula",
-      width: L,
-      ...S,
-      sortable: y,
+      width: P,
+      ...C,
+      sortable: p,
       formula: a
     })
   ];
 }
-function ga(a = 2e3) {
+function wa(a = 2e3) {
   const e = {
-    ...new f(),
+    ...new T(),
     hoverColumnVisible: !1
-  }, r = N.createTableModel({
-    rows: Ir(a),
-    columnDefs: Rr(),
+  }, r = f.createTableModel({
+    rows: Yr(a),
+    columnDefs: Xr(),
     footerAggregates: {
       rows: [{ label: (n) => `Sum · ${n.toLocaleString("en-US")} lines`, aggregates: { net: "sum", vat: "sum", gross: "sum" } }],
       labelProperty: "product"
@@ -222201,7 +222201,7 @@ function ga(a = 2e3) {
   });
   return new o(r, e);
 }
-const k = [
+const x = [
   "Fix login timeout",
   "Ship row drag",
   "Write release notes",
@@ -222222,31 +222222,31 @@ const k = [
   "Plan Q1 roadmap",
   "Refactor date utils",
   "Security headers"
-], ne = ["Anna", "Ben", "Chen", "Dana", "Emil"], me = ["todo", "doing", "todo", "done", "todo"];
-function Or(a = 20, e = !1) {
+], le = ["Anna", "Ben", "Chen", "Dana", "Emil"], ge = ["todo", "doing", "todo", "done", "todo"];
+function Jr(a = 20, e = !1) {
   return Array.from({ length: a }, (r, n) => ({
     id: n + 1,
-    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],
+    title: n < x.length ? x[n] : `${x[n % x.length]} #${Math.floor(n / x.length) + 1}`,
+    owner: le[n % le.length],
+    status: ge[n * 3 % ge.length],
     estimate: 1 + n * 7 % 13,
     locked: e && n === 0
   }));
 }
-function ba(a = Or(20, !0), e = {}) {
-  const r = new h("row", "multi"), n = new H("cell"), m = {
-    ...new f(),
+function va(a = Jr(20, !0), e = {}) {
+  const r = new h("row", "multi"), n = new F("cell"), m = {
+    ...new T(),
     hoverColumnVisible: !1,
     getSelectionModel: () => r,
     getFocusModel: () => n,
     rowDragOptions: e,
     ariaLabel: "Priority list"
-  }, s = N.createTableModel({
+  }, s = f.createTableModel({
     rows: a,
     rowNumbersVisible: { headerLabel: "#" },
     columnDefs: [
-      t.create({ property: "title", headerLabel: "Task", width: ge, rowDrag: (i) => !i.locked }),
-      t.create({ property: "owner", headerLabel: "Owner", width: g }),
+      t.create({ property: "title", headerLabel: "Task", width: ze, rowDrag: (i) => !i.locked }),
+      t.create({ property: "owner", headerLabel: "Owner", width: b }),
       t.create({ property: "status", headerLabel: "Status", width: c }),
       t.create({
         property: "estimate",
@@ -222260,7 +222260,7 @@ function ba(a = Or(20, !0), e = {}) {
   });
   return new o(s, m);
 }
-const Hr = [
+const Qr = [
   {
     id: 0,
     preName: "Prename0",
@@ -384134,10 +384134,10 @@ const Hr = [
     friends: []
   }
 ];
-function Vr(a = !1) {
+function ea(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(),
+  return a && (e.addSelection(new k(0, 0, 0, 2)), e.addSelection(new k(2, 1, 2, 2)), e.addSelection(new k(1, 5, 6, 7)), e.addSelection(new k(0, 8, 0, 8)), e.addSelection(new k(5, 6, 10, 10))), {
+    ...new T(),
     hoverColumnVisible: !1,
     defaultRowHeights: {
       header: 50,
@@ -384145,7 +384145,7 @@ function Vr(a = !1) {
       footer: 0
     },
     autoRestoreOptions: {
-      ...new Ve(),
+      ...new er(),
       getStorageKeyFn: () => "TreetablePeopleComponent",
       autoRestoreCollapsedExpandedState: !0,
       autoRestoreScrollPosition: !0,
@@ -384155,51 +384155,51 @@ function Vr(a = !1) {
     getSelectionModel: () => e
   };
 }
-function $r() {
+function ra() {
   return [
-    new t("lastName", "Last Name", he),
-    new t("preName", "Pre Name", g),
+    new t("lastName", "Last Name", Ue),
+    new t("preName", "Pre Name", b),
     t.create({
       property: "age",
       headerLabel: "Age",
-      width: Se,
-      bodyRenderer: new Ae(),
-      editable: y,
+      width: qe,
+      bodyRenderer: new je(),
+      editable: p,
       // editInputPipe: (value: any) => value ? Number(value) : ""
-      editInputPipe: G
+      editInputPipe: Z
     }),
     new t(
       "birth",
       "Birthday",
       c,
       void 0,
-      Ie.bodyRenderer(new O())
+      Ye.bodyRenderer(new V())
     ),
     t.create({
       property: "gender",
       headerLabel: " ",
-      width: Oe,
-      bodyRenderer: new ue(),
-      editable: y,
-      getEditRenderer: () => new Re([
-        new X("female", "♀"),
-        new X("male", "♂")
+      width: Je,
+      bodyRenderer: new Pe(),
+      editable: p,
+      getEditRenderer: () => new Xe([
+        new me("female", "♀"),
+        new me("male", "♂")
       ])
     }),
-    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", P)
+    new t("address.street", "Strasse", we),
+    new t("address.number", "Nr", Qe),
+    new t("address.zip", "Zip", G),
+    new t("address.city", "City", b),
+    new t("address.country", "Country", b),
+    new t("id", "ID", G)
   ];
 }
-function Na(a = !1) {
-  const e = Vr(a), r = $r();
+function ka(a = !1) {
+  const e = ea(a), r = ra();
   for (const s of r)
-    s.sortable = y, s.editable = y;
-  r[0].editable = _;
-  const n = ce.buildTreeRows(Hr, "friends"), m = N.createTableModel({
+    s.sortable = p, s.editable = p;
+  r[0].editable = J;
+  const n = Ge.buildTreeRows(Qr, "friends"), m = f.createTableModel({
     rows: n,
     columnDefs: r,
     tableOptions: e,
@@ -384211,7 +384211,7 @@ function Na(a = !1) {
     e
   );
 }
-const M = [
+const B = [
   ["Desk lamp", "Office"],
   ["Standing desk", "Office"],
   ["Office chair", "Office"],
@@ -384229,13 +384229,13 @@ const M = [
   ["Tea selection", "Kitchen"],
   ["Water bottle", "Kitchen"]
 ];
-function Fr(a = 16) {
+function aa(a = 16) {
   return Array.from({ length: a }, (e, r) => {
-    const [n, m] = M[r % M.length];
+    const [n, m] = B[r % B.length];
     return {
       id: r + 1,
       sku: `SKU-${String(r + 1).padStart(3, "0")}`,
-      product: r < M.length ? n : `${n} ${Math.floor(r / M.length) + 1}`,
+      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,
@@ -384244,35 +384244,35 @@ function Fr(a = 16) {
     };
   });
 }
-function fa(a = Fr(), e = !0, r = !0) {
-  const n = new h("range", "multi"), m = new H("cell"), s = {
-    ...new f(),
+function xa(a = aa(), e = !0, r = !0) {
+  const n = new h("range", "multi"), m = new F("cell"), s = {
+    ...new T(),
     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 = N.createTableModel({
+  }, i = { headerClasses: ["ge-table-text-align-right"], bodyClasses: ["ge-table-text-align-right"] }, y = f.createTableModel({
     rows: a,
     fixedLeftColumnCount: 1,
     columnDefs: [
       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: "product", headerLabel: "Product", width: z, editable: p }),
+      t.create({ property: "category", headerLabel: "Category", width: c, editable: p }),
       t.create({
         property: "validFrom",
         headerLabel: "Valid from",
-        width: g,
-        editable: y,
+        width: b,
+        editable: p,
         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: c,
-        editable: y,
-        editInputPipe: G,
+        editable: p,
+        editInputPipe: Z,
         ...i,
         validate: (d) => typeof d == "number" && d >= 0 ? void 0 : "A price is a number ≥ 0"
       }),
@@ -384280,8 +384280,8 @@ function fa(a = Fr(), e = !0, r = !0) {
         property: "discount",
         headerLabel: "Discount %",
         width: c,
-        editable: y,
-        editInputPipe: G,
+        editable: p,
+        editInputPipe: Z,
         ...i,
         validate: (d) => typeof d == "number" && d >= 0 && d <= 50 ? void 0 : "Discount 0 … 50 %"
       }),
@@ -384296,17 +384296,17 @@ function fa(a = Fr(), e = !0, r = !0) {
         property: "stock",
         headerLabel: "Stock",
         width: c,
-        editable: y,
-        editInputPipe: G,
+        editable: p,
+        editInputPipe: Z,
         ...i,
         validate: (d) => Number.isInteger(d) && d >= 0 ? void 0 : "Stock is a whole number ≥ 0"
       })
     ],
     tableOptions: s
   });
-  return new o(p, s);
+  return new o(y, s);
 }
-const se = [
+const be = [
   "Ada Lovelace",
   "Alan Turing",
   "Grace Hopper",
@@ -384317,7 +384317,7 @@ const se = [
   "Ken Thompson",
   "Katherine Johnson",
   "Tim Berners-Lee"
-], ie = ["Berlin", "Hamburg", "Munich", "Cologne", "Vienna", "Zurich"], de = ["open", "paid", "shipped", "delivered"], ye = [
+], Ne = ["Berlin", "Hamburg", "Munich", "Cologne", "Vienna", "Zurich"], fe = ["open", "paid", "shipped", "delivered"], Te = [
   ["Desk lamp", 39.9],
   ["Standing desk", 499],
   ["Office chair", 289],
@@ -384331,54 +384331,54 @@ const se = [
   ["Coffee beans", 15.5],
   ["Water bottle", 19.9]
 ];
-function Er(a = 1e3) {
+function ta(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 [u, g] = Te[Math.floor(r() * Te.length)];
+      s.push({ sku: `SKU-${String(1 + Math.floor(r() * 900)).padStart(3, "0")}`, product: u, quantity: 1 + Math.floor(r() * 5), unitPrice: g });
     }
-    const p = 1 + m % 28;
+    const y = 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)],
+      customer: be[Math.floor(r() * be.length)],
+      city: Ne[m % Ne.length],
+      date: `2026-${String(1 + m % 9).padStart(2, "0")}-${String(y).padStart(2, "0")}`,
+      status: fe[Math.floor(r() * fe.length)],
       total: Math.round(s.reduce((d, u) => d + u.quantity * u.unitPrice, 0) * 100) / 100,
       items: s
     });
   }
   return n;
 }
-function _r(a) {
-  return N.createTableModel({
+function na(a) {
+  return f.createTableModel({
     rows: a.items,
     columnDefs: [
       t.create({ property: "sku", headerLabel: "SKU", width: c }),
-      t.create({ property: "product", headerLabel: "Product", width: Z }),
+      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"] })
+      t.create({ property: "unitPrice", headerLabel: "Unit price", width: b, bodyClasses: ["ge-table-text-align-right"] })
     ]
   });
 }
-function Ta(a = Er(1e5), e = {}) {
-  const r = N.createTableModel({
+function Da(a = ta(1e5), e = {}) {
+  const r = f.createTableModel({
     rows: a,
     columnDefs: [
-      t.create({ property: "orderNo", headerLabel: "Order", width: R }),
-      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: "orderNo", headerLabel: "Order", width: $ }),
+      t.create({ property: "date", headerLabel: "Date", width: b, sortable: () => !0 }),
+      t.create({ property: "customer", headerLabel: "Customer", width: z, sortable: () => !0 }),
+      t.create({ property: "city", headerLabel: "City", width: b, 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"] })
+      t.create({ property: "total", headerLabel: "Total", width: b, sortable: () => !0, bodyClasses: ["ge-table-text-align-right"] })
     ],
     fixedLeftColumnCount: 1
-  }), n = new H("cell"), m = new h("row", "multi"), s = {
-    ...new f(),
+  }), n = new F("cell"), m = new h("row", "multi"), s = {
+    ...new T(),
     hoverColumnVisible: !1,
     getFocusModel: () => n,
     getSelectionModel: () => m,
@@ -384386,8 +384386,8 @@ function Ta(a = Er(1e5), e = {}) {
     masterDetail: {
       detailHeight: 222,
       // header + 5 rows, borders, padding of the detail cell
-      detailRenderer: (i, p, d) => {
-        d.createTable({ tableModel: _r(p) });
+      detailRenderer: (i, y, d) => {
+        d.createTable({ tableModel: na(y) });
       },
       getRowId: (i) => i.id,
       ...e
@@ -384395,7 +384395,7 @@ function Ta(a = Er(1e5), e = {}) {
   };
   return new o(r, s);
 }
-const E = [
+const X = [
   ["الرياض", "السعودية", "RUH"],
   ["جدة", "السعودية", "JED"],
   ["مكة", "السعودية", "MKK"],
@@ -384416,23 +384416,23 @@ const E = [
   ["الجزائر", "الجزائر", "ALG"],
   ["الرباط", "المغرب", "RBA"],
   ["الدار البيضاء", "المغرب", "CMN"]
-], pe = ["يناير", "فبراير", "مارس", "أبريل", "مايو", "يونيو", "يوليو", "أغسطس", "سبتمبر", "أكتوبر", "نوفمبر", "ديسمبر"];
-function Kr(a) {
+], oe = ["يناير", "فبراير", "مارس", "أبريل", "مايو", "يونيو", "يوليو", "أغسطس", "سبتمبر", "أكتوبر", "نوفمبر", "ديسمبر"];
+function ma(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 Wr(a = 2e3, e = 7) {
-  const r = Kr(e);
+function sa(a = 2e3, e = 7) {
+  const r = ma(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));
+    const [s, i, y] = X[m % X.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")}`,
+      branch: `فرع ${y}-${String(Math.floor(m / X.length) + 1).padStart(2, "0")}`,
       m1: u(),
       m2: u(),
       m3: u(),
@@ -384448,38 +384448,38 @@ function Wr(a = 2e3, e = 7) {
     };
   });
 }
-function oa(a = "rtl", e = Wr()) {
-  const r = new h("range", "multi"), n = new H("cell"), m = {
-    ...new f(),
+function Ua(a = "rtl", e = sa()) {
+  const r = new h("range", "multi"), n = new F("cell"), m = {
+    ...new T(),
     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,
+  }, s = ["ge-table-text-align-right"], i = oe.map((g, N) => t.create({
+    property: `m${N + 1}`,
+    headerLabel: g,
     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 }),
+  })), y = [
+    t.create({ property: "city", headerLabel: "المدينة", width: b, sortable: () => !0 }),
+    t.create({ property: "country", headerLabel: "البلد", width: b, sortable: () => !0 }),
+    t.create({ property: "branch", headerLabel: "الفرع", width: P }),
     ...i,
     t.create({
       property: "total",
       headerLabel: "المجموع",
-      width: g,
+      width: b,
       bodyClasses: s,
       footerClasses: s,
       sortable: () => !0,
-      valueGetter: (b) => pe.reduce((T, w, Ge) => T + b[`m${Ge + 1}`], 0)
+      valueGetter: (g) => oe.reduce((N, S, v) => N + g[`m${v + 1}`], 0)
     })
-  ], d = Object.fromEntries([...i.map((b) => b.property), "total"].map((b) => [b, "sum"])), u = N.createTableModel({
+  ], d = Object.fromEntries([...i.map((g) => g.property), "total"].map((g) => [g, "sum"])), u = f.createTableModel({
     rows: e,
-    columnDefs: p,
+    columnDefs: y,
     rowNumbersVisible: !0,
     fixedLeftColumnCount: 1,
     // the city stays at the start (right)
@@ -384493,7 +384493,7 @@ function oa(a = "rtl", e = Wr()) {
   });
   return new o(u, m);
 }
-function Yr() {
+function ia() {
   return [
     ["Item", "Qty", "Unit price", "Discount", "Net", "Note"],
     ['Laptop 14"', 4, 1299, 0.05, "=B2*C2*(1-D2)", ""],
@@ -384508,68 +384508,212 @@ function Yr() {
     ["Total", "", "", "", "=E8+E9+E10", ""]
   ];
 }
-function ha(a = {}) {
-  return $e.create({
-    data: Yr(),
+function qa(a = {}) {
+  return rr.create({
+    data: ia(),
     rowCount: 100,
     columnCount: 8,
     columnWidth: 130,
     ...a
   });
 }
+const A = [
+  "Silent",
+  "Crimson",
+  "Hidden",
+  "Last",
+  "Golden",
+  "Broken",
+  "Northern",
+  "Electric",
+  "Paper",
+  "Midnight",
+  "Glass",
+  "Wandering",
+  "Forgotten",
+  "Burning",
+  "Little",
+  "Endless"
+], he = [
+  "Garden",
+  "Engine",
+  "Harbour",
+  "Archive",
+  "Comet",
+  "Lighthouse",
+  "Orchard",
+  "Kingdom",
+  "Signal",
+  "River",
+  "Atlas",
+  "Clockwork",
+  "Island",
+  "Library",
+  "Mountain",
+  "Storm",
+  "Machine",
+  "Letters"
+], Se = ["Ada", "Jonas", "Mira", "Theo", "Lena", "Omar", "Ines", "Kai", "Nora", "Felix", "Yuki", "Elif"], Ce = ["Berger", "Okafor", "Lindqvist", "Moreau", "Kowalski", "Santos", "Tanaka", "Hart", "Novak", "Reyes"], Le = ["Fantasy", "Sci-Fi", "Crime", "Romance", "History", "Poetry", "Travel", "Cooking"];
+function da(a = 1e4) {
+  const e = A.length * he.length;
+  return Array.from({ length: a }, (r, n) => {
+    const m = n * 97 % e, s = A[m % A.length], i = he[Math.floor(m / A.length)], y = Math.floor(n / e);
+    return {
+      id: n + 1,
+      title: `The ${s} ${i}${y ? ` ${y + 1}` : ""}`,
+      author: `${Se[n * 11 % Se.length]} ${Ce[(n * 3 + Math.floor(n / 12)) % Ce.length]}`,
+      genre: Le[(n * 13 + Math.floor(n / e)) % Le.length],
+      year: 1950 + n * 37 % 76,
+      pages: 120 + n * 53 % 600,
+      hue: n * 47 % 360
+    };
+  });
+}
+const I = new Intl.Collator("en", { numeric: !0 }), Ma = {
+  id: (a, e) => a.id - e.id,
+  title: (a, e) => I.compare(a.title, e.title) || a.id - e.id,
+  author: (a, e) => I.compare(a.author, e.author) || I.compare(a.title, e.title),
+  year: (a, e) => e.year - a.year || I.compare(a.title, e.title)
+};
+class ya {
+  constructor(e = {}) {
+    this.ctx = e;
+  }
+  render(e, r, n, m, s, i) {
+    var te, ne;
+    const y = i;
+    if (!y) return;
+    const d = e.ownerDocument, u = s.coverWidth ?? 160, g = u < 120, N = d.createElement("div");
+    N.className = "ge-demo-book", N.title = `${y.title} – ${y.author} (${y.year})`, Object.assign(N.style, {
+      boxSizing: "border-box",
+      width: "100%",
+      height: "100%",
+      padding: g ? "5px" : "10px",
+      display: "flex",
+      flexDirection: "column",
+      gap: "6px",
+      cursor: "pointer"
+    });
+    const S = d.createElement("div");
+    Object.assign(S.style, {
+      position: "relative",
+      flex: "1",
+      minHeight: "0",
+      overflow: "hidden",
+      boxSizing: "border-box",
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "space-between",
+      padding: g ? "8px 6px 8px 10px" : "14px 12px 14px 18px",
+      borderRadius: "3px 8px 8px 3px",
+      borderLeft: "6px solid rgba(0,0,0,0.28)",
+      background: `linear-gradient(160deg, hsl(${y.hue} 62% 52%), hsl(${(y.hue + 40) % 360} 68% 24%))`,
+      color: "#fff",
+      fontSize: `${Math.max(9, Math.round(u / 11))}px`,
+      lineHeight: "1.2",
+      boxShadow: "0 3px 8px rgba(0,0,0,0.35)",
+      outline: (ne = (te = this.ctx).isSelected) != null && ne.call(te, y) ? "3px solid #2b7de9" : "none",
+      outlineOffset: "3px"
+    });
+    const v = d.createElement("div");
+    v.textContent = y.genre.toUpperCase(), Object.assign(v.style, { fontSize: "0.6em", letterSpacing: "0.12em", opacity: "0.85" });
+    const _ = d.createElement("div");
+    _.textContent = y.title, Object.assign(_.style, { fontSize: "1.2em", fontWeight: "700", overflowWrap: "anywhere" });
+    const K = d.createElement("div");
+    if (K.textContent = y.author, Object.assign(K.style, { fontSize: "0.75em", opacity: "0.9" }), S.append(v, _), g || S.append(K), N.append(S), !g) {
+      const W = d.createElement("div");
+      W.textContent = `${y.year} · ${y.pages} pages`, Object.assign(W.style, {
+        fontSize: "12px",
+        whiteSpace: "nowrap",
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        opacity: "0.75"
+      }), N.append(W);
+    }
+    e.append(N);
+  }
+}
+function Ba(a = da(), e = 160, r = 260, n = {}) {
+  const m = se.createCoverGridModel(
+    a,
+    new ya(n),
+    e,
+    r
+  ), s = {
+    ...se.createCoverGrisDefaultOptions(r, () => "coverGridDemo"),
+    externalFilterFunction: n.filter,
+    shortcutActionsDisabled: !0,
+    // the table's cell navigation does not apply to tiles
+    overflowY: "scroll",
+    // a classic scroll bar is always there: the number of columns does not jump
+    ariaLabel: "Books"
+  };
+  return { tableModel: m, tableOptions: s };
+}
+function Aa(a, e, r) {
+  const n = a.bodyModel;
+  if (!n.width) return !1;
+  const m = Math.max(1, Math.floor(n.width / e)), s = Math.floor(n.width / m), i = Math.round(r * s / e);
+  return s === n.coverWidth && i === n.coverHeight ? !1 : (n.coverWidth = s, n.coverHeight = i, !0);
+}
 export {
-  sa as COL_IDX_UPDATED_AT,
-  Fe as ChangePercentageRenderer,
-  We as CirculatingSupplyRenderer,
-  Ye as CoinIconRenderer,
-  q as INVOICE_FORMULAS,
-  Cr as LargeBodyModel,
-  _e as NameAndSymbolRenderer,
-  Ee as UsdRenderer,
-  Ke as Volumn24hRenderer,
-  ma as applyBodyRenderer,
-  ca as createAggregationModelAndOptions,
-  pr as createColumnDefs,
-  Xr as createCryptoModelAndOptions,
-  ga as createFormulaModelAndOptions,
-  aa as createHeadergroupModel,
-  ea as createHeatMapModel,
-  ra as createHeatMapSeattleModel,
-  Rr as createInvoiceColumnDefs,
-  ya as createLargeModelAndOptions,
-  pa as createManyTypesModelAndOptions,
-  Ta as createMasterDetailModelAndOptions,
-  _r as createOrderItemsModel,
-  da as createOrderModelAndOptions,
-  la as createPivotModelAndOptions,
-  fa as createPriceListModelAndOptions,
-  ba as createRowDragModelAndOptions,
-  ua as createRowGroupModelAndOptions,
-  oa as createRtlCitiesModelAndOptions,
-  Pe as createSalesOrderColumnDefs,
-  na as createSimplePersonModel,
-  Yr as createSpreadsheetQuoteData,
-  ha as createSpreadsheetQuoteModelAndOptions,
-  ur as createTableOptions,
-  yr as createTableRows,
-  ta as createTeamHeadergroupModel,
-  ia as createTimeTableModel,
-  $r as createTreePeopleColumnDefs,
-  Na as createTreePeopleModelAndOptions,
-  Vr as createTreePeopleTableOptions,
-  je as cryptoData,
-  cr as data,
-  Ir as generateInvoiceLines,
-  Er as generateMasterOrders,
-  Ur as generatePivotOrders,
-  Fr as generatePriceItems,
-  Wr as generateRtlCitySales,
-  V as generateSalesOrders,
-  Jr as generateSimpleModel,
-  Or as generateTasks,
-  Qr as generateTreeCheckboxModel,
-  Mr as pivotQuarter,
-  qr as pivotYear,
-  lr as tableOptions,
-  dr as teamHeaderGroups
+  Ma as BOOK_SORTS,
+  ya as BookCoverRenderer,
+  ha as COL_IDX_UPDATED_AT,
+  ar as ChangePercentageRenderer,
+  sr as CirculatingSupplyRenderer,
+  ir as CoinIconRenderer,
+  M as INVOICE_FORMULAS,
+  qr as LargeBodyModel,
+  nr as NameAndSymbolRenderer,
+  tr as UsdRenderer,
+  mr as Volumn24hRenderer,
+  oa as applyBodyRenderer,
+  Za as createAggregationModelAndOptions,
+  Cr as createColumnDefs,
+  Ba as createCoverGridModelAndOptions,
+  ua as createCryptoModelAndOptions,
+  wa as createFormulaModelAndOptions,
+  Na as createHeadergroupModel,
+  ga as createHeatMapModel,
+  ba as createHeatMapSeattleModel,
+  Xr as createInvoiceColumnDefs,
+  La as createLargeModelAndOptions,
+  Pa as createManyTypesModelAndOptions,
+  Da as createMasterDetailModelAndOptions,
+  na as createOrderItemsModel,
+  Ca as createOrderModelAndOptions,
+  za as createPivotModelAndOptions,
+  xa as createPriceListModelAndOptions,
+  va as createRowDragModelAndOptions,
+  Ga as createRowGroupModelAndOptions,
+  Ua as createRtlCitiesModelAndOptions,
+  Ae as createSalesOrderColumnDefs,
+  Ta as createSimplePersonModel,
+  ia as createSpreadsheetQuoteData,
+  qa as createSpreadsheetQuoteModelAndOptions,
+  Lr as createTableOptions,
+  Sr as createTableRows,
+  fa as createTeamHeadergroupModel,
+  Sa as createTimeTableModel,
+  ra as createTreePeopleColumnDefs,
+  ka as createTreePeopleModelAndOptions,
+  ea as createTreePeopleTableOptions,
+  dr as cryptoData,
+  Pr as data,
+  Aa as fitCoversToWidth,
+  da as generateBooks,
+  Yr as generateInvoiceLines,
+  ta as generateMasterOrders,
+  Er as generatePivotOrders,
+  aa as generatePriceItems,
+  sa as generateRtlCitySales,
+  E as generateSalesOrders,
+  ca as generateSimpleModel,
+  Jr as generateTasks,
+  la as generateTreeCheckboxModel,
+  Kr as pivotQuarter,
+  _r as pivotYear,
+  Gr as tableOptions,
+  hr as teamHeaderGroups
 };