-
-
Notifications
You must be signed in to change notification settings - Fork 195
/
2682-ea2dd26c33112f5be706.js
2 lines (2 loc) · 5.86 KB
/
2682-ea2dd26c33112f5be706.js
1
2
"use strict";(self.webpackChunkembla_carousel_docs=self.webpackChunkembla_carousel_docs||[]).push([[2682],{2682:function(n,_,e){e.r(_),_.default='import React, {\n ComponentPropsWithRef,\n useCallback,\n useEffect,\n useState\n} from \'react\'\nimport { EmblaCarouselType } from \'embla-carousel\'\n\ntype UsePrevNextButtonsType = {\n prevBtnDisabled: boolean\n nextBtnDisabled: boolean\n onPrevButtonClick: () => void\n onNextButtonClick: () => void\n}\n\nexport const usePrevNextButtons = (\n emblaApi: EmblaCarouselType | undefined,\n /*__NAV_AUTOPLAY_REPLACE_START__*/\n onButtonClick?: (emblaApi: EmblaCarouselType) => void\n /*__NAV_AUTOPLAY_REPLACE_END__*/\n): UsePrevNextButtonsType => {\n const [prevBtnDisabled, setPrevBtnDisabled] = useState(true)\n const [nextBtnDisabled, setNextBtnDisabled] = useState(true)\n\n const onPrevButtonClick = useCallback(() => {\n if (!emblaApi) return\n emblaApi.scrollPrev()\n /*__NAV_AUTOPLAY_REPLACE_START__*/\n if (onButtonClick) onButtonClick(emblaApi)\n /*__NAV_AUTOPLAY_REPLACE_END__*/\n }, [\n emblaApi,\n /*__NAV_AUTOPLAY_REPLACE_START__*/ onButtonClick /*__NAV_AUTOPLAY_REPLACE_END__*/\n ])\n\n const onNextButtonClick = useCallback(() => {\n if (!emblaApi) return\n emblaApi.scrollNext()\n /*__NAV_AUTOPLAY_REPLACE_START__*/\n if (onButtonClick) onButtonClick(emblaApi)\n /*__NAV_AUTOPLAY_REPLACE_END__*/\n }, [\n emblaApi,\n /*__NAV_AUTOPLAY_REPLACE_START__*/ onButtonClick /*__NAV_AUTOPLAY_REPLACE_END__*/\n ])\n\n const onSelect = useCallback((emblaApi: EmblaCarouselType) => {\n setPrevBtnDisabled(!emblaApi.canScrollPrev())\n setNextBtnDisabled(!emblaApi.canScrollNext())\n }, [])\n\n useEffect(() => {\n if (!emblaApi) return\n\n onSelect(emblaApi)\n emblaApi.on(\'reInit\', onSelect).on(\'select\', onSelect)\n }, [emblaApi, onSelect])\n\n return {\n prevBtnDisabled,\n nextBtnDisabled,\n onPrevButtonClick,\n onNextButtonClick\n }\n}\n\ntype PropType = ComponentPropsWithRef<\'button\'>\n\nexport const PrevButton: React.FC<PropType> = (props) => {\n const { children, ...restProps } = props\n\n return (\n <button\n className="embla__button embla__button--prev"\n type="button"\n {...restProps}\n >\n <svg className="embla__button__svg" viewBox="0 0 532 532">\n {/*__PREV_NEXT_BUTTONS_RTL_REPLACE_START__*/}\n <path\n fill="currentColor"\n d="M176.34 520.646c-13.793 13.805-36.208 13.805-50.001 0-13.785-13.804-13.785-36.238 0-50.034L330.78 266 126.34 61.391c-13.785-13.805-13.785-36.239 0-50.044 13.793-13.796 36.208-13.796 50.002 0 22.928 22.947 206.395 206.507 229.332 229.454a35.065 35.065 0 0 1 10.326 25.126c0 9.2-3.393 18.26-10.326 25.2-45.865 45.901-206.404 206.564-229.332 229.52Z"\n />\n {/*__PREV_NEXT_BUTTONS_RTL_REPLACE_END__*/}\n {/*__PREV_NEXT_BUTTONS_LTR_REPLACE_START__*/}\n <path\n fill="currentColor"\n d="M355.66 11.354c13.793-13.805 36.208-13.805 50.001 0 13.785 13.804 13.785 36.238 0 50.034L201.22 266l204.442 204.61c13.785 13.805 13.785 36.239 0 50.044-13.793 13.796-36.208 13.796-50.002 0a5994246.277 5994246.277 0 0 0-229.332-229.454 35.065 35.065 0 0 1-10.326-25.126c0-9.2 3.393-18.26 10.326-25.2C172.192 194.973 332.731 34.31 355.66 11.354Z"\n />\n {/*__PREV_NEXT_BUTTONS_LTR_REPLACE_END__*/}\n {/*__PREV_NEXT_BUTTONS_VERTICAL_REPLACE_START__*/}\n <path\n fill="currentColor"\n d="M520.646 355.66c13.805 13.793 13.805 36.208 0 50.001-13.804 13.785-36.238 13.785-50.034 0L266 201.22 61.391 405.66c-13.805 13.785-36.239 13.785-50.044 0-13.796-13.793-13.796-36.208 0-50.002 22.947-22.928 206.507-206.395 229.454-229.332a35.065 35.065 0 0 1 25.126-10.326c9.2 0 18.26 3.393 25.2 10.326 45.901 45.865 206.564 206.404 229.52 229.332Z"\n />\n {/*__PREV_NEXT_BUTTONS_VERTICAL_REPLACE_END__*/}\n </svg>\n {children}\n </button>\n )\n}\n\nexport const NextButton: React.FC<PropType> = (props) => {\n const { children, ...restProps } = props\n\n return (\n <button\n className="embla__button embla__button--next"\n type="button"\n {...restProps}\n >\n <svg className="embla__button__svg" viewBox="0 0 532 532">\n {/*__PREV_NEXT_BUTTONS_RTL_REPLACE_START__*/}\n <path\n fill="currentColor"\n d="M355.66 11.354c13.793-13.805 36.208-13.805 50.001 0 13.785 13.804 13.785 36.238 0 50.034L201.22 266l204.442 204.61c13.785 13.805 13.785 36.239 0 50.044-13.793 13.796-36.208 13.796-50.002 0a5994246.277 5994246.277 0 0 0-229.332-229.454 35.065 35.065 0 0 1-10.326-25.126c0-9.2 3.393-18.26 10.326-25.2C172.192 194.973 332.731 34.31 355.66 11.354Z"\n />\n {/*__PREV_NEXT_BUTTONS_RTL_REPLACE_END__*/}\n {/*__PREV_NEXT_BUTTONS_LTR_REPLACE_START__*/}\n <path\n fill="currentColor"\n d="M176.34 520.646c-13.793 13.805-36.208 13.805-50.001 0-13.785-13.804-13.785-36.238 0-50.034L330.78 266 126.34 61.391c-13.785-13.805-13.785-36.239 0-50.044 13.793-13.796 36.208-13.796 50.002 0 22.928 22.947 206.395 206.507 229.332 229.454a35.065 35.065 0 0 1 10.326 25.126c0 9.2-3.393 18.26-10.326 25.2-45.865 45.901-206.404 206.564-229.332 229.52Z"\n />\n {/*__PREV_NEXT_BUTTONS_LTR_REPLACE_END__*/}\n {/*__PREV_NEXT_BUTTONS_VERTICAL_REPLACE_START__*/}\n <path\n fill="currentColor"\n d="M11.354 176.34c-13.805-13.793-13.805-36.208 0-50.001 13.804-13.785 36.238-13.785 50.034 0L266 330.78l204.61-204.442c13.805-13.785 36.239-13.785 50.044 0 13.796 13.793 13.796 36.208 0 50.002a5994246.277 5994246.277 0 0 0-229.454 229.332 35.065 35.065 0 0 1-25.126 10.326c-9.2 0-18.26-3.393-25.2-10.326C194.973 359.808 34.31 199.269 11.354 176.34Z"\n />\n {/*__PREV_NEXT_BUTTONS_VERTICAL_REPLACE_END__*/}\n </svg>\n {children}\n </button>\n )\n}\n'}}]);
//# sourceMappingURL=2682-ea2dd26c33112f5be706.js.map