@opentiny/vue-renderless 3.26.0 → 3.28.0

package/color-select-panel/utils/color-points.js

@@ -0,0 +1,86 @@
+import "../../chunk-G2ADBYYC.js";
+import { draggable } from "./use-drag";
+import { getClientXY } from "./getClientXY";
+class ColorPoint {
+  constructor(color, cursorLeft) {
+    this.color = color;
+    this.cursorLeft = cursorLeft;
+  }
+}
+const useColorPoints = (props, hooks, ctx) => {
+  const { ref, watch, readonly } = hooks;
+  const points = ctx.colorPoints;
+  const actviePoint = ctx.activeColor;
+  const deg = ref(45);
+  const linearGradientValue = ref("");
+  const addPoint = (point) => {
+    points.value.push(point);
+  };
+  const removePoint = (point) => {
+    points.value = points.value.filter((curPoint) => curPoint !== point);
+  };
+  const updateDeg = (_deg) => {
+    deg.value = _deg;
+  };
+  const onDrag = (wrapper, event) => {
+    const wrapperEl = wrapper.value;
+    if (!wrapperEl) {
+      return;
+    }
+    const rect = wrapperEl.getBoundingClientRect();
+    const { clientX } = getClientXY(event);
+    actviePoint.value.cursorLeft = Math.min(Math.max(clientX - rect.left, 0), rect.width);
+  };
+  const onClick = (element, point) => {
+    const el = element;
+    actviePoint.value = point;
+    draggable(el, {
+      drag(event) {
+        onDrag(props.wrapper, event);
+      },
+      end(event) {
+        onDrag(props.wrapper, event);
+      }
+    });
+  };
+  const getRelativePos = (wrapper, point) => {
+    const wrapperEl = wrapper.value;
+    const rect = wrapperEl.getBoundingClientRect();
+    return (point.cursorLeft / rect.width * 100).toFixed(0);
+  };
+  const setActivePoint = (point) => {
+    actviePoint.value = point;
+  };
+  const getActviePoint = () => actviePoint;
+  const toString = () => {
+    const colroString = points.value.map(
+      (point) => [point.color.value, `${getRelativePos(props.wrapper, point)}%`].join(" ")
+    );
+    linearGradientValue.value = `linear-gradient(${deg.value}deg, ${colroString.join(",")})`;
+  };
+  watch(deg, toString, { deep: true });
+  watch(
+    actviePoint,
+    () => {
+      if (!props.wrapper.value) {
+        return;
+      }
+      toString();
+    },
+    { deep: true }
+  );
+  return {
+    onClick,
+    linearGradientValue: readonly(linearGradientValue),
+    updateDeg,
+    removePoint,
+    addPoint,
+    setActivePoint,
+    getActviePoint,
+    onDrag
+  };
+};
+export {
+  ColorPoint,
+  useColorPoints
+};

package/color-select-panel/utils/color.js

@@ -241,7 +241,7 @@ class Color {
     } else {
       this._alpha = 100;
     }
