element-pe 2.2.78 → 2.2.79

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/row/index.d.ts

@@ -2,13 +2,23 @@ export declare const ElRow: import("element-pe/es/utils").SFCWithInstall<import(
     readonly tag: import("element-pe/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "div", boolean>;
     readonly gutter: import("element-pe/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
     readonly justify: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown, "start", boolean>;
-    readonly align: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "middle", unknown, "top", boolean>;
+    readonly align: {
+        readonly type: import("vue").PropType<import("element-pe/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }, {
     props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
         readonly tag: import("element-pe/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "div", boolean>;
         readonly gutter: import("element-pe/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
         readonly justify: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown, "start", boolean>;
-        readonly align: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "middle", unknown, "top", boolean>;
+        readonly align: {
+            readonly type: import("vue").PropType<import("element-pe/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
     }>> & {
         [x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
     }>>;
@@ -37,12 +47,16 @@ export declare const ElRow: import("element-pe/es/utils").SFCWithInstall<import(
     readonly tag: import("element-pe/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "div", boolean>;
     readonly gutter: import("element-pe/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
     readonly justify: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown, "start", boolean>;
-    readonly align: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "middle", unknown, "top", boolean>;
+    readonly align: {
+        readonly type: import("vue").PropType<import("element-pe/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }>>, {
     readonly justify: import("element-pe/es/utils").EpPropMergeType<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown>;
     readonly tag: string;
     readonly gutter: number;
-    readonly align: import("element-pe/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>;
 }>> & Record<string, any>;
 export default ElRow;
 export * from './src/row';

package/es/components/row/index.mjs

@@ -1,6 +1,6 @@
 import '../../utils/index.mjs';
-import Row from './src/row2.mjs';
-export { RowAlign, RowJustify, rowProps } from './src/row.mjs';
+import Row from './src/row.mjs';
+export { RowAlign, RowJustify, rowProps } from './src/row2.mjs';
 export { rowContextKey } from './src/constants.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';
 

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

@@ -6,7 +6,12 @@ export declare const rowProps: {
     readonly tag: import("element-pe/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "div", boolean>;
     readonly gutter: import("element-pe/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
     readonly justify: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown, "start", boolean>;
-    readonly align: import("element-pe/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "middle", unknown, "top", boolean>;
+    readonly align: {
+        readonly type: import("vue").PropType<import("element-pe/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 };
 export declare type RowProps = ExtractPropTypes<typeof rowProps>;
 export declare type RowInstance = InstanceType<typeof Row>;

package/es/components/row/src/row.mjs

@@ -1,35 +1,50 @@
-import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, computed, provide, openBlock, createBlock, resolveDynamicComponent, normalizeClass, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
+import '../../../hooks/index.mjs';
+import { rowContextKey } from './constants.mjs';
+import { rowProps } from './row2.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const RowJustify = [
-  "start",
-  "center",
-  "end",
-  "space-around",
-  "space-between",
-  "space-evenly"
-];
-const RowAlign = ["top", "middle", "bottom"];
-const rowProps = buildProps({
-  tag: {
-    type: String,
-    default: "div"
-  },
-  gutter: {
-    type: Number,
-    default: 0
-  },
-  justify: {
-    type: String,
-    values: RowJustify,
-    default: "start"
-  },
-  align: {
-    type: String,
-    values: RowAlign,
-    default: "top"
+const __default__ = defineComponent({
+  name: "ElRow"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: rowProps,
+  setup(__props) {
+    const props = __props;
+    const ns = useNamespace("row");
+    const gutter = computed(() => props.gutter);
+    provide(rowContextKey, {
+      gutter
+    });
+    const style = computed(() => {
+      const styles = {};
+      if (!props.gutter) {
+        return styles;
+      }
+      styles.marginRight = styles.marginLeft = `-${props.gutter / 2}px`;
+      return styles;
+    });
+    const rowKls = computed(() => [
+      ns.b(),
+      ns.is(`justify-${props.justify}`, props.justify !== "start"),
+      ns.is(`align-${props.align}`, !!props.align)
+    ]);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
+        class: normalizeClass(unref(rowKls)),
+        style: normalizeStyle(unref(style))
+      }, {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["class", "style"]);
+    };
   }
 });
+var Row = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "D:\\workspace\\element-pe\\packages\\components\\row\\src\\row.vue"]]);
 
-export { RowAlign, RowJustify, rowProps };
+export { Row as default };
 //# sourceMappingURL=row.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"row.mjs","sources":["../../../../../../packages/components/row/src/row.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type Row from './row.vue'\n\nexport const RowJustify = [\n  'start',\n  'center',\n  'end',\n  'space-around',\n  'space-between',\n  'space-evenly',\n] as const\n\nexport const RowAlign = ['top', 'middle', 'bottom'] as const\n\nexport const rowProps = buildProps({\n  /**\n   * @description custom element tag\n   */\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  /**\n   * @description grid spacing\n   */\n  gutter: {\n    type: Number,\n    default: 0,\n  },\n  /**\n   * @description horizontal alignment of flex layout\n   */\n  justify: {\n    type: String,\n    values: RowJustify,\n    default: 'start',\n  },\n  /**\n   * @description vertical alignment of flex layout\n   */\n  align: {\n    type: String,\n    values: RowAlign,\n    default: 'top',\n  },\n} as const)\n\nexport type RowProps = ExtractPropTypes<typeof rowProps>\nexport type RowInstance = InstanceType<typeof Row>\n"],"names":[],"mappings":";;;AACY,MAAC,UAAU,GAAG;AAC1B,EAAE,OAAO;AACT,EAAE,QAAQ;AACV,EAAE,KAAK;AACP,EAAE,cAAc;AAChB,EAAE,eAAe;AACjB,EAAE,cAAc;AAChB,EAAE;AACU,MAAC,QAAQ,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE;AACxC,MAAC,QAAQ,GAAG,UAAU,CAAC;AACnC,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,UAAU;AACtB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,QAAQ;AACpB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"row.mjs","sources":["../../../../../../packages/components/row/src/row.vue"],"sourcesContent":["<template>\n  <component :is=\"tag\" :class=\"rowKls\" :style=\"style\">\n    <slot />\n  </component>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, provide } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { rowContextKey } from './constants'\nimport { rowProps } from './row'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElRow',\n})\n\nconst props = defineProps(rowProps)\n\nconst ns = useNamespace('row')\nconst gutter = computed(() => props.gutter)\n\nprovide(rowContextKey, {\n  gutter,\n})\n\nconst style = computed(() => {\n  const styles: CSSProperties = {}\n  if (!props.gutter) {\n    return styles\n  }\n\n  styles.marginRight = styles.marginLeft = `-${props.gutter / 2}px`\n  return styles\n})\n\nconst rowKls = computed(() => [\n  ns.b(),\n  ns.is(`justify-${props.justify}`, props.justify !== 'start'),\n  ns.is(`align-${props.align}`, !!props.align),\n])\n</script>\n"],"names":[],"mappings":";;;;;;;mCAac,CAAA;AAAA,EACZ,IAAM,EAAA,OAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,EAAA,GAAK,aAAa,KAAK,CAAA,CAAA;AAC7B,IAAA,MAAM,MAAS,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,MAAM,CAAA,CAAA;AAE1C,IAAA,OAAA,CAAQ,aAAe,EAAA;AAAA,MACrB,MAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,SAAS,MAAM;AAC3B,MAAA,MAAM,SAAwB,EAAC,CAAA;AAC/B,MAAI,IAAA,CAAC,MAAM,MAAQ,EAAA;AACjB,QAAO,OAAA,MAAA,CAAA;AAAA,OACT;AAEA,MAAA,MAAA,CAAO,WAAc,GAAA,MAAA,CAAO,UAAa,GAAA,CAAA,CAAA,EAAI,MAAM,MAAS,GAAA,CAAA,CAAA,EAAA,CAAA,CAAA;AAC5D,MAAO,OAAA,MAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,SAAS,MAAM;AAAA,MAC5B,GAAG,CAAE,EAAA;AAAA,MACL,GAAG,EAAG,CAAA,CAAA,QAAA,EAAW,MAAM,OAAW,CAAA,CAAA,EAAA,KAAA,CAAM,YAAY,OAAO,CAAA;AAAA,MAC3D,EAAA,CAAG,GAAG,CAAS,MAAA,EAAA,KAAA,CAAM,SAAS,CAAC,CAAC,MAAM,KAAK,CAAA;AAAA,KAC5C,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}

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

@@ -3,13 +3,23 @@ declare const _default: import("vue").DefineComponent<{
     readonly tag: import("../../../utils").EpPropFinalized<StringConstructor, unknown, unknown, "div", boolean>;
     readonly gutter: import("../../../utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
     readonly justify: import("../../../utils").EpPropFinalized<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown, "start", boolean>;
-    readonly align: import("../../../utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "middle", unknown, "top", boolean>;
+    readonly align: {
+        readonly type: import("vue").PropType<import("../../../utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }, {
     props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
         readonly tag: import("../../../utils").EpPropFinalized<StringConstructor, unknown, unknown, "div", boolean>;
         readonly gutter: import("../../../utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
         readonly justify: import("../../../utils").EpPropFinalized<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown, "start", boolean>;
-        readonly align: import("../../../utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "middle", unknown, "top", boolean>;
+        readonly align: {
+            readonly type: import("vue").PropType<import("../../../utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
     }>> & {
         [x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
     }>>;
@@ -38,11 +48,15 @@ declare const _default: import("vue").DefineComponent<{
     readonly tag: import("../../../utils").EpPropFinalized<StringConstructor, unknown, unknown, "div", boolean>;
     readonly gutter: import("../../../utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
     readonly justify: import("../../../utils").EpPropFinalized<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown, "start", boolean>;
-    readonly align: import("../../../utils").EpPropFinalized<StringConstructor, "top" | "bottom" | "middle", unknown, "top", boolean>;
+    readonly align: {
+        readonly type: import("vue").PropType<import("../../../utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }>>, {
     readonly justify: import("../../../utils").EpPropMergeType<StringConstructor, "center" | "space-around" | "space-between" | "space-evenly" | "end" | "start", unknown>;
     readonly tag: string;
     readonly gutter: number;
-    readonly align: import("../../../utils").EpPropMergeType<StringConstructor, "top" | "bottom" | "middle", unknown>;
 }>;
 export default _default;

package/es/components/row/src/row2.mjs

@@ -1,50 +1,34 @@
-import { defineComponent, computed, provide, openBlock, createBlock, resolveDynamicComponent, normalizeClass, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
-import '../../../hooks/index.mjs';
-import { rowContextKey } from './constants.mjs';
-import { rowProps } from './row.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import '../../../utils/index.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const __default__ = defineComponent({
-  name: "ElRow"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: rowProps,
-  setup(__props) {
-    const props = __props;
-    const ns = useNamespace("row");
-    const gutter = computed(() => props.gutter);
-    provide(rowContextKey, {
-      gutter
-    });
-    const style = computed(() => {
-      const styles = {};
-      if (!props.gutter) {
-        return styles;
-      }
-      styles.marginRight = styles.marginLeft = `-${props.gutter / 2}px`;
-      return styles;
-    });
-    const rowKls = computed(() => [
-      ns.b(),
-      ns.is(`justify-${props.justify}`, props.justify !== "start"),
-      ns.is(`align-${props.align}`, props.align !== "top")
-    ]);
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
-        class: normalizeClass(unref(rowKls)),
-        style: normalizeStyle(unref(style))
-      }, {
-        default: withCtx(() => [
-          renderSlot(_ctx.$slots, "default")
-        ]),
-        _: 3
-      }, 8, ["class", "style"]);
-    };
+const RowJustify = [
+  "start",
+  "center",
+  "end",
+  "space-around",
+  "space-between",
+  "space-evenly"
+];
+const RowAlign = ["top", "middle", "bottom"];
+const rowProps = buildProps({
+  tag: {
+    type: String,
+    default: "div"
+  },
+  gutter: {
+    type: Number,
+    default: 0
+  },
+  justify: {
+    type: String,
+    values: RowJustify,
+    default: "start"
+  },
+  align: {
+    type: String,
+    values: RowAlign
   }
 });
-var Row = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "D:\\workspace\\element-pe\\packages\\components\\row\\src\\row.vue"]]);
 
-export { Row as default };
+export { RowAlign, RowJustify, rowProps };
 //# sourceMappingURL=row2.mjs.map

package/es/components/row/src/row2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"row2.mjs","sources":["../../../../../../packages/components/row/src/row.vue"],"sourcesContent":["<template>\n  <component :is=\"tag\" :class=\"rowKls\" :style=\"style\">\n    <slot />\n  </component>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, provide } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { rowContextKey } from './constants'\nimport { rowProps } from './row'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElRow',\n})\n\nconst props = defineProps(rowProps)\n\nconst ns = useNamespace('row')\nconst gutter = computed(() => props.gutter)\n\nprovide(rowContextKey, {\n  gutter,\n})\n\nconst style = computed(() => {\n  const styles: CSSProperties = {}\n  if (!props.gutter) {\n    return styles\n  }\n\n  styles.marginRight = styles.marginLeft = `-${props.gutter / 2}px`\n  return styles\n})\n\nconst rowKls = computed(() => [\n  ns.b(),\n  ns.is(`justify-${props.justify}`, props.justify !== 'start'),\n  ns.is(`align-${props.align}`, props.align !== 'top'),\n])\n</script>\n"],"names":[],"mappings":";;;;;;;mCAac,CAAA;AAAA,EACZ,IAAM,EAAA,OAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,EAAA,GAAK,aAAa,KAAK,CAAA,CAAA;AAC7B,IAAA,MAAM,MAAS,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,MAAM,CAAA,CAAA;AAE1C,IAAA,OAAA,CAAQ,aAAe,EAAA;AAAA,MACrB,MAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,SAAS,MAAM;AAC3B,MAAA,MAAM,SAAwB,EAAC,CAAA;AAC/B,MAAI,IAAA,CAAC,MAAM,MAAQ,EAAA;AACjB,QAAO,OAAA,MAAA,CAAA;AAAA,OACT;AAEA,MAAA,MAAA,CAAO,WAAc,GAAA,MAAA,CAAO,UAAa,GAAA,CAAA,CAAA,EAAI,MAAM,MAAS,GAAA,CAAA,CAAA,EAAA,CAAA,CAAA;AAC5D,MAAO,OAAA,MAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,SAAS,MAAM;AAAA,MAC5B,GAAG,CAAE,EAAA;AAAA,MACL,GAAG,EAAG,CAAA,CAAA,QAAA,EAAW,MAAM,OAAW,CAAA,CAAA,EAAA,KAAA,CAAM,YAAY,OAAO,CAAA;AAAA,MAC3D,GAAG,EAAG,CAAA,CAAA,MAAA,EAAS,MAAM,KAAS,CAAA,CAAA,EAAA,KAAA,CAAM,UAAU,KAAK,CAAA;AAAA,KACpD,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"row2.mjs","sources":["../../../../../../packages/components/row/src/row.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type Row from './row.vue'\n\nexport const RowJustify = [\n  'start',\n  'center',\n  'end',\n  'space-around',\n  'space-between',\n  'space-evenly',\n] as const\n\nexport const RowAlign = ['top', 'middle', 'bottom'] as const\n\nexport const rowProps = buildProps({\n  /**\n   * @description custom element tag\n   */\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  /**\n   * @description grid spacing\n   */\n  gutter: {\n    type: Number,\n    default: 0,\n  },\n  /**\n   * @description horizontal alignment of flex layout\n   */\n  justify: {\n    type: String,\n    values: RowJustify,\n    default: 'start',\n  },\n  /**\n   * @description vertical alignment of flex layout\n   */\n  align: {\n    type: String,\n    values: RowAlign,\n  },\n} as const)\n\nexport type RowProps = ExtractPropTypes<typeof rowProps>\nexport type RowInstance = InstanceType<typeof Row>\n"],"names":[],"mappings":";;;AACY,MAAC,UAAU,GAAG;AAC1B,EAAE,OAAO;AACT,EAAE,QAAQ;AACV,EAAE,KAAK;AACP,EAAE,cAAc;AAChB,EAAE,eAAe;AACjB,EAAE,cAAc;AAChB,EAAE;AACU,MAAC,QAAQ,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE;AACxC,MAAC,QAAQ,GAAG,UAAU,CAAC;AACnC,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,UAAU;AACtB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,QAAQ;AACpB,GAAG;AACH,CAAC;;;;"}

package/es/components/scrollbar/index.mjs

@@ -1,7 +1,7 @@
 import '../../utils/index.mjs';
-import Scrollbar from './src/scrollbar.mjs';
+import Scrollbar from './src/scrollbar2.mjs';
 export { BAR_MAP, GAP, renderThumbStyle } from './src/util.mjs';
-export { scrollbarEmits, scrollbarProps } from './src/scrollbar2.mjs';
+export { scrollbarEmits, scrollbarProps } from './src/scrollbar.mjs';
 export { thumbProps } from './src/thumb.mjs';
 export { scrollbarContextKey } from './src/constants.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';

package/es/components/scrollbar/src/bar.mjs

@@ -1,47 +1,22 @@
-import { defineComponent, ref, openBlock, createElementBlock, Fragment, createVNode } from 'vue';
-import { GAP } from './util.mjs';
-import Thumb from './thumb2.mjs';
-import { barProps } from './bar2.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import '../../../utils/index.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "bar",
-  props: barProps,
-  setup(__props, { expose }) {
-    const props = __props;
-    const moveX = ref(0);
-    const moveY = ref(0);
-    const handleScroll = (wrap) => {
-      if (wrap) {
-        const offsetHeight = wrap.offsetHeight - GAP;
-        const offsetWidth = wrap.offsetWidth - GAP;
-        moveY.value = wrap.scrollTop * 100 / offsetHeight * props.ratioY;
-        moveX.value = wrap.scrollLeft * 100 / offsetWidth * props.ratioX;
-      }
-    };
-    expose({
-      handleScroll
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock(Fragment, null, [
-        createVNode(Thumb, {
-          move: moveX.value,
-          ratio: _ctx.ratioX,
-          size: _ctx.width,
-          always: _ctx.always
-        }, null, 8, ["move", "ratio", "size", "always"]),
-        createVNode(Thumb, {
-          move: moveY.value,
-          ratio: _ctx.ratioY,
-          size: _ctx.height,
-          vertical: "",
-          always: _ctx.always
-        }, null, 8, ["move", "ratio", "size", "always"])
-      ], 64);
-    };
+const barProps = buildProps({
+  always: {
+    type: Boolean,
+    default: true
+  },
+  width: String,
+  height: String,
+  ratioX: {
+    type: Number,
+    default: 1
+  },
+  ratioY: {
+    type: Number,
+    default: 1
   }
 });
-var Bar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "D:\\workspace\\element-pe\\packages\\components\\scrollbar\\src\\bar.vue"]]);
 
-export { Bar as default };
+export { barProps };
 //# sourceMappingURL=bar.mjs.map

package/es/components/scrollbar/src/bar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"bar.mjs","sources":["../../../../../../packages/components/scrollbar/src/bar.vue"],"sourcesContent":["<template>\n  <thumb :move=\"moveX\" :ratio=\"ratioX\" :size=\"width\" :always=\"always\" />\n  <thumb\n    :move=\"moveY\"\n    :ratio=\"ratioY\"\n    :size=\"height\"\n    vertical\n    :always=\"always\"\n  />\n</template>\n<script lang=\"ts\" setup>\nimport { ref } from 'vue'\nimport { GAP } from './util'\nimport Thumb from './thumb.vue'\nimport { barProps } from './bar'\n\nconst props = defineProps(barProps)\n\nconst moveX = ref(0)\nconst moveY = ref(0)\n\nconst handleScroll = (wrap: HTMLDivElement) => {\n  if (wrap) {\n    const offsetHeight = wrap.offsetHeight - GAP\n    const offsetWidth = wrap.offsetWidth - GAP\n\n    moveY.value = ((wrap.scrollTop * 100) / offsetHeight) * props.ratioY\n    moveX.value = ((wrap.scrollLeft * 100) / offsetWidth) * props.ratioX\n  }\n}\n\ndefineExpose({\n  handleScroll,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;AAkBA,IAAM,MAAA,KAAA,GAAQ,IAAI,CAAC,CAAA,CAAA;AACnB,IAAM,MAAA,KAAA,GAAQ,IAAI,CAAC,CAAA,CAAA;AAEnB,IAAM,MAAA,YAAA,GAAe,CAAC,IAAyB,KAAA;AAC7C,MAAA,IAAI,IAAM,EAAA;AACR,QAAM,MAAA,YAAA,GAAe,KAAK,YAAe,GAAA,GAAA,CAAA;AACzC,QAAM,MAAA,WAAA,GAAc,KAAK,WAAc,GAAA,GAAA,CAAA;AAEvC,QAAA,KAAA,CAAM,KAAU,GAAA,IAAA,CAAK,SAAY,GAAA,GAAA,GAAO,eAAgB,KAAM,CAAA,MAAA,CAAA;AAC9D,QAAA,KAAA,CAAM,KAAU,GAAA,IAAA,CAAK,UAAa,GAAA,GAAA,GAAO,cAAe,KAAM,CAAA,MAAA,CAAA;AAAA,OAChE;AAAA,KACF,CAAA;AAEA,IAAa,MAAA,CAAA;AAAA,MACX,YAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"bar.mjs","sources":["../../../../../../packages/components/scrollbar/src/bar.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type Bar from './bar.vue'\n\nexport const barProps = buildProps({\n  always: {\n    type: Boolean,\n    default: true,\n  },\n  width: String,\n  height: String,\n  ratioX: {\n    type: Number,\n    default: 1,\n  },\n  ratioY: {\n    type: Number,\n    default: 1,\n  },\n} as const)\nexport type BarProps = ExtractPropTypes<typeof barProps>\n\nexport type BarInstance = InstanceType<typeof Bar>\n"],"names":[],"mappings":";;;AACY,MAAC,QAAQ,GAAG,UAAU,CAAC;AACnC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,CAAC;;;;"}

package/es/components/scrollbar/src/bar2.mjs

@@ -1,22 +1,47 @@
-import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, ref, openBlock, createElementBlock, Fragment, createVNode } from 'vue';
+import { GAP } from './util.mjs';
+import Thumb from './thumb2.mjs';
+import { barProps } from './bar.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 
-const barProps = buildProps({
-  always: {
-    type: Boolean,
-    default: true
-  },
-  width: String,
-  height: String,
-  ratioX: {
-    type: Number,
-    default: 1
-  },
-  ratioY: {
-    type: Number,
-    default: 1
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "bar",
+  props: barProps,
+  setup(__props, { expose }) {
+    const props = __props;
+    const moveX = ref(0);
+    const moveY = ref(0);
+    const handleScroll = (wrap) => {
+      if (wrap) {
+        const offsetHeight = wrap.offsetHeight - GAP;
+        const offsetWidth = wrap.offsetWidth - GAP;
+        moveY.value = wrap.scrollTop * 100 / offsetHeight * props.ratioY;
+        moveX.value = wrap.scrollLeft * 100 / offsetWidth * props.ratioX;
+      }
+    };
+    expose({
+      handleScroll
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        createVNode(Thumb, {
+          move: moveX.value,
+          ratio: _ctx.ratioX,
+          size: _ctx.width,
+          always: _ctx.always
+        }, null, 8, ["move", "ratio", "size", "always"]),
+        createVNode(Thumb, {
+          move: moveY.value,
+          ratio: _ctx.ratioY,
+          size: _ctx.height,
+          vertical: "",
+          always: _ctx.always
+        }, null, 8, ["move", "ratio", "size", "always"])
+      ], 64);
+    };
   }
 });
+var Bar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "D:\\workspace\\element-pe\\packages\\components\\scrollbar\\src\\bar.vue"]]);
 
-export { barProps };
+export { Bar as default };
 //# sourceMappingURL=bar2.mjs.map