react-spring-carousel 3.0.0-beta053 → 3.0.0-beta054

package/dist/esm/useSpringCarousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSpringCarousel.js","sources":["../../src/useSpringCarousel.tsx"],"sourcesContent":["import { config, useSpring } from '@react-spring/web'\nimport React, {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n} from 'react'\n\nimport { useEventsModule } from './modules/useEventsModule'\nimport { useDrag } from '@use-gesture/react'\nimport { useFullscreenModule } from './modules/useFullscreenModule'\nimport { useThumbsModule } from './modules/useThumbsModule'\nimport {\n  SlideActionType,\n  SlideMode,\n  UseSpringCarouselComplete,\n  SpringCarouselWithThumbs,\n  UseSpringCarouselWithFreeScroll,\n  UseSpringCarouselWithThumbs,\n  UseSpringCarouselWithNoThumbs,\n  UseSpringCarouselWithNoFixedItems,\n  UseSpringCarouselWithFixedItems,\n  UseSpringFreeScrollReturnType,\n  UseSpringReturnType,\n  SlideType,\n} from './types'\n\ntype ReturnType<T> = T extends true ? UseSpringFreeScrollReturnType : UseSpringReturnType\n\n/**\n * With free scroll\n */\nfunction useSpringCarousel(props: UseSpringCarouselWithFreeScroll): ReturnType<true>\nfunction useSpringCarousel(props: UseSpringCarouselWithThumbs<true>): ReturnType<true>\nfunction useSpringCarousel(props: UseSpringCarouselWithNoThumbs<true>): ReturnType<true>\n/**\n * No free scroll\n */\nfunction useSpringCarousel(props: UseSpringCarouselWithThumbs<false>): ReturnType<false>\nfunction useSpringCarousel(props: UseSpringCarouselWithNoThumbs<false>): ReturnType<false>\nfunction useSpringCarousel(\n  props: UseSpringCarouselWithFixedItems<false>,\n): ReturnType<false>\nfunction useSpringCarousel(\n  props: UseSpringCarouselWithNoFixedItems<false>,\n): ReturnType<false>\n\nfunction useSpringCarousel({\n  items,\n  init = true,\n  withThumbs,\n  thumbsSlideAxis = 'x',\n  itemsPerSlide: _itemsPerSlide = 1,\n  slideType = 'fixed',\n  gutter = 0,\n  withLoop = false,\n  startEndGutter = 0,\n  carouselSlideAxis = 'x',\n  disableGestures = false,\n  draggingSlideTreshold: _draggingSlideTreshold,\n  slideWhenThresholdIsReached = false,\n  freeScroll,\n  enableFreeScrollDrag,\n  initialStartingPosition,\n  prepareThumbsData,\n  initialActiveItem = 0,\n  animateWhenActiveItemChange = true,\n}: UseSpringCarouselComplete): ReturnType<typeof freeScroll> {\n  const resizeByPropChange = useRef(false)\n  const itemsPerSlide = _itemsPerSlide > items.length ? items.length : _itemsPerSlide\n  const prevWindowWidth = useRef(0)\n  const draggingSlideTreshold = useRef(_draggingSlideTreshold ?? 0)\n  const slideActionType = useRef<SlideActionType>('initial')\n  const slideModeType = useRef<SlideMode>('initial')\n  const prevSlidedValue = useRef(0)\n  const [spring, setSpring] = useSpring(\n    () => ({\n      val: 0,\n      pause: !init,\n      onChange: ({ value }) => {\n        if (freeScroll && mainCarouselWrapperRef.current) {\n          if (carouselSlideAxis === 'x') {\n            mainCarouselWrapperRef.current.scrollLeft = Math.abs(value.val)\n          } else {\n            mainCarouselWrapperRef.current.scrollTop = Math.abs(value.val)\n          }\n          setStartEndItemReachedOnFreeScroll()\n        } else if (carouselTrackWrapperRef.current) {\n          if (carouselSlideAxis === 'x') {\n            carouselTrackWrapperRef.current.style.transform = `translate3d(${value.val}px, 0px,0px)`\n          } else {\n            carouselTrackWrapperRef.current.style.transform = `translate3d(0px,${value.val}px,0px)`\n          }\n        }\n      },\n    }),\n    [freeScroll],\n  )\n  const activeItem = useRef(initialActiveItem)\n  const firstItemReached = useRef(initialActiveItem === 0)\n  const lastItemReached = useRef(false)\n  const mainCarouselWrapperRef = useRef<HTMLDivElement | null>(null)\n  const carouselTrackWrapperRef = useRef<HTMLDivElement | null>(null)\n\n  const prevWithLoop = useRef(withLoop)\n  const prevSlideType = useRef(slideType)\n  const prevFreeScroll = useRef(freeScroll)\n\n  const getItems = useCallback(() => {\n    if (withLoop) {\n      return [\n        ...items.map(i => ({\n          ...i,\n          id: `prev-repeated-item-${i.id}`,\n        })),\n        ...items,\n        ...items.map(i => ({\n          ...i,\n          id: `next-repeated-item-${i.id}`,\n        })),\n      ]\n    }\n    return [...items]\n  }, [items, withLoop])\n  const internalItems = getItems()\n\n  const { emitEvent, useListenToCustomEvent } = useEventsModule<'use-spring'>()\n  const { thumbsFragment, handleScroll } = useThumbsModule({\n    withThumbs: !!withThumbs,\n    thumbsSlideAxis,\n    prepareThumbsData,\n    items: items as SpringCarouselWithThumbs['items'],\n  })\n  const { enterFullscreen, exitFullscreen, getIsFullscreen } = useFullscreenModule({\n    mainCarouselWrapperRef,\n    handleResize: () => adjustCarouselWrapperPosition(),\n    onFullScreenChange: val => {\n      emitEvent({\n        eventName: 'onFullscreenChange',\n        isFullscreen: val,\n      })\n    },\n  })\n\n  function getItemStyles(isLastItem: boolean) {\n    if (slideType === 'fixed' && !freeScroll) {\n      return {\n        marginRight: `${isLastItem ? 0 : gutter}px`,\n        flex: `1 0 calc(100% / ${itemsPerSlide} - ${\n          (gutter * (itemsPerSlide - 1)) / itemsPerSlide\n        }px)`,\n      }\n    }\n    return {\n      ...{ marginRight: `${isLastItem ? 0 : gutter}px` },\n    }\n  }\n\n  function getSlideValue() {\n    const carouselItem = mainCarouselWrapperRef.current?.querySelector(\n      '.use-spring-carousel-item',\n    )\n\n    if (!carouselItem) {\n      throw Error('No carousel items available!')\n    }\n\n    return (\n      carouselItem.getBoundingClientRect()[\n        carouselSlideAxis === 'x' ? 'width' : 'height'\n      ] + gutter\n    )\n  }\n\n  type SlideToItem = {\n    from: number\n    to: number\n    nextActiveItem?: number\n    immediate?: boolean\n    slideMode: SlideMode\n  }\n\n  function slideToItem({\n    from,\n    to,\n    nextActiveItem,\n    immediate = false,\n    slideMode,\n  }: SlideToItem) {\n    slideModeType.current = slideMode\n\n    if (typeof nextActiveItem === 'number') {\n      if (!freeScroll) {\n        activeItem.current = nextActiveItem\n      }\n      emitEvent({\n        eventName: 'onSlideStartChange',\n        slideActionType: slideActionType.current,\n        slideMode: slideModeType.current,\n        nextItem: {\n          startReached: firstItemReached.current,\n          endReached: lastItemReached.current,\n          index: freeScroll ? -1 : activeItem.current,\n          id: freeScroll ? '' : items[activeItem.current].id,\n        },\n      })\n    }\n\n    prevSlidedValue.current = to\n    setSpring.start({\n      immediate,\n      from: {\n        val: from,\n      },\n      to: {\n        val: to,\n      },\n      config: {\n        ...config.default,\n        velocity: spring.val.velocity,\n      },\n      onRest(value) {\n        if (!immediate && value.finished) {\n          emitEvent({\n            eventName: 'onSlideChange',\n            slideActionType: slideActionType.current,\n            slideMode: slideModeType.current,\n            currentItem: {\n              startReached: firstItemReached.current,\n              endReached: lastItemReached.current,\n              index: freeScroll ? -1 : activeItem.current,\n              id: freeScroll ? '' : items[activeItem.current].id,\n            },\n          })\n        }\n      },\n    })\n    if (withThumbs && !immediate) {\n      handleScroll(activeItem.current)\n    }\n  }\n  function getTotalScrollValue() {\n    if (withLoop) {\n      return getSlideValue() * items.length\n    }\n    return Math.round(\n      Number(\n        carouselTrackWrapperRef.current?.[\n          carouselSlideAxis === 'x' ? 'scrollWidth' : 'scrollHeight'\n        ],\n      ) -\n        carouselTrackWrapperRef.current!.getBoundingClientRect()[\n          carouselSlideAxis === 'x' ? 'width' : 'height'\n        ] -\n        startEndGutter * 2,\n    )\n  }\n  function getAnimatedWrapperStyles() {\n    const percentValue = `calc(100% - ${startEndGutter * 2}px)`\n    return {\n      width: carouselSlideAxis === 'x' ? percentValue : '100%',\n      height: carouselSlideAxis === 'y' ? percentValue : '100%',\n    }\n  }\n\n  function getCarouselItemWidth() {\n    const carouselItem = carouselTrackWrapperRef.current?.querySelector(\n      '.use-spring-carousel-item',\n    )\n    if (!carouselItem) {\n      throw Error('No carousel items available!')\n    }\n    return (\n      carouselItem.getBoundingClientRect()[\n        carouselSlideAxis === 'x' ? 'width' : 'height'\n      ] + gutter\n    )\n  }\n  function adjustCarouselWrapperPosition() {\n    const positionProperty = carouselSlideAxis === 'x' ? 'left' : 'top'\n\n    function setPosition(v: number) {\n      const ref = carouselTrackWrapperRef.current\n      if (!ref) return\n\n      if (withLoop) {\n        ref.style.top = '0px'\n        ref.style.left = '0px'\n        ref.style[positionProperty] = `-${v - startEndGutter}px`\n\n        firstItemReached.current = false\n        lastItemReached.current = false\n      } else {\n        ref.style.left = '0px'\n        ref.style.top = '0px'\n      }\n    }\n\n    if (initialStartingPosition === 'center') {\n      setPosition(\n        getCarouselItemWidth() * items.length -\n          getSlideValue() * Math.round((itemsPerSlide - 1) / 2),\n      )\n    } else if (initialStartingPosition === 'end') {\n      setPosition(\n        getCarouselItemWidth() * items.length -\n          getSlideValue() * Math.round(itemsPerSlide - 1),\n      )\n    } else {\n      setPosition(getCarouselItemWidth() * items.length)\n    }\n\n    const currentFromValue = Math.abs(getFromValue())\n    if (\n      currentFromValue < getTotalScrollValue() &&\n      slideType === 'fluid' &&\n      lastItemReached.current &&\n      !withLoop\n    ) {\n      lastItemReached.current = false\n    }\n\n    if (!freeScroll && slideType === 'fixed') {\n      const nextValue = -(getSlideValue() * activeItem.current)\n\n      if (Math.abs(nextValue) > getTotalScrollValue() && !withLoop) {\n        const val = -getTotalScrollValue()\n        lastItemReached.current = true\n        prevSlidedValue.current = val\n        setSpring.start({\n          immediate: true,\n          val: prevSlidedValue.current,\n        })\n      } else {\n        prevSlidedValue.current = nextValue\n        setSpring.start({\n          immediate: true,\n          val: nextValue,\n        })\n      }\n      setTimeout(() => {\n        resizeByPropChange.current = false\n      }, 0)\n    }\n  }\n\n  function getFromValue() {\n    if (freeScroll && mainCarouselWrapperRef.current) {\n      return mainCarouselWrapperRef.current[\n        carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n      ]\n    }\n    return spring.val.get()\n  }\n  function getToValue(type: 'next' | 'prev', index?: number) {\n    if (freeScroll && type === 'next') {\n      const next = prevSlidedValue.current + getSlideValue()\n      if (next > getTotalScrollValue()) {\n        return getTotalScrollValue()\n      }\n      return next\n    }\n\n    if (freeScroll && type === 'prev') {\n      const next = prevSlidedValue.current - getSlideValue()\n      if (next < 0) {\n        return 0\n      }\n      return next\n    }\n\n    if (type === 'next') {\n      if (typeof index === 'number') {\n        return -(index * getSlideValue())\n      }\n      return prevSlidedValue.current - getSlideValue()\n    }\n\n    if (typeof index === 'number') {\n      return -(index * getSlideValue())\n    }\n    return prevSlidedValue.current + getSlideValue()\n  }\n\n  type SlideToPrevNextItem = {\n    type: SlideMode\n    index?: number\n    immediate?: boolean\n  }\n  function slideToPrevItem({ type, index, immediate }: SlideToPrevNextItem) {\n    if (!init || (firstItemReached.current && !withLoop)) return\n\n    slideActionType.current = 'prev'\n    lastItemReached.current = false\n\n    const nextItem = typeof index === 'number' ? index : activeItem.current - 1\n\n    if (!withLoop) {\n      const nextItemWillExceed = freeScroll\n        ? getToValue('prev', index) - getSlideValue() / 3 < 0\n        : getToValue('prev', index) + getSlideValue() / 3 > 0\n\n      if (firstItemReached.current) return\n      if (nextItemWillExceed) {\n        firstItemReached.current = true\n        lastItemReached.current = false\n\n        slideToItem({\n          slideMode: type,\n          from: getFromValue(),\n          to: 0,\n          nextActiveItem: 0,\n          immediate,\n        })\n        return\n      }\n    }\n    if (withLoop && (firstItemReached.current || nextItem < 0)) {\n      firstItemReached.current = false\n      lastItemReached.current = true\n      slideToItem({\n        slideMode: type,\n        from: getFromValue() - getSlideValue() * items.length,\n        to: -(getSlideValue() * items.length) + getSlideValue(),\n        nextActiveItem: items.length - 1,\n        immediate,\n      })\n      return\n    }\n    if (nextItem === 0) {\n      firstItemReached.current = true\n    }\n    if (nextItem === items.length - 1 || nextItem === -1) {\n      lastItemReached.current = true\n    }\n    slideToItem({\n      slideMode: type,\n      from: getFromValue(),\n      to: getToValue('prev', index),\n      nextActiveItem: nextItem,\n      immediate,\n    })\n  }\n  function slideToNextItem({ type, index, immediate }: SlideToPrevNextItem) {\n    if (!init || (lastItemReached.current && !withLoop)) return\n\n    slideActionType.current = 'next'\n    firstItemReached.current = false\n\n    const nextItem = index || activeItem.current + 1\n\n    if (!withLoop) {\n      const nextItemWillExceed =\n        Math.abs(getToValue('next', index)) > getTotalScrollValue() - getSlideValue() / 3\n\n      if (lastItemReached.current) return\n      if (nextItemWillExceed) {\n        firstItemReached.current = false\n        lastItemReached.current = true\n\n        slideToItem({\n          slideMode: type,\n          from: getFromValue(),\n          to: freeScroll ? getTotalScrollValue() : -getTotalScrollValue(),\n          nextActiveItem: nextItem,\n          immediate,\n        })\n        return\n      }\n    }\n    if (withLoop && (lastItemReached.current || nextItem > items.length - 1)) {\n      lastItemReached.current = false\n      firstItemReached.current = true\n      slideToItem({\n        slideMode: type,\n        from: getFromValue() + getSlideValue() * items.length,\n        to: 0,\n        nextActiveItem: 0,\n        immediate,\n      })\n      return\n    }\n    if (nextItem === 0) {\n      firstItemReached.current = true\n    }\n    if (nextItem === items.length - 1) {\n      lastItemReached.current = true\n    }\n    slideToItem({\n      slideMode: type,\n      from: getFromValue(),\n      to: getToValue('next', index),\n      nextActiveItem: nextItem,\n      immediate,\n    })\n  }\n  function getDraggingSliderTreshold() {\n    if (_draggingSlideTreshold) {\n      draggingSlideTreshold.current = _draggingSlideTreshold\n    } else {\n      draggingSlideTreshold.current = Math.floor(getSlideValue() / 2 / 2)\n    }\n    return draggingSlideTreshold.current\n  }\n\n  useEffect(() => {\n    if (activeItem.current !== initialActiveItem) {\n      internalSlideToItem({\n        id: initialActiveItem,\n        immediate: !animateWhenActiveItemChange,\n      })\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [initialActiveItem])\n  useEffect(() => {\n    if (init) {\n      if (initialActiveItem > items.length - 1) {\n        throw new Error(\n          `initialActiveItem (${initialActiveItem}) is greater than the total quantity available items (${items.length}).`,\n        )\n      }\n      if (itemsPerSlide > items.length) {\n        console.warn(\n          `itemsPerSlide (${itemsPerSlide}) is greater than the total quantity available items (${items.length}). Fallback to ${items.length})`,\n        )\n      }\n    }\n  }, [initialActiveItem, items, itemsPerSlide, init])\n  useEffect(() => {\n    prevWindowWidth.current = window.innerWidth\n  }, [])\n  useEffect(() => {\n    resizeByPropChange.current = true\n    adjustCarouselWrapperPosition()\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [initialStartingPosition, itemsPerSlide, startEndGutter, gutter, init])\n  useEffect(() => {\n    /**\n     * When these props change we reset the carousel\n     */\n    if (\n      withLoop !== prevWithLoop.current ||\n      slideType !== prevSlideType.current ||\n      freeScroll !== prevFreeScroll.current\n    ) {\n      prevWithLoop.current = withLoop\n      prevSlideType.current = slideType\n      prevFreeScroll.current = freeScroll\n\n      if (carouselTrackWrapperRef.current) {\n        carouselTrackWrapperRef.current.style.transform = `translate3d(0px, 0px,0px)`\n        setSpring.start({\n          val: 0,\n          immediate: true,\n        })\n      }\n\n      internalSlideToItem({ id: 0, immediate: true, shouldReset: true })\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [withLoop, slideType, freeScroll])\n  useLayoutEffect(() => {\n    /**\n     * Set initial track position\n     */\n    if (carouselTrackWrapperRef.current) {\n      adjustCarouselWrapperPosition()\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n  useEffect(() => {\n    /**\n     * When itemsPerSlide change we need to update the draggingSlideTreshold.current,\n     * since it's default value is based on the calculation of the\n     * width of a single item\n     */\n    getDraggingSliderTreshold()\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [_draggingSlideTreshold, itemsPerSlide, slideType])\n  useEffect(() => {\n    function handleResize() {\n      if (window.innerWidth === prevWindowWidth.current) return\n      prevWindowWidth.current = window.innerWidth\n      adjustCarouselWrapperPosition()\n    }\n    if ('ResizeObserver' in window && mainCarouselWrapperRef.current) {\n      const observer = new ResizeObserver(() => {\n        if (!resizeByPropChange.current) {\n          prevWindowWidth.current = window.innerWidth\n          adjustCarouselWrapperPosition()\n        }\n      })\n      observer.observe(mainCarouselWrapperRef.current)\n      return () => {\n        observer.disconnect()\n      }\n    } else {\n      window.addEventListener('resize', handleResize)\n      return () => {\n        window.removeEventListener('resize', handleResize)\n      }\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    carouselSlideAxis,\n    initialStartingPosition,\n    itemsPerSlide,\n    withLoop,\n    startEndGutter,\n    gutter,\n    freeScroll,\n    slideType,\n    init,\n  ])\n\n  const bindDrag = useDrag(\n    state => {\n      const isDragging = state.dragging\n      const movement = state.offset[carouselSlideAxis === 'x' ? 0 : 1]\n      const currentMovement = state.movement[carouselSlideAxis === 'x' ? 0 : 1]\n      const direction = state.direction[carouselSlideAxis === 'x' ? 0 : 1]\n\n      const prevItemTreshold = currentMovement > getDraggingSliderTreshold()\n      const nextItemTreshold = currentMovement < -getDraggingSliderTreshold()\n      const tot = getTotalScrollValue()\n\n      if (isDragging) {\n        if (direction > 0) {\n          slideActionType.current = 'prev'\n        } else {\n          slideActionType.current = 'next'\n        }\n\n        emitEvent({\n          ...state,\n          eventName: 'onDrag',\n          slideActionType: slideActionType.current,\n        })\n\n        if (freeScroll) {\n          if (movement > 0) {\n            setSpring.start({\n              from: {\n                val: getFromValue(),\n              },\n              to: {\n                val: 0,\n              },\n              config: {\n                velocity: state.velocity,\n                friction: 50,\n                tension: 1000,\n              },\n            })\n            state.cancel()\n            return\n          }\n\n          setSpring.start({\n            from: {\n              val: getFromValue(),\n            },\n            to: {\n              val: -movement,\n            },\n            config: {\n              velocity: state.velocity,\n              friction: 50,\n              tension: 1000,\n            },\n          })\n          return\n        }\n\n        setSpring.start({\n          val: movement,\n          config: {\n            velocity: state.velocity,\n            friction: 50,\n            tension: 1000,\n          },\n        })\n\n        if (slideWhenThresholdIsReached && nextItemTreshold) {\n          slideToNextItem({ type: 'drag' })\n          state.cancel()\n        } else if (slideWhenThresholdIsReached && prevItemTreshold) {\n          slideToPrevItem({ type: 'drag' })\n          state.cancel()\n        }\n\n        const res = tot - Math.abs(movement)\n\n        if (res < -(getSlideValue() * 2)) {\n          state.cancel()\n        }\n\n        return\n      }\n\n      if (state.last && freeScroll && movement > 0) {\n        setSpring.start({\n          from: {\n            val: getFromValue(),\n          },\n          to: {\n            val: 0,\n          },\n          config: {\n            velocity: state.velocity,\n            friction: 50,\n            tension: 1000,\n          },\n        })\n        return\n      }\n      if (state.last && !state.canceled && freeScroll) {\n        if (slideActionType.current === 'prev') {\n          slideToPrevItem({ type: 'drag' })\n        }\n        if (slideActionType.current === 'next') {\n          slideToNextItem({ type: 'drag' })\n        }\n      }\n\n      if (state.last && !state.canceled && !freeScroll) {\n        if (nextItemTreshold) {\n          if (!withLoop && lastItemReached.current) {\n            setSpring.start({\n              val: -getTotalScrollValue(),\n              config: {\n                ...config.default,\n                velocity: state.velocity,\n              },\n            })\n          } else {\n            slideToNextItem({ type: 'drag' })\n          }\n        } else if (prevItemTreshold) {\n          if (!withLoop && firstItemReached.current) {\n            setSpring.start({\n              val: 0,\n              config: {\n                ...config.default,\n                velocity: state.velocity,\n              },\n            })\n          } else {\n            slideToPrevItem({ type: 'drag' })\n          }\n        } else {\n          setSpring.start({\n            val: prevSlidedValue.current,\n            config: {\n              ...config.default,\n              velocity: state.velocity,\n            },\n          })\n        }\n      }\n      if (state.last && state.canceled) {\n        setSpring.start({\n          val: prevSlidedValue.current,\n          config: {\n            ...config.default,\n            velocity: state.velocity,\n          },\n        })\n      }\n    },\n    {\n      enabled:\n        (init && !disableGestures && !freeScroll) ||\n        (!!freeScroll && !!enableFreeScrollDrag),\n      axis: carouselSlideAxis,\n      from: () => {\n        if (freeScroll && mainCarouselWrapperRef.current) {\n          return [\n            -mainCarouselWrapperRef.current.scrollLeft,\n            -mainCarouselWrapperRef.current.scrollTop,\n          ]\n        }\n        if (carouselSlideAxis === 'x') {\n          return [spring.val.get(), spring.val.get()]\n        }\n        return [spring.val.get(), spring.val.get()]\n      },\n    },\n  )\n\n  function getWrapperOverflowStyles() {\n    if (freeScroll) {\n      if (carouselSlideAxis === 'x') {\n        return {\n          overflowX: 'auto',\n        }\n      }\n      return {\n        overflowY: 'auto',\n      }\n    }\n    return {}\n  }\n\n  function setStartEndItemReachedOnFreeScroll() {\n    if (mainCarouselWrapperRef.current) {\n      prevSlidedValue.current =\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ]\n      if (\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] === 0\n      ) {\n        firstItemReached.current = true\n        lastItemReached.current = false\n      }\n      if (\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] > 0 &&\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] < getTotalScrollValue()\n      ) {\n        firstItemReached.current = false\n        lastItemReached.current = false\n      }\n\n      if (\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] === getTotalScrollValue()\n      ) {\n        firstItemReached.current = false\n        lastItemReached.current = true\n      }\n    }\n  }\n  function getScrollHandlers() {\n    if (freeScroll) {\n      return {\n        onWheel() {\n          spring.val.stop()\n          setStartEndItemReachedOnFreeScroll()\n        },\n      }\n    }\n    return {}\n  }\n\n  function findItemIndex(id: string | number, error?: string) {\n    let itemIndex = 0\n\n    if (typeof id === 'string') {\n      itemIndex = items.findIndex(item => item.id === id)\n    } else {\n      itemIndex = id\n    }\n    if (itemIndex < 0 || itemIndex >= items.length) {\n      if (error) {\n        throw new Error(error)\n      }\n      console.error(\n        `The item doesn't exist; check that the id provided - ${id} - is correct.`,\n      )\n      itemIndex = -1\n    }\n\n    return itemIndex\n  }\n  type InternalSlideToItem = {\n    id: string | number\n    immediate?: boolean\n    shouldReset?: boolean\n    type?: SlideType\n  }\n  function internalSlideToItem({\n    id,\n    immediate,\n    shouldReset,\n    type,\n  }: InternalSlideToItem) {\n    if (!init) return\n\n    firstItemReached.current = false\n    lastItemReached.current = false\n\n    const itemIndex = findItemIndex(\n      id,\n      \"The item you want to slide to doesn't exist; check the provided id.\",\n    )\n\n    if (itemIndex === activeItem.current && !shouldReset) {\n      return\n    }\n\n    const currentItem = findItemIndex(items[activeItem.current].id)\n    const newActiveItem = findItemIndex(items[itemIndex].id)\n\n    if (newActiveItem > currentItem) {\n      slideToNextItem({\n        type: type || shouldReset ? 'initial' : 'click',\n        index: newActiveItem,\n        immediate,\n      })\n    } else {\n      slideToPrevItem({\n        type: type || shouldReset ? 'initial' : 'click',\n        index: newActiveItem,\n        immediate,\n      })\n    }\n  }\n  function getIsNextItem(id: string | number) {\n    const itemIndex = findItemIndex(id, \"The item doesn't exist; check the provided id.\")\n    const _activeItem = activeItem.current\n    if (withLoop && _activeItem === items.length - 1) {\n      return itemIndex === 0\n    }\n    return itemIndex === _activeItem + 1\n  }\n  function getIsPrevItem(id: string | number) {\n    const itemIndex = findItemIndex(id, \"The item doesn't exist; check the provided id.\")\n    const _activeItem = activeItem.current\n    if (withLoop && _activeItem === 0) {\n      return itemIndex === items.length - 1\n    }\n    return itemIndex === _activeItem - 1\n  }\n  function getIsActiveItem(id: string | number) {\n    return (\n      findItemIndex(\n        id,\n        \"The item you want to check doesn't exist; check the provided id.\",\n      ) === activeItem.current\n    )\n  }\n\n  const res = freeScroll\n    ? {\n        useListenToCustomEvent,\n        enterFullscreen,\n        exitFullscreen,\n        getIsFullscreen,\n        slideToPrevItem: () => {\n          slideToPrevItem({\n            type: 'click',\n          })\n        },\n        slideToNextItem: () => {\n          slideToNextItem({\n            type: 'click',\n          })\n        },\n      }\n    : {\n        useListenToCustomEvent,\n        enterFullscreen,\n        exitFullscreen,\n        getIsFullscreen,\n        slideToPrevItem: () => {\n          slideToPrevItem({\n            type: 'click',\n          })\n        },\n        slideToNextItem: () => {\n          slideToNextItem({\n            type: 'click',\n          })\n        },\n        slideToItem: (id: string | number) => internalSlideToItem({ id }),\n        getIsNextItem,\n        getIsPrevItem,\n        getIsActiveItem,\n      }\n\n  const _thumbsFragment = (\n    <Context.Provider value={res}>{thumbsFragment}</Context.Provider>\n  )\n  const carouselFragment = (\n    <Context.Provider value={res}>\n      <div\n        className=\"use-spring-carousel-main-wrapper\"\n        ref={mainCarouselWrapperRef}\n        {...getScrollHandlers()}\n        style={{\n          display: 'flex',\n          position: 'relative',\n          width: '100%',\n          height: '100%',\n          ...(getWrapperOverflowStyles() as React.CSSProperties),\n        }}\n      >\n        <div\n          className=\"use-spring-carousel-track-wrapper\"\n          ref={carouselTrackWrapperRef}\n          {...bindDrag()}\n          style={{\n            position: 'relative',\n            display: 'flex',\n            flexDirection: carouselSlideAxis === 'x' ? 'row' : 'column',\n            touchAction: 'none',\n            ...getAnimatedWrapperStyles(),\n          }}\n        >\n          {(freeScroll || !withLoop) && startEndGutter ? (\n            <div\n              style={{\n                flexShrink: 0,\n                width: startEndGutter,\n              }}\n            />\n          ) : null}\n          {internalItems.map((item, index) => {\n            return (\n              <div\n                key={`${item.id}-${index}`}\n                className=\"use-spring-carousel-item\"\n                data-testid=\"use-spring-carousel-item-wrapper\"\n                style={{\n                  display: 'flex',\n                  position: 'relative',\n                  flex: '1',\n                  ...getItemStyles(!!freeScroll && index === items.length - 1),\n                }}\n              >\n                {typeof item.renderItem === 'function'\n                  ? item.renderItem({\n                      getIsActiveItem,\n                      getIsNextItem,\n                      getIsPrevItem,\n                      useListenToCustomEvent,\n                    })\n                  : item.renderItem}\n              </div>\n            )\n          })}\n          {freeScroll && startEndGutter ? (\n            <div\n              style={{\n                flexShrink: 0,\n                width: startEndGutter,\n              }}\n            />\n          ) : null}\n        </div>\n      </div>\n    </Context.Provider>\n  )\n\n  return { ...res, carouselFragment, thumbsFragment: _thumbsFragment }\n}\n\ntype ContextProps<T = undefined> = Omit<\n  ReturnType<T extends 'free-scroll' ? true : false>,\n  'carouselFragment' | 'thumbsFragment'\n>\n\nconst Context =\n  createContext<ContextProps | ContextProps<'free-scroll'> | undefined>(undefined)\n\nfunction useSpringCarouselContext<T>() {\n  const context = useContext(Context)\n  if (!context) {\n    throw new Error('useSpringCarouselContext must be used within the carousel.')\n  }\n  return context as ContextProps<T>\n}\n\nexport { useSpringCarousel, useSpringCarouselContext }\n"],"names":["useSpringCarousel","items","init","withThumbs","thumbsSlideAxis","itemsPerSlide","_itemsPerSlide","slideType","gutter","withLoop","startEndGutter","carouselSlideAxis","disableGestures","draggingSlideTreshold","_draggingSlideTreshold","slideWhenThresholdIsReached","freeScroll","enableFreeScrollDrag","initialStartingPosition","prepareThumbsData","initialActiveItem","animateWhenActiveItemChange","resizeByPropChange","useRef","length","prevWindowWidth","slideActionType","slideModeType","prevSlidedValue","spring","setSpring","useSpring","val","pause","onChange","value","mainCarouselWrapperRef","current","scrollLeft","Math","abs","scrollTop","setStartEndItemReachedOnFreeScroll","carouselTrackWrapperRef","style","transform","activeItem","firstItemReached","lastItemReached","prevWithLoop","prevSlideType","prevFreeScroll","internalItems","useCallback","map","i","Object","assign","id","getItems","emitEvent","useListenToCustomEvent","useEventsModule","thumbsFragment","handleScroll","useThumbsModule","enterFullscreen","exitFullscreen","getIsFullscreen","useFullscreenModule","handleResize","adjustCarouselWrapperPosition","onFullScreenChange","eventName","isFullscreen","getSlideValue","carouselItem","_a","querySelector","Error","getBoundingClientRect","slideToItem","from","to","nextActiveItem","immediate","slideMode","nextItem","startReached","endReached","index","start","config","default","velocity","onRest","finished","currentItem","getTotalScrollValue","round","Number","getCarouselItemWidth","positionProperty","setPosition","v","ref","top","left","getFromValue","nextValue","setTimeout","get","getToValue","type","next","slideToPrevItem","nextItemWillExceed","slideToNextItem","getDraggingSliderTreshold","floor","useEffect","internalSlideToItem","console","warn","window","innerWidth","shouldReset","useLayoutEffect","observer","ResizeObserver","observe","disconnect","addEventListener","removeEventListener","bindDrag","useDrag","state","isDragging","dragging","movement","offset","currentMovement","direction","prevItemTreshold","nextItemTreshold","tot","friction","tension","cancel","last","canceled","enabled","axis","findItemIndex","error","itemIndex","findIndex","item","newActiveItem","getIsNextItem","_activeItem","getIsPrevItem","getIsActiveItem","res","_thumbsFragment","_jsx","Context","Provider","children","carouselFragment","className","onWheel","stop","display","position","width","height","overflowX","overflowY","_jsxs","flexDirection","touchAction","percentValue","getAnimatedWrapperStyles","flexShrink","flex","isLastItem","marginRight","renderItem","createContext","undefined","useSpringCarouselContext","context","useContext"],"mappings":"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"}
+{"version":3,"file":"useSpringCarousel.js","sources":["../../src/useSpringCarousel.tsx"],"sourcesContent":["import { config, useSpring } from '@react-spring/web'\nimport React, {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n} from 'react'\n\nimport { useEventsModule } from './modules/useEventsModule'\nimport { useDrag } from '@use-gesture/react'\nimport { useFullscreenModule } from './modules/useFullscreenModule'\nimport { useThumbsModule } from './modules/useThumbsModule'\nimport ResizeObserver from 'resize-observer-polyfill'\n\nimport {\n  SlideActionType,\n  SlideMode,\n  UseSpringCarouselComplete,\n  UseSpringCarouselWithFreeScroll,\n  UseSpringCarouselWithThumbs,\n  UseSpringCarouselWithNoThumbs,\n  UseSpringCarouselWithNoFixedItems,\n  UseSpringCarouselWithFixedItems,\n  UseSpringFreeScrollReturnType,\n  UseSpringReturnType,\n  SlideType,\n  ItemWithThumb,\n} from './types'\n\ntype ReturnType<T> = T extends true ? UseSpringFreeScrollReturnType : UseSpringReturnType\n\n/**\n * With free scroll\n */\nfunction useSpringCarousel(props: UseSpringCarouselWithFreeScroll): ReturnType<true>\nfunction useSpringCarousel(props: UseSpringCarouselWithThumbs<true>): ReturnType<true>\nfunction useSpringCarousel(props: UseSpringCarouselWithNoThumbs<true>): ReturnType<true>\n/**\n * No free scroll\n */\nfunction useSpringCarousel(props: UseSpringCarouselWithThumbs<false>): ReturnType<false>\nfunction useSpringCarousel(props: UseSpringCarouselWithNoThumbs<false>): ReturnType<false>\nfunction useSpringCarousel(\n  props: UseSpringCarouselWithFixedItems<false>,\n): ReturnType<false>\nfunction useSpringCarousel(\n  props: UseSpringCarouselWithNoFixedItems<false>,\n): ReturnType<false>\n\nfunction useSpringCarousel({\n  items,\n  init = true,\n  withThumbs,\n  thumbsSlideAxis = 'x',\n  itemsPerSlide: _itemsPerSlide = 1,\n  slideType = 'fixed',\n  gutter = 0,\n  withLoop = false,\n  startEndGutter = 0,\n  carouselSlideAxis = 'x',\n  disableGestures = false,\n  draggingSlideTreshold: _draggingSlideTreshold,\n  slideWhenThresholdIsReached = false,\n  freeScroll,\n  enableFreeScrollDrag,\n  initialStartingPosition,\n  prepareThumbsData,\n  initialActiveItem = 0,\n  animateWhenActiveItemChange = true,\n  getControllerRef,\n}: UseSpringCarouselComplete): ReturnType<typeof freeScroll> {\n  const itemsPerSlide = _itemsPerSlide > items.length ? items.length : _itemsPerSlide\n\n  const resizeByPropChange = useRef(false)\n  const draggingSlideTreshold = useRef(_draggingSlideTreshold ?? 0)\n  const slideActionType = useRef<SlideActionType>('initial')\n  const slideModeType = useRef<SlideMode>('initial')\n\n  const activeItem = useRef(initialActiveItem)\n  const firstItemReached = useRef(initialActiveItem === 0)\n  const lastItemReached = useRef(\n    slideType === 'fixed' && initialActiveItem === items.length - 1,\n  )\n  const mainCarouselWrapperRef = useRef<HTMLDivElement | null>(null)\n  const carouselTrackWrapperRef = useRef<HTMLDivElement | null>(null)\n\n  const isFirstMount = useRef(true)\n\n  const prevTotalScrollValue = useRef(0)\n  const prevWindowWidth = useRef(0)\n  const prevSlidedValue = useRef(0)\n  const prevWithLoop = useRef(withLoop)\n  const prevSlideType = useRef(slideType)\n  const prevFreeScroll = useRef(freeScroll)\n  const windowIsHidden = useRef(false)\n\n  const getItems = useCallback(() => {\n    if (withLoop) {\n      return [\n        ...items.map(i => ({\n          ...i,\n          id: `prev-repeated-item-${i.id}`,\n        })),\n        ...items,\n        ...items.map(i => ({\n          ...i,\n          id: `next-repeated-item-${i.id}`,\n        })),\n      ]\n    }\n    return [...items]\n  }, [items, withLoop])\n  const internalItems = getItems()\n\n  const [spring, setSpring] = useSpring(\n    () => ({\n      val: 0,\n      pause: !init,\n      onChange: ({ value }) => {\n        if (freeScroll && mainCarouselWrapperRef.current) {\n          if (carouselSlideAxis === 'x') {\n            mainCarouselWrapperRef.current.scrollLeft = Math.abs(value.val)\n          } else {\n            mainCarouselWrapperRef.current.scrollTop = Math.abs(value.val)\n          }\n          setStartEndItemReachedOnFreeScroll()\n        } else if (carouselTrackWrapperRef.current) {\n          if (carouselSlideAxis === 'x') {\n            carouselTrackWrapperRef.current.style.transform = `translate3d(${value.val}px, 0px,0px)`\n          } else {\n            carouselTrackWrapperRef.current.style.transform = `translate3d(0px,${value.val}px,0px)`\n          }\n        }\n      },\n    }),\n    [freeScroll],\n  )\n  const { emitEvent, useListenToCustomEvent } = useEventsModule<'use-spring'>()\n  const { thumbsFragment, handleScroll } = useThumbsModule<'use-spring'>({\n    withThumbs: !!withThumbs,\n    thumbsSlideAxis,\n    prepareThumbsData,\n    items: items as ItemWithThumb<'use-spring'>[],\n    renderThumbFnProps: {\n      getIsActiveItem,\n      getIsPrevItem,\n      useListenToCustomEvent,\n      getIsNextItem,\n    },\n  })\n  const { enterFullscreen, exitFullscreen, getIsFullscreen } = useFullscreenModule({\n    mainCarouselWrapperRef,\n    handleResize: () => adjustCarouselWrapperPosition(),\n    onFullScreenChange: val => {\n      emitEvent({\n        eventName: 'onFullscreenChange',\n        isFullscreen: val,\n      })\n    },\n  })\n\n  function getItemStyles(isLastItem: boolean) {\n    if (slideType === 'fixed' && !freeScroll) {\n      return {\n        marginRight: `${isLastItem ? 0 : gutter}px`,\n        flex: `1 0 calc(100% / ${itemsPerSlide} - ${\n          (gutter * (itemsPerSlide - 1)) / itemsPerSlide\n        }px)`,\n      }\n    }\n    return {\n      ...{ marginRight: `${isLastItem ? 0 : gutter}px` },\n    }\n  }\n\n  function getSlideValue() {\n    const carouselItem = mainCarouselWrapperRef.current?.querySelector(\n      '.use-spring-carousel-item',\n    )\n\n    if (!carouselItem) {\n      throw Error('No carousel items available!')\n    }\n\n    return (\n      carouselItem.getBoundingClientRect()[\n        carouselSlideAxis === 'x' ? 'width' : 'height'\n      ] + gutter\n    )\n  }\n\n  type SlideToItem = {\n    from: number\n    to: number\n    nextActiveItem?: number\n    immediate?: boolean\n    slideMode: SlideMode\n  }\n\n  function slideToItem({\n    from,\n    to,\n    nextActiveItem,\n    immediate = false,\n    slideMode,\n  }: SlideToItem) {\n    slideModeType.current = slideMode\n\n    if (typeof nextActiveItem === 'number') {\n      if (!freeScroll) {\n        activeItem.current = nextActiveItem\n      }\n      emitEvent({\n        eventName: 'onSlideStartChange',\n        slideActionType: slideActionType.current,\n        slideMode: slideModeType.current,\n        nextItem: {\n          startReached: firstItemReached.current,\n          endReached: lastItemReached.current,\n          index: freeScroll ? -1 : activeItem.current,\n          id: freeScroll ? '' : items[activeItem.current].id,\n        },\n      })\n    }\n\n    prevSlidedValue.current = to\n    setSpring.start({\n      immediate,\n      from: {\n        val: from,\n      },\n      to: {\n        val: to,\n      },\n      config: {\n        ...config.default,\n        velocity: spring.val.velocity,\n      },\n      onRest(value) {\n        if (!immediate && value.finished) {\n          emitEvent({\n            eventName: 'onSlideChange',\n            slideActionType: slideActionType.current,\n            slideMode: slideModeType.current,\n            currentItem: {\n              startReached: firstItemReached.current,\n              endReached: lastItemReached.current,\n              index: freeScroll ? -1 : activeItem.current,\n              id: freeScroll ? '' : items[activeItem.current].id,\n            },\n          })\n        }\n      },\n    })\n    if (withThumbs && !immediate) {\n      handleScroll(activeItem.current)\n    }\n  }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  function getTotalScrollValue() {\n    if (withLoop) {\n      return getSlideValue() * items.length\n    }\n    return Math.round(\n      Number(\n        carouselTrackWrapperRef.current?.[\n          carouselSlideAxis === 'x' ? 'scrollWidth' : 'scrollHeight'\n        ],\n      ) -\n        carouselTrackWrapperRef.current!.getBoundingClientRect()[\n          carouselSlideAxis === 'x' ? 'width' : 'height'\n        ] -\n        startEndGutter * 2,\n    )\n  }\n  function getAnimatedWrapperStyles() {\n    const percentValue = `calc(100% - ${startEndGutter * 2}px)`\n    return {\n      width: carouselSlideAxis === 'x' ? percentValue : '100%',\n      height: carouselSlideAxis === 'y' ? percentValue : '100%',\n    }\n  }\n\n  function getCarouselItemWidth() {\n    const carouselItem = carouselTrackWrapperRef.current?.querySelector(\n      '.use-spring-carousel-item',\n    )\n    if (!carouselItem) {\n      throw Error('No carousel items available!')\n    }\n    return (\n      carouselItem.getBoundingClientRect()[\n        carouselSlideAxis === 'x' ? 'width' : 'height'\n      ] + gutter\n    )\n  }\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  function adjustCarouselWrapperPosition() {\n    const positionProperty = carouselSlideAxis === 'x' ? 'left' : 'top'\n\n    function setPosition(v: number) {\n      const ref = carouselTrackWrapperRef.current\n      if (!ref) return\n\n      if (withLoop) {\n        ref.style.top = '0px'\n        ref.style.left = '0px'\n        ref.style[positionProperty] = `-${v - startEndGutter}px`\n\n        firstItemReached.current = false\n        lastItemReached.current = false\n      } else {\n        ref.style.left = '0px'\n        ref.style.top = '0px'\n      }\n    }\n\n    if (slideType === 'fixed' && withLoop) {\n      if (initialStartingPosition === 'center') {\n        setPosition(\n          getCarouselItemWidth() * items.length -\n            getSlideValue() * Math.round((itemsPerSlide - 1) / 2),\n        )\n      } else if (initialStartingPosition === 'end') {\n        setPosition(\n          getCarouselItemWidth() * items.length -\n            getSlideValue() * Math.round(itemsPerSlide - 1),\n        )\n      } else {\n        setPosition(getCarouselItemWidth() * items.length)\n      }\n    }\n\n    if (slideType === 'fluid') {\n      /**\n       * User reached the last item and now is resizing the container that becomes smaller/bigger.\n       * Example: on mobile devices the user rotates the device\n       */\n      if (\n        lastItemReached.current &&\n        getTotalScrollValue() !== Math.abs(prevSlidedValue.current) &&\n        !withLoop\n      ) {\n        const newVal = -getTotalScrollValue()\n        prevSlidedValue.current = newVal\n        setSpring.start({\n          immediate: true,\n          val: prevSlidedValue.current,\n        })\n        return\n      }\n\n      if (\n        Math.abs(prevSlidedValue.current) > 0 &&\n        getTotalScrollValue() !== Math.abs(prevSlidedValue.current) &&\n        !withLoop &&\n        !freeScroll\n      ) {\n        console.log(prevSlidedValue)\n        if (Math.abs(prevSlidedValue.current) % 2 !== 0) {\n          console.log('ODD')\n          const diff = prevTotalScrollValue.current - getTotalScrollValue()\n          const next = prevSlidedValue.current + diff\n\n          setSpring.start({\n            immediate: true,\n            val: next,\n          })\n\n          return () => {\n            prevSlidedValue.current = next\n          }\n        }\n        console.log('EVEN')\n\n        const next = -(getSlideValue() * activeItem.current)\n        setSpring.start({\n          immediate: true,\n          val: next,\n        })\n        return () => {\n          prevSlidedValue.current = next\n        }\n      }\n\n      return\n    }\n\n    if (!freeScroll && slideType === 'fixed') {\n      const nextValue = -(getSlideValue() * activeItem.current)\n\n      /**\n       * Here we make sure to always show the latest item as the\n       * latest item visible in the viewport.\n       */\n      if (Math.abs(nextValue) > getTotalScrollValue() && !withLoop) {\n        const val = -getTotalScrollValue()\n        lastItemReached.current = true\n        prevSlidedValue.current = val\n        setSpring.start({\n          immediate: true,\n          val: prevSlidedValue.current,\n        })\n      } else {\n        prevSlidedValue.current = nextValue\n        setSpring.start({\n          immediate: true,\n          val: nextValue,\n        })\n      }\n\n      setTimeout(() => {\n        resizeByPropChange.current = false\n      }, 0)\n    }\n  }\n  function getFromValue() {\n    if (freeScroll && mainCarouselWrapperRef.current) {\n      return mainCarouselWrapperRef.current[\n        carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n      ]\n    }\n    return spring.val.get()\n  }\n  function getToValue(type: 'next' | 'prev', index?: number) {\n    if (freeScroll && type === 'next') {\n      const next = prevSlidedValue.current + getSlideValue()\n      if (next > getTotalScrollValue()) {\n        return getTotalScrollValue()\n      }\n      return next\n    }\n\n    if (freeScroll && type === 'prev') {\n      const next = prevSlidedValue.current - getSlideValue()\n      if (next < 0) {\n        return 0\n      }\n      return next\n    }\n\n    if (type === 'next') {\n      if (typeof index === 'number') {\n        return -(index * getSlideValue())\n      }\n      return prevSlidedValue.current - getSlideValue()\n    }\n\n    if (typeof index === 'number') {\n      return -(index * getSlideValue())\n    }\n    return prevSlidedValue.current + getSlideValue()\n  }\n\n  type SlideToPrevNextItem = {\n    type: SlideMode\n    index?: number\n    immediate?: boolean\n  }\n  function slideToPrevItem({ type, index, immediate }: SlideToPrevNextItem) {\n    if (!init || windowIsHidden.current || (firstItemReached.current && !withLoop)) return\n\n    slideActionType.current = 'prev'\n    lastItemReached.current = false\n\n    const nextItem = typeof index === 'number' ? index : activeItem.current - 1\n\n    if (!withLoop) {\n      const nextItemWillExceed = freeScroll\n        ? getToValue('prev', index) - getSlideValue() / 3 < 0\n        : getToValue('prev', index) + getSlideValue() / 3 > 0\n\n      if (firstItemReached.current) return\n      if (nextItemWillExceed) {\n        firstItemReached.current = true\n        lastItemReached.current = false\n\n        slideToItem({\n          slideMode: type,\n          from: getFromValue(),\n          to: 0,\n          nextActiveItem: 0,\n          immediate,\n        })\n        return\n      }\n    }\n    if (withLoop && (firstItemReached.current || nextItem < 0)) {\n      firstItemReached.current = false\n      lastItemReached.current = true\n      slideToItem({\n        slideMode: type,\n        from: getFromValue() - getSlideValue() * items.length,\n        to: -(getSlideValue() * items.length) + getSlideValue(),\n        nextActiveItem: items.length - 1,\n        immediate,\n      })\n      return\n    }\n    if (nextItem === 0) {\n      firstItemReached.current = true\n    }\n    if (nextItem === items.length - 1 || nextItem === -1) {\n      lastItemReached.current = true\n    }\n    slideToItem({\n      slideMode: type,\n      from: getFromValue(),\n      to: getToValue('prev', index),\n      nextActiveItem: nextItem,\n      immediate,\n    })\n  }\n  function slideToNextItem({ type, index, immediate }: SlideToPrevNextItem) {\n    if (!init || windowIsHidden.current || (lastItemReached.current && !withLoop)) return\n\n    slideActionType.current = 'next'\n    firstItemReached.current = false\n\n    const nextItem = index || activeItem.current + 1\n\n    if (!withLoop) {\n      const nextItemWillExceed =\n        Math.abs(getToValue('next', index)) > getTotalScrollValue() - getSlideValue() / 3\n\n      if (lastItemReached.current) return\n      if (nextItemWillExceed) {\n        firstItemReached.current = false\n        lastItemReached.current = true\n\n        slideToItem({\n          slideMode: type,\n          from: getFromValue(),\n          to: freeScroll ? getTotalScrollValue() : -getTotalScrollValue(),\n          nextActiveItem: nextItem,\n          immediate,\n        })\n        return\n      }\n    }\n    if (withLoop && (lastItemReached.current || nextItem > items.length - 1)) {\n      lastItemReached.current = false\n      firstItemReached.current = true\n      slideToItem({\n        slideMode: type,\n        from: getFromValue() + getSlideValue() * items.length,\n        to: 0,\n        nextActiveItem: 0,\n        immediate,\n      })\n      return\n    }\n    if (nextItem === 0) {\n      firstItemReached.current = true\n    }\n    if (nextItem === items.length - 1) {\n      lastItemReached.current = true\n    }\n    slideToItem({\n      slideMode: type,\n      from: getFromValue(),\n      to: getToValue('next', index),\n      nextActiveItem: nextItem,\n      immediate,\n    })\n  }\n  function getDraggingSliderTreshold() {\n    if (_draggingSlideTreshold) {\n      draggingSlideTreshold.current = _draggingSlideTreshold\n    } else {\n      draggingSlideTreshold.current = Math.floor(getSlideValue() / 2 / 2)\n    }\n    return draggingSlideTreshold.current\n  }\n\n  useEffect(() => {\n    if (activeItem.current !== initialActiveItem) {\n      internalSlideToItem({\n        id: initialActiveItem,\n        immediate: !animateWhenActiveItemChange,\n      })\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [initialActiveItem])\n  useEffect(() => {\n    if (init) {\n      if (initialActiveItem > items.length - 1) {\n        throw new Error(\n          `initialActiveItem (${initialActiveItem}) is greater than the total quantity available items (${items.length}).`,\n        )\n      }\n      if (itemsPerSlide > items.length) {\n        console.warn(\n          `itemsPerSlide (${itemsPerSlide}) is greater than the total quantity available items (${items.length}). Fallback to ${items.length})`,\n        )\n      }\n    }\n  }, [initialActiveItem, items, itemsPerSlide, init])\n  useEffect(() => {\n    prevWindowWidth.current = window.innerWidth\n  }, [])\n  useEffect(() => {\n    prevTotalScrollValue.current = getTotalScrollValue()\n    if (!isFirstMount.current) {\n      resizeByPropChange.current = true\n      adjustCarouselWrapperPosition()\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    initialStartingPosition,\n    itemsPerSlide,\n    startEndGutter,\n    gutter,\n    init,\n    getTotalScrollValue,\n  ])\n  useEffect(() => {\n    /**\n     * When these props change we reset the carousel\n     */\n    if (\n      withLoop !== prevWithLoop.current ||\n      slideType !== prevSlideType.current ||\n      freeScroll !== prevFreeScroll.current\n    ) {\n      prevWithLoop.current = withLoop\n      prevSlideType.current = slideType\n      prevFreeScroll.current = freeScroll\n\n      if (carouselTrackWrapperRef.current) {\n        carouselTrackWrapperRef.current.style.transform = `translate3d(0px, 0px,0px)`\n        setSpring.start({\n          val: 0,\n          immediate: true,\n        })\n      }\n\n      internalSlideToItem({ id: 0, immediate: true, shouldReset: true })\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [withLoop, slideType, freeScroll])\n  useLayoutEffect(() => {\n    /**\n     * Set initial track position\n     */\n    if (carouselTrackWrapperRef.current) {\n      adjustCarouselWrapperPosition()\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n  useEffect(() => {\n    /**\n     * When itemsPerSlide change we need to update the draggingSlideTreshold.current,\n     * since it's default value is based on the calculation of the\n     * width of a single item\n     */\n    getDraggingSliderTreshold()\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [_draggingSlideTreshold, itemsPerSlide, slideType])\n  useEffect(() => {\n    if (mainCarouselWrapperRef.current) {\n      let timer: NodeJS.Timeout\n      const observer = new ResizeObserver(() => {\n        if (isFirstMount.current) {\n          isFirstMount.current = false\n          return\n        }\n\n        if (windowIsHidden.current) return\n        if (!resizeByPropChange.current) {\n          prevWindowWidth.current = window.innerWidth\n          const cb = adjustCarouselWrapperPosition()\n          window.clearTimeout(timer)\n\n          timer = setTimeout(() => {\n            prevTotalScrollValue.current = getTotalScrollValue()\n            if (typeof cb === 'function') {\n              cb()\n            }\n          }, 100)\n        }\n      })\n      observer.observe(mainCarouselWrapperRef.current)\n      return () => {\n        observer.disconnect()\n      }\n    }\n  }, [adjustCarouselWrapperPosition, getTotalScrollValue])\n  useEffect(() => {\n    if (!init) return\n    function handleVisibilityChange() {\n      if (document.hidden) {\n        windowIsHidden.current = true\n      } else {\n        windowIsHidden.current = false\n      }\n    }\n    document.addEventListener('visibilitychange', handleVisibilityChange)\n    return () => {\n      document.removeEventListener('visibilitychange', handleVisibilityChange)\n    }\n  }, [init])\n\n  const bindDrag = useDrag(\n    state => {\n      const isDragging = state.dragging\n      const movement = state.offset[carouselSlideAxis === 'x' ? 0 : 1]\n      const currentMovement = state.movement[carouselSlideAxis === 'x' ? 0 : 1]\n      const direction = state.direction[carouselSlideAxis === 'x' ? 0 : 1]\n\n      const prevItemTreshold = currentMovement > getDraggingSliderTreshold()\n      const nextItemTreshold = currentMovement < -getDraggingSliderTreshold()\n      const tot = getTotalScrollValue()\n\n      if (isDragging) {\n        if (direction > 0) {\n          slideActionType.current = 'prev'\n        } else {\n          slideActionType.current = 'next'\n        }\n\n        emitEvent({\n          ...state,\n          eventName: 'onDrag',\n          slideActionType: slideActionType.current,\n        })\n\n        if (freeScroll) {\n          if (movement > 0) {\n            setSpring.start({\n              from: {\n                val: getFromValue(),\n              },\n              to: {\n                val: 0,\n              },\n              config: {\n                velocity: state.velocity,\n                friction: 50,\n                tension: 1000,\n              },\n            })\n            state.cancel()\n            return\n          }\n\n          setSpring.start({\n            from: {\n              val: getFromValue(),\n            },\n            to: {\n              val: -movement,\n            },\n            config: {\n              velocity: state.velocity,\n              friction: 50,\n              tension: 1000,\n            },\n          })\n          return\n        }\n\n        setSpring.start({\n          val: movement,\n          config: {\n            velocity: state.velocity,\n            friction: 50,\n            tension: 1000,\n          },\n        })\n\n        if (slideWhenThresholdIsReached && nextItemTreshold) {\n          slideToNextItem({ type: 'drag' })\n          state.cancel()\n        } else if (slideWhenThresholdIsReached && prevItemTreshold) {\n          slideToPrevItem({ type: 'drag' })\n          state.cancel()\n        }\n\n        const res = tot - Math.abs(movement)\n\n        if (res < -(getSlideValue() * 2)) {\n          state.cancel()\n        }\n\n        return\n      }\n\n      if (state.last && freeScroll && movement > 0) {\n        setSpring.start({\n          from: {\n            val: getFromValue(),\n          },\n          to: {\n            val: 0,\n          },\n          config: {\n            velocity: state.velocity,\n            friction: 50,\n            tension: 1000,\n          },\n        })\n        return\n      }\n      if (state.last && !state.canceled && freeScroll) {\n        if (slideActionType.current === 'prev') {\n          slideToPrevItem({ type: 'drag' })\n        }\n        if (slideActionType.current === 'next') {\n          slideToNextItem({ type: 'drag' })\n        }\n      }\n\n      if (state.last && !state.canceled && !freeScroll) {\n        if (nextItemTreshold) {\n          if (!withLoop && lastItemReached.current) {\n            setSpring.start({\n              val: -getTotalScrollValue(),\n              config: {\n                ...config.default,\n                velocity: state.velocity,\n              },\n            })\n          } else {\n            slideToNextItem({ type: 'drag' })\n          }\n        } else if (prevItemTreshold) {\n          if (!withLoop && firstItemReached.current) {\n            setSpring.start({\n              val: 0,\n              config: {\n                ...config.default,\n                velocity: state.velocity,\n              },\n            })\n          } else {\n            slideToPrevItem({ type: 'drag' })\n          }\n        } else {\n          setSpring.start({\n            val: prevSlidedValue.current,\n            config: {\n              ...config.default,\n              velocity: state.velocity,\n            },\n          })\n        }\n      }\n      if (state.last && state.canceled) {\n        setSpring.start({\n          val: prevSlidedValue.current,\n          config: {\n            ...config.default,\n            velocity: state.velocity,\n          },\n        })\n      }\n    },\n    {\n      enabled:\n        (init && !disableGestures && !freeScroll) ||\n        (!!freeScroll && !!enableFreeScrollDrag),\n      axis: carouselSlideAxis,\n      from: () => {\n        if (freeScroll && mainCarouselWrapperRef.current) {\n          return [\n            -mainCarouselWrapperRef.current.scrollLeft,\n            -mainCarouselWrapperRef.current.scrollTop,\n          ]\n        }\n        if (carouselSlideAxis === 'x') {\n          return [spring.val.get(), spring.val.get()]\n        }\n        return [spring.val.get(), spring.val.get()]\n      },\n    },\n  )\n\n  function getWrapperOverflowStyles() {\n    if (freeScroll) {\n      if (carouselSlideAxis === 'x') {\n        return {\n          overflowX: 'auto',\n        }\n      }\n      return {\n        overflowY: 'auto',\n      }\n    }\n    return {}\n  }\n\n  function setStartEndItemReachedOnFreeScroll() {\n    if (mainCarouselWrapperRef.current) {\n      prevSlidedValue.current =\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ]\n      if (\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] === 0\n      ) {\n        firstItemReached.current = true\n        lastItemReached.current = false\n      }\n      if (\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] > 0 &&\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] < getTotalScrollValue()\n      ) {\n        firstItemReached.current = false\n        lastItemReached.current = false\n      }\n\n      if (\n        mainCarouselWrapperRef.current[\n          carouselSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n        ] === getTotalScrollValue()\n      ) {\n        firstItemReached.current = false\n        lastItemReached.current = true\n      }\n    }\n  }\n  function getScrollHandlers() {\n    if (freeScroll) {\n      return {\n        onWheel() {\n          spring.val.stop()\n          setStartEndItemReachedOnFreeScroll()\n        },\n      }\n    }\n    return {}\n  }\n\n  function findItemIndex(id: string | number, error?: string) {\n    let itemIndex = 0\n\n    if (typeof id === 'string') {\n      itemIndex = items.findIndex(item => item.id === id)\n    } else {\n      itemIndex = id\n    }\n    if (itemIndex < 0 || itemIndex >= items.length) {\n      if (error) {\n        throw new Error(error)\n      }\n      console.error(\n        `The item doesn't exist; check that the id provided - ${id} - is correct.`,\n      )\n      itemIndex = -1\n    }\n\n    return itemIndex\n  }\n  type InternalSlideToItem = {\n    id: string | number\n    immediate?: boolean\n    shouldReset?: boolean\n    type?: SlideType\n  }\n  function internalSlideToItem({\n    id,\n    immediate,\n    shouldReset,\n    type,\n  }: InternalSlideToItem) {\n    if (!init || windowIsHidden.current) return\n\n    firstItemReached.current = false\n    lastItemReached.current = false\n\n    const itemIndex = findItemIndex(\n      id,\n      \"The item you want to slide to doesn't exist; check the provided id.\",\n    )\n\n    if (itemIndex === activeItem.current && !shouldReset) {\n      return\n    }\n\n    const currentItem = findItemIndex(items[activeItem.current].id)\n    const newActiveItem = findItemIndex(items[itemIndex].id)\n\n    if (newActiveItem > currentItem) {\n      slideToNextItem({\n        type: type || shouldReset ? 'initial' : 'click',\n        index: newActiveItem,\n        immediate,\n      })\n    } else {\n      slideToPrevItem({\n        type: type || shouldReset ? 'initial' : 'click',\n        index: newActiveItem,\n        immediate,\n      })\n    }\n  }\n  function getIsNextItem(id: string | number) {\n    const itemIndex = findItemIndex(id, \"The item doesn't exist; check the provided id.\")\n    const _activeItem = activeItem.current\n    if (withLoop && _activeItem === items.length - 1) {\n      return itemIndex === 0\n    }\n    return itemIndex === _activeItem + 1\n  }\n  function getIsPrevItem(id: string | number) {\n    const itemIndex = findItemIndex(id, \"The item doesn't exist; check the provided id.\")\n    const _activeItem = activeItem.current\n    if (withLoop && _activeItem === 0) {\n      return itemIndex === items.length - 1\n    }\n    return itemIndex === _activeItem - 1\n  }\n  function getIsActiveItem(id: string | number) {\n    return (\n      findItemIndex(\n        id,\n        \"The item you want to check doesn't exist; check the provided id.\",\n      ) === activeItem.current\n    )\n  }\n\n  const res = freeScroll\n    ? {\n        useListenToCustomEvent,\n        enterFullscreen,\n        exitFullscreen,\n        getIsFullscreen,\n        slideToPrevItem: (animate = true) => {\n          slideToPrevItem({\n            type: 'click',\n            immediate: !animate,\n          })\n        },\n        slideToNextItem: (animate = true) => {\n          slideToNextItem({\n            type: 'click',\n            immediate: !animate,\n          })\n        },\n      }\n    : {\n        useListenToCustomEvent,\n        enterFullscreen,\n        exitFullscreen,\n        getIsFullscreen,\n        slideToPrevItem: (animate = true) => {\n          slideToPrevItem({\n            type: 'click',\n            immediate: !animate,\n          })\n        },\n        slideToNextItem: (animate = true) => {\n          slideToNextItem({\n            type: 'click',\n            immediate: !animate,\n          })\n        },\n        slideToItem: (id: string | number, animate = true) => {\n          internalSlideToItem({ id, immediate: !animate })\n        },\n        getIsNextItem,\n        getIsPrevItem,\n        getIsActiveItem,\n      }\n\n  useEffect(() => {\n    if (getControllerRef) {\n      getControllerRef({\n        slideToNextItem: res.slideToNextItem,\n        slideToPrevItem: res.slideToPrevItem,\n        slideToItem: res?.slideToItem,\n      })\n    }\n  }, [getControllerRef, res.slideToItem, res.slideToNextItem, res.slideToPrevItem])\n\n  const _thumbsFragment = (\n    <Context.Provider value={res}>{thumbsFragment}</Context.Provider>\n  )\n  const carouselFragment = (\n    <Context.Provider value={res}>\n      <div\n        className=\"use-spring-carousel-main-wrapper\"\n        ref={mainCarouselWrapperRef}\n        {...getScrollHandlers()}\n        style={{\n          display: 'flex',\n          position: 'relative',\n          width: '100%',\n          height: '100%',\n          ...(getWrapperOverflowStyles() as React.CSSProperties),\n        }}\n      >\n        <div\n          className=\"use-spring-carousel-track-wrapper\"\n          ref={carouselTrackWrapperRef}\n          {...bindDrag()}\n          style={{\n            position: 'relative',\n            display: 'flex',\n            flexDirection: carouselSlideAxis === 'x' ? 'row' : 'column',\n            touchAction: 'none',\n            ...getAnimatedWrapperStyles(),\n          }}\n        >\n          {(freeScroll || !withLoop) && startEndGutter ? (\n            <div\n              style={{\n                flexShrink: 0,\n                width: startEndGutter,\n              }}\n            />\n          ) : null}\n          {internalItems.map((item, index) => {\n            return (\n              <div\n                key={`${item.id}-${index}`}\n                className=\"use-spring-carousel-item\"\n                data-testid=\"use-spring-carousel-item-wrapper\"\n                style={{\n                  display: 'flex',\n                  position: 'relative',\n                  flex: '1',\n                  ...getItemStyles(!!freeScroll && index === items.length - 1),\n                }}\n              >\n                {typeof item.renderItem === 'function'\n                  ? item.renderItem({\n                      getIsActiveItem,\n                      getIsNextItem,\n                      getIsPrevItem,\n                      useListenToCustomEvent,\n                    })\n                  : item.renderItem}\n              </div>\n            )\n          })}\n          {freeScroll && startEndGutter ? (\n            <div\n              style={{\n                flexShrink: 0,\n                width: startEndGutter,\n              }}\n            />\n          ) : null}\n        </div>\n      </div>\n    </Context.Provider>\n  )\n\n  return { ...res, carouselFragment, thumbsFragment: _thumbsFragment }\n}\n\ntype ContextProps<T = undefined> = Omit<\n  ReturnType<T extends 'free-scroll' ? true : false>,\n  'carouselFragment' | 'thumbsFragment'\n>\n\nconst Context =\n  createContext<ContextProps | ContextProps<'free-scroll'> | undefined>(undefined)\n\nfunction useSpringCarouselContext<T>() {\n  const context = useContext(Context)\n  if (!context) {\n    throw new Error('useSpringCarouselContext must be used within the carousel.')\n  }\n  return context as ContextProps<T>\n}\n\nexport { useSpringCarousel, useSpringCarouselContext }\n"],"names":["useSpringCarousel","items","init","withThumbs","thumbsSlideAxis","itemsPerSlide","_itemsPerSlide","slideType","gutter","withLoop","startEndGutter","carouselSlideAxis","disableGestures","draggingSlideTreshold","_draggingSlideTreshold","slideWhenThresholdIsReached","freeScroll","enableFreeScrollDrag","initialStartingPosition","prepareThumbsData","initialActiveItem","animateWhenActiveItemChange","getControllerRef","length","resizeByPropChange","useRef","slideActionType","slideModeType","activeItem","firstItemReached","lastItemReached","mainCarouselWrapperRef","carouselTrackWrapperRef","isFirstMount","prevTotalScrollValue","prevWindowWidth","prevSlidedValue","prevWithLoop","prevSlideType","prevFreeScroll","windowIsHidden","internalItems","useCallback","map","i","Object","assign","id","getItems","spring","setSpring","useSpring","val","pause","onChange","value","current","scrollLeft","Math","abs","scrollTop","setStartEndItemReachedOnFreeScroll","style","transform","emitEvent","useListenToCustomEvent","useEventsModule","thumbsFragment","handleScroll","useThumbsModule","renderThumbFnProps","getIsActiveItem","getIsPrevItem","getIsNextItem","enterFullscreen","exitFullscreen","getIsFullscreen","useFullscreenModule","handleResize","adjustCarouselWrapperPosition","onFullScreenChange","eventName","isFullscreen","getSlideValue","carouselItem","_a","querySelector","Error","getBoundingClientRect","slideToItem","from","to","nextActiveItem","immediate","slideMode","nextItem","startReached","endReached","index","start","config","default","velocity","onRest","finished","currentItem","getTotalScrollValue","round","Number","getCarouselItemWidth","positionProperty","setPosition","v","ref","top","left","nextValue","setTimeout","newVal","console","log","diff","next","getFromValue","get","getToValue","type","slideToPrevItem","nextItemWillExceed","slideToNextItem","getDraggingSliderTreshold","floor","useEffect","internalSlideToItem","warn","window","innerWidth","shouldReset","useLayoutEffect","timer","observer","ResizeObserver","cb","clearTimeout","observe","disconnect","document","addEventListener","handleVisibilityChange","removeEventListener","hidden","bindDrag","useDrag","state","isDragging","dragging","movement","offset","currentMovement","direction","prevItemTreshold","nextItemTreshold","tot","friction","tension","cancel","last","canceled","enabled","axis","findItemIndex","error","itemIndex","findIndex","item","newActiveItem","_activeItem","res","animate","_thumbsFragment","_jsx","Context","Provider","children","carouselFragment","className","onWheel","stop","display","position","width","height","overflowX","overflowY","_jsxs","flexDirection","touchAction","percentValue","getAnimatedWrapperStyles","flexShrink","flex","isLastItem","marginRight","renderItem","createContext","undefined","useSpringCarouselContext","context","useContext"],"mappings":"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"}

package/dist/esm/useThumbsModule-ff8a59da.js

@@ -0,0 +1,2 @@
+import{useRef as t,useEffect as e}from"react";import{jsx as n}from"react/jsx-runtime";import{useSpring as r}from"@react-spring/web";function i(){const n=t(null);return{useListenToCustomEvent:function(t){e((()=>{function e(e){t(e.detail)}if(n.current||(n.current=document.createElement("div")),n.current)return n.current.addEventListener("RSC::Event",e,!1),()=>{var t;null===(t=n.current)||void 0===t||t.removeEventListener("RSC::Event",e,!1)}}),[t])},emitEvent:function(t){if(n.current){const e=new CustomEvent("RSC::Event",{detail:t});n.current.dispatchEvent(e)}}}}function o({thumbsSlideAxis:e="x",withThumbs:i=!1,prepareThumbsData:o,items:u,renderThumbFnProps:c}){const l=t(null),[s,a]=r((()=>({val:0})));function m(){var t;return Math.round(Number(null===(t=l.current)||void 0===t?void 0:t["x"===e?"scrollWidth":"scrollHeight"])-l.current.getBoundingClientRect()["x"===e?"width":"height"])}return{thumbsFragment:i?n("div",Object.assign({className:"use-spring-carousel-thumbs-wrapper",ref:l,onWheel:()=>s.val.stop(),style:Object.assign({display:"flex",flex:"1",position:"relative",width:"100%",height:"100%",flexDirection:"x"===e?"row":"column"},"x"===e?{overflowX:"auto"}:{overflowY:"auto",maxHeight:"100%"})},{children:function(){function t(t){return t.map((t=>({id:t.id,renderThumb:t.renderThumb})))}return o?o(t(u)):t(u)}().map((({id:t,renderThumb:e})=>{const r=`thumb-item-${t}`;return n("div",Object.assign({id:r,className:"thumb-item"},{children:"function"==typeof e?e(c):e}),r)}))})):null,handleScroll:function(t){var n,r;const i=l.current?l.current.querySelector(`#thumb-item-${u[t].id}`):null;if(i&&l.current&&!function(t){const e=t.getBoundingClientRect();return e.top>=0&&e.left>=0&&e.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&e.right<=(window.innerWidth||document.documentElement.clientWidth)}(i)){const t=i.offsetLeft,o=t>m()?m():t;a.start({from:{val:null!==(r=null===(n=l.current)||void 0===n?void 0:n["x"===e?"scrollLeft":"scrollTop"])&&void 0!==r?r:0},to:{val:o},onChange:({value:t})=>{l.current&&(l.current["x"===e?"scrollLeft":"scrollTop"]=Math.abs(t.val))}})}}}}export{o as a,i as u};
+//# sourceMappingURL=useThumbsModule-ff8a59da.js.map

package/dist/esm/useThumbsModule-ff8a59da.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThumbsModule-ff8a59da.js","sources":["../../src/modules/useEventsModule.ts","../../src/modules/useThumbsModule.tsx"],"sourcesContent":["import { FullGestureState } from '@use-gesture/react'\nimport { useEffect, useRef } from 'react'\nimport { SlideActionType, SlideMode, TransitionSlideMode } from '../types/common'\n\nconst eventLabel = 'RSC::Event'\n\ntype OnSlideStartChange<T> = {\n  eventName: 'onSlideStartChange'\n  slideActionType: SlideActionType\n  slideMode: T extends 'use-spring' ? SlideMode : TransitionSlideMode\n  nextItem: {\n    index: number\n    id: string\n    startReached: boolean\n    endReached: boolean\n  }\n}\ntype OnSlideChange<T> = {\n  eventName: 'onSlideChange'\n  slideActionType: SlideActionType\n  slideMode: T extends 'use-spring' ? SlideMode : TransitionSlideMode\n  currentItem: {\n    index: number\n    id: string\n    startReached: boolean\n    endReached: boolean\n  }\n}\ntype OnFullscreenChange = {\n  eventName: 'onFullscreenChange'\n  isFullscreen: boolean\n}\ntype OnDrag = Omit<FullGestureState<'drag'>, 'event'> & {\n  eventName: 'onDrag'\n  slideActionType: SlideActionType\n}\n\ntype OnLeftSwipe = {\n  eventName: 'onLeftSwipe'\n}\n\ntype OnRightSwipe = {\n  eventName: 'onRightSwipe'\n}\n\ntype SpringCarouselEvents<T> =\n  | OnSlideStartChange<T>\n  | OnSlideChange<T>\n  | OnDrag\n  | OnFullscreenChange\n\ntype TransitionCarouselEvents<T> =\n  | OnSlideStartChange<T>\n  | OnSlideChange<T>\n  | OnFullscreenChange\n  | OnLeftSwipe\n  | OnRightSwipe\n\ntype Events<T> = T extends 'use-spring'\n  ? SpringCarouselEvents<'use-spring'>\n  : TransitionCarouselEvents<'use-transition'>\n\ntype EventHandler<T> = (props: Events<T>) => void\n\nexport type UseListenToCustomEvent<T> = {\n  useListenToCustomEvent: (eventHandler: EventHandler<T>) => void\n  emitEvent: (event: Events<T>) => void\n}\n\nexport function useEventsModule<T extends 'use-spring' | 'use-transition'>() {\n  const targetEvent = useRef<HTMLDivElement | null>(null)\n\n  function useListenToCustomEvent(eventHandler: EventHandler<T>) {\n    useEffect(() => {\n      if (!targetEvent.current) {\n        targetEvent.current = document.createElement('div')\n      }\n\n      function handleEvent(event: CustomEvent<Events<T>>) {\n        eventHandler(event.detail)\n      }\n\n      if (targetEvent.current) {\n        // @ts-ignore\n        targetEvent.current.addEventListener(eventLabel, handleEvent, false)\n        return () => {\n          // @ts-ignore\n          targetEvent.current?.removeEventListener(eventLabel, handleEvent, false)\n        }\n      }\n    }, [eventHandler])\n  }\n  function emitEvent(event: Events<T>) {\n    if (targetEvent.current) {\n      const newEvent = new CustomEvent(eventLabel, {\n        detail: event,\n      })\n      targetEvent.current.dispatchEvent(newEvent)\n    }\n  }\n\n  return {\n    useListenToCustomEvent,\n    emitEvent,\n  }\n}\n","import { useSpring } from '@react-spring/web'\nimport { useRef } from 'react'\n\nimport {\n  ItemWithThumb,\n  PrepareThumbsData,\n  RenderItemProps,\n  SpringCarouselWithThumbs,\n} from '../types'\n\ntype Props<T extends 'use-spring' | 'use-transition'> = {\n  withThumbs?: boolean\n  thumbsSlideAxis: SpringCarouselWithThumbs['thumbsSlideAxis']\n  prepareThumbsData?: PrepareThumbsData<T>\n  items: ItemWithThumb<T>[]\n  renderThumbFnProps: RenderItemProps<T>\n}\n\nfunction isInViewport(el: HTMLElement) {\n  const rect = el.getBoundingClientRect()\n  return (\n    rect.top >= 0 &&\n    rect.left >= 0 &&\n    rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\n    rect.right <= (window.innerWidth || document.documentElement.clientWidth)\n  )\n}\n\nexport function useThumbsModule<T extends 'use-spring' | 'use-transition'>({\n  thumbsSlideAxis = 'x',\n  withThumbs = false,\n  prepareThumbsData,\n  items,\n  renderThumbFnProps,\n}: Props<T>) {\n  const wrapperRef = useRef<HTMLDivElement | null>(null)\n  const [spring, setSpring] = useSpring(() => ({\n    val: 0,\n  }))\n\n  function getTotalScrollValue() {\n    return Math.round(\n      Number(\n        wrapperRef.current?.[thumbsSlideAxis === 'x' ? 'scrollWidth' : 'scrollHeight'],\n      ) -\n        wrapperRef.current!.getBoundingClientRect()[\n          thumbsSlideAxis === 'x' ? 'width' : 'height'\n        ],\n    )\n  }\n\n  function handleScroll(activeItem: number) {\n    function getThumbNode() {\n      if (wrapperRef.current) {\n        return wrapperRef.current.querySelector(\n          `#thumb-item-${items[activeItem].id}`,\n        ) as HTMLElement\n      }\n      return null\n    }\n\n    const thumbNode = getThumbNode()\n    if (thumbNode && wrapperRef.current) {\n      if (!isInViewport(thumbNode)) {\n        const offset = thumbNode.offsetLeft\n        const val = offset > getTotalScrollValue() ? getTotalScrollValue() : offset\n\n        setSpring.start({\n          from: {\n            val:\n              wrapperRef.current?.[\n                thumbsSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'\n              ] ?? 0,\n          },\n          to: {\n            val,\n          },\n          onChange: ({ value }) => {\n            if (wrapperRef.current) {\n              wrapperRef.current[thumbsSlideAxis === 'x' ? 'scrollLeft' : 'scrollTop'] =\n                Math.abs(value.val)\n            }\n          },\n        })\n      }\n    }\n  }\n\n  function handlePrepareThumbsData() {\n    function getPreparedItems(\n      _items: ReturnType<PrepareThumbsData<T>>,\n    ): ReturnType<PrepareThumbsData<T>> {\n      return _items.map(i => ({\n        id: i.id,\n        renderThumb: i.renderThumb,\n      }))\n    }\n\n    if (prepareThumbsData) {\n      return prepareThumbsData(getPreparedItems(items))\n    }\n    return getPreparedItems(items)\n  }\n\n  const thumbsFragment = withThumbs ? (\n    <div\n      className=\"use-spring-carousel-thumbs-wrapper\"\n      ref={wrapperRef}\n      onWheel={() => spring.val.stop()}\n      style={{\n        display: 'flex',\n        flex: '1',\n        position: 'relative',\n        width: '100%',\n        height: '100%',\n        flexDirection: thumbsSlideAxis === 'x' ? 'row' : 'column',\n        ...(thumbsSlideAxis === 'x'\n          ? { overflowX: 'auto' }\n          : {\n              overflowY: 'auto',\n              maxHeight: '100%',\n            }),\n      }}\n    >\n      {handlePrepareThumbsData().map(({ id, renderThumb }) => {\n        const thumbId = `thumb-item-${id}`\n        return (\n          <div key={thumbId} id={thumbId} className=\"thumb-item\">\n            {typeof renderThumb === 'function'\n              ? renderThumb(renderThumbFnProps)\n              : renderThumb}\n          </div>\n        )\n      })}\n    </div>\n  ) : null\n\n  return {\n    thumbsFragment,\n    handleScroll,\n  }\n}\n"],"names":["useEventsModule","targetEvent","useRef","useListenToCustomEvent","eventHandler","useEffect","handleEvent","event","detail","current","document","createElement","addEventListener","_a","removeEventListener","emitEvent","newEvent","CustomEvent","dispatchEvent","useThumbsModule","thumbsSlideAxis","withThumbs","prepareThumbsData","items","renderThumbFnProps","wrapperRef","spring","setSpring","useSpring","val","getTotalScrollValue","Math","round","Number","getBoundingClientRect","thumbsFragment","_jsx","Object","assign","className","ref","onWheel","stop","style","display","flex","position","width","height","flexDirection","overflowX","overflowY","maxHeight","children","getPreparedItems","_items","map","i","id","renderThumb","handlePrepareThumbsData","thumbId","handleScroll","activeItem","thumbNode","querySelector","el","rect","top","left","bottom","window","innerHeight","documentElement","clientHeight","right","innerWidth","clientWidth","isInViewport","offset","offsetLeft","start","from","to","onChange","value","abs"],"mappings":"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"}

package/dist/esm/useTransitionCarousel.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{useTransition as t,a as i,config as n}from"@react-spring/web";import{createContext as s,useRef as r,useState as o,useEffect as a,useContext as l}from"react";import{u as c,a as d}from"./useThumbsModule-f4421f49.js";import{useDrag as u}from"@use-gesture/react";import"screenfull";const m={initial:{opacity:1,position:"relative"},from:{opacity:0,position:"relative"},enter:{position:"relative",opacity:1},leave:{opacity:1,position:"absolute"}};function g({init:s=!0,disableGestures:l=!1,items:g,springConfig:f=n.default,exitBeforeEnter:h=!1,trail:b,withLoop:v=!1,activeItem:j,toPrevItemSpringProps:O=m,toNextItemSpringProps:x=m,draggingSlideTreshold:y=50,thumbsSlideAxis:T="x"}){const w=r("next"),S=r("initial"),I=r(null),[M,C]=o(null!=j?j:0),{emitEvent:N,useListenToCustomEvent:E}=c(),{handleScroll:P,thumbsFragment:R}=d({thumbsSlideAxis:T,items:g});function A({to:e,slideType:t,slideMode:i}){w.current=t,S.current=i,N({eventName:"onSlideStartChange",slideActionType:w.current,slideMode:S.current,nextItem:{index:e,id:g[e].id,startReached:0===e,endReached:e===g.length-1}}),C(e),P(M)}function L(e){if(!s)return;const t=0===M;!v&&t||A(v&&t?{to:g.length-1,slideType:"prev",slideMode:e}:{to:M-1,slideType:"prev",slideMode:e})}function k(e){if(!s)return;const t=M===g.length-1;!v&&t||A(v&&t?{to:0,slideType:"next",slideMode:e}:{to:M+1,slideType:"next",slideMode:e})}a((()=>{"number"==typeof j&&j!==M&&C(j)}),[j]);const F=t(M,Object.assign(Object.assign({config:f,key:null,trail:b,exitBeforeEnter:h},"prev"===w.current?{initial:Object.assign({},O.initial),from:Object.assign({},O.from),enter:Object.assign({},O.enter),leave:Object.assign({},O.leave)}:"next"===w.current?{initial:Object.assign({},x.initial),from:Object.assign({},x.from),enter:Object.assign({},x.enter),leave:Object.assign({},x.leave)}:{initial:Object.assign({},m.initial),from:Object.assign({},m.from),enter:Object.assign({},m.enter),leave:Object.assign({},m.leave)}),{onRest(e,t,i){e.finished&&i===M&&N({eventName:"onSlideChange",slideActionType:w.current,slideMode:S.current,currentItem:{index:M,id:g[M].id,startReached:0===M,endReached:M===g.length-1}})}})),B=u((({last:e,movement:[t]})=>{if(e){const e=t>y,i=t<-y,n=0===M,s=M===g.length-1;if(i){if(!v&&s)return;N({eventName:"onLeftSwipe"}),k("swipe")}else if(e){if(!v&&n)return;N({eventName:"onRightSwipe"}),L("swipe")}}}),{enabled:!l}),G=F(((t,n,s,r)=>e(i.div,Object.assign({id:`use-transition-carousel-item-${r}`,className:"use-transition-carousel-item",style:Object.assign(Object.assign({},t),{flex:"1 0 100%",width:"100%",height:"100%"})},{children:g[n].renderItem})))),$={useListenToCustomEvent:E,slideToPrevItem:()=>L("click"),slideToNextItem:()=>k("click")},q=e(p.Provider,Object.assign({value:$},{children:R})),z=e(p.Provider,Object.assign({value:$},{children:e("div",Object.assign({ref:I},B(),{style:{display:"flex",position:"relative",width:"100%",height:"100%",overflow:"hidden"}},{children:G}))}));return Object.assign(Object.assign({},$),{carouselFragment:z,thumbsFragment:q})}const p=s(void 0);function f(){const e=l(p);if(!e)throw new Error("useTransitionCarouselContext must be used within the carousel.");return e}export{g as useTransitionCarousel,f as useTransitionCarouselContext};
+import{jsx as e}from"react/jsx-runtime";import{useTransition as t,a as i,config as n}from"@react-spring/web";import{createContext as s,useRef as r,useState as o,useEffect as a,useContext as c}from"react";import{u as l,a as d}from"./useThumbsModule-ff8a59da.js";import{useDrag as u}from"@use-gesture/react";import"screenfull";const m={initial:{opacity:1,position:"relative"},from:{opacity:0,position:"relative"},enter:{position:"relative",opacity:1},leave:{opacity:1,position:"absolute"}};function g({init:s=!0,disableGestures:c=!1,items:g,springConfig:f=n.default,exitBeforeEnter:p=!1,trail:v,withLoop:b=!1,activeItem:x,toPrevItemSpringProps:j=m,toNextItemSpringProps:O=m,draggingSlideTreshold:T=50,thumbsSlideAxis:I="x"}){const y=r("next"),w=r("initial"),S=r(null),[C,E]=o(null!=x?x:0),{emitEvent:N,useListenToCustomEvent:P}=l(),{handleScroll:M,thumbsFragment:k}=d({thumbsSlideAxis:I,items:g,renderThumbFnProps:{getIsNextItem:G,getIsPrevItem:q,useListenToCustomEvent:P,activeItem:{index:C,id:g[C].id}}});function L({to:e,slideType:t,slideMode:i}){y.current=t,w.current=i,N({eventName:"onSlideStartChange",slideActionType:y.current,slideMode:w.current,nextItem:{index:e,id:g[e].id,startReached:0===e,endReached:e===g.length-1}}),E(e),M(C)}function R(e){if(!s)return;const t=0===C;!b&&t||L(b&&t?{to:g.length-1,slideType:"prev",slideMode:e}:{to:C-1,slideType:"prev",slideMode:e})}function A(e){if(!s)return;const t=C===g.length-1;!b&&t||L(b&&t?{to:0,slideType:"next",slideMode:e}:{to:C+1,slideType:"next",slideMode:e})}a((()=>{"number"==typeof x&&x!==C&&E(x)}),[x]);const F=t(C,Object.assign(Object.assign({config:f,key:null,trail:v,exitBeforeEnter:p},"prev"===y.current?{initial:Object.assign({},j.initial),from:Object.assign({},j.from),enter:Object.assign({},j.enter),leave:Object.assign({},j.leave)}:"next"===y.current?{initial:Object.assign({},O.initial),from:Object.assign({},O.from),enter:Object.assign({},O.enter),leave:Object.assign({},O.leave)}:{initial:Object.assign({},m.initial),from:Object.assign({},m.from),enter:Object.assign({},m.enter),leave:Object.assign({},m.leave)}),{onRest(e,t,i){e.finished&&i===C&&N({eventName:"onSlideChange",slideActionType:y.current,slideMode:w.current,currentItem:{index:C,id:g[C].id,startReached:0===C,endReached:C===g.length-1}})}})),B=u((({last:e,movement:[t]})=>{if(e){const e=t>T,i=t<-T,n=0===C,s=C===g.length-1;if(i){if(!b&&s)return;N({eventName:"onLeftSwipe"}),A("swipe")}else if(e){if(!b&&n)return;N({eventName:"onRightSwipe"}),R("swipe")}}}),{enabled:!c});function $(e,t){let i=0;if(i="string"==typeof e?g.findIndex((t=>t.id===e)):e,i<0||i>=g.length){if(t)throw new Error(t);console.error(`The item doesn't exist; check that the id provided - ${e} - is correct.`),i=-1}return i}function G(e){const t=$(e,"The item doesn't exist; check the provided id."),i=C;return b&&i===g.length-1?0===t:t===i+1}function q(e){const t=$(e,"The item doesn't exist; check the provided id."),i=C;return b&&0===i?t===g.length-1:t===i-1}const z=F(((t,n,s,r)=>{const o=g[n].renderItem;return e(i.div,Object.assign({id:`use-transition-carousel-item-${r}`,className:"use-transition-carousel-item",style:Object.assign(Object.assign({},t),{flex:"1 0 100%",width:"100%",height:"100%"})},{children:"function"==typeof o?o({useListenToCustomEvent:P,getIsNextItem:G,getIsPrevItem:q,activeItem:{index:C,id:g[C].id}}):o}))})),D={useListenToCustomEvent:P,slideToPrevItem:()=>R("click"),slideToNextItem:()=>A("click")},H=e(h.Provider,Object.assign({value:D},{children:k})),J=e(h.Provider,Object.assign({value:D},{children:e("div",Object.assign({ref:S},B(),{style:{display:"flex",position:"relative",width:"100%",height:"100%",overflow:"hidden"}},{children:z}))}));return Object.assign(Object.assign({},D),{carouselFragment:J,thumbsFragment:H})}const h=s(void 0);function f(){const e=c(h);if(!e)throw new Error("useTransitionCarouselContext must be used within the carousel.");return e}export{g as useTransitionCarousel,f as useTransitionCarouselContext};
 //# sourceMappingURL=useTransitionCarousel.js.map

package/dist/esm/useTransitionCarousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTransitionCarousel.js","sources":["../../src/useTransitionCarousel.tsx"],"sourcesContent":["import { a, config, useTransition } from '@react-spring/web'\nimport { useEffect, useRef, useState, createContext, useContext } from 'react'\nimport { useEventsModule } from './modules/useEventsModule'\nimport { useDrag } from '@use-gesture/react'\nimport { useThumbsModule } from './modules'\nimport {\n  ItemWithThumb,\n  UseTransitionCarouselProps,\n  UseTransitionCarouselReturnProps,\n  SlideActionType,\n  TransitionSlideMode,\n} from './types'\n\nconst defaultAnimationProps = {\n  initial: {\n    opacity: 1,\n    position: 'relative',\n  },\n  from: {\n    opacity: 0,\n    position: 'relative',\n  },\n  enter: {\n    position: 'relative',\n    opacity: 1,\n  },\n  leave: {\n    opacity: 1,\n    position: 'absolute',\n  },\n}\n\nfunction useTransitionCarousel({\n  init = true,\n  disableGestures = false,\n  items,\n  springConfig = config.default,\n  exitBeforeEnter = false,\n  trail,\n  withLoop = false,\n  activeItem: externalActiveItem,\n  toPrevItemSpringProps = defaultAnimationProps,\n  toNextItemSpringProps = defaultAnimationProps,\n  draggingSlideTreshold = 50,\n  thumbsSlideAxis = 'x',\n}: UseTransitionCarouselProps): UseTransitionCarouselReturnProps {\n  const slideActionType = useRef<SlideActionType>('next')\n  const slideModeType = useRef<TransitionSlideMode>('initial')\n  const mainCarouselWrapperRef = useRef<HTMLDivElement | null>(null)\n  const [activeItem, setActiveItem] = useState(externalActiveItem ?? 0)\n  const { emitEvent, useListenToCustomEvent } = useEventsModule<'use-transition'>()\n  const { handleScroll, thumbsFragment } = useThumbsModule({\n    thumbsSlideAxis,\n    items: items as ItemWithThumb[],\n  })\n\n  function getConfig() {\n    if (slideActionType.current === 'prev') {\n      return {\n        initial: {\n          ...toPrevItemSpringProps.initial,\n        },\n        from: {\n          ...toPrevItemSpringProps.from,\n        },\n        enter: {\n          ...toPrevItemSpringProps.enter,\n        },\n        leave: {\n          ...toPrevItemSpringProps.leave,\n        },\n      }\n    }\n    if (slideActionType.current === 'next') {\n      return {\n        initial: {\n          ...toNextItemSpringProps.initial,\n        },\n        from: {\n          ...toNextItemSpringProps.from,\n        },\n        enter: {\n          ...toNextItemSpringProps.enter,\n        },\n        leave: {\n          ...toNextItemSpringProps.leave,\n        },\n      }\n    }\n    return {\n      initial: {\n        ...defaultAnimationProps.initial,\n      },\n      from: {\n        ...defaultAnimationProps.from,\n      },\n      enter: {\n        ...defaultAnimationProps.enter,\n      },\n      leave: {\n        ...defaultAnimationProps.leave,\n      },\n    }\n  }\n\n  useEffect(() => {\n    if (typeof externalActiveItem === 'number' && externalActiveItem !== activeItem) {\n      setActiveItem(externalActiveItem)\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [externalActiveItem])\n\n  type SlideToItem = {\n    to: number\n    slideType: SlideActionType\n    slideMode: TransitionSlideMode\n  }\n\n  function slideToItem({ to, slideType, slideMode }: SlideToItem) {\n    slideActionType.current = slideType\n    slideModeType.current = slideMode\n    emitEvent({\n      eventName: 'onSlideStartChange',\n      slideActionType: slideActionType.current,\n      slideMode: slideModeType.current,\n      nextItem: {\n        index: to,\n        id: items[to].id,\n        startReached: to === 0,\n        endReached: to === items.length - 1,\n      },\n    })\n    setActiveItem(to)\n    handleScroll(activeItem)\n  }\n\n  function slideToPrevItem(slideMode: TransitionSlideMode) {\n    if (!init) return\n    const isFirstItem = activeItem === 0\n\n    if (!withLoop && isFirstItem) return\n\n    if (withLoop && isFirstItem) {\n      slideToItem({\n        to: items.length - 1,\n        slideType: 'prev',\n        slideMode,\n      })\n    } else {\n      slideToItem({\n        to: activeItem - 1,\n        slideType: 'prev',\n        slideMode,\n      })\n    }\n  }\n  function slideToNextItem(slideMode: TransitionSlideMode) {\n    if (!init) return\n    const isLastItem = activeItem === items.length - 1\n\n    if (!withLoop && isLastItem) return\n\n    if (withLoop && isLastItem) {\n      slideToItem({\n        to: 0,\n        slideType: 'next',\n        slideMode,\n      })\n    } else {\n      slideToItem({\n        to: activeItem + 1,\n        slideType: 'next',\n        slideMode,\n      })\n    }\n  }\n\n  const transitions = useTransition(activeItem, {\n    config: springConfig,\n    key: null,\n    trail,\n    exitBeforeEnter,\n    ...getConfig(),\n    onRest(value, _, index) {\n      if (value.finished && index === activeItem) {\n        emitEvent({\n          eventName: 'onSlideChange',\n          slideActionType: slideActionType.current,\n          slideMode: slideModeType.current,\n          currentItem: {\n            index: activeItem,\n            id: items[activeItem].id,\n            startReached: activeItem === 0,\n            endReached: activeItem === items.length - 1,\n          },\n        })\n      }\n    },\n  })\n\n  const bindSwipe = useDrag(\n    ({ last, movement: [mx] }) => {\n      if (last) {\n        const prevItemTreshold = mx > draggingSlideTreshold\n        const nextItemTreshold = mx < -draggingSlideTreshold\n        const isFirstItem = activeItem === 0\n        const isLastItem = activeItem === items.length - 1\n\n        if (nextItemTreshold) {\n          if (!withLoop && isLastItem) return\n\n          emitEvent({\n            eventName: 'onLeftSwipe',\n          })\n          slideToNextItem('swipe')\n        } else if (prevItemTreshold) {\n          if (!withLoop && isFirstItem) return\n\n          emitEvent({\n            eventName: 'onRightSwipe',\n          })\n          slideToPrevItem('swipe')\n        }\n      }\n    },\n    {\n      enabled: !disableGestures,\n    },\n  )\n\n  const itemsFragment = transitions((styles, item, _, indx) => {\n    return (\n      <a.div\n        id={`use-transition-carousel-item-${indx}`}\n        className=\"use-transition-carousel-item\"\n        style={{\n          ...styles,\n          flex: '1 0 100%',\n          width: '100%',\n          height: '100%',\n        }}\n      >\n        {items[item].renderItem}\n      </a.div>\n    )\n  })\n\n  const res = {\n    useListenToCustomEvent,\n    slideToPrevItem: () => slideToPrevItem('click'),\n    slideToNextItem: () => slideToNextItem('click'),\n  }\n\n  const _thumbsFragment = (\n    <Context.Provider value={res}>{thumbsFragment}</Context.Provider>\n  )\n  const carouselFragment = (\n    <Context.Provider value={res}>\n      <div\n        ref={mainCarouselWrapperRef}\n        {...bindSwipe()}\n        style={{\n          display: 'flex',\n          position: 'relative',\n          width: '100%',\n          height: '100%',\n          overflow: 'hidden',\n        }}\n      >\n        {itemsFragment}\n      </div>\n    </Context.Provider>\n  )\n\n  return {\n    ...res,\n    carouselFragment,\n    thumbsFragment: _thumbsFragment,\n  }\n}\n\ntype ContextProps = Omit<\n  UseTransitionCarouselReturnProps,\n  'carouselFragment' | 'thumbsFragment'\n>\n\nconst Context = createContext<ContextProps | undefined>(undefined)\n\nfunction useTransitionCarouselContext() {\n  const context = useContext(Context)\n  if (!context) {\n    throw new Error('useTransitionCarouselContext must be used within the carousel.')\n  }\n  return context\n}\n\nexport { useTransitionCarousel, useTransitionCarouselContext }\n"],"names":["defaultAnimationProps","initial","opacity","position","from","enter","leave","useTransitionCarousel","init","disableGestures","items","springConfig","config","default","exitBeforeEnter","trail","withLoop","activeItem","externalActiveItem","toPrevItemSpringProps","toNextItemSpringProps","draggingSlideTreshold","thumbsSlideAxis","slideActionType","useRef","slideModeType","mainCarouselWrapperRef","setActiveItem","useState","emitEvent","useListenToCustomEvent","useEventsModule","handleScroll","thumbsFragment","useThumbsModule","slideToItem","to","slideType","slideMode","current","eventName","nextItem","index","id","startReached","endReached","length","slideToPrevItem","isFirstItem","slideToNextItem","isLastItem","useEffect","transitions","useTransition","Object","assign","key","onRest","value","_","finished","currentItem","bindSwipe","useDrag","last","movement","mx","prevItemTreshold","nextItemTreshold","enabled","itemsFragment","styles","item","indx","_jsx","a","div","className","style","flex","width","height","children","renderItem","res","_thumbsFragment","Context","Provider","carouselFragment","ref","display","overflow","createContext","undefined","useTransitionCarouselContext","context","useContext","Error"],"mappings":"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"}
+{"version":3,"file":"useTransitionCarousel.js","sources":["../../src/useTransitionCarousel.tsx"],"sourcesContent":["import { a, config, useTransition } from '@react-spring/web'\nimport { useEffect, useRef, useState, createContext, useContext } from 'react'\nimport { useEventsModule } from './modules/useEventsModule'\nimport { useDrag } from '@use-gesture/react'\nimport { useThumbsModule } from './modules'\nimport {\n  ItemWithThumb,\n  UseTransitionCarouselProps,\n  UseTransitionCarouselReturnProps,\n  SlideActionType,\n  TransitionSlideMode,\n} from './types'\n\nconst defaultAnimationProps = {\n  initial: {\n    opacity: 1,\n    position: 'relative',\n  },\n  from: {\n    opacity: 0,\n    position: 'relative',\n  },\n  enter: {\n    position: 'relative',\n    opacity: 1,\n  },\n  leave: {\n    opacity: 1,\n    position: 'absolute',\n  },\n}\n\nfunction useTransitionCarousel({\n  init = true,\n  disableGestures = false,\n  items,\n  springConfig = config.default,\n  exitBeforeEnter = false,\n  trail,\n  withLoop = false,\n  activeItem: externalActiveItem,\n  toPrevItemSpringProps = defaultAnimationProps,\n  toNextItemSpringProps = defaultAnimationProps,\n  draggingSlideTreshold = 50,\n  thumbsSlideAxis = 'x',\n}: UseTransitionCarouselProps): UseTransitionCarouselReturnProps {\n  const slideActionType = useRef<SlideActionType>('next')\n  const slideModeType = useRef<TransitionSlideMode>('initial')\n  const mainCarouselWrapperRef = useRef<HTMLDivElement | null>(null)\n  const [activeItem, setActiveItem] = useState(externalActiveItem ?? 0)\n  const { emitEvent, useListenToCustomEvent } = useEventsModule<'use-transition'>()\n  const { handleScroll, thumbsFragment } = useThumbsModule<'use-transition'>({\n    thumbsSlideAxis,\n    items: items as ItemWithThumb<'use-transition'>[],\n    renderThumbFnProps: {\n      getIsNextItem,\n      getIsPrevItem,\n      useListenToCustomEvent,\n      activeItem: {\n        index: activeItem,\n        id: items[activeItem].id,\n      },\n    },\n  })\n\n  function getConfig() {\n    if (slideActionType.current === 'prev') {\n      return {\n        initial: {\n          ...toPrevItemSpringProps.initial,\n        },\n        from: {\n          ...toPrevItemSpringProps.from,\n        },\n        enter: {\n          ...toPrevItemSpringProps.enter,\n        },\n        leave: {\n          ...toPrevItemSpringProps.leave,\n        },\n      }\n    }\n    if (slideActionType.current === 'next') {\n      return {\n        initial: {\n          ...toNextItemSpringProps.initial,\n        },\n        from: {\n          ...toNextItemSpringProps.from,\n        },\n        enter: {\n          ...toNextItemSpringProps.enter,\n        },\n        leave: {\n          ...toNextItemSpringProps.leave,\n        },\n      }\n    }\n    return {\n      initial: {\n        ...defaultAnimationProps.initial,\n      },\n      from: {\n        ...defaultAnimationProps.from,\n      },\n      enter: {\n        ...defaultAnimationProps.enter,\n      },\n      leave: {\n        ...defaultAnimationProps.leave,\n      },\n    }\n  }\n\n  useEffect(() => {\n    if (typeof externalActiveItem === 'number' && externalActiveItem !== activeItem) {\n      setActiveItem(externalActiveItem)\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [externalActiveItem])\n\n  type SlideToItem = {\n    to: number\n    slideType: SlideActionType\n    slideMode: TransitionSlideMode\n  }\n\n  function slideToItem({ to, slideType, slideMode }: SlideToItem) {\n    slideActionType.current = slideType\n    slideModeType.current = slideMode\n    emitEvent({\n      eventName: 'onSlideStartChange',\n      slideActionType: slideActionType.current,\n      slideMode: slideModeType.current,\n      nextItem: {\n        index: to,\n        id: items[to].id,\n        startReached: to === 0,\n        endReached: to === items.length - 1,\n      },\n    })\n    setActiveItem(to)\n    handleScroll(activeItem)\n  }\n\n  function slideToPrevItem(slideMode: TransitionSlideMode) {\n    if (!init) return\n    const isFirstItem = activeItem === 0\n\n    if (!withLoop && isFirstItem) return\n\n    if (withLoop && isFirstItem) {\n      slideToItem({\n        to: items.length - 1,\n        slideType: 'prev',\n        slideMode,\n      })\n    } else {\n      slideToItem({\n        to: activeItem - 1,\n        slideType: 'prev',\n        slideMode,\n      })\n    }\n  }\n  function slideToNextItem(slideMode: TransitionSlideMode) {\n    if (!init) return\n    const isLastItem = activeItem === items.length - 1\n\n    if (!withLoop && isLastItem) return\n\n    if (withLoop && isLastItem) {\n      slideToItem({\n        to: 0,\n        slideType: 'next',\n        slideMode,\n      })\n    } else {\n      slideToItem({\n        to: activeItem + 1,\n        slideType: 'next',\n        slideMode,\n      })\n    }\n  }\n\n  const transitions = useTransition(activeItem, {\n    config: springConfig,\n    key: null,\n    trail,\n    exitBeforeEnter,\n    ...getConfig(),\n    onRest(value, _, index) {\n      if (value.finished && index === activeItem) {\n        emitEvent({\n          eventName: 'onSlideChange',\n          slideActionType: slideActionType.current,\n          slideMode: slideModeType.current,\n          currentItem: {\n            index: activeItem,\n            id: items[activeItem].id,\n            startReached: activeItem === 0,\n            endReached: activeItem === items.length - 1,\n          },\n        })\n      }\n    },\n  })\n\n  const bindSwipe = useDrag(\n    ({ last, movement: [mx] }) => {\n      if (last) {\n        const prevItemTreshold = mx > draggingSlideTreshold\n        const nextItemTreshold = mx < -draggingSlideTreshold\n        const isFirstItem = activeItem === 0\n        const isLastItem = activeItem === items.length - 1\n\n        if (nextItemTreshold) {\n          if (!withLoop && isLastItem) return\n\n          emitEvent({\n            eventName: 'onLeftSwipe',\n          })\n          slideToNextItem('swipe')\n        } else if (prevItemTreshold) {\n          if (!withLoop && isFirstItem) return\n\n          emitEvent({\n            eventName: 'onRightSwipe',\n          })\n          slideToPrevItem('swipe')\n        }\n      }\n    },\n    {\n      enabled: !disableGestures,\n    },\n  )\n\n  function findItemIndex(id: string | number, error?: string) {\n    let itemIndex = 0\n\n    if (typeof id === 'string') {\n      itemIndex = items.findIndex(item => item.id === id)\n    } else {\n      itemIndex = id\n    }\n    if (itemIndex < 0 || itemIndex >= items.length) {\n      if (error) {\n        throw new Error(error)\n      }\n      console.error(\n        `The item doesn't exist; check that the id provided - ${id} - is correct.`,\n      )\n      itemIndex = -1\n    }\n\n    return itemIndex\n  }\n  function getIsNextItem(id: string | number) {\n    const itemIndex = findItemIndex(id, \"The item doesn't exist; check the provided id.\")\n    const _activeItem = activeItem\n    if (withLoop && _activeItem === items.length - 1) {\n      return itemIndex === 0\n    }\n    return itemIndex === _activeItem + 1\n  }\n  function getIsPrevItem(id: string | number) {\n    const itemIndex = findItemIndex(id, \"The item doesn't exist; check the provided id.\")\n    const _activeItem = activeItem\n    if (withLoop && _activeItem === 0) {\n      return itemIndex === items.length - 1\n    }\n    return itemIndex === _activeItem - 1\n  }\n\n  const itemsFragment = transitions((styles, item, _, indx) => {\n    const renderItem = items[item].renderItem\n    return (\n      <a.div\n        id={`use-transition-carousel-item-${indx}`}\n        className=\"use-transition-carousel-item\"\n        style={{\n          ...styles,\n          flex: '1 0 100%',\n          width: '100%',\n          height: '100%',\n        }}\n      >\n        {typeof renderItem === 'function'\n          ? renderItem({\n              useListenToCustomEvent,\n              getIsNextItem,\n              getIsPrevItem,\n              activeItem: {\n                index: activeItem,\n                id: items[activeItem].id,\n              },\n            })\n          : renderItem}\n      </a.div>\n    )\n  })\n\n  const result = {\n    useListenToCustomEvent,\n    slideToPrevItem: () => slideToPrevItem('click'),\n    slideToNextItem: () => slideToNextItem('click'),\n  }\n\n  const _thumbsFragment = (\n    <Context.Provider value={result}>{thumbsFragment}</Context.Provider>\n  )\n  const carouselFragment = (\n    <Context.Provider value={result}>\n      <div\n        ref={mainCarouselWrapperRef}\n        {...bindSwipe()}\n        style={{\n          display: 'flex',\n          position: 'relative',\n          width: '100%',\n          height: '100%',\n          overflow: 'hidden',\n        }}\n      >\n        {itemsFragment}\n      </div>\n    </Context.Provider>\n  )\n\n  return {\n    ...result,\n    carouselFragment,\n    thumbsFragment: _thumbsFragment,\n  }\n}\n\ntype ContextProps = Omit<\n  UseTransitionCarouselReturnProps,\n  'carouselFragment' | 'thumbsFragment'\n>\n\nconst Context = createContext<ContextProps | undefined>(undefined)\n\nfunction useTransitionCarouselContext() {\n  const context = useContext(Context)\n  if (!context) {\n    throw new Error('useTransitionCarouselContext must be used within the carousel.')\n  }\n  return context\n}\n\nexport { useTransitionCarousel, useTransitionCarouselContext }\n"],"names":["defaultAnimationProps","initial","opacity","position","from","enter","leave","useTransitionCarousel","init","disableGestures","items","springConfig","config","default","exitBeforeEnter","trail","withLoop","activeItem","externalActiveItem","toPrevItemSpringProps","toNextItemSpringProps","draggingSlideTreshold","thumbsSlideAxis","slideActionType","useRef","slideModeType","mainCarouselWrapperRef","setActiveItem","useState","emitEvent","useListenToCustomEvent","useEventsModule","handleScroll","thumbsFragment","useThumbsModule","renderThumbFnProps","getIsNextItem","getIsPrevItem","index","id","slideToItem","to","slideType","slideMode","current","eventName","nextItem","startReached","endReached","length","slideToPrevItem","isFirstItem","slideToNextItem","isLastItem","useEffect","transitions","useTransition","Object","assign","key","onRest","value","_","finished","currentItem","bindSwipe","useDrag","last","movement","mx","prevItemTreshold","nextItemTreshold","enabled","findItemIndex","error","itemIndex","findIndex","item","Error","console","_activeItem","itemsFragment","styles","indx","renderItem","_jsx","a","div","className","style","flex","width","height","children","result","_thumbsFragment","Context","Provider","carouselFragment","ref","display","overflow","createContext","undefined","useTransitionCarouselContext","context","useContext"],"mappings":"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"}

package/dist/types/modules/useThumbsModule.d.ts

@@ -1,12 +1,13 @@
 /// <reference types="react" />
-import { ItemWithThumb, PrepareThumbsData, SpringCarouselWithThumbs } from '../types';
-declare type Props = {
+import { ItemWithThumb, PrepareThumbsData, RenderItemProps, SpringCarouselWithThumbs } from '../types';
+declare type Props<T extends 'use-spring' | 'use-transition'> = {
     withThumbs?: boolean;
     thumbsSlideAxis: SpringCarouselWithThumbs['thumbsSlideAxis'];
-    prepareThumbsData?: PrepareThumbsData;
-    items: ItemWithThumb[];
+    prepareThumbsData?: PrepareThumbsData<T>;
+    items: ItemWithThumb<T>[];
+    renderThumbFnProps: RenderItemProps<T>;
 };
-export declare function useThumbsModule({ thumbsSlideAxis, withThumbs, prepareThumbsData, items, }: Props): {
+export declare function useThumbsModule<T extends 'use-spring' | 'use-transition'>({ thumbsSlideAxis, withThumbs, prepareThumbsData, items, renderThumbFnProps, }: Props<T>): {
     thumbsFragment: JSX.Element | null;
     handleScroll: (activeItem: number) => void;
 };

package/dist/types/types/common.d.ts

@@ -4,21 +4,31 @@ import { UseSpringReturnType } from './useSpringCarousel.types';
 export declare type SlideActionType = 'prev' | 'next' | 'initial';
 export declare type SlideMode = 'drag' | 'click' | 'initial';
 export declare type TransitionSlideMode = 'swipe' | 'click' | 'initial';
-export declare type RenderItemProps = {
+declare type SpringRenderItem = {
     useListenToCustomEvent: UseListenToCustomEvent<'use-spring'>['useListenToCustomEvent'];
     getIsActiveItem: UseSpringReturnType['getIsActiveItem'];
     getIsPrevItem: UseSpringReturnType['getIsPrevItem'];
     getIsNextItem: UseSpringReturnType['getIsNextItem'];
 };
-declare type RenderItemFn = (props: RenderItemProps) => JSX.Element;
-export declare type ItemWithThumb = {
+declare type TransitionRenderItem = {
+    getIsPrevItem: UseSpringReturnType['getIsPrevItem'];
+    getIsNextItem: UseSpringReturnType['getIsNextItem'];
+    useListenToCustomEvent: UseListenToCustomEvent<'use-transition'>['useListenToCustomEvent'];
+    activeItem: {
+        index: number;
+        id: string;
+    };
+};
+export declare type RenderItemProps<T> = T extends 'use-spring' ? SpringRenderItem : TransitionRenderItem;
+declare type RenderItemFn<T> = (props: RenderItemProps<T>) => JSX.Element;
+export declare type ItemWithThumb<T extends 'use-spring' | 'use-transition'> = {
     id: string;
-    renderItem: ReactNode | RenderItemFn;
-    renderThumb: ReactNode | RenderItemFn;
+    renderItem: ReactNode | RenderItemFn<T>;
+    renderThumb: ReactNode | RenderItemFn<T>;
 };
-export declare type ItemWithNoThumb = {
+export declare type ItemWithNoThumb<T extends 'use-spring' | 'use-transition'> = {
     id: string;
-    renderItem: ReactNode | RenderItemFn;
+    renderItem: ReactNode | RenderItemFn<T>;
 };
-export declare type PrepareThumbsData = (items: Omit<ItemWithThumb, 'renderItem'>[]) => Omit<ItemWithThumb, 'renderItem'>[];
+export declare type PrepareThumbsData<T extends 'use-spring' | 'use-transition'> = (items: Omit<ItemWithThumb<T>, 'renderItem'>[]) => Omit<ItemWithThumb<T>, 'renderItem'>[];
 export {};

package/dist/types/types/useSpringCarousel.types.d.ts

@@ -8,9 +8,9 @@ export declare type UseSpringReturnType = {
     getIsFullscreen(): boolean;
     enterFullscreen(ref?: HTMLElement): void;
     exitFullscreen(): void;
-    slideToNextItem(): void;
-    slideToPrevItem(): void;
-    slideToItem(item: string | number): void;
+    slideToNextItem(animate?: boolean): void;
+    slideToPrevItem(animate?: boolean): void;
+    slideToItem(item: string | number, animate?: boolean): void;
     getIsActiveItem(id: string): boolean;
     getIsNextItem(id: string | number): boolean;
     getIsPrevItem(id: string | number): boolean;
@@ -22,20 +22,20 @@ export declare type UseSpringFreeScrollReturnType = {
     getIsFullscreen(): boolean;
     enterFullscreen(ref?: HTMLElement): void;
     exitFullscreen(): void;
-    slideToNextItem(): void;
-    slideToPrevItem(): void;
+    slideToNextItem(animate?: boolean): void;
+    slideToPrevItem(animate?: boolean): void;
 };
 export declare type SlideType = 'fixed' | 'fluid';
-export declare type SpringCarouselWithThumbs = {
+export declare type SpringCarouselWithThumbs<T = 'use-spring'> = {
     withThumbs: true;
     thumbsSlideAxis?: 'x' | 'y';
-    items: ItemWithThumb[];
-    prepareThumbsData?: PrepareThumbsData;
+    items: ItemWithThumb<T>[];
+    prepareThumbsData?: PrepareThumbsData<T>;
 };
-export declare type SpringCarouselWithNoThumbs = {
+export declare type SpringCarouselWithNoThumbs<T = 'use-spring'> = {
     withThumbs?: false | undefined;
     thumbsSlideAxis?: never;
-    items: ItemWithNoThumb[];
+    items: ItemWithNoThumb<T>[];
     prepareThumbsData?: never;
 };
 export declare type SpringCarouselWithFixedItems = {
@@ -78,6 +78,11 @@ export declare type SpringCarouselNoFreeScroll = {
     animateWhenActiveItemChange?: boolean;
     slideWhenThresholdIsReached?: boolean;
 };
+export declare type ControllerRef = {
+    slideToNextItem: UseSpringReturnType['slideToNextItem'];
+    slideToPrevItem: UseSpringReturnType['slideToPrevItem'];
+    slideToItem?: UseSpringReturnType['slideToItem'];
+};
 export declare type BaseProps = {
     init?: boolean;
     gutter?: number;
@@ -85,6 +90,7 @@ export declare type BaseProps = {
     draggingSlideTreshold?: number;
     disableGestures?: boolean;
     startEndGutter?: number;
+    getControllerRef?(ref: ControllerRef): void;
 };
 declare type ScrollType<T> = T extends true ? SpringCarouselFreeScroll : SpringCarouselNoFreeScroll;
 export declare type UseSpringCarouselWithThumbs<T> = BaseProps & SpringCarouselWithThumbs & ScrollType<T> & (SpringCarouselWithFixedItems | SpringCarouselWithNoFixedItems) & (SpringCarouselWithLoop | SpringCarouselWithNoLoop);

package/dist/types/types/useTransitionCarousel.types.d.ts

@@ -2,7 +2,7 @@ import { SpringConfig, TransitionFrom, TransitionTo } from '@react-spring/web';
 import { ItemWithNoThumb, ItemWithThumb, SpringCarouselWithNoThumbs, SpringCarouselWithThumbs } from '../types';
 import { ReactNode } from 'react';
 import { UseListenToCustomEvent } from 'src/modules';
-declare type Item = ItemWithThumb | ItemWithNoThumb;
+declare type Item = ItemWithThumb<'use-transition'> | ItemWithNoThumb<'use-transition'>;
 export declare type SpringAnimationProps = {
     initial: TransitionFrom<Item>;
     from: TransitionFrom<Item>;
@@ -22,7 +22,7 @@ declare type BaseProps = {
     thumbsSlideAxis?: 'x' | 'y';
     activeItem?: number;
 };
-export declare type UseTransitionCarouselProps = BaseProps & (SpringCarouselWithThumbs | SpringCarouselWithNoThumbs);
+export declare type UseTransitionCarouselProps = BaseProps & (SpringCarouselWithThumbs<'use-transition'> | SpringCarouselWithNoThumbs<'use-transition'>);
 export declare type UseTransitionCarouselReturnProps = {
     useListenToCustomEvent: UseListenToCustomEvent<'use-transition'>['useListenToCustomEvent'];
     carouselFragment: ReactNode;