@oneflowui/ui 0.5.6 → 0.5.7

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

@@ -1,155 +1,159 @@
-import { defineComponent as Fl, defineAsyncComponent as be, ref as R, toRef as h, computed as b, watch as ke, unref as t, openBlock as r, createElementBlock as s, Fragment as c, createVNode as E, createSlots as Hl, withCtx as he, renderSlot as T, normalizeProps as Bl, guardReactiveProps as Il, createBlock as y, createCommentVNode as $, createElementVNode as g, normalizeStyle as k, normalizeClass as z, renderList as m, mergeProps as K, withModifiers as P, toDisplayString as A, Teleport as Kl } from "vue";
+import { defineComponent as Pl, defineAsyncComponent as we, ref as $, computed as k, toRef as p, watch as pe, unref as t, openBlock as r, createElementBlock as s, Fragment as v, createVNode as L, createSlots as Ll, withCtx as he, renderSlot as z, normalizeProps as Gl, guardReactiveProps as Vl, createBlock as b, createCommentVNode as M, createElementVNode as c, normalizeStyle as w, normalizeClass as A, renderList as m, mergeProps as E, withModifiers as Z, toDisplayString as H, Teleport as Ol } from "vue";
 import me from "./TableHeaderRow.vue.js";
-import Ve from "./TableDataRow.vue.js";
-import Q from "./TableGroupRow.vue.js";
-import _l from "./NewRowBtn.vue.js";
-import El from "./MobileListView.vue.js";
-import _ from "./FieldCell.vue.js";
-import { useInlineEdit as Pl } from "../../composables/useInlineEdit.js";
-import { useVirtualList as Ll } from "../../composables/useVirtualList.js";
-import { useTable as Gl } from "../../composables/useTable.js";
-import { useTableGroup as Vl } from "../../composables/useTableGroup.js";
-import { useTableData as Ol } from "../../composables/useTableData.js";
-import { useTableColumns as Nl } from "../../composables/useTableColumns.js";
-import { useColumnResize as Wl } from "../../composables/useColumnResize.js";
-import { useKeyboardNavigation as Yl } from "../../composables/useKeyboardNavigation.js";
-import { useBreakpoint as jl } from "../../composables/useBreakpoint.js";
-import { useFixedColumns as Xl } from "../../composables/useFixedColumns.js";
-import { useRowDrag as Ul } from "../../composables/useRowDrag.js";
-import { useDraftRows as ql } from "../../composables/useDraftRows.js";
-const Jl = ["tabindex"], Ql = {
+import je from "./TableDataRow.vue.js";
+import _ from "./TableGroupRow.vue.js";
+import Nl from "./NewRowBtn.vue.js";
+import Wl from "./MobileListView.vue.js";
+import P from "./FieldCell.vue.js";
+import { useInlineEdit as Yl } from "../../composables/useInlineEdit.js";
+import { useVirtualList as jl } from "../../composables/useVirtualList.js";
+import { useTable as Xl } from "../../composables/useTable.js";
+import { useTableGroup as Ul } from "../../composables/useTableGroup.js";
+import { useTableData as ql } from "../../composables/useTableData.js";
+import { useTableColumns as Jl } from "../../composables/useTableColumns.js";
+import { useColumnResize as Ql } from "../../composables/useColumnResize.js";
+import { useKeyboardNavigation as Zl } from "../../composables/useKeyboardNavigation.js";
+import { useBreakpoint as _l } from "../../composables/useBreakpoint.js";
+import { useFixedColumns as eo } from "../../composables/useFixedColumns.js";
+import { useRowDrag as lo } from "../../composables/useRowDrag.js";
+import { useDraftRows as oo } from "../../composables/useDraftRows.js";
+const no = {
   key: 0,
   class: "of-data-table-body",
   style: { position: "relative" }
-}, Zl = { class: "of-data-table-fixed-body" }, eo = ["onMouseenter", "onClick"], lo = ["checked", "onChange"], oo = {
+}, to = { class: "of-data-table-fixed-body" }, ao = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], ro = ["for"], so = ["id", "checked", "onChange"], io = {
   key: 1,
   class: "of-td-text"
-}, to = ["onMouseenter", "onClick"], no = ["checked", "onChange"], ao = {
+}, uo = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], fo = ["for"], co = ["id", "checked", "onChange"], vo = {
   key: 1,
   class: "of-td-text"
-}, ro = { class: "of-data-table-scroll-body" }, so = {
+}, yo = { class: "of-data-table-scroll-body" }, go = {
   key: 0,
   style: { height: "36px" }
-}, io = ["onMouseenter", "onClick"], uo = {
+}, bo = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], ko = {
   key: 1,
   class: "of-td-text"
-}, fo = {
+}, wo = {
   key: 0,
   style: { height: "36px" }
-}, co = ["onMouseenter", "onClick"], vo = {
+}, po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], ho = {
   key: 1,
   class: "of-td-text"
-}, yo = {
+}, mo = {
   key: 1,
   class: "of-td-text"
-}, go = {
+}, Co = {
   key: 1,
   class: "of-td-text"
-}, bo = {
+}, Do = {
   key: 3,
   class: "of-data-table-draft-toolbar"
-}, ko = { class: "of-data-table-draft-count" }, ho = { class: "of-add-field-popup" }, mo = 36, po = 44, jo = /* @__PURE__ */ Fl({
+}, xo = { class: "of-data-table-draft-count" }, So = {
+  key: 0,
+  class: "of-add-field-overlay"
+}, Ro = { class: "of-add-field-popup" }, $o = 36, Mo = 44, qo = /* @__PURE__ */ Pl({
   __name: "DataTable",
   props: {
-    tasks: {},
-    records: {},
-    schema: {},
-    view: {},
-    columns: {},
-    fieldDefs: {},
+    tasks: { default: () => [] },
+    records: { default: () => [] },
+    schema: { default: void 0 },
+    view: { default: void 0 },
+    columns: { default: () => [] },
+    fieldDefs: { default: () => [] },
     rowKey: { default: "id" },
     selectable: { type: Boolean, default: !0 },
     addable: { type: Boolean, default: !0 },
-    priorityColorMap: {},
-    statusColorMap: {},
-    groupBy: {},
-    groupColorMap: {},
-    virtual: { type: Boolean },
+    priorityColorMap: { default: void 0 },
+    statusColorMap: { default: void 0 },
+    groupBy: { default: void 0 },
+    groupColorMap: { default: void 0 },
+    virtual: { type: Boolean, default: void 0 },
     virtualThreshold: { default: 100 },
     readonly: { type: Boolean, default: !1 },
-    fixedColumns: {},
+    fixedColumns: { default: () => [] },
     enableResize: { type: Boolean, default: !1 },
     enableKeyboard: { type: Boolean, default: !1 },
     enableRowDrag: { type: Boolean, default: !1 },
     enableCrossGroupDrag: { type: Boolean, default: !1 },
-    groups: {},
-    aggregations: {},
+    groups: { default: () => [] },
+    aggregations: { default: () => [] },
     enableFieldManagement: { type: Boolean, default: !1 }
   },
-  emits: ["row-click", "row-click-record", "add-row", "selection-change", "cell-edit", "column-resize", "active-cell-change", "row-reorder", "row-group-change", "draft-commit", "draft-discard", "drafts-commit-all", "paste", "schema-add-field", "schema-rename-field", "schema-change-field-type", "schema-hide-field", "schema-delete-field", "schema-duplicate-field"],
-  setup(u, { emit: Oe }) {
-    const Ne = be(() => import("./ColumnHeaderMenu.vue.js")), We = be(() => import("./FieldTypePicker.vue.js")), Ye = be(() => import("./DetailSheet.vue.js")), d = u, f = Oe, { isMobile: pe } = jl(), L = R(!1), G = R(null), Z = Pl(), { commit: je, editingCell: Xe } = Z, { rows: we } = Ol({
-      tasks: h(d, "tasks"),
-      records: h(d, "records")
-    }), { columns: ee } = Nl({
-      columns: h(d, "columns"),
-      schema: h(d, "schema"),
-      view: h(d, "view")
-    }), { startResize: Ue, columnWidthOverrides: qe, showResizeIndicator: Je, resizeIndicatorX: Qe, autoFitColumn: Ze } = Wl({
-      columns: ee,
+  emits: ["row-click", "row-click-record", "add-row", "selection-change", "cell-edit", "column-resize", "active-cell-change", "row-reorder", "row-group-change", "draft-commit", "draft-discard", "drafts-commit-all", "paste", "row-delete", "schema-add-field", "schema-rename-field", "schema-change-field-type", "schema-hide-field", "schema-delete-field", "schema-duplicate-field"],
+  setup(u, { emit: Xe }) {
+    const i = u, f = Xe, Ue = we(() => import("./ColumnHeaderMenu.vue.js")), qe = we(() => import("./FieldTypePicker.vue.js")), Je = we(() => import("./DetailSheet.vue.js")), { isMobile: Ce } = _l(), G = $(!1), ee = $(null), De = k(
+      () => ee.value
+    ), le = Yl(), { commit: Qe, editingCell: Ze } = le, { rows: xe } = ql({
+      tasks: p(i, "tasks"),
+      records: p(i, "records")
+    }), { columns: oe } = Jl({
+      columns: p(i, "columns"),
+      schema: p(i, "schema"),
+      view: p(i, "view")
+    }), { startResize: _e, columnWidthOverrides: el, showResizeIndicator: ll, resizeIndicatorX: ol, autoFitColumn: nl } = Ql({
+      columns: oe,
       onResize: (l, o) => f("column-resize", { colKey: l, width: o })
-    }), C = b(() => {
-      const l = qe.value;
-      return l.size === 0 ? ee.value : ee.value.map((o) => {
+    }), x = k(() => {
+      const l = el.value;
+      return l.size === 0 ? oe.value : oe.value.map((o) => {
         const e = l.get(o.key);
         return e !== void 0 ? { ...o, width: e } : o;
       });
     }), {
       data: V,
-      sort: F,
+      sort: K,
       toggleSort: O,
-      selectedRows: p,
-      toggleSelectAll: el,
-      toggleRowSelection: ll,
-      isAllSelected: le,
-      setData: ol
-    } = Gl({
-      data: we.value,
+      selectedRows: C,
+      toggleSelectAll: tl,
+      toggleRowSelection: al,
+      isAllSelected: ne,
+      setData: rl
+    } = Xl({
+      data: xe.value,
       pageSize: 999999
     });
-    ke(we, (l) => ol(l), { deep: !1 });
-    const { groupedItems: D, collapsedGroups: tl, toggleGroup: N, isGroupHeader: x } = Vl({
+    pe(xe, (l) => rl(l), { deep: !1 });
+    const { groupedItems: S, collapsedGroups: sl, toggleGroup: N, isGroupHeader: R } = Ul({
       data: V,
-      groupBy: h(d, "groupBy"),
-      groups: h(d, "groups"),
-      aggregations: h(d, "aggregations")
-    }), W = R(null), oe = R(null), Ce = R(null), nl = b(() => {
+      groupBy: p(i, "groupBy"),
+      groups: p(i, "groups"),
+      aggregations: p(i, "aggregations")
+    }), W = $(null), te = $(null), Se = $(null), dl = k(() => {
       var l;
-      return (((l = d.fixedColumns) == null ? void 0 : l.length) ?? 0) > 0;
-    }), De = R(0), al = b(() => De.value > 0), {
-      fixedColumns: te,
-      scrollableColumns: ne,
-      fixedWidth: xe,
-      handleScroll: rl,
-      handleFixedScroll: Se,
-      scrollLeft: wo,
-      syncHover: S,
+      return (((l = i.fixedColumns) == null ? void 0 : l.length) ?? 0) > 0;
+    }), Re = $(0), il = k(() => Re.value > 0), {
+      fixedColumns: ae,
+      scrollableColumns: re,
+      fixedWidth: $e,
+      handleScroll: ul,
+      handleFixedScroll: Me,
+      syncHover: g,
       isRowHovered: Y
-    } = Xl({
-      columns: C,
-      fixedColumnKeys: b(() => d.fixedColumns ?? []),
+    } = eo({
+      columns: x,
+      fixedColumnKeys: k(() => i.fixedColumns ?? []),
       scrollContainerRef: W,
-      fixedContainerRef: Ce
-    }), ae = b(() => d.virtual !== void 0 ? d.virtual : D.value.length >= d.virtualThreshold), { visibleItems: re, totalHeight: se, offsetY: de, scrollToIndex: sl, observeRow: j } = Ll({
-      items: D,
+      fixedContainerRef: Se
+    }), se = k(() => i.virtual !== void 0 ? i.virtual : S.value.length >= i.virtualThreshold), { visibleItems: de, totalHeight: ie, offsetY: ue, scrollToIndex: fl, observeRow: cl } = jl({
+      items: S,
       itemHeight: (l) => {
-        const o = D.value[l];
-        return x(o) ? mo : po;
+        const o = S.value[l];
+        return R(o) ? $o : Mo;
       },
       overscan: 5,
       containerRef: W,
       measureRow: !0
-    }), Re = b(() => D.value.filter((l) => !x(l))), { activeCell: $e, selectedRange: dl, setActiveCell: Me, handleKeyDown: il } = Yl({
-      columns: C,
-      rows: Re,
-      containerRef: oe,
-      editingCell: Xe,
-      enabled: b(() => d.enableKeyboard),
-      onActivateEdit: (l, o) => Z.activate(l, o),
-      onCancelEdit: () => Z.cancel(),
-      onScrollToRow: (l) => sl(l),
+    }), Fe = k(() => S.value.filter((l) => !R(l))), { activeCell: Te, selectedRange: vl, setActiveCell: ze, handleKeyDown: yl } = Zl({
+      columns: x,
+      rows: Fe,
+      containerRef: te,
+      editingCell: Ze,
+      enabled: k(() => i.enableKeyboard),
+      onActivateEdit: (l, o) => le.activate(l, o),
+      onCancelEdit: () => le.cancel(),
+      onScrollToRow: (l) => fl(l),
       getCellValue: (l, o) => {
-        const e = Re.value.find((a) => a.id === l);
+        const e = Fe.value.find((a) => a.id === l);
         if (!e) return "";
         const n = e[o];
         return n != null ? String(n) : "";
@@ -158,588 +162,631 @@ const Jl = ["tabindex"], Ql = {
         f("paste", { startRowId: l, startColKey: o, data: e });
       }
     });
-    ke($e, (l) => f("active-cell-change", l ?? null));
+    pe(Te, (l) => f("active-cell-change", l ?? null));
     const {
-      isDragging: ul,
-      draggedRowId: fl,
-      dropTargetId: ie,
-      dropPosition: Te,
-      handleDragStart: cl,
-      handleDragOver: vl,
-      handleDrop: yl,
-      handleDragEnd: ze
-    } = Ul({
-      processedItems: D,
-      enableCrossGroupDrag: b(() => d.enableCrossGroupDrag),
-      groupFieldId: h(d, "groupBy")
+      isDragging: gl,
+      draggedRowId: bl,
+      dropTargetId: fe,
+      dropPosition: Ae,
+      handleDragStart: kl,
+      handleDragOver: wl,
+      handleDrop: pl,
+      handleDragEnd: He
+    } = lo({
+      processedItems: S,
+      enableCrossGroupDrag: k(() => i.enableCrossGroupDrag),
+      groupFieldId: p(i, "groupBy")
     });
-    function Ae(l, o) {
-      d.enableRowDrag && cl(l, o);
+    function Ke(l, o) {
+      i.enableRowDrag && kl(l, o);
     }
-    function Fe(l, o) {
-      d.enableRowDrag && vl(l, o);
+    function Be(l, o) {
+      i.enableRowDrag && wl(l, o);
     }
-    function He(l, o) {
-      d.enableRowDrag && yl(l, o, {
+    function Ie(l, o) {
+      i.enableRowDrag && pl(l, o, {
         onReorder: (e) => f("row-reorder", e),
         onGroupChange: (e) => f("row-group-change", e)
       });
     }
     const {
-      drafts: Be,
-      addDraft: gl,
-      updateDraftField: Co,
-      removeDraft: Do,
-      commitDraft: xo,
-      commitAll: bl,
-      discardAll: kl,
-      isDraft: So,
-      getDraftErrors: Ro
-    } = ql({
-      schema: h(d, "schema"),
-      groupFieldId: h(d, "groupBy")
-    }), hl = b(() => Be.value.size > 0);
-    function ml() {
-      d.schema ? gl() : f("add-row");
-    }
-    function pl() {
-      const l = bl();
+      drafts: Ee,
+      addDraft: hl,
+      commitAll: ml,
+      discardAll: Cl
+    } = oo({
+      schema: p(i, "schema"),
+      groupFieldId: p(i, "groupBy")
+    }), Dl = k(() => Ee.value.size > 0);
+    function xl() {
+      i.schema ? hl() : f("add-row");
+    }
+    function Sl() {
+      const l = ml();
       l.length > 0 && f("drafts-commit-all", { records: l });
     }
-    function wl() {
-      kl();
+    function Rl() {
+      Cl();
     }
-    const w = R({ visible: !1, colKey: "", colLabel: "", x: 0, y: 0 }), X = R(!1);
-    function ue(l, o) {
+    const D = $({ visible: !1, colKey: "", colLabel: "", x: 0, y: 0 }), j = $(!1);
+    function Pe(l) {
+      return l === "multiselect" ? "multi_select" : l;
+    }
+    function ce(l, o) {
       var a;
-      const e = C.value.find((v) => v.key === o), n = (a = d.fieldDefs) == null ? void 0 : a.find((v) => v.id === o);
-      w.value = {
+      const e = x.value.find((y) => y.key === o), n = (a = i.fieldDefs) == null ? void 0 : a.find((y) => y.id === o);
+      D.value = {
         visible: !0,
         colKey: o,
         colLabel: (e == null ? void 0 : e.label) ?? o,
-        fieldType: n == null ? void 0 : n.type,
+        fieldType: Pe(n == null ? void 0 : n.type),
         x: l.clientX,
         y: l.clientY
       };
     }
-    function fe(l) {
+    function ve(l) {
       var e, n;
-      const o = C.value.find((a) => a.key === l);
-      w.value = {
+      const o = x.value.find((a) => a.key === l);
+      D.value = {
         visible: !0,
         colKey: l,
         colLabel: (o == null ? void 0 : o.label) ?? l,
-        fieldType: (n = (e = d.fieldDefs) == null ? void 0 : e.find((a) => a.id === l)) == null ? void 0 : n.type,
+        fieldType: Pe((n = (e = i.fieldDefs) == null ? void 0 : e.find((a) => a.id === l)) == null ? void 0 : n.type),
         x: 200,
         y: 100
       };
     }
-    function Cl(l, o) {
+    function $l(l, o) {
       f("schema-rename-field", { fieldId: l, newName: o });
     }
-    function Dl(l, o) {
+    function Ml(l, o) {
       f("schema-change-field-type", { fieldId: l, newType: o });
     }
-    function xl(l) {
+    function Fl(l) {
       f("schema-hide-field", l);
     }
-    function Sl(l) {
+    function Tl(l) {
       f("schema-delete-field", l);
     }
-    function Rl(l) {
+    function zl(l) {
       f("schema-duplicate-field", l);
     }
-    function ce() {
-      X.value = !0;
+    function ye() {
+      j.value = !0;
     }
-    function $l(l) {
-      f("schema-add-field", l), X.value = !1;
+    function Al(l) {
+      f("schema-add-field", l), j.value = !1;
     }
-    const M = b(() => d.readonly ? !1 : d.selectable), Ie = b(() => d.readonly ? !1 : d.addable), Ml = b(() => Array.from(p.value)), Ke = b(() => p.value.size > 0 && !le.value);
-    function _e() {
-      el(V.value);
+    const F = k(() => i.readonly ? !1 : i.selectable), Le = k(() => i.readonly ? !1 : i.addable), Hl = k(() => Array.from(C.value)), Ge = k(() => C.value.size > 0 && !ne.value);
+    function Ve() {
+      tl(V.value);
     }
-    function U(l) {
-      const o = V.value.find((e) => e[d.rowKey] === l);
-      o && ll(o, 0);
+    function X(l) {
+      const o = V.value.find((e) => e[i.rowKey] === l);
+      o && al(o, 0);
     }
-    ke(Ml, (l) => f("selection-change", l), { immediate: !1 });
-    function i(l) {
-      const o = l[d.rowKey];
+    pe(Hl, (l) => f("selection-change", l), { immediate: !1 });
+    function d(l) {
+      const o = l[i.rowKey];
       return o != null ? String(o) : "";
     }
-    function H(l) {
+    function B(l) {
       var o;
-      return ((o = d.fieldDefs) == null ? void 0 : o.find((e) => e.id === l)) ?? {
+      return ((o = i.fieldDefs) == null ? void 0 : o.find((e) => e.id === l)) ?? {
         id: l,
         type: "text",
         label: l
       };
     }
-    function B(l, o, e) {
-      je(l, o, e), f("cell-edit", { rowId: l, fieldId: o, value: e });
+    function I(l, o, e) {
+      Qe(l, o, e), f("cell-edit", { rowId: l, fieldId: o, value: e });
     }
-    function I(l) {
-      if (pe.value) {
-        G.value = l, L.value = !0;
+    function T(l) {
+      if (Ce.value) {
+        ee.value = l, G.value = !0;
         return;
       }
-      const o = l;
-      if (o.__record) {
-        f("row-click-record", o.__record), f("row-click", o.__record);
+      const o = l.__record;
+      if (o) {
+        f("row-click-record", o), f("row-click", o);
         return;
       }
       f("row-click", l);
     }
-    function ve(l, o) {
-      Ue(l, o);
+    function U(l, o) {
+      l.target === l.currentTarget && (l.key !== "Enter" && l.key !== " " || (l.preventDefault(), T(o)));
     }
-    function ye(l) {
-      Ze(l, oe.value);
+    function h(l, o) {
+      return l[o];
     }
-    function Tl(l) {
-      rl(l);
+    function Kl(l) {
+      if (!l) return null;
+      if (l instanceof HTMLElement) return l;
+      const o = l.$el;
+      return o instanceof HTMLElement ? o : null;
+    }
+    function q(l, o) {
+      cl(Kl(l), o);
+    }
+    function ge(l, o) {
+      _e(l, o);
+    }
+    function be(l) {
+      nl(l, te.value);
+    }
+    function Bl(l) {
+      ul(l);
       const o = l.target;
-      De.value = o.scrollLeft;
+      Re.value = o.scrollLeft;
     }
-    function q(l) {
+    function J(l) {
       return {
         groupKey: l.__groupKey,
         count: l.__groupCount,
-        collapsed: tl.value.has(
+        collapsed: sl.value.has(
           l.__groupPath ? l.__groupPath.join("/") : l.__groupKey
         ),
-        colorMap: d.groupColorMap,
-        selectable: M.value,
+        colorMap: i.groupColorMap,
+        selectable: F.value,
         level: l.__groupLevel ?? 0,
         aggregations: l.__aggregations
       };
     }
-    function J(l) {
+    function Q(l) {
       return l.__groupPath ? l.__groupPath.join("/") : l.__groupKey;
     }
-    function Ee(l) {
+    function Oe(l) {
       return {
         row: l,
-        rowKey: d.rowKey,
-        selected: p.value.has(i(l)),
-        selectable: M.value,
-        columns: C.value,
-        priorityColorMap: d.priorityColorMap,
-        statusColorMap: d.statusColorMap
+        rowKey: i.rowKey,
+        selected: C.value.has(d(l)),
+        selectable: F.value,
+        columns: x.value,
+        priorityColorMap: i.priorityColorMap,
+        statusColorMap: i.statusColorMap
       };
     }
-    function Pe(l, o) {
-      const e = $e.value;
+    function Ne(l, o) {
+      const e = Te.value;
       return e !== null && e.rowId === l && e.colKey === o;
     }
-    function Le(l, o) {
-      return dl.value.some((e) => e.rowId === l && e.colKey === o);
+    function We(l, o) {
+      return vl.value.some((e) => e.rowId === l && e.colKey === o);
     }
-    function Ge(l) {
-      const o = i(l);
+    function Ye(l) {
+      const o = d(l);
       return {
-        "of-row-dragging": ul.value && fl.value === o,
-        "of-row-drop-target": ie.value === o,
-        "of-row-drop-before": ie.value === o && Te.value === "before",
-        "of-row-drop-after": ie.value === o && Te.value === "after"
+        "of-row-dragging": gl.value && bl.value === o,
+        "of-row-drop-target": fe.value === o,
+        "of-row-drop-before": fe.value === o && Ae.value === "before",
+        "of-row-drop-after": fe.value === o && Ae.value === "after"
       };
     }
-    function zl(l) {
-      G.value = l, L.value = !0;
+    function Il(l) {
+      ee.value = l, G.value = !0;
     }
-    function Al(l) {
+    function El(l) {
       for (const [o, e] of Object.entries(l.fields))
         f("cell-edit", { rowId: l.rowId, fieldId: o, value: e });
     }
-    return (l, o) => t(pe) ? (r(), s(c, { key: 0 }, [
-      E(El, {
+    return (l, o) => t(Ce) ? (r(), s(v, { key: 0 }, [
+      L(Wl, {
         rows: t(V),
-        columns: C.value,
-        selectable: M.value,
-        addable: Ie.value,
+        columns: x.value,
+        selectable: F.value,
+        addable: Le.value,
         "status-color-map": u.statusColorMap,
         readonly: u.readonly,
-        onRowClick: zl,
-        onAddRow: o[0] || (o[0] = (e) => f("add-row"))
-      }, Hl({ _: 2 }, [
+        onRowClick: o[0] || (o[0] = (e) => Il(e)),
+        onAddRow: o[1] || (o[1] = (e) => f("add-row"))
+      }, Ll({ _: 2 }, [
         l.$slots.cell ? {
           name: "cell",
           fn: he((e) => [
-            T(l.$slots, "cell", Bl(Il(e)), void 0, !0)
+            z(l.$slots, "cell", Gl(Vl(e)), void 0, !0)
           ]),
           key: "0"
         } : void 0
       ]), 1032, ["rows", "columns", "selectable", "addable", "status-color-map", "readonly"]),
-      G.value ? (r(), y(t(Ye), {
+      De.value ? (r(), b(t(Je), {
         key: 0,
-        row: G.value,
-        columns: C.value,
+        row: De.value,
+        columns: x.value,
         "field-defs": u.fieldDefs,
-        visible: L.value,
-        onClose: o[1] || (o[1] = (e) => L.value = !1),
-        onSave: Al,
-        onDelete: o[2] || (o[2] = (e) => f("row-click", { id: e, __action: "delete" })),
-        onCellEdit: o[3] || (o[3] = (e) => f("cell-edit", e))
-      }, null, 8, ["row", "columns", "field-defs", "visible"])) : $("", !0)
+        visible: G.value,
+        onClose: o[2] || (o[2] = (e) => G.value = !1),
+        onSave: El,
+        onDelete: o[3] || (o[3] = (e) => f("row-delete", e)),
+        onCellEdit: o[4] || (o[4] = (e) => f("cell-edit", e))
+      }, null, 8, ["row", "columns", "field-defs", "visible"])) : M("", !0)
     ], 64)) : (r(), s("div", {
       key: 1,
       ref_key: "tableContainerRef",
-      ref: oe,
+      ref: te,
       class: "of-data-table",
       role: "grid",
-      tabindex: u.enableKeyboard ? 0 : void 0,
-      onKeydown: o[14] || (o[14] = (e) => u.enableKeyboard ? t(il)(e) : void 0)
+      tabindex: "0",
+      onKeydown: o[19] || (o[19] = (e) => u.enableKeyboard ? t(yl)(e) : void 0)
     }, [
-      nl.value ? (r(), s("div", Ql, [
-        g("div", {
+      dl.value ? (r(), s("div", no, [
+        c("div", {
           ref_key: "fixedContainerRef",
-          ref: Ce,
-          class: z(["of-data-table-fixed-region", { "of-fixed-shadow": al.value }]),
-          style: k({ width: t(xe) + "px" }),
-          onScroll: o[8] || (o[8] = //@ts-ignore
-          (...e) => t(Se) && t(Se)(...e))
+          ref: Se,
+          class: A(["of-data-table-fixed-region", { "of-fixed-shadow": il.value }]),
+          style: w({ width: t($e) + "px" }),
+          onScroll: o[11] || (o[11] = //@ts-ignore
+          (...e) => t(Me) && t(Me)(...e))
         }, [
-          E(me, {
-            columns: t(te),
-            selectable: M.value,
-            "sort-key": t(F).field ?? "",
-            "sort-order": t(F).order ?? "asc",
-            "all-selected": t(le),
-            indeterminate: Ke.value,
+          L(me, {
+            columns: t(ae),
+            selectable: F.value,
+            "sort-key": t(K).field ?? "",
+            "sort-order": t(K).order ?? "asc",
+            "all-selected": t(ne),
+            indeterminate: Ge.value,
             "enable-resize": u.enableResize,
             "enable-field-menu": u.enableFieldManagement,
             "enable-add-field": u.enableFieldManagement,
             onSort: t(O),
-            onSelectAll: _e,
-            onResizeStart: ve,
-            onResizeDblclick: ye,
-            onHeaderContextmenu: ue,
-            onHeaderDblclick: fe,
-            onAddField: ce
+            onSelectAll: Ve,
+            onResizeStart: ge,
+            onResizeDblclick: be,
+            onHeaderContextmenu: ce,
+            onHeaderDblclick: ve,
+            onAddField: ye
           }, null, 8, ["columns", "selectable", "sort-key", "sort-order", "all-selected", "indeterminate", "enable-resize", "enable-field-menu", "enable-add-field", "onSort"]),
-          g("div", Zl, [
-            ae.value ? (r(), s("div", {
+          c("div", to, [
+            se.value ? (r(), s("div", {
               key: 0,
-              style: k({ height: t(se) + "px", position: "relative" })
+              style: w({ height: t(ie) + "px", position: "relative" })
             }, [
-              g("div", {
-                style: k({ transform: `translateY(${t(de)}px)` })
+              c("div", {
+                style: w({ transform: `translateY(${t(ue)}px)` })
               }, [
-                (r(!0), s(c, null, m(t(re), ({ data: e, index: n }) => (r(), s(c, {
+                (r(!0), s(v, null, m(t(de), ({ data: e, index: n }) => (r(), s(v, {
                   key: e.id
                 }, [
-                  t(x)(e) ? (r(), y(Q, K({
+                  t(R)(e) ? (r(), b(_, E({
                     key: 0,
                     ref_for: !0,
-                    ref: (a) => t(j)((a == null ? void 0 : a.$el) ?? a, n)
-                  }, { ref_for: !0 }, q(e), {
-                    onToggle: (a) => t(N)(J(e))
+                    ref: (a) => q(a, n)
+                  }, { ref_for: !0 }, J(e), {
+                    onToggle: (a) => t(N)(Q(e))
                   }), null, 16, ["onToggle"])) : (r(), s("div", {
                     key: 1,
                     ref_for: !0,
-                    ref: (a) => t(j)(a, n),
-                    class: z(["of-table-row", {
-                      "of-table-row--selected": t(p).has(i(e)),
-                      "of-table-row--hover": t(Y)(i(e))
+                    ref: (a) => q(a, n),
+                    class: A(["of-table-row", {
+                      "of-table-row--selected": t(C).has(d(e)),
+                      "of-table-row--hover": t(Y)(d(e))
                     }]),
                     role: "row",
-                    onMouseenter: (a) => t(S)(i(e)),
-                    onMouseleave: o[5] || (o[5] = (a) => t(S)(null)),
-                    onClick: (a) => I(e)
+                    tabindex: "0",
+                    onMouseenter: (a) => t(g)(d(e)),
+                    onMouseleave: o[6] || (o[6] = (a) => t(g)(null)),
+                    onFocusin: (a) => t(g)(d(e)),
+                    onFocusout: o[7] || (o[7] = (a) => t(g)(null)),
+                    onClick: (a) => T(e),
+                    onKeydown: (a) => U(a, e)
                   }, [
-                    M.value ? (r(), s("div", {
+                    F.value ? (r(), s("div", {
                       key: 0,
                       class: "of-td of-td-checkbox",
                       role: "gridcell",
-                      onClick: o[4] || (o[4] = P(() => {
+                      onClick: o[5] || (o[5] = Z(() => {
                       }, ["stop"]))
                     }, [
-                      g("input", {
-                        type: "checkbox",
-                        class: "of-checkbox",
-                        checked: t(p).has(i(e)),
-                        onChange: (a) => U(i(e))
-                      }, null, 40, lo)
-                    ])) : $("", !0),
-                    (r(!0), s(c, null, m(t(te), (a) => (r(), s("div", {
+                      c("label", {
+                        class: "of-checkbox-label",
+                        for: `fixed-row-select-${d(e)}`
+                      }, [
+                        c("input", {
+                          id: `fixed-row-select-${d(e)}`,
+                          type: "checkbox",
+                          class: "of-checkbox",
+                          checked: t(C).has(d(e)),
+                          onChange: (a) => X(d(e))
+                        }, null, 40, so),
+                        o[20] || (o[20] = c("span", { class: "of-sr-only" }, "选择当前行", -1))
+                      ], 8, ro)
+                    ])) : M("", !0),
+                    (r(!0), s(v, null, m(t(ae), (a) => (r(), s("div", {
                       key: a.key,
                       class: "of-td",
                       role: "gridcell",
-                      style: k({
+                      style: w({
                         width: (a.width === "fill" ? 200 : a.width) + "px",
                         flexShrink: "0"
                       })
                     }, [
-                      T(l.$slots, "cell", {
+                      z(l.$slots, "cell", {
                         row: e,
                         col: a
                       }, () => {
-                        var v;
+                        var y;
                         return [
-                          (v = u.fieldDefs) != null && v.length ? (r(), y(_, {
+                          (y = u.fieldDefs) != null && y.length ? (r(), b(P, {
                             key: 0,
-                            "row-id": i(e),
-                            field: H(a.key),
-                            value: e[a.key],
-                            onCommit: B
-                          }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", oo, A(e[a.key] ?? "-"), 1))
+                            "row-id": d(e),
+                            field: B(a.key),
+                            value: h(e, a.key),
+                            onCommit: I
+                          }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", io, H(h(e, a.key) ?? "-"), 1))
                         ];
                       }, !0)
                     ], 4))), 128))
-                  ], 42, eo))
+                  ], 42, ao))
                 ], 64))), 128))
               ], 4)
-            ], 4)) : (r(!0), s(c, { key: 1 }, m(t(D), (e) => (r(), s(c, {
+            ], 4)) : (r(!0), s(v, { key: 1 }, m(t(S), (e) => (r(), s(v, {
               key: e.id
             }, [
-              t(x)(e) ? (r(), y(Q, K({
+              t(R)(e) ? (r(), b(_, E({
                 key: 0,
                 ref_for: !0
-              }, q(e), {
-                onToggle: (n) => t(N)(J(e))
+              }, J(e), {
+                onToggle: (n) => t(N)(Q(e))
               }), null, 16, ["onToggle"])) : (r(), s("div", {
                 key: 1,
-                class: z(["of-table-row", {
-                  "of-table-row--selected": t(p).has(i(e)),
-                  "of-table-row--hover": t(Y)(i(e))
+                class: A(["of-table-row", {
+                  "of-table-row--selected": t(C).has(d(e)),
+                  "of-table-row--hover": t(Y)(d(e))
                 }]),
                 role: "row",
-                onMouseenter: (n) => t(S)(i(e)),
-                onMouseleave: o[7] || (o[7] = (n) => t(S)(null)),
-                onClick: (n) => I(e)
+                tabindex: "0",
+                onMouseenter: (n) => t(g)(d(e)),
+                onMouseleave: o[9] || (o[9] = (n) => t(g)(null)),
+                onFocusin: (n) => t(g)(d(e)),
+                onFocusout: o[10] || (o[10] = (n) => t(g)(null)),
+                onClick: (n) => T(e),
+                onKeydown: (n) => U(n, e)
               }, [
-                M.value ? (r(), s("div", {
+                F.value ? (r(), s("div", {
                   key: 0,
                   class: "of-td of-td-checkbox",
                   role: "gridcell",
-                  onClick: o[6] || (o[6] = P(() => {
+                  onClick: o[8] || (o[8] = Z(() => {
                   }, ["stop"]))
                 }, [
-                  g("input", {
-                    type: "checkbox",
-                    class: "of-checkbox",
-                    checked: t(p).has(i(e)),
-                    onChange: (n) => U(i(e))
-                  }, null, 40, no)
-                ])) : $("", !0),
-                (r(!0), s(c, null, m(t(te), (n) => (r(), s("div", {
+                  c("label", {
+                    class: "of-checkbox-label",
+                    for: `row-select-${d(e)}`
+                  }, [
+                    c("input", {
+                      id: `row-select-${d(e)}`,
+                      type: "checkbox",
+                      class: "of-checkbox",
+                      checked: t(C).has(d(e)),
+                      onChange: (n) => X(d(e))
+                    }, null, 40, co),
+                    o[21] || (o[21] = c("span", { class: "of-sr-only" }, "选择当前行", -1))
+                  ], 8, fo)
+                ])) : M("", !0),
+                (r(!0), s(v, null, m(t(ae), (n) => (r(), s("div", {
                   key: n.key,
                   class: "of-td",
                   role: "gridcell",
-                  style: k({
+                  style: w({
                     width: (n.width === "fill" ? 200 : n.width) + "px",
                     flexShrink: "0"
                   })
                 }, [
-                  T(l.$slots, "cell", {
+                  z(l.$slots, "cell", {
                     row: e,
                     col: n
                   }, () => {
                     var a;
                     return [
-                      (a = u.fieldDefs) != null && a.length ? (r(), y(_, {
+                      (a = u.fieldDefs) != null && a.length ? (r(), b(P, {
                         key: 0,
-                        "row-id": i(e),
-                        field: H(n.key),
-                        value: e[n.key],
-                        onCommit: B
-                      }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", ao, A(e[n.key] ?? "-"), 1))
+                        "row-id": d(e),
+                        field: B(n.key),
+                        value: h(e, n.key),
+                        onCommit: I
+                      }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", vo, H(h(e, n.key) ?? "-"), 1))
                     ];
                   }, !0)
                 ], 4))), 128))
-              ], 42, to))
+              ], 42, uo))
             ], 64))), 128))
           ])
         ], 38),
-        g("div", {
+        c("div", {
           ref_key: "scrollContainerRef",
           ref: W,
           class: "of-data-table-scroll-region",
-          style: k({ marginLeft: t(xe) + "px" }),
-          onScroll: Tl
+          style: w({ marginLeft: t($e) + "px" }),
+          onScroll: Bl
         }, [
-          E(me, {
-            columns: t(ne),
+          L(me, {
+            columns: t(re),
             selectable: !1,
-            "sort-key": t(F).field ?? "",
-            "sort-order": t(F).order ?? "asc",
+            "sort-key": t(K).field ?? "",
+            "sort-order": t(K).order ?? "asc",
             "enable-resize": u.enableResize,
             "enable-field-menu": u.enableFieldManagement,
             "enable-add-field": u.enableFieldManagement,
             onSort: t(O),
-            onResizeStart: ve,
-            onResizeDblclick: ye,
-            onHeaderContextmenu: ue,
-            onHeaderDblclick: fe,
-            onAddField: ce
+            onResizeStart: ge,
+            onResizeDblclick: be,
+            onHeaderContextmenu: ce,
+            onHeaderDblclick: ve,
+            onAddField: ye
           }, null, 8, ["columns", "sort-key", "sort-order", "enable-resize", "enable-field-menu", "enable-add-field", "onSort"]),
-          g("div", ro, [
-            ae.value ? (r(), s("div", {
+          c("div", yo, [
+            se.value ? (r(), s("div", {
               key: 0,
-              style: k({ height: t(se) + "px", position: "relative" })
+              style: w({ height: t(ie) + "px", position: "relative" })
             }, [
-              g("div", {
-                style: k({ transform: `translateY(${t(de)}px)` })
+              c("div", {
+                style: w({ transform: `translateY(${t(ue)}px)` })
               }, [
-                (r(!0), s(c, null, m(t(re), ({ data: e }) => (r(), s(c, {
+                (r(!0), s(v, null, m(t(de), ({ data: e }) => (r(), s(v, {
                   key: e.id
                 }, [
-                  t(x)(e) ? (r(), s("div", so)) : (r(), s("div", {
+                  t(R)(e) ? (r(), s("div", go)) : (r(), s("div", {
                     key: 1,
-                    class: z(["of-table-row", {
-                      "of-table-row--selected": t(p).has(i(e)),
-                      "of-table-row--hover": t(Y)(i(e))
+                    class: A(["of-table-row", {
+                      "of-table-row--selected": t(C).has(d(e)),
+                      "of-table-row--hover": t(Y)(d(e))
                     }]),
                     role: "row",
-                    onMouseenter: (n) => t(S)(i(e)),
-                    onMouseleave: o[9] || (o[9] = (n) => t(S)(null)),
-                    onClick: (n) => I(e)
+                    tabindex: "0",
+                    onMouseenter: (n) => t(g)(d(e)),
+                    onMouseleave: o[12] || (o[12] = (n) => t(g)(null)),
+                    onFocusin: (n) => t(g)(d(e)),
+                    onFocusout: o[13] || (o[13] = (n) => t(g)(null)),
+                    onClick: (n) => T(e),
+                    onKeydown: (n) => U(n, e)
                   }, [
-                    (r(!0), s(c, null, m(t(ne), (n) => (r(), s("div", {
+                    (r(!0), s(v, null, m(t(re), (n) => (r(), s("div", {
                       key: n.key,
                       class: "of-td",
                       role: "gridcell",
-                      style: k({
+                      style: w({
                         width: n.width === "fill" ? void 0 : n.width + "px",
                         flex: n.width === "fill" ? "1 1 " + (n.minWidth ?? 220) + "px" : "0 0 auto"
                       })
                     }, [
-                      T(l.$slots, "cell", {
+                      z(l.$slots, "cell", {
                         row: e,
                         col: n
                       }, () => {
                         var a;
                         return [
-                          (a = u.fieldDefs) != null && a.length ? (r(), y(_, {
+                          (a = u.fieldDefs) != null && a.length ? (r(), b(P, {
                             key: 0,
-                            "row-id": i(e),
-                            field: H(n.key),
-                            value: e[n.key],
-                            onCommit: B
-                          }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", uo, A(e[n.key] ?? "-"), 1))
+                            "row-id": d(e),
+                            field: B(n.key),
+                            value: h(e, n.key),
+                            onCommit: I
+                          }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", ko, H(h(e, n.key) ?? "-"), 1))
                         ];
                       }, !0)
                     ], 4))), 128))
-                  ], 42, io))
+                  ], 42, bo))
                 ], 64))), 128))
               ], 4)
-            ], 4)) : (r(!0), s(c, { key: 1 }, m(t(D), (e) => (r(), s(c, {
+            ], 4)) : (r(!0), s(v, { key: 1 }, m(t(S), (e) => (r(), s(v, {
               key: e.id
             }, [
-              t(x)(e) ? (r(), s("div", fo)) : (r(), s("div", {
+              t(R)(e) ? (r(), s("div", wo)) : (r(), s("div", {
                 key: 1,
-                class: z(["of-table-row", {
-                  "of-table-row--selected": t(p).has(i(e)),
-                  "of-table-row--hover": t(Y)(i(e))
+                class: A(["of-table-row", {
+                  "of-table-row--selected": t(C).has(d(e)),
+                  "of-table-row--hover": t(Y)(d(e))
                 }]),
                 role: "row",
-                onMouseenter: (n) => t(S)(i(e)),
-                onMouseleave: o[10] || (o[10] = (n) => t(S)(null)),
-                onClick: (n) => I(e)
+                tabindex: "0",
+                onMouseenter: (n) => t(g)(d(e)),
+                onMouseleave: o[14] || (o[14] = (n) => t(g)(null)),
+                onFocusin: (n) => t(g)(d(e)),
+                onFocusout: o[15] || (o[15] = (n) => t(g)(null)),
+                onClick: (n) => T(e),
+                onKeydown: (n) => U(n, e)
               }, [
-                (r(!0), s(c, null, m(t(ne), (n) => (r(), s("div", {
+                (r(!0), s(v, null, m(t(re), (n) => (r(), s("div", {
                   key: n.key,
                   class: "of-td",
                   role: "gridcell",
-                  style: k({
+                  style: w({
                     width: n.width === "fill" ? void 0 : n.width + "px",
                     flex: n.width === "fill" ? "1 1 " + (n.minWidth ?? 220) + "px" : "0 0 auto"
                   })
                 }, [
-                  T(l.$slots, "cell", {
+                  z(l.$slots, "cell", {
                     row: e,
                     col: n
                   }, () => {
                     var a;
                     return [
-                      (a = u.fieldDefs) != null && a.length ? (r(), y(_, {
+                      (a = u.fieldDefs) != null && a.length ? (r(), b(P, {
                         key: 0,
-                        "row-id": i(e),
-                        field: H(n.key),
-                        value: e[n.key],
-                        onCommit: B
-                      }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", vo, A(e[n.key] ?? "-"), 1))
+                        "row-id": d(e),
+                        field: B(n.key),
+                        value: h(e, n.key),
+                        onCommit: I
+                      }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", ho, H(h(e, n.key) ?? "-"), 1))
                     ];
                   }, !0)
                 ], 4))), 128))
-              ], 42, co))
+              ], 42, po))
             ], 64))), 128))
           ])
         ], 36)
-      ])) : (r(), s(c, { key: 1 }, [
-        E(me, {
-          columns: C.value,
-          selectable: M.value,
-          "sort-key": t(F).field ?? "",
-          "sort-order": t(F).order ?? "asc",
-          "all-selected": t(le),
-          indeterminate: Ke.value,
+      ])) : (r(), s(v, { key: 1 }, [
+        L(me, {
+          columns: x.value,
+          selectable: F.value,
+          "sort-key": t(K).field ?? "",
+          "sort-order": t(K).order ?? "asc",
+          "all-selected": t(ne),
+          indeterminate: Ge.value,
           "enable-resize": u.enableResize,
           "enable-field-menu": u.enableFieldManagement,
           "enable-add-field": u.enableFieldManagement,
           onSort: t(O),
-          onSelectAll: _e,
-          onResizeStart: ve,
-          onResizeDblclick: ye,
-          onHeaderContextmenu: ue,
-          onHeaderDblclick: fe,
-          onAddField: ce
+          onSelectAll: Ve,
+          onResizeStart: ge,
+          onResizeDblclick: be,
+          onHeaderContextmenu: ce,
+          onHeaderDblclick: ve,
+          onAddField: ye
         }, null, 8, ["columns", "selectable", "sort-key", "sort-order", "all-selected", "indeterminate", "enable-resize", "enable-field-menu", "enable-add-field", "onSort"]),
-        g("div", {
+        c("div", {
           ref_key: "scrollContainerRef",
           ref: W,
           class: "of-data-table-scroll-container"
         }, [
-          ae.value ? (r(), s("div", {
+          se.value ? (r(), s("div", {
             key: 0,
-            style: k({ height: t(se) + "px", position: "relative" })
+            style: w({ height: t(ie) + "px", position: "relative" })
           }, [
-            g("div", {
-              style: k({ transform: `translateY(${t(de)}px)` })
+            c("div", {
+              style: w({ transform: `translateY(${t(ue)}px)` })
             }, [
-              (r(!0), s(c, null, m(t(re), ({ data: e, index: n }) => (r(), s(c, {
+              (r(!0), s(v, null, m(t(de), ({ data: e, index: n }) => (r(), s(v, {
                 key: e.id
               }, [
-                t(x)(e) ? (r(), y(Q, K({
+                t(R)(e) ? (r(), b(_, E({
                   key: 0,
                   ref_for: !0,
-                  ref: (a) => t(j)((a == null ? void 0 : a.$el) ?? a, n)
-                }, { ref_for: !0 }, q(e), {
-                  onToggle: (a) => t(N)(J(e))
-                }), null, 16, ["onToggle"])) : (r(), y(Ve, K({
+                  ref: (a) => q(a, n)
+                }, { ref_for: !0 }, J(e), {
+                  onToggle: (a) => t(N)(Q(e))
+                }), null, 16, ["onToggle"])) : (r(), b(je, E({
                   key: 1,
                   ref_for: !0,
-                  ref: (a) => t(j)((a == null ? void 0 : a.$el) ?? a, n)
-                }, { ref_for: !0 }, Ee(e), {
+                  ref: (a) => q(a, n)
+                }, { ref_for: !0 }, Oe(e), {
                   draggable: u.enableRowDrag,
-                  class: Ge(e),
-                  onSelect: U,
-                  onClick: (a) => I(e),
-                  onDragstart: (a) => Ae(a, e),
-                  onDragover: (a) => Fe(a, e),
-                  onDrop: (a) => He(a, e),
-                  onDragend: t(ze)
+                  class: Ye(e),
+                  onSelect: X,
+                  onClick: (a) => T(e),
+                  onDragstart: (a) => Ke(a, e),
+                  onDragover: (a) => Be(a, e),
+                  onDrop: (a) => Ie(a, e),
+                  onDragend: t(He)
                 }), {
-                  cell: he(({ row: a, col: v }) => [
-                    T(l.$slots, "cell", {
+                  cell: he(({ row: a, col: y }) => [
+                    z(l.$slots, "cell", {
                       row: a,
-                      col: v
+                      col: y
                     }, () => {
-                      var ge;
+                      var ke;
                       return [
-                        (ge = u.fieldDefs) != null && ge.length ? (r(), y(_, {
+                        (ke = u.fieldDefs) != null && ke.length ? (r(), b(P, {
                           key: 0,
-                          "row-id": i(a),
-                          field: H(v.key),
-                          value: a[v.key],
-                          class: z({
-                            "of-cell--active": Pe(i(a), v.key),
-                            "of-cell--selected": Le(i(a), v.key)
+                          "row-id": d(a),
+                          field: B(y.key),
+                          value: a[y.key],
+                          class: A({
+                            "of-cell--active": Ne(d(a), y.key),
+                            "of-cell--selected": We(d(a), y.key)
                           }),
-                          onCommit: B,
-                          onClick: P(($o) => u.enableKeyboard && t(Me)(i(a), v.key), ["stop"])
-                        }, null, 8, ["row-id", "field", "value", "class", "onClick"])) : (r(), s("span", yo, A(a[v.key] ?? "-"), 1))
+                          onCommit: I,
+                          onClick: Z((Fo) => u.enableKeyboard && t(ze)(d(a), y.key), ["stop"])
+                        }, null, 8, ["row-id", "field", "value", "class", "onClick"])) : (r(), s("span", mo, H(h(a, y.key) ?? "-"), 1))
                       ];
                     }, !0)
                   ]),
@@ -747,46 +794,46 @@ const Jl = ["tabindex"], Ql = {
                 }, 16, ["draggable", "class", "onClick", "onDragstart", "onDragover", "onDrop", "onDragend"]))
               ], 64))), 128))
             ], 4)
-          ], 4)) : (r(!0), s(c, { key: 1 }, m(t(D), (e) => (r(), s(c, {
+          ], 4)) : (r(!0), s(v, { key: 1 }, m(t(S), (e) => (r(), s(v, {
             key: e.id
           }, [
-            t(x)(e) ? (r(), y(Q, K({
+            t(R)(e) ? (r(), b(_, E({
               key: 0,
               ref_for: !0
-            }, q(e), {
-              onToggle: (n) => t(N)(J(e))
-            }), null, 16, ["onToggle"])) : (r(), y(Ve, K({
+            }, J(e), {
+              onToggle: (n) => t(N)(Q(e))
+            }), null, 16, ["onToggle"])) : (r(), b(je, E({
               key: 1,
               ref_for: !0
-            }, Ee(e), {
+            }, Oe(e), {
               draggable: u.enableRowDrag,
-              class: Ge(e),
-              onSelect: U,
-              onClick: (n) => I(e),
-              onDragstart: (n) => Ae(n, e),
-              onDragover: (n) => Fe(n, e),
-              onDrop: (n) => He(n, e),
-              onDragend: t(ze)
+              class: Ye(e),
+              onSelect: X,
+              onClick: (n) => T(e),
+              onDragstart: (n) => Ke(n, e),
+              onDragover: (n) => Be(n, e),
+              onDrop: (n) => Ie(n, e),
+              onDragend: t(He)
             }), {
               cell: he(({ row: n, col: a }) => [
-                T(l.$slots, "cell", {
+                z(l.$slots, "cell", {
                   row: n,
                   col: a
                 }, () => {
-                  var v;
+                  var y;
                   return [
-                    (v = u.fieldDefs) != null && v.length ? (r(), y(_, {
+                    (y = u.fieldDefs) != null && y.length ? (r(), b(P, {
                       key: 0,
-                      "row-id": i(n),
-                      field: H(a.key),
+                      "row-id": d(n),
+                      field: B(a.key),
                       value: n[a.key],
-                      class: z({
-                        "of-cell--active": Pe(i(n), a.key),
-                        "of-cell--selected": Le(i(n), a.key)
+                      class: A({
+                        "of-cell--active": Ne(d(n), a.key),
+                        "of-cell--selected": We(d(n), a.key)
                       }),
-                      onCommit: B,
-                      onClick: P((ge) => u.enableKeyboard && t(Me)(i(n), a.key), ["stop"])
-                    }, null, 8, ["row-id", "field", "value", "class", "onClick"])) : (r(), s("span", go, A(n[a.key] ?? "-"), 1))
+                      onCommit: I,
+                      onClick: Z((ke) => u.enableKeyboard && t(ze)(d(n), a.key), ["stop"])
+                    }, null, 8, ["row-id", "field", "value", "class", "onClick"])) : (r(), s("span", Co, H(h(n, a.key) ?? "-"), 1))
                   ];
                 }, !0)
               ]),
@@ -795,56 +842,59 @@ const Jl = ["tabindex"], Ql = {
           ], 64))), 128))
         ], 512)
       ], 64)),
-      t(Je) ? (r(), s("div", {
+      t(ll) ? (r(), s("div", {
         key: 2,
         class: "of-resize-indicator",
-        style: k({ left: t(Qe) + "px" })
-      }, null, 4)) : $("", !0),
-      hl.value ? (r(), s("div", bo, [
-        g("span", ko, A(t(Be).size) + " 条草稿", 1),
-        g("button", {
+        style: w({ left: t(ol) + "px" })
+      }, null, 4)) : M("", !0),
+      Dl.value ? (r(), s("div", Do, [
+        c("span", xo, H(t(Ee).size) + " 条草稿", 1),
+        c("button", {
           class: "of-data-table-draft-btn of-data-table-draft-btn--commit",
-          onClick: pl
+          onClick: Sl
         }, " 全部提交 "),
-        g("button", {
+        c("button", {
           class: "of-data-table-draft-btn of-data-table-draft-btn--discard",
-          onClick: wl
+          onClick: Rl
         }, " 全部放弃 ")
-      ])) : $("", !0),
-      Ie.value ? (r(), y(_l, {
+      ])) : M("", !0),
+      Le.value ? (r(), b(Nl, {
         key: 4,
-        onClick: ml
-      })) : $("", !0),
-      u.enableFieldManagement ? (r(), y(t(Ne), {
+        onClick: xl
+      })) : M("", !0),
+      u.enableFieldManagement ? (r(), b(t(Ue), {
         key: 5,
-        visible: w.value.visible,
-        "col-key": w.value.colKey,
-        "col-label": w.value.colLabel,
-        "field-type": w.value.fieldType,
-        x: w.value.x,
-        y: w.value.y,
-        onClose: o[11] || (o[11] = (e) => w.value.visible = !1),
-        onRename: Cl,
-        onChangeType: Dl,
-        onSort: o[12] || (o[12] = (e, n) => t(O)(e)),
-        onHide: xl,
-        onDelete: Sl,
-        onDuplicate: Rl
-      }, null, 8, ["visible", "col-key", "col-label", "field-type", "x", "y"])) : $("", !0),
-      (r(), y(Kl, { to: "body" }, [
-        X.value ? (r(), s("div", {
-          key: 0,
-          class: "of-add-field-overlay",
-          onClick: o[13] || (o[13] = P((e) => X.value = !1, ["self"]))
-        }, [
-          g("div", ho, [
-            E(t(We), { onSelect: $l })
+        visible: D.value.visible,
+        "col-key": D.value.colKey,
+        "col-label": D.value.colLabel,
+        "field-type": D.value.fieldType,
+        x: D.value.x,
+        y: D.value.y,
+        onClose: o[16] || (o[16] = (e) => D.value.visible = !1),
+        onRename: $l,
+        onChangeType: Ml,
+        onSort: o[17] || (o[17] = (e, n) => t(O)(e)),
+        onHide: Fl,
+        onDelete: Tl,
+        onDuplicate: zl
+      }, null, 8, ["visible", "col-key", "col-label", "field-type", "x", "y"])) : M("", !0),
+      (r(), b(Ol, { to: "body" }, [
+        j.value ? (r(), s("div", So, [
+          c("button", {
+            type: "button",
+            class: "of-add-field-overlay__backdrop",
+            tabindex: "-1",
+            "aria-hidden": "true",
+            onClick: o[18] || (o[18] = (e) => j.value = !1)
+          }),
+          c("div", Ro, [
+            L(t(qe), { onSelect: Al })
           ])
-        ])) : $("", !0)
+        ])) : M("", !0)
       ]))
-    ], 40, Jl));
+    ], 544));
   }
 });
 export {
-  jo as default
+  qo as default
 };