@vincentt-xr/sdk 2.0.0-alpha.7 → 2.0.0-alpha.9

package/dist/selectors-DmNaKIwE.js

@@ -0,0 +1,196 @@
+import { useSyncExternalStore as s, useMemo as u } from "react";
+import { u as d, m as g, s as p, i as h, c as S } from "./index-CIe7eCMH.js";
+const r = () => d().session.store, o = (e) => (t) => e.subscribe(t), k = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().ready,
+    () => !1
+  );
+}, R = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().error,
+    () => {
+    }
+  );
+}, m = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().lifecycle,
+    () => "idle"
+  );
+}, M = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().modelErrors,
+    () => f
+  );
+}, f = /* @__PURE__ */ new Map(), C = () => {
+  const e = r(), t = s(
+    o(e),
+    () => e.getSnapshot().sourceKind,
+    () => {
+    }
+  );
+  return h(t);
+}, T = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().orientation,
+    () => X
+  );
+}, X = { type: "portrait", angle: 0 }, v = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().cameraDeviceId,
+    () => null
+  );
+}, F = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().qualityConfig,
+    () => null
+  );
+}, H = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().quality,
+    () => null
+  );
+}, W = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().cameraFacing,
+    () => null
+  );
+}, w = () => {
+  const e = r(), t = s(
+    o(e),
+    () => e.getSnapshot().cameraPermission,
+    () => "unknown"
+  ), n = s(
+    o(e),
+    () => e.getSnapshot().cameraPermissionReason,
+    () => null
+  );
+  return u(() => ({ state: t, reason: n }), [t, n]);
+}, x = (e) => {
+  const t = r(), { session: n } = d(), a = R(), c = s(
+    o(t),
+    () => t.getSnapshot().pipeline.get(e) ?? null,
+    () => null
+  ), i = s(
+    o(t),
+    () => t.getSnapshot().modelErrors.get(e) ?? null,
+    () => null
+  ), l = m();
+  return u(() => i ? { status: "error", fallback: g(i.error) } : a ? { status: "blocked", fallback: p(a.reason) } : c ? { status: "ready", fallback: null } : { status: n.registry.getState(e) === "initializing" ? "loading" : "unavailable", fallback: null }, [i, a, c, n, e, l]);
+}, O = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => e.getSnapshot().cameraTexture,
+    () => {
+    }
+  );
+}, P = () => {
+  const e = r(), t = s(
+    o(e),
+    () => e.getSnapshot().renderWidth,
+    () => 0
+  ), n = s(
+    o(e),
+    () => e.getSnapshot().renderHeight,
+    () => 0
+  );
+  return u(() => ({ width: t, height: n }), [t, n]);
+}, A = () => {
+  const e = r();
+  return s(
+    o(e),
+    () => {
+      const { renderWidth: t, renderHeight: n, sourceWidth: a, sourceHeight: c } = e.getSnapshot();
+      return t > 0 && n > 0 ? t / n : a > 0 && c > 0 ? a / c : 1;
+    },
+    () => 1
+  );
+}, D = () => {
+  const e = r(), t = s(
+    o(e),
+    () => e.getSnapshot().sourceWidth,
+    () => 0
+  ), n = s(
+    o(e),
+    () => e.getSnapshot().sourceHeight,
+    () => 0
+  ), a = s(
+    o(e),
+    () => e.getSnapshot().renderWidth,
+    () => 0
+  ), c = s(
+    o(e),
+    () => e.getSnapshot().renderHeight,
+    () => 0
+  ), i = s(
+    o(e),
+    () => e.getSnapshot().cameraZoom,
+    () => 1.2
+  ), l = s(
+    o(e),
+    () => e.getSnapshot().sourceKind,
+    () => {
+    }
+  );
+  return u(
+    () => S({
+      source: { width: t, height: n },
+      feed: { width: a, height: c },
+      zoom: i,
+      mirrored: h(l)
+    }),
+    [t, n, a, c, i, l]
+  );
+}, I = (e) => {
+  const t = r(), n = s(
+    o(t),
+    () => t.getSnapshot().pipeline.get(e) ?? null,
+    () => null
+  );
+  return u(() => n ? n.getModelNode() : null, [n]);
+}, K = () => {
+  const e = r(), t = s(
+    o(e),
+    () => e.getSnapshot().pipeline,
+    () => e.getSnapshot().pipeline
+  );
+  return u(() => Array.from(t.keys()), [t]);
+};
+export {
+  F as a,
+  I as b,
+  O as c,
+  k as d,
+  C as e,
+  R as f,
+  A as g,
+  m as h,
+  M as i,
+  x as j,
+  w as k,
+  W as l,
+  v as m,
+  T as n,
+  P as o,
+  D as p,
+  K as q,
+  H as u
+};

