@element-plus/nightly 0.0.20220114 → 0.0.20220118

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

@@ -4,7 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 var index = require('../../icon/index.js');
+require('../../../hooks/index.js');
+var util = require('../../../utils/util.js');
 var avatar = require('./avatar.js');
+var index$1 = require('../../../hooks/use-namespace/index.js');
+var shared = require('@vue/shared');
 
 var script = vue.defineComponent({
   name: "ElAvatar",
@@ -14,23 +18,24 @@ var script = vue.defineComponent({
   props: avatar.avatarProps,
   emits: avatar.avatarEmits,
   setup(props, { emit }) {
+    const ns = index$1.useNamespace("avatar");
     const hasLoadError = vue.ref(false);
     const avatarClass = vue.computed(() => {
       const { size, icon, shape } = props;
-      const classList = ["el-avatar"];
-      if (size && typeof size === "string")
-        classList.push(`el-avatar--${size}`);
+      const classList = [ns.b()];
+      if (shared.isString(size))
+        classList.push(ns.m(size));
       if (icon)
-        classList.push("el-avatar--icon");
+        classList.push(ns.m("icon"));
       if (shape)
-        classList.push(`el-avatar--${shape}`);
+        classList.push(ns.m(shape));
       return classList;
     });
     const sizeStyle = vue.computed(() => {
       const { size } = props;
-      return typeof size === "number" ? {
-        "--el-avatar-size": `${size}px`
-      } : {};
+      return {
+        "--el-avatar-size": util.isNumber(size) ? util.addUnit(size) : void 0
+      };
     });
     const fitStyle = vue.computed(() => ({
       objectFit: props.fit

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

@@ -1 +1 @@
-{"version":3,"file":"avatar.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/avatar/src/avatar.vue"],"sourcesContent":["<template>\n  <span :class=\"avatarClass\" :style=\"sizeStyle\">\n    <img\n      v-if=\"(src || srcSet) && !hasLoadError\"\n      :src=\"src\"\n      :alt=\"alt\"\n      :srcset=\"srcSet\"\n      :style=\"fitStyle\"\n      @error=\"handleError\"\n    />\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <slot v-else></slot>\n  </span>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, watch } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { avatarEmits, avatarProps } from './avatar'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAvatar',\n  components: {\n    ElIcon,\n  },\n  props: avatarProps,\n  emits: avatarEmits,\n\n  setup(props, { emit }) {\n    const hasLoadError = ref(false)\n\n    const avatarClass = computed(() => {\n      const { size, icon, shape } = props\n      const classList = ['el-avatar']\n      if (size && typeof size === 'string') classList.push(`el-avatar--${size}`)\n      if (icon) classList.push('el-avatar--icon')\n      if (shape) classList.push(`el-avatar--${shape}`)\n      return classList\n    })\n\n    const sizeStyle = computed<CSSProperties>(() => {\n      const { size } = props\n      return typeof size === 'number'\n        ? {\n            '--el-avatar-size': `${size}px`,\n          }\n        : {}\n    })\n\n    const fitStyle = computed<CSSProperties>(() => ({\n      objectFit: props.fit,\n    }))\n\n    // need reset hasLoadError to false if src changed\n    watch(\n      () => props.src,\n      () => (hasLoadError.value = false)\n    )\n\n    function handleError(e: Event) {\n      hasLoadError.value = true\n      emit('error', e)\n    }\n\n    return {\n      hasLoadError,\n      avatarClass,\n      sizeStyle,\n      fitStyle,\n      handleError,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","avatarProps","avatarEmits","computed"],"mappings":";;;;;;;;AAoBA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,UAAU,EAAE;;AAEd,GAAG;EACD,OAAOC;EACP,KAAK,EAAEC;OACF,CAAC;;IAEJ,MAAM;MACJ,MAAM,EAAE,IAAI,EAAE;;MAEd,IAAI,QAAQ,OAAO;QACjB,SAAS,CAAC,KAAK;;QAEf,SAAS,CAAC,IAAI;MAChB,IAAI,KAAK;QACP,SAAS,CAAC,IAAI,EAAE,WAAW;MAC7B,OAAO,SAAS,CAAC;MACjB,CAAC;UACG,SAAS,GAAGC,YAAQ,CAAC,MAAM;MAC/B,QAAQ,IAAI,EAAE;;;OAGb,GAAG,EAAE,CAAC;MACP,CAAC;UACG,QAAQ,GAAGA,YAAQ,CAAC;;;cAGpB;;;;KAIL;WACM;MACL;;eAES;MACT;MACA,WAAW;MACX;;;;;;"}
+{"version":3,"file":"avatar.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/avatar/src/avatar.vue"],"sourcesContent":["<template>\n  <span :class=\"avatarClass\" :style=\"sizeStyle\">\n    <img\n      v-if=\"(src || srcSet) && !hasLoadError\"\n      :src=\"src\"\n      :alt=\"alt\"\n      :srcset=\"srcSet\"\n      :style=\"fitStyle\"\n      @error=\"handleError\"\n    />\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <slot v-else></slot>\n  </span>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, watch } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addUnit, isNumber, isString } from '@element-plus/utils/util'\nimport { avatarEmits, avatarProps } from './avatar'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAvatar',\n  components: {\n    ElIcon,\n  },\n  props: avatarProps,\n  emits: avatarEmits,\n\n  setup(props, { emit }) {\n    const ns = useNamespace('avatar')\n\n    const hasLoadError = ref(false)\n\n    const avatarClass = computed(() => {\n      const { size, icon, shape } = props\n      const classList = [ns.b()]\n      if (isString(size)) classList.push(ns.m(size))\n      if (icon) classList.push(ns.m('icon'))\n      if (shape) classList.push(ns.m(shape))\n      return classList\n    })\n\n    const sizeStyle = computed(() => {\n      const { size } = props\n      return {\n        '--el-avatar-size': isNumber(size) ? addUnit(size) : undefined,\n      } as CSSProperties\n    })\n\n    const fitStyle = computed<CSSProperties>(() => ({\n      objectFit: props.fit,\n    }))\n\n    // need reset hasLoadError to false if src changed\n    watch(\n      () => props.src,\n      () => (hasLoadError.value = false)\n    )\n\n    function handleError(e: Event) {\n      hasLoadError.value = true\n      emit('error', e)\n    }\n\n    return {\n      hasLoadError,\n      avatarClass,\n      sizeStyle,\n      fitStyle,\n      handleError,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","avatarProps","avatarEmits","isString","computed"],"mappings":";;;;;;;;;;;;AAsBA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,UAAU,EAAE;;AAEd,GAAG;EACD,OAAOC;EACP,KAAK,EAAEC;OACF,CAAC;;IAEJ,MAAM;IACN,MAAM;;MAEJ,MAAM,aAAa;MACnB,IAAIC,eAAQ,CAAC,IAAI,CAAC;;MAElB,IAAI,IAAI;;MAER,IAAI,KAAK;QACP,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE;MAC9B,OAAO,SAAS;MAChB,CAAC;UACG,SAAS,GAAGC,YAAQ,CAAC,MAAM;MAC/B,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;MACvB,OAAO;;;KAGR,CAAC,CAAC;UACG,WAAWA;MACf;QACE;aACC,OAAO,KAAK,CAAC;IAClB;;MAEE,IAAI,CAAC,UAAU,CAAC,CAAC;;IAEnB;;;MAGE;MACA,QAAQ;MACR,WAAW;;;;;;;"}

package/lib/components/avatar/src/avatar.vue_vue_type_template_id_46e3f365_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.vue_vue_type_template_id_46e3f365_lang.js","sources":["../../../../../../packages/components/avatar/src/avatar.vue?vue&type=template&id=46e3f365&lang.js"],"sourcesContent":["<template>\n  <span :class=\"avatarClass\" :style=\"sizeStyle\">\n    <img\n      v-if=\"(src || srcSet) && !hasLoadError\"\n      :src=\"src\"\n      :alt=\"alt\"\n      :srcset=\"srcSet\"\n      :style=\"fitStyle\"\n      @error=\"handleError\"\n    />\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <slot v-else></slot>\n  </span>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, watch } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { avatarEmits, avatarProps } from './avatar'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAvatar',\n  components: {\n    ElIcon,\n  },\n  props: avatarProps,\n  emits: avatarEmits,\n\n  setup(props, { emit }) {\n    const hasLoadError = ref(false)\n\n    const avatarClass = computed(() => {\n      const { size, icon, shape } = props\n      const classList = ['el-avatar']\n      if (size && typeof size === 'string') classList.push(`el-avatar--${size}`)\n      if (icon) classList.push('el-avatar--icon')\n      if (shape) classList.push(`el-avatar--${shape}`)\n      return classList\n    })\n\n    const sizeStyle = computed<CSSProperties>(() => {\n      const { size } = props\n      return typeof size === 'number'\n        ? {\n            '--el-avatar-size': `${size}px`,\n          }\n        : {}\n    })\n\n    const fitStyle = computed<CSSProperties>(() => ({\n      objectFit: props.fit,\n    }))\n\n    // need reset hasLoadError to false if src changed\n    watch(\n      () => props.src,\n      () => (hasLoadError.value = false)\n    )\n\n    function handleError(e: Event) {\n      hasLoadError.value = true\n      emit('error', e)\n    }\n\n    return {\n      hasLoadError,\n      avatarClass,\n      sizeStyle,\n      fitStyle,\n      handleError,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;IACS,KAAK;SAAqB;;MAEtB;;;aACH,EAAE,QAAG;aACL,EAAE;;;;;;;;;;;"}
+{"version":3,"file":"avatar.vue_vue_type_template_id_46e3f365_lang.js","sources":["../../../../../../packages/components/avatar/src/avatar.vue?vue&type=template&id=46e3f365&lang.js"],"sourcesContent":["<template>\n  <span :class=\"avatarClass\" :style=\"sizeStyle\">\n    <img\n      v-if=\"(src || srcSet) && !hasLoadError\"\n      :src=\"src\"\n      :alt=\"alt\"\n      :srcset=\"srcSet\"\n      :style=\"fitStyle\"\n      @error=\"handleError\"\n    />\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <slot v-else></slot>\n  </span>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, watch } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addUnit, isNumber, isString } from '@element-plus/utils/util'\nimport { avatarEmits, avatarProps } from './avatar'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAvatar',\n  components: {\n    ElIcon,\n  },\n  props: avatarProps,\n  emits: avatarEmits,\n\n  setup(props, { emit }) {\n    const ns = useNamespace('avatar')\n\n    const hasLoadError = ref(false)\n\n    const avatarClass = computed(() => {\n      const { size, icon, shape } = props\n      const classList = [ns.b()]\n      if (isString(size)) classList.push(ns.m(size))\n      if (icon) classList.push(ns.m('icon'))\n      if (shape) classList.push(ns.m(shape))\n      return classList\n    })\n\n    const sizeStyle = computed(() => {\n      const { size } = props\n      return {\n        '--el-avatar-size': isNumber(size) ? addUnit(size) : undefined,\n      } as CSSProperties\n    })\n\n    const fitStyle = computed<CSSProperties>(() => ({\n      objectFit: props.fit,\n    }))\n\n    // need reset hasLoadError to false if src changed\n    watch(\n      () => props.src,\n      () => (hasLoadError.value = false)\n    )\n\n    function handleError(e: Event) {\n      hasLoadError.value = true\n      emit('error', e)\n    }\n\n    return {\n      hasLoadError,\n      avatarClass,\n      sizeStyle,\n      fitStyle,\n      handleError,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;IACS,KAAK;SAAqB;;MAEtB;;;aACH,EAAE,QAAG;aACL,EAAE;;;;;;;;;;;"}

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

@@ -1,5 +1,5 @@
 export declare const ElButton: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
-    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly disabled: BooleanConstructor;
     readonly type: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     readonly icon: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
@@ -19,6 +19,17 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     buttonDisabled: import("vue").ComputedRef<boolean>;
     shouldAddSpace: import("vue").ComputedRef<boolean>;
     handleClick: (evt: MouseEvent) => void;
+    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;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: (evt: MouseEvent) => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
@@ -38,7 +49,6 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     icon: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
     nativeType: import("../../utils/props").BuildPropType<StringConstructor, "button" | "submit" | "reset", unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
     disabled: boolean;
     loading: boolean;
     plain: boolean;
@@ -47,6 +57,7 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     circle: boolean;
 } & {
     autoInsertSpace?: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown> | undefined;
+    size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
     color?: string | undefined;
 }> & {
     onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -55,7 +66,7 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     icon: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
     nativeType: import("../../utils/props").BuildPropType<StringConstructor, "button" | "submit" | "reset", unknown>;
     autoInsertSpace: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+    size: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
     disabled: boolean;
     loading: boolean;
     plain: boolean;
@@ -64,31 +75,57 @@ export declare const ElButton: import("../../utils/types").SFCWithInstall<import
     circle: boolean;
 }>> & {
     ButtonGroup: import("vue").DefineComponent<{
-        readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+        readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
         readonly type: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    }, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    }, {
+        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;
+        };
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
         readonly size?: unknown;
         readonly type?: unknown;
     } & {
         type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
-    } & {}>, {
+    } & {
+        size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
+    }>, {
         type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+        size: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
     }>;
 };
 export declare const ElButtonGroup: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
-    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly type: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-}, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, {
+    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;
+    };
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;
     readonly type?: unknown;
 } & {
     type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
-} & {}>, {
+} & {
+    size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
+}>, {
     type: import("../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+    size: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
 }>>;
 export default ElButton;
 export * from './src/button';

package/lib/components/button/index.js

@@ -17,7 +17,6 @@ const ElButtonGroup = withInstall.withNoopInstall(buttonGroup_vue_vue_type_scrip
 exports.buttonEmits = button.buttonEmits;
 exports.buttonNativeType = button.buttonNativeType;
 exports.buttonProps = button.buttonProps;
-exports.buttonSize = button.buttonSize;
 exports.buttonType = button.buttonType;
 exports.ElButton = ElButton;
 exports.ElButtonGroup = ElButtonGroup;

package/lib/components/button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/components/button/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils/with-install'\nimport Button from './src/button.vue'\nimport ButtonGroup from './src/button-group.vue'\n\nexport const ElButton = withInstall(Button, {\n  ButtonGroup,\n})\nexport const ElButtonGroup = withNoopInstall(ButtonGroup)\nexport default ElButton\n\nexport * from './src/button'\n"],"names":["withInstall","Button","ButtonGroup","withNoopInstall"],"mappings":";;;;;;;;;;;AAGY,MAAC,QAAQ,GAAGA,uBAAW,CAACC,0CAAM,EAAE;AAC5C,eAAEC,+CAAW;AACb,CAAC,EAAE;AACS,MAAC,aAAa,GAAGC,2BAAe,CAACD,+CAAW;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/button/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils/with-install'\nimport Button from './src/button.vue'\nimport ButtonGroup from './src/button-group.vue'\n\nexport const ElButton = withInstall(Button, {\n  ButtonGroup,\n})\nexport const ElButtonGroup = withNoopInstall(ButtonGroup)\nexport default ElButton\n\nexport * from './src/button'\n"],"names":["withInstall","Button","ButtonGroup","withNoopInstall"],"mappings":";;;;;;;;;;;AAGY,MAAC,QAAQ,GAAGA,uBAAW,CAACC,0CAAM,EAAE;AAC5C,eAAEC,+CAAW;AACb,CAAC,EAAE;AACS,MAAC,aAAa,GAAGC,2BAAe,CAACD,+CAAW;;;;;;;;;;"}

package/lib/components/button/src/button-group.d.ts

@@ -1,7 +1,7 @@
 import type { ExtractPropTypes } from 'vue';
 import type buttonGroup from './button-group.vue';
 export declare const buttonGroupProps: {
-    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
 };
 export declare type ButtonGroupProps = ExtractPropTypes<typeof buttonGroupProps>;

package/lib/components/button/src/button-group.vue.d.ts

@@ -1,14 +1,27 @@
 declare const _default: import("vue").DefineComponent<{
-    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-}, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, {
+    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;
+    };
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;
     readonly type?: unknown;
 } & {
     type: import("../../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
-} & {}>, {
+} & {
+    size?: import("../../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
+}>, {
     type: import("../../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
-    size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+    size: import("../../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
 }>;
 export default _default;

package/lib/components/button/src/button-group.vue_vue_type_script_lang.js

@@ -4,8 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 require('../../../tokens/index.js');
+require('../../../hooks/index.js');
 var buttonGroup = require('./button-group.js');
 var button = require('../../../tokens/button.js');
+var index = require('../../../hooks/use-namespace/index.js');
 
 var script = vue.defineComponent({
   name: "ElButtonGroup",
@@ -15,6 +17,10 @@ var script = vue.defineComponent({
       size: vue.toRef(props, "size"),
       type: vue.toRef(props, "type")
     }));
+    const ns = index.useNamespace("button");
+    return {
+      ns
+    };
   }
 });
 

package/lib/components/button/src/button-group.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/button/src/button-group.vue"],"sourcesContent":["<template>\n  <div class=\"el-button-group\">\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, provide, reactive, toRef } from 'vue'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { buttonGroupProps } from './button-group'\n\nexport default defineComponent({\n  name: 'ElButtonGroup',\n  props: buttonGroupProps,\n\n  setup(props) {\n    provide(\n      buttonGroupContextKey,\n      reactive({\n        size: toRef(props, 'size'),\n        type: toRef(props, 'type'),\n      })\n    )\n  },\n})\n</script>\n"],"names":["defineComponent","buttonGroupProps","provide","buttonGroupContextKey","toRef"],"mappings":";;;;;;;;;AAQA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,4BAAgB;EACvB,MAAM,KAAK,EAAE;IACXC,WAAO,CAACC;;MAEN,IAAI,EAAEC;KACP,CAAC,CAAC,CAAC;;;;;;"}
+{"version":3,"file":"button-group.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/button/src/button-group.vue"],"sourcesContent":["<template>\n  <div :class=\"`${ns.b('group')}`\">\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, provide, reactive, toRef } from 'vue'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { useNamespace } from '@element-plus/hooks'\nimport { buttonGroupProps } from './button-group'\n\nexport default defineComponent({\n  name: 'ElButtonGroup',\n  props: buttonGroupProps,\n\n  setup(props) {\n    provide(\n      buttonGroupContextKey,\n      reactive({\n        size: toRef(props, 'size'),\n        type: toRef(props, 'type'),\n      })\n    )\n    const ns = useNamespace('button')\n    return {\n      ns,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","buttonGroupProps","provide","buttonGroupContextKey","toRef","useNamespace"],"mappings":";;;;;;;;;;;AASA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,4BAAgB;EACvB,MAAM,KAAK,EAAE;IACXC,WAAO,CAACC;;MAEN,IAAI,EAAEC;KACP,CAAC,CAAC,CAAC;UACE,EAAE,GAAGC,kBAAY;WAChB;QACH;;;;;;;"}

package/lib/components/button/src/button-group.vue_vue_type_template_id_1bab7d77_lang.js

@@ -4,11 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 
-const _hoisted_1 = { class: "el-button-group" };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+  return vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass(`${_ctx.ns.b("group")}`)
+  }, [
     vue.renderSlot(_ctx.$slots, "default")
-  ]);
+  ], 2);
 }
 
 exports.render = render;

