energy-components 2.6.0 → 2.8.0

package/dist/components/table.es.js

@@ -1,18 +1,18 @@
-import { defineComponent as Y, toRefs as Z, ref as h, useSlots as _, computed as f, watch as w, openBlock as u, createElementBlock as g, Fragment as B, createVNode as x, renderList as T, renderSlot as $, toDisplayString as ee, createCommentVNode as D, createBlock as L, unref as K, withCtx as C, createSlots as te, normalizeProps as le, guardReactiveProps as ae, withModifiers as A } from "vue";
-import oe from "./tableRenderer.es.js";
-import ne from "./pagination.es.js";
+import { defineComponent as Z, ref as h, useSlots as _, toRefs as ee, computed as f, watch as S, openBlock as u, createElementBlock as g, Fragment as B, createVNode as x, renderList as L, renderSlot as P, toDisplayString as le, createCommentVNode as T, createBlock as $, unref as K, withCtx as C, createSlots as te, normalizeProps as ae, guardReactiveProps as oe, withModifiers as D } from "vue";
+import ne from "./tableRenderer.es.js";
+import se from "./pagination.es.js";
 import E from "./radioButton.es.js";
-import { _ as se } from "./radio-group.vue_vue_type_script_setup_true_lang-CwgSZYeD.js";
-import ie from "./loader.es.js";
+import { _ as ie } from "./radio-group.vue_vue_type_script_setup_true_lang-CwgSZYeD.js";
+import re from "./loader.es.js";
 import { g as de } from "./getInstance-GhoEcxLF.js";
