c306d78ddda4a2b146c573b60e83a25f10db24b24db9080aff4bc9ca76b36227325b0511dc442b57d5807fcb85e373195025942df9b8b4c1530e8c107e4929 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var constants = require('./constants.js');
  5. var types = require('../../../utils/types.js');
  6. const useCarouselItem = (props) => {
  7. const carouselContext = vue.inject(constants.carouselContextKey);
  8. const instance = vue.getCurrentInstance();
  9. const carouselItemRef = vue.ref();
  10. const hover = vue.ref(false);
  11. const translate = vue.ref(0);
  12. const scale = vue.ref(1);
  13. const active = vue.ref(false);
  14. const ready = vue.ref(false);
  15. const inStage = vue.ref(false);
  16. const animating = vue.ref(false);
  17. const { isCardType, isVertical, cardScale } = carouselContext;
  18. function processIndex(index, activeIndex, length) {
  19. const lastItemIndex = length - 1;
  20. const prevItemIndex = activeIndex - 1;
  21. const nextItemIndex = activeIndex + 1;
  22. const halfItemIndex = length / 2;
  23. if (activeIndex === 0 && index === lastItemIndex) {
  24. return -1;
  25. } else if (activeIndex === lastItemIndex && index === 0) {
  26. return length;
  27. } else if (index < prevItemIndex && activeIndex - index >= halfItemIndex) {
  28. return length + 1;
  29. } else if (index > nextItemIndex && index - activeIndex >= halfItemIndex) {
  30. return -2;
  31. }
  32. return index;
  33. }
  34. function calcCardTranslate(index, activeIndex) {
  35. var _a, _b;
  36. const parentWidth = vue.unref(isVertical) ? ((_a = carouselContext.root.value) == null ? void 0 : _a.offsetHeight) || 0 : ((_b = carouselContext.root.value) == null ? void 0 : _b.offsetWidth) || 0;
  37. if (inStage.value) {
  38. return parentWidth * ((2 - cardScale) * (index - activeIndex) + 1) / 4;
  39. } else if (index < activeIndex) {
  40. return -(1 + cardScale) * parentWidth / 4;
  41. } else {
  42. return (3 + cardScale) * parentWidth / 4;
  43. }
  44. }
  45. function calcTranslate(index, activeIndex, isVertical2) {
  46. const rootEl = carouselContext.root.value;
  47. if (!rootEl)
  48. return 0;
  49. const distance = (isVertical2 ? rootEl.offsetHeight : rootEl.offsetWidth) || 0;
  50. return distance * (index - activeIndex);
  51. }
  52. const translateItem = (index, activeIndex, oldIndex) => {
  53. var _a;
  54. const _isCardType = vue.unref(isCardType);
  55. const carouselItemLength = (_a = carouselContext.items.value.length) != null ? _a : Number.NaN;
  56. const isActive = index === activeIndex;
  57. if (!_isCardType && !types.isUndefined(oldIndex)) {
  58. animating.value = isActive || index === oldIndex;
  59. }
  60. if (!isActive && carouselItemLength > 2 && carouselContext.loop) {
  61. index = processIndex(index, activeIndex, carouselItemLength);
  62. }
  63. const _isVertical = vue.unref(isVertical);
  64. active.value = isActive;
  65. if (_isCardType) {
  66. inStage.value = Math.round(Math.abs(index - activeIndex)) <= 1;
  67. translate.value = calcCardTranslate(index, activeIndex);
  68. scale.value = vue.unref(active) ? 1 : cardScale;
  69. } else {
  70. translate.value = calcTranslate(index, activeIndex, _isVertical);
  71. }
  72. ready.value = true;
  73. if (isActive && carouselItemRef.value) {
  74. carouselContext.setContainerHeight(carouselItemRef.value.offsetHeight);
  75. }
  76. };
  77. function handleItemClick() {
  78. if (carouselContext && vue.unref(isCardType)) {
  79. const index = carouselContext.items.value.findIndex(({ uid }) => uid === instance.uid);
  80. carouselContext.setActiveItem(index);
  81. }
  82. }
  83. const carouselItemContext = {
  84. props,
  85. states: vue.reactive({
  86. hover,
  87. translate,
  88. scale,
  89. active,
  90. ready,
  91. inStage,
  92. animating
  93. }),
  94. uid: instance.uid,
  95. getVnode: () => instance.vnode,
  96. translateItem
  97. };
  98. carouselContext.addItem(carouselItemContext);
  99. vue.onBeforeUnmount(() => {
  100. carouselContext.removeItem(carouselItemContext);
  101. });
  102. return {
  103. carouselItemRef,
  104. active,
  105. animating,
  106. hover,
  107. inStage,
  108. isVertical,
  109. translate,
  110. isCardType,
  111. scale,
  112. ready,
  113. handleItemClick
  114. };
  115. };
  116. exports.useCarouselItem = useCarouselItem;
  117. //# sourceMappingURL=use-carousel-item.js.map