e-virt-table 1.0.9 → 1.1.0

package/dist/index.es.js

@@ -159,28 +159,28 @@ var kt = /* @__PURE__ */ function(a) {
 }(/* @__PURE__ */ Ct(Error));
 function Ae(a, t, e, i, s) {
   if (t.first) {
-    var r = new Promise(function(u, x) {
+    var r = new Promise(function(x, u) {
       var p = function(y) {
-        return i(y), y.length ? x(new kt(y, bt(y))) : u(s);
+        return i(y), y.length ? u(new kt(y, bt(y))) : x(s);
       }, g = Le(a);
       Xt(g, e, p);
     });
-    return r.catch(function(u) {
-      return u;
+    return r.catch(function(x) {
+      return x;
     }), r;
   }
-  var o = t.firstFields === !0 ? Object.keys(a) : t.firstFields || [], n = Object.keys(a), h = n.length, c = 0, d = [], f = new Promise(function(u, x) {
+  var o = t.firstFields === !0 ? Object.keys(a) : t.firstFields || [], n = Object.keys(a), h = n.length, c = 0, d = [], f = new Promise(function(x, u) {
     var p = function(w) {
       if (d.push.apply(d, w), c++, c === h)
-        return i(d), d.length ? x(new kt(d, bt(d))) : u(s);
+        return i(d), d.length ? u(new kt(d, bt(d))) : x(s);
     };
-    n.length || (i(d), u(s)), n.forEach(function(g) {
+    n.length || (i(d), x(s)), n.forEach(function(g) {
       var w = a[g];
       o.indexOf(g) !== -1 ? Xt(w, e, p) : Se(w, e, p);
     });
   });
-  return f.catch(function(u) {
-    return u;
+  return f.catch(function(x) {
+    return x;
   }), f;
 }
 function Te(a) {
@@ -242,7 +242,7 @@ var Ut = function(t, e, i, s, r, o) {
   }, h.v6 = function(m) {
     return m && m.exact ? n : new RegExp("" + t(m) + s + t(m), "g");
   };
-  var c = "(?:(?:[a-z]+:)?//)", d = "(?:\\S+(?::\\S*)?@)?", f = h.v4().source, u = h.v6().source, x = "(?:(?:[a-z\\u00a1-\\uffff0-9][-_]*)*[a-z\\u00a1-\\uffff0-9]+)", p = "(?:\\.(?:[a-z\\u00a1-\\uffff0-9]-*)*[a-z\\u00a1-\\uffff0-9]+)*", g = "(?:\\.(?:[a-z\\u00a1-\\uffff]{2,}))", w = "(?::\\d{2,5})?", y = '(?:[/?#][^\\s"]*)?', E = "(?:" + c + "|www\\.)" + d + "(?:localhost|" + f + "|" + u + "|" + x + p + g + ")" + w + y;
+  var c = "(?:(?:[a-z]+:)?//)", d = "(?:\\S+(?::\\S*)?@)?", f = h.v4().source, x = h.v6().source, u = "(?:(?:[a-z\\u00a1-\\uffff0-9][-_]*)*[a-z\\u00a1-\\uffff0-9]+)", p = "(?:\\.(?:[a-z\\u00a1-\\uffff0-9]-*)*[a-z\\u00a1-\\uffff0-9]+)*", g = "(?:\\.(?:[a-z\\u00a1-\\uffff]{2,}))", w = "(?::\\d{2,5})?", y = '(?:[/?#][^\\s"]*)?', E = "(?:" + c + "|www\\.)" + d + "(?:localhost|" + f + "|" + x + "|" + u + p + g + ")" + w + y;
   return ct = new RegExp("(?:^" + E + "$)", "i"), ct;
 }, Bt = {
   // http://emailregex.com/
@@ -300,10 +300,10 @@ var Ut = function(t, e, i, s, r, o) {
   var o = ["integer", "float", "array", "regexp", "object", "method", "email", "number", "date", "url", "hex"], n = t.type;
   o.indexOf(n) > -1 ? et[n](e) || s.push(D(r.messages.types[n], t.fullField, t.type)) : n && typeof e !== t.type && s.push(D(r.messages.types[n], t.fullField, t.type));
 }, Xe = function(t, e, i, s, r) {
-  var o = typeof t.len == "number", n = typeof t.min == "number", h = typeof t.max == "number", c = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g, d = e, f = null, u = typeof e == "number", x = typeof e == "string", p = Array.isArray(e);
-  if (u ? f = "number" : x ? f = "string" : p && (f = "array"), !f)
+  var o = typeof t.len == "number", n = typeof t.min == "number", h = typeof t.max == "number", c = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g, d = e, f = null, x = typeof e == "number", u = typeof e == "string", p = Array.isArray(e);
+  if (x ? f = "number" : u ? f = "string" : p && (f = "array"), !f)
     return !1;
-  p && (d = e.length), x && (d = e.replace(c, "_").length), o ? d !== t.len && s.push(D(r.messages[f].len, t.fullField, t.len)) : n && !h && d < t.min ? s.push(D(r.messages[f].min, t.fullField, t.min)) : h && !n && d > t.max ? s.push(D(r.messages[f].max, t.fullField, t.max)) : n && h && (d < t.min || d > t.max) && s.push(D(r.messages[f].range, t.fullField, t.min, t.max));
+  p && (d = e.length), u && (d = e.replace(c, "_").length), o ? d !== t.len && s.push(D(r.messages[f].len, t.fullField, t.len)) : n && !h && d < t.min ? s.push(D(r.messages[f].min, t.fullField, t.min)) : h && !n && d > t.max ? s.push(D(r.messages[f].max, t.fullField, t.max)) : n && h && (d < t.min || d > t.max) && s.push(D(r.messages[f].range, t.fullField, t.min, t.max));
 }, j = "enum", ke = function(t, e, i, s, r) {
   t[j] = Array.isArray(t[j]) ? t[j] : [], t[j].indexOf(e) === -1 && s.push(D(r.messages[j], t.fullField, t[j].join(", ")));
 }, Ne = function(t, e, i, s, r) {
@@ -554,14 +554,14 @@ var Rt = vt(), nt = /* @__PURE__ */ function() {
       f === Rt && (f = vt()), Kt(f, h.messages), h.messages = f;
     } else
       h.messages = this.messages();
-    var u = {}, x = h.keys || Object.keys(this.rules);
-    x.forEach(function(g) {
+    var x = {}, u = h.keys || Object.keys(this.rules);
+    u.forEach(function(g) {
       var w = o.rules[g], y = n[g];
       w.forEach(function(E) {
         var m = E;
         typeof m.transform == "function" && (n === i && (n = G({}, n)), y = n[g] = m.transform(y)), typeof m == "function" ? m = {
           validator: m
-        } : m = G({}, m), m.validator = o.getValidationMethod(m), m.validator && (m.field = g, m.fullField = m.fullField || g, m.type = o.getType(m), u[g] = u[g] || [], u[g].push({
+        } : m = G({}, m), m.validator = o.getValidationMethod(m), m.validator && (m.field = g, m.fullField = m.fullField || g, m.type = o.getType(m), x[g] = x[g] || [], x[g].push({
           rule: m,
           value: y,
           source: n,
@@ -570,7 +570,7 @@ var Rt = vt(), nt = /* @__PURE__ */ function() {
       });
     });
     var p = {};
-    return Ae(u, h, function(g, w) {
+    return Ae(x, h, function(g, w) {
       var y = g.rule, E = (y.type === "object" || y.type === "array") && (typeof y.fields == "object" || typeof y.defaultField == "object");
       E = E && (y.required || !y.required && g.value), y.field = g.field;
       function m(R, S) {
@@ -1015,21 +1015,21 @@ class Tt extends se {
     const { CELL_PADDING: e = 0 } = this.ctx.config, { rowKey: i, cellType: s } = this;
     let r, o = 0, n = "";
     if (this.type === "tree" && s === "body") {
-      const h = this.ctx.database.getRowForRowKey(i), { expand: c = !1, hasChildren: d = !1, expandLoading: f = !1, level: u = 0 } = h || {};
+      const h = this.ctx.database.getRowForRowKey(i), { expand: c = !1, hasChildren: d = !1, expandLoading: f = !1, level: x = 0 } = h || {};
       if (this.rowExpand = c, this.rowHasChildren = d, f) {
         const g = this.ctx.icons.get("loading");
-        n = "loading", r = g, o = u * 8;
+        n = "loading", r = g, o = x * 8;
       } else if (d) {
         const g = this.ctx.icons.get("expand"), w = this.ctx.icons.get("shrink");
-        r = c ? w : g, n = c ? "shrink" : "expand", o = u * 8;
+        r = c ? w : g, n = c ? "shrink" : "expand", o = x * 8;
       } else
-        o = u * 8;
-      let x = 20, p = 20;
+        o = x * 8;
+      let u = 20, p = 20;
       if (r) {
         let g = this.drawX + o + e, w = this.drawY + (this.visibleHeight - p) / 2;
-        this.ctx.paint.drawImage(r, g, w, x, p), this.drawImageX = g, this.drawImageY = w, this.drawImageWidth = x, this.drawImageHeight = p, this.drawImageName = n, this.drawImageSource = r;
+        this.ctx.paint.drawImage(r, g, w, u, p), this.drawImageX = g, this.drawImageY = w, this.drawImageWidth = u, this.drawImageHeight = p, this.drawImageName = n, this.drawImageSource = r;
       }
-      this.align = "left", this.drawTextX = o + this.drawX + x - 0.5;
+      this.align = "left", this.drawTextX = o + this.drawX + u - 0.5;
     }
   }
   updateContainer() {
@@ -1060,9 +1060,9 @@ class Tt extends se {
       this.drawCellSkyBgColor = "transparent", this.drawCellBgColor = y, this.drawTextColor = E;
       return;
     }
-    let u = "transparent";
-    const x = this.ctx.focusCell, p = this.ctx.hoverCell;
-    d && (p == null ? void 0 : p.rowKey) === this.rowKey && (u = f), h && (x == null ? void 0 : x.rowKey) === this.rowKey && (u = c), this.drawCellSkyBgColor = u;
+    let x = "transparent";
+    const u = this.ctx.focusCell, p = this.ctx.hoverCell;
+    d && (p == null ? void 0 : p.rowKey) === this.rowKey && (x = f), h && (u == null ? void 0 : u.rowKey) === this.rowKey && (x = c), this.drawCellSkyBgColor = x;
     let g = e, w = o;
     if (["index", "index-selection", "selection"].includes(this.type)) {
       this.drawCellBgColor = e, this.drawTextColor = o;
@@ -1084,9 +1084,9 @@ class Tt extends se {
   updateSelection() {
     const { visibleWidth: e, visibleHeight: i, rowspan: s, colspan: r, cellType: o, type: n, rowIndex: h, rowKey: c } = this;
     if (!(s === 0 || r === 0) && o !== "footer" && ["index-selection", "selection"].includes(n)) {
-      const d = this.ctx.database.getRowSelection(c), f = this.ctx.database.getRowSelectable(c), { CHECKBOX_SIZE: u = 0 } = this.ctx.config, x = this.drawX + (e - u) / 2, p = this.drawY + (i - u) / 2;
+      const d = this.ctx.database.getRowSelection(c), f = this.ctx.database.getRowSelectable(c), { CHECKBOX_SIZE: x = 0 } = this.ctx.config, u = this.drawX + (e - x) / 2, p = this.drawY + (i - x) / 2;
       let g = this.ctx.icons.get("checkbox-uncheck"), w = "checkbox-uncheck";
-      d && f ? (g = this.ctx.icons.get("checkbox-check"), w = "checkbox-check") : d && f ? (g = this.ctx.icons.get("checkbox-check-disabled"), w = "checkbox-check-disabled") : !d && f ? (g = this.ctx.icons.get("checkbox-uncheck"), w = "checkbox-uncheck") : (g = this.ctx.icons.get("checkbox-disabled"), w = "checkbox-disabled"), g && n == "index-selection" ? (this.ctx.hoverCell && this.ctx.hoverCell.rowIndex === h || ["checkbox-disabled", "checkbox-check"].includes(w)) && (this.drawImageX = x, this.drawImageY = p, this.drawImageWidth = u, this.drawImageHeight = u, this.drawImageName = w, this.drawImageSource = g) : g && n === "selection" && (this.drawImageX = x, this.drawImageY = p, this.drawImageWidth = u, this.drawImageHeight = u, this.drawImageName = w, this.drawImageSource = g);
+      d && f ? (g = this.ctx.icons.get("checkbox-check"), w = "checkbox-check") : d && f ? (g = this.ctx.icons.get("checkbox-check-disabled"), w = "checkbox-check-disabled") : !d && f ? (g = this.ctx.icons.get("checkbox-uncheck"), w = "checkbox-uncheck") : (g = this.ctx.icons.get("checkbox-disabled"), w = "checkbox-disabled"), g && n == "index-selection" ? (this.ctx.hoverCell && this.ctx.hoverCell.rowIndex === h || ["checkbox-disabled", "checkbox-check"].includes(w)) && (this.drawImageX = u, this.drawImageY = p, this.drawImageWidth = x, this.drawImageHeight = x, this.drawImageName = w, this.drawImageSource = g) : g && n === "selection" && (this.drawImageX = u, this.drawImageY = p, this.drawImageWidth = x, this.drawImageHeight = x, this.drawImageName = w, this.drawImageSource = g);
     }
   }
   updateHoverIcon() {
@@ -1231,8 +1231,8 @@ class Tt extends se {
     const { SELECT_BORDER_COLOR: e, ENABLE_AUTOFILL: i, ENABLE_SELECTOR: s, AUTOFILL_POINT_BORDER_COLOR: r } = this.ctx.config;
     if (!s || !i)
       return;
-    const { xArr: o, yArr: n } = this.ctx.selector, h = o[1], c = n[1], { colIndex: d, rowIndex: f, drawX: u, drawY: x } = this;
-    d === h && f === c && this.ctx.paint.drawRect(u + this.width - 6, x + this.height - 6, 6, 6, {
+    const { xArr: o, yArr: n } = this.ctx.selector, h = o[1], c = n[1], { colIndex: d, rowIndex: f, drawX: x, drawY: u } = this;
+    d === h && f === c && this.ctx.paint.drawRect(x + this.width - 6, u + this.height - 6, 6, 6, {
       borderColor: r,
       fillColor: e
     });
@@ -1297,35 +1297,35 @@ class Tt extends se {
     const { drawX: i, drawY: s, width: r, rowIndex: o, colIndex: n } = this;
     let h = i + 0.5, c = s + 0.5, d = this.height;
     o === 0 && (c = this.y + 1, d = d - 1), n === this.ctx.maxColIndex && (h = h - 1);
-    const { xArr: f, yArr: u, lineDash: x = [], borderWidth: p = 1, borderColor: g, fillColor: w } = e, y = f[0], E = f[1], m = u[0], C = u[1];
+    const { xArr: f, yArr: x, lineDash: u = [], borderWidth: p = 1, borderColor: g, fillColor: w } = e, y = f[0], E = f[1], m = x[0], C = x[1];
     n >= y && n <= E && o === m && this.ctx.paint.drawLine([h, c, h + r - 2, c], {
       borderColor: g,
       fillColor: w,
       borderWidth: p,
       lineCap: "round",
       lineJoin: "round",
-      lineDash: x
+      lineDash: u
     }), n >= y && n <= E && o === C && this.ctx.paint.drawLine([h, c + d - 1.5, h + r, c + d - 1.5], {
       borderColor: g,
       fillColor: w,
       borderWidth: p,
       lineCap: "round",
       lineJoin: "round",
-      lineDash: x
+      lineDash: u
     }), n === y && o >= m && o <= C && this.ctx.paint.drawLine([h, c, h, c + d - 1], {
       borderColor: g,
       fillColor: w,
       borderWidth: p,
       lineCap: "round",
       lineJoin: "round",
-      lineDash: x
+      lineDash: u
     }), n === E && o >= m && o <= C && this.ctx.paint.drawLine([h + r - 1.5, c, h + r - 1.5, c + d - 1.5], {
       borderColor: g,
       fillColor: w,
       borderWidth: p,
       lineCap: "round",
       lineJoin: "round",
-      lineDash: x
+      lineDash: u
     });
   }
 }
@@ -1372,24 +1372,24 @@ class ni {
     t.forEach((i, s) => {
       let r = i._hasChildren || !1;
       Array.isArray(i.children) && i.children.length && (r = !0, this.initData(i.children, e + 1));
-      const { ROW_KEY: o = "", DEFAULT_EXPAND_ALL: n, CELL_HEIGHT: h, SELECTABLE_METHOD: c, CHECKBOX_KEY: d } = this.ctx.config, f = i[o], u = f != null ? `${f}` : Zt();
-      this.itemRowKeyMap.set(i, u);
-      const x = i._height || h, p = i._readonly;
+      const { ROW_KEY: o = "", DEFAULT_EXPAND_ALL: n, CELL_HEIGHT: h, SELECTABLE_METHOD: c, CHECKBOX_KEY: d } = this.ctx.config, f = i[o], x = f != null ? `${f}` : Zt();
+      this.itemRowKeyMap.set(i, x);
+      const u = i._height || h, p = i._readonly;
       let g = !0;
       if (typeof c == "function" && (g = c), d) {
         const w = i[d];
         if (this.checkboxKeyMap.has(w)) {
           const y = this.checkboxKeyMap.get(w) || [];
-          y.push(u), this.checkboxKeyMap.set(w, y);
+          y.push(x), this.checkboxKeyMap.set(w, y);
         } else
-          this.checkboxKeyMap.set(w, [u]);
+          this.checkboxKeyMap.set(w, [x]);
       }
-      this.rowKeyMap.set(u, {
+      this.rowKeyMap.set(x, {
         readonly: p,
         index: s,
         rowIndex: s,
         level: e,
-        height: x,
+        height: u,
         check: !1,
         selectable: g,
         expand: n,
@@ -1605,20 +1605,20 @@ class ni {
     let r = t;
     const { BEFORE_VALUE_CHANGE_METHOD: o } = this.ctx.config;
     if (typeof o == "function") {
-      const d = o, f = t.map((x) => ({
-        rowKey: x.rowKey,
-        key: x.key,
-        value: x.value,
-        oldValue: this.getItemValue(x.rowKey, x.key),
-        row: this.ctx.database.getRowDataItemForRowKey(x.rowKey)
+      const d = o, f = t.map((u) => ({
+        rowKey: u.rowKey,
+        key: u.key,
+        value: u.value,
+        oldValue: this.getItemValue(u.rowKey, u.key),
+        row: this.ctx.database.getRowDataItemForRowKey(u.rowKey)
       }));
       r = await d(f);
     }
     r.forEach((d) => {
-      const { value: f, rowKey: u, key: x } = d, p = this.getItemValue(u, x);
-      this.setItemValue(u, x, f), s.add(u), i.push({
-        rowKey: u,
-        key: x,
+      const { value: f, rowKey: x, key: u } = d, p = this.getItemValue(x, u);
+      this.setItemValue(x, u, f), s.add(x), i.push({
+        rowKey: x,
+        key: u,
         oldValue: p,
         newValue: f
       });
@@ -1672,9 +1672,9 @@ class ni {
     const d = this.originalDataMap.get(c);
     let f = i;
     if (o) {
-      const { BEFORE_VALUE_CHANGE_METHOD: u } = this.ctx.config;
-      if (typeof u == "function") {
-        const w = await u([
+      const { BEFORE_VALUE_CHANGE_METHOD: x } = this.ctx.config;
+      if (typeof x == "function") {
+        const w = await x([
           {
             rowKey: t,
             key: e,
@@ -1686,21 +1686,21 @@ class ni {
         w && w.length && (f = w[0].value);
       }
       this.changedDataMap.set(c, f), n[e] = f;
-      const x = this.ctx.database.getRowDataItemForRowKey(t), p = {
+      const u = this.ctx.database.getRowDataItemForRowKey(t), p = {
         rowKey: t,
         key: e,
         value: f,
-        row: x
+        row: u
       };
       this.getValidator(t, e).then(() => {
         this.validationErrorMap.size === 0 && this.changedDataMap.size > 0 && this.ctx.emit("validateChangedData", this.getChangedData());
-      }), this.ctx.emit("change", [p], [x]), this.ctx.emit("editChange", {
+      }), this.ctx.emit("change", [p], [u]), this.ctx.emit("editChange", {
         rowKey: t,
         key: e,
         oldValue: h,
         value: f,
         originalValue: d,
-        row: x
+        row: u
       });
     } else
       this.changedDataMap.set(c, f), n[e] = f;
@@ -1971,14 +1971,14 @@ class ni {
       if (h) {
         let c = {}, d = {};
         if (d[e] = this.getItemValue(t, e), Array.isArray(h)) {
-          const u = h.map((x) => ({
-            ...x,
+          const x = h.map((u) => ({
+            ...u,
             row: s.item,
             column: n,
             rowIndex: s.rowIndex,
             colIndex: r.colIndex
           }));
-          c[e] = u;
+          c[e] = x;
         } else
           c[e] = {
             ...h,
@@ -1989,15 +1989,15 @@ class ni {
           };
         new nt(c).validate(d).then(() => {
           this.clearValidationError(t, e), i([]);
-        }).catch(({ errors: u }) => {
-          const x = u.map((p) => ({
+        }).catch(({ errors: x }) => {
+          const u = x.map((p) => ({
             ...p,
             column: n,
             key: e,
             row: s.item,
             rowKey: t
           }));
-          this.setValidationError(t, e, x), i(x);
+          this.setValidationError(t, e, u), i(u);
         });
       } else
         i([]);
@@ -2023,19 +2023,19 @@ class ni {
       relationColKeys: c,
       rowspan: d,
       height: f,
-      width: u,
-      colspan: x,
+      width: x,
+      colspan: u,
       mergeRow: p,
       mergeCol: g
     } = t;
-    if (d === 1 && x === 1)
+    if (d === 1 && u === 1)
       return {
         xArr: [n, n],
         yArr: [e, e],
         rowspan: d,
-        colspan: x,
+        colspan: u,
         height: f,
-        width: u,
+        width: x,
         offsetTop: 0,
         offsetLeft: 0,
         dataList: [
@@ -2049,7 +2049,7 @@ class ni {
       };
     let w = e, y = e, E = n, m = n, C = [], b = 0, R = 0, S = 0, L = 0;
     if (d !== 1 && p) {
-      L = u;
+      L = x;
       const I = h.reduce((v, A) => {
         const O = this.getItemValue(s, A) ?? "";
         return `${v}${O}`;
@@ -2090,7 +2090,7 @@ class ni {
         });
       }
     }
-    if (x !== 1 && g) {
+    if (u !== 1 && g) {
       S = f;
       for (let I = n - 1; I >= 0; I--) {
         const v = this.getColumnByColIndex(I);
@@ -2134,7 +2134,7 @@ class ni {
       xArr: [E, m],
       yArr: [w, y],
       rowspan: d,
-      colspan: x,
+      colspan: u,
       height: S,
       width: L,
       offsetTop: b,
@@ -2424,8 +2424,8 @@ class ci {
     if (this.ctx.save(), this.ctx.beginPath(), n !== void 0 && (this.ctx.fillStyle = n), o !== void 0 && (this.ctx.lineWidth = r, this.ctx.strokeStyle = o), h === 0)
       this.ctx.rect(t - 0.5, e - 0.5, i, s);
     else {
-      const [c, d, f, u] = typeof h == "number" ? [h, h, h, h] : h;
-      this.ctx.moveTo(t + c, e), this.ctx.arcTo(t + i, e, t + i, e + d, d), this.ctx.arcTo(t + i, e + s, t + i - f, e + s, f), this.ctx.arcTo(t, e + s, t, e + s - u, u), this.ctx.arcTo(t, e, t + c, e, c);
+      const [c, d, f, x] = typeof h == "number" ? [h, h, h, h] : h;
+      this.ctx.moveTo(t + c, e), this.ctx.arcTo(t + i, e, t + i, e + d, d), this.ctx.arcTo(t + i, e + s, t + i - f, e + s, f), this.ctx.arcTo(t, e + s, t, e + s - x, x), this.ctx.arcTo(t, e, t + c, e, c);
     }
     n !== void 0 && this.ctx.fill(), o !== void 0 && this.ctx.stroke(), this.ctx.restore();
   }
@@ -2449,12 +2449,12 @@ class ci {
       verticalAlign: f = "middle"
     } = o;
     this.ctx.font = n, this.ctx.fillStyle = c, this.ctx.textBaseline = f, this.ctx.textAlign = h;
-    let u = 0;
-    f === "top" ? u = i + d : f === "bottom" ? u = i + r - d : u = i + (r + 1) / 2;
     let x = 0;
-    h === "left" ? x = e + d : h === "right" ? x = e + s - d : x = e + s / 2;
+    f === "top" ? x = i + d : f === "bottom" ? x = i + r - d : x = i + (r + 1) / 2;
+    let u = 0;
+    h === "left" ? u = e + d : h === "right" ? u = e + s - d : u = e + s / 2;
     const { _text: p, ellipsis: g } = this.handleEllipsis(t, s, d, n);
-    return this.ctx.fillText(p, x, u), this.ctx.restore(), g;
+    return this.ctx.fillText(p, u, x), this.ctx.restore(), g;
   }
   handleEllipsis(t, e, i = 0, s = "12px Arial") {
     let r = !1, o = t;
@@ -2832,8 +2832,8 @@ class re extends se {
     const { width: e, height: i, type: s } = this;
     if (["index-selection", "selection"].includes(s)) {
       const { indeterminate: r, check: o, selectable: n } = this.ctx.database.getCheckedState(), { CHECKBOX_SIZE: h = 0 } = this.ctx.config, c = this.drawX + (e - h) / 2, d = this.drawY + (i - h) / 2;
-      let f = this.ctx.icons.get("checkbox-uncheck"), u = "checkbox-uncheck";
-      r ? (f = this.ctx.icons.get("checkbox-indeterminate"), u = "checkbox-indeterminate") : o && n ? (f = this.ctx.icons.get("checkbox-check"), u = "checkbox-check") : o && n ? (f = this.ctx.icons.get("checkbox-check-disabled"), u = "checkbox-check-disabled") : !o && n ? (f = this.ctx.icons.get("checkbox-uncheck"), u = "checkbox-uncheck") : (f = this.ctx.icons.get("checkbox-disabled"), u = "checkbox-disabled"), f && (this.drawImageX = c, this.drawImageY = d, this.drawImageWidth = h, this.drawImageHeight = h, this.drawImageName = u, this.drawImageSource = f, this.ctx.paint.drawImage(
+      let f = this.ctx.icons.get("checkbox-uncheck"), x = "checkbox-uncheck";
+      r ? (f = this.ctx.icons.get("checkbox-indeterminate"), x = "checkbox-indeterminate") : o && n ? (f = this.ctx.icons.get("checkbox-check"), x = "checkbox-check") : o && n ? (f = this.ctx.icons.get("checkbox-check-disabled"), x = "checkbox-check-disabled") : !o && n ? (f = this.ctx.icons.get("checkbox-uncheck"), x = "checkbox-uncheck") : (f = this.ctx.icons.get("checkbox-disabled"), x = "checkbox-disabled"), f && (this.drawImageX = c, this.drawImageY = d, this.drawImageWidth = h, this.drawImageHeight = h, this.drawImageName = x, this.drawImageSource = f, this.ctx.paint.drawImage(
         this.drawImageSource,
         this.drawImageX,
         this.drawImageY,
@@ -3341,11 +3341,11 @@ class Pt {
       stageHeight: i,
       stageWidth: s,
       config: { SCROLLER_TRACK_SIZE: r = 0, SCROLLER_SIZE: o = 0 }
-    } = this.ctx, n = s, h = i, c = e.height, d = e.width, f = t.height, u = this.ctx.footer.height;
+    } = this.ctx, n = s, h = i, c = e.height, d = e.width, f = t.height, x = this.ctx.footer.height;
     if (this.type === "vertical") {
-      this.visibleDistance = h - r - c, this.distance = f - this.visibleDistance + u, this.trackX = n - r, this.trackY = 0, this.splitPoints = [this.trackX, c, this.trackX + r, c], this.trackWidth = r, this.trackHeight = h, this.barX = this.trackX - 1 + (r - o) / 2, this.barWidth = o;
-      const x = this.distance ? this.visibleDistance / (f + u) : 0;
-      let p = Math.floor(x * this.visibleDistance);
+      this.visibleDistance = h - r - c, this.distance = f - this.visibleDistance + x, this.trackX = n - r, this.trackY = 0, this.splitPoints = [this.trackX, c, this.trackX + r, c], this.trackWidth = r, this.trackHeight = h, this.barX = this.trackX - 1 + (r - o) / 2, this.barWidth = o;
+      const u = this.distance ? this.visibleDistance / (f + x) : 0;
+      let p = Math.floor(u * this.visibleDistance);
       p < 30 ? p = 30 : p > this.visibleDistance && (p = 0), this.barHeight = p, this.barY = c + this.scroll / this.distance * (this.visibleDistance - this.barHeight), this.scroll = Math.max(0, Math.min(this.scroll, this.distance));
     } else {
       this.visibleDistance = n - r, this.distance = d - this.visibleDistance, this.splitPoints = [
@@ -3354,8 +3354,8 @@ class Pt {
         n - r,
         h
       ], this.trackX = 0, this.trackY = h - r, this.trackWidth = n, this.trackHeight = r;
-      const x = this.distance ? this.visibleDistance / d : 0;
-      let p = Math.floor(x * this.visibleDistance);
+      const u = this.distance ? this.visibleDistance / d : 0;
+      let p = Math.floor(u * this.visibleDistance);
       this.barY = this.trackY - 1 + (r - o) / 2, p < 30 ? p = 30 : p >= this.visibleDistance && (p = 0), this.barWidth = p, this.barHeight = o, this.barX = this.scroll / this.distance * (this.visibleDistance - this.barWidth), this.scroll = Math.max(0, Math.min(this.scroll, this.distance));
     }
   }
@@ -3489,7 +3489,7 @@ class gi {
     } = this.ctx, i = this.ctx.database.getColumns();
     this.columns = i, this.allCellHeaders = [], this.leafCellHeaders = [], this.fixedLeftCellHeaders = [], this.fixedRightCellHeaders = [], this.centerCellHeaders = [];
     const s = Qt(i), r = It(i);
-    this.height = t * s, this.width = r.reduce((f, u) => f + ((u == null ? void 0 : u.width) || 100), 0), this.visibleHeight = this.height;
+    this.height = t * s, this.width = r.reduce((f, x) => f + ((x == null ? void 0 : x.width) || 100), 0), this.visibleHeight = this.height;
     const o = ti(te(i, s));
     this.columnIndex = 0, this.resizeNum = 0, this.render(o, 0), this.ctx.database.updateColIndexKeyMap(this.leafCellHeaders);
     const n = this.ctx.containerElement.getBoundingClientRect();
@@ -3500,9 +3500,9 @@ class gi {
       this.resizeAllColumn(f);
     }
     const c = this.fixedLeftCellHeaders.filter((f) => !f.hasChildren);
-    this.ctx.fixedLeftWidth = c.reduce((f, u) => f + u.width, 0);
+    this.ctx.fixedLeftWidth = c.reduce((f, x) => f + x.width, 0);
     const d = this.fixedRightCellHeaders.filter((f) => !f.hasChildren);
-    this.ctx.fixedRightWidth = d.reduce((f, u) => f + u.width, e), this.ctx.maxColIndex = this.leafCellHeaders.length - 1, this.ctx.header.x = this.x, this.ctx.header.y = this.y, this.ctx.header.width = this.width, this.ctx.header.height = this.height, this.ctx.header.visibleWidth = this.visibleWidth, this.ctx.header.visibleHeight = this.visibleHeight;
+    this.ctx.fixedRightWidth = d.reduce((f, x) => f + x.width, e), this.ctx.maxColIndex = this.leafCellHeaders.length - 1, this.ctx.header.x = this.x, this.ctx.header.y = this.y, this.ctx.header.width = this.width, this.ctx.header.height = this.height, this.ctx.header.visibleWidth = this.visibleWidth, this.ctx.header.visibleHeight = this.visibleHeight;
   }
   // 调整表头的宽度
   initResizeColumn() {
@@ -3587,7 +3587,7 @@ class gi {
     for (let o = 0; o < i; o++) {
       const n = t[o], h = r * (n.rowspan || 0), c = r * (n.level || 0);
       let d = n.width || 100;
-      n.children && (d = It(n.children).reduce((x, p) => x + ((p == null ? void 0 : p.width) || 100), 0));
+      n.children && (d = It(n.children).reduce((u, p) => u + ((p == null ? void 0 : p.width) || 100), 0));
       const f = new re(this.ctx, this.columnIndex, s, c, d, h, n);
       this.ctx.database.setHeader(n.key, f), this.allCellHeaders.push(f), n.children || (this.leafCellHeaders.push(f), f.column.widthFillDisable || this.resizeNum++), n.fixed === "left" ? this.fixedLeftCellHeaders.push(f) : n.fixed === "right" ? this.fixedRightCellHeaders.push(f) : this.centerCellHeaders.push(f), !n.children && this.columnIndex++, n.children && this.render(n.children, s), s += d;
     }
@@ -3740,14 +3740,14 @@ class wi {
         MAX_HEIGHT: c = 0,
         ENABLE_OFFSET_HEIGHT: d = 0,
         OFFSET_HEIGHT: f = 0,
-        FOOTER_POSITION: u
+        FOOTER_POSITION: x
       }
     } = this.ctx;
     if (!e.width)
       return;
-    this.x = 0, u === "top" && r ? this.y = e.height + i.height : this.y = e.height;
-    const { data: x, sumHeight: p } = s.getData();
-    this.height = p, this.data = x;
+    this.x = 0, x === "top" && r ? this.y = e.height + i.height : this.y = e.height;
+    const { data: u, sumHeight: p } = s.getData();
+    this.height = p, this.data = u;
     const { top: g } = t.getBoundingClientRect();
     this.width = e.width, this.visibleWidth = this.ctx.stageWidth - o;
     const w = this.ctx.footer.height;
@@ -3769,7 +3769,7 @@ class wi {
       "There is an error in the height calculation ENABLE_OFFSET_HEIGHT and OFFSET_HEIGHT are invalid"
     ))) : this.data.length && n ? m = n : this.data.length && c && E > c ? m = c : m = E, m > 0 && (this.ctx.stageHeight = Math.floor(m), this.ctx.stageElement.style.height = `${this.ctx.stageHeight - 0.5}px`);
     let C = this.ctx.stageHeight - e.height - o;
-    r ? this.visibleHeight = C - w : this.visibleHeight = C, this.ctx.body.x = this.x, this.ctx.body.y = this.y, this.ctx.body.width = this.width, this.ctx.body.height = this.height, this.ctx.body.visibleWidth = this.visibleWidth, this.ctx.body.visibleHeight = this.visibleHeight, this.ctx.body.data = x;
+    r ? this.visibleHeight = C - w : this.visibleHeight = C, this.ctx.body.x = this.x, this.ctx.body.y = this.y, this.ctx.body.width = this.width, this.ctx.body.height = this.height, this.ctx.body.visibleWidth = this.visibleWidth, this.ctx.body.visibleHeight = this.visibleHeight, this.ctx.body.data = u;
     const b = window.devicePixelRatio || 1, R = this.ctx.stageWidth * b, S = this.ctx.stageHeight * b;
     t.width = Math.floor(R), t.height = Math.floor(S), this.ctx.canvasElement.setAttribute(
       "style",
@@ -3796,18 +3796,18 @@ class wi {
       } = this.ctx;
       if (this.isResizing && this.resizeTarget) {
         const f = this.resizeTarget.height;
-        let u = n - this.clientY;
-        u + f < d && (u = -(f - d)), this.resizeDiff = u, this.ctx.emit("draw");
+        let x = n - this.clientY;
+        x + f < d && (x = -(f - d)), this.resizeDiff = x, this.ctx.emit("draw");
       } else {
         if (this.resizeTarget = null, this.isMouseDown || this.ctx.stageElement.style.cursor === "crosshair")
           return;
         this.ctx.stageElement.style.cursor === "row-resize" && (this.ctx.stageElement.style.cursor = "default");
         for (let f = 0; f < this.renderRows.length; f++) {
-          const u = this.renderRows[f];
-          if (r > u.y - c + u.height - 1.5 && r < u.y - c + u.height + 1.5 && r < h - 4)
-            for (let p = 0; p < u.cells.length; p++) {
-              const g = u.cells[p];
-              o > g.drawX + 10 && o < g.drawX + g.width - 10 && g.rowspan === 1 && (this.ctx.stageElement.style.cursor = "row-resize", this.resizeTarget = u);
+          const x = this.renderRows[f];
+          if (r > x.y - c + x.height - 1.5 && r < x.y - c + x.height + 1.5 && r < h - 4)
+            for (let p = 0; p < x.cells.length; p++) {
+              const g = x.cells[p];
+              o > g.drawX + 10 && o < g.drawX + g.width - 10 && g.rowspan === 1 && (this.ctx.stageElement.style.cursor = "row-resize", this.resizeTarget = x);
             }
         }
       }
@@ -3890,7 +3890,7 @@ class wi {
     this.headIndex = Math.max(0, h), this.tailIndex = Math.min(this.ctx.maxRowIndex, c + 1), this.visibleRows = o.slice(this.headIndex, this.tailIndex + 1), this.ctx.body.headIndex = this.headIndex, this.ctx.body.tailIndex = this.tailIndex, this.ctx.body.visibleRows = this.visibleRows;
     const d = [];
     for (let f = 0; f < this.visibleRows.length; f++) {
-      const u = this.headIndex + f, x = this.visibleRows[f], { height: p, top: g } = this.ctx.database.getPositionForRowIndex(u), w = new oe(this.ctx, u, 0, g + this.y, t.width, p, x);
+      const x = this.headIndex + f, u = this.visibleRows[f], { height: p, top: g } = this.ctx.database.getPositionForRowIndex(x), w = new oe(this.ctx, x, 0, g + this.y, t.width, p, u);
       d.push(w);
     }
     this.renderRows = d, this.ctx.body.renderRows = d;
@@ -3986,7 +3986,7 @@ class yi {
   }
   init() {
     this.ctx.on("focusout", () => {
-      this.ctx.clearSelector(), this.ctx.emit("draw");
+      this.ctx.clearSelector(), this.ctx.emit("drawView");
     }), this.ctx.on("setMoveFocus", (t) => {
       this.moveFocus(t);
     }), this.ctx.on(
@@ -4038,7 +4038,7 @@ class yi {
           t.preventDefault(), this.moveFocus("LEFT");
           return;
         }
-        if (t.code === "ArrowUp") {
+        if (t.code === "ArrowUp" || t.shiftKey && t.code === "Enter") {
           t.preventDefault(), this.moveFocus("TOP");
           return;
         }
@@ -4046,7 +4046,7 @@ class yi {
           t.preventDefault(), this.moveFocus("RIGHT");
           return;
         }
-        if (t.code === "ArrowDown" || t.code === "Enter") {
+        if (t.code === "ArrowDown" || !t.shiftKey && t.code === "Enter") {
           t.preventDefault(), this.moveFocus("BOTTOM");
           return;
         }
@@ -4091,16 +4091,16 @@ class yi {
         SELECTOR_AREA_MIN_Y: c,
         SELECTOR_AREA_MAX_Y: d,
         SELECTOR_AREA_MAX_X_OFFSET: f,
-        SELECTOR_AREA_MAX_Y_OFFSET: u
-      } = this.ctx.config, x = n, p = h || this.ctx.maxColIndex - f, g = c, w = d || this.ctx.maxRowIndex - u;
+        SELECTOR_AREA_MAX_Y_OFFSET: x
+      } = this.ctx.config, u = n, p = h || this.ctx.maxColIndex - f, g = c, w = d || this.ctx.maxRowIndex - x;
       let [y, E] = r, [m, C] = o;
-      if (y < x || E > p || m < g || C > w)
+      if (y < u || E > p || m < g || C > w)
         return;
       if (this.ctx.stageElement.focus(), this.ctx.config.ENABLE_MERGE_CELL_LINK) {
         const R = this.adjustMergeCells(r, o);
         m = R.yArr[0], C = R.yArr[1], y = R.xArr[0], E = R.xArr[1], this.ctx.onlyMergeCell = R.onlyMergeCell;
       }
-      y === E && m === C ? this.ctx.selectOnlyOne = !0 : this.ctx.selectOnlyOne = !1, r = [Math.max(x, y), Math.min(p, E)], o = [Math.max(g, m), Math.min(w, C)];
+      y === E && m === C ? this.ctx.selectOnlyOne = !0 : this.ctx.selectOnlyOne = !1, r = [Math.max(u, y), Math.min(p, E)], o = [Math.max(g, m), Math.min(w, C)];
       const { BEFORE_SET_SELECTOR_METHOD: b } = this.ctx.config;
       if (typeof b == "function") {
         const S = b({
@@ -4142,16 +4142,16 @@ class yi {
         minX: r,
         maxX: o
       }
-    ), f = [d.minX, d.maxX], u = [c.minY, c.maxY];
-    let x = !1;
+    ), f = [d.minX, d.maxX], x = [c.minY, c.maxY];
+    let u = !1;
     if (d.minX !== d.maxX || c.minY !== c.maxY) {
-      const g = JSON.stringify(f) + JSON.stringify(u), w = (p = this.ctx.focusCell) == null ? void 0 : p.getSpanInfo();
-      x = (w && JSON.stringify(w.xArr) + JSON.stringify(w.yArr)) === g;
+      const g = JSON.stringify(f) + JSON.stringify(x), w = (p = this.ctx.focusCell) == null ? void 0 : p.getSpanInfo();
+      u = (w && JSON.stringify(w.xArr) + JSON.stringify(w.yArr)) === g;
     }
     return {
       xArr: f,
-      yArr: u,
-      onlyMergeCell: x
+      yArr: x,
+      onlyMergeCell: u
     };
   }
   selectCols(t) {
@@ -4188,8 +4188,8 @@ class yi {
         SELECTOR_AREA_MAX_Y: o,
         SELECTOR_AREA_MAX_X_OFFSET: n,
         SELECTOR_AREA_MAX_Y_OFFSET: h
-      } = this.ctx.config, c = i, d = s || this.ctx.maxColIndex - n, f = r, u = o || this.ctx.maxRowIndex - h, x = [c, d], p = [f, u];
-      this.setSelector(x, p);
+      } = this.ctx.config, c = i, d = s || this.ctx.maxColIndex - n, f = r, x = o || this.ctx.maxRowIndex - h, u = [c, d], p = [f, x];
+      this.setSelector(u, p);
     }
   }
   selectRows(t, e = !0) {
@@ -4225,8 +4225,8 @@ class yi {
     const { focusCell: e, clickCell: i } = this.ctx;
     if (e && this.isInSettingRange(e.rowIndex, e.colIndex))
       if (this.ctx.selector.enable = !0, i && t) {
-        const { colIndex: s, rowIndex: r } = i, { colIndex: o, rowIndex: n } = e, h = Math.min(o, s), c = Math.max(o, s), d = Math.min(n, r), f = Math.max(n, r), u = [h, c], x = [d, f];
-        this.setSelector(u, x);
+        const { colIndex: s, rowIndex: r } = i, { colIndex: o, rowIndex: n } = e, h = Math.min(o, s), c = Math.max(o, s), d = Math.min(n, r), f = Math.max(n, r), x = [h, c], u = [d, f];
+        this.setSelector(x, u);
       } else {
         this.ctx.emit("cellSelectedClick", e);
         const s = [e.colIndex, e.colIndex], r = [e.rowIndex, e.rowIndex];
@@ -4294,10 +4294,10 @@ class yi {
       for (let h = 0; h <= t[1] - t[0]; h++) {
         const c = n + e[0], d = h + t[0], f = this.ctx.database.getItemValueForRowIndexAndColIndex(c, d);
         if (f) {
-          const { rowKey: u, key: x } = f;
-          this.ctx.database.getReadonly(u, x) || (r.add(u), s.push({
-            rowKey: u,
-            key: x,
+          const { rowKey: x, key: u } = f;
+          this.ctx.database.getReadonly(x, u) || (r.add(x), s.push({
+            rowKey: x,
+            key: u,
             value: null,
             row: {}
             //内部有设置
@@ -4326,18 +4326,18 @@ class yi {
         let o = ii(r);
         const n = [i, i + o[0].length - 1], h = [e, e + o.length - 1], c = o.length === 1 && o[0].length === 1;
         if (this.ctx.config.ENABLE_MERGE_CELL_LINK && this.ctx.database.hasMergeCell(n, h) && !c) {
-          const x = {
+          const u = {
             code: "ERR_MERGED_CELLS_PASTE",
             message: "Merged cells cannot span paste data"
           };
-          this.ctx.hasEvent("error") ? this.ctx.emit("error", x) : alert(x.message);
+          this.ctx.hasEvent("error") ? this.ctx.emit("error", u) : alert(u.message);
           return;
         }
         let d = [];
-        for (let x = 0; x <= o.length - 1; x++) {
-          const p = o[x].length;
+        for (let u = 0; u <= o.length - 1; u++) {
+          const p = o[u].length;
           for (let g = 0; g <= p - 1; g++) {
-            const w = x + e, y = g + i, E = o[x][g], m = this.ctx.database.getItemValueForRowIndexAndColIndex(
+            const w = u + e, y = g + i, E = o[u][g], m = this.ctx.database.getItemValueForRowIndexAndColIndex(
               w,
               y
             );
@@ -4354,13 +4354,13 @@ class yi {
           }
         }
         if (this.isCut) {
-          const x = this.clearSelectedData(
+          const u = this.clearSelectedData(
             this.ctx.selector.xArrCopy,
             this.ctx.selector.yArrCopy,
             !0
             // 忽略设置，只返回数据，用于cut，实现历史回退需要返回两次问题
           ), p = d.map((g) => `${g.rowKey}-${g.key}`);
-          x.forEach((g) => {
+          u.forEach((g) => {
             p.includes(`${g.rowKey}-${g.key}`) || d.unshift(g);
           }), this.isCut = !1;
         }
@@ -4368,21 +4368,21 @@ class yi {
           return;
         const { BEFORE_PASTE_DATA_METHOD: f } = this.ctx.config;
         if (typeof f == "function") {
-          const x = f, p = d.map((g) => ({
+          const u = f, p = d.map((g) => ({
             rowKey: g.rowKey,
             key: g.key,
             value: g.value,
             oldValue: this.ctx.database.getItemValue(g.rowKey, g.key),
             row: this.ctx.database.getRowDataItemForRowKey(g.rowKey)
           }));
-          if (d = await x(p, n, h), d && !d.length)
+          if (d = await u(p, n, h), d && !d.length)
             return;
         }
         this.clearCopyLine(), this.ctx.batchSetItemValueByEditor(d, !0);
-        let u = [];
-        s.forEach((x) => {
-          u.push(this.ctx.database.getRowDataItemForRowKey(x));
-        }), this.ctx.emit("pasteChange", d, u);
+        let x = [];
+        s.forEach((u) => {
+          x.push(this.ctx.database.getRowDataItemForRowKey(u));
+        }), this.ctx.emit("pasteChange", d, x);
       }).catch((r) => {
         console.error("Failed to get the clipboard content:", r);
       });
@@ -4428,8 +4428,8 @@ class yi {
       SELECTOR_AREA_MAX_Y: o,
       SELECTOR_AREA_MAX_X_OFFSET: n,
       SELECTOR_AREA_MAX_Y_OFFSET: h
-    } = this.ctx.config, c = i, d = s || this.ctx.maxColIndex - n, f = r, u = o || this.ctx.maxRowIndex - h;
-    return !(e < c || e > d || t < f || t > u);
+    } = this.ctx.config, c = i, d = s || this.ctx.maxColIndex - n, f = r, x = o || this.ctx.maxRowIndex - h;
+    return !(e < c || e > d || t < f || t > x);
   }
   /**
    * 调整滚动条位置，让到达边界时自动滚动
@@ -4471,7 +4471,7 @@ class yi {
       body: h,
       scrollX: c,
       scrollY: d,
-      config: { SCROLLER_TRACK_SIZE: f, FOOTER_FIXED: u, FOOTER_POSITION: x, ENABLE_MERGE_CELL_LINK: p }
+      config: { SCROLLER_TRACK_SIZE: f, FOOTER_FIXED: x, FOOTER_POSITION: u, ENABLE_MERGE_CELL_LINK: p }
     } = this.ctx;
     if (!i)
       return;
@@ -4480,7 +4480,7 @@ class yi {
     let R = o.height - w, S = E;
     S > h.visibleHeight && (S = h.visibleHeight);
     let L = 0;
-    u && (x === "top" ? R = o.height + n.height - w : L = n.visibleHeight);
+    x && (u === "top" ? R = o.height + n.height - w : L = n.visibleHeight);
     const I = w + S - (t - L - f);
     let v = c, A = d;
     b > 0 && !m ? v = Math.floor(c + b) : C > 0 && !m && (v = Math.floor(c - C)), R > 0 ? A = Math.floor(d - R) : I > 0 && (A = Math.floor(d + I)), (Math.abs(c - v) > 2 || Math.abs(d - A) > 2) && (this.ctx.adjustPositioning = !0, this.ctx.setScroll(v, A), this.ctx.emit("adjustBoundaryPosition", i));
@@ -4497,9 +4497,9 @@ class mi {
   init() {
     this.ctx.on("cellMouseenter", (t, e) => {
       this.ctx.stageElement.style.cursor === "crosshair" && (this.ctx.stageElement.style.cursor = "default");
-      const { offsetX: i, offsetY: s } = this.ctx.getOffset(e), { xArr: r, yArr: o } = this.ctx.selector, n = r[1], h = o[1], { colIndex: c, rowIndex: d, drawX: f, drawY: u, width: x, height: p } = t;
+      const { offsetX: i, offsetY: s } = this.ctx.getOffset(e), { xArr: r, yArr: o } = this.ctx.selector, n = r[1], h = o[1], { colIndex: c, rowIndex: d, drawX: f, drawY: x, width: u, height: p } = t;
       if (this.ctx.config.ENABLE_AUTOFILL && c === n && d === h) {
-        const w = f + x - 6, y = u + p - 6;
+        const w = f + u - 6, y = x + p - 6;
         i > w && s > y && (this.ctx.stageElement.style.cursor = "crosshair");
       }
       this.mouseenter(t);
@@ -4544,9 +4544,9 @@ class mi {
         SELECTOR_AREA_MAX_X: c,
         SELECTOR_AREA_MIN_Y: d,
         SELECTOR_AREA_MAX_Y: f,
-        SELECTOR_AREA_MAX_X_OFFSET: u,
-        SELECTOR_AREA_MAX_Y_OFFSET: x
-      } = this.ctx.config, p = h, g = c || this.ctx.maxColIndex - u, w = d, y = f || this.ctx.maxRowIndex - x;
+        SELECTOR_AREA_MAX_X_OFFSET: x,
+        SELECTOR_AREA_MAX_Y_OFFSET: u
+      } = this.ctx.config, p = h, g = c || this.ctx.maxColIndex - x, w = d, y = f || this.ctx.maxRowIndex - u;
       let [E, m] = o, [C, b] = n;
       if (E < p || C < w)
         return;
@@ -4570,24 +4570,24 @@ class mi {
    */
   async autofillData() {
     const t = /* @__PURE__ */ new Set(), e = this.ctx.getSelectedData(), i = /* @__PURE__ */ new Map();
-    for (let x = 0; x <= e.yArr[1] - e.yArr[0]; x++)
+    for (let u = 0; u <= e.yArr[1] - e.yArr[0]; u++)
       for (let p = 0; p <= e.xArr[1] - e.xArr[0]; p++) {
-        const g = x + e.yArr[0], w = p + e.xArr[0];
+        const g = u + e.yArr[0], w = p + e.xArr[0];
         i.set(`${g}-${w}`, !0);
       }
     const { value: s } = e, r = s[0].length, o = s.length, n = this.ctx.autofill.xArr, h = this.ctx.autofill.yArr, c = r === 1 && o === 1;
     if (this.ctx.config.ENABLE_MERGE_CELL_LINK && this.ctx.database.hasMergeCell(n, h) && !c) {
-      const x = {
+      const u = {
         code: "ERR_MERGED_CELLS_AUTOFILL",
         message: "Merged cells cannot span autofill data"
       };
-      this.ctx.hasEvent("error") ? this.ctx.emit("error", x) : alert(x.message);
+      this.ctx.hasEvent("error") ? this.ctx.emit("error", u) : alert(u.message);
       return;
     }
     let d = [];
-    for (let x = 0; x <= h[1] - h[0]; x++)
+    for (let u = 0; u <= h[1] - h[0]; u++)
       for (let p = 0; p <= n[1] - n[0]; p++) {
-        const g = p + n[0], w = x + h[0], y = s[x % o][p % r], E = this.ctx.database.getItemValueForRowIndexAndColIndex(w, g), m = `${w}-${g}`;
+        const g = p + n[0], w = u + h[0], y = s[u % o][p % r], E = this.ctx.database.getItemValueForRowIndexAndColIndex(w, g), m = `${w}-${g}`;
         if (E && !i.has(m)) {
           const { rowKey: C, key: b } = E;
           this.ctx.database.getReadonly(C, b) || (t.add(C), d.push({
@@ -4603,21 +4603,21 @@ class mi {
     this.ctx.selector.xArr = this.ctx.autofill.xArr, this.ctx.selector.yArr = this.ctx.autofill.yArr;
     const { BEFORE_AUTOFILL_DATA_METHOD: f } = this.ctx.config;
     if (typeof f == "function") {
-      const x = f, p = d.map((g) => ({
+      const u = f, p = d.map((g) => ({
         rowKey: g.rowKey,
         key: g.key,
         value: g.value,
         oldValue: this.ctx.database.getItemValue(g.rowKey, g.key),
         row: this.ctx.database.getRowDataItemForRowKey(g.rowKey)
       }));
-      if (d = await x(p, n, h), d && !d.length)
+      if (d = await u(p, n, h), d && !d.length)
         return;
     }
     this.ctx.batchSetItemValueByEditor(d, !0);
-    let u = [];
-    t.forEach((x) => {
-      u.push(this.ctx.database.getRowDataItemForRowKey(x));
-    }), this.ctx.emit("autofillChange", d, u);
+    let x = [];
+    t.forEach((u) => {
+      x.push(this.ctx.database.getRowDataItemForRowKey(u));
+    }), this.ctx.emit("autofillChange", d, x);
   }
   mouseenter(t) {
     if (["index", "selection", "index-selection"].includes(t.type))
@@ -4741,48 +4741,48 @@ function zt(a, t, e) {
     reference: i,
     floating: s
   } = a;
-  const r = J(t), o = Ht(t), n = Mt(o), h = q(t), c = r === "y", d = i.x + i.width / 2 - s.width / 2, f = i.y + i.height / 2 - s.height / 2, u = i[n] / 2 - s[n] / 2;
-  let x;
+  const r = J(t), o = Ht(t), n = Mt(o), h = q(t), c = r === "y", d = i.x + i.width / 2 - s.width / 2, f = i.y + i.height / 2 - s.height / 2, x = i[n] / 2 - s[n] / 2;
+  let u;
   switch (h) {
     case "top":
-      x = {
+      u = {
         x: d,
         y: i.y - s.height
       };
       break;
     case "bottom":
-      x = {
+      u = {
         x: d,
         y: i.y + i.height
       };
       break;
     case "right":
-      x = {
+      u = {
         x: i.x + i.width,
         y: f
       };
       break;
     case "left":
-      x = {
+      u = {
         x: i.x - s.width,
         y: f
       };
       break;
     default:
-      x = {
+      u = {
         x: i.x,
         y: i.y
       };
   }
   switch (lt(t)) {
     case "start":
-      x[o] -= u * (e && c ? -1 : 1);
+      u[o] -= x * (e && c ? -1 : 1);
       break;
     case "end":
-      x[o] += u * (e && c ? -1 : 1);
+      u[o] += x * (e && c ? -1 : 1);
       break;
   }
-  return x;
+  return u;
 }
 const Oi = async (a, t, e) => {
   const {
@@ -4798,7 +4798,7 @@ const Oi = async (a, t, e) => {
   }), {
     x: d,
     y: f
-  } = zt(c, i, h), u = i, x = {}, p = 0;
+  } = zt(c, i, h), x = i, u = {}, p = 0;
   for (let g = 0; g < n.length; g++) {
     const {
       name: w,
@@ -4812,9 +4812,9 @@ const Oi = async (a, t, e) => {
       x: d,
       y: f,
       initialPlacement: i,
-      placement: u,
+      placement: x,
       strategy: s,
-      middlewareData: x,
+      middlewareData: u,
       rects: c,
       platform: o,
       elements: {
@@ -4822,27 +4822,27 @@ const Oi = async (a, t, e) => {
         floating: t
       }
     });
-    d = E ?? d, f = m ?? f, x = {
-      ...x,
+    d = E ?? d, f = m ?? f, u = {
+      ...u,
       [w]: {
-        ...x[w],
+        ...u[w],
         ...C
       }
-    }, b && p <= 50 && (p++, typeof b == "object" && (b.placement && (u = b.placement), b.rects && (c = b.rects === !0 ? await o.getElementRects({
+    }, b && p <= 50 && (p++, typeof b == "object" && (b.placement && (x = b.placement), b.rects && (c = b.rects === !0 ? await o.getElementRects({
       reference: a,
       floating: t,
       strategy: s
     }) : b.rects), {
       x: d,
       y: f
-    } = zt(c, u, h)), g = -1);
+    } = zt(c, x, h)), g = -1);
   }
   return {
     x: d,
     y: f,
-    placement: u,
+    placement: x,
     strategy: s,
-    middlewareData: x
+    middlewareData: u
   };
 };
 async function le(a, t) {
@@ -4859,9 +4859,9 @@ async function le(a, t) {
     boundary: c = "clippingAncestors",
     rootBoundary: d = "viewport",
     elementContext: f = "floating",
-    altBoundary: u = !1,
-    padding: x = 0
-  } = at(t, a), p = ae(x), w = n[u ? f === "floating" ? "reference" : "floating" : f], y = ut(await r.getClippingRect({
+    altBoundary: x = !1,
+    padding: u = 0
+  } = at(t, a), p = ae(u), w = n[x ? f === "floating" ? "reference" : "floating" : f], y = ut(await r.getClippingRect({
     element: (e = await (r.isElement == null ? void 0 : r.isElement(w))) == null || e ? w : w.contextElement || await (r.getDocumentElement == null ? void 0 : r.getDocumentElement(n.floating)),
     boundary: c,
     rootBoundary: d,
@@ -4908,17 +4908,17 @@ const Si = (a) => ({
     } = at(a, t) || {};
     if (c == null)
       return {};
-    const f = ae(d), u = {
+    const f = ae(d), x = {
       x: e,
       y: i
-    }, x = Ht(s), p = Mt(x), g = await o.getDimensions(c), w = x === "y", y = w ? "top" : "left", E = w ? "bottom" : "right", m = w ? "clientHeight" : "clientWidth", C = r.reference[p] + r.reference[x] - u[x] - r.floating[p], b = u[x] - r.reference[x], R = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(c));
+    }, u = Ht(s), p = Mt(u), g = await o.getDimensions(c), w = u === "y", y = w ? "top" : "left", E = w ? "bottom" : "right", m = w ? "clientHeight" : "clientWidth", C = r.reference[p] + r.reference[u] - x[u] - r.floating[p], b = x[u] - r.reference[u], R = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(c));
     let S = R ? R[m] : 0;
     (!S || !await (o.isElement == null ? void 0 : o.isElement(R))) && (S = n.floating[m] || r.floating[p]);
     const L = C / 2 - b / 2, I = S / 2 - g[p] / 2 - 1, v = rt(f[y], I), A = rt(f[E], I), O = v, M = S - g[p] - A, T = S / 2 - g[p] / 2 + L, N = _t(O, T, M), Y = !h.arrow && lt(s) != null && T !== N && r.reference[p] / 2 - (T < O ? v : A) - g[p] / 2 < 0, K = Y ? T < O ? T - O : T - M : 0;
     return {
-      [x]: u[x] + K,
+      [u]: x[u] + K,
       data: {
-        [x]: N,
+        [u]: N,
         centerOffset: T - N - K,
         ...Y && {
           alignmentOffset: K
@@ -4943,16 +4943,16 @@ const Si = (a) => ({
       } = t, {
         mainAxis: d = !0,
         crossAxis: f = !0,
-        fallbackPlacements: u,
-        fallbackStrategy: x = "bestFit",
+        fallbackPlacements: x,
+        fallbackStrategy: u = "bestFit",
         fallbackAxisSideDirection: p = "none",
         flipAlignment: g = !0,
         ...w
       } = at(a, t);
       if ((e = r.arrow) != null && e.alignmentOffset)
         return {};
-      const y = q(s), E = J(n), m = q(n) === n, C = await (h.isRTL == null ? void 0 : h.isRTL(c.floating)), b = u || (m || !g ? [xt(n)] : vi(n)), R = p !== "none";
-      !u && R && b.push(...Ii(n, g, p, C));
+      const y = q(s), E = J(n), m = q(n) === n, C = await (h.isRTL == null ? void 0 : h.isRTL(c.floating)), b = x || (m || !g ? [xt(n)] : vi(n)), R = p !== "none";
+      !x && R && b.push(...Ii(n, g, p, C));
       const S = [n, ...b], L = await le(t, w), I = [];
       let v = ((i = r.flip) == null ? void 0 : i.overflows) || [];
       if (d && I.push(L[y]), f) {
@@ -4977,7 +4977,7 @@ const Si = (a) => ({
           };
         let Y = (O = v.filter((K) => K.overflows[0] <= 0).sort((K, W) => K.overflows[1] - W.overflows[1])[0]) == null ? void 0 : O.placement;
         if (!Y)
-          switch (x) {
+          switch (u) {
             case "bestFit": {
               var M;
               const K = (M = v.filter((W) => {
@@ -5014,8 +5014,8 @@ async function Ai(a, t) {
     elements: s
   } = a, r = await (i.isRTL == null ? void 0 : i.isRTL(s.floating)), o = q(e), n = lt(e), h = J(e) === "y", c = ["left", "top"].includes(o) ? -1 : 1, d = r && h ? -1 : 1, f = at(t, a);
   let {
-    mainAxis: u,
-    crossAxis: x,
+    mainAxis: x,
+    crossAxis: u,
     alignmentAxis: p
   } = typeof f == "number" ? {
     mainAxis: f,
@@ -5026,12 +5026,12 @@ async function Ai(a, t) {
     crossAxis: f.crossAxis || 0,
     alignmentAxis: f.alignmentAxis
   };
-  return n && typeof p == "number" && (x = n === "end" ? p * -1 : p), h ? {
-    x: x * d,
-    y: u * c
+  return n && typeof p == "number" && (u = n === "end" ? p * -1 : p), h ? {
+    x: u * d,
+    y: x * c
   } : {
-    x: u * c,
-    y: x * d
+    x: x * c,
+    y: u * d
   };
 }
 const Ti = function(a) {
@@ -5084,11 +5084,11 @@ const Ti = function(a) {
       } = at(a, t), c = {
         x: e,
         y: i
-      }, d = await le(t, h), f = J(q(s)), u = ne(f);
-      let x = c[u], p = c[f];
+      }, d = await le(t, h), f = J(q(s)), x = ne(f);
+      let u = c[x], p = c[f];
       if (r) {
-        const w = u === "y" ? "top" : "left", y = u === "y" ? "bottom" : "right", E = x + d[w], m = x - d[y];
-        x = _t(E, x, m);
+        const w = x === "y" ? "top" : "left", y = x === "y" ? "bottom" : "right", E = u + d[w], m = u - d[y];
+        u = _t(E, u, m);
       }
       if (o) {
         const w = f === "y" ? "top" : "left", y = f === "y" ? "bottom" : "right", E = p + d[w], m = p - d[y];
@@ -5096,7 +5096,7 @@ const Ti = function(a) {
       }
       const g = n.fn({
         ...t,
-        [u]: x,
+        [x]: u,
         [f]: p
       });
       return {
@@ -5105,7 +5105,7 @@ const Ti = function(a) {
           x: g.x - e,
           y: g.y - i,
           enabled: {
-            [u]: r,
+            [x]: r,
             [f]: o
           }
         }
@@ -5269,9 +5269,9 @@ function ot(a, t, e, i) {
   const n = Xi(r, e, i) ? xe(r) : z(0);
   let h = (s.left + n.x) / o.x, c = (s.top + n.y) / o.y, d = s.width / o.x, f = s.height / o.y;
   if (r) {
-    const u = F(r), x = i && X(i) ? F(i) : i;
-    let p = u, g = Lt(p);
-    for (; g && i && x !== p; ) {
+    const x = F(r), u = i && X(i) ? F(i) : i;
+    let p = x, g = Lt(p);
+    for (; g && i && u !== p; ) {
       const w = Z(g), y = g.getBoundingClientRect(), E = k(g), m = y.left + (g.clientLeft + parseFloat(E.paddingLeft)) * w.x, C = y.top + (g.clientTop + parseFloat(E.paddingTop)) * w.y;
       h *= w.x, c *= w.y, d *= w.x, f *= w.y, h += m, c += C, p = F(g), g = Lt(p);
     }
@@ -5299,8 +5299,8 @@ function ki(a) {
   }, c = z(1);
   const d = z(0), f = B(i);
   if ((f || !f && !r) && ((tt(i) !== "body" || ht(o)) && (h = pt(i)), B(i))) {
-    const u = ot(i);
-    c = Z(i), d.x = u.x + i.clientLeft, d.y = u.y + i.clientTop;
+    const x = ot(i);
+    c = Z(i), d.x = x.x + i.clientLeft, d.y = x.y + i.clientTop;
   }
   return {
     width: e.width * c.x,
@@ -5423,19 +5423,19 @@ function zi(a, t, e) {
   const h = z(0);
   if (i || !i && !r)
     if ((tt(t) !== "body" || ht(s)) && (n = pt(t)), i) {
-      const x = ot(t, !0, r, t);
-      h.x = x.x + t.clientLeft, h.y = x.y + t.clientTop;
+      const u = ot(t, !0, r, t);
+      h.x = u.x + t.clientLeft, h.y = u.y + t.clientTop;
     } else s && (h.x = At(s));
   let c = 0, d = 0;
   if (s && !i && !r) {
-    const x = s.getBoundingClientRect();
-    d = x.top + n.scrollTop, c = x.left + n.scrollLeft - // RTL <body> scrollbar.
-    At(s, x);
+    const u = s.getBoundingClientRect();
+    d = u.top + n.scrollTop, c = u.left + n.scrollLeft - // RTL <body> scrollbar.
+    At(s, u);
   }
-  const f = o.left + n.scrollLeft - h.x - c, u = o.top + n.scrollTop - h.y - d;
+  const f = o.left + n.scrollLeft - h.x - c, x = o.top + n.scrollTop - h.y - d;
   return {
     x: f,
-    y: u,
+    y: x,
     width: o.width,
     height: o.height
   };
@@ -5587,26 +5587,26 @@ let Ui = class {
         top: `${c}px`,
         left: `${h}px`
       }), f.arrow) {
-        const u = f.arrow;
+        const x = f.arrow;
         ["left", "left-start", "left-end"].includes(d) ? Object.assign(this.arrowEl.style, {
-          top: `${u.y}px`,
+          top: `${x.y}px`,
           bottom: "",
           left: "",
           right: "-5px"
         }) : ["right", "right-start", "right-end"].includes(d) ? Object.assign(this.arrowEl.style, {
-          top: `${u.y}px`,
+          top: `${x.y}px`,
           bottom: "",
           left: "-5px",
           right: ""
         }) : ["bottom", "bottom-start", "bottom-end"].includes(d) ? Object.assign(this.arrowEl.style, {
           top: "-5px",
           bottom: "",
-          left: `${u.x}px`,
+          left: `${x.x}px`,
           right: ""
         }) : ["top", "top-start", "top-end"].includes(d) && Object.assign(this.arrowEl.style, {
           top: "",
           bottom: "-5px",
-          left: `${u.x}px`,
+          left: `${x.x}px`,
           right: ""
         });
       }
@@ -5629,11 +5629,12 @@ class Zi {
     l(this, "ctx");
     l(this, "drawY", 0);
     l(this, "drawX", 0);
+    l(this, "cancel", !1);
     this.ctx = t, this.initTextEditor(), this.init();
   }
   init() {
-    this.ctx.on("focusout", () => {
-      this.ctx.editing || (this.cellTarget = null);
+    this.ctx.on("focusout", (t) => {
+      t.target !== this.ctx.stageElement && (this.ctx.editing && this.doneEdit(), this.cellTarget = null);
     }), this.ctx.on("onScroll", () => {
       this.enable && this.doneEdit();
     }), this.ctx.on("cellHeaderMousedown", () => {
@@ -5641,9 +5642,32 @@ class Zi {
     }), this.ctx.on("keydown", (t) => {
       if (!this.ctx.isTarget())
         return;
+      if (t.code === "Escape" && this.ctx.editing) {
+        this.cancel = !0;
+        const { focusCell: h } = this.ctx;
+        h && (this.ctx.emit("setSelectorCell", h), this.cellTarget = h), this.doneEdit();
+        return;
+      }
+      if ((t.altKey || t.metaKey) && t.code === "Enter" && this.ctx.editing && this.inputEl) {
+        t.preventDefault();
+        const h = this.inputEl.selectionStart, c = this.inputEl.value.substring(0, h), d = this.inputEl.value.substring(h);
+        this.inputEl.value = c + `
+` + d, this.inputEl.selectionStart = this.inputEl.selectionEnd = h + 1, this.autoSize();
+        return;
+      }
+      if (t.code === "Enter" && this.ctx.editing) {
+        t.preventDefault(), this.doneEdit();
+        const { focusCell: h } = this.ctx;
+        if (h && (this.ctx.emit("setSelectorCell", h), this.cellTarget = h), t.shiftKey) {
+          this.ctx.emit("setMoveFocus", "TOP");
+          return;
+        }
+        this.ctx.emit("setMoveFocus", "BOTTOM");
+        return;
+      }
       const e = t.key, i = t.ctrlKey, s = t.altKey, r = t.shiftKey, o = t.metaKey;
       i || s || r || o || [
-        // "Enter",
+        "Enter",
         "Escape",
         "Tab",
         "Backspace",
@@ -5668,9 +5692,8 @@ class Zi {
         "F9",
         "F10",
         "F11",
-        "F12",
-        "Enter"
-      ].includes(e) || this.startEdit();
+        "F12"
+      ].includes(e) || this.startEdit(!0);
     }), this.ctx.on("adjustBoundaryPosition", (t) => {
       this.cellTarget = t;
       const { xArr: e, yArr: i } = this.ctx.selector;
@@ -5703,20 +5726,7 @@ class Zi {
     return !(e < r || e > o || t < n || t > h);
   }
   initTextEditor() {
-    this.inputEl = document.createElement("textarea"), this.inputEl.setAttribute("rows", "1"), this.inputEl.addEventListener("keydown", (t) => {
-      if (!t.isComposing && this.enable) {
-        if (t.stopPropagation(), (t.altKey || t.metaKey) && t.code === "Enter") {
-          t.preventDefault();
-          const e = this.inputEl.selectionStart, i = this.inputEl.value.substring(0, e), s = this.inputEl.value.substring(e);
-          this.inputEl.value = i + `
-` + s, this.inputEl.selectionStart = this.inputEl.selectionEnd = e + 1, this.autoSize();
-          return;
-        }
-        (t.code === "Escape" || t.code === "Enter") && (t.preventDefault(), this.inputEl.blur(), this.ctx.emit("setMoveFocus", "BOTTOM"));
-      }
-    }), this.inputEl.addEventListener("input", this.autoSize.bind(this)), this.inputEl.addEventListener("blur", () => {
-      this.doneEdit();
-    }), this.editorEl = this.ctx.editorElement, this.inputEl.className = "e-virt-table-editor-textarea", this.editorEl.appendChild(this.inputEl), this.ctx.containerElement.appendChild(this.editorEl);
+    this.inputEl = document.createElement("textarea"), this.inputEl.setAttribute("rows", "1"), this.inputEl.addEventListener("input", this.autoSize.bind(this)), this.editorEl = this.ctx.editorElement, this.inputEl.className = "e-virt-table-editor-textarea", this.editorEl.appendChild(this.inputEl), this.ctx.containerElement.appendChild(this.editorEl);
   }
   autoSize() {
     this.inputEl.style.height = "auto";
@@ -5730,42 +5740,43 @@ class Zi {
     } = this.ctx, n = i - s.height - o;
     this.editorEl.style.bottom = "auto", this.drawY < r.height && (this.editorEl.style.top = `${r.height - 1}px`), this.drawY + t > n && (this.editorEl.style.left = `${this.drawX - 1}px`, this.editorEl.style.top = "auto", this.editorEl.style.bottom = `${i - n}px`), this.inputEl.style.height = `${t}px`;
   }
-  startEditByInput(t) {
-    const e = t.getValue(), { editorType: i } = t;
+  startEditByInput(t, e = !1) {
+    const i = e ? null : t.getValue(), { editorType: s } = t;
     this.ctx.config.ENABLE_MERGE_CELL_LINK && t.updateSpanInfo();
-    let { drawX: s, drawY: r, height: o, width: n } = t;
-    this.drawX = s, this.drawY = r;
+    let { drawX: r, drawY: o, height: n, width: h } = t;
+    this.drawX = r, this.drawY = o;
     const {
-      config: { CELL_PADDING: h },
-      header: c
+      config: { CELL_PADDING: c },
+      header: d
     } = this.ctx;
-    let d = this.ctx.body.visibleHeight;
-    if (o > d && (o = d), this.editorEl.style.display = "inline-block", this.editorEl.style.left = `${s - 1}px`, this.editorEl.style.top = `${r - 1}px`, this.editorEl.style.bottom = "auto", this.editorEl.style.maxHeight = `${d}px`, i === "text") {
-      this.inputEl.style.display = "block", this.inputEl.style.minWidth = `${n - 1}px`, this.inputEl.style.minHeight = `${o - 1}px`, this.inputEl.style.maxHeight = `${d}px`, this.inputEl.style.width = `${n - 1}px`, this.inputEl.style.height = "auto", this.inputEl.style.padding = `${h}px`, e !== null && (this.inputEl.value = e), this.inputEl.focus();
-      const f = this.inputEl.value.length;
-      this.inputEl.setSelectionRange(f, f);
+    let f = this.ctx.body.visibleHeight;
+    if (n > f && (n = f), this.editorEl.style.display = "inline-block", this.editorEl.style.left = `${r - 1}px`, this.editorEl.style.top = `${o - 1}px`, this.editorEl.style.bottom = "auto", this.editorEl.style.maxHeight = `${f}px`, s === "text") {
+      this.inputEl.style.display = "block", this.inputEl.style.minWidth = `${h - 1}px`, this.inputEl.style.minHeight = `${n - 1}px`, this.inputEl.style.maxHeight = `${f}px`, this.inputEl.style.width = `${h - 1}px`, this.inputEl.style.height = "auto", this.inputEl.style.padding = `${c}px`, i !== null && (this.inputEl.value = i), this.inputEl.focus();
+      const x = this.inputEl.value.length;
+      this.inputEl.setSelectionRange(x, x);
     } else
       this.inputEl.style.display = "none";
-    (this.inputEl.scrollHeight > o || r < c.height) && this.autoSize();
+    (this.inputEl.scrollHeight > n || o < d.height) && this.autoSize();
   }
   doneEditByInput() {
     if (this.cellTarget && (this.editorEl.style.display = "none", this.cellTarget.editorType === "text")) {
       const { rowKey: t, key: e } = this.cellTarget, i = this.cellTarget.getValue(), s = this.inputEl.value;
-      s !== i && !(s === "" && i === null) && this.ctx.setItemValueByEditor(t, e, s, !0), this.inputEl.value = "";
+      s !== i && !(s === "" && i === null) && !this.cancel && this.ctx.setItemValueByEditor(t, e, s, !0), this.inputEl.value = "";
     }
   }
-  startEdit() {
-    const { ENABLE_EDIT_CLICK_SELECTOR: t } = this.ctx.config;
-    if (!t)
+  startEdit(t = !1) {
+    this.cancel = !1;
+    const { ENABLE_EDIT_CLICK_SELECTOR: e } = this.ctx.config;
+    if (!e)
       return;
-    const e = this.ctx.focusCell;
-    if (!e || ["index", "index-selection", "selection"].includes(e.type) || this.enable)
+    const i = this.ctx.focusCell;
+    if (!i || ["index", "index-selection", "selection"].includes(i.type) || this.enable)
       return;
-    const { rowKey: i, key: s, editorType: r } = e;
-    if (r === "none")
+    const { rowKey: s, key: r, editorType: o } = i;
+    if (o === "none")
       return;
-    const o = this.ctx.database.getReadonly(i, s);
-    e && !o && (this.enable = !0, this.ctx.editing = !0, this.cellTarget = e, this.startEditByInput(this.cellTarget), this.ctx.emit("startEdit", this.cellTarget));
+    const n = this.ctx.database.getReadonly(s, r);
+    i && !n && (this.enable = !0, this.ctx.editing = !0, this.cellTarget = i, this.startEditByInput(this.cellTarget, t), this.ctx.emit("startEdit", this.cellTarget));
   }
   editCell(t, e) {
     const i = this.ctx.body.renderRows.find((c) => c.rowIndex === t);
@@ -5846,7 +5857,7 @@ class Qi {
     n.forEach((w) => {
       w.render && (w.fixed === "left" ? c.push(w) : w.fixed === "right" ? d.push(w) : h.push(w));
     });
-    const f = e - i, u = {
+    const f = e - i, x = {
       key: "left",
       style: {
         position: "absolute",
@@ -5857,7 +5868,7 @@ class Qi {
         height: `${o}px`
       },
       cells: c
-    }, x = {
+    }, u = {
       key: "center",
       style: {
         position: "absolute",
@@ -5889,7 +5900,7 @@ class Qi {
         width: `${r}px`,
         height: `${o}px`
       },
-      views: [u, x, p]
+      views: [x, u, p]
     };
   }
   getBody() {
@@ -5904,7 +5915,7 @@ class Qi {
       fixedLeftWidth: r,
       fixedRightWidth: o,
       config: { SCROLLER_TRACK_SIZE: n, CSS_PREFIX: h }
-    } = this.ctx, { visibleWidth: c, visibleHeight: d } = this.ctx.body, f = o - n, u = {
+    } = this.ctx, { visibleWidth: c, visibleHeight: d } = this.ctx.body, f = o - n, x = {
       key: "left",
       style: {
         position: "absolute",
@@ -5915,7 +5926,7 @@ class Qi {
         height: `${d}px`
       },
       cells: e
-    }, x = {
+    }, u = {
       key: "center",
       style: {
         position: "absolute",
@@ -5947,7 +5958,7 @@ class Qi {
         width: `${c}px`,
         height: `${d}px`
       },
-      views: [u, x, p]
+      views: [x, u, p]
     };
   }
   getFooter() {
@@ -5972,7 +5983,7 @@ class Qi {
         height: `${c}px`
       },
       cells: e
-    }, u = {
+    }, x = {
       key: "center",
       style: {
         position: "absolute",
@@ -5983,7 +5994,7 @@ class Qi {
         height: `${c}px`
       },
       cells: t
-    }, x = {
+    }, u = {
       key: "right",
       style: {
         position: "absolute",
@@ -6004,7 +6015,7 @@ class Qi {
         width: `${h}px`,
         height: `${c}px`
       },
-      views: [f, u, x]
+      views: [f, x, u]
     };
   }
 }
@@ -6021,7 +6032,7 @@ class ts {
       e.preventDefault();
       const { xArr: i, yArr: s } = this.ctx.selector, [r, o] = i, [n, h] = s, { rowIndex: c, colIndex: d } = t;
       c >= n && c <= h && d >= r && d <= o || this.ctx.emit("setSelectorCell", t, e);
-      const u = {
+      const x = {
         getBoundingClientRect: () => ({
           width: 0,
           height: 0,
@@ -6034,11 +6045,11 @@ class ts {
         }),
         contextElement: document.body
       };
-      me(u, this.contextMenuEl, {
+      me(x, this.contextMenuEl, {
         placement: "right-start",
         middleware: [we(), pe(), ye()]
-      }).then(({ x, y: p }) => {
-        this.show(x, p);
+      }).then(({ x: u, y: p }) => {
+        this.show(u, p);
       });
     }), this.ctx.on("click", this.hide.bind(this)), this.ctx.on("onScroll", this.hide.bind(this)), this.ctx.on("resize", this.hide.bind(this));
   }