@element-plus/nightly 0.0.20220114 → 0.0.20220118

package/lib/components/result/index.d.ts

@@ -3,6 +3,17 @@ export declare const ElResult: import("../../utils/types").SFCWithInstall<import
     readonly subTitle: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly icon: import("../../utils/props").BuildPropReturn<unknown, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     resultIcon: import("vue").ComputedRef<{
         class: "icon-success" | "icon-warning" | "icon-error" | "icon-info";
         component: import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;

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

@@ -1,4 +1,5 @@
 import type { Component, ExtractPropTypes } from 'vue';
+import type Result from './result.vue';
 export declare const IconMap: {
     readonly success: "icon-success";
     readonly warning: "icon-warning";
@@ -12,3 +13,4 @@ export declare const resultProps: {
     readonly icon: import("element-plus/es/utils/props").BuildPropReturn<unknown, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
 };
 export declare type ResultProps = ExtractPropTypes<typeof resultProps>;
+export declare type ResultInstance = InstanceType<typeof Result>;

package/lib/components/result/src/result.js.map

@@ -1 +1 @@
-{"version":3,"file":"result.js","sources":["../../../../../../packages/components/result/src/result.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport {\n  WarningFilled,\n  CircleCheckFilled,\n  CircleCloseFilled,\n  InfoFilled,\n} from '@element-plus/icons-vue'\nimport type { Component, ExtractPropTypes } from 'vue'\n\nexport const IconMap = {\n  success: 'icon-success',\n  warning: 'icon-warning',\n  error: 'icon-error',\n  info: 'icon-info',\n} as const\n\nexport const IconComponentMap: Record<\n  typeof IconMap[keyof typeof IconMap],\n  Component\n> = {\n  [IconMap.success]: CircleCheckFilled,\n  [IconMap.warning]: WarningFilled,\n  [IconMap.error]: CircleCloseFilled,\n  [IconMap.info]: InfoFilled,\n}\n\nexport const resultProps = buildProps({\n  title: {\n    type: String,\n    default: '',\n  },\n  subTitle: {\n    type: String,\n    default: '',\n  },\n  icon: {\n    values: ['success', 'warning', 'info', 'error'],\n    default: 'info',\n  },\n} as const)\n\nexport type ResultProps = ExtractPropTypes<typeof resultProps>\n"],"names":["CircleCheckFilled","WarningFilled","CircleCloseFilled","InfoFilled","buildProps"],"mappings":";;;;;;;AAOY,MAAC,OAAO,GAAG;AACvB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,KAAK,EAAE,YAAY;AACrB,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE;AACU,MAAC,gBAAgB,GAAG;AAChC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGA,0BAAiB;AACtC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGC,sBAAa;AAClC,EAAE,CAAC,OAAO,CAAC,KAAK,GAAGC,0BAAiB;AACpC,EAAE,CAAC,OAAO,CAAC,IAAI,GAAGC,mBAAU;AAC5B,EAAE;AACU,MAAC,WAAW,GAAGC,gBAAU,CAAC;AACtC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC;AACnD,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,CAAC;;;;;;"}
+{"version":3,"file":"result.js","sources":["../../../../../../packages/components/result/src/result.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport {\n  WarningFilled,\n  CircleCheckFilled,\n  CircleCloseFilled,\n  InfoFilled,\n} from '@element-plus/icons-vue'\nimport type { Component, ExtractPropTypes } from 'vue'\nimport type Result from './result.vue'\n\nexport const IconMap = {\n  success: 'icon-success',\n  warning: 'icon-warning',\n  error: 'icon-error',\n  info: 'icon-info',\n} as const\n\nexport const IconComponentMap: Record<\n  typeof IconMap[keyof typeof IconMap],\n  Component\n> = {\n  [IconMap.success]: CircleCheckFilled,\n  [IconMap.warning]: WarningFilled,\n  [IconMap.error]: CircleCloseFilled,\n  [IconMap.info]: InfoFilled,\n}\n\nexport const resultProps = buildProps({\n  title: {\n    type: String,\n    default: '',\n  },\n  subTitle: {\n    type: String,\n    default: '',\n  },\n  icon: {\n    values: ['success', 'warning', 'info', 'error'],\n    default: 'info',\n  },\n} as const)\n\nexport type ResultProps = ExtractPropTypes<typeof resultProps>\n\nexport type ResultInstance = InstanceType<typeof Result>\n"],"names":["CircleCheckFilled","WarningFilled","CircleCloseFilled","InfoFilled","buildProps"],"mappings":";;;;;;;AAOY,MAAC,OAAO,GAAG;AACvB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,KAAK,EAAE,YAAY;AACrB,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE;AACU,MAAC,gBAAgB,GAAG;AAChC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGA,0BAAiB;AACtC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGC,sBAAa;AAClC,EAAE,CAAC,OAAO,CAAC,KAAK,GAAGC,0BAAiB;AACpC,EAAE,CAAC,OAAO,CAAC,IAAI,GAAGC,mBAAU;AAC5B,EAAE;AACU,MAAC,WAAW,GAAGC,gBAAU,CAAC;AACtC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC;AACnD,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,CAAC;;;;;;"}

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

@@ -3,6 +3,17 @@ declare const _default: import("vue").DefineComponent<{
     readonly subTitle: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly icon: import("../../../utils/props").BuildPropReturn<unknown, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     resultIcon: import("vue").ComputedRef<{
         class: "icon-success" | "icon-warning" | "icon-error" | "icon-info";
         component: import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;

package/lib/components/result/src/result.vue_vue_type_script_lang.js

@@ -3,12 +3,15 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
+require('../../../hooks/index.js');
 var result = require('./result.js');
+var index = require('../../../hooks/use-namespace/index.js');
 
 var script = vue.defineComponent({
   name: "ElResult",
   props: result.resultProps,
   setup(props) {
+    const ns = index.useNamespace("result");
     const resultIcon = vue.computed(() => {
       const icon = props.icon;
       const iconClass = icon && result.IconMap[icon] ? result.IconMap[icon] : "icon-info";
@@ -19,6 +22,7 @@ var script = vue.defineComponent({
       };
     });
     return {
+      ns,
       resultIcon
     };
   }

package/lib/components/result/src/result.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"result.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/result/src/result.vue"],"sourcesContent":["<template>\n  <div class=\"el-result\">\n    <div class=\"el-result__icon\">\n      <slot name=\"icon\">\n        <component\n          :is=\"resultIcon.component\"\n          v-if=\"resultIcon.component\"\n          :class=\"resultIcon.class\"\n        />\n      </slot>\n    </div>\n    <div v-if=\"title || $slots.title\" class=\"el-result__title\">\n      <slot name=\"title\">\n        <p>{{ title }}</p>\n      </slot>\n    </div>\n    <div v-if=\"subTitle || $slots.subTitle\" class=\"el-result__subtitle\">\n      <slot name=\"subTitle\">\n        <p>{{ subTitle }}</p>\n      </slot>\n    </div>\n    <div v-if=\"$slots.extra\" class=\"el-result__extra\">\n      <slot name=\"extra\"></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { resultProps, IconComponentMap, IconMap } from './result'\n\nexport default defineComponent({\n  name: 'ElResult',\n  props: resultProps,\n  setup(props) {\n    const resultIcon = computed(() => {\n      const icon = props.icon\n      const iconClass = icon && IconMap[icon] ? IconMap[icon] : 'icon-info'\n      const iconComponent =\n        IconComponentMap[iconClass] || IconComponentMap['icon-info']\n\n      return {\n        class: iconClass,\n        component: iconComponent,\n      }\n    })\n\n    return {\n      resultIcon,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","resultProps","IconMap","IconComponentMap"],"mappings":";;;;;;;AA4BA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,kBAAW;EAClB,MAAM,KAAK,EAAE;IACX,MAAM,UAAU;MACd,MAAM;MACN,MAAM,SAAS,GAAG,IAAI,IAAIC;MAC1B,MAAM,aAAa,GAAGC;MACtB,OAAO;QACL,KAAK,EAAE,SAAS;QAChB,SAAS,EAAE,aAAa;;MAE1B,CAAC;WACI;gBACK;MACV;;;;;;"}
+{"version":3,"file":"result.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/result/src/result.vue"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <div :class=\"ns.e('icon')\">\n      <slot name=\"icon\">\n        <component\n          :is=\"resultIcon.component\"\n          v-if=\"resultIcon.component\"\n          :class=\"resultIcon.class\"\n        />\n      </slot>\n    </div>\n    <div v-if=\"title || $slots.title\" :class=\"ns.e('title')\">\n      <slot name=\"title\">\n        <p>{{ title }}</p>\n      </slot>\n    </div>\n    <div v-if=\"subTitle || $slots.subTitle\" :class=\"ns.e('subtitle')\">\n      <slot name=\"subTitle\">\n        <p>{{ subTitle }}</p>\n      </slot>\n    </div>\n    <div v-if=\"$slots.extra\" :class=\"ns.e('extra')\">\n      <slot name=\"extra\"></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { resultProps, IconComponentMap, IconMap } from './result'\n\nexport default defineComponent({\n  name: 'ElResult',\n  props: resultProps,\n  setup(props) {\n    const ns = useNamespace('result')\n\n    const resultIcon = computed(() => {\n      const icon = props.icon\n      const iconClass = icon && IconMap[icon] ? IconMap[icon] : 'icon-info'\n      const iconComponent =\n        IconComponentMap[iconClass] || IconComponentMap['icon-info']\n\n      return {\n        class: iconClass,\n        component: iconComponent,\n      }\n    })\n\n    return {\n      ns,\n      resultIcon,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","resultProps","useNamespace","IconComponentMap"],"mappings":";;;;;;;;;AA6BA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,kBAAW;EAClB,MAAM,KAAK,EAAE;IACX,MAAM,EAAE,GAAGC;IACX,MAAM;MACJ,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC;;MAExB,MAAM,aAAa,GAAGC;MACtB,OAAO;QACL,KAAK,EAAE,SAAS;QAChB,SAAS,EAAE;QACX;;WAEG;QACH;gBACQ;MACV;;;;;;"}

package/lib/components/result/src/result.vue_vue_type_template_id_263c10e5_lang.js

@@ -4,44 +4,43 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 
-const _hoisted_1 = { class: "el-result" };
-const _hoisted_2 = { class: "el-result__icon" };
-const _hoisted_3 = {
-  key: 0,
-  class: "el-result__title"
-};
-const _hoisted_4 = {
-  key: 1,
-  class: "el-result__subtitle"
-};
-const _hoisted_5 = {
-  key: 2,
-  class: "el-result__extra"
-};
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-    vue.createElementVNode("div", _hoisted_2, [
+  return vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass(_ctx.ns.b())
+  }, [
+    vue.createElementVNode("div", {
+      class: vue.normalizeClass(_ctx.ns.e("icon"))
+    }, [
       vue.renderSlot(_ctx.$slots, "icon", {}, () => [
         _ctx.resultIcon.component ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.resultIcon.component), {
           key: 0,
           class: vue.normalizeClass(_ctx.resultIcon.class)
         }, null, 8, ["class"])) : vue.createCommentVNode("v-if", true)
       ])
-    ]),
-    _ctx.title || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
+    ], 2),
+    _ctx.title || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("div", {
+      key: 0,
+      class: vue.normalizeClass(_ctx.ns.e("title"))
+    }, [
       vue.renderSlot(_ctx.$slots, "title", {}, () => [
         vue.createElementVNode("p", null, vue.toDisplayString(_ctx.title), 1)
       ])
-    ])) : vue.createCommentVNode("v-if", true),
-    _ctx.subTitle || _ctx.$slots.subTitle ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
+    ], 2)) : vue.createCommentVNode("v-if", true),
+    _ctx.subTitle || _ctx.$slots.subTitle ? (vue.openBlock(), vue.createElementBlock("div", {
+      key: 1,
+      class: vue.normalizeClass(_ctx.ns.e("subtitle"))
+    }, [
       vue.renderSlot(_ctx.$slots, "subTitle", {}, () => [
         vue.createElementVNode("p", null, vue.toDisplayString(_ctx.subTitle), 1)
       ])
-    ])) : vue.createCommentVNode("v-if", true),
-    _ctx.$slots.extra ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
+    ], 2)) : vue.createCommentVNode("v-if", true),
+    _ctx.$slots.extra ? (vue.openBlock(), vue.createElementBlock("div", {
+      key: 2,
+      class: vue.normalizeClass(_ctx.ns.e("extra"))
+    }, [
       vue.renderSlot(_ctx.$slots, "extra")
-    ])) : vue.createCommentVNode("v-if", true)
-  ]);
+    ], 2)) : vue.createCommentVNode("v-if", true)
+  ], 2);
 }
 
 exports.render = render;

