@element-plus/nightly 0.0.20221029 → 0.0.20221031

package/es/components/alert/src/alert.mjs

@@ -1,102 +1,42 @@
-import { defineComponent, useSlots, ref, computed, openBlock, createBlock, Transition, unref, withCtx, withDirectives, createElementVNode, normalizeClass, resolveDynamicComponent, createCommentVNode, createElementBlock, renderSlot, createTextVNode, toDisplayString, Fragment, createVNode, vShow } from 'vue';
-import { ElIcon } from '../../icon/index.mjs';
 import '../../../utils/index.mjs';
-import '../../../hooks/index.mjs';
-import { alertProps, alertEmits } from './alert2.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { TypeComponents, TypeComponentsMap } from '../../../utils/vue/icon.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { keysOf } from '../../../utils/objects.mjs';
+import { TypeComponentsMap } from '../../../utils/vue/icon.mjs';
 
-const __default__ = defineComponent({
-  name: "ElAlert"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: alertProps,
-  emits: alertEmits,
-  setup(__props, { emit }) {
-    const props = __props;
-    const { Close } = TypeComponents;
-    const slots = useSlots();
-    const ns = useNamespace("alert");
-    const visible = ref(true);
-    const iconComponent = computed(() => TypeComponentsMap[props.type]);
-    const iconClass = computed(() => [
-      ns.e("icon"),
-      { [ns.is("big")]: !!props.description || !!slots.default }
-    ]);
-    const isBoldTitle = computed(() => {
-      return { [ns.is("bold")]: props.description || slots.default };
-    });
-    const close = (evt) => {
-      visible.value = false;
-      emit("close", evt);
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(Transition, {
-        name: unref(ns).b("fade"),
-        persisted: ""
-      }, {
-        default: withCtx(() => [
-          withDirectives(createElementVNode("div", {
-            class: normalizeClass([unref(ns).b(), unref(ns).m(_ctx.type), unref(ns).is("center", _ctx.center), unref(ns).is(_ctx.effect)]),
-            role: "alert"
-          }, [
-            _ctx.showIcon && unref(iconComponent) ? (openBlock(), createBlock(unref(ElIcon), {
-              key: 0,
-              class: normalizeClass(unref(iconClass))
-            }, {
-              default: withCtx(() => [
-                (openBlock(), createBlock(resolveDynamicComponent(unref(iconComponent))))
-              ]),
-              _: 1
-            }, 8, ["class"])) : createCommentVNode("v-if", true),
-            createElementVNode("div", {
-              class: normalizeClass(unref(ns).e("content"))
-            }, [
-              _ctx.title || _ctx.$slots.title ? (openBlock(), createElementBlock("span", {
-                key: 0,
-                class: normalizeClass([unref(ns).e("title"), unref(isBoldTitle)])
-              }, [
-                renderSlot(_ctx.$slots, "title", {}, () => [
-                  createTextVNode(toDisplayString(_ctx.title), 1)
-                ])
-              ], 2)) : createCommentVNode("v-if", true),
-              _ctx.$slots.default || _ctx.description ? (openBlock(), createElementBlock("p", {
-                key: 1,
-                class: normalizeClass(unref(ns).e("description"))
-              }, [
-                renderSlot(_ctx.$slots, "default", {}, () => [
-                  createTextVNode(toDisplayString(_ctx.description), 1)
-                ])
-              ], 2)) : createCommentVNode("v-if", true),
-              _ctx.closable ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
-                _ctx.closeText ? (openBlock(), createElementBlock("div", {
-                  key: 0,
-                  class: normalizeClass([unref(ns).e("close-btn"), unref(ns).is("customed")]),
-                  onClick: close
-                }, toDisplayString(_ctx.closeText), 3)) : (openBlock(), createBlock(unref(ElIcon), {
-                  key: 1,
-                  class: normalizeClass(unref(ns).e("close-btn")),
-                  onClick: close
-                }, {
-                  default: withCtx(() => [
-                    createVNode(unref(Close))
-                  ]),
-                  _: 1
-                }, 8, ["class"]))
-              ], 64)) : createCommentVNode("v-if", true)
-            ], 2)
-          ], 2), [
-            [vShow, visible.value]
-          ])
-        ]),
-        _: 3
-      }, 8, ["name"]);
-    };
+const alertEffects = ["light", "dark"];
+const alertProps = buildProps({
+  title: {
+    type: String,
+    default: ""
+  },
+  description: {
+    type: String,
+    default: ""
+  },
+  type: {
+    type: String,
+    values: keysOf(TypeComponentsMap),
+    default: "info"
+  },
+  closable: {
+    type: Boolean,
+    default: true
+  },
+  closeText: {
+    type: String,
+    default: ""
+  },
+  showIcon: Boolean,
+  center: Boolean,
+  effect: {
+    type: String,
+    values: alertEffects,
+    default: "light"
   }
 });
-var Alert = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/alert/src/alert.vue"]]);
+const alertEmits = {
+  close: (evt) => evt instanceof MouseEvent
+};
 
