element-plus 2.1.8 → 2.1.9

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

@@ -11,6 +11,7 @@ export declare const ElButton: import("element-plus/es/utils").SFCWithInstall<im
     readonly round: BooleanConstructor;
     readonly circle: BooleanConstructor;
     readonly color: StringConstructor;
+    readonly dark: BooleanConstructor;
     readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
 }, {
     props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
@@ -26,6 +27,7 @@ export declare const ElButton: import("element-plus/es/utils").SFCWithInstall<im
         readonly round: BooleanConstructor;
         readonly circle: BooleanConstructor;
         readonly color: StringConstructor;
+        readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -106,6 +108,7 @@ export declare const ElButton: import("element-plus/es/utils").SFCWithInstall<im
     readonly round: BooleanConstructor;
     readonly circle: BooleanConstructor;
     readonly color: StringConstructor;
+    readonly dark: BooleanConstructor;
     readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
 }>> & {
     onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -122,6 +125,7 @@ export declare const ElButton: import("element-plus/es/utils").SFCWithInstall<im
     autofocus: boolean;
     round: boolean;
     circle: boolean;
+    dark: boolean;
 }>> & {
     ButtonGroup: import("vue").DefineComponent<{
         readonly size: import("element-plus/es/utils").BuildPropReturn<StringConstructor, never, false, "" | "default" | "small" | "large", never>;

package/es/components/button/src/button-custom.d.ts

@@ -0,0 +1,4 @@
+import { TinyColor } from '@ctrl/tinycolor';
+import type { ButtonProps } from './button';
+export declare function darken(color: TinyColor, amount?: number): string;
+export declare function useButtonCustomStyle(props: ButtonProps): import("vue").ComputedRef<Record<string, string>>;

package/es/components/button/src/button-custom.mjs

@@ -0,0 +1,60 @@
+import { computed } from 'vue';
+import { TinyColor } from '@ctrl/tinycolor';
+import '../../../hooks/index.mjs';
+import { useDisabled } from '../../../hooks/use-common-props/index.mjs';
+
+function darken(color, amount = 20) {
+  return color.mix("#141414", amount).toString();
+}
+function useButtonCustomStyle(props) {
+  const _disabled = useDisabled();
+  return computed(() => {
+    let styles = {};
+    const buttonColor = props.color;
+    if (buttonColor) {
+      const color = new TinyColor(buttonColor);
+      const activeBgColor = props.dark ? color.tint(20).toString() : darken(color, 20);
+      if (props.plain) {
+        styles = {
+          "--el-button-bg-color": props.dark ? darken(color, 90) : color.tint(90).toString(),
+          "--el-button-text-color": buttonColor,
+          "--el-button-border-color": props.dark ? darken(color, 50) : color.tint(50).toString(),
+          "--el-button-hover-text-color": "var(--el-color-white)",
+          "--el-button-hover-bg-color": buttonColor,
+          "--el-button-hover-border-color": buttonColor,
+          "--el-button-active-bg-color": activeBgColor,
+          "--el-button-active-text-color": "var(--el-color-white)",
+          "--el-button-active-border-color": activeBgColor
+        };
+        if (_disabled.value) {
+          styles["--el-button-disabled-bg-color"] = props.dark ? darken(color, 90) : color.tint(90).toString();
+          styles["--el-button-disabled-text-color"] = props.dark ? darken(color, 50) : color.tint(50).toString();
+          styles["--el-button-disabled-border-color"] = props.dark ? darken(color, 80) : color.tint(80).toString();
+        }
+      } else {
+        const hoverBgColor = props.dark ? darken(color, 30) : color.tint(30).toString();
+        const textColor = color.isDark() ? "var(--el-color-white)" : "var(--el-color-black)";
+        styles = {
+          "--el-button-bg-color": buttonColor,
+          "--el-button-text-color": textColor,
+          "--el-button-border-color": buttonColor,
+          "--el-button-hover-bg-color": hoverBgColor,
+          "--el-button-hover-text-color": textColor,
+          "--el-button-hover-border-color": hoverBgColor,
+          "--el-button-active-bg-color": activeBgColor,
+          "--el-button-active-border-color": activeBgColor
+        };
+        if (_disabled.value) {
+          const disabledButtonColor = props.dark ? darken(color, 50) : color.tint(50).toString();
+          styles["--el-button-disabled-bg-color"] = disabledButtonColor;
+          styles["--el-button-disabled-text-color"] = props.dark ? "rgba(255, 255, 255, 0.5)" : "var(--el-color-white)";
+          styles["--el-button-disabled-border-color"] = disabledButtonColor;
+        }
+      }
+    }
+    return styles;
+  });
+}
+
+export { darken, useButtonCustomStyle };
+//# sourceMappingURL=button-custom.mjs.map

package/es/components/button/src/button-custom.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-custom.mjs","sources":["../../../../../../packages/components/button/src/button-custom.ts"],"sourcesContent":["import { computed } from 'vue'\nimport { TinyColor } from '@ctrl/tinycolor'\nimport { useDisabled } from '@element-plus/hooks'\nimport type { ButtonProps } from './button'\n\nexport function darken(color: TinyColor, amount = 20) {\n  return color.mix('#141414', amount).toString()\n}\n\nexport function useButtonCustomStyle(props: ButtonProps) {\n  const _disabled = useDisabled()\n\n  // calculate hover & active color by custom color\n  // only work when custom color\n  return computed(() => {\n    let styles: Record<string, string> = {}\n\n    const buttonColor = props.color\n\n    if (buttonColor) {\n      const color = new TinyColor(buttonColor)\n      const activeBgColor = props.dark\n        ? color.tint(20).toString()\n        : darken(color, 20)\n\n      if (props.plain) {\n        styles = {\n          '--el-button-bg-color': props.dark\n            ? darken(color, 90)\n            : color.tint(90).toString(),\n          '--el-button-text-color': buttonColor,\n          '--el-button-border-color': props.dark\n            ? darken(color, 50)\n            : color.tint(50).toString(),\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': activeBgColor,\n          '--el-button-active-text-color': 'var(--el-color-white)',\n          '--el-button-active-border-color': activeBgColor,\n        }\n\n        if (_disabled.value) {\n          styles['--el-button-disabled-bg-color'] = props.dark\n            ? darken(color, 90)\n            : color.tint(90).toString()\n          styles['--el-button-disabled-text-color'] = props.dark\n            ? darken(color, 50)\n            : color.tint(50).toString()\n          styles['--el-button-disabled-border-color'] = props.dark\n            ? darken(color, 80)\n            : color.tint(80).toString()\n        }\n      } else {\n        const hoverBgColor = props.dark\n          ? darken(color, 30)\n          : color.tint(30).toString()\n        const textColor = color.isDark()\n          ? 'var(--el-color-white)'\n          : 'var(--el-color-black)'\n        styles = {\n          '--el-button-bg-color': buttonColor,\n          '--el-button-text-color': textColor,\n          '--el-button-border-color': buttonColor,\n          '--el-button-hover-bg-color': hoverBgColor,\n          '--el-button-hover-text-color': textColor,\n          '--el-button-hover-border-color': hoverBgColor,\n          '--el-button-active-bg-color': activeBgColor,\n          '--el-button-active-border-color': activeBgColor,\n        }\n\n        if (_disabled.value) {\n          const disabledButtonColor = props.dark\n            ? darken(color, 50)\n            : color.tint(50).toString()\n          styles['--el-button-disabled-bg-color'] = disabledButtonColor\n          styles['--el-button-disabled-text-color'] = props.dark\n            ? 'rgba(255, 255, 255, 0.5)'\n            : 'var(--el-color-white)'\n          styles['--el-button-disabled-border-color'] = disabledButtonColor\n        }\n      }\n    }\n\n    return styles\n  })\n}\n"],"names":[],"mappings":"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"}

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

@@ -15,6 +15,7 @@ export declare const buttonProps: {
     readonly round: BooleanConstructor;
     readonly circle: BooleanConstructor;
     readonly color: StringConstructor;
+    readonly dark: BooleanConstructor;
     readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
 };
 export declare const buttonEmits: {

package/es/components/button/src/button.mjs

@@ -43,6 +43,7 @@ const buttonProps = buildProps({
   round: Boolean,
   circle: Boolean,
   color: String,
+  dark: Boolean,
   autoInsertSpace: {
     type: Boolean,
     default: void 0

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

@@ -1 +1 @@
-{"version":3,"file":"button.mjs","sources":["../../../../../../packages/components/button/src/button.ts"],"sourcesContent":["import { useSizeProp } from '@element-plus/hooks'\nimport { buildProps, iconPropType } from '@element-plus/utils'\nimport { Loading } from '@element-plus/icons-vue'\nimport type { ExtractPropTypes } from 'vue'\nimport type button from './button.vue'\n\nexport const buttonTypes = [\n  'default',\n  'primary',\n  'success',\n  'warning',\n  'info',\n  'danger',\n  'text',\n  '',\n] as const\nexport const buttonNativeTypes = ['button', 'submit', 'reset'] as const\n\nexport const buttonProps = buildProps({\n  size: useSizeProp,\n  disabled: Boolean,\n  type: {\n    type: String,\n    values: buttonTypes,\n    default: '',\n  },\n  icon: {\n    type: iconPropType,\n    default: '',\n  },\n  nativeType: {\n    type: String,\n    values: buttonNativeTypes,\n    default: 'button',\n  },\n  loading: Boolean,\n  loadingIcon: {\n    type: iconPropType,\n    default: () => Loading,\n  },\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)\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\nexport interface ButtonConfigContext {\n  autoInsertSpace?: boolean\n}\n"],"names":[],"mappings":";;;;;;;AAGY,MAAC,WAAW,GAAG;AAC3B,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,iBAAiB,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE;AACnD,MAAC,WAAW,GAAG,UAAU,CAAC;AACtC,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,WAAW;AACvB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,YAAY;AACtB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,iBAAiB;AAC7B,IAAI,OAAO,EAAE,QAAQ;AACrB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,YAAY;AACtB,IAAI,OAAO,EAAE,MAAM,OAAO;AAC1B,GAAG;AACH,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.mjs","sources":["../../../../../../packages/components/button/src/button.ts"],"sourcesContent":["import { useSizeProp } from '@element-plus/hooks'\nimport { buildProps, iconPropType } from '@element-plus/utils'\nimport { Loading } from '@element-plus/icons-vue'\nimport type { ExtractPropTypes } from 'vue'\nimport type button from './button.vue'\n\nexport const buttonTypes = [\n  'default',\n  'primary',\n  'success',\n  'warning',\n  'info',\n  'danger',\n  'text',\n  '',\n] as const\nexport const buttonNativeTypes = ['button', 'submit', 'reset'] as const\n\nexport const buttonProps = buildProps({\n  size: useSizeProp,\n  disabled: Boolean,\n  type: {\n    type: String,\n    values: buttonTypes,\n    default: '',\n  },\n  icon: {\n    type: iconPropType,\n    default: '',\n  },\n  nativeType: {\n    type: String,\n    values: buttonNativeTypes,\n    default: 'button',\n  },\n  loading: Boolean,\n  loadingIcon: {\n    type: iconPropType,\n    default: () => Loading,\n  },\n  plain: Boolean,\n  autofocus: Boolean,\n  round: Boolean,\n  circle: Boolean,\n  color: String,\n  dark: Boolean,\n  autoInsertSpace: {\n    type: Boolean,\n    default: undefined,\n  },\n} as const)\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\nexport interface ButtonConfigContext {\n  autoInsertSpace?: boolean\n}\n"],"names":[],"mappings":";;;;;;;AAGY,MAAC,WAAW,GAAG;AAC3B,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,iBAAiB,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE;AACnD,MAAC,WAAW,GAAG,UAAU,CAAC;AACtC,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,WAAW;AACvB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,YAAY;AACtB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,iBAAiB;AAC7B,IAAI,OAAO,EAAE,QAAQ;AACrB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,YAAY;AACtB,IAAI,OAAO,EAAE,MAAM,OAAO;AAC1B,GAAG;AACH,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,IAAI,EAAE,OAAO;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/es/components/button/src/button.vue.d.ts

@@ -11,6 +11,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly round: BooleanConstructor;
     readonly circle: BooleanConstructor;
     readonly color: StringConstructor;
+    readonly dark: BooleanConstructor;
     readonly autoInsertSpace: import("../../../utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
 }, {
     props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
@@ -26,6 +27,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly round: BooleanConstructor;
         readonly circle: BooleanConstructor;
         readonly color: StringConstructor;
+        readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("../../../utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -106,6 +108,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly round: BooleanConstructor;
     readonly circle: BooleanConstructor;
     readonly color: StringConstructor;
+    readonly dark: BooleanConstructor;
     readonly autoInsertSpace: import("../../../utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
 }>> & {
     onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -122,5 +125,6 @@ declare const _default: import("vue").DefineComponent<{
     autofocus: boolean;
     round: boolean;
     circle: boolean;
+    dark: boolean;
 }>;
 export default _default;

package/es/components/button/src/button2.mjs

@@ -1,9 +1,9 @@
 import { defineComponent, useSlots, inject, computed, ref, Text, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, Fragment, renderSlot, createBlock, withCtx, resolveDynamicComponent, createCommentVNode } from 'vue';
-import { TinyColor } from '@ctrl/tinycolor';
 import { ElIcon } from '../../icon/index.mjs';
 import '../../../hooks/index.mjs';
 import '../../../tokens/index.mjs';
 import { buttonProps, buttonEmits } from './button.mjs';
+import { useButtonCustomStyle } from './button-custom.mjs';
 import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 import { buttonGroupContextKey } from '../../../tokens/button.mjs';
 import { useGlobalConfig } from '../../../hooks/use-global-config/index.mjs';
@@ -46,42 +46,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return false;
     });
-    const buttonStyle = computed(() => {
-      let styles = {};
-      const buttonColor = props.color;
-      if (buttonColor) {
-        const color = new TinyColor(buttonColor);
-        const shadeBgColor = color.shade(20).toString();
-        if (props.plain) {
-          styles = {
-            "--el-button-bg-color": color.tint(90).toString(),
-            "--el-button-text-color": buttonColor,
-            "--el-button-hover-text-color": "var(--el-color-white)",
-            "--el-button-hover-bg-color": buttonColor,
-            "--el-button-hover-border-color": buttonColor,
-            "--el-button-active-bg-color": shadeBgColor,
-            "--el-button-active-text-color": "var(--el-color-white)",
-            "--el-button-active-border-color": shadeBgColor
-          };
-        } else {
-          const tintBgColor = color.tint(30).toString();
-          styles = {
-            "--el-button-bg-color": buttonColor,
-            "--el-button-border-color": buttonColor,
-            "--el-button-hover-bg-color": tintBgColor,
-            "--el-button-hover-border-color": tintBgColor,
-            "--el-button-active-bg-color": shadeBgColor,
-            "--el-button-active-border-color": shadeBgColor
-          };
-        }
-        if (_disabled.value) {
-          const disabledButtonColor = color.tint(50).toString();
-          styles["--el-button-disabled-bg-color"] = disabledButtonColor;
-          styles["--el-button-disabled-border-color"] = disabledButtonColor;
-        }
-      }
-      return styles;
-    });
+    const buttonStyle = useButtonCustomStyle(props);
     const handleClick = (evt) => {
       if (props.nativeType === "reset") {
         form == null ? void 0 : form.resetFields();

package/es/components/button/src/button2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button2.mjs","sources":["../../../../../../packages/components/button/src/button.vue"],"sourcesContent":["<template>\n  <button\n    ref=\"_ref\"\n    :class=\"[\n      ns.b(),\n      ns.m(_type),\n      ns.m(_size),\n      ns.is('disabled', _disabled),\n      ns.is('loading', loading),\n      ns.is('plain', plain),\n      ns.is('round', round),\n      ns.is('circle', circle),\n    ]\"\n    :disabled=\"_disabled || loading\"\n    :autofocus=\"autofocus\"\n    :type=\"nativeType\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <template v-if=\"loading\">\n      <slot v-if=\"$slots.loading\" name=\"loading\" />\n      <el-icon v-else :class=\"ns.is('loading')\">\n        <component :is=\"loadingIcon\" />\n      </el-icon>\n    </template>\n    <el-icon v-else-if=\"icon || $slots.icon\">\n      <component :is=\"icon\" v-if=\"icon\" />\n      <slot v-else name=\"icon\" />\n    </el-icon>\n    <span\n      v-if=\"$slots.default\"\n      :class=\"{ [ns.em('text', 'expand')]: shouldAddSpace }\"\n    >\n      <slot />\n    </span>\n  </button>\n</template>\n\n<script lang=\"ts\" setup>\nimport { Text, computed, inject, ref, useSlots } from 'vue'\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 { buttonEmits, buttonProps } from './button'\n\ndefineOptions({\n  name: 'ElButton',\n})\n\nconst props = defineProps(buttonProps)\nconst emit = defineEmits(buttonEmits)\nconst slots = useSlots()\n\nconst buttonGroupContext = inject(buttonGroupContextKey, undefined)\nconst globalConfig = useGlobalConfig('button')\nconst ns = useNamespace('button')\nconst { form } = useFormItem()\nconst _size = useSize(computed(() => buttonGroupContext?.size))\nconst _disabled = useDisabled()\nconst _ref = ref<HTMLButtonElement>()\n\nconst _type = computed(() => props.type || buttonGroupContext?.type || '')\nconst autoInsertSpace = computed(\n  () => props.autoInsertSpace ?? globalConfig.value?.autoInsertSpace ?? false\n)\n\n// add space between two characters in Chinese\nconst 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 as string\n      return /^\\p{Unified_Ideograph}{2}$/u.test(text.trim())\n    }\n  }\n  return false\n})\n\n// calculate hover & active color by custom color\n// only work when custom color\nconst buttonStyle = computed(() => {\n  let styles: Record<string, string> = {}\n\n  const buttonColor = props.color\n\n  if (buttonColor) {\n    const color = new TinyColor(buttonColor)\n    const shadeBgColor = color.shade(20).toString()\n    if (props.plain) {\n      styles = {\n        '--el-button-bg-color': color.tint(90).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 = color.tint(30).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 (_disabled.value) {\n      const disabledButtonColor = color.tint(50).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\nconst handleClick = (evt: MouseEvent) => {\n  if (props.nativeType === 'reset') {\n    form?.resetFields()\n  }\n  emit('click', evt)\n}\n\ndefineExpose({\n  /** @description button html element */\n  ref: _ref,\n  /** @description button size */\n  size: _size,\n  /** @description button type */\n  type: _type,\n  /** @description button disabled */\n  disabled: _disabled,\n  /** @description whether adding space */\n  shouldAddSpace,\n})\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"button2.mjs","sources":["../../../../../../packages/components/button/src/button.vue"],"sourcesContent":["<template>\n  <button\n    ref=\"_ref\"\n    :class=\"[\n      ns.b(),\n      ns.m(_type),\n      ns.m(_size),\n      ns.is('disabled', _disabled),\n      ns.is('loading', loading),\n      ns.is('plain', plain),\n      ns.is('round', round),\n      ns.is('circle', circle),\n    ]\"\n    :disabled=\"_disabled || loading\"\n    :autofocus=\"autofocus\"\n    :type=\"nativeType\"\n    :style=\"buttonStyle\"\n    @click=\"handleClick\"\n  >\n    <template v-if=\"loading\">\n      <slot v-if=\"$slots.loading\" name=\"loading\" />\n      <el-icon v-else :class=\"ns.is('loading')\">\n        <component :is=\"loadingIcon\" />\n      </el-icon>\n    </template>\n    <el-icon v-else-if=\"icon || $slots.icon\">\n      <component :is=\"icon\" v-if=\"icon\" />\n      <slot v-else name=\"icon\" />\n    </el-icon>\n    <span\n      v-if=\"$slots.default\"\n      :class=\"{ [ns.em('text', 'expand')]: shouldAddSpace }\"\n    >\n      <slot />\n    </span>\n  </button>\n</template>\n\n<script lang=\"ts\" setup>\nimport { Text, computed, inject, ref, useSlots } from 'vue'\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 { buttonEmits, buttonProps } from './button'\nimport { useButtonCustomStyle } from './button-custom'\n\ndefineOptions({\n  name: 'ElButton',\n})\n\nconst props = defineProps(buttonProps)\nconst emit = defineEmits(buttonEmits)\nconst slots = useSlots()\n\nconst buttonGroupContext = inject(buttonGroupContextKey, undefined)\nconst globalConfig = useGlobalConfig('button')\nconst ns = useNamespace('button')\nconst { form } = useFormItem()\nconst _size = useSize(computed(() => buttonGroupContext?.size))\nconst _disabled = useDisabled()\nconst _ref = ref<HTMLButtonElement>()\n\nconst _type = computed(() => props.type || buttonGroupContext?.type || '')\nconst autoInsertSpace = computed(\n  () => props.autoInsertSpace ?? globalConfig.value?.autoInsertSpace ?? false\n)\n\n// add space between two characters in Chinese\nconst 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 as string\n      return /^\\p{Unified_Ideograph}{2}$/u.test(text.trim())\n    }\n  }\n  return false\n})\n\nconst buttonStyle = useButtonCustomStyle(props)\n\nconst handleClick = (evt: MouseEvent) => {\n  if (props.nativeType === 'reset') {\n    form?.resetFields()\n  }\n  emit('click', evt)\n}\n\ndefineExpose({\n  /** @description button html element */\n  ref: _ref,\n  /** @description button size */\n  size: _size,\n  /** @description button type */\n  type: _type,\n  /** @description button disabled */\n  disabled: _disabled,\n  /** @description whether adding space */\n  shouldAddSpace,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA0DA,IAAA,MAAA,QAAA,QAAA,EAAA,CAAA;AAEA,IAAA,MAAA,kBAAA,GAAA,MAAA,CAAA,qBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AACA,IAAA,MAAA,YAAA,GAAA,gBAAA,QAAA,CAAA,CAAA;AACA,IAAA,MAAA,EAAA,GAAA,aAAA,QAAA,CAAA,CAAA;AACA,IAAA,MAAA,EAAA,SAAA,WAAA,EAAA,CAAA;AACA,IAAA,MAAA,QAAA,OAAA,CAAA,QAAA,CAAA,MAAA,kBAAA,QAAA,GAAA,KAAA,CAAA,GAAA,kBAAA,CAAA,IAAA,CAAA,CAAA,CAAA;AACA,IAAA,MAAA,YAAA,WAAA,EAAA,CAAA;AACA,IAAA,MAAA,OAAA,GAAA,EAAA,CAAA;AAEA,IAAA,MAAA,QAAA,QAAA,CAAA,MAAA,MAAA,IAAA,KAAA,kBAAA,WAAA,KAAA,CAAA,GAAA,kBAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAA,CAAA;AACA,IAAA,MAAA,eAAA,GAAA,SACA,MAAA;AAIA,MAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AACA,MAAA,OAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,qBAAA,KAAA,IAAA,GAAA,EAAA,GAAA,CAAA,EAAA,GAAA,YAAA,CAAA,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,eAAA,KAAA,IAAA,GAAA,EAAA,GAAA,KAAA,CAAA;AACA,KAAA,CAAA,CAAA;AACA,IAAA,MAAA,cAAA,GAAA,QAAA,CAAA,MAAA;AACA,MAAA,IAAA,EAAA,CAAA;AACA,MAAA,MAAA,WAAA,GAAA,CAAA,EAAA,GAAA,KAAA,CAAA,OAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,KAAA,CAAA,CAAA;AACA,MAAA,IAAA,eAAA,CAAA,KAAA,IAAA,CAAA,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,MAAA,MAAA,CAAA,EAAA;AAAA,QACA,MAAA,IAAA,GAAA,WAAA,CAAA,CAAA,CAAA,CAAA;AAAA,QACA,IAAA,CAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CAAA,IAAA,MAAA,IAAA,EAAA;AACA,UAAA,MAAA,IAAA,GAAA,IAAA,CAAA,QAAA,CAAA;AAAA,UACA,OAAA,6BAAA,CAAA,IAAA,CAAA,IAAA,CAAA,IAAA,EAAA,CAAA,CAAA;AAEA,SAAA;AAEA,OAAA;AACA,MAAA,OAAA;AACA,KAAA,CAAA,CAAA;AAAA,IACA,MAAA,WAAA,GAAA,oBAAA,CAAA,KAAA,CAAA,CAAA;AACA,IAAA,MAAA,WAAA,GAAA,CAAA,GAAA,KAAA;AAAA,MACA,IAAA,KAAA,CAAA,UAAA,KAAA,OAAA,EAAA;AAEA,QAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CAAA,WAAA,EAAA,CAAA;AAAA,OAEA;AAAA,MAEA,IAAA,CAAA,OAAA,EAAA,GAAA,CAAA,CAAA;AAAA,KAAA,CAEA;AAAA,IAAA,MAEA,CAAA;AAAA,MAEA,GAAA,EAAA,IAAA;AAAA,MACA,IAAA,EAAA,KAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/calendar/index.d.ts

@@ -53,6 +53,7 @@ export declare const ElCalendar: import("element-plus/es/utils").SFCWithInstall<
         readonly round: BooleanConstructor;
         readonly circle: BooleanConstructor;
         readonly color: StringConstructor;
+        readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
     }, {
         props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
@@ -68,6 +69,7 @@ export declare const ElCalendar: import("element-plus/es/utils").SFCWithInstall<
             readonly round: BooleanConstructor;
             readonly circle: BooleanConstructor;
             readonly color: StringConstructor;
+            readonly dark: BooleanConstructor;
             readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
         }>> & {
             onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -148,6 +150,7 @@ export declare const ElCalendar: import("element-plus/es/utils").SFCWithInstall<
         readonly round: BooleanConstructor;
         readonly circle: BooleanConstructor;
         readonly color: StringConstructor;
+        readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -164,6 +167,7 @@ export declare const ElCalendar: import("element-plus/es/utils").SFCWithInstall<
         autofocus: boolean;
         round: boolean;
         circle: boolean;
+        dark: boolean;
     }>> & {
         ButtonGroup: import("vue").DefineComponent<{
             readonly size: import("element-plus/es/utils").BuildPropReturn<StringConstructor, never, false, "" | "default" | "small" | "large", never>;

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

@@ -57,6 +57,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly round: BooleanConstructor;
         readonly circle: BooleanConstructor;
         readonly color: StringConstructor;
+        readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
     }, {
         props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
@@ -72,6 +73,7 @@ declare const _default: import("vue").DefineComponent<{
             readonly round: BooleanConstructor;
             readonly circle: BooleanConstructor;
             readonly color: StringConstructor;
+            readonly dark: BooleanConstructor;
             readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
         }>> & {
             onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -152,6 +154,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly round: BooleanConstructor;
         readonly circle: BooleanConstructor;
         readonly color: StringConstructor;
+        readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, undefined, unknown, unknown, unknown>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
@@ -168,6 +171,7 @@ declare const _default: import("vue").DefineComponent<{
         autofocus: boolean;
         round: boolean;
         circle: boolean;
+        dark: boolean;
     }>> & {
         ButtonGroup: import("vue").DefineComponent<{
             readonly size: import("element-plus/es/utils").BuildPropReturn<StringConstructor, never, false, "" | "default" | "small" | "large", never>;