@element-plus/nightly 0.0.20261021 → 0.0.20261022

package/lib/components/slider/src/slider.d.ts

@@ -25,13 +25,13 @@ declare const sliderProps: {
   readonly showInput: BooleanConstructor;
   readonly showInputControls: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly size: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
   readonly inputSize: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/lib/components/slider/src/slider.vue.d.ts

@@ -14,13 +14,13 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   readonly showInput: BooleanConstructor;
   readonly showInputControls: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly size: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
   readonly inputSize: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -78,8 +78,8 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
 }>, {
   onSliderClick: (event: MouseEvent | TouchEvent) => void;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
-  change: (value: Arrayable<number>) => void;
   "update:modelValue": (value: Arrayable<number>) => void;
+  change: (value: Arrayable<number>) => void;
   input: (value: Arrayable<number>) => void;
 }, string, _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
   readonly ariaLabel: StringConstructor;
@@ -91,13 +91,13 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   readonly showInput: BooleanConstructor;
   readonly showInputControls: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly size: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
   readonly inputSize: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -153,19 +153,19 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   readonly validateEvent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly persistent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
 }>> & Readonly<{
-  onChange?: ((value: Arrayable<number>) => any) | undefined;
   "onUpdate:modelValue"?: ((value: Arrayable<number>) => any) | undefined;
+  onChange?: ((value: Arrayable<number>) => any) | undefined;
   onInput?: ((value: Arrayable<number>) => any) | undefined;
 }>, {
-  readonly id: string;
+  readonly modelValue: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => Arrayable<number>) | (((new (...args: any[]) => number | number[]) | (() => Arrayable<number>)) | null)[], unknown, unknown>;
   readonly vertical: boolean;
-  readonly range: boolean;
+  readonly id: string;
   readonly disabled: EpPropMergeType<BooleanConstructor, unknown, unknown>;
-  readonly modelValue: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => Arrayable<number>) | (((new (...args: any[]) => number | number[]) | (() => Arrayable<number>)) | null)[], unknown, unknown>;
+  readonly validateEvent: EpPropMergeType<BooleanConstructor, unknown, unknown>;
+  readonly range: boolean;
   readonly placement: EpPropMergeType<StringConstructor, Placement, unknown>;
   readonly persistent: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly max: number;
-  readonly validateEvent: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly min: number;
   readonly step: EpPropMergeType<(new (...args: any[]) => number | "mark") | (() => number | "mark") | (((new (...args: any[]) => number | "mark") | (() => number | "mark")) | null)[], unknown, unknown>;
   readonly showInputControls: EpPropMergeType<BooleanConstructor, unknown, unknown>;

package/lib/components/space/src/space.d.ts