package/lib/components/result/src/result.vue_vue_type_template_id_263c10e5_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"result.vue_vue_type_template_id_263c10e5_lang.js","sources":["../../../../../../packages/components/result/src/result.vue?vue&type=template&id=263c10e5&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-result\">\n    <div class=\"el-result__icon\">\n      <slot name=\"icon\">\n        <component\n          :is=\"resultIcon.component\"\n          v-if=\"resultIcon.component\"\n          :class=\"resultIcon.class\"\n        />\n      </slot>\n    </div>\n    <div v-if=\"title || $slots.title\" class=\"el-result__title\">\n      <slot name=\"title\">\n        <p>{{ title }}</p>\n      </slot>\n    </div>\n    <div v-if=\"subTitle || $slots.subTitle\" class=\"el-result__subtitle\">\n      <slot name=\"subTitle\">\n        <p>{{ subTitle }}</p>\n      </slot>\n    </div>\n    <div v-if=\"$slots.extra\" class=\"el-result__extra\">\n      <slot name=\"extra\"></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { resultProps, IconComponentMap, IconMap } from './result'\n\nexport default defineComponent({\n  name: 'ElResult',\n  props: resultProps,\n  setup(props) {\n    const resultIcon = computed(() => {\n      const icon = props.icon\n      const iconClass = icon && IconMap[icon] ? IconMap[icon] : 'icon-info'\n      const iconComponent =\n        IconComponentMap[iconClass] || IconComponentMap['icon-info']\n\n      return {\n        class: iconClass,\n        component: iconComponent,\n      }\n    })\n\n    return {\n      resultIcon,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;qBACO,KAAK,EAAC;;;;EAUyB;;;;EAKM;;;;EAKf;;;;;;;;;;;;;;;KAVd,4BAAe,MAAM;;;kEAEtB;;;;yBAGa;;;;;;;"}
+{"version":3,"file":"result.vue_vue_type_template_id_263c10e5_lang.js","sources":["../../../../../../packages/components/result/src/result.vue?vue&type=template&id=263c10e5&lang.js"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <div :class=\"ns.e('icon')\">\n      <slot name=\"icon\">\n        <component\n          :is=\"resultIcon.component\"\n          v-if=\"resultIcon.component\"\n          :class=\"resultIcon.class\"\n        />\n      </slot>\n    </div>\n    <div v-if=\"title || $slots.title\" :class=\"ns.e('title')\">\n      <slot name=\"title\">\n        <p>{{ title }}</p>\n      </slot>\n    </div>\n    <div v-if=\"subTitle || $slots.subTitle\" :class=\"ns.e('subtitle')\">\n      <slot name=\"subTitle\">\n        <p>{{ subTitle }}</p>\n      </slot>\n    </div>\n    <div v-if=\"$slots.extra\" :class=\"ns.e('extra')\">\n      <slot name=\"extra\"></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { resultProps, IconComponentMap, IconMap } from './result'\n\nexport default defineComponent({\n  name: 'ElResult',\n  props: resultProps,\n  setup(props) {\n    const ns = useNamespace('result')\n\n    const resultIcon = computed(() => {\n      const icon = props.icon\n      const iconClass = icon && IconMap[icon] ? IconMap[icon] : 'icon-info'\n      const iconComponent =\n        IconComponentMap[iconClass] || IconComponentMap['icon-info']\n\n      return {\n        class: iconClass,\n        component: iconComponent,\n      }\n    })\n\n    return {\n      ns,\n      resultIcon,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;KAWe;0BAAX;;;;;YAEI;;;;oCAGyB;;;eAAiB;;;;;;;;;;;"}

package/lib/components/row/index.d.ts

@@ -1,7 +1,7 @@
 export declare const ElRow: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
     readonly tag: import("../../utils/props").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly gutter: import("../../utils/props").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
-    readonly justify: import("../../utils/props").BuildPropReturn<StringConstructor, "start", unknown, "space-around" | "space-between" | "center" | "end" | "start", unknown>;
+    readonly justify: import("../../utils/props").BuildPropReturn<StringConstructor, "start", unknown, "center" | "space-around" | "space-between" | "end" | "start", unknown>;
     readonly align: import("../../utils/props").BuildPropReturn<StringConstructor, "top", unknown, "top" | "bottom" | "middle", unknown>;
 }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