-export { Alert as default };
+export { alertEffects, alertEmits, alertProps };
 //# sourceMappingURL=alert.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"alert.mjs","sources":["../../../../../../packages/components/alert/src/alert.vue"],"sourcesContent":["<template>\n  <transition :name=\"ns.b('fade')\">\n    <div\n      v-show=\"visible\"\n      :class=\"[ns.b(), ns.m(type), ns.is('center', center), ns.is(effect)]\"\n      role=\"alert\"\n    >\n      <el-icon v-if=\"showIcon && iconComponent\" :class=\"iconClass\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n\n      <div :class=\"ns.e('content')\">\n        <span\n          v-if=\"title || $slots.title\"\n          :class=\"[ns.e('title'), isBoldTitle]\"\n        >\n          <slot name=\"title\">{{ title }}</slot>\n        </span>\n        <p v-if=\"$slots.default || description\" :class=\"ns.e('description')\">\n          <slot>\n            {{ description }}\n          </slot>\n        </p>\n        <template v-if=\"closable\">\n          <div\n            v-if=\"closeText\"\n            :class=\"[ns.e('close-btn'), ns.is('customed')]\"\n            @click=\"close\"\n          >\n            {{ closeText }}\n          </div>\n          <el-icon v-else :class=\"ns.e('close-btn')\" @click=\"close\">\n            <Close />\n          </el-icon>\n        </template>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertEmits, alertProps } from './alert'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n  name: 'ElAlert',\n})\n\nconst props = defineProps(alertProps)\nconst emit = defineEmits(alertEmits)\nconst slots = useSlots()\n\nconst ns = useNamespace('alert')\n\nconst visible = ref(true)\n\nconst iconComponent = computed(() => TypeComponentsMap[props.type])\n\nconst iconClass = computed(() => [\n  ns.e('icon'),\n  { [ns.is('big')]: !!props.description || !!slots.default },\n])\n\nconst isBoldTitle = computed(() => {\n  return { [ns.is('bold')]: props.description || slots.default }\n})\n\nconst close = (evt: MouseEvent) => {\n  visible.value = false\n  emit('close', evt)\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;mCAgDc,CAAA;AAAA,EACZ,IAAM,EAAA,SAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAJA,IAAA,MAAM,EAAE,KAAU,EAAA,GAAA,cAAA,CAAA;AAQlB,IAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AAEvB,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAE/B,IAAM,MAAA,OAAA,GAAU,IAAI,IAAI,CAAA,CAAA;AAExB,IAAA,MAAM,aAAgB,GAAA,QAAA,CAAS,MAAM,iBAAA,CAAkB,MAAM,IAAK,CAAA,CAAA,CAAA;AAElE,IAAM,MAAA,SAAA,GAAY,SAAS,MAAM;AAAA,MAC/B,EAAA,CAAG,EAAE,MAAM,CAAA;AAAA,MACX,EAAE,CAAC,EAAG,CAAA,EAAA,CAAG,KAAK,CAAA,GAAI,CAAC,CAAC,KAAM,CAAA,WAAA,IAAe,CAAC,CAAC,MAAM,OAAQ,EAAA;AAAA,KAC1D,CAAA,CAAA;AAED,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAO,OAAA,EAAE,CAAC,EAAG,CAAA,EAAA,CAAG,MAAM,CAAI,GAAA,KAAA,CAAM,WAAe,IAAA,KAAA,CAAM,OAAQ,EAAA,CAAA;AAAA,KAC9D,CAAA,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,CAAC,GAAoB,KAAA;AACjC,MAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA,CAAA;AAChB,MAAA,IAAA,CAAK,SAAS,GAAG,CAAA,CAAA;AAAA,KACnB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"alert.mjs","sources":["../../../../../../packages/components/alert/src/alert.ts"],"sourcesContent":["import { TypeComponentsMap, buildProps, keysOf } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type Alert from './alert.vue'\n\nexport const alertEffects = ['light', 'dark'] as const\n\nexport const alertProps = buildProps({\n  title: {\n    type: String,\n    default: '',\n  },\n  description: {\n    type: String,\n    default: '',\n  },\n  type: {\n    type: String,\n    values: keysOf(TypeComponentsMap),\n    default: 'info',\n  },\n  closable: {\n    type: Boolean,\n    default: true,\n  },\n  closeText: {\n    type: String,\n    default: '',\n  },\n  showIcon: Boolean,\n  center: Boolean,\n  effect: {\n    type: String,\n    values: alertEffects,\n    default: 'light',\n  },\n} as const)\nexport type AlertProps = ExtractPropTypes<typeof alertProps>\n\nexport const alertEmits = {\n  close: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type AlertEmits = typeof alertEmits\n\nexport type AlertInstance = InstanceType<typeof Alert>\n"],"names":[],"mappings":";;;;;AACY,MAAC,YAAY,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE;AAClC,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC;AACrC,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,MAAM,EAAE,OAAO;AACjB,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,YAAY;AACxB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;"}

package/es/components/alert/src/alert2.mjs

@@ -1,42 +1,102 @@
+import { defineComponent, useSlots, ref, computed, openBlock, createBlock, Transition, unref, withCtx, withDirectives, createElementVNode, normalizeClass, resolveDynamicComponent, createCommentVNode, createElementBlock, renderSlot, createTextVNode, toDisplayString, Fragment, createVNode, vShow } from 'vue';
+import { ElIcon } from '../../icon/index.mjs';
 import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
-import { keysOf } from '../../../utils/objects.mjs';
-import { TypeComponentsMap } from '../../../utils/vue/icon.mjs';
+import '../../../hooks/index.mjs';
+import { alertProps, alertEmits } from './alert.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { TypeComponents, TypeComponentsMap } from '../../../utils/vue/icon.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const alertEffects = ["light", "dark"];
-const alertProps = buildProps({
-  title: {
-    type: String,
-    default: ""
-  },
-  description: {
-    type: String,
-    default: ""
-  },
-  type: {
-    type: String,
-    values: keysOf(TypeComponentsMap),
-    default: "info"
-  },
-  closable: {
-    type: Boolean,
-    default: true
-  },
-  closeText: {
-    type: String,
-    default: ""
-  },
-  showIcon: Boolean,
-  center: Boolean,
-  effect: {
-    type: String,
-    values: alertEffects,
-    default: "light"
+const __default__ = defineComponent({
+  name: "ElAlert"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: alertProps,
+  emits: alertEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const { Close } = TypeComponents;
+    const slots = useSlots();
+    const ns = useNamespace("alert");
+    const visible = ref(true);
+    const iconComponent = computed(() => TypeComponentsMap[props.type]);
+    const iconClass = computed(() => [
+      ns.e("icon"),
+      { [ns.is("big")]: !!props.description || !!slots.default }
+    ]);
+    const isBoldTitle = computed(() => {
+      return { [ns.is("bold")]: props.description || slots.default };
+    });
+    const close = (evt) => {
+      visible.value = false;
+      emit("close", evt);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Transition, {
+        name: unref(ns).b("fade"),
+        persisted: ""
+      }, {
+        default: withCtx(() => [
+          withDirectives(createElementVNode("div", {
+            class: normalizeClass([unref(ns).b(), unref(ns).m(_ctx.type), unref(ns).is("center", _ctx.center), unref(ns).is(_ctx.effect)]),
+            role: "alert"
+          }, [
+            _ctx.showIcon && unref(iconComponent) ? (openBlock(), createBlock(unref(ElIcon), {
+              key: 0,
+              class: normalizeClass(unref(iconClass))
+            }, {
+              default: withCtx(() => [
+                (openBlock(), createBlock(resolveDynamicComponent(unref(iconComponent))))
+              ]),
+              _: 1
+            }, 8, ["class"])) : createCommentVNode("v-if", true),
+            createElementVNode("div", {
+              class: normalizeClass(unref(ns).e("content"))
+            }, [
+              _ctx.title || _ctx.$slots.title ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                class: normalizeClass([unref(ns).e("title"), unref(isBoldTitle)])
+              }, [
+                renderSlot(_ctx.$slots, "title", {}, () => [
+                  createTextVNode(toDisplayString(_ctx.title), 1)
+                ])
+              ], 2)) : createCommentVNode("v-if", true),
+              _ctx.$slots.default || _ctx.description ? (openBlock(), createElementBlock("p", {
+                key: 1,
+                class: normalizeClass(unref(ns).e("description"))
+              }, [
+                renderSlot(_ctx.$slots, "default", {}, () => [
+                  createTextVNode(toDisplayString(_ctx.description), 1)
+                ])
+              ], 2)) : createCommentVNode("v-if", true),
+              _ctx.closable ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+                _ctx.closeText ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  class: normalizeClass([unref(ns).e("close-btn"), unref(ns).is("customed")]),
+                  onClick: close
+                }, toDisplayString(_ctx.closeText), 3)) : (openBlock(), createBlock(unref(ElIcon), {
+                  key: 1,
+                  class: normalizeClass(unref(ns).e("close-btn")),
+                  onClick: close
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(Close))
+                  ]),
+                  _: 1
+                }, 8, ["class"]))
+              ], 64)) : createCommentVNode("v-if", true)
+            ], 2)
+          ], 2), [
+            [vShow, visible.value]
+          ])
+        ]),
+        _: 3
+      }, 8, ["name"]);
+    };
   }
 });
