@element-plus/nightly 0.0.20261020 → 0.0.20261022

package/es/components/splitter/src/hooks/useSize.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useSize.mjs","names":[],"sources":["../../../../../../../packages/components/splitter/src/hooks/useSize.ts"],"sourcesContent":["import { computed, ref, watch } from 'vue'\nimport { isString } from '@element-plus/utils'\n\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PanelItemState } from '../type'\n\nexport function getPct(str: string) {\n  return Number(str.slice(0, -1)) / 100\n}\n\nexport function getPx(str: string) {\n  return Number(str.slice(0, -2))\n}\n\nexport function isPct(\n  itemSize: string | number | undefined\n): itemSize is string {\n  return isString(itemSize) && itemSize.endsWith('%')\n}\n\nexport function isPx(\n  itemSize: string | number | undefined\n): itemSize is string {\n  return isString(itemSize) && itemSize.endsWith('px')\n}\n\nexport function useSize(\n  panels: Ref<PanelItemState[]>,\n  containerSize: ComputedRef<number>\n) {\n  const propSizes = computed(() => panels.value.map((i) => i.size))\n\n  const panelCounts = computed(() => panels.value.length)\n\n  const percentSizes = ref<number[]>([])\n\n  watch([propSizes, panelCounts, containerSize], () => {\n    let ptgList: (number | undefined)[] = []\n    let emptyCount = 0\n\n    // Convert the passed props size to a percentage\n    for (let i = 0; i < panelCounts.value; i += 1) {\n      const itemSize = panels.value[i]?.size\n\n      if (isPct(itemSize)) {\n        ptgList[i] = getPct(itemSize)\n      } else if (isPx(itemSize)) {\n        ptgList[i] = getPx(itemSize) / containerSize.value\n      } else if (itemSize || itemSize === 0) {\n        const num = Number(itemSize)\n\n        if (!Number.isNaN(num)) {\n          ptgList[i] = num / containerSize.value\n        }\n      } else {\n        emptyCount += 1\n        ptgList[i] = undefined\n      }\n    }\n\n    const totalPtg = ptgList.reduce<number>((acc, ptg) => acc + (ptg || 0), 0)\n\n    if (totalPtg > 1 || !emptyCount) {\n      // If it is greater than 1, the scaling ratio\n      const scale = 1 / totalPtg\n      ptgList = ptgList.map((ptg) => (ptg === undefined ? 0 : ptg * scale))\n    } else {\n      // If it is less than 1, the filling ratio\n      const avgRest = (1 - totalPtg) / emptyCount\n      ptgList = ptgList.map((ptg) => (ptg === undefined ? avgRest : ptg))\n    }\n\n    percentSizes.value = ptgList as number[]\n  })\n\n  const ptg2px = (ptg: number) => ptg * containerSize.value\n  const pxSizes = computed(() => percentSizes.value.map(ptg2px))\n\n  return { percentSizes, pxSizes }\n}\n"],"mappings":";;;AAMA,SAAgB,OAAO,KAAa;CAClC,OAAO,OAAO,IAAI,MAAM,GAAG,EAAE,CAAC,IAAI;AACpC;AAEA,SAAgB,MAAM,KAAa;CACjC,OAAO,OAAO,IAAI,MAAM,GAAG,EAAE,CAAC;AAChC;AAEA,SAAgB,MACd,UACoB;CACpB,OAAO,SAAS,QAAQ,KAAK,SAAS,SAAS,GAAG;AACpD;AAEA,SAAgB,KACd,UACoB;CACpB,OAAO,SAAS,QAAQ,KAAK,SAAS,SAAS,IAAI;AACrD;AAEA,SAAgB,QACd,QACA,eACA;CACA,MAAM,YAAY,eAAe,OAAO,MAAM,KAAK,MAAM,EAAE,IAAI,CAAC;CAEhE,MAAM,cAAc,eAAe,OAAO,MAAM,MAAM;CAEtD,MAAM,eAAe,IAAc,CAAC,CAAC;CAErC,MAAM;EAAC;EAAW;EAAa;CAAa,SAAS;EACnD,IAAI,UAAkC,CAAC;EACvC,IAAI,aAAa;EAGjB,KAAK,IAAI,IAAI,GAAG,IAAI,YAAY,OAAO,KAAK,GAAG;GAC7C,MAAM,WAAW,OAAO,MAAM,EAAE,EAAE;GAElC,IAAI,MAAM,QAAQ,GAChB,QAAQ,KAAK,OAAO,QAAQ;QACvB,IAAI,KAAK,QAAQ,GACtB,QAAQ,KAAK,MAAM,QAAQ,IAAI,cAAc;QACxC,IAAI,YAAY,aAAa,GAAG;IACrC,MAAM,MAAM,OAAO,QAAQ;IAE3B,IAAI,CAAC,OAAO,MAAM,GAAG,GACnB,QAAQ,KAAK,MAAM,cAAc;GAErC,OAAO;IACL,cAAc;IACd,QAAQ,KAAK,KAAA;GACf;EACF;EAEA,MAAM,WAAW,QAAQ,QAAgB,KAAK,QAAQ,OAAO,OAAO,IAAI,CAAC;EAEzE,IAAI,WAAW,KAAK,CAAC,YAAY;GAE/B,MAAM,QAAQ,IAAI;GAClB,UAAU,QAAQ,KAAK,QAAS,QAAQ,KAAA,IAAY,IAAI,MAAM,KAAM;EACtE,OAAO;GAEL,MAAM,WAAW,IAAI,YAAY;GACjC,UAAU,QAAQ,KAAK,QAAS,QAAQ,KAAA,IAAY,UAAU,GAAI;EACpE;EAEA,aAAa,QAAQ;CACvB,CAAC;CAED,MAAM,UAAU,QAAgB,MAAM,cAAc;CAGpD,OAAO;EAAE;EAAc,SAFP,eAAe,aAAa,MAAM,IAAI,MAAM,CAE/B;CAAE;AACjC"}
+{"version":3,"file":"useSize.mjs","names":[],"sources":["../../../../../../../packages/components/splitter/src/hooks/useSize.ts"],"sourcesContent":["import { computed, ref, watch } from 'vue'\nimport { isPercent, isPx, parsePx, percentToRatio } from '@element-plus/utils'\n\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PanelItemState } from '../type'\n\nexport function useSize(\n  panels: Ref<PanelItemState[]>,\n  containerSize: ComputedRef<number>\n) {\n  const propSizes = computed(() => panels.value.map((i) => i.size))\n\n  const panelCounts = computed(() => panels.value.length)\n\n  const percentSizes = ref<number[]>([])\n\n  watch([propSizes, panelCounts, containerSize], () => {\n    let ptgList: (number | undefined)[] = []\n    let emptyCount = 0\n\n    // Convert the passed props size to a percentage\n    for (let i = 0; i < panelCounts.value; i += 1) {\n      const itemSize = panels.value[i]?.size\n\n      if (isPercent(itemSize)) {\n        ptgList[i] = percentToRatio(itemSize)\n      } else if (isPx(itemSize)) {\n        ptgList[i] = parsePx(itemSize) / containerSize.value\n      } else if (itemSize || itemSize === 0) {\n        const num = Number(itemSize)\n\n        if (!Number.isNaN(num)) {\n          ptgList[i] = num / containerSize.value\n        }\n      } else {\n        emptyCount += 1\n        ptgList[i] = undefined\n      }\n    }\n\n    const totalPtg = ptgList.reduce<number>((acc, ptg) => acc + (ptg || 0), 0)\n\n    if (totalPtg > 1 || !emptyCount) {\n      // If it is greater than 1, the scaling ratio\n      const scale = 1 / totalPtg\n      ptgList = ptgList.map((ptg) => (ptg === undefined ? 0 : ptg * scale))\n    } else {\n      // If it is less than 1, the filling ratio\n      const avgRest = (1 - totalPtg) / emptyCount\n      ptgList = ptgList.map((ptg) => (ptg === undefined ? avgRest : ptg))\n    }\n\n    percentSizes.value = ptgList as number[]\n  })\n\n  const ptg2px = (ptg: number) => ptg * containerSize.value\n  const pxSizes = computed(() => percentSizes.value.map(ptg2px))\n\n  return { percentSizes, pxSizes }\n}\n"],"mappings":";;;AAMA,SAAgB,QACd,QACA,eACA;CACA,MAAM,YAAY,eAAe,OAAO,MAAM,KAAK,MAAM,EAAE,IAAI,CAAC;CAEhE,MAAM,cAAc,eAAe,OAAO,MAAM,MAAM;CAEtD,MAAM,eAAe,IAAc,CAAC,CAAC;CAErC,MAAM;EAAC;EAAW;EAAa;CAAa,SAAS;EACnD,IAAI,UAAkC,CAAC;EACvC,IAAI,aAAa;EAGjB,KAAK,IAAI,IAAI,GAAG,IAAI,YAAY,OAAO,KAAK,GAAG;GAC7C,MAAM,WAAW,OAAO,MAAM,EAAE,EAAE;GAElC,IAAI,UAAU,QAAQ,GACpB,QAAQ,KAAK,eAAe,QAAQ;QAC/B,IAAI,KAAK,QAAQ,GACtB,QAAQ,KAAK,QAAQ,QAAQ,IAAI,cAAc;QAC1C,IAAI,YAAY,aAAa,GAAG;IACrC,MAAM,MAAM,OAAO,QAAQ;IAE3B,IAAI,CAAC,OAAO,MAAM,GAAG,GACnB,QAAQ,KAAK,MAAM,cAAc;GAErC,OAAO;IACL,cAAc;IACd,QAAQ,KAAK,KAAA;GACf;EACF;EAEA,MAAM,WAAW,QAAQ,QAAgB,KAAK,QAAQ,OAAO,OAAO,IAAI,CAAC;EAEzE,IAAI,WAAW,KAAK,CAAC,YAAY;GAE/B,MAAM,QAAQ,IAAI;GAClB,UAAU,QAAQ,KAAK,QAAS,QAAQ,KAAA,IAAY,IAAI,MAAM,KAAM;EACtE,OAAO;GAEL,MAAM,WAAW,IAAI,YAAY;GACjC,UAAU,QAAQ,KAAK,QAAS,QAAQ,KAAA,IAAY,UAAU,GAAI;EACpE;EAEA,aAAa,QAAQ;CACvB,CAAC;CAED,MAAM,UAAU,QAAgB,MAAM,cAAc;CAGpD,OAAO;EAAE;EAAc,SAFP,eAAe,aAAa,MAAM,IAAI,MAAM,CAE/B;CAAE;AACjC"}

package/es/components/splitter/src/split-panel.vue_vue_type_script_setup_true_lang.mjs

@@ -1,6 +1,6 @@
 import { throwError } from "../../../utils/error.mjs";
+import { isPercent, isPx, parsePx, percentToRatio } from "../../../utils/dom/style.mjs";
 import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
-import { getPct, getPx, isPct, isPx } from "./hooks/useSize.mjs";
 import { splitterRootContextKey } from "./type.mjs";
 import { splitterPanelEmits, splitterPanelProps } from "./split-panel.mjs";
 import { getCollapsible, isCollapsible } from "./hooks/usePanel.mjs";
@@ -52,8 +52,8 @@ var split_panel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 		const startCollapsible = computed(() => isCollapsible(panel.value, panelSize.value, nextPanel.value, nextSize.value));
 		const endCollapsible = computed(() => isCollapsible(nextPanel.value, nextSize.value, panel.value, panelSize.value));
 		function sizeToPx(str) {
-			if (isPct(str)) return getPct(str) * containerSize.value || 0;
-			else if (isPx(str)) return getPx(str);
+			if (isPercent(str)) return percentToRatio(str) * containerSize.value || 0;
+			else if (isPx(str)) return parsePx(str);
 			return str ?? 0;
 		}
 		let isSizeUpdating = false;

package/es/components/splitter/src/split-panel.vue_vue_type_script_setup_true_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"split-panel.vue_vue_type_script_setup_true_lang.mjs","names":["$attrs","_openBlock","_createElementBlock","_Fragment","_createElementVNode","_mergeProps","_unref","_renderSlot","_createBlock","SplitBar","_withCtx","_createCommentVNode"],"sources":["../../../../../../packages/components/splitter/src/split-panel.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n  computed,\n  getCurrentInstance,\n  inject,\n  nextTick,\n  onBeforeUnmount,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { throwError } from '@element-plus/utils'\nimport { getCollapsible, isCollapsible } from './hooks/usePanel'\nimport SplitBar from './split-bar.vue'\nimport { splitterPanelEmits } from './split-panel'\nimport { getPct, getPx, isPct, isPx } from './hooks'\nimport { splitterRootContextKey } from './type'\n\nimport type { SplitterPanelProps } from './split-panel'\n\nconst ns = useNamespace('splitter-panel')\n\nconst COMPONENT_NAME = 'ElSplitterPanel'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = withDefaults(defineProps<SplitterPanelProps>(), {\n  resizable: true,\n})\n\nconst emits = defineEmits(splitterPanelEmits)\nconst splitterContext = inject(splitterRootContextKey)\nif (!splitterContext)\n  throwError(\n    COMPONENT_NAME,\n    'usage: <el-splitter><el-splitter-panel /></el-splitter/>'\n  )\n\nconst { panels, layout, lazy, containerSize, pxSizes } = toRefs(splitterContext)\n\nconst {\n  registerPanel,\n  unregisterPanel,\n  onCollapse,\n  onMoveEnd,\n  onMoveStart,\n  onMoving,\n} = splitterContext\n\nconst panelEl = ref<HTMLDivElement>()\nconst instance = getCurrentInstance()!\nconst uid = instance.uid\n\nconst index = ref(0)\nconst panel = computed(() => panels.value[index.value])\n\nconst setIndex = (val: number) => {\n  index.value = val\n}\n\nconst panelSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value] ?? 0\n})\n\nconst nextSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value + 1] ?? 0\n})\n\nconst nextPanel = computed(() => {\n  if (panel.value) {\n    return panels.value[index.value + 1]\n  }\n  return null\n})\n\nconst isResizable = computed(() => {\n  if (!nextPanel.value) return false\n  return (\n    props.resizable &&\n    nextPanel.value?.resizable &&\n    // If it is 0, it means it is collapsed => check if the minimum value is set\n    (panelSize.value !== 0 || !props.min) &&\n    (nextSize.value !== 0 || !nextPanel.value.min)\n  )\n})\n\n// The last panel doesn't need a drag bar\nconst isShowBar = computed(() => {\n  if (!panel.value) return false\n  return index.value !== panels.value.length - 1\n})\n\nconst startCollapsible = computed(() =>\n  isCollapsible(panel.value, panelSize.value, nextPanel.value, nextSize.value)\n)\n\nconst endCollapsible = computed(() =>\n  isCollapsible(nextPanel.value, nextSize.value, panel.value, panelSize.value)\n)\n\nfunction sizeToPx(str: string | number | undefined) {\n  if (isPct(str)) {\n    return getPct(str) * containerSize.value || 0\n  } else if (isPx(str)) {\n    return getPx(str)\n  }\n  return str ?? 0\n}\n\n// Two-way binding for size\nlet isSizeUpdating = false\nwatch(\n  () => props.size,\n  () => {\n    if (!isSizeUpdating && panel.value) {\n      if (!containerSize.value) {\n        panel.value.size = props.size\n        return\n      }\n\n      const size = sizeToPx(props.size)\n      const maxSize = sizeToPx(props.max)\n      const minSize = sizeToPx(props.min)\n\n      // Ensure it is within the maximum and minimum value range\n      const finalSize = Math.min(Math.max(size, minSize || 0), maxSize || size)\n\n      if (finalSize !== size) {\n        emits('update:size', finalSize)\n      }\n\n      panel.value.size = finalSize\n    }\n  }\n)\n\nwatch(\n  () => panel.value?.size,\n  (val) => {\n    if (val !== props.size) {\n      isSizeUpdating = true\n      emits('update:size', val as number)\n      nextTick(() => (isSizeUpdating = false))\n    }\n  }\n)\n\nwatch(\n  () => props.resizable,\n  (val) => {\n    if (panel.value) {\n      panel.value.resizable = val\n    }\n  }\n)\n\nconst _panel = reactive({\n  uid,\n  getVnode: () => instance.vnode,\n  setIndex,\n  ...props,\n  collapsible: computed(() => getCollapsible(props.collapsible)),\n})\n\nregisterPanel(_panel)\n\nonBeforeUnmount(() => unregisterPanel(_panel))\n\ndefineExpose({\n  /** @description splitter-panel html element */\n  splitterPanelRef: panelEl,\n})\n</script>\n\n<template>\n  <div\n    ref=\"panelEl\"\n    :class=\"[ns.b()]\"\n    :style=\"{ flexBasis: `${panelSize}px` }\"\n    v-bind=\"$attrs\"\n  >\n    <slot />\n  </div>\n  <SplitBar\n    v-if=\"isShowBar\"\n    :index=\"index\"\n    :layout=\"layout\"\n    :lazy=\"lazy\"\n    :resizable=\"isResizable\"\n    :start-collapsible=\"startCollapsible\"\n    :end-collapsible=\"endCollapsible\"\n    @move-start=\"onMoveStart\"\n    @moving=\"onMoving\"\n    @move-end=\"onMoveEnd\"\n    @collapse=\"onCollapse\"\n  >\n    <template #start-collapsible>\n      <slot name=\"start-collapsible\" />\n    </template>\n    <template #end-collapsible>\n      <slot name=\"end-collapsible\" />\n    </template>\n  </SplitBar>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"split-panel.vue_vue_type_script_setup_true_lang.mjs","names":["$attrs","_openBlock","_createElementBlock","_Fragment","_createElementVNode","_mergeProps","_unref","_renderSlot","_createBlock","SplitBar","_withCtx","_createCommentVNode"],"sources":["../../../../../../packages/components/splitter/src/split-panel.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n  computed,\n  getCurrentInstance,\n  inject,\n  nextTick,\n  onBeforeUnmount,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport {\n  isPercent,\n  isPx,\n  parsePx,\n  percentToRatio,\n  throwError,\n} from '@element-plus/utils'\nimport { getCollapsible, isCollapsible } from './hooks/usePanel'\nimport SplitBar from './split-bar.vue'\nimport { splitterPanelEmits } from './split-panel'\nimport { splitterRootContextKey } from './type'\n\nimport type { SplitterPanelProps } from './split-panel'\n\nconst ns = useNamespace('splitter-panel')\n\nconst COMPONENT_NAME = 'ElSplitterPanel'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = withDefaults(defineProps<SplitterPanelProps>(), {\n  resizable: true,\n})\n\nconst emits = defineEmits(splitterPanelEmits)\nconst splitterContext = inject(splitterRootContextKey)\nif (!splitterContext)\n  throwError(\n    COMPONENT_NAME,\n    'usage: <el-splitter><el-splitter-panel /></el-splitter/>'\n  )\n\nconst { panels, layout, lazy, containerSize, pxSizes } = toRefs(splitterContext)\n\nconst {\n  registerPanel,\n  unregisterPanel,\n  onCollapse,\n  onMoveEnd,\n  onMoveStart,\n  onMoving,\n} = splitterContext\n\nconst panelEl = ref<HTMLDivElement>()\nconst instance = getCurrentInstance()!\nconst uid = instance.uid\n\nconst index = ref(0)\nconst panel = computed(() => panels.value[index.value])\n\nconst setIndex = (val: number) => {\n  index.value = val\n}\n\nconst panelSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value] ?? 0\n})\n\nconst nextSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value + 1] ?? 0\n})\n\nconst nextPanel = computed(() => {\n  if (panel.value) {\n    return panels.value[index.value + 1]\n  }\n  return null\n})\n\nconst isResizable = computed(() => {\n  if (!nextPanel.value) return false\n  return (\n    props.resizable &&\n    nextPanel.value?.resizable &&\n    // If it is 0, it means it is collapsed => check if the minimum value is set\n    (panelSize.value !== 0 || !props.min) &&\n    (nextSize.value !== 0 || !nextPanel.value.min)\n  )\n})\n\n// The last panel doesn't need a drag bar\nconst isShowBar = computed(() => {\n  if (!panel.value) return false\n  return index.value !== panels.value.length - 1\n})\n\nconst startCollapsible = computed(() =>\n  isCollapsible(panel.value, panelSize.value, nextPanel.value, nextSize.value)\n)\n\nconst endCollapsible = computed(() =>\n  isCollapsible(nextPanel.value, nextSize.value, panel.value, panelSize.value)\n)\n\nfunction sizeToPx(str: string | number | undefined) {\n  if (isPercent(str)) {\n    return percentToRatio(str) * containerSize.value || 0\n  } else if (isPx(str)) {\n    return parsePx(str)\n  }\n  return str ?? 0\n}\n\n// Two-way binding for size\nlet isSizeUpdating = false\nwatch(\n  () => props.size,\n  () => {\n    if (!isSizeUpdating && panel.value) {\n      if (!containerSize.value) {\n        panel.value.size = props.size\n        return\n      }\n\n      const size = sizeToPx(props.size)\n      const maxSize = sizeToPx(props.max)\n      const minSize = sizeToPx(props.min)\n\n      // Ensure it is within the maximum and minimum value range\n      const finalSize = Math.min(Math.max(size, minSize || 0), maxSize || size)\n\n      if (finalSize !== size) {\n        emits('update:size', finalSize)\n      }\n\n      panel.value.size = finalSize\n    }\n  }\n)\n\nwatch(\n  () => panel.value?.size,\n  (val) => {\n    if (val !== props.size) {\n      isSizeUpdating = true\n      emits('update:size', val as number)\n      nextTick(() => (isSizeUpdating = false))\n    }\n  }\n)\n\nwatch(\n  () => props.resizable,\n  (val) => {\n    if (panel.value) {\n      panel.value.resizable = val\n    }\n  }\n)\n\nconst _panel = reactive({\n  uid,\n  getVnode: () => instance.vnode,\n  setIndex,\n  ...props,\n  collapsible: computed(() => getCollapsible(props.collapsible)),\n})\n\nregisterPanel(_panel)\n\nonBeforeUnmount(() => unregisterPanel(_panel))\n\ndefineExpose({\n  /** @description splitter-panel html element */\n  splitterPanelRef: panelEl,\n})\n</script>\n\n<template>\n  <div\n    ref=\"panelEl\"\n    :class=\"[ns.b()]\"\n    :style=\"{ flexBasis: `${panelSize}px` }\"\n    v-bind=\"$attrs\"\n  >\n    <slot />\n  </div>\n  <SplitBar\n    v-if=\"isShowBar\"\n    :index=\"index\"\n    :layout=\"layout\"\n    :lazy=\"lazy\"\n    :resizable=\"isResizable\"\n    :start-collapsible=\"startCollapsible\"\n    :end-collapsible=\"endCollapsible\"\n    @move-start=\"onMoveStart\"\n    @moving=\"onMoving\"\n    @move-end=\"onMoveEnd\"\n    @collapse=\"onCollapse\"\n  >\n    <template #start-collapsible>\n      <slot name=\"start-collapsible\" />\n    </template>\n    <template #end-collapsible>\n      <slot name=\"end-collapsible\" />\n    </template>\n  </SplitBar>\n</template>\n"],"mappings":";;;;;;;;;AA6BA,MAAM,iBAAiB;;;;;;;EAFvB,MAAM,KAAK,aAAa,gBAAgB;EAOxC,MAAM,QAAQ;EAId,MAAM,QAAQ;EACd,MAAM,kBAAkB,OAAO,sBAAsB;EACrD,IAAI,CAAC,iBACH,WACE,gBACA,0DACF;EAEF,MAAM,EAAE,QAAQ,QAAQ,MAAM,eAAe,YAAY,OAAO,eAAe;EAE/E,MAAM,EACJ,eACA,iBACA,YACA,WACA,aACA,aACE;EAEJ,MAAM,UAAU,IAAoB;EACpC,MAAM,WAAW,mBAAmB;EACpC,MAAM,MAAM,SAAS;EAErB,MAAM,QAAQ,IAAI,CAAC;EACnB,MAAM,QAAQ,eAAe,OAAO,MAAM,MAAM,MAAM;EAEtD,MAAM,YAAY,QAAgB;GAChC,MAAM,QAAQ;EAChB;EAEA,MAAM,YAAY,eAAe;GAC/B,IAAI,CAAC,MAAM,OAAO,OAAO;GACzB,OAAO,QAAQ,MAAM,MAAM,UAAU;EACvC,CAAC;EAED,MAAM,WAAW,eAAe;GAC9B,IAAI,CAAC,MAAM,OAAO,OAAO;GACzB,OAAO,QAAQ,MAAM,MAAM,QAAQ,MAAM;EAC3C,CAAC;EAED,MAAM,YAAY,eAAe;GAC/B,IAAI,MAAM,OACR,OAAO,OAAO,MAAM,MAAM,QAAQ;GAEpC,OAAO;EACT,CAAC;EAED,MAAM,cAAc,eAAe;GACjC,IAAI,CAAC,UAAU,OAAO,OAAO;GAC7B,OACE,MAAM,aACN,UAAU,OAAO,cAEhB,UAAU,UAAU,KAAK,CAAC,MAAM,SAChC,SAAS,UAAU,KAAK,CAAC,UAAU,MAAM;EAE9C,CAAC;EAGD,MAAM,YAAY,eAAe;GAC/B,IAAI,CAAC,MAAM,OAAO,OAAO;GACzB,OAAO,MAAM,UAAU,OAAO,MAAM,SAAS;EAC/C,CAAC;EAED,MAAM,mBAAmB,eACvB,cAAc,MAAM,OAAO,UAAU,OAAO,UAAU,OAAO,SAAS,KAAK,CAC7E;EAEA,MAAM,iBAAiB,eACrB,cAAc,UAAU,OAAO,SAAS,OAAO,MAAM,OAAO,UAAU,KAAK,CAC7E;EAEA,SAAS,SAAS,KAAkC;GAClD,IAAI,UAAU,GAAG,GACf,OAAO,eAAe,GAAG,IAAI,cAAc,SAAS;QAC/C,IAAI,KAAK,GAAG,GACjB,OAAO,QAAQ,GAAG;GAEpB,OAAO,OAAO;EAChB;EAGA,IAAI,iBAAiB;EACrB,YACQ,MAAM,YACN;GACJ,IAAI,CAAC,kBAAkB,MAAM,OAAO;IAClC,IAAI,CAAC,cAAc,OAAO;KACxB,MAAM,MAAM,OAAO,MAAM;KACzB;IACF;IAEA,MAAM,OAAO,SAAS,MAAM,IAAI;IAChC,MAAM,UAAU,SAAS,MAAM,GAAG;IAClC,MAAM,UAAU,SAAS,MAAM,GAAG;IAGlC,MAAM,YAAY,KAAK,IAAI,KAAK,IAAI,MAAM,WAAW,CAAC,GAAG,WAAW,IAAI;IAExE,IAAI,cAAc,MAChB,MAAM,eAAe,SAAS;IAGhC,MAAM,MAAM,OAAO;GACrB;EACF,CACF;EAEA,YACQ,MAAM,OAAO,OAClB,QAAQ;GACP,IAAI,QAAQ,MAAM,MAAM;IACtB,iBAAiB;IACjB,MAAM,eAAe,GAAa;IAClC,eAAgB,iBAAiB,KAAM;GACzC;EACF,CACF;EAEA,YACQ,MAAM,YACX,QAAQ;GACP,IAAI,MAAM,OACR,MAAM,MAAM,YAAY;EAE5B,CACF;EAEA,MAAM,SAAS,SAAS;GACtB;GACA,gBAAgB,SAAS;GACzB;GACA,GAAG;GACH,aAAa,eAAe,eAAe,MAAM,WAAW,CAAC;EAC/D,CAAC;EAED,cAAc,MAAM;EAEpB,sBAAsB,gBAAgB,MAAM,CAAC;EAE7C,SAAa;;AAEX,kBAAkB,QACpB,CAAC;;G,wDAICI,mBAOM,OAPNC,WAOM;IANA,SAAA;IAAJ,KAAI;IACH,OAAK,CAAGC,MAAA,EAAA,CAAE,CAAC,EAAC,CAAA;IACZ,OAAK,EAAA,WAAA,GAAkB,UAAA,MAAS,IAAA;GACzBN,GAAAA,KAAAA,MAAM,GAAA,CAEdO,WAAQ,KAAA,QAAA,SAAA,C,QAGF,UAAA,SADRN,UAAA,GAAAO,YAmBWC,mBAAA;;IAjBR,OAAO,MAAA;IACP,QAAQH,MAAA,MAAA;IACR,MAAMA,MAAA,IAAA;IACN,WAAW,YAAA;IACX,qBAAmB,iBAAA;IACnB,mBAAiB,eAAA;IACjB,aAAYA,MAAA,WAAA;IACZ,UAAQA,MAAA,QAAA;IACR,WAAUA,MAAA,SAAA;IACV,YAAUA,MAAA,UAAA;;IAEA,qBAAiBI,cACO,CAAjCH,WAAiC,KAAA,QAAA,mBAAA,C;IAExB,mBAAeG,cACO,CAA/BH,WAA+B,KAAA,QAAA,iBAAA,C"}

package/es/components/splitter/src/split-panel2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"split-panel2.mjs","names":["_sfc_main"],"sources":["../../../../../../packages/components/splitter/src/split-panel.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n  computed,\n  getCurrentInstance,\n  inject,\n  nextTick,\n  onBeforeUnmount,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { throwError } from '@element-plus/utils'\nimport { getCollapsible, isCollapsible } from './hooks/usePanel'\nimport SplitBar from './split-bar.vue'\nimport { splitterPanelEmits } from './split-panel'\nimport { getPct, getPx, isPct, isPx } from './hooks'\nimport { splitterRootContextKey } from './type'\n\nimport type { SplitterPanelProps } from './split-panel'\n\nconst ns = useNamespace('splitter-panel')\n\nconst COMPONENT_NAME = 'ElSplitterPanel'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = withDefaults(defineProps<SplitterPanelProps>(), {\n  resizable: true,\n})\n\nconst emits = defineEmits(splitterPanelEmits)\nconst splitterContext = inject(splitterRootContextKey)\nif (!splitterContext)\n  throwError(\n    COMPONENT_NAME,\n    'usage: <el-splitter><el-splitter-panel /></el-splitter/>'\n  )\n\nconst { panels, layout, lazy, containerSize, pxSizes } = toRefs(splitterContext)\n\nconst {\n  registerPanel,\n  unregisterPanel,\n  onCollapse,\n  onMoveEnd,\n  onMoveStart,\n  onMoving,\n} = splitterContext\n\nconst panelEl = ref<HTMLDivElement>()\nconst instance = getCurrentInstance()!\nconst uid = instance.uid\n\nconst index = ref(0)\nconst panel = computed(() => panels.value[index.value])\n\nconst setIndex = (val: number) => {\n  index.value = val\n}\n\nconst panelSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value] ?? 0\n})\n\nconst nextSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value + 1] ?? 0\n})\n\nconst nextPanel = computed(() => {\n  if (panel.value) {\n    return panels.value[index.value + 1]\n  }\n  return null\n})\n\nconst isResizable = computed(() => {\n  if (!nextPanel.value) return false\n  return (\n    props.resizable &&\n    nextPanel.value?.resizable &&\n    // If it is 0, it means it is collapsed => check if the minimum value is set\n    (panelSize.value !== 0 || !props.min) &&\n    (nextSize.value !== 0 || !nextPanel.value.min)\n  )\n})\n\n// The last panel doesn't need a drag bar\nconst isShowBar = computed(() => {\n  if (!panel.value) return false\n  return index.value !== panels.value.length - 1\n})\n\nconst startCollapsible = computed(() =>\n  isCollapsible(panel.value, panelSize.value, nextPanel.value, nextSize.value)\n)\n\nconst endCollapsible = computed(() =>\n  isCollapsible(nextPanel.value, nextSize.value, panel.value, panelSize.value)\n)\n\nfunction sizeToPx(str: string | number | undefined) {\n  if (isPct(str)) {\n    return getPct(str) * containerSize.value || 0\n  } else if (isPx(str)) {\n    return getPx(str)\n  }\n  return str ?? 0\n}\n\n// Two-way binding for size\nlet isSizeUpdating = false\nwatch(\n  () => props.size,\n  () => {\n    if (!isSizeUpdating && panel.value) {\n      if (!containerSize.value) {\n        panel.value.size = props.size\n        return\n      }\n\n      const size = sizeToPx(props.size)\n      const maxSize = sizeToPx(props.max)\n      const minSize = sizeToPx(props.min)\n\n      // Ensure it is within the maximum and minimum value range\n      const finalSize = Math.min(Math.max(size, minSize || 0), maxSize || size)\n\n      if (finalSize !== size) {\n        emits('update:size', finalSize)\n      }\n\n      panel.value.size = finalSize\n    }\n  }\n)\n\nwatch(\n  () => panel.value?.size,\n  (val) => {\n    if (val !== props.size) {\n      isSizeUpdating = true\n      emits('update:size', val as number)\n      nextTick(() => (isSizeUpdating = false))\n    }\n  }\n)\n\nwatch(\n  () => props.resizable,\n  (val) => {\n    if (panel.value) {\n      panel.value.resizable = val\n    }\n  }\n)\n\nconst _panel = reactive({\n  uid,\n  getVnode: () => instance.vnode,\n  setIndex,\n  ...props,\n  collapsible: computed(() => getCollapsible(props.collapsible)),\n})\n\nregisterPanel(_panel)\n\nonBeforeUnmount(() => unregisterPanel(_panel))\n\ndefineExpose({\n  /** @description splitter-panel html element */\n  splitterPanelRef: panelEl,\n})\n</script>\n\n<template>\n  <div\n    ref=\"panelEl\"\n    :class=\"[ns.b()]\"\n    :style=\"{ flexBasis: `${panelSize}px` }\"\n    v-bind=\"$attrs\"\n  >\n    <slot />\n  </div>\n  <SplitBar\n    v-if=\"isShowBar\"\n    :index=\"index\"\n    :layout=\"layout\"\n    :lazy=\"lazy\"\n    :resizable=\"isResizable\"\n    :start-collapsible=\"startCollapsible\"\n    :end-collapsible=\"endCollapsible\"\n    @move-start=\"onMoveStart\"\n    @moving=\"onMoving\"\n    @move-end=\"onMoveEnd\"\n    @collapse=\"onCollapse\"\n  >\n    <template #start-collapsible>\n      <slot name=\"start-collapsible\" />\n    </template>\n    <template #end-collapsible>\n      <slot name=\"end-collapsible\" />\n    </template>\n  </SplitBar>\n</template>\n"],"mappings":""}
+{"version":3,"file":"split-panel2.mjs","names":["_sfc_main"],"sources":["../../../../../../packages/components/splitter/src/split-panel.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n  computed,\n  getCurrentInstance,\n  inject,\n  nextTick,\n  onBeforeUnmount,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport {\n  isPercent,\n  isPx,\n  parsePx,\n  percentToRatio,\n  throwError,\n} from '@element-plus/utils'\nimport { getCollapsible, isCollapsible } from './hooks/usePanel'\nimport SplitBar from './split-bar.vue'\nimport { splitterPanelEmits } from './split-panel'\nimport { splitterRootContextKey } from './type'\n\nimport type { SplitterPanelProps } from './split-panel'\n\nconst ns = useNamespace('splitter-panel')\n\nconst COMPONENT_NAME = 'ElSplitterPanel'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = withDefaults(defineProps<SplitterPanelProps>(), {\n  resizable: true,\n})\n\nconst emits = defineEmits(splitterPanelEmits)\nconst splitterContext = inject(splitterRootContextKey)\nif (!splitterContext)\n  throwError(\n    COMPONENT_NAME,\n    'usage: <el-splitter><el-splitter-panel /></el-splitter/>'\n  )\n\nconst { panels, layout, lazy, containerSize, pxSizes } = toRefs(splitterContext)\n\nconst {\n  registerPanel,\n  unregisterPanel,\n  onCollapse,\n  onMoveEnd,\n  onMoveStart,\n  onMoving,\n} = splitterContext\n\nconst panelEl = ref<HTMLDivElement>()\nconst instance = getCurrentInstance()!\nconst uid = instance.uid\n\nconst index = ref(0)\nconst panel = computed(() => panels.value[index.value])\n\nconst setIndex = (val: number) => {\n  index.value = val\n}\n\nconst panelSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value] ?? 0\n})\n\nconst nextSize = computed(() => {\n  if (!panel.value) return 0\n  return pxSizes.value[index.value + 1] ?? 0\n})\n\nconst nextPanel = computed(() => {\n  if (panel.value) {\n    return panels.value[index.value + 1]\n  }\n  return null\n})\n\nconst isResizable = computed(() => {\n  if (!nextPanel.value) return false\n  return (\n    props.resizable &&\n    nextPanel.value?.resizable &&\n    // If it is 0, it means it is collapsed => check if the minimum value is set\n    (panelSize.value !== 0 || !props.min) &&\n    (nextSize.value !== 0 || !nextPanel.value.min)\n  )\n})\n\n// The last panel doesn't need a drag bar\nconst isShowBar = computed(() => {\n  if (!panel.value) return false\n  return index.value !== panels.value.length - 1\n})\n\nconst startCollapsible = computed(() =>\n  isCollapsible(panel.value, panelSize.value, nextPanel.value, nextSize.value)\n)\n\nconst endCollapsible = computed(() =>\n  isCollapsible(nextPanel.value, nextSize.value, panel.value, panelSize.value)\n)\n\nfunction sizeToPx(str: string | number | undefined) {\n  if (isPercent(str)) {\n    return percentToRatio(str) * containerSize.value || 0\n  } else if (isPx(str)) {\n    return parsePx(str)\n  }\n  return str ?? 0\n}\n\n// Two-way binding for size\nlet isSizeUpdating = false\nwatch(\n  () => props.size,\n  () => {\n    if (!isSizeUpdating && panel.value) {\n      if (!containerSize.value) {\n        panel.value.size = props.size\n        return\n      }\n\n      const size = sizeToPx(props.size)\n      const maxSize = sizeToPx(props.max)\n      const minSize = sizeToPx(props.min)\n\n      // Ensure it is within the maximum and minimum value range\n      const finalSize = Math.min(Math.max(size, minSize || 0), maxSize || size)\n\n      if (finalSize !== size) {\n        emits('update:size', finalSize)\n      }\n\n      panel.value.size = finalSize\n    }\n  }\n)\n\nwatch(\n  () => panel.value?.size,\n  (val) => {\n    if (val !== props.size) {\n      isSizeUpdating = true\n      emits('update:size', val as number)\n      nextTick(() => (isSizeUpdating = false))\n    }\n  }\n)\n\nwatch(\n  () => props.resizable,\n  (val) => {\n    if (panel.value) {\n      panel.value.resizable = val\n    }\n  }\n)\n\nconst _panel = reactive({\n  uid,\n  getVnode: () => instance.vnode,\n  setIndex,\n  ...props,\n  collapsible: computed(() => getCollapsible(props.collapsible)),\n})\n\nregisterPanel(_panel)\n\nonBeforeUnmount(() => unregisterPanel(_panel))\n\ndefineExpose({\n  /** @description splitter-panel html element */\n  splitterPanelRef: panelEl,\n})\n</script>\n\n<template>\n  <div\n    ref=\"panelEl\"\n    :class=\"[ns.b()]\"\n    :style=\"{ flexBasis: `${panelSize}px` }\"\n    v-bind=\"$attrs\"\n  >\n    <slot />\n  </div>\n  <SplitBar\n    v-if=\"isShowBar\"\n    :index=\"index\"\n    :layout=\"layout\"\n    :lazy=\"lazy\"\n    :resizable=\"isResizable\"\n    :start-collapsible=\"startCollapsible\"\n    :end-collapsible=\"endCollapsible\"\n    @move-start=\"onMoveStart\"\n    @moving=\"onMoving\"\n    @move-end=\"onMoveEnd\"\n    @collapse=\"onCollapse\"\n  >\n    <template #start-collapsible>\n      <slot name=\"start-collapsible\" />\n    </template>\n    <template #end-collapsible>\n      <slot name=\"end-collapsible\" />\n    </template>\n  </SplitBar>\n</template>\n"],"mappings":""}

package/es/components/splitter/src/splitter.vue_vue_type_script_setup_true_lang.mjs

@@ -1,9 +1,9 @@
 import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
 import { useOrderedChildren } from "../../../hooks/use-ordered-children/index.mjs";
+import { splitterEmits, splitterProps } from "./splitter.mjs";
 import { useContainer } from "./hooks/useContainer.mjs";
-import { useSize } from "./hooks/useSize.mjs";
 import { useResize } from "./hooks/useResize.mjs";
-import { splitterEmits, splitterProps } from "./splitter.mjs";
+import { useSize } from "./hooks/useSize.mjs";
 import { splitterRootContextKey } from "./type.mjs";
 import { computed, createCommentVNode, createElementBlock, createVNode, defineComponent, getCurrentInstance, nextTick, normalizeClass, normalizeStyle, openBlock, provide, reactive, renderSlot, toRef, unref, watch } from "vue";
 //#region ../../packages/components/splitter/src/splitter.vue?vue&type=script&setup=true&lang.ts

package/es/components/steps/src/item.d.ts

@@ -37,7 +37,7 @@ declare const stepProps: {
     __epPropKey: true;
   };
   readonly description: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-  readonly status: EpPropFinalized<StringConstructor, "" | "error" | "wait" | "finish" | "success" | "process", unknown, "", boolean>;
+  readonly status: EpPropFinalized<StringConstructor, "" | "success" | "error" | "wait" | "finish" | "process", unknown, "", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `StepProps` instead.

package/es/components/steps/src/item.vue.d.ts

@@ -29,9 +29,9 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_base: _$vue.DefineComponent<StepProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<StepProps> & Readonly<{}>, {
   title: string;
-  icon: IconPropType;
   description: string;
-  status: "" | "error" | "wait" | "finish" | "success" | "process";
+  icon: IconPropType;
+  status: "" | "success" | "error" | "wait" | "finish" | "process";
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/steps/src/steps.d.ts

@@ -59,8 +59,8 @@ declare const stepsProps: {
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
-  readonly finishStatus: EpPropFinalized<StringConstructor, "error" | "wait" | "finish" | "success" | "process", unknown, "finish", boolean>;
-  readonly processStatus: EpPropFinalized<StringConstructor, "error" | "wait" | "finish" | "success" | "process", unknown, "process", boolean>;
+  readonly finishStatus: EpPropFinalized<StringConstructor, "success" | "error" | "wait" | "finish" | "process", unknown, "finish", boolean>;
+  readonly processStatus: EpPropFinalized<StringConstructor, "success" | "error" | "wait" | "finish" | "process", unknown, "process", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `StepsProps` instead.

package/es/components/switch/src/switch.vue.d.ts

@@ -30,15 +30,15 @@ declare const __VLS_base: _$vue.DefineComponent<SwitchProps, {
   change: (val: string | number | boolean) => void;
   input: (val: string | number | boolean) => void;
 }, string, _$vue.PublicProps, Readonly<SwitchProps> & Readonly<{
-  onInput?: ((val: string | number | boolean) => any) | undefined;
-  onChange?: ((val: string | number | boolean) => any) | undefined;
   "onUpdate:modelValue"?: ((val: string | number | boolean) => any) | undefined;
+  onChange?: ((val: string | number | boolean) => any) | undefined;
+  onInput?: ((val: string | number | boolean) => any) | undefined;
 }>, {
-  name: string;
-  disabled: boolean;
+  modelValue: string | number | boolean;
   width: string | number;
+  disabled: boolean;
   validateEvent: boolean;
-  modelValue: string | number | boolean;
+  name: string;
   activeText: string;
   inactiveText: string;
   activeValue: string | number | boolean;

package/es/components/table/src/filter-panel.vue.d.ts

@@ -106,19 +106,19 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
 }, {}, {
   ElCheckbox: {
     new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<CheckboxProps> & Readonly<{
-      onChange?: ((val: CheckboxValueType) => any) | undefined;
       "onUpdate:modelValue"?: ((val: CheckboxValueType) => any) | undefined;
+      onChange?: ((val: CheckboxValueType) => any) | undefined;
     }>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
-      change: (val: CheckboxValueType) => void;
       "update:modelValue": (val: CheckboxValueType) => void;
+      change: (val: CheckboxValueType) => void;
     }, _$vue.PublicProps, {
-      name: string;
-      label: string | number | boolean | object;
-      disabled: boolean;
+      modelValue: string | number | boolean;
       id: string;
-      value: string | number | boolean | object;
+      disabled: boolean;
       validateEvent: boolean;
-      modelValue: string | number | boolean;
+      name: string;
+      value: string | number | boolean | object;
+      label: string | number | boolean | object;
       trueValue: string | number;
       falseValue: string | number;
       trueLabel: string | number;
@@ -131,16 +131,16 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       M: {};
       Defaults: {};
     }, Readonly<CheckboxProps> & Readonly<{
-      onChange?: ((val: CheckboxValueType) => any) | undefined;
       "onUpdate:modelValue"?: ((val: CheckboxValueType) => any) | undefined;
+      onChange?: ((val: CheckboxValueType) => any) | undefined;
     }>, {}, {}, {}, {}, {
-      name: string;
-      label: string | number | boolean | object;
-      disabled: boolean;
+      modelValue: string | number | boolean;
       id: string;
-      value: string | number | boolean | object;
+      disabled: boolean;
       validateEvent: boolean;
-      modelValue: string | number | boolean;
+      name: string;
+      value: string | number | boolean | object;
+      label: string | number | boolean | object;
       trueValue: string | number;
       falseValue: string | number;
       trueLabel: string | number;
@@ -150,19 +150,19 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     __isTeleport?: never;
     __isSuspense?: never;
   } & _$vue.ComponentOptionsBase<Readonly<CheckboxProps> & Readonly<{
-    onChange?: ((val: CheckboxValueType) => any) | undefined;
     "onUpdate:modelValue"?: ((val: CheckboxValueType) => any) | undefined;
+    onChange?: ((val: CheckboxValueType) => any) | undefined;
   }>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
-    change: (val: CheckboxValueType) => void;
     "update:modelValue": (val: CheckboxValueType) => void;
+    change: (val: CheckboxValueType) => void;
   }, string, {
-    name: string;
-    label: string | number | boolean | object;
-    disabled: boolean;
+    modelValue: string | number | boolean;
     id: string;
-    value: string | number | boolean | object;
+    disabled: boolean;
     validateEvent: boolean;
-    modelValue: string | number | boolean;
+    name: string;
+    value: string | number | boolean | object;
+    label: string | number | boolean | object;
     trueValue: string | number;
     falseValue: string | number;
     trueLabel: string | number;
@@ -198,22 +198,22 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   };
   ElCheckboxGroup: SFCWithInstall<{
     new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<CheckboxGroupProps> & Readonly<{
-      onChange?: ((val: CheckboxValueType[]) => any) | undefined;
       "onUpdate:modelValue"?: ((val: CheckboxGroupValueType) => any) | undefined;
+      onChange?: ((val: CheckboxValueType[]) => any) | undefined;
     }>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
-      change: (val: CheckboxValueType[]) => void;
       "update:modelValue": (val: CheckboxGroupValueType) => void;
+      change: (val: CheckboxValueType[]) => void;
     }, _$vue.PublicProps, {
       type: "button" | "checkbox";
+      modelValue: CheckboxGroupValueType;
       props: {
         value?: string;
         label?: string;
         disabled?: string;
       };
       disabled: boolean;
-      tag: string;
       validateEvent: boolean;
-      modelValue: CheckboxGroupValueType;
+      tag: string;
     }, false, {}, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, {}, any, _$vue.ComponentProvideOptions, {
       P: {};
       B: {};
@@ -222,40 +222,40 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       M: {};
       Defaults: {};
     }, Readonly<CheckboxGroupProps> & Readonly<{
-      onChange?: ((val: CheckboxValueType[]) => any) | undefined;
       "onUpdate:modelValue"?: ((val: CheckboxGroupValueType) => any) | undefined;
+      onChange?: ((val: CheckboxValueType[]) => any) | undefined;
     }>, {}, {}, {}, {}, {
       type: "button" | "checkbox";
+      modelValue: CheckboxGroupValueType;
       props: {
         value?: string;
         label?: string;
         disabled?: string;
       };
       disabled: boolean;
-      tag: string;
       validateEvent: boolean;
-      modelValue: CheckboxGroupValueType;
+      tag: string;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
   } & _$vue.ComponentOptionsBase<Readonly<CheckboxGroupProps> & Readonly<{
-    onChange?: ((val: CheckboxValueType[]) => any) | undefined;
     "onUpdate:modelValue"?: ((val: CheckboxGroupValueType) => any) | undefined;
+    onChange?: ((val: CheckboxValueType[]) => any) | undefined;
   }>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
-    change: (val: CheckboxValueType[]) => void;
     "update:modelValue": (val: CheckboxGroupValueType) => void;
+    change: (val: CheckboxValueType[]) => void;
   }, string, {
     type: "button" | "checkbox";
+    modelValue: CheckboxGroupValueType;
     props: {
       value?: string;
       label?: string;
       disabled?: string;
     };
     disabled: boolean;
-    tag: string;
     validateEvent: boolean;
-    modelValue: CheckboxGroupValueType;
+    tag: string;
   }, {}, string, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, _$vue.ComponentProvideOptions> & _$vue.VNodeProps & _$vue.AllowedComponentProps & _$vue.ComponentCustomProps & (new () => {
     $slots: {
       default?: (props: {}) => any;
@@ -285,11 +285,11 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       }) => void;
       "end-reached": (direction: ScrollbarDirection) => void;
     }, _$vue.PublicProps, {
-      height: string | number;
-      tag: keyof HTMLElementTagNameMap | (string & {});
-      maxHeight: string | number;
       tabindex: string | number;
+      height: string | number;
       mask: boolean | ScrollbarDirection;
+      maxHeight: string | number;
+      tag: (string & {}) | keyof HTMLElementTagNameMap;
       distance: number;
       wrapStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
       wrapClass: string | false | Record<string, any> | ClassValue[] | null;
@@ -320,11 +320,11 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       setScrollLeft: (value: number) => void;
       handleScroll: () => void;
     }, {}, {}, {}, {
-      height: string | number;
-      tag: keyof HTMLElementTagNameMap | (string & {});
-      maxHeight: string | number;
       tabindex: string | number;
+      height: string | number;
       mask: boolean | ScrollbarDirection;
+      maxHeight: string | number;
+      tag: (string & {}) | keyof HTMLElementTagNameMap;
       distance: number;
       wrapStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
       wrapClass: string | false | Record<string, any> | ClassValue[] | null;
@@ -358,11 +358,11 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     }) => void;
     "end-reached": (direction: ScrollbarDirection) => void;
   }, string, {
-    height: string | number;
-    tag: keyof HTMLElementTagNameMap | (string & {});
-    maxHeight: string | number;
     tabindex: string | number;
+    height: string | number;
     mask: boolean | ScrollbarDirection;
+    maxHeight: string | number;
+    tag: (string & {}) | keyof HTMLElementTagNameMap;
     distance: number;
     wrapStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
     wrapClass: string | false | Record<string, any> | ClassValue[] | null;
@@ -376,10 +376,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   })>;
   ElTooltip: SFCWithInstall<{
     new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<UseTooltipProps> & Readonly<{
+      onOpen?: ((...args: any[]) => any) | undefined;
       onClose?: ((...args: any[]) => any) | undefined;
       onHide?: ((...args: any[]) => any) | undefined;
       onShow?: ((...args: any[]) => any) | undefined;
-      onOpen?: ((...args: any[]) => any) | undefined;
       "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
       "onBefore-show"?: ((...args: any[]) => any) | undefined;
       "onBefore-hide"?: ((...args: any[]) => any) | undefined;
@@ -392,21 +392,20 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       onClose: (event?: Event, delay?: number) => void;
       hide: (event?: Event) => void;
     }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+      open: (...args: any[]) => void;
       close: (...args: any[]) => void;
       hide: (...args: any[]) => void;
       show: (...args: any[]) => void;
-      open: (...args: any[]) => void;
       "update:visible": (...args: any[]) => void;
       "before-show": (...args: any[]) => void;
       "before-hide": (...args: any[]) => void;
     }, _$vue.PublicProps, {
       visible: boolean | null;
-      style: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
-      role: "dialog" | "menu" | "grid" | "listbox" | "tooltip" | "tree" | "group" | "navigation";
-      content: string;
+      offset: number;
+      teleported: boolean;
       effect: PopperEffect;
-      autoClose: number;
-      virtualTriggering: boolean;
+      content: string;
+      style: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
       enterable: boolean;
       pure: boolean;
       focusOnShow: boolean;
@@ -414,18 +413,19 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       popperClass: string | false | Record<string, any> | ClassValue[] | null;
       popperStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
       stopPopperMouseEvent: boolean;
+      virtualTriggering: boolean;
       loop: boolean;
       boundariesPadding: number;
       gpuAcceleration: boolean;
-      offset: number;
       placement: Placement;
       popperOptions: Partial<Options>;
-      strategy: "absolute" | "fixed";
+      strategy: "fixed" | "absolute";
       arrowOffset: number;
       showArrow: boolean;
-      teleported: boolean;
+      role: "grid" | "dialog" | "listbox" | "menu" | "tooltip" | "group" | "navigation" | "tree";
       showAfter: number;
       hideAfter: number;
+      autoClose: number;
       trigger: Arrayable<TooltipTriggerType>;
       triggerKeys: string[];
     }, false, {}, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, {}, any, _$vue.ComponentProvideOptions, {
@@ -436,10 +436,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       M: {};
       Defaults: {};
     }, Readonly<UseTooltipProps> & Readonly<{
+      onOpen?: ((...args: any[]) => any) | undefined;
       onClose?: ((...args: any[]) => any) | undefined;
       onHide?: ((...args: any[]) => any) | undefined;
       onShow?: ((...args: any[]) => any) | undefined;
-      onOpen?: ((...args: any[]) => any) | undefined;
       "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
       "onBefore-show"?: ((...args: any[]) => any) | undefined;
       "onBefore-hide"?: ((...args: any[]) => any) | undefined;
@@ -453,12 +453,11 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       hide: (event?: Event) => void;
     }, {}, {}, {}, {
       visible: boolean | null;
-      style: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
-      role: "dialog" | "menu" | "grid" | "listbox" | "tooltip" | "tree" | "group" | "navigation";
-      content: string;
+      offset: number;
+      teleported: boolean;
       effect: PopperEffect;
-      autoClose: number;
-      virtualTriggering: boolean;
+      content: string;
+      style: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
       enterable: boolean;
       pure: boolean;
       focusOnShow: boolean;
@@ -466,18 +465,19 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       popperClass: string | false | Record<string, any> | ClassValue[] | null;
       popperStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
       stopPopperMouseEvent: boolean;
+      virtualTriggering: boolean;
       loop: boolean;
       boundariesPadding: number;
       gpuAcceleration: boolean;
-      offset: number;
       placement: Placement;
       popperOptions: Partial<Options>;
-      strategy: "absolute" | "fixed";
+      strategy: "fixed" | "absolute";
       arrowOffset: number;
       showArrow: boolean;
-      teleported: boolean;
+      role: "grid" | "dialog" | "listbox" | "menu" | "tooltip" | "group" | "navigation" | "tree";
       showAfter: number;
       hideAfter: number;
+      autoClose: number;
       trigger: Arrayable<TooltipTriggerType>;
       triggerKeys: string[];
     }>;
