@element-plus/nightly 0.0.20220314 → 0.0.20220317

package/lib/components/carousel/src/carousel-item2.js

@@ -0,0 +1,163 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+require('../../../utils/index.js');
+require('../../../hooks/index.js');
+require('../../../tokens/index.js');
+var carouselItem = require('./carousel-item.js');
+var index = require('../../../hooks/use-namespace/index.js');
+var carousel = require('../../../tokens/carousel.js');
+var error = require('../../../utils/error.js');
+var types = require('../../../utils/types.js');
+
+const __default__ = {
+  name: "ElCarouselItem"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: carouselItem.carouselItemProps,
+  setup(__props) {
+    const props = __props;
+    const ns = index.useNamespace("carousel");
+    const COMPONENT_NAME = "ElCarouselItem";
+    const carouselContext = vue.inject(carousel.carouselContextKey);
+    const instance = vue.getCurrentInstance();
+    if (!carouselContext) {
+      error.debugWarn(COMPONENT_NAME, "usage: <el-carousel></el-carousel-item></el-carousel>");
+    }
+    if (!instance) {
+      error.debugWarn(COMPONENT_NAME, "compositional hook can only be invoked inside setups");
+    }
+    const CARD_SCALE = 0.83;
+    const hover = vue.ref(false);
+    const translate = vue.ref(0);
+    const scale = vue.ref(1);
+    const active = vue.ref(false);
+    const ready = vue.ref(false);
+    const inStage = vue.ref(false);
+    const animating = vue.ref(false);
+    const { isCardType, isVertical } = carouselContext;
+    const itemStyle = vue.computed(() => {
+      const translateType = `translate${vue.unref(isVertical) ? "Y" : "X"}`;
+      const _translate = `${translateType}(${vue.unref(translate)}px)`;
+      const _scale = `scale(${vue.unref(scale)})`;
+      const transform = [_translate, _scale].join(" ");
+      return {
+        transform
+      };
+    });
+    function processIndex(index, activeIndex, length) {
+      const lastItemIndex = length - 1;
+      const prevItemIndex = activeIndex - 1;
+      const nextItemIndex = activeIndex + 1;
+      const halfItemIndex = length / 2;
+      if (activeIndex === 0 && index === lastItemIndex) {
+        return -1;
+      } else if (activeIndex === lastItemIndex && index === 0) {
+        return length;
+      } else if (index < prevItemIndex && activeIndex - index >= halfItemIndex) {
+        return length + 1;
+      } else if (index > nextItemIndex && index - activeIndex >= halfItemIndex) {
+        return -2;
+      }
+      return index;
+    }
+    function calcCardTranslate(index, activeIndex) {
+      var _a;
+      const parentWidth = ((_a = carouselContext.root.value) == null ? void 0 : _a.offsetWidth) || 0;
+      if (inStage.value) {
+        return parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1) / 4;
+      } else if (index < activeIndex) {
+        return -(1 + CARD_SCALE) * parentWidth / 4;
+      } else {
+        return (3 + CARD_SCALE) * parentWidth / 4;
+      }
+    }
+    function calcTranslate(index, activeIndex, isVertical2) {
+      const rootEl = carouselContext.root.value;
+      if (!rootEl)
+        return 0;
+      const distance = (isVertical2 ? rootEl.offsetHeight : rootEl.offsetWidth) || 0;
+      return distance * (index - activeIndex);
+    }
+    const translateItem = (index, activeIndex, oldIndex) => {
+      var _a;
+      const _isCardType = vue.unref(isCardType);
+      const carouselItemLength = (_a = carouselContext.items.value.length) != null ? _a : Number.NaN;
+      const isActive = index === activeIndex;
+      if (!_isCardType && !types.isUndefined(oldIndex)) {
+        animating.value = isActive || index === oldIndex;
+      }
+      if (!isActive && carouselItemLength > 2 && carouselContext.loop) {
+        index = processIndex(index, activeIndex, carouselItemLength);
+      }
+      const _isVertical = vue.unref(isVertical);
+      active.value = isActive;
+      if (_isCardType) {
+        if (_isVertical) {
+          error.debugWarn("Carousel", "vertical direction is not supported for card mode");
+        }
+        inStage.value = Math.round(Math.abs(index - activeIndex)) <= 1;
+        translate.value = calcCardTranslate(index, activeIndex);
+        scale.value = vue.unref(active) ? 1 : CARD_SCALE;
+      } else {
+        translate.value = calcTranslate(index, activeIndex, _isVertical);
+      }
+      ready.value = true;
+    };
+    function handleItemClick() {
+      if (carouselContext && vue.unref(isCardType)) {
+        const index = carouselContext.items.value.findIndex(({ uid }) => uid === instance.uid);
+        carouselContext.setActiveItem(index);
+      }
+    }
+    vue.onMounted(() => {
+      carouselContext.addItem({
+        props,
+        states: vue.reactive({
+          hover,
+          translate,
+          scale,
+          active,
+          ready,
+          inStage,
+          animating
+        }),
+        uid: instance.uid,
+        translateItem
+      });
+    });
+    vue.onUnmounted(() => {
+      carouselContext.removeItem(instance.uid);
+    });
+    return (_ctx, _cache) => {
+      return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass([
+          vue.unref(ns).e("item"),
+          vue.unref(ns).is("active", active.value),
+          vue.unref(ns).is("in-stage", inStage.value),
+          vue.unref(ns).is("hover", hover.value),
+          vue.unref(ns).is("animating", animating.value),
+          { [vue.unref(ns).em("item", "card")]: vue.unref(isCardType) }
+        ]),
+        style: vue.normalizeStyle(vue.unref(itemStyle)),
+        onClick: handleItemClick
+      }, [
+        vue.unref(isCardType) ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+          key: 0,
+          class: vue.normalizeClass(vue.unref(ns).e("mask"))
+        }, null, 2)), [
+          [vue.vShow, !active.value]
+        ]) : vue.createCommentVNode("v-if", true),
+        vue.renderSlot(_ctx.$slots, "default")
+      ], 6)), [
+        [vue.vShow, ready.value]
+      ]);
+    };
+  }
+});
+
+exports["default"] = _sfc_main;
+//# sourceMappingURL=carousel-item2.js.map

