element-pe 2.2.67 → 2.2.69

package/es/components/resizable-columns/index.d.ts

@@ -75,12 +75,12 @@ export declare const ElResizableColumns: import("element-pe/es/utils").SFCWithIn
             maxWidth: number;
             parentWidth: number;
             index: number;
-            length: number;
             width: number;
             left: number;
             collapsable: import("element-pe/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
             collapsed: boolean;
         };
+        columnsCount: import("vue").ComputedRef<any>;
         handleCollapse: () => void;
         handleExpand: () => void;
     }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
@@ -131,12 +131,12 @@ export declare const ElResizableColumn: import("element-pe/es/utils").SFCWithIns
         maxWidth: number;
         parentWidth: number;
         index: number;
-        length: number;
         width: number;
         left: number;
         collapsable: import("element-pe/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
         collapsed: boolean;
     };
+    columnsCount: import("vue").ComputedRef<any>;
     handleCollapse: () => void;
     handleExpand: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{

package/es/components/resizable-columns/index.mjs

@@ -1,9 +1,9 @@
 import '../../utils/index.mjs';
-import ResizableColumns from './src/resizable-columns2.mjs';
-import ResizableColumn from './src/resizable-column.mjs';
-export { resizableColumnsProps } from './src/resizable-columns.mjs';
+import ResizableColumns from './src/resizable-columns.mjs';
+import ResizableColumn from './src/resizable-column2.mjs';
+export { resizableColumnsProps } from './src/resizable-columns2.mjs';
 export { resizableColumnsRootContextKey } from './src/constants.mjs';
-export { resizableColumnProps } from './src/resizable-column2.mjs';
+export { resizableColumnProps } from './src/resizable-column.mjs';
 import { withInstall, withNoopInstall } from '../../utils/vue/install.mjs';
 
 const ElResizableColumns = withInstall(ResizableColumns, {

package/es/components/resizable-columns/src/constants.d.ts

@@ -7,9 +7,7 @@ export declare type ResizableColumnContext = UnwrapRef<{
     slots: Slots;
     props: ResizableColumnProps;
     maxWidth: Ref<number>;
-    parentWidth: Ref<number | undefined>;
     index: Ref<number | undefined>;
-    length: Ref<number | undefined>;
     width: Ref<number | undefined>;
     left: Ref<number | undefined>;
     collapsed: ComputedRef<boolean>;
@@ -22,5 +20,6 @@ export interface ResizableColumnsRootContext {
     unregisterColumn: (uid: number) => void;
     handleCollapse: (column: ResizableColumnContext) => void;
     handleExpand: (column: ResizableColumnContext) => void;
+    initColumnSize: () => void;
 }
 export declare const resizableColumnsRootContextKey: InjectionKey<ResizableColumnsRootContext>;

package/es/components/resizable-columns/src/constants.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"constants.mjs","sources":["../../../../../../packages/components/resizable-columns/src/constants.ts"],"sourcesContent":["import type { ComputedRef, Ref, Slots, UnwrapRef } from 'vue'\nimport type { ResizableColumnProps } from './resizable-column'\nimport type { ResizableColumnsProps } from './resizable-columns'\nimport { InjectionKey } from 'vue'\n\nexport type ResizableColumnContext = UnwrapRef<{\n  uid: number\n  slots: Slots\n  props: ResizableColumnProps\n  maxWidth: Ref<number>\n  parentWidth: Ref<number | undefined>\n  index: Ref<number | undefined>\n  length: Ref<number | undefined>\n  width: Ref<number | undefined>\n  left: Ref<number | undefined>\n  collapsed: ComputedRef<boolean>\n  collapsable: ComputedRef<boolean>\n}>\n\nexport interface ResizableColumnsRootContext {\n  props: ResizableColumnsProps\n  columns: any\n  registerColumn: (pane: ResizableColumnContext) => void\n  unregisterColumn: (uid: number) => void\n  handleCollapse: (column: ResizableColumnContext) => void\n  handleExpand: (column: ResizableColumnContext) => void\n}\n\nexport const resizableColumnsRootContextKey: InjectionKey<ResizableColumnsRootContext> =\n  Symbol('resizableColumnsRootContextKey')\n"],"names":[],"mappings":"AAAY,MAAC,8BAA8B,GAAG,MAAM,CAAC,gCAAgC;;;;"}
+{"version":3,"file":"constants.mjs","sources":["../../../../../../packages/components/resizable-columns/src/constants.ts"],"sourcesContent":["import type { ComputedRef, Ref, Slots, UnwrapRef } from 'vue'\nimport type { ResizableColumnProps } from './resizable-column'\nimport type { ResizableColumnsProps } from './resizable-columns'\nimport { InjectionKey } from 'vue'\n\nexport type ResizableColumnContext = UnwrapRef<{\n  uid: number\n  slots: Slots\n  props: ResizableColumnProps\n  maxWidth: Ref<number>\n  index: Ref<number | undefined>\n  width: Ref<number | undefined>\n  left: Ref<number | undefined>\n  collapsed: ComputedRef<boolean>\n  collapsable: ComputedRef<boolean>\n}>\n\nexport interface ResizableColumnsRootContext {\n  props: ResizableColumnsProps\n  columns: any\n  registerColumn: (pane: ResizableColumnContext) => void\n  unregisterColumn: (uid: number) => void\n  handleCollapse: (column: ResizableColumnContext) => void\n  handleExpand: (column: ResizableColumnContext) => void\n  initColumnSize: () => void\n}\n\nexport const resizableColumnsRootContextKey: InjectionKey<ResizableColumnsRootContext> =\n  Symbol('resizableColumnsRootContextKey')\n"],"names":[],"mappings":"AAAY,MAAC,8BAA8B,GAAG,MAAM,CAAC,gCAAgC;;;;"}

package/es/components/resizable-columns/src/resizable-column.mjs

@@ -1,116 +1,12 @@
-import '../../../hooks/index.mjs';
-import { resizableColumnProps } from './resizable-column2.mjs';
-import { defineComponent, getCurrentInstance, inject, computed, ref, reactive, onMounted, onUnmounted, resolveComponent, openBlock, createElementBlock, Fragment, createElementVNode, normalizeClass, normalizeStyle, renderSlot, createBlock, withCtx, createVNode, createCommentVNode } from 'vue';
 import '../../../utils/index.mjs';
-import { resizableColumnsRootContextKey } from './constants.mjs';
-import { ArrowLeft, ArrowRight } from '@element-plus/icons-vue';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { throwError } from '../../../utils/error.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const _sfc_main = defineComponent({
-  name: "ElResizableColumn",
-  components: { ArrowLeft, ArrowRight },
-  props: resizableColumnProps,
-  setup(props, { slots }) {
-    const instance = getCurrentInstance();
-    const columnsRoot = inject(resizableColumnsRootContextKey);
-    if (!columnsRoot)
-      throwError("ElResizableColumn", "usage: <el-resizable-columns><el-resizable-column /></el-resizable-columns/>");
-    const collapsable = computed(() => props.collapsable || columnsRoot.props.collapsable);
-    const collapsed = ref(false);
-    const column = reactive({
-      uid: instance.uid,
-      slots,
-      props,
-      maxWidth: 0,
-      parentWidth: 0,
-      index: 0,
-      length: 0,
-      width: 0,
-      left: 0,
-      collapsable,
-      collapsed
-    });
-    onMounted(() => {
-      columnsRoot.registerColumn(column);
-    });
-    onUnmounted(() => {
-      columnsRoot.unregisterColumn(column.uid);
-    });
-    const ns = useNamespace("resizable-column");
-    const handleCollapse = () => {
-      columnsRoot.handleCollapse(column);
-    };
-    const handleExpand = () => {
-      columnsRoot.handleExpand(column);
-    };
-    return {
-      ns,
-      column,
-      handleCollapse,
-      handleExpand
-    };
-  }
+const resizableColumnProps = buildProps({
+  collapsable: Boolean,
+  widget: String,
+  maxWidth: String,
+  width: String
 });
-const _hoisted_1 = ["widget"];
-const _hoisted_2 = ["data-index"];
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_ArrowLeft = resolveComponent("ArrowLeft");
-  const _component_el_icon = resolveComponent("el-icon");
-  const _component_el_button = resolveComponent("el-button");
-  const _component_ArrowRight = resolveComponent("ArrowRight");
-  return openBlock(), createElementBlock(Fragment, null, [
-    createElementVNode("div", {
-      class: normalizeClass(_ctx.ns.b()),
-      widget: _ctx.widget,
-      style: normalizeStyle({ width: `${_ctx.column.width}px`, left: `${_ctx.column.left}px`, display: _ctx.column.collapsed ? "none" : "unset" })
-    }, [
-      renderSlot(_ctx.$slots, "default")
-    ], 14, _hoisted_1),
-    _ctx.column.index < _ctx.column.length - 1 ? (openBlock(), createElementBlock("div", {
-      key: 0,
-      class: normalizeClass(["resizer", { "collapsed": _ctx.column.collapsed }]),
-      style: normalizeStyle({ left: `${_ctx.column.left + (_ctx.column.collapsed ? 0 : _ctx.column.width)}px` }),
-      "data-index": _ctx.column.index
-    }, [
-      !_ctx.column.collapsed ? (openBlock(), createBlock(_component_el_button, {
-        key: 0,
-        class: "left",
-        size: "small",
-        onClick: _ctx.handleCollapse,
-        disabled: !_ctx.column.collapsable
-      }, {
-        default: withCtx(() => [
-          createVNode(_component_el_icon, null, {
-            default: withCtx(() => [
-              createVNode(_component_ArrowLeft)
-            ]),
-            _: 1
-          })
-        ]),
-        _: 1
-      }, 8, ["onClick", "disabled"])) : (openBlock(), createBlock(_component_el_button, {
-        key: 1,
-        class: "right",
-        size: "small",
-        onClick: _ctx.handleExpand,
-        disabled: !_ctx.column.collapsable
-      }, {
-        default: withCtx(() => [
-          createVNode(_component_el_icon, null, {
-            default: withCtx(() => [
-              createVNode(_component_ArrowRight)
-            ]),
-            _: 1
-          })
-        ]),
-        _: 1
-      }, 8, ["onClick", "disabled"]))
-    ], 14, _hoisted_2)) : createCommentVNode("v-if", true)
-  ], 64);
-}
-var ResizableColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\workspace\\element-pe\\packages\\components\\resizable-columns\\src\\resizable-column.vue"]]);
 
-export { ResizableColumn as default };
+export { resizableColumnProps };
 //# sourceMappingURL=resizable-column.mjs.map

package/es/components/resizable-columns/src/resizable-column.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"resizable-column.mjs","sources":["../../../../../../packages/components/resizable-columns/src/resizable-column.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"ns.b()\"\n    :widget=\"widget\"\n    :style=\"{ width: `${column.width}px`, left: `${column.left}px`, display: column.collapsed ? 'none' : 'unset' }\"\n  >\n    <slot />\n  </div>\n  <div v-if=\"column.index < column.length - 1\"\n       class=\"resizer\"\n       :class=\"{ 'collapsed': column.collapsed }\"\n       :style=\"{ left: `${column.left + (column.collapsed ? 0 : column.width)}px` }\"\n       :data-index=\"column.index\">\n    <el-button v-if=\"!column.collapsed\"\n               class=\"left\" size=\"small\"\n               @click=\"handleCollapse\"\n               :disabled=\"!column.collapsable\"\n    ><el-icon><ArrowLeft /></el-icon></el-button>\n    <el-button v-else\n               class=\"right\" size=\"small\"\n               @click=\"handleExpand\"\n               :disabled=\"!column.collapsable\"\n    ><el-icon><ArrowRight /></el-icon></el-button>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { useNamespace } from '@element-plus/hooks'\nimport { resizableColumnProps } from './resizable-column'\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  inject,\n  onMounted,\n  onUnmounted,\n  reactive,\n  ref\n} from 'vue'\nimport { throwError } from '../../../utils'\nimport { resizableColumnsRootContextKey } from './constants'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\n\n\nexport default defineComponent({\n  name: 'ElResizableColumn',\n  components: { ArrowLeft, ArrowRight },\n  props: resizableColumnProps,\n  setup(props, { slots }) {\n    const instance = getCurrentInstance()!\n\n    const columnsRoot = inject(resizableColumnsRootContextKey)\n    if (!columnsRoot)\n      throwError('ElResizableColumn', 'usage: <el-resizable-columns><el-resizable-column /></el-resizable-columns/>')\n\n    const collapsable = computed(() => props.collapsable || columnsRoot.props.collapsable)\n    const collapsed = ref(false)\n\n    const column = reactive({\n      uid: instance.uid,\n      slots,\n      props,\n      maxWidth: 0,\n      parentWidth: 0,\n      index: 0,\n      length: 0,\n      width: 0,\n      left: 0,\n      collapsable,\n      collapsed\n    })\n\n    onMounted(() => {\n      columnsRoot.registerColumn(column)\n    })\n\n    onUnmounted(() => {\n      columnsRoot.unregisterColumn(column.uid)\n    })\n\n    const ns = useNamespace('resizable-column')\n\n    const handleCollapse = () => {\n      columnsRoot.handleCollapse(column)\n    }\n    const handleExpand = () => {\n      columnsRoot.handleExpand(column)\n    }\n\n    return {\n      ns,\n      column,\n\n      handleCollapse,\n      handleExpand\n    }\n  }\n})\n</script>\n"],"names":["_createElementVNode","_normalizeClass","_normalizeStyle","_renderSlot","_openBlock","_createElementBlock","_createBlock","_createVNode","_withCtx"],"mappings":"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"}
+{"version":3,"file":"resizable-column.mjs","sources":["../../../../../../packages/components/resizable-columns/src/resizable-column.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type ResizableColumn from './resizable-column.vue'\n\nexport const resizableColumnProps = buildProps({\n  collapsable: Boolean,\n  widget: String,\n  maxWidth: String,\n  width: String\n} as const)\n\nexport type ResizableColumnProps = ExtractPropTypes<typeof resizableColumnProps>\n\nexport type ResizableColumnInstance = InstanceType<typeof ResizableColumn>\n"],"names":[],"mappings":";;;AACY,MAAC,oBAAoB,GAAG,UAAU,CAAC;AAC/C,EAAE,WAAW,EAAE,OAAO;AACtB,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,QAAQ,EAAE,MAAM;AAClB,EAAE,KAAK,EAAE,MAAM;AACf,CAAC;;;;"}

package/es/components/resizable-columns/src/resizable-column.vue.d.ts

@@ -37,12 +37,12 @@ declare const _default: import("vue").DefineComponent<{
         maxWidth: number;
         parentWidth: number;
         index: number;
-        length: number;
         width: number;
         left: number;
         collapsable: import("../../../utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
         collapsed: boolean;
     };
+    columnsCount: import("vue").ComputedRef<any>;
     handleCollapse: () => void;
     handleExpand: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{

package/es/components/resizable-columns/src/resizable-column2.mjs

@@ -1,12 +1,119 @@
+import '../../../hooks/index.mjs';
+import { resizableColumnProps } from './resizable-column.mjs';
+import { defineComponent, getCurrentInstance, inject, computed, ref, reactive, onMounted, onUnmounted, resolveComponent, openBlock, createElementBlock, Fragment, createElementVNode, normalizeClass, normalizeStyle, renderSlot, createBlock, withCtx, createVNode, createCommentVNode } from 'vue';
 import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { resizableColumnsRootContextKey } from './constants.mjs';
+import { ArrowLeft, ArrowRight } from '@element-plus/icons-vue';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { throwError } from '../../../utils/error.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const resizableColumnProps = buildProps({
-  collapsable: Boolean,
-  widget: String,
-  maxWidth: String,
-  width: String
+const _sfc_main = defineComponent({
+  name: "ElResizableColumn",
+  components: { ArrowLeft, ArrowRight },
+  props: resizableColumnProps,
+  setup(props, { slots }) {
+    const instance = getCurrentInstance();
+    const columnsRoot = inject(resizableColumnsRootContextKey);
+    if (!columnsRoot)
+      throwError("ElResizableColumn", "usage: <el-resizable-columns><el-resizable-column /></el-resizable-columns/>");
+    const collapsable = computed(() => props.collapsable || columnsRoot.props.collapsable);
+    const collapsed = ref(false);
+    const column = reactive({
+      uid: instance.uid,
+      slots,
+      props,
+      maxWidth: 0,
+      parentWidth: 0,
+      index: 0,
+      width: 0,
+      left: 0,
+      collapsable,
+      collapsed
+    });
+    onMounted(() => {
+      columnsRoot.registerColumn(column);
+      columnsRoot.initColumnSize();
+    });
+    onUnmounted(() => {
+      columnsRoot.unregisterColumn(column.uid);
+      columnsRoot.initColumnSize();
+    });
+    const columnsCount = computed(() => columnsRoot.columns.value.length);
+    const ns = useNamespace("resizable-column");
+    const handleCollapse = () => {
+      columnsRoot.handleCollapse(column);
+    };
+    const handleExpand = () => {
+      columnsRoot.handleExpand(column);
+    };
+    return {
+      ns,
+      column,
+      columnsCount,
+      handleCollapse,
+      handleExpand
+    };
+  }
 });
+const _hoisted_1 = ["widget"];
+const _hoisted_2 = ["data-index"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_ArrowLeft = resolveComponent("ArrowLeft");
+  const _component_el_icon = resolveComponent("el-icon");
+  const _component_el_button = resolveComponent("el-button");
+  const _component_ArrowRight = resolveComponent("ArrowRight");
+  return openBlock(), createElementBlock(Fragment, null, [
+    createElementVNode("div", {
+      class: normalizeClass(_ctx.ns.b()),
+      widget: _ctx.widget,
+      style: normalizeStyle({ width: `${_ctx.column.width}px`, left: `${_ctx.column.left}px`, display: _ctx.column.collapsed ? "none" : "unset" })
+    }, [
+      renderSlot(_ctx.$slots, "default")
+    ], 14, _hoisted_1),
+    _ctx.column.index < _ctx.columnsCount - 1 ? (openBlock(), createElementBlock("div", {
+      key: 0,
+      class: normalizeClass(["resizer", { "collapsed": _ctx.column.collapsed }]),
+      style: normalizeStyle({ left: `${_ctx.column.left + (_ctx.column.collapsed ? 0 : _ctx.column.width)}px` }),
+      "data-index": _ctx.column.index
+    }, [
+      !_ctx.column.collapsed ? (openBlock(), createBlock(_component_el_button, {
+        key: 0,
+        class: "left",
+        size: "small",
+        onClick: _ctx.handleCollapse,
+        disabled: !_ctx.column.collapsable
+      }, {
+        default: withCtx(() => [
+          createVNode(_component_el_icon, null, {
+            default: withCtx(() => [
+              createVNode(_component_ArrowLeft)
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }, 8, ["onClick", "disabled"])) : (openBlock(), createBlock(_component_el_button, {
+        key: 1,
+        class: "right",
+        size: "small",
+        onClick: _ctx.handleExpand,
+        disabled: !_ctx.column.collapsable
+      }, {
+        default: withCtx(() => [
+          createVNode(_component_el_icon, null, {
+            default: withCtx(() => [
+              createVNode(_component_ArrowRight)
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }, 8, ["onClick", "disabled"]))
+    ], 14, _hoisted_2)) : createCommentVNode("v-if", true)
+  ], 64);
+}
+var ResizableColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\workspace\\element-pe\\packages\\components\\resizable-columns\\src\\resizable-column.vue"]]);
 
-export { resizableColumnProps };
+export { ResizableColumn as default };
 //# sourceMappingURL=resizable-column2.mjs.map

package/es/components/resizable-columns/src/resizable-column2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"resizable-column2.mjs","sources":["../../../../../../packages/components/resizable-columns/src/resizable-column.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type ResizableColumn from './resizable-column.vue'\n\nexport const resizableColumnProps = buildProps({\n  collapsable: Boolean,\n  widget: String,\n  maxWidth: String,\n  width: String\n} as const)\n\nexport type ResizableColumnProps = ExtractPropTypes<typeof resizableColumnProps>\n\nexport type ResizableColumnInstance = InstanceType<typeof ResizableColumn>\n"],"names":[],"mappings":";;;AACY,MAAC,oBAAoB,GAAG,UAAU,CAAC;AAC/C,EAAE,WAAW,EAAE,OAAO;AACtB,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,QAAQ,EAAE,MAAM;AAClB,EAAE,KAAK,EAAE,MAAM;AACf,CAAC;;;;"}
+{"version":3,"file":"resizable-column2.mjs","sources":["../../../../../../packages/components/resizable-columns/src/resizable-column.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"ns.b()\"\n    :widget=\"widget\"\n    :style=\"{ width: `${column.width}px`, left: `${column.left}px`, display: column.collapsed ? 'none' : 'unset' }\"\n  >\n    <slot />\n  </div>\n  <div v-if=\"column.index < columnsCount - 1\"\n       class=\"resizer\"\n       :class=\"{ 'collapsed': column.collapsed }\"\n       :style=\"{ left: `${column.left + (column.collapsed ? 0 : column.width)}px` }\"\n       :data-index=\"column.index\">\n    <el-button v-if=\"!column.collapsed\"\n               class=\"left\" size=\"small\"\n               @click=\"handleCollapse\"\n               :disabled=\"!column.collapsable\"\n    ><el-icon><ArrowLeft /></el-icon></el-button>\n    <el-button v-else\n               class=\"right\" size=\"small\"\n               @click=\"handleExpand\"\n               :disabled=\"!column.collapsable\"\n    ><el-icon><ArrowRight /></el-icon></el-button>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { useNamespace } from '@element-plus/hooks'\nimport { resizableColumnProps } from './resizable-column'\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  inject,\n  onMounted,\n  onUnmounted,\n  reactive,\n  ref\n} from 'vue'\nimport { throwError } from '../../../utils'\nimport { resizableColumnsRootContextKey } from './constants'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\n\n\nexport default defineComponent({\n  name: 'ElResizableColumn',\n  components: { ArrowLeft, ArrowRight },\n  props: resizableColumnProps,\n  setup(props, { slots }) {\n    const instance = getCurrentInstance()!\n\n    const columnsRoot = inject(resizableColumnsRootContextKey)\n    if (!columnsRoot)\n      throwError('ElResizableColumn', 'usage: <el-resizable-columns><el-resizable-column /></el-resizable-columns/>')\n\n    const collapsable = computed(() => props.collapsable || columnsRoot.props.collapsable)\n    const collapsed = ref(false)\n\n    const column = reactive({\n      uid: instance.uid,\n      slots,\n      props,\n      maxWidth: 0,\n      parentWidth: 0,\n      index: 0,\n      width: 0,\n      left: 0,\n      collapsable,\n      collapsed\n    })\n\n    onMounted(() => {\n      columnsRoot.registerColumn(column)\n      columnsRoot.initColumnSize()\n    })\n\n    onUnmounted(() => {\n      columnsRoot.unregisterColumn(column.uid)\n      columnsRoot.initColumnSize()\n    })\n\n    const columnsCount = computed(() => columnsRoot.columns.value.length)\n\n    const ns = useNamespace('resizable-column')\n\n    const handleCollapse = () => {\n      columnsRoot.handleCollapse(column)\n    }\n    const handleExpand = () => {\n      columnsRoot.handleExpand(column)\n    }\n\n    return {\n      ns,\n      column,\n      columnsCount,\n\n      handleCollapse,\n      handleExpand\n    }\n  }\n})\n</script>\n"],"names":["_createElementVNode","_normalizeClass","_normalizeStyle","_renderSlot","_openBlock","_createElementBlock","_createBlock","_createVNode","_withCtx"],"mappings":"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"}

package/es/components/resizable-columns/src/resizable-columns.mjs

@@ -1,17 +1,242 @@
-import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, ref, getCurrentInstance, provide, reactive, onMounted, openBlock, createElementBlock, normalizeClass, renderSlot } from 'vue';
+import '../../../hooks/index.mjs';
+import { resizableColumnsRootContextKey } from './constants.mjs';
+import { resizableColumnsProps } from './resizable-columns2.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { useOrderedChildren } from '../../../hooks/use-ordered-children/index.mjs';
 
-const resizableColumnsProps = buildProps({
-  collapsable: {
-    type: Boolean,
-    default: true
-  },
-  widget: String,
-  minWidth: {
-    type: Number,
-    default: 50
+const _sfc_main = defineComponent({
+  name: "ElResizableColumns",
+  props: resizableColumnsProps,
+  emits: ["collapse", "expand"],
+  setup(props, { emit }) {
+    const ns = useNamespace("resizable-columns");
+    const MIN_WIDTH = props.minWidth > 0 ? props.minWidth : 50;
+    const columnsContainer = ref(null);
+    const parentWidth = ref(0);
+    const {
+      children: columns,
+      addChild: registerColumn,
+      removeChild: unregisterColumn
+    } = useOrderedChildren(getCurrentInstance(), "ElResizableColumn");
+    const handleCollapse = (column) => {
+      if (!column.collapsed) {
+        for (let rIndex = column.index + 1; rIndex < columns.value.length; rIndex++) {
+          const rColumn = columns.value[rIndex];
+          if (!rColumn.collapsed) {
+            rColumn.left = rColumn.left - column.width;
+            rColumn.width = rColumn.width + column.width;
+            break;
+          } else {
+            rColumn.left = rColumn.left - column.width;
+          }
+        }
+        column.collapsed = true;
+        emit("collapse", column.index);
+      }
+    };
+    const handleExpand = (column) => {
+      if (column.collapsed) {
+        column.collapsed = false;
+        const rightColumn = columns.value[column.index + 1];
+        rightColumn.left = rightColumn.left + column.width;
+        rightColumn.width = rightColumn.width > column.width + MIN_WIDTH ? rightColumn.width - column.width : MIN_WIDTH;
+        const allOtherColumns = columns.value.slice(column.index + 2);
+        const otherWidth = (parentWidth.value - rightColumn.left - rightColumn.width) / allOtherColumns.length;
+        allOtherColumns.forEach((item, index) => {
+          item.left = index * otherWidth + rightColumn.left + rightColumn.width;
+          item.width = otherWidth;
+        });
+        emit("expand", column.index);
+      }
+    };
+    const initColumnSize = () => {
+      let remainWidth = parentWidth.value;
+      columns.value.forEach((item, index) => {
+        if (item.props.maxWidth) {
+          if (item.props.maxWidth.endsWith("px")) {
+            item.maxWidth = Number.parseInt(item.props.maxWidth.slice(0, Math.max(0, item.props.maxWidth.length - 2)));
+          } else if (item.props.maxWidth.endsWith("%")) {
+            item.maxWidth = Number.parseInt(item.props.maxWidth.slice(0, Math.max(0, item.props.maxWidth.length - 1))) / 100 * parentWidth.value;
+          }
+        }
+        if (columns.value.length === 1) {
+          item.width = parentWidth.value;
+        } else {
+          if (item.props.width && item.props.width.endsWith("px")) {
+            item.width = Number.parseInt(item.props.width.slice(0, Math.max(0, item.props.width.length - 2)));
+          } else if (item.props.width && item.props.width.endsWith("%")) {
+            item.width = Number.parseInt(item.props.width.slice(0, Math.max(0, item.props.width.length - 1))) / 100 * parentWidth.value;
+          } else {
+            item.width = remainWidth / (columns.value.length - index);
+          }
+        }
+        item.left = parentWidth.value - remainWidth;
+        remainWidth -= item.width;
+        item.index = index;
+        item.collapsed = false;
+      });
+    };
+    provide(resizableColumnsRootContextKey, {
+      props,
+      columns,
+      registerColumn,
+      unregisterColumn,
+      handleCollapse,
+      handleExpand,
+      initColumnSize
+    });
+    const resizeConfig = reactive({
+      last: {
+        pos: 0,
+        index: 0
+      }
+    });
+    onMounted(() => {
+      if (columnsContainer.value) {
+        const resizeObserver = new ResizeObserver((entries) => {
+          for (const entry of entries) {
+            const width = entry.contentRect.width;
+            parentWidth.value = width;
+            initColumnSize();
+          }
+        });
+        resizeObserver.observe(columnsContainer.value);
+      }
+    });
+    const handleMousedown = (e) => {
+      const index = e.target.dataset.index;
+      if (index !== null && index !== void 0) {
+        if (columns.value[index].collapsed) {
+          return;
+        }
+        document.onselectstart = () => false;
+        document.ondragstart = () => false;
+        resizeConfig.last.pos = e.clientX;
+        resizeConfig.last.index = Number.parseInt(index);
+        document.addEventListener("mousemove", handleMousemove);
+        document.addEventListener("mouseup", handleMouseup);
+      }
+    };
+    const handleMousemove = (e) => {
+      const index = resizeConfig.last.index;
+      let offsetX = e.clientX - resizeConfig.last.pos;
+      let leftIndex = index;
+      while (leftIndex >= 0 && columns.value[leftIndex].width <= MIN_WIDTH) {
+        leftIndex--;
+      }
+      let rightIndex = index + 1;
+      while (rightIndex < columns.value.length && columns.value[rightIndex].width <= MIN_WIDTH) {
+        rightIndex++;
+      }
+      if (leftIndex < 0 && offsetX < 0) {
+        return;
+      }
+      if (rightIndex >= columns.value.length && offsetX > 0) {
+        return;
+      }
+      if (offsetX < 0) {
+        const newLeftWidth = columns.value[leftIndex].width + offsetX;
+        const newRightWidth = columns.value[leftIndex + 1].width - offsetX;
+        const rightMaxWidth = columns.value[leftIndex + 1].maxWidth;
+        if (newLeftWidth <= MIN_WIDTH) {
+          offsetX = MIN_WIDTH - columns.value[leftIndex].width;
+          columns.value[leftIndex].width = MIN_WIDTH;
+        } else if (rightMaxWidth > 0 && newRightWidth > rightMaxWidth) {
+          offsetX = rightMaxWidth - columns.value[leftIndex + 1].width;
+          columns.value[leftIndex].width = columns.value[leftIndex].width + offsetX;
+        } else {
+          columns.value[leftIndex].width = newLeftWidth;
+        }
+        for (let i = index; i > leftIndex; i--) {
+          columns.value[i].left = columns.value[i].left + offsetX;
+        }
+        columns.value[index + 1].width = columns.value[index + 1].width - offsetX;
+        columns.value[index + 1].left = columns.value[index + 1].left + offsetX;
+        resizeConfig.last.pos = e.clientX;
+      } else if (offsetX > 0) {
+        const newRightWidth = columns.value[rightIndex].width - offsetX;
+        const newLeftWidth = columns.value[rightIndex - 1].width + offsetX;
+        const leftMaxWidth = columns.value[rightIndex - 1].maxWidth;
+        if (newRightWidth <= MIN_WIDTH) {
+          offsetX = columns.value[rightIndex].width - MIN_WIDTH;
+          columns.value[rightIndex].width = MIN_WIDTH;
+        } else if (leftMaxWidth > 0 && newLeftWidth > leftMaxWidth) {
+          offsetX = leftMaxWidth - columns.value[rightIndex - 1].width;
+          columns.value[rightIndex].width = columns.value[rightIndex].width - offsetX;
+        } else {
+          columns.value[rightIndex].width = newRightWidth;
+        }
+        for (let i = index + 1; i <= rightIndex; i++) {
+          columns.value[i].left = columns.value[i].left + offsetX;
+        }
+        columns.value[index].width = columns.value[index].width + offsetX;
+        resizeConfig.last.pos = e.clientX;
+      }
+    };
+    const handleMouseup = () => {
+      document.onselectstart = null;
+      document.ondragstart = null;
+      document.removeEventListener("mousemove", handleMousemove);
+      document.removeEventListener("mousemove", handleMouseup);
+    };
+    const setColumnWidth = (columnIndex, width) => {
+      setTimeout(() => {
+        let remainWidth = parentWidth.value;
+        columns.value.forEach((item, index) => {
+          if (columnIndex === index) {
+            if (width.endsWith("px")) {
+              item.width = Number.parseInt(width.slice(0, Math.max(0, width.length - 2)));
+            } else if (width && width.endsWith("%")) {
+              item.width = Number.parseInt(width.slice(0, Math.max(0, width.length - 1))) / 100 * parentWidth.value;
+            } else {
+              item.width = remainWidth / (columns.value.length - index);
+            }
+          } else {
+            item.width = remainWidth / (columns.value.length - index);
+          }
+          item.left = parentWidth.value - remainWidth;
+          remainWidth -= item.width;
+        });
+      });
+    };
+    const toggleColumnCollapse = (columnIndex, collapse) => {
+      setTimeout(() => {
+        if (columnIndex >= 0 && columnIndex < columns.value.length - 1) {
+          const column = columns.value[columnIndex];
+          if (column) {
+            const toCol = collapse !== void 0 ? collapse : !column.collapsed;
+            if (toCol) {
+              handleCollapse(column);
+            } else {
+              handleExpand(column);
+            }
+          }
+        }
+      });
+    };
+    return {
+      ns,
+      columnsContainer,
+      handleMousedown,
+      setColumnWidth,
+      toggleColumnCollapse
+    };
   }
 });
+const _hoisted_1 = ["widget"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    ref: "columnsContainer",
+    class: normalizeClass(_ctx.ns.b()),
+    widget: _ctx.widget,
+    onMousedown: _cache[0] || (_cache[0] = (...args) => _ctx.handleMousedown && _ctx.handleMousedown(...args))
+  }, [
+    renderSlot(_ctx.$slots, "default")
+  ], 42, _hoisted_1);
+}
+var ResizableColumns = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\workspace\\element-pe\\packages\\components\\resizable-columns\\src\\resizable-columns.vue"]]);
 
-export { resizableColumnsProps };
+export { ResizableColumns as default };
 //# sourceMappingURL=resizable-columns.mjs.map