koval-ui
Version:
React components collection with minimalistic design. Supports theming, layout, and input validation.
1 lines • 1.97 kB
Source Map (JSON)
{"version":3,"file":"useLoadingState.cjs","sources":["../../../../src/internal/MediaEmbeds/useLoadingState.ts"],"sourcesContent":["import type {MutableRefObject, Dispatch, SetStateAction, SyntheticEvent} from 'react';\nimport {useCallback, useState} from 'react';\n\nexport type Props = {\n embedRef: MutableRefObject<HTMLMediaElement | null>;\n setDuration: Dispatch<SetStateAction<number>>;\n onReady: (event: SyntheticEvent<HTMLVideoElement>) => void;\n onError: (event: SyntheticEvent<HTMLVideoElement>) => void;\n};\n\nexport const useLoadingState = ({embedRef, setDuration, onReady, onError}: Props) => {\n const handleLoadedMetaData = useCallback(() => {\n embedRef.current?.duration && setDuration(embedRef.current?.duration);\n }, [setDuration, embedRef]);\n\n const [readyToPlay, setReadyToPlay] = useState(false);\n\n const handleCanPlay = useCallback(\n (event: SyntheticEvent<HTMLVideoElement>) => {\n setReadyToPlay(true);\n onReady(event);\n },\n [onReady]\n );\n\n const handleError = useCallback(\n (event: SyntheticEvent<HTMLVideoElement>) => {\n onError(event);\n },\n [onError]\n );\n\n return {handleLoadedMetaData, readyToPlay, handleCanPlay, handleError};\n};\n"],"names":["useLoadingState","embedRef","setDuration","onReady","onError","handleLoadedMetaData","useCallback","readyToPlay","setReadyToPlay","useState","handleCanPlay","event","handleError"],"mappings":"sHAUaA,EAAkB,CAAC,CAAC,SAAAC,EAAU,YAAAC,EAAa,QAAAC,EAAS,QAAAC,KAAoB,CACjF,MAAMC,EAAuBC,EAAAA,YAAY,IAAM,CAC3CL,EAAS,SAAS,UAAYC,EAAYD,EAAS,SAAS,QAAQ,CACxE,EAAG,CAACC,EAAaD,CAAQ,CAAC,EAEpB,CAACM,EAAaC,CAAc,EAAIC,EAAAA,SAAS,EAAK,EAE9CC,EAAgBJ,EAAAA,YACjBK,GAA4C,CACzCH,EAAe,EAAI,EACnBL,EAAQQ,CAAK,CACjB,EACA,CAACR,CAAO,CAAA,EAGNS,EAAcN,EAAAA,YACfK,GAA4C,CACzCP,EAAQO,CAAK,CACjB,EACA,CAACP,CAAO,CAAA,EAGZ,MAAO,CAAC,qBAAAC,EAAsB,YAAAE,EAAa,cAAAG,EAAe,YAAAE,CAAA,CAC9D"}