package/lib/components/carousel/src/carousel-item2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel-item2.js","sources":["../../../../../../packages/components/carousel/src/carousel-item.vue"],"sourcesContent":["<template>\n  <div\n    v-show=\"ready\"\n    :class=\"[\n      ns.e('item'),\n      ns.is('active', active),\n      ns.is('in-stage', inStage),\n      ns.is('hover', hover),\n      ns.is('animating', animating),\n      { [ns.em('item', 'card')]: isCardType },\n    ]\"\n    :style=\"itemStyle\"\n    @click=\"handleItemClick\"\n  >\n    <div v-if=\"isCardType\" v-show=\"!active\" :class=\"ns.e('mask')\" />\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  onMounted,\n  inject,\n  computed,\n  getCurrentInstance,\n  onUnmounted,\n  ref,\n  reactive,\n  unref,\n} from 'vue'\nimport { debugWarn, isUndefined } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { carouselContextKey } from '@element-plus/tokens'\nimport { carouselItemProps } from './carousel-item'\n\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElCarouselItem',\n})\n\nconst props = defineProps(carouselItemProps)\nconst ns = useNamespace('carousel')\nconst COMPONENT_NAME = 'ElCarouselItem'\n// inject\nconst carouselContext = inject(carouselContextKey)!\n// instance\nconst instance = getCurrentInstance()!\nif (!carouselContext) {\n  debugWarn(\n    COMPONENT_NAME,\n    'usage: <el-carousel></el-carousel-item></el-carousel>'\n  )\n}\n\nif (!instance) {\n  debugWarn(\n    COMPONENT_NAME,\n    'compositional hook can only be invoked inside setups'\n  )\n}\n\nconst CARD_SCALE = 0.83\n\nconst hover = ref(false)\nconst translate = ref(0)\nconst scale = ref(1)\nconst active = ref(false)\nconst ready = ref(false)\nconst inStage = ref(false)\nconst animating = ref(false)\n\n// computed\nconst { isCardType, isVertical } = carouselContext\n\nconst itemStyle = computed<CSSProperties>(() => {\n  const translateType = `translate${unref(isVertical) ? 'Y' : 'X'}`\n  const _translate = `${translateType}(${unref(translate)}px)`\n  const _scale = `scale(${unref(scale)})`\n  const transform = [_translate, _scale].join(' ')\n\n  return {\n    transform,\n  }\n})\n\n// methods\n\nfunction processIndex(index: number, activeIndex: number, length: number) {\n  const lastItemIndex = length - 1\n  const prevItemIndex = activeIndex - 1\n  const nextItemIndex = activeIndex + 1\n  const halfItemIndex = length / 2\n\n  if (activeIndex === 0 && index === lastItemIndex) {\n    return -1\n  } else if (activeIndex === lastItemIndex && index === 0) {\n    return length\n  } else if (index < prevItemIndex && activeIndex - index >= halfItemIndex) {\n    return length + 1\n  } else if (index > nextItemIndex && index - activeIndex >= halfItemIndex) {\n    return -2\n  }\n  return index\n}\n\nfunction calcCardTranslate(index: number, activeIndex: number) {\n  const parentWidth = carouselContext.root.value?.offsetWidth || 0\n  if (inStage.value) {\n    return (parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1)) / 4\n  } else if (index < activeIndex) {\n    return (-(1 + CARD_SCALE) * parentWidth) / 4\n  } else {\n    return ((3 + CARD_SCALE) * parentWidth) / 4\n  }\n}\n\nfunction calcTranslate(\n  index: number,\n  activeIndex: number,\n  isVertical: boolean\n) {\n  const rootEl = carouselContext.root.value\n  if (!rootEl) return 0\n\n  const distance = (isVertical ? rootEl.offsetHeight : rootEl.offsetWidth) || 0\n  return distance * (index - activeIndex)\n}\n\nconst translateItem = (\n  index: number,\n  activeIndex: number,\n  oldIndex?: number\n) => {\n  const _isCardType = unref(isCardType)\n  const carouselItemLength = carouselContext.items.value.length ?? Number.NaN\n\n  const isActive = index === activeIndex\n  if (!_isCardType && !isUndefined(oldIndex)) {\n    animating.value = isActive || index === oldIndex\n  }\n\n  if (!isActive && carouselItemLength > 2 && carouselContext.loop) {\n    index = processIndex(index, activeIndex, carouselItemLength)\n  }\n\n  const _isVertical = unref(isVertical)\n  active.value = isActive\n\n  if (_isCardType) {\n    if (_isVertical) {\n      debugWarn('Carousel', 'vertical direction is not supported for card mode')\n    }\n    inStage.value = Math.round(Math.abs(index - activeIndex)) <= 1\n    translate.value = calcCardTranslate(index, activeIndex)\n    scale.value = unref(active) ? 1 : CARD_SCALE\n  } else {\n    translate.value = calcTranslate(index, activeIndex, _isVertical)\n  }\n\n  ready.value = true\n}\n\nfunction handleItemClick() {\n  if (carouselContext && unref(isCardType)) {\n    const index = carouselContext.items.value.findIndex(\n      ({ uid }) => uid === instance.uid\n    )\n    carouselContext.setActiveItem(index)\n  }\n}\n\n// lifecycle\nonMounted(() => {\n  carouselContext.addItem({\n    props,\n    states: reactive({\n      hover,\n      translate,\n      scale,\n      active,\n      ready,\n      inStage,\n      animating,\n    }),\n    uid: instance.uid,\n    translateItem,\n  })\n})\n\nonUnmounted(() => {\n  carouselContext.removeItem(instance.uid)\n})\n</script>\n"],"names":["useNamespace","inject","carouselContextKey","getCurrentInstance","debugWarn","ref","computed","unref","isUndefined","onMounted","reactive","onUnmounted"],"mappings":"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"}

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

