element-plus 1.2.0-beta.6 → 1.3.0-beta.1

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

@@ -1 +1 @@
-{"version":3,"file":"item.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/carousel/src/item.vue"],"sourcesContent":["<template>\n  <div\n    v-show=\"data.ready\"\n    class=\"el-carousel__item\"\n    :class=\"{\n      'is-active': data.active,\n      'el-carousel__item--card': type === 'card',\n      'is-in-stage': data.inStage,\n      'is-hover': data.hover,\n      'is-animating': data.animating,\n    }\"\n    :style=\"itemStyle\"\n    @click=\"handleItemClick\"\n  >\n    <div\n      v-if=\"type === 'card'\"\n      v-show=\"!data.active\"\n      class=\"el-carousel__mask\"\n    ></div>\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  onMounted,\n  inject,\n  computed,\n  toRefs,\n  getCurrentInstance,\n  onUnmounted,\n} from 'vue'\nimport { autoprefixer } from '@element-plus/utils/util'\nimport { debugWarn } from '@element-plus/utils/error'\nimport type { CSSProperties } from 'vue'\nimport type { InjectCarouselScope, ICarouselItemProps } from './carousel'\n\nconst CARD_SCALE = 0.83\nexport default defineComponent({\n  name: 'ElCarouselItem',\n  props: {\n    name: { type: String, default: '' },\n    label: {\n      type: [String, Number],\n      default: '',\n    },\n  },\n  setup(props: ICarouselItemProps) {\n    // instance\n    const instance = getCurrentInstance()\n\n    // data\n    const data = reactive({\n      hover: false,\n      translate: 0,\n      scale: 1,\n      active: false,\n      ready: false,\n      inStage: false,\n      animating: false,\n    })\n\n    // inject\n    const injectCarouselScope: InjectCarouselScope = inject(\n      'injectCarouselScope'\n    )\n\n    // computed\n    const parentDirection = computed(() => {\n      return injectCarouselScope.direction\n    })\n\n    const itemStyle = computed(() => {\n      const translateType =\n        parentDirection.value === 'vertical' ? 'translateY' : 'translateX'\n      const value = `${translateType}(${data.translate}px) scale(${data.scale})`\n      const style: CSSProperties = {\n        transform: value,\n      }\n      return autoprefixer(style)\n    })\n\n    // methods\n\n    function processIndex(index, activeIndex, length) {\n      if (activeIndex === 0 && index === length - 1) {\n        return -1\n      } else if (activeIndex === length - 1 && index === 0) {\n        return length\n      } else if (index < activeIndex - 1 && activeIndex - index >= length / 2) {\n        return length + 1\n      } else if (index > activeIndex + 1 && index - activeIndex >= length / 2) {\n        return -2\n      }\n      return index\n    }\n\n    function calcCardTranslate(index, activeIndex) {\n      const parentWidth = injectCarouselScope.root.value?.offsetWidth || 0\n      if (data.inStage) {\n        return (\n          (parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1)) / 4\n        )\n      } else if (index < activeIndex) {\n        return (-(1 + CARD_SCALE) * parentWidth) / 4\n      } else {\n        return ((3 + CARD_SCALE) * parentWidth) / 4\n      }\n    }\n\n    function calcTranslate(index, activeIndex, isVertical) {\n      const distance =\n        (isVertical\n          ? injectCarouselScope.root.value?.offsetHeight\n          : injectCarouselScope.root.value?.offsetWidth) || 0\n      return distance * (index - activeIndex)\n    }\n\n    const translateItem = (\n      index: number,\n      activeIndex: number,\n      oldIndex: number\n    ) => {\n      const parentType = injectCarouselScope.type\n      const length = injectCarouselScope.items.value.length\n      if (parentType !== 'card' && oldIndex !== undefined) {\n        data.animating = index === activeIndex || index === oldIndex\n      }\n      if (index !== activeIndex && length > 2 && injectCarouselScope.loop) {\n        index = processIndex(index, activeIndex, length)\n      }\n      if (parentType === 'card') {\n        if (parentDirection.value === 'vertical') {\n          debugWarn(\n            'Carousel',\n            'vertical direction is not supported in card mode'\n          )\n        }\n        data.inStage = Math.round(Math.abs(index - activeIndex)) <= 1\n        data.active = index === activeIndex\n        data.translate = calcCardTranslate(index, activeIndex)\n        data.scale = data.active ? 1 : CARD_SCALE\n      } else {\n        data.active = index === activeIndex\n        const isVertical = parentDirection.value === 'vertical'\n        data.translate = calcTranslate(index, activeIndex, isVertical)\n      }\n      data.ready = true\n    }\n\n    function handleItemClick() {\n      if (injectCarouselScope && injectCarouselScope.type === 'card') {\n        const index = injectCarouselScope.items.value\n          .map((d) => d.uid)\n          .indexOf(instance.uid)\n        injectCarouselScope.setActiveItem(index)\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      if (injectCarouselScope.addItem) {\n        injectCarouselScope.addItem({\n          uid: instance.uid,\n          ...props,\n          ...toRefs(data),\n          translateItem,\n        })\n      }\n    })\n\n    onUnmounted(() => {\n      if (injectCarouselScope.removeItem) {\n        injectCarouselScope.removeItem(instance.uid)\n      }\n    })\n\n    return {\n      data,\n      itemStyle,\n      translateItem,\n      type: injectCarouselScope.type,\n      handleItemClick,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","getCurrentInstance","reactive","inject","computed","autoprefixer","toRefs"],"mappings":"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"}
+{"version":3,"file":"item.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/carousel/src/item.vue"],"sourcesContent":["<template>\n  <div\n    v-show=\"data.ready\"\n    class=\"el-carousel__item\"\n    :class=\"{\n      'is-active': data.active,\n      'el-carousel__item--card': type === 'card',\n      'is-in-stage': data.inStage,\n      'is-hover': data.hover,\n      'is-animating': data.animating,\n    }\"\n    :style=\"itemStyle\"\n    @click=\"handleItemClick\"\n  >\n    <div\n      v-if=\"type === 'card'\"\n      v-show=\"!data.active\"\n      class=\"el-carousel__mask\"\n    ></div>\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  onMounted,\n  inject,\n  computed,\n  toRefs,\n  getCurrentInstance,\n  onUnmounted,\n} from 'vue'\nimport { autoprefixer } from '@element-plus/utils/util'\nimport { debugWarn } from '@element-plus/utils/error'\nimport type { CSSProperties } from 'vue'\nimport type { InjectCarouselScope, ICarouselItemProps } from './carousel'\n\nconst CARD_SCALE = 0.83\nexport default defineComponent({\n  name: 'ElCarouselItem',\n  props: {\n    name: { type: String, default: '' },\n    label: {\n      type: [String, Number],\n      default: '',\n    },\n  },\n  setup(props: ICarouselItemProps) {\n    // instance\n    const instance = getCurrentInstance()\n\n    // data\n    const data = reactive({\n      hover: false,\n      translate: 0,\n      scale: 1,\n      active: false,\n      ready: false,\n      inStage: false,\n      animating: false,\n    })\n\n    // inject\n    const injectCarouselScope: InjectCarouselScope = inject(\n      'injectCarouselScope'\n    )\n\n    // computed\n    const parentDirection = computed(() => {\n      return injectCarouselScope.direction\n    })\n\n    const itemStyle = computed(() => {\n      const translateType =\n        parentDirection.value === 'vertical' ? 'translateY' : 'translateX'\n      const value = `${translateType}(${data.translate}px) scale(${data.scale})`\n      const style: CSSProperties = {\n        transform: value,\n      }\n      return autoprefixer(style)\n    })\n\n    // methods\n\n    function processIndex(index, activeIndex, length) {\n      if (activeIndex === 0 && index === length - 1) {\n        return -1\n      } else if (activeIndex === length - 1 && index === 0) {\n        return length\n      } else if (index < activeIndex - 1 && activeIndex - index >= length / 2) {\n        return length + 1\n      } else if (index > activeIndex + 1 && index - activeIndex >= length / 2) {\n        return -2\n      }\n      return index\n    }\n\n    function calcCardTranslate(index, activeIndex) {\n      const parentWidth = injectCarouselScope.root.value?.offsetWidth || 0\n      if (data.inStage) {\n        return (\n          (parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1)) / 4\n        )\n      } else if (index < activeIndex) {\n        return (-(1 + CARD_SCALE) * parentWidth) / 4\n      } else {\n        return ((3 + CARD_SCALE) * parentWidth) / 4\n      }\n    }\n\n    function calcTranslate(index, activeIndex, isVertical) {\n      const distance =\n        (isVertical\n          ? injectCarouselScope.root.value?.offsetHeight\n          : injectCarouselScope.root.value?.offsetWidth) || 0\n      return distance * (index - activeIndex)\n    }\n\n    const translateItem = (\n      index: number,\n      activeIndex: number,\n      oldIndex: number\n    ) => {\n      const parentType = injectCarouselScope.type\n      const length = injectCarouselScope.items.value.length\n      if (parentType !== 'card' && oldIndex !== undefined) {\n        data.animating = index === activeIndex || index === oldIndex\n      }\n      if (index !== activeIndex && length > 2 && injectCarouselScope.loop) {\n        index = processIndex(index, activeIndex, length)\n      }\n      if (parentType === 'card') {\n        if (parentDirection.value === 'vertical') {\n          debugWarn(\n            'Carousel',\n            'vertical direction is not supported in card mode'\n          )\n        }\n        data.inStage = Math.round(Math.abs(index - activeIndex)) <= 1\n        data.active = index === activeIndex\n        data.translate = calcCardTranslate(index, activeIndex)\n        data.scale = data.active ? 1 : CARD_SCALE\n      } else {\n        data.active = index === activeIndex\n        const isVertical = parentDirection.value === 'vertical'\n        data.translate = calcTranslate(index, activeIndex, isVertical)\n      }\n      data.ready = true\n    }\n\n    function handleItemClick() {\n      if (injectCarouselScope && injectCarouselScope.type === 'card') {\n        const index = injectCarouselScope.items.value\n          .map((d) => d.uid)\n          .indexOf(instance.uid)\n        injectCarouselScope.setActiveItem(index)\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      if (injectCarouselScope.addItem) {\n        injectCarouselScope.addItem({\n          uid: instance.uid,\n          ...props,\n          ...toRefs(data),\n          translateItem,\n        })\n      }\n    })\n\n    onUnmounted(() => {\n      if (injectCarouselScope.removeItem) {\n        injectCarouselScope.removeItem(instance.uid)\n      }\n    })\n\n    return {\n      data,\n      itemStyle,\n      translateItem,\n      type: injectCarouselScope.type,\n      handleItemClick,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","autoprefixer","debugWarn"],"mappings":";;;;;;;;AAkCA,gBAAgB,GAAG,IAAI,CAAC;AACxB,aAAeA,mBAAe,CAAC;AAC/B,EAAE,MAAM,gBAAgB;;AAExB,IAAI,IAAI,EAAE,EAAE;AACZ,IAAI,KAAK,EAAE;MACL,IAAI,EAAE,CAAC,MAAM,EAAE;MACf;KACD;;OAEE,CAAC,KAAK,EAAE;UACL;IACN;;MAEE,SAAS,EAAE,CAAC;WACP,EAAE,CAAC;MACR,MAAM,EAAE,KAAK;;;MAGb,SAAS,EAAE,KAAK;MAChB,CAAC;UACG;UACA;MACJ;MACA,CAAC;UACG,SAAS;MACb,MAAM;;;QAGJ;OACD,CAAC;MACF,OAAOC,iBAAY,CAAC;;;UAGhB;QACF,OAAO,CAAC,CAAC,CAAC;OACX,MAAM,IAAI,WAAW,KAAK,MAAM;;;QAG/B,OAAO,SAAS,CAAC,CAAC;OACnB,MAAM,IAAI,KAAK;QACd,OAAO,CAAC,CAAC,CAAC;OACX;MACD,OAAO,MAAM;;;MAGb,IAAI,GAAG;;;QAGL;;QAEA,OAAO,EAAE,CAAC,GAAG,UAAU,IAAI,WAAW,GAAG,CAAC,CAAC;OAC5C,MAAM;QACL,OAAO,CAAC;;;aAGH,aAAa,CAAC,KAAK,EAAE,WAAW,EAAE,YAAY;UACjD,EAAE,IAAI,CAAC;MACX,cAAc,GAAG,WAAW,GAAG,yBAAyB,KAAK,CAAC;aACvD;;UAEH;;;MAGJ,IAAI,UAAU,KAAK,MAAM,IAAI,QAAQ,KAAK;QACxC,IAAI,CAAC,SAAS,QAAQ,KAAK,WAAW,IAAI,KAAK,KAAK,QAAQ;OAC7D;UACG,KAAK;aACF,GAAG,aAAa,KAAK,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC;;MAEnD,IAAI,UAAU,KAAK,MAAM,EAAE;QACzB,IAAI,eAAe,CAAC,UAAU;UAC5BC;SACD;;;;QAID,KAAK,KAAK,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,UAAU,CAAC;OAC3C,MAAM;QACL,IAAI,CAAC;cACC,UAAU,GAAG,eAAe,CAAC,KAAK,KAAK;YACzC,CAAC,SAAS,GAAG,aAAa,CAAC,KAAK,EAAE,WAAW;OAClD;;;IAGH,SAAS;MACP,IAAI;QACF,MAAM,KAAK,GAAG;QACd;OACD;;iBAEM,CAAC;MACR,IAAI,mBAAmB,CAAC,OAAO,EAAE;QAC/B,mBAAmB,CAAC,OAAO,CAAC;;UAE1B,GAAG,KAAK;UACR,aAAS,CAAC,IAAI,CAAC;;SAEhB,CAAC,CAAC;;;mBAGI,CAAC,MAAM;6BACO,CAAC,UAAU,EAAE;;;;WAI/B;UACD;eACK;MACT;UACI,EAAE,oBAAoB,IAAI;qBACf;;;;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"item.vue_vue_type_template_id_3d2e4fb8_lang.js","sources":["../../../../../../packages/components/carousel/src/item.vue?vue&type=template&id=3d2e4fb8&lang.js"],"sourcesContent":["<template>\n  <div\n    v-show=\"data.ready\"\n    class=\"el-carousel__item\"\n    :class=\"{\n      'is-active': data.active,\n      'el-carousel__item--card': type === 'card',\n      'is-in-stage': data.inStage,\n      'is-hover': data.hover,\n      'is-animating': data.animating,\n    }\"\n    :style=\"itemStyle\"\n    @click=\"handleItemClick\"\n  >\n    <div\n      v-if=\"type === 'card'\"\n      v-show=\"!data.active\"\n      class=\"el-carousel__mask\"\n    ></div>\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  onMounted,\n  inject,\n  computed,\n  toRefs,\n  getCurrentInstance,\n  onUnmounted,\n} from 'vue'\nimport { autoprefixer } from '@element-plus/utils/util'\nimport { debugWarn } from '@element-plus/utils/error'\nimport type { CSSProperties } from 'vue'\nimport type { InjectCarouselScope, ICarouselItemProps } from './carousel'\n\nconst CARD_SCALE = 0.83\nexport default defineComponent({\n  name: 'ElCarouselItem',\n  props: {\n    name: { type: String, default: '' },\n    label: {\n      type: [String, Number],\n      default: '',\n    },\n  },\n  setup(props: ICarouselItemProps) {\n    // instance\n    const instance = getCurrentInstance()\n\n    // data\n    const data = reactive({\n      hover: false,\n      translate: 0,\n      scale: 1,\n      active: false,\n      ready: false,\n      inStage: false,\n      animating: false,\n    })\n\n    // inject\n    const injectCarouselScope: InjectCarouselScope = inject(\n      'injectCarouselScope'\n    )\n\n    // computed\n    const parentDirection = computed(() => {\n      return injectCarouselScope.direction\n    })\n\n    const itemStyle = computed(() => {\n      const translateType =\n        parentDirection.value === 'vertical' ? 'translateY' : 'translateX'\n      const value = `${translateType}(${data.translate}px) scale(${data.scale})`\n      const style: CSSProperties = {\n        transform: value,\n      }\n      return autoprefixer(style)\n    })\n\n    // methods\n\n    function processIndex(index, activeIndex, length) {\n      if (activeIndex === 0 && index === length - 1) {\n        return -1\n      } else if (activeIndex === length - 1 && index === 0) {\n        return length\n      } else if (index < activeIndex - 1 && activeIndex - index >= length / 2) {\n        return length + 1\n      } else if (index > activeIndex + 1 && index - activeIndex >= length / 2) {\n        return -2\n      }\n      return index\n    }\n\n    function calcCardTranslate(index, activeIndex) {\n      const parentWidth = injectCarouselScope.root.value?.offsetWidth || 0\n      if (data.inStage) {\n        return (\n          (parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1)) / 4\n        )\n      } else if (index < activeIndex) {\n        return (-(1 + CARD_SCALE) * parentWidth) / 4\n      } else {\n        return ((3 + CARD_SCALE) * parentWidth) / 4\n      }\n    }\n\n    function calcTranslate(index, activeIndex, isVertical) {\n      const distance =\n        (isVertical\n          ? injectCarouselScope.root.value?.offsetHeight\n          : injectCarouselScope.root.value?.offsetWidth) || 0\n      return distance * (index - activeIndex)\n    }\n\n    const translateItem = (\n      index: number,\n      activeIndex: number,\n      oldIndex: number\n    ) => {\n      const parentType = injectCarouselScope.type\n      const length = injectCarouselScope.items.value.length\n      if (parentType !== 'card' && oldIndex !== undefined) {\n        data.animating = index === activeIndex || index === oldIndex\n      }\n      if (index !== activeIndex && length > 2 && injectCarouselScope.loop) {\n        index = processIndex(index, activeIndex, length)\n      }\n      if (parentType === 'card') {\n        if (parentDirection.value === 'vertical') {\n          debugWarn(\n            'Carousel',\n            'vertical direction is not supported in card mode'\n          )\n        }\n        data.inStage = Math.round(Math.abs(index - activeIndex)) <= 1\n        data.active = index === activeIndex\n        data.translate = calcCardTranslate(index, activeIndex)\n        data.scale = data.active ? 1 : CARD_SCALE\n      } else {\n        data.active = index === activeIndex\n        const isVertical = parentDirection.value === 'vertical'\n        data.translate = calcTranslate(index, activeIndex, isVertical)\n      }\n      data.ready = true\n    }\n\n    function handleItemClick() {\n      if (injectCarouselScope && injectCarouselScope.type === 'card') {\n        const index = injectCarouselScope.items.value\n          .map((d) => d.uid)\n          .indexOf(instance.uid)\n        injectCarouselScope.setActiveItem(index)\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      if (injectCarouselScope.addItem) {\n        injectCarouselScope.addItem({\n          uid: instance.uid,\n          ...props,\n          ...toRefs(data),\n          translateItem,\n        })\n      }\n    })\n\n    onUnmounted(() => {\n      if (injectCarouselScope.removeItem) {\n        injectCarouselScope.removeItem(instance.uid)\n      }\n    })\n\n    return {\n      data,\n      itemStyle,\n      translateItem,\n      type: injectCarouselScope.type,\n      handleItemClick,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot"],"mappings":";;;;;;;;EAiBM,OAAM;AAAA;;8CAhBVA;IAEE,2BAAM;;;;;;;IAQL,0BAAO;IACP,gDAAO;;IAGA,4DADRA,8BAAA;mBAEW,UAAK;AAAA;IAGhBC;;gBAjBQ,UAAK;AAAA;AAAA;;;;"}
+{"version":3,"file":"item.vue_vue_type_template_id_3d2e4fb8_lang.js","sources":["../../../../../../packages/components/carousel/src/item.vue?vue&type=template&id=3d2e4fb8&lang.js"],"sourcesContent":["<template>\n  <div\n    v-show=\"data.ready\"\n    class=\"el-carousel__item\"\n    :class=\"{\n      'is-active': data.active,\n      'el-carousel__item--card': type === 'card',\n      'is-in-stage': data.inStage,\n      'is-hover': data.hover,\n      'is-animating': data.animating,\n    }\"\n    :style=\"itemStyle\"\n    @click=\"handleItemClick\"\n  >\n    <div\n      v-if=\"type === 'card'\"\n      v-show=\"!data.active\"\n      class=\"el-carousel__mask\"\n    ></div>\n    <slot></slot>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  onMounted,\n  inject,\n  computed,\n  toRefs,\n  getCurrentInstance,\n  onUnmounted,\n} from 'vue'\nimport { autoprefixer } from '@element-plus/utils/util'\nimport { debugWarn } from '@element-plus/utils/error'\nimport type { CSSProperties } from 'vue'\nimport type { InjectCarouselScope, ICarouselItemProps } from './carousel'\n\nconst CARD_SCALE = 0.83\nexport default defineComponent({\n  name: 'ElCarouselItem',\n  props: {\n    name: { type: String, default: '' },\n    label: {\n      type: [String, Number],\n      default: '',\n    },\n  },\n  setup(props: ICarouselItemProps) {\n    // instance\n    const instance = getCurrentInstance()\n\n    // data\n    const data = reactive({\n      hover: false,\n      translate: 0,\n      scale: 1,\n      active: false,\n      ready: false,\n      inStage: false,\n      animating: false,\n    })\n\n    // inject\n    const injectCarouselScope: InjectCarouselScope = inject(\n      'injectCarouselScope'\n    )\n\n    // computed\n    const parentDirection = computed(() => {\n      return injectCarouselScope.direction\n    })\n\n    const itemStyle = computed(() => {\n      const translateType =\n        parentDirection.value === 'vertical' ? 'translateY' : 'translateX'\n      const value = `${translateType}(${data.translate}px) scale(${data.scale})`\n      const style: CSSProperties = {\n        transform: value,\n      }\n      return autoprefixer(style)\n    })\n\n    // methods\n\n    function processIndex(index, activeIndex, length) {\n      if (activeIndex === 0 && index === length - 1) {\n        return -1\n      } else if (activeIndex === length - 1 && index === 0) {\n        return length\n      } else if (index < activeIndex - 1 && activeIndex - index >= length / 2) {\n        return length + 1\n      } else if (index > activeIndex + 1 && index - activeIndex >= length / 2) {\n        return -2\n      }\n      return index\n    }\n\n    function calcCardTranslate(index, activeIndex) {\n      const parentWidth = injectCarouselScope.root.value?.offsetWidth || 0\n      if (data.inStage) {\n        return (\n          (parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1)) / 4\n        )\n      } else if (index < activeIndex) {\n        return (-(1 + CARD_SCALE) * parentWidth) / 4\n      } else {\n        return ((3 + CARD_SCALE) * parentWidth) / 4\n      }\n    }\n\n    function calcTranslate(index, activeIndex, isVertical) {\n      const distance =\n        (isVertical\n          ? injectCarouselScope.root.value?.offsetHeight\n          : injectCarouselScope.root.value?.offsetWidth) || 0\n      return distance * (index - activeIndex)\n    }\n\n    const translateItem = (\n      index: number,\n      activeIndex: number,\n      oldIndex: number\n    ) => {\n      const parentType = injectCarouselScope.type\n      const length = injectCarouselScope.items.value.length\n      if (parentType !== 'card' && oldIndex !== undefined) {\n        data.animating = index === activeIndex || index === oldIndex\n      }\n      if (index !== activeIndex && length > 2 && injectCarouselScope.loop) {\n        index = processIndex(index, activeIndex, length)\n      }\n      if (parentType === 'card') {\n        if (parentDirection.value === 'vertical') {\n          debugWarn(\n            'Carousel',\n            'vertical direction is not supported in card mode'\n          )\n        }\n        data.inStage = Math.round(Math.abs(index - activeIndex)) <= 1\n        data.active = index === activeIndex\n        data.translate = calcCardTranslate(index, activeIndex)\n        data.scale = data.active ? 1 : CARD_SCALE\n      } else {\n        data.active = index === activeIndex\n        const isVertical = parentDirection.value === 'vertical'\n        data.translate = calcTranslate(index, activeIndex, isVertical)\n      }\n      data.ready = true\n    }\n\n    function handleItemClick() {\n      if (injectCarouselScope && injectCarouselScope.type === 'card') {\n        const index = injectCarouselScope.items.value\n          .map((d) => d.uid)\n          .indexOf(instance.uid)\n        injectCarouselScope.setActiveItem(index)\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      if (injectCarouselScope.addItem) {\n        injectCarouselScope.addItem({\n          uid: instance.uid,\n          ...props,\n          ...toRefs(data),\n          translateItem,\n        })\n      }\n    })\n\n    onUnmounted(() => {\n      if (injectCarouselScope.removeItem) {\n        injectCarouselScope.removeItem(instance.uid)\n      }\n    })\n\n    return {\n      data,\n      itemStyle,\n      translateItem,\n      type: injectCarouselScope.type,\n      handleItemClick,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;EAiBM;;;;;;;;;;;;;IALD,+GAAsB;;KAGf;0CADR;;;;;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"main.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/carousel/src/main.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"root\"\n    :class=\"carouselClasses\"\n    @mouseenter.stop=\"handleMouseEnter\"\n    @mouseleave.stop=\"handleMouseLeave\"\n  >\n    <div class=\"el-carousel__container\" :style=\"{ height: height }\">\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-left\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex > 0)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--left\"\n          @mouseenter=\"handleButtonEnter('left')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex - 1)\"\n        >\n          <el-icon>\n            <arrow-left />\n          </el-icon>\n        </button>\n      </transition>\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-right\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex < items.length - 1)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--right\"\n          @mouseenter=\"handleButtonEnter('right')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex + 1)\"\n        >\n          <el-icon>\n            <arrow-right />\n          </el-icon>\n        </button>\n      </transition>\n      <slot></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          'el-carousel__indicator',\n          'el-carousel__indicator--' + direction,\n          { 'is-active': index === data.activeIndex },\n        ]\"\n        @mouseenter=\"throttledIndicatorHover(index)\"\n        @click.stop=\"handleIndicatorClick(index)\"\n      >\n        <button class=\"el-carousel__button\">\n          <span v-if=\"hasLabel\">{{ item.label }}</span>\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  computed,\n  ref,\n  provide,\n  onMounted,\n  onBeforeUnmount,\n  watch,\n  nextTick,\n} from 'vue'\nimport throttle from 'lodash/throttle'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport type {\n  ICarouselProps,\n  CarouselItem,\n  InjectCarouselScope,\n} from './carousel'\n\nexport default defineComponent({\n  name: 'ElCarousel',\n  components: {\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n  props: {\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  },\n  emits: ['change'],\n  setup(props: ICarouselProps, { emit }) {\n    // data\n    const data = reactive<{\n      activeIndex: number\n      containerWidth: number\n      timer: null | ReturnType<typeof setInterval>\n      hover: boolean\n    }>({\n      activeIndex: -1,\n      containerWidth: 0,\n      timer: null,\n      hover: false,\n    })\n\n    // refs\n    const root = ref(null)\n    const items = ref<CarouselItem[]>([])\n\n    // computed\n    const arrowDisplay = computed(\n      () => props.arrow !== 'never' && props.direction !== 'vertical'\n    )\n\n    const hasLabel = computed(() => {\n      return items.value.some((item) => item.label.toString().length > 0)\n    })\n\n    const carouselClasses = computed(() => {\n      const classes = ['el-carousel', `el-carousel--${props.direction}`]\n      if (props.type === 'card') {\n        classes.push('el-carousel--card')\n      }\n      return classes\n    })\n\n    const indicatorsClasses = computed(() => {\n      const classes = [\n        'el-carousel__indicators',\n        `el-carousel__indicators--${props.direction}`,\n      ]\n      if (hasLabel.value) {\n        classes.push('el-carousel__indicators--labels')\n      }\n      if (props.indicatorPosition === 'outside' || props.type === 'card') {\n        classes.push('el-carousel__indicators--outside')\n      }\n      return classes\n    })\n\n    // methods\n    const throttledArrowClick = throttle(\n      (index) => {\n        setActiveItem(index)\n      },\n      300,\n      { trailing: true }\n    )\n\n    const throttledIndicatorHover = throttle((index) => {\n      handleIndicatorHover(index)\n    }, 300)\n\n    function pauseTimer() {\n      if (data.timer) {\n        clearInterval(data.timer)\n        data.timer = null\n      }\n    }\n\n    function startTimer() {\n      if (props.interval <= 0 || !props.autoplay || data.timer) return\n      data.timer = setInterval(() => playSlides(), props.interval)\n    }\n\n    const playSlides = () => {\n      if (data.activeIndex < items.value.length - 1) {\n        data.activeIndex = data.activeIndex + 1\n      } else if (props.loop) {\n        data.activeIndex = 0\n      }\n    }\n\n    function setActiveItem(index) {\n      if (typeof index === 'string') {\n        const filteredItems = items.value.filter((item) => item.name === index)\n        if (filteredItems.length > 0) {\n          index = items.value.indexOf(filteredItems[0])\n        }\n      }\n      index = Number(index)\n      if (isNaN(index) || index !== Math.floor(index)) {\n        debugWarn('Carousel', 'index must be an integer.')\n        return\n      }\n      const length = items.value.length\n      const oldIndex = data.activeIndex\n      if (index < 0) {\n        data.activeIndex = props.loop ? length - 1 : 0\n      } else if (index >= length) {\n        data.activeIndex = props.loop ? 0 : length - 1\n      } else {\n        data.activeIndex = index\n      }\n      if (oldIndex === data.activeIndex) {\n        resetItemPosition(oldIndex)\n      }\n    }\n\n    function resetItemPosition(oldIndex) {\n      items.value.forEach((item, index) => {\n        item.translateItem(index, data.activeIndex, oldIndex)\n      })\n    }\n\n    function addItem(item) {\n      items.value.push(item)\n    }\n\n    function removeItem(uid) {\n      const index = items.value.findIndex((item) => item.uid === uid)\n      if (index !== -1) {\n        items.value.splice(index, 1)\n        if (data.activeIndex === index) next()\n      }\n    }\n\n    function itemInStage(item, index) {\n      const length = items.value.length\n      if (\n        (index === length - 1 && item.inStage && items.value[0].active) ||\n        (item.inStage &&\n          items.value[index + 1] &&\n          items.value[index + 1].active)\n      ) {\n        return 'left'\n      } else if (\n        (index === 0 && item.inStage && items.value[length - 1].active) ||\n        (item.inStage &&\n          items.value[index - 1] &&\n          items.value[index - 1].active)\n      ) {\n        return 'right'\n      }\n      return false\n    }\n\n    function handleMouseEnter() {\n      data.hover = true\n      if (props.pauseOnHover) {\n        pauseTimer()\n      }\n    }\n\n    function handleMouseLeave() {\n      data.hover = false\n      startTimer()\n    }\n\n    function handleButtonEnter(arrow) {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item, index) => {\n        if (arrow === itemInStage(item, index)) {\n          item.hover = true\n        }\n      })\n    }\n\n    function handleButtonLeave() {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item) => {\n        item.hover = false\n      })\n    }\n\n    function handleIndicatorClick(index) {\n      data.activeIndex = index\n    }\n\n    function handleIndicatorHover(index) {\n      if (props.trigger === 'hover' && index !== data.activeIndex) {\n        data.activeIndex = index\n      }\n    }\n\n    function prev() {\n      setActiveItem(data.activeIndex - 1)\n    }\n\n    function next() {\n      setActiveItem(data.activeIndex + 1)\n    }\n\n    // watch\n    watch(\n      () => data.activeIndex,\n      (current, prev) => {\n        resetItemPosition(prev)\n        if (prev > -1) {\n          emit('change', current, prev)\n        }\n      }\n    )\n    watch(\n      () => props.autoplay,\n      (current) => {\n        current ? startTimer() : pauseTimer()\n      }\n    )\n    watch(\n      () => props.loop,\n      () => {\n        setActiveItem(data.activeIndex)\n      }\n    )\n\n    // lifecycle\n    onMounted(() => {\n      nextTick(() => {\n        addResizeListener(root.value, resetItemPosition)\n        if (\n          props.initialIndex < items.value.length &&\n          props.initialIndex >= 0\n        ) {\n          data.activeIndex = props.initialIndex\n        }\n        startTimer()\n      })\n    })\n\n    onBeforeUnmount(() => {\n      if (root.value) removeResizeListener(root.value, resetItemPosition)\n      pauseTimer()\n    })\n\n    // provide\n    provide<InjectCarouselScope>('injectCarouselScope', {\n      root,\n      direction: props.direction,\n      type: props.type,\n      items,\n      loop: props.loop,\n      addItem,\n      removeItem,\n      setActiveItem,\n    })\n\n    return {\n      data,\n      props,\n      items,\n\n      arrowDisplay,\n      carouselClasses,\n      indicatorsClasses,\n      hasLabel,\n\n      handleMouseEnter,\n      handleMouseLeave,\n      handleIndicatorClick,\n      throttledArrowClick,\n      throttledIndicatorHover,\n      handleButtonEnter,\n      handleButtonLeave,\n\n      prev,\n      next,\n      setActiveItem,\n\n      root,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElIcon","ArrowLeft","ArrowRight","reactive","ref","computed","throttle"],"mappings":"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"}
+{"version":3,"file":"main.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/carousel/src/main.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"root\"\n    :class=\"carouselClasses\"\n    @mouseenter.stop=\"handleMouseEnter\"\n    @mouseleave.stop=\"handleMouseLeave\"\n  >\n    <div class=\"el-carousel__container\" :style=\"{ height: height }\">\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-left\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex > 0)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--left\"\n          @mouseenter=\"handleButtonEnter('left')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex - 1)\"\n        >\n          <el-icon>\n            <arrow-left />\n          </el-icon>\n        </button>\n      </transition>\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-right\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex < items.length - 1)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--right\"\n          @mouseenter=\"handleButtonEnter('right')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex + 1)\"\n        >\n          <el-icon>\n            <arrow-right />\n          </el-icon>\n        </button>\n      </transition>\n      <slot></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          'el-carousel__indicator',\n          'el-carousel__indicator--' + direction,\n          { 'is-active': index === data.activeIndex },\n        ]\"\n        @mouseenter=\"throttledIndicatorHover(index)\"\n        @click.stop=\"handleIndicatorClick(index)\"\n      >\n        <button class=\"el-carousel__button\">\n          <span v-if=\"hasLabel\">{{ item.label }}</span>\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  computed,\n  ref,\n  provide,\n  onMounted,\n  onBeforeUnmount,\n  watch,\n  nextTick,\n} from 'vue'\nimport throttle from 'lodash/throttle'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport type {\n  ICarouselProps,\n  CarouselItem,\n  InjectCarouselScope,\n} from './carousel'\n\nexport default defineComponent({\n  name: 'ElCarousel',\n  components: {\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n  props: {\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  },\n  emits: ['change'],\n  setup(props: ICarouselProps, { emit }) {\n    // data\n    const data = reactive<{\n      activeIndex: number\n      containerWidth: number\n      timer: null | ReturnType<typeof setInterval>\n      hover: boolean\n    }>({\n      activeIndex: -1,\n      containerWidth: 0,\n      timer: null,\n      hover: false,\n    })\n\n    // refs\n    const root = ref(null)\n    const items = ref<CarouselItem[]>([])\n\n    // computed\n    const arrowDisplay = computed(\n      () => props.arrow !== 'never' && props.direction !== 'vertical'\n    )\n\n    const hasLabel = computed(() => {\n      return items.value.some((item) => item.label.toString().length > 0)\n    })\n\n    const carouselClasses = computed(() => {\n      const classes = ['el-carousel', `el-carousel--${props.direction}`]\n      if (props.type === 'card') {\n        classes.push('el-carousel--card')\n      }\n      return classes\n    })\n\n    const indicatorsClasses = computed(() => {\n      const classes = [\n        'el-carousel__indicators',\n        `el-carousel__indicators--${props.direction}`,\n      ]\n      if (hasLabel.value) {\n        classes.push('el-carousel__indicators--labels')\n      }\n      if (props.indicatorPosition === 'outside' || props.type === 'card') {\n        classes.push('el-carousel__indicators--outside')\n      }\n      return classes\n    })\n\n    // methods\n    const throttledArrowClick = throttle(\n      (index) => {\n        setActiveItem(index)\n      },\n      300,\n      { trailing: true }\n    )\n\n    const throttledIndicatorHover = throttle((index) => {\n      handleIndicatorHover(index)\n    }, 300)\n\n    function pauseTimer() {\n      if (data.timer) {\n        clearInterval(data.timer)\n        data.timer = null\n      }\n    }\n\n    function startTimer() {\n      if (props.interval <= 0 || !props.autoplay || data.timer) return\n      data.timer = setInterval(() => playSlides(), props.interval)\n    }\n\n    const playSlides = () => {\n      if (data.activeIndex < items.value.length - 1) {\n        data.activeIndex = data.activeIndex + 1\n      } else if (props.loop) {\n        data.activeIndex = 0\n      }\n    }\n\n    function setActiveItem(index) {\n      if (typeof index === 'string') {\n        const filteredItems = items.value.filter((item) => item.name === index)\n        if (filteredItems.length > 0) {\n          index = items.value.indexOf(filteredItems[0])\n        }\n      }\n      index = Number(index)\n      if (isNaN(index) || index !== Math.floor(index)) {\n        debugWarn('Carousel', 'index must be an integer.')\n        return\n      }\n      const length = items.value.length\n      const oldIndex = data.activeIndex\n      if (index < 0) {\n        data.activeIndex = props.loop ? length - 1 : 0\n      } else if (index >= length) {\n        data.activeIndex = props.loop ? 0 : length - 1\n      } else {\n        data.activeIndex = index\n      }\n      if (oldIndex === data.activeIndex) {\n        resetItemPosition(oldIndex)\n      }\n    }\n\n    function resetItemPosition(oldIndex) {\n      items.value.forEach((item, index) => {\n        item.translateItem(index, data.activeIndex, oldIndex)\n      })\n    }\n\n    function addItem(item) {\n      items.value.push(item)\n    }\n\n    function removeItem(uid) {\n      const index = items.value.findIndex((item) => item.uid === uid)\n      if (index !== -1) {\n        items.value.splice(index, 1)\n        if (data.activeIndex === index) next()\n      }\n    }\n\n    function itemInStage(item, index) {\n      const length = items.value.length\n      if (\n        (index === length - 1 && item.inStage && items.value[0].active) ||\n        (item.inStage &&\n          items.value[index + 1] &&\n          items.value[index + 1].active)\n      ) {\n        return 'left'\n      } else if (\n        (index === 0 && item.inStage && items.value[length - 1].active) ||\n        (item.inStage &&\n          items.value[index - 1] &&\n          items.value[index - 1].active)\n      ) {\n        return 'right'\n      }\n      return false\n    }\n\n    function handleMouseEnter() {\n      data.hover = true\n      if (props.pauseOnHover) {\n        pauseTimer()\n      }\n    }\n\n    function handleMouseLeave() {\n      data.hover = false\n      startTimer()\n    }\n\n    function handleButtonEnter(arrow) {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item, index) => {\n        if (arrow === itemInStage(item, index)) {\n          item.hover = true\n        }\n      })\n    }\n\n    function handleButtonLeave() {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item) => {\n        item.hover = false\n      })\n    }\n\n    function handleIndicatorClick(index) {\n      data.activeIndex = index\n    }\n\n    function handleIndicatorHover(index) {\n      if (props.trigger === 'hover' && index !== data.activeIndex) {\n        data.activeIndex = index\n      }\n    }\n\n    function prev() {\n      setActiveItem(data.activeIndex - 1)\n    }\n\n    function next() {\n      setActiveItem(data.activeIndex + 1)\n    }\n\n    // watch\n    watch(\n      () => data.activeIndex,\n      (current, prev) => {\n        resetItemPosition(prev)\n        if (prev > -1) {\n          emit('change', current, prev)\n        }\n      }\n    )\n    watch(\n      () => props.autoplay,\n      (current) => {\n        current ? startTimer() : pauseTimer()\n      }\n    )\n    watch(\n      () => props.loop,\n      () => {\n        setActiveItem(data.activeIndex)\n      }\n    )\n\n    // lifecycle\n    onMounted(() => {\n      nextTick(() => {\n        addResizeListener(root.value, resetItemPosition)\n        if (\n          props.initialIndex < items.value.length &&\n          props.initialIndex >= 0\n        ) {\n          data.activeIndex = props.initialIndex\n        }\n        startTimer()\n      })\n    })\n\n    onBeforeUnmount(() => {\n      if (root.value) removeResizeListener(root.value, resetItemPosition)\n      pauseTimer()\n    })\n\n    // provide\n    provide<InjectCarouselScope>('injectCarouselScope', {\n      root,\n      direction: props.direction,\n      type: props.type,\n      items,\n      loop: props.loop,\n      addItem,\n      removeItem,\n      setActiveItem,\n    })\n\n    return {\n      data,\n      props,\n      items,\n\n      arrowDisplay,\n      carouselClasses,\n      indicatorsClasses,\n      hasLabel,\n\n      handleMouseEnter,\n      handleMouseLeave,\n      handleIndicatorClick,\n      throttledArrowClick,\n      throttledIndicatorHover,\n      handleButtonEnter,\n      handleButtonLeave,\n\n      prev,\n      next,\n      setActiveItem,\n\n      root,\n    }\n  },\n})\n</script>\n"],"names":["ElIcon","ArrowLeft","ArrowRight","ref","computed","throttle","debugWarn","onMounted","addResizeListener","provide"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"main.vue_vue_type_template_id_1303d144_lang.js","sources":["../../../../../../packages/components/carousel/src/main.vue?vue&type=template&id=1303d144&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"root\"\n    :class=\"carouselClasses\"\n    @mouseenter.stop=\"handleMouseEnter\"\n    @mouseleave.stop=\"handleMouseLeave\"\n  >\n    <div class=\"el-carousel__container\" :style=\"{ height: height }\">\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-left\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex > 0)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--left\"\n          @mouseenter=\"handleButtonEnter('left')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex - 1)\"\n        >\n          <el-icon>\n            <arrow-left />\n          </el-icon>\n        </button>\n      </transition>\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-right\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex < items.length - 1)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--right\"\n          @mouseenter=\"handleButtonEnter('right')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex + 1)\"\n        >\n          <el-icon>\n            <arrow-right />\n          </el-icon>\n        </button>\n      </transition>\n      <slot></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          'el-carousel__indicator',\n          'el-carousel__indicator--' + direction,\n          { 'is-active': index === data.activeIndex },\n        ]\"\n        @mouseenter=\"throttledIndicatorHover(index)\"\n        @click.stop=\"handleIndicatorClick(index)\"\n      >\n        <button class=\"el-carousel__button\">\n          <span v-if=\"hasLabel\">{{ item.label }}</span>\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  computed,\n  ref,\n  provide,\n  onMounted,\n  onBeforeUnmount,\n  watch,\n  nextTick,\n} from 'vue'\nimport throttle from 'lodash/throttle'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport type {\n  ICarouselProps,\n  CarouselItem,\n  InjectCarouselScope,\n} from './carousel'\n\nexport default defineComponent({\n  name: 'ElCarousel',\n  components: {\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n  props: {\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  },\n  emits: ['change'],\n  setup(props: ICarouselProps, { emit }) {\n    // data\n    const data = reactive<{\n      activeIndex: number\n      containerWidth: number\n      timer: null | ReturnType<typeof setInterval>\n      hover: boolean\n    }>({\n      activeIndex: -1,\n      containerWidth: 0,\n      timer: null,\n      hover: false,\n    })\n\n    // refs\n    const root = ref(null)\n    const items = ref<CarouselItem[]>([])\n\n    // computed\n    const arrowDisplay = computed(\n      () => props.arrow !== 'never' && props.direction !== 'vertical'\n    )\n\n    const hasLabel = computed(() => {\n      return items.value.some((item) => item.label.toString().length > 0)\n    })\n\n    const carouselClasses = computed(() => {\n      const classes = ['el-carousel', `el-carousel--${props.direction}`]\n      if (props.type === 'card') {\n        classes.push('el-carousel--card')\n      }\n      return classes\n    })\n\n    const indicatorsClasses = computed(() => {\n      const classes = [\n        'el-carousel__indicators',\n        `el-carousel__indicators--${props.direction}`,\n      ]\n      if (hasLabel.value) {\n        classes.push('el-carousel__indicators--labels')\n      }\n      if (props.indicatorPosition === 'outside' || props.type === 'card') {\n        classes.push('el-carousel__indicators--outside')\n      }\n      return classes\n    })\n\n    // methods\n    const throttledArrowClick = throttle(\n      (index) => {\n        setActiveItem(index)\n      },\n      300,\n      { trailing: true }\n    )\n\n    const throttledIndicatorHover = throttle((index) => {\n      handleIndicatorHover(index)\n    }, 300)\n\n    function pauseTimer() {\n      if (data.timer) {\n        clearInterval(data.timer)\n        data.timer = null\n      }\n    }\n\n    function startTimer() {\n      if (props.interval <= 0 || !props.autoplay || data.timer) return\n      data.timer = setInterval(() => playSlides(), props.interval)\n    }\n\n    const playSlides = () => {\n      if (data.activeIndex < items.value.length - 1) {\n        data.activeIndex = data.activeIndex + 1\n      } else if (props.loop) {\n        data.activeIndex = 0\n      }\n    }\n\n    function setActiveItem(index) {\n      if (typeof index === 'string') {\n        const filteredItems = items.value.filter((item) => item.name === index)\n        if (filteredItems.length > 0) {\n          index = items.value.indexOf(filteredItems[0])\n        }\n      }\n      index = Number(index)\n      if (isNaN(index) || index !== Math.floor(index)) {\n        debugWarn('Carousel', 'index must be an integer.')\n        return\n      }\n      const length = items.value.length\n      const oldIndex = data.activeIndex\n      if (index < 0) {\n        data.activeIndex = props.loop ? length - 1 : 0\n      } else if (index >= length) {\n        data.activeIndex = props.loop ? 0 : length - 1\n      } else {\n        data.activeIndex = index\n      }\n      if (oldIndex === data.activeIndex) {\n        resetItemPosition(oldIndex)\n      }\n    }\n\n    function resetItemPosition(oldIndex) {\n      items.value.forEach((item, index) => {\n        item.translateItem(index, data.activeIndex, oldIndex)\n      })\n    }\n\n    function addItem(item) {\n      items.value.push(item)\n    }\n\n    function removeItem(uid) {\n      const index = items.value.findIndex((item) => item.uid === uid)\n      if (index !== -1) {\n        items.value.splice(index, 1)\n        if (data.activeIndex === index) next()\n      }\n    }\n\n    function itemInStage(item, index) {\n      const length = items.value.length\n      if (\n        (index === length - 1 && item.inStage && items.value[0].active) ||\n        (item.inStage &&\n          items.value[index + 1] &&\n          items.value[index + 1].active)\n      ) {\n        return 'left'\n      } else if (\n        (index === 0 && item.inStage && items.value[length - 1].active) ||\n        (item.inStage &&\n          items.value[index - 1] &&\n          items.value[index - 1].active)\n      ) {\n        return 'right'\n      }\n      return false\n    }\n\n    function handleMouseEnter() {\n      data.hover = true\n      if (props.pauseOnHover) {\n        pauseTimer()\n      }\n    }\n\n    function handleMouseLeave() {\n      data.hover = false\n      startTimer()\n    }\n\n    function handleButtonEnter(arrow) {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item, index) => {\n        if (arrow === itemInStage(item, index)) {\n          item.hover = true\n        }\n      })\n    }\n\n    function handleButtonLeave() {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item) => {\n        item.hover = false\n      })\n    }\n\n    function handleIndicatorClick(index) {\n      data.activeIndex = index\n    }\n\n    function handleIndicatorHover(index) {\n      if (props.trigger === 'hover' && index !== data.activeIndex) {\n        data.activeIndex = index\n      }\n    }\n\n    function prev() {\n      setActiveItem(data.activeIndex - 1)\n    }\n\n    function next() {\n      setActiveItem(data.activeIndex + 1)\n    }\n\n    // watch\n    watch(\n      () => data.activeIndex,\n      (current, prev) => {\n        resetItemPosition(prev)\n        if (prev > -1) {\n          emit('change', current, prev)\n        }\n      }\n    )\n    watch(\n      () => props.autoplay,\n      (current) => {\n        current ? startTimer() : pauseTimer()\n      }\n    )\n    watch(\n      () => props.loop,\n      () => {\n        setActiveItem(data.activeIndex)\n      }\n    )\n\n    // lifecycle\n    onMounted(() => {\n      nextTick(() => {\n        addResizeListener(root.value, resetItemPosition)\n        if (\n          props.initialIndex < items.value.length &&\n          props.initialIndex >= 0\n        ) {\n          data.activeIndex = props.initialIndex\n        }\n        startTimer()\n      })\n    })\n\n    onBeforeUnmount(() => {\n      if (root.value) removeResizeListener(root.value, resetItemPosition)\n      pauseTimer()\n    })\n\n    // provide\n    provide<InjectCarouselScope>('injectCarouselScope', {\n      root,\n      direction: props.direction,\n      type: props.type,\n      items,\n      loop: props.loop,\n      addItem,\n      removeItem,\n      setActiveItem,\n    })\n\n    return {\n      data,\n      props,\n      items,\n\n      arrowDisplay,\n      carouselClasses,\n      indicatorsClasses,\n      hasLabel,\n\n      handleMouseEnter,\n      handleMouseLeave,\n      handleIndicatorClick,\n      throttledArrowClick,\n      throttledIndicatorHover,\n      handleButtonEnter,\n      handleButtonLeave,\n\n      prev,\n      next,\n      setActiveItem,\n\n      root,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_createBlock","_createVNode","_renderSlot"],"mappings":";;;;;;;qBAwDgB,OAAM;;;;;;0BAvDpBA;IACE,KAAI;AAAA,IACH,0BAAO;IACP,uEAAiB;IACjB,uEAAiB;;IAElBC;MAAK,OAAM;AAAA,MAA0B,oCAAiB;;MAClC,sCAAlBC;;QAAgC,MAAK;AAAA;6BACnC;6BAAAD;YAKE,MAAK;AAAA,YACL,OAAM;AAAA,YACL,oDAAY;YACZ,qDAAY;YACZ,iEAAY,yBAAoB,UAAK;;YAEtCE;mCACE;gBAAAA;;;;;;;;;;;;;MAIY,sCAAlBD;;QAAgC,MAAK;AAAA;6BACnC;6BAAAD;YAKE,MAAK;AAAA,YACL,OAAM;AAAA,YACL,oDAAY;YACZ,qDAAY;YACZ,iEAAY,yBAAoB,UAAK;;YAEtCE;mCACE;gBAAAA;;;;;;;;;;;;;MAINC;;IAEQ,sDAAVJ;;MAAyC,0BAAO;;4BAC9CA,0DAC0B,aAAhB,MAAM;gCADhBA;UAEG,KAAK;AAAA,UACL;;;;;UAKA,0BAAY,6BAAwB;AAAA,UACpC,uCAAY,0BAAqB;;UAElCC,iCAAA;YACc,kCAAZD,+DAAyB,KAAK;;;;;;;;;;"}
+{"version":3,"file":"main.vue_vue_type_template_id_1303d144_lang.js","sources":["../../../../../../packages/components/carousel/src/main.vue?vue&type=template&id=1303d144&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"root\"\n    :class=\"carouselClasses\"\n    @mouseenter.stop=\"handleMouseEnter\"\n    @mouseleave.stop=\"handleMouseLeave\"\n  >\n    <div class=\"el-carousel__container\" :style=\"{ height: height }\">\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-left\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex > 0)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--left\"\n          @mouseenter=\"handleButtonEnter('left')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex - 1)\"\n        >\n          <el-icon>\n            <arrow-left />\n          </el-icon>\n        </button>\n      </transition>\n      <transition v-if=\"arrowDisplay\" name=\"carousel-arrow-right\">\n        <button\n          v-show=\"\n            (arrow === 'always' || data.hover) &&\n            (props.loop || data.activeIndex < items.length - 1)\n          \"\n          type=\"button\"\n          class=\"el-carousel__arrow el-carousel__arrow--right\"\n          @mouseenter=\"handleButtonEnter('right')\"\n          @mouseleave=\"handleButtonLeave\"\n          @click.stop=\"throttledArrowClick(data.activeIndex + 1)\"\n        >\n          <el-icon>\n            <arrow-right />\n          </el-icon>\n        </button>\n      </transition>\n      <slot></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          'el-carousel__indicator',\n          'el-carousel__indicator--' + direction,\n          { 'is-active': index === data.activeIndex },\n        ]\"\n        @mouseenter=\"throttledIndicatorHover(index)\"\n        @click.stop=\"handleIndicatorClick(index)\"\n      >\n        <button class=\"el-carousel__button\">\n          <span v-if=\"hasLabel\">{{ item.label }}</span>\n        </button>\n      </li>\n    </ul>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  reactive,\n  computed,\n  ref,\n  provide,\n  onMounted,\n  onBeforeUnmount,\n  watch,\n  nextTick,\n} from 'vue'\nimport throttle from 'lodash/throttle'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'\n\nimport { debugWarn } from '@element-plus/utils/error'\nimport type {\n  ICarouselProps,\n  CarouselItem,\n  InjectCarouselScope,\n} from './carousel'\n\nexport default defineComponent({\n  name: 'ElCarousel',\n  components: {\n    ElIcon,\n    ArrowLeft,\n    ArrowRight,\n  },\n  props: {\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  },\n  emits: ['change'],\n  setup(props: ICarouselProps, { emit }) {\n    // data\n    const data = reactive<{\n      activeIndex: number\n      containerWidth: number\n      timer: null | ReturnType<typeof setInterval>\n      hover: boolean\n    }>({\n      activeIndex: -1,\n      containerWidth: 0,\n      timer: null,\n      hover: false,\n    })\n\n    // refs\n    const root = ref(null)\n    const items = ref<CarouselItem[]>([])\n\n    // computed\n    const arrowDisplay = computed(\n      () => props.arrow !== 'never' && props.direction !== 'vertical'\n    )\n\n    const hasLabel = computed(() => {\n      return items.value.some((item) => item.label.toString().length > 0)\n    })\n\n    const carouselClasses = computed(() => {\n      const classes = ['el-carousel', `el-carousel--${props.direction}`]\n      if (props.type === 'card') {\n        classes.push('el-carousel--card')\n      }\n      return classes\n    })\n\n    const indicatorsClasses = computed(() => {\n      const classes = [\n        'el-carousel__indicators',\n        `el-carousel__indicators--${props.direction}`,\n      ]\n      if (hasLabel.value) {\n        classes.push('el-carousel__indicators--labels')\n      }\n      if (props.indicatorPosition === 'outside' || props.type === 'card') {\n        classes.push('el-carousel__indicators--outside')\n      }\n      return classes\n    })\n\n    // methods\n    const throttledArrowClick = throttle(\n      (index) => {\n        setActiveItem(index)\n      },\n      300,\n      { trailing: true }\n    )\n\n    const throttledIndicatorHover = throttle((index) => {\n      handleIndicatorHover(index)\n    }, 300)\n\n    function pauseTimer() {\n      if (data.timer) {\n        clearInterval(data.timer)\n        data.timer = null\n      }\n    }\n\n    function startTimer() {\n      if (props.interval <= 0 || !props.autoplay || data.timer) return\n      data.timer = setInterval(() => playSlides(), props.interval)\n    }\n\n    const playSlides = () => {\n      if (data.activeIndex < items.value.length - 1) {\n        data.activeIndex = data.activeIndex + 1\n      } else if (props.loop) {\n        data.activeIndex = 0\n      }\n    }\n\n    function setActiveItem(index) {\n      if (typeof index === 'string') {\n        const filteredItems = items.value.filter((item) => item.name === index)\n        if (filteredItems.length > 0) {\n          index = items.value.indexOf(filteredItems[0])\n        }\n      }\n      index = Number(index)\n      if (isNaN(index) || index !== Math.floor(index)) {\n        debugWarn('Carousel', 'index must be an integer.')\n        return\n      }\n      const length = items.value.length\n      const oldIndex = data.activeIndex\n      if (index < 0) {\n        data.activeIndex = props.loop ? length - 1 : 0\n      } else if (index >= length) {\n        data.activeIndex = props.loop ? 0 : length - 1\n      } else {\n        data.activeIndex = index\n      }\n      if (oldIndex === data.activeIndex) {\n        resetItemPosition(oldIndex)\n      }\n    }\n\n    function resetItemPosition(oldIndex) {\n      items.value.forEach((item, index) => {\n        item.translateItem(index, data.activeIndex, oldIndex)\n      })\n    }\n\n    function addItem(item) {\n      items.value.push(item)\n    }\n\n    function removeItem(uid) {\n      const index = items.value.findIndex((item) => item.uid === uid)\n      if (index !== -1) {\n        items.value.splice(index, 1)\n        if (data.activeIndex === index) next()\n      }\n    }\n\n    function itemInStage(item, index) {\n      const length = items.value.length\n      if (\n        (index === length - 1 && item.inStage && items.value[0].active) ||\n        (item.inStage &&\n          items.value[index + 1] &&\n          items.value[index + 1].active)\n      ) {\n        return 'left'\n      } else if (\n        (index === 0 && item.inStage && items.value[length - 1].active) ||\n        (item.inStage &&\n          items.value[index - 1] &&\n          items.value[index - 1].active)\n      ) {\n        return 'right'\n      }\n      return false\n    }\n\n    function handleMouseEnter() {\n      data.hover = true\n      if (props.pauseOnHover) {\n        pauseTimer()\n      }\n    }\n\n    function handleMouseLeave() {\n      data.hover = false\n      startTimer()\n    }\n\n    function handleButtonEnter(arrow) {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item, index) => {\n        if (arrow === itemInStage(item, index)) {\n          item.hover = true\n        }\n      })\n    }\n\n    function handleButtonLeave() {\n      if (props.direction === 'vertical') return\n      items.value.forEach((item) => {\n        item.hover = false\n      })\n    }\n\n    function handleIndicatorClick(index) {\n      data.activeIndex = index\n    }\n\n    function handleIndicatorHover(index) {\n      if (props.trigger === 'hover' && index !== data.activeIndex) {\n        data.activeIndex = index\n      }\n    }\n\n    function prev() {\n      setActiveItem(data.activeIndex - 1)\n    }\n\n    function next() {\n      setActiveItem(data.activeIndex + 1)\n    }\n\n    // watch\n    watch(\n      () => data.activeIndex,\n      (current, prev) => {\n        resetItemPosition(prev)\n        if (prev > -1) {\n          emit('change', current, prev)\n        }\n      }\n    )\n    watch(\n      () => props.autoplay,\n      (current) => {\n        current ? startTimer() : pauseTimer()\n      }\n    )\n    watch(\n      () => props.loop,\n      () => {\n        setActiveItem(data.activeIndex)\n      }\n    )\n\n    // lifecycle\n    onMounted(() => {\n      nextTick(() => {\n        addResizeListener(root.value, resetItemPosition)\n        if (\n          props.initialIndex < items.value.length &&\n          props.initialIndex >= 0\n        ) {\n          data.activeIndex = props.initialIndex\n        }\n        startTimer()\n      })\n    })\n\n    onBeforeUnmount(() => {\n      if (root.value) removeResizeListener(root.value, resetItemPosition)\n      pauseTimer()\n    })\n\n    // provide\n    provide<InjectCarouselScope>('injectCarouselScope', {\n      root,\n      direction: props.direction,\n      type: props.type,\n      items,\n      loop: props.loop,\n      addItem,\n      removeItem,\n      setActiveItem,\n    })\n\n    return {\n      data,\n      props,\n      items,\n\n      arrowDisplay,\n      carouselClasses,\n      indicatorsClasses,\n      hasLabel,\n\n      handleMouseEnter,\n      handleMouseLeave,\n      handleIndicatorClick,\n      throttledArrowClick,\n      throttledIndicatorHover,\n      handleButtonEnter,\n      handleButtonLeave,\n\n      prev,\n      next,\n      setActiveItem,\n\n      root,\n    }\n  },\n})\n</script>\n"],"names":["_createElementVNode","_createVNode","_withCtx"],"mappings":";;;;;;;;qBAwDgB,KAAK;;;;;;;;wBAvDnB;IACE;;IAECA;;;;MAGI,KAAK;WAAgC;;OACtB;4BAAlB;;YAAgC,IAAI,EAAC;;;;;;;;gBAUhCC;;;;;;;;;;;;;;;;;;;;;YAO2B,4BAA2B;;8BACzD;;;qBAMO,EAACC;gBACLD,eAAU;gBACV;;;gBAGD;;uBACE;;;;;;;;;;;;;;;;;;;;;;qCAON;;;;;;;0CAQe;;;;;;"}

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

