energy-components 2.6.0 → 2.8.0

package/dist/components/tableRenderer.es.js

@@ -1,69 +1,151 @@
-import { reactive as le, ref as j, watch as M, getCurrentInstance as se, onUnmounted as re, defineComponent as oe, computed as w, onMounted as ae, nextTick as A, openBlock as o, createElementBlock as a, normalizeClass as b, createElementVNode as d, normalizeStyle as V, Fragment as z, renderList as K, unref as E, withModifiers as L, createCommentVNode as k, renderSlot as N, createVNode as H, toDisplayString as U } from "vue";
-import F from "./checkbox.es.js";
-import ie from "./loader.es.js";
-import { g as ce } from "./getInstance-GhoEcxLF.js";
-import { _ as de } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/tableRenderer.css';const P = 150, ue = 50;
-function X(s, u) {
-  if (!s) return u;
-  const n = Number.parseFloat(s);
-  return Number.isNaN(n) ? u : n;
+import { reactive as Se, ref as W, watch as q, getCurrentInstance as ve, onUnmounted as ye, computed as D, defineComponent as Ee, onMounted as Le, nextTick as J, openBlock as d, createElementBlock as u, normalizeClass as $, createElementVNode as m, normalizeStyle as Q, Fragment as N, renderList as Z, unref as O, withModifiers as ee, createCommentVNode as P, renderSlot as te, createVNode as oe, toDisplayString as se } from "vue";
+import de from "./checkbox.es.js";
+import ze from "./loader.es.js";
+import { g as Ae } from "./getInstance-GhoEcxLF.js";
+import { _ as Ke } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/tableRenderer.css';const ue = 150, Ie = 50;
+function fe(a, v) {
+  if (!a) return v;
+  const r = Number.parseFloat(a);
+  return Number.isNaN(r) ? v : r;
 }
-function ye(s) {
-  const u = le({}), n = j(null), g = () => {
-    const y = new Set(s.value.map((i) => i.key));
-    for (const i of Object.keys(u))
-      y.has(i) || delete u[i];
-    for (const i of s.value)
-      u[i.key] === void 0 && (u[i.key] = X(i.width, P));
+function He(a) {
+  const v = Se({}), r = W(null), f = () => {
+    const b = new Set(a.value.map((l) => l.key));
+    for (const l of Object.keys(v))
+      b.has(l) || delete v[l];
+    for (const l of a.value)
+      v[l.key] === void 0 && (v[l.key] = fe(l.width, ue));
   };
-  g(), M(s, g, { deep: !0 });
-  let v = 0, p = 0, h = null;
-  function S() {
-    document.removeEventListener("pointermove", x), document.removeEventListener("pointerup", C), document.removeEventListener("pointercancel", C), document.body.style.cursor = "", document.body.style.userSelect = "";
+  f(), q(a, f, { deep: !0 });
+  let S = 0, C = 0, E = null;
+  function k() {
+    document.removeEventListener("pointermove", y), document.removeEventListener("pointerup", x), document.removeEventListener("pointercancel", x), document.body.style.cursor = "", document.body.style.userSelect = "";
   }
-  function x(y) {
-    const i = n.value;
-    if (!i) return;
-    const f = s.value.find((R) => R.key === i), m = X(f?.minWidth, ue), $ = y.clientX - v;
-    u[i] = Math.max(m, p + $);
+  function y(b) {
+    const l = r.value;
+    if (!l) return;
+    const p = a.value.find((I) => I.key === l), _ = fe(p?.minWidth, Ie), K = b.clientX - S;
+    v[l] = Math.max(_, C + K);
   }
-  function C(y) {
-    n.value && (h?.(n.value), n.value = null, S());
+  function x(b) {
+    r.value && (E?.(r.value), r.value = null, k());
   }
-  function _(y) {
-    const i = new Set(s.value.map((f) => f.key));
-    for (const [f, m] of Object.entries(y))
-      i.has(f) && (!Number.isFinite(m) || m <= 0 || (u[f] = m));
+  function z(b) {
+    const l = new Set(a.value.map((p) => p.key));
+    for (const [p, _] of Object.entries(b))
+      l.has(p) && (!Number.isFinite(_) || _ <= 0 || (v[p] = _));
   }
-  function D(y, i, f, m) {
-    const $ = s.value.find((T) => T.key === y);
-    if (!$ || $.resizable !== !0) return;
-    n.value = y, v = i.clientX, p = m || u[y] || P, h = f, i.currentTarget?.setPointerCapture?.(i.pointerId), document.addEventListener("pointermove", x), document.addEventListener("pointerup", C), document.addEventListener("pointercancel", C), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none";
+  function w(b, l, p, _) {
+    const K = a.value.find((U) => U.key === b);
+    if (!K || K.resizable !== !0) return;
+    r.value = b, S = l.clientX, C = _ || v[b] || ue, E = p, l.currentTarget?.setPointerCapture?.(l.pointerId), document.addEventListener("pointermove", y), document.addEventListener("pointerup", x), document.addEventListener("pointercancel", x), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none";
   }
-  function B() {
-    n.value && (n.value = null, S());
+  function A() {
+    r.value && (r.value = null, k());
   }
-  return se() && re(() => {
-    S();
-  }), { columnWidths: u, resizingKey: n, startResize: D, stopResize: B, applyMeasuredWidths: _ };
+  return ve() && ye(() => {
+    k();
+  }), { columnWidths: v, resizingKey: r, startResize: w, stopResize: A, applyMeasuredWidths: z };
 }
-const be = { key: 0 }, fe = ["aria-sort", "onClick"], me = ["onPointerdown"], _e = {
+const Te = ["selection", "actions"];
+function ae(a, v) {
+  return a.type !== void 0 && v.includes(a.type) ? !1 : a.reorderable !== !1;
+}
+function Pe(a, v = {}) {
+  const r = v.excludeTypes ?? Te, f = W([]), S = () => {
+    const i = a.value.filter((c) => ae(c, r)).map((c) => c.key), g = f.value.filter((c) => i.includes(c)), R = i.filter((c) => !f.value.includes(c));
+    f.value = [...g, ...R];
+  };
+  S(), q(a, S, { deep: !0 });
+  const C = D(() => {
+    const i = a.value, g = f.value.map((c) => i.find((h) => h.key === c)).filter((c) => c !== void 0);
+    let R = 0;
+    return i.map((c) => ae(c, r) ? g[R++] ?? c : c);
+  }), E = W(!1), k = W(0), y = W(null), x = W(null);
+  let z = 0, w = -1, A = [], b = null;
+  function l() {
+    document.removeEventListener("pointermove", p), document.removeEventListener("pointerup", I), document.removeEventListener("pointercancel", U), document.removeEventListener("keydown", L), document.body.style.cursor = "", document.body.style.userSelect = "";
+  }
+  function p(i) {
+    E.value && (k.value = i.clientX - z);
+  }
+  function _(i) {
+    const g = C.value[i];
+    return !g || !ae(g, r) ? -1 : f.value.indexOf(g.key);
+  }
+  function K() {
+    const i = y.value;
+    if (i === null || !x.value || w === -1) {
+      H();
+      return;
+    }
+    const g = _(i);
+    if (g === -1) {
+      H();
+      return;
+    }
+    if (g === w) {
+      X();
+      return;
+    }
+    const R = [...f.value], [c] = R.splice(w, 1), h = Math.min(Math.max(g, 0), R.length);
+    R.splice(h, 0, c);
+    const F = w, le = h;
+    f.value = R, b?.({ keys: [...R], fromIndex: F, toIndex: le }), X();
+  }
+  function I(i) {
+    K();
+  }
+  function U(i) {
+    H();
+  }
+  function L(i) {
+    i.key === "Escape" && H();
+  }
+  function X() {
+    E.value = !1, k.value = 0, y.value = null, x.value = null, z = 0, w = -1, A = [], b = null, l();
+  }
+  function H() {
+    A.length > 0 && (f.value = [...A]), X();
+  }
+  function ne(i, g, R) {
+    const c = f.value.indexOf(i);
+    if (c === -1) return;
+    A = [...f.value], w = c, x.value = i, z = g.clientX || 0;
+    const h = C.value.findIndex((F) => F.key === i);
+    y.value = h === -1 ? null : h, E.value = !0, b = R, document.addEventListener("pointermove", p), document.addEventListener("pointerup", I), document.addEventListener("pointercancel", U), document.addEventListener("keydown", L), document.body.style.cursor = "grabbing", document.body.style.userSelect = "none";
+  }
+  function re(i) {
+    E.value && (y.value = i);
+  }
+  return ve() && ye(l), {
+    reorderedHeaders: C,
+    isDragging: E,
+    dragOffsetX: k,
+    dragOverIndex: y,
+    dragSourceKey: x,
+    startDrag: ne,
+    cancelDrag: H,
+    updateDragOver: re
+  };
+}
+const We = ["aria-sort", "aria-roledescription", "tabindex", "onClick", "onPointerdown", "onPointerenter", "onKeydown"], Me = ["onPointerdown"], Oe = {
   key: 0,
   class: "header-content header-content--center"
-}, ke = ["for"], ve = {
+}, Ue = ["for"], Xe = {
   key: 0,
   class: "rds-e-table-renderer__sortable-icon rds-flex rds-flex-center-center rds-flex-col"
-}, pe = {
+}, Be = {
   key: 0,
   class: "loading-row"
-}, ge = ["colspan"], he = { class: "loading-overlay" }, Ce = ["onClick"], $e = ["data-label"], Re = ["for"], we = {
+}, Ne = ["colspan"], Fe = { class: "loading-overlay" }, Ve = ["onClick"], qe = ["data-label"], je = ["for"], Ye = {
   key: 0,
   class: "rds-e-table-renderer__group--dropdown"
-}, ze = ["colspan"], Se = {
+}, Ge = ["colspan"], Je = {
   key: 1,
   class: "rds-e-table-renderer__group--spacer"
-}, xe = ["colspan"], Ee = { key: 2 }, De = ["colspan"], We = { class: "rds-e-table-renderer__empty-state" }, Ke = { class: "rds-title-02" }, Le = /* @__PURE__ */ oe({
+}, Qe = ["colspan"], Ze = { key: 2 }, et = ["colspan"], tt = { class: "rds-e-table-renderer__empty-state" }, nt = { class: "rds-title-02" }, rt = /* @__PURE__ */ Ee({
   __name: "table-renderer",
   props: {
     headers: {},
@@ -78,255 +160,322 @@ const be = { key: 0 }, fe = ["aria-sort", "onClick"], me = ["onPointerdown"], _e
     emptyStateText: { default: "No hay elementos a mostrar." },
     selectedKeys: { default: () => [] },
     expandedKeys: { default: () => [] },
+    selectAllAriaLabel: {},
+    rowAriaLabel: {},
     resizableColumns: { type: Boolean },
+    reorderableColumns: { type: Boolean, default: !1 },
     rowClass: {},
     cellClass: {},
     isRowDisabled: {}
   },
-  emits: ["headerClick", "toggleSelectAll", "toggleRowSelection", "rowClick", "columnResize"],
-  setup(s, { emit: u }) {
-    const n = s, g = u, v = ce(), { columnWidths: p, resizingKey: h, startResize: S, stopResize: x, applyMeasuredWidths: C } = ye(w(() => n.headers)), _ = w(() => !!n.resizableColumns), D = j(null), B = w(() => [
-      `rds-e-table-renderer--${n.variant}`,
-      { "rds-e-table-renderer--condensed": n.condensed },
-      { "rds-e-table-renderer--resizable": _.value }
-    ]), y = w(() => [
-      `rds-e-table-renderer__body--${n.variant}`,
-      { "rds-e-table-renderer__body--condensed": n.condensed }
-    ]), i = w(() => n.headers.reduce((e, l) => {
-      const t = p[l.key];
+  emits: ["headerClick", "toggleSelectAll", "toggleRowSelection", "rowClick", "columnResize", "columnReorder"],
+  setup(a, { emit: v }) {
+    const r = a, f = v, S = Ae(), C = D(() => !!r.reorderableColumns), {
+      reorderedHeaders: E,
+      isDragging: k,
+      dragOffsetX: y,
+      dragOverIndex: x,
+      dragSourceKey: z,
+      startDrag: w,
+      cancelDrag: A,
+      updateDragOver: b
+    } = Pe(D(() => r.headers)), l = D(
+      () => C.value ? E.value : r.headers
+    ), { columnWidths: p, resizingKey: _, startResize: K, stopResize: I, applyMeasuredWidths: U } = He(D(() => r.headers)), L = D(() => !!r.resizableColumns), X = W(null), H = W(null), ne = D(() => [
+      `rds-e-table-renderer--${r.variant}`,
+      { "rds-e-table-renderer--condensed": r.condensed },
+      { "rds-e-table-renderer--resizable": L.value },
+      { "rds-e-table-renderer--reorderable": C.value },
+      { "rds-e-table-renderer--dragging": k.value }
+    ]), re = D(() => [
+      `rds-e-table-renderer__body--${r.variant}`,
+      { "rds-e-table-renderer__body--condensed": r.condensed }
+    ]), i = D(() => l.value.reduce((e, n) => {
+      const t = p[n.key];
       return e + (typeof t == "number" ? t : 0);
-    }, 0)), f = w(() => {
-      if (_.value)
+    }, 0)), g = D(() => {
+      if (L.value)
         return {
           minWidth: "100%",
           width: `${i.value}px`
         };
-    }), m = (e, l) => {
-      const t = e[n.rowKey];
-      return t !== void 0 ? t : l;
-    }, $ = (e) => {
-      const l = e[n.rowKey];
-      return n.selectedKeys.includes(l);
-    }, R = (e) => {
-      const l = e[n.rowKey];
-      return n.expandedKeys.includes(l);
-    }, T = (e) => n.isRowDisabled ? n.isRowDisabled(e) : !1, q = (e) => ({
+    }), R = (e, n) => {
+      const t = e[r.rowKey];
+      return t !== void 0 ? t : n;
+    }, c = (e) => {
+      const n = e[r.rowKey];
+      return r.selectedKeys.includes(n);
+    }, h = (e) => {
+      const n = e[r.rowKey];
+      return r.expandedKeys.includes(n);
+    }, F = (e) => r.isRowDisabled ? r.isRowDisabled(e) : !1, le = D(() => r.selectAllAriaLabel || "Seleccionar todo"), be = (e, n) => r.rowAriaLabel ? r.rowAriaLabel(e, n) : `Seleccionar fila ${n + 1}`, M = (e) => !C.value || e.type === "selection" || e.type === "actions" ? !1 : e.reorderable !== !1, j = (e) => k.value && z.value === e.key, B = (e) => j(e) && y.value !== 0, ie = (e) => {
+      if (j(e))
+        return {
+          "--rds-drag-gap-width": `${Math.abs(y.value)}px`,
+          "--rds-drag-offset-x": `${y.value}px`,
+          transform: `translateX(${y.value}px)`
+        };
+    }, me = (e, n) => ({
       [`rds-e-table-renderer__cell--${e.align || "left"}`]: !0,
       "rds-e-table-renderer__cell--sortable": e.sortable,
       "rds-e-table-renderer__cell--shadow": e.sticky,
       "rds-e-table-renderer__cell--no-sticky": !e.sticky,
       "rds-e-table-renderer__cell--right": e.align === "right",
       "rds-e-table-renderer__cell--center": e.align === "center",
-      "rds-e-table-renderer__cell--resizing": h.value === e.key
-    }), I = (e) => !_.value || e.type === "selection" || e.type === "actions" ? !1 : e.resizable === !0, W = () => {
-      const e = D.value;
+      "rds-e-table-renderer__cell--resizing": _.value === e.key,
+      "rds-e-table-renderer__cell--reorderable": M(e),
+      "rds-e-table-renderer__cell--drag-source": j(e),
+      "rds-e-table-renderer__cell--drag-shifted": B(e),
+      "rds-e-table-renderer__cell--drag-right": B(e) && y.value > 0,
+      "rds-e-table-renderer__cell--drag-left": B(e) && y.value < 0,
+      "rds-e-table-renderer__cell--drag-target": k.value && x.value === n && z.value !== e.key
+    }), pe = (e) => !L.value || e.type === "selection" || e.type === "actions" ? !1 : e.resizable === !0, Y = () => {
+      const e = X.value;
       if (!e) return;
-      const l = e.querySelectorAll("thead th");
-      if (!l.length) return;
+      const n = e.querySelectorAll("thead th");
+      if (!n.length) return;
       const t = {};
-      for (let r = 0; r < n.headers.length; r++) {
-        const c = l[r]?.getBoundingClientRect?.().width || 0;
-        c > 0 && (t[n.headers[r].key] = c);
+      for (let o = 0; o < l.value.length; o++) {
+        const s = n[o]?.getBoundingClientRect?.().width || 0, T = l.value[o]?.key;
+        s > 0 && T && (t[T] = s);
       }
-      C(t);
-    }, O = (e, l) => {
-      W();
+      U(t);
+    }, ge = (e, n) => {
+      Y();
       const t = p[e];
-      S(e, l, G, t);
+      K(e, n, _e, t);
     };
-    function G(e) {
-      g("columnResize", { key: e, width: p[e] }), x();
+    function _e(e) {
+      f("columnResize", { key: e, width: p[e] }), I();
     }
-    const J = (e) => {
+    const ke = (e) => {
       if (e.sortable)
         return e.sort === "asc" ? "ascending" : e.sort === "desc" ? "descending" : "none";
-    }, Q = (e, l) => {
-      const t = n.rowClass ? n.rowClass(e, l) : "";
+    }, Re = (e, n) => {
+      const t = r.rowClass ? r.rowClass(e, n) : "";
       return [
-        { "rds-e-table-renderer__group--odd": l % 2 === 0 },
-        { "rds-e-table-renderer__group--is-open rds-background-grey": R(e) },
+        { "rds-e-table-renderer__group--odd": n % 2 === 0 },
+        { "rds-e-table-renderer__group--is-open rds-background-grey": h(e) },
         { "rds-e-table-renderer__group--expandible": !0 },
         t
       ];
-    }, Y = (e, l, t) => {
-      const r = n.cellClass ? n.cellClass(e, l, t) : "";
+    }, Ce = (e, n, t) => {
+      const o = r.cellClass ? r.cellClass(e, n, t) : "";
       return [
-        [`rds-e-table-renderer__cell--${l.align || "left"}`],
-        { "rds-e-table-renderer__cell--shadow": l.sticky },
-        r
+        [`rds-e-table-renderer__cell--${n.align || "left"}`],
+        { "rds-e-table-renderer__cell--shadow": n.sticky },
+        { "rds-e-table-renderer__cell--no-sticky": !n.sticky },
+        { "rds-e-table-renderer__cell--drag-source": j(n) },
+        { "rds-e-table-renderer__cell--drag-shifted": B(n) },
+        { "rds-e-table-renderer__cell--drag-right": B(n) && y.value > 0 },
+        { "rds-e-table-renderer__cell--drag-left": B(n) && y.value < 0 },
+        o
       ];
-    }, Z = (e, l, t) => {
-      if (l.formatter) return l.formatter(e[l.key], e, t);
-      const r = e[l.key];
-      return r ?? "---";
-    }, ee = (e) => {
-      e.sortable && g("headerClick", e);
-    }, te = (e) => {
-      g("rowClick", e);
+    }, xe = (e, n, t) => {
+      if (n.formatter) return n.formatter(e[n.key], e, t);
+      const o = e[n.key];
+      return o ?? "---";
+    }, we = (e, n) => {
+      _.value || (n.stopPropagation(), w(e, n, (t) => {
+        f("columnReorder", t);
+      }));
+    }, he = (e, n, t) => {
+      if (!t.altKey || t.key !== "ArrowLeft" && t.key !== "ArrowRight") return;
+      t.preventDefault();
+      const o = l.value.map((V, G) => M(V) ? G : -1).filter((V) => V !== -1), s = o.indexOf(n);
+      if (s === -1) return;
+      const T = t.key === "ArrowLeft" ? s - 1 : s + 1;
+      if (T < 0 || T >= o.length) return;
+      const ce = o[T];
+      w(e, { clientX: 0, currentTarget: null, pointerId: -1 }, (V) => {
+        f("columnReorder", V), J(() => {
+          const G = H.value?.querySelectorAll("th");
+          G && G[ce]?.focus();
+        });
+      }), b(ce), document.dispatchEvent(new PointerEvent("pointerup", { bubbles: !0 }));
+    }, $e = (e) => {
+      k.value || e.sortable && f("headerClick", e);
+    }, De = (e) => {
+      f("rowClick", e);
     };
-    return ae(() => {
-      A(() => {
-        W();
+    return Le(() => {
+      J(() => {
+        Y();
       });
-    }), M(() => n.headers, () => {
-      A(() => {
-        _.value && (h.value || W());
+    }), q(() => r.headers, () => {
+      J(() => {
+        L.value && (_.value || Y());
       });
-    }, { deep: !0 }), M(_, (e) => {
+    }, { deep: !0 }), q(C, (e) => {
+      e || A();
+    }), q(L, (e) => {
       if (!e) {
-        x();
+        I();
         return;
       }
-      A(() => {
-        h.value || W();
+      J(() => {
+        _.value || Y();
       });
-    }), (e, l) => (o(), a("div", {
-      class: b(["rds-e-table-renderer__container", B.value])
+    }), (e, n) => (d(), u("div", {
+      class: $(["rds-e-table-renderer__container", ne.value])
     }, [
-      d("table", {
+      m("table", {
         ref_key: "tableRef",
-        ref: D,
-        style: V(f.value)
+        ref: X,
+        style: Q(g.value)
       }, [
-        d("colgroup", null, [
-          (o(!0), a(z, null, K(s.headers, (t, r) => (o(), a("col", {
-            key: `col-${t.key}-${r}`,
-            style: V({ width: _.value ? `${E(p)[t.key]}px` : t.width || "auto" })
+        m("colgroup", null, [
+          (d(!0), u(N, null, Z(l.value, (t, o) => (d(), u("col", {
+            key: `col-${t.key}-${o}`,
+            style: Q({ width: L.value ? `${O(p)[t.key]}px` : t.width || "auto" })
           }, null, 4))), 128))
         ]),
-        s.hideHeaders ? k("", !0) : (o(), a("thead", be, [
-          d("tr", null, [
-            (o(!0), a(z, null, K(s.headers, (t, r) => (o(), a("th", {
-              key: `th-${t.key}-${r}`,
-              class: b(["rds-e-table-renderer__cell rds-e-table-renderer__cell--heading rds-body-01", q(t)]),
-              "aria-sort": J(t),
+        a.hideHeaders ? P("", !0) : (d(), u("thead", {
+          key: 0,
+          ref_key: "theadRef",
+          ref: H
+        }, [
+          m("tr", null, [
+            (d(!0), u(N, null, Z(l.value, (t, o) => (d(), u("th", {
+              key: `th-${t.key}-${o}`,
+              class: $(["rds-e-table-renderer__cell rds-e-table-renderer__cell--heading rds-body-01", me(t, o)]),
+              style: Q(ie(t)),
+              "aria-sort": ke(t),
+              "aria-roledescription": M(t) ? "reorderable column" : void 0,
+              tabindex: M(t) ? 0 : void 0,
               scope: "col",
-              onClick: (c) => ee(t)
+              onClick: (s) => $e(t),
+              onPointerdown: (s) => M(t) ? we(t.key, s) : void 0,
+              onPointerenter: (s) => O(k) && M(t) ? O(b)(o) : void 0,
+              onKeydown: (s) => M(t) ? he(t.key, o, s) : void 0
             }, [
-              I(t) ? (o(), a("div", {
+              pe(t) ? (d(), u("div", {
                 key: 0,
                 class: "rds-e-table-renderer__resize-handle",
-                onClick: l[0] || (l[0] = L(() => {
+                onClick: n[0] || (n[0] = ee(() => {
                 }, ["stop"])),
-                onPointerdown: L((c) => O(t.key, c), ["stop"])
-              }, null, 40, me)) : k("", !0),
-              N(e.$slots, `header-${t.key}`, { header: t }, () => [
-                t.type === "selection" ? (o(), a(z, { key: 0 }, [
-                  s.hideSelectAll ? k("", !0) : (o(), a("div", _e, [
-                    H(F, {
-                      id: `checkbox-all-${E(v)}-${t.key}`,
+                onPointerdown: ee((s) => ge(t.key, s), ["stop"])
+              }, null, 40, Me)) : P("", !0),
+              te(e.$slots, `header-${t.key}`, { header: t }, () => [
+                t.type === "selection" ? (d(), u(N, { key: 0 }, [
+                  a.hideSelectAll ? P("", !0) : (d(), u("div", Oe, [
+                    oe(de, {
+                      id: `checkbox-all-${O(S)}-${t.key}`,
+                      "accessibility-label": le.value,
                       "model-value": t.allSelected,
-                      "onUpdate:modelValue": l[1] || (l[1] = (c) => e.$emit("toggleSelectAll", c)),
-                      onClick: l[2] || (l[2] = L(() => {
+                      "onUpdate:modelValue": n[1] || (n[1] = (s) => e.$emit("toggleSelectAll", s)),
+                      onClick: n[2] || (n[2] = ee(() => {
                       }, ["stop"]))
-                    }, null, 8, ["id", "model-value"]),
-                    d("label", {
-                      for: `checkbox-all-${E(v)}-${t.key}`,
+                    }, null, 8, ["id", "accessibility-label", "model-value"]),
+                    m("label", {
+                      for: `checkbox-all-${O(S)}-${t.key}`,
                       class: "rds-checkbox__label rds-checkbox__label--no-text"
-                    }, null, 8, ke)
+                    }, null, 8, Ue)
                   ]))
-                ], 64)) : (o(), a("div", {
+                ], 64)) : (d(), u("div", {
                   key: 1,
-                  class: b(["header-content", `header-content--${t.align || "left"}`])
+                  class: $(["header-content", `header-content--${t.align || "left"}`])
                 }, [
-                  d("span", {
-                    class: b(["rds-title-02 header-content__text", { "text-active": !!t.sort }])
-                  }, U(t.text), 3),
-                  t.sortable ? (o(), a("span", ve, [
-                    d("span", {
-                      class: b(["rds-e-table-renderer__sortable-icon--up sortable-icon", { active: t.sort === "asc" }])
+                  m("span", {
+                    class: $(["rds-title-02 header-content__text", { "text-active": !!t.sort }])
+                  }, se(t.text), 3),
+                  t.sortable ? (d(), u("span", Xe, [
+                    m("span", {
+                      class: $(["rds-e-table-renderer__sortable-icon--up sortable-icon", { active: t.sort === "asc" }])
                     }, "▲", 2),
-                    d("span", {
-                      class: b(["rds-e-table-renderer__sortable-icon--down sortable-icon", { active: t.sort === "desc" }])
+                    m("span", {
+                      class: $(["rds-e-table-renderer__sortable-icon--down sortable-icon", { active: t.sort === "desc" }])
                     }, "▼", 2)
-                  ])) : k("", !0)
+                  ])) : P("", !0)
                 ], 2))
               ], !0)
-            ], 10, fe))), 128))
+            ], 46, We))), 128))
           ])
-        ])),
-        d("tbody", {
-          class: b(y.value)
+        ], 512)),
+        m("tbody", {
+          class: $(re.value)
         }, [
-          s.loading ? (o(), a("tr", pe, [
-            d("td", {
-              colspan: s.headers.length,
+          a.loading ? (d(), u("tr", Be, [
+            m("td", {
+              colspan: l.value.length,
               class: "loading-cell"
             }, [
-              d("div", he, [
-                H(ie, { size: 20 })
+              m("div", Fe, [
+                oe(ze, { size: 20 })
               ])
-            ], 8, ge)
-          ])) : k("", !0),
-          s.rows.length > 0 ? (o(!0), a(z, { key: 1 }, K(s.rows, (t, r) => (o(), a(z, {
-            key: m(t, r)
+            ], 8, Ne)
+          ])) : P("", !0),
+          a.rows.length > 0 ? (d(!0), u(N, { key: 1 }, Z(a.rows, (t, o) => (d(), u(N, {
+            key: R(t, o)
           }, [
-            d("tr", {
-              class: b(["rds-e-table-renderer__group", Q(t, r)]),
-              onClick: (c) => te(t)
+            m("tr", {
+              class: $(["rds-e-table-renderer__group", Re(t, o)]),
+              onClick: (s) => De(t)
             }, [
-              (o(!0), a(z, null, K(s.headers, (c, ne) => (o(), a("td", {
-                key: `td-${c.key}-${ne}`,
-                class: b(["rds-e-table-renderer__cell rds-body-01", Y(t, c, r)]),
-                "data-label": c.text
+              (d(!0), u(N, null, Z(l.value, (s, T) => (d(), u("td", {
+                key: `td-${s.key}-${T}`,
+                class: $(["rds-e-table-renderer__cell rds-body-01", Ce(t, s, o)]),
+                style: Q(ie(s)),
+                "data-label": s.text
               }, [
-                N(e.$slots, `td-${c.key}`, {
+                te(e.$slots, `td-${s.key}`, {
                   item: t,
-                  value: t[c.key],
-                  index: r
+                  value: t[s.key],
+                  index: o
                 }, () => [
-                  c.type === "selection" ? (o(), a("div", {
+                  s.type === "selection" ? (d(), u("div", {
                     key: 0,
-                    class: b(["cell-content", `cell-content--${c.align || "left"}`])
+                    class: $(["cell-content", `cell-content--${s.align || "left"}`])
                   }, [
-                    H(F, {
-                      id: `chk-${E(v)}-${r}-${c.key}`,
-                      "model-value": $(t),
-                      disabled: T(t),
+                    oe(de, {
+                      id: `chk-${O(S)}-${o}-${s.key}`,
+                      "accessibility-label": be(t, o),
+                      "model-value": c(t),
+                      disabled: F(t),
                       "onUpdate:modelValue": () => e.$emit("toggleRowSelection", t),
-                      onClick: l[3] || (l[3] = L(() => {
+                      onClick: n[3] || (n[3] = ee(() => {
                       }, ["stop"]))
-                    }, null, 8, ["id", "model-value", "disabled", "onUpdate:modelValue"]),
-                    d("label", {
-                      for: `chk-${E(v)}-${r}-${c.key}`,
+                    }, null, 8, ["id", "accessibility-label", "model-value", "disabled", "onUpdate:modelValue"]),
+                    m("label", {
+                      for: `chk-${O(S)}-${o}-${s.key}`,
                       class: "rds-checkbox__label rds-checkbox__label--no-text"
-                    }, null, 8, Re)
-                  ], 2)) : (o(), a("div", {
+                    }, null, 8, je)
+                  ], 2)) : (d(), u("div", {
                     key: 1,
-                    class: b(["cell-text", `cell-text--${c.align || "left"}`])
-                  }, U(Z(t, c, r)), 3))
+                    class: $(["cell-text", `cell-text--${s.align || "left"}`])
+                  }, se(xe(t, s, o)), 3))
                 ], !0)
-              ], 10, $e))), 128))
-            ], 10, Ce),
-            R(t) ? (o(), a("tr", we, [
-              d("td", {
-                colspan: s.headers.length,
+              ], 14, qe))), 128))
+            ], 10, Ve),
+            h(t) ? (d(), u("tr", Ye, [
+              m("td", {
+                colspan: l.value.length,
                 class: "rds-e-table-renderer__cell rds-e-table-renderer__group--dropdown rds-background-grey"
               }, [
-                N(e.$slots, "expandible", { item: t }, void 0, !0)
-              ], 8, ze)
-            ])) : k("", !0),
-            !s.condensed && R(t) ? (o(), a("tr", Se, [
-              d("td", {
-                colspan: s.headers.length
-              }, null, 8, xe)
-            ])) : k("", !0)
-          ], 64))), 128)) : !s.loading && s.showEmptyState ? (o(), a("tr", Ee, [
-            d("td", {
-              colspan: s.headers.length
+                te(e.$slots, "expandible", { item: t }, void 0, !0)
+              ], 8, Ge)
+            ])) : P("", !0),
+            !a.condensed && h(t) ? (d(), u("tr", Je, [
+              m("td", {
+                colspan: l.value.length
+              }, null, 8, Qe)
+            ])) : P("", !0)
+          ], 64))), 128)) : !a.loading && a.showEmptyState ? (d(), u("tr", Ze, [
+            m("td", {
+              colspan: l.value.length
             }, [
-              N(e.$slots, "empty", {}, () => [
-                d("div", We, [
-                  d("h3", Ke, U(s.emptyStateText), 1)
+              te(e.$slots, "empty", {}, () => [
+                m("div", tt, [
+                  m("h3", nt, se(a.emptyStateText), 1)
                 ])
               ], !0)
-            ], 8, De)
-          ])) : k("", !0)
+            ], 8, et)
+          ])) : P("", !0)
         ], 2)
       ], 4)
     ], 2));
   }
-}), Ue = /* @__PURE__ */ de(Le, [["__scopeId", "data-v-9b371162"]]);
+}), dt = /* @__PURE__ */ Ke(rt, [["__scopeId", "data-v-651f5658"]]);
 export {
-  Ue as default
+  dt as default
 };