@@ -1,44 +1,22 @@
-import type { Ref, ToRefs, UnwrapRef } from 'vue';
-export interface ICarouselItemProps {
-    name: string;
-    label: string | number;
-    key: string;
-}
-export interface ICarouselItemData {
-    hover: boolean;
-    translate: number;
-    scale: number;
-    active: boolean;
-    ready: boolean;
-    inStage: boolean;
-    animating: boolean;
-}
-export interface ICarouselProps {
-    initialIndex: number;
-    height: string;
-    trigger: string;
-    autoplay: boolean;
-    interval: number;
-    indicatorPosition: string;
-    indicator: boolean;
-    arrow: string;
-    type: string;
-    loop: boolean;
-    direction: string;
-    pauseOnHover: boolean;
-}
-export declare type UnionCarouselItemData = ICarouselItemProps & ToRefs<ICarouselItemData>;
-export interface CarouselItem extends UnionCarouselItemData {
-    uid: number;
-    translateItem: (index: number, activeIndex: number, oldIndex: number) => void;
-}
-export interface InjectCarouselScope {
-    root: Ref<HTMLElement>;
-    direction: string;
-    type: string;
-    items: Ref<UnwrapRef<CarouselItem[]>>;
-    loop: boolean;
-    addItem: (item: CarouselItem) => void;
-    removeItem: (uid: number) => void;
-    setActiveItem: (index: number) => void;
-}
+import type { ExtractPropTypes } from 'vue';
+import type Carousel from './carousel.vue';
+export declare const carouselProps: {
+    readonly initialIndex: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+    readonly height: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly trigger: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+    readonly autoplay: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly interval: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
+    readonly indicatorPosition: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly indicator: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly arrow: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+    readonly type: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly loop: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly direction: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "horizontal", unknown, unknown, unknown>;
+    readonly pauseOnHover: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+};
+export declare const carouselEmits: {
+    change: (current: number, prev: number) => boolean;
+};
+export declare type CarouselProps = ExtractPropTypes<typeof carouselProps>;
+export declare type CarouselEmits = typeof carouselEmits;
+export declare type CarouselInstance = InstanceType<typeof Carousel>;