package/dist/session-BrH8G7iJ.cjs

@@ -0,0 +1,31 @@
+"use strict";const m=require("./index-CfSF8LXa.cjs"),s=require("react/jsx-runtime"),L=require("react-dom"),a=require("react"),p=require("./x-KC8E4Gaj.cjs"),j=(e,t)=>new URL(`/assets/sdk/debug-ui/v1/${e}/${t}`,m.libConfig.assetStorageEndpoint).href,M=e=>e.replace(/\.[^.]+$/,"").replace(/[_-]+/g," ").replace(/\s+/g," ").trim().replace(/\b\w/g,t=>t.toUpperCase()),z=["person_fullbody.mp4","person_looking.mp4","person_shaking_head.mp4","person_thumbUp.mp4","two_people_smiling.mp4"],F=["person_fist_sign.jpg","person_fullbody.jpg","person_peace_sign.jpg","person_portrait.jpg","three_people_smiling.jpg","two_people_smiling.jpg"],T=(e,t)=>({id:`sdk-video-${t+1}`,kind:"video",label:M(e),url:j("videos",e)}),W=(e,t)=>({id:`sdk-image-${t+1}`,kind:"image",label:M(e),url:j("images",e)}),v=z.map(T),_=F.map(W),$=[...v,{id:"webcam",kind:"webcam",label:"Webcam"},..._];/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const N=[["path",{d:"M13.997 4a2 2 0 0 1 1.76 1.05l.486.9A2 2 0 0 0 18.003 7H20a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h1.997a2 2 0 0 0 1.759-1.048l.489-.904A2 2 0 0 1 10.004 4z",key:"18u6gg"}],["circle",{cx:"12",cy:"13",r:"3",key:"1vg3eu"}]],P=p.createLucideIcon("camera",N);/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const V=[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]],D=p.createLucideIcon("chevron-down",V);/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const X=[["circle",{cx:"9",cy:"12",r:"1",key:"1vctgf"}],["circle",{cx:"9",cy:"5",r:"1",key:"hp0tcf"}],["circle",{cx:"9",cy:"19",r:"1",key:"fkjjf6"}],["circle",{cx:"15",cy:"12",r:"1",key:"1tmaij"}],["circle",{cx:"15",cy:"5",r:"1",key:"19l28e"}],["circle",{cx:"15",cy:"19",r:"1",key:"f4zoj3"}]],U=p.createLucideIcon("grip-vertical",X);/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const A=[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",ry:"2",key:"1m3agn"}],["circle",{cx:"9",cy:"9",r:"2",key:"af1f0g"}],["path",{d:"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21",key:"1xmnt7"}]],K=p.createLucideIcon("image",A);/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const O=[["path",{d:"M4 5h16",key:"1tepv9"}],["path",{d:"M4 12h16",key:"1lakjw"}],["path",{d:"M4 19h16",key:"1djgab"}]],q=p.createLucideIcon("menu",O);/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const B=[["path",{d:"m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5",key:"ftymec"}],["rect",{x:"2",y:"6",width:"14",height:"12",rx:"2",key:"158x01"}]],H=p.createLucideIcon("video",B),G=e=>e==="webcam"?"📷 ":e==="image"?"🖼 ":"▶ ",Y={position:"fixed",zIndex:2e4,pointerEvents:"none"},R={pointerEvents:"auto",border:"1px solid rgba(255, 255, 255, 0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 12px 32px rgba(0, 0, 0, 0.28)",backdropFilter:"blur(20px) saturate(1.15)",WebkitBackdropFilter:"blur(20px) saturate(1.15)",color:"#f8fafc",display:"flex"},J={...R,width:34,height:34,borderRadius:17,alignItems:"center",justifyContent:"center",cursor:"pointer",transition:"transform 150ms ease"},Q={...R,flexDirection:"column",borderRadius:12,overflow:"hidden",padding:4,gap:4},Z={display:"flex",alignItems:"center",gap:3},ee={width:1,height:12,background:"rgba(255, 255, 255, 0.12)",margin:"0 3px"},te={display:"flex",width:16,height:24,alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148, 163, 184, 0.8)",flex:"0 0 auto"},w=(e=!1)=>({display:"flex",width:24,height:24,alignItems:"center",justifyContent:"center",borderRadius:8,border:`1px solid ${e?"rgba(255, 255, 255, 0.12)":"transparent"}`,background:e?"rgba(255, 255, 255, 0.08)":"transparent",color:e?"#f8fafc":"rgba(226, 232, 240, 0.72)",cursor:"pointer",flex:"0 0 auto",transition:"background 120ms ease, color 120ms ease"}),re={position:"relative",display:"flex",alignItems:"center"},ne={width:"100%",minWidth:140,height:24,borderRadius:8,border:"1px solid rgba(255, 255, 255, 0.10)",background:"rgba(15, 23, 42, 0.65)",color:"#f8fafc",fontSize:11,outline:"none",paddingLeft:7,paddingRight:20,appearance:"none",cursor:"pointer"},se={pointerEvents:"none",position:"absolute",right:5,top:0,bottom:0,display:"flex",alignItems:"center",color:"rgba(148, 163, 184, 0.9)"},ie={height:24,display:"flex",alignItems:"center",padding:"0 8px",borderRadius:8,border:"1px solid rgba(255, 255, 255, 0.08)",background:"rgba(255, 255, 255, 0.04)",color:"rgba(226, 232, 240, 0.72)",fontSize:11},S={width:14,height:14},ae=({value:e,onChange:t,sources:n,style:i})=>{const[c,d]=a.useState(!1),[g,h]=a.useState({x:16,y:16}),[u,f]=a.useState(e.kind),o=a.useRef(null),x=a.useMemo(()=>({webcam:n.filter(r=>r.kind==="webcam"),image:n.filter(r=>r.kind==="image"),video:n.filter(r=>r.kind==="video")}),[n]),b=x[u];a.useEffect(()=>{f(e.kind)},[e.kind]);const I=r=>{f(r);const l=x[r][0];l&&t(l)};a.useEffect(()=>{const r=y=>{o.current&&h({x:Math.max(8,y.clientX-o.current.x),y:Math.max(8,y.clientY-o.current.y)})},l=()=>{o.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",r),window.addEventListener("pointerup",l),()=>{window.removeEventListener("pointermove",r),window.removeEventListener("pointerup",l)}},[]);const k=r=>{const l=r.currentTarget.getBoundingClientRect();o.current={x:r.clientX-l.left,y:r.clientY-l.top},document.body.classList.add("select-none"),r.currentTarget.setPointerCapture(r.pointerId)},C=()=>{if(b.length===0){const r=u==="webcam"?"No camera source":u==="image"?"No image preview":"No video preview";return s.jsx("div",{style:ie,children:r})}return s.jsxs("div",{style:re,children:[s.jsx("select",{value:e.id,onChange:r=>{const l=n.find(y=>y.id===r.target.value);l&&t(l)},style:ne,children:b.map(r=>s.jsxs("option",{value:r.id,children:[G(u),r.label]},r.id))}),s.jsx("div",{style:se,children:s.jsx("span",{style:{width:10,height:10},children:s.jsx(D,{size:10,strokeWidth:1.8})})})]})};return typeof document>"u"?null:L.createPortal(s.jsx("div",{style:{...Y,left:g.x,top:g.y,...i},children:c?s.jsxs("div",{style:Q,children:[s.jsxs("div",{style:Z,children:[s.jsx("div",{onPointerDown:k,style:te,title:"Drag to move",children:s.jsx(U,{size:11,strokeWidth:2})}),s.jsx("button",{type:"button",onClick:()=>d(!1),style:w(!1),title:"Close Menu",children:s.jsx("span",{style:S,children:s.jsx(p.X,{size:14,strokeWidth:1.8})})}),s.jsx("div",{style:ee}),["webcam","image","video"].map(r=>s.jsx("button",{type:"button",onClick:()=>I(r),style:w(u===r),title:r.charAt(0).toUpperCase()+r.slice(1),children:s.jsx("span",{style:S,children:r==="webcam"?s.jsx(P,{size:14,strokeWidth:1.8}):r==="image"?s.jsx(K,{size:14,strokeWidth:1.8}):s.jsx(H,{size:14,strokeWidth:1.8})})},r))]}),C()]}):s.jsx("div",{style:J,onClick:()=>d(!0),onPointerDown:k,title:"Open Media Menu",children:s.jsx("span",{style:{width:16,height:16},children:s.jsx(q,{size:14,strokeWidth:1.8})})})}),document.body)},ce=async e=>{const t=new Image;t.crossOrigin="anonymous",t.src=e,await t.decode();const n=document.createElement("canvas");n.width=t.naturalWidth,n.height=t.naturalHeight;const i=n.getContext("2d");if(!i)throw new Error("Unable to create image media canvas");i.drawImage(t,0,0,n.width,n.height);const c=n.captureStream(30);return{stream:c,release:()=>{c.getTracks().forEach(d=>d.stop()),n.width=0,n.height=0}}},oe=1/30,le=e=>{const[t,n]=a.useState(null);return a.useEffect(()=>{if(!e){n(null);return}const i=()=>n({paused:e.paused,time:e.currentTime,duration:Number.isFinite(e.duration)?e.duration:0,rate:e.playbackRate});i();const c=["play","pause","timeupdate","seeked","ratechange","durationchange"];for(const d of c)e.addEventListener(d,i);return()=>{for(const d of c)e.removeEventListener(d,i)}},[e]),a.useMemo(()=>!e||!t?null:{...t,pause:()=>e.pause(),play:()=>{e.play().catch(()=>{})},restart:()=>{e.currentTime=0},step:(i=1)=>{e.pause();const c=Number.isFinite(e.duration)?e.duration:1/0;e.currentTime=Math.min(c,Math.max(0,e.currentTime+i*oe))},setRate:i=>{e.playbackRate=i}},[e,t])},de=async e=>{const t=document.createElement("video");t.src=e,t.loop=!0,t.muted=!0,t.playsInline=!0,t.crossOrigin="anonymous",await t.play();const n=t.captureStream();return{stream:n,video:t,release:()=>{n.getTracks().forEach(i=>i.stop()),t.pause(),t.removeAttribute("src"),t.load()}}},E=(e,t)=>{const{session:n}=m.useXRContext(),[i,c]=a.useState(null),d=JSON.stringify((t==null?void 0:t.pipeline)??null),g=a.useRef(t==null?void 0:t.pipeline);return g.current=t==null?void 0:t.pipeline,a.useEffect(()=>{let h=!1,u=null;return(async()=>{try{if(e.kind==="webcam")await n.setMediaSource({source:m.XRMediaSource.WEBCAM});else{if(!e.url)throw new Error(`Missing media URL for ${e.id}`);const o=e.kind==="image"?await ce(e.url):await de(e.url);if(u=o,h){o.release();return}c(o.video??null),await n.setMediaSource({source:m.XRMediaSource.STREAM,stream:o.stream,sourceKind:e.kind})}await n.registerXRPipeline(g.current??[{model:m.XRModel.FACE_TRACKER,options:{numFaces:(t==null?void 0:t.numFaces)??1}}]),await n.start()}catch(o){console.error("[MediaSourceSession] Error initializing XR session:",o)}})(),()=>{h=!0,u==null||u.release(),c(null)}},[e,t==null?void 0:t.numFaces,d,n]),le(i)},ue=E;exports.MediaSourceSwitcher=ae;exports.defaultMediaSources=$;exports.sdkImageMediaSources=_;exports.sdkVideoMediaSources=v;exports.useFaceTrackingMediaSourceSession=ue;exports.useMediaSourceSession=E;

package/dist/session-DgA_z6O1.js

@@ -0,0 +1,418 @@
+import { C as z, u as W, z as S, X as $ } from "./index-CIe7eCMH.js";
+import { jsx as a, jsxs as y } from "react/jsx-runtime";
+import { createPortal as F } from "react-dom";
+import { useState as g, useRef as _, useMemo as E, useEffect as f } from "react";
+import { c as u, X as T } from "./x-Co8jPhP0.js";
+const R = (e, t) => new URL(`/assets/sdk/debug-ui/v1/${e}/${t}`, z.assetStorageEndpoint).href, C = (e) => e.replace(/\.[^.]+$/, "").replace(/[_-]+/g, " ").replace(/\s+/g, " ").trim().replace(/\b\w/g, (t) => t.toUpperCase()), N = [
+  "person_fullbody.mp4",
+  "person_looking.mp4",
+  "person_shaking_head.mp4",
+  "person_thumbUp.mp4",
+  "two_people_smiling.mp4"
+], P = [
+  "person_fist_sign.jpg",
+  "person_fullbody.jpg",
+  "person_peace_sign.jpg",
+  "person_portrait.jpg",
+  "three_people_smiling.jpg",
+  "two_people_smiling.jpg"
+], V = (e, t) => ({
+  id: `sdk-video-${t + 1}`,
+  kind: "video",
+  label: C(e),
+  url: R("videos", e)
+}), X = (e, t) => ({
+  id: `sdk-image-${t + 1}`,
+  kind: "image",
+  label: C(e),
+  url: R("images", e)
+}), D = N.map(V), U = P.map(X), Se = [
+  ...D,
+  { id: "webcam", kind: "webcam", label: "Webcam" },
+  ...U
+];
+/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const A = [
+  [
+    "path",
+    {
+      d: "M13.997 4a2 2 0 0 1 1.76 1.05l.486.9A2 2 0 0 0 18.003 7H20a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h1.997a2 2 0 0 0 1.759-1.048l.489-.904A2 2 0 0 1 10.004 4z",
+      key: "18u6gg"
+    }
+  ],
+  ["circle", { cx: "12", cy: "13", r: "3", key: "1vg3eu" }]
+], K = u("camera", A);
+/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const O = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], B = u("chevron-down", O);
+/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const H = [
+  ["circle", { cx: "9", cy: "12", r: "1", key: "1vctgf" }],
+  ["circle", { cx: "9", cy: "5", r: "1", key: "hp0tcf" }],
+  ["circle", { cx: "9", cy: "19", r: "1", key: "fkjjf6" }],
+  ["circle", { cx: "15", cy: "12", r: "1", key: "1tmaij" }],
+  ["circle", { cx: "15", cy: "5", r: "1", key: "19l28e" }],
+  ["circle", { cx: "15", cy: "19", r: "1", key: "f4zoj3" }]
+], G = u("grip-vertical", H);
+/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Y = [
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2", key: "1m3agn" }],
+  ["circle", { cx: "9", cy: "9", r: "2", key: "af1f0g" }],
+  ["path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21", key: "1xmnt7" }]
+], q = u("image", Y);
+/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const J = [
+  ["path", { d: "M4 5h16", key: "1tepv9" }],
+  ["path", { d: "M4 12h16", key: "1lakjw" }],
+  ["path", { d: "M4 19h16", key: "1djgab" }]
+], Q = u("menu", J);
+/**
+ * @license lucide-react v1.17.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Z = [
+  [
+    "path",
+    {
+      d: "m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5",
+      key: "ftymec"
+    }
+  ],
+  ["rect", { x: "2", y: "6", width: "14", height: "12", rx: "2", key: "158x01" }]
+], ee = u("video", Z), te = (e) => e === "webcam" ? "📷 " : e === "image" ? "🖼 " : "▶ ", re = {
+  position: "fixed",
+  zIndex: 2e4,
+  pointerEvents: "none"
+}, I = {
+  pointerEvents: "auto",
+  border: "1px solid rgba(255, 255, 255, 0.12)",
+  background: "rgba(8, 15, 28, 0.58)",
+  boxShadow: "0 12px 32px rgba(0, 0, 0, 0.28)",
+  backdropFilter: "blur(20px) saturate(1.15)",
+  WebkitBackdropFilter: "blur(20px) saturate(1.15)",
+  color: "#f8fafc",
+  display: "flex"
+}, ne = {
+  ...I,
+  width: 34,
+  height: 34,
+  borderRadius: 17,
+  alignItems: "center",
+  justifyContent: "center",
+  cursor: "pointer",
+  transition: "transform 150ms ease"
+}, ae = {
+  ...I,
+  flexDirection: "column",
+  borderRadius: 12,
+  overflow: "hidden",
+  padding: 4,
+  gap: 4
+}, ie = {
+  display: "flex",
+  alignItems: "center",
+  gap: 3
+}, se = {
+  width: 1,
+  height: 12,
+  background: "rgba(255, 255, 255, 0.12)",
+  margin: "0 3px"
+}, oe = {
+  display: "flex",
+  width: 16,
+  height: 24,
+  alignItems: "center",
+  justifyContent: "center",
+  cursor: "grab",
+  color: "rgba(148, 163, 184, 0.8)",
+  flex: "0 0 auto"
+}, v = (e = !1) => ({
+  display: "flex",
+  width: 24,
+  height: 24,
+  alignItems: "center",
+  justifyContent: "center",
+  borderRadius: 8,
+  border: `1px solid ${e ? "rgba(255, 255, 255, 0.12)" : "transparent"}`,
+  background: e ? "rgba(255, 255, 255, 0.08)" : "transparent",
+  color: e ? "#f8fafc" : "rgba(226, 232, 240, 0.72)",
+  cursor: "pointer",
+  flex: "0 0 auto",
+  transition: "background 120ms ease, color 120ms ease"
+}), ce = {
+  position: "relative",
+  display: "flex",
+  alignItems: "center"
+}, le = {
+  width: "100%",
+  minWidth: 140,
+  height: 24,
+  borderRadius: 8,
+  border: "1px solid rgba(255, 255, 255, 0.10)",
+  background: "rgba(15, 23, 42, 0.65)",
+  color: "#f8fafc",
+  fontSize: 11,
+  outline: "none",
+  paddingLeft: 7,
+  paddingRight: 20,
+  appearance: "none",
+  cursor: "pointer"
+}, de = {
+  pointerEvents: "none",
+  position: "absolute",
+  right: 5,
+  top: 0,
+  bottom: 0,
+  display: "flex",
+  alignItems: "center",
+  color: "rgba(148, 163, 184, 0.9)"
+}, ue = {
+  height: 24,
+  display: "flex",
+  alignItems: "center",
+  padding: "0 8px",
+  borderRadius: 8,
+  border: "1px solid rgba(255, 255, 255, 0.08)",
+  background: "rgba(255, 255, 255, 0.04)",
+  color: "rgba(226, 232, 240, 0.72)",
+  fontSize: 11
+}, M = { width: 14, height: 14 }, ve = ({
+  value: e,
+  onChange: t,
+  sources: n,
+  style: i
+}) => {
+  const [s, l] = g(!1), [p, m] = g({ x: 16, y: 16 }), [d, b] = g(e.kind), o = _(null), w = E(
+    () => ({
+      webcam: n.filter((r) => r.kind === "webcam"),
+      image: n.filter((r) => r.kind === "image"),
+      video: n.filter((r) => r.kind === "video")
+    }),
+    [n]
+  ), k = w[d];
+  f(() => {
+    b(e.kind);
+  }, [e.kind]);
+  const j = (r) => {
+    b(r);
+    const c = w[r][0];
+    c && t(c);
+  };
+  f(() => {
+    const r = (h) => {
+      o.current && m({
+        x: Math.max(8, h.clientX - o.current.x),
+        y: Math.max(8, h.clientY - o.current.y)
+      });
+    }, c = () => {
+      o.current = null, document.body.classList.remove("select-none");
+    };
+    return window.addEventListener("pointermove", r), window.addEventListener("pointerup", c), () => {
+      window.removeEventListener("pointermove", r), window.removeEventListener("pointerup", c);
+    };
+  }, []);
+  const x = (r) => {
+    const c = r.currentTarget.getBoundingClientRect();
+    o.current = {
+      x: r.clientX - c.left,
+      y: r.clientY - c.top
+    }, document.body.classList.add("select-none"), r.currentTarget.setPointerCapture(r.pointerId);
+  }, L = () => k.length === 0 ? /* @__PURE__ */ a("div", { style: ue, children: d === "webcam" ? "No camera source" : d === "image" ? "No image preview" : "No video preview" }) : /* @__PURE__ */ y("div", { style: ce, children: [
+    /* @__PURE__ */ a(
+      "select",
+      {
+        value: e.id,
+        onChange: (r) => {
+          const c = n.find((h) => h.id === r.target.value);
+          c && t(c);
+        },
+        style: le,
+        children: k.map((r) => /* @__PURE__ */ y("option", { value: r.id, children: [
+          te(d),
+          r.label
+        ] }, r.id))
+      }
+    ),
+    /* @__PURE__ */ a("div", { style: de, children: /* @__PURE__ */ a("span", { style: { width: 10, height: 10 }, children: /* @__PURE__ */ a(B, { size: 10, strokeWidth: 1.8 }) }) })
+  ] });
+  return typeof document > "u" ? null : F(
+    /* @__PURE__ */ a("div", { style: { ...re, left: p.x, top: p.y, ...i }, children: s ? (
+      // --- Expanded State ---
+      /* @__PURE__ */ y("div", { style: ae, children: [
+        /* @__PURE__ */ y("div", { style: ie, children: [
+          /* @__PURE__ */ a("div", { onPointerDown: x, style: oe, title: "Drag to move", children: /* @__PURE__ */ a(G, { size: 11, strokeWidth: 2 }) }),
+          /* @__PURE__ */ a(
+            "button",
+            {
+              type: "button",
+              onClick: () => l(!1),
+              style: v(!1),
+              title: "Close Menu",
+              children: /* @__PURE__ */ a("span", { style: M, children: /* @__PURE__ */ a(T, { size: 14, strokeWidth: 1.8 }) })
+            }
+          ),
+          /* @__PURE__ */ a("div", { style: se }),
+          ["webcam", "image", "video"].map((r) => /* @__PURE__ */ a(
+            "button",
+            {
+              type: "button",
+              onClick: () => j(r),
+              style: v(d === r),
+              title: r.charAt(0).toUpperCase() + r.slice(1),
+              children: /* @__PURE__ */ a("span", { style: M, children: r === "webcam" ? /* @__PURE__ */ a(K, { size: 14, strokeWidth: 1.8 }) : r === "image" ? /* @__PURE__ */ a(q, { size: 14, strokeWidth: 1.8 }) : /* @__PURE__ */ a(ee, { size: 14, strokeWidth: 1.8 }) })
+            },
+            r
+          ))
+        ] }),
+        L()
+      ] })
+    ) : (
+      // --- Collapsed State (Minimal FAB) ---
+      /* @__PURE__ */ a(
+        "div",
+        {
+          style: ne,
+          onClick: () => l(!0),
+          onPointerDown: x,
+          title: "Open Media Menu",
+          children: /* @__PURE__ */ a("span", { style: { width: 16, height: 16 }, children: /* @__PURE__ */ a(Q, { size: 14, strokeWidth: 1.8 }) })
+        }
+      )
+    ) }),
+    document.body
+  );
+}, pe = async (e) => {
+  const t = new Image();
+  t.crossOrigin = "anonymous", t.src = e, await t.decode();
+  const n = document.createElement("canvas");
+  n.width = t.naturalWidth, n.height = t.naturalHeight;
+  const i = n.getContext("2d");
+  if (!i) throw new Error("Unable to create image media canvas");
+  i.drawImage(t, 0, 0, n.width, n.height);
+  const s = n.captureStream(30);
+  return {
+    stream: s,
+    release: () => {
+      s.getTracks().forEach((l) => l.stop()), n.width = 0, n.height = 0;
+    }
+  };
+}, ge = 1 / 30, me = (e) => {
+  const [t, n] = g(null);
+  return f(() => {
+    if (!e) {
+      n(null);
+      return;
+    }
+    const i = () => n({
+      paused: e.paused,
+      time: e.currentTime,
+      duration: Number.isFinite(e.duration) ? e.duration : 0,
+      rate: e.playbackRate
+    });
+    i();
+    const s = ["play", "pause", "timeupdate", "seeked", "ratechange", "durationchange"];
+    for (const l of s) e.addEventListener(l, i);
+    return () => {
+      for (const l of s) e.removeEventListener(l, i);
+    };
+  }, [e]), E(() => !e || !t ? null : {
+    ...t,
+    pause: () => e.pause(),
+    play: () => {
+      e.play().catch(() => {
+      });
+    },
+    restart: () => {
+      e.currentTime = 0;
+    },
+    step: (i = 1) => {
+      e.pause();
+      const s = Number.isFinite(e.duration) ? e.duration : 1 / 0;
+      e.currentTime = Math.min(s, Math.max(0, e.currentTime + i * ge));
+    },
+    setRate: (i) => {
+      e.playbackRate = i;
+    }
+  }, [e, t]);
+}, he = async (e) => {
+  const t = document.createElement("video");
+  t.src = e, t.loop = !0, t.muted = !0, t.playsInline = !0, t.crossOrigin = "anonymous", await t.play();
+  const n = t.captureStream();
+  return {
+    stream: n,
+    video: t,
+    // Stopping the stream's tracks does not stop the video: a looping sample
+    // left playing kept decoding in the background, and every switch added
+    // one more (the page got heavier with each change until a reload).
+    release: () => {
+      n.getTracks().forEach((i) => i.stop()), t.pause(), t.removeAttribute("src"), t.load();
+    }
+  };
+}, ye = (e, t) => {
+  const { session: n } = W(), [i, s] = g(null), l = JSON.stringify((t == null ? void 0 : t.pipeline) ?? null), p = _(t == null ? void 0 : t.pipeline);
+  return p.current = t == null ? void 0 : t.pipeline, f(() => {
+    let m = !1, d = null;
+    return (async () => {
+      try {
+        if (e.kind === "webcam")
+          await n.setMediaSource({ source: S.WEBCAM });
+        else {
+          if (!e.url) throw new Error(`Missing media URL for ${e.id}`);
+          const o = e.kind === "image" ? await pe(e.url) : await he(e.url);
+          if (d = o, m) {
+            o.release();
+            return;
+          }
+          s(o.video ?? null), await n.setMediaSource({
+            source: S.STREAM,
+            stream: o.stream,
+            sourceKind: e.kind
+          });
+        }
+        await n.registerXRPipeline(
+          p.current ?? [
+            { model: $.FACE_TRACKER, options: { numFaces: (t == null ? void 0 : t.numFaces) ?? 1 } }
+          ]
+        ), await n.start();
+      } catch (o) {
+        console.error("[MediaSourceSession] Error initializing XR session:", o);
+      }
+    })(), () => {
+      m = !0, d == null || d.release(), s(null);
+    };
+  }, [e, t == null ? void 0 : t.numFaces, l, n]), me(i);
+}, Me = ye;
+export {
+  ve as M,
+  D as a,
+  ye as b,
+  Se as d,
+  U as s,
+  Me as u
+};