@@ -12,12 +12,12 @@ export declare const ElRow: import("../../utils/types").SFCWithInstall<import("v
     readonly align?: unknown;
 } & {
     align: import("../../utils/props").BuildPropType<StringConstructor, "top" | "bottom" | "middle", unknown>;
-    justify: import("../../utils/props").BuildPropType<StringConstructor, "space-around" | "space-between" | "center" | "end" | "start", unknown>;
+    justify: import("../../utils/props").BuildPropType<StringConstructor, "center" | "space-around" | "space-between" | "end" | "start", unknown>;
     tag: string;
     gutter: number;
 } & {}>, {
     align: import("../../utils/props").BuildPropType<StringConstructor, "top" | "bottom" | "middle", unknown>;
-    justify: import("../../utils/props").BuildPropType<StringConstructor, "space-around" | "space-between" | "center" | "end" | "start", unknown>;
+    justify: import("../../utils/props").BuildPropType<StringConstructor, "center" | "space-around" | "space-between" | "end" | "start", unknown>;
     tag: string;
     gutter: number;
 }>> & Record<string, any>;

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

@@ -2,14 +2,14 @@ import type { ExtractPropTypes } from 'vue';
 export declare const rowProps: {
     readonly tag: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly gutter: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
-    readonly justify: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "start", unknown, "space-around" | "space-between" | "center" | "end" | "start", unknown>;
+    readonly justify: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "start", unknown, "center" | "space-around" | "space-between" | "end" | "start", unknown>;
     readonly align: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "top", unknown, "top" | "bottom" | "middle", unknown>;
 };
 export declare type RowProps = ExtractPropTypes<typeof rowProps>;
