@element-plus/nightly 0.0.20230408 → 0.0.20230410

package/es/components/countdown/src/countdown.mjs

@@ -1,80 +1,29 @@
-import { defineComponent, ref, computed, watch, onBeforeUnmount, openBlock, createBlock, unref, createSlots, renderList, withCtx, renderSlot } from 'vue';
-import { ElStatistic } from '../../statistic/index.mjs';
 import '../../../utils/index.mjs';
-import { countdownProps, countdownEmits } from './countdown2.mjs';
-import { getTime, formatTime } from './utils.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { cAF, rAF } from '../../../utils/raf.mjs';
+import '../../../constants/index.mjs';
+import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
+import { CHANGE_EVENT } from '../../../constants/event.mjs';
+import { isNumber } from '@vueuse/core';
 
-const __default__ = defineComponent({
-  name: "ElCountdown"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: countdownProps,
-  emits: countdownEmits,
-  setup(__props, { expose, emit }) {
-    const props = __props;
-    let timer;
-    const rawValue = ref(getTime(props.value) - Date.now());
-    const displayValue = computed(() => formatTime(rawValue.value, props.format));
-    const formatter = (val) => formatTime(val, props.format);
-    const stopTimer = () => {
-      if (timer) {
-        cAF(timer);
-        timer = void 0;
-      }
-    };
-    const startTimer = () => {
-      const timestamp = getTime(props.value);
-      const frameFunc = () => {
-        let diff = timestamp - Date.now();
-        emit("change", diff);
-        if (diff <= 0) {
-          diff = 0;
-          stopTimer();
-          emit("finish");
-        } else {
-          timer = rAF(frameFunc);
-        }
-        rawValue.value = diff;
-      };
-      timer = rAF(frameFunc);
-    };
-    watch(() => [props.value, props.format], () => {
-      stopTimer();
-      startTimer();
-    }, {
-      immediate: true
-    });
-    onBeforeUnmount(() => {
-      stopTimer();
-    });
-    expose({
-      displayValue
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(ElStatistic), {
-        value: rawValue.value,
-        title: _ctx.title,
-        prefix: _ctx.prefix,
-        suffix: _ctx.suffix,
-        "value-style": _ctx.valueStyle,
-        formatter
-      }, createSlots({ _: 2 }, [
-        renderList(_ctx.$slots, (_, name) => {
-          return {
-            name,
-            fn: withCtx(() => [
-              renderSlot(_ctx.$slots, name)
-            ])
-          };
-        })
-      ]), 1032, ["value", "title", "prefix", "suffix", "value-style"]);
-    };
+const countdownProps = buildProps({
+  format: {
+    type: String,
+    default: "HH:mm:ss"
+  },
+  prefix: String,
+  suffix: String,
+  title: String,
+  value: {
+    type: definePropType([Number, Object]),
+    default: 0
+  },
+  valueStyle: {
+    type: definePropType([String, Object, Array])
   }
 });
-var Countdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/countdown/src/countdown.vue"]]);
+const countdownEmits = {
+  finish: () => true,
+  [CHANGE_EVENT]: (value) => isNumber(value)
+};
 
-export { Countdown as default };
+export { countdownEmits, countdownProps };
 //# sourceMappingURL=countdown.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"countdown.mjs","sources":["../../../../../../packages/components/countdown/src/countdown.vue"],"sourcesContent":["<template>\n  <el-statistic\n    :value=\"rawValue\"\n    :title=\"title\"\n    :prefix=\"prefix\"\n    :suffix=\"suffix\"\n    :value-style=\"valueStyle\"\n    :formatter=\"formatter\"\n  >\n    <template v-for=\"(_, name) in $slots\" #[name]>\n      <slot :name=\"name\" />\n    </template>\n  </el-statistic>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, onBeforeUnmount, ref, watch } from 'vue'\nimport { ElStatistic } from '@element-plus/components/statistic'\nimport { cAF, rAF } from '@element-plus/utils'\nimport { countdownEmits, countdownProps } from './countdown'\nimport { formatTime, getTime } from './utils'\n\ndefineOptions({\n  name: 'ElCountdown',\n})\n\nconst props = defineProps(countdownProps)\nconst emit = defineEmits(countdownEmits)\n\nlet timer: ReturnType<typeof rAF> | undefined\nconst rawValue = ref(getTime(props.value) - Date.now())\nconst displayValue = computed(() => formatTime(rawValue.value, props.format))\n\nconst formatter = (val: number) => formatTime(val, props.format)\n\nconst stopTimer = () => {\n  if (timer) {\n    cAF(timer)\n    timer = undefined\n  }\n}\n\nconst startTimer = () => {\n  const timestamp = getTime(props.value)\n  const frameFunc = () => {\n    let diff = timestamp - Date.now()\n    emit('change', diff)\n    if (diff <= 0) {\n      diff = 0\n      stopTimer()\n      emit('finish')\n    } else {\n      timer = rAF(frameFunc)\n    }\n    rawValue.value = diff\n  }\n  timer = rAF(frameFunc)\n}\n\nwatch(\n  () => [props.value, props.format],\n  () => {\n    stopTimer()\n    startTimer()\n  },\n  {\n    immediate: true,\n  }\n)\n\nonBeforeUnmount(() => {\n  stopTimer()\n})\n\ndefineExpose({\n  /**\n   * @description current display value\n   */\n  displayValue,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;mCAqBc,CAAA;AAAA,EACZ,IAAM,EAAA,aAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAI,IAAA,KAAA,CAAA;AACJ,IAAM,MAAA,QAAA,GAAW,IAAI,OAAQ,CAAA,KAAA,CAAM,KAAK,CAAI,GAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AACtD,IAAM,MAAA,YAAA,GAAe,SAAS,MAAM,UAAA,CAAW,SAAS,KAAO,EAAA,KAAA,CAAM,MAAM,CAAC,CAAA,CAAA;AAE5E,IAAA,MAAM,YAAY,CAAC,GAAA,KAAgB,UAAW,CAAA,GAAA,EAAK,MAAM,MAAM,CAAA,CAAA;AAE/D,IAAA,MAAM,YAAY,MAAM;AACtB,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,GAAA,CAAI,KAAK,CAAA,CAAA;AACT,QAAQ,KAAA,GAAA,KAAA,CAAA,CAAA;AAAA,OACV;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,aAAa,MAAM;AACvB,MAAM,MAAA,SAAA,GAAY,OAAQ,CAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AACrC,MAAA,MAAM,YAAY,MAAM;AACtB,QAAI,IAAA,IAAA,GAAO,SAAY,GAAA,IAAA,CAAK,GAAI,EAAA,CAAA;AAChC,QAAA,IAAA,CAAK,UAAU,IAAI,CAAA,CAAA;AACnB,QAAA,IAAI,QAAQ,CAAG,EAAA;AACb,UAAO,IAAA,GAAA,CAAA,CAAA;AACP,UAAU,SAAA,EAAA,CAAA;AACV,UAAA,IAAA,CAAK,QAAQ,CAAA,CAAA;AAAA,SACR,MAAA;AACL,UAAA,KAAA,GAAQ,IAAI,SAAS,CAAA,CAAA;AAAA,SACvB;AACA,QAAA,QAAA,CAAS,KAAQ,GAAA,IAAA,CAAA;AAAA,OACnB,CAAA;AACA,MAAA,KAAA,GAAQ,IAAI,SAAS,CAAA,CAAA;AAAA,KACvB,CAAA;AAEA,IAAA,KAAA,CACE,MAAM,CAAC,KAAA,CAAM,OAAO,KAAM,CAAA,MAAM,GAChC,MAAM;AACJ,MAAU,SAAA,EAAA,CAAA;AACV,MAAW,UAAA,EAAA,CAAA;AAAA,KAEb,EAAA;AAAA,MACE,SAAW,EAAA,IAAA;AAAA,KAEf,CAAA,CAAA;AAEA,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAU,SAAA,EAAA,CAAA;AAAA,KACX,CAAA,CAAA;AAED,IAAa,MAAA,CAAA;AAAA,MAIX,YAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"countdown.mjs","sources":["../../../../../../packages/components/countdown/src/countdown.ts"],"sourcesContent":["import { buildProps, definePropType, isNumber } from '@element-plus/utils'\nimport { CHANGE_EVENT } from '@element-plus/constants'\n\nimport type { ExtractPropTypes, StyleValue } from 'vue'\nimport type { Dayjs } from 'dayjs'\nimport type Countdown from './countdown.vue'\n\nexport const countdownProps = buildProps({\n  /**\n   * @description Formatting the countdown display\n   */\n  format: {\n    type: String,\n    default: 'HH:mm:ss',\n  },\n  /**\n   * @description Sets the prefix of a countdown\n   */\n  prefix: String,\n  /**\n   * @description Sets the suffix of a countdown\n   */\n  suffix: String,\n  /**\n   * @description countdown titles\n   */\n  title: String,\n  /**\n   * @description target time\n   */\n  value: {\n    type: definePropType<number | Dayjs>([Number, Object]),\n    default: 0,\n  },\n  /**\n   * @description Styles countdown values\n   */\n  valueStyle: {\n    type: definePropType<StyleValue>([String, Object, Array]),\n  },\n} as const)\nexport type CountdownProps = ExtractPropTypes<typeof countdownProps>\n\nexport const countdownEmits = {\n  finish: () => true,\n  [CHANGE_EVENT]: (value: number) => isNumber(value),\n}\nexport type CountdownEmits = typeof countdownEmits\n\nexport type CountdownInstance = InstanceType<typeof Countdown>\n"],"names":[],"mappings":";;;;;;AAEY,MAAC,cAAc,GAAG,UAAU,CAAC;AACzC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,UAAU;AACvB,GAAG;AACH,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACjD,GAAG;AACH,CAAC,EAAE;AACS,MAAC,cAAc,GAAG;AAC9B,EAAE,MAAM,EAAE,MAAM,IAAI;AACpB,EAAE,CAAC,YAAY,GAAG,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC;AAC5C;;;;"}

package/es/components/countdown/src/countdown2.mjs

@@ -1,29 +1,80 @@
+import { defineComponent, ref, computed, watch, onBeforeUnmount, openBlock, createBlock, unref, createSlots, renderList, withCtx, renderSlot } from 'vue';
+import { ElStatistic } from '../../statistic/index.mjs';
 import '../../../utils/index.mjs';
-import '../../../constants/index.mjs';
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
-import { CHANGE_EVENT } from '../../../constants/event.mjs';
-import { isNumber } from '@vueuse/core';
+import { countdownProps, countdownEmits } from './countdown.mjs';
+import { getTime, formatTime } from './utils.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { cAF, rAF } from '../../../utils/raf.mjs';
 
-const countdownProps = buildProps({
-  format: {
-    type: String,
-    default: "HH:mm:ss"
-  },
-  prefix: String,
-  suffix: String,
-  title: String,
-  value: {
-    type: definePropType([Number, Object]),
-    default: 0
-  },
-  valueStyle: {
-    type: definePropType([String, Object, Array])
+const __default__ = defineComponent({
+  name: "ElCountdown"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: countdownProps,
+  emits: countdownEmits,
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    let timer;
+    const rawValue = ref(getTime(props.value) - Date.now());
+    const displayValue = computed(() => formatTime(rawValue.value, props.format));
+    const formatter = (val) => formatTime(val, props.format);
+    const stopTimer = () => {
+      if (timer) {
+        cAF(timer);
+        timer = void 0;
+      }
+    };
+    const startTimer = () => {
+      const timestamp = getTime(props.value);
+      const frameFunc = () => {
+        let diff = timestamp - Date.now();
+        emit("change", diff);
+        if (diff <= 0) {
+          diff = 0;
+          stopTimer();
+          emit("finish");
+        } else {
+          timer = rAF(frameFunc);
+        }
+        rawValue.value = diff;
+      };
+      timer = rAF(frameFunc);
+    };
+    watch(() => [props.value, props.format], () => {
+      stopTimer();
+      startTimer();
+    }, {
+      immediate: true
+    });
+    onBeforeUnmount(() => {
+      stopTimer();
+    });
+    expose({
+      displayValue
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ElStatistic), {
+        value: rawValue.value,
+        title: _ctx.title,
+        prefix: _ctx.prefix,
+        suffix: _ctx.suffix,
+        "value-style": _ctx.valueStyle,
+        formatter
+      }, createSlots({ _: 2 }, [
+        renderList(_ctx.$slots, (_, name) => {
+          return {
+            name,
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, name)
+            ])
+          };
+        })
+      ]), 1032, ["value", "title", "prefix", "suffix", "value-style"]);
+    };
   }
 });
-const countdownEmits = {
-  finish: () => true,
-  [CHANGE_EVENT]: (value) => isNumber(value)
-};
+var Countdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/countdown/src/countdown.vue"]]);
 
-export { countdownEmits, countdownProps };
+export { Countdown as default };
 //# sourceMappingURL=countdown2.mjs.map

package/es/components/countdown/src/countdown2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"countdown2.mjs","sources":["../../../../../../packages/components/countdown/src/countdown.ts"],"sourcesContent":["import { buildProps, definePropType, isNumber } from '@element-plus/utils'\nimport { CHANGE_EVENT } from '@element-plus/constants'\n\nimport type { ExtractPropTypes, StyleValue } from 'vue'\nimport type { Dayjs } from 'dayjs'\nimport type Countdown from './countdown.vue'\n\nexport const countdownProps = buildProps({\n  /**\n   * @description Formatting the countdown display\n   */\n  format: {\n    type: String,\n    default: 'HH:mm:ss',\n  },\n  /**\n   * @description Sets the prefix of a countdown\n   */\n  prefix: String,\n  /**\n   * @description Sets the suffix of a countdown\n   */\n  suffix: String,\n  /**\n   * @description countdown titles\n   */\n  title: String,\n  /**\n   * @description target time\n   */\n  value: {\n    type: definePropType<number | Dayjs>([Number, Object]),\n    default: 0,\n  },\n  /**\n   * @description Styles countdown values\n   */\n  valueStyle: {\n    type: definePropType<StyleValue>([String, Object, Array]),\n  },\n} as const)\nexport type CountdownProps = ExtractPropTypes<typeof countdownProps>\n\nexport const countdownEmits = {\n  finish: () => true,\n  [CHANGE_EVENT]: (value: number) => isNumber(value),\n}\nexport type CountdownEmits = typeof countdownEmits\n\nexport type CountdownInstance = InstanceType<typeof Countdown>\n"],"names":[],"mappings":";;;;;;AAEY,MAAC,cAAc,GAAG,UAAU,CAAC;AACzC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,UAAU;AACvB,GAAG;AACH,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACjD,GAAG;AACH,CAAC,EAAE;AACS,MAAC,cAAc,GAAG;AAC9B,EAAE,MAAM,EAAE,MAAM,IAAI;AACpB,EAAE,CAAC,YAAY,GAAG,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC;AAC5C;;;;"}
+{"version":3,"file":"countdown2.mjs","sources":["../../../../../../packages/components/countdown/src/countdown.vue"],"sourcesContent":["<template>\n  <el-statistic\n    :value=\"rawValue\"\n    :title=\"title\"\n    :prefix=\"prefix\"\n    :suffix=\"suffix\"\n    :value-style=\"valueStyle\"\n    :formatter=\"formatter\"\n  >\n    <template v-for=\"(_, name) in $slots\" #[name]>\n      <slot :name=\"name\" />\n    </template>\n  </el-statistic>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, onBeforeUnmount, ref, watch } from 'vue'\nimport { ElStatistic } from '@element-plus/components/statistic'\nimport { cAF, rAF } from '@element-plus/utils'\nimport { countdownEmits, countdownProps } from './countdown'\nimport { formatTime, getTime } from './utils'\n\ndefineOptions({\n  name: 'ElCountdown',\n})\n\nconst props = defineProps(countdownProps)\nconst emit = defineEmits(countdownEmits)\n\nlet timer: ReturnType<typeof rAF> | undefined\nconst rawValue = ref(getTime(props.value) - Date.now())\nconst displayValue = computed(() => formatTime(rawValue.value, props.format))\n\nconst formatter = (val: number) => formatTime(val, props.format)\n\nconst stopTimer = () => {\n  if (timer) {\n    cAF(timer)\n    timer = undefined\n  }\n}\n\nconst startTimer = () => {\n  const timestamp = getTime(props.value)\n  const frameFunc = () => {\n    let diff = timestamp - Date.now()\n    emit('change', diff)\n    if (diff <= 0) {\n      diff = 0\n      stopTimer()\n      emit('finish')\n    } else {\n      timer = rAF(frameFunc)\n    }\n    rawValue.value = diff\n  }\n  timer = rAF(frameFunc)\n}\n\nwatch(\n  () => [props.value, props.format],\n  () => {\n    stopTimer()\n    startTimer()\n  },\n  {\n    immediate: true,\n  }\n)\n\nonBeforeUnmount(() => {\n  stopTimer()\n})\n\ndefineExpose({\n  /**\n   * @description current display value\n   */\n  displayValue,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;mCAqBc,CAAA;AAAA,EACZ,IAAM,EAAA,aAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAI,IAAA,KAAA,CAAA;AACJ,IAAM,MAAA,QAAA,GAAW,IAAI,OAAQ,CAAA,KAAA,CAAM,KAAK,CAAI,GAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AACtD,IAAM,MAAA,YAAA,GAAe,SAAS,MAAM,UAAA,CAAW,SAAS,KAAO,EAAA,KAAA,CAAM,MAAM,CAAC,CAAA,CAAA;AAE5E,IAAA,MAAM,YAAY,CAAC,GAAA,KAAgB,UAAW,CAAA,GAAA,EAAK,MAAM,MAAM,CAAA,CAAA;AAE/D,IAAA,MAAM,YAAY,MAAM;AACtB,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,GAAA,CAAI,KAAK,CAAA,CAAA;AACT,QAAQ,KAAA,GAAA,KAAA,CAAA,CAAA;AAAA,OACV;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,aAAa,MAAM;AACvB,MAAM,MAAA,SAAA,GAAY,OAAQ,CAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AACrC,MAAA,MAAM,YAAY,MAAM;AACtB,QAAI,IAAA,IAAA,GAAO,SAAY,GAAA,IAAA,CAAK,GAAI,EAAA,CAAA;AAChC,QAAA,IAAA,CAAK,UAAU,IAAI,CAAA,CAAA;AACnB,QAAA,IAAI,QAAQ,CAAG,EAAA;AACb,UAAO,IAAA,GAAA,CAAA,CAAA;AACP,UAAU,SAAA,EAAA,CAAA;AACV,UAAA,IAAA,CAAK,QAAQ,CAAA,CAAA;AAAA,SACR,MAAA;AACL,UAAA,KAAA,GAAQ,IAAI,SAAS,CAAA,CAAA;AAAA,SACvB;AACA,QAAA,QAAA,CAAS,KAAQ,GAAA,IAAA,CAAA;AAAA,OACnB,CAAA;AACA,MAAA,KAAA,GAAQ,IAAI,SAAS,CAAA,CAAA;AAAA,KACvB,CAAA;AAEA,IAAA,KAAA,CACE,MAAM,CAAC,KAAA,CAAM,OAAO,KAAM,CAAA,MAAM,GAChC,MAAM;AACJ,MAAU,SAAA,EAAA,CAAA;AACV,MAAW,UAAA,EAAA,CAAA;AAAA,KAEb,EAAA;AAAA,MACE,SAAW,EAAA,IAAA;AAAA,KAEf,CAAA,CAAA;AAEA,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAU,SAAA,EAAA,CAAA;AAAA,KACX,CAAA,CAAA;AAED,IAAa,MAAA,CAAA;AAAA,MAIX,YAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/date-picker/src/date-picker-com/panel-date-pick.vue.d.ts

@@ -261,6 +261,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }, {
         props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
             readonly size: {
@@ -290,6 +291,7 @@ declare const _default: import("vue").DefineComponent<{
             readonly color: StringConstructor;
             readonly dark: BooleanConstructor;
             readonly autoInsertSpace: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+            readonly tag: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
         }>> & {
             onClick?: ((evt: MouseEvent) => any) | undefined;
         }>>;
@@ -317,6 +319,17 @@ declare const _default: import("vue").DefineComponent<{
         _size: import("vue").ComputedRef<"" | "default" | "small" | "large">;
         _type: import("vue").ComputedRef<"" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger">;
         _disabled: import("vue").ComputedRef<boolean>;
+        _props: import("vue").ComputedRef<{
+            ariaDisabled: boolean;
+            disabled: boolean;
+            autofocus: boolean;
+            type: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
+        } | {
+            ariaDisabled?: undefined;
+            disabled?: undefined;
+            autofocus?: undefined;
+            type?: undefined;
+        }>;
         shouldAddSpace: import("vue").ComputedRef<boolean>;
         handleClick: (evt: MouseEvent) => void;
         ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
@@ -412,6 +425,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
     }, {
@@ -422,6 +436,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly text: boolean;
         readonly round: boolean;
         readonly circle: boolean;
+        readonly tag: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly nativeType: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
         readonly loadingIcon: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly autoInsertSpace: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;

package/es/components/date-picker/src/date-picker-com/panel-date-range.vue.d.ts

@@ -389,6 +389,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }, {
         props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
             readonly size: {
@@ -418,6 +419,7 @@ declare const _default: import("vue").DefineComponent<{
             readonly color: StringConstructor;
             readonly dark: BooleanConstructor;
             readonly autoInsertSpace: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+            readonly tag: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
         }>> & {
             onClick?: ((evt: MouseEvent) => any) | undefined;
         }>>;
@@ -445,6 +447,17 @@ declare const _default: import("vue").DefineComponent<{
         _size: import("vue").ComputedRef<"" | "default" | "small" | "large">;
         _type: import("vue").ComputedRef<"" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger">;
         _disabled: import("vue").ComputedRef<boolean>;
+        _props: import("vue").ComputedRef<{
+            ariaDisabled: boolean;
+            disabled: boolean;
+            autofocus: boolean;
+            type: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
+        } | {
+            ariaDisabled?: undefined;
+            disabled?: undefined;
+            autofocus?: undefined;
+            type?: undefined;
+        }>;
         shouldAddSpace: import("vue").ComputedRef<boolean>;
         handleClick: (evt: MouseEvent) => void;
         ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
@@ -540,6 +553,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
     }, {
@@ -550,6 +564,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly text: boolean;
         readonly round: boolean;
         readonly circle: boolean;
+        readonly tag: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly nativeType: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
         readonly loadingIcon: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly autoInsertSpace: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;

package/es/components/date-picker/src/panel-utils.d.ts

@@ -387,6 +387,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("../../../utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("../../../utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }, {
         props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
             readonly size: {
@@ -416,6 +417,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
             readonly color: StringConstructor;
             readonly dark: BooleanConstructor;
             readonly autoInsertSpace: import("../../../utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+            readonly tag: import("../../../utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
         }>> & {
             onClick?: ((evt: MouseEvent) => any) | undefined;
         }>>;
@@ -443,6 +445,17 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         _size: import("vue").ComputedRef<"" | "default" | "small" | "large">;
         _type: import("vue").ComputedRef<"" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger">;
         _disabled: import("vue").ComputedRef<boolean>;
+        _props: import("vue").ComputedRef<{
+            ariaDisabled: boolean;
+            disabled: boolean;
+            autofocus: boolean;
+            type: import("../../../utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
+        } | {
+            ariaDisabled?: undefined;
+            disabled?: undefined;
+            autofocus?: undefined;
+            type?: undefined;
+        }>;
         shouldAddSpace: import("vue").ComputedRef<boolean>;
         handleClick: (evt: MouseEvent) => void;
         ElIcon: import("../../../utils").SFCWithInstall<import("vue").DefineComponent<{
@@ -538,6 +551,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("../../../utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("../../../utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
     }, {
@@ -548,6 +562,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         readonly text: boolean;
         readonly round: boolean;
         readonly circle: boolean;
+        readonly tag: import("../../../utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly nativeType: import("../../../utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
         readonly loadingIcon: import("../../../utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly autoInsertSpace: import("../../../utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
@@ -9001,6 +9016,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("../../../utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("../../../utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }, {
         props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
             readonly size: {
@@ -9030,6 +9046,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
             readonly color: StringConstructor;
             readonly dark: BooleanConstructor;
             readonly autoInsertSpace: import("../../../utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+            readonly tag: import("../../../utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
         }>> & {
             onClick?: ((evt: MouseEvent) => any) | undefined;
         }>>;
@@ -9057,6 +9074,17 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         _size: import("vue").ComputedRef<"" | "default" | "small" | "large">;
         _type: import("vue").ComputedRef<"" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger">;
         _disabled: import("vue").ComputedRef<boolean>;
+        _props: import("vue").ComputedRef<{
+            ariaDisabled: boolean;
+            disabled: boolean;
+            autofocus: boolean;
+            type: import("../../../utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
+        } | {
+            ariaDisabled?: undefined;
+            disabled?: undefined;
+            autofocus?: undefined;
+            type?: undefined;
+        }>;
         shouldAddSpace: import("vue").ComputedRef<boolean>;
         handleClick: (evt: MouseEvent) => void;
         ElIcon: import("../../../utils").SFCWithInstall<import("vue").DefineComponent<{
@@ -9152,6 +9180,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         readonly color: StringConstructor;
         readonly dark: BooleanConstructor;
         readonly autoInsertSpace: import("../../../utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+        readonly tag: import("../../../utils").EpPropFinalized<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown, "button", boolean>;
     }>> & {
         onClick?: ((evt: MouseEvent) => any) | undefined;
     }, {
@@ -9162,6 +9191,7 @@ export declare const getPanel: (type: IDatePickerType) => import("vue").DefineCo
         readonly text: boolean;
         readonly round: boolean;
         readonly circle: boolean;
+        readonly tag: import("../../../utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly nativeType: import("../../../utils").EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
         readonly loadingIcon: import("../../../utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>;
         readonly autoInsertSpace: import("../../../utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;

package/es/components/image/src/image2.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, useAttrs, ref, computed, nextTick, watch, onMounted, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, mergeProps, createCommentVNode, renderSlot, createElementVNode, toDisplayString, Fragment, createBlock, withCtx } from 'vue';
+import { defineComponent, useAttrs, ref, computed, nextTick, watch, onMounted, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, renderSlot, createElementVNode, toDisplayString, Fragment, mergeProps, createCommentVNode, createBlock, withCtx } from 'vue';
 import { isClient, useThrottleFn, useEventListener } from '@vueuse/core';
 import '../../../hooks/index.mjs';
 import { ElImageViewer } from '../../image-viewer/index.mjs';
@@ -167,33 +167,35 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         class: normalizeClass([unref(ns).b(), _ctx.$attrs.class]),
         style: normalizeStyle(unref(containerStyle))
       }, [
-        imageSrc.value !== void 0 && !hasLoadError.value ? (openBlock(), createElementBlock("img", mergeProps({ key: 0 }, unref(attrs), {
-          src: imageSrc.value,
-          loading: _ctx.loading,
-          style: unref(imageStyle),
-          class: [
-            unref(ns).e("inner"),
-            unref(preview) && unref(ns).e("preview"),
-            isLoading.value && unref(ns).is("loading")
-          ],
-          onClick: clickHandler,
-          onLoad: handleLoad,
-          onError: handleError
-        }), null, 16, _hoisted_1)) : createCommentVNode("v-if", true),
-        isLoading.value || hasLoadError.value ? (openBlock(), createElementBlock("div", {
-          key: 1,
-          class: normalizeClass(unref(ns).e("wrapper"))
-        }, [
-          isLoading.value ? renderSlot(_ctx.$slots, "placeholder", { key: 0 }, () => [
-            createElementVNode("div", {
-              class: normalizeClass(unref(ns).e("placeholder"))
-            }, null, 2)
-          ]) : hasLoadError.value ? renderSlot(_ctx.$slots, "error", { key: 1 }, () => [
-            createElementVNode("div", {
-              class: normalizeClass(unref(ns).e("error"))
-            }, toDisplayString(unref(t)("el.image.error")), 3)
-          ]) : createCommentVNode("v-if", true)
-        ], 2)) : createCommentVNode("v-if", true),
+        hasLoadError.value ? renderSlot(_ctx.$slots, "error", { key: 0 }, () => [
+          createElementVNode("div", {
+            class: normalizeClass(unref(ns).e("error"))
+          }, toDisplayString(unref(t)("el.image.error")), 3)
+        ]) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          imageSrc.value !== void 0 ? (openBlock(), createElementBlock("img", mergeProps({ key: 0 }, unref(attrs), {
+            src: imageSrc.value,
+            loading: _ctx.loading,
+            style: unref(imageStyle),
+            class: [
+              unref(ns).e("inner"),
+              unref(preview) && unref(ns).e("preview"),
+              isLoading.value && unref(ns).is("loading")
+            ],
+            onClick: clickHandler,
+            onLoad: handleLoad,
+            onError: handleError
+          }), null, 16, _hoisted_1)) : createCommentVNode("v-if", true),
+          isLoading.value ? (openBlock(), createElementBlock("div", {
+            key: 1,
+            class: normalizeClass(unref(ns).e("wrapper"))
+          }, [
+            renderSlot(_ctx.$slots, "placeholder", {}, () => [
+              createElementVNode("div", {
+                class: normalizeClass(unref(ns).e("placeholder"))
+              }, null, 2)
+            ])
+          ], 2)) : createCommentVNode("v-if", true)
+        ], 64)),
         unref(preview) ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
           showViewer.value ? (openBlock(), createBlock(unref(ElImageViewer), {
             key: 0,

package/es/components/image/src/image2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"image2.mjs","sources":["../../../../../../packages/components/image/src/image.vue"],"sourcesContent":["<template>\n  <div ref=\"container\" :class=\"[ns.b(), $attrs.class]\" :style=\"containerStyle\">\n    <img\n      v-if=\"imageSrc !== undefined && !hasLoadError\"\n      v-bind=\"attrs\"\n      :src=\"imageSrc\"\n      :loading=\"loading\"\n      :style=\"imageStyle\"\n      :class=\"[\n        ns.e('inner'),\n        preview && ns.e('preview'),\n        isLoading && ns.is('loading'),\n      ]\"\n      @click=\"clickHandler\"\n      @load=\"handleLoad\"\n      @error=\"handleError\"\n    />\n    <div v-if=\"isLoading || hasLoadError\" :class=\"ns.e('wrapper')\">\n      <slot v-if=\"isLoading\" name=\"placeholder\">\n        <div :class=\"ns.e('placeholder')\" />\n      </slot>\n      <slot v-else-if=\"hasLoadError\" name=\"error\">\n        <div :class=\"ns.e('error')\">{{ t('el.image.error') }}</div>\n      </slot>\n    </div>\n    <template v-if=\"preview\">\n      <image-viewer\n        v-if=\"showViewer\"\n        :z-index=\"zIndex\"\n        :initial-index=\"imageIndex\"\n        :infinite=\"infinite\"\n        :zoom-rate=\"zoomRate\"\n        :url-list=\"previewSrcList\"\n        :hide-on-click-modal=\"hideOnClickModal\"\n        :teleported=\"previewTeleported\"\n        :close-on-press-escape=\"closeOnPressEscape\"\n        @close=\"closeViewer\"\n        @switch=\"switchViewer\"\n      >\n        <div v-if=\"$slots.viewer\">\n          <slot name=\"viewer\" />\n        </div>\n      </image-viewer>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  nextTick,\n  onMounted,\n  ref,\n  useAttrs as useRawAttrs,\n  watch,\n} from 'vue'\nimport { isClient, useEventListener, useThrottleFn } from '@vueuse/core'\nimport { useAttrs, useLocale, useNamespace } from '@element-plus/hooks'\nimport ImageViewer from '@element-plus/components/image-viewer'\nimport {\n  getScrollContainer,\n  isElement,\n  isInContainer,\n  isString,\n} from '@element-plus/utils'\nimport { imageEmits, imageProps } from './image'\n\nimport type { CSSProperties, StyleValue } from 'vue'\n\ndefineOptions({\n  name: 'ElImage',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(imageProps)\nconst emit = defineEmits(imageEmits)\n\nlet prevOverflow = ''\n\nconst { t } = useLocale()\nconst ns = useNamespace('image')\nconst rawAttrs = useRawAttrs()\nconst attrs = useAttrs()\n\nconst imageSrc = ref<string | undefined>()\nconst hasLoadError = ref(false)\nconst isLoading = ref(true)\nconst showViewer = ref(false)\nconst container = ref<HTMLElement>()\nconst _scrollContainer = ref<HTMLElement | Window>()\n\nconst supportLoading = isClient && 'loading' in HTMLImageElement.prototype\nlet stopScrollListener: (() => void) | undefined\nlet stopWheelListener: (() => void) | undefined\n\nconst containerStyle = computed(() => rawAttrs.style as StyleValue)\n\nconst imageStyle = computed<CSSProperties>(() => {\n  const { fit } = props\n  if (isClient && fit) {\n    return { objectFit: fit }\n  }\n  return {}\n})\n\nconst preview = computed(() => {\n  const { previewSrcList } = props\n  return Array.isArray(previewSrcList) && previewSrcList.length > 0\n})\n\nconst imageIndex = computed(() => {\n  const { previewSrcList, initialIndex } = props\n  let previewIndex = initialIndex\n  if (initialIndex > previewSrcList.length - 1) {\n    previewIndex = 0\n  }\n  return previewIndex\n})\n\nconst isManual = computed(() => {\n  if (props.loading === 'eager') return false\n  return (!supportLoading && props.loading === 'lazy') || props.lazy\n})\n\nconst loadImage = () => {\n  if (!isClient) return\n\n  // reset status\n  isLoading.value = true\n  hasLoadError.value = false\n  imageSrc.value = props.src\n}\n\nfunction handleLoad(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = false\n  emit('load', event)\n}\n\nfunction handleError(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = true\n  emit('error', event)\n}\n\nfunction handleLazyLoad() {\n  if (isInContainer(container.value, _scrollContainer.value)) {\n    loadImage()\n    removeLazyLoadListener()\n  }\n}\n\nconst lazyLoadHandler = useThrottleFn(handleLazyLoad, 200)\n\nasync function addLazyLoadListener() {\n  if (!isClient) return\n\n  await nextTick()\n\n  const { scrollContainer } = props\n  if (isElement(scrollContainer)) {\n    _scrollContainer.value = scrollContainer\n  } else if (isString(scrollContainer) && scrollContainer !== '') {\n    _scrollContainer.value =\n      document.querySelector<HTMLElement>(scrollContainer) ?? undefined\n  } else if (container.value) {\n    _scrollContainer.value = getScrollContainer(container.value)\n  }\n\n  if (_scrollContainer.value) {\n    stopScrollListener = useEventListener(\n      _scrollContainer,\n      'scroll',\n      lazyLoadHandler\n    )\n    setTimeout(() => handleLazyLoad(), 100)\n  }\n}\n\nfunction removeLazyLoadListener() {\n  if (!isClient || !_scrollContainer.value || !lazyLoadHandler) return\n\n  stopScrollListener?.()\n  _scrollContainer.value = undefined\n}\n\nfunction wheelHandler(e: WheelEvent) {\n  if (!e.ctrlKey) return\n\n  if (e.deltaY < 0) {\n    e.preventDefault()\n    return false\n  } else if (e.deltaY > 0) {\n    e.preventDefault()\n    return false\n  }\n}\n\nfunction clickHandler() {\n  // don't show viewer when preview is false\n  if (!preview.value) return\n\n  stopWheelListener = useEventListener('wheel', wheelHandler, {\n    passive: false,\n  })\n\n  // prevent body scroll\n  prevOverflow = document.body.style.overflow\n  document.body.style.overflow = 'hidden'\n  showViewer.value = true\n  emit('show')\n}\n\nfunction closeViewer() {\n  stopWheelListener?.()\n  document.body.style.overflow = prevOverflow\n  showViewer.value = false\n  emit('close')\n}\n\nfunction switchViewer(val: number) {\n  emit('switch', val)\n}\n\nwatch(\n  () => props.src,\n  () => {\n    if (isManual.value) {\n      // reset status\n      isLoading.value = true\n      hasLoadError.value = false\n      removeLazyLoadListener()\n      addLazyLoadListener()\n    } else {\n      loadImage()\n    }\n  }\n)\n\nonMounted(() => {\n  if (isManual.value) {\n    addLazyLoadListener()\n  } else {\n    loadImage()\n  }\n})\n</script>\n"],"names":["useRawAttrs","useAttrs"],"mappings":"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"}
+{"version":3,"file":"image2.mjs","sources":["../../../../../../packages/components/image/src/image.vue"],"sourcesContent":["<template>\n  <div ref=\"container\" :class=\"[ns.b(), $attrs.class]\" :style=\"containerStyle\">\n    <slot v-if=\"hasLoadError\" name=\"error\">\n      <div :class=\"ns.e('error')\">{{ t('el.image.error') }}</div>\n    </slot>\n    <template v-else>\n      <img\n        v-if=\"imageSrc !== undefined\"\n        v-bind=\"attrs\"\n        :src=\"imageSrc\"\n        :loading=\"loading\"\n        :style=\"imageStyle\"\n        :class=\"[\n          ns.e('inner'),\n          preview && ns.e('preview'),\n          isLoading && ns.is('loading'),\n        ]\"\n        @click=\"clickHandler\"\n        @load=\"handleLoad\"\n        @error=\"handleError\"\n      />\n      <div v-if=\"isLoading\" :class=\"ns.e('wrapper')\">\n        <slot name=\"placeholder\">\n          <div :class=\"ns.e('placeholder')\" />\n        </slot>\n      </div>\n    </template>\n    <template v-if=\"preview\">\n      <image-viewer\n        v-if=\"showViewer\"\n        :z-index=\"zIndex\"\n        :initial-index=\"imageIndex\"\n        :infinite=\"infinite\"\n        :zoom-rate=\"zoomRate\"\n        :url-list=\"previewSrcList\"\n        :hide-on-click-modal=\"hideOnClickModal\"\n        :teleported=\"previewTeleported\"\n        :close-on-press-escape=\"closeOnPressEscape\"\n        @close=\"closeViewer\"\n        @switch=\"switchViewer\"\n      >\n        <div v-if=\"$slots.viewer\">\n          <slot name=\"viewer\" />\n        </div>\n      </image-viewer>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  nextTick,\n  onMounted,\n  ref,\n  useAttrs as useRawAttrs,\n  watch,\n} from 'vue'\nimport { isClient, useEventListener, useThrottleFn } from '@vueuse/core'\nimport { useAttrs, useLocale, useNamespace } from '@element-plus/hooks'\nimport ImageViewer from '@element-plus/components/image-viewer'\nimport {\n  getScrollContainer,\n  isElement,\n  isInContainer,\n  isString,\n} from '@element-plus/utils'\nimport { imageEmits, imageProps } from './image'\n\nimport type { CSSProperties, StyleValue } from 'vue'\n\ndefineOptions({\n  name: 'ElImage',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(imageProps)\nconst emit = defineEmits(imageEmits)\n\nlet prevOverflow = ''\n\nconst { t } = useLocale()\nconst ns = useNamespace('image')\nconst rawAttrs = useRawAttrs()\nconst attrs = useAttrs()\n\nconst imageSrc = ref<string | undefined>()\nconst hasLoadError = ref(false)\nconst isLoading = ref(true)\nconst showViewer = ref(false)\nconst container = ref<HTMLElement>()\nconst _scrollContainer = ref<HTMLElement | Window>()\n\nconst supportLoading = isClient && 'loading' in HTMLImageElement.prototype\nlet stopScrollListener: (() => void) | undefined\nlet stopWheelListener: (() => void) | undefined\n\nconst containerStyle = computed(() => rawAttrs.style as StyleValue)\n\nconst imageStyle = computed<CSSProperties>(() => {\n  const { fit } = props\n  if (isClient && fit) {\n    return { objectFit: fit }\n  }\n  return {}\n})\n\nconst preview = computed(() => {\n  const { previewSrcList } = props\n  return Array.isArray(previewSrcList) && previewSrcList.length > 0\n})\n\nconst imageIndex = computed(() => {\n  const { previewSrcList, initialIndex } = props\n  let previewIndex = initialIndex\n  if (initialIndex > previewSrcList.length - 1) {\n    previewIndex = 0\n  }\n  return previewIndex\n})\n\nconst isManual = computed(() => {\n  if (props.loading === 'eager') return false\n  return (!supportLoading && props.loading === 'lazy') || props.lazy\n})\n\nconst loadImage = () => {\n  if (!isClient) return\n\n  // reset status\n  isLoading.value = true\n  hasLoadError.value = false\n  imageSrc.value = props.src\n}\n\nfunction handleLoad(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = false\n  emit('load', event)\n}\n\nfunction handleError(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = true\n  emit('error', event)\n}\n\nfunction handleLazyLoad() {\n  if (isInContainer(container.value, _scrollContainer.value)) {\n    loadImage()\n    removeLazyLoadListener()\n  }\n}\n\nconst lazyLoadHandler = useThrottleFn(handleLazyLoad, 200)\n\nasync function addLazyLoadListener() {\n  if (!isClient) return\n\n  await nextTick()\n\n  const { scrollContainer } = props\n  if (isElement(scrollContainer)) {\n    _scrollContainer.value = scrollContainer\n  } else if (isString(scrollContainer) && scrollContainer !== '') {\n    _scrollContainer.value =\n      document.querySelector<HTMLElement>(scrollContainer) ?? undefined\n  } else if (container.value) {\n    _scrollContainer.value = getScrollContainer(container.value)\n  }\n\n  if (_scrollContainer.value) {\n    stopScrollListener = useEventListener(\n      _scrollContainer,\n      'scroll',\n      lazyLoadHandler\n    )\n    setTimeout(() => handleLazyLoad(), 100)\n  }\n}\n\nfunction removeLazyLoadListener() {\n  if (!isClient || !_scrollContainer.value || !lazyLoadHandler) return\n\n  stopScrollListener?.()\n  _scrollContainer.value = undefined\n}\n\nfunction wheelHandler(e: WheelEvent) {\n  if (!e.ctrlKey) return\n\n  if (e.deltaY < 0) {\n    e.preventDefault()\n    return false\n  } else if (e.deltaY > 0) {\n    e.preventDefault()\n    return false\n  }\n}\n\nfunction clickHandler() {\n  // don't show viewer when preview is false\n  if (!preview.value) return\n\n  stopWheelListener = useEventListener('wheel', wheelHandler, {\n    passive: false,\n  })\n\n  // prevent body scroll\n  prevOverflow = document.body.style.overflow\n  document.body.style.overflow = 'hidden'\n  showViewer.value = true\n  emit('show')\n}\n\nfunction closeViewer() {\n  stopWheelListener?.()\n  document.body.style.overflow = prevOverflow\n  showViewer.value = false\n  emit('close')\n}\n\nfunction switchViewer(val: number) {\n  emit('switch', val)\n}\n\nwatch(\n  () => props.src,\n  () => {\n    if (isManual.value) {\n      // reset status\n      isLoading.value = true\n      hasLoadError.value = false\n      removeLazyLoadListener()\n      addLazyLoadListener()\n    } else {\n      loadImage()\n    }\n  }\n)\n\nonMounted(() => {\n  if (isManual.value) {\n    addLazyLoadListener()\n  } else {\n    loadImage()\n  }\n})\n</script>\n"],"names":["useRawAttrs","useAttrs"],"mappings":"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"}