{"version":3,"file":"index.cjs","names":["useIntersectionObserver","useMergeRefs"],"sources":["../../../src/components/LazyImage/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { useMergeRefs } from '../../hooks/useMergeRefs';\n\nexport interface LazyImageProps\n  extends React.ComponentProps<'img'>,\n    IntersectionObserverInit {\n  src: string;\n}\n\n/**\n * @description 이미지가 viewport에 노출 될 때 할당된 이미지를 `Lazy Loading(지연 로딩)` 하는 이미지 컴포넌트입니다.\n *\n * `@modern-kit/react`의 `useIntersectionObserver` 훅을 사용하여 구현되었습니다.\n *\n * @see https://modern-agile-team.github.io/modern-kit/docs/react/hooks/useIntersectionObserver\n *\n * @param {LazyImageProps} props - img 태그의 모든 속성 및 IntersectionObserverInit 속성을 지원합니다.\n * @param {Element} [params.root=null] - 교차할 때 기준이 되는 root 요소입니다. 기본값은 `null`이며 이는 viewport를 의미합니다.\n * @param {number | number[]} [params.threshold=0] - Observer가 콜백을 호출하는 임계값을 나타냅니다.\n * @param {string} [params.rootMargin='100px 0px'] - 루트 요소에 대한 마진을 지정합니다. 이는 뷰포트 또는 루트 요소의 경계를 확장하거나 축소하는데 사용됩니다.\n *\n * @returns {React.JSX.Element} 지연 로딩을 지원하는 이미지 컴포넌트를 반환합니다.\n *\n * @example\n * ```tsx\n * <LazyImage\n *   src=\"imageUrl\"\n *   alt=\"Lazy loaded image\"\n *   rootMargin=\"100px 0px\"\n * />\n * ```\n */\nexport const LazyImage = forwardRef<HTMLImageElement, LazyImageProps>(\n  ({ src, threshold, root, rootMargin, ...restProps }, ref): React.JSX.Element => {\n    const { ref: imgRef } = useIntersectionObserver<HTMLImageElement>({\n      onIntersectStart: (entry) => {\n        const targetImgElement = entry.target as HTMLImageElement;\n        targetImgElement.src = src;\n      },\n      calledOnce: true,\n      threshold,\n      root,\n      rootMargin,\n    });\n\n    return <img ref={useMergeRefs(ref, imgRef)} {...restProps} />;\n  }\n);\n\nLazyImage.displayName = 'LazyImage';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,MAAa,aAAA,GAAA,MAAA,aACV,EAAE,KAAK,WAAW,MAAM,YAAY,GAAG,aAAa,QAA2B;CAC9E,MAAM,EAAE,KAAK,WAAWA,gBAAAA,wBAA0C;EAChE,mBAAmB,UAAU;GAC3B,MAAM,mBAAmB,MAAM;GAC/B,iBAAiB,MAAM;;EAEzB,YAAY;EACZ;EACA;EACA;EACD,CAAC;CAEF,OAAO,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,KAAKC,cAAAA,aAAa,KAAK,OAAO;EAAE,GAAI;EAAa,CAAA;EAEhE;AAED,UAAU,cAAc"}