3376-f41dc652fe02408f9140.js

"use strict";(self.webpackChunkembla_carousel_docs=self.webpackChunkembla_carousel_docs||[]).push([[3376],{3376:function(a,e,s){s.r(e),e.default="import React, { useState, useCallback } from 'react';\n\nconst PLACEHOLDER_SRC = `data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs%3D`;\n\nexport const LazyLoadImage = (props) => {\n    const { imgSrc, inView } = props;\n    const [hasLoaded, setHasLoaded] = useState(false);\n    \n    const setLoaded = useCallback(() => {\n        if (inView)\n            setHasLoaded(true);\n    }, [inView, setHasLoaded]);\n    \n    return (<div className=\"embla__slide\">\n      <div className={'embla__lazy-load'.concat(hasLoaded ? ' embla__lazy-load--has-loaded' : '')}>\n        {!hasLoaded && <span className=\"embla__lazy-load__spinner\"/>}\n        <img className=\"embla__slide__img embla__lazy-load__img\" onLoad={setLoaded} src={inView ? imgSrc : PLACEHOLDER_SRC} alt=\"Your alt text\" data-src={imgSrc}/>\n      </div>\n    </div>);\n};\n"}}]);
//# sourceMappingURL=3376-f41dc652fe02408f9140.js.map