@element-plus/nightly 0.0.20250601 → 0.0.20250603

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

@@ -0,0 +1,56 @@
+import { computed, ref, watch } from 'vue';
+import { isString } from '@vue/shared';
+
+function getPct(str) {
+  return Number(str.slice(0, -1)) / 100;
+}
+function getPx(str) {
+  return Number(str.slice(0, -2));
+}
+function isPct(itemSize) {
+  return isString(itemSize) && itemSize.endsWith("%");
+}
+function isPx(itemSize) {
+  return isString(itemSize) && itemSize.endsWith("px");
+}
+function useSize(panels, containerSize) {
+  const propSizes = computed(() => panels.value.map((i) => i.size));
+  const panelCounts = computed(() => panels.value.length);
+  const percentSizes = ref([]);
+  watch([propSizes, panelCounts, containerSize], () => {
+    var _a;
+    let ptgList = [];
+    let emptyCount = 0;
+    for (let i = 0; i < panelCounts.value; i += 1) {
+      const itemSize = (_a = panels.value[i]) == null ? void 0 : _a.size;
+      if (isPct(itemSize)) {
+        ptgList[i] = getPct(itemSize);
+      } else if (isPx(itemSize)) {
+        ptgList[i] = getPx(itemSize) / containerSize.value;
+      } else if (itemSize || itemSize === 0) {
+        const num = Number(itemSize);
+        if (!Number.isNaN(num)) {
+          ptgList[i] = num / containerSize.value;
+        }
+      } else {
+        emptyCount += 1;
+        ptgList[i] = void 0;
+      }
+    }
+    const totalPtg = ptgList.reduce((acc, ptg) => acc + (ptg || 0), 0);
+    if (totalPtg > 1 || !emptyCount) {
+      const scale = 1 / totalPtg;
+      ptgList = ptgList.map((ptg) => ptg === void 0 ? 0 : ptg * scale);
+    } else {
+      const avgRest = (1 - totalPtg) / emptyCount;
+      ptgList = ptgList.map((ptg) => ptg === void 0 ? avgRest : ptg);
+    }
+    percentSizes.value = ptgList;
+  });
+  const ptg2px = (ptg) => ptg * containerSize.value;
+  const pxSizes = computed(() => percentSizes.value.map(ptg2px));
+  return { percentSizes, pxSizes };
+}
+
+export { getPct, getPx, isPct, isPx, useSize };
+//# sourceMappingURL=useSize.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useSize.mjs","sources":["../../../../../../../packages/components/splitter/src/hooks/useSize.ts"],"sourcesContent":["import { computed, ref, watch } from 'vue'\nimport { isString } from '@element-plus/utils'\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"],"names":[],"mappings":"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"}

package/es/components/splitter/src/split-bar.mjs