package/lib/components/carousel/src/carousel.js

@@ -1,3 +1,59 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('../../../utils/index.js');
+var props = require('../../../utils/vue/props.js');
+var core = require('@vueuse/core');
+
+const carouselProps = props.buildProps({
+  initialIndex: {
+    type: Number,
+    default: 0
+  },
+  height: { type: String, default: "" },
+  trigger: {
+    type: String,
+    default: "hover"
+  },
+  autoplay: {
+    type: Boolean,
+    default: true
+  },
+  interval: {
+    type: Number,
+    default: 3e3
+  },
+  indicatorPosition: { type: String, default: "" },
+  indicator: {
+    type: Boolean,
+    default: true
+  },
+  arrow: {
+    type: String,
+    default: "hover"
+  },
+  type: { type: String, default: "" },
+  loop: {
+    type: Boolean,
+    default: true
+  },
+  direction: {
+    type: String,
+    default: "horizontal",
+    validator(val) {
+      return ["horizontal", "vertical"].includes(val);
+    }
+  },
+  pauseOnHover: {
+    type: Boolean,
+    default: true
+  }
+});
+const carouselEmits = {
+  change: (current, prev) => [current, prev].every(core.isNumber)
+};
+
+exports.carouselEmits = carouselEmits;
+exports.carouselProps = carouselProps;
 //# sourceMappingURL=carousel.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"carousel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
