x-next 1.11.1 → 1.12.0

package/dist/es/components/table/hooks/use-span.js

@@ -1,46 +1,39 @@
-import { ref as A, computed as a } from "vue";
-const C = ({
-  spanMethod: s,
-  data: k,
-  columns: y
+import { computed as $ } from "vue";
+const E = ({
+  spanMethod: n,
+  data: a,
+  columns: h
 }) => {
-  const c = (f, l) => {
-    f == null || f.forEach(($, e) => {
+  const p = (e, l, c) => {
+    e == null || e.forEach((f, i) => {
       var g;
-      $.hasSubtree && ((g = $.children) != null && g.length) && c($.children || [], l), y.value.forEach((S, r) => {
-        var n;
-        const { rowspan: u = 1, colspan: v = 1 } = ((n = s.value) == null ? void 0 : n.call(s, {
-          record: $.raw,
-          column: S,
-          rowIndex: e,
+      f.hasSubtree && ((g = f.children) != null && g.length) && p(f.children || [], l, c), h.value.forEach((k, r) => {
+        var o;
+        const { rowspan: u = 1, colspan: v = 1 } = ((o = n.value) == null ? void 0 : o.call(n, {
+          record: f.raw,
+          column: k,
+          rowIndex: i,
           columnIndex: r
-        })) ?? {};
-        (u > 1 || v > 1) && (l[`${e}-${r}-${$.key}`] = [u, v], Array.from({ length: u }).forEach((_, t) => {
-          if (e + t < f.length) {
-            const { key: p } = f[e + t] ?? {};
-            Array.from({ length: v }).forEach((j, h) => {
-              r + h < y.value.length && `${e}-${r}-${$.key}` != `${e + t}-${r + h}-${p}` && (i.value[`${e + t}-${r + h}-${p}`] = [0, 0]);
-            });
-          }
-        }));
+        })) ?? {}, m = `${i}-${r}-${f.key}`;
+        if (u === 0 || v === 0)
+          c.add(m);
+        else if (u > 1 || v > 1) {
+          l[m] = [u, v];
+          for (let s = 0; s < Math.min(u, e.length - i); s++)
+            for (let t = 0; t < Math.min(v, h.value.length - r); t++)
+              (s || t) && c.add(`${i + s}-${r + t}-${e[i + s].key}`);
+        }
       });
     });
-  };
-  let i = A({});
-  const o = a(() => {
-    const f = {};
-    return i.value = {}, s.value && c(k.value, f), f;
-  }), E = a(() => {
-    const f = [];
-    for (const l of Object.keys(i.value))
-      f.push(l);
-    return f;
+  }, S = $(() => {
+    const e = {}, l = /* @__PURE__ */ new Set();
+    return n.value && p(a.value, e, l), { span: e, removed: [...l] };
   });
   return {
-    tableSpan: o,
-    removedCells: E
+    tableSpan: $(() => S.value.span),
+    removedCells: $(() => S.value.removed)
   };
 };
 export {
-  C as useSpan
+  E as useSpan
 };

package/dist/es/components/table/locale.js

@@ -1,21 +1,38 @@
-const l = {
+import { useLocale as r } from "../../locale/index.js";
+const c = {
   resetText: "重置",
   okText: "确认",
   currentColumnText: "当前列",
   filterLabelText: "筛选{column}",
-  summaryText: "Summary"
-}, m = {
+  summaryText: "Summary",
+  expandRowText: "展开行 {row}",
+  collapseRowText: "收起行 {row}",
+  selectRowText: "选择行 {row}",
+  selectAllText: "选择全部可选行",
+  resizeColumnText: "调整{column}列宽",
+  moveRowText: "移动行 {row}，Alt 加上下方向键调整顺序"
+}, s = {
   resetText: "Reset",
   okText: "OK",
   currentColumnText: "Column",
   filterLabelText: "Filter {column}",
-  summaryText: "Summary"
-}, T = (r, e = {}) => r.replace(
+  summaryText: "Summary",
+  expandRowText: "Expand row {row}",
+  collapseRowText: "Collapse row {row}",
+  selectRowText: "Select row {row}",
+  selectAllText: "Select all selectable rows",
+  resizeColumnText: "Resize {column} column",
+  moveRowText: "Move row {row}, Alt plus Up or Down to reorder"
+}, x = (o, e = {}) => o.replace(
   /\{(\w+)\}/g,
-  (o, t) => Object.prototype.hasOwnProperty.call(e, t) ? String(e[t]) : o
-);
+  (t, l) => Object.prototype.hasOwnProperty.call(e, l) ? String(e[l]) : t
+), n = () => {
+  const { locale: o } = r();
+  return (e, t) => x(o.value.table[e] ?? c[e] ?? e, t);
+};
 export {
-  m as TABLE_LOCALE_EN_US,
-  l as TABLE_LOCALE_ZH_CN,
-  T as formatLocaleText
+  s as TABLE_LOCALE_EN_US,
+  c as TABLE_LOCALE_ZH_CN,
+  x as formatLocaleText,
+  n as useTableLocale
 };

package/dist/es/components/table/table-col-group.vue2.js

@@ -1,5 +1,5 @@
-import { defineComponent as n } from "vue";
-const i = n({
+import { defineComponent as i } from "vue";
+const p = i({
   name: "ColGroup",
   props: {
     dataColumns: {
@@ -16,21 +16,21 @@ const i = n({
   },
   setup() {
     return {
-      fixedWidth: (e, r) => {
-        if (e) {
-          const t = Math.max(e, r || 0);
+      fixedWidth: (r, t) => {
+        if (r) {
+          const e = Math.max(r, t || 0);
           return {
             width: `${e}px`,
-            minWidth: `${t}px`,
+            minWidth: `${e}px`,
             maxWidth: `${e}px`
           };
         }
-        if (r)
-          return { minWidth: `${r}px` };
+        if (t)
+          return { minWidth: `${t}px` };
       }
     };
   }
 });
 export {
-  i as default
+  p as default
 };

package/dist/es/components/table/table-operation-td.js

@@ -1,17 +1,21 @@
-import { defineComponent as x, inject as b, computed as l, createVNode as r } from "vue";
-import { getOperationStyle as k, getOperationFixedCls as w, getLeafKeys as B, getSelectionStatus as j } from "./utils.js";
-import { Checkbox as c } from "../form-checkbox/index.js";
-import { Radio as y } from "../form-radio/index.js";
-import v from "../../icons/_self/more-dot.js";
-import { tableInjectionKey as K } from "./context.js";
-import { getClassNameMixin as O } from "../../_utils/config.js";
-const P = /* @__PURE__ */ x({
+import { defineComponent as v, inject as R, computed as d, createVNode as a, mergeProps as h } from "vue";
+import { getOperationStyle as A, getOperationFixedCls as B, getLeafKeys as T, getSelectionStatus as j } from "./utils.js";
+import { Checkbox as m } from "../form-checkbox/index.js";
+import { Radio as w } from "../form-radio/index.js";
+import K from "../../icons/_self/more-dot.js";
+import { tableInjectionKey as L } from "./context.js";
+import { getClassNameMixin as N } from "../../_utils/config.js";
+import { useTableLocale as O } from "./locale.js";
+import { tableDomListeners as E, getTableDomListeners as D } from "./dom-listeners.js";
+const z = /* @__PURE__ */ v({
   name: "OperationTd",
+  inheritAttrs: !1,
   components: {
-    Checkbox: c,
-    Radio: y
+    Checkbox: m,
+    Radio: w
   },
   props: {
+    ...E,
     operationColumn: {
       type: Object,
       required: !0
@@ -49,69 +53,86 @@ const P = /* @__PURE__ */ x({
   },
   emits: ["select"],
   setup(e, {
-    emit: E,
-    slots: i
+    attrs: g,
+    slots: c
   }) {
-    const o = O("table"), n = b(K, {}), C = l(() => k(e.operationColumn, e.operations)), g = l(() => [o.element("td"), o.element("operation"), {
-      [o.element("checkbox")]: e.operationColumn.name === "selection-checkbox",
-      [o.element("radio")]: e.operationColumn.name === "selection-radio",
-      [o.element("expand")]: e.operationColumn.name === "expand",
+    const t = N("table"), n = R(L, {}), l = O(), x = d(() => A(e.operationColumn, e.operations)), k = d(() => [t.element("td"), t.element("operation"), {
+      [t.element("checkbox")]: e.operationColumn.name === "selection-checkbox",
+      [t.element("radio")]: e.operationColumn.name === "selection-radio",
+      [t.element("expand")]: e.operationColumn.name === "expand",
       // 注意
-      [o.modifier("drag-handle")]: e.operationColumn.name === "drag-handle"
-    }, ...w(o.block, e.operationColumn)]), h = l(() => B(e.record)), u = l(() => j(n.currentSelectedRowKeys ?? [], h.value)), S = () => {
-      var m, f, s;
+      [t.modifier("drag-handle")]: e.operationColumn.name === "drag-handle"
+    }, ...B(t.block, e.operationColumn)]), s = d(() => T(e.record)), f = d(() => j(n.currentSelectedRowKeys ?? [], s.value)), S = () => {
+      var i, y, b, C;
       if (e.summary)
         return null;
       if (e.operationColumn.render)
         return e.operationColumn.render(e.record.raw);
       if (e.operationColumn.name === "selection-checkbox") {
-        const d = e.record.key;
-        return !n.checkStrictly && !e.record.isLeaf ? r(c, {
-          modelValue: u.value.checked,
-          indeterminate: u.value.indeterminate,
-          disabled: !!e.record.disabled,
+        const u = e.record.key;
+        return !n.checkStrictly && !e.record.isLeaf && ((i = e.record.children) == null ? void 0 : i.length) !== 0 ? a(m, {
+          modelValue: f.value.checked,
+          indeterminate: f.value.indeterminate,
+          disabled: !!e.record.disabled || s.value.length === 0,
+          "aria-label": l("selectRowText", {
+            row: e.record.key
+          }),
           uninjectGroupContext: !0,
-          onChange: (t) => {
-            var a;
-            return (a = n.onSelectAllLeafs) == null ? void 0 : a.call(n, e.record, t);
-          },
-          onClick: (t) => t.stopPropagation()
-        }, null) : r(c, {
-          modelValue: ((m = e.selectedRowKeys) == null ? void 0 : m.includes(d)) ?? !1,
+          onChange: (r) => {
+            var o;
+            return (o = n.onSelectAllLeafs) == null ? void 0 : o.call(n, e.record, r);
+          }
+        }, null) : a(m, {
+          modelValue: ((y = e.selectedRowKeys) == null ? void 0 : y.includes(u)) ?? !1,
           disabled: !!e.record.disabled,
+          "aria-label": l("selectRowText", {
+            row: e.record.key
+          }),
           uninjectGroupContext: !0,
-          onChange: (t) => {
-            var a;
-            return (a = n.onSelect) == null ? void 0 : a.call(n, t, e.record);
-          },
-          onClick: (t) => t.stopPropagation()
+          onChange: (r) => {
+            var o;
+            return (o = n.onSelect) == null ? void 0 : o.call(n, r, e.record);
+          }
         }, null);
       }
       if (e.operationColumn.name === "selection-radio") {
-        const d = e.record.key;
-        return r(y, {
-          modelValue: ((f = e.selectedRowKeys) == null ? void 0 : f.includes(d)) ?? !1,
+        const u = e.record.key;
+        return a(w, {
+          modelValue: ((b = e.selectedRowKeys) == null ? void 0 : b.includes(u)) ?? !1,
           disabled: !!e.record.disabled,
+          name: n.selectionName,
+          "aria-label": l("selectRowText", {
+            row: e.record.key
+          }),
           uninjectGroupContext: !0,
-          onChange: (t) => {
-            var a;
-            return (a = n.onSelect) == null ? void 0 : a.call(n, t, e.record);
-          },
-          onClick: (t) => t.stopPropagation()
+          onChange: (r) => {
+            var o;
+            return (o = n.onSelect) == null ? void 0 : o.call(n, r, e.record);
+          }
         }, null);
       }
-      return e.operationColumn.name === "expand" ? e.hasExpand && e.renderExpandBtn ? e.renderExpandBtn(e.record) : null : e.operationColumn.name === "drag-handle" ? ((s = i["drag-handle-icon"]) == null ? void 0 : s.call(i)) ?? r(v, null, null) : null;
+      return e.operationColumn.name === "expand" ? e.hasExpand && e.renderExpandBtn ? e.renderExpandBtn(e.record) : null : e.operationColumn.name === "drag-handle" ? a("button", {
+        type: "button",
+        class: t.element("drag-button"),
+        "aria-label": l("moveRowText", {
+          row: e.record.key
+        }),
+        "aria-keyshortcuts": "Alt+ArrowUp Alt+ArrowDown"
+      }, [((C = c["drag-handle-icon"]) == null ? void 0 : C.call(c)) ?? a(K, null, null)]) : null;
     };
-    return () => r("td", {
-      class: g.value,
-      style: C.value,
+    return () => a("td", h(h(g, D(e), {
+      class: k.value,
+      style: x.value
+    }), {
+      "data-x-table-column": e.operationColumn.name,
       rowspan: e.rowSpan > 1 ? e.rowSpan : void 0,
       colspan: e.colSpan > 1 ? e.colSpan : void 0
-    }, [r("span", {
-      class: o.element("cell")
+    }), [a("span", {
+      class: t.element("cell"),
+      onClick: e.operationColumn.name.startsWith("selection-") ? (i) => i.stopPropagation() : void 0
     }, [S()])]);
   }
 });
 export {
-  P as default
+  z as default
 };

package/dist/es/components/table/table-operation-th.js

@@ -1,10 +1,11 @@
-import { defineComponent as h, inject as w, computed as r, createVNode as a } from "vue";
-import { getOperationStyle as S, getOperationFixedCls as A } from "./utils.js";
-import { Checkbox as g } from "../form-checkbox/index.js";
-import { isFunction as d } from "../../_utils/is.js";
+import { defineComponent as A, inject as S, computed as a, createVNode as i } from "vue";
+import { getOperationStyle as g, getOperationFixedCls as x } from "./utils.js";
+import { Checkbox as K } from "../form-checkbox/index.js";
+import { isFunction as f } from "../../_utils/is.js";
 import { tableInjectionKey as k } from "./context.js";
-import { getClassNameMixin as x } from "../../_utils/config.js";
-const q = /* @__PURE__ */ h({
+import { getClassNameMixin as E } from "../../_utils/config.js";
+import { useTableLocale as N } from "./locale.js";
+const V = /* @__PURE__ */ A({
   name: "OperationTh",
   props: {
     operationColumn: {
@@ -26,39 +27,45 @@ const q = /* @__PURE__ */ h({
     }
   },
   setup(e) {
-    const n = x("table"), t = w(k, {}), i = r(() => {
-      var c, m;
-      let o = !1, l = !1;
-      const u = (((c = t.currentSelectedRowKeys) == null ? void 0 : c.filter((p) => {
-        var s;
-        return ((s = t.currentAllEnabledRowKeys) == null ? void 0 : s.includes(p)) ?? !0;
-      })) ?? []).length, y = ((m = t.currentAllEnabledRowKeys) == null ? void 0 : m.length) ?? 0;
-      return u > 0 && (u >= y ? o = !0 : l = !0), {
-        checked: o,
-        indeterminate: l
+    const n = E("table"), t = S(k, {}), b = N(), c = a(() => {
+      var m, s;
+      let l = !1, o = !1;
+      const u = (((m = t.currentSelectedRowKeys) == null ? void 0 : m.filter((w) => {
+        var d;
+        return ((d = t.currentAllEnabledRowKeys) == null ? void 0 : d.includes(w)) ?? !0;
+      })) ?? []).length, h = ((s = t.currentAllEnabledRowKeys) == null ? void 0 : s.length) ?? 0;
+      return u > 0 && (u >= h ? l = !0 : o = !0), {
+        checked: l,
+        indeterminate: o
       };
-    }), f = () => e.selectAll ? a(g, {
-      modelValue: i.value.checked,
-      indeterminate: i.value.indeterminate,
-      uninjectGroupContext: !0,
-      onChange: (o) => {
-        var l;
-        (l = t.onSelectAll) == null || l.call(t, o);
-      }
-    }, {
-      default: d(e.operationColumn.title) ? e.operationColumn.title() : e.operationColumn.title
-    }) : e.operationColumn.title ? d(e.operationColumn.title) ? e.operationColumn.title() : e.operationColumn.title : null, C = r(() => S(e.operationColumn, e.operations)), b = r(() => [n.element("th"), n.element("operation"), {
+    }), C = () => {
+      var l;
+      return e.selectAll ? i(K, {
+        modelValue: c.value.checked,
+        indeterminate: c.value.indeterminate,
+        disabled: !((l = t.currentAllEnabledRowKeys) != null && l.length),
+        "aria-label": b("selectAllText"),
+        uninjectGroupContext: !0,
+        onChange: (o) => {
+          var r;
+          (r = t.onSelectAll) == null || r.call(t, o);
+        }
+      }, {
+        default: f(e.operationColumn.title) ? e.operationColumn.title() : e.operationColumn.title
+      }) : e.operationColumn.title ? f(e.operationColumn.title) ? e.operationColumn.title() : e.operationColumn.title : null;
+    }, p = a(() => g(e.operationColumn, e.operations)), y = a(() => [n.element("th"), n.element("operation"), {
       [n.element("checkbox")]: e.selectAll
-    }, ...A(n.block, e.operationColumn)]);
-    return () => a("th", {
-      class: b.value,
-      style: C.value,
+    }, ...x(n.block, e.operationColumn)]);
+    return () => i("th", {
+      scope: "col",
+      class: y.value,
+      style: p.value,
       rowspan: e.rowSpan > 1 ? e.rowSpan : void 0
-    }, [a("span", {
+    }, [i("span", {
       class: n.element("cell")
-    }, [f()])]);
+    }, [C()])]);
   }
 });
 export {
-  q as default
+  V as default
 };