@oneflowui/ui 0.5.4 → 0.5.5

package/dist/components/table/TableDataRow.vue.js

@@ -1,7 +1,7 @@
 import o from "./TableDataRow.vue2.js";
 /* empty css                  */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-fe10199c"]]);
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-b5ce5f86"]]);
 export {
   f as default
 };

package/dist/components/table/TableDataRow.vue2.js

@@ -1,24 +1,24 @@
-import { defineComponent as S, computed as p, openBlock as o, createElementBlock as s, normalizeClass as $, withModifiers as B, createElementVNode as D, createCommentVNode as T, Fragment as g, renderList as A, normalizeStyle as d, renderSlot as P, toDisplayString as a } from "vue";
+import { defineComponent as S, computed as m, openBlock as n, createElementBlock as s, normalizeClass as $, withModifiers as B, createElementVNode as D, createCommentVNode as T, Fragment as p, renderList as A, normalizeStyle as d, renderSlot as P, toDisplayString as a } from "vue";
 import { mergeColorMap as w, DEFAULT_PRIORITY_MAP as R, DEFAULT_STATUS_MAP as _, resolveBadge as h } from "../../composables/useBadge.js";
-const E = ["checked"], N = {
+const E = ["aria-selected"], N = ["checked"], V = {
   key: 0,
   class: "of-badge of-badge--role"
-}, V = {
+}, F = {
   key: 1,
   class: "of-td-empty"
-}, F = {
+}, I = {
   key: 3,
   class: "of-td-text"
-}, I = {
+}, L = {
   key: 4,
   class: "of-td-id"
-}, L = {
+}, U = {
   key: 5,
   class: "of-td-title"
-}, U = {
+}, z = {
   key: 6,
   class: "of-td-text"
-}, W = /* @__PURE__ */ S({
+}, G = /* @__PURE__ */ S({
   __name: "TableDataRow",
   props: {
     row: {},
@@ -30,18 +30,18 @@ const E = ["checked"], N = {
     statusColorMap: {}
   },
   emits: ["select", "click"],
-  setup(r, { emit: b }) {
-    const i = r, u = b;
+  setup(l, { emit: b }) {
+    const i = l, u = b;
     function C(e) {
       if (e.width === "fill") {
-        const n = `${e.minWidth ?? 220}px`;
-        return { flex: `1 1 ${n}`, minWidth: n };
+        const o = `${e.minWidth ?? 220}px`;
+        return { flex: `1 1 ${o}`, minWidth: o };
       }
       return { width: `${e.width}px`, flexShrink: "0", flexGrow: "0" };
     }
-    const v = p(
+    const v = m(
       () => w(R, i.priorityColorMap)
-    ), x = p(() => w(_, i.statusColorMap));
+    ), x = m(() => w(_, i.statusColorMap));
     function c(e) {
       return h(e, v.value);
     }
@@ -50,66 +50,70 @@ const E = ["checked"], N = {
     }
     function M(e) {
       if (!e) return "-";
-      const n = new Date(e);
-      return isNaN(n.getTime()) ? e : `${n.getMonth() + 1}/${n.getDate()}`;
+      const o = new Date(e);
+      return isNaN(o.getTime()) ? e : `${o.getMonth() + 1}/${o.getDate()}`;
     }
     function y(e) {
       return i.row[e.key];
     }
     function k(e) {
-      const n = y(e);
-      return n != null ? String(n) : "-";
+      const o = y(e);
+      return o != null ? String(o) : "-";
     }
-    function l(e) {
-      const n = y(e);
-      return typeof n == "string" ? n : "";
+    function r(e) {
+      const o = y(e);
+      return typeof o == "string" ? o : "";
     }
-    function m() {
+    function g() {
       const e = i.row[i.rowKey];
       return e != null ? String(e) : "";
     }
-    return (e, n) => (o(), s("div", {
-      class: $(["of-table-row", { "of-table-row--selected": r.selected }]),
-      onClick: n[2] || (n[2] = (t) => u("click", r.row))
+    return (e, o) => (n(), s("div", {
+      class: $(["of-table-row", { "of-table-row--selected": l.selected }]),
+      role: "row",
+      "aria-selected": l.selected || void 0,
+      onClick: o[2] || (o[2] = (t) => u("click", l.row))
     }, [
-      r.selectable ? (o(), s("div", {
+      l.selectable ? (n(), s("div", {
         key: 0,
         class: "of-td of-td-checkbox",
-        onClick: n[1] || (n[1] = B(() => {
+        role: "gridcell",
+        onClick: o[1] || (o[1] = B(() => {
         }, ["stop"]))
       }, [
         D("input", {
           type: "checkbox",
           class: "of-checkbox",
-          checked: r.selected,
-          onChange: n[0] || (n[0] = (t) => u("select", m()))
-        }, null, 40, E)
+          checked: l.selected,
+          onChange: o[0] || (o[0] = (t) => u("select", g()))
+        }, null, 40, N)
       ])) : T("", !0),
-      (o(!0), s(g, null, A(r.columns, (t) => (o(), s("div", {
+      (n(!0), s(p, null, A(l.columns, (t) => (n(), s("div", {
         key: t.key,
         class: "of-td",
+        role: "gridcell",
         style: d(C(t))
       }, [
         P(e.$slots, "cell", {
-          row: r.row,
+          row: l.row,
           col: t
         }, () => [
-          t.key === "status" ? (o(), s("span", {
+          t.key === "status" ? (n(), s("span", {
             key: 0,
             class: "of-badge",
-            style: d(f(l(t)).style)
-          }, a(f(l(t)).label), 5)) : t.key === "priority" ? (o(), s("span", {
+            style: d(f(r(t)).style)
+          }, a(f(r(t)).label), 5)) : t.key === "priority" ? (n(), s("span", {
             key: 1,
             class: "of-badge",
-            style: d(c(l(t)).style)
-          }, a(c(l(t)).label), 5)) : t.key === "role" ? (o(), s(g, { key: 2 }, [
-            l(t) ? (o(), s("span", N, a(l(t)), 1)) : (o(), s("span", V, "-"))
-          ], 64)) : t.key === "updatedAt" ? (o(), s("span", F, a(M(l(t))), 1)) : t.key === "id" ? (o(), s("span", I, a(m()), 1)) : t.key === "title" ? (o(), s("span", L, a(k(t)), 1)) : (o(), s("span", U, a(k(t)), 1))
+            style: d(c(r(t)).style)
+          }, a(c(r(t)).label), 5)) : t.key === "role" ? (n(), s(p, { key: 2 }, [
+            r(t) ? (n(), s("span", V, a(r(t)), 1)) : (n(), s("span", F, "-"))
+          ], 64)) : t.key === "updatedAt" ? (n(), s("span", I, a(M(r(t))), 1)) : t.key === "id" ? (n(), s("span", L, a(g()), 1)) : t.key === "title" ? (n(), s("span", U, a(k(t)), 1)) : (n(), s("span", z, a(k(t)), 1))
         ], !0)
       ], 4))), 128))
-    ], 2));
+    ], 10, E));
   }
 });
 export {
-  W as default
+  G as default
 };

package/dist/components/table/TableGroupRow.vue.js

@@ -1,7 +1,7 @@
 import o from "./TableGroupRow.vue2.js";
 /* empty css                   */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const a = /* @__PURE__ */ r(o, [["__scopeId", "data-v-c6e2f1e0"]]);
+const c = /* @__PURE__ */ r(o, [["__scopeId", "data-v-52c60c99"]]);
 export {
-  a as default
+  c as default
 };

package/dist/components/table/TableGroupRow.vue2.js

@@ -1,12 +1,15 @@
-import { defineComponent as w, computed as u, openBlock as l, createElementBlock as a, normalizeStyle as p, createCommentVNode as g, createElementVNode as d, normalizeClass as k, createTextVNode as x, toDisplayString as n, Fragment as h, renderList as B } from "vue";
+import { defineComponent as w, computed as c, openBlock as l, createElementBlock as a, normalizeStyle as p, createElementVNode as g, createCommentVNode as d, normalizeClass as k, createTextVNode as x, toDisplayString as s, Fragment as h, renderList as B } from "vue";
 import { resolveBadge as C } from "../../composables/useBadge.js";
 const N = {
+  class: "of-table-group-row__cell",
+  role: "gridcell"
+}, K = {
   key: 0,
   class: "of-table-group-row__checkbox-spacer"
-}, K = {
+}, L = {
   key: 2,
   class: "of-table-group-row__label"
-}, L = { class: "of-table-group-row__count" }, T = /* @__PURE__ */ w({
+}, M = { class: "of-table-group-row__count" }, V = /* @__PURE__ */ w({
   name: "TableGroupRow",
   __name: "TableGroupRow",
   props: {
@@ -19,40 +22,43 @@ const N = {
     aggregations: {}
   },
   emits: ["toggle"],
-  setup(s, { emit: i }) {
-    const o = s, m = i, r = u(() => o.colorMap ? C(o.groupKey, o.colorMap) : null), b = u(() => o.groupKey || "(空)"), f = u(() => o.level * 16), _ = u(() => o.aggregations ? Object.entries(o.aggregations).map(([c, t]) => {
-      const [, e] = c.split(":"), y = e === "sum" ? "总计" : e === "avg" ? "平均" : e === "min" ? "最小" : e === "max" ? "最大" : "计数", v = typeof t == "number" && !Number.isInteger(t) ? t.toFixed(2) : String(t);
-      return { key: c, label: y, value: v };
+  setup(n, { emit: i }) {
+    const o = n, b = i, r = c(() => o.colorMap ? C(o.groupKey, o.colorMap) : null), m = c(() => o.groupKey || "(空)"), f = c(() => o.level * 16), _ = c(() => o.aggregations ? Object.entries(o.aggregations).map(([u, t]) => {
+      const [, e] = u.split(":"), y = e === "sum" ? "总计" : e === "avg" ? "平均" : e === "min" ? "最小" : e === "max" ? "最大" : "计数", v = typeof t == "number" && !Number.isInteger(t) ? t.toFixed(2) : String(t);
+      return { key: u, label: y, value: v };
     }) : []);
-    return (c, t) => (l(), a("div", {
+    return (u, t) => (l(), a("div", {
       class: "of-table-group-row",
-      onClick: t[0] || (t[0] = (e) => m("toggle")),
+      role: "row",
+      onClick: t[0] || (t[0] = (e) => b("toggle")),
       style: p({ paddingLeft: `${12 + f.value}px` })
     }, [
-      s.selectable ? (l(), a("div", N)) : g("", !0),
-      d("span", {
-        class: k(["of-table-group-row__chevron", { "of-table-group-row__chevron--collapsed": s.collapsed }])
-      }, "▼", 2),
-      r.value ? (l(), a("span", {
-        key: 1,
-        class: "of-table-group-row__badge",
-        style: p(r.value.style)
-      }, [
-        r.value.dot ? (l(), a("span", {
-          key: 0,
-          class: "of-table-group-row__badge-dot",
-          style: p({ background: r.value.dot })
-        }, null, 4)) : g("", !0),
-        x(" " + n(r.value.label), 1)
-      ], 4)) : (l(), a("span", K, n(b.value), 1)),
-      d("span", L, "(" + n(s.count) + ")", 1),
-      (l(!0), a(h, null, B(_.value, (e) => (l(), a("span", {
-        key: e.key,
-        class: "of-table-group-row__agg"
-      }, n(e.label) + ": " + n(e.value), 1))), 128))
+      g("div", N, [
+        n.selectable ? (l(), a("div", K)) : d("", !0),
+        g("span", {
+          class: k(["of-table-group-row__chevron", { "of-table-group-row__chevron--collapsed": n.collapsed }])
+        }, "▼", 2),
+        r.value ? (l(), a("span", {
+          key: 1,
+          class: "of-table-group-row__badge",
+          style: p(r.value.style)
+        }, [
+          r.value.dot ? (l(), a("span", {
+            key: 0,
+            class: "of-table-group-row__badge-dot",
+            style: p({ background: r.value.dot })
+          }, null, 4)) : d("", !0),
+          x(" " + s(r.value.label), 1)
+        ], 4)) : (l(), a("span", L, s(m.value), 1)),
+        g("span", M, "(" + s(n.count) + ")", 1),
+        (l(!0), a(h, null, B(_.value, (e) => (l(), a("span", {
+          key: e.key,
+          class: "of-table-group-row__agg"
+        }, s(e.label) + ": " + s(e.value), 1))), 128))
+      ])
     ], 4));
   }
 });
 export {
-  T as default
+  V as default
 };

package/dist/components/table/TableHeaderRow.vue.js

@@ -1,7 +1,7 @@
 import o from "./TableHeaderRow.vue2.js";
 /* empty css                    */
 import a from "../../_virtual/_plugin-vue_export-helper.js";
-const m = /* @__PURE__ */ a(o, [["__scopeId", "data-v-1a914c68"]]);
+const m = /* @__PURE__ */ a(o, [["__scopeId", "data-v-cbab1336"]]);
 export {
   m as default
 };

package/dist/components/table/TableHeaderRow.vue2.js

@@ -1,8 +1,13 @@
-import { defineComponent as v, openBlock as o, createElementBlock as i, createElementVNode as c, createCommentVNode as f, Fragment as x, renderList as z, withModifiers as d, normalizeStyle as C, normalizeClass as w, toDisplayString as B, createBlock as u, unref as r, createVNode as S } from "vue";
-import { ChevronUp as $, ChevronDown as k, Plus as g } from "lucide-vue-next";
-const D = { class: "of-table-header" }, F = {
+import { defineComponent as v, openBlock as o, createElementBlock as s, createElementVNode as c, createCommentVNode as f, Fragment as x, renderList as z, withModifiers as r, normalizeStyle as C, normalizeClass as w, toDisplayString as B, createBlock as u, unref as d, createVNode as S } from "vue";
+import { ChevronUp as $, ChevronDown as h, Plus as g } from "lucide-vue-next";
+const D = {
+  class: "of-table-header",
+  role: "row"
+}, F = {
   key: 0,
-  class: "of-th of-th-checkbox"
+  class: "of-th of-th-checkbox",
+  role: "columnheader",
+  "aria-label": "选择全部行"
 }, M = ["checked", "indeterminate"], K = ["aria-sort", "onClick", "onContextmenu", "onDblclick"], O = { class: "of-th-label" }, R = { class: "of-th-sort-icon" }, N = ["onMousedown", "onDblclick"], E = /* @__PURE__ */ v({
   __name: "TableHeaderRow",
   props: {
@@ -17,8 +22,8 @@ const D = { class: "of-table-header" }, F = {
     enableAddField: { type: Boolean, default: !1 }
   },
   emits: ["sort", "select-all", "resize-start", "resize-dblclick", "header-contextmenu", "header-dblclick", "add-field"],
-  setup(e, { emit: h }) {
-    const s = h;
+  setup(e, { emit: k }) {
+    const a = k;
     function y(n) {
       if (n.width === "fill") {
         const l = `${n.minWidth ?? 220}px`;
@@ -27,60 +32,62 @@ const D = { class: "of-table-header" }, F = {
       return { width: `${n.width}px`, flexShrink: "0", flexGrow: "0" };
     }
     function m(n) {
-      s("sort", n);
+      a("sort", n);
     }
     function b(n, l) {
-      n.stopPropagation(), s("resize-start", n, l);
+      n.stopPropagation(), a("resize-start", n, l);
     }
-    return (n, l) => (o(), i("div", D, [
-      e.selectable ? (o(), i("div", F, [
+    return (n, l) => (o(), s("div", D, [
+      e.selectable ? (o(), s("div", F, [
         c("input", {
           type: "checkbox",
           class: "of-checkbox",
           checked: e.allSelected,
           indeterminate: e.indeterminate,
-          onChange: l[0] || (l[0] = (t) => s("select-all"))
+          onChange: l[0] || (l[0] = (t) => a("select-all"))
         }, null, 40, M)
       ])) : f("", !0),
-      (o(!0), i(x, null, z(e.columns, (t) => (o(), i("div", {
+      (o(!0), s(x, null, z(e.columns, (t) => (o(), s("div", {
         key: t.key,
         role: "columnheader",
         class: w(["of-th", { "of-th--sortable": !0, "of-th--active": e.sortKey === t.key }]),
         style: C(y(t)),
         "aria-sort": e.sortKey === t.key ? e.sortOrder === "asc" ? "ascending" : "descending" : "none",
-        onClick: (a) => m(t.key),
-        onContextmenu: d((a) => e.enableFieldMenu && s("header-contextmenu", a, t.key), ["prevent"]),
-        onDblclick: d((a) => e.enableFieldMenu && s("header-dblclick", t.key), ["stop"])
+        onClick: (i) => m(t.key),
+        onContextmenu: r((i) => e.enableFieldMenu && a("header-contextmenu", i, t.key), ["prevent"]),
+        onDblclick: r((i) => e.enableFieldMenu && a("header-dblclick", t.key), ["stop"])
       }, [
         c("span", O, B(t.label), 1),
         c("span", R, [
-          e.sortKey === t.key && e.sortOrder === "asc" ? (o(), u(r($), {
+          e.sortKey === t.key && e.sortOrder === "asc" ? (o(), u(d($), {
             key: 0,
             size: 12,
             class: "of-sort-icon-active"
-          })) : e.sortKey === t.key && e.sortOrder === "desc" ? (o(), u(r(k), {
+          })) : e.sortKey === t.key && e.sortOrder === "desc" ? (o(), u(d(h), {
             key: 1,
             size: 12,
             class: "of-sort-icon-active"
-          })) : (o(), u(r(k), {
+          })) : (o(), u(d(h), {
             key: 2,
             size: 12,
             class: "of-sort-icon-idle"
           }))
         ]),
-        e.enableResize ? (o(), i("div", {
+        e.enableResize ? (o(), s("div", {
           key: 0,
           class: "of-th-resizer",
-          onMousedown: (a) => b(a, t.key),
-          onDblclick: d((a) => s("resize-dblclick", t.key), ["stop"])
+          onMousedown: (i) => b(i, t.key),
+          onDblclick: r((i) => a("resize-dblclick", t.key), ["stop"])
         }, null, 40, N)) : f("", !0)
       ], 46, K))), 128)),
-      e.enableAddField ? (o(), i("div", {
+      e.enableAddField ? (o(), s("div", {
         key: 1,
         class: "of-th of-th-add",
-        onClick: l[1] || (l[1] = d((t) => s("add-field"), ["stop"]))
+        role: "columnheader",
+        "aria-label": "添加字段",
+        onClick: l[1] || (l[1] = r((t) => a("add-field"), ["stop"]))
       }, [
-        S(r(g), { size: 14 })
+        S(d(g), { size: 14 })
       ])) : f("", !0)
     ]));
   }