2900-a38fc37e9732f9269284.js.map

{"version":3,"file":"2900-a38fc37e9732f9269284.js","mappings":"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","sources":["webpack://embla-carousel-docs/../src/components/AutoHeight.ts","webpack://embla-carousel-docs/./src/components/Sandbox/React/SandboxFilesSrc/AutoHeight/EmblaCarousel.tsx","webpack://embla-carousel-docs/./src/components/Sandbox/React/SandboxFilesSrc/EmblaCarouselDotButton.tsx"],"sourcesContent":["import { OptionsType } from './Options'\nimport {\n  EmblaEventType,\n  CreatePluginType,\n  EmblaCarouselType\n} from 'embla-carousel'\n\ndeclare module 'embla-carousel' {\n  interface EmblaPluginsType {\n    autoHeight: AutoHeightType\n  }\n}\n\nexport type AutoHeightType = CreatePluginType<{}, OptionsType>\n\nexport type AutoHeightOptionsType = AutoHeightType['options']\n\nfunction AutoHeight(userOptions: AutoHeightOptionsType = {}): AutoHeightType {\n  let emblaApi: EmblaCarouselType\n  let slideHeights: number[] = []\n  const heightEvents: EmblaEventType[] = ['select', 'slideFocus']\n\n  function init(emblaApiInstance: EmblaCarouselType): void {\n    emblaApi = emblaApiInstance\n\n    const {\n      options: { axis },\n      slideRects\n    } = emblaApi.internalEngine()\n\n    if (axis === 'y') return\n\n    slideHeights = slideRects.map((slideRect) => slideRect.height)\n\n    heightEvents.forEach((evt) => emblaApi.on(evt, setContainerHeight))\n    setContainerHeight()\n  }\n\n  function destroy(): void {\n    heightEvents.forEach((evt) => emblaApi.off(evt, setContainerHeight))\n    const container = emblaApi.containerNode()\n    container.style.height = ''\n    if (!container.getAttribute('style')) container.removeAttribute('style')\n  }\n\n  function highestInView(): number {\n    const { slideRegistry } = emblaApi.internalEngine()\n    const selectedIndexes = slideRegistry[emblaApi.selectedScrollSnap()]\n\n    return selectedIndexes\n      .map((index) => slideHeights[index])\n      .reduce((a, b) => Math.max(a, b), 0)\n  }\n\n  function setContainerHeight(): void {\n    emblaApi.containerNode().style.height = `${highestInView()}px`\n  }\n\n  const self: AutoHeightType = {\n    name: 'autoHeight',\n    options: userOptions,\n    init,\n    destroy\n  }\n  return self\n}\n\ndeclare namespace AutoHeight {\n  let globalOptions: AutoHeightOptionsType | undefined\n}\n\nAutoHeight.globalOptions = undefined\n\nexport default AutoHeight\n","import React from 'react'\nimport { EmblaOptionsType } from 'embla-carousel'\nimport useEmblaCarousel from 'embla-carousel-react'\nimport AutoHeight from 'embla-carousel-auto-height'\nimport {\n  NextButton,\n  PrevButton,\n  usePrevNextButtons\n} from '../EmblaCarouselArrowButtons'\nimport { DotButton, useDotButton } from '../EmblaCarouselDotButton'\n\ntype PropType = {\n  slides: number[]\n  options?: EmblaOptionsType\n}\n\nconst EmblaCarousel: React.FC<PropType> = (props) => {\n  const { slides, options } = props\n  const [emblaRef, emblaApi] = useEmblaCarousel(options, [AutoHeight()])\n\n  const { selectedIndex, scrollSnaps, onDotButtonClick } =\n    useDotButton(emblaApi)\n\n  const {\n    prevBtnDisabled,\n    nextBtnDisabled,\n    onPrevButtonClick,\n    onNextButtonClick\n  } = usePrevNextButtons(emblaApi)\n\n  return (\n    <div className=\"embla\">\n      <div className=\"embla__viewport\" ref={emblaRef}>\n        <div className=\"embla__container\">\n          {slides.map((index) => (\n            <div className=\"embla__slide\" key={index}>\n              <div className=\"embla__slide__number\">\n                <span>{index + 1}</span>\n              </div>\n            </div>\n          ))}\n        </div>\n      </div>\n\n      <div className=\"embla__controls\">\n        <div className=\"embla__buttons\">\n          <PrevButton onClick={onPrevButtonClick} disabled={prevBtnDisabled} />\n          <NextButton onClick={onNextButtonClick} disabled={nextBtnDisabled} />\n        </div>\n\n        <div className=\"embla__dots\">\n          {scrollSnaps.map((_, index) => (\n            <DotButton\n              key={index}\n              onClick={() => onDotButtonClick(index)}\n              className={'embla__dot'.concat(\n                index === selectedIndex ? ' embla__dot--selected' : ''\n              )}\n            />\n          ))}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default EmblaCarousel\n","import React, {\n  ComponentPropsWithRef,\n  useCallback,\n  useEffect,\n  useState\n} from 'react'\nimport { EmblaCarouselType } from 'embla-carousel'\n\ntype UseDotButtonType = {\n  selectedIndex: number\n  scrollSnaps: number[]\n  onDotButtonClick: (index: number) => void\n}\n\nexport const useDotButton = (\n  emblaApi: EmblaCarouselType | undefined,\n  onButtonClick?: (emblaApi: EmblaCarouselType) => void\n): UseDotButtonType => {\n  const [selectedIndex, setSelectedIndex] = useState(0)\n  const [scrollSnaps, setScrollSnaps] = useState<number[]>([])\n\n  const onDotButtonClick = useCallback(\n    (index: number) => {\n      if (!emblaApi) return\n      emblaApi.scrollTo(index)\n      if (onButtonClick) onButtonClick(emblaApi)\n    },\n    [emblaApi, onButtonClick]\n  )\n\n  const onInit = useCallback((emblaApi: EmblaCarouselType) => {\n    setScrollSnaps(emblaApi.scrollSnapList())\n  }, [])\n\n  const onSelect = useCallback((emblaApi: EmblaCarouselType) => {\n    setSelectedIndex(emblaApi.selectedScrollSnap())\n  }, [])\n\n  useEffect(() => {\n    if (!emblaApi) return\n\n    onInit(emblaApi)\n    onSelect(emblaApi)\n\n    emblaApi.on('reInit', onInit).on('reInit', onSelect).on('select', onSelect)\n  }, [emblaApi, onInit, onSelect])\n\n  return {\n    selectedIndex,\n    scrollSnaps,\n    onDotButtonClick\n  }\n}\n\ntype PropType = ComponentPropsWithRef<'button'>\n\nexport const DotButton: React.FC<PropType> = (props) => {\n  const { children, ...restProps } = props\n\n  return (\n    <button type=\"button\" {...restProps}>\n      {children}\n    </button>\n  )\n}\n"],"names":["AutoHeight","userOptions","emblaApi","slideHeights","heightEvents","setContainerHeight","containerNode","style","height","slideRegistry","internalEngine","selectedScrollSnap","map","index","reduce","a","b","Math","max","highestInView","name","options","init","emblaApiInstance","axis","slideRects","slideRect","forEach","evt","on","destroy","off","container","getAttribute","removeAttribute","globalOptions","undefined","props","slides","emblaRef","useEmblaCarousel","selectedIndex","scrollSnaps","onDotButtonClick","useDotButton","prevBtnDisabled","nextBtnDisabled","onPrevButtonClick","onNextButtonClick","usePrevNextButtons","React","className","ref","key","PrevButton","onClick","disabled","NextButton","_","DotButton","concat","onButtonClick","setSelectedIndex","useState","setScrollSnaps","useCallback","scrollTo","onInit","scrollSnapList","onSelect","useEffect","children","restProps","Object","assign","type"],"sourceRoot":""}