@@ -23,7 +23,7 @@ declare const spaceProps: {
   readonly fill: BooleanConstructor;
   readonly fillRatio: EpPropFinalized<NumberConstructor, unknown, unknown, 100, boolean>;
   readonly size: {
-    readonly type: _$vue.PropType<EpPropMergeType<readonly [StringConstructor, ArrayConstructor, NumberConstructor], "" | "default" | "large" | "small", number | [number, number]>>;
+    readonly type: _$vue.PropType<EpPropMergeType<readonly [StringConstructor, ArrayConstructor, NumberConstructor], "" | "default" | "small" | "large", number | [number, number]>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -49,7 +49,7 @@ declare const Space: _$vue.DefineComponent<ExtractPropTypes<{
   readonly fill: BooleanConstructor;
   readonly fillRatio: EpPropFinalized<NumberConstructor, unknown, unknown, 100, boolean>;
   readonly size: {
-    readonly type: _$vue.PropType<EpPropMergeType<readonly [StringConstructor, ArrayConstructor, NumberConstructor], "" | "default" | "large" | "small", number | [number, number]>>;
+    readonly type: _$vue.PropType<EpPropMergeType<readonly [StringConstructor, ArrayConstructor, NumberConstructor], "" | "default" | "small" | "large", number | [number, number]>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -77,17 +77,17 @@ declare const Space: _$vue.DefineComponent<ExtractPropTypes<{
   readonly fill: BooleanConstructor;
   readonly fillRatio: EpPropFinalized<NumberConstructor, unknown, unknown, 100, boolean>;
   readonly size: {
-    readonly type: _$vue.PropType<EpPropMergeType<readonly [StringConstructor, ArrayConstructor, NumberConstructor], "" | "default" | "large" | "small", number | [number, number]>>;
+    readonly type: _$vue.PropType<EpPropMergeType<readonly [StringConstructor, ArrayConstructor, NumberConstructor], "" | "default" | "small" | "large", number | [number, number]>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
 }>> & Readonly<{}>, {
-  readonly class: ClassValue;
-  readonly style: StyleValue;
-  readonly direction: EpPropMergeType<StringConstructor, "horizontal" | "vertical", unknown>;
   readonly fill: boolean;
+  readonly style: StyleValue;
   readonly wrap: boolean;
+  readonly direction: EpPropMergeType<StringConstructor, "horizontal" | "vertical", unknown>;
+  readonly class: ClassValue;
   readonly alignment: EpPropMergeType<(new (...args: any[]) => string) | (() => _$csstype.Property.AlignItems | undefined) | (((new (...args: any[]) => string) | (() => _$csstype.Property.AlignItems | undefined)) | null)[], unknown, unknown>;
   readonly spacer: EpPropMergeType<(new (...args: any[]) => VNodeChild & {}) | (() => VNodeChild) | (((new (...args: any[]) => VNodeChild & {}) | (() => VNodeChild)) | null)[], unknown, string | number | VNode<_$vue.RendererNode, _$vue.RendererElement, {
     [key: string]: any;

package/lib/components/splitter/src/hooks/index.d.ts

@@ -1,4 +1,4 @@
 import { useContainer } from "./useContainer.js";
 import { useResize } from "./useResize.js";
-import { getPct, getPx, isPct, isPx, useSize } from "./useSize.js";
-export { getPct, getPx, isPct, isPx, useContainer, useResize, useSize };
+import { useSize } from "./useSize.js";
+export { useContainer, useResize, useSize };

package/lib/components/splitter/src/hooks/index.js

@@ -1,11 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_useContainer = require("./useContainer.js");
-const require_useSize = require("./useSize.js");
 const require_useResize = require("./useResize.js");
-exports.getPct = require_useSize.getPct;
-exports.getPx = require_useSize.getPx;
-exports.isPct = require_useSize.isPct;
-exports.isPx = require_useSize.isPx;
+const require_useSize = require("./useSize.js");
 exports.useContainer = require_useContainer.useContainer;
 exports.useResize = require_useResize.useResize;
 exports.useSize = require_useSize.useSize;

package/lib/components/splitter/src/hooks/useResize.js

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_useSize = require("./useSize.js");
+const require_style = require("../../../../utils/dom/style.js");
 let lodash_unified = require("lodash-unified");
 let vue = require("vue");
 let _vue_shared = require("@vue/shared");
@@ -7,8 +7,8 @@ let _vue_shared = require("@vue/shared");
 function useResize(panels, containerSize, pxSizes, lazy) {
 	const ptg2px = (ptg) => ptg * containerSize.value || 0;
 	function getLimitSize(str, defaultLimit) {
-		if (require_useSize.isPct(str)) return ptg2px(require_useSize.getPct(str));
-		else if (require_useSize.isPx(str)) return require_useSize.getPx(str);
+		if (require_style.isPercent(str)) return ptg2px(require_style.percentToRatio(str));
+		else if (require_style.isPx(str)) return require_style.parsePx(str);
 		return str ?? defaultLimit;
 	}
 	const lazyOffset = (0, vue.ref)(0);

package/lib/components/splitter/src/hooks/useResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResize.js","names":["isPct","getPct","isPx","getPx","ref","NOOP","computed","clamp"],"sources":["../../../../../../../packages/components/splitter/src/hooks/useResize.ts"],"sourcesContent":["import { computed, ref, watch } from 'vue'\nimport { clamp } from 'lodash-unified'\nimport { getPct, getPx, isPct, isPx } from './useSize'\nimport { NOOP } from '@element-plus/utils'\n\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PanelItemState } from '../type'\n\nexport function useResize(\n  panels: Ref<PanelItemState[]>,\n  containerSize: ComputedRef<number>,\n  pxSizes: ComputedRef<number[]>,\n  lazy: Ref<boolean>\n) {\n  const ptg2px = (ptg: number) => ptg * containerSize.value || 0\n\n  function getLimitSize(\n    str: string | number | undefined,\n    defaultLimit: number\n  ) {\n    if (isPct(str)) {\n      return ptg2px(getPct(str))\n    } else if (isPx(str)) {\n      return getPx(str)\n    }\n    return str ?? defaultLimit\n  }\n\n  const lazyOffset = ref(0)\n  const movingIndex = ref<{\n    index: number\n    confirmed: boolean\n  } | null>(null)\n\n  let cachePxSizes: number[] = []\n  let updatePanelSizes = NOOP\n\n  const limitSizes = computed(() =>\n    panels.value.map((item) => [item.min, item.max])\n  )\n\n  watch(lazy, () => {\n    if (lazyOffset.value) {\n      const mouseup = new MouseEvent('mouseup', { bubbles: true })\n      window.dispatchEvent(mouseup)\n    }\n  })\n\n  const onMoveStart = (index: number) => {\n    lazyOffset.value = 0\n    movingIndex.value = { index, confirmed: false }\n    cachePxSizes = pxSizes.value\n  }\n\n  const onMoving = (index: number, offset: number) => {\n    let confirmedIndex: number | null = null\n\n    // When overlapping, find the nearest draggable index\n    if ((!movingIndex.value || !movingIndex.value.confirmed) && offset !== 0) {\n      if (offset > 0) {\n        confirmedIndex = index\n        movingIndex.value = { index, confirmed: true }\n      } else {\n        for (let i = index; i >= 0; i -= 1) {\n          if (cachePxSizes[i]! > 0) {\n            confirmedIndex = i\n            movingIndex.value = { index: i, confirmed: true }\n            break\n          }\n        }\n      }\n    }\n    const mergedIndex = confirmedIndex ?? movingIndex.value?.index ?? index\n\n    const numSizes = [...cachePxSizes]\n    const nextIndex = mergedIndex + 1\n\n    // Handle the maximum and minimum edge cases\n    const startMinSize = getLimitSize(limitSizes.value[mergedIndex]![0], 0)\n    const endMinSize = getLimitSize(limitSizes.value[nextIndex]![0], 0)\n    const startMaxSize = getLimitSize(\n      limitSizes.value[mergedIndex]![1],\n      containerSize.value || 0\n    )\n    const endMaxSize = getLimitSize(\n      limitSizes.value[nextIndex]![1],\n      containerSize.value || 0\n    )\n\n    let mergedOffset = offset\n\n    if (numSizes[mergedIndex]! + mergedOffset < startMinSize) {\n      mergedOffset = startMinSize - numSizes[mergedIndex]!\n    }\n    if (numSizes[nextIndex]! - mergedOffset < endMinSize) {\n      mergedOffset = numSizes[nextIndex]! - endMinSize\n    }\n    if (numSizes[mergedIndex]! + mergedOffset > startMaxSize) {\n      mergedOffset = startMaxSize - numSizes[mergedIndex]!\n    }\n    if (numSizes[nextIndex]! - mergedOffset > endMaxSize) {\n      mergedOffset = numSizes[nextIndex]! - endMaxSize\n    }\n\n    numSizes[mergedIndex]! += mergedOffset\n    numSizes[nextIndex]! -= mergedOffset\n    lazyOffset.value = mergedOffset\n\n    updatePanelSizes = () => {\n      panels.value.forEach((panel, index) => {\n        panel.size = numSizes[index]\n      })\n      updatePanelSizes = NOOP\n    }\n\n    if (!lazy.value) {\n      updatePanelSizes()\n    }\n  }\n\n  const onMoveEnd = () => {\n    if (lazy.value) {\n      updatePanelSizes()\n    }\n\n    lazyOffset.value = 0\n    movingIndex.value = null\n    cachePxSizes = []\n  }\n\n  const cacheCollapsedSize: number[] = []\n  const onCollapse = (index: number, type: 'start' | 'end') => {\n    if (!cacheCollapsedSize.length) {\n      cacheCollapsedSize.push(\n        ...pxSizes.value.map((size, i) =>\n          size <= 0 ? getLimitSize(limitSizes.value[i]?.[0], 0) : size\n        )\n      )\n    }\n\n    const currentSizes = pxSizes.value\n\n    const currentIndex = type === 'start' ? index : index + 1\n    const targetIndex = type === 'start' ? index + 1 : index\n\n    const currentSize = currentSizes[currentIndex]\n    const targetSize = currentSizes[targetIndex]\n\n    if (currentSize !== 0 && targetSize !== 0) {\n      currentSizes[currentIndex] = 0\n      currentSizes[targetIndex]! += currentSize\n      cacheCollapsedSize[index] = currentSize\n    } else {\n      const totalSize = currentSize + targetSize\n\n      const targetCacheCollapsedSize = clamp(\n        cacheCollapsedSize[index],\n        0,\n        totalSize\n      )\n      const currentCacheCollapsedSize = totalSize - targetCacheCollapsedSize\n\n      currentSizes[targetIndex] = targetCacheCollapsedSize\n      currentSizes[currentIndex] = currentCacheCollapsedSize\n    }\n\n    panels.value.forEach((panel, index) => {\n      panel.size = currentSizes[index]\n    })\n  }\n\n  return {\n    lazyOffset,\n    onMoveStart,\n    onMoving,\n    onMoveEnd,\n    movingIndex,\n    onCollapse,\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"useResize.js","names":["isPercent","percentToRatio","isPx","parsePx","ref","NOOP","computed","clamp"],"sources":["../../../../../../../packages/components/splitter/src/hooks/useResize.ts"],"sourcesContent":["import { computed, ref, watch } from 'vue'\nimport { clamp } from 'lodash-unified'\nimport {\n  NOOP,\n  isPercent,\n  isPx,\n  parsePx,\n  percentToRatio,\n} from '@element-plus/utils'\n\nimport type { ComputedRef, Ref } from 'vue'\nimport type { PanelItemState } from '../type'\n\nexport function useResize(\n  panels: Ref<PanelItemState[]>,\n  containerSize: ComputedRef<number>,\n  pxSizes: ComputedRef<number[]>,\n  lazy: Ref<boolean>\n) {\n  const ptg2px = (ptg: number) => ptg * containerSize.value || 0\n\n  function getLimitSize(\n    str: string | number | undefined,\n    defaultLimit: number\n  ) {\n    if (isPercent(str)) {\n      return ptg2px(percentToRatio(str))\n    } else if (isPx(str)) {\n      return parsePx(str)\n    }\n    return str ?? defaultLimit\n  }\n\n  const lazyOffset = ref(0)\n  const movingIndex = ref<{\n    index: number\n    confirmed: boolean\n  } | null>(null)\n\n  let cachePxSizes: number[] = []\n  let updatePanelSizes = NOOP\n\n  const limitSizes = computed(() =>\n    panels.value.map((item) => [item.min, item.max])\n  )\n\n  watch(lazy, () => {\n    if (lazyOffset.value) {\n      const mouseup = new MouseEvent('mouseup', { bubbles: true })\n      window.dispatchEvent(mouseup)\n    }\n  })\n\n  const onMoveStart = (index: number) => {\n    lazyOffset.value = 0\n    movingIndex.value = { index, confirmed: false }\n    cachePxSizes = pxSizes.value\n  }\n\n  const onMoving = (index: number, offset: number) => {\n    let confirmedIndex: number | null = null\n\n    // When overlapping, find the nearest draggable index\n    if ((!movingIndex.value || !movingIndex.value.confirmed) && offset !== 0) {\n      if (offset > 0) {\n        confirmedIndex = index\n        movingIndex.value = { index, confirmed: true }\n      } else {\n        for (let i = index; i >= 0; i -= 1) {\n          if (cachePxSizes[i]! > 0) {\n            confirmedIndex = i\n            movingIndex.value = { index: i, confirmed: true }\n            break\n          }\n        }\n      }\n    }\n    const mergedIndex = confirmedIndex ?? movingIndex.value?.index ?? index\n\n    const numSizes = [...cachePxSizes]\n    const nextIndex = mergedIndex + 1\n\n    // Handle the maximum and minimum edge cases\n    const startMinSize = getLimitSize(limitSizes.value[mergedIndex]![0], 0)\n    const endMinSize = getLimitSize(limitSizes.value[nextIndex]![0], 0)\n    const startMaxSize = getLimitSize(\n      limitSizes.value[mergedIndex]![1],\n      containerSize.value || 0\n    )\n    const endMaxSize = getLimitSize(\n      limitSizes.value[nextIndex]![1],\n      containerSize.value || 0\n    )\n\n    let mergedOffset = offset\n\n    if (numSizes[mergedIndex]! + mergedOffset < startMinSize) {\n      mergedOffset = startMinSize - numSizes[mergedIndex]!\n    }\n    if (numSizes[nextIndex]! - mergedOffset < endMinSize) {\n      mergedOffset = numSizes[nextIndex]! - endMinSize\n    }\n    if (numSizes[mergedIndex]! + mergedOffset > startMaxSize) {\n      mergedOffset = startMaxSize - numSizes[mergedIndex]!\n    }\n    if (numSizes[nextIndex]! - mergedOffset > endMaxSize) {\n      mergedOffset = numSizes[nextIndex]! - endMaxSize\n    }\n\n    numSizes[mergedIndex]! += mergedOffset\n    numSizes[nextIndex]! -= mergedOffset\n    lazyOffset.value = mergedOffset\n\n    updatePanelSizes = () => {\n      panels.value.forEach((panel, index) => {\n        panel.size = numSizes[index]\n      })\n      updatePanelSizes = NOOP\n    }\n\n    if (!lazy.value) {\n      updatePanelSizes()\n    }\n  }\n\n  const onMoveEnd = () => {\n    if (lazy.value) {\n      updatePanelSizes()\n    }\n\n    lazyOffset.value = 0\n    movingIndex.value = null\n    cachePxSizes = []\n  }\n\n  const cacheCollapsedSize: number[] = []\n  const onCollapse = (index: number, type: 'start' | 'end') => {\n    if (!cacheCollapsedSize.length) {\n      cacheCollapsedSize.push(\n        ...pxSizes.value.map((size, i) =>\n          size <= 0 ? getLimitSize(limitSizes.value[i]?.[0], 0) : size\n        )\n      )\n    }\n\n    const currentSizes = pxSizes.value\n\n    const currentIndex = type === 'start' ? index : index + 1\n    const targetIndex = type === 'start' ? index + 1 : index\n\n    const currentSize = currentSizes[currentIndex]\n    const targetSize = currentSizes[targetIndex]\n\n    if (currentSize !== 0 && targetSize !== 0) {\n      currentSizes[currentIndex] = 0\n      currentSizes[targetIndex]! += currentSize\n      cacheCollapsedSize[index] = currentSize\n    } else {\n      const totalSize = currentSize + targetSize\n\n      const targetCacheCollapsedSize = clamp(\n        cacheCollapsedSize[index],\n        0,\n        totalSize\n      )\n      const currentCacheCollapsedSize = totalSize - targetCacheCollapsedSize\n\n      currentSizes[targetIndex] = targetCacheCollapsedSize\n      currentSizes[currentIndex] = currentCacheCollapsedSize\n    }\n\n    panels.value.forEach((panel, index) => {\n      panel.size = currentSizes[index]\n    })\n  }\n\n  return {\n    lazyOffset,\n    onMoveStart,\n    onMoving,\n    onMoveEnd,\n    movingIndex,\n    onCollapse,\n  }\n}\n"],"mappings":"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"}

package/lib/components/splitter/src/hooks/useSize.d.ts

@@ -2,13 +2,9 @@ import { PanelItemState } from "../type.js";
 import { ComputedRef, Ref } from "vue";
 
 //#region ../../packages/components/splitter/src/hooks/useSize.d.ts
-declare function getPct(str: string): number;
-declare function getPx(str: string): number;
-declare function isPct(itemSize: string | number | undefined): itemSize is string;
-declare function isPx(itemSize: string | number | undefined): itemSize is string;
 declare function useSize(panels: Ref<PanelItemState[]>, containerSize: ComputedRef<number>): {
   percentSizes: Ref<number[], number[]>;
   pxSizes: ComputedRef<number[]>;
 };
 //#endregion
-export { getPct, getPx, isPct, isPx, useSize };
+export { useSize };

package/lib/components/splitter/src/hooks/useSize.js

@@ -1,19 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_style = require("../../../../utils/dom/style.js");
 let vue = require("vue");
-let _vue_shared = require("@vue/shared");
 //#region ../../packages/components/splitter/src/hooks/useSize.ts
-function getPct(str) {
-	return Number(str.slice(0, -1)) / 100;
-}
-function getPx(str) {
-	return Number(str.slice(0, -2));
-}
-function isPct(itemSize) {
-	return (0, _vue_shared.isString)(itemSize) && itemSize.endsWith("%");
-}
-function isPx(itemSize) {
-	return (0, _vue_shared.isString)(itemSize) && itemSize.endsWith("px");
-}
 function useSize(panels, containerSize) {
 	const propSizes = (0, vue.computed)(() => panels.value.map((i) => i.size));
 	const panelCounts = (0, vue.computed)(() => panels.value.length);
@@ -27,8 +15,8 @@ function useSize(panels, containerSize) {
 		let emptyCount = 0;
 		for (let i = 0; i < panelCounts.value; i += 1) {
 			const itemSize = panels.value[i]?.size;
-			if (isPct(itemSize)) ptgList[i] = getPct(itemSize);
-			else if (isPx(itemSize)) ptgList[i] = getPx(itemSize) / containerSize.value;
+			if (require_style.isPercent(itemSize)) ptgList[i] = require_style.percentToRatio(itemSize);
+			else if (require_style.isPx(itemSize)) ptgList[i] = require_style.parsePx(itemSize) / containerSize.value;
 			else if (itemSize || itemSize === 0) {
 				const num = Number(itemSize);
 				if (!Number.isNaN(num)) ptgList[i] = num / containerSize.value;
@@ -54,10 +42,6 @@ function useSize(panels, containerSize) {
 	};
 }
 //#endregion
-exports.getPct = getPct;
-exports.getPx = getPx;
-exports.isPct = isPct;
-exports.isPx = isPx;
 exports.useSize = useSize;
 
 //# sourceMappingURL=useSize.js.map

package/lib/components/splitter/src/hooks/useSize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSize.js","names":["isString","computed","ref"],"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,QAAA,GAAOA,YAAAA,SAAAA,CAAS,QAAQ,KAAK,SAAS,SAAS,GAAG;AACpD;AAEA,SAAgB,KACd,UACoB;CACpB,QAAA,GAAOA,YAAAA,SAAAA,CAAS,QAAQ,KAAK,SAAS,SAAS,IAAI;AACrD;AAEA,SAAgB,QACd,QACA,eACA;CACA,MAAM,aAAA,GAAYC,IAAAA,SAAAA,OAAe,OAAO,MAAM,KAAK,MAAM,EAAE,IAAI,CAAC;CAEhE,MAAM,eAAA,GAAcA,IAAAA,SAAAA,OAAe,OAAO,MAAM,MAAM;CAEtD,MAAM,gBAAA,GAAeC,IAAAA,IAAAA,CAAc,CAAC,CAAC;CAErC,CAAA,GAAA,IAAA,MAAA,CAAM;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,UAAA,GAFPD,IAAAA,SAAAA,OAAe,aAAa,MAAM,IAAI,MAAM,CAE/B;CAAE;AACjC"}
+{"version":3,"file":"useSize.js","names":["computed","ref","isPercent","percentToRatio","isPx","parsePx"],"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,aAAA,GAAYA,IAAAA,SAAAA,OAAe,OAAO,MAAM,KAAK,MAAM,EAAE,IAAI,CAAC;CAEhE,MAAM,eAAA,GAAcA,IAAAA,SAAAA,OAAe,OAAO,MAAM,MAAM;CAEtD,MAAM,gBAAA,GAAeC,IAAAA,IAAAA,CAAc,CAAC,CAAC;CAErC,CAAA,GAAA,IAAA,MAAA,CAAM;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,IAAIC,cAAAA,UAAU,QAAQ,GACpB,QAAQ,KAAKC,cAAAA,eAAe,QAAQ;QAC/B,IAAIC,cAAAA,KAAK,QAAQ,GACtB,QAAQ,KAAKC,cAAAA,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,UAAA,GAFPL,IAAAA,SAAAA,OAAe,aAAa,MAAM,IAAI,MAAM,CAE/B;CAAE;AACjC"}

package/lib/components/splitter/src/split-panel.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,6 @@
 const require_error = require("../../../utils/error.js");
+const require_style = require("../../../utils/dom/style.js");
 const require_index = require("../../../hooks/use-namespace/index.js");
-const require_useSize = require("./hooks/useSize.js");
 const require_type = require("./type.js");
 const require_split_panel = require("./split-panel.js");
 const require_usePanel = require("./hooks/usePanel.js");
@@ -52,8 +52,8 @@ var split_panel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0,
 		const startCollapsible = (0, vue.computed)(() => require_usePanel.isCollapsible(panel.value, panelSize.value, nextPanel.value, nextSize.value));
 		const endCollapsible = (0, vue.computed)(() => require_usePanel.isCollapsible(nextPanel.value, nextSize.value, panel.value, panelSize.value));
 		function sizeToPx(str) {
-			if (require_useSize.isPct(str)) return require_useSize.getPct(str) * containerSize.value || 0;
-			else if (require_useSize.isPx(str)) return require_useSize.getPx(str);
+			if (require_style.isPercent(str)) return require_style.percentToRatio(str) * containerSize.value || 0;
+			else if (require_style.isPx(str)) return require_style.parsePx(str);
 			return str ?? 0;
 		}
 		let isSizeUpdating = false;

package/lib/components/splitter/src/split-panel.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"split-panel.vue_vue_type_script_setup_true_lang.js","names":["$attrs","splitterPanelProps","splitterPanelEmits","useNamespace","inject","splitterRootContextKey","toRefs","ref","getCurrentInstance","computed","isCollapsible","isPct","getPct","isPx","getPx","reactive","getCollapsible","_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.js","names":["$attrs","splitterPanelProps","splitterPanelEmits","useNamespace","inject","splitterRootContextKey","toRefs","ref","getCurrentInstance","computed","isCollapsible","isPercent","percentToRatio","isPx","parsePx","reactive","getCollapsible","_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":"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"}

package/lib/components/splitter/src/split-panel2.js.map

@@ -1 +1 @@
-{"version":3,"file":"split-panel2.js","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.js","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/lib/components/splitter/src/splitter.vue.d.ts

@@ -8,13 +8,13 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: _$vue.DefineComponent<SplitterProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
-  collapse: (index: number, type: "end" | "start", sizes: number[]) => void;
   resize: (index: number, sizes: number[]) => void;
+  collapse: (index: number, type: "end" | "start", sizes: number[]) => void;
   resizeStart: (index: number, sizes: number[]) => void;
   resizeEnd: (index: number, sizes: number[]) => void;
 }, string, _$vue.PublicProps, Readonly<SplitterProps> & Readonly<{
-  onCollapse?: ((index: number, type: "end" | "start", sizes: number[]) => any) | undefined;
   onResize?: ((index: number, sizes: number[]) => any) | undefined;
+  onCollapse?: ((index: number, type: "end" | "start", sizes: number[]) => any) | undefined;
   onResizeStart?: ((index: number, sizes: number[]) => any) | undefined;
   onResizeEnd?: ((index: number, sizes: number[]) => any) | undefined;
 }>, {

package/lib/components/splitter/src/splitter.vue_vue_type_script_setup_true_lang.js

@@ -1,9 +1,9 @@
 const require_index = require("../../../hooks/use-namespace/index.js");
 const require_index$1 = require("../../../hooks/use-ordered-children/index.js");
+const require_splitter = require("./splitter.js");
 const require_useContainer = require("./hooks/useContainer.js");
-const require_useSize = require("./hooks/useSize.js");
 const require_useResize = require("./hooks/useResize.js");
-const require_splitter = require("./splitter.js");
+const require_useSize = require("./hooks/useSize.js");
 const require_type = require("./type.js");
 let vue = require("vue");
 //#region ../../packages/components/splitter/src/splitter.vue?vue&type=script&setup=true&lang.ts

package/lib/components/statistic/src/statistic.vue.d.ts

@@ -18,10 +18,10 @@ declare const __VLS_base: _$vue.DefineComponent<StatisticProps, {
   displayValue: _$vue.ComputedRef<string | number | _$dayjs.Dayjs>;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<StatisticProps> & Readonly<{}>, {
   value: number | _$dayjs.Dayjs;
-  valueStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
   precision: number;
   decimalSeparator: string;
   groupSeparator: string;
+  valueStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/lib/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, "" | "wait" | "error" | "success" | "finish" | "process", unknown, "", boolean>;
+  readonly status: EpPropFinalized<StringConstructor, "" | "success" | "error" | "wait" | "finish" | "process", unknown, "", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `StepProps` instead.

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

@@ -28,10 +28,10 @@ type __VLS_Slots = {} & {
   description?: (props: typeof __VLS_38) => any;
 };
 declare const __VLS_base: _$vue.DefineComponent<StepProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<StepProps> & Readonly<{}>, {
-  icon: IconPropType;
   title: string;
-  status: "" | "wait" | "error" | "success" | "finish" | "process";
   description: string;
+  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/lib/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, "wait" | "error" | "success" | "finish" | "process", unknown, "finish", boolean>;
-  readonly processStatus: EpPropFinalized<StringConstructor, "wait" | "error" | "success" | "finish" | "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/lib/components/steps/src/steps.vue.d.ts

@@ -11,9 +11,9 @@ declare const __VLS_base: _$vue.DefineComponent<StepsProps, {}, {}, {}, {}, _$vu
 }, string, _$vue.PublicProps, Readonly<StepsProps> & Readonly<{
   onChange?: ((newVal: number, oldVal: number) => any) | undefined;
 }>, {
-  direction: "horizontal" | "vertical";
   space: string | number;
   active: number;
+  direction: "horizontal" | "vertical";
   finishStatus: StepsStatus;
   processStatus: StepsStatus;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;

package/lib/components/switch/src/switch.d.ts

@@ -97,7 +97,7 @@ declare const switchProps: {
   readonly disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
   readonly loading: BooleanConstructor;
   readonly size: {
-    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => "" | "default" | "large" | "small") | (() => "" | "default" | "large" | "small") | (((new (...args: any[]) => "" | "default" | "large" | "small") | (() => "" | "default" | "large" | "small")) | null)[], unknown, "" | "default" | "large" | "small">>;
+    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => "" | "default" | "small" | "large") | (() => "" | "default" | "small" | "large") | (((new (...args: any[]) => "" | "default" | "small" | "large") | (() => "" | "default" | "small" | "large")) | null)[], unknown, "" | "default" | "small" | "large">>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

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

@@ -26,19 +26,19 @@ declare const __VLS_base: _$vue.DefineComponent<SwitchProps, {
    */
   checked: _$vue.ComputedRef<boolean>;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
-  change: (val: string | number | boolean) => void;
   "update:modelValue": (val: string | number | boolean) => void;
+  change: (val: string | number | boolean) => void;
   input: (val: string | number | boolean) => void;
 }, string, _$vue.PublicProps, Readonly<SwitchProps> & Readonly<{
-  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;
 }>, {
+  modelValue: string | number | boolean;
   width: string | number;
-  name: string;
   disabled: boolean;
-  modelValue: string | number | boolean;
   validateEvent: boolean;
+  name: string;
   activeText: string;
   inactiveText: string;
   activeValue: string | number | boolean;