{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/hooks/useScrollTo/index.ts"],"sourcesContent":["import React, { useCallback, useRef } from 'react';\nimport {\n  ScrollToElementOptions,\n  getRelativePosition,\n} from './useScrollTo.utils';\n\ninterface UseScrollToReturnType<T extends HTMLElement> {\n  containerRef: React.RefObject<T | null>;\n  scrollToPosition: (scrollToOptions?: ScrollToOptions) => void;\n  scrollToElement: <E extends HTMLElement>(\n    target: E,\n    scrollToElementOptions?: ScrollToElementOptions\n  ) => void;\n}\n\n/**\n * @description 스크롤 기능을 제공하는 커스텀 훅입니다.\n *\n * 훅이 반환하는 `containerRef`를 특정 엘리먼트에 할당하면 해당 컨테이너 요소를 스크롤 합니다.\n * 만약, `containerRef`를 할당하지 않으면 기본적으로 `window`를 스크롤합니다.\n *\n * @template T - 스크롤이 이루어질 컨테이너 요소의 타입입니다.\n * @returns {UseScrollToReturnType<T>} 스크롤 요소를 지정 할 `containerRef`와 스크롤을 동작 시킬 `scrollToPosition`, `scrollToElement` 함수를 포함하는 객체입니다.\n * - `containerRef`: 스크롤을 제어할 컨테이너 요소에 대한 ref입니다. 설정하지 않으면 `window`가 기본값으로 설정됩니다.\n * - `scrollToPosition`: scrollTo와 유사한 지정된 좌표로 스크롤을 이동시키는 함수입니다. `ScrollToOptions`을 매개변수로 받습니다.\n * - `scrollToElement`: scrollIntoView와 유사한 지정된 요소로 스크롤을 이동시키는 함수입니다. `target` 요소와 `ScrollToElementOptions`을 매개변수로 받습니다.\n *\n * @example\n * ```tsx\n * // scrollToPosition를 사용하면 top, left와 같은 포지션 값을 기준으로 이동합니다.\n * const { containerRef, scrollToPosition } = useScrollTo<HTMLDivElement>();\n *\n * scrollToPosition({\n *  top: 300,\n *  left: 300,\n *  behavior: 'smooth'\n * });\n *\n * <div ref={containerRef}>{...}</div>\n * //containerRef를 할당하지 않으면 window를 기반으로, 할당하면 해당 container를 기반으로 스크롤 합니다.\n * ```\n *\n * @example\n * ```tsx\n * // scrollToElement를 사용하면 첫 번째 인자로 넣은 타겟을 기준으로 스크롤합니다.\n * const target = useRef<HTMLDivElement | null>(null);\n * const { containerRef, scrollToElement } = useScrollTo<HTMLDivElement>();\n *\n * scrollToElement(target.current, {\n *  offsetX: 300,\n *  offsetY: 300,\n *  alignY: 'start', // 세로 정렬, 'start' | 'center' | 'end'\n *  alignX: 'start', // 가로 정렬, 'start' | 'center' | 'end'\n *  behavior: 'smooth'\n * });\n *\n * <div ref={containerRef}>{...}</div>\n * //containerRef를 할당하지 않으면 window를 기반으로, 할당하면 해당 container를 기반으로 스크롤 합니다.\n * ```\n */\nexport function useScrollTo<T extends HTMLElement>(): UseScrollToReturnType<T> {\n  const containerRef = useRef<T>(null);\n\n  /**\n   * @description scrollTo와 유사하게 동작합니다. containerRef를 할당하지 않으면 window를 기반으로 스크롤합니다.\n   */\n  const scrollToPosition = useCallback(\n    (scrollToOptions: ScrollToOptions = {}) => {\n      const { left = 0, top = 0, behavior = 'auto' } = scrollToOptions;\n\n      const scrollElement = containerRef.current ?? window;\n\n      requestAnimationFrame(() => {\n        scrollElement.scrollTo({\n          left,\n          top,\n          behavior,\n        });\n      });\n    },\n    []\n  );\n\n  /**\n   * @description scrollIntoView와 유사하게 동작하지만, alignX/Y, offset을 옵션을 받을 수 있습니다.\n   */\n  const scrollToElement = useCallback(\n    <E extends HTMLElement>(\n      target: E,\n      scrollToElementOptions: ScrollToElementOptions = {}\n    ) => {\n      if (!target) return;\n\n      const scrollElement = containerRef.current ?? window;\n      const { behavior = 'auto' } = scrollToElementOptions;\n\n      const { left, top } = getRelativePosition(\n        scrollElement,\n        target,\n        scrollToElementOptions\n      );\n\n      requestAnimationFrame(() => {\n        scrollElement.scrollTo({\n          top,\n          left,\n          behavior,\n        });\n      });\n    },\n    []\n  );\n\n  return { containerRef, scrollToPosition, scrollToElement };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DA,SAAgB,cAA+D;CAC7E,MAAM,eAAe,OAAU,KAAK;CAoDpC,OAAO;EAAE;EAAc,kBA/CE,aACtB,kBAAmC,EAAE,KAAK;GACzC,MAAM,EAAE,OAAO,GAAG,MAAM,GAAG,WAAW,WAAW;GAEjD,MAAM,gBAAgB,aAAa,WAAW;GAE9C,4BAA4B;IAC1B,cAAc,SAAS;KACrB;KACA;KACA;KACD,CAAC;KACF;KAEJ,EAAE,CAiCmC;EAAE,iBA3BjB,aAEpB,QACA,yBAAiD,EAAE,KAChD;GACH,IAAI,CAAC,QAAQ;GAEb,MAAM,gBAAgB,aAAa,WAAW;GAC9C,MAAM,EAAE,WAAW,WAAW;GAE9B,MAAM,EAAE,MAAM,QAAQ,oBACpB,eACA,QACA,uBACD;GAED,4BAA4B;IAC1B,cAAc,SAAS;KACrB;KACA;KACA;KACD,CAAC;KACF;KAEJ,EAAE,CAGoD;EAAE"}