koval-ui/dist/src/lib/Video/useFullscreen.cjs.map

React components collection with minimalistic design. Supports theming, layout, and input validation.

{"version":3,"file":"useFullscreen.cjs","sources":["../../../../src/lib/Video/useFullscreen.ts"],"sourcesContent":["import {type MutableRefObject, useCallback, useEffect, useState} from 'react';\n\nexport const useFullscreen = (videoRef: MutableRefObject<HTMLVideoElement | null>) => {\n    const [isFullScreen, setFullScreen] = useState(false);\n\n    const handleFullscreen = useCallback(() => {\n        videoRef.current?.requestFullscreen();\n    }, [videoRef]);\n\n    // this effect is required for Firefox, which doesn't display controls in full-screen mode\n    useEffect(() => {\n        const videoRefMemo = videoRef.current;\n        const handleScreenChange = () => {\n            setFullScreen(document.fullscreenElement === videoRef.current);\n        };\n        videoRefMemo?.addEventListener('fullscreenchange', handleScreenChange);\n        return () => {\n            videoRefMemo?.removeEventListener('fullscreenchange', handleScreenChange);\n        };\n    }, [videoRef]);\n\n    return {isFullScreen, handleFullscreen};\n};\n"],"names":["useFullscreen","videoRef","isFullScreen","setFullScreen","useState","handleFullscreen","useCallback","useEffect","videoRefMemo","handleScreenChange"],"mappings":"sHAEaA,EAAiBC,GAAwD,CAClF,KAAM,CAACC,EAAcC,CAAa,EAAIC,EAAAA,SAAS,EAAK,EAE9CC,EAAmBC,EAAAA,YAAY,IAAM,CACvCL,EAAS,SAAS,kBAAA,CACtB,EAAG,CAACA,CAAQ,CAAC,EAGbM,OAAAA,EAAAA,UAAU,IAAM,CACZ,MAAMC,EAAeP,EAAS,QACxBQ,EAAqB,IAAM,CAC7BN,EAAc,SAAS,oBAAsBF,EAAS,OAAO,CACjE,EACA,OAAAO,GAAc,iBAAiB,mBAAoBC,CAAkB,EAC9D,IAAM,CACTD,GAAc,oBAAoB,mBAAoBC,CAAkB,CAC5E,CACJ,EAAG,CAACR,CAAQ,CAAC,EAEN,CAAC,aAAAC,EAAc,iBAAAG,CAAA,CAC1B"}