element-plus/es/components/carousel/src/carousel-item2.mjs.map

A Component Library for Vue 3

{"version":3,"file":"carousel-item2.mjs","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  computed,\n  getCurrentInstance,\n  inject,\n  onMounted,\n  onUnmounted,\n  reactive,\n  ref,\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":[],"mappings":"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"}