e-virt-table 1.0.5 → 1.0.9

package/dist/index.es.js

@@ -1266,7 +1266,7 @@ class Tt extends se {
       borderWidth: 1
     });
     const [n, h] = i, [c, d] = s;
-    !(n === h && c === d) && this.colIndex >= n && this.colIndex <= h && this.rowIndex >= c && this.rowIndex <= d && this.ctx.paint.drawRect(this.drawX, this.drawY, this.visibleWidth, this.visibleHeight, {
+    !(n === h && c === d) && this.colIndex >= n && this.colIndex <= h && this.rowIndex >= c && this.rowIndex <= d && this.ctx.paint.drawRect(this.drawX, this.drawY, this.width, this.height, {
       borderColor: "transparent",
       fillColor: this.ctx.config.SELECT_AREA_COLOR || "rgba(82,146,247,0.1)"
     }), this.operation && this.rowIndex >= c && this.rowIndex <= d && this.ctx.paint.drawRect(this.drawX, this.drawY, this.visibleWidth, this.visibleHeight, {
@@ -1355,7 +1355,7 @@ class ni {
     this.data = i, this.footerData = r, this.columns = s, this.setLoading(!0), this.init();
   }
   init() {
-    this.clearBufferData(), this.rowKeyMap.clear(), this.checkboxKeyMap.clear(), this.colIndexKeyMap.clear(), this.rowIndexRowKeyMap.clear(), this.originalDataMap.clear(), this.changedDataMap.clear(), this.validationErrorMap.clear(), this.itemRowKeyMap = /* @__PURE__ */ new WeakMap(), this.initData(this.data);
+    this.clearBufferData(), this.rowKeyMap.clear(), this.checkboxKeyMap.clear(), this.colIndexKeyMap.clear(), this.rowIndexRowKeyMap.clear(), this.originalDataMap.clear(), this.changedDataMap.clear(), this.validationErrorMap.clear(), this.itemRowKeyMap = /* @__PURE__ */ new WeakMap(), this.initData(this.data), this.getData();
   }
   /**
    * 清除缓存数据
@@ -2248,7 +2248,7 @@ class li {
     this.ctx = t, this.init();
   }
   init() {
-    this.bind(window, "resize", this.handleResize.bind(this)), this.bind(window, "mouseup", this.handleMouseUp.bind(this)), this.bind(window, "mousemove", this.handleMousemove.bind(this)), this.bind(this.ctx.stageElement, "click", this.handleClick.bind(this)), this.bind(window, "keydown", this.handleKeydown.bind(this)), this.bind(this.ctx.stageElement, "wheel", this.handleWheel.bind(this)), this.bind(this.ctx.stageElement, "touchstart", this.handleTouchstart.bind(this)), this.bind(this.ctx.stageElement, "touchend", this.handleTouchend.bind(this)), this.bind(this.ctx.stageElement, "touchmove", this.handleTouchmove.bind(this)), this.bind(this.ctx.stageElement, "contextmenu", this.handleContextMenu.bind(this)), this.bind(this.ctx.stageElement, "mousedown", this.handleMouseDown.bind(this)), this.bind(this.ctx.stageElement, "dblclick", this.handleDblclick.bind(this)), this.bind(this.ctx.stageElement, "mouseover", this.handleMouseover.bind(this)), this.bind(this.ctx.stageElement, "mouseout", this.handleMouseout.bind(this));
+    this.bind(window, "resize", this.handleResize.bind(this)), this.bind(window, "mouseup", this.handleMouseUp.bind(this)), this.bind(window, "mousemove", this.handleMousemove.bind(this)), this.bind(this.ctx.stageElement, "click", this.handleClick.bind(this)), this.bind(window, "keydown", this.handleKeydown.bind(this)), this.bind(this.ctx.stageElement, "wheel", this.handleWheel.bind(this)), this.bind(this.ctx.stageElement, "touchstart", this.handleTouchstart.bind(this)), this.bind(this.ctx.stageElement, "touchend", this.handleTouchend.bind(this)), this.bind(this.ctx.stageElement, "touchmove", this.handleTouchmove.bind(this)), this.bind(this.ctx.stageElement, "contextmenu", this.handleContextMenu.bind(this)), this.bind(this.ctx.stageElement, "mousedown", this.handleMouseDown.bind(this)), this.bind(this.ctx.stageElement, "dblclick", this.handleDblclick.bind(this)), this.bind(this.ctx.stageElement, "mouseover", this.handleMouseover.bind(this)), this.bind(this.ctx.stageElement, "mouseout", this.handleMouseout.bind(this)), this.bind(this.ctx.containerElement, "focusin", this.handleFocusin.bind(this)), this.bind(this.ctx.containerElement, "focusout", this.handleFocusout.bind(this));
   }
   destroy() {
     this.eventTasks.forEach((t, e) => {
@@ -2293,11 +2293,17 @@ class li {
     this.ctx.isInsideTargetContainer = !0, this.ctx.emit("mouseover", t);
   }
   handleMouseout(t) {
-    this.ctx.isInsideTargetContainer = !1, this.ctx.emit("mouseout", t);
+    this.ctx.emit("mouseout", t);
   }
   handleDblclick(t) {
     this.ctx.emit("dblclick", t);
   }
+  handleFocusin(t) {
+    this.ctx.isInsideTargetContainer = !0, this.ctx.emit("focusin", t);
+  }
+  handleFocusout(t) {
+    this.ctx.isInsideTargetContainer = !1, this.ctx.emit("focusout", t);
+  }
   bind(t, e, i, s) {
     t.addEventListener(e, i, s), this.eventTasks.set(e, i);
   }
@@ -2866,7 +2872,7 @@ class fi {
   init() {
     this.resizeObserver = new ResizeObserver(() => {
       this.ctx.emit("resetHeader"), this.ctx.emit("resizeObserver");
-    }), this.resizeObserver.observe(this.ctx.stageElement), this.ctx.on("mousedown", (t) => {
+    }), this.resizeObserver.observe(this.ctx.containerElement), this.ctx.on("mousedown", (t) => {
       if (t.button !== 0 || this.isBusy(t))
         return;
       const { offsetY: e, offsetX: i } = this.ctx.getOffset(t), s = e, r = i;
@@ -3141,7 +3147,7 @@ class xi {
     } else
       this.database.setItemValue(t, e, i, s, r, !0);
   }
-  batchSetItemValueByEditor(t, e) {
+  batchSetItemValueByEditor(t, e = !0) {
     if (this.config.ENABLE_MERGE_CELL_LINK) {
       const i = [];
       t.forEach((s) => {
@@ -3161,13 +3167,10 @@ class xi {
     this.focusCell !== t && (((e = this.focusCell) == null ? void 0 : e.rowKey) !== t.rowKey && (this.focusCell = t, this.emit("rowFocusChange", t)), this.focusCell = t, this.emit("cellFocusChange", t));
   }
   clearSelector() {
-    this.selector = {
-      enable: !1,
-      xArr: [-1, -1],
-      yArr: [-1, -1],
-      xArrCopy: [-1, -1],
-      yArrCopy: [-1, -1]
-    };
+    this.selector.enable = !1, this.selector.xArr = [-1, -1], this.selector.yArr = [-1, -1];
+  }
+  clearSelectorCopy() {
+    this.selector.xArrCopy = [-1, -1], this.selector.yArrCopy = [-1, -1];
   }
   clearAutofill() {
     this.autofill = {
@@ -3411,7 +3414,7 @@ class ui {
     (t !== this.ctx.scrollX || e !== this.ctx.scrollY) && (this.ctx.emit("onScroll", t, e), t !== this.ctx.scrollX && this.ctx.emit("onScrollX", t), e !== this.ctx.scrollY && this.ctx.emit("onScrollY", e), this.ctx.scrollX = t, this.ctx.scrollY = e, this.ctx.emit("draw"));
   }
   setScroll(t, e) {
-    this.horizontalScrollbar.scroll = t, this.verticalScrollbar.scroll = e, this.ctx.emit("draw");
+    this.horizontalScrollbar.scroll = t, this.verticalScrollbar.scroll = e, this.ctx.emit("draw"), this.ctx.emit("onScroll", t, e);
   }
   setScrollX(t) {
     this.horizontalScrollbar.scroll = t, this.ctx.emit("draw");
@@ -3872,17 +3875,25 @@ class wi {
   }
   update() {
     this.init();
-    const { header: t, database: e, scrollY: i } = this.ctx, s = i, { data: r, positions: o } = e.getData();
-    this.ctx.maxRowIndex = r.length - 1;
-    const n = this.binarySearch(o, s);
-    let h = this.binarySearch(o, s + this.visibleHeight);
-    h === -1 && (h = r.length), this.headIndex = Math.max(0, n), this.tailIndex = Math.min(this.ctx.maxRowIndex, h + 1), this.visibleRows = r.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 c = [];
-    for (let d = 0; d < this.visibleRows.length; d++) {
-      const f = this.headIndex + d, u = this.visibleRows[d], { height: x, top: p } = this.ctx.database.getPositionForRowIndex(f), g = new oe(this.ctx, f, 0, p + this.y, t.width, x, u);
-      c.push(g);
+    const {
+      header: t,
+      database: e,
+      scrollY: i,
+      config: { CELL_HEIGHT: s }
+    } = this.ctx, r = i, { data: o, positions: n } = e.getData();
+    this.ctx.maxRowIndex = o.length - 1;
+    let h = this.binarySearch(n, r), c = this.binarySearch(n, r + this.visibleHeight);
+    if (c === -1 && (c = this.ctx.maxRowIndex), h === -1 && c === this.ctx.maxRowIndex) {
+      const f = Math.floor(this.visibleHeight / s);
+      h = this.ctx.maxRowIndex - f;
     }
-    this.renderRows = c, this.ctx.body.renderRows = c;
+    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);
+      d.push(w);
+    }
+    this.renderRows = d, this.ctx.body.renderRows = d;
   }
   draw() {
     this.renderRows.forEach((t) => {
@@ -3974,7 +3985,11 @@ class yi {
     this.ctx = t, this.init();
   }
   init() {
-    this.ctx.on(
+    this.ctx.on("focusout", () => {
+      this.ctx.clearSelector(), this.ctx.emit("draw");
+    }), this.ctx.on("setMoveFocus", (t) => {
+      this.moveFocus(t);
+    }), this.ctx.on(
       "mousemove",
       Jt((t) => {
         const { offsetY: e, offsetX: i } = this.ctx.getOffset(t), s = this.ctx.isTarget() && i > 0 && i < this.ctx.body.visibleWidth && e > this.ctx.header.visibleHeight && e < this.ctx.header.visibleHeight + this.ctx.body.visibleHeight;
@@ -4031,7 +4046,7 @@ class yi {
           t.preventDefault(), this.moveFocus("RIGHT");
           return;
         }
-        if (t.code === "ArrowDown") {
+        if (t.code === "ArrowDown" || t.code === "Enter") {
           t.preventDefault(), this.moveFocus("BOTTOM");
           return;
         }
@@ -5617,13 +5632,17 @@ class Zi {
     this.ctx = t, this.initTextEditor(), this.init();
   }
   init() {
-    this.ctx.on("onScroll", () => {
+    this.ctx.on("focusout", () => {
+      this.ctx.editing || (this.cellTarget = null);
+    }), this.ctx.on("onScroll", () => {
       this.enable && this.doneEdit();
     }), this.ctx.on("cellHeaderMousedown", () => {
       this.enable && this.doneEdit(), this.cellTarget = null;
     }), this.ctx.on("keydown", (t) => {
+      if (!this.ctx.isTarget())
+        return;
       const e = t.key, i = t.ctrlKey, s = t.altKey, r = t.shiftKey, o = t.metaKey;
-      if (!(i || s || r || o || [
+      i || s || r || o || [
         // "Enter",
         "Escape",
         "Tab",
@@ -5649,14 +5668,9 @@ class Zi {
         "F9",
         "F10",
         "F11",
-        "F12"
-      ].includes(e))) {
-        if (t.code === "Enter" && !this.enable) {
-          t.preventDefault(), this.startEdit();
-          return;
-        }
-        this.startEdit();
-      }
+        "F12",
+        "Enter"
+      ].includes(e) || this.startEdit();
     }), this.ctx.on("adjustBoundaryPosition", (t) => {
       this.cellTarget = t;
       const { xArr: e, yArr: i } = this.ctx.selector;
@@ -5698,7 +5712,7 @@ class Zi {
 ` + s, this.inputEl.selectionStart = this.inputEl.selectionEnd = e + 1, this.autoSize();
           return;
         }
-        (t.code === "Escape" || t.code === "Enter") && (t.preventDefault(), this.inputEl.blur());
+        (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();
@@ -6110,7 +6124,7 @@ class ss {
   createContainer(t, e, i, s, r) {
     t.className = "e-virt-table-container";
     const o = document.createElement("div"), n = document.createElement("canvas"), h = e || document.createElement("div");
-    o.className = "e-virt-table-stage", n.className = "e-virt-table-canvas", h.className = "e-virt-table-overlayer";
+    o.className = "e-virt-table-stage", t.tabIndex = 0, n.className = "e-virt-table-canvas", h.className = "e-virt-table-overlayer";
     const c = i || document.createElement("div");
     c.className = "e-virt-table-editor";
     const d = s, f = r;
@@ -6225,10 +6239,10 @@ class ss {
     return this.ctx.database.hasValidationError();
   }
   scrollTo(t, e) {
-    this.scrollXTo(t), this.scrollYTo(e);
+    this.scroller.setScroll(t, e);
   }
   scrollXTo(t) {
-    this.ctx.setScrollX(t);
+    this.scroller.setScrollX(t);
   }
   scrollToColkey(t) {
     this.scroller.scrollToColkey(t);
@@ -6243,7 +6257,7 @@ class ss {
     this.scroller.scrollToRowIndex(t);
   }
   scrollYTo(t) {
-    this.ctx.setScrollY(t);
+    this.scroller.setScrollY(t);
   }
   setExpandRowKeys(t, e = !0) {
     this.ctx.database.setExpandRowKeys(t, e);