{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/hooks/useVisibilityChange/index.ts"],"sourcesContent":["import { noop } from '@modern-kit/utils';\nimport { useEventListener } from '../useEventListener';\n\ntype VisibilityChangeCallbackAction = (\n  event: Event,\n  visibilityState: DocumentVisibilityState\n) => void;\n\ninterface UseVisibilityChangeProps {\n  onShow?: VisibilityChangeCallbackAction;\n  onHide?: VisibilityChangeCallbackAction;\n  enabled?: boolean;\n}\n\n/**\n * @description 문서의 가시성(visibility) 상태 변경 시 실행할 콜백 함수를 등록하는 커스텀 훅입니다.\n *\n * `document.visibilityState`가 문서가 보이는 상태가 되면(`visible`) `onShow` 콜백이 호출되며, 보이지 않는 상태가 되면(`hidden`) `onHide` 콜백이 호출됩니다.\n *\n * @param {UseVisibilityChangeProps} props - 가시성 변경 시 호출할 콜백 함수를 포함한 객체입니다.\n * @param {VisibilityChangeCallbackAction} props.onShow - 문서가 보이는 상태가 될 때 호출될 콜백 함수입니다.\n * @param {VisibilityChangeCallbackAction} props.onHide - 문서가 보이지 않는 상태가 될 때 호출될 콜백 함수입니다.\n * @param {boolean} [props.enabled=true] - 가시성 변경 이벤트 핸들러를 등록할지 여부를 결정하는 불리언 값입니다.\n *\n * @returns {void}\n *\n * @example\n * useVisibilityChange({\n *   onShow: () => console.log('문서가 보이는 상태입니다.'),\n *   onHide: () => console.log('문서가 보이지 않는 상태입니다.'),\n * });\n */\nexport function useVisibilityChange({\n  onShow = noop,\n  onHide = noop,\n  enabled = true,\n}: UseVisibilityChangeProps = {}): void {\n  const handleVisibilityChange = (event: Event) => {\n    const isVisible = document.visibilityState === 'visible';\n    const callbackAction = isVisible ? onShow : onHide;\n\n    callbackAction(event, document.visibilityState);\n  };\n\n  useEventListener(\n    typeof document !== 'undefined' && enabled ? document : null,\n    'visibilitychange',\n    handleVisibilityChange\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAgCA,SAAgB,oBAAoB,EAClC,SAAS,MACT,SAAS,MACT,UAAU,SACkB,EAAE,EAAQ;CACtC,MAAM,0BAA0B,UAAiB;EAI/C,CAHkB,SAAS,oBAAoB,YACZ,SAAS,QAE7B,OAAO,SAAS,gBAAgB;;CAGjD,iBACE,OAAO,aAAa,eAAe,UAAU,WAAW,MACxD,oBACA,uBACD"}