package/lib/components/button/src/button-group.vue_vue_type_template_id_1bab7d77_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.vue_vue_type_template_id_1bab7d77_lang.js","sources":["../../../../../../packages/components/button/src/button-group.vue?vue&type=template&id=1bab7d77&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-button-group\">\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, provide, reactive, toRef } from 'vue'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { buttonGroupProps } from './button-group'\n\nexport default defineComponent({\n  name: 'ElButtonGroup',\n  props: buttonGroupProps,\n\n  setup(props) {\n    provide(\n      buttonGroupContextKey,\n      reactive({\n        size: toRef(props, 'size'),\n        type: toRef(props, 'type'),\n      })\n    )\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;sCAC8B;;;;;;;;"}
+{"version":3,"file":"button-group.vue_vue_type_template_id_1bab7d77_lang.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

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

@@ -1,10 +1,9 @@
 import type { ExtractPropTypes, Component } from 'vue';
 import type button from './button.vue';
 export declare const buttonType: readonly ["default", "primary", "success", "warning", "info", "danger", "text", ""];
-export declare const buttonSize: readonly ["", "large", "default", "small"];
 export declare const buttonNativeType: readonly ["button", "submit", "reset"];
 export declare const buttonProps: {
-    readonly size: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly disabled: BooleanConstructor;
     readonly type: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     readonly icon: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;

package/lib/components/button/src/button.js

@@ -16,7 +16,6 @@ const buttonType = [
   "text",
   ""
 ];
-const buttonSize = ["", "large", "default", "small"];
 const buttonNativeType = ["button", "submit", "reset"];
 const buttonProps = props.buildProps({
   size: index.useSizeProp,
@@ -53,6 +52,5 @@ const buttonEmits = {
 exports.buttonEmits = buttonEmits;
 exports.buttonNativeType = buttonNativeType;
 exports.buttonProps = buttonProps;
-exports.buttonSize = buttonSize;
 exports.buttonType = buttonType;
 //# sourceMappingURL=button.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../../../../packages/components/button/src/button.ts"],"sourcesContent":["import { useSizeProp } from '@element-plus/hooks'\nimport { buildProps, definePropType } from '@element-plus/utils/props'\nimport type { ExtractPropTypes, Component } from 'vue'\nimport type button from './button.vue'\n\nexport const buttonType = [\n  'default',\n  'primary',\n  'success',\n  'warning',\n  'info',\n  'danger',\n  'text',\n  '',\n] as const\nexport const buttonSize = ['', 'large', 'default', 'small'] as const\nexport const buttonNativeType = ['button', 'submit', 'reset'] as const\n\nexport const buttonProps = buildProps({\n  size: useSizeProp,\n  disabled: Boolean,\n  type: {\n    type: String,\n    values: buttonType,\n    default: '',\n  },\n  icon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  nativeType: {\n    type: String,\n    values: buttonNativeType,\n    default: 'button',\n  },\n  loading: Boolean,\n  plain: Boolean,\n  autofocus: Boolean,\n  round: Boolean,\n  circle: Boolean,\n  color: String,\n  autoInsertSpace: {\n    type: Boolean,\n    default: undefined,\n  },\n} as const)\n\nexport interface ButtonConfigContext {\n  autoInsertSpace?: boolean\n}\n\nexport const buttonEmits = {\n  click: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\n\nexport type ButtonProps = ExtractPropTypes<typeof buttonProps>\nexport type ButtonEmits = typeof buttonEmits\n\nexport type ButtonType = ButtonProps['type']\nexport type ButtonNativeType = ButtonProps['nativeType']\n\nexport type ButtonInstance = InstanceType<typeof button>\n"],"names":["buildProps","useSizeProp","definePropType"],"mappings":";;;;;;;;AAEY,MAAC,UAAU,GAAG;AAC1B,EAAE,SAAS;AACX,EAAE,SAAS;AACX,EAAE,SAAS;AACX,EAAE,SAAS;AACX,EAAE,MAAM;AACR,EAAE,QAAQ;AACV,EAAE,MAAM;AACR,EAAE,EAAE;AACJ,EAAE;AACU,MAAC,UAAU,GAAG,CAAC,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE;AAChD,MAAC,gBAAgB,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE;AAClD,MAAC,WAAW,GAAGA,gBAAU,CAAC;AACtC,EAAE,IAAI,EAAEC,iBAAW;AACnB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,UAAU;AACtB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,gBAAgB;AAC5B,IAAI,OAAO,EAAE,QAAQ;AACrB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,KAAK,EAAE,OAAO;AAChB,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,KAAK,EAAE,OAAO;AAChB,EAAE,MAAM,EAAE,OAAO;AACjB,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,WAAW,GAAG;AAC3B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;;;;;"}
+{"version":3,"file":"button.js","sources":["../../../../../../packages/components/button/src/button.ts"],"sourcesContent":["import { useSizeProp } from '@element-plus/hooks'\nimport { buildProps, definePropType } from '@element-plus/utils/props'\nimport type { ExtractPropTypes, Component } from 'vue'\nimport type button from './button.vue'\n\nexport const buttonType = [\n  'default',\n  'primary',\n  'success',\n  'warning',\n  'info',\n  'danger',\n  'text',\n  '',\n] as const\nexport const buttonNativeType = ['button', 'submit', 'reset'] as const\n\nexport const buttonProps = buildProps({\n  size: useSizeProp,\n  disabled: Boolean,\n  type: {\n    type: String,\n    values: buttonType,\n    default: '',\n  },\n  icon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  nativeType: {\n    type: String,\n    values: buttonNativeType,\n    default: 'button',\n  },\n  loading: Boolean,\n  plain: Boolean,\n  autofocus: Boolean,\n  round: Boolean,\n  circle: Boolean,\n  color: String,\n  autoInsertSpace: {\n    type: Boolean,\n    default: undefined,\n  },\n} as const)\n\nexport interface ButtonConfigContext {\n  autoInsertSpace?: boolean\n}\n\nexport const buttonEmits = {\n  click: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\n\nexport type ButtonProps = ExtractPropTypes<typeof buttonProps>\nexport type ButtonEmits = typeof buttonEmits\n\nexport type ButtonType = ButtonProps['type']\nexport type ButtonNativeType = ButtonProps['nativeType']\n\nexport type ButtonInstance = InstanceType<typeof button>\n"],"names":["buildProps","useSizeProp","definePropType"],"mappings":";;;;;;;;AAEY,MAAC,UAAU,GAAG;AAC1B,EAAE,SAAS;AACX,EAAE,SAAS;AACX,EAAE,SAAS;AACX,EAAE,SAAS;AACX,EAAE,MAAM;AACR,EAAE,QAAQ;AACV,EAAE,MAAM;AACR,EAAE,EAAE;AACJ,EAAE;AACU,MAAC,gBAAgB,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE;AAClD,MAAC,WAAW,GAAGA,gBAAU,CAAC;AACtC,EAAE,IAAI,EAAEC,iBAAW;AACnB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,UAAU;AACtB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,gBAAgB;AAC5B,IAAI,OAAO,EAAE,QAAQ;AACrB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,KAAK,EAAE,OAAO;AAChB,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,KAAK,EAAE,OAAO;AAChB,EAAE,MAAM,EAAE,OAAO;AACjB,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,WAAW,GAAG;AAC3B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;;;;"}

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

@@ -1,5 +1,5 @@
 declare const _default: import("vue").DefineComponent<{
-    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, "", false, "" | "small" | "default" | "large", never>;
+    readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, never, false, "small" | "default" | "large", never>;
     readonly disabled: BooleanConstructor;
     readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     readonly icon: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
@@ -19,6 +19,17 @@ declare const _default: import("vue").DefineComponent<{
     buttonDisabled: import("vue").ComputedRef<boolean>;
     shouldAddSpace: import("vue").ComputedRef<boolean>;
     handleClick: (evt: MouseEvent) => void;
+    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;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: (evt: MouseEvent) => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
@@ -38,7 +49,6 @@ declare const _default: import("vue").DefineComponent<{
     type: import("../../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>;
     icon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
     nativeType: import("../../../utils/props").BuildPropType<StringConstructor, "button" | "submit" | "reset", unknown>;
-    size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
     disabled: boolean;
     loading: boolean;
     plain: boolean;
@@ -47,6 +57,7 @@ declare const _default: import("vue").DefineComponent<{
     circle: boolean;
 } & {
     autoInsertSpace?: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown> | undefined;
+    size?: import("../../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never> | undefined;
     color?: string | undefined;
 }> & {
     onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -55,7 +66,7 @@ declare const _default: import("vue").DefineComponent<{
     icon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
     nativeType: import("../../../utils/props").BuildPropType<StringConstructor, "button" | "submit" | "reset", unknown>;
     autoInsertSpace: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
+    size: import("../../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", never>;
     disabled: boolean;
     loading: boolean;
     plain: boolean;

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

@@ -12,8 +12,9 @@ var iconsVue = require('@element-plus/icons-vue');
 var button = require('./button.js');
 var button$1 = require('../../../tokens/button.js');
 var index$1 = require('../../../hooks/use-global-config/index.js');
-var index$2 = require('../../../hooks/use-form-item/index.js');
-var index$3 = require('../../../hooks/use-common-props/index.js');
+var index$2 = require('../../../hooks/use-namespace/index.js');
+var index$3 = require('../../../hooks/use-form-item/index.js');
+var index$4 = require('../../../hooks/use-common-props/index.js');
 
 var script = vue.defineComponent({
   name: "ElButton",
@@ -27,6 +28,7 @@ var script = vue.defineComponent({
     const buttonRef = vue.ref();
     const buttonGroupContext = vue.inject(button$1.buttonGroupContextKey, void 0);
     const globalConfig = index$1.useGlobalConfig("button");
+    const ns = index$2.useNamespace("button");
     const autoInsertSpace = vue.computed(() => {
       var _a, _b, _c;
       return (_c = (_b = props.autoInsertSpace) != null ? _b : (_a = globalConfig.value) == null ? void 0 : _a.autoInsertSpace) != null ? _c : false;
@@ -43,9 +45,9 @@ var script = vue.defineComponent({
       }
       return false;
     });
-    const { form } = index$2.useFormItem();
-    const buttonSize = index$3.useSize(vue.computed(() => buttonGroupContext == null ? void 0 : buttonGroupContext.size));
-    const buttonDisabled = index$3.useDisabled();
+    const { form } = index$3.useFormItem();
+    const buttonSize = index$4.useSize(vue.computed(() => buttonGroupContext == null ? void 0 : buttonGroupContext.size));
+    const buttonDisabled = index$4.useDisabled();
     const buttonType = vue.computed(() => props.type || (buttonGroupContext == null ? void 0 : buttonGroupContext.type) || "");
     const typeColor = vue.computed(() => core.useCssVar(`--el-color-${props.type}`).value);
     const buttonStyle = vue.computed(() => {
@@ -96,7 +98,8 @@ var script = vue.defineComponent({
       buttonType,
       buttonDisabled,
       shouldAddSpace,
-      handleClick
+      handleClick,
+      ns
     };
   }
 });

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

@@ -1 +1 @@
-{"version":3,"file":"button.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/button/src/button.vue"],"sourcesContent":["<template>\n  <button\n    ref=\"buttonRef\"\n    :class=\"[\n      'el-button',\n      buttonType ? 'el-button--' + buttonType : '',\n      buttonSize ? 'el-button--' + buttonSize : '',\n      {\n        'is-disabled': buttonDisabled,\n        'is-loading': loading,\n        'is-plain': plain,\n        'is-round': round,\n        'is-circle': circle,\n      },\n    ]\"\n    :disabled=\"buttonDisabled || loading\"\n    :autofocus=\"autofocus\"\n    :type=\"nativeType\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <el-icon v-if=\"loading\" class=\"is-loading\">\n      <loading />\n    </el-icon>\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <span\n      v-if=\"$slots.default\"\n      :class=\"{ 'el-button__text--expand': shouldAddSpace }\"\n    >\n      <slot></slot>\n    </span>\n  </button>\n</template>\n\n<script lang=\"ts\">\nimport { computed, inject, defineComponent, Text, ref } from 'vue'\nimport { useCssVar } from '@vueuse/core'\nimport { TinyColor } from '@ctrl/tinycolor'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n  useDisabled,\n  useFormItem,\n  useGlobalConfig,\n  useSize,\n} from '@element-plus/hooks'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport { buttonEmits, buttonProps } from './button'\n\nexport default defineComponent({\n  name: 'ElButton',\n\n  components: {\n    ElIcon,\n    Loading,\n  },\n\n  props: buttonProps,\n  emits: buttonEmits,\n\n  setup(props, { emit, slots }) {\n    const buttonRef = ref()\n    const buttonGroupContext = inject(buttonGroupContextKey, undefined)\n    const globalConfig = useGlobalConfig('button')\n    const autoInsertSpace = computed(\n      () =>\n        props.autoInsertSpace ?? globalConfig.value?.autoInsertSpace ?? false\n    )\n\n    // add space between two characters in Chinese\n    const shouldAddSpace = computed(() => {\n      const defaultSlot = slots.default?.()\n      if (autoInsertSpace.value && defaultSlot?.length === 1) {\n        const slot = defaultSlot[0]\n        if (slot?.type === Text) {\n          const text = slot.children\n          return /^\\p{Unified_Ideograph}{2}$/u.test(text as string)\n        }\n      }\n      return false\n    })\n\n    const { form } = useFormItem()\n    const buttonSize = useSize(computed(() => buttonGroupContext?.size))\n    const buttonDisabled = useDisabled()\n    const buttonType = computed(\n      () => props.type || buttonGroupContext?.type || ''\n    )\n\n    // calculate hover & active color by color\n    const typeColor = computed(\n      () => useCssVar(`--el-color-${props.type}`).value\n    )\n    const buttonStyle = computed(() => {\n      let styles = {}\n\n      const buttonColor = props.color || typeColor.value\n\n      if (buttonColor) {\n        const shadeBgColor = new TinyColor(buttonColor).shade(10).toString()\n        if (props.plain) {\n          styles = {\n            '--el-button-bg-color': new TinyColor(buttonColor)\n              .tint(90)\n              .toString(),\n            '--el-button-text-color': buttonColor,\n            '--el-button-hover-text-color': 'var(--el-color-white)',\n            '--el-button-hover-bg-color': buttonColor,\n            '--el-button-hover-border-color': buttonColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-text-color': 'var(--el-color-white)',\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        } else {\n          const tintBgColor = new TinyColor(buttonColor).tint(20).toString()\n          styles = {\n            '--el-button-bg-color': buttonColor,\n            '--el-button-border-color': buttonColor,\n            '--el-button-hover-bg-color': tintBgColor,\n            '--el-button-hover-border-color': tintBgColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        }\n\n        if (buttonDisabled.value) {\n          const disabledButtonColor = new TinyColor(buttonColor)\n            .tint(50)\n            .toString()\n          styles['--el-button-disabled-bg-color'] = disabledButtonColor\n          styles['--el-button-disabled-border-color'] = disabledButtonColor\n        }\n      }\n\n      return styles\n    })\n\n    const handleClick = (evt: MouseEvent) => {\n      if (props.nativeType === 'reset') {\n        form?.resetFields()\n      }\n      emit('click', evt)\n    }\n\n    return {\n      buttonRef,\n      buttonStyle,\n\n      buttonSize,\n      buttonType,\n      buttonDisabled,\n\n      shouldAddSpace,\n\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":["ElIcon","Loading","buttonProps","buttonEmits","computed","useFormItem","useSize","useDisabled","TinyColor"],"mappings":";;;;;;;;;;;;;;;;;;AAkDA,EAAE,gBAAgB;;AAElB,YAAIA,YAAM;aACNC,gBAAO;;EAET,KAAK,EAAEC;OACF,EAAEC;OACF,CAAC;;;IAGJ,MAAM;IACN,MAAM;;MAEJ,OAAO,MAAM,CAAC,KAAK,KAAK;KACzB,CAAC,CAAC;IACH,MAAM,cAAc,GAAGC,YAAQ,CAAC,MAAM;MACpC,IAAI,EAAE,CAAC;MACP,MAAM,WAAW,GAAG,GAAG,GAAG;MAC1B,IAAI;QACF,MAAM,IAAI,GAAG,YAAY,CAAC,CAAC,CAAC;;;iBAGnB,6BAA6B,CAAC;;OAExC;MACD,OAAO,KAAK,CAAC;;YAEP,IAAI,EAAE,GAAGC;UACX,aAAaC,eAAO,CAACF;UACrB,cAAc,GAAGG,mBAAW,EAAE,CAAC;;;UAG/B;;;MAGJ,IAAI,WAAW,EAAE;QACf,MAAM,YAAY,GAAG,IAAIC,oBAAU,WAAW,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAC1D,IAAI,KAAK,CAAC,KAAK,EAAE;UACf,MAAM,GAAG;YACP,sBAAsB,EAAE,IAAIA,mBAAS;;;YAGrC,8BAA8B;YAC9B;YACA,6BAA6B,EAAE;;YAE/B;WACD,CAAC;;UAEF,MAAM,WAAW,GAAG,IAAIA,mBAAS,CAAC,WAAW;;YAE3C;YACA,0BAA0B,EAAE,WAAW;YACvC;YACA;YACA,6BAA6B,EAAE,YAAY;;;;YAI3C,cAAc,CAAC,KAAK,EAAE;gBAClB,mBAAmB,GAAG,IAAIA,mBAAS,CAAC;gBACpC,CAAC,+BAA+B,CAAC,GAAG;gBACpC,CAAC,mCAAmC,CAAC;;;;;UAK3C,WAAW,GAAG,CAAC,GAAG;UAClB,KAAK;YACH,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC;;kBAEnB,EAAE,GAAG,CAAC,CAAC;;;eAGV;;;;oBAIK;oBACA;iBACH;;;;;;;"}
+{"version":3,"file":"button.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/button/src/button.vue"],"sourcesContent":["<template>\n  <button\n    ref=\"buttonRef\"\n    :class=\"[\n      `${ns.b()}`,\n      `${ns.m(buttonType)}`,\n      `${ns.m(buttonSize)}`,\n      {\n        'is-disabled': buttonDisabled,\n        'is-loading': loading,\n        'is-plain': plain,\n        'is-round': round,\n        'is-circle': circle,\n      },\n    ]\"\n    :disabled=\"buttonDisabled || loading\"\n    :autofocus=\"autofocus\"\n    :type=\"nativeType\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <el-icon v-if=\"loading\" class=\"is-loading\">\n      <loading />\n    </el-icon>\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <span\n      v-if=\"$slots.default\"\n      :class=\"[shouldAddSpace ? `${ns.em('text', 'expand')}` : '']\"\n    >\n      <slot></slot>\n    </span>\n  </button>\n</template>\n\n<script lang=\"ts\">\nimport { computed, inject, defineComponent, Text, ref } from 'vue'\nimport { useCssVar } from '@vueuse/core'\nimport { TinyColor } from '@ctrl/tinycolor'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n  useDisabled,\n  useFormItem,\n  useGlobalConfig,\n  useNamespace,\n  useSize,\n} from '@element-plus/hooks'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport { buttonEmits, buttonProps } from './button'\n\nexport default defineComponent({\n  name: 'ElButton',\n\n  components: {\n    ElIcon,\n    Loading,\n  },\n\n  props: buttonProps,\n  emits: buttonEmits,\n\n  setup(props, { emit, slots }) {\n    const buttonRef = ref()\n    const buttonGroupContext = inject(buttonGroupContextKey, undefined)\n    const globalConfig = useGlobalConfig('button')\n    const ns = useNamespace('button')\n    const autoInsertSpace = computed(\n      () =>\n        props.autoInsertSpace ?? globalConfig.value?.autoInsertSpace ?? false\n    )\n\n    // add space between two characters in Chinese\n    const shouldAddSpace = computed(() => {\n      const defaultSlot = slots.default?.()\n      if (autoInsertSpace.value && defaultSlot?.length === 1) {\n        const slot = defaultSlot[0]\n        if (slot?.type === Text) {\n          const text = slot.children\n          return /^\\p{Unified_Ideograph}{2}$/u.test(text as string)\n        }\n      }\n      return false\n    })\n\n    const { form } = useFormItem()\n    const buttonSize = useSize(computed(() => buttonGroupContext?.size))\n    const buttonDisabled = useDisabled()\n    const buttonType = computed(\n      () => props.type || buttonGroupContext?.type || ''\n    )\n\n    // calculate hover & active color by color\n    const typeColor = computed(\n      () => useCssVar(`--el-color-${props.type}`).value\n    )\n    const buttonStyle = computed(() => {\n      let styles = {}\n\n      const buttonColor = props.color || typeColor.value\n\n      if (buttonColor) {\n        const shadeBgColor = new TinyColor(buttonColor).shade(10).toString()\n        if (props.plain) {\n          styles = {\n            '--el-button-bg-color': new TinyColor(buttonColor)\n              .tint(90)\n              .toString(),\n            '--el-button-text-color': buttonColor,\n            '--el-button-hover-text-color': 'var(--el-color-white)',\n            '--el-button-hover-bg-color': buttonColor,\n            '--el-button-hover-border-color': buttonColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-text-color': 'var(--el-color-white)',\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        } else {\n          const tintBgColor = new TinyColor(buttonColor).tint(20).toString()\n          styles = {\n            '--el-button-bg-color': buttonColor,\n            '--el-button-border-color': buttonColor,\n            '--el-button-hover-bg-color': tintBgColor,\n            '--el-button-hover-border-color': tintBgColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        }\n\n        if (buttonDisabled.value) {\n          const disabledButtonColor = new TinyColor(buttonColor)\n            .tint(50)\n            .toString()\n          styles['--el-button-disabled-bg-color'] = disabledButtonColor\n          styles['--el-button-disabled-border-color'] = disabledButtonColor\n        }\n      }\n\n      return styles\n    })\n\n    const handleClick = (evt: MouseEvent) => {\n      if (props.nativeType === 'reset') {\n        form?.resetFields()\n      }\n      emit('click', evt)\n    }\n\n    return {\n      buttonRef,\n      buttonStyle,\n\n      buttonSize,\n      buttonType,\n      buttonDisabled,\n\n      shouldAddSpace,\n\n      handleClick,\n\n      ns,\n    }\n  },\n})\n</script>\n"],"names":["ElIcon","Loading","buttonProps","buttonEmits","useNamespace","computed","useFormItem","useSize","useDisabled","TinyColor"],"mappings":";;;;;;;;;;;;;;;;;;;AAmDA,EAAE,gBAAgB;;AAElB,YAAIA,YAAM;aACNC,gBAAO;;EAET,KAAK,EAAEC;OACF,EAAEC;OACF,CAAC;;;IAGJ,MAAM;IACN,MAAM,EAAE,GAAGC;;MAET,IAAI,EAAE,MAAM,EAAE,CAAC;MACf,OAAO,CAAC,EAAE,IAAI,EAAE,GAAG;KACpB,CAAC,CAAC;IACH,MAAM,iBAAiBC,YAAQ,CAAC,MAAM;MACpC,IAAI,GAAG;MACP,MAAM,WAAW,GAAG,GAAG,GAAG;MAC1B,IAAI;QACF,MAAM,IAAI,GAAG,YAAY,CAAC,CAAC,CAAC;;;iBAGnB,6BAA6B,CAAC;;OAExC;MACD,OAAO,KAAK,CAAC;;YAEP,IAAI,EAAE,GAAGC;UACX,aAAaC,eAAO,CAACF;UACrB,cAAc,GAAGG,mBAAW,EAAE,CAAC;;;UAG/B;;;MAGJ,IAAI,WAAW,EAAE;QACf,MAAM,YAAY,GAAG,IAAIC,oBAAU,WAAW,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAC1D,IAAI,KAAK,CAAC,KAAK,EAAE;UACf,MAAM,GAAG;YACP,sBAAsB,EAAE,IAAIA,mBAAS;;;YAGrC,8BAA8B;YAC9B;YACA,6BAA6B,EAAE;;YAE/B;WACD,CAAC;;UAEF,MAAM,WAAW,GAAG,IAAIA,mBAAS,CAAC,WAAW;;YAE3C;YACA,0BAA0B,EAAE,WAAW;YACvC;YACA;YACA,6BAA6B,EAAE,YAAY;;;;YAI3C,cAAc,CAAC,KAAK,EAAE;gBAClB,mBAAmB,GAAG,IAAIA,mBAAS,CAAC;gBACpC,CAAC,+BAA+B,CAAC,GAAG;gBACpC,CAAC,mCAAmC,CAAC;;;;;UAK3C,WAAW,GAAG,CAAC,GAAG;UAClB,KAAK;YACH,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC;;kBAEnB,EAAE,GAAG,CAAC,CAAC;;;eAGV;;;;oBAIK;oBACA;iBACH;;;;;;;;"}

package/lib/components/button/src/button.vue_vue_type_template_id_802c5c76_lang.js

@@ -11,9 +11,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("button", {
     ref: "buttonRef",
     class: vue.normalizeClass([
-      "el-button",
-      _ctx.buttonType ? "el-button--" + _ctx.buttonType : "",
-      _ctx.buttonSize ? "el-button--" + _ctx.buttonSize : "",
+      `${_ctx.ns.b()}`,
+      `${_ctx.ns.m(_ctx.buttonType)}`,
+      `${_ctx.ns.m(_ctx.buttonSize)}`,
       {
         "is-disabled": _ctx.buttonDisabled,
         "is-loading": _ctx.loading,
@@ -44,7 +44,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     })) : vue.createCommentVNode("v-if", true),
     _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", {
       key: 2,
-      class: vue.normalizeClass({ "el-button__text--expand": _ctx.shouldAddSpace })
+      class: vue.normalizeClass([_ctx.shouldAddSpace ? `${_ctx.ns.em("text", "expand")}` : ""])
     }, [
       vue.renderSlot(_ctx.$slots, "default")
     ], 2)) : vue.createCommentVNode("v-if", true)

package/lib/components/button/src/button.vue_vue_type_template_id_802c5c76_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.vue_vue_type_template_id_802c5c76_lang.js","sources":["../../../../../../packages/components/button/src/button.vue?vue&type=template&id=802c5c76&lang.js"],"sourcesContent":["<template>\n  <button\n    ref=\"buttonRef\"\n    :class=\"[\n      'el-button',\n      buttonType ? 'el-button--' + buttonType : '',\n      buttonSize ? 'el-button--' + buttonSize : '',\n      {\n        'is-disabled': buttonDisabled,\n        'is-loading': loading,\n        'is-plain': plain,\n        'is-round': round,\n        'is-circle': circle,\n      },\n    ]\"\n    :disabled=\"buttonDisabled || loading\"\n    :autofocus=\"autofocus\"\n    :type=\"nativeType\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <el-icon v-if=\"loading\" class=\"is-loading\">\n      <loading />\n    </el-icon>\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <span\n      v-if=\"$slots.default\"\n      :class=\"{ 'el-button__text--expand': shouldAddSpace }\"\n    >\n      <slot></slot>\n    </span>\n  </button>\n</template>\n\n<script lang=\"ts\">\nimport { computed, inject, defineComponent, Text, ref } from 'vue'\nimport { useCssVar } from '@vueuse/core'\nimport { TinyColor } from '@ctrl/tinycolor'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n  useDisabled,\n  useFormItem,\n  useGlobalConfig,\n  useSize,\n} from '@element-plus/hooks'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport { buttonEmits, buttonProps } from './button'\n\nexport default defineComponent({\n  name: 'ElButton',\n\n  components: {\n    ElIcon,\n    Loading,\n  },\n\n  props: buttonProps,\n  emits: buttonEmits,\n\n  setup(props, { emit, slots }) {\n    const buttonRef = ref()\n    const buttonGroupContext = inject(buttonGroupContextKey, undefined)\n    const globalConfig = useGlobalConfig('button')\n    const autoInsertSpace = computed(\n      () =>\n        props.autoInsertSpace ?? globalConfig.value?.autoInsertSpace ?? false\n    )\n\n    // add space between two characters in Chinese\n    const shouldAddSpace = computed(() => {\n      const defaultSlot = slots.default?.()\n      if (autoInsertSpace.value && defaultSlot?.length === 1) {\n        const slot = defaultSlot[0]\n        if (slot?.type === Text) {\n          const text = slot.children\n          return /^\\p{Unified_Ideograph}{2}$/u.test(text as string)\n        }\n      }\n      return false\n    })\n\n    const { form } = useFormItem()\n    const buttonSize = useSize(computed(() => buttonGroupContext?.size))\n    const buttonDisabled = useDisabled()\n    const buttonType = computed(\n      () => props.type || buttonGroupContext?.type || ''\n    )\n\n    // calculate hover & active color by color\n    const typeColor = computed(\n      () => useCssVar(`--el-color-${props.type}`).value\n    )\n    const buttonStyle = computed(() => {\n      let styles = {}\n\n      const buttonColor = props.color || typeColor.value\n\n      if (buttonColor) {\n        const shadeBgColor = new TinyColor(buttonColor).shade(10).toString()\n        if (props.plain) {\n          styles = {\n            '--el-button-bg-color': new TinyColor(buttonColor)\n              .tint(90)\n              .toString(),\n            '--el-button-text-color': buttonColor,\n            '--el-button-hover-text-color': 'var(--el-color-white)',\n            '--el-button-hover-bg-color': buttonColor,\n            '--el-button-hover-border-color': buttonColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-text-color': 'var(--el-color-white)',\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        } else {\n          const tintBgColor = new TinyColor(buttonColor).tint(20).toString()\n          styles = {\n            '--el-button-bg-color': buttonColor,\n            '--el-button-border-color': buttonColor,\n            '--el-button-hover-bg-color': tintBgColor,\n            '--el-button-hover-border-color': tintBgColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        }\n\n        if (buttonDisabled.value) {\n          const disabledButtonColor = new TinyColor(buttonColor)\n            .tint(50)\n            .toString()\n          styles['--el-button-disabled-bg-color'] = disabledButtonColor\n          styles['--el-button-disabled-border-color'] = disabledButtonColor\n        }\n      }\n\n      return styles\n    })\n\n    const handleClick = (evt: MouseEvent) => {\n      if (props.nativeType === 'reset') {\n        form?.resetFields()\n      }\n      emit('click', evt)\n    }\n\n    return {\n      buttonRef,\n      buttonStyle,\n\n      buttonSize,\n      buttonType,\n      buttonDisabled,\n\n      shouldAddSpace,\n\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;IAeK;IACA,SAAS;;IAET,KAAK;WACA;;KAES;0BAAf;;;;;;;;;;;;gCAIE;;;;;;;;;"}
+{"version":3,"file":"button.vue_vue_type_template_id_802c5c76_lang.js","sources":["../../../../../../packages/components/button/src/button.vue?vue&type=template&id=802c5c76&lang.js"],"sourcesContent":["<template>\n  <button\n    ref=\"buttonRef\"\n    :class=\"[\n      `${ns.b()}`,\n      `${ns.m(buttonType)}`,\n      `${ns.m(buttonSize)}`,\n      {\n        'is-disabled': buttonDisabled,\n        'is-loading': loading,\n        'is-plain': plain,\n        'is-round': round,\n        'is-circle': circle,\n      },\n    ]\"\n    :disabled=\"buttonDisabled || loading\"\n    :autofocus=\"autofocus\"\n    :type=\"nativeType\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <el-icon v-if=\"loading\" class=\"is-loading\">\n      <loading />\n    </el-icon>\n    <el-icon v-else-if=\"icon\">\n      <component :is=\"icon\" />\n    </el-icon>\n    <span\n      v-if=\"$slots.default\"\n      :class=\"[shouldAddSpace ? `${ns.em('text', 'expand')}` : '']\"\n    >\n      <slot></slot>\n    </span>\n  </button>\n</template>\n\n<script lang=\"ts\">\nimport { computed, inject, defineComponent, Text, ref } from 'vue'\nimport { useCssVar } from '@vueuse/core'\nimport { TinyColor } from '@ctrl/tinycolor'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n  useDisabled,\n  useFormItem,\n  useGlobalConfig,\n  useNamespace,\n  useSize,\n} from '@element-plus/hooks'\nimport { buttonGroupContextKey } from '@element-plus/tokens'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport { buttonEmits, buttonProps } from './button'\n\nexport default defineComponent({\n  name: 'ElButton',\n\n  components: {\n    ElIcon,\n    Loading,\n  },\n\n  props: buttonProps,\n  emits: buttonEmits,\n\n  setup(props, { emit, slots }) {\n    const buttonRef = ref()\n    const buttonGroupContext = inject(buttonGroupContextKey, undefined)\n    const globalConfig = useGlobalConfig('button')\n    const ns = useNamespace('button')\n    const autoInsertSpace = computed(\n      () =>\n        props.autoInsertSpace ?? globalConfig.value?.autoInsertSpace ?? false\n    )\n\n    // add space between two characters in Chinese\n    const shouldAddSpace = computed(() => {\n      const defaultSlot = slots.default?.()\n      if (autoInsertSpace.value && defaultSlot?.length === 1) {\n        const slot = defaultSlot[0]\n        if (slot?.type === Text) {\n          const text = slot.children\n          return /^\\p{Unified_Ideograph}{2}$/u.test(text as string)\n        }\n      }\n      return false\n    })\n\n    const { form } = useFormItem()\n    const buttonSize = useSize(computed(() => buttonGroupContext?.size))\n    const buttonDisabled = useDisabled()\n    const buttonType = computed(\n      () => props.type || buttonGroupContext?.type || ''\n    )\n\n    // calculate hover & active color by color\n    const typeColor = computed(\n      () => useCssVar(`--el-color-${props.type}`).value\n    )\n    const buttonStyle = computed(() => {\n      let styles = {}\n\n      const buttonColor = props.color || typeColor.value\n\n      if (buttonColor) {\n        const shadeBgColor = new TinyColor(buttonColor).shade(10).toString()\n        if (props.plain) {\n          styles = {\n            '--el-button-bg-color': new TinyColor(buttonColor)\n              .tint(90)\n              .toString(),\n            '--el-button-text-color': buttonColor,\n            '--el-button-hover-text-color': 'var(--el-color-white)',\n            '--el-button-hover-bg-color': buttonColor,\n            '--el-button-hover-border-color': buttonColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-text-color': 'var(--el-color-white)',\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        } else {\n          const tintBgColor = new TinyColor(buttonColor).tint(20).toString()\n          styles = {\n            '--el-button-bg-color': buttonColor,\n            '--el-button-border-color': buttonColor,\n            '--el-button-hover-bg-color': tintBgColor,\n            '--el-button-hover-border-color': tintBgColor,\n            '--el-button-active-bg-color': shadeBgColor,\n            '--el-button-active-border-color': shadeBgColor,\n          }\n        }\n\n        if (buttonDisabled.value) {\n          const disabledButtonColor = new TinyColor(buttonColor)\n            .tint(50)\n            .toString()\n          styles['--el-button-disabled-bg-color'] = disabledButtonColor\n          styles['--el-button-disabled-border-color'] = disabledButtonColor\n        }\n      }\n\n      return styles\n    })\n\n    const handleClick = (evt: MouseEvent) => {\n      if (props.nativeType === 'reset') {\n        form?.resetFields()\n      }\n      emit('click', evt)\n    }\n\n    return {\n      buttonRef,\n      buttonStyle,\n\n      buttonSize,\n      buttonType,\n      buttonDisabled,\n\n      shouldAddSpace,\n\n      handleClick,\n\n      ns,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;OAEO,EAAC;SACE;;;;;;;;;;;;IAYL;IACA,SAAS;;IAET,KAAK;WACA;;KAES;0BAAf;;;;;;;;;;;;gCAIE;;;;;;;;;"}

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

@@ -2,7 +2,19 @@ export declare const ElCard: import("../../utils/types").SFCWithInstall<import("
     readonly header: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly bodyStyle: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<import("../../utils/types").StyleValue>, "", unknown, unknown, unknown>;
     readonly shadow: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
-}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, {
+    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;
+    };
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly header?: unknown;
     readonly bodyStyle?: unknown;
     readonly shadow?: unknown;

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

@@ -1,3 +1,4 @@
+import type Card from './card.vue';
 import type { ExtractPropTypes } from 'vue';
 import type { StyleValue } from 'element-plus/es/utils/types';
 export declare const cardProps: {
@@ -6,3 +7,4 @@ export declare const cardProps: {
     readonly shadow: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
 };
 export declare type CardProps = ExtractPropTypes<typeof cardProps>;
+export declare type CardInstance = InstanceType<typeof Card>;

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

@@ -1 +1 @@
-{"version":3,"file":"card.js","sources":["../../../../../../packages/components/card/src/card.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\nimport type { ExtractPropTypes } from 'vue'\nimport type { StyleValue } from '@element-plus/utils/types'\n\nexport const cardProps = buildProps({\n  header: {\n    type: String,\n    default: '',\n  },\n  bodyStyle: {\n    type: definePropType<StyleValue>([String, Object, Array]),\n    default: '',\n  },\n  shadow: {\n    type: String,\n    default: '',\n  },\n} as const)\nexport type CardProps = ExtractPropTypes<typeof cardProps>\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;AACY,MAAC,SAAS,GAAGA,gBAAU,CAAC;AACpC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACjD,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"card.js","sources":["../../../../../../packages/components/card/src/card.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\nimport type Card from './card.vue'\nimport type { ExtractPropTypes } from 'vue'\nimport type { StyleValue } from '@element-plus/utils/types'\n\nexport const cardProps = buildProps({\n  header: {\n    type: String,\n    default: '',\n  },\n  bodyStyle: {\n    type: definePropType<StyleValue>([String, Object, Array]),\n    default: '',\n  },\n  shadow: {\n    type: String,\n    default: '',\n  },\n} as const)\nexport type CardProps = ExtractPropTypes<typeof cardProps>\nexport type CardInstance = InstanceType<typeof Card>\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;AACY,MAAC,SAAS,GAAGA,gBAAU,CAAC;AACpC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACjD,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,CAAC;;;;"}