q2-tecton-elements 1.60.2 → 1.61.0

package/dist/q2-tecton-elements/q2-data-table.entry.js

@@ -1,10 +1,10 @@
-import { r as t, c as e, h as a, F as o, g as r } from "./index-CGkHOjh1.js";
+import { r as t, c as e, h as a, F as r, g as o } from "./index-CGkHOjh1.js";
 
-import { b as l, l as n } from "./index-xCuy-dFb.js";
+import { b as l, l as n } from "./index-LNnzUeDP.js";
 
-const c = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}.container{--comp-cell-padding:var(--tct-data-table-cell-padding, var(--tct-table-cell-padding, var(--app-scale-3x, 15px)));--comp-select-column-width:var(--tct-data-table-select-column-width, var(--tct-table-select-column-width, var(--tct-checkbox-size, 20px)));--comp-dropdown-column-width:var(--tct-data-table-dropdown-column-width, var(--tct-table-dropdown-column-width, var(--tct-btn-icon-width, 44px)));--comp-expandable-row-control-column-width:var(--tct-data-table-expandable-row-control-column-width, var(--tct-table-expandable-row-control-column-width, var(--tct-btn-icon-width, 44px)));overflow:auto;--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 4px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}.container::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}.container::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}.container::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}:host([shadowed]:not([shadowed=false])) .container{box-shadow:var(--tct-data-table-shadow, var(--tct-table-shadow, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14))))}:host([density=compact]) .container{--comp-cell-padding:var(--tct-data-table-cell-padding-compact, var(--tct-table-cell-padding-compact, var(--app-scale-1x, 5px)))}:host([density=comfortable]) .container{--comp-cell-padding:var(--tct-data-table-cell-padding-comfortable, var(--tct-table-cell-padding-comfortable, var(--app-scale-5x, 25px)))}table{table-layout:var(--tct-data-table-layout, var(--tct-table-layout, auto));border-collapse:collapse;border-spacing:0;width:var(--tct-data-table-width, var(--tct-table-width));min-width:100%;background:var(--tct-data-table-background, var(--tct-table-background, var(--t-base, #ffffff)));backdrop-filter:var(--tct-data-table-backdrop-filter, none);caption-side:var(--tct-data-table-caption-side, var(--tct-table-caption-side, bottom))}thead{border-width:var(--tct-data-table-header-border-width, var(--tct-table-header-border-width, 0 0 2px 0));border-style:var(--tct-data-table-header-border-style, var(--tct-table-header-border-style, solid));border-color:var(--tct-data-table-header-border-color, var(--tct-table-header-border-color, var(--t-gray-9, #999999)));background:var(--tct-data-table-header-background, var(--tct-table-header-background))}col.select-column{width:var(--comp-select-column-width)}col.expandable-row-control-column{width:var(--comp-expandable-row-control-column-width)}col.dropdown-column{width:var(--comp-dropdown-column-width)}:host(:is([bordered=vertical],[bordered=grid])) col{border-width:var(--tct-data-table-column-border-width, 0 1px 0 0);border-style:var(--tct-data-table-column-border-style, solid);border-color:var(--tct-data-table-column-border-color, var(--t-gray-9, #999999))}:host(:is([bordered=vertical],[bordered=grid])) col:last-child{border:none}td,th{padding:var(--comp-cell-padding);text-align:start;vertical-align:middle}td.align-end,th.align-end{text-align:end}td.align-center,th.align-center{text-align:center}td.vertical-align-top,th.vertical-align-top{vertical-align:top}td.vertical-align-bottom,th.vertical-align-bottom{vertical-align:bottom}th .header-content{font-weight:var(--tct-data-table-header-font-weight, var(--tct-table-header-font-weight, 600));font-size:var(--tct-data-table-header-font-size, var(--app-font-size, 14px))}th.sorted .header-content{font-weight:var(--tct-data-table-header-sorted-font-weight, var(--tct-table-header-sorted-font-weight, 600))}th .sorted-indicator{--comp-header-sortable-icon-size:var(--tct-data-table-header-sortable-icon-size, var(--tct-table-header-sortable-icon-size, var(--app-scale-3x, 15px)));--tct-icon-stroke-width:2;width:var(--comp-header-sortable-icon-size);height:var(--comp-header-sortable-icon-size)}th .sorted-indicator.direction-ASC{transform:rotate(180deg)}th q2-btn .header-content{display:flex;align-items:center;gap:var(--tct-data-table-header-content-gap, var(--tct-table-header-content-gap, var(--app-scale-2x, 10px)))}tr.expandable,tr.clickable{cursor:pointer}tr.expandable:focus,tr.clickable:focus{outline:none;box-shadow:none}tr.striped-even{background:var(--tct-data-table-row-even-background, var(--t-gray-14, #f2f2f2))}tr.striped-odd{background:var(--tct-data-table-row-odd-background, transparent)}tr.expandable:hover{background:var(--tct-data-table-expandable-row-hover-background, var(--tct-table-expandable-row-hover-background, var(--t-gray-14, #f2f2f2)))}tr.clickable:hover{background:var(--tct-data-table-clickable-row-hover-background, var(--tct-table-clickable-row-hover-background, var(--t-gray-14, #f2f2f2)))}tr.selected{background:var(--tct-data-table-selected-row-background, var(--tct-table-selected-row-background, var(--t-gray-14, #f2f2f2)))}tr.expanded{background:var(--tct-data-table-expanded-row-background, var(--tct-table-expanded-row-background, var(--t-gray-14, #f2f2f2)))}tr.expanded .toggle-expandable-row{transform:rotate(180deg)}:host(:is([bordered],[bordered=horizontal],[bordered=grid]):not([bordered=vertical],[bordered=false])) tbody tr{border-width:var(--tct-data-table-row-border-width, var(--tct-table-row-border-width, 0 0 1px 0));border-style:var(--tct-data-table-row-border-style, var(--tct-table-row-border-style, solid));border-color:var(--tct-data-table-row-border-color, var(--tct-table-row-border-color, var(--t-gray-9, #999999)))}tr.loading-row{background:var(--tct-data-table-loading-row-background, var(--tct-table-loading-row-background, var(--t-base, #ffffff)))}tr.loading-row td{text-align:center}tr.loading-row q2-loading{font-size:4em}tr.empty-state{background:var(--tct-data-table-loading-row-background, var(--t-base, #ffffff))}tr.empty-state td{text-align:center}tr.empty-state .empty-state-content{display:flex;flex-direction:column;align-items:center;padding-top:var(--app-scale-10x, 50px);padding-bottom:var(--app-scale-10x, 50px);gap:var(--app-scale-4x, 20px);--tct-icon-size:var(--app-scale-6x, 30px)}tr.expandable-row{background:var(--tct-data-table-expanded-row-background, var(--tct-table-expanded-row-background, var(--t-gray-14, #f2f2f2)))}td.clamped div{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--comp-line-clamp-count, 1);-webkit-box-orient:vertical}td.expandable-row-control-column{--tct-btn-icon-hover-bg:transparent;padding:var(--tct-data-table-expandable-row-control-column-padding, var(--tct-table-expandable-row-control-column-padding, 0 5px));text-align:center}td.dropdown-column{padding:var(--tct-data-table-dropdown-column-padding, var(--tct-table-dropdown-column-padding, 0 5px));text-align:center}td.click-column:not(.sr){padding:var(--tct-data-table-clickable-column-padding, var(--tct-table-clickable-column-padding, 0 5px));text-align:center}caption{padding:var(--tct-data-table-caption-padding, var(--tct-table-caption-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-data-table-caption-font-size, var(--tct-table-caption-font-size, inherit));font-weight:var(--tct-data-table-caption-font-weight, var(--tct-table-caption-font-weight, 600));text-align:var(--tct-data-table-caption-text-align, var(--tct-table-caption-text-align, center));color:var(--tct-data-table-caption-color, var(--tct-table-caption-color, inherit))}q2-checkbox{padding:0}";
+const d = "*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}.container{--comp-cell-padding:var(--tct-data-table-cell-padding, var(--tct-table-cell-padding, var(--app-scale-3x, 15px)));--comp-select-column-width:var(--tct-data-table-select-column-width, var(--tct-table-select-column-width, var(--tct-checkbox-size, 20px)));--comp-dropdown-column-width:var(--tct-data-table-dropdown-column-width, var(--tct-table-dropdown-column-width, var(--tct-btn-icon-width, 44px)));--comp-expandable-row-control-column-width:var(--tct-data-table-expandable-row-control-column-width, var(--tct-table-expandable-row-control-column-width, var(--tct-btn-icon-width, 44px)));overflow:auto;--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 4px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}.container::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}.container::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}.container::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}:host([shadowed]:not([shadowed=false])) .container{box-shadow:var(--tct-data-table-shadow, var(--tct-table-shadow, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14))))}:host([density=compact]) .container{--comp-cell-padding:var(--tct-data-table-cell-padding-compact, var(--tct-table-cell-padding-compact, var(--app-scale-1x, 5px)))}:host([density=comfortable]) .container{--comp-cell-padding:var(--tct-data-table-cell-padding-comfortable, var(--tct-table-cell-padding-comfortable, var(--app-scale-5x, 25px)))}table{table-layout:var(--tct-data-table-layout, var(--tct-table-layout, auto));border-collapse:collapse;border-spacing:0;width:var(--tct-data-table-width, var(--tct-table-width));min-width:100%;background:var(--tct-data-table-background, var(--tct-table-background, var(--t-base, #ffffff)));backdrop-filter:var(--tct-data-table-backdrop-filter, none);caption-side:var(--tct-data-table-caption-side, var(--tct-table-caption-side, bottom))}thead{border-width:var(--tct-data-table-header-border-width, var(--tct-table-header-border-width, 0 0 2px 0));border-style:var(--tct-data-table-header-border-style, var(--tct-table-header-border-style, solid));border-color:var(--tct-data-table-header-border-color, var(--tct-table-header-border-color, var(--t-gray-9, #999999)));background:var(--tct-data-table-header-background, var(--tct-table-header-background))}col.select-column{width:var(--comp-select-column-width)}col.expandable-row-control-column{width:var(--comp-expandable-row-control-column-width)}col.dropdown-column{width:var(--comp-dropdown-column-width)}:host(:is([bordered=vertical],[bordered=grid])) col{border-width:var(--tct-data-table-column-border-width, 0 1px 0 0);border-style:var(--tct-data-table-column-border-style, solid);border-color:var(--tct-data-table-column-border-color, var(--t-gray-9, #999999))}:host(:is([bordered=vertical],[bordered=grid])) col:last-child{border:none}td,th{padding:var(--comp-cell-padding);text-align:start;vertical-align:middle}td.align-end,th.align-end{text-align:end}td.align-center,th.align-center{text-align:center}td.vertical-align-top,th.vertical-align-top{vertical-align:top}td.vertical-align-bottom,th.vertical-align-bottom{vertical-align:bottom}th .header-content{font-weight:var(--tct-data-table-header-font-weight, var(--tct-table-header-font-weight, 600));font-size:var(--tct-data-table-header-font-size, var(--app-font-size, 14px))}th.sorted .header-content{font-weight:var(--tct-data-table-header-sorted-font-weight, var(--tct-table-header-sorted-font-weight, 600))}th .sorted-indicator{--comp-header-sortable-icon-size:var(--tct-data-table-header-sortable-icon-size, var(--tct-table-header-sortable-icon-size, var(--app-scale-3x, 15px)));--tct-icon-stroke-width:2;width:var(--comp-header-sortable-icon-size);height:var(--comp-header-sortable-icon-size)}th .sorted-indicator.direction-ASC{transform:rotate(180deg)}th q2-btn .header-content{display:flex;align-items:center;gap:var(--tct-data-table-header-content-gap, var(--tct-table-header-content-gap, var(--app-scale-2x, 10px)))}tr.expandable,tr.clickable{cursor:pointer}tr.expandable:focus,tr.clickable:focus{outline:none;box-shadow:none}tr.expandable{--tct-btn-icon-hover-background:transparent}tr.expandable:hover{background:var(--tct-data-table-expandable-row-hover-background, var(--t-gray-14, #f2f2f2))}tr.striped-even{background:var(--tct-data-table-row-even-background, var(--t-gray-14, #f2f2f2))}tr.striped-even.expanded{background:var(--tct-data-table-expanded-row-even-background, var(--tct-data-table-expanded-row-background, var(--t-gray-14, #f2f2f2)))}tr.striped-even.expandable:hover{background:var(--tct-data-table-expandable-row-even-hover-background, var(--tct-data-table-expandable-row-hover-background, var(--t-gray-14, #f2f2f2)))}tr.striped-odd{background:var(--tct-data-table-row-odd-background, transparent)}tr.striped-odd.expanded{background:var(--tct-data-table-expanded-row-odd-background, var(--tct-data-table-expanded-row-background, var(--t-gray-14, transparent)))}tr.striped-odd.expandable:hover{background:var(--tct-data-table-expandable-row-odd-hover-background, var(--tct-data-table-expandable-row-hover-background, var(--t-gray-14, #f2f2f2)))}tr.clickable:hover{background:var(--tct-data-table-clickable-row-hover-background, var(--tct-table-clickable-row-hover-background, var(--t-gray-14, #f2f2f2)))}tr.selected{background:var(--tct-data-table-selected-row-background, var(--tct-table-selected-row-background, var(--t-gray-14, #f2f2f2)))}tr.expanded{background:var(--tct-data-table-expanded-row-background, var(--tct-table-expanded-row-background, var(--t-gray-14, #f2f2f2)))}tr.expanded .toggle-expandable-row{transform:rotate(180deg)}:host(:is([bordered],[bordered=horizontal],[bordered=grid]):not([bordered=vertical],[bordered=false])) tbody tr{border-width:var(--tct-data-table-row-border-width, var(--tct-table-row-border-width, 0 0 1px 0));border-style:var(--tct-data-table-row-border-style, var(--tct-table-row-border-style, solid));border-color:var(--tct-data-table-row-border-color, var(--tct-table-row-border-color, var(--t-gray-9, #999999)))}tr.loading-row{background:var(--tct-data-table-loading-row-background, var(--tct-table-loading-row-background, var(--t-base, #ffffff)))}tr.loading-row td{text-align:center}tr.loading-row q2-loading{font-size:4em}tr.empty-state{background:var(--tct-data-table-loading-row-background, var(--t-base, #ffffff))}tr.empty-state td{text-align:center}tr.empty-state .empty-state-content{display:flex;flex-direction:column;align-items:center;padding-top:var(--app-scale-10x, 50px);padding-bottom:var(--app-scale-10x, 50px);gap:var(--app-scale-4x, 20px);--tct-icon-size:var(--app-scale-6x, 30px)}tr.expandable-row{background:var(--tct-data-table-expanded-row-background, var(--tct-table-expanded-row-background, var(--t-gray-14, #f2f2f2)))}.striped-odd+tr.expandable-row{background:var(--tct-data-table-expanded-row-odd-background, var(--tct-data-table-expanded-row-background, var(--t-gray-14, transparent)))}.striped-even+tr.expandable-row{background:var(--tct-data-table-expanded-row-even-background, var(--tct-data-table-expanded-row-background, var(--t-gray-14, transparent)))}td.clamped div{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--comp-line-clamp-count, 1);-webkit-box-orient:vertical}td.expandable-row-control-column{--tct-btn-icon-hover-bg:transparent;padding:var(--tct-data-table-expandable-row-control-column-padding, var(--tct-table-expandable-row-control-column-padding, 0 5px));text-align:center}td.dropdown-column{padding:var(--tct-data-table-dropdown-column-padding, var(--tct-table-dropdown-column-padding, 0 5px));text-align:center}td.click-column:not(.sr){padding:var(--tct-data-table-clickable-column-padding, var(--tct-table-clickable-column-padding, 0 5px));text-align:center}caption{padding:var(--tct-data-table-caption-padding, var(--tct-table-caption-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-data-table-caption-font-size, var(--tct-table-caption-font-size, inherit));font-weight:var(--tct-data-table-caption-font-weight, var(--tct-table-caption-font-weight, 600));text-align:var(--tct-data-table-caption-text-align, var(--tct-table-caption-text-align, center));color:var(--tct-data-table-caption-color, var(--tct-table-caption-color, inherit))}q2-checkbox{padding:0}";
 
-const d = class {
+const c = class {
   constructor(a) {
     t(this, a);
     this.click = e(this, "click", 7);
@@ -34,9 +34,9 @@ const d = class {
          * Use of this property requires `selectable` to be set to `true`.
          */    this.selectMode = "multiple";
     this.checkSlots = () => {
-      var t, e, a, o;
+      var t, e, a, r;
       this.hasExpandableRows = !!((e = (t = this.hostElement) === null || t === void 0 ? void 0 : t.querySelector(`[slot$="-expandable-content"]`)) !== null && e !== void 0 ? e : false);
-      this.hasDropdowns = !!((o = (a = this.hostElement) === null || a === void 0 ? void 0 : a.querySelector(`[slot$="-dropdown"]`)) !== null && o !== void 0 ? o : false);
+      this.hasDropdowns = !!((r = (a = this.hostElement) === null || a === void 0 ? void 0 : a.querySelector(`[slot$="-dropdown"]`)) !== null && r !== void 0 ? r : false);
       // The booleans above may not change, even if the slot has content
       // So we increment this property to force a re-render and ensure proper rendering
             this.checkSlotCount += 1;
@@ -59,43 +59,43 @@ const d = class {
     };
     this.onSelectRow = (t, e) => {
       t.stopPropagation();
-      const {selectMode: a, serializedRows: o, selectedRows: r} = this;
+      const {selectMode: a, serializedRows: r, selectedRows: o} = this;
       const {checked: l} = t.detail;
       const n = Object.assign(Object.assign({}, e), {
         selected: l
       });
-      let c;
+      let d;
       if (a === "single") {
-        c = l ? [ n ] : [];
+        d = l ? [ n ] : [];
       } else {
-        c = l ? [ ...r, n ] : r.filter((t => t.id !== n.id));
+        d = l ? [ ...o, n ] : o.filter((t => t.id !== n.id));
       }
-      const d = c.length === o.length;
-      const i = !d && c.length > 0;
+      const c = d.length === r.length;
+      const i = !c && d.length > 0;
       const s = this.select.emit({
         row: n,
-        rows: c,
-        allSelected: d
+        rows: d,
+        allSelected: c
       });
       if (s.defaultPrevented) return;
       this.serializedRows = this.serializedRows.map((t => t.id === n.id ? n : t));
-      this.allRowsSelected = d;
+      this.allRowsSelected = c;
       this.someRowsSelected = i;
     };
     this.onSort = t => {
       const e = t.sorted === "ASC" ? "DESC" : "ASC";
       const a = t.key;
-      const o = this.sort.emit({
+      const r = this.sort.emit({
         header: t,
         direction: e
       });
-      if (o.defaultPrevented) return;
-      const r = t.sortable !== "manual";
-      if (!r) return;
+      if (r.defaultPrevented) return;
+      const o = t.sortable !== "manual";
+      if (!o) return;
       this.serializedHeaders = this.serializedHeaders.map((t => {
-        const o = a === t.key ? e : undefined;
+        const r = a === t.key ? e : undefined;
         return Object.assign(Object.assign({}, t), {
-          sorted: o
+          sorted: r
         });
       }));
       this.serializedRows = this.sortRows(this.serializedRows, Object.assign(Object.assign({}, t), {
@@ -107,10 +107,10 @@ const d = class {
       const a = Object.assign(Object.assign({}, e), {
         expanded: !e.expanded
       });
-      const o = this.toggle.emit({
+      const r = this.toggle.emit({
         row: a
       });
-      if (o.defaultPrevented) return;
+      if (r.defaultPrevented) return;
       this.serializedRows = this.serializedRows.map((t => {
         if (t.id === a.id) return a; else return Object.assign({}, t);
       }));
@@ -164,12 +164,12 @@ const d = class {
         });
       }
     })) : [];
-    const o = this.select.emit({
+    const r = this.select.emit({
       row: undefined,
       rows: a,
       allSelected: e
     });
-    if (o.defaultPrevented) return;
+    if (r.defaultPrevented) return;
     this.serializedRows = this.serializedRows.map((t => {
       if (t.disabled) return t;
       t.selected = e;
@@ -194,10 +194,10 @@ const d = class {
      *
      * @testOnly
      */  async getCellContent(t, e) {
-    var a, o;
-    const r = (a = this.hostElement.querySelector(`[slot=row-${t}-cell-${e}`)) === null || a === void 0 ? void 0 : a.textContent;
-    const l = (o = this.hostElement.shadowRoot.querySelector(`slot[name=row-${t}-cell-${e}]`)) === null || o === void 0 ? void 0 : o.textContent;
-    return r || l || "";
+    var a, r;
+    const o = (a = this.hostElement.querySelector(`[slot=row-${t}-cell-${e}`)) === null || a === void 0 ? void 0 : a.textContent;
+    const l = (r = this.hostElement.shadowRoot.querySelector(`slot[name=row-${t}-cell-${e}]`)) === null || r === void 0 ? void 0 : r.textContent;
+    return o || l || "";
   }
   /**
      * A method to sort a column that accepts a header object with key</b> and <b>sorted</b> property.
@@ -247,7 +247,7 @@ const d = class {
   }
   rowsHandler(t = []) {
     const {serializedHeaders: e, mappedHeaders: a} = this;
-    const o = {
+    const r = {
       id: null,
       cells: {},
       selected: false,
@@ -255,45 +255,45 @@ const d = class {
       disabled: false
     };
     // tracks if the select-all checkbox should be visually updated as the `rows` are built
-        let r = true;
+        let o = true;
     let l = false;
-    const n = t.map((({id: t, cells: e, selected: n, expanded: c, disabled: d}) => {
-      const i = Object.entries(e).reduce(((t, [e, o]) => {
-        const r = a[e] || {};
-        const {align: l, type: n = "text", lineClamp: c, verticalAlign: d} = r;
-        const i = "type" in r && r.type === "badge";
+    const n = t.map((({id: t, cells: e, selected: n, expanded: d, disabled: c}) => {
+      const i = Object.entries(e).reduce(((t, [e, r]) => {
+        const o = a[e] || {};
+        const {align: l, type: n = "text", lineClamp: d, verticalAlign: c} = o;
+        const i = "type" in o && o.type === "badge";
         const s = {
           value: "",
           ariaLabel: undefined,
           type: n,
           align: l,
-          lineClamp: c,
-          verticalAlign: d,
-          badgeStatus: i ? r.badgeStatus : undefined,
-          badgeTheme: i ? r.badgeTheme : undefined
+          lineClamp: d,
+          verticalAlign: c,
+          badgeStatus: i ? o.badgeStatus : undefined,
+          badgeTheme: i ? o.badgeTheme : undefined
         };
-        const b = typeof o === "object" ? Object.assign(Object.assign({}, s), o) : Object.assign(Object.assign({}, s), {
-          value: o
+        const b = typeof r === "object" ? Object.assign(Object.assign({}, s), r) : Object.assign(Object.assign({}, s), {
+          value: r
         });
         t[e] = b;
         return t;
       }), {});
-      if (r && !n) r = false;
-      if (!r && n) l = true;
-      return Object.assign(Object.assign({}, o), {
+      if (o && !n) o = false;
+      if (!o && n) l = true;
+      return Object.assign(Object.assign({}, r), {
         id: t,
         selected: !!n,
-        expanded: !!c,
-        disabled: !!d,
+        expanded: !!d,
+        disabled: !!c,
         cells: i
       });
     }));
-    const c = e.find((({sorted: t}) => t));
-    const d = !!c && c.sortable !== "manual";
+    const d = e.find((({sorted: t}) => t));
+    const c = !!d && d.sortable !== "manual";
     this.hasRowData = !!t.length;
-    this.allRowsSelected = this.hasRowData && r;
+    this.allRowsSelected = this.hasRowData && o;
     this.someRowsSelected = this.hasRowData && l;
-    this.serializedRows = !!d ? this.sortRows(n, c) : n;
+    this.serializedRows = !!c ? this.sortRows(n, d) : n;
     this.checkSlots();
   }
   selectableHandler() {
@@ -322,13 +322,13 @@ const d = class {
     return this.serializedRows.filter((({selected: t}) => t));
   }
   sortRows(t, e) {
-    const {key: a, sorted: o} = e;
-    const r = o || "ASC";
+    const {key: a, sorted: r} = e;
+    const o = r || "ASC";
     const l = [ ...t ].sort(((t, e) => {
-      const o = t.cells[a].value;
+      const r = t.cells[a].value;
       const l = e.cells[a].value;
-      if (o < l) return r === "ASC" ? -1 : 1;
-      if (o > l) return r === "ASC" ? 1 : -1;
+      if (r < l) return o === "ASC" ? -1 : 1;
+      if (r > l) return o === "ASC" ? 1 : -1;
       return 0;
     }));
     return l;
@@ -349,26 +349,26 @@ const d = class {
   }
   renderCellContent(t) {
     if (!t) return;
-    const {type: e, ariaLabel: o, value: r} = t;
-    if ([ undefined, null ].includes(r)) return;
+    const {type: e, ariaLabel: r, value: o} = t;
+    if ([ undefined, null ].includes(o)) return;
     switch (e) {
      case "badge":
       let e;
-      switch (typeof r) {
+      switch (typeof o) {
        case "string":
-        e = parseFloat(r);
+        e = parseFloat(o);
         break;
 
        case "boolean":
-        e = r ? 1 : 0;
+        e = o ? 1 : 0;
         break;
 
        default:
-        e = r;
+        e = o;
         break;
       }
       return a("q2-badge", {
-        "aria-label": o,
+        "aria-label": r,
         value: e,
         theme: t.badgeTheme,
         status: t.badgeStatus,
@@ -376,14 +376,14 @@ const d = class {
       });
 
      case "icon":
-      const l = typeof r === "string" ? r : `${r}`;
+      const l = typeof o === "string" ? o : `${o}`;
       return a("q2-icon", {
-        label: o,
+        label: r,
         type: l
       });
 
      case "boolean":
-      return !!r ? a("q2-icon", {
+      return !!o ? a("q2-icon", {
         label: n("tecton.element.dataTable.booleanTrue"),
         type: "checkmark"
       }) : a("div", {
@@ -392,17 +392,17 @@ const d = class {
 
      case "code":
       return a("code", {
-        "aria-label": o
-      }, r);
+        "aria-label": r
+      }, o);
 
      default:
       return a("div", {
-        "aria-label": o
-      }, r);
+        "aria-label": r
+      }, o);
     }
   }
   renderEmptyState() {
-    const {hasRowData: t, numberOfColumns: e, emptyIcon: o, emptyMessage: r, loading: l} = this;
+    const {hasRowData: t, numberOfColumns: e, emptyIcon: r, emptyMessage: o, loading: l} = this;
     if (t || l) return null;
     return a("tbody", null, a("tr", {
       class: "empty-state"
@@ -413,11 +413,11 @@ const d = class {
     }, a("div", {
       class: "empty-state-content"
     }, a("q2-icon", {
-      type: o
-    }), a("p", null, n(r)))))));
+      type: r
+    }), a("p", null, n(o)))))));
   }
   renderTableColGroup() {
-    const {serializedHeaders: t, selectable: e, clickable: o, hasExpandableRows: r, hasDropdowns: l} = this;
+    const {serializedHeaders: t, selectable: e, clickable: r, hasExpandableRows: o, hasDropdowns: l} = this;
     if (!t.length) return null;
     return a("colgroup", null, e && a("col", {
       class: "select-column"
@@ -426,16 +426,16 @@ const d = class {
         width: t,
         backgroundColor: e
       }
-    }))), o && a("col", {
+    }))), r && a("col", {
       class: "click-column"
-    }), r && a("col", {
+    }), o && a("col", {
       class: "expandable-row-control-column"
     }), l && a("col", {
       class: "dropdown-column"
     }));
   }
   renderTableHeader() {
-    const {serializedHeaders: t, selectable: e, clickable: o, hideClickable: r, selectMode: l, hasExpandableRows: c, hasDropdowns: d, allRowsSelected: i, someRowsSelected: s, hasRowData: b, loading: h} = this;
+    const {serializedHeaders: t, selectable: e, clickable: r, hideClickable: o, selectMode: l, hasExpandableRows: d, hasDropdowns: c, allRowsSelected: i, someRowsSelected: s, hasRowData: b, loading: h} = this;
     if (!t.length) return null;
     return a("thead", null, a("tr", null, e && a("th", null, l === "multiple" && a("q2-checkbox", {
       label: n("tecton.element.dataTable.selectAllRows"),
@@ -448,11 +448,11 @@ const d = class {
       disabled: h || !b,
       "test-id": "select-all-rows-control"
     })), t.map((t => {
-      const {align: e, sorted: o, verticalAlign: r} = t;
+      const {align: e, sorted: r, verticalAlign: o} = t;
       const l = [];
       if (e) l.push(`align-${e}`);
-      if (r) l.push(`vertical-align-${r}`);
-      if (!!o) l.push("sorted");
+      if (o) l.push(`vertical-align-${o}`);
+      if (!!r) l.push("sorted");
       return a("th", {
         class: l.join(" "),
         id: `header-${t.key}`
@@ -465,10 +465,10 @@ const d = class {
         "aria-label": t.ariaLabel || undefined
       }, a("slot", {
         name: `header-cell-${t.key}`
-      }, t.title), !!o ? a("q2-icon", {
-        class: `sorted-indicator direction-${o}`,
+      }, t.title), !!r ? a("q2-icon", {
+        class: `sorted-indicator direction-${r}`,
         type: "arrow-down",
-        label: o === "ASC" ? n("tecton.element.dataTable.sortedAscending") : n("tecton.element.dataTable.sortedDescending"),
+        label: r === "ASC" ? n("tecton.element.dataTable.sortedAscending") : n("tecton.element.dataTable.sortedDescending"),
         "test-id": "sorted-indicator"
       }) : a("q2-icon", {
         class: `sorted-indicator`,
@@ -481,21 +481,21 @@ const d = class {
       }, a("slot", {
         name: `header-cell-${t.key}`
       }, t.title)));
-    })), o && a("th", {
+    })), r && a("th", {
       id: "click",
-      class: r ? "sr" : undefined
+      class: o ? "sr" : undefined
     }, a("span", {
       class: "sr"
-    }, n("tecton.element.dataTable.clickRow"))), c && a("th", {
+    }, n("tecton.element.dataTable.clickRow"))), d && a("th", {
       id: "toggle"
     }, a("span", {
       class: "sr"
-    }, n("tecton.element.dataTable.toggleRow"))), d && a("th", null, a("span", {
+    }, n("tecton.element.dataTable.toggleRow"))), c && a("th", null, a("span", {
       class: "sr"
     }, n("tecton.element.dataTable.dropdown")))));
   }
   renderTableRows() {
-    const {serializedHeaders: t, serializedRows: e, selectable: r, clickable: l, striped: c, hideClickable: d, selectMode: i, hasExpandableRows: s, hasDropdowns: b, numberOfColumns: h, loading: p} = this;
+    const {serializedHeaders: t, serializedRows: e, selectable: o, clickable: l, striped: d, hideClickable: c, selectMode: i, hasExpandableRows: s, hasDropdowns: b, numberOfColumns: h, loading: p} = this;
     if (p) {
       return a("tbody", null, a("tr", {
         class: "loading-row"
@@ -513,9 +513,9 @@ const d = class {
     }
     const g = [];
     if (l) g.push("click-column");
-    if (d) g.push("sr");
+    if (c) g.push("sr");
     const w = g.join(" ");
-    return a("tbody", null, e.map(((e, d) => {
+    return a("tbody", null, e.map(((e, c) => {
       const i = `row-${e.id}-cell`;
       const p = `row-${e.id}-expandable-content`;
       const g = `row-${e.id}-dropdown`;
@@ -524,16 +524,16 @@ const d = class {
       const x = [];
       if (f) x.push("expandable");
       if (l) x.push("clickable");
-      if (c) x.push(`striped-${d % 2 ? "even" : "odd"}`);
+      if (d) x.push(`striped-${c % 2 ? "even" : "odd"}`);
       if (e.expanded) x.push("expanded");
       if (e.selected) x.push("selected");
       const k = l || f;
-      return a(o, null, a("tr", {
+      return a(r, null, a("tr", {
         id: `row-${e.id}`,
         class: x.join(" "),
         onClick: k && (t => this.onClickTableRow(t, e)),
         tabIndex: k ? -1 : undefined
-      }, r && a("td", {
+      }, o && a("td", {
         class: "select-column",
         onClick: this.onControlContainerClick
       }, a("q2-checkbox", {
@@ -544,23 +544,23 @@ const d = class {
         onChange: t => this.onSelectRow(t, e),
         "test-id": "select-row-control"
       })), t.map((({key: t}) => {
-        const o = e.cells[t];
-        const r = o === null || o === void 0 ? void 0 : o.lineClamp;
-        const l = o === null || o === void 0 ? void 0 : o.align;
-        const n = o === null || o === void 0 ? void 0 : o.verticalAlign;
-        const c = [];
-        if (l) c.push(`align-${l}`);
-        if (n) c.push(`vertical-align-${n}`);
-        if (r) c.push("clamped");
-        const d = r ? {
-          "--comp-line-clamp-count": `${r}`
+        const r = e.cells[t];
+        const o = r === null || r === void 0 ? void 0 : r.lineClamp;
+        const l = r === null || r === void 0 ? void 0 : r.align;
+        const n = r === null || r === void 0 ? void 0 : r.verticalAlign;
+        const d = [];
+        if (l) d.push(`align-${l}`);
+        if (n) d.push(`vertical-align-${n}`);
+        if (o) d.push("clamped");
+        const c = o ? {
+          "--comp-line-clamp-count": `${o}`
         } : undefined;
         return a("td", {
-          class: c.join(" "),
-          style: d
+          class: d.join(" "),
+          style: c
         }, a("slot", {
           name: `${i}-${t}`
-        }, this.renderCellContent(o)));
+        }, this.renderCellContent(r)));
       })), l && a("td", {
         class: w
       }, a("q2-btn", {
@@ -601,7 +601,7 @@ const d = class {
     })));
   }
   get hostElement() {
-    return r(this);
+    return o(this);
   }
   static get watchers() {
     return {
@@ -612,8 +612,8 @@ const d = class {
   }
 };
 
-d.style = c;
+c.style = d;
 
-export { d as q2_data_table };
+export { c as q2_data_table };
 //# sourceMappingURL=q2-data-table.entry.esm.js.map
 //# sourceMappingURL=q2-data-table.entry.js.map