-import { _ as re } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/table.css';const ue = { class: "rds-e-table__container" }, ce = {
+import { _ as ue } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import './style/table.css';const ce = { class: "rds-e-table__container" }, me = {
   key: 0,
   class: "rds-e-table__loading-mobile"
-}, me = {
+}, ve = {
   key: 0,
   class: "rds-e-table__empty"
-}, pe = /* @__PURE__ */ Y({
+}, ye = /* @__PURE__ */ Z({
   __name: "table",
   props: {
     header: { default: () => [] },
@@ -26,6 +26,8 @@ import './style/table.css';const ue = { class: "rds-e-table__container" }, ce =
     selectionMode: { default: "none" },
     selectionPosition: { default: "right" },
     checkedKeys: { default: () => [] },
+    selectAllAriaLabel: {},
+    rowAriaLabel: {},
     loading: { type: Boolean },
     hideHeaders: { type: Boolean },
     hidePagination: { type: Boolean },
@@ -43,127 +45,130 @@ import './style/table.css';const ue = { class: "rds-e-table__container" }, ce =
     cellClass: {},
     isRowDisabled: {},
     resizableColumns: { type: Boolean },
+    reorderableColumns: { type: Boolean },
     resetPageOnSort: { type: Boolean, default: !1 }
   },
-  emits: ["update:page", "update:pageSize", "update:sort", "update:checkedKeys", "optionsChange", "selectionChange", "rowExpand", "columnResize"],
+  emits: ["update:page", "update:pageSize", "update:sort", "update:checkedKeys", "optionsChange", "selectionChange", "rowExpand", "columnResize", "columnReorder"],
   setup(a, { expose: H, emit: O }) {
-    const o = a, i = O, V = de(), { items: I, selectionMode: d, selectionPosition: P } = Z(o), c = h(o.page), p = h(o.pageSize), m = h(o.sort || null), n = h([...o.checkedKeys]), k = h([]), M = _(), j = f(() => o.rowKey), v = (e) => typeof e == "number" ? e : String(e), r = (e) => {
-      const l = o.rowKey, t = e[l];
-      return t === void 0 ? (console.warn(`[RDSTable] Row missing key '${String(o.rowKey)}'`, e), "unknown") : t;
-    }, y = f(() => {
-      if (o.asynchrone === !0) return I.value;
-      const e = (c.value - 1) * p.value, l = e + p.value;
-      return I.value.slice(e, l);
-    }), F = f(() => y.value), N = f(() => {
-      const e = o.header.map((t) => ({
-        ...t,
-        sort: t.sortable && m.value?.key === t.key ? m.value.order : null
-      })), l = y.value.length > 0 && y.value.every((t) => n.value.includes(v(r(t))));
-      if (d.value !== "none" && P.value === "left")
+    const o = a, i = O, c = h(o.page), v = h(o.pageSize), m = h(o.sort || null), n = h([...o.checkedKeys]), b = h([]), V = _(), M = de(), { items: A, selectionMode: r, selectionPosition: I } = ee(o), j = f(() => o.rowKey), y = (e) => typeof e == "number" ? e : String(e), d = (e) => {
+      const t = o.rowKey, l = e[t];
+      return l === void 0 ? (console.warn(`[RDSTable] Row missing key '${String(o.rowKey)}'`, e), "unknown") : l;
+    }, p = f(() => {
+      if (o.asynchrone === !0) return A.value;
+      const e = (c.value - 1) * v.value, t = e + v.value;
+      return A.value.slice(e, t);
+    }), F = f(() => p.value), N = f(() => {
+      const e = o.header.map((l) => ({
+        ...l,
+        sort: l.sortable && m.value?.key === l.key ? m.value.order : null
+      })), t = p.value.length > 0 && p.value.every((l) => n.value.includes(y(d(l))));
+      if (r.value !== "none" && I.value === "left")
         return [{
           key: "__select_all",
           text: "",
           type: "selection",
           width: "48px",
           align: "center",
-          sticky: !0,
-          allSelected: l
+          sticky: !1,
+          allSelected: t
         }, ...e];
-      if (d.value !== "none" && P.value === "right") {
-        const t = {
+      if (r.value !== "none" && I.value === "right") {
+        const l = {
           key: "checkbox",
           text: "",
           type: "selection",
           width: "48px",
           align: "right",
-          sticky: !0,
-          allSelected: l
+          sticky: !1,
+          allSelected: t
         };
-        return [...e, t];
+        return [...e, l];
       }
       return e;
-    }), U = f(() => o.hideSelectAll ? !0 : d.value !== "multiple"), R = () => {
+    }), U = f(() => o.hideSelectAll ? !0 : r.value !== "multiple"), R = () => {
       i("optionsChange", {
         page: c.value,
-        pageSize: p.value,
+        pageSize: v.value,
         sort: m.value
       });
     }, G = (e) => {
       if (!e.sortable) return;
-      const l = m.value?.key, t = m.value?.order;
+      const t = m.value?.key, l = m.value?.order;
       let s = "asc";
-      l === e.key && (t === "asc" ? s = "desc" : t === "desc" && (s = null));
-      const b = s ? { key: e.key, order: s } : null;
-      o.resetPageOnSort && (c.value = 1, i("update:page", 1)), m.value = b, i("update:sort", b), R();
+      t === e.key && (l === "asc" ? s = "desc" : l === "desc" && (s = null));
+      const w = s ? { key: e.key, order: s } : null;
+      o.resetPageOnSort && (c.value = 1, i("update:page", 1)), m.value = w, i("update:sort", w), R();
     }, q = (e) => {
-      e.page !== c.value && (c.value = e.page, i("update:page", e.page)), e.limit !== p.value && (p.value = e.limit, i("update:pageSize", e.limit)), R();
+      e.page !== c.value && (c.value = e.page, i("update:page", e.page)), e.limit !== v.value && (v.value = e.limit, i("update:pageSize", e.limit)), R();
     }, z = () => {
       i("update:checkedKeys", [...n.value]), i("selectionChange", [...n.value]);
     }, J = (e) => {
-      if (d.value === "none") return;
-      const l = v(r(e));
-      if (d.value === "single")
-        n.value = [l];
+      if (r.value === "none") return;
+      const t = y(d(e));
+      if (r.value === "single")
+        n.value = [t];
       else {
-        const t = n.value.indexOf(l);
-        t === -1 ? n.value.push(l) : n.value.splice(t, 1);
+        const l = n.value.indexOf(t);
+        l === -1 ? n.value.push(t) : n.value.splice(l, 1);
       }
       z();
     }, Q = (e) => {
-      if (d.value !== "multiple") return;
-      const l = y.value.map((t) => v(r(t)));
+      if (r.value !== "multiple") return;
+      const t = p.value.map((l) => y(d(l)));
       if (e) {
-        const t = l.filter((s) => !n.value.includes(s));
-        n.value.push(...t);
+        const l = t.filter((s) => !n.value.includes(s));
+        n.value.push(...l);
       } else
-        n.value = n.value.filter((t) => !l.includes(t));
+        n.value = n.value.filter((l) => !t.includes(l));
       z();
-    }, S = f({
+    }, k = f({
       get: () => n.value[0] || null,
       set: (e) => {
-        e !== null && d.value === "single" && (n.value = [e], z());
+        e !== null && r.value === "single" && (n.value = [e], z());
       }
     }), W = (e) => {
-      if (!e.expandible || !M.expandible) return;
-      const l = v(r(e)), t = k.value.indexOf(l);
-      t === -1 ? k.value.push(l) : k.value.splice(t, 1), i("rowExpand", e);
+      if (!e.expandible || !V.expandible) return;
+      const t = y(d(e)), l = b.value.indexOf(t);
+      l === -1 ? b.value.push(t) : b.value.splice(l, 1), i("rowExpand", e);
     }, X = (e) => {
       i("columnResize", e);
+    }, Y = (e) => {
+      i("columnReorder", e);
     };
-    return w(() => o.page, (e) => {
+    return S(() => o.page, (e) => {
       e && (c.value = e);
-    }), w(() => o.pageSize, (e) => {
-      e && (p.value = e);
-    }), w(() => o.sort, (e) => {
+    }), S(() => o.pageSize, (e) => {
+      e && (v.value = e);
+    }), S(() => o.sort, (e) => {
       m.value = e || null;
-    }), w(() => o.checkedKeys, (e) => {
+    }), S(() => o.checkedKeys, (e) => {
       n.value = [...e || []];
     }), H({ reset: () => {
       c.value = 1, n.value = [], m.value = null, R();
-    } }), (e, l) => (u(), g("div", ue, [
+    } }), (e, t) => (u(), g("div", ce, [
       a.isMobileDevice && e.$slots.mobile ? (u(), g(B, { key: 0 }, [
-        a.loading ? (u(), g("div", ce, [
-          x(ie, { size: 20 })
+        a.loading ? (u(), g("div", me, [
+          x(re, { size: 20 })
         ])) : (u(), g(B, { key: 1 }, [
-          (u(!0), g(B, null, T(y.value, (t, s) => (u(), g("div", {
-            key: `${v(r(t))}-m-${s}`,
+          (u(!0), g(B, null, L(p.value, (l, s) => (u(), g("div", {
+            key: `${y(d(l))}-m-${s}`,
             class: "rds-e-table__mobile-item"
           }, [
-            $(e.$slots, "mobile", {
-              item: t,
+            P(e.$slots, "mobile", {
+              item: l,
               index: s
             }, void 0, !0)
           ]))), 128)),
-          y.value.length === 0 && a.showEmptyState ? (u(), g("div", me, ee(a.emptyStateText), 1)) : D("", !0)
+          p.value.length === 0 && a.showEmptyState ? (u(), g("div", ve, le(a.emptyStateText), 1)) : T("", !0)
         ], 64))
-      ], 64)) : (u(), L(se, {
+      ], 64)) : (u(), $(ie, {
         key: 1,
-        modelValue: S.value,
-        "onUpdate:modelValue": l[2] || (l[2] = (t) => S.value = t),
-        "group-name": `table-radio-${K(V)}`
+        modelValue: k.value,
+        "onUpdate:modelValue": t[2] || (t[2] = (l) => k.value = l),
+        "group-name": `table-radio-${K(M)}`
       }, {
         default: C(() => [
-          x(oe, {
+          x(ne, {
             headers: N.value,
             rows: F.value,
             "row-key": j.value,
@@ -174,60 +179,64 @@ import './style/table.css';const ue = { class: "rds-e-table__container" }, ce =
             condensed: a.condensed,
             "show-empty-state": a.showEmptyState,
             "empty-state-text": a.emptyStateText,
+            "select-all-aria-label": a.selectAllAriaLabel,
+            "row-aria-label": a.rowAriaLabel,
             "selected-keys": n.value,
-            "expanded-keys": k.value,
+            "expanded-keys": b.value,
             "row-class": a.rowClass,
             "cell-class": a.cellClass,
             "is-row-disabled": a.isRowDisabled,
             "resizable-columns": a.resizableColumns,
+            "reorderable-columns": a.reorderableColumns,
             onColumnResize: X,
+            onColumnReorder: Y,
             onHeaderClick: G,
             onToggleSelectAll: Q,
             onToggleRowSelection: J,
             onRowClick: W
           }, te({ _: 2 }, [
-            T(e.$slots, (t, s) => ({
+            L(e.$slots, (l, s) => ({
               name: s,
-              fn: C((b) => [
-                $(e.$slots, s, le(ae(b)), void 0, !0)
+              fn: C((w) => [
+                P(e.$slots, s, ae(oe(w)), void 0, !0)
               ])
             })),
-            K(d) === "single" ? {
+            K(r) === "single" ? {
               name: "td-__select_all",
-              fn: C(({ item: t }) => [
+              fn: C(({ item: l }) => [
                 x(E, {
-                  id: `radio-left-${r(t)}`,
-                  option: v(r(t)),
-                  "model-value": S.value,
-                  onClick: l[0] || (l[0] = A(() => {
+                  id: `radio-left-${d(l)}`,
+                  option: y(d(l)),
+                  "model-value": k.value,
+                  onClick: t[0] || (t[0] = D(() => {
                   }, ["stop"]))
                 }, null, 8, ["id", "option", "model-value"])
               ]),
               key: "0"
             } : void 0,
-            K(d) === "single" ? {
+            K(r) === "single" ? {
               name: "td-checkbox",
-              fn: C(({ item: t }) => [
+              fn: C(({ item: l }) => [
                 x(E, {
-                  id: `radio-right-${r(t)}`,
-                  option: v(r(t)),
-                  "model-value": S.value,
-                  onClick: l[1] || (l[1] = A(() => {
+                  id: `radio-right-${d(l)}`,
+                  option: y(d(l)),
+                  "model-value": k.value,
+                  onClick: t[1] || (t[1] = D(() => {
                   }, ["stop"]))
                 }, null, 8, ["id", "option", "model-value"])
               ]),
               key: "1"
             } : void 0
-          ]), 1032, ["headers", "rows", "row-key", "loading", "hide-headers", "hide-select-all", "variant", "condensed", "show-empty-state", "empty-state-text", "selected-keys", "expanded-keys", "row-class", "cell-class", "is-row-disabled", "resizable-columns"])
+          ]), 1032, ["headers", "rows", "row-key", "loading", "hide-headers", "hide-select-all", "variant", "condensed", "show-empty-state", "empty-state-text", "select-all-aria-label", "row-aria-label", "selected-keys", "expanded-keys", "row-class", "cell-class", "is-row-disabled", "resizable-columns", "reorderable-columns"])
         ]),
         _: 3
       }, 8, ["modelValue", "group-name"])),
-      a.hidePagination ? D("", !0) : (u(), L(ne, {
+      a.hidePagination ? T("", !0) : (u(), $(se, {
         key: 2,
         class: "rds-e-table__pagination",
         "total-items": a.totalItemsLength,
         "current-page": c.value,
-        "items-per-page": p.value,
+        "items-per-page": v.value,
         "hide-leyend": a.hideLegend,
         "jump-to": a.jumpTo,
         "disable-first-load": a.disableFirstLoad,
@@ -237,7 +246,7 @@ import './style/table.css';const ue = { class: "rds-e-table__container" }, ce =
       }, null, 8, ["total-items", "current-page", "items-per-page", "hide-leyend", "jump-to", "disable-first-load", "legend-text"]))
     ]));
   }
-}), xe = /* @__PURE__ */ re(pe, [["__scopeId", "data-v-1b77e5df"]]);
+}), Ce = /* @__PURE__ */ ue(ye, [["__scopeId", "data-v-5dbe1d27"]]);
 export {
-  xe as default
+  Ce as default
 };