@@ -3416,7 +3416,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
         $data: {};
         $props: Partial<{
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             label: string;
@@ -3459,7 +3459,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
             readonly inputStyle?: unknown;
         } & {
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             form: string;
@@ -3530,7 +3530,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
             readonly inputStyle?: unknown;
         } & {
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             form: string;
@@ -3569,7 +3569,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
             input: import("vue").Ref<HTMLInputElement | undefined>;
             textarea: import("vue").Ref<HTMLTextAreaElement | undefined>;
             attrs: import("vue").ComputedRef<Record<string, unknown>>;
-            inputSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
+            inputSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
             validateState: import("vue").ComputedRef<string>;
             validateIcon: import("vue").ComputedRef<any>;
             containerStyle: import("vue").ComputedRef<import("element-plus/es/utils/types").StyleValue>;
@@ -3615,7 +3615,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
             compositionend: (evt: CompositionEvent) => boolean;
         }, string, {
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             label: string;
@@ -3678,7 +3678,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
         readonly inputStyle?: unknown;
     } & {
         type: string;
-        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
         disabled: boolean;
         modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
         form: string;
@@ -3717,7 +3717,7 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
         input: import("vue").Ref<HTMLInputElement | undefined>;
         textarea: import("vue").Ref<HTMLTextAreaElement | undefined>;
         attrs: import("vue").ComputedRef<Record<string, unknown>>;
-        inputSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
+        inputSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
         validateState: import("vue").ComputedRef<string>;
         validateIcon: import("vue").ComputedRef<any>;
         containerStyle: import("vue").ComputedRef<import("element-plus/es/utils/types").StyleValue>;
@@ -4299,8 +4299,8 @@ declare const _Cascader: SFCWithInstall<import("vue").DefineComponent<{
     suggestions: import("vue").Ref<import("../cascader-panel/src/node").default[]>;
     isDisabled: import("vue").ComputedRef<boolean | undefined>;
     isOnComposition: import("vue").Ref<boolean>;
-    realSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
-    tagSize: import("vue").ComputedRef<"small" | "mini">;
+    realSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
+    tagSize: import("vue").ComputedRef<"default" | "small">;
     multiple: import("vue").ComputedRef<boolean>;
     readonly: import("vue").ComputedRef<boolean>;
     clearBtnVisible: import("vue").ComputedRef<boolean>;
@@ -7794,7 +7794,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
         $data: {};
         $props: Partial<{
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             label: string;
@@ -7837,7 +7837,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
             readonly inputStyle?: unknown;
         } & {
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             form: string;
@@ -7908,7 +7908,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
             readonly inputStyle?: unknown;
         } & {
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             form: string;
@@ -7947,7 +7947,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
             input: import("vue").Ref<HTMLInputElement | undefined>;
             textarea: import("vue").Ref<HTMLTextAreaElement | undefined>;
             attrs: import("vue").ComputedRef<Record<string, unknown>>;
-            inputSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
+            inputSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
             validateState: import("vue").ComputedRef<string>;
             validateIcon: import("vue").ComputedRef<any>;
             containerStyle: import("vue").ComputedRef<import("element-plus/es/utils/types").StyleValue>;
@@ -7993,7 +7993,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
             compositionend: (evt: CompositionEvent) => boolean;
         }, string, {
             type: string;
-            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             label: string;
@@ -8056,7 +8056,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
         readonly inputStyle?: unknown;
     } & {
         type: string;
-        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+        size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
         disabled: boolean;
         modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
         form: string;
@@ -8095,7 +8095,7 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
         input: import("vue").Ref<HTMLInputElement | undefined>;
         textarea: import("vue").Ref<HTMLTextAreaElement | undefined>;
         attrs: import("vue").ComputedRef<Record<string, unknown>>;
-        inputSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
+        inputSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
         validateState: import("vue").ComputedRef<string>;
         validateIcon: import("vue").ComputedRef<any>;
         containerStyle: import("vue").ComputedRef<import("element-plus/es/utils/types").StyleValue>;
@@ -8677,8 +8677,8 @@ export declare const ElCascader: SFCWithInstall<import("vue").DefineComponent<{
     suggestions: import("vue").Ref<import("../cascader-panel/src/node").default[]>;
     isDisabled: import("vue").ComputedRef<boolean | undefined>;
     isOnComposition: import("vue").Ref<boolean>;
-    realSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
-    tagSize: import("vue").ComputedRef<"small" | "mini">;
+    realSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
+    tagSize: import("vue").ComputedRef<"default" | "small">;
     multiple: import("vue").ComputedRef<boolean>;
     readonly: import("vue").ComputedRef<boolean>;
     clearBtnVisible: import("vue").ComputedRef<boolean>;

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/components/cascader/index.ts"],"sourcesContent":["import Cascader from './src/index.vue'\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nCascader.install = (app: App): void => {\n  app.component(Cascader.name, Cascader)\n}\n\nconst _Cascader = Cascader as SFCWithInstall<typeof Cascader>\n\nexport default _Cascader\nexport const ElCascader = _Cascader\n"],"names":["Cascader"],"mappings":";;;;;;;AAIAA,0CAAS,UAAU,CAAC,QAAmB;AACrC,MAAI,UAAUA,0CAAS,MAAMA;AAAA;MAGzB,YAAYA;MAGL,aAAa;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/cascader/index.ts"],"sourcesContent":["import Cascader from './src/index.vue'\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nCascader.install = (app: App): void => {\n  app.component(Cascader.name, Cascader)\n}\n\nconst _Cascader = Cascader as SFCWithInstall<typeof Cascader>\n\nexport default _Cascader\nexport const ElCascader = _Cascader\n"],"names":["Cascader"],"mappings":";;;;;;;AACAA,yCAAQ,CAAC,OAAO,GAAG,CAAC,GAAG,KAAK;AAC5B,EAAE,GAAG,CAAC,SAAS,CAACA,yCAAQ,CAAC,IAAI,EAAEA,yCAAQ,CAAC,CAAC;AACzC,CAAC,CAAC;AACG,MAAC,SAAS,GAAGA,0CAAS;AAEf,MAAC,UAAU,GAAG;;;;;"}

package/lib/components/cascader/src/index.vue.d.ts

@@ -3421,7 +3421,7 @@ declare const _default: import("vue").DefineComponent<{
         $data: {};
         $props: Partial<{
             type: string;
-            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             label: string;
@@ -3464,7 +3464,7 @@ declare const _default: import("vue").DefineComponent<{
             readonly inputStyle?: unknown;
         } & {
             type: string;
-            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             form: string;
@@ -3535,7 +3535,7 @@ declare const _default: import("vue").DefineComponent<{
             readonly inputStyle?: unknown;
         } & {
             type: string;
-            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             form: string;
@@ -3574,7 +3574,7 @@ declare const _default: import("vue").DefineComponent<{
             input: Ref<HTMLInputElement | undefined>;
             textarea: Ref<HTMLTextAreaElement | undefined>;
             attrs: ComputedRef<Record<string, unknown>>;
-            inputSize: ComputedRef<"" | ComponentSize>;
+            inputSize: ComputedRef<ComponentSize>;
             validateState: ComputedRef<string>;
             validateIcon: ComputedRef<any>;
             containerStyle: ComputedRef<import("element-plus/es/utils/types").StyleValue>;
@@ -3620,7 +3620,7 @@ declare const _default: import("vue").DefineComponent<{
             compositionend: (evt: CompositionEvent) => boolean;
         }, string, {
             type: string;
-            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+            size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
             disabled: boolean;
             modelValue: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
             label: string;
@@ -3683,7 +3683,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly inputStyle?: unknown;
     } & {
         type: string;
-        size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", never>;
+        size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "default" | "large", never>;
         disabled: boolean;
         modelValue: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
         form: string;
@@ -3722,7 +3722,7 @@ declare const _default: import("vue").DefineComponent<{
         input: Ref<HTMLInputElement | undefined>;
         textarea: Ref<HTMLTextAreaElement | undefined>;
         attrs: ComputedRef<Record<string, unknown>>;
-        inputSize: ComputedRef<"" | ComponentSize>;
+        inputSize: ComputedRef<ComponentSize>;
         validateState: ComputedRef<string>;
         validateIcon: ComputedRef<any>;
         containerStyle: ComputedRef<import("element-plus/es/utils/types").StyleValue>;
@@ -4304,8 +4304,8 @@ declare const _default: import("vue").DefineComponent<{
     suggestions: Ref<CascaderNode[]>;
     isDisabled: ComputedRef<boolean | undefined>;
     isOnComposition: Ref<boolean>;
-    realSize: ComputedRef<"" | ComponentSize>;
-    tagSize: ComputedRef<"small" | "mini">;
+    realSize: ComputedRef<ComponentSize>;
+    tagSize: ComputedRef<"default" | "small">;
     multiple: ComputedRef<boolean>;
     readonly: ComputedRef<boolean>;
     clearBtnVisible: ComputedRef<boolean>;

package/lib/components/cascader/src/index.vue_vue_type_script_lang.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var vue = require('vue');
 var shared = require('@vue/shared');
 var debounce = require('lodash/debounce');
+var core = require('@vueuse/core');
 var index = require('../../cascader-panel/index.js');
 var index$1 = require('../../input/index.js');
 var index$2 = require('../../popper/index.js');
@@ -16,7 +17,6 @@ require('../../../directives/index.js');
 require('../../../hooks/index.js');
 var aria = require('../../../utils/aria.js');
 var constants = require('../../../utils/constants.js');
-var isServer = require('../../../utils/isServer.js');
 var resizeEvent = require('../../../utils/resize-event.js');
 var validators = require('../../../utils/validators.js');
 var isDef = require('../../../utils/isDef.js');
@@ -34,9 +34,9 @@ var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
 
 const DEFAULT_INPUT_HEIGHT = 40;
 const INPUT_HEIGHT_MAP = {
-  medium: 36,
-  small: 32,
-  mini: 28
+  large: 36,
+  default: 32,
+  small: 28
 };
 const popperOptions = {
   modifiers: [
@@ -143,7 +143,7 @@ var script = vue.defineComponent({
     const isDisabled = vue.computed(() => props.disabled || elForm.disabled);
     const inputPlaceholder = vue.computed(() => props.placeholder || t("el.cascader.placeholder"));
     const realSize = index$8.useSize();
-    const tagSize = vue.computed(() => ["small", "mini"].includes(realSize.value) ? "mini" : "small");
+    const tagSize = vue.computed(() => ["small"].includes(realSize.value) ? "small" : "default");
     const multiple = vue.computed(() => !!props.props.multiple);
     const readonly = vue.computed(() => !props.filterable || multiple.value);
     const searchKeyword = vue.computed(() => multiple.value ? searchInputValue.value : inputValue.value);
@@ -278,7 +278,7 @@ var script = vue.defineComponent({
       const inputInner = (_a = input.value) == null ? void 0 : _a.input;
       const tagWrapperEl = tagWrapper.value;
       const suggestionPanelEl = (_b = suggestionPanel.value) == null ? void 0 : _b.$el;
-      if (isServer["default"] || !inputInner)
+      if (!core.isClient || !inputInner)
         return;
       if (suggestionPanelEl) {
         const suggestionList = suggestionPanelEl.querySelector(".el-cascader__suggestion-list");