-const alertEmits = {
-  close: (evt) => evt instanceof MouseEvent
-};
+var Alert = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/alert/src/alert.vue"]]);
 
-export { alertEffects, alertEmits, alertProps };
+export { Alert as default };
 //# sourceMappingURL=alert2.mjs.map

package/es/components/alert/src/alert2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"alert2.mjs","sources":["../../../../../../packages/components/alert/src/alert.ts"],"sourcesContent":["import { TypeComponentsMap, buildProps, keysOf } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type Alert from './alert.vue'\n\nexport const alertEffects = ['light', 'dark'] as const\n\nexport const alertProps = buildProps({\n  title: {\n    type: String,\n    default: '',\n  },\n  description: {\n    type: String,\n    default: '',\n  },\n  type: {\n    type: String,\n    values: keysOf(TypeComponentsMap),\n    default: 'info',\n  },\n  closable: {\n    type: Boolean,\n    default: true,\n  },\n  closeText: {\n    type: String,\n    default: '',\n  },\n  showIcon: Boolean,\n  center: Boolean,\n  effect: {\n    type: String,\n    values: alertEffects,\n    default: 'light',\n  },\n} as const)\nexport type AlertProps = ExtractPropTypes<typeof alertProps>\n\nexport const alertEmits = {\n  close: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type AlertEmits = typeof alertEmits\n\nexport type AlertInstance = InstanceType<typeof Alert>\n"],"names":[],"mappings":";;;;;AACY,MAAC,YAAY,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE;AAClC,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC;AACrC,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,MAAM,EAAE,OAAO;AACjB,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,YAAY;AACxB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;"}
+{"version":3,"file":"alert2.mjs","sources":["../../../../../../packages/components/alert/src/alert.vue"],"sourcesContent":["<template>\n  <transition :name=\"ns.b('fade')\">\n    <div\n      v-show=\"visible\"\n      :class=\"[ns.b(), ns.m(type), ns.is('center', center), ns.is(effect)]\"\n      role=\"alert\"\n    >\n      <el-icon v-if=\"showIcon && iconComponent\" :class=\"iconClass\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n\n      <div :class=\"ns.e('content')\">\n        <span\n          v-if=\"title || $slots.title\"\n          :class=\"[ns.e('title'), isBoldTitle]\"\n        >\n          <slot name=\"title\">{{ title }}</slot>\n        </span>\n        <p v-if=\"$slots.default || description\" :class=\"ns.e('description')\">\n          <slot>\n            {{ description }}\n          </slot>\n        </p>\n        <template v-if=\"closable\">\n          <div\n            v-if=\"closeText\"\n            :class=\"[ns.e('close-btn'), ns.is('customed')]\"\n            @click=\"close\"\n          >\n            {{ closeText }}\n          </div>\n          <el-icon v-else :class=\"ns.e('close-btn')\" @click=\"close\">\n            <Close />\n          </el-icon>\n        </template>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertEmits, alertProps } from './alert'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n  name: 'ElAlert',\n})\n\nconst props = defineProps(alertProps)\nconst emit = defineEmits(alertEmits)\nconst slots = useSlots()\n\nconst ns = useNamespace('alert')\n\nconst visible = ref(true)\n\nconst iconComponent = computed(() => TypeComponentsMap[props.type])\n\nconst iconClass = computed(() => [\n  ns.e('icon'),\n  { [ns.is('big')]: !!props.description || !!slots.default },\n])\n\nconst isBoldTitle = computed(() => {\n  return { [ns.is('bold')]: props.description || slots.default }\n})\n\nconst close = (evt: MouseEvent) => {\n  visible.value = false\n  emit('close', evt)\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;mCAgDc,CAAA;AAAA,EACZ,IAAM,EAAA,SAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAJA,IAAA,MAAM,EAAE,KAAU,EAAA,GAAA,cAAA,CAAA;AAQlB,IAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AAEvB,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAE/B,IAAM,MAAA,OAAA,GAAU,IAAI,IAAI,CAAA,CAAA;AAExB,IAAA,MAAM,aAAgB,GAAA,QAAA,CAAS,MAAM,iBAAA,CAAkB,MAAM,IAAK,CAAA,CAAA,CAAA;AAElE,IAAM,MAAA,SAAA,GAAY,SAAS,MAAM;AAAA,MAC/B,EAAA,CAAG,EAAE,MAAM,CAAA;AAAA,MACX,EAAE,CAAC,EAAG,CAAA,EAAA,CAAG,KAAK,CAAA,GAAI,CAAC,CAAC,KAAM,CAAA,WAAA,IAAe,CAAC,CAAC,MAAM,OAAQ,EAAA;AAAA,KAC1D,CAAA,CAAA;AAED,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAO,OAAA,EAAE,CAAC,EAAG,CAAA,EAAA,CAAG,MAAM,CAAI,GAAA,KAAA,CAAM,WAAe,IAAA,KAAA,CAAM,OAAQ,EAAA,CAAA;AAAA,KAC9D,CAAA,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,CAAC,GAAoB,KAAA;AACjC,MAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA,CAAA;AAChB,MAAA,IAAA,CAAK,SAAS,GAAG,CAAA,CAAA;AAAA,KACnB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -30,6 +30,7 @@ export declare const ElCarousel: import("element-plus/es/utils").SFCWithInstall<
         onChange?: ((current: number, prev: number) => any) | undefined;
     }>>;
     emit: (event: "change", current: number, prev: number) => void;
+    root: import("vue").Ref<HTMLDivElement | undefined>;
     activeIndex: import("vue").Ref<number>;
     arrowDisplay: import("vue").ComputedRef<boolean>;
     hasLabel: import("vue").ComputedRef<boolean>;

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

@@ -30,6 +30,7 @@ declare const _default: import("vue").DefineComponent<{
         onChange?: ((current: number, prev: number) => any) | undefined;
     }>>;
     emit: (event: "change", current: number, prev: number) => void;
+    root: import("vue").Ref<HTMLDivElement | undefined>;
     activeIndex: import("vue").Ref<number>;
     arrowDisplay: import("vue").ComputedRef<boolean>;
     hasLabel: import("vue").ComputedRef<boolean>;

package/es/components/carousel/src/carousel2.mjs

@@ -20,6 +20,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { expose, emit }) {
     const props = __props;
     const {
+      root,
       activeIndex,
       arrowDisplay,
       hasLabel,
@@ -62,7 +63,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        ref: "root",
+        ref_key: "root",
+        ref: root,
         class: normalizeClass(unref(carouselClasses)),
         onMouseenter: _cache[6] || (_cache[6] = withModifiers((...args) => unref(handleMouseEnter) && unref(handleMouseEnter)(...args), ["stop"])),
         onMouseleave: _cache[7] || (_cache[7] = withModifiers((...args) => unref(handleMouseLeave) && unref(handleMouseLeave)(...args), ["stop"]))

package/es/components/carousel/src/carousel2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"carousel2.mjs","sources":["../../../../../../packages/components/carousel/src/carousel.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"root\"\n    :class=\"carouselClasses\"\n    @mouseenter.stop=\"handleMouseEnter\"\n    @mouseleave.stop=\"handleMouseLeave\"\n  >\n    <div :class=\"ns.e('container')\" :style=\"{ height: height }\">\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-left\">\n        <button\n          v-show=\"\n            (arrow === 'always' || hover) && (props.loop || activeIndex > 0)\n          \"\n          type=\"button\"\n          :class=\"[ns.e('arrow'), ns.em('arrow', 'left')]\"\n          @mouseenter=\"handleButtonEnter('left')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(activeIndex - 1)\"\n        >\n          <ElIcon>\n            <ArrowLeft />\n          </ElIcon>\n        </button>\n      </transition>\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-right\">\n        <button\n          v-show=\"\n            (arrow === 'always' || hover) &&\n            (props.loop || activeIndex < items.length - 1)\n          \"\n          type=\"button\"\n          :class=\"[ns.e('arrow'), ns.em('arrow', 'right')]\"\n          @mouseenter=\"handleButtonEnter('right')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(activeIndex + 1)\"\n        >\n          <ElIcon>\n            <ArrowRight />\n          </ElIcon>\n        </button>\n      </transition>\n      <slot />\n    </div>\n    <ul v-if=\"indicatorPosition !== 'none'\" :class=\"indicatorsClasses\">\n      <li\n        v-for=\"(item, index) in items\"\n        :key=\"index\"\n        :class=\"[\n          ns.e('indicator'),\n          ns.em('indicator', direction),\n          ns.is('active', index === activeIndex),\n        ]\"\n        @mouseenter=\"throttledIndicatorHover(index)\"\n        @click.stop=\"handleIndicatorClick(index)\"\n      >\n        <button :class=\"ns.e('button')\">\n          <span v-if=\"hasLabel\">{{ item.props.label }}</span>\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, unref } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { carouselEmits, carouselProps } from './carousel'\nimport { useCarousel } from './use-carousel'\n\nconst COMPONENT_NAME = 'ElCarousel'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = defineProps(carouselProps)\nconst emit = defineEmits(carouselEmits)\nconst {\n  activeIndex,\n  arrowDisplay,\n  hasLabel,\n  hover,\n  isCardType,\n  items,\n  handleButtonEnter,\n  handleButtonLeave,\n  handleIndicatorClick,\n  handleMouseEnter,\n  handleMouseLeave,\n  setActiveItem,\n  prev,\n  next,\n  throttledArrowClick,\n  throttledIndicatorHover,\n} = useCarousel(props, emit, COMPONENT_NAME)\nconst ns = useNamespace('carousel')\n\nconst carouselClasses = computed(() => {\n  const classes = [ns.b(), ns.m(props.direction)]\n  if (unref(isCardType)) {\n    classes.push(ns.m('card'))\n  }\n  return classes\n})\n\nconst indicatorsClasses = computed(() => {\n  const classes = [ns.e('indicators'), ns.em('indicators', props.direction)]\n  if (unref(hasLabel)) {\n    classes.push(ns.em('indicators', 'labels'))\n  }\n  if (props.indicatorPosition === 'outside' || unref(isCardType)) {\n    classes.push(ns.em('indicators', 'outside'))\n  }\n  return classes\n})\n\ndefineExpose({\n  /** @description manually switch slide */\n  setActiveItem,\n  /** @description switch to the previous slide */\n  prev,\n  /** @description switch to the next slide */\n  next,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;mCAwEc,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR;;;;;;;AAIA,IAAM,MAAA;AAAA,MACJ,WAAA;AAAA,MACA,YAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,UAAA;AAAA,MACA,KAAA;AAAA,MACA,iBAAA;AAAA,MACA,iBAAA;AAAA,MACA,oBAAA;AAAA,MACA,gBAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,mBAAA;AAAA,MACA,uBAAA;AAAA,KACE,GAAA,WAAA,CAAY,KAAO,EAAA,IAAA,EAAM,cAAc,CAAA,CAAA;AAC3C,IAAM,MAAA,EAAA,GAAK,aAAa,UAAU,CAAA,CAAA;AAElC,IAAM,MAAA,eAAA,GAAkB,SAAS,MAAM;AACrC,MAAM,MAAA,OAAA,GAAU,CAAC,EAAG,CAAA,CAAA,IAAK,EAAG,CAAA,CAAA,CAAE,KAAM,CAAA,SAAS,CAAC,CAAA,CAAA;AAC9C,MAAI,IAAA,KAAA,CAAM,UAAU,CAAG,EAAA;AACrB,QAAA,OAAA,CAAQ,IAAK,CAAA,EAAA,CAAG,CAAE,CAAA,MAAM,CAAC,CAAA,CAAA;AAAA,OAC3B;AACA,MAAO,OAAA,OAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,iBAAA,GAAoB,SAAS,MAAM;AACvC,MAAM,MAAA,OAAA,GAAU,CAAC,EAAA,CAAG,CAAE,CAAA,YAAY,CAAG,EAAA,EAAA,CAAG,EAAG,CAAA,YAAA,EAAc,KAAM,CAAA,SAAS,CAAC,CAAA,CAAA;AACzE,MAAI,IAAA,KAAA,CAAM,QAAQ,CAAG,EAAA;AACnB,QAAA,OAAA,CAAQ,IAAK,CAAA,EAAA,CAAG,EAAG,CAAA,YAAA,EAAc,QAAQ,CAAC,CAAA,CAAA;AAAA,OAC5C;AACA,MAAA,IAAI,KAAM,CAAA,iBAAA,KAAsB,SAAa,IAAA,KAAA,CAAM,UAAU,CAAG,EAAA;AAC9D,QAAA,OAAA,CAAQ,IAAK,CAAA,EAAA,CAAG,EAAG,CAAA,YAAA,EAAc,SAAS,CAAC,CAAA,CAAA;AAAA,OAC7C;AACA,MAAO,OAAA,OAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAa,MAAA,CAAA;AAAA,MAEX,aAAA;AAAA,MAEA,IAAA;AAAA,MAEA,IAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"carousel2.mjs","sources":["../../../../../../packages/components/carousel/src/carousel.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"root\"\n    :class=\"carouselClasses\"\n    @mouseenter.stop=\"handleMouseEnter\"\n    @mouseleave.stop=\"handleMouseLeave\"\n  >\n    <div :class=\"ns.e('container')\" :style=\"{ height: height }\">\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-left\">\n        <button\n          v-show=\"\n            (arrow === 'always' || hover) && (props.loop || activeIndex > 0)\n          \"\n          type=\"button\"\n          :class=\"[ns.e('arrow'), ns.em('arrow', 'left')]\"\n          @mouseenter=\"handleButtonEnter('left')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(activeIndex - 1)\"\n        >\n          <ElIcon>\n            <ArrowLeft />\n          </ElIcon>\n        </button>\n      </transition>\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-right\">\n        <button\n          v-show=\"\n            (arrow === 'always' || hover) &&\n            (props.loop || activeIndex < items.length - 1)\n          \"\n          type=\"button\"\n          :class=\"[ns.e('arrow'), ns.em('arrow', 'right')]\"\n          @mouseenter=\"handleButtonEnter('right')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(activeIndex + 1)\"\n        >\n          <ElIcon>\n            <ArrowRight />\n          </ElIcon>\n        </button>\n      </transition>\n      <slot />\n    </div>\n    <ul v-if=\"indicatorPosition !== 'none'\" :class=\"indicatorsClasses\">\n      <li\n        v-for=\"(item, index) in items\"\n        :key=\"index\"\n        :class=\"[\n          ns.e('indicator'),\n          ns.em('indicator', direction),\n          ns.is('active', index === activeIndex),\n        ]\"\n        @mouseenter=\"throttledIndicatorHover(index)\"\n        @click.stop=\"handleIndicatorClick(index)\"\n      >\n        <button :class=\"ns.e('button')\">\n          <span v-if=\"hasLabel\">{{ item.props.label }}</span>\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, unref } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { carouselEmits, carouselProps } from './carousel'\nimport { useCarousel } from './use-carousel'\n\nconst COMPONENT_NAME = 'ElCarousel'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = defineProps(carouselProps)\nconst emit = defineEmits(carouselEmits)\nconst {\n  root,\n  activeIndex,\n  arrowDisplay,\n  hasLabel,\n  hover,\n  isCardType,\n  items,\n  handleButtonEnter,\n  handleButtonLeave,\n  handleIndicatorClick,\n  handleMouseEnter,\n  handleMouseLeave,\n  setActiveItem,\n  prev,\n  next,\n  throttledArrowClick,\n  throttledIndicatorHover,\n} = useCarousel(props, emit, COMPONENT_NAME)\nconst ns = useNamespace('carousel')\n\nconst carouselClasses = computed(() => {\n  const classes = [ns.b(), ns.m(props.direction)]\n  if (unref(isCardType)) {\n    classes.push(ns.m('card'))\n  }\n  return classes\n})\n\nconst indicatorsClasses = computed(() => {\n  const classes = [ns.e('indicators'), ns.em('indicators', props.direction)]\n  if (unref(hasLabel)) {\n    classes.push(ns.em('indicators', 'labels'))\n  }\n  if (props.indicatorPosition === 'outside' || unref(isCardType)) {\n    classes.push(ns.em('indicators', 'outside'))\n  }\n  return classes\n})\n\ndefineExpose({\n  /** @description manually switch slide */\n  setActiveItem,\n  /** @description switch to the previous slide */\n  prev,\n  /** @description switch to the next slide */\n  next,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;mCAwEc,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR;;;;;;;AAIA,IAAM,MAAA;AAAA,MACJ,IAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,UAAA;AAAA,MACA,KAAA;AAAA,MACA,iBAAA;AAAA,MACA,iBAAA;AAAA,MACA,oBAAA;AAAA,MACA,gBAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,mBAAA;AAAA,MACA,uBAAA;AAAA,KACE,GAAA,WAAA,CAAY,KAAO,EAAA,IAAA,EAAM,cAAc,CAAA,CAAA;AAC3C,IAAM,MAAA,EAAA,GAAK,aAAa,UAAU,CAAA,CAAA;AAElC,IAAM,MAAA,eAAA,GAAkB,SAAS,MAAM;AACrC,MAAM,MAAA,OAAA,GAAU,CAAC,EAAG,CAAA,CAAA,IAAK,EAAG,CAAA,CAAA,CAAE,KAAM,CAAA,SAAS,CAAC,CAAA,CAAA;AAC9C,MAAI,IAAA,KAAA,CAAM,UAAU,CAAG,EAAA;AACrB,QAAA,OAAA,CAAQ,IAAK,CAAA,EAAA,CAAG,CAAE,CAAA,MAAM,CAAC,CAAA,CAAA;AAAA,OAC3B;AACA,MAAO,OAAA,OAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,iBAAA,GAAoB,SAAS,MAAM;AACvC,MAAM,MAAA,OAAA,GAAU,CAAC,EAAA,CAAG,CAAE,CAAA,YAAY,CAAG,EAAA,EAAA,CAAG,EAAG,CAAA,YAAA,EAAc,KAAM,CAAA,SAAS,CAAC,CAAA,CAAA;AACzE,MAAI,IAAA,KAAA,CAAM,QAAQ,CAAG,EAAA;AACnB,QAAA,OAAA,CAAQ,IAAK,CAAA,EAAA,CAAG,EAAG,CAAA,YAAA,EAAc,QAAQ,CAAC,CAAA,CAAA;AAAA,OAC5C;AACA,MAAA,IAAI,KAAM,CAAA,iBAAA,KAAsB,SAAa,IAAA,KAAA,CAAM,UAAU,CAAG,EAAA;AAC9D,QAAA,OAAA,CAAQ,IAAK,CAAA,EAAA,CAAG,EAAG,CAAA,YAAA,EAAc,SAAS,CAAC,CAAA,CAAA;AAAA,OAC7C;AACA,MAAO,OAAA,OAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAa,MAAA,CAAA;AAAA,MAEX,aAAA;AAAA,MAEA,IAAA;AAAA,MAEA,IAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/carousel/src/use-carousel.d.ts

@@ -2,6 +2,7 @@ import type { SetupContext } from 'vue';
 import type { CarouselItemContext } from 'element-plus/es/tokens';
 import type { CarouselEmits, CarouselProps } from './carousel';
 export declare const useCarousel: (props: CarouselProps, emit: SetupContext<CarouselEmits>['emit'], componentName: string) => {
+    root: import("vue").Ref<HTMLDivElement | undefined>;
     activeIndex: import("vue").Ref<number>;
     arrowDisplay: import("vue").ComputedRef<boolean>;
     hasLabel: import("vue").ComputedRef<boolean>;

package/es/components/carousel/src/use-carousel.mjs

@@ -187,6 +187,7 @@ const useCarousel = (props, emit, componentName) => {
     setActiveItem
   });
   return {
+    root,
     activeIndex,
     arrowDisplay,
     hasLabel,

package/es/components/carousel/src/use-carousel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-carousel.mjs","sources":["../../../../../../packages/components/carousel/src/use-carousel.ts"],"sourcesContent":["import {\n  computed,\n  getCurrentInstance,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  ref,\n  shallowRef,\n  unref,\n  watch,\n} from 'vue'\nimport { throttle } from 'lodash-unified'\nimport { useResizeObserver } from '@vueuse/core'\nimport { debugWarn, isString } from '@element-plus/utils'\nimport { carouselContextKey } from '@element-plus/tokens'\nimport { useOrderedChildren } from '@element-plus/hooks'\n\nimport type { SetupContext } from 'vue'\nimport type { CarouselItemContext } from '@element-plus/tokens'\nimport type { CarouselEmits, CarouselProps } from './carousel'\n\nconst THROTTLE_TIME = 300\n\nexport const useCarousel = (\n  props: CarouselProps,\n  emit: SetupContext<CarouselEmits>['emit'],\n  componentName: string\n) => {\n  const {\n    children: items,\n    addChild: addItem,\n    removeChild: removeItem,\n  } = useOrderedChildren<CarouselItemContext>(\n    getCurrentInstance()!,\n    'ElCarouselItem'\n  )\n\n  // refs\n  const activeIndex = ref(-1)\n  const timer = ref<ReturnType<typeof setInterval> | null>(null)\n  const hover = ref(false)\n  const root = ref<HTMLDivElement>()\n\n  // computed\n  const arrowDisplay = computed(\n    () => props.arrow !== 'never' && !unref(isVertical)\n  )\n\n  const hasLabel = computed(() => {\n    return items.value.some((item) => item.props.label.toString().length > 0)\n  })\n\n  const isCardType = computed(() => props.type === 'card')\n  const isVertical = computed(() => props.direction === 'vertical')\n\n  // methods\n  const throttledArrowClick = throttle(\n    (index: number) => {\n      setActiveItem(index)\n    },\n    THROTTLE_TIME,\n    { trailing: true }\n  )\n\n  const throttledIndicatorHover = throttle((index: number) => {\n    handleIndicatorHover(index)\n  }, THROTTLE_TIME)\n\n  function pauseTimer() {\n    if (timer.value) {\n      clearInterval(timer.value)\n      timer.value = null\n    }\n  }\n\n  function startTimer() {\n    if (props.interval <= 0 || !props.autoplay || timer.value) return\n    timer.value = setInterval(() => playSlides(), props.interval)\n  }\n\n  const playSlides = () => {\n    if (activeIndex.value < items.value.length - 1) {\n      activeIndex.value = activeIndex.value + 1\n    } else if (props.loop) {\n      activeIndex.value = 0\n    }\n  }\n\n  function setActiveItem(index: number | string) {\n    if (isString(index)) {\n      const filteredItems = items.value.filter(\n        (item) => item.props.name === index\n      )\n      if (filteredItems.length > 0) {\n        index = items.value.indexOf(filteredItems[0])\n      }\n    }\n    index = Number(index)\n    if (Number.isNaN(index) || index !== Math.floor(index)) {\n      debugWarn(componentName, 'index must be integer.')\n      return\n    }\n    const itemCount = items.value.length\n    const oldIndex = activeIndex.value\n    if (index < 0) {\n      activeIndex.value = props.loop ? itemCount - 1 : 0\n    } else if (index >= itemCount) {\n      activeIndex.value = props.loop ? 0 : itemCount - 1\n    } else {\n      activeIndex.value = index\n    }\n    if (oldIndex === activeIndex.value) {\n      resetItemPosition(oldIndex)\n    }\n    resetTimer()\n  }\n\n  function resetItemPosition(oldIndex?: number) {\n    items.value.forEach((item, index) => {\n      item.translateItem(index, activeIndex.value, oldIndex)\n    })\n  }\n\n  function itemInStage(item: CarouselItemContext, index: number) {\n    const _items = unref(items)\n    const itemCount = _items.length\n    if (itemCount === 0 || !item.states.inStage) return false\n    const nextItemIndex = index + 1\n    const prevItemIndex = index - 1\n    const lastItemIndex = itemCount - 1\n    const isLastItemActive = _items[lastItemIndex].states.active\n    const isFirstItemActive = _items[0].states.active\n    const isNextItemActive = _items[nextItemIndex]?.states?.active\n    const isPrevItemActive = _items[prevItemIndex]?.states?.active\n\n    if ((index === lastItemIndex && isFirstItemActive) || isNextItemActive) {\n      return 'left'\n    } else if ((index === 0 && isLastItemActive) || isPrevItemActive) {\n      return 'right'\n    }\n    return false\n  }\n\n  function handleMouseEnter() {\n    hover.value = true\n    if (props.pauseOnHover) {\n      pauseTimer()\n    }\n  }\n\n  function handleMouseLeave() {\n    hover.value = false\n    startTimer()\n  }\n\n  function handleButtonEnter(arrow: 'left' | 'right') {\n    if (unref(isVertical)) return\n    items.value.forEach((item, index) => {\n      if (arrow === itemInStage(item, index)) {\n        item.states.hover = true\n      }\n    })\n  }\n\n  function handleButtonLeave() {\n    if (unref(isVertical)) return\n    items.value.forEach((item) => {\n      item.states.hover = false\n    })\n  }\n\n  function handleIndicatorClick(index: number) {\n    activeIndex.value = index\n  }\n\n  function handleIndicatorHover(index: number) {\n    if (props.trigger === 'hover' && index !== activeIndex.value) {\n      activeIndex.value = index\n    }\n  }\n\n  function prev() {\n    setActiveItem(activeIndex.value - 1)\n  }\n\n  function next() {\n    setActiveItem(activeIndex.value + 1)\n  }\n\n  function resetTimer() {\n    pauseTimer()\n    startTimer()\n  }\n\n  // watch\n  watch(\n    () => activeIndex.value,\n    (current, prev) => {\n      resetItemPosition(prev)\n      if (prev > -1) {\n        emit('change', current, prev)\n      }\n    }\n  )\n  watch(\n    () => props.autoplay,\n    (autoplay) => {\n      autoplay ? startTimer() : pauseTimer()\n    }\n  )\n  watch(\n    () => props.loop,\n    () => {\n      setActiveItem(activeIndex.value)\n    }\n  )\n\n  watch(\n    () => props.interval,\n    () => {\n      resetTimer()\n    }\n  )\n\n  watch(\n    () => items.value,\n    () => {\n      if (items.value.length > 0) setActiveItem(props.initialIndex)\n    }\n  )\n\n  const resizeObserver = shallowRef<ReturnType<typeof useResizeObserver>>()\n  // lifecycle\n  onMounted(() => {\n    resizeObserver.value = useResizeObserver(root.value, () => {\n      resetItemPosition()\n    })\n    startTimer()\n  })\n\n  onBeforeUnmount(() => {\n    pauseTimer()\n    if (root.value && resizeObserver.value) resizeObserver.value.stop()\n  })\n\n  // provide\n  provide(carouselContextKey, {\n    root,\n    isCardType,\n    isVertical,\n    items,\n    loop: props.loop,\n    addItem,\n    removeItem,\n    setActiveItem,\n  })\n\n  return {\n    activeIndex,\n    arrowDisplay,\n    hasLabel,\n    hover,\n    isCardType,\n    items,\n    handleButtonEnter,\n    handleButtonLeave,\n    handleIndicatorClick,\n    handleMouseEnter,\n    handleMouseLeave,\n    setActiveItem,\n    prev,\n    next,\n    throttledArrowClick,\n    throttledIndicatorHover,\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"use-carousel.mjs","sources":["../../../../../../packages/components/carousel/src/use-carousel.ts"],"sourcesContent":["import {\n  computed,\n  getCurrentInstance,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  ref,\n  shallowRef,\n  unref,\n  watch,\n} from 'vue'\nimport { throttle } from 'lodash-unified'\nimport { useResizeObserver } from '@vueuse/core'\nimport { debugWarn, isString } from '@element-plus/utils'\nimport { carouselContextKey } from '@element-plus/tokens'\nimport { useOrderedChildren } from '@element-plus/hooks'\n\nimport type { SetupContext } from 'vue'\nimport type { CarouselItemContext } from '@element-plus/tokens'\nimport type { CarouselEmits, CarouselProps } from './carousel'\n\nconst THROTTLE_TIME = 300\n\nexport const useCarousel = (\n  props: CarouselProps,\n  emit: SetupContext<CarouselEmits>['emit'],\n  componentName: string\n) => {\n  const {\n    children: items,\n    addChild: addItem,\n    removeChild: removeItem,\n  } = useOrderedChildren<CarouselItemContext>(\n    getCurrentInstance()!,\n    'ElCarouselItem'\n  )\n\n  // refs\n  const activeIndex = ref(-1)\n  const timer = ref<ReturnType<typeof setInterval> | null>(null)\n  const hover = ref(false)\n  const root = ref<HTMLDivElement>()\n\n  // computed\n  const arrowDisplay = computed(\n    () => props.arrow !== 'never' && !unref(isVertical)\n  )\n\n  const hasLabel = computed(() => {\n    return items.value.some((item) => item.props.label.toString().length > 0)\n  })\n\n  const isCardType = computed(() => props.type === 'card')\n  const isVertical = computed(() => props.direction === 'vertical')\n\n  // methods\n  const throttledArrowClick = throttle(\n    (index: number) => {\n      setActiveItem(index)\n    },\n    THROTTLE_TIME,\n    { trailing: true }\n  )\n\n  const throttledIndicatorHover = throttle((index: number) => {\n    handleIndicatorHover(index)\n  }, THROTTLE_TIME)\n\n  function pauseTimer() {\n    if (timer.value) {\n      clearInterval(timer.value)\n      timer.value = null\n    }\n  }\n\n  function startTimer() {\n    if (props.interval <= 0 || !props.autoplay || timer.value) return\n    timer.value = setInterval(() => playSlides(), props.interval)\n  }\n\n  const playSlides = () => {\n    if (activeIndex.value < items.value.length - 1) {\n      activeIndex.value = activeIndex.value + 1\n    } else if (props.loop) {\n      activeIndex.value = 0\n    }\n  }\n\n  function setActiveItem(index: number | string) {\n    if (isString(index)) {\n      const filteredItems = items.value.filter(\n        (item) => item.props.name === index\n      )\n      if (filteredItems.length > 0) {\n        index = items.value.indexOf(filteredItems[0])\n      }\n    }\n    index = Number(index)\n    if (Number.isNaN(index) || index !== Math.floor(index)) {\n      debugWarn(componentName, 'index must be integer.')\n      return\n    }\n    const itemCount = items.value.length\n    const oldIndex = activeIndex.value\n    if (index < 0) {\n      activeIndex.value = props.loop ? itemCount - 1 : 0\n    } else if (index >= itemCount) {\n      activeIndex.value = props.loop ? 0 : itemCount - 1\n    } else {\n      activeIndex.value = index\n    }\n    if (oldIndex === activeIndex.value) {\n      resetItemPosition(oldIndex)\n    }\n    resetTimer()\n  }\n\n  function resetItemPosition(oldIndex?: number) {\n    items.value.forEach((item, index) => {\n      item.translateItem(index, activeIndex.value, oldIndex)\n    })\n  }\n\n  function itemInStage(item: CarouselItemContext, index: number) {\n    const _items = unref(items)\n    const itemCount = _items.length\n    if (itemCount === 0 || !item.states.inStage) return false\n    const nextItemIndex = index + 1\n    const prevItemIndex = index - 1\n    const lastItemIndex = itemCount - 1\n    const isLastItemActive = _items[lastItemIndex].states.active\n    const isFirstItemActive = _items[0].states.active\n    const isNextItemActive = _items[nextItemIndex]?.states?.active\n    const isPrevItemActive = _items[prevItemIndex]?.states?.active\n\n    if ((index === lastItemIndex && isFirstItemActive) || isNextItemActive) {\n      return 'left'\n    } else if ((index === 0 && isLastItemActive) || isPrevItemActive) {\n      return 'right'\n    }\n    return false\n  }\n\n  function handleMouseEnter() {\n    hover.value = true\n    if (props.pauseOnHover) {\n      pauseTimer()\n    }\n  }\n\n  function handleMouseLeave() {\n    hover.value = false\n    startTimer()\n  }\n\n  function handleButtonEnter(arrow: 'left' | 'right') {\n    if (unref(isVertical)) return\n    items.value.forEach((item, index) => {\n      if (arrow === itemInStage(item, index)) {\n        item.states.hover = true\n      }\n    })\n  }\n\n  function handleButtonLeave() {\n    if (unref(isVertical)) return\n    items.value.forEach((item) => {\n      item.states.hover = false\n    })\n  }\n\n  function handleIndicatorClick(index: number) {\n    activeIndex.value = index\n  }\n\n  function handleIndicatorHover(index: number) {\n    if (props.trigger === 'hover' && index !== activeIndex.value) {\n      activeIndex.value = index\n    }\n  }\n\n  function prev() {\n    setActiveItem(activeIndex.value - 1)\n  }\n\n  function next() {\n    setActiveItem(activeIndex.value + 1)\n  }\n\n  function resetTimer() {\n    pauseTimer()\n    startTimer()\n  }\n\n  // watch\n  watch(\n    () => activeIndex.value,\n    (current, prev) => {\n      resetItemPosition(prev)\n      if (prev > -1) {\n        emit('change', current, prev)\n      }\n    }\n  )\n  watch(\n    () => props.autoplay,\n    (autoplay) => {\n      autoplay ? startTimer() : pauseTimer()\n    }\n  )\n  watch(\n    () => props.loop,\n    () => {\n      setActiveItem(activeIndex.value)\n    }\n  )\n\n  watch(\n    () => props.interval,\n    () => {\n      resetTimer()\n    }\n  )\n\n  watch(\n    () => items.value,\n    () => {\n      if (items.value.length > 0) setActiveItem(props.initialIndex)\n    }\n  )\n\n  const resizeObserver = shallowRef<ReturnType<typeof useResizeObserver>>()\n  // lifecycle\n  onMounted(() => {\n    resizeObserver.value = useResizeObserver(root.value, () => {\n      resetItemPosition()\n    })\n    startTimer()\n  })\n\n  onBeforeUnmount(() => {\n    pauseTimer()\n    if (root.value && resizeObserver.value) resizeObserver.value.stop()\n  })\n\n  // provide\n  provide(carouselContextKey, {\n    root,\n    isCardType,\n    isVertical,\n    items,\n    loop: props.loop,\n    addItem,\n    removeItem,\n    setActiveItem,\n  })\n\n  return {\n    root,\n    activeIndex,\n    arrowDisplay,\n    hasLabel,\n    hover,\n    isCardType,\n    items,\n    handleButtonEnter,\n    handleButtonLeave,\n    handleIndicatorClick,\n    handleMouseEnter,\n    handleMouseLeave,\n    setActiveItem,\n    prev,\n    next,\n    throttledArrowClick,\n    throttledIndicatorHover,\n  }\n}\n"],"names":[],"mappings":"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"}

package/es/components/index.mjs

@@ -73,7 +73,7 @@ export { ElMessageBox } from './message-box/index.mjs';
 export { ElNotification } from './notification/index.mjs';
 export { ElPopover, ElPopoverDirective } from './popover/index.mjs';
 export { affixEmits, affixProps } from './affix/src/affix.mjs';
-export { alertEffects, alertEmits, alertProps } from './alert/src/alert2.mjs';
+export { alertEffects, alertEmits, alertProps } from './alert/src/alert.mjs';
 export { autocompleteEmits, autocompleteProps } from './autocomplete/src/autocomplete.mjs';
 export { avatarEmits, avatarProps } from './avatar/src/avatar.mjs';
 export { backtopEmits, backtopProps } from './backtop/src/backtop.mjs';
@@ -153,7 +153,7 @@ export { autoResizerProps } from './table-v2/src/auto-resizer.mjs';
 export { tableV2Props } from './table-v2/src/table.mjs';
 export { tableV2RowProps } from './table-v2/src/row.mjs';
 export { tabsEmits, tabsProps } from './tabs/src/tabs.mjs';
-export { tabBarProps } from './tabs/src/tab-bar2.mjs';
+export { tabBarProps } from './tabs/src/tab-bar.mjs';
 export { tabNavEmits, tabNavProps } from './tabs/src/tab-nav.mjs';
 export { tabPaneProps } from './tabs/src/tab-pane.mjs';
 export { tagEmits, tagProps } from './tag/src/tag.mjs';

package/es/components/tabs/index.mjs

@@ -2,7 +2,7 @@ import '../../utils/index.mjs';
 import Tabs from './src/tabs.mjs';
 export { tabsEmits, tabsProps } from './src/tabs.mjs';
 import TabPane from './src/tab-pane2.mjs';
-export { tabBarProps } from './src/tab-bar2.mjs';
+export { tabBarProps } from './src/tab-bar.mjs';
 export { tabNavEmits, tabNavProps } from './src/tab-nav.mjs';
 export { tabPaneProps } from './src/tab-pane.mjs';
 import { withInstall, withNoopInstall } from '../../utils/vue/install.mjs';

package/es/components/tabs/src/tab-bar.mjs

@@ -1,87 +1,13 @@
-import { defineComponent, getCurrentInstance, inject, ref, watch, nextTick, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle } from 'vue';
-import { useResizeObserver } from '@vueuse/core';
 import '../../../utils/index.mjs';
-import '../../../tokens/index.mjs';
-import '../../../hooks/index.mjs';
-import { tabBarProps } from './tab-bar2.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { tabsRootContextKey } from '../../../tokens/tabs.mjs';
-import { throwError } from '../../../utils/error.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
-import { capitalize } from '../../../utils/strings.mjs';
+import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
+import { mutable } from '../../../utils/typescript.mjs';
 
-const COMPONENT_NAME = "ElTabBar";
-const __default__ = defineComponent({
-  name: COMPONENT_NAME
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: tabBarProps,
-  setup(__props, { expose }) {
-    const props = __props;
-    const instance = getCurrentInstance();
-    const rootTabs = inject(tabsRootContextKey);
-    if (!rootTabs)
-      throwError(COMPONENT_NAME, "<el-tabs><el-tab-bar /></el-tabs>");
-    const ns = useNamespace("tabs");
-    const barRef = ref();
-    const barStyle = ref();
-    const getBarStyle = () => {
-      let offset = 0;
-      let tabSize = 0;
-      const sizeName = ["top", "bottom"].includes(rootTabs.props.tabPosition) ? "width" : "height";
-      const sizeDir = sizeName === "width" ? "x" : "y";
-      props.tabs.every((tab) => {
-        var _a, _b, _c, _d;
-        const $el = (_b = (_a = instance.parent) == null ? void 0 : _a.refs) == null ? void 0 : _b[`tab-${tab.uid}`];
-        if (!$el)
-          return false;
-        if (!tab.active) {
-          return true;
-        }
-        tabSize = $el[`client${capitalize(sizeName)}`];
-        const position = sizeDir === "x" ? "left" : "top";
-        offset = $el[`offset${capitalize(position)}`] - ((_d = (_c = $el.parentElement) == null ? void 0 : _c[`offset${capitalize(position)}`]) != null ? _d : 0);
-        const scrollwrapEl = $el.closest(".is-scrollable");
-        if (scrollwrapEl) {
-          const scrollWrapStyle = window.getComputedStyle(scrollwrapEl);
-          offset += Number.parseFloat(scrollWrapStyle[`padding${capitalize(position)}`]);
-        }
-        const tabStyles = window.getComputedStyle($el);
-        if (sizeName === "width") {
-          if (props.tabs.length > 1) {
-            tabSize -= Number.parseFloat(tabStyles.paddingLeft) + Number.parseFloat(tabStyles.paddingRight);
-          }
-          offset += Number.parseFloat(tabStyles.paddingLeft);
-        }
-        return false;
-      });
-      return {
-        [sizeName]: `${tabSize}px`,
-        transform: `translate${capitalize(sizeDir)}(${offset}px)`
-      };
-    };
-    const update = () => barStyle.value = getBarStyle();
-    watch(() => props.tabs, async () => {
-      await nextTick();
-      update();
-    }, { immediate: true });
-    useResizeObserver(barRef, () => update());
-    expose({
-      ref: barRef,
-      update
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        ref_key: "barRef",
-        ref: barRef,
-        class: normalizeClass([unref(ns).e("active-bar"), unref(ns).is(unref(rootTabs).props.tabPosition)]),
-        style: normalizeStyle(barStyle.value)
-      }, null, 6);
-    };
+const tabBarProps = buildProps({
+  tabs: {
+    type: definePropType(Array),
+    default: () => mutable([])
   }
 });
-var TabBar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/tabs/src/tab-bar.vue"]]);
 
-export { TabBar as default };
+export { tabBarProps };
 //# sourceMappingURL=tab-bar.mjs.map