@@ -0,0 +1,148 @@
+import { defineComponent, computed, ref, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, renderSlot, createBlock, resolveDynamicComponent, createCommentVNode, createElementVNode } from 'vue';
+import { ArrowLeft, ArrowUp, ArrowRight, ArrowDown } from '@element-plus/icons-vue';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+
+const __default__ = defineComponent({
+  name: "ElSplitterBar"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: {
+    index: {
+      type: Number,
+      required: true
+    },
+    layout: {
+      type: String,
+      values: ["horizontal", "vertical"],
+      default: "horizontal"
+    },
+    resizable: {
+      type: Boolean,
+      default: true
+    },
+    startCollapsible: {
+      type: Boolean
+    },
+    endCollapsible: {
+      type: Boolean
+    }
+  },
+  emits: ["moveStart", "moving", "moveEnd", "collapse"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const ns = useNamespace("splitter-bar");
+    const isHorizontal = computed(() => props.layout === "horizontal");
+    const barWrapStyles = computed(() => {
+      if (isHorizontal.value) {
+        return { width: 0 };
+      }
+      return { height: 0 };
+    });
+    const draggerStyles = computed(() => {
+      return {
+        width: isHorizontal.value ? "16px" : "100%",
+        height: isHorizontal.value ? "100%" : "16px",
+        cursor: isHorizontal.value ? "col-resize" : "row-resize",
+        touchAction: "none"
+      };
+    });
+    const draggerPseudoClass = computed(() => {
+      const prefix = ns.e("dragger");
+      let className = isHorizontal.value ? `${prefix}-horizontal` : `${prefix}-vertical`;
+      if (startPos.value)
+        className += ` ${prefix}-active`;
+      return className;
+    });
+    const startPos = ref(null);
+    const onMousedown = (e) => {
+      if (!props.resizable)
+        return;
+      startPos.value = [e.pageX, e.pageY];
+      emit("moveStart", props.index);
+      window.addEventListener("mouseup", onMouseUp);
+      window.addEventListener("mousemove", onMouseMove);
+    };
+    const onTouchStart = (e) => {
+      if (props.resizable && e.touches.length === 1) {
+        e.preventDefault();
+        const touch = e.touches[0];
+        startPos.value = [touch.pageX, touch.pageY];
+        emit("moveStart", props.index);
+        window.addEventListener("touchend", onTouchEnd);
+        window.addEventListener("touchmove", onTouchMove);
+      }
+    };
+    const onMouseMove = (e) => {
+      const { pageX, pageY } = e;
+      const offsetX = pageX - startPos.value[0];
+      const offsetY = pageY - startPos.value[1];
+      const offset = isHorizontal.value ? offsetX : offsetY;
+      emit("moving", props.index, offset);
+    };
+    const onTouchMove = (e) => {
+      if (e.touches.length === 1) {
+        e.preventDefault();
+        const touch = e.touches[0];
+        const offsetX = touch.pageX - startPos.value[0];
+        const offsetY = touch.pageY - startPos.value[1];
+        const offset = isHorizontal.value ? offsetX : offsetY;
+        emit("moving", props.index, offset);
+      }
+    };
+    const onMouseUp = () => {
+      startPos.value = null;
+      window.removeEventListener("mouseup", onMouseUp);
+      window.removeEventListener("mousemove", onMouseMove);
+      emit("moveEnd", props.index);
+    };
+    const onTouchEnd = () => {
+      startPos.value = null;
+      window.removeEventListener("touchend", onTouchEnd);
+      window.removeEventListener("touchmove", onTouchMove);
+      emit("moveEnd", props.index);
+    };
+    const StartIcon = computed(() => isHorizontal.value ? ArrowLeft : ArrowUp);
+    const EndIcon = computed(() => isHorizontal.value ? ArrowRight : ArrowDown);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([unref(ns).b()]),
+        style: normalizeStyle(unref(barWrapStyles))
+      }, [
+        __props.startCollapsible ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass([unref(ns).e("collapse-icon"), unref(ns).e(`${__props.layout}-collapse-icon-start`)]),
+          onClick: ($event) => emit("collapse", __props.index, "start")
+        }, [
+          renderSlot(_ctx.$slots, "start-collapsible", {}, () => [
+            (openBlock(), createBlock(resolveDynamicComponent(unref(StartIcon)), { style: { "width": "12px", "height": "12px" } }))
+          ])
+        ], 10, ["onClick"])) : createCommentVNode("v-if", true),
+        createElementVNode("div", {
+          class: normalizeClass([
+            unref(ns).e("dragger"),
+            unref(draggerPseudoClass),
+            __props.resizable ? "" : unref(ns).e("disable")
+          ]),
+          style: normalizeStyle(unref(draggerStyles)),
+          onMousedown,
+          onTouchstart: onTouchStart
+        }, null, 38),
+        __props.endCollapsible ? (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: normalizeClass([unref(ns).e("collapse-icon"), unref(ns).e(`${__props.layout}-collapse-icon-end`)]),
+          onClick: ($event) => emit("collapse", __props.index, "end")
+        }, [
+          renderSlot(_ctx.$slots, "end-collapsible", {}, () => [
+            (openBlock(), createBlock(resolveDynamicComponent(unref(EndIcon)), { style: { "width": "12px", "height": "12px" } }))
+          ])
+        ], 10, ["onClick"])) : createCommentVNode("v-if", true)
+      ], 6);
+    };
+  }
+});
+var SplitBar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "split-bar.vue"]]);
+
+export { SplitBar as default };
+//# sourceMappingURL=split-bar.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"split-bar.mjs","sources":["../../../../../../packages/components/splitter/src/split-bar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport {\n  ArrowDown,\n  ArrowLeft,\n  ArrowRight,\n  ArrowUp,\n} from '@element-plus/icons-vue'\nimport { useNamespace } from '@element-plus/hooks'\n\nconst ns = useNamespace('splitter-bar')\n\ndefineOptions({\n  name: 'ElSplitterBar',\n})\n\nconst props = defineProps({\n  index: {\n    type: Number,\n    required: true,\n  },\n  layout: {\n    type: String,\n    values: ['horizontal', 'vertical'] as const,\n    default: 'horizontal',\n  },\n  resizable: {\n    type: Boolean,\n    default: true,\n  },\n  startCollapsible: {\n    type: Boolean,\n  },\n  endCollapsible: {\n    type: Boolean,\n  },\n})\n\nconst emit = defineEmits(['moveStart', 'moving', 'moveEnd', 'collapse'])\n\nconst isHorizontal = computed(() => props.layout === 'horizontal')\n\nconst barWrapStyles = computed(() => {\n  if (isHorizontal.value) {\n    return { width: 0 }\n  }\n  return { height: 0 }\n})\n\nconst draggerStyles = computed(() => {\n  return {\n    width: isHorizontal.value ? '16px' : '100%',\n    height: isHorizontal.value ? '100%' : '16px',\n    cursor: isHorizontal.value ? 'col-resize' : 'row-resize',\n    touchAction: 'none',\n  }\n})\n\nconst draggerPseudoClass = computed(() => {\n  const prefix = ns.e('dragger')\n  let className = isHorizontal.value\n    ? `${prefix}-horizontal`\n    : `${prefix}-vertical`\n  if (startPos.value) className += ` ${prefix}-active`\n  return className\n})\n\nconst startPos = ref<[x: number, y: number] | null>(null)\n\n// Start dragging\nconst onMousedown = (e: MouseEvent) => {\n  if (!props.resizable) return\n  startPos.value = [e.pageX, e.pageY]\n  emit('moveStart', props.index)\n  window.addEventListener('mouseup', onMouseUp)\n  window.addEventListener('mousemove', onMouseMove)\n}\n\nconst onTouchStart = (e: TouchEvent) => {\n  if (props.resizable && e.touches.length === 1) {\n    e.preventDefault()\n    const touch = e.touches[0]\n    startPos.value = [touch.pageX, touch.pageY]\n    emit('moveStart', props.index)\n    window.addEventListener('touchend', onTouchEnd)\n    window.addEventListener('touchmove', onTouchMove)\n  }\n}\n\n// During dragging\nconst onMouseMove = (e: MouseEvent) => {\n  const { pageX, pageY } = e\n  const offsetX = pageX - startPos.value![0]\n  const offsetY = pageY - startPos.value![1]\n  const offset = isHorizontal.value ? offsetX : offsetY\n  emit('moving', props.index, offset)\n}\n\nconst onTouchMove = (e: TouchEvent) => {\n  if (e.touches.length === 1) {\n    e.preventDefault()\n    const touch = e.touches[0]\n    const offsetX = touch.pageX - startPos.value![0]\n    const offsetY = touch.pageY - startPos.value![1]\n    const offset = isHorizontal.value ? offsetX : offsetY\n    emit('moving', props.index, offset)\n  }\n}\n\n// End dragging\nconst onMouseUp = () => {\n  startPos.value = null\n  window.removeEventListener('mouseup', onMouseUp)\n  window.removeEventListener('mousemove', onMouseMove)\n  emit('moveEnd', props.index)\n}\n\nconst onTouchEnd = () => {\n  startPos.value = null\n  window.removeEventListener('touchend', onTouchEnd)\n  window.removeEventListener('touchmove', onTouchMove)\n  emit('moveEnd', props.index)\n}\n\nconst StartIcon = computed(() => (isHorizontal.value ? ArrowLeft : ArrowUp))\nconst EndIcon = computed(() => (isHorizontal.value ? ArrowRight : ArrowDown))\n</script>\n\n<template>\n  <div :class=\"[ns.b()]\" :style=\"barWrapStyles\">\n    <div\n      v-if=\"startCollapsible\"\n      :class=\"[ns.e('collapse-icon'), ns.e(`${layout}-collapse-icon-start`)]\"\n      @click=\"emit('collapse', index, 'start')\"\n    >\n      <slot name=\"start-collapsible\">\n        <component :is=\"StartIcon\" style=\"width: 12px; height: 12px\" />\n      </slot>\n    </div>\n\n    <div\n      :class=\"[\n        ns.e('dragger'),\n        draggerPseudoClass,\n        resizable ? '' : ns.e('disable'),\n      ]\"\n      :style=\"draggerStyles\"\n      @mousedown=\"onMousedown\"\n      @touchstart=\"onTouchStart\"\n    />\n    <div\n      v-if=\"endCollapsible\"\n      :class=\"[ns.e('collapse-icon'), ns.e(`${layout}-collapse-icon-end`)]\"\n      @click=\"emit('collapse', index, 'end')\"\n    >\n      <slot name=\"end-collapsible\">\n        <component :is=\"EndIcon\" style=\"width: 12px; height: 12px\" />\n      </slot>\n    </div>\n  </div>\n</template>\n"],"names":[],"mappings":"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"}