-declare const _default: import("vue").DefineComponent<{
+declare const Row: import("vue").DefineComponent<{
     readonly tag: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly gutter: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
-    readonly justify: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "start", unknown, "space-around" | "space-between" | "center" | "end" | "start", unknown>;
+    readonly justify: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "start", unknown, "center" | "space-around" | "space-between" | "end" | "start", unknown>;
     readonly align: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "top", unknown, "top" | "bottom" | "middle", unknown>;
 }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
@@ -20,13 +20,14 @@ declare const _default: import("vue").DefineComponent<{
     readonly align?: unknown;
 } & {
     align: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "top" | "bottom" | "middle", unknown>;
-    justify: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "space-around" | "space-between" | "center" | "end" | "start", unknown>;
+    justify: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "center" | "space-around" | "space-between" | "end" | "start", unknown>;
     tag: string;
     gutter: number;
 } & {}>, {
     align: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "top" | "bottom" | "middle", unknown>;
-    justify: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "space-around" | "space-between" | "center" | "end" | "start", unknown>;
+    justify: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "center" | "space-around" | "space-between" | "end" | "start", unknown>;
     tag: string;
     gutter: number;
 }>;
-export default _default;
+export default Row;
+export declare type RowInstance = InstanceType<typeof Row>;

package/lib/components/row/src/row.js

@@ -4,6 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 var props = require('../../../utils/props.js');
+require('../../../hooks/index.js');
+var index = require('../../../hooks/use-namespace/index.js');
 
 const rowProps = props.buildProps({
   tag: {
@@ -25,30 +27,31 @@ const rowProps = props.buildProps({
     default: "top"
   }
 });
-var Row = vue.defineComponent({
+const Row = vue.defineComponent({
   name: "ElRow",
   props: rowProps,
   setup(props, { slots }) {
+    const ns = index.useNamespace("row");
     const gutter = vue.computed(() => props.gutter);
     vue.provide("ElRow", {
       gutter
     });
     const style = vue.computed(() => {
-      const ret = {
+      const styles = {
         marginLeft: "",
         marginRight: ""
       };
       if (props.gutter) {
-        ret.marginLeft = `-${props.gutter / 2}px`;
-        ret.marginRight = ret.marginLeft;
+        styles.marginLeft = `-${props.gutter / 2}px`;
+        styles.marginRight = styles.marginLeft;
       }
-      return ret;
+      return styles;
     });
     return () => {
       var _a;
       return vue.h(props.tag, {
         class: [
-          "el-row",
+          ns.b(),
           props.justify !== "start" ? `is-justify-${props.justify}` : "",
           props.align !== "top" ? `is-align-${props.align}` : ""
         ],

package/lib/components/row/src/row.js.map

@@ -1 +1 @@
-{"version":3,"file":"row.js","sources":["../../../../../../packages/components/row/src/row.ts"],"sourcesContent":["import { defineComponent, computed, h, provide } from 'vue'\nimport { buildProps } from '@element-plus/utils/props'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const rowProps = buildProps({\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  gutter: {\n    type: Number,\n    default: 0,\n  },\n  justify: {\n    type: String,\n    values: ['start', 'center', 'end', 'space-around', 'space-between'],\n    default: 'start',\n  },\n  align: {\n    type: String,\n    values: ['top', 'middle', 'bottom'],\n    default: 'top',\n  },\n} as const)\nexport type RowProps = ExtractPropTypes<typeof rowProps>\n\nexport default defineComponent({\n  name: 'ElRow',\n  props: rowProps,\n\n  setup(props, { slots }) {\n    const gutter = computed(() => props.gutter)\n    provide('ElRow', {\n      gutter,\n    })\n\n    const style = computed(() => {\n      const ret = {\n        marginLeft: '',\n        marginRight: '',\n      }\n      if (props.gutter) {\n        ret.marginLeft = `-${props.gutter / 2}px`\n        ret.marginRight = ret.marginLeft\n      }\n      return ret\n    })\n\n    return () =>\n      h(\n        props.tag,\n        {\n          class: [\n            'el-row',\n            props.justify !== 'start' ? `is-justify-${props.justify}` : '',\n            props.align !== 'top' ? `is-align-${props.align}` : '',\n          ],\n          style: style.value,\n        },\n        slots.default?.()\n      )\n  },\n})\n"],"names":["buildProps","defineComponent","computed","provide","h"],"mappings":";;;;;;;AAEY,MAAC,QAAQ,GAAGA,gBAAU,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,CAAC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,cAAc,EAAE,eAAe,CAAC;AACvE,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC;AACvC,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,CAAC,EAAE;AACH,UAAeC,mBAAe,CAAC;AAC/B,EAAE,IAAI,EAAE,OAAO;AACf,EAAE,KAAK,EAAE,QAAQ;AACjB,EAAE,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE;AAC1B,IAAI,MAAM,MAAM,GAAGC,YAAQ,CAAC,MAAM,KAAK,CAAC,MAAM,CAAC,CAAC;AAChD,IAAIC,WAAO,CAAC,OAAO,EAAE;AACrB,MAAM,MAAM;AACZ,KAAK,CAAC,CAAC;AACP,IAAI,MAAM,KAAK,GAAGD,YAAQ,CAAC,MAAM;AACjC,MAAM,MAAM,GAAG,GAAG;AAClB,QAAQ,UAAU,EAAE,EAAE;AACtB,QAAQ,WAAW,EAAE,EAAE;AACvB,OAAO,CAAC;AACR,MAAM,IAAI,KAAK,CAAC,MAAM,EAAE;AACxB,QAAQ,GAAG,CAAC,UAAU,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;AAClD,QAAQ,GAAG,CAAC,WAAW,GAAG,GAAG,CAAC,UAAU,CAAC;AACzC,OAAO;AACP,MAAM,OAAO,GAAG,CAAC;AACjB,KAAK,CAAC,CAAC;AACP,IAAI,OAAO,MAAM;AACjB,MAAM,IAAI,EAAE,CAAC;AACb,MAAM,OAAOE,KAAC,CAAC,KAAK,CAAC,GAAG,EAAE;AAC1B,QAAQ,KAAK,EAAE;AACf,UAAU,QAAQ;AAClB,UAAU,KAAK,CAAC,OAAO,KAAK,OAAO,GAAG,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE;AACxE,UAAU,KAAK,CAAC,KAAK,KAAK,KAAK,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE;AAChE,SAAS;AACT,QAAQ,KAAK,EAAE,KAAK,CAAC,KAAK;AAC1B,OAAO,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,OAAO,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;AACjE,KAAK,CAAC;AACN,GAAG;AACH,CAAC,CAAC;;;;;"}
+{"version":3,"file":"row.js","sources":["../../../../../../packages/components/row/src/row.ts"],"sourcesContent":["import { defineComponent, computed, h, provide } from 'vue'\nimport { buildProps } from '@element-plus/utils/props'\nimport { useNamespace } from '@element-plus/hooks'\nimport type { ExtractPropTypes, CSSProperties } from 'vue'\n\nexport const rowProps = buildProps({\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  gutter: {\n    type: Number,\n    default: 0,\n  },\n  justify: {\n    type: String,\n    values: ['start', 'center', 'end', 'space-around', 'space-between'],\n    default: 'start',\n  },\n  align: {\n    type: String,\n    values: ['top', 'middle', 'bottom'],\n    default: 'top',\n  },\n} as const)\nexport type RowProps = ExtractPropTypes<typeof rowProps>\n\nconst Row = defineComponent({\n  name: 'ElRow',\n  props: rowProps,\n\n  setup(props, { slots }) {\n    const ns = useNamespace('row')\n\n    const gutter = computed(() => props.gutter)\n    provide('ElRow', {\n      gutter,\n    })\n\n    const style = computed(() => {\n      const styles: CSSProperties = {\n        marginLeft: '',\n        marginRight: '',\n      }\n      if (props.gutter) {\n        styles.marginLeft = `-${props.gutter / 2}px`\n        styles.marginRight = styles.marginLeft\n      }\n      return styles\n    })\n\n    return () =>\n      h(\n        props.tag,\n        {\n          class: [\n            ns.b(),\n            props.justify !== 'start' ? `is-justify-${props.justify}` : '',\n            props.align !== 'top' ? `is-align-${props.align}` : '',\n          ],\n          style: style.value,\n        },\n        slots.default?.()\n      )\n  },\n})\n\nexport default Row\nexport type RowInstance = InstanceType<typeof Row>\n"],"names":["buildProps","defineComponent","useNamespace","computed","provide","h"],"mappings":";;;;;;;;;AAGY,MAAC,QAAQ,GAAGA,gBAAU,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,CAAC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,cAAc,EAAE,eAAe,CAAC;AACvE,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC;AACvC,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,CAAC,EAAE;AACE,MAAC,GAAG,GAAGC,mBAAe,CAAC;AAC5B,EAAE,IAAI,EAAE,OAAO;AACf,EAAE,KAAK,EAAE,QAAQ;AACjB,EAAE,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE;AAC1B,IAAI,MAAM,EAAE,GAAGC,kBAAY,CAAC,KAAK,CAAC,CAAC;AACnC,IAAI,MAAM,MAAM,GAAGC,YAAQ,CAAC,MAAM,KAAK,CAAC,MAAM,CAAC,CAAC;AAChD,IAAIC,WAAO,CAAC,OAAO,EAAE;AACrB,MAAM,MAAM;AACZ,KAAK,CAAC,CAAC;AACP,IAAI,MAAM,KAAK,GAAGD,YAAQ,CAAC,MAAM;AACjC,MAAM,MAAM,MAAM,GAAG;AACrB,QAAQ,UAAU,EAAE,EAAE;AACtB,QAAQ,WAAW,EAAE,EAAE;AACvB,OAAO,CAAC;AACR,MAAM,IAAI,KAAK,CAAC,MAAM,EAAE;AACxB,QAAQ,MAAM,CAAC,UAAU,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;AACrD,QAAQ,MAAM,CAAC,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAC/C,OAAO;AACP,MAAM,OAAO,MAAM,CAAC;AACpB,KAAK,CAAC,CAAC;AACP,IAAI,OAAO,MAAM;AACjB,MAAM,IAAI,EAAE,CAAC;AACb,MAAM,OAAOE,KAAC,CAAC,KAAK,CAAC,GAAG,EAAE;AAC1B,QAAQ,KAAK,EAAE;AACf,UAAU,EAAE,CAAC,CAAC,EAAE;AAChB,UAAU,KAAK,CAAC,OAAO,KAAK,OAAO,GAAG,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE;AACxE,UAAU,KAAK,CAAC,KAAK,KAAK,KAAK,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE;AAChE,SAAS;AACT,QAAQ,KAAK,EAAE,KAAK,CAAC,KAAK;AAC1B,OAAO,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,OAAO,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;AACjE,KAAK,CAAC;AACN,GAAG;AACH,CAAC;;;;;"}

package/lib/components/scrollbar/index.d.ts

@@ -44,8 +44,8 @@ export declare const ElScrollbar: import("../../utils/types").SFCWithInstall<imp
     readonly minSize?: unknown;
 } & {
     height: import("../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
-    always: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     maxHeight: import("../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+    always: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     native: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     wrapStyle: import("vue").StyleValue;
     wrapClass: import("../../utils/props").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
@@ -61,8 +61,8 @@ export declare const ElScrollbar: import("../../utils/types").SFCWithInstall<imp
     }) => any) | undefined;
 }, {
     height: import("../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
-    always: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     maxHeight: import("../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+    always: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     native: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     wrapStyle: import("vue").StyleValue;
     wrapClass: import("../../utils/props").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;

package/lib/components/scrollbar/src/bar.vue_vue_type_script_lang.js

@@ -24,7 +24,7 @@ var script = vue.defineComponent({
     const visible = vue.ref(false);
     let cursorDown = false;
     let cursorLeave = false;
-    let onselectstartStore = null;
+    let onselectstartStore = core.isClient ? document.onselectstart : null;
     const bar = vue.computed(() => util.BAR_MAP[props.vertical ? "vertical" : "horizontal"]);
     const thumbStyle = vue.computed(() => util.renderThumbStyle({
       size: props.size,
@@ -78,7 +78,7 @@ var script = vue.defineComponent({
       barStore.value[bar.value.axis] = 0;
       document.removeEventListener("mousemove", mouseMoveDocumentHandler);
       document.removeEventListener("mouseup", mouseUpDocumentHandler);
-      document.onselectstart = onselectstartStore;
+      restoreOnselectstart();
       if (cursorLeave)
         visible.value = false;
     };
@@ -90,7 +90,14 @@ var script = vue.defineComponent({
       cursorLeave = true;
       visible.value = cursorDown;
     };
-    vue.onBeforeUnmount(() => document.removeEventListener("mouseup", mouseUpDocumentHandler));
+    vue.onBeforeUnmount(() => {
+      restoreOnselectstart();
+      document.removeEventListener("mouseup", mouseUpDocumentHandler);
+    });
+    const restoreOnselectstart = () => {
+      if (document.onselectstart !== onselectstartStore)
+        document.onselectstart = onselectstartStore;
+    };
     core.useEventListener(vue.toRef(scrollbar$1, "scrollbarElement"), "mousemove", mouseMoveScrollbarHandler);
     core.useEventListener(vue.toRef(scrollbar$1, "scrollbarElement"), "mouseleave", mouseLeaveScrollbarHandler);
     return {

package/lib/components/scrollbar/src/bar.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"bar.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/scrollbar/src/bar.vue"],"sourcesContent":["<template>\n  <transition name=\"el-scrollbar-fade\">\n    <div\n      v-show=\"always || visible\"\n      ref=\"instance\"\n      :class=\"['el-scrollbar__bar', 'is-' + bar.key]\"\n      @mousedown=\"clickTrackHandler\"\n    >\n      <div\n        ref=\"thumb\"\n        class=\"el-scrollbar__thumb\"\n        :style=\"thumbStyle\"\n        @mousedown=\"clickThumbHandler\"\n      ></div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  onBeforeUnmount,\n  ref,\n  toRef,\n} from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { throwError } from '@element-plus/utils/error'\nimport { BAR_MAP, renderThumbStyle } from './util'\n\nimport { barProps } from './bar'\n\nconst COMPONENT_NAME = 'Bar'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: barProps,\n\n  setup(props) {\n    const scrollbar = inject(scrollbarContextKey)\n    if (!scrollbar)\n      throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\n    const instance = ref<HTMLDivElement>()\n    const thumb = ref<HTMLDivElement>()\n\n    const barStore = ref({})\n    const visible = ref(false)\n\n    let cursorDown = false\n    let cursorLeave = false\n    let onselectstartStore:\n      | ((this: GlobalEventHandlers, ev: Event) => any)\n      | null = null\n\n    const bar = computed(\n      () => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']\n    )\n\n    const thumbStyle = computed(() =>\n      renderThumbStyle({\n        size: props.size,\n        move: props.move,\n        bar: bar.value,\n      })\n    )\n\n    const offsetRatio = computed(\n      () =>\n        // offsetRatioX = original width of thumb / current width of thumb / ratioX\n        // offsetRatioY = original height of thumb / current height of thumb / ratioY\n        // instance height = wrap height - GAP\n        instance.value![bar.value.offset] ** 2 /\n        scrollbar.wrapElement![bar.value.scrollSize] /\n        props.ratio /\n        thumb.value![bar.value.offset]\n    )\n\n    const clickThumbHandler = (e: MouseEvent) => {\n      // prevent click event of middle and right button\n      e.stopPropagation()\n      if (e.ctrlKey || [1, 2].includes(e.button)) return\n\n      window.getSelection()?.removeAllRanges()\n      startDrag(e)\n\n      const el = e.currentTarget as HTMLDivElement\n      if (!el) return\n      barStore.value[bar.value.axis] =\n        el[bar.value.offset] -\n        (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction])\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      if (!thumb.value || !instance.value || !scrollbar.wrapElement) return\n\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumb.value[bar.value.offset] / 2\n      const thumbPositionPercentage =\n        ((offset - thumbHalf) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const startDrag = (e: MouseEvent) => {\n      e.stopImmediatePropagation()\n      cursorDown = true\n      document.addEventListener('mousemove', mouseMoveDocumentHandler)\n      document.addEventListener('mouseup', mouseUpDocumentHandler)\n      onselectstartStore = document.onselectstart\n      document.onselectstart = () => false\n    }\n\n    const mouseMoveDocumentHandler = (e: MouseEvent) => {\n      if (!instance.value || !thumb.value) return\n      if (cursorDown === false) return\n\n      const prevPage = barStore.value[bar.value.axis]\n      if (!prevPage) return\n\n      const offset =\n        (instance.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage\n      const thumbPositionPercentage =\n        ((offset - thumbClickPosition) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const mouseUpDocumentHandler = () => {\n      cursorDown = false\n      barStore.value[bar.value.axis] = 0\n      document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n      document.onselectstart = onselectstartStore\n      if (cursorLeave) visible.value = false\n    }\n\n    const mouseMoveScrollbarHandler = () => {\n      cursorLeave = false\n      visible.value = !!props.size\n    }\n\n    const mouseLeaveScrollbarHandler = () => {\n      cursorLeave = true\n      visible.value = cursorDown\n    }\n\n    onBeforeUnmount(() =>\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n    )\n\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mousemove',\n      mouseMoveScrollbarHandler\n    )\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mouseleave',\n      mouseLeaveScrollbarHandler\n    )\n\n    return {\n      instance,\n      thumb,\n      bar,\n      thumbStyle,\n      visible,\n      clickTrackHandler,\n      clickThumbHandler,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","barProps","scrollbar","inject","ref","computed","useEventListener","toRef"],"mappings":";;;;;;;;;;;;;AAgCA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,YAAQ;AACjB,EAAE,KAAK,CAAC,KAAK,EAAE;IACX,MAAMC,WAAS,GAAGC;IAClB,KAAKD;;IAEL,MAAM;IACN,MAAM,KAAK,GAAGE,SAAK,CAAC;IACpB,MAAM,QAAQ;UACR,OAAO,GAAGA,OAAG,CAAC,KAAK,CAAC,CAAC;;IAE3B,IAAI,WAAW,GAAG,KAAK,CAAC;IACxB,IAAI,kBAAkB,GAAG,IAAI,CAAC;;IAE9B,MAAM,aAAaC;MACjB,IAAI,EAAE,MAAM,IAAI;;MAEhB,GAAG,EAAE,GAAG,CAAC;KACV,CAAC,EAAE;IACJ,MAAM,WAAW,GAAGA;UACd,iBAAiB,GAAG,CAAC,CAAC,KAAK;MAC/B,IAAI,GAAG;;MAEP,IAAI,CAAC,CAAC,OAAO,IAAI,CAAC;eACT;;;MAGT,MAAM,EAAE,GAAG,CAAC,CAAC,aAAa,CAAC;MAC3B,IAAI,CAAC,EAAE;QACL,OAAO;cACD,CAAC,KAAK,CAAC,GAAG;;;;;MAKlB,MAAM,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC;MAC1B;YACM,uBAAuB,GAAG,CAAC,MAAM,GAAG,SAAS,IAAI,GAAG,GAAG,WAAW,CAAC;iBAChE,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,GAAG,uBAAuB,GAAGH,WAAS,CAAC;;UAE1E,SAAS,GAAG,CAAC,CAAC,KAAK;QACrB,wBAAwB,EAAE,CAAC;gBACnB;cACF,CAAC,gBAAgB,CAAC;;;MAG1B,QAAQ,CAAC,aAAa,GAAG,MAAM,KAAK,CAAC;MACrC;UACI;MACJ,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK;;MAEnC,IAAI,UAAU,KAAK,KAAK;QACtB,OAAO;;MAET,IAAI,SAAS;eACJ;MACT,MAAM,MAAM,GAAG,CAAC,QAAQ,CAAC,MAAM;YACzB;YACA,uBAAuB,GAAG,CAAC,MAAM,GAAG,kBAAkB,IAAI,GAAG,GAAG;;;IAGxE,MAAM,sBAAsB,GAAG,MAAM;MACnC,UAAU,GAAG,KAAK;;MAElB,QAAQ,CAAC;cACD,CAAC,mBAAmB,CAAC,SAAS,EAAE,sBAAsB,CAAC,CAAC;cACxD,CAAC,aAAa;MACtB;QACE,OAAO,CAAC,QAAQ,KAAK,CAAC;MACxB;UACI,4BAA4B,MAAM;iBAC3B,GAAG,KAAK,CAAC;;MAEpB;UACI;iBACO,GAAG,IAAI,CAAC;;;;IAIrBI,qBAAgB,UAAM,CAACJ,WAAS,EAAE;yBAClB,CAACK,SAAK,CAACL;WAChB;MACL,QAAQ;MACR,KAAK;MACL,GAAG;MACH,UAAU;;;MAGV,iBAAiB;MACjB;;;;;;"}
+{"version":3,"file":"bar.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/scrollbar/src/bar.vue"],"sourcesContent":["<template>\n  <transition name=\"el-scrollbar-fade\">\n    <div\n      v-show=\"always || visible\"\n      ref=\"instance\"\n      :class=\"['el-scrollbar__bar', 'is-' + bar.key]\"\n      @mousedown=\"clickTrackHandler\"\n    >\n      <div\n        ref=\"thumb\"\n        class=\"el-scrollbar__thumb\"\n        :style=\"thumbStyle\"\n        @mousedown=\"clickThumbHandler\"\n      ></div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  onBeforeUnmount,\n  ref,\n  toRef,\n} from 'vue'\nimport { useEventListener, isClient } from '@vueuse/core'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { throwError } from '@element-plus/utils/error'\nimport { BAR_MAP, renderThumbStyle } from './util'\n\nimport { barProps } from './bar'\n\nconst COMPONENT_NAME = 'Bar'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: barProps,\n\n  setup(props) {\n    const scrollbar = inject(scrollbarContextKey)\n    if (!scrollbar)\n      throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\n    const instance = ref<HTMLDivElement>()\n    const thumb = ref<HTMLDivElement>()\n\n    const barStore = ref({})\n    const visible = ref(false)\n\n    let cursorDown = false\n    let cursorLeave = false\n    let onselectstartStore:\n      | ((this: GlobalEventHandlers, ev: Event) => any)\n      | null = isClient ? document.onselectstart : null\n\n    const bar = computed(\n      () => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']\n    )\n\n    const thumbStyle = computed(() =>\n      renderThumbStyle({\n        size: props.size,\n        move: props.move,\n        bar: bar.value,\n      })\n    )\n\n    const offsetRatio = computed(\n      () =>\n        // offsetRatioX = original width of thumb / current width of thumb / ratioX\n        // offsetRatioY = original height of thumb / current height of thumb / ratioY\n        // instance height = wrap height - GAP\n        instance.value![bar.value.offset] ** 2 /\n        scrollbar.wrapElement![bar.value.scrollSize] /\n        props.ratio /\n        thumb.value![bar.value.offset]\n    )\n\n    const clickThumbHandler = (e: MouseEvent) => {\n      // prevent click event of middle and right button\n      e.stopPropagation()\n      if (e.ctrlKey || [1, 2].includes(e.button)) return\n\n      window.getSelection()?.removeAllRanges()\n      startDrag(e)\n\n      const el = e.currentTarget as HTMLDivElement\n      if (!el) return\n      barStore.value[bar.value.axis] =\n        el[bar.value.offset] -\n        (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction])\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      if (!thumb.value || !instance.value || !scrollbar.wrapElement) return\n\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumb.value[bar.value.offset] / 2\n      const thumbPositionPercentage =\n        ((offset - thumbHalf) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const startDrag = (e: MouseEvent) => {\n      e.stopImmediatePropagation()\n      cursorDown = true\n      document.addEventListener('mousemove', mouseMoveDocumentHandler)\n      document.addEventListener('mouseup', mouseUpDocumentHandler)\n      onselectstartStore = document.onselectstart\n      document.onselectstart = () => false\n    }\n\n    const mouseMoveDocumentHandler = (e: MouseEvent) => {\n      if (!instance.value || !thumb.value) return\n      if (cursorDown === false) return\n\n      const prevPage = barStore.value[bar.value.axis]\n      if (!prevPage) return\n\n      const offset =\n        (instance.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage\n      const thumbPositionPercentage =\n        ((offset - thumbClickPosition) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const mouseUpDocumentHandler = () => {\n      cursorDown = false\n      barStore.value[bar.value.axis] = 0\n      document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n      restoreOnselectstart()\n      if (cursorLeave) visible.value = false\n    }\n\n    const mouseMoveScrollbarHandler = () => {\n      cursorLeave = false\n      visible.value = !!props.size\n    }\n\n    const mouseLeaveScrollbarHandler = () => {\n      cursorLeave = true\n      visible.value = cursorDown\n    }\n\n    onBeforeUnmount(() => {\n      restoreOnselectstart()\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n    })\n\n    const restoreOnselectstart = () => {\n      if (document.onselectstart !== onselectstartStore)\n        document.onselectstart = onselectstartStore\n    }\n\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mousemove',\n      mouseMoveScrollbarHandler\n    )\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mouseleave',\n      mouseLeaveScrollbarHandler\n    )\n\n    return {\n      instance,\n      thumb,\n      bar,\n      thumbStyle,\n      visible,\n      clickTrackHandler,\n      clickThumbHandler,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","barProps","scrollbar","inject","ref","isClient","computed","useEventListener"],"mappings":";;;;;;;;;;;;;AAgCA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,YAAQ;AACjB,EAAE,KAAK,CAAC,KAAK,EAAE;IACX,MAAMC,WAAS,GAAGC;IAClB,KAAKD;;IAEL,MAAM;IACN,MAAM,KAAK,GAAGE,SAAK,CAAC;IACpB,MAAM,QAAQ;UACR,OAAO,GAAGA,OAAG,CAAC,KAAK,CAAC,CAAC;;IAE3B,IAAI,WAAW,GAAG,KAAK,CAAC;IACxB,IAAI,kBAAkB,GAAGC,aAAQ;;IAEjC,MAAM,aAAaC;MACjB,IAAI,EAAE,MAAM,IAAI;;MAEhB,GAAG,EAAE,GAAG,CAAC;KACV,CAAC,EAAE;IACJ,MAAM,WAAW,GAAGA;UACd,iBAAiB,GAAG,CAAC,CAAC,KAAK;MAC/B,IAAI,GAAG;;MAEP,IAAI,CAAC,CAAC,OAAO,IAAI,CAAC;eACT;;;MAGT,MAAM,EAAE,GAAG,CAAC,CAAC,aAAa,CAAC;MAC3B,IAAI,CAAC,EAAE;QACL,OAAO;cACD,CAAC,KAAK,CAAC,GAAG;;;;;MAKlB,MAAM,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC;MAC1B;YACM,uBAAuB,GAAG,CAAC,MAAM,GAAG,SAAS,IAAI,GAAG,GAAG,WAAW,CAAC;iBAChE,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,GAAG,uBAAuB,GAAGJ,WAAS,CAAC;;UAE1E,SAAS,GAAG,CAAC,CAAC,KAAK;QACrB,wBAAwB,EAAE,CAAC;gBACnB;cACF,CAAC,gBAAgB,CAAC;;;MAG1B,QAAQ,CAAC,aAAa,GAAG,MAAM,KAAK,CAAC;MACrC;UACI;MACJ,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK;;MAEnC,IAAI,UAAU,KAAK,KAAK;QACtB,OAAO;;MAET,IAAI,SAAS;eACJ;MACT,MAAM,MAAM,GAAG,CAAC,QAAQ,CAAC,MAAM;YACzB;YACA,uBAAuB,GAAG,CAAC,MAAM,GAAG,kBAAkB,IAAI,GAAG,GAAG;;;IAGxE,MAAM,sBAAsB,GAAG,MAAM;MACnC,UAAU,GAAG,KAAK;;MAElB,QAAQ,CAAC;cACD,CAAC,mBAAmB,CAAC,SAAS,EAAE,sBAAsB,CAAC,CAAC;0BAC5C,EAAE;MACtB;QACE,OAAO,CAAC,QAAQ,KAAK,CAAC;MACxB;UACI,4BAA4B,MAAM;iBAC3B,GAAG,KAAK,CAAC;;MAEpB;UACI;iBACO,GAAG,IAAI,CAAC;;;;MAInB,oBAAoB,EAAE,CAAC;MACvB,QAAQ,CAAC;MACT,CAAC;UACG,oBAAoB,GAAG,MAAM;MACjC,IAAI,QAAQ,CAAC,aAAa,KAAK,kBAAkB;QAC/C,QAAQ,CAAC,aAAa,GAAG;MAC3B;IACFK;;IAEA,OAAO;MACL,QAAQ;MACR,KAAK;;MAEL,UAAU;MACV,OAAO;;MAEP;;;;;;;"}

package/lib/components/scrollbar/src/bar.vue_vue_type_template_id_2f63f10a_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"bar.vue_vue_type_template_id_2f63f10a_lang.js","sources":["../../../../../../packages/components/scrollbar/src/bar.vue?vue&type=template&id=2f63f10a&lang.js"],"sourcesContent":["<template>\n  <transition name=\"el-scrollbar-fade\">\n    <div\n      v-show=\"always || visible\"\n      ref=\"instance\"\n      :class=\"['el-scrollbar__bar', 'is-' + bar.key]\"\n      @mousedown=\"clickTrackHandler\"\n    >\n      <div\n        ref=\"thumb\"\n        class=\"el-scrollbar__thumb\"\n        :style=\"thumbStyle\"\n        @mousedown=\"clickThumbHandler\"\n      ></div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  onBeforeUnmount,\n  ref,\n  toRef,\n} from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { throwError } from '@element-plus/utils/error'\nimport { BAR_MAP, renderThumbStyle } from './util'\n\nimport { barProps } from './bar'\n\nconst COMPONENT_NAME = 'Bar'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: barProps,\n\n  setup(props) {\n    const scrollbar = inject(scrollbarContextKey)\n    if (!scrollbar)\n      throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\n    const instance = ref<HTMLDivElement>()\n    const thumb = ref<HTMLDivElement>()\n\n    const barStore = ref({})\n    const visible = ref(false)\n\n    let cursorDown = false\n    let cursorLeave = false\n    let onselectstartStore:\n      | ((this: GlobalEventHandlers, ev: Event) => any)\n      | null = null\n\n    const bar = computed(\n      () => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']\n    )\n\n    const thumbStyle = computed(() =>\n      renderThumbStyle({\n        size: props.size,\n        move: props.move,\n        bar: bar.value,\n      })\n    )\n\n    const offsetRatio = computed(\n      () =>\n        // offsetRatioX = original width of thumb / current width of thumb / ratioX\n        // offsetRatioY = original height of thumb / current height of thumb / ratioY\n        // instance height = wrap height - GAP\n        instance.value![bar.value.offset] ** 2 /\n        scrollbar.wrapElement![bar.value.scrollSize] /\n        props.ratio /\n        thumb.value![bar.value.offset]\n    )\n\n    const clickThumbHandler = (e: MouseEvent) => {\n      // prevent click event of middle and right button\n      e.stopPropagation()\n      if (e.ctrlKey || [1, 2].includes(e.button)) return\n\n      window.getSelection()?.removeAllRanges()\n      startDrag(e)\n\n      const el = e.currentTarget as HTMLDivElement\n      if (!el) return\n      barStore.value[bar.value.axis] =\n        el[bar.value.offset] -\n        (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction])\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      if (!thumb.value || !instance.value || !scrollbar.wrapElement) return\n\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumb.value[bar.value.offset] / 2\n      const thumbPositionPercentage =\n        ((offset - thumbHalf) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const startDrag = (e: MouseEvent) => {\n      e.stopImmediatePropagation()\n      cursorDown = true\n      document.addEventListener('mousemove', mouseMoveDocumentHandler)\n      document.addEventListener('mouseup', mouseUpDocumentHandler)\n      onselectstartStore = document.onselectstart\n      document.onselectstart = () => false\n    }\n\n    const mouseMoveDocumentHandler = (e: MouseEvent) => {\n      if (!instance.value || !thumb.value) return\n      if (cursorDown === false) return\n\n      const prevPage = barStore.value[bar.value.axis]\n      if (!prevPage) return\n\n      const offset =\n        (instance.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage\n      const thumbPositionPercentage =\n        ((offset - thumbClickPosition) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const mouseUpDocumentHandler = () => {\n      cursorDown = false\n      barStore.value[bar.value.axis] = 0\n      document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n      document.onselectstart = onselectstartStore\n      if (cursorLeave) visible.value = false\n    }\n\n    const mouseMoveScrollbarHandler = () => {\n      cursorLeave = false\n      visible.value = !!props.size\n    }\n\n    const mouseLeaveScrollbarHandler = () => {\n      cursorLeave = true\n      visible.value = cursorDown\n    }\n\n    onBeforeUnmount(() =>\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n    )\n\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mousemove',\n      mouseMoveScrollbarHandler\n    )\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mouseleave',\n      mouseLeaveScrollbarHandler\n    )\n\n    return {\n      instance,\n      thumb,\n      bar,\n      thumbStyle,\n      visible,\n      clickTrackHandler,\n      clickThumbHandler,\n    }\n  },\n})\n</script>\n"],"names":["_createElementVNode","_normalizeStyle"],"mappings":";;;;;;;;;yBAEIA;;QAEE,KAAI;QACH;;;;UAIC,KAAI;UACJ,KAAK,EAACC;UACL;;;;;;;;;;;;"}
+{"version":3,"file":"bar.vue_vue_type_template_id_2f63f10a_lang.js","sources":["../../../../../../packages/components/scrollbar/src/bar.vue?vue&type=template&id=2f63f10a&lang.js"],"sourcesContent":["<template>\n  <transition name=\"el-scrollbar-fade\">\n    <div\n      v-show=\"always || visible\"\n      ref=\"instance\"\n      :class=\"['el-scrollbar__bar', 'is-' + bar.key]\"\n      @mousedown=\"clickTrackHandler\"\n    >\n      <div\n        ref=\"thumb\"\n        class=\"el-scrollbar__thumb\"\n        :style=\"thumbStyle\"\n        @mousedown=\"clickThumbHandler\"\n      ></div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  onBeforeUnmount,\n  ref,\n  toRef,\n} from 'vue'\nimport { useEventListener, isClient } from '@vueuse/core'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { throwError } from '@element-plus/utils/error'\nimport { BAR_MAP, renderThumbStyle } from './util'\n\nimport { barProps } from './bar'\n\nconst COMPONENT_NAME = 'Bar'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: barProps,\n\n  setup(props) {\n    const scrollbar = inject(scrollbarContextKey)\n    if (!scrollbar)\n      throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\n    const instance = ref<HTMLDivElement>()\n    const thumb = ref<HTMLDivElement>()\n\n    const barStore = ref({})\n    const visible = ref(false)\n\n    let cursorDown = false\n    let cursorLeave = false\n    let onselectstartStore:\n      | ((this: GlobalEventHandlers, ev: Event) => any)\n      | null = isClient ? document.onselectstart : null\n\n    const bar = computed(\n      () => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']\n    )\n\n    const thumbStyle = computed(() =>\n      renderThumbStyle({\n        size: props.size,\n        move: props.move,\n        bar: bar.value,\n      })\n    )\n\n    const offsetRatio = computed(\n      () =>\n        // offsetRatioX = original width of thumb / current width of thumb / ratioX\n        // offsetRatioY = original height of thumb / current height of thumb / ratioY\n        // instance height = wrap height - GAP\n        instance.value![bar.value.offset] ** 2 /\n        scrollbar.wrapElement![bar.value.scrollSize] /\n        props.ratio /\n        thumb.value![bar.value.offset]\n    )\n\n    const clickThumbHandler = (e: MouseEvent) => {\n      // prevent click event of middle and right button\n      e.stopPropagation()\n      if (e.ctrlKey || [1, 2].includes(e.button)) return\n\n      window.getSelection()?.removeAllRanges()\n      startDrag(e)\n\n      const el = e.currentTarget as HTMLDivElement\n      if (!el) return\n      barStore.value[bar.value.axis] =\n        el[bar.value.offset] -\n        (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction])\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      if (!thumb.value || !instance.value || !scrollbar.wrapElement) return\n\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumb.value[bar.value.offset] / 2\n      const thumbPositionPercentage =\n        ((offset - thumbHalf) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const startDrag = (e: MouseEvent) => {\n      e.stopImmediatePropagation()\n      cursorDown = true\n      document.addEventListener('mousemove', mouseMoveDocumentHandler)\n      document.addEventListener('mouseup', mouseUpDocumentHandler)\n      onselectstartStore = document.onselectstart\n      document.onselectstart = () => false\n    }\n\n    const mouseMoveDocumentHandler = (e: MouseEvent) => {\n      if (!instance.value || !thumb.value) return\n      if (cursorDown === false) return\n\n      const prevPage = barStore.value[bar.value.axis]\n      if (!prevPage) return\n\n      const offset =\n        (instance.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage\n      const thumbPositionPercentage =\n        ((offset - thumbClickPosition) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const mouseUpDocumentHandler = () => {\n      cursorDown = false\n      barStore.value[bar.value.axis] = 0\n      document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n      restoreOnselectstart()\n      if (cursorLeave) visible.value = false\n    }\n\n    const mouseMoveScrollbarHandler = () => {\n      cursorLeave = false\n      visible.value = !!props.size\n    }\n\n    const mouseLeaveScrollbarHandler = () => {\n      cursorLeave = true\n      visible.value = cursorDown\n    }\n\n    onBeforeUnmount(() => {\n      restoreOnselectstart()\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n    })\n\n    const restoreOnselectstart = () => {\n      if (document.onselectstart !== onselectstartStore)\n        document.onselectstart = onselectstartStore\n    }\n\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mousemove',\n      mouseMoveScrollbarHandler\n    )\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mouseleave',\n      mouseLeaveScrollbarHandler\n    )\n\n    return {\n      instance,\n      thumb,\n      bar,\n      thumbStyle,\n      visible,\n      clickTrackHandler,\n      clickThumbHandler,\n    }\n  },\n})\n</script>\n"],"names":["_createElementVNode","_normalizeStyle"],"mappings":";;;;;;;;;yBAEIA;;QAEE,KAAI;QACH;;;;UAIC,KAAI;UACJ,KAAK,EAACC;UACL;;;;;;;;;;;;"}

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

@@ -45,8 +45,8 @@ declare const _default: import("vue").DefineComponent<{
     readonly minSize?: unknown;
 } & {
     height: import("../../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
-    always: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     maxHeight: import("../../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+    always: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     native: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     wrapStyle: StyleValue;
     wrapClass: import("../../../utils/props").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
@@ -62,8 +62,8 @@ declare const _default: import("vue").DefineComponent<{
     }) => any) | undefined;
 }, {
     height: import("../../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
-    always: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     maxHeight: import("../../../utils/props").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+    always: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     native: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     wrapStyle: StyleValue;
     wrapClass: import("../../../utils/props").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;

package/lib/components/select/index.d.ts

@@ -134,9 +134,8 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -199,6 +198,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -252,9 +252,8 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -317,6 +316,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -334,7 +334,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             virtualTriggering?: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown> | undefined;
         }> & {
             [x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "style" | "transition" | "offset" | "visible" | "content" | "effect" | "arrowOffset" | "boundariesPadding" | "fallbackPlacements" | "gpuAcceleration" | "placement" | "popperOptions" | "strategy" | "className" | "enterable" | "pure" | "popperClass" | "popperStyle" | "referenceEl" | "stopPopperMouseEvent" | "showAfter" | "hideAfter" | "appendTo" | "rawContent" | "persistent" | "teleported" | "trigger" | "virtualRef" | "virtualTriggering" | "openDelay" | "visibleArrow" | "showArrow">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "style" | "transition" | "offset" | "effect" | "visible" | "arrowOffset" | "boundariesPadding" | "fallbackPlacements" | "gpuAcceleration" | "placement" | "popperOptions" | "strategy" | "className" | "enterable" | "pure" | "popperClass" | "popperStyle" | "referenceEl" | "stopPopperMouseEvent" | "content" | "showAfter" | "hideAfter" | "appendTo" | "rawContent" | "persistent" | "teleported" | "trigger" | "virtualRef" | "virtualTriggering" | "openDelay" | "visibleArrow" | "showArrow">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -389,9 +389,8 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -454,6 +453,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -513,6 +513,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
                 $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
             } & Readonly<{} & {} & {}> & import("vue").ShallowUnwrapRef<import("..").ElPopperInjectionContext> & {} & {} & import("vue").ComponentCustomProperties) | null>;
             open: import("vue").Ref<boolean>;
+            hide: () => void;
             updatePopper: () => void;
             onOpen: () => void;
             onClose: () => void;
@@ -521,9 +522,8 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -586,6 +586,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -659,9 +660,8 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
         style: import("vue").StyleValue;
         transition: string;
         offset: number;
-        visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-        content: string;
         effect: string;
+        visible: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
         arrowOffset: number;
         boundariesPadding: number;
         fallbackPlacements: import("@popperjs/core").Placement[];
@@ -724,6 +724,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
         popperStyle: import("vue").StyleValue;
         referenceEl: HTMLElement;
         stopPopperMouseEvent: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+        content: string;
         showAfter: number;
         hideAfter: number;
         appendTo: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -783,6 +784,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
             $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
         } & Readonly<{} & {} & {}> & import("vue").ShallowUnwrapRef<import("..").ElPopperInjectionContext> & {} & {} & import("vue").ComponentCustomProperties) | null>;
         open: import("vue").Ref<boolean>;
+        hide: () => void;
         updatePopper: () => void;
         onOpen: () => void;
         onClose: () => void;
@@ -832,8 +834,8 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
 } & {
     disabled: boolean;
     loading: boolean;
-    multiple: boolean;
     popperClass: string;
+    multiple: boolean;
     autocomplete: string;
     clearable: boolean;
     suffixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
@@ -873,8 +875,8 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     disabled: boolean;
     loading: boolean;
     modelValue: string | number | boolean | unknown[] | Record<string, any>;
-    multiple: boolean;
     popperClass: string;
+    multiple: boolean;
     autocomplete: string;
     clearable: boolean;
     suffixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;