+{"version":3,"file":"carousel.js","sources":["../../../../../../packages/components/carousel/src/carousel.ts"],"sourcesContent":["import { buildProps, isNumber } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type Carousel from './carousel.vue'\n\nexport const carouselProps = buildProps({\n  initialIndex: {\n    type: Number,\n    default: 0,\n  },\n  height: { type: String, default: '' },\n  trigger: {\n    type: String,\n    default: 'hover',\n  },\n  autoplay: {\n    type: Boolean,\n    default: true,\n  },\n  interval: {\n    type: Number,\n    default: 3000,\n  },\n  indicatorPosition: { type: String, default: '' },\n  indicator: {\n    type: Boolean,\n    default: true,\n  },\n  arrow: {\n    type: String,\n    default: 'hover',\n  },\n  type: { type: String, default: '' },\n  loop: {\n    type: Boolean,\n    default: true,\n  },\n  direction: {\n    type: String,\n    default: 'horizontal',\n    validator(val: string) {\n      return ['horizontal', 'vertical'].includes(val)\n    },\n  },\n  pauseOnHover: {\n    type: Boolean,\n    default: true,\n  },\n} as const)\n\nexport const carouselEmits = {\n  change: (current: number, prev: number) => [current, prev].every(isNumber),\n}\n\nexport type CarouselProps = ExtractPropTypes<typeof carouselProps>\nexport type CarouselEmits = typeof carouselEmits\n\nexport type CarouselInstance = InstanceType<typeof Carousel>\n"],"names":["buildProps","isNumber"],"mappings":";;;;;;;;AACY,MAAC,aAAa,GAAGA,gBAAU,CAAC;AACxC,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE;AACvC,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,iBAAiB,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE;AAClD,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE;AACrC,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,YAAY;AACzB,IAAI,SAAS,CAAC,GAAG,EAAE;AACnB,MAAM,OAAO,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;AACtD,KAAK;AACL,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,aAAa,GAAG;AAC7B,EAAE,MAAM,EAAE,CAAC,OAAO,EAAE,IAAI,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,KAAK,CAACC,aAAQ,CAAC;AAC5D;;;;;"}

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

