@oneflowui/ui 0.5.6 → 0.5.8

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

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

package/dist/components/table/TableHeaderRow.vue.d.ts

@@ -1,4 +1,4 @@
-import { TableColumn } from '../../types';
+import { Density, TableColumn } from '../../types';
 type __VLS_Props = {
     columns: TableColumn[];
     selectable?: boolean;
@@ -9,6 +9,7 @@ type __VLS_Props = {
     enableResize?: boolean;
     enableFieldMenu?: boolean;
     enableAddField?: boolean;
+    density?: Density;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     sort: (key: string) => any;
@@ -27,6 +28,7 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
     "onHeader-dblclick"?: ((colKey: string) => any) | undefined;
     "onAdd-field"?: (() => any) | undefined;
 }>, {
+    density: Density;
     selectable: boolean;
     sortKey: string;
     sortOrder: "asc" | "desc";

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-cbab1336"]]);
+const m = /* @__PURE__ */ a(o, [["__scopeId", "data-v-9b7b027a"]]);
 export {
   m as default
 };

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

@@ -1,14 +1,9 @@
-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",
-  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({
+import { defineComponent as M, computed as u, openBlock as a, createElementBlock as i, normalizeStyle as f, createElementVNode as r, createCommentVNode as k, Fragment as B, renderList as P, withModifiers as c, normalizeClass as W, toDisplayString as D, createBlock as b, unref as h, createVNode as K } from "vue";
+import { ChevronUp as H, ChevronDown as m, Plus as F } from "lucide-vue-next";
+const Y = {
+  class: "of-th-checkbox__label",
+  for: "of-table-select-all-checkbox"
+}, O = ["checked", "indeterminate"], E = ["aria-sort", "onClick", "onKeydown", "onContextmenu", "onDblclick"], N = { class: "of-th-label" }, R = { class: "of-th-sort-icon" }, T = ["onMousedown", "onDblclick"], V = /* @__PURE__ */ M({
   __name: "TableHeaderRow",
   props: {
     columns: {},
@@ -19,79 +14,137 @@ const D = {
     indeterminate: { type: Boolean, default: !1 },
     enableResize: { type: Boolean, default: !1 },
     enableFieldMenu: { type: Boolean, default: !1 },
-    enableAddField: { type: Boolean, default: !1 }
+    enableAddField: { type: Boolean, default: !1 },
+    density: { default: "standard" }
   },
   emits: ["sort", "select-all", "resize-start", "resize-dblclick", "header-contextmenu", "header-dblclick", "add-field"],
-  setup(e, { emit: k }) {
-    const a = k;
-    function y(n) {
-      if (n.width === "fill") {
-        const l = `${n.minWidth ?? 220}px`;
-        return { flex: `1 1 ${l}`, minWidth: l };
+  setup(t, { emit: x }) {
+    const g = t, o = x, v = {
+      compact: {
+        headerHeight: 32,
+        cellPaddingX: 10,
+        cellPaddingY: 6,
+        addColumnWidth: 32,
+        fillMinWidth: 180
+      },
+      standard: {
+        headerHeight: 36,
+        cellPaddingX: 12,
+        cellPaddingY: 8,
+        addColumnWidth: 36,
+        fillMinWidth: 220
+      },
+      comfortable: {
+        headerHeight: 40,
+        cellPaddingX: 14,
+        cellPaddingY: 10,
+        addColumnWidth: 40,
+        fillMinWidth: 240
       }
-      return { width: `${n.width}px`, flexShrink: "0", flexGrow: "0" };
+    }, s = u(() => v[g.density]), C = u(() => ({
+      minHeight: `${s.value.headerHeight}px`
+    })), y = u(() => ({
+      padding: `${s.value.cellPaddingY}px ${s.value.cellPaddingX}px`
+    })), w = u(() => ({
+      ...y.value,
+      width: `${s.value.addColumnWidth}px`,
+      flexShrink: "0",
+      flexGrow: "0"
+    }));
+    function z(l) {
+      const n = y.value;
+      if (l.width === "fill") {
+        const e = `${l.minWidth ?? s.value.fillMinWidth}px`;
+        return { ...n, flex: `1 1 ${e}`, minWidth: e };
+      }
+      return { ...n, width: `${l.width}px`, flexShrink: "0", flexGrow: "0" };
+    }
+    function p(l) {
+      o("sort", l);
     }
-    function m(n) {
-      a("sort", n);
+    function S(l, n) {
+      l.target === l.currentTarget && (l.key !== "Enter" && l.key !== " " || (l.preventDefault(), o("sort", n)));
     }
-    function b(n, l) {
-      n.stopPropagation(), a("resize-start", n, l);
+    function $(l, n) {
+      l.stopPropagation(), o("resize-start", l, n);
     }
-    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) => a("select-all"))
-        }, null, 40, M)
-      ])) : f("", !0),
-      (o(!0), s(x, null, z(e.columns, (t) => (o(), s("div", {
-        key: t.key,
+    return (l, n) => (a(), i("div", {
+      class: "of-table-header",
+      role: "row",
+      style: f(C.value)
+    }, [
+      t.selectable ? (a(), i("div", {
+        key: 0,
+        class: "of-th of-th-checkbox",
         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: (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"])
+        "aria-label": "选择全部行",
+        style: f(y.value)
       }, [
-        c("span", O, B(t.label), 1),
-        c("span", R, [
-          e.sortKey === t.key && e.sortOrder === "asc" ? (o(), u(d($), {
+        r("label", Y, [
+          r("input", {
+            id: "of-table-select-all-checkbox",
+            type: "checkbox",
+            class: "of-checkbox",
+            checked: t.allSelected,
+            indeterminate: t.indeterminate,
+            onChange: n[0] || (n[0] = (e) => o("select-all"))
+          }, null, 40, O),
+          n[3] || (n[3] = r("span", { class: "of-sr-only" }, "选择全部行", -1))
+        ])
+      ], 4)) : k("", !0),
+      (a(!0), i(B, null, P(t.columns, (e) => (a(), i("div", {
+        key: e.key,
+        role: "columnheader",
+        tabindex: "0",
+        class: W(["of-th", { "of-th--sortable": !0, "of-th--active": t.sortKey === e.key }]),
+        style: f(z(e)),
+        "aria-sort": t.sortKey === e.key ? t.sortOrder === "asc" ? "ascending" : "descending" : "none",
+        onClick: (d) => p(e.key),
+        onKeydown: (d) => S(d, e.key),
+        onContextmenu: c((d) => t.enableFieldMenu && o("header-contextmenu", d, e.key), ["prevent"]),
+        onDblclick: c((d) => t.enableFieldMenu && o("header-dblclick", e.key), ["stop"])
+      }, [
+        r("span", N, D(e.label), 1),
+        r("span", R, [
+          t.sortKey === e.key && t.sortOrder === "asc" ? (a(), b(h(H), {
             key: 0,
             size: 12,
             class: "of-sort-icon-active"
-          })) : e.sortKey === t.key && e.sortOrder === "desc" ? (o(), u(d(h), {
+          })) : t.sortKey === e.key && t.sortOrder === "desc" ? (a(), b(h(m), {
             key: 1,
             size: 12,
             class: "of-sort-icon-active"
-          })) : (o(), u(d(h), {
+          })) : (a(), b(h(m), {
             key: 2,
             size: 12,
             class: "of-sort-icon-idle"
           }))
         ]),
-        e.enableResize ? (o(), s("div", {
+        t.enableResize ? (a(), i("button", {
           key: 0,
+          type: "button",
           class: "of-th-resizer",
-          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(), s("div", {
+          "aria-label": "调整列宽",
+          onClick: n[1] || (n[1] = c(() => {
+          }, ["stop"])),
+          onMousedown: (d) => $(d, e.key),
+          onDblclick: c((d) => o("resize-dblclick", e.key), ["stop"])
+        }, null, 40, T)) : k("", !0)
+      ], 46, E))), 128)),
+      t.enableAddField ? (a(), i("button", {
         key: 1,
+        type: "button",
         class: "of-th of-th-add",
-        role: "columnheader",
+        tabindex: "0",
         "aria-label": "添加字段",
-        onClick: l[1] || (l[1] = r((t) => a("add-field"), ["stop"]))
+        style: f(w.value),
+        onClick: n[2] || (n[2] = c((e) => o("add-field"), ["stop"]))
       }, [
-        S(d(g), { size: 14 })
-      ])) : f("", !0)
-    ]));
+        K(h(F), { size: 14 })
+      ], 4)) : k("", !0)
+    ], 4));
   }
 });
 export {
-  E as default
+  V as default
 };

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

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

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

@@ -40,11 +40,11 @@ const ie = { class: "of-table-toolbar" }, fe = {
   },
   emits: ["update:currentView", "update:columns", "update:searchKeyword", "add-filter", "remove-filter", "update-filter", "clear-filters", "update:filterLogic", "sort", "group", "save-view", "load-view"],
   setup(l, { emit: N }) {
-    const I = [
+    const R = l, u = N, I = [
       { value: "table", label: "表格", icon: "table-2" },
       { value: "kanban", label: "看板", icon: "columns-3" },
       { value: "timeline", label: "时间线", icon: "calendar" }
-    ], R = l, u = N, j = T(() => R.viewTabs ?? I), k = i(!1), v = i(!1), c = i(!1), p = i(!1), D = i(null), G = i(null), A = i(null), z = i(null), F = i({}), P = i({}), U = i({}), E = i({});
+    ], j = T(() => R.viewTabs ?? I), k = i(!1), v = i(!1), c = i(!1), p = i(!1), D = i(null), G = i(null), A = i(null), z = i(null), F = i({}), P = i({}), U = i({}), E = i({});
     function q(r) {
       if (!r) return {};
       const e = r.getBoundingClientRect();

package/dist/components/tabs/TabPanel.vue.js

@@ -1,7 +1,7 @@
-import o from "./TabPanel.vue2.js";
+import a from "./TabPanel.vue2.js";
 /* empty css              */
-import t from "../../_virtual/_plugin-vue_export-helper.js";
-const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-5e40c39f"]]);
+import o from "../../_virtual/_plugin-vue_export-helper.js";
+const p = /* @__PURE__ */ o(a, [["__scopeId", "data-v-66a21a08"]]);
 export {
-  f as default
+  p as default
 };

package/dist/components/tabs/TabPanel.vue2.js

@@ -9,9 +9,9 @@ const f = ["id", "aria-labelledby", "hidden"], k = /* @__PURE__ */ o({
     const l = e, t = i("of-tabs-active"), a = d(() => (t == null ? void 0 : t.value) === l.name);
     return (n, b) => e.keepAlive || a.value ? c((r(), u("div", {
       key: 0,
+      id: `of-panel-${e.name}`,
       class: "of-tab-panel",
       role: "tabpanel",
-      id: `of-panel-${e.name}`,
       "aria-labelledby": `of-tab-${e.name}`,
       hidden: e.keepAlive && !a.value ? !0 : void 0
     }, [

package/dist/components/tabs/Tabs.vue.js

@@ -1,7 +1,7 @@
 import o from "./Tabs.vue2.js";
 /* empty css          */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-dd5210e5"]]);
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-6c4531cc"]]);
 export {
-  p as default
+  m as default
 };

package/dist/components/tabs/Tabs.vue2.js

@@ -4,7 +4,7 @@ const B = {
   class: "of-tabs__nav",
   role: "tablist",
   "aria-label": "tabs"
-}, E = ["disabled", "id", "aria-selected", "aria-controls", "aria-disabled", "tabindex", "onClick", "onKeydown"], I = { class: "of-tabs__tab-label" }, K = {
+}, E = ["id", "disabled", "aria-selected", "aria-controls", "aria-disabled", "tabindex", "onClick", "onKeydown"], I = { class: "of-tabs__tab-label" }, K = {
   key: 1,
   class: "of-tabs__badge"
 }, L = { class: "of-tabs__content" }, F = /* @__PURE__ */ h({
@@ -53,6 +53,7 @@ const B = {
     }, [
       c("div", B, [
         (l(!0), r(D, null, x(i.tabs, (e) => (l(), r("button", {
+          id: `of-tab-${e.key}`,
           key: e.key,
           class: m(["of-tabs__tab", {
             "of-tabs__tab--active": o.value === e.key,
@@ -60,7 +61,6 @@ const B = {
           }]),
           disabled: e.disabled,
           role: "tab",
-          id: `of-tab-${e.key}`,
           "aria-selected": o.value === e.key,
           "aria-controls": `of-panel-${e.key}`,
           "aria-disabled": e.disabled,

package/dist/components/timeline/GanttRow.vue.d.ts

@@ -37,6 +37,8 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
         endDate: string;
     }) => any) | undefined;
 }>, {
+    priorityColorMap: ColorMap;
+    statusColorMap: ColorMap;
     readonly: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/components/timeline/GanttRow.vue.js

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

package/dist/components/timeline/GanttRow.vue2.js

@@ -1,6 +1,6 @@
-import { defineComponent as W, ref as _, computed as r, openBlock as B, createElementBlock as T, createElementVNode as n, normalizeStyle as d, toDisplayString as y, normalizeClass as A } from "vue";
-import { resolveBadge as h, mergeColorMap as M, DEFAULT_PRIORITY_MAP as z, DEFAULT_STATUS_MAP as R } from "../../composables/useBadge.js";
-const U = { class: "gantt-row__label" }, X = { class: "gantt-row__title" }, F = { class: "gantt-row__bar-label" }, G = /* @__PURE__ */ W({
+import { defineComponent as T, ref as b, computed as n, openBlock as A, createElementBlock as R, createElementVNode as r, normalizeStyle as l, toDisplayString as m, normalizeClass as _, withModifiers as z } from "vue";
+import { resolveBadge as h, mergeColorMap as M, DEFAULT_PRIORITY_MAP as U, DEFAULT_STATUS_MAP as X } from "../../composables/useBadge.js";
+const F = { class: "gantt-row__label" }, I = { class: "gantt-row__title" }, K = { class: "gantt-row__bar-label" }, N = /* @__PURE__ */ T({
   __name: "GanttRow",
   props: {
     item: {},
@@ -9,28 +9,28 @@ const U = { class: "gantt-row__label" }, X = { class: "gantt-row__title" }, F =
     durationDays: {},
     totalDays: {},
     readonly: { type: Boolean, default: !1 },
-    priorityColorMap: {},
-    statusColorMap: {}
+    priorityColorMap: { default: void 0 },
+    statusColorMap: { default: void 0 }
   },
   emits: ["click", "change"],
-  setup(s, { emit: b }) {
-    const t = s, u = b, l = _(!1), i = _(null);
-    let g = 0, D = 0, c = 0;
-    const C = r(() => t.totalDays * t.dayWidth), S = r(() => t.offsetDays * t.dayWidth), k = r(() => Math.max(t.durationDays, 1) * t.dayWidth), m = r(
+  setup(i, { emit: k }) {
+    const t = i, d = k, s = b(!1), u = b(null);
+    let g = 0, f = 0, c = 0;
+    const x = n(() => t.totalDays * t.dayWidth), C = n(() => t.offsetDays * t.dayWidth), S = n(() => Math.max(t.durationDays, 1) * t.dayWidth), y = n(
       () => h(
         t.item.priority || "",
-        M(z, t.priorityColorMap)
+        M(U, t.priorityColorMap)
       )
-    ), f = r(() => t.item.barColor ? { background: t.item.barColor, color: "var(--of-color-gray-800)" } : {
-      background: m.value.style.background,
-      color: m.value.style.color
-    }), x = r(() => m.value.style), $ = r(() => {
+    ), D = n(() => t.item.barColor ? { background: t.item.barColor, color: "var(--of-color-gray-800)" } : {
+      background: y.value.style.background,
+      color: y.value.style.color
+    }), E = n(() => y.value.style), $ = n(() => {
       const e = h(
         t.item.status || "",
-        M(R, t.statusColorMap)
+        M(X, t.statusColorMap)
       );
       return e.dot ?? e.style.color;
-    }), E = r(() => {
+    }), L = n(() => {
       const e = (a) => {
         const o = /* @__PURE__ */ new Date(`${a}T00:00:00`);
         return `${String(o.getMonth() + 1).padStart(2, "0")}/${String(o.getDate()).padStart(2, "0")}`;
@@ -38,73 +38,89 @@ const U = { class: "gantt-row__label" }, X = { class: "gantt-row__title" }, F =
       return `${e(t.item.startDate)} - ${e(t.item.endDate)}`;
     });
     function v(e, a) {
-      t.readonly || (e.preventDefault(), e.stopPropagation(), l.value = !0, i.value = a, g = e.clientX, D = t.offsetDays, c = t.durationDays, window.addEventListener("mousemove", p), window.addEventListener("mouseup", w));
+      t.readonly || (e.preventDefault(), e.stopPropagation(), s.value = !0, u.value = a, g = e.clientX, f = t.offsetDays, c = t.durationDays, window.addEventListener("mousemove", p), window.addEventListener("mouseup", w));
     }
     function p(e) {
-      if (!l.value || !i.value) return;
+      if (!s.value || !u.value) return;
       const a = Math.round((e.clientX - g) / t.dayWidth);
-      if (i.value === "move") {
-        const P = Math.max(0, Math.min(D + a, t.totalDays - 1));
-        u("change", {
+      if (u.value === "move") {
+        const B = Math.max(0, Math.min(f + a, t.totalDays - 1));
+        d("change", {
           id: t.item.id,
-          offsetDays: P,
+          offsetDays: B,
           durationDays: c,
           startDate: t.item.startDate,
           endDate: t.item.endDate
         });
         return;
       }
-      const o = Math.max(1, c + a), L = Math.max(1, t.totalDays - t.offsetDays);
-      u("change", {
+      const o = Math.max(1, c + a), W = Math.max(1, t.totalDays - t.offsetDays);
+      d("change", {
         id: t.item.id,
         offsetDays: t.offsetDays,
-        durationDays: Math.min(o, L),
+        durationDays: Math.min(o, W),
         startDate: t.item.startDate,
         endDate: t.item.endDate
       });
     }
     function w() {
-      l.value = !1, i.value = null, window.removeEventListener("mousemove", p), window.removeEventListener("mouseup", w);
+      s.value = !1, u.value = null, window.removeEventListener("mousemove", p), window.removeEventListener("mouseup", w);
     }
-    return (e, a) => (B(), T("div", {
+    function P(e) {
+      e.key !== "Enter" && e.key !== " " || (e.preventDefault(), d("click", t.item));
+    }
+    return (e, a) => (A(), R("div", {
       class: "gantt-row",
-      onClick: a[2] || (a[2] = (o) => u("click", s.item))
+      role: "button",
+      tabindex: "0",
+      onClick: a[2] || (a[2] = (o) => d("click", i.item)),
+      onKeydown: P
     }, [
-      n("div", U, [
-        n("span", {
+      r("div", F, [
+        r("span", {
           class: "gantt-row__dot",
-          style: d({ backgroundColor: $.value })
+          style: l({ backgroundColor: $.value })
         }, null, 4),
-        n("span", X, y(s.item.title), 1),
-        n("span", {
+        r("span", I, m(i.item.title), 1),
+        r("span", {
           class: "gantt-row__priority",
-          style: d(x.value)
-        }, y(s.item.priority), 5)
+          style: l(E.value)
+        }, m(i.item.priority), 5)
       ]),
-      n("div", {
+      r("div", {
         class: "gantt-row__chart",
-        style: d({ width: `${C.value}px` })
+        style: l({ width: `${x.value}px` })
       }, [
-        n("div", {
-          class: A(["gantt-row__bar", { "gantt-row__bar--dragging": l.value }]),
-          style: d({
-            left: `${S.value}px`,
-            width: `${k.value}px`,
-            backgroundColor: f.value.background,
-            color: f.value.color
-          }),
-          onMousedown: a[1] || (a[1] = (o) => v(o, "move"))
+        r("div", {
+          class: _(["gantt-row__bar-shell", { "gantt-row__bar--dragging": s.value }]),
+          style: l({
+            left: `${C.value}px`,
+            width: `${S.value}px`
+          })
         }, [
-          n("span", F, y(E.value), 1),
-          n("span", {
+          r("button", {
+            type: "button",
+            class: _(["gantt-row__bar", { "gantt-row__bar--dragging": s.value }]),
+            style: l({
+              backgroundColor: D.value.background,
+              color: D.value.color
+            }),
+            "aria-label": "拖动时间条",
+            onMousedown: a[0] || (a[0] = (o) => v(o, "move"))
+          }, [
+            r("span", K, m(L.value), 1)
+          ], 38),
+          r("button", {
+            type: "button",
             class: "gantt-row__handle",
-            onMousedown: a[0] || (a[0] = (o) => v(o, "resize-end"))
+            "aria-label": "调整结束时间",
+            onMousedown: a[1] || (a[1] = z((o) => v(o, "resize-end"), ["stop"]))
           }, null, 32)
-        ], 38)
+        ], 6)
       ], 4)
-    ]));
+    ], 32));
   }
 });
 export {
-  G as default
+  N as default
 };

package/dist/components/timeline/GanttTimeline.vue.d.ts

@@ -38,6 +38,12 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
     }) => any) | undefined;
     "onUpdate:records"?: ((records: DataRecord[]) => any) | undefined;
 }>, {
+    startDate: string;
+    items: GanttItem[];
+    data: Task[];
+    records: DataRecord[];
+    schema: TableSchema;
+    viewConfig: ViewConfig;
     startFieldId: string;
     endFieldId: string;
     labelFieldId: string;