-    if (parent.length >= 3) {
+    if (parts.length >= 3) {
       const { h, s, v } = hsl2hsv({
         hue: parts[0],
         sat: parts[1],

package/color-select-panel/utils/context.js

@@ -0,0 +1,14 @@
+import "../../chunk-G2ADBYYC.js";
+const ContextKey = Symbol("");
+const createContext = (data, hooks) => {
+  hooks.provide(ContextKey, data);
+  return data;
+};
+const useContext = (hooks) => {
+  return hooks.inject(ContextKey);
+};
+export {
+  ContextKey,
+  createContext,
+  useContext
+};

package/color-select-panel/vue.js

@@ -16,8 +16,8 @@ const api = [
   "onHistoryClick",
   "onClickOutside"
 ];
-const renderless = (props, hooks, utils) => {
-  const state = initState(props, hooks);
+const renderless = (props, hooks, utils, ext) => {
+  const state = initState(props, hooks, utils, ext);
   const {
     open,
     close,
@@ -32,7 +32,7 @@ const renderless = (props, hooks, utils) => {
     onPredefineColorClick,
     onHistoryClick,
     onClickOutside
-  } = initApi(props, state, utils);
+  } = initApi(props, state, utils, hooks, ext);
   const api2 = {
     state,
     open,

package/common/deps/infinite-scroll.js

@@ -24,7 +24,7 @@ const parseAttrValue = (attrVal, type, defaultVal) => {
 const computeScrollOptions = (el, instance) => Object.entries(attrs).reduce((accumulator, [name, option]) => {
   const { type, default: defaultValue } = option;
   const attrKey = `infinite-scroll-${name}`;
-  const $attrValue = instance.$el.getAttribute(attrKey);
+  const $attrValue = (instance == null ? void 0 : instance.$el) && typeof instance.$el.getAttribute === "function" ? instance.$el.getAttribute(attrKey) : null;
   const attrValue = el.getAttribute(attrKey);
   let value;
   if (isNull(attrValue) && isNull($attrValue) || !isNull(attrValue)) {

package/dialog-box/index.js

@@ -129,14 +129,14 @@ const handleClose = ({
   if (typeof props.beforeClose === "function" && props.beforeClose(type) === false) {
     return;
   }
+  if (!emitEvent(emit, "before-close", api.hide)) {
+    return;
+  }
   const el = parent.$el;
   if (props.rightSlide) {
     const dialogBoxDom = el.querySelector(constants.DIALOG_BOX_CLASS) || el;
     dialogBoxDom.style.left = "";
   }
-  if (!emitEvent(emit, "before-close", api.hide)) {
-    return;
-  }
   api.hide(type);
 };
 const hide = ({ api, emit, state, props }) => (cancel) => {

package/dialog-box/vue.js

@@ -27,6 +27,7 @@ const api = [
   "afterEnter",
   "afterLeave",
   "handleClose",
+  "hide",
   "handleWrapperClick",
   "useMouseEventDown",
   "useMouseEventUp",

package/drawer/index.js

@@ -57,6 +57,23 @@ const handleClose = ({ emit, props, state }) => (type, force) => {
     }, 200);
   }
 };
+const keydown = ({ api, state, props }) => (event) => {
+  if (!state.visible) {
+    return;
+  }
+  if (!props.closeOnPressEscape) {
+    return;
+  }
+  if (event.key === "Escape" || event.key === "Esc") {
+    api.handleClose("esc", true);
+  }
+};
+const addKeydownEvent = ({ api }) => () => {
+  document.addEventListener("keydown", api.keydown);
+};
+const removeKeydownEvent = ({ api }) => () => {
+  document.removeEventListener("keydown", api.keydown);
+};
 const mousedown = ({ state, vm }) => (event) => {
   event.preventDefault();
   const touch = event.touches ? event.touches[0] : event;
@@ -127,17 +144,20 @@ const hideScrollbar = (lockScrollClass) => () => {
 };
 export {
   addDragEvent,
+  addKeydownEvent,
   close,
   computedHeight,
   computedWidth,
   confirm,
   handleClose,
   hideScrollbar,
+  keydown,
   mousedown,
   mousemove,
   mouseup,
   open,
   removeDragEvent,
+  removeKeydownEvent,
   showScrollbar,
   watchVisible
 };

package/drawer/vue.js

@@ -13,7 +13,10 @@ import {
   handleClose,
   computedWidth,
   computedHeight,
-  open
+  open,
+  keydown,
+  addKeydownEvent,
+  removeKeydownEvent
 } from "./index";
 const api = ["state", "close", "confirm", "handleClose", "open"];
 const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, computed }, { emit, vm, mode, constants, designConfig }) => {
@@ -36,6 +39,9 @@ const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, comput
     mousedown: mousedown({ state, vm }),
     mousemove: mousemove({ state, props, emit }),
     mouseup: mouseup({ state }),
+    keydown: keydown({ api: api2, state, props }),
+    addKeydownEvent: addKeydownEvent({ api: api2 }),
+    removeKeydownEvent: removeKeydownEvent({ api: api2 }),
     addDragEvent: addDragEvent({ api: api2, vm }),
     removeDragEvent: removeDragEvent({ api: api2, vm }),
     watchVisible: watchVisible({ state, api: api2 }),
@@ -46,12 +52,14 @@ const renderless = (props, { reactive, watch, onMounted, onBeforeUnmount, comput
   });
   onMounted(() => {
     props.dragable && api2.addDragEvent();
+    api2.addKeydownEvent();
     if (props.lockScroll && props.visible) {
       api2.showScrollbar();
     }
   });
   onBeforeUnmount(() => {
     props.dragable && api2.removeDragEvent();
+    api2.removeKeydownEvent();
     props.lockScroll && api2.hideScrollbar();
   });
   watch(() => props.visible, api2.watchVisible, { immediate: true });

package/dropdown/index.js

@@ -23,7 +23,7 @@ const show = ({ props, state, emit }) => () => {
       () => {
         state.visible = true;
       },
-      state.trigger === "click" ? 0 : props.showTimeout
+      state.trigger === "click" || state.trigger === "contextmenu" ? 0 : props.showTimeout
     );
   }
 };
@@ -43,7 +43,7 @@ const hide = ({ api, props, state, emit }) => () => {
       () => {
         state.visible = false;
       },
-      state.trigger === "click" ? 0 : props.hideTimeout
+      state.trigger === "click" || state.trigger === "contextmenu" ? 0 : props.hideTimeout
     );
   }
 };
@@ -118,7 +118,7 @@ const removeTabindex = (state) => () => {
 const initAria = ({ state, props }) => () => {
   var _a, _b, _c, _d, _e;
   (_a = state.dropdownElm) == null ? void 0 : _a.setAttribute("id", state.listId);
-  (_b = state.triggerElm) == null ? void 0 : _b.setAttribute("aria-haspopup", "list");
+  (_b = state.triggerElm) == null ? void 0 : _b.setAttribute("aria-haspopup", "menu");
   (_c = state.triggerElm) == null ? void 0 : _c.setAttribute("aria-controls", state.listId);
   if (!props.splitButton || !props.singleButton) {
     (_d = state.triggerElm) == null ? void 0 : _d.setAttribute("role", "button");
@@ -143,7 +143,12 @@ const initEvent = ({ api, props, state, vm, mode }) => () => {
   if (state.visibleIsBoolean) {
     return;
   }
-  if (state.trigger === "hover") {
+  if (state.trigger === "contextmenu") {
+    on(state.triggerElm, "contextmenu", (e) => {
+      e.preventDefault();
+      api.handleClick();
+    });
+  } else if (state.trigger === "hover") {
     on(state.triggerElm, "mouseenter", api.show);
     on(state.triggerElm, "mouseleave", api.hide);
     on(state.dropdownElm, "mouseenter", api.show);
@@ -212,6 +217,7 @@ const beforeDistory = ({ vm, api, state }) => () => {
     off(state.triggerElm, "mouseenter", api.show);
     off(state.triggerElm, "mouseleave", api.hide);
     off(state.triggerElm, "click", api.handleClick);
+    off(state.triggerElm, "contextmenu", api.handleClick);
     state.triggerElm = null;
   }
   if (state.dropdownElm) {

package/file-upload/index.js

@@ -288,13 +288,27 @@ const properFileSize = ({
   Modal,
   t
 }) => (file) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   if ([void 0, null].includes(file.size))
     return true;
   let maxSize = 0;
-  if (Array.isArray(props.fileSize) && props.fileSize[1]) {
-    maxSize = state.isEdm ? Math.min(state.singleMaxSize, props.fileSize[1] / 1024) : Math.max(props.fileSize[0] / 1024, props.fileSize[1] / 1024);
+  const edmConfigSingleFileMaxSize = ((_b = (_a = state.edmToken) == null ? void 0 : _a.config) == null ? void 0 : _b.singleFileMaxSize) || ((_d = (_c = props.edm) == null ? void 0 : _c.config) == null ? void 0 : _d.singleFileMaxSize) ? (((_f = (_e = state.edmToken) == null ? void 0 : _e.config) == null ? void 0 : _f.singleFileMaxSize) || ((_h = (_g = props.edm) == null ? void 0 : _g.config) == null ? void 0 : _h.singleFileMaxSize)) / 1024 : null;
+  if (state.isEdm) {
+    if (edmConfigSingleFileMaxSize !== null) {
+      maxSize = edmConfigSingleFileMaxSize;
+    } else if (Array.isArray(props.fileSize) && props.fileSize[1]) {
+      maxSize = Number(props.fileSize[1]) / 1024;
+    } else if (props.fileSize) {
+      maxSize = Number(props.fileSize) / 1024;
+    } else {
+      maxSize = state.singleMaxSize / 1024;
+    }
   } else {
-    maxSize = state.isEdm ? Math.min(state.singleMaxSize) : props.fileSize / 1024;
+    if (Array.isArray(props.fileSize) && props.fileSize[1]) {
+      maxSize = Math.max(Number(props.fileSize[0]) / 1024, Number(props.fileSize[1]) / 1024);
+    } else {
+      maxSize = Number(props.fileSize) / 1024;
+    }
   }
   if (state.isEdm || Array.isArray(props.fileSize) && props.fileSize[1]) {
     if (!isNaN(Number(maxSize)) && file.size > maxSize * 1024 * 1024) {
@@ -2136,7 +2150,7 @@ const getTipMessage = ({ t, api, constants }) => ({ accept, fileSize, limit }) =
     });
   }
   if (fileSize && acceptTip.length !== 0) {
-    acceptTip += `${t(constants.COMMA)} `;
+    acceptTip += `${t(constants.COMMA)}`;
   }
   let fileSizeTip = "";
   let kibibyte = 1024;

package/form-item/index.js

@@ -15,7 +15,10 @@ const watchError = (state) => (value) => {
 const watchValidateStatus = (state) => (value) => {
   state.validateState = value;
 };
-const computedGetValidateType = ({ props, state }) => () => props.validateType || (state.formInstance ? state.formInstance.validateType : "");
+const computedGetValidateType = ({ props, state }) => () => {
+  var _a;
+  return props.validateType || (state.formInstance ? (_a = state.formInstance) == null ? void 0 : _a.validateType : "");
+};
 const computedValidateIcon = ({ props, state }) => () => {
   var _a, _b, _c, _d;
   return (_d = (_c = props.validateIcon) != null ? _c : (_b = (_a = state == null ? void 0 : state.formInstance) == null ? void 0 : _a.state) == null ? void 0 : _b.validateIcon) != null ? _d : null;
@@ -38,23 +41,25 @@ const computedIsErrorBlock = ({ props, state }) => () => {
   return (_c = (_b = (_a = state == null ? void 0 : state.formInstance) == null ? void 0 : _a.state) == null ? void 0 : _b.isErrorBlock) != null ? _c : false;
 };
 const computedLabelStyle = ({ props, state }) => () => {
+  var _a, _b;
   const result = { width: "" };
-  if (state.form.labelPosition === POSITION.Top) {
+  if (((_a = state.form) == null ? void 0 : _a.labelPosition) === POSITION.Top) {
     return result;
   }
-  const labelWidth = props.labelWidth || state.form.state.labelWidth;
+  const labelWidth = props.labelWidth || ((_b = state.form) == null ? void 0 : _b.state.labelWidth);
   if (labelWidth) {
     result.width = labelWidth;
   }
   return result;
 };
 const computedValueStyle = ({ props, state }) => () => {
+  var _a, _b;
   const result = { width: "" };
-  if (state.form.labelPosition === POSITION.Top) {
+  if (((_a = state.form) == null ? void 0 : _a.labelPosition) === POSITION.Top) {
     result.width = "100%";
     return result;
   }
-  const labelWidth = props.labelWidth || state.form.state.labelWidth;
+  const labelWidth = props.labelWidth || ((_b = state.form) == null ? void 0 : _b.state.labelWidth);
   if (labelWidth) {
     if (labelWidth === "auto") {
       result.width = labelWidth;
@@ -65,20 +70,21 @@ const computedValueStyle = ({ props, state }) => () => {
   return result;
 };
 const computedContentStyle = ({ props, state }) => () => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   const result = {};
   const label = props.label;
-  if (state.form.labelPosition === POSITION.Top || state.form.inline) {
+  if (((_a = state.form) == null ? void 0 : _a.labelPosition) === POSITION.Top || ((_b = state.form) == null ? void 0 : _b.inline)) {
     return result;
   }
   if (!label && !props.labelWidth && state.isNested) {
     return result;
   }
-  const labelWidth = props.labelWidth || state.form.state.labelWidth;
+  const labelWidth = props.labelWidth || ((_d = (_c = state.form) == null ? void 0 : _c.state) == null ? void 0 : _d.labelWidth);
   if (labelWidth === "auto") {
     if (props.labelWidth === "auto") {
       result.marginLeft = state.computedLabelWidth;
-    } else if (state.form.state.labelWidth === "auto") {
-      result.marginLeft = state.formInstance.state.autoLabelWidth;
+    } else if (((_f = (_e = state.form) == null ? void 0 : _e.state) == null ? void 0 : _f.labelWidth) === "auto") {
+      result.marginLeft = (_h = (_g = state.formInstance) == null ? void 0 : _g.state) == null ? void 0 : _h.autoLabelWidth;
     }
   } else {
     result.marginLeft = labelWidth;
@@ -143,7 +149,8 @@ const getPropByPath = (obj, path, strict) => {
   };
 };
 const computedFieldValue = ({ props, state }) => () => {
-  const model = state.form.model;
+  var _a;
+  const model = (_a = state.form) == null ? void 0 : _a.model;
   if (!model || !props.prop) {
     return;
   }
@@ -214,12 +221,13 @@ const clearValidate = (state) => () => {
   state.validateDisabled = false;
 };
 const resetField = ({ api, nextTick, props, state }) => () => {
+  var _a;
   if (state.getValidateType === "tip") {
     state.canShowTip = false;
   }
   state.validateState = "";
   state.validateMessage = "";
-  let model = state.form.model || {};
+  let model = ((_a = state.form) == null ? void 0 : _a.model) || {};
   let value = state.fieldValue;
   let path = props.prop || "";
   if (path && path.includes(":")) {
@@ -239,7 +247,8 @@ const resetField = ({ api, nextTick, props, state }) => () => {
   api.broadcast("timeSelect", "fieldReset", state.initialValue);
 };
 const getRules = ({ props, state }) => () => {
-  let formRules = state.form.rules || {};
+  var _a;
+  let formRules = ((_a = state.form) == null ? void 0 : _a.rules) || {};
   const selfRules = props.rules;
   const requiredRule = props.required !== void 0 ? { required: Boolean(props.required) } : [];
   const prop = getPropByPath(formRules, props.prop || "");
@@ -325,6 +334,7 @@ const wrapValidate = ({
   }
 };
 const handleMouseenter = ({ state }) => (e) => {
+  var _a, _b;
   if (!state.isDisplayOnly || !state.typeName || !state.form)
     return;
   const dom = e.target;
@@ -340,22 +350,24 @@ const handleMouseenter = ({ state }) => (e) => {
     overHeight = true;
   }
   if (res.o || overHeight) {
-    state.form.showTooltip(dom, state.displayedValue);
+    (_b = (_a = state.form).showTooltip) == null ? void 0 : _b.call(_a, dom, state.displayedValue);
   }
 };
 const handleLabelMouseenter = ({ props, state, slots }) => (e) => {
-  if (!state.form.overflowTitle || !state.form || slots.label)
+  var _a, _b, _c;
+  if (!((_a = state.form) == null ? void 0 : _a.overflowTitle) || !state.form || slots.label)
     return;
   const label = e.target;
   if (label && label.scrollWidth > label.offsetWidth) {
-    state.form.showTooltip(label, props.label + state.form.labelSuffix);
+    (_c = (_b = state.form).showTooltip) == null ? void 0 : _c.call(_b, label, props.label + state.form.labelSuffix);
   }
 };
 const handleMouseleave = (state) => () => {
   state.form && state.form.hideTooltip();
 };
 const getDisplayedValue = ({ state }) => (param) => {
-  if (!state.formInstance.displayOnly)
+  var _a;
+  if (!((_a = state.formInstance) == null ? void 0 : _a.displayOnly))
     return;
   state.typeName = param.type;
   state.isBasicComp = true;

package/form-item/vue.js

@@ -84,22 +84,58 @@ const initState = ({
     form: computed(() => api2.computedForm()),
     fieldValue: computed(() => api2.computedFieldValue()),
     isRequired: computed(() => api2.computedIsRequired()),
-    formInline: computed(() => state.formInstance.inline),
-    formSize: computed(() => state.formInstance.size),
+    formInline: computed(() => {
+      var _a;
+      return (_a = state.formInstance) == null ? void 0 : _a.inline;
+    }),
+    formSize: computed(() => {
+      var _a;
+      return (_a = state.formInstance) == null ? void 0 : _a.size;
+    }),
     formItemSize: computed(() => props.size || state.formSize),
-    isDisplayOnly: computed(() => state.formInstance.displayOnly),
-    labelPosition: computed(() => state.formInstance.labelPosition),
-    hideRequiredAsterisk: computed(() => state.formInstance.state.hideRequiredAsterisk),
-    labelSuffix: computed(() => state.formInstance.labelSuffix),
-    labelWidth: computed(() => state.formInstance.labelWidth),
-    showMessage: computed(() => state.formInstance.showMessage),
+    isDisplayOnly: computed(() => {
+      var _a, _b;
+      return (_b = (_a = state.formInstance) == null ? void 0 : _a.displayOnly) != null ? _b : false;
+    }),
+    labelPosition: computed(() => {
+      var _a, _b;
+      return (_b = (_a = state.formInstance) == null ? void 0 : _a.labelPosition) != null ? _b : "right";
+    }),
+    hideRequiredAsterisk: computed(() => {
+      var _a, _b, _c;
+      return (_c = (_b = (_a = state.formInstance) == null ? void 0 : _a.state) == null ? void 0 : _b.hideRequiredAsterisk) != null ? _c : false;
+    }),
+    labelSuffix: computed(() => {
+      var _a, _b;
+      return (_b = (_a = state.formInstance) == null ? void 0 : _a.labelSuffix) != null ? _b : "";
+    }),
+    labelWidth: computed(() => {
+      var _a, _b;
+      return (_b = (_a = state.formInstance) == null ? void 0 : _a.labelWidth) != null ? _b : "";
+    }),
+    showMessage: computed(() => {
+      var _a, _b;
+      return (_b = (_a = state.formInstance) == null ? void 0 : _a.showMessage) != null ? _b : true;
+    }),
     sizeClass: computed(() => state.formItemSize),
     getValidateType: computed(() => api2.computedGetValidateType()),
     validateIcon: computed(() => api2.computedValidateIcon()),
     isErrorInline: computed(() => api2.computedIsErrorInline()),
     isErrorBlock: computed(() => api2.computedIsErrorBlock()),
-    disabled: computed(() => state.formInstance.disabled),
-    tooltipType: computed(() => state.formInstance.state.tooltipType),
+    /**
+     * TODO: There is a potential issue here. Need to confirm whether to keep this logic.
+     * There does not have disabled prop in form-item, but disabled is used here, I think it is a mistake.
+     * If not, need to add disabled prop in form-item component.
+     */
+    // @ts-expect-error Need to confirm whether to keep this logic
+    disabled: computed(() => {
+      var _a;
+      return ((_a = state.formInstance) == null ? void 0 : _a.disabled) || props.disabled;
+    }),
+    tooltipType: computed(() => {
+      var _a, _b;
+      return (_b = (_a = state.formInstance) == null ? void 0 : _a.state.tooltipType) != null ? _b : "normal";
+    }),
     // 标记表单项下是否有多个子节点
     isMultiple: false
   });
@@ -145,7 +181,10 @@ const initApi = ({ api: api2, state, dispatch, broadcast, props, constants, vm,
 const initWatch = ({ watch, api: api2, props, state }) => {
   watch(() => props.error, api2.watchError, { immediate: true });
   watch(() => props.validateStatus, api2.watchValidateStatus);
-  watch(() => state.formInstance.displayOnly, api2.clearDisplayedValue);
+  watch(() => {
+    var _a;
+    return (_a = state.formInstance) == null ? void 0 : _a.displayOnly;
+  }, api2.clearDisplayedValue);
 };
 const renderless = (props, { computed, inject, onMounted, onUnmounted, provide, reactive, watch }, { vm, constants, t, nextTick, broadcast, dispatch, mode, slots }) => {
   const api2 = {};

package/grid/static/array/eachTree.js

@@ -9,6 +9,7 @@ const eachTreeItem = ({ parent, obj, iterate, context, path, node, parseChildren
     if (item && parseChildren) {
       paths.push(parseChildren);
       eachTreeItem({
+        parent: item,
         item,
         obj: item[parseChildren],
         context,

package/grid/utils/common.js

@@ -11,7 +11,7 @@ const getRowid = ($table, row) => {
   const rowId = get(row, getRowkey($table));
   return rowId ? encodeURIComponent(rowId) : "";
 };
-const getColumnList = (columns, options = {}, level = 0) => {
+const getColumnList = ($table, columns, options = {}, level = 0) => {
   const result = [];
   columns.forEach((column, index) => {
     var _a;
@@ -25,8 +25,15 @@ const getColumnList = (columns, options = {}, level = 0) => {
     if (level === 0 && !options.isGroup && hasChildren) {
       options.isGroup = true;
     }
-    options.columnCaches.push({ colid: column.id, column, index });
-    result.push.apply(result, hasChildren ? getColumnList(column.children, options, level + 1) : [column]);
+    const isLeaf = !hasChildren;
+    options.columnCaches.push({
+      colid: column.id,
+      column,
+      index,
+      isLeaf,
+      columnIndex: isLeaf ? $table.markColumnIndex++ : null
+    });
+    result.push.apply(result, hasChildren ? getColumnList($table, column.children, options, level + 1) : [column]);
   });
   return result;
 };