package/es/components/splitter/src/split-bar.vue.d.ts

@@ -0,0 +1,67 @@
+declare function __VLS_template(): {
+    "start-collapsible"?(_: {}): any;
+    "end-collapsible"?(_: {}): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<{
+    index: {
+        type: NumberConstructor;
+        required: true;
+    };
+    layout: {
+        type: StringConstructor;
+        values: readonly ["horizontal", "vertical"];
+        default: string;
+    };
+    resizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    startCollapsible: {
+        type: BooleanConstructor;
+    };
+    endCollapsible: {
+        type: BooleanConstructor;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    collapse: (...args: any[]) => void;
+    moveStart: (...args: any[]) => void;
+    moving: (...args: any[]) => void;
+    moveEnd: (...args: any[]) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    index: {
+        type: NumberConstructor;
+        required: true;
+    };
+    layout: {
+        type: StringConstructor;
+        values: readonly ["horizontal", "vertical"];
+        default: string;
+    };
+    resizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    startCollapsible: {
+        type: BooleanConstructor;
+    };
+    endCollapsible: {
+        type: BooleanConstructor;
+    };
+}>> & {
+    onMoveStart?: ((...args: any[]) => any) | undefined;
+    onMoving?: ((...args: any[]) => any) | undefined;
+    onMoveEnd?: ((...args: any[]) => any) | undefined;
+    onCollapse?: ((...args: any[]) => any) | undefined;
+}, {
+    layout: string;
+    resizable: boolean;
+    startCollapsible: boolean;
+    endCollapsible: boolean;
+}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/components/splitter/src/split-panel.d.ts

@@ -0,0 +1,26 @@
+import type { ExtractPropTypes } from 'vue';
+import type SplitterPanel from './split-panel.vue';
+export declare const splitterPanelProps: {
+    readonly min: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly max: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly size: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly resizable: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly collapsible: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+};
+export type SplitterPanelProps = ExtractPropTypes<typeof splitterPanelProps>;
+export type SplitterPanelInstance = InstanceType<typeof SplitterPanel> & unknown;

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

@@ -0,0 +1,24 @@
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+
+const splitterPanelProps = buildProps({
+  min: {
+    type: [String, Number]
+  },
+  max: {
+    type: [String, Number]
+  },
+  size: {
+    type: [String, Number]
+  },
+  resizable: {
+    type: Boolean,
+    default: true
+  },
+  collapsible: {
+    type: Boolean,
+    default: false
+  }
+});
+
+export { splitterPanelProps };
+//# sourceMappingURL=split-panel.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"split-panel.mjs","sources":["../../../../../../packages/components/splitter/src/split-panel.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type SplitterPanel from './split-panel.vue'\n\nexport const splitterPanelProps = buildProps({\n  min: {\n    type: [String, Number],\n  },\n  max: {\n    type: [String, Number],\n  },\n  size: {\n    type: [String, Number],\n  },\n  resizable: {\n    type: Boolean,\n    default: true,\n  },\n  collapsible: {\n    type: Boolean,\n    default: false,\n  },\n} as const)\n\nexport type SplitterPanelProps = ExtractPropTypes<typeof splitterPanelProps>\nexport type SplitterPanelInstance = InstanceType<typeof SplitterPanel> & unknown\n"],"names":[],"mappings":";;AACY,MAAC,kBAAkB,GAAG,UAAU,CAAC;AAC7C,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,CAAC;;;;"}

package/es/components/splitter/src/split-panel.vue.d.ts

@@ -0,0 +1,62 @@
+declare function __VLS_template(): {
+    default?(_: {}): any;
+    "start-collapsible"?(_: {}): any;
+    "end-collapsible"?(_: {}): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<{
+    readonly min: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly max: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly size: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly resizable: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly collapsible: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:size": (value: number) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly min: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly max: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly size: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly resizable: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly collapsible: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+}>> & {
+    "onUpdate:size"?: ((value: number) => any) | undefined;
+}, {
+    readonly resizable: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    readonly collapsible: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,158 @@
+import { defineComponent, inject, toRefs, ref, getCurrentInstance, computed, watch, nextTick, reactive, onMounted, onUnmounted, openBlock, createElementBlock, Fragment, createElementVNode, mergeProps, unref, renderSlot, createBlock, withCtx, createCommentVNode } from 'vue';
+import { isCollapsible, getCollapsible } from './hooks/usePanel.mjs';
+import SplitBar from './split-bar.mjs';
+import { splitterPanelProps } from './split-panel.mjs';
+import { splitterRootContextKey } from './type.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { isPct, getPct, isPx, getPx } from './hooks/useSize.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { throwError } from '../../../utils/error.mjs';
+
+const COMPONENT_NAME = "ElSplitterPanel";
+const __default__ = defineComponent({
+  name: COMPONENT_NAME
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: splitterPanelProps,
+  emits: ["update:size"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const ns = useNamespace("splitter-panel");
+    const splitterContext = inject(splitterRootContextKey);
+    if (!splitterContext)
+      throwError(COMPONENT_NAME, "usage: <el-splitter><el-splitter-panel /></el-splitter/>");
+    const { panels, layout, containerSize, pxSizes } = toRefs(splitterContext);
+    const {
+      registerPanel,
+      sortPanel,
+      unregisterPanel,
+      onCollapse,
+      onMoveEnd,
+      onMoveStart,
+      onMoving
+    } = splitterContext;
+    const panelEl = ref();
+    const uid = getCurrentInstance().uid;
+    const index = ref(0);
+    const panel = computed(() => panels.value[index.value]);
+    const setIndex = (val) => {
+      index.value = val;
+    };
+    const panelSize = computed(() => {
+      var _a;
+      if (!panel.value)
+        return 0;
+      return (_a = pxSizes.value[index.value]) != null ? _a : 0;
+    });
+    const nextSize = computed(() => {
+      var _a;
+      if (!panel.value)
+        return 0;
+      return (_a = pxSizes.value[index.value + 1]) != null ? _a : 0;
+    });
+    const nextPanel = computed(() => {
+      if (panel.value) {
+        return panels.value[index.value + 1];
+      }
+      return null;
+    });
+    const isResizable = computed(() => {
+      var _a;
+      if (!nextPanel.value)
+        return false;
+      return props.resizable && ((_a = nextPanel.value) == null ? void 0 : _a.resizable) && (panelSize.value !== 0 || !props.min) && (nextSize.value !== 0 || !nextPanel.value.min);
+    });
+    const isShowBar = computed(() => {
+      if (!panel.value)
+        return false;
+      return index.value !== panels.value.length - 1;
+    });
+    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);
+      }
+      return str != null ? str : 0;
+    }
+    let isSizeUpdating = false;
+    watch(() => props.size, () => {
+      if (panel.value) {
+        const size = sizeToPx(props.size);
+        const maxSize = sizeToPx(props.max);
+        const minSize = sizeToPx(props.min);
+        const finalSize = Math.min(Math.max(size, minSize || 0), maxSize || size);
+        if (finalSize !== size) {
+          isSizeUpdating = true;
+          emits("update:size", finalSize);
+        }
+        panel.value.size = finalSize;
+        nextTick(() => isSizeUpdating = false);
+      }
+    });
+    watch(() => {
+      var _a;
+      return (_a = panel.value) == null ? void 0 : _a.size;
+    }, (val) => {
+      if (!isSizeUpdating && val !== props.size) {
+        emits("update:size", val);
+      }
+    });
+    watch(() => props.resizable, (val) => {
+      if (panel.value) {
+        panel.value.resizable = val;
+      }
+    });
+    const _panel = reactive({
+      el: panelEl.value,
+      uid,
+      setIndex,
+      ...props,
+      collapsible: getCollapsible(props.collapsible)
+    });
+    registerPanel(_panel);
+    onMounted(() => {
+      sortPanel(_panel);
+    });
+    onUnmounted(() => unregisterPanel == null ? void 0 : unregisterPanel(uid));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        createElementVNode("div", mergeProps({
+          ref_key: "panelEl",
+          ref: panelEl,
+          class: [unref(ns).b()],
+          style: { flexBasis: `${unref(panelSize)}px` }
+        }, _ctx.$attrs), [
+          renderSlot(_ctx.$slots, "default")
+        ], 16),
+        unref(isShowBar) ? (openBlock(), createBlock(SplitBar, {
+          key: 0,
+          index: index.value,
+          layout: unref(layout),
+          resizable: unref(isResizable),
+          "start-collapsible": unref(startCollapsible),
+          "end-collapsible": unref(endCollapsible),
+          onMoveStart: unref(onMoveStart),
+          onMoving: unref(onMoving),
+          onMoveEnd: unref(onMoveEnd),
+          onCollapse: unref(onCollapse)
+        }, {
+          "start-collapsible": withCtx(() => [
+            renderSlot(_ctx.$slots, "start-collapsible")
+          ]),
+          "end-collapsible": withCtx(() => [
+            renderSlot(_ctx.$slots, "end-collapsible")
+          ]),
+          _: 3
+        }, 8, ["index", "layout", "resizable", "start-collapsible", "end-collapsible", "onMoveStart", "onMoving", "onMoveEnd", "onCollapse"])) : createCommentVNode("v-if", true)
+      ], 64);
+    };
+  }
+});
+var SplitPanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "split-panel.vue"]]);
+
+export { SplitPanel as default };
+//# sourceMappingURL=split-panel2.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"split-panel2.mjs","sources":["../../../../../../packages/components/splitter/src/split-panel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  computed,\n  getCurrentInstance,\n  inject,\n  nextTick,\n  onMounted,\n  onUnmounted,\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 { splitterPanelProps } from './split-panel'\nimport { getPct, getPx, isPct, isPx } from './hooks'\nimport { splitterRootContextKey } from './type'\n\nconst ns = useNamespace('splitter-panel')\n\nconst COMPONENT_NAME = 'ElSplitterPanel'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = defineProps(splitterPanelProps)\n\nconst emits = defineEmits<{\n  (e: 'update:size', value: number): void\n}>()\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, containerSize, pxSizes } = toRefs(splitterContext)\n\nconst {\n  registerPanel,\n  sortPanel,\n  unregisterPanel,\n  onCollapse,\n  onMoveEnd,\n  onMoveStart,\n  onMoving,\n} = splitterContext\n\nconst panelEl = ref<HTMLDivElement>()\nconst uid = getCurrentInstance()!.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 (panel.value) {\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        isSizeUpdating = true\n        emits('update:size', finalSize)\n      }\n\n      panel.value.size = finalSize\n      nextTick(() => (isSizeUpdating = false))\n    }\n  }\n)\n\nwatch(\n  () => panel.value?.size,\n  (val) => {\n    if (!isSizeUpdating && val !== props.size) {\n      emits('update:size', val as number)\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  el: panelEl.value!,\n  uid,\n  setIndex,\n  ...props,\n  collapsible: getCollapsible(props.collapsible),\n})\n\nregisterPanel(_panel)\nonMounted(() => {\n  sortPanel(_panel)\n})\n\nonUnmounted(() => unregisterPanel?.(uid))\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    :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"],"names":["_openBlock","_createElementBlock","_Fragment","_createElementVNode","_mergeProps","_unref"],"mappings":"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"}

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