@@ -485,10 +485,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     __isTeleport?: never;
     __isSuspense?: never;
   } & _$vue.ComponentOptionsBase<Readonly<UseTooltipProps> & Readonly<{
+    onOpen?: ((...args: any[]) => any) | undefined;
     onClose?: ((...args: any[]) => any) | undefined;
     onHide?: ((...args: any[]) => any) | undefined;
     onShow?: ((...args: any[]) => any) | undefined;
-    onOpen?: ((...args: any[]) => any) | undefined;
     "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
     "onBefore-show"?: ((...args: any[]) => any) | undefined;
     "onBefore-hide"?: ((...args: any[]) => any) | undefined;
@@ -501,21 +501,20 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     onClose: (event?: Event, delay?: number) => void;
     hide: (event?: Event) => void;
   }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+    open: (...args: any[]) => void;
     close: (...args: any[]) => void;
     hide: (...args: any[]) => void;
     show: (...args: any[]) => void;
-    open: (...args: any[]) => void;
     "update:visible": (...args: any[]) => void;
     "before-show": (...args: any[]) => void;
     "before-hide": (...args: any[]) => void;
   }, string, {
     visible: boolean | null;
-    style: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
-    role: "dialog" | "menu" | "grid" | "listbox" | "tooltip" | "tree" | "group" | "navigation";
-    content: string;
+    offset: number;
+    teleported: boolean;
     effect: PopperEffect;
-    autoClose: number;
-    virtualTriggering: boolean;
+    content: string;
+    style: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
     enterable: boolean;
     pure: boolean;
     focusOnShow: boolean;
@@ -523,18 +522,19 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     popperClass: string | false | Record<string, any> | ClassValue[] | null;
     popperStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
     stopPopperMouseEvent: boolean;
+    virtualTriggering: boolean;
     loop: boolean;
     boundariesPadding: number;
     gpuAcceleration: boolean;
-    offset: number;
     placement: Placement;
     popperOptions: Partial<Options>;
-    strategy: "absolute" | "fixed";
+    strategy: "fixed" | "absolute";
     arrowOffset: number;
     showArrow: boolean;
-    teleported: boolean;
+    role: "grid" | "dialog" | "listbox" | "menu" | "tooltip" | "group" | "navigation" | "tree";
     showAfter: number;
     hideAfter: number;
+    autoClose: number;
     trigger: Arrayable<TooltipTriggerType>;
     triggerKeys: string[];
   }, {}, string, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, _$vue.ComponentProvideOptions> & _$vue.VNodeProps & _$vue.AllowedComponentProps & _$vue.ComponentCustomProps & (new () => {

package/es/components/table/src/table-body/index.d.ts

@@ -83,8 +83,8 @@ declare const _default: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   highlight: BooleanConstructor;
 }>> & Readonly<{}>, {
   fixed: string;
-  context: Table<any>;
   stripe: boolean;
+  context: Table<any>;
   highlight: boolean;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
 //#endregion

package/es/components/table/src/table-body/td-wrapper.vue.d.ts

@@ -24,8 +24,8 @@ declare const __VLS_base: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     default: number;
   };
 }>> & Readonly<{}>, {
-  colspan: number;
   rowspan: number;
+  colspan: number;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;