@@ -0,0 +1,170 @@
+/// <reference types="node" />
+import type { CarouselItemContext } from 'element-plus/es/tokens';
+declare const _default: import("vue").DefineComponent<{
+    readonly initialIndex: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+    readonly height: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly trigger: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+    readonly autoplay: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly interval: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
+    readonly indicatorPosition: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly indicator: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly arrow: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+    readonly type: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly loop: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly direction: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "horizontal", unknown, unknown, unknown>;
+    readonly pauseOnHover: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+}, {
+    props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+        readonly initialIndex: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+        readonly height: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly trigger: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+        readonly autoplay: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+        readonly interval: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
+        readonly indicatorPosition: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly indicator: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+        readonly arrow: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+        readonly type: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+        readonly loop: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+        readonly direction: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "horizontal", unknown, unknown, unknown>;
+        readonly pauseOnHover: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    }>> & {
+        onChange?: ((current: number, prev: number) => any) | undefined;
+    }>>;
+    emit: (event: "change", current: number, prev: number) => void;
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: {
+            (name: string, state: boolean | undefined): string;
+            (name: string): string;
+        };
+    };
+    COMPONENT_NAME: string;
+    THROTTLE_TIME: number;
+    activeIndex: import("vue").Ref<number>;
+    timer: import("vue").Ref<{
+        hasRef: () => boolean;
+        refresh: () => NodeJS.Timer;
+        [Symbol.toPrimitive]: () => number;
+        ref: () => NodeJS.Timer;
+        unref: () => NodeJS.Timer;
+    } | null>;
+    hover: import("vue").Ref<boolean>;
+    root: import("vue").Ref<HTMLDivElement | undefined>;
+    items: import("vue").Ref<{
+        props: {
+            readonly name: string;
+            readonly label: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+        };
+        states: {
+            hover: boolean;
+            translate: number;
+            scale: number;
+            active: boolean;
+            ready: boolean;
+            inStage: boolean;
+            animating: boolean;
+        };
+        uid: number | undefined;
+        translateItem: (index: number, activeIndex: number, oldIndex?: number | undefined) => void;
+    }[]>;
+    arrowDisplay: import("vue").ComputedRef<boolean>;
+    hasLabel: import("vue").ComputedRef<boolean>;
+    carouselClasses: import("vue").ComputedRef<string[]>;
+    indicatorsClasses: import("vue").ComputedRef<string[]>;
+    isCardType: import("vue").ComputedRef<boolean>;
+    isVertical: import("vue").ComputedRef<boolean>;
+    throttledArrowClick: import("lodash").DebouncedFunc<(index: number) => void>;
+    throttledIndicatorHover: import("lodash").DebouncedFunc<(index: number) => void>;
+    pauseTimer: () => void;
+    startTimer: () => void;
+    playSlides: () => void;
+    setActiveItem: (index: number | string) => void;
+    resetItemPosition: (oldIndex?: number | undefined) => void;
+    addItem: (item: CarouselItemContext) => void;
+    removeItem: (uid?: number | undefined) => void;
+    itemInStage: (item: CarouselItemContext, index: number) => false | "right" | "left";
+    handleMouseEnter: () => void;
+    handleMouseLeave: () => void;
+    handleButtonEnter: (arrow: 'left' | 'right') => void;
+    handleButtonLeave: () => void;
+    handleIndicatorClick: (index: number) => void;
+    handleIndicatorHover: (index: number) => void;
+    prev: () => void;
+    next: () => void;
+    resizeObserver: import("vue").ShallowRef<{
+        isSupported: boolean | undefined;
+        stop: () => void;
+    } | undefined>;
+    ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
+        readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+        readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+    }, {
+        props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
+            readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+            readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+        }>> & {
+            [x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
+        }>>;
+        ns: {
+            namespace: import("vue").ComputedRef<string>;
+            b: (blockSuffix?: string) => string;
+            e: (element?: string | undefined) => string;
+            m: (modifier?: string | undefined) => string;
+            be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+            em: (element?: string | undefined, modifier?: string | undefined) => string;
+            bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+            bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+            is: {
+                (name: string, state: boolean | undefined): string;
+                (name: string): string;
+            };
+        };
+        style: import("vue").ComputedRef<import("vue").CSSProperties>;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        readonly size: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
+        readonly color: import("element-plus/es/utils").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
+    }>>, {
+        size: import("element-plus/es/utils").BuildPropType<import("element-plus/es/utils").PropWrapper<string | number>, unknown, unknown>;
+        color: string;
+    }>> & Record<string, any>;
+    ArrowLeft: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    ArrowRight: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (current: number, prev: number) => boolean;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly initialIndex: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+    readonly height: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly trigger: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+    readonly autoplay: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly interval: import("element-plus/es/utils").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
+    readonly indicatorPosition: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly indicator: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly arrow: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "hover", unknown, unknown, unknown>;
+    readonly type: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly loop: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly direction: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "horizontal", unknown, unknown, unknown>;
+    readonly pauseOnHover: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+}>> & {
+    onChange?: ((current: number, prev: number) => any) | undefined;
+}, {
+    type: string;
+    trigger: string;
+    height: string;
+    direction: string;
+    indicator: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
+    initialIndex: number;
+    autoplay: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
+    interval: number;
+    indicatorPosition: string;
+    arrow: string;
+    loop: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
+    pauseOnHover: import("element-plus/es/utils").BuildPropType<BooleanConstructor, unknown, unknown>;
+}>;
+export default _default;