@@ -0,0 +1,7 @@
+import type { ExtractPropTypes } from 'vue';
+import type Splitter from './splitter.vue';
+export declare const splitterProps: {
+    readonly layout: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "horizontal", boolean>;
+};
+export type SplitterProps = ExtractPropTypes<typeof splitterProps>;
+export type SplitterInstance = InstanceType<typeof Splitter> & unknown;

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

@@ -0,0 +1,12 @@
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+
+const splitterProps = buildProps({
+  layout: {
+    type: String,
+    default: "horizontal",
+    values: ["horizontal", "vertical"]
+  }
+});
+
+export { splitterProps };
+//# sourceMappingURL=splitter.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"splitter.mjs","sources":["../../../../../../packages/components/splitter/src/splitter.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type Splitter from './splitter.vue'\n\nexport const splitterProps = buildProps({\n  layout: {\n    type: String,\n    default: 'horizontal',\n    values: ['horizontal', 'vertical'] as const,\n  },\n} as const)\n\nexport type SplitterProps = ExtractPropTypes<typeof splitterProps>\nexport type SplitterInstance = InstanceType<typeof Splitter> & unknown\n"],"names":[],"mappings":";;AACY,MAAC,aAAa,GAAG,UAAU,CAAC;AACxC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,YAAY;AACzB,IAAI,MAAM,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;AACtC,GAAG;AACH,CAAC;;;;"}