@oneflowui/ui 0.8.3 → 0.8.5

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

@@ -1,50 +1,50 @@
-import { defineComponent as so, defineAsyncComponent as Qe, computed as k, ref as W, toRef as w, watch as Ue, unref as n, openBlock as r, createBlock as v, createSlots as io, withCtx as $, renderSlot as H, normalizeProps as uo, guardReactiveProps as co, createElementBlock as s, normalizeStyle as g, normalizeClass as F, createVNode as N, createElementVNode as h, Fragment as y, renderList as m, mergeProps as G, withModifiers as z, toDisplayString as B, createCommentVNode as M, Teleport as fo } from "vue";
-import Ce from "./TableHeaderRow.vue.js";
-import Ze from "./TableDataRow.vue.js";
-import de from "./TableGroupRow.vue.js";
-import yo from "./NewRowBtn.vue.js";
-import vo from "./DataTableDraftToolbar.vue.js";
-import bo from "./DataTableMobilePanel.vue.js";
-import go from "./DataTableDesktopFrame.vue.js";
-import V from "./FieldCell.vue.js";
-import { normalizeFieldType as _e, resolveRowId as ko, resolveFieldDef as wo, buildDataRowStyle as ho, buildBodyCellStyle as mo, buildGroupSpacerStyle as po, resolveFirstEditableFieldKey as Co } from "./dataTableUtils.js";
-import { useInlineEdit as Do } from "../../composables/useInlineEdit.js";
-import { useVirtualList as So } from "../../composables/useVirtualList.js";
-import { useTable as Ro } from "../../composables/useTable.js";
-import { useTableGroup as xo } from "../../composables/useTableGroup.js";
-import { useTableData as $o } from "../../composables/useTableData.js";
-import { useTableColumns as Fo } from "../../composables/useTableColumns.js";
-import { useColumnResize as Mo } from "../../composables/useColumnResize.js";
-import { useKeyboardNavigation as Ao } from "../../composables/useKeyboardNavigation.js";
-import { useBreakpoint as To } from "../../composables/useBreakpoint.js";
-import { useFixedColumns as Ko } from "../../composables/useFixedColumns.js";
-import { useRowDrag as zo } from "../../composables/useRowDrag.js";
-import { useDraftRows as Bo } from "../../composables/useDraftRows.js";
-import { useDataTableLayout as Ho } from "../../composables/useDataTableLayout.js";
-import { useDataTableSelection as Io } from "../../composables/useDataTableSelection.js";
-import { useDataTableDetailSheet as Eo } from "../../composables/useDataTableDetailSheet.js";
-const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"], Wo = ["id", "checked", "onChange"], Go = {
+import { defineComponent as fo, defineAsyncComponent as ll, computed as k, ref as N, toRef as w, watch as ol, unref as n, openBlock as r, createBlock as v, createSlots as yo, withCtx as $, renderSlot as E, normalizeProps as vo, guardReactiveProps as bo, createElementBlock as i, normalizeStyle as g, normalizeClass as F, createVNode as j, createElementVNode as h, Fragment as y, renderList as p, mergeProps as O, withModifiers as z, toDisplayString as B, createCommentVNode as M, Teleport as go } from "vue";
+import xe from "./TableHeaderRow.vue.js";
+import nl from "./TableDataRow.vue.js";
+import ve from "./TableGroupRow.vue.js";
+import ko from "./NewRowBtn.vue.js";
+import wo from "./DataTableDraftToolbar.vue.js";
+import ho from "./DataTableMobilePanel.vue.js";
+import po from "./DataTableDesktopFrame.vue.js";
+import Y from "./FieldCell.vue.js";
+import { normalizeFieldType as tl, resolveRowId as mo, resolveFieldDef as Co, buildDataRowStyle as Do, buildBodyCellStyle as Ro, buildGroupSpacerStyle as So, resolveFirstEditableFieldKey as xo } from "./dataTableUtils.js";
+import { useInlineEdit as $o } from "../../composables/useInlineEdit.js";
+import { createVirtualListState as Fo, useVirtualList as Mo } from "../../composables/useVirtualList.js";
+import { useTable as Ao } from "../../composables/useTable.js";
+import { useTableGroup as To } from "../../composables/useTableGroup.js";
+import { useTableData as Ko } from "../../composables/useTableData.js";
+import { useTableColumns as zo } from "../../composables/useTableColumns.js";
+import { useColumnResize as Bo } from "../../composables/useColumnResize.js";
+import { useKeyboardNavigation as Eo } from "../../composables/useKeyboardNavigation.js";
+import { useBreakpoint as Ho } from "../../composables/useBreakpoint.js";
+import { useFixedColumns as Io } from "../../composables/useFixedColumns.js";
+import { useRowDrag as Po } from "../../composables/useRowDrag.js";
+import { useDraftRows as qo } from "../../composables/useDraftRows.js";
+import { useDataTableLayout as Lo } from "../../composables/useDataTableLayout.js";
+import { useDataTableSelection as Wo } from "../../composables/useDataTableSelection.js";
+import { useDataTableDetailSheet as Go } from "../../composables/useDataTableDetailSheet.js";
+const Vo = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], No = ["for"], Oo = ["id", "checked", "onChange"], Yo = {
   key: 1,
   class: "of-td-text"
-}, Vo = ["disabled", "onClick"], No = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Oo = ["for"], Yo = ["id", "checked", "onChange"], jo = {
+}, jo = ["disabled", "onClick"], Xo = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Jo = ["for"], Qo = ["id", "checked", "onChange"], Uo = {
   key: 1,
   class: "of-td-text"
-}, Xo = ["disabled", "onClick"], qo = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Jo = {
+}, Zo = ["disabled", "onClick"], _o = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], en = {
   key: 1,
   class: "of-td-text"
-}, Qo = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Uo = {
+}, ln = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], on = {
   key: 1,
   class: "of-td-text"
-}, Zo = {
+}, nn = {
   key: 1,
   class: "of-td-text"
-}, _o = {
+}, tn = {
   key: 1,
   class: "of-td-text"
-}, en = {
+}, an = {
   key: 0,
   class: "of-add-field-overlay"
-}, ln = { class: "of-add-field-popup" }, Mn = /* @__PURE__ */ so({
+}, rn = { class: "of-add-field-popup" }, Bn = /* @__PURE__ */ fo({
   __name: "DataTable",
   props: {
     tasks: { default: () => [] },
@@ -78,150 +78,152 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
     containerResponsive: { type: Boolean, default: !0 }
   },
   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", "bulk-action"],
-  setup(u, { emit: el }) {
-    const i = u, c = el, ll = Qe(() => import("./ColumnHeaderMenu.vue.js")), ol = Qe(() => import("./FieldTypePicker.vue.js")), nl = k(() => i.density ?? "standard"), { isMobile: ue } = To(), O = W(null), Y = W(null), De = W(null), {
+  setup(u, { emit: al }) {
+    const d = u, c = al, rl = ll(() => import("./ColumnHeaderMenu.vue.js")), il = ll(() => import("./FieldTypePicker.vue.js")), sl = k(() => d.density ?? "standard"), { isMobile: be } = Ho(), X = N(null), J = N(null), $e = N(null), Fe = Fo(), {
       containerDensity: A,
-      densityMetrics: I,
-      densityClass: Se,
-      containerWidthClass: tl,
-      densityStyle: Re
-    } = Ho({
-      tableContainerRef: Y,
-      density: nl,
-      containerResponsive: k(() => i.containerResponsive ?? !0),
-      isMobile: ue
+      densityMetrics: H,
+      densityClass: Me,
+      containerWidthClass: dl,
+      densityStyle: Ae
+    } = Lo({
+      tableContainerRef: J,
+      density: sl,
+      containerResponsive: k(() => d.containerResponsive ?? !0),
+      isMobile: be,
+      onContainerWidthChange: Fe.invalidate
     }), {
-      detailSheetVisible: al,
-      detailSheetTableRow: rl,
-      handleRowClick: sl,
-      handleMobileRowClick: il,
-      buildDetailSavePayloads: dl,
-      closeDetailSheet: ul
-    } = Eo(), cl = k(
-      () => (i.fieldDefs ?? []).filter((e) => !e.readonly).map((e) => e.id)
+      detailSheetVisible: ul,
+      detailSheetTableRow: cl,
+      handleRowClick: fl,
+      handleMobileRowClick: yl,
+      buildDetailSavePayloads: vl,
+      closeDetailSheet: bl
+    } = Go(), gl = k(
+      () => (d.fieldDefs ?? []).filter((e) => !e.readonly).map((e) => e.id)
     );
-    function xe(e) {
-      return Co({
+    function Te(e) {
+      return xo({
         row: e,
-        readonly: i.readonly,
+        readonly: d.readonly,
         columns: D.value,
-        editableFieldKeys: cl.value
+        editableFieldKeys: gl.value
       });
     }
-    function j(e) {
+    function Q(e) {
       const o = [
         {
           key: "detail",
           label: "详情",
-          onClick: () => p(e)
+          onClick: () => m(e)
         }
-      ], l = xe(e);
+      ], l = Te(e);
       return l && o.push({
         key: "edit",
         label: "编辑",
-        onClick: () => $e(e, l)
+        onClick: () => Ke(e, l)
       }), o;
     }
-    function $e(e, o) {
-      const l = d(e), t = o ?? xe(e);
+    function Ke(e, o) {
+      const l = s(e), t = o ?? Te(e);
       if (!t) {
-        p(e);
+        m(e);
         return;
       }
-      X.activate(l, t), i.enableKeyboard && ve(l, t);
+      I.activate(l, t), d.enableKeyboard && re(l, t);
     }
-    function Fe(e, o) {
+    function ze(e, o) {
       if (o === "detail") {
-        p(e);
+        m(e);
         return;
       }
-      o === "edit" && $e(e);
-    }
-    const X = Do(), { commit: fl, editingCell: yl } = X, { rows: ce } = $o({
-      tasks: w(i, "tasks"),
-      records: w(i, "records")
-    }), { columns: Me } = Fo({
-      columns: w(i, "columns"),
-      schema: w(i, "schema"),
-      view: w(i, "view")
+      o === "edit" && Ke(e);
+    }
+    const I = $o(), { commit: kl, editingCell: U } = I, { rows: ge } = Ko({
+      tasks: w(d, "tasks"),
+      records: w(d, "records")
+    }), { columns: Be } = zo({
+      columns: w(d, "columns"),
+      schema: w(d, "schema"),
+      view: w(d, "view")
     }), {
-      startResize: vl,
-      columnWidthOverrides: bl,
-      showResizeIndicator: gl,
-      resizeIndicatorX: kl,
-      autoFitColumn: wl,
-      resolvedWidth: Ae
-    } = Mo({
-      columns: Me,
-      rows: ce,
+      startResize: wl,
+      columnWidthOverrides: hl,
+      showResizeIndicator: pl,
+      resizeIndicatorX: ml,
+      autoFitColumn: Cl,
+      resolvedWidth: Ee
+    } = Bo({
+      columns: Be,
+      rows: ge,
       density: A,
       onResize: (e, o) => c("column-resize", { colKey: e, width: o })
     }), D = k(() => {
-      const e = bl.value;
-      return Me.value.map((o) => {
+      const e = hl.value;
+      return Be.value.map((o) => {
         const l = e.get(o.key);
         return l !== void 0 ? { ...o, width: l } : o.width === "fill" ? {
           ...o,
-          minWidth: o.minWidth ?? I.value.fillMinWidth
-        } : typeof o.width == "number" ? o : { ...o, width: Ae(o.key) };
+          minWidth: o.minWidth ?? H.value.fillMinWidth
+        } : typeof o.width == "number" ? o : { ...o, width: Ee(o.key) };
       });
     }), {
-      data: fe,
-      sort: E,
-      toggleSort: q,
-      selectedRows: S,
-      clearSelection: hl,
-      toggleSelectAll: ml,
-      toggleRowSelection: pl,
-      isAllSelected: Te,
-      setData: Cl
-    } = Ro({
-      data: ce.value,
+      data: ke,
+      sort: P,
+      toggleSort: Z,
+      selectedRows: R,
+      clearSelection: Dl,
+      toggleSelectAll: Rl,
+      toggleRowSelection: Sl,
+      isAllSelected: He,
+      setData: xl
+    } = Ao({
+      data: ge.value,
       pageSize: 999999
     });
-    Ue(ce, (e) => Cl(e), { deep: !1 });
-    const { groupedItems: T, collapsedGroups: Dl, toggleGroup: J, isGroupHeader: K } = xo({
-      data: fe,
-      groupBy: w(i, "groupBy"),
-      groups: w(i, "groups"),
-      aggregations: w(i, "aggregations")
-    }), Sl = k(() => {
+    ol(ge, (e) => xl(e), { deep: !1 });
+    const { groupedItems: T, collapsedGroups: $l, toggleGroup: _, isGroupHeader: K } = To({
+      data: ke,
+      groupBy: w(d, "groupBy"),
+      groups: w(d, "groups"),
+      aggregations: w(d, "aggregations")
+    }), Fl = k(() => {
       var e;
-      return (((e = i.fixedColumns) == null ? void 0 : e.length) ?? 0) > 0;
-    }), Ke = W(0), Rl = k(() => Ke.value > 0), {
-      fixedColumns: Q,
-      scrollableColumns: U,
-      fixedWidth: xl,
-      handleScroll: $l,
-      handleFixedScroll: Fl,
+      return (((e = d.fixedColumns) == null ? void 0 : e.length) ?? 0) > 0;
+    }), Ie = N(0), Ml = k(() => Ie.value > 0), {
+      fixedColumns: ee,
+      scrollableColumns: le,
+      fixedWidth: Al,
+      handleScroll: Tl,
+      handleFixedScroll: Kl,
       syncHover: b,
-      isRowHovered: Z
-    } = Ko({
+      isRowHovered: oe
+    } = Io({
       columns: D,
-      fixedColumnKeys: k(() => i.fixedColumns ?? []),
-      scrollContainerRef: O,
-      fixedContainerRef: De
-    }), _ = k(() => i.virtual !== void 0 ? i.virtual : T.value.length >= i.virtualThreshold), { visibleItems: ye, totalHeight: ee, offsetY: le, scrollToIndex: Ml, observeRow: Al } = So({
+      fixedColumnKeys: k(() => d.fixedColumns ?? []),
+      scrollContainerRef: X,
+      fixedContainerRef: $e
+    }), ne = k(() => d.virtual !== void 0 ? d.virtual : T.value.length >= d.virtualThreshold), { visibleItems: we, totalHeight: te, offsetY: ae, scrollToIndex: zl, observeRow: Bl } = Mo({
       items: T,
       itemHeight: (e) => {
         const o = T.value[e];
-        return K(o) ? I.value.groupRowHeight : I.value.rowHeight;
+        return K(o) ? H.value.groupRowHeight : H.value.rowHeight;
       },
       overscan: 5,
-      containerRef: O,
+      containerRef: X,
       invalidateKey: A,
+      state: Fe,
       measureRow: !0
-    }), ze = k(() => T.value.filter((e) => !K(e))), { activeCell: Be, selectedRange: Tl, setActiveCell: ve, handleKeyDown: Kl } = Ao({
+    }), Pe = k(() => T.value.filter((e) => !K(e))), { activeCell: qe, selectedRange: El, setActiveCell: re, handleKeyDown: Hl } = Eo({
       columns: D,
-      rows: ze,
-      containerRef: Y,
-      editingCell: yl,
-      enabled: k(() => i.enableKeyboard),
-      onActivateEdit: (e, o) => X.activate(e, o),
-      onCancelEdit: () => X.cancel(),
-      onScrollToRow: (e) => Ml(e),
+      rows: Pe,
+      containerRef: J,
+      editingCell: U,
+      enabled: k(() => d.enableKeyboard),
+      onActivateEdit: (e, o) => I.activate(e, o),
+      onCancelEdit: () => I.cancel(),
+      onScrollToRow: (e) => zl(e),
       getCellValue: (e, o) => {
-        const l = ze.value.find((a) => a.id === e);
+        const l = Pe.value.find((a) => a.id === e);
         if (!l) return "";
         const t = l[o];
         return t != null ? String(t) : "";
@@ -230,124 +232,130 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
         c("paste", { startRowId: e, startColKey: o, data: l });
       }
     });
-    Ue(Be, (e) => c("active-cell-change", e ?? null));
+    ol(qe, (e) => c("active-cell-change", e ?? null));
     const {
-      isDragging: zl,
-      draggedRowId: Bl,
-      dropTargetId: be,
-      dropPosition: He,
-      handleDragStart: Hl,
-      handleDragOver: Il,
-      handleDrop: El,
-      handleDragEnd: Ie
-    } = zo({
+      isDragging: Il,
+      draggedRowId: Pl,
+      dropTargetId: he,
+      dropPosition: Le,
+      handleDragStart: ql,
+      handleDragOver: Ll,
+      handleDrop: Wl,
+      handleDragEnd: We
+    } = Po({
       processedItems: T,
-      enableCrossGroupDrag: k(() => i.enableCrossGroupDrag),
-      groupFieldId: w(i, "groupBy")
+      enableCrossGroupDrag: k(() => d.enableCrossGroupDrag),
+      groupFieldId: w(d, "groupBy")
     });
-    function Ee(e, o) {
-      i.enableRowDrag && Hl(e, o);
+    function Ge(e, o) {
+      d.enableRowDrag && ql(e, o);
     }
-    function Pe(e, o) {
-      i.enableRowDrag && Il(e, o);
+    function Ve(e, o) {
+      d.enableRowDrag && Ll(e, o);
     }
-    function Le(e, o) {
-      i.enableRowDrag && El(e, o, {
+    function Ne(e, o) {
+      d.enableRowDrag && Wl(e, o, {
         onReorder: (l) => c("row-reorder", l),
         onGroupChange: (l) => c("row-group-change", l)
       });
     }
     const {
-      drafts: We,
-      addDraft: Pl,
-      commitAll: Ll,
-      discardAll: Wl
-    } = Bo({
-      schema: w(i, "schema"),
-      groupFieldId: w(i, "groupBy")
-    }), Gl = k(() => We.value.size > 0);
-    function Vl() {
-      i.schema ? Pl() : c("add-row");
-    }
-    function Nl() {
-      const e = Ll();
+      drafts: Oe,
+      addDraft: Gl,
+      commitAll: Vl,
+      discardAll: Nl
+    } = qo({
+      schema: w(d, "schema"),
+      groupFieldId: w(d, "groupBy")
+    }), Ol = k(() => Oe.value.size > 0);
+    function Yl() {
+      d.schema ? Gl() : c("add-row");
+    }
+    function jl() {
+      const e = Vl();
       e.length > 0 && c("drafts-commit-all", { records: e });
     }
-    function Ol() {
-      Wl();
+    function Xl() {
+      Nl();
     }
-    const R = W({ visible: !1, colKey: "", colLabel: "", x: 0, y: 0 }), oe = W(!1);
-    function ge(e, o) {
+    const S = N({ visible: !1, colKey: "", colLabel: "", x: 0, y: 0 }), ie = N(!1);
+    function pe(e, o) {
       var a;
-      const l = D.value.find((f) => f.key === o), t = (a = i.fieldDefs) == null ? void 0 : a.find((f) => f.id === o);
-      R.value = {
+      const l = D.value.find((f) => f.key === o), t = (a = d.fieldDefs) == null ? void 0 : a.find((f) => f.id === o);
+      S.value = {
         visible: !0,
         colKey: o,
         colLabel: (l == null ? void 0 : l.label) ?? o,
-        fieldType: _e(t == null ? void 0 : t.type),
+        fieldType: tl(t == null ? void 0 : t.type),
         x: e.clientX,
         y: e.clientY
       };
     }
-    function ke(e) {
+    function me(e) {
       var l, t;
       const o = D.value.find((a) => a.key === e);
-      R.value = {
+      S.value = {
         visible: !0,
         colKey: e,
         colLabel: (o == null ? void 0 : o.label) ?? e,
-        fieldType: _e((t = (l = i.fieldDefs) == null ? void 0 : l.find((a) => a.id === e)) == null ? void 0 : t.type),
+        fieldType: tl((t = (l = d.fieldDefs) == null ? void 0 : l.find((a) => a.id === e)) == null ? void 0 : t.type),
         x: 200,
         y: 100
       };
     }
-    function Yl(e, o) {
+    function Jl(e, o) {
       c("schema-rename-field", { fieldId: e, newName: o });
     }
-    function jl(e, o) {
+    function Ql(e, o) {
       c("schema-change-field-type", { fieldId: e, newType: o });
     }
-    function Xl(e) {
+    function Ul(e) {
       c("schema-hide-field", e);
     }
-    function ql(e) {
+    function Zl(e) {
       c("schema-delete-field", e);
     }
-    function Jl(e) {
+    function _l(e) {
       c("schema-duplicate-field", e);
     }
-    function we() {
-      oe.value = !0;
+    function Ce() {
+      ie.value = !0;
     }
-    function Ql(e) {
-      c("schema-add-field", e), oe.value = !1;
+    function eo(e) {
+      c("schema-add-field", e), ie.value = !1;
     }
-    const x = k(() => i.readonly ? !1 : i.selectable), Ge = k(() => i.readonly ? !1 : i.addable), { indeterminate: Ve, hasSelectionBar: Ul, resolvedBulkActionItems: Zl, handleSelectAll: Ne, handleSelect: ne, handleBulkAction: _l } = Io({
-      rows: fe,
-      selectedRows: S,
-      rowKey: w(i, "rowKey"),
+    const x = k(() => d.readonly ? !1 : d.selectable), Ye = k(() => d.readonly ? !1 : d.addable), { indeterminate: je, hasSelectionBar: lo, resolvedBulkActionItems: oo, handleSelectAll: Xe, handleSelect: se, handleBulkAction: no } = Wo({
+      rows: ke,
+      selectedRows: R,
+      rowKey: w(d, "rowKey"),
       selectable: x,
-      bulkActionItems: w(i, "bulkActionItems"),
-      showSelectionBar: w(i, "showSelectionBar"),
+      bulkActionItems: w(d, "bulkActionItems"),
+      showSelectionBar: w(d, "showSelectionBar"),
       emitSelectionChange: (e) => c("selection-change", e),
-      toggleSelectAll: ml,
-      toggleRowSelection: (e, o = 0) => pl(e, o),
-      clearSelection: hl,
+      toggleSelectAll: Rl,
+      toggleRowSelection: (e, o = 0) => Sl(e, o),
+      clearSelection: Dl,
       emitBulkAction: (e) => c("bulk-action", e)
     });
-    function d(e) {
-      return ko(e, i.rowKey);
+    function s(e) {
+      return mo(e, d.rowKey);
     }
-    function P(e) {
-      return wo(i.fieldDefs, e);
+    function q(e) {
+      return Co(d.fieldDefs, e);
     }
     function L(e, o, l) {
-      fl(e, o, l), c("cell-edit", { rowId: e, fieldId: o, value: l });
+      kl(e, o, l), c("cell-edit", { rowId: e, fieldId: o, value: l });
     }
-    function p(e) {
-      const o = sl({
+    function W(e, o) {
+      I.activate(e, o), d.enableKeyboard && re(e, o);
+    }
+    function G() {
+      I.cancel();
+    }
+    function m(e) {
+      const o = fl({
         row: e,
-        isMobile: ue.value
+        isMobile: be.value
       });
       if (o.type === "emit-record") {
         c("row-click-record", o.row), c("row-click", o.row);
@@ -355,221 +363,224 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
       }
       o.type === "emit-row" && c("row-click", o.row);
     }
-    function te(e, o) {
-      e.target === e.currentTarget && (e.key !== "Enter" && e.key !== " " || (e.preventDefault(), p(o)));
+    function de(e, o) {
+      e.target === e.currentTarget && (e.key !== "Enter" && e.key !== " " || (e.preventDefault(), m(o)));
     }
     function C(e, o) {
       return e[o];
     }
-    function eo(e) {
+    function to(e) {
       if (!e) return null;
       if (e instanceof HTMLElement) return e;
       const o = e.$el;
       return o instanceof HTMLElement ? o : null;
     }
-    function ae(e, o) {
-      Al(eo(e), o);
+    function ue(e, o) {
+      Bl(to(e), o);
     }
-    function he(e, o) {
-      vl(e, o);
+    function De(e, o) {
+      wl(e, o);
     }
-    function me(e) {
-      wl(e, Y.value);
+    function Re(e) {
+      Cl(e, J.value);
     }
-    function Oe() {
-      return ho(I.value.rowHeight);
+    function Je() {
+      return Do(H.value.rowHeight);
     }
-    function re(e) {
-      return mo({
+    function ce(e) {
+      return Ro({
         density: A.value,
         col: e,
-        resolvedWidth: Ae(e.key),
-        fillMinWidth: I.value.fillMinWidth
+        resolvedWidth: Ee(e.key),
+        fillMinWidth: H.value.fillMinWidth
       });
     }
-    function Ye() {
-      return po(I.value.groupRowHeight);
+    function Qe() {
+      return So(H.value.groupRowHeight);
     }
-    function lo(e) {
-      $l(e);
+    function ao(e) {
+      Tl(e);
       const o = e.target;
-      Ke.value = o.scrollLeft;
+      Ie.value = o.scrollLeft;
     }
-    function oo(e) {
-      De.value = e;
+    function ro(e) {
+      $e.value = e;
     }
-    function no(e) {
-      O.value = e;
+    function io(e) {
+      X.value = e;
     }
-    function to(e) {
-      O.value = e;
+    function so(e) {
+      X.value = e;
     }
-    function se(e) {
+    function fe(e) {
       return {
         groupKey: e.__groupKey,
         count: e.__groupCount,
-        collapsed: Dl.value.has(
+        collapsed: $l.value.has(
           e.__groupPath ? e.__groupPath.join("/") : e.__groupKey
         ),
-        colorMap: i.groupColorMap,
+        colorMap: d.groupColorMap,
         selectable: x.value,
         level: e.__groupLevel ?? 0,
         aggregations: e.__aggregations
       };
     }
-    function ie(e) {
+    function ye(e) {
       return e.__groupPath ? e.__groupPath.join("/") : e.__groupKey;
     }
-    function je(e) {
+    function Ue(e) {
       return {
         row: e,
-        rowKey: i.rowKey,
-        selected: S.value.has(d(e)),
+        rowKey: d.rowKey,
+        selected: R.value.has(s(e)),
         selectable: x.value,
         columns: D.value,
-        priorityColorMap: i.priorityColorMap,
-        statusColorMap: i.statusColorMap
+        priorityColorMap: d.priorityColorMap,
+        statusColorMap: d.statusColorMap
       };
     }
-    function Xe(e, o) {
-      const l = Be.value;
+    function Ze(e, o) {
+      const l = qe.value;
       return l !== null && l.rowId === e && l.colKey === o;
     }
-    function qe(e, o) {
-      return Tl.value.some((l) => l.rowId === e && l.colKey === o);
+    function _e(e, o) {
+      return El.value.some((l) => l.rowId === e && l.colKey === o);
     }
-    function Je(e) {
-      const o = d(e);
+    function V(e, o) {
+      return U.value !== null && U.value.rowId === e && U.value.fieldId === o;
+    }
+    function el(e) {
+      const o = s(e);
       return {
-        "of-row-dragging": zl.value && Bl.value === o,
-        "of-row-drop-target": be.value === o,
-        "of-row-drop-before": be.value === o && He.value === "before",
-        "of-row-drop-after": be.value === o && He.value === "after"
+        "of-row-dragging": Il.value && Pl.value === o,
+        "of-row-drop-target": he.value === o,
+        "of-row-drop-before": he.value === o && Le.value === "before",
+        "of-row-drop-after": he.value === o && Le.value === "after"
       };
     }
-    function ao(e) {
-      il(e);
+    function uo(e) {
+      yl(e);
     }
-    function ro(e) {
-      for (const o of dl(e))
+    function co(e) {
+      for (const o of vl(e))
         c("cell-edit", o);
     }
-    return (e, o) => n(ue) ? (r(), v(bo, {
+    return (e, o) => n(be) ? (r(), v(ho, {
       key: 0,
-      rows: n(fe),
+      rows: n(ke),
       columns: D.value,
       "field-defs": u.fieldDefs,
       selectable: x.value,
-      addable: Ge.value,
+      addable: Ye.value,
       "status-color-map": u.statusColorMap,
       readonly: u.readonly,
-      "density-class": n(Se),
-      "density-style": n(Re),
-      "detail-visible": n(al),
-      "detail-row": n(rl),
-      onRowClick: o[0] || (o[0] = (l) => ao(l)),
+      "density-class": n(Me),
+      "density-style": n(Ae),
+      "detail-visible": n(ul),
+      "detail-row": n(cl),
+      onRowClick: o[0] || (o[0] = (l) => uo(l)),
       onAddRow: o[1] || (o[1] = (l) => c("add-row")),
-      onCloseDetail: n(ul),
-      onDetailSave: ro,
+      onCloseDetail: n(bl),
+      onDetailSave: co,
       onRowDelete: o[2] || (o[2] = (l) => c("row-delete", l)),
       onCellEdit: o[3] || (o[3] = (l) => c("cell-edit", l))
-    }, io({ _: 2 }, [
+    }, yo({ _: 2 }, [
       e.$slots.cell ? {
         name: "cell",
         fn: $((l) => [
-          H(e.$slots, "cell", uo(co(l)), void 0, !0)
+          E(e.$slots, "cell", vo(bo(l)), void 0, !0)
         ]),
         key: "0"
       } : void 0
-    ]), 1032, ["rows", "columns", "field-defs", "selectable", "addable", "status-color-map", "readonly", "density-class", "density-style", "detail-visible", "detail-row", "onCloseDetail"])) : (r(), s("div", {
+    ]), 1032, ["rows", "columns", "field-defs", "selectable", "addable", "status-color-map", "readonly", "density-class", "density-style", "detail-visible", "detail-row", "onCloseDetail"])) : (r(), i("div", {
       key: 1,
       ref_key: "tableContainerRef",
-      ref: Y,
-      class: F(["of-data-table", [n(Se), n(tl)]]),
-      style: g(n(Re)),
+      ref: J,
+      class: F(["of-data-table", [n(Me), n(dl)]]),
+      style: g(n(Ae)),
       role: "grid",
       tabindex: "0",
-      onKeydown: o[19] || (o[19] = (l) => u.enableKeyboard ? n(Kl)(l) : void 0)
+      onKeydown: o[19] || (o[19] = (l) => u.enableKeyboard ? n(Hl)(l) : void 0)
     }, [
-      N(go, {
-        "has-fixed-columns": Sl.value,
-        "show-selection-bar": n(Ul),
-        "selection-count": n(S).size,
-        "selection-items": n(Zl),
-        "fixed-width": n(xl),
-        "show-fixed-shadow": Rl.value,
+      j(po, {
+        "has-fixed-columns": Fl.value,
+        "show-selection-bar": n(lo),
+        "selection-count": n(R).size,
+        "selection-items": n(oo),
+        "fixed-width": n(Al),
+        "show-fixed-shadow": Ml.value,
         columns: D.value,
-        "fixed-columns": n(Q),
-        "scrollable-columns": n(U),
+        "fixed-columns": n(ee),
+        "scrollable-columns": n(le),
         selectable: x.value,
         "show-row-actions": u.showRowActions,
-        "use-virtual": _.value,
-        "total-height": n(ee),
-        "offset-y": n(le),
-        "set-fixed-region-ref": oo,
-        "set-scroll-region-ref": no,
-        "set-standard-scroll-ref": to,
-        onSelectionAction: n(_l),
-        onFixedScroll: n(Fl),
-        onScroll: lo
+        "use-virtual": ne.value,
+        "total-height": n(te),
+        "offset-y": n(ae),
+        "set-fixed-region-ref": ro,
+        "set-scroll-region-ref": io,
+        "set-standard-scroll-ref": so,
+        onSelectionAction: n(no),
+        onFixedScroll: n(Kl),
+        onScroll: ao
       }, {
         "fixed-header": $(() => [
-          N(Ce, {
-            columns: n(Q),
+          j(xe, {
+            columns: n(ee),
             selectable: x.value,
-            "sort-key": n(E).field ?? "",
-            "sort-order": n(E).order ?? "asc",
-            "all-selected": n(Te),
-            indeterminate: n(Ve),
+            "sort-key": n(P).field ?? "",
+            "sort-order": n(P).order ?? "asc",
+            "all-selected": n(He),
+            indeterminate: n(je),
             "enable-resize": u.enableResize,
             "enable-field-menu": u.enableFieldManagement,
             "enable-add-field": u.enableFieldManagement,
             density: n(A),
-            onSort: n(q),
-            onSelectAll: n(Ne),
-            onResizeStart: he,
-            onResizeDblclick: me,
-            onHeaderContextmenu: ge,
-            onHeaderDblclick: ke,
-            onAddField: we
+            onSort: n(Z),
+            onSelectAll: n(Xe),
+            onResizeStart: De,
+            onResizeDblclick: Re,
+            onHeaderContextmenu: pe,
+            onHeaderDblclick: me,
+            onAddField: Ce
           }, null, 8, ["columns", "selectable", "sort-key", "sort-order", "all-selected", "indeterminate", "enable-resize", "enable-field-menu", "enable-add-field", "density", "onSort", "onSelectAll"])
         ]),
         "fixed-body": $(() => [
-          _.value ? (r(), s("div", {
+          ne.value ? (r(), i("div", {
             key: 0,
-            style: g({ height: n(ee) + "px", position: "relative" })
+            style: g({ height: n(te) + "px", position: "relative" })
           }, [
             h("div", {
-              style: g({ transform: `translateY(${n(le)}px)` })
+              style: g({ transform: `translateY(${n(ae)}px)` })
             }, [
-              (r(!0), s(y, null, m(n(ye), ({ data: l, index: t }) => (r(), s(y, {
+              (r(!0), i(y, null, p(n(we), ({ data: l, index: t }) => (r(), i(y, {
                 key: l.id
               }, [
-                n(K)(l) ? (r(), v(de, G({
+                n(K)(l) ? (r(), v(ve, O({
                   key: 0,
                   ref_for: !0,
-                  ref: (a) => ae(a, t)
-                }, { ref_for: !0 }, se(l), {
-                  onToggle: (a) => n(J)(ie(l))
-                }), null, 16, ["onToggle"])) : (r(), s("div", {
+                  ref: (a) => ue(a, t)
+                }, { ref_for: !0 }, fe(l), {
+                  onToggle: (a) => n(_)(ye(l))
+                }), null, 16, ["onToggle"])) : (r(), i("div", {
                   key: 1,
                   ref_for: !0,
-                  ref: (a) => ae(a, t),
+                  ref: (a) => ue(a, t),
                   class: F(["of-table-row", {
-                    "of-table-row--selected": n(S).has(d(l)),
-                    "of-table-row--hover": n(Z)(d(l))
+                    "of-table-row--selected": n(R).has(s(l)),
+                    "of-table-row--hover": n(oe)(s(l))
                   }]),
                   role: "row",
                   tabindex: "0",
-                  style: g(Oe()),
-                  onMouseenter: (a) => n(b)(d(l)),
+                  style: g(Je()),
+                  onMouseenter: (a) => n(b)(s(l)),
                   onMouseleave: o[6] || (o[6] = (a) => n(b)(null)),
-                  onFocusin: (a) => n(b)(d(l)),
+                  onFocusin: (a) => n(b)(s(l)),
                   onFocusout: o[7] || (o[7] = (a) => n(b)(null)),
-                  onClick: (a) => p(l),
-                  onKeydown: (a) => te(a, l)
+                  onClick: (a) => m(l),
+                  onKeydown: (a) => de(a, l)
                 }, [
-                  x.value ? (r(), s("div", {
+                  x.value ? (r(), i("div", {
                     key: 0,
                     class: "of-td of-td-checkbox",
                     role: "gridcell",
@@ -578,85 +589,88 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
                   }, [
                     h("label", {
                       class: "of-checkbox-label",
-                      for: `fixed-row-select-${d(l)}`
+                      for: `fixed-row-select-${s(l)}`
                     }, [
                       h("input", {
-                        id: `fixed-row-select-${d(l)}`,
+                        id: `fixed-row-select-${s(l)}`,
                         type: "checkbox",
                         class: "of-checkbox",
-                        checked: n(S).has(d(l)),
-                        onChange: (a) => n(ne)(d(l))
-                      }, null, 40, Wo),
+                        checked: n(R).has(s(l)),
+                        onChange: (a) => n(se)(s(l))
+                      }, null, 40, Oo),
                       o[20] || (o[20] = h("span", { class: "of-sr-only" }, "选择当前行", -1))
-                    ], 8, Lo)
+                    ], 8, No)
                   ])) : M("", !0),
-                  (r(!0), s(y, null, m(n(Q), (a) => (r(), s("div", {
+                  (r(!0), i(y, null, p(n(ee), (a) => (r(), i("div", {
                     key: a.key,
                     class: "of-td",
                     role: "gridcell",
-                    style: g(re(a))
+                    style: g(ce(a))
                   }, [
-                    H(e.$slots, "cell", {
+                    E(e.$slots, "cell", {
                       row: l,
                       col: a
                     }, () => {
                       var f;
                       return [
-                        (f = u.fieldDefs) != null && f.length ? (r(), v(V, {
+                        (f = u.fieldDefs) != null && f.length ? (r(), v(Y, {
                           key: 0,
-                          "row-id": d(l),
-                          field: P(a.key),
+                          "row-id": s(l),
+                          field: q(a.key),
                           value: C(l, a.key),
-                          onCommit: L
-                        }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", Go, B(C(l, a.key) ?? "-"), 1))
+                          editing: V(s(l), a.key),
+                          onCommit: L,
+                          onRequestEdit: W,
+                          onRequestCancel: G
+                        }, null, 8, ["row-id", "field", "value", "editing"])) : (r(), i("span", Yo, B(C(l, a.key) ?? "-"), 1))
                       ];
                     }, !0)
                   ], 4))), 128)),
-                  u.showRowActions ? (r(), s("div", {
+                  u.showRowActions ? (r(), i("div", {
                     key: 1,
                     class: "of-table-row__actions",
                     "aria-label": "行快捷操作",
                     onClick: o[5] || (o[5] = z(() => {
                     }, ["stop"]))
                   }, [
-                    (r(!0), s(y, null, m(j(l), (a) => (r(), s("button", {
+                    (r(!0), i(y, null, p(Q(l), (a) => (r(), i("button", {
                       key: a.key,
                       type: "button",
                       class: F(["of-table-row__action-btn", { "of-table-row__action-btn--danger": a.variant === "danger" }]),
                       disabled: a.disabled,
-                      onClick: z((f) => Fe(l, a.key), ["stop"])
+                      onClick: z((f) => ze(l, a.key), ["stop"])
                     }, [
                       h("span", null, B(a.label), 1)
-                    ], 10, Vo))), 128))
+                    ], 10, jo))), 128))
                   ])) : M("", !0)
-                ], 46, Po))
+                ], 46, Vo))
               ], 64))), 128))
             ], 4)
-          ], 4)) : (r(!0), s(y, { key: 1 }, m(n(T), (l) => (r(), s(y, {
+          ], 4)) : (r(!0), i(y, { key: 1 }, p(n(T), (l) => (r(), i(y, {
             key: l.id
           }, [
-            n(K)(l) ? (r(), v(de, G({
+            n(K)(l) ? (r(), v(ve, O({
               key: 0,
               ref_for: !0
-            }, se(l), {
-              onToggle: (t) => n(J)(ie(l))
-            }), null, 16, ["onToggle"])) : (r(), s("div", {
+            }, fe(l), {
+              onToggle: (t) => n(_)(ye(l))
+            }), null, 16, ["onToggle"])) : (r(), i("div", {
               key: 1,
               class: F(["of-table-row", {
-                "of-table-row--selected": n(S).has(d(l)),
-                "of-table-row--hover": n(Z)(d(l))
+                "of-table-row--selected": n(R).has(s(l)),
+                "of-table-row--hover": n(oe)(s(l))
               }]),
               role: "row",
               tabindex: "0",
-              style: g(Oe()),
-              onMouseenter: (t) => n(b)(d(l)),
+              style: g(Je()),
+              onMouseenter: (t) => n(b)(s(l)),
               onMouseleave: o[10] || (o[10] = (t) => n(b)(null)),
-              onFocusin: (t) => n(b)(d(l)),
+              onFocusin: (t) => n(b)(s(l)),
               onFocusout: o[11] || (o[11] = (t) => n(b)(null)),
-              onClick: (t) => p(l),
-              onKeydown: (t) => te(t, l)
+              onClick: (t) => m(l),
+              onKeydown: (t) => de(t, l)
             }, [
-              x.value ? (r(), s("div", {
+              x.value ? (r(), i("div", {
                 key: 0,
                 class: "of-td of-td-checkbox",
                 role: "gridcell",
@@ -665,252 +679,264 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
               }, [
                 h("label", {
                   class: "of-checkbox-label",
-                  for: `row-select-${d(l)}`
+                  for: `row-select-${s(l)}`
                 }, [
                   h("input", {
-                    id: `row-select-${d(l)}`,
+                    id: `row-select-${s(l)}`,
                     type: "checkbox",
                     class: "of-checkbox",
-                    checked: n(S).has(d(l)),
-                    onChange: (t) => n(ne)(d(l))
-                  }, null, 40, Yo),
+                    checked: n(R).has(s(l)),
+                    onChange: (t) => n(se)(s(l))
+                  }, null, 40, Qo),
                   o[21] || (o[21] = h("span", { class: "of-sr-only" }, "选择当前行", -1))
-                ], 8, Oo)
+                ], 8, Jo)
               ])) : M("", !0),
-              (r(!0), s(y, null, m(n(Q), (t) => (r(), s("div", {
+              (r(!0), i(y, null, p(n(ee), (t) => (r(), i("div", {
                 key: t.key,
                 class: "of-td",
                 role: "gridcell",
-                style: g(re(t))
+                style: g(ce(t))
               }, [
-                H(e.$slots, "cell", {
+                E(e.$slots, "cell", {
                   row: l,
                   col: t
                 }, () => {
                   var a;
                   return [
-                    (a = u.fieldDefs) != null && a.length ? (r(), v(V, {
+                    (a = u.fieldDefs) != null && a.length ? (r(), v(Y, {
                       key: 0,
-                      "row-id": d(l),
-                      field: P(t.key),
+                      "row-id": s(l),
+                      field: q(t.key),
                       value: C(l, t.key),
-                      onCommit: L
-                    }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", jo, B(C(l, t.key) ?? "-"), 1))
+                      editing: V(s(l), t.key),
+                      onCommit: L,
+                      onRequestEdit: W,
+                      onRequestCancel: G
+                    }, null, 8, ["row-id", "field", "value", "editing"])) : (r(), i("span", Uo, B(C(l, t.key) ?? "-"), 1))
                   ];
                 }, !0)
               ], 4))), 128)),
-              u.showRowActions ? (r(), s("div", {
+              u.showRowActions ? (r(), i("div", {
                 key: 1,
                 class: "of-table-row__actions",
                 "aria-label": "行快捷操作",
                 onClick: o[9] || (o[9] = z(() => {
                 }, ["stop"]))
               }, [
-                (r(!0), s(y, null, m(j(l), (t) => (r(), s("button", {
+                (r(!0), i(y, null, p(Q(l), (t) => (r(), i("button", {
                   key: t.key,
                   type: "button",
                   class: F(["of-table-row__action-btn", { "of-table-row__action-btn--danger": t.variant === "danger" }]),
                   disabled: t.disabled,
-                  onClick: z((a) => Fe(l, t.key), ["stop"])
+                  onClick: z((a) => ze(l, t.key), ["stop"])
                 }, [
                   h("span", null, B(t.label), 1)
-                ], 10, Xo))), 128))
+                ], 10, Zo))), 128))
               ])) : M("", !0)
-            ], 46, No))
+            ], 46, Xo))
           ], 64))), 128))
         ]),
         "scroll-header": $(() => [
-          N(Ce, {
-            columns: n(U),
+          j(xe, {
+            columns: n(le),
             selectable: !1,
-            "sort-key": n(E).field ?? "",
-            "sort-order": n(E).order ?? "asc",
+            "sort-key": n(P).field ?? "",
+            "sort-order": n(P).order ?? "asc",
             "enable-resize": u.enableResize,
             "enable-field-menu": u.enableFieldManagement,
             "enable-add-field": u.enableFieldManagement,
             density: n(A),
-            onSort: n(q),
-            onResizeStart: he,
-            onResizeDblclick: me,
-            onHeaderContextmenu: ge,
-            onHeaderDblclick: ke,
-            onAddField: we
+            onSort: n(Z),
+            onResizeStart: De,
+            onResizeDblclick: Re,
+            onHeaderContextmenu: pe,
+            onHeaderDblclick: me,
+            onAddField: Ce
           }, null, 8, ["columns", "sort-key", "sort-order", "enable-resize", "enable-field-menu", "enable-add-field", "density", "onSort"])
         ]),
         "scroll-body": $(() => [
-          _.value ? (r(), s("div", {
+          ne.value ? (r(), i("div", {
             key: 0,
-            style: g({ height: n(ee) + "px", position: "relative" })
+            style: g({ height: n(te) + "px", position: "relative" })
           }, [
             h("div", {
-              style: g({ transform: `translateY(${n(le)}px)` })
+              style: g({ transform: `translateY(${n(ae)}px)` })
             }, [
-              (r(!0), s(y, null, m(n(ye), ({ data: l }) => (r(), s(y, {
+              (r(!0), i(y, null, p(n(we), ({ data: l }) => (r(), i(y, {
                 key: l.id
               }, [
-                n(K)(l) ? (r(), s("div", {
+                n(K)(l) ? (r(), i("div", {
                   key: 0,
-                  style: g(Ye())
-                }, null, 4)) : (r(), s("div", {
+                  style: g(Qe())
+                }, null, 4)) : (r(), i("div", {
                   key: 1,
                   class: F(["of-table-row", {
-                    "of-table-row--selected": n(S).has(d(l)),
-                    "of-table-row--hover": n(Z)(d(l))
+                    "of-table-row--selected": n(R).has(s(l)),
+                    "of-table-row--hover": n(oe)(s(l))
                   }]),
                   role: "row",
                   tabindex: "0",
-                  onMouseenter: (t) => n(b)(d(l)),
+                  onMouseenter: (t) => n(b)(s(l)),
                   onMouseleave: o[12] || (o[12] = (t) => n(b)(null)),
-                  onFocusin: (t) => n(b)(d(l)),
+                  onFocusin: (t) => n(b)(s(l)),
                   onFocusout: o[13] || (o[13] = (t) => n(b)(null)),
-                  onClick: (t) => p(l),
-                  onKeydown: (t) => te(t, l)
+                  onClick: (t) => m(l),
+                  onKeydown: (t) => de(t, l)
                 }, [
-                  (r(!0), s(y, null, m(n(U), (t) => (r(), s("div", {
+                  (r(!0), i(y, null, p(n(le), (t) => (r(), i("div", {
                     key: t.key,
                     class: "of-td",
                     role: "gridcell",
-                    style: g(re(t))
+                    style: g(ce(t))
                   }, [
-                    H(e.$slots, "cell", {
+                    E(e.$slots, "cell", {
                       row: l,
                       col: t
                     }, () => {
                       var a;
                       return [
-                        (a = u.fieldDefs) != null && a.length ? (r(), v(V, {
+                        (a = u.fieldDefs) != null && a.length ? (r(), v(Y, {
                           key: 0,
-                          "row-id": d(l),
-                          field: P(t.key),
+                          "row-id": s(l),
+                          field: q(t.key),
                           value: C(l, t.key),
-                          onCommit: L
-                        }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", Jo, B(C(l, t.key) ?? "-"), 1))
+                          editing: V(s(l), t.key),
+                          onCommit: L,
+                          onRequestEdit: W,
+                          onRequestCancel: G
+                        }, null, 8, ["row-id", "field", "value", "editing"])) : (r(), i("span", en, B(C(l, t.key) ?? "-"), 1))
                       ];
                     }, !0)
                   ], 4))), 128))
-                ], 42, qo))
+                ], 42, _o))
               ], 64))), 128))
             ], 4)
-          ], 4)) : (r(!0), s(y, { key: 1 }, m(n(T), (l) => (r(), s(y, {
+          ], 4)) : (r(!0), i(y, { key: 1 }, p(n(T), (l) => (r(), i(y, {
             key: l.id
           }, [
-            n(K)(l) ? (r(), s("div", {
+            n(K)(l) ? (r(), i("div", {
               key: 0,
-              style: g(Ye())
-            }, null, 4)) : (r(), s("div", {
+              style: g(Qe())
+            }, null, 4)) : (r(), i("div", {
               key: 1,
               class: F(["of-table-row", {
-                "of-table-row--selected": n(S).has(d(l)),
-                "of-table-row--hover": n(Z)(d(l))
+                "of-table-row--selected": n(R).has(s(l)),
+                "of-table-row--hover": n(oe)(s(l))
               }]),
               role: "row",
               tabindex: "0",
-              onMouseenter: (t) => n(b)(d(l)),
+              onMouseenter: (t) => n(b)(s(l)),
               onMouseleave: o[14] || (o[14] = (t) => n(b)(null)),
-              onFocusin: (t) => n(b)(d(l)),
+              onFocusin: (t) => n(b)(s(l)),
               onFocusout: o[15] || (o[15] = (t) => n(b)(null)),
-              onClick: (t) => p(l),
-              onKeydown: (t) => te(t, l)
+              onClick: (t) => m(l),
+              onKeydown: (t) => de(t, l)
             }, [
-              (r(!0), s(y, null, m(n(U), (t) => (r(), s("div", {
+              (r(!0), i(y, null, p(n(le), (t) => (r(), i("div", {
                 key: t.key,
                 class: "of-td",
                 role: "gridcell",
-                style: g(re(t))
+                style: g(ce(t))
               }, [
-                H(e.$slots, "cell", {
+                E(e.$slots, "cell", {
                   row: l,
                   col: t
                 }, () => {
                   var a;
                   return [
-                    (a = u.fieldDefs) != null && a.length ? (r(), v(V, {
+                    (a = u.fieldDefs) != null && a.length ? (r(), v(Y, {
                       key: 0,
-                      "row-id": d(l),
-                      field: P(t.key),
+                      "row-id": s(l),
+                      field: q(t.key),
                       value: C(l, t.key),
-                      onCommit: L
-                    }, null, 8, ["row-id", "field", "value"])) : (r(), s("span", Uo, B(C(l, t.key) ?? "-"), 1))
+                      editing: V(s(l), t.key),
+                      onCommit: L,
+                      onRequestEdit: W,
+                      onRequestCancel: G
+                    }, null, 8, ["row-id", "field", "value", "editing"])) : (r(), i("span", on, B(C(l, t.key) ?? "-"), 1))
                   ];
                 }, !0)
               ], 4))), 128))
-            ], 42, Qo))
+            ], 42, ln))
           ], 64))), 128))
         ]),
         "standard-header": $(() => [
-          N(Ce, {
+          j(xe, {
             columns: D.value,
             selectable: x.value,
-            "sort-key": n(E).field ?? "",
-            "sort-order": n(E).order ?? "asc",
-            "all-selected": n(Te),
-            indeterminate: n(Ve),
+            "sort-key": n(P).field ?? "",
+            "sort-order": n(P).order ?? "asc",
+            "all-selected": n(He),
+            indeterminate: n(je),
             "enable-resize": u.enableResize,
             "enable-field-menu": u.enableFieldManagement,
             "enable-add-field": u.enableFieldManagement,
             density: n(A),
-            onSort: n(q),
-            onSelectAll: n(Ne),
-            onResizeStart: he,
-            onResizeDblclick: me,
-            onHeaderContextmenu: ge,
-            onHeaderDblclick: ke,
-            onAddField: we
+            onSort: n(Z),
+            onSelectAll: n(Xe),
+            onResizeStart: De,
+            onResizeDblclick: Re,
+            onHeaderContextmenu: pe,
+            onHeaderDblclick: me,
+            onAddField: Ce
           }, null, 8, ["columns", "selectable", "sort-key", "sort-order", "all-selected", "indeterminate", "enable-resize", "enable-field-menu", "enable-add-field", "density", "onSort", "onSelectAll"])
         ]),
         "standard-body": $(() => [
-          _.value ? (r(), s("div", {
+          ne.value ? (r(), i("div", {
             key: 0,
-            style: g({ height: n(ee) + "px", position: "relative" })
+            style: g({ height: n(te) + "px", position: "relative" })
           }, [
             h("div", {
-              style: g({ transform: `translateY(${n(le)}px)` })
+              style: g({ transform: `translateY(${n(ae)}px)` })
             }, [
-              (r(!0), s(y, null, m(n(ye), ({ data: l, index: t }) => (r(), s(y, {
+              (r(!0), i(y, null, p(n(we), ({ data: l, index: t }) => (r(), i(y, {
                 key: l.id
               }, [
-                n(K)(l) ? (r(), v(de, G({
+                n(K)(l) ? (r(), v(ve, O({
                   key: 0,
                   ref_for: !0,
-                  ref: (a) => ae(a, t)
-                }, { ref_for: !0 }, se(l), {
-                  onToggle: (a) => n(J)(ie(l))
-                }), null, 16, ["onToggle"])) : (r(), v(Ze, G({
+                  ref: (a) => ue(a, t)
+                }, { ref_for: !0 }, fe(l), {
+                  onToggle: (a) => n(_)(ye(l))
+                }), null, 16, ["onToggle"])) : (r(), v(nl, O({
                   key: 1,
                   ref_for: !0,
-                  ref: (a) => ae(a, t)
-                }, { ref_for: !0 }, je(l), {
+                  ref: (a) => ue(a, t)
+                }, { ref_for: !0 }, Ue(l), {
                   density: n(A),
                   "show-row-actions": u.showRowActions,
-                  "row-action-items": j(l),
+                  "row-action-items": Q(l),
                   draggable: u.enableRowDrag,
-                  class: Je(l),
-                  onSelect: n(ne),
-                  onClick: (a) => p(l),
-                  onDragstart: (a) => Ee(a, l),
-                  onDragover: (a) => Pe(a, l),
-                  onDrop: (a) => Le(a, l),
-                  onDragend: n(Ie)
+                  class: el(l),
+                  onSelect: n(se),
+                  onClick: (a) => m(l),
+                  onDragstart: (a) => Ge(a, l),
+                  onDragover: (a) => Ve(a, l),
+                  onDrop: (a) => Ne(a, l),
+                  onDragend: n(We)
                 }), {
                   cell: $(({ row: a, col: f }) => [
-                    H(e.$slots, "cell", {
+                    E(e.$slots, "cell", {
                       row: a,
                       col: f
                     }, () => {
-                      var pe;
+                      var Se;
                       return [
-                        (pe = u.fieldDefs) != null && pe.length ? (r(), v(V, {
+                        (Se = u.fieldDefs) != null && Se.length ? (r(), v(Y, {
                           key: 0,
-                          "row-id": d(a),
-                          field: P(f.key),
+                          "row-id": s(a),
+                          field: q(f.key),
                           value: a[f.key],
+                          editing: V(s(a), f.key),
                           class: F({
-                            "of-cell--active": Xe(d(a), f.key),
-                            "of-cell--selected": qe(d(a), f.key)
+                            "of-cell--active": Ze(s(a), f.key),
+                            "of-cell--selected": _e(s(a), f.key)
                           }),
                           onCommit: L,
-                          onClick: z((on) => u.enableKeyboard && n(ve)(d(a), f.key), ["stop"])
-                        }, null, 8, ["row-id", "field", "value", "class", "onClick"])) : (r(), s("span", Zo, B(C(a, f.key) ?? "-"), 1))
+                          onRequestEdit: W,
+                          onRequestCancel: G,
+                          onClick: z((sn) => u.enableKeyboard && n(re)(s(a), f.key), ["stop"])
+                        }, null, 8, ["row-id", "field", "value", "editing", "class", "onClick"])) : (r(), i("span", nn, B(C(a, f.key) ?? "-"), 1))
                       ];
                     }, !0)
                   ]),
@@ -918,49 +944,52 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
                 }, 16, ["density", "show-row-actions", "row-action-items", "draggable", "class", "onSelect", "onClick", "onDragstart", "onDragover", "onDrop", "onDragend"]))
               ], 64))), 128))
             ], 4)
-          ], 4)) : (r(!0), s(y, { key: 1 }, m(n(T), (l) => (r(), s(y, {
+          ], 4)) : (r(!0), i(y, { key: 1 }, p(n(T), (l) => (r(), i(y, {
             key: l.id
           }, [
-            n(K)(l) ? (r(), v(de, G({
+            n(K)(l) ? (r(), v(ve, O({
               key: 0,
               ref_for: !0
-            }, se(l), {
-              onToggle: (t) => n(J)(ie(l))
-            }), null, 16, ["onToggle"])) : (r(), v(Ze, G({
+            }, fe(l), {
+              onToggle: (t) => n(_)(ye(l))
+            }), null, 16, ["onToggle"])) : (r(), v(nl, O({
               key: 1,
               ref_for: !0
-            }, je(l), {
+            }, Ue(l), {
               density: n(A),
               "show-row-actions": u.showRowActions,
-              "row-action-items": j(l),
+              "row-action-items": Q(l),
               draggable: u.enableRowDrag,
-              class: Je(l),
-              onSelect: n(ne),
-              onClick: (t) => p(l),
-              onDragstart: (t) => Ee(t, l),
-              onDragover: (t) => Pe(t, l),
-              onDrop: (t) => Le(t, l),
-              onDragend: n(Ie)
+              class: el(l),
+              onSelect: n(se),
+              onClick: (t) => m(l),
+              onDragstart: (t) => Ge(t, l),
+              onDragover: (t) => Ve(t, l),
+              onDrop: (t) => Ne(t, l),
+              onDragend: n(We)
             }), {
               cell: $(({ row: t, col: a }) => [
-                H(e.$slots, "cell", {
+                E(e.$slots, "cell", {
                   row: t,
                   col: a
                 }, () => {
                   var f;
                   return [
-                    (f = u.fieldDefs) != null && f.length ? (r(), v(V, {
+                    (f = u.fieldDefs) != null && f.length ? (r(), v(Y, {
                       key: 0,
-                      "row-id": d(t),
-                      field: P(a.key),
+                      "row-id": s(t),
+                      field: q(a.key),
                       value: t[a.key],
+                      editing: V(s(t), a.key),
                       class: F({
-                        "of-cell--active": Xe(d(t), a.key),
-                        "of-cell--selected": qe(d(t), a.key)
+                        "of-cell--active": Ze(s(t), a.key),
+                        "of-cell--selected": _e(s(t), a.key)
                       }),
                       onCommit: L,
-                      onClick: z((pe) => u.enableKeyboard && n(ve)(d(t), a.key), ["stop"])
-                    }, null, 8, ["row-id", "field", "value", "class", "onClick"])) : (r(), s("span", _o, B(C(t, a.key) ?? "-"), 1))
+                      onRequestEdit: W,
+                      onRequestCancel: G,
+                      onClick: z((Se) => u.enableKeyboard && n(re)(s(t), a.key), ["stop"])
+                    }, null, 8, ["row-id", "field", "value", "editing", "class", "onClick"])) : (r(), i("span", tn, B(C(t, a.key) ?? "-"), 1))
                   ];
                 }, !0)
               ]),
@@ -970,48 +999,48 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
         ]),
         _: 3
       }, 8, ["has-fixed-columns", "show-selection-bar", "selection-count", "selection-items", "fixed-width", "show-fixed-shadow", "columns", "fixed-columns", "scrollable-columns", "selectable", "show-row-actions", "use-virtual", "total-height", "offset-y", "onSelectionAction", "onFixedScroll"]),
-      n(gl) ? (r(), s("div", {
+      n(pl) ? (r(), i("div", {
         key: 0,
         class: "of-resize-indicator",
-        style: g({ left: n(kl) + "px" })
+        style: g({ left: n(ml) + "px" })
       }, null, 4)) : M("", !0),
-      Gl.value ? (r(), v(vo, {
+      Ol.value ? (r(), v(wo, {
         key: 1,
-        "draft-count": n(We).size,
-        onCommitAll: Nl,
-        onDiscardAll: Ol
+        "draft-count": n(Oe).size,
+        onCommitAll: jl,
+        onDiscardAll: Xl
       }, null, 8, ["draft-count"])) : M("", !0),
-      Ge.value ? (r(), v(yo, {
+      Ye.value ? (r(), v(ko, {
         key: 2,
-        onClick: Vl
+        onClick: Yl
       })) : M("", !0),
-      u.enableFieldManagement ? (r(), v(n(ll), {
+      u.enableFieldManagement ? (r(), v(n(rl), {
         key: 3,
-        visible: R.value.visible,
-        "col-key": R.value.colKey,
-        "col-label": R.value.colLabel,
-        "field-type": R.value.fieldType,
-        x: R.value.x,
-        y: R.value.y,
-        onClose: o[16] || (o[16] = (l) => R.value.visible = !1),
-        onRename: Yl,
-        onChangeType: jl,
-        onSort: o[17] || (o[17] = (l, t) => n(q)(l)),
-        onHide: Xl,
-        onDelete: ql,
-        onDuplicate: Jl
+        visible: S.value.visible,
+        "col-key": S.value.colKey,
+        "col-label": S.value.colLabel,
+        "field-type": S.value.fieldType,
+        x: S.value.x,
+        y: S.value.y,
+        onClose: o[16] || (o[16] = (l) => S.value.visible = !1),
+        onRename: Jl,
+        onChangeType: Ql,
+        onSort: o[17] || (o[17] = (l, t) => n(Z)(l)),
+        onHide: Ul,
+        onDelete: Zl,
+        onDuplicate: _l
       }, null, 8, ["visible", "col-key", "col-label", "field-type", "x", "y"])) : M("", !0),
-      (r(), v(fo, { to: "body" }, [
-        oe.value ? (r(), s("div", en, [
+      (r(), v(go, { to: "body" }, [
+        ie.value ? (r(), i("div", an, [
           h("button", {
             type: "button",
             class: "of-add-field-overlay__backdrop",
             tabindex: "-1",
             "aria-hidden": "true",
-            onClick: o[18] || (o[18] = (l) => oe.value = !1)
+            onClick: o[18] || (o[18] = (l) => ie.value = !1)
           }),
-          h("div", ln, [
-            N(n(ol), { onSelect: Ql })
+          h("div", rn, [
+            j(n(il), { onSelect: eo })
           ])
         ])) : M("", !0)
       ]))
@@ -1019,5 +1048,5 @@ const Po = ["onMouseenter", "onFocusin", "onClick", "onKeydown"], Lo = ["for"],
   }
 });
 export {
-  Mn as default
+  Bn as default
 };