stk-table-vue 0.2.0 → 0.2.1

package/lib/stk-table-vue.js

@@ -1,1490 +1,1422 @@
-import { onMounted, onBeforeUnmount, watch, ref, computed, defineComponent, shallowRef, toRaw, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, withDirectives, createElementVNode, vShow, Fragment, renderList, createCommentVNode, createBlock, resolveDynamicComponent, renderSlot, toDisplayString, createTextVNode } from "vue";
-import { interpolateRgb } from "d3-interpolate";
-const Default_Col_Width = "100";
-const Default_Table_Height = 100;
-const Default_Table_Width = 200;
-const Default_Row_Height = 28;
-const Highlight_Color = {
-  light: { from: "#71a2fd", to: "#fff" },
-  dark: { from: "#1e4c99", to: "#181c21" }
-};
-const Highlight_Duration = 2e3;
-const Highlight_Color_Change_Freq = 100;
-let _chromeVersion = 0;
-try {
-  const userAgent = navigator.userAgent.match(/chrome\/\d+/i);
-  if (userAgent) {
-    _chromeVersion = +userAgent[0].split("/")[1];
-  }
-} catch (e) {
-  console.error("Cannot get Chrome version", e);
-}
-const Is_Legacy_Mode = _chromeVersion < 56;
-function useAutoResize({ tableContainer, initVirtualScroll, scrollTo, props, debounceMs }) {
-  let resizeObserver = null;
-  onMounted(() => {
-    initResizeObserver();
-  });
-  onBeforeUnmount(() => {
-    removeResizeObserver();
-  });
-  function initResizeObserver() {
-    if (window.ResizeObserver) {
-      if (!tableContainer.value) {
-        const watchDom = watch(
-          () => tableContainer,
-          () => {
-            initResizeObserver();
-            watchDom();
-          }
-        );
-        return;
-      }
-      resizeObserver = new ResizeObserver(resizeCallback);
-      resizeObserver.observe(tableContainer.value);
-    } else {
-      window.addEventListener("resize", resizeCallback);
-    }
-  }
-  function removeResizeObserver() {
-    if (resizeObserver) {
-      resizeObserver.disconnect();
-      resizeObserver = null;
-    } else {
-      window.removeEventListener("resize", resizeCallback);
-    }
-  }
-  let debounceTime = 0;
-  function resizeCallback() {
-    if (debounceTime) {
-      window.clearTimeout(debounceTime);
-    }
-    debounceTime = window.setTimeout(() => {
-      if (props.autoResize) {
-        initVirtualScroll();
-        if (typeof props.autoResize === "function") {
-          props.autoResize();
-        }
-      }
-      debounceTime = 0;
-    }, debounceMs);
-  }
-}
-function useColResize({
-  tableContainer,
-  tableHeaderLast,
-  colResizeIndicator,
-  props,
-  emits,
-  colKeyGen
-}) {
-  const isColResizing = ref(false);
-  let colResizeState = {
-    currentCol: null,
-    currentColIndex: 0,
-    lastCol: null,
-    startX: 0,
-    startOffsetTableX: 0
-  };
-  onMounted(() => {
-    initColResizeEvent();
-  });
-  onBeforeUnmount(() => {
-    clearColResizeEvent();
-  });
-  function initColResizeEvent() {
-    window.addEventListener("mousemove", onThResizeMouseMove);
-    window.addEventListener("mouseup", onThResizeMouseUp);
-  }
-  function clearColResizeEvent() {
-    window.removeEventListener("mousemove", onThResizeMouseMove);
-    window.removeEventListener("mouseup", onThResizeMouseUp);
-  }
-  function onThResizeMouseDown(e, col, isPrev = false) {
-    if (!tableContainer.value)
-      return;
-    e.stopPropagation();
-    e.preventDefault();
-    const { clientX } = e;
-    const { scrollLeft, scrollTop } = tableContainer.value;
-    const { left } = tableContainer.value.getBoundingClientRect();
-    let colIndex = tableHeaderLast.value.findIndex((it) => colKeyGen(it) === colKeyGen(col));
-    if (isPrev) {
-      colIndex -= 1;
-      col = tableHeaderLast.value[colIndex];
-    }
-    const offsetTableX = clientX - left + scrollLeft;
-    isColResizing.value = true;
-    Object.assign(colResizeState, {
-      currentCol: col,
-      currentColIndex: colIndex,
-      lastCol: findLastChildCol(col),
-      startX: clientX,
-      startOffsetTableX: offsetTableX
-    });
-    if (colResizeIndicator.value) {
-      const style = colResizeIndicator.value.style;
-      style.display = "block";
-      style.left = offsetTableX + "px";
-      style.top = scrollTop + "px";
-    }
-  }
-  function onThResizeMouseMove(e) {
-    if (!isColResizing.value)
-      return;
-    e.stopPropagation();
-    e.preventDefault();
-    const { lastCol, startX, startOffsetTableX } = colResizeState;
-    const { clientX } = e;
-    let moveX = clientX - startX;
-    const currentColWidth = parseInt((lastCol == null ? void 0 : lastCol.width) || Default_Col_Width);
-    if (currentColWidth + moveX < props.colMinWidth) {
-      moveX = -currentColWidth;
-    }
-    const offsetTableX = startOffsetTableX + moveX;
-    if (!colResizeIndicator.value)
-      return;
-    colResizeIndicator.value.style.left = offsetTableX + "px";
-  }
-  function onThResizeMouseUp(e) {
-    if (!isColResizing.value)
-      return;
-    const { startX, lastCol } = colResizeState;
-    const { clientX } = e;
-    const moveX = clientX - startX;
-    let width = parseInt((lastCol == null ? void 0 : lastCol.width) || Default_Col_Width) + moveX;
-    if (width < props.colMinWidth)
-      width = props.colMinWidth;
-    const curCol = tableHeaderLast.value.find((it) => colKeyGen(it) === colKeyGen(lastCol));
-    if (!curCol)
-      return;
-    curCol.width = width + "px";
-    emits("update:columns", [...props.columns]);
-    if (colResizeIndicator.value) {
-      const style = colResizeIndicator.value.style;
-      style.display = "none";
-      style.left = "0";
-      style.top = "0";
-    }
-    isColResizing.value = false;
-    colResizeState = {
-      currentCol: null,
-      currentColIndex: 0,
-      lastCol: null,
-      startX: 0,
-      startOffsetTableX: 0
-    };
-  }
-  function findLastChildCol(column) {
-    var _a;
-    if ((_a = column == null ? void 0 : column.children) == null ? void 0 : _a.length) {
-      const lastChild = column.children.at(-1);
-      return findLastChildCol(lastChild);
-    }
-    return column;
-  }
-  return {
-    isColResizing,
-    onThResizeMouseDown,
-    onThResizeMouseMove,
-    onThResizeMouseUp
-  };
-}
-function useFixedCol({ props, tableHeaderLast, tableContainer }) {
-  const fixedShadow = ref({
-    showL: false,
-    showR: false
-  });
-  let fixedShadowCols = [];
-  function dealFixedColShadow() {
-    if (!props.fixedColShadow)
-      return;
-    fixedShadowCols = [];
-    let lastLeftCol = null;
-    for (let i = tableHeaderLast.value.length - 1; i > 0; i--) {
-      const col = tableHeaderLast.value[i];
-      if (col.fixed === "left") {
-        lastLeftCol = col;
-        break;
-      }
-    }
-    let node = { __PARENT__: lastLeftCol };
-    while (node = node.__PARENT__) {
-      if (node.fixed) {
-        fixedShadowCols.push(node);
-      }
-    }
-    const lastRightCol = tableHeaderLast.value.find((it) => it.fixed === "right");
-    node = { __PARENT__: lastRightCol };
-    while (node = node.__PARENT__) {
-      if (node.fixed) {
-        fixedShadowCols.push(node);
-      }
-    }
-  }
-  function getFixedColClass(col) {
-    const { showR, showL } = fixedShadow.value;
-    const showShadow = props.fixedColShadow && col.fixed && (showL && col.fixed === "left" || showR && col.fixed === "right") && fixedShadowCols.includes(col);
-    const classObj = {
-      "fixed-cell": col.fixed,
-      ["fixed-cell--" + col.fixed]: col.fixed,
-      "fixed-cell--shadow": showShadow
-    };
-    return classObj;
-  }
-  function updateFixedShadow() {
-    if (!props.fixedColShadow)
-      return;
-    const { clientWidth, scrollWidth, scrollLeft } = tableContainer.value;
-    fixedShadow.value.showL = Boolean(scrollLeft);
-    fixedShadow.value.showR = Math.abs(scrollWidth - scrollLeft - clientWidth) > 0.5;
-  }
-  return {
-    /** 固定列class */
-    getFixedColClass,
-    /** 处理固定列阴影 */
-    dealFixedColShadow,
-    /** 滚动条变化时，更新需要展示阴影的列 */
-    updateFixedShadow
-  };
-}
-function useFixedStyle({ props, tableHeaderLast, virtualScroll, virtualScrollX, virtualX_on, virtualX_offsetRight }) {
-  const fixedColumnsPositionStore = computed(() => {
-    const store = {};
-    const cols = [...tableHeaderLast.value];
-    let left = 0;
-    let rightStartIndex = 0;
-    for (let i = 0; i < cols.length; i++) {
-      const item = cols[i];
-      if (item.fixed === "left") {
-        store[item.dataIndex] = left;
-        left += parseInt(item.width || Default_Col_Width);
-      }
-      if (!rightStartIndex && item.fixed === "right") {
-        rightStartIndex = i;
-      }
-    }
-    let right = 0;
-    for (let i = cols.length - 1; i >= rightStartIndex; i--) {
-      const item = cols[i];
-      if (item.fixed === "right") {
-        store[item.dataIndex] = right;
-        right += parseInt(item.width || Default_Col_Width);
-      }
-    }
-    return store;
-  });
-  function getFixedStyle(tagType, col, depth = 0) {
-    const { fixed, dataIndex } = col;
-    const isFixedLeft = fixed === "left";
-    const style = {};
-    if (Is_Legacy_Mode) {
-      style.position = "relative";
-    } else {
-      style.position = "sticky";
-    }
-    if (tagType === 1) {
-      if (Is_Legacy_Mode) {
-        style.top = virtualScroll.value.scrollTop + depth * props.rowHeight + "px";
-      } else {
-        style.top = depth * props.rowHeight + "px";
-      }
-      style.zIndex = isFixedLeft ? "5" : "4";
-    } else {
-      style.zIndex = isFixedLeft ? "3" : "2";
-    }
-    if (fixed === "left" || fixed === "right") {
-      if (Is_Legacy_Mode) {
-        if (isFixedLeft) {
-          if (virtualX_on.value)
-            style.left = virtualScrollX.value.scrollLeft - virtualScrollX.value.offsetLeft + "px";
-          else
-            style.left = virtualScrollX.value.scrollLeft + "px";
-        } else {
-          style.right = `${virtualX_offsetRight.value}px`;
-        }
-      } else {
-        if (isFixedLeft) {
-          style.left = fixedColumnsPositionStore.value[dataIndex] + "px";
-        } else {
-          style.right = fixedColumnsPositionStore.value[dataIndex] + "px";
-        }
-      }
-    }
-    return style;
-  }
-  return {
-    getFixedStyle
-  };
-}
-function useHighlight({ props, tableContainer, rowKeyGen }) {
-  const highlightInter = computed(() => {
-    return interpolateRgb(Highlight_Color[props.theme].from, Highlight_Color[props.theme].to);
-  });
-  const highlightDimRows = /* @__PURE__ */ new Set();
-  const highlightDimRowsTimeout = /* @__PURE__ */ new Map();
-  const highlightDimCellsTimeout = /* @__PURE__ */ new Map();
-  let calcHighlightDimLoop = false;
-  function calcHighlightLoop() {
-    if (calcHighlightDimLoop)
-      return;
-    calcHighlightDimLoop = true;
-    const recursion = () => {
-      window.setTimeout(() => {
-        const nowTs = Date.now();
-        const needDeleteRows = [];
-        highlightDimRows.forEach((row) => {
-          const progress = (nowTs - row._bgc_progress_ms) / Highlight_Duration;
-          if (0 < progress && progress < 1) {
-            row._bgc = highlightInter.value(progress);
-          } else {
-            row._bgc = "";
-            needDeleteRows.push(row);
-          }
-        });
-        needDeleteRows.forEach((row) => highlightDimRows.delete(row));
-        if (highlightDimRows.size > 0) {
-          recursion();
-        } else {
-          calcHighlightDimLoop = false;
-        }
-      }, Highlight_Color_Change_Freq);
-    };
-    recursion();
-  }
-  function setHighlightDimCell(rowKeyValue, dataIndex) {
-    var _a;
-    const cellEl = (_a = tableContainer.value) == null ? void 0 : _a.querySelector(`[data-row-key="${rowKeyValue}"]>[data-index="${dataIndex}"]`);
-    if (!cellEl)
-      return;
-    if (cellEl.classList.contains("highlight-cell")) {
-      cellEl.classList.remove("highlight-cell");
-      void cellEl.offsetHeight;
-    }
-    cellEl.classList.add("highlight-cell");
-    window.clearTimeout(highlightDimCellsTimeout.get(rowKeyValue));
-    highlightDimCellsTimeout.set(
-      rowKeyValue,
-      window.setTimeout(() => {
-        cellEl.classList.remove("highlight-cell");
-        highlightDimCellsTimeout.delete(rowKeyValue);
-      }, Highlight_Duration)
-    );
-  }
-  function setHighlightDimRow(rowKeyValues) {
-    var _a, _b;
-    if (!Array.isArray(rowKeyValues))
-      rowKeyValues = [rowKeyValues];
-    if (props.virtual) {
-      const nowTs = Date.now();
-      for (let i = 0; i < rowKeyValues.length; i++) {
-        const rowKeyValue = rowKeyValues[i];
-        const row = props.dataSource.find((it) => rowKeyGen(it) === rowKeyValue);
-        if (!row)
-          continue;
-        row._bgc_progress_ms = nowTs;
-        highlightDimRows.add(row);
-      }
-      calcHighlightLoop();
-    } else {
-      let needRepaint = false;
-      const rowElTemp = [];
-      for (let i = 0; i < rowKeyValues.length; i++) {
-        const rowKeyValue = rowKeyValues[i];
-        const rowEl = (_a = tableContainer.value) == null ? void 0 : _a.querySelector(`[data-row-key="${rowKeyValue}"]`);
-        if (!rowEl)
-          continue;
-        if (rowEl.classList.contains("highlight-row")) {
-          rowEl.classList.remove("highlight-row");
-          needRepaint = true;
-        }
-        rowElTemp.push(rowEl);
-        window.clearTimeout(highlightDimRowsTimeout.get(rowKeyValue));
-        highlightDimRowsTimeout.set(
-          rowKeyValue,
-          window.setTimeout(() => {
-            rowEl.classList.remove("highlight-row");
-            highlightDimRowsTimeout.delete(rowKeyValue);
-          }, Highlight_Duration)
-        );
-      }
-      if (needRepaint) {
-        void ((_b = tableContainer.value) == null ? void 0 : _b.offsetWidth);
-      }
-      rowElTemp.forEach((el) => el.classList.add("highlight-row"));
-    }
-  }
-  return {
-    setHighlightDimRow,
-    setHighlightDimCell
-  };
-}
-const SCROLL_CODES = ["ArrowUp", "ArrowRight", "ArrowDown", "ArrowLeft", "PageUp", "PageDown"];
-function useKeyboardArrowScroll(targetElement, { props, scrollTo, virtualScroll, virtualScrollX, tableHeaders }) {
-  let isMouseOver = false;
-  onMounted(() => {
-    var _a, _b, _c;
-    window.addEventListener("keydown", handleKeydown);
-    (_a = targetElement.value) == null ? void 0 : _a.addEventListener("mouseenter", handleMouseEnter);
-    (_b = targetElement.value) == null ? void 0 : _b.addEventListener("mouseleave", handleMouseLeave);
-    (_c = targetElement.value) == null ? void 0 : _c.addEventListener("mousedown", handleMouseDown);
-  });
-  onBeforeUnmount(() => {
-    var _a, _b, _c;
-    window.removeEventListener("keydown", handleKeydown);
-    (_a = targetElement.value) == null ? void 0 : _a.removeEventListener("mouseenter", handleMouseEnter);
-    (_b = targetElement.value) == null ? void 0 : _b.removeEventListener("mouseleave", handleMouseLeave);
-    (_c = targetElement.value) == null ? void 0 : _c.removeEventListener("mousedown", handleMouseDown);
-  });
-  function handleKeydown(e) {
-    if (!SCROLL_CODES.includes(e.code))
-      return;
-    if (!isMouseOver)
-      return;
-    e.preventDefault();
-    const { scrollTop, rowHeight, pageSize } = virtualScroll.value;
-    const { scrollLeft } = virtualScrollX.value;
-    const { headless, headerRowHeight } = props;
-    const headerHeight = headless ? 0 : tableHeaders.value.length * (headerRowHeight || rowHeight);
-    if (e.code === SCROLL_CODES[0]) {
-      scrollTo(scrollTop - rowHeight, null);
-    } else if (e.code === SCROLL_CODES[1]) {
-      scrollTo(null, scrollLeft + rowHeight);
-    } else if (e.code === SCROLL_CODES[2]) {
-      scrollTo(scrollTop + rowHeight, null);
-    } else if (e.code === SCROLL_CODES[3]) {
-      scrollTo(null, scrollLeft - rowHeight);
-    } else if (e.code === SCROLL_CODES[4]) {
-      scrollTo(scrollTop - rowHeight * pageSize - headerHeight, null);
-    } else if (e.code === SCROLL_CODES[5]) {
-      scrollTo(scrollTop + rowHeight * pageSize - headerHeight, null);
-    }
-  }
-  function handleMouseEnter() {
-    isMouseOver = true;
-  }
-  function handleMouseLeave() {
-    isMouseOver = false;
-  }
-  function handleMouseDown() {
-    if (!isMouseOver)
-      isMouseOver = true;
-  }
-}
-function useThDrag({ emits }) {
-  let dragStartKey = void 0;
-  function onThDragStart(e) {
-    dragStartKey = e.target.dataset.colKey;
-    emits("th-drag-start", dragStartKey);
-  }
-  function onThDragOver(e) {
-    e.preventDefault();
-  }
-  function onThDrop(e) {
-    let th = e.target;
-    while (th) {
-      if (th.tagName === "TH")
-        break;
-      th = th.parentNode;
-    }
-    if (dragStartKey !== th.dataset.colKey) {
-      emits("col-order-change", dragStartKey, th.dataset.colKey);
-    }
-    emits("th-drop", th.dataset.colKey);
-  }
-  return {
-    onThDragStart,
-    onThDragOver,
-    onThDrop
-  };
-}
-function getCalcWidth(col) {
-  return parseInt(col.minWidth || col.width || Default_Col_Width);
-}
-const VUE2_SCROLL_TIMEOUT_MS = 200;
-function useVirtualScroll({ props, tableContainer, dataSourceCopy, tableHeaderLast }) {
-  const virtualScroll = ref({
-    containerHeight: 0,
-    rowHeight: props.rowHeight,
-    pageSize: 10,
-    startIndex: 0,
-    endIndex: 0,
-    offsetTop: 0,
-    scrollTop: 0
-  });
-  const virtualScrollX = ref({
-    containerWidth: 0,
-    startIndex: 0,
-    endIndex: 0,
-    offsetLeft: 0,
-    scrollLeft: 0
-  });
-  const virtual_on = computed(() => {
-    return props.virtual && dataSourceCopy.value.length > virtualScroll.value.pageSize * 2;
-  });
-  const virtual_dataSourcePart = computed(() => {
-    if (!virtual_on.value)
-      return dataSourceCopy.value;
-    const { startIndex, endIndex } = virtualScroll.value;
-    return dataSourceCopy.value.slice(startIndex, endIndex);
-  });
-  const virtual_offsetBottom = computed(() => {
-    if (!virtual_on.value)
-      return 0;
-    const { startIndex, rowHeight } = virtualScroll.value;
-    return (dataSourceCopy.value.length - startIndex - virtual_dataSourcePart.value.length) * rowHeight;
-  });
-  const virtualX_on = computed(() => {
-    return props.virtualX && tableHeaderLast.value.reduce((sum, col) => sum += getCalcWidth(col), 0) > virtualScrollX.value.containerWidth + 100;
-  });
-  const virtualX_columnPart = computed(() => {
-    if (virtualX_on.value) {
-      const leftCols = [];
-      const rightCols = [];
-      const { startIndex, endIndex } = virtualScrollX.value;
-      for (let i = 0; i < startIndex; i++) {
-        const col = tableHeaderLast.value[i];
-        if (col.fixed === "left")
-          leftCols.push(col);
-      }
-      for (let i = endIndex; i < tableHeaderLast.value.length; i++) {
-        const col = tableHeaderLast.value[i];
-        if (col.fixed === "right")
-          rightCols.push(col);
-      }
-      const mainColumns = tableHeaderLast.value.slice(startIndex, endIndex);
-      return leftCols.concat(mainColumns).concat(rightCols);
-    }
-    return tableHeaderLast.value;
-  });
-  const virtualX_offsetRight = computed(() => {
-    if (!virtualX_on.value)
-      return 0;
-    let width = 0;
-    for (let i = virtualScrollX.value.endIndex; i < tableHeaderLast.value.length; i++) {
-      const col = tableHeaderLast.value[i];
-      if (col.fixed !== "right") {
-        width += getCalcWidth(col);
-      }
-    }
-    return width;
-  });
-  function initVirtualScrollY(height) {
-    if (!virtual_on.value)
-      return;
-    const { offsetHeight, scrollTop } = tableContainer.value || {};
-    const { rowHeight } = virtualScroll.value;
-    let containerHeight;
-    if (typeof height === "number") {
-      containerHeight = height;
-    } else {
-      containerHeight = offsetHeight || Default_Table_Height;
-    }
-    Object.assign(virtualScroll.value, {
-      containerHeight,
-      pageSize: Math.ceil(containerHeight / rowHeight) + 1
-      // 这里最终+1，因为headless=true无头时，需要上下各预渲染一行。
-    });
-    updateVirtualScrollY(scrollTop);
-  }
-  function initVirtualScrollX() {
-    if (!props.virtualX)
-      return;
-    const { offsetWidth, scrollLeft } = tableContainer.value || {};
-    virtualScrollX.value.containerWidth = offsetWidth || Default_Table_Width;
-    updateVirtualScrollX(scrollLeft);
-  }
-  function initVirtualScroll(height) {
-    initVirtualScrollY(height);
-    initVirtualScrollX();
-  }
-  let vue2ScrollYTimeout = null;
-  function updateVirtualScrollY(sTop = 0) {
-    const { rowHeight, pageSize, scrollTop, startIndex: oldStartIndex } = virtualScroll.value;
-    const startIndex = Math.floor(sTop / rowHeight);
-    const offsetTop = startIndex * rowHeight;
-    let endIndex = startIndex + pageSize;
-    if (endIndex > dataSourceCopy.value.length) {
-      endIndex = dataSourceCopy.value.length;
-    }
-    if (vue2ScrollYTimeout) {
-      window.clearTimeout(vue2ScrollYTimeout);
-    }
-    if (!props.optimizeVue2Scroll || sTop <= scrollTop || Math.abs(oldStartIndex - startIndex) >= pageSize) {
-      Object.assign(virtualScroll.value, {
-        startIndex,
-        offsetTop,
-        endIndex,
-        scrollTop: sTop
-      });
-    } else {
-      Object.assign(virtualScroll.value, { endIndex, scrollTop: sTop });
-      vue2ScrollYTimeout = window.setTimeout(() => {
-        Object.assign(virtualScroll.value, { startIndex, offsetTop });
-      }, VUE2_SCROLL_TIMEOUT_MS);
-    }
-  }
-  let vue2ScrollXTimeout = null;
-  function updateVirtualScrollX(sLeft = 0) {
-    var _a;
-    const headerLength = (_a = tableHeaderLast.value) == null ? void 0 : _a.length;
-    const { scrollLeft } = virtualScrollX.value;
-    if (!headerLength)
-      return;
-    let startIndex = 0;
-    let offsetLeft = 0;
-    let colWidthSum = 0;
-    for (let colIndex = 0; colIndex < headerLength; colIndex++) {
-      startIndex++;
-      const col = tableHeaderLast.value[colIndex];
-      if (col.fixed === "left")
-        continue;
-      const colWidth = getCalcWidth(col);
-      colWidthSum += colWidth;
-      if (colWidthSum >= sLeft) {
-        offsetLeft = colWidthSum - colWidth;
-        startIndex--;
-        break;
-      }
-    }
-    colWidthSum = 0;
-    let endIndex = headerLength;
-    for (let colIndex = startIndex + 1; colIndex < headerLength; colIndex++) {
-      const col = tableHeaderLast.value[colIndex];
-      colWidthSum += getCalcWidth(col);
-      if (colWidthSum >= virtualScrollX.value.containerWidth) {
-        endIndex = colIndex + 1;
-        break;
-      }
-    }
-    if (endIndex > headerLength) {
-      endIndex = headerLength;
-    }
-    if (vue2ScrollXTimeout) {
-      window.clearTimeout(vue2ScrollXTimeout);
-    }
-    if (!props.optimizeVue2Scroll || sLeft <= scrollLeft) {
-      Object.assign(virtualScrollX.value, { startIndex, endIndex, offsetLeft, scrollLeft: sLeft });
-    } else {
-      Object.assign(virtualScrollX.value, { endIndex, scrollLeft: sLeft });
-      vue2ScrollXTimeout = window.setTimeout(() => {
-        Object.assign(virtualScrollX.value, { startIndex, offsetLeft });
-      }, VUE2_SCROLL_TIMEOUT_MS);
-    }
-  }
-  return {
-    virtualScroll,
-    virtualScrollX,
-    virtual_on,
-    virtual_dataSourcePart,
-    virtual_offsetBottom,
-    virtualX_on,
-    virtualX_columnPart,
-    virtualX_offsetRight,
-    initVirtualScroll,
-    initVirtualScrollY,
-    initVirtualScrollX,
-    updateVirtualScrollY,
-    updateVirtualScrollX
-  };
-}
-function insertToOrderedArray(sortState, newItem, targetArray) {
-  const { dataIndex, order } = sortState;
-  let { sortType } = sortState;
-  if (!sortType)
-    sortType = typeof newItem[dataIndex];
-  const data = [...targetArray];
-  if (!order) {
-    data.unshift(newItem);
-    return data;
-  }
-  let sIndex = 0;
-  let eIndex = data.length - 1;
-  const targetVal = newItem[dataIndex];
-  while (sIndex <= eIndex) {
-    const midIndex = Math.floor((sIndex + eIndex) / 2);
-    const midVal = data[midIndex][dataIndex];
-    const compareRes = strCompare(midVal, targetVal, sortType);
-    if (compareRes === 0) {
-      sIndex = midIndex;
-      break;
-    } else if (compareRes === -1) {
-      if (order === "asc")
-        sIndex = midIndex + 1;
-      else
-        eIndex = midIndex - 1;
-    } else {
-      if (order === "asc")
-        eIndex = midIndex - 1;
-      else
-        sIndex = midIndex + 1;
-    }
-  }
-  data.splice(sIndex, 0, newItem);
-  return data;
-}
-function strCompare(a, b, type) {
-  if (type === "number") {
-    if (+a > +b)
-      return 1;
-    else if (+a === +b)
-      return 0;
-    else
-      return -1;
-  } else {
-    return String(a).localeCompare(b);
-  }
-}
-function tableSort(sortOption, order, dataSource) {
-  if (!(dataSource == null ? void 0 : dataSource.length))
-    return dataSource || [];
-  let targetDataSource = [...dataSource];
-  if (typeof sortOption.sorter === "function") {
-    const customSorterData = sortOption.sorter(targetDataSource, { order, column: sortOption });
-    if (customSorterData)
-      targetDataSource = customSorterData;
-  } else if (order) {
-    const sortField = sortOption.sortField || sortOption.dataIndex;
-    let { sortType } = sortOption;
-    if (!sortType)
-      sortType = typeof dataSource[0][sortField];
-    if (sortType === "number") {
-      const nanArr = [];
-      const numArr = [];
-      for (let i = 0; i < targetDataSource.length; i++) {
-        const row = targetDataSource[i];
-        if (row[sortField] === null || row[sortField] === "" || typeof row[sortField] === "boolean" || Number.isNaN(+row[sortField])) {
-          nanArr.push(row);
-        } else {
-          numArr.push(row);
-        }
-      }
-      if (order === "asc") {
-        numArr.sort((a, b) => +a[sortField] - +b[sortField]);
-        targetDataSource = [...nanArr, ...numArr];
-      } else {
-        numArr.sort((a, b) => +b[sortField] - +a[sortField]);
-        targetDataSource = [...numArr, ...nanArr];
-      }
-    } else {
-      if (order === "asc") {
-        targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]));
-      } else {
-        targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]) * -1);
-      }
-    }
-  }
-  return targetDataSource;
-}
-function howDeepTheHeader(arr, level = 1) {
-  const levels = [level];
-  arr.forEach((item) => {
-    var _a;
-    if ((_a = item.children) == null ? void 0 : _a.length) {
-      levels.push(howDeepTheHeader(item.children, level + 1));
-    }
-  });
-  return Math.max(...levels);
-}
-const _hoisted_1 = {
-  key: 0
-};
-const _hoisted_2 = ["data-col-key", "draggable", "rowspan", "colspan", "title", "onClick"];
-const _hoisted_3 = {
-  class: "table-header-cell-wrapper"
-};
-const _hoisted_4 = {
-  class: "table-header-title"
-};
-const _hoisted_5 = {
-  key: 2,
-  class: "table-header-sorter"
-};
-const _hoisted_6 = /* @__PURE__ */ createElementVNode("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  width: "16px",
-  height: "16px",
-  viewBox: "0 0 16 16"
-}, [/* @__PURE__ */ createElementVNode("polygon", {
-  class: "arrow-up",
-  fill: "#757699",
-  points: "8 2 4.8 6 11.2 6"
-}), /* @__PURE__ */ createElementVNode("polygon", {
-  class: "arrow-down",
-  transform: "translate(8, 12) rotate(-180) translate(-8, -12) ",
-  points: "8 10 4.8 14 11.2 14"
-})], -1);
-const _hoisted_7 = [_hoisted_6];
-const _hoisted_8 = ["onMousedown"];
-const _hoisted_9 = ["onMousedown"];
-const _hoisted_10 = {
-  key: 0,
-  class: "virtual-x-left",
-  style: {
-    "padding": "0"
-  }
-};
-const _hoisted_11 = ["data-row-key", "onClick", "onDblclick", "onContextmenu", "onMouseover"];
-const _hoisted_12 = {
-  key: 0,
-  class: "virtual-x-left",
-  style: {
-    "padding": "0"
-  }
-};
-const _hoisted_13 = ["data-index", "onClick"];
-const _hoisted_14 = ["title"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "StkTable",
-  props: {
-    width: {
-      default: ""
-    },
-    minWidth: {
-      default: ""
-    },
-    maxWidth: {
-      default: ""
-    },
-    stripe: {
-      type: Boolean,
-      default: false
-    },
-    fixedMode: {
-      type: Boolean,
-      default: false
-    },
-    headless: {
-      type: Boolean,
-      default: false
-    },
-    theme: {
-      default: "light"
-    },
-    rowHeight: {
-      default: Default_Row_Height
-    },
-    headerRowHeight: {
-      default: null
-    },
-    virtual: {
-      type: Boolean,
-      default: false
-    },
-    virtualX: {
-      type: Boolean,
-      default: false
-    },
-    columns: {
-      default: () => []
-    },
-    dataSource: {
-      default: () => []
-    },
-    rowKey: {
-      type: [String, Function],
-      default: ""
-    },
-    colKey: {
-      type: [String, Function],
-      default: "dataIndex"
-    },
-    emptyCellText: {
-      default: "--"
-    },
-    noDataFull: {
-      type: Boolean,
-      default: false
-    },
-    showNoData: {
-      type: Boolean,
-      default: true
-    },
-    sortRemote: {
-      type: Boolean,
-      default: false
-    },
-    showHeaderOverflow: {
-      type: Boolean,
-      default: false
-    },
-    showOverflow: {
-      type: Boolean,
-      default: false
-    },
-    showTrHoverClass: {
-      type: Boolean,
-      default: false
-    },
-    headerDrag: {
-      type: Boolean,
-      default: false
-    },
-    rowClassName: {
-      type: Function,
-      default: () => ""
-    },
-    colResizable: {
-      type: Boolean,
-      default: false
-    },
-    colMinWidth: {
-      default: 10
-    },
-    bordered: {
-      type: [Boolean, String],
-      default: true
-    },
-    autoResize: {
-      type: [Boolean, Function],
-      default: true
-    },
-    fixedColShadow: {
-      type: Boolean,
-      default: false
-    },
-    optimizeVue2Scroll: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ["sort-change", "row-click", "current-change", "row-dblclick", "header-row-menu", "row-menu", "cell-click", "header-cell-click", "scroll", "scroll-x", "col-order-change", "th-drag-start", "th-drop", "update:columns"],
-  setup(__props, {
-    expose: __expose,
-    emit: __emit
-  }) {
-    const props = __props;
-    const emits = __emit;
-    const tableContainer = ref();
-    const colResizeIndicator = ref();
-    const currentItem = ref(null);
-    const currentItemKey = ref(null);
-    const currentHover = ref(null);
-    let sortCol = ref();
-    let sortOrderIndex = ref(0);
-    const sortSwitchOrder = [null, "desc", "asc"];
-    const tableHeaders = ref([]);
-    const tableHeaderLast = ref([]);
-    const dataSourceCopy = shallowRef([...props.dataSource]);
-    const rowKeyGenStore = /* @__PURE__ */ new WeakMap();
-    const {
-      isColResizing,
-      onThResizeMouseDown
-    } = useColResize({
-      props,
-      emits,
-      colKeyGen,
-      colResizeIndicator,
-      tableContainer,
-      tableHeaderLast
-    });
-    const {
-      onThDragStart,
-      onThDragOver,
-      onThDrop
-    } = useThDrag({
-      emits
-    });
-    const {
-      virtualScroll,
-      virtualScrollX,
-      virtual_on,
-      virtual_dataSourcePart,
-      virtual_offsetBottom,
-      virtualX_on,
-      virtualX_columnPart,
-      virtualX_offsetRight,
-      initVirtualScroll,
-      initVirtualScrollY,
-      initVirtualScrollX,
-      updateVirtualScrollY,
-      updateVirtualScrollX
-    } = useVirtualScroll({
-      tableContainer,
-      props,
-      dataSourceCopy,
-      tableHeaderLast
-    });
-    const {
-      getFixedStyle
-    } = useFixedStyle({
-      props,
-      tableHeaderLast,
-      virtualScroll,
-      virtualScrollX,
-      virtualX_on,
-      virtualX_offsetRight
-    });
-    const {
-      setHighlightDimCell,
-      setHighlightDimRow
-    } = useHighlight({
-      props,
-      tableContainer,
-      rowKeyGen
-    });
-    if (props.autoResize) {
-      useAutoResize({
-        tableContainer,
-        initVirtualScroll,
-        scrollTo,
-        props,
-        debounceMs: 500
-      });
-    }
-    useKeyboardArrowScroll(tableContainer, {
-      props,
-      scrollTo,
-      virtualScroll,
-      virtualScrollX,
-      tableHeaders
-    });
-    const {
-      getFixedColClass,
-      dealFixedColShadow,
-      updateFixedShadow
-    } = useFixedCol({
-      props,
-      tableContainer,
-      tableHeaderLast
-    });
-    watch(() => props.columns, () => {
-      dealColumns();
-      initVirtualScrollX();
-    });
-    dealColumns();
-    watch(() => props.dataSource, (val) => {
-      if (!val) {
-        console.warn("invalid dataSource");
-        return;
-      }
-      let needInitVirtualScrollY = false;
-      if (dataSourceCopy.value.length !== val.length) {
-        needInitVirtualScrollY = true;
-      }
-      dataSourceCopy.value = [...val];
-      if (needInitVirtualScrollY)
-        initVirtualScrollY();
-      if (sortCol.value) {
-        const column = tableHeaderLast.value.find((it) => it.dataIndex === sortCol.value);
-        onColumnSort(column, false);
-      }
-      updateFixedShadow();
-    }, {
-      deep: false
-    });
-    watch(() => props.fixedColShadow, dealFixedColShadow);
-    onMounted(() => {
-      initVirtualScroll();
-      updateFixedShadow();
-    });
-    function dealColumns() {
-      tableHeaders.value = [];
-      tableHeaderLast.value = [];
-      const copyColumn = props.columns;
-      const deep = howDeepTheHeader(copyColumn);
-      const tempHeaderLast = [];
-      if (deep > 1 && props.virtualX) {
-        console.error("多级表头不支持横向虚拟滚动");
-      }
-      function flat(arr, parent, depth = 0) {
-        if (!tableHeaders.value[depth]) {
-          tableHeaders.value[depth] = [];
-        }
-        let allChildrenLen = 0;
-        arr.forEach((col) => {
-          col.__PARENT__ = parent;
-          let colChildrenLen = 1;
-          if (col.children) {
-            colChildrenLen = flat(
-              col.children,
-              col,
-              depth + 1
-              /* , col.fixed */
-            );
-          } else {
-            tempHeaderLast.push(col);
-          }
-          tableHeaders.value[depth].push(col);
-          const rowSpan = col.children ? 1 : deep - depth;
-          const colSpan = colChildrenLen;
-          if (rowSpan !== 1) {
-            col.rowSpan = rowSpan;
-          }
-          if (colSpan !== 1) {
-            col.colSpan = colSpan;
-          }
-          allChildrenLen += colChildrenLen;
-        });
-        return allChildrenLen;
-      }
-      flat(copyColumn, null);
-      tableHeaderLast.value = tempHeaderLast;
-      dealFixedColShadow();
-    }
-    function rowKeyGen(row) {
-      if (!row)
-        return;
-      let key = rowKeyGenStore.get(row);
-      if (!key) {
-        key = typeof props.rowKey === "function" ? props.rowKey(row) : row[props.rowKey];
-        rowKeyGenStore.set(row, key);
-      }
-      return key;
-    }
-    function colKeyGen(col) {
-      return typeof props.colKey === "function" ? props.colKey(col) : col[props.colKey];
-    }
-    function getColWidthStyle(col) {
-      const style = {
-        width: col.width,
-        minWidth: col.minWidth,
-        maxWidth: col.maxWidth
-      };
-      if (props.colResizable) {
-        style.minWidth = col.width;
-        style.maxWidth = col.width;
-      } else {
-        style.minWidth = col.minWidth === void 0 ? col.width : col.minWidth;
-        style.maxWidth = col.maxWidth === void 0 ? col.width : col.maxWidth;
-      }
-      return style;
-    }
-    function getCellStyle(tagType, col, depth) {
-      const style = {
-        ...getColWidthStyle(col),
-        ...getFixedStyle(tagType, col, depth)
-      };
-      if (tagType === 1) {
-        style.textAlign = col.headerAlign;
-      } else if (tagType === 2) {
-        style.textAlign = col.align;
-      }
-      return style;
-    }
-    function onColumnSort(col, click = true, options = {}) {
-      if (!(col == null ? void 0 : col.sorter))
-        return;
-      options = {
-        force: false,
-        emit: false,
-        ...options
-      };
-      if (sortCol.value !== col.dataIndex) {
-        sortCol.value = col.dataIndex;
-        sortOrderIndex.value = 0;
-      }
-      if (click)
-        sortOrderIndex.value++;
-      sortOrderIndex.value = sortOrderIndex.value % 3;
-      const order = sortSwitchOrder[sortOrderIndex.value];
-      if (!props.sortRemote || options.force) {
-        dataSourceCopy.value = tableSort(col, order, props.dataSource);
-      }
-      if (click || options.emit) {
-        emits("sort-change", col, order, toRaw(dataSourceCopy.value));
-      }
-    }
-    function onRowClick(e, row) {
-      emits("row-click", e, row);
-      if (props.rowKey ? currentItemKey.value === rowKeyGen(row) : currentItem.value === row)
-        return;
-      currentItem.value = row;
-      currentItemKey.value = rowKeyGen(row);
-      emits("current-change", e, row);
-    }
-    function onRowDblclick(e, row) {
-      emits("row-dblclick", e, row);
-    }
-    function onHeaderMenu(e) {
-      emits("header-row-menu", e);
-    }
-    function onRowMenu(e, row) {
-      emits("row-menu", e, row);
-    }
-    function onCellClick(e, row, col) {
-      emits("cell-click", e, row, col);
-    }
-    function onHeaderCellClick(e, col) {
-      emits("header-cell-click", e, col);
-    }
-    function onTableWheel(e) {
-      if (isColResizing.value) {
-        e.preventDefault();
-        e.stopPropagation();
-        return;
-      }
-    }
-    function onTableScroll(e) {
-      if (!(e == null ? void 0 : e.target))
-        return;
-      const {
-        scrollTop,
-        scrollLeft
-      } = e.target;
-      const {
-        scrollTop: vScrollTop
-      } = virtualScroll.value;
-      const {
-        scrollLeft: vScrollLeft
-      } = virtualScrollX.value;
-      const isYScroll = scrollTop !== vScrollTop;
-      const isXScroll = scrollLeft !== vScrollLeft;
-      if (isYScroll && virtual_on.value) {
-        updateVirtualScrollY(scrollTop);
-      }
-      if (isXScroll) {
-        updateFixedShadow();
-        if (virtualX_on.value) {
-          updateVirtualScrollX(scrollLeft);
-        }
-      }
-      const {
-        startIndex,
-        endIndex
-      } = virtualScroll.value;
-      const data = {
-        startIndex,
-        endIndex
-      };
-      if (isYScroll) {
-        emits("scroll", e, data);
-      }
-      if (isXScroll) {
-        emits("scroll-x", e);
-      }
-    }
-    function onTrMouseOver(_e, row) {
-      if (props.showTrHoverClass) {
-        currentHover.value = rowKeyGen(row);
-      }
-    }
-    function setCurrentRow(rowKey, option = {
-      silent: false
-    }) {
-      if (!dataSourceCopy.value.length)
-        return;
-      currentItem.value = dataSourceCopy.value.find((it) => rowKeyGen(it) === rowKey);
-      currentItemKey.value = rowKeyGen(currentItem.value);
-      if (!option.silent) {
-        emits("current-change", null, currentItem.value);
-      }
-    }
-    function setSorter(dataIndex, order, option = {}) {
-      var _a;
-      const newOption = {
-        silent: true,
-        sortOption: null,
-        sort: true,
-        ...option
-      };
-      sortCol.value = dataIndex;
-      sortOrderIndex.value = sortSwitchOrder.findIndex((it) => it === order);
-      if (newOption.sort && ((_a = dataSourceCopy.value) == null ? void 0 : _a.length)) {
-        const column = newOption.sortOption || tableHeaderLast.value.find((it) => it.dataIndex === sortCol.value);
-        if (column)
-          onColumnSort(column, false, {
-            force: true,
-            emit: !newOption.silent
-          });
-        else
-          console.warn("Can not find column by dataIndex:", sortCol.value);
-      }
-      return dataSourceCopy.value;
-    }
-    function resetSorter() {
-      sortCol.value = null;
-      sortOrderIndex.value = 0;
-      dataSourceCopy.value = [...props.dataSource];
-    }
-    function scrollTo(top = 0, left = 0) {
-      if (!tableContainer.value)
-        return;
-      if (top !== null)
-        tableContainer.value.scrollTop = top;
-      if (left !== null)
-        tableContainer.value.scrollLeft = left;
-    }
-    function getTableData() {
-      return toRaw(dataSourceCopy.value);
-    }
-    __expose({
-      /** 初始化横向纵向虚拟滚动 */
-      initVirtualScroll,
-      /** 初始化横向虚拟滚动 */
-      initVirtualScrollX,
-      /** 初始化纵向虚拟滚动 */
-      initVirtualScrollY,
-      /** 设置当前选中行 */
-      setCurrentRow,
-      /** 设置高亮渐暗单元格 */
-      setHighlightDimCell,
-      /** 设置高亮渐暗行 */
-      setHighlightDimRow,
-      /** 表格排序列dataIndex */
-      sortCol,
-      /** 设置排序 */
-      setSorter,
-      /** 重置排序 */
-      resetSorter,
-      /** 滚动至 */
-      scrollTo,
-      /** 获取表格数据 */
-      getTableData
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        ref_key: "tableContainer",
-        ref: tableContainer,
-        class: normalizeClass(["stk-table", {
-          virtual: _ctx.virtual,
-          "virtual-x": _ctx.virtualX,
-          dark: _ctx.theme === "dark",
-          headless: _ctx.headless,
-          "is-col-resizing": unref(isColResizing),
-          "col-resizable": props.colResizable,
-          border: props.bordered,
-          "border-h": props.bordered === "h",
-          "border-v": props.bordered === "v",
-          "border-body-v": props.bordered === "body-v",
-          stripe: props.stripe
-        }]),
-        style: normalizeStyle(_ctx.virtual && {
-          "--row-height": unref(virtualScroll).rowHeight + "px",
-          "--header-row-height": (props.headerRowHeight || props.rowHeight) + "px"
-        }),
-        onScroll: onTableScroll,
-        onWheel: onTableWheel
-      }, [withDirectives(createElementVNode("div", {
-        ref_key: "colResizeIndicator",
-        ref: colResizeIndicator,
-        class: "column-resize-indicator"
-      }, null, 512), [[vShow, _ctx.colResizable]]), createElementVNode("table", {
-        class: normalizeClass(["stk-table-main", {
-          "fixed-mode": props.fixedMode
-        }]),
-        style: normalizeStyle({
-          width: _ctx.width,
-          minWidth: _ctx.minWidth,
-          maxWidth: _ctx.maxWidth
-        })
-      }, [!_ctx.headless ? (openBlock(), createElementBlock("thead", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(tableHeaders.value, (row, rowIndex) => {
-        return openBlock(), createElementBlock("tr", {
-          key: rowIndex,
-          onContextmenu: _cache[3] || (_cache[3] = (e) => onHeaderMenu(e))
-        }, [unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
-          key: 0,
-          class: "virtual-x-left",
-          style: normalizeStyle({
-            minWidth: unref(virtualScrollX).offsetLeft + "px",
-            width: unref(virtualScrollX).offsetLeft + "px"
-          })
-        }, null, 4)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_on) && rowIndex === tableHeaders.value.length - 1 ? unref(virtualX_columnPart) : row, (col, colIndex) => {
-          return openBlock(), createElementBlock("th", {
-            key: col.dataIndex,
-            "data-col-key": colKeyGen(col),
-            draggable: _ctx.headerDrag ? "true" : "false",
-            rowspan: unref(virtualX_on) ? 1 : col.rowSpan,
-            colspan: col.colSpan,
-            style: normalizeStyle(getCellStyle(1, col, rowIndex)),
-            title: col.title,
-            class: normalizeClass([col.sorter ? "sortable" : "", col.dataIndex === unref(sortCol) && unref(sortOrderIndex) !== 0 && "sorter-" + sortSwitchOrder[unref(sortOrderIndex)], _ctx.showHeaderOverflow ? "text-overflow" : "", col.headerClassName, unref(getFixedColClass)(col)]),
-            onClick: (e) => {
-              onColumnSort(col);
-              onHeaderCellClick(e, col);
-            },
-            onDragstart: _cache[0] || (_cache[0] = //@ts-ignore
-            (...args) => unref(onThDragStart) && unref(onThDragStart)(...args)),
-            onDrop: _cache[1] || (_cache[1] = //@ts-ignore
-            (...args) => unref(onThDrop) && unref(onThDrop)(...args)),
-            onDragover: _cache[2] || (_cache[2] = //@ts-ignore
-            (...args) => unref(onThDragOver) && unref(onThDragOver)(...args))
-          }, [createElementVNode("div", _hoisted_3, [col.customHeaderCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customHeaderCell), {
-            key: 0,
-            col
-          }, null, 8, ["col"])) : renderSlot(_ctx.$slots, "tableHeader", {
-            key: 1,
-            col
-          }, () => [createElementVNode("span", _hoisted_4, toDisplayString(col.title), 1)]), col.sorter ? (openBlock(), createElementBlock("span", _hoisted_5, _hoisted_7)) : createCommentVNode("", true), _ctx.colResizable && colIndex > 0 ? (openBlock(), createElementBlock("div", {
-            key: 3,
-            class: "table-header-resizer left",
-            onMousedown: (e) => unref(onThResizeMouseDown)(e, col, true)
-          }, null, 40, _hoisted_8)) : createCommentVNode("", true), _ctx.colResizable ? (openBlock(), createElementBlock("div", {
-            key: 4,
-            class: "table-header-resizer right",
-            onMousedown: (e) => unref(onThResizeMouseDown)(e, col)
-          }, null, 40, _hoisted_9)) : createCommentVNode("", true)])], 46, _hoisted_2);
-        }), 128)), unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
-          key: 1,
-          class: "virtual-x-right",
-          style: normalizeStyle({
-            minWidth: unref(virtualX_offsetRight) + "px",
-            width: unref(virtualX_offsetRight) + "px"
-          })
-        }, null, 4)) : createCommentVNode("", true)], 32);
-      }), 128))])) : createCommentVNode("", true), createElementVNode("tbody", null, [unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
-        key: 0,
-        style: normalizeStyle({
-          height: `${unref(virtualScroll).offsetTop}px`
-        }),
-        class: "padding-top-tr"
-      }, [unref(virtualX_on) && _ctx.fixedMode && _ctx.headless ? (openBlock(), createElementBlock("td", _hoisted_10)) : createCommentVNode("", true), _ctx.fixedMode && _ctx.headless ? (openBlock(true), createElementBlock(Fragment, {
-        key: 1
-      }, renderList(unref(virtualX_columnPart), (col) => {
-        return openBlock(), createElementBlock("td", {
-          key: col.dataIndex,
-          style: normalizeStyle(getCellStyle(2, col))
-        }, null, 4);
-      }), 128)) : createCommentVNode("", true)], 4)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtual_dataSourcePart), (row, i) => {
-        return openBlock(), createElementBlock("tr", {
-          key: _ctx.rowKey ? rowKeyGen(row) : i,
-          "data-row-key": _ctx.rowKey ? rowKeyGen(row) : i,
-          class: normalizeClass({
-            active: _ctx.rowKey ? rowKeyGen(row) === rowKeyGen(currentItem.value) : row === currentItem.value,
-            hover: _ctx.rowKey ? rowKeyGen(row) === currentHover.value : row === currentHover.value,
-            [_ctx.rowClassName(row, i)]: true
-          }),
-          style: normalizeStyle({
-            backgroundColor: row._bgc
-          }),
-          onClick: (e) => onRowClick(e, row),
-          onDblclick: (e) => onRowDblclick(e, row),
-          onContextmenu: (e) => onRowMenu(e, row),
-          onMouseover: (e) => onTrMouseOver(e, row)
-        }, [unref(virtualX_on) ? (openBlock(), createElementBlock("td", _hoisted_12)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_columnPart), (col) => {
-          return openBlock(), createElementBlock("td", {
-            key: col.dataIndex,
-            "data-index": col.dataIndex,
-            class: normalizeClass([col.className, _ctx.showOverflow ? "text-overflow" : "", unref(getFixedColClass)(col)]),
-            style: normalizeStyle(getCellStyle(2, col)),
-            onClick: (e) => onCellClick(e, row, col)
-          }, [col.customCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customCell), {
-            key: 0,
-            col,
-            row,
-            "cell-value": row[col.dataIndex]
-          }, null, 8, ["col", "row", "cell-value"])) : (openBlock(), createElementBlock("div", {
-            key: 1,
-            class: "table-cell-wrapper",
-            title: row[col.dataIndex]
-          }, toDisplayString(row[col.dataIndex] ?? _ctx.emptyCellText), 9, _hoisted_14))], 14, _hoisted_13);
-        }), 128))], 46, _hoisted_11);
-      }), 128)), unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
-        key: 1,
-        style: normalizeStyle({
-          height: `${unref(virtual_offsetBottom)}px`
-        })
-      }, null, 4)) : createCommentVNode("", true)])], 6), (!dataSourceCopy.value || !dataSourceCopy.value.length) && _ctx.showNoData ? (openBlock(), createElementBlock("div", {
-        key: 0,
-        class: normalizeClass(["stk-table-no-data", {
-          "no-data-full": _ctx.noDataFull
-        }])
-      }, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode("暂无数据")])], 2)) : createCommentVNode("", true)], 38);
-    };
-  }
-});
-export {
-  _sfc_main as StkTable,
-  insertToOrderedArray,
-  tableSort
-};
+import { onMounted, onBeforeUnmount, watch, ref, computed, defineComponent, shallowRef, toRaw, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, withDirectives, createElementVNode, vShow, Fragment, renderList, createCommentVNode, createBlock, resolveDynamicComponent, renderSlot, toDisplayString, createTextVNode } from "vue";
+import { interpolateRgb } from "d3-interpolate";
+const Default_Col_Width = "100";
+const Default_Table_Height = 100;
+const Default_Table_Width = 200;
+const Default_Row_Height = 28;
+const Highlight_Color = {
+  light: { from: "#71a2fd", to: "#fff" },
+  dark: { from: "#1e4c99", to: "#181c21" }
+};
+const Highlight_Duration = 2e3;
+const Highlight_Color_Change_Freq = 100;
+let _chromeVersion = 0;
+try {
+  const userAgent = navigator.userAgent.match(/chrome\/\d+/i);
+  if (userAgent) {
+    _chromeVersion = +userAgent[0].split("/")[1];
+  }
+} catch (e) {
+  console.error("Cannot get Chrome version", e);
+}
+const Is_Legacy_Mode = _chromeVersion < 56;
+function useAutoResize({ tableContainer, initVirtualScroll, props, debounceMs }) {
+  let resizeObserver = null;
+  onMounted(() => {
+    initResizeObserver();
+  });
+  onBeforeUnmount(() => {
+    removeResizeObserver();
+  });
+  function initResizeObserver() {
+    if (window.ResizeObserver) {
+      if (!tableContainer.value) {
+        const watchDom = watch(
+          () => tableContainer,
+          () => {
+            initResizeObserver();
+            watchDom();
+          }
+        );
+        return;
+      }
+      resizeObserver = new ResizeObserver(resizeCallback);
+      resizeObserver.observe(tableContainer.value);
+    } else {
+      window.addEventListener("resize", resizeCallback);
+    }
+  }
+  function removeResizeObserver() {
+    if (resizeObserver) {
+      resizeObserver.disconnect();
+      resizeObserver = null;
+    } else {
+      window.removeEventListener("resize", resizeCallback);
+    }
+  }
+  let debounceTime = 0;
+  function resizeCallback() {
+    if (debounceTime) {
+      window.clearTimeout(debounceTime);
+    }
+    debounceTime = window.setTimeout(() => {
+      if (props.autoResize) {
+        initVirtualScroll();
+        if (typeof props.autoResize === "function") {
+          props.autoResize();
+        }
+      }
+      debounceTime = 0;
+    }, debounceMs);
+  }
+}
+function insertToOrderedArray(sortState, newItem, targetArray) {
+  const { dataIndex, order } = sortState;
+  let { sortType } = sortState;
+  if (!sortType)
+    sortType = typeof newItem[dataIndex];
+  const data = [...targetArray];
+  if (!order) {
+    data.unshift(newItem);
+    return data;
+  }
+  let sIndex = 0;
+  let eIndex = data.length - 1;
+  const targetVal = newItem[dataIndex];
+  while (sIndex <= eIndex) {
+    const midIndex = Math.floor((sIndex + eIndex) / 2);
+    const midVal = data[midIndex][dataIndex];
+    const compareRes = strCompare(midVal, targetVal, sortType);
+    if (compareRes === 0) {
+      sIndex = midIndex;
+      break;
+    } else if (compareRes === -1) {
+      if (order === "asc")
+        sIndex = midIndex + 1;
+      else
+        eIndex = midIndex - 1;
+    } else {
+      if (order === "asc")
+        eIndex = midIndex - 1;
+      else
+        sIndex = midIndex + 1;
+    }
+  }
+  data.splice(sIndex, 0, newItem);
+  return data;
+}
+function strCompare(a, b, type) {
+  if (type === "number") {
+    if (+a > +b)
+      return 1;
+    else if (+a === +b)
+      return 0;
+    else
+      return -1;
+  } else {
+    return String(a).localeCompare(b);
+  }
+}
+function tableSort(sortOption, order, dataSource) {
+  if (!(dataSource == null ? void 0 : dataSource.length))
+    return dataSource || [];
+  let targetDataSource = [...dataSource];
+  if (typeof sortOption.sorter === "function") {
+    const customSorterData = sortOption.sorter(targetDataSource, { order, column: sortOption });
+    if (customSorterData)
+      targetDataSource = customSorterData;
+  } else if (order) {
+    const sortField = sortOption.sortField || sortOption.dataIndex;
+    let { sortType } = sortOption;
+    if (!sortType)
+      sortType = typeof dataSource[0][sortField];
+    if (sortType === "number") {
+      const nanArr = [];
+      const numArr = [];
+      for (let i = 0; i < targetDataSource.length; i++) {
+        const row = targetDataSource[i];
+        if (row[sortField] === null || row[sortField] === "" || typeof row[sortField] === "boolean" || Number.isNaN(+row[sortField])) {
+          nanArr.push(row);
+        } else {
+          numArr.push(row);
+        }
+      }
+      if (order === "asc") {
+        numArr.sort((a, b) => +a[sortField] - +b[sortField]);
+        targetDataSource = [...nanArr, ...numArr];
+      } else {
+        numArr.sort((a, b) => +b[sortField] - +a[sortField]);
+        targetDataSource = [...numArr, ...nanArr];
+      }
+    } else {
+      if (order === "asc") {
+        targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]));
+      } else {
+        targetDataSource.sort((a, b) => String(a[sortField]).localeCompare(b[sortField]) * -1);
+      }
+    }
+  }
+  return targetDataSource;
+}
+function howDeepTheHeader(arr, level = 1) {
+  const levels = [level];
+  arr.forEach((item) => {
+    var _a;
+    if ((_a = item.children) == null ? void 0 : _a.length) {
+      levels.push(howDeepTheHeader(item.children, level + 1));
+    }
+  });
+  return Math.max(...levels);
+}
+function getColWidth(col) {
+  if (typeof (col == null ? void 0 : col.width) === "number") {
+    return Math.floor(col.width ?? Default_Col_Width);
+  }
+  return parseInt((col == null ? void 0 : col.width) ?? Default_Col_Width);
+}
+function useColResize({
+  tableContainer,
+  tableHeaderLast,
+  colResizeIndicator,
+  props,
+  emits,
+  colKeyGen
+}) {
+  const isColResizing = ref(false);
+  let colResizeState = {
+    currentCol: null,
+    currentColIndex: 0,
+    lastCol: null,
+    startX: 0,
+    startOffsetTableX: 0
+  };
+  onMounted(() => {
+    initColResizeEvent();
+  });
+  onBeforeUnmount(() => {
+    clearColResizeEvent();
+  });
+  function initColResizeEvent() {
+    window.addEventListener("mousemove", onThResizeMouseMove);
+    window.addEventListener("mouseup", onThResizeMouseUp);
+  }
+  function clearColResizeEvent() {
+    window.removeEventListener("mousemove", onThResizeMouseMove);
+    window.removeEventListener("mouseup", onThResizeMouseUp);
+  }
+  function onThResizeMouseDown(e, col, isPrev = false) {
+    if (!tableContainer.value)
+      return;
+    e.stopPropagation();
+    e.preventDefault();
+    const { clientX } = e;
+    const { scrollLeft, scrollTop } = tableContainer.value;
+    const { left } = tableContainer.value.getBoundingClientRect();
+    let colIndex = tableHeaderLast.value.findIndex((it) => colKeyGen(it) === colKeyGen(col));
+    if (isPrev) {
+      colIndex -= 1;
+      col = tableHeaderLast.value[colIndex];
+    }
+    const offsetTableX = clientX - left + scrollLeft;
+    isColResizing.value = true;
+    Object.assign(colResizeState, {
+      currentCol: col,
+      currentColIndex: colIndex,
+      lastCol: findLastChildCol(col),
+      startX: clientX,
+      startOffsetTableX: offsetTableX
+    });
+    if (colResizeIndicator.value) {
+      const style = colResizeIndicator.value.style;
+      style.display = "block";
+      style.left = offsetTableX + "px";
+      style.top = scrollTop + "px";
+    }
+  }
+  function onThResizeMouseMove(e) {
+    if (!isColResizing.value)
+      return;
+    e.stopPropagation();
+    e.preventDefault();
+    const { lastCol, startX, startOffsetTableX } = colResizeState;
+    const { clientX } = e;
+    let moveX = clientX - startX;
+    const currentColWidth = getColWidth(lastCol);
+    if (currentColWidth + moveX < props.colMinWidth) {
+      moveX = -currentColWidth;
+    }
+    const offsetTableX = startOffsetTableX + moveX;
+    if (!colResizeIndicator.value)
+      return;
+    colResizeIndicator.value.style.left = offsetTableX + "px";
+  }
+  function onThResizeMouseUp(e) {
+    if (!isColResizing.value)
+      return;
+    const { startX, lastCol } = colResizeState;
+    const { clientX } = e;
+    const moveX = clientX - startX;
+    let width = getColWidth(lastCol) + moveX;
+    if (width < props.colMinWidth)
+      width = props.colMinWidth;
+    const curCol = tableHeaderLast.value.find((it) => colKeyGen(it) === colKeyGen(lastCol));
+    if (!curCol)
+      return;
+    curCol.width = width + "px";
+    emits("update:columns", [...props.columns]);
+    if (colResizeIndicator.value) {
+      const style = colResizeIndicator.value.style;
+      style.display = "none";
+      style.left = "0";
+      style.top = "0";
+    }
+    isColResizing.value = false;
+    colResizeState = {
+      currentCol: null,
+      currentColIndex: 0,
+      lastCol: null,
+      startX: 0,
+      startOffsetTableX: 0
+    };
+  }
+  function findLastChildCol(column) {
+    var _a;
+    if ((_a = column == null ? void 0 : column.children) == null ? void 0 : _a.length) {
+      const lastChild = column.children.at(-1);
+      return findLastChildCol(lastChild);
+    }
+    return column;
+  }
+  return {
+    isColResizing,
+    onThResizeMouseDown,
+    onThResizeMouseMove,
+    onThResizeMouseUp
+  };
+}
+function useFixedCol({ props, tableHeaderLast, tableContainer }) {
+  const fixedShadow = ref({
+    showL: false,
+    showR: false
+  });
+  let fixedShadowCols = [];
+  function dealFixedColShadow() {
+    if (!props.fixedColShadow)
+      return;
+    fixedShadowCols = [];
+    let lastLeftCol = null;
+    for (let i = tableHeaderLast.value.length - 1; i >= 0; i--) {
+      const col = tableHeaderLast.value[i];
+      if (col.fixed === "left") {
+        lastLeftCol = col;
+        break;
+      }
+    }
+    let node = { __PARENT__: lastLeftCol };
+    while (node = node.__PARENT__) {
+      if (node.fixed) {
+        fixedShadowCols.push(node);
+      }
+    }
+    const lastRightCol = tableHeaderLast.value.find((it) => it.fixed === "right");
+    node = { __PARENT__: lastRightCol };
+    while (node = node.__PARENT__) {
+      if (node.fixed) {
+        fixedShadowCols.push(node);
+      }
+    }
+  }
+  function getFixedColClass(col) {
+    const { showR, showL } = fixedShadow.value;
+    const showShadow = props.fixedColShadow && col.fixed && (showL && col.fixed === "left" || showR && col.fixed === "right") && fixedShadowCols.includes(col);
+    const classObj = {
+      "fixed-cell": col.fixed,
+      ["fixed-cell--" + col.fixed]: col.fixed,
+      "fixed-cell--shadow": showShadow
+    };
+    return classObj;
+  }
+  function updateFixedShadow() {
+    if (!props.fixedColShadow)
+      return;
+    const { clientWidth, scrollWidth, scrollLeft } = tableContainer.value;
+    fixedShadow.value.showL = Boolean(scrollLeft);
+    fixedShadow.value.showR = Math.abs(scrollWidth - scrollLeft - clientWidth) > 0.5;
+  }
+  return {
+    /** 固定列class */
+    getFixedColClass,
+    /** 处理固定列阴影 */
+    dealFixedColShadow,
+    /** 滚动条变化时，更新需要展示阴影的列 */
+    updateFixedShadow
+  };
+}
+function useFixedStyle({ props, tableHeaderLast, virtualScroll, virtualScrollX, virtualX_on, virtualX_offsetRight }) {
+  const fixedColumnsPositionStore = computed(() => {
+    const store = {};
+    const cols = [...tableHeaderLast.value];
+    let left = 0;
+    let rightStartIndex = 0;
+    for (let i = 0; i < cols.length; i++) {
+      const item = cols[i];
+      if (item.fixed === "left") {
+        store[item.dataIndex] = left;
+        left += getColWidth(item);
+      }
+      if (!rightStartIndex && item.fixed === "right") {
+        rightStartIndex = i;
+      }
+    }
+    let right = 0;
+    for (let i = cols.length - 1; i >= rightStartIndex; i--) {
+      const item = cols[i];
+      if (item.fixed === "right") {
+        store[item.dataIndex] = right;
+        right += getColWidth(item);
+      }
+    }
+    return store;
+  });
+  function getFixedStyle(tagType, col, depth = 0) {
+    const { fixed, dataIndex } = col;
+    const isFixedLeft = fixed === "left";
+    const style = {};
+    if (Is_Legacy_Mode) {
+      style.position = "relative";
+    } else {
+      style.position = "sticky";
+    }
+    if (tagType === 1) {
+      if (Is_Legacy_Mode) {
+        style.top = virtualScroll.value.scrollTop + depth * props.rowHeight + "px";
+      } else {
+        style.top = depth * props.rowHeight + "px";
+      }
+      style.zIndex = isFixedLeft ? "5" : "4";
+    } else {
+      style.zIndex = isFixedLeft ? "3" : "2";
+    }
+    if (fixed === "left" || fixed === "right") {
+      if (Is_Legacy_Mode) {
+        if (isFixedLeft) {
+          if (virtualX_on.value)
+            style.left = virtualScrollX.value.scrollLeft - virtualScrollX.value.offsetLeft + "px";
+          else
+            style.left = virtualScrollX.value.scrollLeft + "px";
+        } else {
+          style.right = `${virtualX_offsetRight.value}px`;
+        }
+      } else {
+        if (isFixedLeft) {
+          style.left = fixedColumnsPositionStore.value[dataIndex] + "px";
+        } else {
+          style.right = fixedColumnsPositionStore.value[dataIndex] + "px";
+        }
+      }
+    }
+    return style;
+  }
+  return {
+    getFixedStyle
+  };
+}
+function useHighlight({ props, tableContainer, rowKeyGen }) {
+  const highlightInter = computed(() => {
+    return interpolateRgb(Highlight_Color[props.theme].from, Highlight_Color[props.theme].to);
+  });
+  const highlightDimRows = /* @__PURE__ */ new Set();
+  const highlightDimRowsTimeout = /* @__PURE__ */ new Map();
+  const highlightDimCellsTimeout = /* @__PURE__ */ new Map();
+  let calcHighlightDimLoop = false;
+  function calcHighlightLoop() {
+    if (calcHighlightDimLoop)
+      return;
+    calcHighlightDimLoop = true;
+    const recursion = () => {
+      window.setTimeout(() => {
+        const nowTs = Date.now();
+        const needDeleteRows = [];
+        highlightDimRows.forEach((row) => {
+          const progress = (nowTs - row._bgc_progress_ms) / Highlight_Duration;
+          if (0 < progress && progress < 1) {
+            row._bgc = highlightInter.value(progress);
+          } else {
+            row._bgc = "";
+            needDeleteRows.push(row);
+          }
+        });
+        needDeleteRows.forEach((row) => highlightDimRows.delete(row));
+        if (highlightDimRows.size > 0) {
+          recursion();
+        } else {
+          calcHighlightDimLoop = false;
+        }
+      }, Highlight_Color_Change_Freq);
+    };
+    recursion();
+  }
+  function setHighlightDimCell(rowKeyValue, dataIndex) {
+    var _a;
+    const cellEl = (_a = tableContainer.value) == null ? void 0 : _a.querySelector(`[data-row-key="${rowKeyValue}"]>[data-index="${dataIndex}"]`);
+    if (!cellEl)
+      return;
+    if (cellEl.classList.contains("highlight-cell")) {
+      cellEl.classList.remove("highlight-cell");
+      void cellEl.offsetHeight;
+    }
+    cellEl.classList.add("highlight-cell");
+    window.clearTimeout(highlightDimCellsTimeout.get(rowKeyValue));
+    highlightDimCellsTimeout.set(
+      rowKeyValue,
+      window.setTimeout(() => {
+        cellEl.classList.remove("highlight-cell");
+        highlightDimCellsTimeout.delete(rowKeyValue);
+      }, Highlight_Duration)
+    );
+  }
+  function setHighlightDimRow(rowKeyValues) {
+    var _a, _b;
+    if (!Array.isArray(rowKeyValues))
+      rowKeyValues = [rowKeyValues];
+    if (props.virtual) {
+      const nowTs = Date.now();
+      for (let i = 0; i < rowKeyValues.length; i++) {
+        const rowKeyValue = rowKeyValues[i];
+        const row = props.dataSource.find((it) => rowKeyGen(it) === rowKeyValue);
+        if (!row)
+          continue;
+        row._bgc_progress_ms = nowTs;
+        highlightDimRows.add(row);
+      }
+      calcHighlightLoop();
+    } else {
+      let needRepaint = false;
+      const rowElTemp = [];
+      for (let i = 0; i < rowKeyValues.length; i++) {
+        const rowKeyValue = rowKeyValues[i];
+        const rowEl = (_a = tableContainer.value) == null ? void 0 : _a.querySelector(`[data-row-key="${rowKeyValue}"]`);
+        if (!rowEl)
+          continue;
+        if (rowEl.classList.contains("highlight-row")) {
+          rowEl.classList.remove("highlight-row");
+          needRepaint = true;
+        }
+        rowElTemp.push(rowEl);
+        window.clearTimeout(highlightDimRowsTimeout.get(rowKeyValue));
+        highlightDimRowsTimeout.set(
+          rowKeyValue,
+          window.setTimeout(() => {
+            rowEl.classList.remove("highlight-row");
+            highlightDimRowsTimeout.delete(rowKeyValue);
+          }, Highlight_Duration)
+        );
+      }
+      if (needRepaint) {
+        void ((_b = tableContainer.value) == null ? void 0 : _b.offsetWidth);
+      }
+      rowElTemp.forEach((el) => el.classList.add("highlight-row"));
+    }
+  }
+  return {
+    setHighlightDimRow,
+    setHighlightDimCell
+  };
+}
+const SCROLL_CODES = ["ArrowUp", "ArrowRight", "ArrowDown", "ArrowLeft", "PageUp", "PageDown"];
+function useKeyboardArrowScroll(targetElement, { props, scrollTo, virtualScroll, virtualScrollX, tableHeaders }) {
+  let isMouseOver = false;
+  onMounted(() => {
+    var _a, _b, _c;
+    window.addEventListener("keydown", handleKeydown);
+    (_a = targetElement.value) == null ? void 0 : _a.addEventListener("mouseenter", handleMouseEnter);
+    (_b = targetElement.value) == null ? void 0 : _b.addEventListener("mouseleave", handleMouseLeave);
+    (_c = targetElement.value) == null ? void 0 : _c.addEventListener("mousedown", handleMouseDown);
+  });
+  onBeforeUnmount(() => {
+    var _a, _b, _c;
+    window.removeEventListener("keydown", handleKeydown);
+    (_a = targetElement.value) == null ? void 0 : _a.removeEventListener("mouseenter", handleMouseEnter);
+    (_b = targetElement.value) == null ? void 0 : _b.removeEventListener("mouseleave", handleMouseLeave);
+    (_c = targetElement.value) == null ? void 0 : _c.removeEventListener("mousedown", handleMouseDown);
+  });
+  function handleKeydown(e) {
+    if (!SCROLL_CODES.includes(e.code))
+      return;
+    if (!isMouseOver)
+      return;
+    e.preventDefault();
+    const { scrollTop, rowHeight, pageSize } = virtualScroll.value;
+    const { scrollLeft } = virtualScrollX.value;
+    const { headless, headerRowHeight } = props;
+    const headerHeight = headless ? 0 : tableHeaders.value.length * (headerRowHeight || rowHeight);
+    if (e.code === SCROLL_CODES[0]) {
+      scrollTo(scrollTop - rowHeight, null);
+    } else if (e.code === SCROLL_CODES[1]) {
+      scrollTo(null, scrollLeft + rowHeight);
+    } else if (e.code === SCROLL_CODES[2]) {
+      scrollTo(scrollTop + rowHeight, null);
+    } else if (e.code === SCROLL_CODES[3]) {
+      scrollTo(null, scrollLeft - rowHeight);
+    } else if (e.code === SCROLL_CODES[4]) {
+      scrollTo(scrollTop - rowHeight * pageSize - headerHeight, null);
+    } else if (e.code === SCROLL_CODES[5]) {
+      scrollTo(scrollTop + rowHeight * pageSize - headerHeight, null);
+    }
+  }
+  function handleMouseEnter() {
+    isMouseOver = true;
+  }
+  function handleMouseLeave() {
+    isMouseOver = false;
+  }
+  function handleMouseDown() {
+    if (!isMouseOver)
+      isMouseOver = true;
+  }
+}
+function useThDrag({ props, emits }) {
+  let dragStartKey = void 0;
+  function findParentTH(el) {
+    let n = el;
+    while (n) {
+      if (n.tagName === "TH")
+        return n;
+      n = n.parentElement;
+    }
+  }
+  function onThDragStart(e) {
+    const th = findParentTH(e.target);
+    if (!th)
+      return;
+    dragStartKey = th.dataset.colKey;
+    emits("th-drag-start", dragStartKey);
+  }
+  function onThDragOver(e) {
+    const th = findParentTH(e.target);
+    if (!th)
+      return;
+    const isHeaderDraggable2 = th.getAttribute("draggable") === "true";
+    if (!isHeaderDraggable2) {
+      return;
+    }
+    e.preventDefault();
+  }
+  function onThDrop(e) {
+    const th = findParentTH(e.target);
+    if (!th)
+      return;
+    if (dragStartKey !== th.dataset.colKey) {
+      emits("col-order-change", dragStartKey, th.dataset.colKey);
+    }
+    emits("th-drop", th.dataset.colKey);
+  }
+  const isHeaderDragFun = typeof props.headerDrag === "function";
+  function isHeaderDraggable(col) {
+    if (isHeaderDragFun) {
+      return props.headerDrag(col);
+    } else {
+      return props.headerDrag;
+    }
+  }
+  return {
+    onThDragStart,
+    onThDragOver,
+    onThDrop,
+    isHeaderDraggable
+  };
+}
+const VUE2_SCROLL_TIMEOUT_MS = 200;
+function useVirtualScroll({ props, tableContainer, dataSourceCopy, tableHeaderLast }) {
+  const virtualScroll = ref({
+    containerHeight: 0,
+    rowHeight: props.rowHeight,
+    pageSize: 10,
+    startIndex: 0,
+    endIndex: 0,
+    offsetTop: 0,
+    scrollTop: 0
+  });
+  const virtualScrollX = ref({
+    containerWidth: 0,
+    startIndex: 0,
+    endIndex: 0,
+    offsetLeft: 0,
+    scrollLeft: 0
+  });
+  const virtual_on = computed(() => {
+    return props.virtual && dataSourceCopy.value.length > virtualScroll.value.pageSize * 2;
+  });
+  const virtual_dataSourcePart = computed(() => {
+    if (!virtual_on.value)
+      return dataSourceCopy.value;
+    const { startIndex, endIndex } = virtualScroll.value;
+    return dataSourceCopy.value.slice(startIndex, endIndex);
+  });
+  const virtual_offsetBottom = computed(() => {
+    if (!virtual_on.value)
+      return 0;
+    const { startIndex, rowHeight } = virtualScroll.value;
+    return (dataSourceCopy.value.length - startIndex - virtual_dataSourcePart.value.length) * rowHeight;
+  });
+  const virtualX_on = computed(() => {
+    return props.virtualX && tableHeaderLast.value.reduce((sum, col) => sum += getColWidth(col), 0) > virtualScrollX.value.containerWidth + 100;
+  });
+  const virtualX_columnPart = computed(() => {
+    if (virtualX_on.value) {
+      const leftCols = [];
+      const rightCols = [];
+      const { startIndex, endIndex } = virtualScrollX.value;
+      for (let i = 0; i < startIndex; i++) {
+        const col = tableHeaderLast.value[i];
+        if (col.fixed === "left")
+          leftCols.push(col);
+      }
+      for (let i = endIndex; i < tableHeaderLast.value.length; i++) {
+        const col = tableHeaderLast.value[i];
+        if (col.fixed === "right")
+          rightCols.push(col);
+      }
+      const mainColumns = tableHeaderLast.value.slice(startIndex, endIndex);
+      return leftCols.concat(mainColumns).concat(rightCols);
+    }
+    return tableHeaderLast.value;
+  });
+  const virtualX_offsetRight = computed(() => {
+    if (!virtualX_on.value)
+      return 0;
+    let width = 0;
+    for (let i = virtualScrollX.value.endIndex; i < tableHeaderLast.value.length; i++) {
+      const col = tableHeaderLast.value[i];
+      if (col.fixed !== "right") {
+        width += getColWidth(col);
+      }
+    }
+    return width;
+  });
+  function initVirtualScrollY(height) {
+    if (!virtual_on.value)
+      return;
+    const { offsetHeight, scrollTop } = tableContainer.value || {};
+    const { rowHeight } = virtualScroll.value;
+    let containerHeight;
+    if (typeof height === "number") {
+      containerHeight = height;
+    } else {
+      containerHeight = offsetHeight || Default_Table_Height;
+    }
+    Object.assign(virtualScroll.value, {
+      containerHeight,
+      pageSize: Math.ceil(containerHeight / rowHeight) + 1
+      // 这里最终+1，因为headless=true无头时，需要上下各预渲染一行。
+    });
+    updateVirtualScrollY(scrollTop);
+  }
+  function initVirtualScrollX() {
+    if (!props.virtualX)
+      return;
+    const { offsetWidth, scrollLeft } = tableContainer.value || {};
+    virtualScrollX.value.containerWidth = offsetWidth || Default_Table_Width;
+    updateVirtualScrollX(scrollLeft);
+  }
+  function initVirtualScroll(height) {
+    initVirtualScrollY(height);
+    initVirtualScrollX();
+  }
+  let vue2ScrollYTimeout = null;
+  function updateVirtualScrollY(sTop = 0) {
+    const { rowHeight, pageSize, scrollTop, startIndex: oldStartIndex } = virtualScroll.value;
+    const startIndex = Math.floor(sTop / rowHeight);
+    const offsetTop = startIndex * rowHeight;
+    let endIndex = startIndex + pageSize;
+    if (endIndex > dataSourceCopy.value.length) {
+      endIndex = dataSourceCopy.value.length;
+    }
+    if (vue2ScrollYTimeout) {
+      window.clearTimeout(vue2ScrollYTimeout);
+    }
+    if (!props.optimizeVue2Scroll || sTop <= scrollTop || Math.abs(oldStartIndex - startIndex) >= pageSize) {
+      Object.assign(virtualScroll.value, {
+        startIndex,
+        offsetTop,
+        endIndex,
+        scrollTop: sTop
+      });
+    } else {
+      Object.assign(virtualScroll.value, { endIndex, scrollTop: sTop });
+      vue2ScrollYTimeout = window.setTimeout(() => {
+        Object.assign(virtualScroll.value, { startIndex, offsetTop });
+      }, VUE2_SCROLL_TIMEOUT_MS);
+    }
+  }
+  let vue2ScrollXTimeout = null;
+  function updateVirtualScrollX(sLeft = 0) {
+    var _a;
+    const headerLength = (_a = tableHeaderLast.value) == null ? void 0 : _a.length;
+    const { scrollLeft } = virtualScrollX.value;
+    if (!headerLength)
+      return;
+    let startIndex = 0;
+    let offsetLeft = 0;
+    let colWidthSum = 0;
+    for (let colIndex = 0; colIndex < headerLength; colIndex++) {
+      startIndex++;
+      const col = tableHeaderLast.value[colIndex];
+      if (col.fixed === "left")
+        continue;
+      const colWidth = getColWidth(col);
+      colWidthSum += colWidth;
+      if (colWidthSum >= sLeft) {
+        offsetLeft = colWidthSum - colWidth;
+        startIndex--;
+        break;
+      }
+    }
+    colWidthSum = 0;
+    let endIndex = headerLength;
+    for (let colIndex = startIndex + 1; colIndex < headerLength; colIndex++) {
+      const col = tableHeaderLast.value[colIndex];
+      colWidthSum += getColWidth(col);
+      if (colWidthSum >= virtualScrollX.value.containerWidth) {
+        endIndex = colIndex + 1;
+        break;
+      }
+    }
+    if (endIndex > headerLength) {
+      endIndex = headerLength;
+    }
+    if (vue2ScrollXTimeout) {
+      window.clearTimeout(vue2ScrollXTimeout);
+    }
+    if (!props.optimizeVue2Scroll || sLeft <= scrollLeft) {
+      Object.assign(virtualScrollX.value, { startIndex, endIndex, offsetLeft, scrollLeft: sLeft });
+    } else {
+      Object.assign(virtualScrollX.value, { endIndex, scrollLeft: sLeft });
+      vue2ScrollXTimeout = window.setTimeout(() => {
+        Object.assign(virtualScrollX.value, { startIndex, offsetLeft });
+      }, VUE2_SCROLL_TIMEOUT_MS);
+    }
+  }
+  return {
+    virtualScroll,
+    virtualScrollX,
+    virtual_on,
+    virtual_dataSourcePart,
+    virtual_offsetBottom,
+    virtualX_on,
+    virtualX_columnPart,
+    virtualX_offsetRight,
+    initVirtualScroll,
+    initVirtualScrollY,
+    initVirtualScrollX,
+    updateVirtualScrollY,
+    updateVirtualScrollX
+  };
+}
+const _hoisted_1 = { key: 0 };
+const _hoisted_2 = ["data-col-key", "draggable", "rowspan", "colspan", "title", "onClick"];
+const _hoisted_3 = { class: "table-header-cell-wrapper" };
+const _hoisted_4 = { class: "table-header-title" };
+const _hoisted_5 = {
+  key: 2,
+  class: "table-header-sorter"
+};
+const _hoisted_6 = /* @__PURE__ */ createElementVNode("svg", {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "16px",
+  height: "16px",
+  viewBox: "0 0 16 16"
+}, [
+  /* @__PURE__ */ createElementVNode("polygon", {
+    class: "arrow-up",
+    fill: "#757699",
+    points: "8 2 4.8 6 11.2 6"
+  }),
+  /* @__PURE__ */ createElementVNode("polygon", {
+    class: "arrow-down",
+    transform: "translate(8, 12) rotate(-180) translate(-8, -12) ",
+    points: "8 10 4.8 14 11.2 14"
+  })
+], -1);
+const _hoisted_7 = [
+  _hoisted_6
+];
+const _hoisted_8 = ["onMousedown"];
+const _hoisted_9 = ["onMousedown"];
+const _hoisted_10 = {
+  key: 0,
+  class: "virtual-x-left",
+  style: { "padding": "0" }
+};
+const _hoisted_11 = ["data-row-key", "onClick", "onDblclick", "onContextmenu", "onMouseover"];
+const _hoisted_12 = {
+  key: 0,
+  class: "virtual-x-left",
+  style: { "padding": "0" }
+};
+const _hoisted_13 = ["data-index", "onClick"];
+const _hoisted_14 = ["title"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "StkTable",
+  props: {
+    width: { default: "" },
+    minWidth: { default: "" },
+    maxWidth: { default: "" },
+    stripe: { type: Boolean, default: false },
+    fixedMode: { type: Boolean, default: false },
+    headless: { type: Boolean, default: false },
+    theme: { default: "light" },
+    rowHeight: { default: Default_Row_Height },
+    headerRowHeight: { default: null },
+    virtual: { type: Boolean, default: false },
+    virtualX: { type: Boolean, default: false },
+    columns: { default: () => [] },
+    dataSource: { default: () => [] },
+    rowKey: { type: [String, Function], default: "" },
+    colKey: { type: [String, Function], default: "dataIndex" },
+    emptyCellText: { default: "--" },
+    noDataFull: { type: Boolean, default: false },
+    showNoData: { type: Boolean, default: true },
+    sortRemote: { type: Boolean, default: false },
+    showHeaderOverflow: { type: Boolean, default: false },
+    showOverflow: { type: Boolean, default: false },
+    showTrHoverClass: { type: Boolean, default: false },
+    headerDrag: { type: [Boolean, Function], default: false },
+    rowClassName: { type: Function, default: () => "" },
+    colResizable: { type: Boolean, default: false },
+    colMinWidth: { default: 10 },
+    bordered: { type: [Boolean, String], default: true },
+    autoResize: { type: [Boolean, Function], default: true },
+    fixedColShadow: { type: Boolean, default: false },
+    optimizeVue2Scroll: { type: Boolean, default: false }
+  },
+  emits: ["sort-change", "row-click", "current-change", "row-dblclick", "header-row-menu", "row-menu", "cell-click", "header-cell-click", "scroll", "scroll-x", "col-order-change", "th-drag-start", "th-drop", "update:columns"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const tableContainer = ref();
+    const colResizeIndicator = ref();
+    const currentItem = ref(null);
+    const currentItemKey = ref(null);
+    const currentHover = ref(null);
+    let sortCol = ref();
+    let sortOrderIndex = ref(0);
+    const sortSwitchOrder = [null, "desc", "asc"];
+    const tableHeaders = ref([]);
+    const tableHeaderLast = ref([]);
+    const dataSourceCopy = shallowRef([...props.dataSource]);
+    const rowKeyGenStore = /* @__PURE__ */ new WeakMap();
+    const { isColResizing, onThResizeMouseDown } = useColResize({
+      props,
+      emits,
+      colKeyGen,
+      colResizeIndicator,
+      tableContainer,
+      tableHeaderLast
+    });
+    const { onThDragStart, onThDragOver, onThDrop, isHeaderDraggable } = useThDrag({ props, emits });
+    const {
+      virtualScroll,
+      virtualScrollX,
+      virtual_on,
+      virtual_dataSourcePart,
+      virtual_offsetBottom,
+      virtualX_on,
+      virtualX_columnPart,
+      virtualX_offsetRight,
+      initVirtualScroll,
+      initVirtualScrollY,
+      initVirtualScrollX,
+      updateVirtualScrollY,
+      updateVirtualScrollX
+    } = useVirtualScroll({ tableContainer, props, dataSourceCopy, tableHeaderLast });
+    const { getFixedStyle } = useFixedStyle({
+      props,
+      tableHeaderLast,
+      virtualScroll,
+      virtualScrollX,
+      virtualX_on,
+      virtualX_offsetRight
+    });
+    const { setHighlightDimCell, setHighlightDimRow } = useHighlight({ props, tableContainer, rowKeyGen });
+    if (props.autoResize) {
+      useAutoResize({ tableContainer, initVirtualScroll, props, debounceMs: 200 });
+    }
+    useKeyboardArrowScroll(tableContainer, {
+      props,
+      scrollTo,
+      virtualScroll,
+      virtualScrollX,
+      tableHeaders
+    });
+    const { getFixedColClass, dealFixedColShadow, updateFixedShadow } = useFixedCol({
+      props,
+      tableContainer,
+      tableHeaderLast
+    });
+    watch(
+      () => props.columns,
+      () => {
+        dealColumns();
+        initVirtualScrollX();
+      }
+    );
+    dealColumns();
+    watch(
+      () => props.dataSource,
+      (val) => {
+        if (!val) {
+          console.warn("invalid dataSource");
+          return;
+        }
+        let needInitVirtualScrollY = false;
+        if (dataSourceCopy.value.length !== val.length) {
+          needInitVirtualScrollY = true;
+        }
+        dataSourceCopy.value = [...val];
+        if (needInitVirtualScrollY)
+          initVirtualScrollY();
+        if (sortCol.value) {
+          const column = tableHeaderLast.value.find((it) => it.dataIndex === sortCol.value);
+          onColumnSort(column, false);
+        }
+        updateFixedShadow();
+      },
+      {
+        deep: false
+      }
+    );
+    watch(() => props.fixedColShadow, dealFixedColShadow);
+    onMounted(() => {
+      initVirtualScroll();
+      updateFixedShadow();
+    });
+    function dealColumns() {
+      tableHeaders.value = [];
+      tableHeaderLast.value = [];
+      const copyColumn = props.columns;
+      const deep = howDeepTheHeader(copyColumn);
+      const tempHeaderLast = [];
+      if (deep > 1 && props.virtualX) {
+        console.error("多级表头不支持横向虚拟滚动");
+      }
+      function flat(arr, parent, depth = 0) {
+        if (!tableHeaders.value[depth]) {
+          tableHeaders.value[depth] = [];
+        }
+        let allChildrenLen = 0;
+        arr.forEach((col) => {
+          col.__PARENT__ = parent;
+          let colChildrenLen = 1;
+          if (col.children) {
+            colChildrenLen = flat(
+              col.children,
+              col,
+              depth + 1
+              /* , col.fixed */
+            );
+          } else {
+            tempHeaderLast.push(col);
+          }
+          tableHeaders.value[depth].push(col);
+          const rowSpan = col.children ? 1 : deep - depth;
+          const colSpan = colChildrenLen;
+          if (rowSpan !== 1) {
+            col.rowSpan = rowSpan;
+          }
+          if (colSpan !== 1) {
+            col.colSpan = colSpan;
+          }
+          allChildrenLen += colChildrenLen;
+        });
+        return allChildrenLen;
+      }
+      flat(copyColumn, null);
+      tableHeaderLast.value = tempHeaderLast;
+      dealFixedColShadow();
+    }
+    function rowKeyGen(row) {
+      if (!row)
+        return;
+      let key = rowKeyGenStore.get(row);
+      if (!key) {
+        key = typeof props.rowKey === "function" ? props.rowKey(row) : row[props.rowKey];
+        rowKeyGenStore.set(row, key);
+      }
+      return key;
+    }
+    function colKeyGen(col) {
+      return typeof props.colKey === "function" ? props.colKey(col) : col[props.colKey];
+    }
+    function getColWidthStyle(col) {
+      const style = {
+        width: col.width,
+        minWidth: col.minWidth,
+        maxWidth: col.maxWidth
+      };
+      if (props.colResizable) {
+        style.minWidth = col.width;
+        style.maxWidth = col.width;
+      } else {
+        style.minWidth = col.minWidth === void 0 ? col.width : col.minWidth;
+        style.maxWidth = col.maxWidth === void 0 ? col.width : col.maxWidth;
+      }
+      return style;
+    }
+    function getCellStyle(tagType, col, depth) {
+      const style = {
+        ...getColWidthStyle(col),
+        ...getFixedStyle(tagType, col, depth)
+      };
+      if (tagType === 1) {
+        style.textAlign = col.headerAlign;
+      } else if (tagType === 2) {
+        style.textAlign = col.align;
+      }
+      return style;
+    }
+    function onColumnSort(col, click = true, options = {}) {
+      if (!(col == null ? void 0 : col.sorter))
+        return;
+      options = { force: false, emit: false, ...options };
+      if (sortCol.value !== col.dataIndex) {
+        sortCol.value = col.dataIndex;
+        sortOrderIndex.value = 0;
+      }
+      if (click)
+        sortOrderIndex.value++;
+      sortOrderIndex.value = sortOrderIndex.value % 3;
+      const order = sortSwitchOrder[sortOrderIndex.value];
+      if (!props.sortRemote || options.force) {
+        dataSourceCopy.value = tableSort(col, order, props.dataSource);
+      }
+      if (click || options.emit) {
+        emits("sort-change", col, order, toRaw(dataSourceCopy.value));
+      }
+    }
+    function onRowClick(e, row) {
+      emits("row-click", e, row);
+      if (props.rowKey ? currentItemKey.value === rowKeyGen(row) : currentItem.value === row)
+        return;
+      currentItem.value = row;
+      currentItemKey.value = rowKeyGen(row);
+      emits("current-change", e, row);
+    }
+    function onRowDblclick(e, row) {
+      emits("row-dblclick", e, row);
+    }
+    function onHeaderMenu(e) {
+      emits("header-row-menu", e);
+    }
+    function onRowMenu(e, row) {
+      emits("row-menu", e, row);
+    }
+    function onCellClick(e, row, col) {
+      emits("cell-click", e, row, col);
+    }
+    function onHeaderCellClick(e, col) {
+      emits("header-cell-click", e, col);
+    }
+    function onTableWheel(e) {
+      if (isColResizing.value) {
+        e.preventDefault();
+        e.stopPropagation();
+        return;
+      }
+    }
+    function onTableScroll(e) {
+      if (!(e == null ? void 0 : e.target))
+        return;
+      const { scrollTop, scrollLeft } = e.target;
+      const { scrollTop: vScrollTop } = virtualScroll.value;
+      const { scrollLeft: vScrollLeft } = virtualScrollX.value;
+      const isYScroll = scrollTop !== vScrollTop;
+      const isXScroll = scrollLeft !== vScrollLeft;
+      if (isYScroll && virtual_on.value) {
+        updateVirtualScrollY(scrollTop);
+      }
+      if (isXScroll) {
+        updateFixedShadow();
+        if (virtualX_on.value) {
+          updateVirtualScrollX(scrollLeft);
+        } else {
+          virtualScrollX.value.scrollLeft = scrollLeft;
+        }
+      }
+      const { startIndex, endIndex } = virtualScroll.value;
+      const data = { startIndex, endIndex };
+      if (isYScroll) {
+        emits("scroll", e, data);
+      }
+      if (isXScroll) {
+        emits("scroll-x", e);
+      }
+    }
+    function onTrMouseOver(_e, row) {
+      if (props.showTrHoverClass) {
+        currentHover.value = rowKeyGen(row);
+      }
+    }
+    function setCurrentRow(rowKey, option = { silent: false }) {
+      if (!dataSourceCopy.value.length)
+        return;
+      currentItem.value = dataSourceCopy.value.find((it) => rowKeyGen(it) === rowKey);
+      currentItemKey.value = rowKeyGen(currentItem.value);
+      if (!option.silent) {
+        emits("current-change", null, currentItem.value);
+      }
+    }
+    function setSorter(dataIndex, order, option = {}) {
+      var _a;
+      const newOption = { silent: true, sortOption: null, sort: true, ...option };
+      sortCol.value = dataIndex;
+      sortOrderIndex.value = sortSwitchOrder.findIndex((it) => it === order);
+      if (newOption.sort && ((_a = dataSourceCopy.value) == null ? void 0 : _a.length)) {
+        const column = newOption.sortOption || tableHeaderLast.value.find((it) => it.dataIndex === sortCol.value);
+        if (column)
+          onColumnSort(column, false, { force: true, emit: !newOption.silent });
+        else
+          console.warn("Can not find column by dataIndex:", sortCol.value);
+      }
+      return dataSourceCopy.value;
+    }
+    function resetSorter() {
+      sortCol.value = null;
+      sortOrderIndex.value = 0;
+      dataSourceCopy.value = [...props.dataSource];
+    }
+    function scrollTo(top = 0, left = 0) {
+      if (!tableContainer.value)
+        return;
+      if (top !== null)
+        tableContainer.value.scrollTop = top;
+      if (left !== null)
+        tableContainer.value.scrollLeft = left;
+    }
+    function getTableData() {
+      return toRaw(dataSourceCopy.value);
+    }
+    function getSortColumns() {
+      const sortOrder = sortSwitchOrder[sortOrderIndex.value];
+      if (!sortOrder)
+        return [];
+      return [{ dataIndex: sortCol.value, order: sortOrder }];
+    }
+    __expose({
+      /** 初始化横向纵向虚拟滚动 */
+      initVirtualScroll,
+      /** 初始化横向虚拟滚动 */
+      initVirtualScrollX,
+      /** 初始化纵向虚拟滚动 */
+      initVirtualScrollY,
+      /** 设置当前选中行 */
+      setCurrentRow,
+      /** 设置高亮渐暗单元格 */
+      setHighlightDimCell,
+      /** 设置高亮渐暗行 */
+      setHighlightDimRow,
+      /** 表格排序列dataIndex */
+      sortCol,
+      /** 获取当前排序状态 */
+      getSortColumns,
+      /** 设置排序 */
+      setSorter,
+      /** 重置排序 */
+      resetSorter,
+      /** 滚动至 */
+      scrollTo,
+      /** 获取表格数据 */
+      getTableData
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "tableContainer",
+        ref: tableContainer,
+        class: normalizeClass(["stk-table", {
+          virtual: _ctx.virtual,
+          "virtual-x": _ctx.virtualX,
+          dark: _ctx.theme === "dark",
+          headless: _ctx.headless,
+          "is-col-resizing": unref(isColResizing),
+          "col-resizable": props.colResizable,
+          border: props.bordered,
+          "border-h": props.bordered === "h",
+          "border-v": props.bordered === "v",
+          "border-body-v": props.bordered === "body-v",
+          stripe: props.stripe
+        }]),
+        style: normalizeStyle(
+          _ctx.virtual && {
+            "--row-height": unref(virtualScroll).rowHeight + "px",
+            "--header-row-height": (props.headerRowHeight || props.rowHeight) + "px"
+          }
+        ),
+        onScroll: onTableScroll,
+        onWheel: onTableWheel
+      }, [
+        withDirectives(createElementVNode("div", {
+          ref_key: "colResizeIndicator",
+          ref: colResizeIndicator,
+          class: "column-resize-indicator"
+        }, null, 512), [
+          [vShow, _ctx.colResizable]
+        ]),
+        createElementVNode("table", {
+          class: normalizeClass(["stk-table-main", {
+            "fixed-mode": props.fixedMode
+          }]),
+          style: normalizeStyle({ width: _ctx.width, minWidth: _ctx.minWidth, maxWidth: _ctx.maxWidth })
+        }, [
+          !_ctx.headless ? (openBlock(), createElementBlock("thead", _hoisted_1, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(tableHeaders.value, (row, rowIndex) => {
+              return openBlock(), createElementBlock("tr", {
+                key: rowIndex,
+                onContextmenu: _cache[3] || (_cache[3] = (e) => onHeaderMenu(e))
+              }, [
+                unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
+                  key: 0,
+                  class: "virtual-x-left",
+                  style: normalizeStyle({
+                    minWidth: unref(virtualScrollX).offsetLeft + "px",
+                    width: unref(virtualScrollX).offsetLeft + "px"
+                  })
+                }, null, 4)) : createCommentVNode("", true),
+                (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_on) && rowIndex === tableHeaders.value.length - 1 ? unref(virtualX_columnPart) : row, (col, colIndex) => {
+                  return openBlock(), createElementBlock("th", {
+                    key: col.dataIndex,
+                    "data-col-key": colKeyGen(col),
+                    draggable: unref(isHeaderDraggable)(col) ? "true" : "false",
+                    rowspan: unref(virtualX_on) ? 1 : col.rowSpan,
+                    colspan: col.colSpan,
+                    style: normalizeStyle(getCellStyle(1, col, rowIndex)),
+                    title: col.title,
+                    class: normalizeClass([
+                      col.sorter ? "sortable" : "",
+                      col.dataIndex === unref(sortCol) && unref(sortOrderIndex) !== 0 && "sorter-" + sortSwitchOrder[unref(sortOrderIndex)],
+                      _ctx.showHeaderOverflow ? "text-overflow" : "",
+                      col.headerClassName,
+                      unref(getFixedColClass)(col)
+                    ]),
+                    onClick: (e) => {
+                      onColumnSort(col);
+                      onHeaderCellClick(e, col);
+                    },
+                    onDragstart: _cache[0] || (_cache[0] = //@ts-ignore
+                    (...args) => unref(onThDragStart) && unref(onThDragStart)(...args)),
+                    onDrop: _cache[1] || (_cache[1] = //@ts-ignore
+                    (...args) => unref(onThDrop) && unref(onThDrop)(...args)),
+                    onDragover: _cache[2] || (_cache[2] = //@ts-ignore
+                    (...args) => unref(onThDragOver) && unref(onThDragOver)(...args))
+                  }, [
+                    createElementVNode("div", _hoisted_3, [
+                      col.customHeaderCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customHeaderCell), {
+                        key: 0,
+                        col
+                      }, null, 8, ["col"])) : renderSlot(_ctx.$slots, "tableHeader", {
+                        key: 1,
+                        col
+                      }, () => [
+                        createElementVNode("span", _hoisted_4, toDisplayString(col.title), 1)
+                      ]),
+                      col.sorter ? (openBlock(), createElementBlock("span", _hoisted_5, _hoisted_7)) : createCommentVNode("", true),
+                      _ctx.colResizable && colIndex > 0 ? (openBlock(), createElementBlock("div", {
+                        key: 3,
+                        class: "table-header-resizer left",
+                        onMousedown: (e) => unref(onThResizeMouseDown)(e, col, true)
+                      }, null, 40, _hoisted_8)) : createCommentVNode("", true),
+                      _ctx.colResizable ? (openBlock(), createElementBlock("div", {
+                        key: 4,
+                        class: "table-header-resizer right",
+                        onMousedown: (e) => unref(onThResizeMouseDown)(e, col)
+                      }, null, 40, _hoisted_9)) : createCommentVNode("", true)
+                    ])
+                  ], 46, _hoisted_2);
+                }), 128)),
+                unref(virtualX_on) ? (openBlock(), createElementBlock("th", {
+                  key: 1,
+                  class: "virtual-x-right",
+                  style: normalizeStyle({
+                    minWidth: unref(virtualX_offsetRight) + "px",
+                    width: unref(virtualX_offsetRight) + "px"
+                  })
+                }, null, 4)) : createCommentVNode("", true)
+              ], 32);
+            }), 128))
+          ])) : createCommentVNode("", true),
+          createElementVNode("tbody", null, [
+            unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
+              key: 0,
+              style: normalizeStyle({ height: `${unref(virtualScroll).offsetTop}px` }),
+              class: "padding-top-tr"
+            }, [
+              unref(virtualX_on) && _ctx.fixedMode && _ctx.headless ? (openBlock(), createElementBlock("td", _hoisted_10)) : createCommentVNode("", true),
+              _ctx.fixedMode && _ctx.headless ? (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(unref(virtualX_columnPart), (col) => {
+                return openBlock(), createElementBlock("td", {
+                  key: col.dataIndex,
+                  style: normalizeStyle(getCellStyle(2, col))
+                }, null, 4);
+              }), 128)) : createCommentVNode("", true)
+            ], 4)) : createCommentVNode("", true),
+            (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtual_dataSourcePart), (row, i) => {
+              return openBlock(), createElementBlock("tr", {
+                key: _ctx.rowKey ? rowKeyGen(row) : i,
+                "data-row-key": _ctx.rowKey ? rowKeyGen(row) : i,
+                class: normalizeClass({
+                  active: _ctx.rowKey ? rowKeyGen(row) === rowKeyGen(currentItem.value) : row === currentItem.value,
+                  hover: _ctx.rowKey ? rowKeyGen(row) === currentHover.value : row === currentHover.value,
+                  [_ctx.rowClassName(row, i)]: true
+                }),
+                style: normalizeStyle({
+                  backgroundColor: row._bgc
+                }),
+                onClick: (e) => onRowClick(e, row),
+                onDblclick: (e) => onRowDblclick(e, row),
+                onContextmenu: (e) => onRowMenu(e, row),
+                onMouseover: (e) => onTrMouseOver(e, row)
+              }, [
+                unref(virtualX_on) ? (openBlock(), createElementBlock("td", _hoisted_12)) : createCommentVNode("", true),
+                (openBlock(true), createElementBlock(Fragment, null, renderList(unref(virtualX_columnPart), (col) => {
+                  return openBlock(), createElementBlock("td", {
+                    key: col.dataIndex,
+                    "data-index": col.dataIndex,
+                    class: normalizeClass([col.className, _ctx.showOverflow ? "text-overflow" : "", unref(getFixedColClass)(col)]),
+                    style: normalizeStyle(getCellStyle(2, col)),
+                    onClick: (e) => onCellClick(e, row, col)
+                  }, [
+                    col.customCell ? (openBlock(), createBlock(resolveDynamicComponent(col.customCell), {
+                      key: 0,
+                      col,
+                      row,
+                      "cell-value": row[col.dataIndex]
+                    }, null, 8, ["col", "row", "cell-value"])) : (openBlock(), createElementBlock("div", {
+                      key: 1,
+                      class: "table-cell-wrapper",
+                      title: row[col.dataIndex]
+                    }, toDisplayString(row[col.dataIndex] ?? _ctx.emptyCellText), 9, _hoisted_14))
+                  ], 14, _hoisted_13);
+                }), 128))
+              ], 46, _hoisted_11);
+            }), 128)),
+            unref(virtual_on) ? (openBlock(), createElementBlock("tr", {
+              key: 1,
+              style: normalizeStyle({ height: `${unref(virtual_offsetBottom)}px` })
+            }, null, 4)) : createCommentVNode("", true)
+          ])
+        ], 6),
+        (!dataSourceCopy.value || !dataSourceCopy.value.length) && _ctx.showNoData ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(["stk-table-no-data", { "no-data-full": _ctx.noDataFull }])
+        }, [
+          renderSlot(_ctx.$slots, "empty", {}, () => [
+            createTextVNode("暂无数据")
+          ])
+        ], 2)) : createCommentVNode("", true)
+      ], 38);
+    };
+  }
+});
+export {
+  _sfc_main as StkTable,
+  insertToOrderedArray,
+  tableSort
+};