@vincentt-xr/sdk 2.0.0-alpha.0 → 2.0.0-alpha.1

package/dist/index-C_Duh13c.cjs

@@ -0,0 +1 @@
+"use strict";const d=require("react/jsx-runtime"),l=require("react"),L=require("./index-DxshgBu0.cjs"),Me=require("three"),ce=require("./useFaceResults-hVUJYSEY.cjs"),je=require("./useXRModel-3DcUa28n.cjs"),G=require("./selectors-BLl2JUWW.cjs"),P=require("@react-three/fiber");function Ie(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const c=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,c.get?c:{enumerable:!0,get:()=>e[o]})}}return t.default=e,Object.freeze(t)}const F=Ie(Me),le=l.createContext(null),de=()=>{const e=l.useContext(le);if(!e)throw new Error("useScreenSpace must be used within ScreenSpaceUI");return e},Q=l.createContext(null),De=()=>l.useContext(Q)??1,ue=(e,t,o,c,n)=>{const i=e/2,s=t/2,r=o.left*i+c.left,u=o.right*i-c.right,h=o.bottom*s+c.bottom,f=o.top*s-c.top,a=u-r,p=f-h,m=(r+u)/2,x=(h+f)/2,w=n[0]*a/2,T=n[1]*p/2;return{centerX:m,centerY:x,width:a,height:p,pivotX:w,pivotY:T}},Xe={left:0,right:0,top:0,bottom:0},Ae={left:0,right:0,top:0,bottom:0},ke=[0,0],Le=({anchors:e,offsets:t,pivot:o=ke,children:c})=>{const{width:n,height:i}=de(),s=l.useMemo(()=>({anchors:{...Xe,...e??{}},offsets:{...Ae,...t??{}}}),[e,t]),r=l.useMemo(()=>ue(n,i,s.anchors,s.offsets,o),[n,i,s,o]);l.useEffect(()=>{const a=s.anchors;a.left>a.right&&console.warn(`[ScreenTransform] inverted X axis: anchors.left (${a.left}) > anchors.right (${a.right})`),a.bottom>a.top&&console.warn(`[ScreenTransform] inverted Y axis: anchors.bottom (${a.bottom}) > anchors.top (${a.top})`),r.width<=0&&console.warn(`[ScreenTransform] zero or negative width (${r.width.toFixed(3)}) — anchors + offsets collapse the X extent`),r.height<=0&&console.warn(`[ScreenTransform] zero or negative height (${r.height.toFixed(3)}) — anchors + offsets collapse the Y extent`)},[s,r.width,r.height]);const u=o[0]!==0||o[1]!==0,h=u?[1,1,1]:[r.width,r.height,1],f=!u&&r.width>0&&r.height>0?r.width/r.height:null;return d.jsx("group",{position:[r.centerX-r.pivotX,r.centerY-r.pivotY,0],scale:h,renderOrder:L.RENDER_LAYERS.SCREEN_UI,children:d.jsx(Q.Provider,{value:f,children:c})})},J=({canvas:e,layout:t,media:o,mirrored:c,filter:n})=>{const i=Math.round(t.destination.width),s=Math.round(t.destination.height);e.width!==i&&(e.width=i),e.height!==s&&(e.height=s);const r=e.getContext("2d");r&&(r.setTransform(1,0,0,1,0,0),r.clearRect(0,0,i,s),c&&(r.translate(i,0),r.scale(-1,1)),n&&(r.filter=n),r.drawImage(o,t.offsetX,t.offsetY,t.drawWidth,t.drawHeight),n&&(r.filter="none"),r.setTransform(1,0,0,1,0,0))},_e=5,ze=1,he=(e,t)=>t,We="brightness(2.2) contrast(1.5) saturate(1.25)",fe=({enabled:e,displayMirrored:t,imageRef:o,layout:c,mode:n,numFaces:i,selectedSource:s,sourceStream:r,videoRef:u})=>{const{session:h}=L.useXRContext(),f=l.useRef(null),a=l.useRef(!1),p=l.useRef(document.createElement("canvas")),{ready:m,node:x,error:w}=je.useXRModel(L.XRModel.FACE_TRACKER,{numFaces:i??(n==="head-binding"?ze:_e)}),[T,S]=l.useState("idle"),[y,C]=l.useState(null),M=e&&m&&!!x,I=ce.useFaceResults({node:M?x:null,enabled:M,selectedSource:s,onFrame:l.useCallback(()=>{C(null),S("ready")},[])});return l.useEffect(()=>{if(!e||!c)return;const b=()=>{const R=s==="image"?o.current:u.current;if(R){if(R instanceof HTMLImageElement){if(!R.complete||R.naturalWidth<=0||R.naturalHeight<=0)return}else if(R.readyState<2||R.videoWidth<=0||R.videoHeight<=0)return;J({canvas:p.current,layout:c,media:R,mirrored:t,filter:s==="webcam"?We:void 0})}};if(s==="image"){b();return}let g=0;const v=()=>{g=requestAnimationFrame(v),b()};return g=requestAnimationFrame(v),()=>cancelAnimationFrame(g)},[t,e,o,c,s,u]),l.useEffect(()=>{var X;if(!e){S("idle"),C(null),a.current=!1,f.current=null;return}if(!c){S("initializing");return}const b=(r==null?void 0:r.id)??(((X=u.current)==null?void 0:X.srcObject)instanceof MediaStream?u.current.srcObject.id:"none"),v=s==="webcam"?`webcam:${b}`:s;f.current!==v&&(a.current=!1,f.current=v);let R=!1;return(async()=>{try{if(S("initializing"),a.current||(await h.setFrameSource({canvas:p.current,sourceKind:s}),await h.start(),a.current=!0),R)return;C(null),S("initializing")}catch(A){if(R)return;S("error"),C(A instanceof Error?A.message:"Failed to initialize SDK face tracking")}})(),()=>{R=!0}},[e,c,s,h,r,u]),l.useEffect(()=>{!M&&e&&!w&&S("initializing")},[M,e,w]),l.useEffect(()=>{w&&(S("error"),C(w.message))},[w]),l.useEffect(()=>()=>{a.current=!1,h.stop()},[h]),{activeDelegate:"GPU",faces:I,status:T,error:y}},_=({children:e,config:t,style:o})=>d.jsx("div",{"data-render-target":t.name,style:{position:"absolute",inset:0,overflow:"hidden",background:t.clearColor,pointerEvents:t.pointerEvents??"none",zIndex:t.zIndex,opacity:t.hidden?0:1,...o},children:e}),me=({canvasRef:e,enabled:t=!0,fps:o=30,imageRef:c,layout:n,mirrored:i,sourceKind:s,videoRef:r})=>{l.useEffect(()=>{if(!t){const p=e.current,m=p==null?void 0:p.getContext("2d");p&&m&&m.clearRect(0,0,p.width,p.height);return}let u=0,h=0;const f=o>0?1e3/o:0,a=p=>{if(u=requestAnimationFrame(a),f>0&&p-h<f)return;h=p;const m=e.current;if(!m||!n)return;if(s==="image"){const w=c.current;if(!w||!w.complete||w.naturalWidth<=0||w.naturalHeight<=0)return;J({canvas:m,layout:n,media:w,mirrored:i});return}const x=r.current;!x||x.readyState<2||x.videoWidth<=0||x.videoHeight<=0||J({canvas:m,layout:n,media:x,mirrored:i})};return u=requestAnimationFrame(a),()=>{cancelAnimationFrame(u)}},[e,t,o,c,n,i,s,r])},ge=({canvasRef:e,imageRef:t,layer:o,layout:c,mirrored:n,sourceKind:i,videoRef:s})=>(me({canvasRef:e,imageRef:t,layout:c,mirrored:n,sourceKind:i,videoRef:s}),d.jsx(_,{config:o,children:d.jsx("canvas",{ref:e,style:{position:"absolute",inset:0,width:"100%",height:"100%",display:"block",background:"#000"}})})),Ne=({canvasRef:e,controlInsetTop:t,debugVisible:o,fps:c=15,imageRef:n,layer:i,layout:s,mirrored:r,sourceKind:u,videoRef:h,viewportSize:f})=>{me({canvasRef:e,enabled:o,fps:c,imageRef:n,layout:s,mirrored:r,sourceKind:u,videoRef:h});const a=Math.min(220,Math.max(120,f.width*.22)),p=f.width>0&&f.height>0?f.width/f.height:1,m=Math.min(f.height-24,Math.max(t??16,16));return d.jsx(_,{config:i,children:d.jsx("canvas",{ref:e,style:{position:"absolute",left:16,top:m,width:o?a:1,height:o?"auto":1,aspectRatio:`${p}`,opacity:o?.85:0,borderRadius:10,border:o?"1px solid rgba(255,255,255,0.16)":"none",pointerEvents:"none",objectFit:"contain",background:"#000"}})})},pe={display:"flex",alignItems:"center",justifyContent:"center",height:"100%",background:"#363636",color:"white",fontFamily:"monospace"},Ve=()=>d.jsx("div",{style:pe,children:"Loading..."}),qe=e=>d.jsx("div",{style:pe,children:e.error}),re={position:"absolute",top:0,left:0,width:"100%",height:"100%",zIndex:10},ne={sceneColorTexture:null,sceneDepthTexture:null},He=({onRenderOutputs:e,renderOutputs:t,size:o})=>{const{camera:c,gl:n,scene:i,size:s}=P.useThree(),r=Math.max(1,Math.round((o==null?void 0:o.width)??s.width)),u=Math.max(1,Math.round((o==null?void 0:o.height)??s.height)),h=!!(t.sceneColor||t.sceneDepth),f=l.useMemo(()=>{if(!h)return null;const a=new F.WebGLRenderTarget(r,u,{colorSpace:F.SRGBColorSpace,depthBuffer:!0,stencilBuffer:!1});return t.sceneDepth&&(a.depthTexture=new F.DepthTexture(r,u),a.depthTexture.format=F.DepthFormat,a.depthTexture.type=F.UnsignedShortType),a},[h,u,t.sceneDepth,r]);return l.useEffect(()=>{if(!f){e==null||e(ne);return}return e==null||e({sceneColorTexture:t.sceneColor?f.texture:null,sceneDepthTexture:t.sceneDepth&&f.depthTexture?f.depthTexture:null}),()=>{var a;f.dispose(),(a=f.depthTexture)==null||a.dispose(),e==null||e(ne)}},[e,t.sceneColor,t.sceneDepth,f]),P.useFrame(()=>{if(!f)return;const a=[];t.excludeScreenUI!==!1&&i.traverse(x=>{x.visible&&x.renderOrder>=L.RENDER_LAYERS.SCREEN_UI&&(a.push(x),x.visible=!1)});const p=n.getRenderTarget(),m=n.xr.enabled;n.xr.enabled=!1,n.setRenderTarget(f),n.clear(),n.render(i,c),n.setRenderTarget(p),n.xr.enabled=m,a.forEach(x=>{x.visible=!0})},-100),null},xe=({style:e,canvasProps:t,children:o,loadingComponent:c,loadingTransitionDuration:n,errorComponent:i,renderTargetSize:s,renderOutputs:r={},onRenderOutputs:u})=>{const h=l.useRef(null),f=l.useRef(null),a=l.useRef(null),p=l.useRef(!1),{session:m}=L.useXRContext(),x=G.useXRReady(),w=G.useXRError(),[T,S]=l.useState(!0);return l.useEffect(()=>{if(s){m._setRenderSize(Math.round(s.width),Math.round(s.height));return}const y=(b,g)=>{b<=0||g<=0||m._setRenderSize(Math.round(b),Math.round(g))},C=()=>{!f.current||p.current||(p.current=!0,m._setRenderTarget(f.current))},M=(b,g)=>{a.current!==null&&cancelAnimationFrame(a.current),a.current=requestAnimationFrame(()=>{a.current=null,y(b,g)})},I=new ResizeObserver(b=>{const g=b[0];if(!g)return;const{width:v,height:R}=g.contentRect;C(),M(v,R)});return h.current&&I.observe(h.current),C(),()=>{I.disconnect(),a.current!==null&&(cancelAnimationFrame(a.current),a.current=null),p.current=!1}},[s,m]),l.useEffect(()=>{x&&(n?setTimeout(()=>{S(!1)},n):S(!1))},[x,n]),d.jsxs("div",{id:"vincentt-xr-container",ref:h,style:{width:"100%",height:"100%",...e,position:"relative"},children:[T&&d.jsx("div",{style:re,children:c||d.jsx(Ve,{})}),w&&d.jsx("div",{style:re,children:i||d.jsx(qe,{error:w.message})}),d.jsxs(P.Canvas,{id:"vincentt-xr-canvas",ref:f,dpr:[1,3],gl:{alpha:!0,preserveDrawingBuffer:!1,antialias:!0,premultipliedAlpha:!1,toneMapping:F.NoToneMapping},...t,onCreated:y=>{s?m._setRenderSize(Math.round(s.width),Math.round(s.height)):m._setRenderTarget(f.current),m._setR3FState({renderer:y.gl,scene:y.scene,camera:y.camera}),y.gl.outputColorSpace=F.SRGBColorSpace,t!=null&&t.onCreated&&t.onCreated(y)},children:[d.jsx(He,{onRenderOutputs:u,renderOutputs:r,size:s}),o]})]})},be=l.createContext(null),we=l.createContext(null),Be={audio:!1,video:{facingMode:"user",frameRate:{ideal:30,max:60}}},Ue={name:"viewport-live",clearColor:"#000000",pointerEvents:"none",zIndex:0},$e={name:"viewport-ui",clearColor:"transparent",pointerEvents:"auto",zIndex:5},Ye={name:"viewport-scene",clearColor:"transparent",pointerEvents:"auto",zIndex:1},k={webcam:{icon:"◉",label:"Webcam"},image:{icon:"▣",label:"Images"},video:{icon:"▶",label:"Videos"}},Z=({children:e})=>d.jsx(d.Fragment,{children:e});Z.displayName="XRViewport.Scene";const O=({children:e})=>d.jsx(d.Fragment,{children:e});O.displayName="XRViewport.Overlay";const Ke=e=>{if(!e)return{width:0,height:0};const t=e.getBoundingClientRect();return{width:t.width||e.clientWidth,height:t.height||e.clientHeight}},Ge=e=>{const[t,o]=l.useState({width:0,height:0});return l.useLayoutEffect(()=>{const c=e.current;if(!c)return;let n=0;const i=()=>{const h=Ke(c);o(f=>f.width===h.width&&f.height===h.height?f:h)};i(),n=requestAnimationFrame(i);const s=new ResizeObserver(()=>{i(),n&&cancelAnimationFrame(n),n=requestAnimationFrame(i)});s.observe(c);const r=window.visualViewport,u=()=>{i(),n&&cancelAnimationFrame(n),n=requestAnimationFrame(i)};return window.addEventListener("resize",u),window.addEventListener("orientationchange",u),r==null||r.addEventListener("resize",u),r==null||r.addEventListener("scroll",u),()=>{n&&cancelAnimationFrame(n),s.disconnect(),window.removeEventListener("resize",u),window.removeEventListener("orientationchange",u),r==null||r.removeEventListener("resize",u),r==null||r.removeEventListener("scroll",u)}},[e]),t},oe=e=>{e&&(e.pause(),e.removeAttribute("src"),e.srcObject=null,e.load())},ie=e=>{e&&e.removeAttribute("src")},Pe=({enabled:e,imageAsset:t,selectedSource:o,videoAsset:c})=>{const n=l.useRef(null),i=l.useRef(null),[s,r]=l.useState(null),[u,h]=l.useState({width:0,height:0}),[f,a]=l.useState("idle"),[p,m]=l.useState(null);return l.useEffect(()=>{if(!e){oe(n.current),ie(i.current),r(null),h({width:0,height:0}),a("idle"),m(null);return}let x=!1,w=null;const T=(b,g)=>{x||(h({width:b,height:g}),a("ready"),m(null))},S=()=>{oe(n.current),ie(i.current),w==null||w.getTracks().forEach(b=>b.stop()),w=null,r(null)},y=async()=>{a("requesting");const b=await navigator.mediaDevices.getUserMedia(Be);if(x){b.getTracks().forEach(v=>v.stop());return}w=b,r(b);const g=n.current;g&&(g.srcObject=b,g.muted=!0,g.playsInline=!0,g.autoplay=!0,await g.play(),T(g.videoWidth,g.videoHeight))},C=async b=>{a("requesting"),r(null);const g=n.current;g&&(g.src=b,g.muted=!0,g.loop=!0,g.playsInline=!0,g.autoplay=!0,g.crossOrigin="anonymous",await g.play(),T(g.videoWidth,g.videoHeight))},M=async b=>{a("requesting"),r(null);const g=i.current;g&&(await new Promise((v,R)=>{g.onload=()=>v(),g.onerror=()=>R(new Error("Unable to load image")),g.src=b}),T(g.naturalWidth,g.naturalHeight))};return S(),(async()=>{try{if(o==="webcam"){await y();return}if(o==="video"){if(!(c!=null&&c.src))throw new Error("Missing video source");await C(c.src);return}if(!(t!=null&&t.src))throw new Error("Missing image source");await M(t.src)}catch(b){if(x)return;a("error"),m(b instanceof Error?b.message:`Unable to initialize ${o}`)}})(),()=>{x=!0,S()}},[e,t,o,c]),{videoRef:n,imageRef:i,stream:s,mediaSize:u,status:f,error:p}},Je=({enabled:e,imageRef:t,selectedSource:o,status:c,videoRef:n})=>{const[i,s]=l.useState(null);return l.useEffect(()=>{if(!e||c!=="ready"){s(h=>(h==null||h.dispose(),null));return}const r=o==="image"?t.current:n.current;if(!r)return;const u=o==="image"?new F.Texture(r):new F.VideoTexture(r);return u.colorSpace=F.SRGBColorSpace,u.minFilter=F.LinearFilter,u.magFilter=F.LinearFilter,u.generateMipmaps=!1,u.needsUpdate=!0,s(h=>(h==null||h.dispose(),u)),()=>{u.dispose()}},[e,t,o,c,n]),i},Qe=(e,t)=>e==="auto"?t==="webcam"?"cover":"contain":e,Ze=({imageOptions:e,initialImageId:t,initialSource:o,initialVideoId:c,source:n,videoOptions:i})=>{var f,a,p,m;const s=(n==null?void 0:n.kind)??o??"webcam",r=s==="image"&&e.length===0||s==="video"&&i.length===0?"webcam":s,u=(n==null?void 0:n.kind)==="image"?n.assetId??((f=e[0])==null?void 0:f.id)??"":t??((a=e[0])==null?void 0:a.id)??"",h=(n==null?void 0:n.kind)==="video"?n.assetId??((p=i[0])==null?void 0:p.id)??"":c??((m=i[0])==null?void 0:m.id)??"";return{selectedSource:r,selectedImageId:u,selectedVideoId:h}},Oe=(e,t,o)=>{if(e.width<=0||e.height<=0||t.width<=0||t.height<=0)return null;const c=o==="contain"?Math.min(t.width/e.width,t.height/e.height):Math.max(t.width/e.width,t.height/e.height),n=e.width*c,i=e.height*c,s=(t.width-n)*.5,r=(t.height-i)*.5;return{source:e,destination:t,drawWidth:n,drawHeight:i,offsetX:s,offsetY:r,scale:c}},et=(e,t)=>{if(e==="dom")return{sceneContent:null,overlayContent:t};let o=null,c=null;const n=[];return l.Children.forEach(t,i=>{var r;if(!l.isValidElement(i)){i!=null&&n.push(i);return}const s=(r=i.type)==null?void 0:r.displayName;if(s===Z.displayName){o=i.props.children;return}if(s===O.displayName){c=i.props.children;return}n.push(i)}),!c&&n.length>0&&(c=n),{sceneContent:o,overlayContent:c}},ae=(e,t)=>typeof e=="function"?e(t):e,tt=()=>l.useContext(be),rt=()=>l.useContext(we),nt=({imageRef:e,selectedSource:t,videoRef:o})=>d.jsxs(d.Fragment,{children:[d.jsx("video",{ref:o,style:{position:"absolute",width:1,height:1,opacity:t==="image"?0:.001,pointerEvents:"none"}}),d.jsx("img",{ref:e,alt:"",style:{position:"absolute",width:1,height:1,opacity:t==="image"?.001:0,pointerEvents:"none"}})]}),se=({dock:e,label:t,onChange:o,options:c,value:n})=>d.jsx("div",{style:{position:"absolute",top:e==="top-left"?74:void 0,bottom:e==="bottom-left"?74:void 0,left:16,zIndex:5,maxWidth:"calc(100vw - 32px)",padding:10,borderRadius:14,background:"rgba(15, 23, 42, 0.72)",border:"1px solid rgba(255,255,255,0.12)",boxShadow:"0 12px 30px rgba(0,0,0,0.18)",backdropFilter:"blur(10px)"},children:d.jsxs("label",{style:{display:"grid",gap:6,color:"#e5eefb",fontSize:12,fontWeight:700},children:[d.jsx("span",{children:t}),d.jsx("select",{value:n,onChange:i=>o(i.target.value),style:{minWidth:180,maxWidth:"calc(100vw - 52px)",height:36,borderRadius:10,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(255,255,255,0.06)",color:"#e5eefb",padding:"0 10px"},children:c.map(i=>d.jsx("option",{value:i.id,style:{color:"#111827"},children:i.label},i.id))})]})}),ot=({dock:e,imageOptions:t,selectedImageId:o,selectedSource:c,selectedVideoId:n,setSelectedImageId:i,setSelectedSource:s,setSelectedVideoId:r,showMediaControls:u,videoOptions:h})=>{const[f,a]=l.useState(!1),p=["webcam","image","video"].filter(m=>m==="image"?t.length>0:m==="video"?h.length>0:!0);return u?f?d.jsx("button",{type:"button",onClick:()=>a(!1),"aria-label":"Open media controls",title:"Open media controls",style:{position:"absolute",top:e==="top-left"?16:void 0,bottom:e==="bottom-left"?16:void 0,left:16,zIndex:5,width:40,height:40,border:"1px solid rgba(255,255,255,0.12)",borderRadius:999,background:"rgba(15, 23, 42, 0.72)",color:"#e5eefb",boxShadow:"0 12px 30px rgba(0,0,0,0.18)",backdropFilter:"blur(10px)",cursor:"pointer"},children:"≡"}):d.jsxs(d.Fragment,{children:[d.jsxs("div",{style:{position:"absolute",top:e==="top-left"?16:void 0,bottom:e==="bottom-left"?16:void 0,left:16,zIndex:5,display:"inline-flex",alignItems:"center",gap:8,maxWidth:"calc(100vw - 32px)"},children:[d.jsx("div",{style:{display:"inline-flex",alignItems:"center",gap:8,padding:8,borderRadius:999,background:"rgba(15, 23, 42, 0.72)",border:"1px solid rgba(255,255,255,0.12)",boxShadow:"0 12px 30px rgba(0,0,0,0.18)",backdropFilter:"blur(10px)",overflowX:"auto"},children:p.map(m=>{const x=m===c;return d.jsxs("button",{type:"button",onClick:()=>s(m),"aria-pressed":x,title:k[m].label,style:{border:"none",borderRadius:999,minWidth:42,height:42,padding:"0 12px",display:"inline-flex",alignItems:"center",justifyContent:"center",gap:8,background:x?"rgba(56, 189, 248, 0.18)":"rgba(255,255,255,0.04)",color:x?"#e0f2fe":"rgba(229,238,251,0.82)",cursor:"pointer",flex:"0 0 auto"},children:[d.jsx("span",{style:{fontSize:14,lineHeight:1},children:k[m].icon}),d.jsx("span",{style:{fontSize:12,fontWeight:700,letterSpacing:"0.01em"},children:k[m].label})]},m)})}),d.jsx("button",{type:"button",onClick:()=>a(!0),"aria-label":"Close media controls",title:"Close media controls",style:{width:40,height:40,border:"1px solid rgba(255,255,255,0.12)",borderRadius:999,background:"rgba(15, 23, 42, 0.72)",color:"#e5eefb",boxShadow:"0 12px 30px rgba(0,0,0,0.18)",backdropFilter:"blur(10px)",cursor:"pointer",flex:"0 0 auto"},children:"×"})]}),c==="image"&&t.length>0&&d.jsx(se,{dock:e,label:"Image Asset",options:t,value:o,onChange:i}),c==="video"&&h.length>0&&d.jsx(se,{dock:e,label:"Video Asset",options:h,value:n,onChange:r})]}):null},it=({enabled:e,selectedSource:t})=>{const o=G.useXRModelNode(L.XRModel.FACE_TRACKER);return{faces:ce.useFaceResults({node:o,enabled:e,selectedSource:t}),trackerStatus:o?"ready":"idle"}},ee=({children:e,fitMode:t="auto",imageOptions:o=[],initialImageId:c,initialMirrored:n=!0,initialSource:i="webcam",initialVideoId:s,mediaStrategy:r="internal",mediaDock:u="bottom-left",mode:h="dom",previewMode:f="finalColor",renderOutputs:a={},showMediaControlsByDefault:p=!0,source:m,style:x,videoOptions:w=[]})=>{const T=l.useRef(null),S=l.useRef(null),y=Ge(T),C=l.useMemo(()=>Ze({imageOptions:o,initialImageId:c,initialSource:i,initialVideoId:s,source:m,videoOptions:w}),[o,c,i,s,m,w]),[M,I]=l.useState(n),[b,g]=l.useState(p),[v,R]=l.useState(C.selectedSource),[z,X]=l.useState(C.selectedImageId),[A,B]=l.useState(C.selectedVideoId),[D,ve]=l.useState({sceneColorTexture:null,sceneDepthTexture:null}),j=r==="internal";l.useEffect(()=>{m&&(R(C.selectedSource),X(C.selectedImageId),B(C.selectedVideoId))},[C,m]);const W=o.find(K=>K.id===z)??o[0],N=w.find(K=>K.id===A)??w[0],E=Pe({enabled:j,imageAsset:W,selectedSource:v,videoAsset:N}),U=Qe(t,v),V=l.useMemo(()=>Oe(E.mediaSize,y,U),[E.mediaSize,U,y]),$=Je({enabled:!!(a.mediaColor||a.finalColor),imageRef:E.imageRef,selectedSource:v,status:E.status,videoRef:E.videoRef}),Y=he(v,M),q=fe({displayMirrored:Y,enabled:j&&E.status==="ready"&&V!==null,imageRef:E.imageRef,layout:V,selectedSource:v,sourceStream:E.stream,videoRef:E.videoRef}),te=it({enabled:!j,selectedSource:v}),Re=v==="image"?`${k.image.label}: ${(W==null?void 0:W.label)??""}`:v==="video"?`${k.video.label}: ${(N==null?void 0:N.label)??""}`:k.webcam.label,H={activeDelegate:j?q.activeDelegate:null,faces:j?q.faces:te.faces,imageOptions:o,layout:V,mediaError:E.error,mediaFitMode:U,mediaLabel:Re,mediaStatus:E.status,mirrored:Y,selectedImageId:z,selectedSource:v,selectedVideoId:A,setMirrored:I,setSelectedImageId:X,setSelectedSource:R,setSelectedVideoId:B,setShowMediaControls:g,showMediaControls:b,trackerError:j?q.error:null,trackerStatus:j?q.status:te.trackerStatus,videoOptions:w,viewportSize:y,mediaSize:E.mediaSize},Ce=l.useMemo(()=>({requested:a,previewMode:f,mediaColorTexture:$,sceneColorTexture:D.sceneColorTexture,finalColorTexture:a.finalColor?D.sceneColorTexture:null,sceneDepthTexture:D.sceneDepthTexture,estimatedDepthTexture:null,available:{mediaColor:$!==null,sceneColor:D.sceneColorTexture!==null,finalColor:!!(a.finalColor&&D.sceneColorTexture),sceneDepth:D.sceneDepthTexture!==null,estimatedDepth:!1}}),[$,f,a,D]),Se=typeof e=="function"?e(H):e,{sceneContent:ye,overlayContent:Ee}=et(h,Se),Te=ae(ye,H),Fe=ae(Ee,H);return d.jsx(be.Provider,{value:H,children:d.jsx(we.Provider,{value:Ce,children:d.jsxs("div",{ref:T,style:{position:"fixed",inset:0,overflow:"hidden",background:"#000",...x},children:[d.jsx(nt,{imageRef:E.imageRef,selectedSource:v,videoRef:E.videoRef}),h==="dom"&&j&&d.jsx(ge,{canvasRef:S,imageRef:E.imageRef,videoRef:E.videoRef,layer:Ue,layout:V,mirrored:Y,sourceKind:v==="image"?"image":"video"}),(h==="r3f"||h==="hybrid")&&d.jsx(_,{config:Ye,children:d.jsx(xe,{onRenderOutputs:ve,renderOutputs:{sceneColor:a.sceneColor||a.finalColor,sceneDepth:a.sceneDepth},renderTargetSize:y,style:{width:"100%",height:"100%"},children:Te})}),d.jsxs(_,{config:$e,children:[j&&d.jsx(ot,{dock:u,imageOptions:o,selectedImageId:z,selectedSource:v,selectedVideoId:A,setSelectedImageId:X,setSelectedSource:R,setSelectedVideoId:B,showMediaControls:b,videoOptions:w}),Fe]})]})})})};ee.Scene=Z;ee.Overlay=O;exports.ScreenRectAspectContext=Q;exports.ScreenSpaceContext=le;exports.ScreenTransform=Le;exports.XRLayer=_;exports.XRMediaSurface=ge;exports.XRScene=xe;exports.XRTrackingOverlay=Ne;exports.XRViewport=ee;exports.computeScreenTransform=ue;exports.resolveCalibrationFaceDisplayMirrored=he;exports.useCalibrationFaceTracker=fe;exports.useScreenRectAspect=De;exports.useScreenSpace=de;exports.useXRViewportRenderOutputs=rt;exports.useXRViewportState=tt;

package/dist/index-D8fpPQkC.cjs

@@ -0,0 +1 @@
+"use strict";const t={assetStorageEndpoint:"https://cdn.vincentt.studio",sdkAssetsBaseUrl:"https://cdn.vincentt.studio/assets/sdk/face/v1",loggerPrefix:"[vincentt-xr]:"};exports.libConfig=t;

package/dist/index-DxshgBu0.cjs

@@ -0,0 +1 @@
+"use strict";var le=Object.defineProperty;var ge=(i,s,e)=>s in i?le(i,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[s]=e;var h=(i,s,e)=>ge(i,typeof s!="symbol"?s+"":s,e);const me=require("react/jsx-runtime"),V=require("react"),I=require("./index-D8fpPQkC.cjs"),E=require("@mediapipe/tasks-vision"),D=require("three");function fe(i){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const e in i)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(i,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>i[e]})}}return s.default=i,Object.freeze(s)}const x=fe(D);var M=(i=>(i.WEBCAM="webcam",i.STREAM="stream",i.CANVAS="canvas",i))(M||{}),O=(i=>(i.HAND_TRACKER="vincentt.xr.hand-tracker",i.GESTURE_TRACKER="vincentt.xr.gesture-tracker",i.FACE_TRACKER="vincentt.xr.face-tracker",i.BODY_TRACKER="vincentt.xr.body-tracker",i.BACKGROUND_SEGMENTATION="vincentt.xr.background-segmentation",i))(O||{});const pe={BACKGROUND:-1e3,WORLD:0,TRACKED:100,SCREEN_UI:1e3};class b extends Error{constructor(s){super(s),this.name="VincenttXRError"}}class we{constructor(s){h(this,"options");const e={verbose:!1,prefix:I.libConfig.loggerPrefix};this.options={...e,...s}}log(...s){const{verbose:e,prefix:t}=this.options;e&&console.log(t,...s)}error(...s){const{verbose:e,prefix:t}=this.options;e&&console.error(t,...s)}}const L=i=>i*2-1,G=new x.Vector3,X=new x.Vector3,z=({x:i,y:s,z:e},t,a)=>{G.set((i-.5)*2,(.5-s)*2,-e),G.unproject(t),X.copy(G).sub(t.position).normalize();const o=-t.position.z/X.z;return a.copy(t.position).addScaledVector(X,o),a},ve=(i,s)=>z(i,s,new x.Vector3),Ce=(i,s,e=.2)=>e*s+(1-e)*i;class j{constructor(s){h(this,"canvas");this.maxDimension=s}draw(s){const e=s.width,t=s.height,a=Math.min(1,this.maxDimension/Math.max(e,t));if(a>=1)return s;const o=Math.max(1,Math.round(e*a)),c=Math.max(1,Math.round(t*a));(!this.canvas||this.canvas.width!==o||this.canvas.height!==c)&&(this.canvas=new OffscreenCanvas(o,c));const u=this.canvas.getContext("2d");return u?(u.setTransform(1,0,0,1,0,0),u.clearRect(0,0,o,c),u.drawImage(s,0,0,o,c),this.canvas):s}dispose(){this.canvas=void 0}}const Se={};async function ee(i){const s=await fetch(i);if(!s.ok)throw new Error(`fetchAndVerify: ${s.status} ${i}`);const e=await s.arrayBuffer(),t=ke(i);if(!t)return console.warn(`[xr-sdk integrity] no SRI hash for ${i} — passing through`),e;const a=await ye(e);if(a!==t)throw new Error(`[xr-sdk integrity] SRI mismatch for ${i}: expected ${t}, got ${a}`);return e}async function B(i){const s=await ee(i);return new Uint8Array(s)}function ke(i){try{const s=new URL(i);return Se[s.pathname]}catch{return}}async function ye(i){const s=await crypto.subtle.digest("SHA-384",i),e=new Uint8Array(s);let t="";for(let a=0;a<e.byteLength;a++)t+=String.fromCharCode(e[a]);return`sha384-${btoa(t)}`}class H{constructor(){h(this,"disposed",!1);h(this,"paused",!1);h(this,"rafId",null);h(this,"targetFrameIntervalMs",0);h(this,"lastInferenceMs",0)}setTargetFps(s){this.targetFrameIntervalMs=s&&s>0?1e3/s:0}shouldRunInference(){if(this.targetFrameIntervalMs<=0)return!0;const s=performance.now();return s-this.lastInferenceMs<this.targetFrameIntervalMs?!1:(this.lastInferenceMs=s,!0)}async initialize(s){}async run(s){}getModelNode(){return{}}async getPerformanceData(){return{name:this.constructor.name,processingTime:null}}pause(){this.paused=!0,this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null)}resume(){this.paused=!1}dispose(){this.disposed=!0,this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null)}}const Me=768;class Te extends H{constructor(){super();h(this,"landmarker",null);h(this,"processingTime",null);h(this,"coordinates");h(this,"sourceCanvas");h(this,"downscaler",new j(Me))}async getBodyData(){if(!this.landmarker||!this.sourceCanvas)return;const e=this.downscaler.draw(this.sourceCanvas),t=performance.now(),a=this.landmarker.detectForVideo(e,t),o=performance.now();this.processingTime=o-t;const c=a.landmarks,u=[];if(c)return c.forEach((m,d)=>{u[d]||(u[d]=[]),m.forEach(g=>{const f=L(g.x),w=L(1-g.y),p=L(g.z);u[d].push({x:f,y:w,z:p})})}),{coordinatesList:u}}async processBodyTracking(){if(this.disposed||!this.landmarker)return;const e=await this.getBodyData();e&&(this.coordinates=e.coordinatesList),!(this.disposed||this.paused)&&(this.rafId=requestAnimationFrame(this.processBodyTracking.bind(this)))}resume(){this.paused&&(super.resume(),this.processBodyTracking())}dispose(){if(super.dispose(),this.landmarker){try{this.landmarker.close()}catch{}this.landmarker=null}this.sourceCanvas=void 0,this.downscaler.dispose(),this.coordinates=void 0}getLandmarks2D(e=0){if(this.coordinates)return this.coordinates[e]}async initialize(e){const t=await E.FilesetResolver.forVisionTasks(new URL("/assets/xr/wasm",I.libConfig.assetStorageEndpoint).toString()),a=await B(new URL("/assets/xr/models/body_tracking.task",I.libConfig.assetStorageEndpoint).toString());this.landmarker=await E.PoseLandmarker.createFromOptions(t,{baseOptions:{modelAssetBuffer:a,delegate:"GPU"},runningMode:"VIDEO",numPoses:(e==null?void 0:e.numPoses)||1})}async run({sourceCanvas:e}){this.sourceCanvas=e,this.rafId===null&&await this.processBodyTracking()}getModelNode(){return{getLandmarks2D:this.getLandmarks2D.bind(this)}}async getPerformanceData(){return{name:this.constructor.name,processingTime:this.processingTime}}}const Re=.11,Fe=.004;class xe extends H{constructor(){super();h(this,"landmarker",null);h(this,"processingTime",null);h(this,"sourceCanvas");h(this,"analysisCanvas");h(this,"getSource");h(this,"detectionResults");h(this,"numFaces",1);h(this,"cameras",[]);h(this,"faces",[]);h(this,"leftCheekScratch",[]);h(this,"rightCheekScratch",[]);h(this,"landmarkScratch",{x:0,y:0,z:0,visibility:0});h(this,"rotMatrixScratch",new x.Matrix4);h(this,"rotQuatScratch",new x.Quaternion);h(this,"rotEulerScratch",new x.Euler)}landmarkForSource(e,t){return t?(this.landmarkScratch.x=1-e.x,this.landmarkScratch.y=e.y,this.landmarkScratch.z=e.z,this.landmarkScratch.visibility=e.visibility,this.landmarkScratch):e}extractAndUpdateFaceData(e){var a;if(!e.faceLandmarks.length){this.faces=[];return}const t=e.faceLandmarks.length;for(this.faces.length>t&&(this.faces.length=t,this.leftCheekScratch.length=t,this.rightCheekScratch.length=t);this.faces.length<t;)this.faces.push({transform:{position:new x.Vector3,rotation:new x.Vector3,scale:new x.Vector3},gestures:{}}),this.leftCheekScratch.push(new x.Vector3),this.rightCheekScratch.push(new x.Vector3);for(let o=0;o<t;o+=1){if(!this.cameras[o])continue;const c=this.faces[o],u=(a=this.getSource)==null?void 0:a.call(this),m=!(u==="webcam"||!u),d=e.faceLandmarks[o],g=e.facialTransformationMatrixes[o];this.rotMatrixScratch.fromArray(g.data),this.rotQuatScratch.setFromRotationMatrix(this.rotMatrixScratch),this.rotQuatScratch.set(-this.rotQuatScratch.x,this.rotQuatScratch.y,this.rotQuatScratch.z,this.rotQuatScratch.w),this.rotEulerScratch.setFromQuaternion(this.rotQuatScratch,"XYZ"),c.transform.rotation.set(-this.rotEulerScratch.x,this.rotEulerScratch.y,this.rotEulerScratch.z),z(this.landmarkForSource(d[4],m),this.cameras[o],c.transform.position),z(this.landmarkForSource(d[50],m),this.cameras[o],this.leftCheekScratch[o]),z(this.landmarkForSource(d[280],m),this.cameras[o],this.rightCheekScratch[o]);const w=this.leftCheekScratch[o].distanceTo(this.rightCheekScratch[o])*Re,p=Math.abs(x.MathUtils.radToDeg(this.rotEulerScratch.y)),S=w+p*Fe,C=c.transform.scale.x,y=Ce(isNaN(C)?0:C,S);c.transform.scale.set(y,y,y);const F=c.gestures,T=e.faceBlendshapes[o].categories;for(const A of T)F[A.categoryName]=A.score}}async processFaceTracking(){if(this.disposed||this.paused||!this.landmarker||!this.sourceCanvas)return null;if(!this.shouldRunInference()){this.rafId=requestAnimationFrame(this.processFaceTracking.bind(this));return}const e=Ae(this.numFaces),t=this.sourceCanvas.width,a=this.sourceCanvas.height,o=Math.min(1,e/Math.max(t,a)),c=Math.max(1,Math.round(t*o)),u=Math.max(1,Math.round(a*o));(!this.analysisCanvas||this.analysisCanvas.width!==c||this.analysisCanvas.height!==u)&&(this.analysisCanvas=new OffscreenCanvas(c,u));const m=this.analysisCanvas.getContext("2d");if(!m)return;m.setTransform(1,0,0,1,0,0),m.clearRect(0,0,c,u),m.drawImage(this.sourceCanvas,0,0,c,u);const d=performance.now(),g=this.landmarker.detectForVideo(this.analysisCanvas,d),f=performance.now();this.processingTime=f-d,this.detectionResults=g,this.extractAndUpdateFaceData(g),!(this.disposed||this.paused)&&(this.rafId=requestAnimationFrame(this.processFaceTracking.bind(this)))}resume(){this.paused&&(super.resume(),this.processFaceTracking())}getFace(e=0){return this.faces[e]}getDetectionResults(){return this.detectionResults}getRawFaceTrackingData(e=0){var t,a,o,c;if(this.detectionResults)return{landmarks:(t=this.detectionResults.faceLandmarks)==null?void 0:t[e],blendshapes:(o=(a=this.detectionResults.faceBlendshapes)==null?void 0:a[e])==null?void 0:o.categories,transformationMatrix:(c=this.detectionResults.facialTransformationMatrixes)==null?void 0:c[e]}}async initialize(e){this.numFaces=(e==null?void 0:e.numFaces)||1;const t=await E.FilesetResolver.forVisionTasks(new URL("/assets/xr/wasm",I.libConfig.assetStorageEndpoint).toString()),a=await B(new URL("/assets/xr/models/face_tracking.task",I.libConfig.assetStorageEndpoint).toString()),o=await E.FaceLandmarker.createFromOptions(t,{baseOptions:{modelAssetBuffer:a,delegate:"GPU"},minFaceDetectionConfidence:.3,minFacePresenceConfidence:.3,minTrackingConfidence:.3,outputFaceBlendshapes:!0,outputFacialTransformationMatrixes:!0,runningMode:"VIDEO",numFaces:this.numFaces});this.landmarker=o}async run({sourceCanvas:e,getSource:t,targetFps:a}){this.sourceCanvas=e,this.getSource=t,this.setTargetFps(a),this.analysisCanvas=void 0,this.rafId===null&&this.processFaceTracking()}getModelNode(){const e=this,t={get detectionResults(){return e.detectionResults},getDetectionResults:this.getDetectionResults.bind(this),getFace:this.getFace.bind(this),getRawFaceTrackingData:this.getRawFaceTrackingData.bind(this)};return Object.assign(t,{_setCamera:(a,o)=>{this.cameras[o]=a}}),t}async getPerformanceData(){return{name:this.constructor.name,processingTime:this.processingTime}}}const Ae=i=>i>1?1024:512;var _=(i=>(i.ClosedFist="closed_fist",i.OpenPalm="open_palm",i.PointingUp="pointing_up",i.ThumbDown="thumb_down",i.ThumbUp="thumb_up",i.Victory="victory",i.ILoveYou="i_love_you",i.None="none",i))(_||{});const be=512,Ee={Closed_Fist:_.ClosedFist,Open_Palm:_.OpenPalm,Pointing_Up:_.PointingUp,Thumb_Down:_.ThumbDown,Thumb_Up:_.ThumbUp,Victory:_.Victory,ILoveYou:_.ILoveYou,None:_.None},Ie=15;class De extends H{constructor(){super();h(this,"landmarker",null);h(this,"processingTime",null);h(this,"coordinates");h(this,"gesture");h(this,"sourceCanvas");h(this,"downscaler",new j(be))}async getGestureData(){if(!this.landmarker||!this.sourceCanvas)return;const e=this.downscaler.draw(this.sourceCanvas),t=performance.now(),a=this.landmarker.recognizeForVideo(e,t),o=performance.now();this.processingTime=o-t;const c=a.landmarks[0],u=[];if(c){const m=a.gestures[0][0].categoryName;return c.forEach(d=>{u.push({x:L(d.x),y:L(1-d.y),z:-d.z})}),{coordinates:u,gesture:Ee[m]}}return{coordinates:void 0,gesture:void 0}}async processGestureTracking(){if(!this.disposed){if(this.shouldRunInference()){const e=await this.getGestureData();e&&(this.coordinates=e.coordinates,this.gesture=e.gesture)}this.disposed||this.paused||(this.rafId=requestAnimationFrame(this.processGestureTracking.bind(this)))}}resume(){this.paused&&(super.resume(),this.processGestureTracking())}dispose(){if(super.dispose(),this.landmarker){try{this.landmarker.close()}catch{}this.landmarker=null}this.sourceCanvas=void 0,this.downscaler.dispose(),this.coordinates=void 0,this.gesture=void 0}async initialize(){const e=await E.FilesetResolver.forVisionTasks(new URL("/assets/xr/wasm",I.libConfig.assetStorageEndpoint).toString()),t=await B(new URL("/assets/xr/models/gesture_tracking.task",I.libConfig.assetStorageEndpoint).toString()),a=await E.GestureRecognizer.createFromOptions(e,{baseOptions:{modelAssetBuffer:t,delegate:"GPU"},runningMode:"VIDEO",numHands:1});this.landmarker=a}async run({sourceCanvas:e,targetFps:t}){this.sourceCanvas=e,this.setTargetFps(t??Ie),this.rafId===null&&await this.processGestureTracking()}getModelNode(){const e=this;return{get coordinates(){return e.coordinates},get gesture(){return e.gesture}}}async getPerformanceData(){return{name:this.constructor.name,processingTime:this.processingTime}}}const _e=512;class Pe extends H{constructor(){super();h(this,"landmarker",null);h(this,"processingTime",null);h(this,"hands");h(this,"coordinates");h(this,"gesture");h(this,"handedness");h(this,"sourceCanvas");h(this,"downscaler",new j(_e))}async getHandData(){if(!this.landmarker||!this.sourceCanvas)return;const e=this.downscaler.draw(this.sourceCanvas),t=performance.now(),a=this.landmarker.detectForVideo(e,t),o=performance.now();this.processingTime=o-t;const c=[],u=a.handedness??a.handednesses??[];if(a.landmarks.forEach((d,g)=>{var C,y,F;if(!d||d.length===0)return;const f=d.map(T=>({x:L(T.x),y:L(1-T.y),z:-T.z})),w=(F=(y=(C=u[g])==null?void 0:C[0])==null?void 0:y.categoryName)==null?void 0:F.toLowerCase(),p=w==="left"||w==="right"?w:void 0,S=d[0].z<0?"closed_fist":"open_palm";c.push({coordinates:f,gesture:S,handedness:p})}),!c.length)return{hands:void 0,coordinates:void 0,gesture:void 0,handedness:void 0};const m=c[0];return{hands:c,coordinates:m.coordinates,gesture:m.gesture,handedness:m.handedness}}async processHandTracking(){if(!this.disposed){if(this.shouldRunInference()){const e=await this.getHandData();e&&(this.hands=e.hands,this.coordinates=e.coordinates,this.gesture=e.gesture,this.handedness=e.handedness)}this.disposed||this.paused||(this.rafId=requestAnimationFrame(this.processHandTracking.bind(this)))}}resume(){this.paused&&(super.resume(),this.processHandTracking())}dispose(){if(super.dispose(),this.landmarker){try{this.landmarker.close()}catch{}this.landmarker=null}this.sourceCanvas=void 0,this.hands=void 0,this.downscaler.dispose(),this.coordinates=void 0,this.gesture=void 0,this.handedness=void 0}async initialize(){const e=await E.FilesetResolver.forVisionTasks(new URL("/assets/xr/wasm",I.libConfig.assetStorageEndpoint).toString()),t=await B(new URL("/assets/xr/models/hand_tracking.task",I.libConfig.assetStorageEndpoint).toString()),a=await E.HandLandmarker.createFromOptions(e,{baseOptions:{modelAssetBuffer:t,delegate:"GPU"},runningMode:"VIDEO",numHands:2});this.landmarker=a}async run({sourceCanvas:e,targetFps:t}){this.sourceCanvas=e,this.setTargetFps(t),this.rafId===null&&await this.processHandTracking()}getModelNode(){const e=this;return{get hands(){return e.hands},get coordinates(){return e.coordinates},get gesture(){return e.gesture},get handedness(){return e.handedness}}}async getPerformanceData(){return{name:this.constructor.name,processingTime:this.processingTime}}}const Oe=24,Le=720,Ue=[[255,255,255,255],[0,0,0,0]];class Ne extends H{constructor(){super();h(this,"segmenter",null);h(this,"processingTime",null);h(this,"sourceCanvas");h(this,"processCanvas");h(this,"filterCanvas");h(this,"inputSource");h(this,"inputSourceSize");h(this,"glCanvas");h(this,"drawingUtils");h(this,"useGpuMaskPath",!1);h(this,"maskImageData");h(this,"maskCanvas",null);h(this,"segmentationMaskTexture");h(this,"isMaskSetup",!1);h(this,"isProcessing",!1);h(this,"latestMask",null);h(this,"rawCache",null);h(this,"quality","medium");h(this,"stagingCanvas")}getQualityScaleFactor(){switch(this.quality){case"low":return .5;case"medium":return .75;case"high":return 1;default:return .5}}setInputSource(e){this.inputSource=e,this.inputSourceSize=e?this.readIntrinsicSize(e):void 0}readIntrinsicSize(e){if(e instanceof HTMLVideoElement)return e.videoWidth>0?{width:e.videoWidth,height:e.videoHeight}:void 0;if(e instanceof HTMLImageElement)return e.naturalWidth>0?{width:e.naturalWidth,height:e.naturalHeight}:void 0;const t=e.width,a=e.height;return typeof t=="number"&&t>0&&typeof a=="number"&&a>0?{width:t,height:a}:void 0}ensureProcessCanvasForInput(){if(!this.processCanvas||!this.inputSource)return;const e=this.readIntrinsicSize(this.inputSource);if(!e)return;this.inputSourceSize=e;const t=Math.min(1,Le/Math.max(e.width,e.height)),a=Math.max(1,Math.round(e.width*t)),o=Math.max(1,Math.round(e.height*t));this.processCanvas.width===a&&this.processCanvas.height===o||(this.processCanvas.width=a,this.processCanvas.height=o,this.glCanvas&&(this.glCanvas.width=a,this.glCanvas.height=o),this.maskImageData=void 0)}async processSegmentation(){if(this.disposed||!this.isProcessing||!this.maskCanvas||!this.processCanvas)return;if(!this.shouldRunInference()){if(this.disposed||this.paused)return;this.rafId=requestAnimationFrame(this.processSegmentation.bind(this));return}const e=this.inputSource??this.sourceCanvas;if(!this.segmenter||!e){if(this.disposed||this.paused)return;this.rafId=requestAnimationFrame(this.processSegmentation.bind(this));return}const t=performance.now();this.ensureProcessCanvasForInput();const a=this.processCanvas.getContext("2d");if(a){const u=this.processCanvas.width,m=this.processCanvas.height;if(a.clearRect(0,0,u,m),this.inputSource&&this.inputSourceSize){const{width:d,height:g}=this.inputSourceSize,f=Math.min(u/d,m/g),w=d*f,p=g*f;a.drawImage(this.inputSource,(u-w)/2,(m-p)/2,w,p)}else a.drawImage(e,0,0,u,m)}const c=this.segmenter.segmentForVideo(this.processCanvas,performance.now()).categoryMask;if(!c){if(this.disposed||this.paused)return;this.rafId=requestAnimationFrame(this.processSegmentation.bind(this));return}if(this.rawCache=null,this.latestMask&&(this.latestMask.close(),this.latestMask=null),this.useGpuMaskPath&&this.drawingUtils&&this.glCanvas)this.drawingUtils.drawCategoryMask(c,Ue),this.latestMask=c.clone(),c.close(),this.blitGlToMask();else{this.latestMask=c.clone();const u=this.readMaskToImageData(c);c.close(),u&&this.blitImageDataToMask(u)}this.segmentationMaskTexture&&(this.isMaskSetup||(this.segmentationMaskTexture.format=D.RGBAFormat,this.segmentationMaskTexture.minFilter=D.LinearFilter,this.segmentationMaskTexture.magFilter=D.LinearFilter,this.segmentationMaskTexture.generateMipmaps=!1,this.isMaskSetup=!0),this.segmentationMaskTexture.needsUpdate=!0),this.processingTime=performance.now()-t,!(this.disposed||this.paused)&&(this.rafId=requestAnimationFrame(this.processSegmentation.bind(this)))}blitGlToMask(){if(!this.maskCanvas||!this.filterCanvas||!this.glCanvas)return;const e=this.maskCanvas.getContext("2d"),t=this.filterCanvas.getContext("2d");!e||!t||(t.filter="blur(0.5px)",t.clearRect(0,0,this.filterCanvas.width,this.filterCanvas.height),t.drawImage(this.glCanvas,0,0,this.filterCanvas.width,this.filterCanvas.height),e.clearRect(0,0,this.maskCanvas.width,this.maskCanvas.height),e.drawImage(this.filterCanvas,0,0,this.maskCanvas.width,this.maskCanvas.height))}readMaskToImageData(e){const t=e.getAsUint8Array(),{width:a,height:o}=e;if(!t||a<=0||o<=0)return null;(!this.maskImageData||this.maskImageData.width!==a||this.maskImageData.height!==o)&&(this.maskImageData=new ImageData(a,o));const c=this.maskImageData.data;for(let u=0;u<t.length;u+=1){const m=t[u]===255?0:255;c[u*4]=255,c[u*4+1]=m,c[u*4+2]=255,c[u*4+3]=m}return this.maskImageData}blitImageDataToMask(e){if(!this.maskCanvas||!this.filterCanvas)return;const t=this.maskCanvas.getContext("2d"),a=this.filterCanvas.getContext("2d");if(!t||!a)return;const o=this.getStagingCanvas(e.width,e.height),c=o.getContext("2d");c&&(c.putImageData(e,0,0),a.filter="blur(0.5px)",a.clearRect(0,0,this.filterCanvas.width,this.filterCanvas.height),a.drawImage(o,0,0,this.filterCanvas.width,this.filterCanvas.height),t.clearRect(0,0,this.maskCanvas.width,this.maskCanvas.height),t.drawImage(this.filterCanvas,0,0,this.maskCanvas.width,this.maskCanvas.height))}getStagingCanvas(e,t){return this.stagingCanvas||(this.stagingCanvas=document.createElement("canvas")),this.stagingCanvas.width!==e&&(this.stagingCanvas.width=e),this.stagingCanvas.height!==t&&(this.stagingCanvas.height=t),this.stagingCanvas}resume(){this.paused&&(super.resume(),this.processSegmentation())}dispose(){if(super.dispose(),this.isProcessing=!1,this.latestMask){try{this.latestMask.close()}catch{}this.latestMask=null}if(this.rawCache=null,this.segmenter){try{this.segmenter.close()}catch{}this.segmenter=null}this.drawingUtils=void 0,this.glCanvas=void 0,this.maskImageData=void 0,this.segmentationMaskTexture&&(this.segmentationMaskTexture.dispose(),this.segmentationMaskTexture=void 0),this.sourceCanvas=void 0,this.inputSource=void 0,this.inputSourceSize=void 0,this.processCanvas=void 0,this.filterCanvas=void 0,this.stagingCanvas=void 0,this.maskCanvas=null}async initialize(e){this.quality=(e==null?void 0:e.quality)??"low";const t=await E.FilesetResolver.forVisionTasks(new URL("/assets/xr/wasm",I.libConfig.assetStorageEndpoint).toString()),a=await B(new URL("/assets/xr/models/segmentation.tflite",I.libConfig.assetStorageEndpoint).toString());this.glCanvas=new OffscreenCanvas(1,1);const o=this.glCanvas.getContext("webgl2",{preserveDrawingBuffer:!0});this.segmenter=await E.ImageSegmenter.createFromOptions(t,{baseOptions:{modelAssetBuffer:a,delegate:"GPU"},...o?{canvas:this.glCanvas}:{},outputCategoryMask:!0,outputConfidenceMasks:!1,runningMode:"VIDEO"}),o?(this.drawingUtils=new E.DrawingUtils(o),this.useGpuMaskPath=!0):this.useGpuMaskPath=!1}async run({sourceCanvas:e,renderWidth:t,renderHeight:a,targetFps:o}){if(!e)return;this.setTargetFps(o??Oe),this.isProcessing=!1,this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null);const c=this.getQualityScaleFactor();this.sourceCanvas=e,this.processCanvas=document.createElement("canvas"),this.processCanvas.width=e.width*c,this.processCanvas.height=e.height*c,this.glCanvas&&(this.glCanvas.width=this.processCanvas.width,this.glCanvas.height=this.processCanvas.height),this.maskImageData=void 0,this.maskCanvas=document.createElement("canvas"),this.maskCanvas.width=t,this.maskCanvas.height=a,this.filterCanvas=document.createElement("canvas"),this.filterCanvas.width=t,this.filterCanvas.height=a,this.segmentationMaskTexture=new D.CanvasTexture(this.maskCanvas),this.isMaskSetup=!1,this.rawCache=null,this.isProcessing=!0,this.lastInferenceMs=0,this.rafId=requestAnimationFrame(this.processSegmentation.bind(this))}getRawSegmentationData(){if(this.rawCache)return this.rawCache;if(!this.latestMask)return null;const e=this.latestMask.getAsUint8Array();return this.rawCache={maskData:e,width:this.latestMask.width,height:this.latestMask.height},this.rawCache}getModelNode(){const e=this;return{get backgroundSegmentationMask(){return e.segmentationMaskTexture},getMaskCanvas:()=>e.maskCanvas,getRawSegmentationData:()=>e.getRawSegmentationData(),setInputSource:t=>e.setInputSource(t??void 0)}}async getPerformanceData(){return{name:this.constructor.name,processingTime:this.processingTime}}}const J={[O.BACKGROUND_SEGMENTATION]:Ne,[O.HAND_TRACKER]:Pe,[O.GESTURE_TRACKER]:De,[O.FACE_TRACKER]:xe,[O.BODY_TRACKER]:Te},ze=async i=>{const s=document.createElement("video");s.srcObject=i,s.muted=!0,s.playsInline=!0,s.autoplay=!0,await new Promise(t=>{s.onloadedmetadata=()=>{s.play(),t()}});const e=s;return await new Promise(t=>{const a=setTimeout(t,150),o=()=>{clearTimeout(a),t()};typeof e.requestVideoFrameCallback=="function"?e.requestVideoFrameCallback(o):requestAnimationFrame(()=>requestAnimationFrame(()=>o()))}),s},Ve=i=>{const s=new D.CanvasTexture(i);return s.colorSpace=D.SRGBColorSpace,s.format=D.RGBAFormat,s.minFilter=D.LinearFilter,s.magFilter=D.LinearFilter,s.generateMipmaps=!1,s.needsUpdate=!0,s},Be=(i,s)=>{const e=i.videoWidth,t=i.videoHeight;e>0&&t>0&&(s.width!==e&&(s.width=e),s.height!==t&&(s.height=t));const a=s.getContext("2d",{colorSpace:"srgb"});a.save(),a.scale(-1,1),a.drawImage(i,-s.width,0,s.width,s.height),a.restore()},He=(i,s,e=1)=>{const t=s.getContext("2d",{colorSpace:"srgb"}),a=s.width/s.height,o=i.width/i.height;let c,u;o>a?(u=s.height,c=i.width*(s.height/i.height)):(c=s.width,u=i.height*(s.width/i.width));const m=Number.isFinite(e)&&e>0?e:1;c*=m,u*=m;const d=(s.width-c)/2,g=(s.height-u)/2;t.setTransform(1,0,0,1,0,0),t.clearRect(0,0,s.width,s.height),t.drawImage(i,0,0,i.width,i.height,d,g,c,u)},qe=(i,s,e)=>{const t=new Map;return{acquire:async(g,f,w)=>{let p=t.get(g);if(p)return p.refs.add(f),p.activeRefs.add(f),p.initPromise;const S=s[g];if(!S)throw new Error(`Invalid model: ${g}`);const C=new S,y=new Set([f]),F=new Set([f]),T=(async()=>{await C.initialize(w),e&&await e(g,C);const A=t.get(g);return A&&A.refs.size>0&&i.setPipeline(P=>P.set(g,C)),C})();return p={model:C,refs:y,activeRefs:F,initPromise:T,options:w},t.set(g,p),T.catch(()=>{t.get(g)===p&&(t.delete(g),i.setPipeline(P=>P.delete(g)))}),T},release:(g,f)=>{var S;const w=t.get(g);if(!w||(w.refs.delete(f),w.activeRefs.delete(f)&&w.refs.size>0&&w.activeRefs.size===0&&w.model.pause(),w.refs.size>0))return;t.delete(g);const p=w.model;try{(S=p.dispose)==null||S.call(p)}catch(C){console.warn(`[xr-sdk registry] dispose threw for ${g}`,C)}i.setPipeline(C=>C.delete(g))},setActive:(g,f,w)=>{const p=t.get(g);if(!p||!p.refs.has(f))return;const S=p.activeRefs.size>0;w?p.activeRefs.add(f):p.activeRefs.delete(f);const C=p.activeRefs.size>0;S!==C&&(C?p.model.resume():p.model.pause())},get:g=>{var f;return(f=t.get(g))==null?void 0:f.model},getOptions:g=>{var f;return(f=t.get(g))==null?void 0:f.options},releaseAll:()=>{var g;for(const f of Array.from(t.keys())){const w=t.get(f);if(!w)continue;w.refs.clear(),t.delete(f);const p=w.model;try{(g=p.dispose)==null||g.call(p)}catch(S){console.warn(`[xr-sdk registry] dispose threw for ${f}`,S)}}i.setPipeline(f=>f.clear())}}},Ke={lifecycle:"idle",ready:!1,error:void 0,cameraTexture:void 0,renderWidth:0,renderHeight:0,source:void 0,sourceKind:void 0,pipeline:new Map},We=()=>{let i={...Ke,pipeline:new Map};const s=new Set,e=()=>{s.forEach(t=>t())};return{getSnapshot:()=>i,set:t=>{let a=!1;for(const o of Object.keys(t))if(t[o]!==i[o]){a=!0;break}a&&(i={...i,...t},e())},setPipeline:t=>{const a=new Map(i.pipeline);return t(a),i={...i,pipeline:a},e(),a},subscribe:t=>(s.add(t),()=>{s.delete(t)})}},Ge=({renderHeight:i,renderWidth:s,videoHeight:e,videoWidth:t})=>({height:i||e,width:s||t}),Xe=i=>{const s=new we({verbose:!0}),e=We();let t=i;const a=n=>{var l;const r=(l=U.getOptions(n))==null?void 0:l.targetFps;return typeof r=="number"?r:t==null?void 0:t.targetFps};let o,c,u,m,d,g,f,w,p,S,C=!1,y=!1;const F=new Set,T=new Set,A=n=>{const r=e.getSnapshot().cameraTexture;r&&r.dispose();const l=Ve(n);return e.set({cameraTexture:l}),l},P=async(n,r)=>{if(!F.has(n)&&e.getSnapshot().lifecycle==="running"&&d){F.add(n);try{await r.run({sourceCanvas:d,renderWidth:e.getSnapshot().renderWidth,renderHeight:e.getSnapshot().renderHeight,getSource:()=>e.getSnapshot().sourceKind,targetFps:a(n)}),y&&(await new Promise(l=>requestAnimationFrame(()=>l())),await new Promise(l=>requestAnimationFrame(()=>l())),r.pause())}catch(l){throw F.delete(n),l}}},U=qe(e,J,(n,r)=>P(n,r));e.subscribe(()=>{if(e.getSnapshot().lifecycle!=="running")return;const n=e.getSnapshot().pipeline;for(const[r,l]of n.entries())F.has(r)||P(r,l)});const N=()=>{if(S!==void 0&&(cancelAnimationFrame(S),S=void 0),c){try{c.pause()}catch{}try{c.srcObject=null}catch{}c=void 0}if(u){try{u.getTracks().forEach(n=>n.stop())}catch{}u=void 0}},q=()=>{if(C||!c||!m||!d)return;const n=window.__xr_debugger_metrics;if(n!=null&&n.trackCameraFrame&&n.trackCameraFrame(),(e.getSnapshot().sourceKind??"webcam")==="webcam")Be(c,m);else{const v=m.getContext("2d");if(!v)return;const k=c.videoWidth,R=c.videoHeight;m.width!==k&&(m.width=k),m.height!==R&&(m.height=R),v.setTransform(1,0,0,1,0,0),v.clearRect(0,0,k,R),v.drawImage(c,0,0,k,R)}He(m,d,(t==null?void 0:t.cameraZoom)??1.2);const l=e.getSnapshot().cameraTexture;l&&(l.needsUpdate=!0)},Y=()=>{if(!c||!m||!d)return;if(y){q();return}const n=()=>{S=requestAnimationFrame(n),q()};S=requestAnimationFrame(n)},se=async n=>{if(n.source===M.WEBCAM)try{const r=t!=null&&t.camRes&&t.camRes>0?t.camRes:960;return await navigator.mediaDevices.getUserMedia({video:{facingMode:"user",frameRate:{min:24,ideal:30,max:60},width:{ideal:r}}})}catch(r){const l=r instanceof DOMException?r.name:"",v=l==="NotReadableError"||l==="TrackStartError"?"Camera is already in use by another app or browser tab. Close it and refresh.":l==="NotFoundError"||l==="DevicesNotFoundError"?"No camera was found on this device.":l==="NotAllowedError"||l==="PermissionDeniedError"?"Camera access was blocked. Allow camera permissions in your browser, then refresh.":"Unable to access camera. Allow camera permissions in your browser, then refresh.";throw e.set({error:{error:"PermissionError",message:v}}),new b(r instanceof Error?r.message:"getUserMedia failed")}return n.stream},K=async n=>{const r=await se(n);u=r;const l=await ze(r);c=l,m=new OffscreenCanvas(l.videoWidth,l.videoHeight);const{renderWidth:v,renderHeight:k}=e.getSnapshot(),R=Ge({renderWidth:v,renderHeight:k,videoWidth:l.videoWidth,videoHeight:l.videoHeight});d?(d.width!==R.width||d.height!==R.height)&&(d.width=R.width,d.height=R.height,A(d)):(d=new OffscreenCanvas(R.width,R.height),A(d));const Z=n.source===M.STREAM?n.static===!0:!1;y=Z,o=n.source===M.WEBCAM?{source:M.WEBCAM,sourceKind:"webcam"}:{source:M.STREAM,stream:n.stream,static:Z,sourceKind:n.sourceKind??"webcam"},e.set({source:n.source,sourceKind:o.sourceKind,error:void 0})},W=async n=>{const r=n.sourceKind??"webcam";d=n.canvas;const l=A(d);e.set({cameraTexture:l,source:M.CANVAS,sourceKind:r,renderWidth:d.width,renderHeight:d.height,error:void 0}),o={source:M.CANVAS,canvas:n.canvas,sourceKind:r}},ie=(n,r)=>!r||n.source!==r.source?!1:n.source===M.STREAM&&r.source===M.STREAM?n.stream===r.stream&&(n.sourceKind??"webcam")===r.sourceKind:!0,ne=async()=>{if(!d)return;const n=e.getSnapshot().pipeline;for(const[,r]of n.entries())r.resume();await new Promise(r=>requestAnimationFrame(()=>r())),await new Promise(r=>requestAnimationFrame(()=>r()));for(const[,r]of n.entries())r.pause()},ae=(n,r)=>!r||r.source!==M.CANVAS?!1:n.canvas===r.canvas&&(n.sourceKind??"webcam")===r.sourceKind,re=async n=>{const r=n.source;if(r!==M.WEBCAM&&r!==M.STREAM)throw new b(`Invalid media source: ${String(r)}`);if(ie(n,o)){s.log("Media source unchanged, skipping rebind.");return}const{lifecycle:l}=e.getSnapshot();if(l==="idle"||l==="stopped"){await K(n),e.set({lifecycle:"media-bound"}),s.log("Media source set to:",n.source);return}if(l==="media-bound"){N(),await K(n),s.log("Media source rebound to:",n.source);return}if(C=!0,await new Promise(v=>requestAnimationFrame(()=>v())),N(),await K(n),C=!1,Y(),y)await ne();else{const v=e.getSnapshot().pipeline;for(const[,k]of v.entries())k.resume()}s.log("Media source swapped to:",n.source)},oe=async n=>{if(ae(n,o)){s.log("Frame source unchanged, skipping rebind.");return}const{lifecycle:r}=e.getSnapshot();if(r==="idle"||r==="stopped"){await W(n),e.set({lifecycle:"media-bound"}),s.log("Frame source set to canvas.");return}if(r==="media-bound"){N(),await W(n),s.log("Frame source rebound to canvas.");return}C=!0,await new Promise(l=>requestAnimationFrame(()=>l())),N(),await W(n),C=!1,s.log("Frame source swapped to canvas.")},ce=async()=>{const{lifecycle:n}=e.getSnapshot();if(n==="running")return;if(n==="idle")throw new b("session.start() called before setMediaSource — call setMediaSource first");if(!d)throw new b("session.start(): media source not bound");const r=(o==null?void 0:o.source)===M.CANVAS;if(!r&&(!c||!m))throw n==="stopped"?new b("session.start() called from stopped state without a media source — call setMediaSource first"):new b("session.start(): media source not bound");r||Y(),e.set({lifecycle:"running"}),await new Promise(v=>requestAnimationFrame(()=>v()));const l=e.getSnapshot().pipeline;for(const[v,k]of l.entries())await P(v,k);e.set({ready:!0}),s.log("XR session started.")},$=async()=>{const{lifecycle:n}=e.getSnapshot();n==="stopped"||n==="idle"||(N(),e.set({lifecycle:"stopped",ready:!1}),s.log("XR session stopped."))},he=async()=>{await $(),U.releaseAll(),T.clear();const n=e.getSnapshot().cameraTexture;n&&n.dispose(),F.clear(),o=void 0,d=void 0,m=void 0,y=!1,e.set({lifecycle:"idle",cameraTexture:void 0,source:void 0}),s.log("XR session reset.")},de=async n=>{const r="legacy:registerXRPipeline",l=[];await Promise.all(n.map(async v=>{const{model:k}=v;if(!J[k])throw new b(`Invalid model: ${k}`);T.has(k)||l.push(k);const R="options"in v?v.options:void 0;await U.acquire(k,r,R)})),l.length>0&&(l.forEach(v=>T.add(v)),s.log("XR pipeline registered."))},ue=n=>{const r=U.get(n);if(!r)throw new b(`Model ${n} is not registered in the pipeline`);return r.getModelNode()},Q=async(n,r)=>{n<=0||r<=0||(e.set({renderWidth:n,renderHeight:r}),d&&(d.width!==n||d.height!==r)&&(d.width=n,d.height=r,A(d),y&&q()),s.log(`Source canvas set. Render size: ${n}x${r}`))};return{store:e,registry:U,setMediaSource:re,start:ce,stop:$,reset:he,setFrameSource:oe,registerXRPipeline:de,getModelNode:ue,captureFrame:()=>{if(!g)throw new b("session.captureFrame() called before the XRScene render target was bound — make sure <XRScene> is mounted");if(!f||!w||!p)throw new b("session.captureFrame() called before the R3F state was bound — make sure <XRScene> is mounted");return f.render(w,p),g.toDataURL("image/png")},_setRenderTarget:async n=>{var k;g=n;const r=(k=n.getBoundingClientRect)==null?void 0:k.call(n),l=r&&r.width>0?Math.round(r.width):n.clientWidth,v=r&&r.height>0?Math.round(r.height):n.clientHeight;await Q(l,v)},_setRenderSize:Q,_setR3FState:n=>{f=n.renderer,w=n.scene,p=n.camera},_getVideoElement:()=>c,_setPerf:n=>{if(t=n,e.getSnapshot().lifecycle!=="running"||!d)return;const r=e.getSnapshot().pipeline;for(const[l,v]of r.entries())v.run({sourceCanvas:d,renderWidth:e.getSnapshot().renderWidth,renderHeight:e.getSnapshot().renderHeight,getSource:()=>e.getSnapshot().sourceKind,targetFps:a(l)})}}},je=i=>{const s=V.useMemo(()=>Xe(i),[]),e=JSON.stringify(i??{});return V.useEffect(()=>{s._setPerf(i)},[s,e]),s},te=V.createContext(void 0),Ye=()=>{const i=V.useContext(te);if(!i)throw new b("XR context can only be used inside XRProvider, did you forget to wrap your app in <XRProvider>?");return i},$e=({children:i,perf:s})=>{const e=je(s),t=V.useMemo(()=>({session:e}),[e]);return me.jsx(te.Provider,{value:t,children:i})};exports.RENDER_LAYERS=pe;exports.XRMediaSource=M;exports.XRModel=O;exports.XRProvider=$e;exports.fetchAndVerify=ee;exports.unprojectToZZero=ve;exports.unprojectToZZeroInto=z;exports.useXRContext=Ye;