@guiexpert/table 1.1.37 → 1.1.39

package/index.js

@@ -1,4 +1,4 @@
-function dt(h, e = 500) {
+function ht(h, e = 500) {
   let t = null, s = 0;
   return function(...o) {
     const i = Date.now(), r = e - (i - s);
@@ -15,7 +15,7 @@ function ve(h, e = 500) {
     }, e);
   };
 }
-function ht(h = 500) {
+function ut(h = 500) {
   return function(e, t, s) {
     let o = 0;
     const i = s.value;
@@ -1070,7 +1070,7 @@ class k {
     this.header = e, this.body = t, this.footer = s;
   }
 }
-class _e extends Le {
+class $e extends Le {
   constructor(e, t, s, o) {
     var r, l;
     super(e, t, s, o), this.dragging = !1, this.editing = !1, this.storedColumnWidths = [], this.scrollLeft = 0, this.scrollViewportLeft = 0, this.scrollFactorY = 0, this.scrollFactorX = 0, this.cleanupFunctions = {
@@ -1960,12 +1960,12 @@ class _e extends Le {
     n.setAttribute(a, "data-col-index", `${t}`), n.setAttribute(a, "data-row-index", `${e}`), n.setAttribute(a, "data-area", "header"), n.setAttribute(a, "data-ge-action", "resize-column"), n.addClass(a, "ge-table-column-resize-handle"), n.setStyle(a, "display", "clip"), n.setStyle(a, "position", "absolute"), n.setStyle(a, "cursor", "col-resize"), n.setStyle(a, "left", `${s + i - c}px`), n.setStyle(a, "top", `${o}px`), n.setStyle(a, "width", `${c}px`), n.setStyle(a, "height", `${r}px`), n.appendChild(l, a);
   }
 }
-class Oe {
+class _e {
   constructor(e, t) {
     this.columnIndex = e, this.sortState = t;
   }
 }
-class $e {
+class Oe {
   constructor(e) {
     this.tableScope = e, this.tableScope.hostElement.addEventListener("change", this.onHostElementChanged.bind(this));
   }
@@ -2567,14 +2567,14 @@ class Ke {
     return this.createZip(s);
   }
 }
-class Se extends _e {
+class Se extends $e {
   constructor(e, t, s, o, i, r = new U(), l = new Ke()) {
     var a;
     if (super(e, t, new Re(s), o), this.eventListener = i, this.copyService = r, this.excelService = l, this.licenseManager = B.getInstance(), this.selectionService = new He(this), this.api = new Te(this), this.mouseStartAction = "", this.mouseStartWidth = -1, this.mouseStartColumnIndex = -1, this.dragFrom = -1, this.dragTo = -1, this.lastDragFrom = -1, this.lastDragTo = -1, this.firstDraggingRendering = !0, t.setTableScope(this), i || (this.eventListener = new le()), (a = this.tableOptions) != null && a.autoRestoreOptions) {
       const d = this.tableOptions.autoRestoreOptions, u = d.getStorageKeyFn;
       u && (d.autoRestoreScrollPosition && (this.storeScrollPosStateService = new ke(u)), d.autoRestoreCollapsedExpandedState && (this.storeStateCollapsedExpandService = new De(u)), d.autoRestoreSortingState && (this.storeSortingService = new Fe(u)));
     }
-    this.mouseHandler = new Me(this), this.inputHandler = new $e(this), this.resizeHandler = new Ye(this, o.resizeEventDebounceDelay), this.shortcutService = new Ne(this), this.shortcutService.addListener(this.selectionService);
+    this.mouseHandler = new Me(this), this.inputHandler = new Oe(this), this.resizeHandler = new Ye(this, o.resizeEventDebounceDelay), this.shortcutService = new Ne(this), this.shortcutService.addListener(this.selectionService);
     const n = this.getSelectionModel ? this.getSelectionModel() : void 0;
     n && n.addEventSelectionChangedListener(this);
     const c = this.getFocusModel ? this.getFocusModel() : void 0;
@@ -2790,7 +2790,7 @@ class Se extends _e {
     const o = this.tableModel.getColumnDef(s);
     if (o != null && o.sortable && o.sortable()) {
       e.preventDefault(), e.stopPropagation();
-      const l = o.sortStatesOrder ? o.sortStatesOrder : this.tableOptions.sortOrder, n = o.sortState ?? "", c = l[(l.indexOf(n) + 1) % l.length], a = new Oe(s, c);
+      const l = o.sortStatesOrder ? o.sortStatesOrder : this.tableOptions.sortOrder, n = o.sortState ?? "", c = l[(l.indexOf(n) + 1) % l.length], a = new _e(s, c);
       this.tableModel.doSort([a]) && ((i = this.tableModel.getColumnDefs()) == null || i.forEach((u) => u.sortState = ""), o.sortState = c), this.repaint(), (r = this.storeSortingService) == null || r.setSortItems([a]);
     }
   }
@@ -3261,7 +3261,7 @@ class x {
   }
 }
 const qe = () => !0, de = () => !1;
-class $ {
+class O {
   constructor(e, t, s = new x(100, "px"), o = new k(), i = new k(), r = new x(100, "px"), l = new x(100, "px"), n, c, a, d, u, f, p, m, g = () => this.visible) {
     this.property = e, this.headerLabel = t, this.width = s, this.classes = o, this.rendererMap = i, this.minWidth = r, this.maxWidth = l, this.sortable = n, this.sortComparator = c, this.sortState = a, this.sortStatesOrder = d, this.sortIconVisible = u, this.editable = f, this.getEditRenderer = p, this.editInputPipe = m, this.isVisible = g, this.visible = !0, s.unit !== "px" && (this.minWidth = new x(0, "px"), this.maxWidth = new x(1e5, "px"));
   }
@@ -3282,7 +3282,7 @@ class $ {
       e.bodyClasses,
       e.footerClasses
     ), o = e.sortIconVisible ?? e.sortable ?? de, i = e.editable ?? e.editable ?? de, r = e.isVisible ?? e.isVisible ?? qe;
-    return new $(
+    return new O(
       e.property ?? "",
       e.headerLabel ?? "",
       e.width ?? new x(100, "px"),
@@ -3302,7 +3302,7 @@ class $ {
     );
   }
 }
-const ut = new x(500, "px"), gt = new x(400, "px"), Je = new x(300, "px"), pt = new x(290, "px"), ft = new x(280, "px"), mt = new x(270, "px"), bt = new x(260, "px"), xt = new x(250, "px"), wt = new x(240, "px"), St = new x(230, "px"), yt = new x(220, "px"), Ct = new x(210, "px"), he = new x(200, "px"), vt = new x(190, "px"), At = new x(180, "px"), Rt = new x(170, "px"), Et = new x(160, "px"), Mt = new x(150, "px"), Tt = new x(140, "px"), kt = new x(130, "px"), It = new x(120, "px"), Dt = new x(110, "px"), Ft = new x(100, "px"), Lt = new x(90, "px"), Pt = new x(80, "px"), _t = new x(70, "px"), Ot = new x(60, "px"), $t = new x(50, "px"), Bt = new x(40, "px"), Ht = new x(30, "px"), Wt = new x(20, "px"), Vt = new x(10, "px"), Nt = new x(0, "px");
+const gt = new x(500, "px"), pt = new x(400, "px"), Je = new x(300, "px"), ft = new x(290, "px"), mt = new x(280, "px"), bt = new x(270, "px"), xt = new x(260, "px"), wt = new x(250, "px"), St = new x(240, "px"), yt = new x(230, "px"), Ct = new x(220, "px"), vt = new x(210, "px"), he = new x(200, "px"), At = new x(190, "px"), Rt = new x(180, "px"), Et = new x(170, "px"), Mt = new x(160, "px"), Tt = new x(150, "px"), kt = new x(140, "px"), It = new x(130, "px"), Dt = new x(120, "px"), Ft = new x(110, "px"), Lt = new x(100, "px"), Pt = new x(90, "px"), $t = new x(80, "px"), _t = new x(70, "px"), Ot = new x(60, "px"), Bt = new x(50, "px"), Ht = new x(40, "px"), Wt = new x(30, "px"), Vt = new x(20, "px"), Nt = new x(10, "px"), Gt = new x(0, "px");
 class re {
   constructor(e, t = [], s = -1) {
     this.areaIdent = e, this.columnDefs = t, this.defaultRowHeight = s, this.rowSelectionModel = void 0, this.yPositions = [], this.cellRenderers = t.map((o) => o.rendererMap[e]);
@@ -4186,7 +4186,7 @@ class fe extends et {
     ), this.areaIdent = e, this.rows = t, this.columnDefs = s, this.defaultRowHeight = o;
   }
 }
-class O {
+class _ {
   /**
    * TableFactory
    *
@@ -4242,7 +4242,7 @@ class O {
           g > -1 && (e.defaultRowHeights.footer = g);
         }
       }
-    if (e.columnDefs === void 0 && ((s = e.properties) != null && s.length ? e.columnDefs = e.properties.map((g) => new $(g, g.toUpperCase(), he)) : (o = e.rows) != null && o.length ? e.columnDefs = Object.keys(e.rows[0]).map((g) => new $(g, g.toUpperCase(), he)) : e.columnDefs = []), e.columnCount === void 0 && ((i = e.columnDefs) != null && i.length ? e.columnCount = e.columnDefs.length : (r = e.headerData) != null && r.length ? e.columnCount = e.headerData[0].length : (l = e.columnSizes) != null && l.length ? e.columnCount = (n = e.columnSizes) == null ? void 0 : n.length : console.warn('Property "columnCount" is missing and cannot be derived from other properties.')), e.headerAreaModel || ((c = e.headerData) != null && c.length ? e.headerAreaModel = new D(
+    if (e.columnDefs === void 0 && ((s = e.properties) != null && s.length ? e.columnDefs = e.properties.map((g) => new O(g, g.toUpperCase(), he)) : (o = e.rows) != null && o.length ? e.columnDefs = Object.keys(e.rows[0]).map((g) => new O(g, g.toUpperCase(), he)) : e.columnDefs = []), e.columnCount === void 0 && ((i = e.columnDefs) != null && i.length ? e.columnCount = e.columnDefs.length : (r = e.headerData) != null && r.length ? e.columnCount = e.headerData[0].length : (l = e.columnSizes) != null && l.length ? e.columnCount = (n = e.columnSizes) == null ? void 0 : n.length : console.warn('Property "columnCount" is missing and cannot be derived from other properties.')), e.headerAreaModel || ((c = e.headerData) != null && c.length ? e.headerAreaModel = new D(
       "header",
       e.headerData,
       e.defaultRowHeights.header,
@@ -4314,7 +4314,7 @@ class O {
    * @method
    */
   static buildByTypedRowsParam(e) {
-    return O.buildByTypedRows(
+    return _.buildByTypedRows(
       e.rows ?? [],
       e.columnDefs,
       e.tableOptions ?? new z(),
@@ -4367,7 +4367,7 @@ class O {
         r.body,
         t
       );
-      return (l || s.showCheckboxWihoutExtraColumn) && (a.rowSelectionModel = new ge(c)), O.createByAreaModelsParam({
+      return (l || s.showCheckboxWihoutExtraColumn) && (a.rowSelectionModel = new ge(c)), _.createByAreaModelsParam({
         headerAreaModel: new D("header", [t.map((d) => d.headerLabel)], r.header),
         bodyAreaModel: a,
         footerAreaModel: new D("footer", [], r.footer),
@@ -4381,7 +4381,7 @@ class O {
         overridingColumnWidth: -1
       });
     }
-    return O.createByObjectArrayParam({
+    return _.createByObjectArrayParam({
       rows: e,
       columnDefs: t,
       fixedLeftColumnCount: o,
@@ -4435,7 +4435,7 @@ class O {
    */
   static createByObjectArrayParam(e) {
     const t = e.rowCheckboxVisible !== void 0 ? e.rowCheckboxVisible : !1;
-    return O.createByObjectArray(
+    return _.createByObjectArray(
       e.rows,
       e.header ?? [],
       e.footer ?? [],
@@ -4540,7 +4540,7 @@ class O {
    * });
    */
   static createByAreaModelsParam(e) {
-    return O.createByAreaModels(
+    return _.createByAreaModels(
       e.headerAreaModel ?? new F(),
       e.bodyAreaModel,
       e.footerAreaModel ?? new F(),
@@ -4619,7 +4619,7 @@ class O {
     );
   }
 }
-const Gt = [
+const zt = [
   "COPY_2_CLIPBOARD",
   "START_EDITING",
   "TOGGLE_SELECTION",
@@ -4647,7 +4647,7 @@ class st {
     this.emmitDataKey = e, this.emmitCancelKey = t, this.queryId = s, this.filter = o, this.sorting = i, this.startIndex = r, this.endIndex = l;
   }
 }
-class zt extends st {
+class Ut extends st {
   constructor(e, t, s, o, i, r, l, n) {
     super(
       e,
@@ -4665,20 +4665,20 @@ class ot {
     this.value = e, this.label = t;
   }
 }
-class Ut {
+class jt {
   constructor(e, t) {
     this.index = e, this.px = t;
   }
 }
-const jt = { body: ["ge-table-text-align-left"] }, Xt = { body: ["ge-table-text-align-center"] }, Yt = { body: ["ge-table-text-align-right"] }, Kt = {
+const Xt = { body: ["ge-table-text-align-left"] }, Yt = { body: ["ge-table-text-align-center"] }, Kt = { body: ["ge-table-text-align-right"] }, qt = {
   header: ["ge-table-text-align-left"],
   body: ["ge-table-text-align-left"],
   footer: ["ge-table-text-align-left"]
-}, qt = {
+}, Jt = {
   header: ["ge-table-text-align-center"],
   body: ["ge-table-text-align-center"],
   footer: ["ge-table-text-align-center"]
-}, Jt = {
+}, Zt = {
   header: ["ge-table-text-align-right"],
   body: ["ge-table-text-align-right"],
   footer: ["ge-table-text-align-right"]
@@ -4701,7 +4701,7 @@ class me {
     }
   }
 }
-class Zt {
+class Qt {
   constructor() {
     this.type = "CheckboxColumnDef", this.property = "CheckboxColumn", this.headerLabel = "", this.width = new x(50, "px"), this.minWidth = new x(50, "px"), this.maxWidth = new x(100, "px"), this.rendererMap = new k(new me(), new me(), void 0), this.classes = new k(
       [],
@@ -4710,7 +4710,7 @@ class Zt {
     );
   }
 }
-class Qt {
+class es {
   /**
    * A factory that creates a new AreaObjectMap with the given body renderer.
    *
@@ -4725,17 +4725,17 @@ class Qt {
     );
   }
 }
-class es {
+class ts {
   constructor(e = "down", t) {
     this.status = e, this.originalEvent = t;
   }
 }
-class ts {
+class ss {
   constructor(e, t, s, o, i = {}) {
     this.area = e, this.rowIndex = t, this.columnIndex = s, this.value = o, this.cssClasses = i;
   }
 }
-class ss {
+class os {
   constructor() {
     this.autoRestoreSortingState = !1, this.autoRestoreCollapsedExpandedState = !1, this.autoRestoreScrollPosition = !1, this.autoRestoreCheckedState = !1, this.autoRestoreSelectedState = !1, this.getStorageKeyFn = void 0, this.isSame = (e, t, s) => {
       if (e && t && s.getRowId) {
@@ -4861,7 +4861,7 @@ class T {
   static buildColumnDefs(e, t = []) {
     for (const s of e)
       s.property && t.push(
-        $.create({
+        O.create({
           property: s.property,
           headerLabel: s.data ? s.data : s.property,
           isVisible: () => typeof s.isVisible == "function" ? s.isVisible() : !0
@@ -4932,7 +4932,7 @@ class T {
       e.push(o.data + "    rowIndex:" + o.rowIndex), (s = o.children) != null && s.length && T.iterateThrowColumns(e, o.children);
   }
 }
-class os {
+class is {
   constructor() {
     this.areaIdent = "body", this.rowSelectionModel = void 0;
   }
@@ -5043,7 +5043,7 @@ const X = class X {
 };
 X.toggleHeaderGroup = "toggleHeaderGroup";
 let Q = X;
-class is {
+class rs {
   constructor(e = "header", t, s = [], o, i = new ie()) {
     this.areaIdent = e, this.groups = t, this.columnDefs = s, this.defaultRowHeight = o, this.headerGroupOptions = i, this.gammaCells = !0, this.arr = [], this.groupExts = [], this.cellGroupExtCellRenderer = new Q(this.headerGroupOptions), this.groupExts = T.buildGroupExts(t), this.init();
   }
@@ -5143,7 +5143,7 @@ class is {
     return t != null && t.toggle && t.visibility !== "always" && (t.closed = !t.closed, this.init()), T.buildColumnDefs(this.groupExts);
   }
 }
-class rs {
+class ns {
   filterPredict(e, t, s = this.objectToString.bind(this)) {
     if (!e)
       return !1;
@@ -5197,12 +5197,12 @@ class rs {
     return t.join(" ").toLowerCase();
   }
 }
-class ns {
+class ls {
   static bodyRenderer(e) {
     return new k(void 0, e, void 0);
   }
 }
-class ls {
+class as {
   constructor(e, t = !0, s = !1) {
     this.property = e, this.skipCheckableCheck = t, this.readonly = s;
   }
@@ -5227,12 +5227,12 @@ class ls {
     }
   }
 }
-class as {
+class cs {
   render(e, t, s, o, i, r, l) {
     r && (e.innerText = new Date(r).toISOString());
   }
 }
-class cs {
+class ds {
   constructor() {
     this.formatter = new Intl.DateTimeFormat("de-DE", {
       year: "numeric",
@@ -5255,17 +5255,17 @@ class cs {
     }
   }
 }
-class ds {
+class hs {
   render(e, t, s, o, i, r, l) {
     r && (e.innerText = new Date(r).toLocaleDateString());
   }
 }
-class hs {
+class us {
   render(e, t, s, o, i, r, l) {
     r === "male" || r === "m" ? e.innerText = "♂" : (r === "female" || r === "f") && (e.innerText = "♀");
   }
 }
-class us {
+class gs {
   constructor(e = 100, t = !1) {
     this.maxValue = e, this.labelVisible = t;
   }
@@ -5295,17 +5295,17 @@ class us {
     }
   }
 }
-class gs {
+class ps {
   render(e, t, s, o, i, r, l) {
     r === "true" || r === !0 ? e.innerHTML = '<span class="ge-true-text-color">✅</span>' : r === "false" || r === !1 ? e.innerHTML = '<span class="ge-false-text-color">❌</span>' : e.innerText = "";
   }
 }
-class ps {
+class fs {
   render(e, t, s, o, i, r, l) {
     r && (e.innerText = new Date(r).toISOString().replace(/T/g, " ").replace(/\..*/g, ""));
   }
 }
-class fs {
+class ms {
   constructor(e = Number.MIN_SAFE_INTEGER, t = Number.MAX_SAFE_INTEGER) {
     this.min = e, this.max = t;
   }
@@ -5313,7 +5313,7 @@ class fs {
     r && (e.innerText = r, (typeof r == "string" || isNaN(r) || r < this.min || r > this.max) && l.addClass(e, "ge-cell-error"));
   }
 }
-class ms {
+class bs {
   constructor(e) {
     this.property = e;
   }
@@ -5332,7 +5332,7 @@ class ms {
     }
   }
 }
-class bs {
+class xs {
   constructor(e, t = 100, s = !1) {
     this.property = e, this.maxValue = t, this.labelVisible = s;
   }
@@ -5364,7 +5364,7 @@ class bs {
     }
   }
 }
-class xs {
+class ws {
   render(e, t, s, o, i, r, l) {
     if (r) {
       e.innerHTML = `
@@ -5389,7 +5389,7 @@ class nt {
     this.action = e, this.area = t, this.areaModel = s, this.rowIndex = o, this.columnIndex = i, this.id = r;
   }
 }
-class _ {
+class $ {
   constructor(e, t, s = "", o = "", i = "button", r = !0) {
     this.action = e, this.label = t, this.icon = s, this.elementClass = o, this.elementType = i, this.enabled = r;
   }
@@ -5456,10 +5456,10 @@ class lt {
     return null;
   }
   getCrudActions(e) {
-    return Array.isArray(e) && e.every((t) => t instanceof _) ? e : this.crudActions;
+    return Array.isArray(e) && e.every((t) => t instanceof $) ? e : this.crudActions;
   }
 }
-const ws = function(h, e, t) {
+const Ss = function(h, e, t) {
   return h ? Number(h) : "";
 };
 class Ce {
@@ -5496,7 +5496,7 @@ class Ce {
     }
   }
 }
-class Ss extends oe {
+class ys extends oe {
   constructor(e) {
     super("row", "multi"), this.model = e;
   }
@@ -5579,7 +5579,7 @@ class Ss extends oe {
     this.isSelected(e, 0) ? this.unselectRow(e) : this.selectRow(e);
   }
 }
-class ys {
+class Cs {
   constructor(e, t, s) {
     this.r = e, this.g = t, this.b = s;
   }
@@ -5601,7 +5601,7 @@ class G {
     return e < t.middleValue ? G.getTwoColorGradientRGB(e, new be(t.minValue, t.minColor, t.middleValue, t.middleColor)) : e > t.middleValue ? G.getTwoColorGradientRGB(e, new be(t.middleValue, t.middleColor, t.maxValue, t.maxColor)) : `rgb(${t.middleColor.r}, ${t.middleColor.g}, ${t.middleColor.b})`;
   }
 }
-class Cs {
+class vs {
   constructor(e, t, s, o, i, r) {
     this.minValue = e, this.minColor = t, this.middleValue = s, this.middleColor = o, this.maxValue = i, this.maxColor = r;
   }
@@ -5612,6 +5612,58 @@ class at {
   }
 }
 class ct {
+  constructor(e) {
+    this.object = e;
+  }
+  openDialog() {
+    const e = document.createElement("dialog");
+    e.classList.add("ge-table-crud-object-view"), e.innerHTML = `
+      <div class="ge-table-dialog-header">Item</div>
+      <div class="ge-table-dialog-content">
+        ${this.generateHtmlTable(this.object)}
+      </div>
+      <div class="ge-table-dialog-footer">
+        <button class="ge-table-dialog-footer-close-button" style="">Close</button>
+      </div>
+    `, document.body.appendChild(e), e.querySelector(".ge-table-dialog-footer-close-button").addEventListener("click", () => {
+      e.close("close"), e.remove();
+    }), e.showModal();
+  }
+  getCombinedKey(e, t) {
+    return e ? `${e}.${t}` : t;
+  }
+  getLabel(e) {
+    return e.replace(/\./g, " ");
+  }
+  generateHtmlTable(e) {
+    return `<table>
+      <thead>
+        <tr>
+          <th>Property</th>
+          <th>Value</th>
+        </tr>
+      </thead>
+      <tbody>
+        ${this.generateTableRows(e)}
+      </tbody>
+    </table>`;
+  }
+  generateTableRows(e, t = "") {
+    const s = [], o = (i, r = null, l = !1) => `
+    <tr>
+      <td${l ? ' class="ge-table-crud-object-view-object-child"' : ""}>${i}</td>
+      <td>${r ?? ""}</td>
+    </tr>`;
+    for (const i in e) {
+      if (!e.hasOwnProperty(i))
+        continue;
+      const r = e[i], l = this.getCombinedKey(t, i), n = this.getLabel(l);
+      typeof r == "object" && r !== null ? (s.push(o(n, null, !0)), s.push(this.generateTableRows(r, l))) : s.push(o(n, String(r)));
+    }
+    return s.join("");
+  }
+}
+class dt {
   constructor() {
     this.urls = {
       list: {
@@ -5619,13 +5671,13 @@ class ct {
         method: "GET"
       }
     }, this.singleRowActions = [
-      new _("VIEW", "View", "", "", "link"),
-      new _("EDIT", "Edit", "", "", "link"),
-      new _("CLONE", "Clone", "", "", "link"),
-      new _("DELETE", "Delete", "", "", "link")
+      new $("VIEW", "View", "", "", "link"),
+      new $("EDIT", "Edit", "", "", "link"),
+      new $("CLONE", "Clone", "", "", "link"),
+      new $("DELETE", "Delete", "", "", "link")
     ], this.tableActions = [
-      new _("CREATE", "Create", "", "", "button"),
-      new _("DELETE_SELECTED", "Delete Selected", "", "", "button")
+      new $("CREATE", "Create", "", "", "button"),
+      new $("DELETE_SELECTED", "Delete Selected", "", "", "button")
     ], this.autoAddActionColumn = !0, this.columnWidths = new at(), this.calcFixedRightColumnCount = (e) => e > 6 ? 1 : 0, this.getHeadersInit = () => ({}), this.getIdByObject = (e) => "id" in e ? e.id : e, this.fetchList = (e) => {
       const t = e.getHeadersInit ? e.getHeadersInit() : {};
       let s = e.urls.list.url, o = e.urls.list.method ?? "GET";
@@ -5656,9 +5708,9 @@ class ct {
     }, this.getId = (e) => e.id;
   }
 }
-class vs {
+class As {
   constructor() {
-    this.crudOptions = new ct(), this.listenActionEvent = (e) => {
+    this.crudOptions = new dt(), this.listenActionEvent = (e) => {
     };
   }
   createTableModel(e, t, s = (i) => {
@@ -5674,9 +5726,9 @@ class vs {
           hoverColumnVisible: !1,
           getSelectionModel: a
         };
-        const d = this.calcAutoColumnWidths(i, n), u = (r = t.columnDefs) != null && r.length ? t.columnDefs : n.map((g, b) => new $(g, g.toUpperCase(), new x(d[b], "px")));
+        const d = this.calcAutoColumnWidths(i, n), u = (r = t.columnDefs) != null && r.length ? t.columnDefs : n.map((g, b) => new O(g, g.toUpperCase(), new x(d[b], "px")));
         if (e.autoAddActionColumn) {
-          let g = new $(
+          let g = new O(
             "id",
             "Actions",
             Je,
@@ -5689,7 +5741,7 @@ class vs {
           ), u.push(g);
         }
         const f = 0, p = e.calcFixedRightColumnCount(u.length);
-        this.tableModel = O.buildByTypedRowsParam({
+        this.tableModel = _.buildByTypedRowsParam({
           rows: i,
           columnDefs: u,
           tableOptions: this.tableOptions,
@@ -5705,7 +5757,7 @@ class vs {
     var t, s;
     if (this.listenActionEvent && this.listenActionEvent(e), e.action === "VIEW") {
       let o = e.id;
-      (t = this.crudOptions) == null || t.fetchItem(this.crudOptions, o).then((i) => (console.info(i), i));
+      (t = this.crudOptions) == null || t.fetchItem(this.crudOptions, o).then((i) => (console.info(i), new ct(i).openDialog(), i));
     } else if (e.action === "DELETE") {
       let o = e.id;
       (s = this.crudOptions) == null || s.deleteItem(this.crudOptions, o).then((i) => {
@@ -5755,7 +5807,7 @@ class vs {
     return s;
   }
 }
-class As {
+class Rs {
   constructor(e, t) {
     this.method = e, this.url = t;
   }
@@ -5764,42 +5816,43 @@ export {
   re as AbstractAreaModel,
   nt as ActionEvent,
   lt as ActionsCellRenderer,
-  Qt as AreaMapFactory,
-  os as AreaModel,
+  es as AreaMapFactory,
+  is as AreaModel,
   D as AreaModelArrayOfArrays,
-  is as AreaModelCellGroups,
+  rs as AreaModelCellGroups,
   F as AreaModelHidden,
   et as AreaModelObjectArray,
   fe as AreaModelObjectArrayWithColumndefs,
   ue as AreaModelTree,
   k as AreaObjectMap,
-  ss as AutoRestoreOptions,
-  ht as AvoidDoubleExecution,
+  os as AutoRestoreOptions,
+  ut as AvoidDoubleExecution,
   it as CellGroup,
   rt as CellGroupExt,
   Q as CellGroupExtCellRenderer,
   R as CellRange,
   T as CellgroupFactory,
-  ls as CheckboxBooleanPropertyCellRenderer,
+  as as CheckboxBooleanPropertyCellRenderer,
   me as CheckboxCellRenderer,
-  Zt as CheckboxColumnDef,
+  Qt as CheckboxColumnDef,
   Qe as CheckboxModel,
-  zt as ChunkData,
+  Ut as ChunkData,
   Pe as ColAndRowspanModel,
   Ie as CollapsedExpandedData,
-  ys as ColorRgb,
-  $ as ColumnDef,
+  Cs as ColorRgb,
+  O as ColumnDef,
   at as ColumnWidths,
   Re as ConvenienceDomService,
   U as CopyService,
-  _ as CrudAction,
-  ct as CrudOptions,
-  vs as CrudTableModelFactory,
+  $ as CrudAction,
+  ct as CrudObjectView,
+  dt as CrudOptions,
+  As as CrudTableModelFactory,
   ae as CssVars,
-  cs as DateToIntlDDMMYYYYCellRenderer,
-  as as DateToIsoCellRenderer,
-  ds as DateToLocaleDateCellRenderer,
-  ps as DateToTecCellRenderer,
+  ds as DateToIntlDDMMYYYYCellRenderer,
+  cs as DateToIsoCellRenderer,
+  hs as DateToLocaleDateCellRenderer,
+  fs as DateToTecCellRenderer,
   V as DefaultRowHeights,
   Le as EleScope,
   le as EventAdapter,
@@ -5808,28 +5861,28 @@ export {
   Ue as FocusModel,
   Be as GeCellIndices,
   G as GeCssColorUtil,
-  rs as GeFilterService,
-  es as GeKeyEvent,
+  ns as GeFilterService,
+  ts as GeKeyEvent,
   se as GeModelChangeEvent,
   ee as GeMouseEvent,
   L as GeoData,
   P as Icon,
-  Ut as IndexAndPx,
+  jt as IndexAndPx,
   ze as InputCellRenderer,
-  $e as InputHandler,
+  Oe as InputHandler,
   B as LicenseManager,
-  hs as MaleFemaleToIconCellRenderer,
+  us as MaleFemaleToIconCellRenderer,
   Me as MouseHandler,
   Ee as MouseTargetData,
-  Ss as MultiRowsSelectionModel,
-  us as NumberCellProgressBarCellRenderer,
-  fs as NumberCellRenderer,
+  ys as MultiRowsSelectionModel,
+  gs as NumberCellProgressBarCellRenderer,
+  ms as NumberCellRenderer,
   Ve as OsxShortcutActionIdMapping,
   pe as Padding,
-  xs as PositiveAndNegativeNumberRenderer,
-  bs as ProgressBarCellRenderer,
-  _e as RenderScope,
-  ns as Renderer,
+  ws as PositiveAndNegativeNumberRenderer,
+  xs as ProgressBarCellRenderer,
+  $e as RenderScope,
+  ls as Renderer,
   st as RequestChunk,
   Ye as ResizeHandler,
   Ce as SelectCellRenderer,
@@ -5838,76 +5891,76 @@ export {
   Ne as ShortcutService,
   Ge as SimpleDomService,
   x as Size,
-  Oe as SortItem,
+  _e as SortItem,
   we as SortedOptions,
-  ms as StarRatingCellRenderer,
+  bs as StarRatingCellRenderer,
   De as StoreStateCollapsedExpandService,
   ke as StoreStateScrollPosService,
   Fe as StoreStateSortingService,
   Te as TableApi,
-  ts as TableCellUpdateEvent,
-  O as TableFactory,
+  ss as TableCellUpdateEvent,
+  _ as TableFactory,
   q as TableModel,
   tt as TableModelAndOptions,
   z as TableOptions,
   Se as TableScope,
-  Cs as ThreeColorGradientArg,
+  vs as ThreeColorGradientArg,
   ge as TreeCheckboxModel,
   Z as TreeFactory,
   xe as TreeOptions,
   ce as TreeRow,
   Ze as TreeRowService,
-  gs as TrueFalseCellRenderer,
+  ps as TrueFalseCellRenderer,
   qe as TrueFn,
   be as TwoColorGradientArg,
-  As as UrlInfo,
+  Rs as UrlInfo,
   ot as ValueLabel,
   We as WindowsShortcutActionIdMapping,
-  Gt as actionIds,
-  qt as allCenter,
-  Kt as allLeft,
-  Jt as allRight,
-  Xt as bodyCenter,
-  jt as bodyLeft,
-  Yt as bodyRight,
+  zt as actionIds,
+  Jt as allCenter,
+  qt as allLeft,
+  Zt as allRight,
+  Yt as bodyCenter,
+  Xt as bodyLeft,
+  Kt as bodyRight,
   ve as debounce,
-  ws as editInputPipeForNumber,
+  Ss as editInputPipeForNumber,
   Y as getAreaIdentByString,
   J as isAreaModelTree,
   Ae as isCheckboxColumnDef,
   W as isTreeRow,
-  Nt as px0,
-  Vt as px10,
-  Ft as px100,
-  Dt as px110,
-  It as px120,
-  kt as px130,
-  Tt as px140,
-  Mt as px150,
-  Et as px160,
-  Rt as px170,
-  At as px180,
-  vt as px190,
-  Wt as px20,
+  Gt as px0,
+  Nt as px10,
+  Lt as px100,
+  Ft as px110,
+  Dt as px120,
+  It as px130,
+  kt as px140,
+  Tt as px150,
+  Mt as px160,
+  Et as px170,
+  Rt as px180,
+  At as px190,
+  Vt as px20,
   he as px200,
-  Ct as px210,
-  yt as px220,
-  St as px230,
-  wt as px240,
-  xt as px250,
-  bt as px260,
-  mt as px270,
-  ft as px280,
-  pt as px290,
-  Ht as px30,
+  vt as px210,
+  Ct as px220,
+  yt as px230,
+  St as px240,
+  wt as px250,
+  xt as px260,
+  bt as px270,
+  mt as px280,
+  ft as px290,
+  Wt as px30,
   Je as px300,
-  Bt as px40,
-  gt as px400,
-  $t as px50,
-  ut as px500,
+  Ht as px40,
+  pt as px400,
+  Bt as px50,
+  gt as px500,
   Ot as px60,
   _t as px70,
-  Pt as px80,
-  Lt as px90,
-  dt as throttle
+  $t as px80,
+  Pt as px90,
+  ht as throttle
 };