@face-detector/react-face-detection/dist/index.cjs

Face Detector Web SDK React Components and Hooks Package

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),n=require("@face-detector/core");var r=(e=>(e.INITIALIZING="initializing",e.READY="ready",e.RUNNING="running",e.MEASURING="measuring",e.COMPLETED="completed",e.FAILED="failed",e))(r||{});const o=t.createContext(null),a=()=>{const e=t.useContext(o);if(!e)throw new Error("useFaceDetectorContext must be used within a FaceDetectorVideo component");return e},s=new WeakMap;const i=t.forwardRef(({className:n,style:r,...o},s)=>{const i=t.useRef(null),c=t.useRef(null),{registerVideo:u,registerCanvas:l}=a();return t.useImperativeHandle(s,()=>i.current,[]),t.useEffect(()=>{i.current&&u(i.current),c.current&&l(c.current)},[u,l]),e.jsxs(e.Fragment,{children:[e.jsx("video",{ref:i,className:`face-detector-video ${n||""}`,style:r,autoPlay:!0,muted:!0,playsInline:!0,...o}),e.jsx("canvas",{ref:c,className:"face-detector-extracting-canvas",style:{display:"none"}})]})});i.displayName="FaceDetectorVideo";exports.FaceDetectorContext=o,exports.FaceDetectorProvider=({config:a,children:i,onVideoReady:c,onCanvasReady:u,onStreamReady:l})=>{const[d,g]=t.useState(null),f=t.useRef(null),C=t.useRef(null),[m,v]=t.useState(!0),[p,b]=t.useState(null),w=t.useCallback(e=>{f.current=e,null==c||c(e),C.current&&D()},[c]),x=t.useCallback(e=>{C.current=e,null==u||u(e),f.current&&D()},[u]),D=t.useCallback(()=>{if(f.current&&C.current&&!d)try{const e=function(e,t,r){var o,a,s,i,c,u,l,d,g,f;const C=n.defaultConfig(e,t);return{dataProcessingManagerConfig:{targetDataLength:(null==(o=null==r?void 0:r.dataProcessingManagerConfig)?void 0:o.targetDataLength)??C.dataProcessingManagerConfig.targetDataLength},faceDetectionManagerConfig:{minDetectionConfidence:(null==(a=null==r?void 0:r.faceDetectionManagerConfig)?void 0:a.minDetectionConfidence)??C.faceDetectionManagerConfig.minDetectionConfidence,delegate:(null==(s=null==r?void 0:r.faceDetectionManagerConfig)?void 0:s.delegate)??C.faceDetectionManagerConfig.delegate},webCamManagerConfig:{width:(null==(i=null==r?void 0:r.webCamManagerConfig)?void 0:i.width)??C.webCamManagerConfig.width,height:(null==(c=null==r?void 0:r.webCamManagerConfig)?void 0:c.height)??C.webCamManagerConfig.height},measurementConfig:{countdown:(null==(u=null==r?void 0:r.measurementConfig)?void 0:u.countdown)??C.measurementConfig.countdown,processingFps:(null==(l=null==r?void 0:r.measurementConfig)?void 0:l.processingFps)??C.measurementConfig.processingFps,validationFps:(null==(d=null==r?void 0:r.measurementConfig)?void 0:d.validationFps)??C.measurementConfig.validationFps,retryCount:(null==(g=null==r?void 0:r.measurementConfig)?void 0:g.retryCount)??C.measurementConfig.retryCount,willReadFrequently:(null==(f=null==r?void 0:r.measurementConfig)?void 0:f.willReadFrequently)??C.measurementConfig.willReadFrequently,extractingCanvas:t,videoElement:e},debug:(null==r?void 0:r.debug)??C.debug}}(f.current,C.current,a);v(e.debug);const t=function(e){if(s.has(e.measurementConfig.extractingCanvas))return s.get(e.measurementConfig.extractingCanvas);const t=new n.FaceDetector(e);return s.set(e.measurementConfig.extractingCanvas,t),t}(e);g(t);const o=t.subscribeState(e=>{if(e===r.READY&&f.current){const e=f.current.srcObject;e&&"undefined"!=typeof MediaStream&&e instanceof MediaStream&&(null==l||l(e))}});return()=>{o(),t.stop(),g(null)}}catch(e){console.error("react-hooks: FaceDetector initialization failed:",e)}},[a,d]);t.useEffect(()=>()=>{d&&(d.stop(),g(null))},[d]);const F=t.useMemo(()=>({detector:d,report:p,setReport:b,registerVideo:w,registerCanvas:x,debug:m}),[d,p,b,w,x,m]);return e.jsx(o.Provider,{value:F,children:i})},exports.FaceDetectorVideo=i,exports.ProcessState=r,exports.useCountDown=()=>{const{detector:e}=a(),[n,r]=t.useState(0);return t.useEffect(()=>{if(!e)return;const t=e.subscribeCountdown(e=>{r(e)});return()=>{t()}},[e]),n},exports.useFaceDetector=()=>{const{detector:e,report:n,setReport:r,debug:o}=a(),[s,i]=t.useState(null);return{report:n,duration:s,start:t.useCallback(async()=>{const t=performance.now();if(!e)throw new Error("FaceDetector not initialized");try{const n=await e.run();r(n);const a=performance.now();return o&&i(a-t),n}catch(n){const e=n;throw console.error("Face detection failed:",e),r(null),e}},[e,r]),stop:t.useCallback(()=>{e&&e.stop()},[e]),terminate:t.useCallback(()=>{e&&e.terminate()},[e]),reset:t.useCallback(()=>{e&&e.reset()},[e]),enableRGBExtraction:t.useCallback(t=>{if(e)return e.enableRGBExtraction(t)},[e]),detector:e}},exports.useFaceDetectorContext=a,exports.useFaceDetectorState=()=>{const{detector:e}=a(),[n,o]=t.useState(r.INITIALIZING);return t.useEffect(()=>{if(!e)return void o(r.INITIALIZING);o(e.getState());return e.subscribeState(e=>{o(e)})},[e]),n},exports.useFacePosition=()=>{const{detector:e}=a(),[n,r]=t.useState(null);return t.useEffect(()=>{if(!e)return;const t=e.subscribeFacePosition(e=>{r(e)});return()=>{t()}},[e]),n},exports.useProgress=()=>{const{detector:e}=a(),[n,r]=t.useState(0);return t.useEffect(()=>{if(!e)return;const t=e.subscribeProgress(e=>{r(e)});return()=>{t()}},[e]),n};
//# sourceMappingURL=index.cjs.map