bkui-vue 0.0.1-beta.88 → 0.0.1-beta.90

package/dist/index.esm.js

@@ -208,20 +208,20 @@ function isShadowRoot(node) {
 }
 function applyStyles(_ref) {
   var state = _ref.state;
-  Object.keys(state.elements).forEach(function(name2) {
-    var style = state.styles[name2] || {};
-    var attributes = state.attributes[name2] || {};
-    var element = state.elements[name2];
+  Object.keys(state.elements).forEach(function(name) {
+    var style = state.styles[name] || {};
+    var attributes = state.attributes[name] || {};
+    var element = state.elements[name];
     if (!isHTMLElement(element) || !getNodeName(element)) {
       return;
     }
     Object.assign(element.style, style);
-    Object.keys(attributes).forEach(function(name3) {
-      var value = attributes[name3];
+    Object.keys(attributes).forEach(function(name2) {
+      var value = attributes[name2];
       if (value === false) {
-        element.removeAttribute(name3);
+        element.removeAttribute(name2);
       } else {
-        element.setAttribute(name3, value === true ? "" : value);
+        element.setAttribute(name2, value === true ? "" : value);
       }
     });
   });
@@ -246,10 +246,10 @@ function effect$2(_ref2) {
     Object.assign(state.elements.arrow.style, initialStyles.arrow);
   }
   return function() {
-    Object.keys(state.elements).forEach(function(name2) {
-      var element = state.elements[name2];
-      var attributes = state.attributes[name2] || {};
-      var styleProperties = Object.keys(state.styles.hasOwnProperty(name2) ? state.styles[name2] : initialStyles[name2]);
+    Object.keys(state.elements).forEach(function(name) {
+      var element = state.elements[name];
+      var attributes = state.attributes[name] || {};
+      var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]);
       var style = styleProperties.reduce(function(style2, property) {
         style2[property] = "";
         return style2;
@@ -428,7 +428,7 @@ var toPaddingObject = function toPaddingObject2(padding, state) {
 };
 function arrow(_ref) {
   var _state$modifiersData$;
-  var state = _ref.state, name2 = _ref.name, options = _ref.options;
+  var state = _ref.state, name = _ref.name, options = _ref.options;
   var arrowElement = state.elements.arrow;
   var popperOffsets2 = state.modifiersData.popperOffsets;
   var basePlacement = getBasePlacement(state.placement);
@@ -452,7 +452,7 @@ function arrow(_ref) {
   var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
   var offset2 = within(min2, center, max2);
   var axisProp = axis;
-  state.modifiersData[name2] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset2, _state$modifiersData$.centerOffset = offset2 - center, _state$modifiersData$);
+  state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset2, _state$modifiersData$.centerOffset = offset2 - center, _state$modifiersData$);
 }
 function effect$1(_ref2) {
   var state = _ref2.state, options = _ref2.options;
@@ -908,8 +908,8 @@ function getExpandedFallbackPlacements(placement) {
   return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
 }
 function flip(_ref) {
-  var state = _ref.state, options = _ref.options, name2 = _ref.name;
-  if (state.modifiersData[name2]._skip) {
+  var state = _ref.state, options = _ref.options, name = _ref.name;
+  if (state.modifiersData[name]._skip) {
     return;
   }
   var _options$mainAxis = options.mainAxis, checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis, _options$altAxis = options.altAxis, checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis, specifiedFallbackPlacements = options.fallbackPlacements, padding = options.padding, boundary = options.boundary, rootBoundary = options.rootBoundary, altBoundary = options.altBoundary, _options$flipVariatio = options.flipVariations, flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio, allowedAutoPlacements = options.allowedAutoPlacements;
@@ -989,7 +989,7 @@ function flip(_ref) {
     }
   }
   if (state.placement !== firstFittingPlacement) {
-    state.modifiersData[name2]._skip = true;
+    state.modifiersData[name]._skip = true;
     state.placement = firstFittingPlacement;
     state.reset = true;
   }
@@ -1024,7 +1024,7 @@ function isAnySideFullyClipped(overflow) {
   });
 }
 function hide(_ref) {
-  var state = _ref.state, name2 = _ref.name;
+  var state = _ref.state, name = _ref.name;
   var referenceRect = state.rects.reference;
   var popperRect = state.rects.popper;
   var preventedOffsets = state.modifiersData.preventOverflow;
@@ -1038,7 +1038,7 @@ function hide(_ref) {
   var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
   var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
   var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
-  state.modifiersData[name2] = {
+  state.modifiersData[name] = {
     referenceClippingOffsets,
     popperEscapeOffsets,
     isReferenceHidden,
@@ -1073,7 +1073,7 @@ function distanceAndSkiddingToXY(placement, rects, offset2) {
   };
 }
 function offset(_ref2) {
-  var state = _ref2.state, options = _ref2.options, name2 = _ref2.name;
+  var state = _ref2.state, options = _ref2.options, name = _ref2.name;
   var _options$offset = options.offset, offset2 = _options$offset === void 0 ? [0, 0] : _options$offset;
   var data2 = placements$1.reduce(function(acc, placement) {
     acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset2);
@@ -1084,7 +1084,7 @@ function offset(_ref2) {
     state.modifiersData.popperOffsets.x += x2;
     state.modifiersData.popperOffsets.y += y2;
   }
-  state.modifiersData[name2] = data2;
+  state.modifiersData[name] = data2;
 }
 var offset$1 = {
   name: "offset",
@@ -1094,8 +1094,8 @@ var offset$1 = {
   fn: offset
 };
 function popperOffsets(_ref) {
-  var state = _ref.state, name2 = _ref.name;
-  state.modifiersData[name2] = computeOffsets({
+  var state = _ref.state, name = _ref.name;
+  state.modifiersData[name] = computeOffsets({
     reference: state.rects.reference,
     element: state.rects.popper,
     strategy: "absolute",
@@ -1113,7 +1113,7 @@ function getAltAxis(axis) {
   return axis === "x" ? "y" : "x";
 }
 function preventOverflow(_ref) {
-  var state = _ref.state, options = _ref.options, name2 = _ref.name;
+  var state = _ref.state, options = _ref.options, name = _ref.name;
   var _options$mainAxis = options.mainAxis, checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis, _options$altAxis = options.altAxis, checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis, boundary = options.boundary, rootBoundary = options.rootBoundary, altBoundary = options.altBoundary, padding = options.padding, _options$tether = options.tether, tether = _options$tether === void 0 ? true : _options$tether, _options$tetherOffset = options.tetherOffset, tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
   var overflow = detectOverflow(state, {
     boundary,
@@ -1194,7 +1194,7 @@ function preventOverflow(_ref) {
     popperOffsets2[altAxis] = _preventedOffset;
     data2[altAxis] = _preventedOffset - _offset;
   }
-  state.modifiersData[name2] = data2;
+  state.modifiersData[name] = data2;
 }
 var preventOverflow$1 = {
   name: "preventOverflow",
@@ -1395,12 +1395,12 @@ function popperGenerator(generatorOptions) {
             index = -1;
             continue;
           }
-          var _state$orderedModifie = state.orderedModifiers[index], fn2 = _state$orderedModifie.fn, _state$orderedModifie2 = _state$orderedModifie.options, _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2, name2 = _state$orderedModifie.name;
+          var _state$orderedModifie = state.orderedModifiers[index], fn2 = _state$orderedModifie.fn, _state$orderedModifie2 = _state$orderedModifie.options, _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2, name = _state$orderedModifie.name;
           if (typeof fn2 === "function") {
             state = fn2({
               state,
               options: _options,
-              name: name2,
+              name,
               instance
             }) || state;
           }
@@ -1427,11 +1427,11 @@ function popperGenerator(generatorOptions) {
     });
     function runModifierEffects() {
       state.orderedModifiers.forEach(function(_ref3) {
-        var name2 = _ref3.name, _ref3$options = _ref3.options, options2 = _ref3$options === void 0 ? {} : _ref3$options, effect2 = _ref3.effect;
+        var name = _ref3.name, _ref3$options = _ref3.options, options2 = _ref3$options === void 0 ? {} : _ref3$options, effect2 = _ref3.effect;
         if (typeof effect2 === "function") {
           var cleanupFn = effect2({
             state,
-            name: name2,
+            name,
             instance,
             options: options2
           });
@@ -2284,13 +2284,13 @@ class PropTypes extends propTypesNS {
       default: "top"
     });
   }
-  static commonType(types = [], name2 = "commonType") {
-    return j(name2.replace(/^\S/, (s2) => s2.toUpperCase()), {
+  static commonType(types = [], name = "commonType") {
+    return j(name.replace(/^\S/, (s2) => s2.toUpperCase()), {
       type: String,
       validator: (val) => {
         const valid = types.includes(val);
         if (!valid) {
-          console.error(`invalid ${name2}, ${val}, the ${name2} must be one of \u3010${types.join(" | ")}\u3011`);
+          console.error(`invalid ${name}, ${val}, the ${name} must be one of \u3010${types.join(" | ")}\u3011`);
         }
         return valid;
       },
@@ -2405,7 +2405,7 @@ function generate(node, key, rootAttrs) {
 const bkIcon = (props, context) => {
   const _a = __spreadValues(__spreadValues({}, context.attrs), props), {
     data: data2,
-    name: name2,
+    name,
     width,
     height,
     fill
@@ -2417,7 +2417,7 @@ const bkIcon = (props, context) => {
     "fill"
   ]);
   const rootAttrs = `width: ${width}; height: ${height}; fill: ${fill}`;
-  return createVNode("span", restProps, [generate(data2, name2, rootAttrs)]);
+  return createVNode("span", restProps, [generate(data2, name, rootAttrs)]);
 };
 bkIcon.inheritAttrs = false;
 bkIcon.displayName = "bkIcon";
@@ -9126,8 +9126,8 @@ var Component$u = defineComponent({
       const newVal = handleNumber(props.step, false);
       ctx.emit(EVENTS$2.UPDATE, newVal);
     }
-    function getCls(name2) {
-      return `${inputClsPrefix.value}--${name2}`;
+    function getCls(name) {
+      return `${inputClsPrefix.value}--${name}`;
     }
     function handleVisibleChange() {
       pwdVisible.value = !pwdVisible.value;
@@ -10146,6 +10146,7 @@ const PopoverProps = __spreadValues({
   ]),
   boundary: PropTypes.oneOfType([PropTypes.string.def("parent"), PropTypes.instanceOf(HTMLElement)]),
   fixOnBoundary: PropTypes.bool.def(false),
+  zIndex: PropTypes.number.def(void 0),
   stopBehaviors: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.commonType([
       "stopPropagation",
@@ -10162,6 +10163,7 @@ var Component$l = defineComponent({
   setup(props, ctx) {
     let isPopInstance = false;
     let popoverInstance = /* @__PURE__ */ Object.create(null);
+    const localZIndex = ref(0);
     const {
       width,
       height,
@@ -10178,7 +10180,7 @@ var Component$l = defineComponent({
     const compStyle = computed(() => ({
       width: /^\d+$/.test(String(width.value)) ? `${width.value}px` : width.value,
       height: /^\d+$/.test(String(height.value)) ? `${height.value}px` : height.value,
-      zIndex: bkZIndexManager.getModalNextIndex()
+      zIndex: localZIndex.value
     }));
     const themeList = ["dark", "light"];
     const compTheme = computed(() => {
@@ -10194,7 +10196,12 @@ var Component$l = defineComponent({
     const handlePopShow = (val) => {
       var _a, _b;
       if (isPopInstance) {
-        val ? (_a = popoverInstance.show) == null ? void 0 : _a.call(popoverInstance) : (_b = popoverInstance.hide) == null ? void 0 : _b.call(popoverInstance);
+        if (val) {
+          localZIndex.value = typeof props.zIndex === "number" ? props.zIndex : bkZIndexManager.getModalNextIndex();
+          (_a = popoverInstance.show) == null ? void 0 : _a.call(popoverInstance);
+          return;
+        }
+        (_b = popoverInstance.hide) == null ? void 0 : _b.call(popoverInstance);
       }
     };
     watch(() => props.isShow, (val) => {
@@ -10527,7 +10534,7 @@ const useRadio = () => {
   const formItem = useFormItem();
   const radioGroup = inject(radioGroupKey, EMPTY_OBJ);
   const isGroup = !isEmptyObj(radioGroup);
-  const isChecked = ref(props.checked);
+  const isChecked = ref(false);
   const isDisabled = computed(() => {
     if (isGroup && radioGroup.props.disabled) {
       return true;
@@ -10537,6 +10544,8 @@ const useRadio = () => {
   if (isGroup) {
     watch(() => radioGroup.props.modelValue, (modelValue) => {
       isChecked.value = modelValue === props.label;
+    }, {
+      immediate: true
     });
   } else {
     watch(() => props.modelValue, (modelValue) => {
@@ -10670,7 +10679,6 @@ var RadioButton = defineComponent({
     } = useRadio();
     return {
       isFocused,
-      realName: name,
       isChecked,
       isDisabled,
       setChecked,
@@ -13022,6 +13030,7 @@ var EVENTS$1 = /* @__PURE__ */ ((EVENTS2) => {
   EVENTS2["ON_SORT_BY_CLICK"] = "onSortByClick";
   EVENTS2["ON_FILTER_CLICK"] = "onFilterClick";
   EVENTS2["ON_SETTING_CHANGE"] = "onSettingChange";
+  EVENTS2["ON_ROW_EXPAND_CLICK"] = "onRowExpandClick";
   return EVENTS2;
 })(EVENTS$1 || {});
 var EMITEVENTS = /* @__PURE__ */ ((EMITEVENTS2) => {
@@ -13030,6 +13039,7 @@ var EMITEVENTS = /* @__PURE__ */ ((EMITEVENTS2) => {
   EMITEVENTS2["COLUMN_FILTER"] = "columnFilter";
   EMITEVENTS2["ROW_CLICK"] = "rowClick";
   EMITEVENTS2["ROW_DBL_CLICK"] = "rowDblClick";
+  EMITEVENTS2["ROW_EXPAND_CLICK"] = "rowExpand";
   EMITEVENTS2["PAGE_LIMIT_CHANGE"] = "pageLimitChange";
   EMITEVENTS2["PAGE_VALUE_CHANGE"] = "pageValueChange";
   EMITEVENTS2["SETTING_CHANGE"] = "settingChange";
@@ -13043,671 +13053,407 @@ const EMIT_EVENT_TYPES = {
   ["columnSort"]: EMPTY$1,
   ["rowClick"]: EMPTY$1,
   ["rowDblClick"]: EMPTY$1,
+  ["rowExpand"]: EMPTY$1,
   ["pageLimitChange"]: EMPTY$1,
   ["pageValueChange"]: EMPTY$1,
   ["settingChange"]: EMPTY$1,
   ["scrollBottom"]: EMPTY$1
 };
-const resolvePropVal = (prop, key, args) => {
-  if (Object.prototype.hasOwnProperty.call(prop, key)) {
-    if (typeof prop[key] === "function") {
-      return prop[key].call(globalThis, ...args);
-    }
-    return prop[key];
-  }
-  return void 0;
-};
-const resolveNumberToNumArray = (prop) => {
-  if (/^\d+$/.test(`${prop}`)) {
-    return [parseInt(`${prop}`, 10)];
-  }
-  return [];
-};
-const resolveWidth = (propWidth) => resolveNumberOrStringToPix(propWidth, "auto");
-const resolveNumberOrStringToPix = (val, defaultValue = "100%", offset2 = null) => {
-  let target = "";
-  if (/^auto|null|undefined$/ig.test(`${val}`)) {
-    target = defaultValue;
-  } else {
-    target = /^\d+\.?\d+$/.test(`${val}`) ? `${val}px` : val;
-  }
-  if (offset2) {
-    target = `calc(${target} - ${offset2})`;
-  }
-  return target;
+const TABLE_ROW_ATTRIBUTE = {
+  ROW_INDEX: "__$table_row_index",
+  ROW_UID: "__$uuid",
+  ROW_EXPAND: "__row_expand"
 };
-const resolvePropBorderToClassStr = (val) => {
-  const defaultVal = ["row"];
-  if (typeof val === "string") {
-    defaultVal.push(val);
-  }
-  if (Array.isArray(val)) {
-    defaultVal.push(...val.filter((str) => BORDER_OPRIONS.includes(str)));
+const resolvePaginationOption = (propPagination, defVal) => {
+  if (!!propPagination) {
+    if (typeof propPagination === "object") {
+      let current = Object.prototype.hasOwnProperty.call(propPagination, "current") ? propPagination.current : propPagination.value;
+      if (!/\d+/.test(current)) {
+        current = 1;
+      }
+      return __spreadProps(__spreadValues(__spreadValues({}, defVal), propPagination), {
+        current
+      });
+    }
+    return defVal;
   }
-  return [...new Set(defaultVal)].map((item) => `bordered-${item}`).join(" ");
-};
-const getColumnReactWidth = (colmun, orders = ["resizeWidth", "calcWidth", "width"]) => {
-  var _a, _b;
-  return (_b = (_a = colmun[orders[0]]) != null ? _a : colmun[orders[1]]) != null ? _b : colmun[orders[2]];
+  return {};
 };
-const resolveColumnWidth = (root, colgroups, autoWidth = 20) => {
-  const {
-    width
-  } = root.getBoundingClientRect() || {};
-  let avgWidth = width - 4;
-  const avgColIndexList = [];
-  const getMinWidth = (col, computedWidth) => {
-    const {
-      minWidth = void 0
-    } = col;
-    if (minWidth === void 0) {
-      return computedWidth;
-    }
-    let calcMinWidth = computedWidth;
-    if (/^\d+\.?\d*$/.test(`${minWidth}`)) {
-      calcMinWidth = Number(minWidth);
-    }
-    if (/^\d+\.?\d*%$/.test(`${minWidth}`)) {
-      calcMinWidth = Number(minWidth) * width / 100;
-    }
-    if (/^\d+\.?\d*px$/i.test(`${minWidth}`)) {
-      calcMinWidth = Number(`${minWidth}`.replace(/px/i, ""));
+var userPagination = (props, indexData) => {
+  const startIndex = ref(0);
+  const endIndex = ref(0);
+  let pagination2 = reactive({
+    count: 0,
+    limit: 10,
+    current: 1
+  });
+  pagination2 = resolvePaginationOption(props.pagination, pagination2);
+  const localPagination = ref(null);
+  const resetStartEndIndex = () => {
+    if (!props.pagination || props.remotePagination) {
+      startIndex.value = 0;
+      endIndex.value = props.data.length;
+      return;
     }
-    return calcMinWidth;
+    startIndex.value = (pagination2.current - 1) * pagination2.limit;
+    endIndex.value = pagination2.current * pagination2.limit;
   };
-  const resolveColNumberWidth = (col, numWidth, resetAvgWidth = true) => {
-    const minWidth = getMinWidth(col, numWidth);
-    const computedWidth = numWidth < minWidth ? minWidth : numWidth;
-    Object.assign(col, {
-      calcWidth: computedWidth
-    });
-    if (resetAvgWidth) {
-      avgWidth = avgWidth - computedWidth;
-      if (avgWidth < 0) {
-        avgWidth = 0;
-      }
+  const pageData = reactive([]);
+  const sort = (sortFn) => {
+    if (typeof sortFn === "function") {
+      pageData.sort(sortFn);
     }
   };
-  colgroups.forEach((col, index) => {
-    if (!col.isHidden) {
-      const colWidth = String(getColumnReactWidth(col));
-      let isAutoWidthCol = true;
-      if (/^\d+\.?\d*(px)?$/.test(colWidth)) {
-        const numWidth = Number(colWidth.replace("px", ""));
-        resolveColNumberWidth(col, numWidth);
-        isAutoWidthCol = false;
-      }
-      if (/^\d+\.?\d*%$/.test(colWidth)) {
-        let perWidth = autoWidth;
-        if (avgWidth > 0) {
-          const percent = Number(colWidth.replace("%", ""));
-          perWidth = avgWidth * percent / 100;
-        }
-        resolveColNumberWidth(col, perWidth);
-        isAutoWidthCol = false;
-      }
-      if (isAutoWidthCol) {
-        avgColIndexList.push(index);
-      }
+  const filter = (filterFn) => {
+    if (typeof filterFn === "function") {
+      const filterVals = pageData.filter((row, index) => filterFn(row, index, props.data));
+      pageData.splice(0, pageData.length, ...filterVals);
     }
-  });
-  if (avgColIndexList.length > 0) {
-    let autoAvgWidth = autoWidth;
-    if (avgWidth > 0) {
-      autoAvgWidth = avgWidth / avgColIndexList.length;
-      avgColIndexList.forEach((idx) => resolveColNumberWidth(colgroups[idx], autoAvgWidth, false));
+  };
+  const resolvePageData = (filterFn, sortFn) => {
+    pageData.splice(0, pageData.length, ...indexData.slice(startIndex.value, endIndex.value));
+    filter(filterFn);
+    sort(sortFn);
+  };
+  const watchEffectFn = (filterFn, sortFn) => {
+    pagination2 = resolvePaginationOption(props.pagination, pagination2);
+    resolveLocalPagination();
+    resetStartEndIndex();
+    resolvePageData(filterFn, sortFn);
+  };
+  const resolveLocalPagination = () => {
+    if (!props.pagination) {
+      return;
     }
-  }
+    localPagination.value = props.remotePagination ? pagination2 : __spreadProps(__spreadValues({}, pagination2), {
+      count: props.data.length
+    });
+  };
+  return {
+    pageData,
+    localPagination,
+    resolvePageData,
+    watchEffectFn
+  };
 };
-const observerResize = (root, callbackFn, delay = 60, immediate = false) => {
-  const callFn = lodash.exports.throttle(() => {
-    if (typeof callbackFn === "function") {
-      callbackFn();
+var useScrollLoading = (props, ctx) => {
+  const refScrollLoading = toRef(props, "scrollLoading");
+  const getLoadingOption = () => {
+    if (typeof refScrollLoading.value === "boolean") {
+      return {
+        loading: !!refScrollLoading.value,
+        inline: true,
+        title: "",
+        size: BkLoadingSize.Normal,
+        mode: BkLoadingMode.Default,
+        indicator: null
+      };
     }
-  }, delay);
-  const resizeObserver = new ResizeObserver(() => {
-    callFn();
-  });
-  if (immediate) {
-    if (typeof callbackFn === "function") {
-      callbackFn();
+    return refScrollLoading.value;
+  };
+  const isRender = computed(() => refScrollLoading.value !== null && (typeof refScrollLoading.value === "boolean" && refScrollLoading.value || typeof refScrollLoading.value === "object"));
+  const renderScrollLoading = () => {
+    var _a, _b, _c;
+    if (isRender.value) {
+      const {
+        loading: loading2,
+        size,
+        mode,
+        title,
+        inline,
+        indicator
+      } = getLoadingOption();
+      return (_c = (_b = (_a = ctx.slots).fixedBottom) == null ? void 0 : _b.call(_a)) != null ? _c : createVNode(BkLoading, {
+        loading: loading2,
+        size,
+        mode,
+        title,
+        inline,
+        indicator
+      }, null);
     }
-  }
+  };
   return {
-    start: () => {
-      resizeObserver.observe(root);
-    },
-    stop: () => {
-      resizeObserver.disconnect();
-      resizeObserver.unobserve(root);
-    }
+    renderScrollLoading
   };
 };
-const resolveHeadConfig = (props) => {
-  const {
-    showHead,
-    headHeight,
-    thead = {}
-  } = props;
-  return Object.assign({}, {
-    isShow: showHead,
-    height: headHeight
-  }, __spreadValues({}, thead));
-};
-const getRowText = (row, key, column) => {
-  if (column.type === "index") {
-    return row.__$table_row_index;
-  }
-  return row[key];
-};
-const formatPropAsArray = (prop, args) => {
-  if (Array.isArray(prop)) {
-    return prop;
-  }
-  if (typeof prop === "string" || typeof prop === "object") {
-    return [prop];
-  }
-  if (typeof prop === "function") {
-    return formatPropAsArray(Reflect.apply(prop, globalThis, args), args);
-  }
-  return [];
-};
-const resolveActiveColumns = (props) => {
-  if (props.columnPick !== "disabled") {
-    if (props.columnPick === "multi") {
-      return Array.isArray(props.activeColumn) ? props.activeColumn : resolveNumberToNumArray(props.activeColumn);
-    }
-    return Array.isArray(props.activeColumn) ? resolveNumberToNumArray(props.activeColumn[0]) : resolveNumberToNumArray(props.activeColumn);
-  }
-  return [];
+var SortScope = /* @__PURE__ */ ((SortScope2) => {
+  SortScope2["CURRENT"] = "current";
+  SortScope2["ALL"] = "all";
+  return SortScope2;
+})(SortScope || {});
+const tableProps = {
+  data: PropTypes.arrayOf(PropTypes.any).def([]),
+  columns: PropTypes.arrayOf(PropTypes.shape({
+    label: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
+    field: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
+    render: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
+    width: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]),
+    minWidth: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]).def(),
+    type: PropTypes.commonType(["selection", "index", "expand", "none"], "columnType").def("none"),
+    resizable: PropTypes.bool.def(true),
+    fixed: PropTypes.oneOfType([
+      PropTypes.bool,
+      PropTypes.commonType(["left", "right"], "fixed")
+    ]).def(false),
+    sort: PropTypes.oneOfType([
+      PropTypes.shape({
+        sortFn: PropTypes.func.def(void 0),
+        sortScope: PropTypes.commonType(Object.values(SortScope)).def("current")
+      }),
+      PropTypes.bool,
+      PropTypes.string
+    ]).def(false),
+    filter: PropTypes.oneOfType([
+      PropTypes.shape({
+        list: PropTypes.arrayOf(PropTypes.any).def([]),
+        filterFn: PropTypes.func.def(void 0)
+      }),
+      PropTypes.bool,
+      PropTypes.string
+    ]).def(false)
+  })).def([]),
+  activeColumn: PropTypes.oneOfType([PropTypes.number.def(-1), PropTypes.arrayOf(PropTypes.number.def(-1))]),
+  columnPick: PropTypes.commonType(["multi", "single", "disabled"], "columnPick").def("disabled"),
+  height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def("auto"),
+  minHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(200),
+  maxHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def("auto"),
+  rowHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]).def(40),
+  headHeight: PropTypes.number.def(40),
+  showHead: PropTypes.bool.def(true),
+  thead: PropTypes.shape({
+    height: PropTypes.number.def(40),
+    isShow: PropTypes.bool.def(true),
+    cellFn: PropTypes.func.def(void 0)
+  }),
+  virtualEnabled: PropTypes.bool.def(false),
+  border: PropTypes.arrayOf(PropTypes.commonType(BORDER_OPRIONS, "border")).def(["row"]),
+  pagination: PropTypes.oneOfType([PropTypes.bool.def(false), PropTypes.object.def({})]).def(false),
+  remotePagination: PropTypes.bool.def(false),
+  emptyText: PropTypes.string.def("\u6682\u65E0\u6570\u636E"),
+  settings: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
+    fields: PropTypes.shape([]).def(void 0),
+    checked: PropTypes.shape([]).def(void 0),
+    limit: PropTypes.number.def(void 0),
+    size: PropTypes.size(["small", "default", "large"]).def("default"),
+    sizeList: PropTypes.shape([]).def(void 0)
+  })]).def(false),
+  rowClass: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
+  rowStyle: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
+  cellStyle: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
+  cellClass: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
+  scrollLoading: PropTypes.oneOfType([
+    PropTypes.object,
+    PropTypes.bool
+  ]).def(void 0),
+  reserveExpand: PropTypes.bool.def(false),
+  rowKey: PropTypes.oneOfType([
+    PropTypes.string,
+    PropTypes.func
+  ]).def(void 0)
 };
-var useActiveColumns = (props) => {
-  let activeColumns = reactive([]);
-  if (props.columnPick === "disabled") {
-    return {
-      activeColumns
-    };
-  }
-  const activeCols = reactive(resolveActiveColumns(props));
-  const getActiveColumns = () => (props.columns || []).map((_column, index) => ({
-    index,
-    active: activeCols.some((colIndex) => colIndex === index),
-    _column
-  }));
-  watchEffect(() => {
-    activeColumns = getActiveColumns();
-    const cols = resolveActiveColumns(props);
-    activeColumns.forEach((col, index) => {
-      Object.assign(col, {
-        active: cols.some((colIndex) => colIndex === index)
-      });
+function _isSlot$2(s2) {
+  return typeof s2 === "function" || Object.prototype.toString.call(s2) === "[object Object]" && !isVNode(s2);
+}
+var useLimit = () => {
+  const {
+    proxy
+  } = getCurrentInstance();
+  const localLimit = ref(proxy.limit);
+  watch(() => proxy.limit, (limit) => {
+    localLimit.value = limit;
+  });
+  watch(() => proxy.limitList, (limitList) => {
+    nextTick(() => {
+      if (!limitList.includes(localLimit.value)) {
+        [localLimit.value] = limitList;
+      }
     });
+  }, {
+    immediate: true
   });
-  return {
-    activeColumns
-  };
-};
-var useColumnResize = (colgroups, immediate = true) => {
-  const pluginName = "HeadColumnResize";
-  let EVENTS2;
-  (function(EVENTS3) {
-    EVENTS3["MOUSE_MOVE"] = "onMousemove";
-    EVENTS3["MOUSE_OUT"] = "onMouseout";
-    EVENTS3["MOUSE_DOWN"] = "onMousedown";
-  })(EVENTS2 || (EVENTS2 = {}));
-  let isInDragSection = false;
-  let isMouseDown = false;
-  let isDraging = false;
-  let startX = 0;
-  let dragColumn = null;
-  let dragStartOffsetX = 0;
-  const dragOffsetX = ref(-1e3);
-  const handleMouseUp = (e) => {
-    var _a;
-    isMouseDown = false;
-    isDraging = false;
-    const bodyStyle = document.body.style;
-    bodyStyle.cursor = "";
-    const diff = e.clientX - startX;
-    dragColumn.resizeWidth = ((_a = dragColumn.resizeWidth) != null ? _a : dragColumn.calcWidth) + diff;
-    document.removeEventListener("mouseup", handleMouseUp);
-    document.removeEventListener("mousemove", handleMouseMove);
-    startX = 0;
-    dragOffsetX.value = -1e3;
-    dragColumn = null;
-    const targetTable = e.target.closest("table");
-    targetTable.querySelectorAll("th").forEach((th) => th.style.setProperty("user-select", "inherit"));
-  };
-  const handleMouseMove = (e) => {
-    const bodyStyle = document.body.style;
-    bodyStyle.setProperty("cursor", "");
-    dragOffsetX.value = e.clientX - startX + dragStartOffsetX;
+  const handleLimitChange = (limit) => {
+    localLimit.value = limit;
   };
-  const handler = {
-    [EVENTS2.MOUSE_DOWN]: (e, column) => {
-      if (!isInDragSection) {
-        return;
-      }
-      isMouseDown = true;
-      const bodyStyle = document.body.style;
-      bodyStyle.setProperty("cursor", "col-resize");
-      dragColumn = column;
-      startX = e.clientX;
-      const targetTable = e.target.closest("table");
-      dragStartOffsetX = startX - targetTable.getBoundingClientRect().left;
-      document.addEventListener("mouseup", handleMouseUp);
-      document.addEventListener("mousemove", handleMouseMove);
-    },
-    [EVENTS2.MOUSE_MOVE]: (e, _column) => {
-      if (isMouseDown && !isDraging) {
-        isDraging = true;
-      }
-      const target = e.target.closest("th");
-      if (isDraging) {
-        target.style.setProperty("user-select", "none");
-      }
-      if (!isDraging) {
-        if (!target) {
-          return;
-        }
-        const rect = target.getBoundingClientRect();
-        if (rect.width > 12 && rect.right - e.pageX < 8) {
-          isInDragSection = true;
-          target.style.setProperty("cursor", "col-resize");
-        } else {
-          isInDragSection = false;
-        }
-      }
-    },
-    [EVENTS2.MOUSE_OUT]: (e, _column) => {
-      const target = e.target;
-      if (!isDraging) {
-        target.style.setProperty("cursor", "");
-      }
+  const render2 = ({
+    isFirst,
+    isLast
+  }) => {
+    let _slot;
+    if (!proxy.showLimit) {
+      return null;
     }
-  };
-  const getEventName = (event) => `${pluginName}_${event}`;
-  const registerResizeEvent = () => {
-    colgroups.forEach((col) => {
-      if (col.resizable !== false) {
-        Object.keys(handler).forEach((event) => {
-          const name2 = getEventName(event);
-          if (!col.listeners.has(name2)) {
-            col.listeners.set(name2, []);
-          }
-          col.listeners.get(name2).push(handler[event]);
-        });
+    return createVNode("div", mergeProps({
+      "class": {
+        "bk-pagination-limit": true,
+        "is-first": isFirst,
+        "is-last": isLast
       }
-    });
-  };
-  const resetResizeEvents = () => {
-    colgroups.forEach((col) => {
-      Object.keys(handler).forEach((event) => {
-        const name2 = getEventName(event);
-        if (col.listeners.has(name2)) {
-          const listeners = col.listeners.get(name2);
-          listeners.splice(0, listeners.length);
-        }
-      });
-    });
+    }, {
+      disabled: proxy.disabled
+    }), [createVNode("div", null, [createTextVNode("\u6BCF\u9875")]), createVNode(BkSelect, {
+      "class": "bk-pagination-limit-select",
+      "clearable": false,
+      "modelValue": localLimit.value,
+      "onChange": handleLimitChange,
+      "disabled": proxy.disabled
+    }, _isSlot$2(_slot = proxy.limitList.map((num, index) => createVNode(BkOption, {
+      "value": num,
+      "label": `${num}`,
+      "key": `${index}_${num}`
+    }, null))) ? _slot : {
+      default: () => [_slot]
+    }), createVNode("div", null, [createTextVNode("\u6761")])]);
   };
-  if (immediate) {
-    registerResizeEvent();
-  }
-  const dragOffsetXStyle = computed(() => ({
-    position: "absolute",
-    top: 0,
-    bottom: 0,
-    left: `${dragOffsetX.value}px`,
-    width: "1px",
-    "background-color": "#ebeef5"
-  }));
   return {
-    registerResizeEvent,
-    resetResizeEvents,
-    dragOffsetX,
-    dragOffsetXStyle
+    limit: localLimit,
+    render: render2
   };
 };
-var useFixedColumn = (props, colgroups) => {
-  const footHeight = computed(() => props.pagination && props.data.length ? 40 : 0);
-  const resolveColumnClass = (column) => ({
-    column_fixed: !!column.fixed,
-    column_fixed_left: column.fixed !== "right",
-    column_fixed_right: column.fixed === "right"
+const PAGE_ITEMS_NUM = 5;
+var useList = () => {
+  const {
+    proxy
+  } = getCurrentInstance();
+  const localCurrent = ref(1);
+  const isPagePreDisabled = computed(() => localCurrent.value === 1);
+  const isPageNextDisabled = computed(() => localCurrent.value === proxy.totalPageNum);
+  const showPreBatch = ref(false);
+  const showNextBatch = ref(false);
+  const list = computed(() => {
+    showPreBatch.value = false;
+    showNextBatch.value = false;
+    const stack = [];
+    if (proxy.totalPageNum <= PAGE_ITEMS_NUM) {
+      for (let i = 2; i <= proxy.totalPageNum - 1; i++) {
+        stack.push(i);
+      }
+      return stack;
+    }
+    const pageItemsNumHalf = Math.floor(PAGE_ITEMS_NUM / 2);
+    if (proxy.totalPageNum > PAGE_ITEMS_NUM) {
+      showPreBatch.value = localCurrent.value - pageItemsNumHalf > 2;
+      showNextBatch.value = localCurrent.value + pageItemsNumHalf < proxy.totalPageNum - 1;
+    }
+    const start2 = Math.min(proxy.totalPageNum - PAGE_ITEMS_NUM, Math.max(2, localCurrent.value - pageItemsNumHalf));
+    for (let i = start2; i < start2 + PAGE_ITEMS_NUM; i++) {
+      stack.push(i);
+    }
+    return stack;
   });
-  const resolveFixColPos = (column) => column.fixed === "right" ? "right" : "left";
-  const resolveFixOffset = {
-    left: (ignoreFirst = true) => colgroups.filter((col) => col.fixed && col.fixed !== "right").reduce((offset2, curr, index) => {
-      const outOffset = ignoreFirst && index === 0 ? offset2 : offset2 + getColumnReactWidth(curr);
-      return outOffset;
-    }, 0),
-    right: (ignoreFirst = true) => colgroups.filter((col) => col.fixed === "right").reduce((offset2, curr, index) => {
-      const outOffset = ignoreFirst && index === 0 ? offset2 : offset2 + getColumnReactWidth(curr);
-      return outOffset;
-    }, 0)
-  };
-  const reolveFixRightOffset = resolveFixOffset.right;
-  const getFixedColumnStyleResolve = () => {
-    const resolveFixedColumnStyle = (column, fixedoffset2) => {
-      if (!column.fixed) {
-        return {};
+  watch(() => proxy.modelValue, (modelValue) => {
+    nextTick(() => {
+      if (modelValue >= 1 && modelValue <= proxy.totalPageNum) {
+        localCurrent.value = modelValue;
+      } else if (modelValue < 1) {
+        localCurrent.value = 1;
+      } else {
+        localCurrent.value = proxy.totalPageNum;
       }
-      const fixedPos = resolveFixColPos(column);
-      const opt = fixedPos === "right" ? -1 : 1;
-      const offsetX = `${fixedoffset2[fixedPos]}px`;
-      fixedoffset2[fixedPos] = fixedoffset2[fixedPos] + getColumnReactWidth(column) * opt;
-      return {
-        [fixedPos]: offsetX
-      };
-    };
-    const rightOffsetWidth = reolveFixRightOffset(true);
-    const fixedoffset = {
-      left: 0,
-      right: rightOffsetWidth
-    };
-    return {
-      fixedoffset,
-      resolveFixedColumnStyle
-    };
-  };
-  const renderFixedColumns = () => {
-    const resolveColumnStyle = (colPos) => ({
-      width: `${resolveFixOffset[colPos](false)}px`,
-      bottom: `${footHeight.value}px`
-    });
-    const colPosExist = {
-      left: false,
-      right: false
-    };
-    return colgroups.filter((col) => !col.isHidden && col.fixed).map((col) => {
-      const colPos = resolveFixColPos(col);
-      const isExist = colPosExist[colPos];
-      colPosExist[colPos] = true;
-      return isExist ? "" : createVNode("div", {
-        "class": resolveColumnClass(col),
-        "style": resolveColumnStyle(colPos)
-      }, null);
     });
-  };
-  const fixedWrapperClass = resolveClassName("table-fixed");
-  return {
-    renderFixedColumns,
-    fixedWrapperClass,
-    getFixedColumnStyleResolve
-  };
-};
-const resolvePaginationOption = (propPagination, defVal) => {
-  if (!!propPagination) {
-    if (typeof propPagination === "object") {
-      let current = Object.prototype.hasOwnProperty.call(propPagination, "current") ? propPagination.current : propPagination.value;
-      if (!/\d+/.test(current)) {
-        current = 1;
+  }, {
+    immediate: true
+  });
+  nextTick(() => {
+    watch(() => proxy.totalPageNum, (totalPageNum) => {
+      if (localCurrent.value > totalPageNum) {
+        localCurrent.value = totalPageNum;
       }
-      return __spreadProps(__spreadValues(__spreadValues({}, defVal), propPagination), {
-        current
-      });
-    }
-    return defVal;
-  }
-  return {};
-};
-var userPagination = (props) => {
-  const startIndex = ref(0);
-  const endIndex = ref(0);
-  const indexData = computed(() => props.data.map((item, index) => __spreadProps(__spreadValues({}, item), {
-    __$table_row_index: index + 1
-  })));
-  let pagination2 = reactive({
-    count: 0,
-    limit: 10,
-    current: 1
+    });
   });
-  pagination2 = resolvePaginationOption(props.pagination, pagination2);
-  const localPagination = ref(null);
-  const resetStartEndIndex = () => {
-    if (!props.pagination || props.remotePagination) {
-      startIndex.value = 0;
-      endIndex.value = props.data.length;
+  const handlePrePage = () => {
+    if (isPagePreDisabled.value) {
       return;
     }
-    startIndex.value = (pagination2.current - 1) * pagination2.limit;
-    endIndex.value = pagination2.current * pagination2.limit;
+    localCurrent.value = localCurrent.value - 1;
   };
-  const pageData = reactive([]);
-  const sort = (sortFn) => {
-    if (typeof sortFn === "function") {
-      pageData.sort(sortFn);
+  const handleNextPage = () => {
+    if (isPageNextDisabled.value) {
+      return;
     }
+    localCurrent.value = localCurrent.value + 1;
   };
-  const filter = (filterFn) => {
-    if (typeof filterFn === "function") {
-      const filterVals = pageData.filter((row, index) => filterFn(row, index, props.data));
-      pageData.splice(0, pageData.length, ...filterVals);
+  const handleItemClick = (totalPageNum) => {
+    if (totalPageNum === localCurrent.value) {
+      return;
     }
+    localCurrent.value = totalPageNum;
   };
-  const resolvePageData = (filterFn, sortFn) => {
-    pageData.splice(0, pageData.length, ...indexData.value.slice(startIndex.value, endIndex.value));
-    filter(filterFn);
-    sort(sortFn);
+  const handlePreBatch = () => {
+    localCurrent.value = Math.max(1, localCurrent.value - PAGE_ITEMS_NUM);
   };
-  const watchEffectFn = (filterFn, sortFn) => {
-    pagination2 = resolvePaginationOption(props.pagination, pagination2);
-    resolveLocalPagination();
-    resetStartEndIndex();
-    resolvePageData(filterFn, sortFn);
+  const handleNextBatch = () => {
+    localCurrent.value = Math.min(proxy.totalPageNum, localCurrent.value + PAGE_ITEMS_NUM);
   };
-  const resolveLocalPagination = () => {
-    if (!props.pagination) {
-      return;
+  const render2 = ({
+    isFirst,
+    isLast
+  }) => createVNode("div", {
+    "class": {
+      "bk-pagination-list": true,
+      "is-first": isFirst,
+      "is-last": isLast
     }
-    localPagination.value = props.remotePagination ? pagination2 : __spreadProps(__spreadValues({}, pagination2), {
-      count: props.data.length
-    });
-  };
+  }, [createVNode("div", {
+    "class": {
+      "bk-pagination-list-pre": true,
+      "is-disabled": isPagePreDisabled.value
+    },
+    "onClick": handlePrePage
+  }, [proxy.prevText || createVNode(angleLeft, null, null)]), createVNode("div", {
+    "class": {
+      "bk-pagination-list-item": true,
+      "is-active": localCurrent.value === 1
+    },
+    "key": "1",
+    "onClick": () => handleItemClick(1)
+  }, [createTextVNode("1")]), showPreBatch.value && createVNode("div", {
+    "key": "pre-batch",
+    "class": "bk-pagination-list-pre-batch",
+    "onClick": handlePreBatch
+  }, [createVNode(ellipsis, null, null)]), list.value.map((num) => createVNode("div", {
+    "class": {
+      "bk-pagination-list-item": true,
+      "is-active": localCurrent.value === num
+    },
+    "key": num,
+    "onClick": () => handleItemClick(num)
+  }, [num])), showNextBatch.value && createVNode("div", {
+    "key": "next-batch",
+    "class": "bk-pagination-list-next-batch",
+    "onClick": handleNextBatch
+  }, [createVNode(ellipsis, null, null)]), proxy.totalPageNum > 1 && createVNode("div", {
+    "class": {
+      "bk-pagination-list-item": true,
+      "is-active": localCurrent.value === proxy.totalPageNum
+    },
+    "key": "last",
+    "onClick": () => handleItemClick(proxy.totalPageNum)
+  }, [proxy.totalPageNum]), createVNode("div", {
+    "class": {
+      "bk-pagination-list-pre": true,
+      "is-disabled": isPageNextDisabled.value
+    },
+    "onClick": handleNextPage
+  }, [proxy.nextText || createVNode(angleRight, null, null)])]);
   return {
-    pageData,
-    localPagination,
-    resolvePageData,
-    watchEffectFn
+    current: localCurrent,
+    render: render2
   };
 };
-var useScrollLoading = (props, ctx) => {
-  const refScrollLoading = toRef(props, "scrollLoading");
-  const getLoadingOption = () => {
-    if (typeof refScrollLoading.value === "boolean") {
-      return {
-        loading: !!refScrollLoading.value,
-        inline: true,
-        title: "",
-        size: BkLoadingSize.Normal,
-        mode: BkLoadingMode.Default,
-        indicator: null
-      };
-    }
-    return refScrollLoading.value;
-  };
-  const isRender = computed(() => refScrollLoading.value !== null && (typeof refScrollLoading.value === "boolean" && refScrollLoading.value || typeof refScrollLoading.value === "object"));
-  const renderScrollLoading = () => {
-    var _a, _b, _c;
-    if (isRender.value) {
-      const {
-        loading: loading2,
-        size,
-        mode,
-        title,
-        inline,
-        indicator
-      } = getLoadingOption();
-      return (_c = (_b = (_a = ctx.slots).fixedBottom) == null ? void 0 : _b.call(_a)) != null ? _c : createVNode(BkLoading, {
-        loading: loading2,
-        size,
-        mode,
-        title,
-        inline,
-        indicator
-      }, null);
-    }
-  };
-  return {
-    renderScrollLoading
-  };
-};
-var SortScope = /* @__PURE__ */ ((SortScope2) => {
-  SortScope2["CURRENT"] = "current";
-  SortScope2["ALL"] = "all";
-  return SortScope2;
-})(SortScope || {});
-const tableProps = {
-  data: PropTypes.arrayOf(PropTypes.any).def([]),
-  columns: PropTypes.arrayOf(PropTypes.shape({
-    label: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
-    field: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
-    render: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
-    width: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]),
-    minWidth: PropTypes.oneOfType([PropTypes.number.def(void 0), PropTypes.string.def("auto")]).def(),
-    type: PropTypes.commonType(["selection", "index", "expand", "none"], "columnType").def("none"),
-    resizable: PropTypes.bool.def(true),
-    fixed: PropTypes.oneOfType([
-      PropTypes.bool,
-      PropTypes.commonType(["left", "right"], "fixed")
-    ]).def(false),
-    sort: PropTypes.oneOfType([
-      PropTypes.shape({
-        sortFn: PropTypes.func.def(void 0),
-        sortScope: PropTypes.commonType(Object.values(SortScope)).def("current")
-      }),
-      PropTypes.bool,
-      PropTypes.string
-    ]).def(false),
-    filter: PropTypes.oneOfType([
-      PropTypes.shape({
-        list: PropTypes.arrayOf(PropTypes.any).def([]),
-        filterFn: PropTypes.func.def(void 0)
-      }),
-      PropTypes.bool,
-      PropTypes.string
-    ]).def(false)
-  })).def([]),
-  activeColumn: PropTypes.oneOfType([PropTypes.number.def(-1), PropTypes.arrayOf(PropTypes.number.def(-1))]),
-  columnPick: PropTypes.commonType(["multi", "single", "disabled"], "columnPick").def("disabled"),
-  height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def("auto"),
-  minHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(200),
-  maxHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def("auto"),
-  rowHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]).def(40),
-  headHeight: PropTypes.number.def(40),
-  showHead: PropTypes.bool.def(true),
-  thead: PropTypes.shape({
-    height: PropTypes.number.def(40),
-    isShow: PropTypes.bool.def(true),
-    cellFn: PropTypes.func.def(void 0)
-  }),
-  virtualEnabled: PropTypes.bool.def(false),
-  border: PropTypes.arrayOf(PropTypes.commonType(BORDER_OPRIONS, "border")).def(["row"]),
-  pagination: PropTypes.oneOfType([PropTypes.bool.def(false), PropTypes.object.def({})]).def(false),
-  remotePagination: PropTypes.bool.def(false),
-  emptyText: PropTypes.string.def("\u6682\u65E0\u6570\u636E"),
-  settings: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
-    fields: PropTypes.shape([]).def(void 0),
-    checked: PropTypes.shape([]).def(void 0),
-    limit: PropTypes.number.def(void 0),
-    size: PropTypes.size(["small", "default", "large"]).def("default"),
-    sizeList: PropTypes.shape([]).def(void 0)
-  })]).def(false),
-  rowClass: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
-  rowStyle: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
-  cellStyle: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
-  cellClass: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]).def({}),
-  scrollLoading: PropTypes.oneOfType([
-    PropTypes.object,
-    PropTypes.bool
-  ]).def(void 0)
-};
-function _isSlot$2(s2) {
-  return typeof s2 === "function" || Object.prototype.toString.call(s2) === "[object Object]" && !isVNode(s2);
-}
-var useLimit = () => {
-  const {
-    proxy
-  } = getCurrentInstance();
-  const localLimit = ref(proxy.limit);
-  watch(() => proxy.limit, (limit) => {
-    localLimit.value = limit;
-  });
-  watch(() => proxy.limitList, (limitList) => {
-    nextTick(() => {
-      if (!limitList.includes(localLimit.value)) {
-        [localLimit.value] = limitList;
-      }
-    });
-  }, {
-    immediate: true
-  });
-  const handleLimitChange = (limit) => {
-    localLimit.value = limit;
-  };
-  const render2 = ({
-    isFirst,
-    isLast
-  }) => {
-    let _slot;
-    if (!proxy.showLimit) {
-      return null;
-    }
-    return createVNode("div", mergeProps({
-      "class": {
-        "bk-pagination-limit": true,
-        "is-first": isFirst,
-        "is-last": isLast
-      }
-    }, {
-      disabled: proxy.disabled
-    }), [createVNode("div", null, [createTextVNode("\u6BCF\u9875")]), createVNode(BkSelect, {
-      "class": "bk-pagination-limit-select",
-      "clearable": false,
-      "modelValue": localLimit.value,
-      "onChange": handleLimitChange,
-      "disabled": proxy.disabled
-    }, _isSlot$2(_slot = proxy.limitList.map((num, index) => createVNode(BkOption, {
-      "value": num,
-      "label": `${num}`,
-      "key": `${index}_${num}`
-    }, null))) ? _slot : {
-      default: () => [_slot]
-    }), createVNode("div", null, [createTextVNode("\u6761")])]);
-  };
-  return {
-    limit: localLimit,
-    render: render2
-  };
-};
-const PAGE_ITEMS_NUM = 5;
-var useList = () => {
+var useSmallList = () => {
   const {
     proxy
   } = getCurrentInstance();
+  const inputRef = ref(null);
+  const isFocused = ref(false);
   const localCurrent = ref(1);
   const isPagePreDisabled = computed(() => localCurrent.value === 1);
   const isPageNextDisabled = computed(() => localCurrent.value === proxy.totalPageNum);
-  const showPreBatch = ref(false);
-  const showNextBatch = ref(false);
+  let inputMemo = 0;
   const list = computed(() => {
-    showPreBatch.value = false;
-    showNextBatch.value = false;
     const stack = [];
-    if (proxy.totalPageNum <= PAGE_ITEMS_NUM) {
-      for (let i = 2; i <= proxy.totalPageNum - 1; i++) {
-        stack.push(i);
-      }
-      return stack;
-    }
-    const pageItemsNumHalf = Math.floor(PAGE_ITEMS_NUM / 2);
-    if (proxy.totalPageNum > PAGE_ITEMS_NUM) {
-      showPreBatch.value = localCurrent.value - pageItemsNumHalf > 2;
-      showNextBatch.value = localCurrent.value + pageItemsNumHalf < proxy.totalPageNum - 1;
-    }
-    const start2 = Math.min(proxy.totalPageNum - PAGE_ITEMS_NUM, Math.max(2, localCurrent.value - pageItemsNumHalf));
-    for (let i = start2; i < start2 + PAGE_ITEMS_NUM; i++) {
+    for (let i = 1; i <= proxy.totalPageNum; i++) {
       stack.push(i);
     }
     return stack;
@@ -13721,6 +13467,7 @@ var useList = () => {
       } else {
         localCurrent.value = proxy.totalPageNum;
       }
+      inputMemo = localCurrent.value;
     });
   }, {
     immediate: true
@@ -13744,343 +13491,542 @@ var useList = () => {
     }
     localCurrent.value = localCurrent.value + 1;
   };
-  const handleItemClick = (totalPageNum) => {
-    if (totalPageNum === localCurrent.value) {
+  const handlePageEditorFocus = () => {
+    isFocused.value = true;
+  };
+  const handlePageEditorBlur = () => {
+    isFocused.value = false;
+    inputRef.value.textContent = `${inputMemo}`;
+    if (inputMemo !== localCurrent.value) {
+      localCurrent.value = inputMemo;
+    }
+  };
+  const handlePageEditorInput = (event) => {
+    const $target = event.target;
+    const value = Number($target.textContent);
+    if (!value || value < 1 || value > proxy.totalPageNum || value === localCurrent.value) {
       return;
     }
-    localCurrent.value = totalPageNum;
+    inputMemo = value;
   };
-  const handlePreBatch = () => {
-    localCurrent.value = Math.max(1, localCurrent.value - PAGE_ITEMS_NUM);
+  const handlePageEditorKeydown = (event) => {
+    if (["Enter", "NumpadEnter"].includes(event.code)) {
+      event.preventDefault();
+      handlePageEditorBlur();
+    }
   };
-  const handleNextBatch = () => {
-    localCurrent.value = Math.min(proxy.totalPageNum, localCurrent.value + PAGE_ITEMS_NUM);
+  const handlePageChange = (item) => {
+    inputMemo = item;
+    handlePageEditorBlur();
   };
-  const render2 = ({
-    isFirst,
-    isLast
-  }) => createVNode("div", {
-    "class": {
-      "bk-pagination-list": true,
-      "is-first": isFirst,
-      "is-last": isLast
-    }
+  const render2 = () => createVNode("div", {
+    "class": "bk-pagination-small-list"
   }, [createVNode("div", {
     "class": {
-      "bk-pagination-list-pre": true,
+      "bk-pagination-btn-pre": true,
       "is-disabled": isPagePreDisabled.value
     },
     "onClick": handlePrePage
-  }, [proxy.prevText || createVNode(angleLeft, null, null)]), createVNode("div", {
+  }, [createVNode(leftShape, null, null)]), createVNode(BkPopover, {
+    "theme": "light",
+    "trigger": "click",
+    "arrow": false,
+    "boundary": "body",
+    "placement": "bottom"
+  }, {
+    default: () => createVNode("div", {
+      "class": {
+        "bk-pagination-picker": true,
+        "is-focused": isFocused.value
+      }
+    }, [createVNode("span", {
+      "ref": inputRef,
+      "class": "bk-pagination-editor",
+      "contenteditable": true,
+      "spellcheck": "false",
+      "onFocus": handlePageEditorFocus,
+      "onBlur": handlePageEditorBlur,
+      "onInput": handlePageEditorInput,
+      "onKeydown": handlePageEditorKeydown
+    }, [localCurrent.value]), createVNode("span", null, [createTextVNode("/")]), createVNode("span", {
+      "class": "bk-pagination-small-list-total"
+    }, [proxy.totalPageNum])]),
+    content: () => createVNode("div", {
+      "class": "bk-pagination-picker-list"
+    }, [list.value.map((item) => createVNode("div", {
+      "class": {
+        item: true,
+        "is-actived": item === localCurrent.value
+      },
+      "key": item,
+      "onClick": () => handlePageChange(item)
+    }, [item]))])
+  }), createVNode("div", {
     "class": {
-      "bk-pagination-list-item": true,
-      "is-active": localCurrent.value === 1
-    },
-    "key": "1",
-    "onClick": () => handleItemClick(1)
-  }, [createTextVNode("1")]), showPreBatch.value && createVNode("div", {
-    "key": "pre-batch",
-    "class": "bk-pagination-list-pre-batch",
-    "onClick": handlePreBatch
-  }, [createVNode(ellipsis, null, null)]), list.value.map((num) => createVNode("div", {
-    "class": {
-      "bk-pagination-list-item": true,
-      "is-active": localCurrent.value === num
-    },
-    "key": num,
-    "onClick": () => handleItemClick(num)
-  }, [num])), showNextBatch.value && createVNode("div", {
-    "key": "next-batch",
-    "class": "bk-pagination-list-next-batch",
-    "onClick": handleNextBatch
-  }, [createVNode(ellipsis, null, null)]), proxy.totalPageNum > 1 && createVNode("div", {
-    "class": {
-      "bk-pagination-list-item": true,
-      "is-active": localCurrent.value === proxy.totalPageNum
-    },
-    "key": "last",
-    "onClick": () => handleItemClick(proxy.totalPageNum)
-  }, [proxy.totalPageNum]), createVNode("div", {
-    "class": {
-      "bk-pagination-list-pre": true,
-      "is-disabled": isPageNextDisabled.value
+      "bk-pagination-btn-next": true,
+      "is-disabled": isPageNextDisabled.value
     },
     "onClick": handleNextPage
-  }, [proxy.nextText || createVNode(angleRight, null, null)])]);
+  }, [createVNode(rightShape, null, null)])]);
   return {
     current: localCurrent,
     render: render2
   };
 };
-var useSmallList = () => {
+var useTotal = () => ({
+  isFirst,
+  isLast
+}) => {
   const {
-    proxy
+    props
   } = getCurrentInstance();
-  const inputRef = ref(null);
-  const isFocused = ref(false);
-  const localCurrent = ref(1);
-  const isPagePreDisabled = computed(() => localCurrent.value === 1);
-  const isPageNextDisabled = computed(() => localCurrent.value === proxy.totalPageNum);
-  let inputMemo = 0;
-  const list = computed(() => {
-    const stack = [];
-    for (let i = 1; i <= proxy.totalPageNum; i++) {
-      stack.push(i);
+  if (!props.showTotalCount) {
+    return null;
+  }
+  return createVNode("div", mergeProps({
+    "class": {
+      "bk-pagination-total": true,
+      "is-first": isFirst,
+      "is-last": isLast
     }
-    return stack;
-  });
-  watch(() => proxy.modelValue, (modelValue) => {
-    nextTick(() => {
-      if (modelValue >= 1 && modelValue <= proxy.totalPageNum) {
-        localCurrent.value = modelValue;
-      } else if (modelValue < 1) {
-        localCurrent.value = 1;
-      } else {
-        localCurrent.value = proxy.totalPageNum;
-      }
-      inputMemo = localCurrent.value;
-    });
   }, {
-    immediate: true
-  });
-  nextTick(() => {
-    watch(() => proxy.totalPageNum, (totalPageNum) => {
-      if (localCurrent.value > totalPageNum) {
-        localCurrent.value = totalPageNum;
+    disabled: props.disabled
+  }), [createTextVNode("\u5171\u8BA1"), createVNode("div", {
+    "class": "bk-pagination-total-num"
+  }, [props.count]), createTextVNode("\u6761")]);
+};
+const paginationProps = {
+  modelValue: PropTypes.number.def(1),
+  count: PropTypes.number.def(0).isRequired,
+  limit: PropTypes.number.def(10),
+  limitList: PropTypes.arrayOf(Number).def([10, 20, 50, 100]),
+  showLimit: PropTypes.bool.def(true),
+  type: PropTypes.oneOf(["default", "compact"]).def("default"),
+  location: PropTypes.oneOf(["left", "right"]).def("right"),
+  align: PropTypes.oneOf(["left", "center", "right"]).def("left"),
+  size: PropTypes.size(),
+  small: PropTypes.bool.def(false),
+  showTotalCount: PropTypes.bool.def(true),
+  prevText: PropTypes.string,
+  nextText: PropTypes.string,
+  disabled: PropTypes.bool.def(false),
+  layout: PropTypes.custom((value) => {
+    const layoutNameMap = {
+      total: true,
+      list: true,
+      limit: true
+    };
+    return value.some((item) => layoutNameMap[item]);
+  }, "layout \u7684\u503C\u53EA\u652F\u6301 * total\u3001list\u3001limit *").def(["total", "list", "limit"])
+};
+var Component$a = defineComponent({
+  name: "Pagination",
+  props: paginationProps,
+  emits: ["update:modelValue", "change", "update:limit", "limitChange"],
+  setup(props, context) {
+    const totalPageNum = ref(0);
+    const {
+      count,
+      limit
+    } = toRefs(props);
+    const renderTotal = useTotal();
+    const {
+      current: listCurrent,
+      render: renderList
+    } = useList();
+    const {
+      current: smallListCurrent,
+      render: renderSmallList
+    } = useSmallList();
+    const {
+      limit: localLimit,
+      render: renderLimit
+    } = useLimit();
+    watch([count, localLimit, limit], ([count2, localLimit2]) => {
+      const total = Math.ceil(count2 / localLimit2);
+      totalPageNum.value = total < 1 ? 1 : total;
+    }, {
+      immediate: true
+    });
+    watch(listCurrent, (listCurrent2) => {
+      context.emit("update:modelValue", listCurrent2);
+      context.emit("change", listCurrent2);
+    });
+    watch(smallListCurrent, (smallListCurrent2) => {
+      context.emit("update:modelValue", smallListCurrent2);
+      context.emit("change", smallListCurrent2);
+    });
+    watch(localLimit, (localLimit2) => {
+      context.emit("limitChange", localLimit2);
+    });
+    return {
+      totalPageNum,
+      renderTotal,
+      renderList,
+      renderLimit,
+      renderSmallList
+    };
+  },
+  render() {
+    const paginationClass = classes({
+      "bk-pagination": true,
+      [`bk-pagination--${this.size}`]: true,
+      [`is-align-${this.align}`]: true
+    });
+    const layoutMap = {
+      total: this.renderTotal,
+      list: this.small ? this.renderSmallList : this.renderList,
+      limit: this.renderLimit
+    };
+    return createVNode("div", {
+      "class": paginationClass
+    }, [this.layout.map((layout, index) => layoutMap[layout]({
+      isFirst: index === 0,
+      isLast: index === this.layout.length - 1
+    }))]);
+  }
+});
+const BkPagination = withInstall(Component$a);
+var BodyEmpty = defineComponent({
+  name: "BodyEmpty",
+  props: {
+    list: PropTypes.array.def([]),
+    filterList: PropTypes.array.def([]),
+    emptyText: PropTypes.string.def("\u6682\u65E0\u6570\u636E")
+  },
+  emits: ["change"],
+  setup(props, {
+    slots
+  }) {
+    const type = computed(() => props.list.length === 0 ? "empty" : "search-empty");
+    return () => createVNode(BkException, {
+      "scene": "part",
+      "type": type.value
+    }, {
+      default: () => {
+        var _a, _b;
+        return [(_b = (_a = slots.default) == null ? void 0 : _a.call(slots)) != null ? _b : props.emptyText];
       }
     });
-  });
-  const handlePrePage = () => {
-    if (isPagePreDisabled.value) {
-      return;
+  }
+});
+var rngBrowser = { exports: {} };
+var getRandomValues = typeof crypto != "undefined" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto != "undefined" && typeof window.msCrypto.getRandomValues == "function" && msCrypto.getRandomValues.bind(msCrypto);
+if (getRandomValues) {
+  var rnds8 = new Uint8Array(16);
+  rngBrowser.exports = function whatwgRNG() {
+    getRandomValues(rnds8);
+    return rnds8;
+  };
+} else {
+  var rnds = new Array(16);
+  rngBrowser.exports = function mathRNG() {
+    for (var i = 0, r2; i < 16; i++) {
+      if ((i & 3) === 0)
+        r2 = Math.random() * 4294967296;
+      rnds[i] = r2 >>> ((i & 3) << 3) & 255;
     }
-    localCurrent.value = localCurrent.value - 1;
+    return rnds;
   };
-  const handleNextPage = () => {
-    if (isPageNextDisabled.value) {
-      return;
+}
+var byteToHex = [];
+for (var i = 0; i < 256; ++i) {
+  byteToHex[i] = (i + 256).toString(16).substr(1);
+}
+function bytesToUuid$2(buf, offset2) {
+  var i = offset2 || 0;
+  var bth = byteToHex;
+  return [
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    "-",
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]],
+    bth[buf[i++]]
+  ].join("");
+}
+var bytesToUuid_1 = bytesToUuid$2;
+var rng$1 = rngBrowser.exports;
+var bytesToUuid$1 = bytesToUuid_1;
+var _nodeId;
+var _clockseq;
+var _lastMSecs = 0;
+var _lastNSecs = 0;
+function v1$1(options, buf, offset2) {
+  var i = buf && offset2 || 0;
+  var b2 = buf || [];
+  options = options || {};
+  var node = options.node || _nodeId;
+  var clockseq = options.clockseq !== void 0 ? options.clockseq : _clockseq;
+  if (node == null || clockseq == null) {
+    var seedBytes = rng$1();
+    if (node == null) {
+      node = _nodeId = [
+        seedBytes[0] | 1,
+        seedBytes[1],
+        seedBytes[2],
+        seedBytes[3],
+        seedBytes[4],
+        seedBytes[5]
+      ];
+    }
+    if (clockseq == null) {
+      clockseq = _clockseq = (seedBytes[6] << 8 | seedBytes[7]) & 16383;
+    }
+  }
+  var msecs = options.msecs !== void 0 ? options.msecs : new Date().getTime();
+  var nsecs = options.nsecs !== void 0 ? options.nsecs : _lastNSecs + 1;
+  var dt = msecs - _lastMSecs + (nsecs - _lastNSecs) / 1e4;
+  if (dt < 0 && options.clockseq === void 0) {
+    clockseq = clockseq + 1 & 16383;
+  }
+  if ((dt < 0 || msecs > _lastMSecs) && options.nsecs === void 0) {
+    nsecs = 0;
+  }
+  if (nsecs >= 1e4) {
+    throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");
+  }
+  _lastMSecs = msecs;
+  _lastNSecs = nsecs;
+  _clockseq = clockseq;
+  msecs += 122192928e5;
+  var tl = ((msecs & 268435455) * 1e4 + nsecs) % 4294967296;
+  b2[i++] = tl >>> 24 & 255;
+  b2[i++] = tl >>> 16 & 255;
+  b2[i++] = tl >>> 8 & 255;
+  b2[i++] = tl & 255;
+  var tmh = msecs / 4294967296 * 1e4 & 268435455;
+  b2[i++] = tmh >>> 8 & 255;
+  b2[i++] = tmh & 255;
+  b2[i++] = tmh >>> 24 & 15 | 16;
+  b2[i++] = tmh >>> 16 & 255;
+  b2[i++] = clockseq >>> 8 | 128;
+  b2[i++] = clockseq & 255;
+  for (var n2 = 0; n2 < 6; ++n2) {
+    b2[i + n2] = node[n2];
+  }
+  return buf ? buf : bytesToUuid$1(b2);
+}
+var v1_1 = v1$1;
+var rng = rngBrowser.exports;
+var bytesToUuid = bytesToUuid_1;
+function v4$1(options, buf, offset2) {
+  var i = buf && offset2 || 0;
+  if (typeof options == "string") {
+    buf = options === "binary" ? new Array(16) : null;
+    options = null;
+  }
+  options = options || {};
+  var rnds = options.random || (options.rng || rng)();
+  rnds[6] = rnds[6] & 15 | 64;
+  rnds[8] = rnds[8] & 63 | 128;
+  if (buf) {
+    for (var ii = 0; ii < 16; ++ii) {
+      buf[i + ii] = rnds[ii];
+    }
+  }
+  return buf || bytesToUuid(rnds);
+}
+var v4_1 = v4$1;
+var v1 = v1_1;
+var v4 = v4_1;
+var uuid = v4;
+uuid.v1 = v1;
+uuid.v4 = v4;
+var uuid_1 = uuid;
+const resolvePropVal = (prop, key, args) => {
+  if (Object.prototype.hasOwnProperty.call(prop, key)) {
+    if (typeof prop[key] === "function") {
+      return prop[key].call(globalThis, ...args);
+    }
+    return prop[key];
+  }
+  return void 0;
+};
+const resolveNumberToNumArray = (prop) => {
+  if (/^\d+$/.test(`${prop}`)) {
+    return [parseInt(`${prop}`, 10)];
+  }
+  return [];
+};
+const resolveWidth = (propWidth) => resolveNumberOrStringToPix(propWidth, "auto");
+const resolveNumberOrStringToPix = (val, defaultValue = "100%", offset2 = null) => {
+  let target = "";
+  if (/^auto|null|undefined$/ig.test(`${val}`)) {
+    target = defaultValue;
+  } else {
+    target = /^\d+\.?\d+$/.test(`${val}`) ? `${val}px` : val;
+  }
+  if (offset2) {
+    target = `calc(${target} - ${offset2})`;
+  }
+  return target;
+};
+const resolvePropBorderToClassStr = (val) => {
+  const defaultVal = ["row"];
+  if (typeof val === "string") {
+    defaultVal.push(val);
+  }
+  if (Array.isArray(val)) {
+    defaultVal.push(...val.filter((str) => BORDER_OPRIONS.includes(str)));
+  }
+  return [...new Set(defaultVal)].map((item) => `bordered-${item}`).join(" ");
+};
+const getColumnReactWidth = (colmun, orders = ["resizeWidth", "calcWidth", "width"]) => {
+  var _a, _b;
+  return (_b = (_a = colmun[orders[0]]) != null ? _a : colmun[orders[1]]) != null ? _b : colmun[orders[2]];
+};
+const resolveColumnWidth = (root, colgroups, autoWidth = 20) => {
+  const {
+    width
+  } = root.getBoundingClientRect() || {};
+  let avgWidth = width - 4;
+  const avgColIndexList = [];
+  const getMinWidth = (col, computedWidth) => {
+    const {
+      minWidth = void 0
+    } = col;
+    if (minWidth === void 0) {
+      return computedWidth;
+    }
+    let calcMinWidth = computedWidth;
+    if (/^\d+\.?\d*$/.test(`${minWidth}`)) {
+      calcMinWidth = Number(minWidth);
     }
-    localCurrent.value = localCurrent.value + 1;
-  };
-  const handlePageEditorFocus = () => {
-    isFocused.value = true;
-  };
-  const handlePageEditorBlur = () => {
-    isFocused.value = false;
-    inputRef.value.textContent = `${inputMemo}`;
-    if (inputMemo !== localCurrent.value) {
-      localCurrent.value = inputMemo;
+    if (/^\d+\.?\d*%$/.test(`${minWidth}`)) {
+      calcMinWidth = Number(minWidth) * width / 100;
     }
-  };
-  const handlePageEditorInput = (event) => {
-    const $target = event.target;
-    const value = Number($target.textContent);
-    if (!value || value < 1 || value > proxy.totalPageNum || value === localCurrent.value) {
-      return;
+    if (/^\d+\.?\d*px$/i.test(`${minWidth}`)) {
+      calcMinWidth = Number(`${minWidth}`.replace(/px/i, ""));
     }
-    inputMemo = value;
+    return calcMinWidth;
   };
-  const handlePageEditorKeydown = (event) => {
-    if (["Enter", "NumpadEnter"].includes(event.code)) {
-      event.preventDefault();
-      handlePageEditorBlur();
+  const resolveColNumberWidth = (col, numWidth, resetAvgWidth = true) => {
+    const minWidth = getMinWidth(col, numWidth);
+    const computedWidth = numWidth < minWidth ? minWidth : numWidth;
+    Object.assign(col, {
+      calcWidth: computedWidth
+    });
+    if (resetAvgWidth) {
+      avgWidth = avgWidth - computedWidth;
+      if (avgWidth < 0) {
+        avgWidth = 0;
+      }
     }
   };
-  const handlePageChange = (item) => {
-    inputMemo = item;
-    handlePageEditorBlur();
-  };
-  const render2 = () => createVNode("div", {
-    "class": "bk-pagination-small-list"
-  }, [createVNode("div", {
-    "class": {
-      "bk-pagination-btn-pre": true,
-      "is-disabled": isPagePreDisabled.value
-    },
-    "onClick": handlePrePage
-  }, [createVNode(leftShape, null, null)]), createVNode(BkPopover, {
-    "theme": "light",
-    "trigger": "click",
-    "arrow": false,
-    "boundary": "body",
-    "placement": "bottom"
-  }, {
-    default: () => createVNode("div", {
-      "class": {
-        "bk-pagination-picker": true,
-        "is-focused": isFocused.value
+  colgroups.forEach((col, index) => {
+    if (!col.isHidden) {
+      const colWidth = String(getColumnReactWidth(col));
+      let isAutoWidthCol = true;
+      if (/^\d+\.?\d*(px)?$/.test(colWidth)) {
+        const numWidth = Number(colWidth.replace("px", ""));
+        resolveColNumberWidth(col, numWidth);
+        isAutoWidthCol = false;
       }
-    }, [createVNode("span", {
-      "ref": inputRef,
-      "class": "bk-pagination-editor",
-      "contenteditable": true,
-      "spellcheck": "false",
-      "onFocus": handlePageEditorFocus,
-      "onBlur": handlePageEditorBlur,
-      "onInput": handlePageEditorInput,
-      "onKeydown": handlePageEditorKeydown
-    }, [localCurrent.value]), createVNode("span", null, [createTextVNode("/")]), createVNode("span", {
-      "class": "bk-pagination-small-list-total"
-    }, [proxy.totalPageNum])]),
-    content: () => createVNode("div", {
-      "class": "bk-pagination-picker-list"
-    }, [list.value.map((item) => createVNode("div", {
-      "class": {
-        item: true,
-        "is-actived": item === localCurrent.value
-      },
-      "key": item,
-      "onClick": () => handlePageChange(item)
-    }, [item]))])
-  }), createVNode("div", {
-    "class": {
-      "bk-pagination-btn-next": true,
-      "is-disabled": isPageNextDisabled.value
-    },
-    "onClick": handleNextPage
-  }, [createVNode(rightShape, null, null)])]);
-  return {
-    current: localCurrent,
-    render: render2
-  };
+      if (/^\d+\.?\d*%$/.test(colWidth)) {
+        let perWidth = autoWidth;
+        if (avgWidth > 0) {
+          const percent = Number(colWidth.replace("%", ""));
+          perWidth = avgWidth * percent / 100;
+        }
+        resolveColNumberWidth(col, perWidth);
+        isAutoWidthCol = false;
+      }
+      if (isAutoWidthCol) {
+        avgColIndexList.push(index);
+      }
+    }
+  });
+  if (avgColIndexList.length > 0) {
+    let autoAvgWidth = autoWidth;
+    if (avgWidth > 0) {
+      autoAvgWidth = avgWidth / avgColIndexList.length;
+      avgColIndexList.forEach((idx) => resolveColNumberWidth(colgroups[idx], autoAvgWidth, false));
+    }
+  }
 };
-var useTotal = () => ({
-  isFirst,
-  isLast
-}) => {
-  const {
-    props
-  } = getCurrentInstance();
-  if (!props.showTotalCount) {
-    return null;
+const observerResize = (root, callbackFn, delay = 60, immediate = false) => {
+  const callFn = lodash.exports.throttle(() => {
+    if (typeof callbackFn === "function") {
+      callbackFn();
+    }
+  }, delay);
+  const resizeObserver = new ResizeObserver(() => {
+    callFn();
+  });
+  if (immediate) {
+    if (typeof callbackFn === "function") {
+      callbackFn();
+    }
   }
-  return createVNode("div", mergeProps({
-    "class": {
-      "bk-pagination-total": true,
-      "is-first": isFirst,
-      "is-last": isLast
+  return {
+    start: () => {
+      resizeObserver.observe(root);
+    },
+    stop: () => {
+      resizeObserver.disconnect();
+      resizeObserver.unobserve(root);
     }
-  }, {
-    disabled: props.disabled
-  }), [createTextVNode("\u5171\u8BA1"), createVNode("div", {
-    "class": "bk-pagination-total-num"
-  }, [props.count]), createTextVNode("\u6761")]);
-};
-const paginationProps = {
-  modelValue: PropTypes.number.def(1),
-  count: PropTypes.number.def(0).isRequired,
-  limit: PropTypes.number.def(10),
-  limitList: PropTypes.arrayOf(Number).def([10, 20, 50, 100]),
-  showLimit: PropTypes.bool.def(true),
-  type: PropTypes.oneOf(["default", "compact"]).def("default"),
-  location: PropTypes.oneOf(["left", "right"]).def("right"),
-  align: PropTypes.oneOf(["left", "center", "right"]).def("left"),
-  size: PropTypes.size(),
-  small: PropTypes.bool.def(false),
-  showTotalCount: PropTypes.bool.def(true),
-  prevText: PropTypes.string,
-  nextText: PropTypes.string,
-  disabled: PropTypes.bool.def(false),
-  layout: PropTypes.custom((value) => {
-    const layoutNameMap = {
-      total: true,
-      list: true,
-      limit: true
-    };
-    return value.some((item) => layoutNameMap[item]);
-  }, "layout \u7684\u503C\u53EA\u652F\u6301 * total\u3001list\u3001limit *").def(["total", "list", "limit"])
+  };
 };
-var Component$a = defineComponent({
-  name: "Pagination",
-  props: paginationProps,
-  emits: ["update:modelValue", "change", "update:limit", "limitChange"],
-  setup(props, context) {
-    const totalPageNum = ref(0);
-    const {
-      count,
-      limit
-    } = toRefs(props);
-    const renderTotal = useTotal();
-    const {
-      current: listCurrent,
-      render: renderList
-    } = useList();
-    const {
-      current: smallListCurrent,
-      render: renderSmallList
-    } = useSmallList();
-    const {
-      limit: localLimit,
-      render: renderLimit
-    } = useLimit();
-    watch([count, localLimit, limit], ([count2, localLimit2]) => {
-      const total = Math.ceil(count2 / localLimit2);
-      totalPageNum.value = total < 1 ? 1 : total;
-    }, {
-      immediate: true
-    });
-    watch(listCurrent, (listCurrent2) => {
-      context.emit("update:modelValue", listCurrent2);
-      context.emit("change", listCurrent2);
-    });
-    watch(smallListCurrent, (smallListCurrent2) => {
-      context.emit("update:modelValue", smallListCurrent2);
-      context.emit("change", smallListCurrent2);
-    });
-    watch(localLimit, (localLimit2) => {
-      context.emit("limitChange", localLimit2);
-    });
-    return {
-      totalPageNum,
-      renderTotal,
-      renderList,
-      renderLimit,
-      renderSmallList
-    };
-  },
-  render() {
-    const paginationClass = classes({
-      "bk-pagination": true,
-      [`bk-pagination--${this.size}`]: true,
-      [`is-align-${this.align}`]: true
-    });
-    const layoutMap = {
-      total: this.renderTotal,
-      list: this.small ? this.renderSmallList : this.renderList,
-      limit: this.renderLimit
-    };
-    return createVNode("div", {
-      "class": paginationClass
-    }, [this.layout.map((layout, index) => layoutMap[layout]({
-      isFirst: index === 0,
-      isLast: index === this.layout.length - 1
-    }))]);
+const resolveHeadConfig = (props) => {
+  const {
+    showHead,
+    headHeight,
+    thead = {}
+  } = props;
+  return Object.assign({}, {
+    isShow: showHead,
+    height: headHeight
+  }, __spreadValues({}, thead));
+};
+const getRowText = (row, key, column) => {
+  if (column.type === "index") {
+    return row[TABLE_ROW_ATTRIBUTE.ROW_INDEX];
   }
-});
-const BkPagination = withInstall(Component$a);
-var BodyEmpty = defineComponent({
-  name: "BodyEmpty",
-  props: {
-    list: PropTypes.array.def([]),
-    filterList: PropTypes.array.def([]),
-    emptyText: PropTypes.string.def("\u6682\u65E0\u6570\u636E")
-  },
-  emits: ["change"],
-  setup(props, {
-    slots
-  }) {
-    const type = computed(() => props.list.length === 0 ? "empty" : "search-empty");
-    return () => createVNode(BkException, {
-      "scene": "part",
-      "type": type.value
-    }, {
-      default: () => {
-        var _a, _b;
-        return [(_b = (_a = slots.default) == null ? void 0 : _a.call(slots)) != null ? _b : props.emptyText];
+  return row[key];
+};
+const formatPropAsArray = (prop, args) => {
+  if (Array.isArray(prop)) {
+    return prop;
+  }
+  if (typeof prop === "string" || typeof prop === "object") {
+    return [prop];
+  }
+  if (typeof prop === "function") {
+    return formatPropAsArray(Reflect.apply(prop, globalThis, args), args);
+  }
+  return [];
+};
+const getRowKey = (item, props) => {
+  if (typeof props.rowKey === "string") {
+    const keys = props.rowKey.split(".");
+    return keys.reduce((pre, cur) => {
+      if (Object.prototype.hasOwnProperty.call(pre, cur)) {
+        return pre[cur];
       }
-    });
+      return pre;
+    }, item);
   }
-});
+  if (typeof props.rowKey === "function") {
+    return Reflect.apply(props.rowKey, globalThis, [item]);
+  }
+  return uuid_1.v4();
+};
 function _isSlot$1(s2) {
   return typeof s2 === "function" || Object.prototype.toString.call(s2) === "[object Object]" && !isVNode(s2);
 }
@@ -14419,6 +14365,74 @@ var Settings = defineComponent({
     });
   }
 });
+var useFixedColumn = (props, colgroups) => {
+  const footHeight = computed(() => props.pagination && props.data.length ? 40 : 0);
+  const resolveColumnClass = (column) => ({
+    column_fixed: !!column.fixed,
+    column_fixed_left: column.fixed !== "right",
+    column_fixed_right: column.fixed === "right"
+  });
+  const resolveFixColPos = (column) => column.fixed === "right" ? "right" : "left";
+  const resolveFixOffset = {
+    left: (ignoreFirst = true) => colgroups.filter((col) => col.fixed && col.fixed !== "right").reduce((offset2, curr, index) => {
+      const outOffset = ignoreFirst && index === 0 ? offset2 : offset2 + getColumnReactWidth(curr);
+      return outOffset;
+    }, 0),
+    right: (ignoreFirst = true) => colgroups.filter((col) => col.fixed === "right").reduce((offset2, curr, index) => {
+      const outOffset = ignoreFirst && index === 0 ? offset2 : offset2 + getColumnReactWidth(curr);
+      return outOffset;
+    }, 0)
+  };
+  const reolveFixRightOffset = resolveFixOffset.right;
+  const getFixedColumnStyleResolve = () => {
+    const resolveFixedColumnStyle = (column, fixedoffset2) => {
+      if (!column.fixed) {
+        return {};
+      }
+      const fixedPos = resolveFixColPos(column);
+      const opt = fixedPos === "right" ? -1 : 1;
+      const offsetX = `${fixedoffset2[fixedPos]}px`;
+      fixedoffset2[fixedPos] = fixedoffset2[fixedPos] + getColumnReactWidth(column) * opt;
+      return {
+        [fixedPos]: offsetX
+      };
+    };
+    const rightOffsetWidth = reolveFixRightOffset(true);
+    const fixedoffset = {
+      left: 0,
+      right: rightOffsetWidth
+    };
+    return {
+      fixedoffset,
+      resolveFixedColumnStyle
+    };
+  };
+  const renderFixedColumns = () => {
+    const resolveColumnStyle = (colPos) => ({
+      width: `${resolveFixOffset[colPos](false)}px`,
+      bottom: `${footHeight.value}px`
+    });
+    const colPosExist = {
+      left: false,
+      right: false
+    };
+    return colgroups.filter((col) => !col.isHidden && col.fixed).map((col) => {
+      const colPos = resolveFixColPos(col);
+      const isExist = colPosExist[colPos];
+      colPosExist[colPos] = true;
+      return isExist ? "" : createVNode("div", {
+        "class": resolveColumnClass(col),
+        "style": resolveColumnStyle(colPos)
+      }, null);
+    });
+  };
+  const fixedWrapperClass = resolveClassName("table-fixed");
+  return {
+    renderFixedColumns,
+    fixedWrapperClass,
+    getFixedColumnStyleResolve
+  };
+};
 class TableRender {
   constructor(props, ctx, reactiveProp, colgroups) {
     __publicField(this, "getRowHeight", (row, rowIndex) => {
@@ -14650,60 +14664,272 @@ class TableRender {
         resolveFixedColumnStyle,
         fixedoffset
       } = getFixedColumnStyleResolve();
-      return createVNode("tr", {
+      return [createVNode("tr", {
         "style": rowStyle,
         "class": rowClass,
+        "key": row[TABLE_ROW_ATTRIBUTE.ROW_UID],
         "onClick": (e) => this.handleRowClick(e, row, rowIndex, rows),
         "onDblclick": (e) => this.handleRowDblClick(e, row, rowIndex, rows)
       }, [this.filterColgroups.map((column, index) => {
         const cellStyle = [resolveFixedColumnStyle(column, fixedoffset), ...formatPropAsArray(this.props.cellStyle, [column, index, row, rowIndex, this])];
-        const cellClass = [this.getColumnClass(column, index), ...formatPropAsArray(this.props.cellClass, [column, index, row, rowIndex, this])];
+        const cellClass = [this.getColumnClass(column, index), ...formatPropAsArray(this.props.cellClass, [column, index, row, rowIndex, this]), {
+          "expand-row": row[TABLE_ROW_ATTRIBUTE.ROW_EXPAND]
+        }];
+        const tdCtxClass = {
+          cell: true,
+          "expand-cell": column.type === "expand"
+        };
         return createVNode("td", {
           "class": cellClass,
           "style": cellStyle,
           "colspan": 1,
           "rowspan": 1
         }, [createVNode("div", {
-          "class": "cell"
+          "class": tdCtxClass
         }, [this.renderCell(row, column, rowIndex, rows)])]);
-      })]);
+      })]), this.renderExpandRow(row, rowClass)];
     })]);
   }
+  renderExpandRow(row, rowClass) {
+    var _a, _b, _c;
+    const isExpand = !!row[TABLE_ROW_ATTRIBUTE.ROW_EXPAND];
+    if (isExpand) {
+      const resovledClass = [...rowClass, {
+        row_expend: true
+      }];
+      return createVNode("tr", {
+        "class": resovledClass
+      }, [createVNode("td", {
+        "colspan": this.filterColgroups.length,
+        "rowspan": 1
+      }, [(_c = (_b = (_a = this.context.slots).expandRow) == null ? void 0 : _b.call(_a, row)) != null ? _c : createVNode("div", {
+        "class": "expand-cell-ctx"
+      }, [createTextVNode("Expand Row")])])]);
+    }
+  }
   handleRowClick(e, row, index, rows) {
     this.context.emit("rowClick", e, row, index, rows, this);
   }
   handleRowDblClick(e, row, index, rows) {
     this.context.emit("rowDblClick", e, row, index, rows, this);
   }
+  getExpandCell(row) {
+    const isExpand = !!row[TABLE_ROW_ATTRIBUTE.ROW_EXPAND];
+    return isExpand ? createVNode(downShape, null, null) : createVNode(rightShape, null, null);
+  }
+  handleRowExpandClick(row, column, index, rows, e) {
+    this.emitEvent(EVENTS$1.ON_ROW_EXPAND_CLICK, [{
+      row,
+      column,
+      index,
+      rows,
+      e
+    }]);
+  }
   renderCell(row, column, index, rows) {
+    if (column.type === "expand") {
+      const renderExpandSlot = () => {
+        var _a, _b, _c;
+        if (typeof column.render === "function") {
+          return column.render(null, row, index, rows);
+        }
+        return (_c = (_b = (_a = this.context.slots).expandCell) == null ? void 0 : _b.call(_a, {
+          row,
+          column,
+          index,
+          rows
+        })) != null ? _c : this.getExpandCell(row);
+      };
+      return createVNode("span", {
+        "class": "expand-btn-action",
+        "onClick": (e) => this.handleRowExpandClick(row, column, index, rows, e)
+      }, [renderExpandSlot()]);
+    }
     const cell = getRowText(row, resolvePropVal(column, "field", [column, row]), column);
     if (typeof column.render === "function") {
       return column.render(cell, row, index, rows);
     }
-    return cell;
-  }
-  isColActive(colIndex) {
-    return this.props.columnPick !== "disabled" && this.propActiveCols.some((col) => col.index === colIndex && col.active);
-  }
-  renderColGroup() {
-    return createVNode("colgroup", null, [(this.filterColgroups || []).map((column, index) => {
-      const colCls = classes({
-        active: this.isColActive(index)
+    return cell;
+  }
+  isColActive(colIndex) {
+    return this.props.columnPick !== "disabled" && this.propActiveCols.some((col) => col.index === colIndex && col.active);
+  }
+  renderColGroup() {
+    return createVNode("colgroup", null, [(this.filterColgroups || []).map((column, index) => {
+      const colCls = classes({
+        active: this.isColActive(index)
+      });
+      const width = `${resolveWidth(getColumnReactWidth(column))}`.replace(/px$/i, "");
+      return createVNode("col", {
+        "class": colCls,
+        "width": width
+      }, null);
+    })]);
+  }
+  get filterColgroups() {
+    return this.colgroups.filter((col) => !col.isHidden);
+  }
+  get setting() {
+    return this.reactiveProp.setting;
+  }
+}
+const resolveActiveColumns = (props) => {
+  if (props.columnPick !== "disabled") {
+    if (props.columnPick === "multi") {
+      return Array.isArray(props.activeColumn) ? props.activeColumn : resolveNumberToNumArray(props.activeColumn);
+    }
+    return Array.isArray(props.activeColumn) ? resolveNumberToNumArray(props.activeColumn[0]) : resolveNumberToNumArray(props.activeColumn);
+  }
+  return [];
+};
+var useActiveColumns = (props) => {
+  let activeColumns = reactive([]);
+  if (props.columnPick === "disabled") {
+    return {
+      activeColumns
+    };
+  }
+  const activeCols = reactive(resolveActiveColumns(props));
+  const getActiveColumns = () => (props.columns || []).map((_column, index) => ({
+    index,
+    active: activeCols.some((colIndex) => colIndex === index),
+    _column
+  }));
+  watchEffect(() => {
+    activeColumns = getActiveColumns();
+    const cols = resolveActiveColumns(props);
+    activeColumns.forEach((col, index) => {
+      Object.assign(col, {
+        active: cols.some((colIndex) => colIndex === index)
+      });
+    });
+  });
+  return {
+    activeColumns
+  };
+};
+var useColumnResize = (colgroups, immediate = true) => {
+  const pluginName = "HeadColumnResize";
+  let EVENTS2;
+  (function(EVENTS3) {
+    EVENTS3["MOUSE_MOVE"] = "onMousemove";
+    EVENTS3["MOUSE_OUT"] = "onMouseout";
+    EVENTS3["MOUSE_DOWN"] = "onMousedown";
+  })(EVENTS2 || (EVENTS2 = {}));
+  let isInDragSection = false;
+  let isMouseDown = false;
+  let isDraging = false;
+  let startX = 0;
+  let dragColumn = null;
+  let dragStartOffsetX = 0;
+  const dragOffsetX = ref(-1e3);
+  const handleMouseUp = (e) => {
+    var _a;
+    isMouseDown = false;
+    isDraging = false;
+    const bodyStyle = document.body.style;
+    bodyStyle.cursor = "";
+    const diff = e.clientX - startX;
+    dragColumn.resizeWidth = ((_a = dragColumn.resizeWidth) != null ? _a : dragColumn.calcWidth) + diff;
+    document.removeEventListener("mouseup", handleMouseUp);
+    document.removeEventListener("mousemove", handleMouseMove);
+    startX = 0;
+    dragOffsetX.value = -1e3;
+    dragColumn = null;
+    const targetTable = e.target.closest("table");
+    targetTable.querySelectorAll("th").forEach((th) => th.style.setProperty("user-select", "inherit"));
+  };
+  const handleMouseMove = (e) => {
+    const bodyStyle = document.body.style;
+    bodyStyle.setProperty("cursor", "");
+    dragOffsetX.value = e.clientX - startX + dragStartOffsetX;
+  };
+  const handler = {
+    [EVENTS2.MOUSE_DOWN]: (e, column) => {
+      if (!isInDragSection) {
+        return;
+      }
+      isMouseDown = true;
+      const bodyStyle = document.body.style;
+      bodyStyle.setProperty("cursor", "col-resize");
+      dragColumn = column;
+      startX = e.clientX;
+      const targetTable = e.target.closest("table");
+      dragStartOffsetX = startX - targetTable.getBoundingClientRect().left;
+      document.addEventListener("mouseup", handleMouseUp);
+      document.addEventListener("mousemove", handleMouseMove);
+    },
+    [EVENTS2.MOUSE_MOVE]: (e, _column) => {
+      if (isMouseDown && !isDraging) {
+        isDraging = true;
+      }
+      const target = e.target.closest("th");
+      if (isDraging) {
+        target.style.setProperty("user-select", "none");
+      }
+      if (!isDraging) {
+        if (!target) {
+          return;
+        }
+        const rect = target.getBoundingClientRect();
+        if (rect.width > 12 && rect.right - e.pageX < 8) {
+          isInDragSection = true;
+          target.style.setProperty("cursor", "col-resize");
+        } else {
+          isInDragSection = false;
+        }
+      }
+    },
+    [EVENTS2.MOUSE_OUT]: (e, _column) => {
+      const target = e.target;
+      if (!isDraging) {
+        target.style.setProperty("cursor", "");
+      }
+    }
+  };
+  const getEventName = (event) => `${pluginName}_${event}`;
+  const registerResizeEvent = () => {
+    colgroups.forEach((col) => {
+      if (col.resizable !== false) {
+        Object.keys(handler).forEach((event) => {
+          const name = getEventName(event);
+          if (!col.listeners.has(name)) {
+            col.listeners.set(name, []);
+          }
+          col.listeners.get(name).push(handler[event]);
+        });
+      }
+    });
+  };
+  const resetResizeEvents = () => {
+    colgroups.forEach((col) => {
+      Object.keys(handler).forEach((event) => {
+        const name = getEventName(event);
+        if (col.listeners.has(name)) {
+          const listeners = col.listeners.get(name);
+          listeners.splice(0, listeners.length);
+        }
       });
-      const width = `${resolveWidth(getColumnReactWidth(column))}`.replace(/px$/i, "");
-      return createVNode("col", {
-        "class": colCls,
-        "width": width
-      }, null);
-    })]);
-  }
-  get filterColgroups() {
-    return this.colgroups.filter((col) => !col.isHidden);
-  }
-  get setting() {
-    return this.reactiveProp.setting;
+    });
+  };
+  if (immediate) {
+    registerResizeEvent();
   }
-}
+  const dragOffsetXStyle = computed(() => ({
+    position: "absolute",
+    top: 0,
+    bottom: 0,
+    left: `${dragOffsetX.value}px`,
+    width: "1px",
+    "background-color": "#ebeef5"
+  }));
+  return {
+    registerResizeEvent,
+    resetResizeEvents,
+    dragOffsetX,
+    dragOffsetXStyle
+  };
+};
 const useClass = (props, root, reactiveProp, pageData) => {
   const autoHeight = ref(200);
   const hasScrollY = ref(false);
@@ -14796,46 +15022,99 @@ const useClass = (props, root, reactiveProp, pageData) => {
     hasFooter
   };
 };
+const useInit = (props) => {
+  var _a;
+  const colgroups = reactive(((_a = props.columns) != null ? _a : []).map((col) => __spreadProps(__spreadValues({}, col), {
+    calcWidth: null,
+    resizeWidth: null,
+    listeners: /* @__PURE__ */ new Map()
+  })));
+  const { dragOffsetXStyle } = useColumnResize(colgroups, true);
+  const { activeColumns } = useActiveColumns(props);
+  const reactiveSchema = reactive({
+    rowActions: /* @__PURE__ */ new Map(),
+    scrollTranslateY: 0,
+    scrollTranslateX: 0,
+    pos: {
+      bottom: 1
+    },
+    activeColumns,
+    setting: {
+      size: null,
+      height: null
+    }
+  });
+  const isRowExpand = (rowId) => {
+    var _a2;
+    if (reactiveSchema.rowActions.has(rowId)) {
+      return (_a2 = reactiveSchema.rowActions.get(rowId)) == null ? void 0 : _a2.isExpand;
+    }
+    return false;
+  };
+  const setRowExpand = (row, expand = void 0) => {
+    var _a2;
+    const rowId = row[TABLE_ROW_ATTRIBUTE.ROW_UID];
+    const isExpand = typeof expand === "boolean" ? expand : !isRowExpand(rowId);
+    reactiveSchema.rowActions.set(rowId, Object.assign({}, (_a2 = reactiveSchema.rowActions.get(rowId)) != null ? _a2 : {}, { isExpand }));
+    updateIndexData();
+  };
+  const indexData = reactive([]);
+  const initIndexData = (keepLocalAction = false) => {
+    indexData.splice(0, indexData.length, ...props.data.map((item, index) => {
+      const rowId = getRowKey(item, props);
+      return __spreadProps(__spreadValues({}, item), {
+        [TABLE_ROW_ATTRIBUTE.ROW_INDEX]: index + 1,
+        [TABLE_ROW_ATTRIBUTE.ROW_UID]: rowId,
+        [TABLE_ROW_ATTRIBUTE.ROW_EXPAND]: keepLocalAction ? isRowExpand(rowId) : false
+      });
+    }));
+  };
+  const updateIndexData = () => {
+    indexData.forEach((item) => {
+      Object.assign(item, {
+        [TABLE_ROW_ATTRIBUTE.ROW_EXPAND]: isRowExpand(item[TABLE_ROW_ATTRIBUTE.ROW_UID])
+      });
+    });
+  };
+  const { renderFixedColumns, fixedWrapperClass } = useFixedColumn(props, colgroups);
+  return {
+    colgroups,
+    dragOffsetXStyle,
+    reactiveSchema,
+    indexData,
+    fixedWrapperClass,
+    initIndexData,
+    updateIndexData,
+    renderFixedColumns,
+    setRowExpand
+  };
+};
 var Component$9 = defineComponent({
   name: "Table",
   props: tableProps,
   emits: EMIT_EVENT_TYPES,
   setup(props, ctx) {
-    var _a;
-    const colgroups = reactive(((_a = props.columns) != null ? _a : []).map((col) => __spreadProps(__spreadValues({}, col), {
-      calcWidth: null,
-      resizeWidth: null,
-      listeners: /* @__PURE__ */ new Map()
-    })));
+    const {
+      colgroups,
+      dragOffsetXStyle,
+      reactiveSchema,
+      indexData,
+      renderFixedColumns,
+      setRowExpand,
+      initIndexData,
+      fixedWrapperClass
+    } = useInit(props);
     let columnSortFn = null;
     let columnFilterFn = null;
     let observerIns = null;
     const root = ref();
     const refVirtualRender = ref();
-    const {
-      dragOffsetXStyle
-    } = useColumnResize(colgroups, true);
-    const {
-      activeColumns
-    } = useActiveColumns(props);
-    const reactiveProp = reactive({
-      scrollTranslateY: 0,
-      scrollTranslateX: 0,
-      pos: {
-        bottom: 1
-      },
-      activeColumns,
-      setting: {
-        size: null,
-        height: null
-      }
-    });
     const {
       pageData,
       localPagination,
       resolvePageData,
       watchEffectFn
-    } = userPagination(props);
+    } = userPagination(props, indexData);
     const {
       tableClass,
       headClass,
@@ -14847,13 +15126,10 @@ var Component$9 = defineComponent({
       updateBorderClass,
       resetTableHeight,
       hasFooter
-    } = useClass(props, root, reactiveProp, pageData);
-    const {
-      renderFixedColumns,
-      fixedWrapperClass
-    } = useFixedColumn(props, colgroups);
-    const tableRender = new TableRender(props, ctx, reactiveProp, colgroups);
+    } = useClass(props, root, reactiveSchema, pageData);
+    const tableRender = new TableRender(props, ctx, reactiveSchema, colgroups);
     watch(() => [props.data, props.pagination], () => {
+      initIndexData(props.reserveExpand);
       watchEffectFn(columnFilterFn, columnSortFn);
       nextTick(() => {
         resetTableHeight(root.value);
@@ -14896,32 +15172,48 @@ var Component$9 = defineComponent({
         index
       });
     }).on(EVENTS$1.ON_SETTING_CHANGE, (args) => {
-      var _a2, _b;
+      var _a, _b;
       const {
         checked = [],
         size,
         height
       } = args;
       checked.length && resolveColumnWidth(root.value, colgroups, 20);
-      (_b = (_a2 = refVirtualRender.value) == null ? void 0 : _a2.reset) == null ? void 0 : _b.call(_a2);
+      (_b = (_a = refVirtualRender.value) == null ? void 0 : _a.reset) == null ? void 0 : _b.call(_a);
       ctx.emit(EMITEVENTS.SETTING_CHANGE, {
         checked,
         size,
         height
       });
+    }).on(EVENTS$1.ON_ROW_EXPAND_CLICK, (args) => {
+      const {
+        row,
+        column,
+        index,
+        rows,
+        e
+      } = args;
+      ctx.emit(EMITEVENTS.ROW_EXPAND_CLICK, {
+        row,
+        column,
+        index,
+        rows,
+        e
+      });
+      setRowExpand(row, !row[TABLE_ROW_ATTRIBUTE.ROW_EXPAND]);
     });
     const handleScrollChanged = (args) => {
-      var _a2;
-      const preBottom = (_a2 = reactiveProp.pos.bottom) != null ? _a2 : 0;
+      var _a;
+      const preBottom = (_a = reactiveSchema.pos.bottom) != null ? _a : 0;
       const pagination2 = args[1];
       const {
         translateX,
         translateY,
         pos = {}
       } = pagination2;
-      reactiveProp.scrollTranslateY = translateY;
-      reactiveProp.scrollTranslateX = translateX;
-      reactiveProp.pos = pos;
+      reactiveSchema.scrollTranslateY = translateY;
+      reactiveSchema.scrollTranslateX = translateX;
+      reactiveSchema.pos = pos;
       const {
         bottom: bottom2
       } = pos;
@@ -14948,6 +15240,9 @@ var Component$9 = defineComponent({
       observerIns = null;
       tableRender.destroy();
     });
+    ctx.expose({
+      setRowExpand
+    });
     const tableBodyClass = __spreadProps(__spreadValues({}, contentClass), {
       "__is-empty": !pageData.length
     });
@@ -15970,11 +16265,11 @@ const tabNavEventProps = {
   },
   tabChange: {
     type: Function,
-    default: (name2) => name2
+    default: (name) => name
   },
   tabRemove: {
     type: Function,
-    default: (name2) => name2
+    default: (name) => name
   },
   tabSort: {
     type: Function,
@@ -16043,7 +16338,7 @@ var TabNav = defineComponent({
           return null;
         }
         const {
-          name: name2,
+          name,
           label,
           closable,
           visible,
@@ -16053,7 +16348,7 @@ var TabNav = defineComponent({
         if (!visible) {
           return false;
         }
-        if (props.active === name2) {
+        if (props.active === name) {
           hasFindActive = true;
         }
         const renderLabel = (label2) => {
@@ -16072,7 +16367,7 @@ var TabNav = defineComponent({
           return label2;
         };
         list.push({
-          name: name2,
+          name,
           closable,
           visible,
           disabled,
@@ -16118,8 +16413,8 @@ var TabNav = defineComponent({
         }
         props.tabSort(dragStartIndex.value, index, sortType);
       },
-      handleTabChange(name2) {
-        props.tabChange(name2);
+      handleTabChange(name) {
+        props.tabChange(name);
       },
       handleTabRemove(index, panel) {
         props.tabRemove(index, panel);
@@ -16151,7 +16446,7 @@ var TabNav = defineComponent({
         return null;
       }
       const {
-        name: name2,
+        name,
         disabled,
         tabLabel
       } = item;
@@ -16160,15 +16455,15 @@ var TabNav = defineComponent({
         if (disabled) {
           classNames.push("bk-tab-header--disabled");
         }
-        if (active === name2) {
+        if (active === name) {
           classNames.push("bk-tab-header--active");
         }
         return classNames.join(" ");
       };
       const getValue = (curentValue, parentValue) => curentValue || parentValue;
       return createVNode("div", {
-        "key": name2,
-        "onClick": () => this.handleTabChange(name2),
+        "key": name,
+        "onClick": () => this.handleTabChange(name),
         "draggable": getValue(item.sortable, sortable),
         "onDragstart": (e) => dragstart(index, e),
         "onDragenter": (e) => {
@@ -16305,10 +16600,10 @@ var Tab = defineComponent({
           e
         });
       },
-      tabChange(name2) {
-        emit("change", name2);
-        emit("tab-change", name2);
-        emit("update:active", name2);
+      tabChange(name) {
+        emit("change", name);
+        emit("tab-change", name);
+        emit("update:active", name);
       },
       tabRemove(index, panel) {
         emit("remove", index, panel);
@@ -22137,144 +22432,6 @@ var useSearch = (props) => {
     isTreeUI
   };
 };
-var rngBrowser = { exports: {} };
-var getRandomValues = typeof crypto != "undefined" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto != "undefined" && typeof window.msCrypto.getRandomValues == "function" && msCrypto.getRandomValues.bind(msCrypto);
-if (getRandomValues) {
-  var rnds8 = new Uint8Array(16);
-  rngBrowser.exports = function whatwgRNG() {
-    getRandomValues(rnds8);
-    return rnds8;
-  };
-} else {
-  var rnds = new Array(16);
-  rngBrowser.exports = function mathRNG() {
-    for (var i = 0, r2; i < 16; i++) {
-      if ((i & 3) === 0)
-        r2 = Math.random() * 4294967296;
-      rnds[i] = r2 >>> ((i & 3) << 3) & 255;
-    }
-    return rnds;
-  };
-}
-var byteToHex = [];
-for (var i = 0; i < 256; ++i) {
-  byteToHex[i] = (i + 256).toString(16).substr(1);
-}
-function bytesToUuid$2(buf, offset2) {
-  var i = offset2 || 0;
-  var bth = byteToHex;
-  return [
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    "-",
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]],
-    bth[buf[i++]]
-  ].join("");
-}
-var bytesToUuid_1 = bytesToUuid$2;
-var rng$1 = rngBrowser.exports;
-var bytesToUuid$1 = bytesToUuid_1;
-var _nodeId;
-var _clockseq;
-var _lastMSecs = 0;
-var _lastNSecs = 0;
-function v1$1(options, buf, offset2) {
-  var i = buf && offset2 || 0;
-  var b2 = buf || [];
-  options = options || {};
-  var node = options.node || _nodeId;
-  var clockseq = options.clockseq !== void 0 ? options.clockseq : _clockseq;
-  if (node == null || clockseq == null) {
-    var seedBytes = rng$1();
-    if (node == null) {
-      node = _nodeId = [
-        seedBytes[0] | 1,
-        seedBytes[1],
-        seedBytes[2],
-        seedBytes[3],
-        seedBytes[4],
-        seedBytes[5]
-      ];
-    }
-    if (clockseq == null) {
-      clockseq = _clockseq = (seedBytes[6] << 8 | seedBytes[7]) & 16383;
-    }
-  }
-  var msecs = options.msecs !== void 0 ? options.msecs : new Date().getTime();
-  var nsecs = options.nsecs !== void 0 ? options.nsecs : _lastNSecs + 1;
-  var dt = msecs - _lastMSecs + (nsecs - _lastNSecs) / 1e4;
-  if (dt < 0 && options.clockseq === void 0) {
-    clockseq = clockseq + 1 & 16383;
-  }
-  if ((dt < 0 || msecs > _lastMSecs) && options.nsecs === void 0) {
-    nsecs = 0;
-  }
-  if (nsecs >= 1e4) {
-    throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");
-  }
-  _lastMSecs = msecs;
-  _lastNSecs = nsecs;
-  _clockseq = clockseq;
-  msecs += 122192928e5;
-  var tl = ((msecs & 268435455) * 1e4 + nsecs) % 4294967296;
-  b2[i++] = tl >>> 24 & 255;
-  b2[i++] = tl >>> 16 & 255;
-  b2[i++] = tl >>> 8 & 255;
-  b2[i++] = tl & 255;
-  var tmh = msecs / 4294967296 * 1e4 & 268435455;
-  b2[i++] = tmh >>> 8 & 255;
-  b2[i++] = tmh & 255;
-  b2[i++] = tmh >>> 24 & 15 | 16;
-  b2[i++] = tmh >>> 16 & 255;
-  b2[i++] = clockseq >>> 8 | 128;
-  b2[i++] = clockseq & 255;
-  for (var n2 = 0; n2 < 6; ++n2) {
-    b2[i + n2] = node[n2];
-  }
-  return buf ? buf : bytesToUuid$1(b2);
-}
-var v1_1 = v1$1;
-var rng = rngBrowser.exports;
-var bytesToUuid = bytesToUuid_1;
-function v4$1(options, buf, offset2) {
-  var i = buf && offset2 || 0;
-  if (typeof options == "string") {
-    buf = options === "binary" ? new Array(16) : null;
-    options = null;
-  }
-  options = options || {};
-  var rnds = options.random || (options.rng || rng)();
-  rnds[6] = rnds[6] & 15 | 64;
-  rnds[8] = rnds[8] & 63 | 128;
-  if (buf) {
-    for (var ii = 0; ii < 16; ++ii) {
-      buf[i + ii] = rnds[ii];
-    }
-  }
-  return buf || bytesToUuid(rnds);
-}
-var v4_1 = v4$1;
-var v1 = v1_1;
-var v4 = v4_1;
-var uuid = v4;
-uuid.v1 = v1;
-uuid.v4 = v4;
-var uuid_1 = uuid;
 var useTreeInit = (props) => {
   var _a;
   const getFlatdata = (props2, treeData = void 0, cachedSchema = []) => {
@@ -22949,8 +23106,7 @@ var FormItem = defineComponent({
         rules = props.rules;
       }
       rules = getTriggerRules(trigger, mergeRules(rules, getRulesFromProps(props)));
-      console.log(rules);
-      const value = form2.props.model[props.property];
+      const value = lodash.exports.get(form2.props.model, props.property);
       const doValidate = (() => {
         let stepIndex = -1;
         return () => {