@vincentt-xr/sdk 2.0.0-alpha.6 → 2.0.0-alpha.8

package/dist/low-level.js

@@ -1,24 +1,28 @@
-import { u as se, X as O } from "./index-I4eF5TKT.js";
-import { u as le } from "./index-B-s4YbWu.js";
-import { H as dt, a as ut } from "./index-B-s4YbWu.js";
-import { c as ce } from "./selectors-ByKNTXeA.js";
-import { u as mt, b as ft, e as pt, a as gt, d as bt } from "./selectors-ByKNTXeA.js";
-import { useEffect as M, useState as S, useRef as X, useCallback as de, useLayoutEffect as ue, useMemo as $, Children as he, isValidElement as me } from "react";
-import { c as fe } from "./getFaceInfo-B43Cwq4n.js";
-import { d as xt, e as vt } from "./getFaceInfo-B43Cwq4n.js";
-import { jsx as g, jsxs as k, Fragment as W } from "react/jsx-runtime";
-import { PerspectiveCamera as pe } from "@react-three/drei";
-import { S as Ct, g as St, c as Rt, d as It, u as Et } from "./index-uE3sKczj.js";
-import { u as ee } from "./useFaceResults-D62STzT1.js";
-import { h as Ft } from "./hasFullUnitUVBounds-BGvcFsQM.js";
-import { X as ge, a as be, b as we } from "./contexts-DvQI4PqI.js";
-import { B as zt, M as Xt, h as kt, i as At, T as Lt, c as Vt, j as Dt, k as Bt, g as Wt, e as _t, f as Ht, r as Pt, t as $t, d as qt, u as Ut } from "./contexts-DvQI4PqI.js";
-import * as L from "three";
+import { u as ie, X as D, a as he, z as $, m as ge, d as ye, A as we, s as be, g as ee } from "./index-CnGox6Xr.js";
+import { I as At, G as Lt, C as _t, J as Xt, f as Ot, V as zt, K as Dt, L as Pt, B as Vt, H as $t, M as Bt, N as Nt, O as Wt, P as Ht, Q as qt, W as Gt, R as Ut, T as jt, U as Kt, E as Qt } from "./index-CnGox6Xr.js";
+import { u as Se } from "./index-CsUdQ-pn.js";
+import { H as Jt, a as Zt } from "./index-CsUdQ-pn.js";
+import { a as ve } from "./selectors-C5G1PMYL.js";
+import { k as tr, j as rr, u as ar, c as nr, o as sr, f as ir, l as or, g as lr, m as cr, p as dr, e as ur, d as mr, b as fr, n as pr, i as hr, h as gr } from "./selectors-C5G1PMYL.js";
+import { useEffect as A, useState as M, useRef as _, useCallback as xe, useLayoutEffect as Re, useMemo as G, Children as Ce, isValidElement as Ee } from "react";
+import { e as Me } from "./getFaceInfo-BkZfaQs-.js";
+import { c as wr, b as br } from "./getFaceInfo-BkZfaQs-.js";
+import { jsx as b, jsxs as X, Fragment as N } from "react/jsx-runtime";
+import { PerspectiveCamera as ke } from "@react-three/drei";
+import { S as vr, g as xr, b as Rr, c as Cr, u as Er } from "./index-CHVbH0hz.js";
+import { u as oe } from "./measures-9dQPdw96.js";
+import { H as kr, O as Tr, P as Ir, h as Fr, a as Ar, c as Lr, f as _r, d as Xr, e as Or, g as zr, m as Dr, b as Pr, t as Vr, i as $r } from "./measures-9dQPdw96.js";
+import { h as Nr } from "./hasFullUnitUVBounds-BGvcFsQM.js";
+import { X as Te, a as Ie, b as Fe } from "./contexts-FzlnnMYD.js";
+import { B as Hr, M as qr, h as Gr, i as Ur, T as jr, c as Kr, j as Qr, k as Yr, g as Jr, e as Zr, f as ea, r as ta, t as ra, d as aa, u as na } from "./contexts-FzlnnMYD.js";
+import { c as ia, g as oa, s as la, a as ca } from "./detector-K8aej4MB.js";
+import { v as ua, j as ma, I as fa, M as pa, S as ha, m as ga, k as ya, w as wa, l as ba, c as Sa, n as va, q as xa, x as Ra, r as Ca, t as Ea, o as Ma, u as ka, p as Ta, s as Ia, b as Fa, a as Aa } from "./providers-C0Dlhh9Z.js";
+import * as z from "three";
 const B = ({
   children: e,
   config: t,
-  style: n
-}) => /* @__PURE__ */ g(
+  style: a
+}) => /* @__PURE__ */ b(
   "div",
   {
     "data-render-target": t.name,
@@ -30,83 +34,88 @@ const B = ({
       pointerEvents: t.pointerEvents ?? "none",
       zIndex: t.zIndex,
       opacity: t.hidden ? 0 : 1,
-      ...n
+      ...a
     },
     children: e
   }
-), q = ({
+), U = ({
   canvas: e,
   layout: t,
-  media: n,
+  media: a,
   mirrored: r,
-  filter: o
+  filter: n
 }) => {
-  const i = Math.round(t.destination.width), a = Math.round(t.destination.height);
-  e.width !== i && (e.width = i), e.height !== a && (e.height = a);
-  const s = e.getContext("2d");
-  s && (s.setTransform(1, 0, 0, 1, 0, 0), s.clearRect(0, 0, i, a), r && (s.translate(i, 0), s.scale(-1, 1)), o && (s.filter = o), s.drawImage(n, t.offsetX, t.offsetY, t.drawWidth, t.drawHeight), o && (s.filter = "none"), s.setTransform(1, 0, 0, 1, 0, 0));
-}, te = ({
+  const c = Math.round(t.destination.width), u = Math.round(t.destination.height);
+  e.width !== c && (e.width = c), e.height !== u && (e.height = u);
+  const d = e.getContext("2d");
+  d && (d.setTransform(1, 0, 0, 1, 0, 0), d.clearRect(0, 0, c, u), r && (d.translate(c, 0), d.scale(-1, 1)), n && (d.filter = n), d.drawImage(a, t.offsetX, t.offsetY, t.drawWidth, t.drawHeight), n && (d.filter = "none"), d.setTransform(1, 0, 0, 1, 0, 0));
+}, le = ({
   canvasRef: e,
   enabled: t = !0,
-  fps: n = 30,
+  fps: a = 30,
   imageRef: r,
-  layout: o,
-  mirrored: i,
-  sourceKind: a,
-  videoRef: s
+  layout: n,
+  mirrored: c,
+  sourceKind: u,
+  videoRef: d
 }) => {
-  M(() => {
+  A(() => {
     if (!t) {
-      const b = e.current, f = b == null ? void 0 : b.getContext("2d");
-      b && f && f.clearRect(0, 0, b.width, b.height);
+      const p = e.current, g = p == null ? void 0 : p.getContext("2d");
+      p && g && g.clearRect(0, 0, p.width, p.height);
       return;
     }
-    let l = 0, c = 0;
-    const d = n > 0 ? 1e3 / n : 0, h = (b) => {
-      if (l = requestAnimationFrame(h), d > 0 && b - c < d) return;
-      c = b;
-      const f = e.current;
-      if (!f || !o) return;
-      if (a === "image") {
-        const p = r.current;
-        if (!p || !p.complete || p.naturalWidth <= 0 || p.naturalHeight <= 0)
+    let i = 0, f = 0;
+    const h = a > 0 ? 1e3 / a : 0, s = (p) => {
+      if (i = requestAnimationFrame(s), h > 0 && p - f < h) return;
+      f = p;
+      const g = e.current;
+      if (!g || !n) return;
+      if (u === "image") {
+        const l = r.current;
+        if (!l || !l.complete || l.naturalWidth <= 0 || l.naturalHeight <= 0)
           return;
-        q({
-          canvas: f,
-          layout: o,
-          media: p,
-          mirrored: i
+        U({
+          canvas: g,
+          layout: n,
+          media: l,
+          mirrored: c
         });
         return;
       }
-      const w = s.current;
-      !w || w.readyState < 2 || w.videoWidth <= 0 || w.videoHeight <= 0 || q({
-        canvas: f,
-        layout: o,
-        media: w,
-        mirrored: i
+      const o = d.current;
+      !o || o.readyState < 2 || o.videoWidth <= 0 || o.videoHeight <= 0 || U({
+        canvas: g,
+        layout: n,
+        media: o,
+        mirrored: c
       });
     };
-    return l = requestAnimationFrame(h), () => {
-      cancelAnimationFrame(l);
+    return i = requestAnimationFrame(s), () => {
+      cancelAnimationFrame(i);
     };
-  }, [e, t, n, r, o, i, a, s]);
-}, xe = ({
+  }, [e, t, a, r, n, c, u, d]);
+}, Ae = ({
   canvasRef: e,
   imageRef: t,
-  layer: n,
+  layer: a,
   layout: r,
-  mirrored: o,
-  sourceKind: i,
-  videoRef: a
-}) => (te({
+  mirrored: n,
+  onCaptureTarget: c,
+  sourceKind: u,
+  videoRef: d
+}) => (le({
   canvasRef: e,
   imageRef: t,
   layout: r,
-  mirrored: o,
-  sourceKind: i,
-  videoRef: a
-}), /* @__PURE__ */ g(B, { config: n, children: /* @__PURE__ */ g(
+  mirrored: n,
+  sourceKind: u,
+  videoRef: d
+}), A(() => {
+  const i = e.current;
+  if (i)
+    return c == null || c(i), () => c == null ? void 0 : c(void 0);
+}, [e, c]), /* @__PURE__ */ b(B, { config: a, children: /* @__PURE__ */ b(
   "canvas",
   {
     ref: e,
@@ -119,84 +128,84 @@ const B = ({
       background: "#000"
     }
   }
-) })), tt = ({
+) })), St = ({
   canvasRef: e,
   controlInsetTop: t,
-  debugVisible: n,
+  debugVisible: a,
   fps: r = 15,
-  imageRef: o,
-  layer: i,
-  layout: a,
-  mirrored: s,
-  sourceKind: l,
-  videoRef: c,
-  viewportSize: d
+  imageRef: n,
+  layer: c,
+  layout: u,
+  mirrored: d,
+  sourceKind: i,
+  videoRef: f,
+  viewportSize: h
 }) => {
-  te({
+  le({
     canvasRef: e,
-    enabled: n,
+    enabled: a,
     fps: r,
-    imageRef: o,
-    layout: a,
-    mirrored: s,
-    sourceKind: l,
-    videoRef: c
+    imageRef: n,
+    layout: u,
+    mirrored: d,
+    sourceKind: i,
+    videoRef: f
   });
-  const h = Math.min(220, Math.max(120, d.width * 0.22)), b = d.width > 0 && d.height > 0 ? d.width / d.height : 1, f = Math.min(d.height - 24, Math.max(t ?? 16, 16));
-  return /* @__PURE__ */ g(B, { config: i, children: /* @__PURE__ */ g(
+  const s = Math.min(220, Math.max(120, h.width * 0.22)), p = h.width > 0 && h.height > 0 ? h.width / h.height : 1, g = Math.min(h.height - 24, Math.max(t ?? 16, 16));
+  return /* @__PURE__ */ b(B, { config: c, children: /* @__PURE__ */ b(
     "canvas",
     {
       ref: e,
       style: {
         position: "absolute",
         left: 16,
-        top: f,
-        width: n ? h : 1,
-        height: n ? "auto" : 1,
-        aspectRatio: `${b}`,
-        opacity: n ? 0.85 : 0,
+        top: g,
+        width: a ? s : 1,
+        height: a ? "auto" : 1,
+        aspectRatio: `${p}`,
+        opacity: a ? 0.85 : 0,
         borderRadius: 10,
-        border: n ? "1px solid rgba(255,255,255,0.16)" : "none",
+        border: a ? "1px solid rgba(255,255,255,0.16)" : "none",
         pointerEvents: "none",
         objectFit: "contain",
         background: "#000"
       }
     }
   ) });
-}, ve = {
+}, Le = {
   audio: !1,
   video: {
     facingMode: "user",
     frameRate: { ideal: 30, max: 60 }
   }
-}, ye = {
+}, _e = {
   name: "viewport-live",
   clearColor: "#000000",
   pointerEvents: "none",
   zIndex: 0
-}, Ce = {
+}, Xe = {
   name: "viewport-ui",
   clearColor: "transparent",
   pointerEvents: "auto",
   zIndex: 5
-}, Se = {
+}, Oe = {
   name: "viewport-scene",
   clearColor: "transparent",
   pointerEvents: "auto",
   zIndex: 1
-}, A = {
+}, O = {
   webcam: { icon: "◉", label: "Webcam" },
   image: { icon: "▣", label: "Images" },
   video: { icon: "▶", label: "Videos" }
-}, Re = ({
+}, ze = ({
   imageRef: e,
   selectedSource: t,
-  videoRef: n
-}) => /* @__PURE__ */ k(W, { children: [
-  /* @__PURE__ */ g(
+  videoRef: a
+}) => /* @__PURE__ */ X(N, { children: [
+  /* @__PURE__ */ b(
     "video",
     {
-      ref: n,
+      ref: a,
       style: {
         position: "absolute",
         width: 1,
@@ -206,7 +215,7 @@ const B = ({
       }
     }
   ),
-  /* @__PURE__ */ g(
+  /* @__PURE__ */ b(
     "img",
     {
       ref: e,
@@ -220,13 +229,13 @@ const B = ({
       }
     }
   )
-] }), Y = ({
+] }), te = ({
   dock: e,
   label: t,
-  onChange: n,
+  onChange: a,
   options: r,
-  value: o
-}) => /* @__PURE__ */ g(
+  value: n
+}) => /* @__PURE__ */ b(
   "div",
   {
     style: {
@@ -243,7 +252,7 @@ const B = ({
       boxShadow: "0 12px 30px rgba(0,0,0,0.18)",
       backdropFilter: "blur(10px)"
     },
-    children: /* @__PURE__ */ k(
+    children: /* @__PURE__ */ X(
       "label",
       {
         style: {
@@ -254,12 +263,12 @@ const B = ({
           fontWeight: 700
         },
         children: [
-          /* @__PURE__ */ g("span", { children: t }),
-          /* @__PURE__ */ g(
+          /* @__PURE__ */ b("span", { children: t }),
+          /* @__PURE__ */ b(
             "select",
             {
-              value: o,
-              onChange: (i) => n(i.target.value),
+              value: n,
+              onChange: (c) => a(c.target.value),
               style: {
                 minWidth: 180,
                 maxWidth: "calc(100vw - 52px)",
@@ -270,31 +279,31 @@ const B = ({
                 color: "#e5eefb",
                 padding: "0 10px"
               },
-              children: r.map((i) => /* @__PURE__ */ g("option", { value: i.id, style: { color: "#111827" }, children: i.label }, i.id))
+              children: r.map((c) => /* @__PURE__ */ b("option", { value: c.id, style: { color: "#111827" }, children: c.label }, c.id))
             }
           )
         ]
       }
     )
   }
-), Ie = ({
+), De = ({
   dock: e,
   imageOptions: t,
-  selectedImageId: n,
+  selectedImageId: a,
   selectedSource: r,
-  selectedVideoId: o,
-  setSelectedImageId: i,
-  setSelectedSource: a,
-  setSelectedVideoId: s,
-  showMediaControls: l,
-  videoOptions: c
+  selectedVideoId: n,
+  setSelectedImageId: c,
+  setSelectedSource: u,
+  setSelectedVideoId: d,
+  showMediaControls: i,
+  videoOptions: f
 }) => {
-  const [d, h] = S(!1), b = ["webcam", "image", "video"].filter((f) => f === "image" ? t.length > 0 : f === "video" ? c.length > 0 : !0);
-  return l ? d ? /* @__PURE__ */ g(
+  const [h, s] = M(!1), p = ["webcam", "image", "video"].filter((g) => g === "image" ? t.length > 0 : g === "video" ? f.length > 0 : !0);
+  return i ? h ? /* @__PURE__ */ b(
     "button",
     {
       type: "button",
-      onClick: () => h(!1),
+      onClick: () => s(!1),
       "aria-label": "Open media controls",
       title: "Open media controls",
       style: {
@@ -315,8 +324,8 @@ const B = ({
       },
       children: "≡"
     }
-  ) : /* @__PURE__ */ k(W, { children: [
-    /* @__PURE__ */ k(
+  ) : /* @__PURE__ */ X(N, { children: [
+    /* @__PURE__ */ X(
       "div",
       {
         style: {
@@ -331,7 +340,7 @@ const B = ({
           maxWidth: "calc(100vw - 32px)"
         },
         children: [
-          /* @__PURE__ */ g(
+          /* @__PURE__ */ b(
             "div",
             {
               style: {
@@ -346,15 +355,15 @@ const B = ({
                 backdropFilter: "blur(10px)",
                 overflowX: "auto"
               },
-              children: b.map((f) => {
-                const w = f === r;
-                return /* @__PURE__ */ k(
+              children: p.map((g) => {
+                const o = g === r;
+                return /* @__PURE__ */ X(
                   "button",
                   {
                     type: "button",
-                    onClick: () => a(f),
-                    "aria-pressed": w,
-                    title: A[f].label,
+                    onClick: () => u(g),
+                    "aria-pressed": o,
+                    title: O[g].label,
                     style: {
                       border: "none",
                       borderRadius: 999,
@@ -365,26 +374,26 @@ const B = ({
                       alignItems: "center",
                       justifyContent: "center",
                       gap: 8,
-                      background: w ? "rgba(56, 189, 248, 0.18)" : "rgba(255,255,255,0.04)",
-                      color: w ? "#e0f2fe" : "rgba(229,238,251,0.82)",
+                      background: o ? "rgba(56, 189, 248, 0.18)" : "rgba(255,255,255,0.04)",
+                      color: o ? "#e0f2fe" : "rgba(229,238,251,0.82)",
                       cursor: "pointer",
                       flex: "0 0 auto"
                     },
                     children: [
-                      /* @__PURE__ */ g("span", { style: { fontSize: 14, lineHeight: 1 }, children: A[f].icon }),
-                      /* @__PURE__ */ g("span", { style: { fontSize: 12, fontWeight: 700, letterSpacing: "0.01em" }, children: A[f].label })
+                      /* @__PURE__ */ b("span", { style: { fontSize: 14, lineHeight: 1 }, children: O[g].icon }),
+                      /* @__PURE__ */ b("span", { style: { fontSize: 12, fontWeight: 700, letterSpacing: "0.01em" }, children: O[g].label })
                     ]
                   },
-                  f
+                  g
                 );
               })
             }
           ),
-          /* @__PURE__ */ g(
+          /* @__PURE__ */ b(
             "button",
             {
               type: "button",
-              onClick: () => h(!0),
+              onClick: () => s(!0),
               "aria-label": "Close media controls",
               title: "Close media controls",
               style: {
@@ -405,627 +414,628 @@ const B = ({
         ]
       }
     ),
-    r === "image" && t.length > 0 && /* @__PURE__ */ g(
-      Y,
+    r === "image" && t.length > 0 && /* @__PURE__ */ b(
+      te,
       {
         dock: e,
         label: "Image Asset",
         options: t,
-        value: n,
-        onChange: i
+        value: a,
+        onChange: c
       }
     ),
-    r === "video" && c.length > 0 && /* @__PURE__ */ g(
-      Y,
+    r === "video" && f.length > 0 && /* @__PURE__ */ b(
+      te,
       {
         dock: e,
         label: "Video Asset",
-        options: c,
-        value: o,
-        onChange: s
+        options: f,
+        value: n,
+        onChange: d
       }
     )
   ] }) : null;
-}, Ee = ({
+}, Pe = ({
   containerRef: e,
   displayCanvasRef: t,
-  imageOptions: n,
+  imageOptions: a,
   imageRef: r,
-  layout: o,
-  managesOwnMedia: i,
-  mediaDock: a,
-  mode: s,
-  overlayContent: l,
-  renderOutputs: c,
-  sceneContent: d,
-  selectedImageId: h,
-  selectedSource: b,
-  selectedVideoId: f,
-  setSceneRenderOutputs: w,
-  setSelectedImageId: p,
+  layout: n,
+  managesOwnMedia: c,
+  mediaDock: u,
+  mode: d,
+  overlayContent: i,
+  renderOutputs: f,
+  sceneContent: h,
+  selectedImageId: s,
+  selectedSource: p,
+  selectedVideoId: g,
+  setSceneRenderOutputs: o,
+  setSelectedImageId: l,
   setSelectedSource: m,
-  setSelectedVideoId: y,
-  showMediaControls: F,
+  setSelectedVideoId: w,
+  showMediaControls: S,
   style: R,
-  videoOptions: v,
-  videoRef: I,
-  viewportSize: x,
-  mirrored: u
-}) => /* @__PURE__ */ k(
-  "div",
-  {
-    ref: e,
-    style: {
-      position: "fixed",
-      inset: 0,
-      overflow: "hidden",
-      background: "#000",
-      ...R
-    },
-    children: [
-      /* @__PURE__ */ g(Re, { imageRef: r, selectedSource: b, videoRef: I }),
-      s === "dom" && i && /* @__PURE__ */ g(
-        xe,
-        {
-          canvasRef: t,
-          imageRef: r,
-          videoRef: I,
-          layer: ye,
-          layout: o,
-          mirrored: u,
-          sourceKind: b === "image" ? "image" : "video"
-        }
-      ),
-      (s === "r3f" || s === "hybrid") && /* @__PURE__ */ g(B, { config: Se, children: /* @__PURE__ */ g(
-        ge,
-        {
-          onRenderOutputs: w,
-          renderOutputs: {
-            sceneColor: c.sceneColor || c.finalColor,
-            sceneDepth: c.sceneDepth
-          },
-          renderTargetSize: x,
-          style: { width: "100%", height: "100%" },
-          children: d
-        }
-      ) }),
-      /* @__PURE__ */ k(B, { config: Ce, children: [
-        i && /* @__PURE__ */ g(
-          Ie,
+  videoOptions: x,
+  videoRef: E,
+  viewportSize: v,
+  mirrored: y
+}) => {
+  const { session: k } = ie();
+  return /* @__PURE__ */ X(
+    "div",
+    {
+      ref: e,
+      style: {
+        position: "fixed",
+        inset: 0,
+        overflow: "hidden",
+        background: "#000",
+        ...R
+      },
+      children: [
+        /* @__PURE__ */ b(ze, { imageRef: r, selectedSource: p, videoRef: E }),
+        d === "dom" && c && /* @__PURE__ */ b(
+          Ae,
           {
-            dock: a,
-            imageOptions: n,
-            selectedImageId: h,
-            selectedSource: b,
-            selectedVideoId: f,
-            setSelectedImageId: p,
-            setSelectedSource: m,
-            setSelectedVideoId: y,
-            showMediaControls: F,
-            videoOptions: v
+            canvasRef: t,
+            imageRef: r,
+            videoRef: E,
+            layer: _e,
+            layout: n,
+            mirrored: y,
+            onCaptureTarget: k._setCaptureTarget,
+            sourceKind: p === "image" ? "image" : "video"
           }
         ),
-        l
-      ] })
-    ]
-  }
-), Te = 5, Fe = 1, Me = (e, t) => t, ze = "brightness(2.2) contrast(1.5) saturate(1.25)", Xe = ({
+        (d === "r3f" || d === "hybrid") && /* @__PURE__ */ b(B, { config: Oe, children: /* @__PURE__ */ b(
+          Te,
+          {
+            onRenderOutputs: o,
+            renderOutputs: {
+              sceneColor: f.sceneColor || f.finalColor,
+              sceneDepth: f.sceneDepth
+            },
+            renderTargetSize: v,
+            style: { width: "100%", height: "100%" },
+            children: h
+          }
+        ) }),
+        /* @__PURE__ */ X(B, { config: Xe, children: [
+          c && /* @__PURE__ */ b(
+            De,
+            {
+              dock: u,
+              imageOptions: a,
+              selectedImageId: s,
+              selectedSource: p,
+              selectedVideoId: g,
+              setSelectedImageId: l,
+              setSelectedSource: m,
+              setSelectedVideoId: w,
+              showMediaControls: S,
+              videoOptions: x
+            }
+          ),
+          i
+        ] })
+      ]
+    }
+  );
+}, Ve = 5, $e = 1, Be = (e, t) => t, Ne = "brightness(2.2) contrast(1.5) saturate(1.25)", We = ({
   enabled: e,
   displayMirrored: t,
-  imageRef: n,
+  imageRef: a,
   layout: r,
-  mode: o,
-  numFaces: i,
-  selectedSource: a,
-  sourceStream: s,
-  videoRef: l
+  mode: n,
+  numFaces: c,
+  selectedSource: u,
+  sourceStream: d,
+  videoRef: i
 }) => {
-  const { session: c } = se(), d = X(null), h = X(!1), b = X(document.createElement("canvas")), {
-    ready: f,
-    node: w,
-    error: p
-  } = le(O.FACE_TRACKER, {
-    numFaces: i ?? (o === "head-binding" ? Fe : Te)
-  }), [m, y] = S("idle"), [F, R] = S(null), v = e && f && !!w, I = ee({
-    node: v ? w : null,
-    enabled: v,
-    selectedSource: a,
-    onFrame: de(() => {
-      R(null), y("ready");
+  const { session: f } = ie(), h = _(null), s = _(!1), p = _(document.createElement("canvas")), {
+    ready: g,
+    node: o,
+    error: l
+  } = Se(D.FACE_TRACKER, {
+    numFaces: c ?? (n === "head-binding" ? $e : Ve)
+  }), [m, w] = M("idle"), [S, R] = M(null), x = e && g && !!o, E = oe({
+    node: x ? o : null,
+    enabled: x,
+    selectedSource: u,
+    onFrame: xe(() => {
+      R(null), w("ready");
     }, [])
   });
-  return M(() => {
+  return A(() => {
     if (!e || !r) return;
-    const x = () => {
-      const C = a === "image" ? n.current : l.current;
+    const v = () => {
+      const C = u === "image" ? a.current : i.current;
       if (C) {
         if (C instanceof HTMLImageElement) {
           if (!C.complete || C.naturalWidth <= 0 || C.naturalHeight <= 0) return;
         } else if (C.readyState < 2 || C.videoWidth <= 0 || C.videoHeight <= 0)
           return;
-        q({
-          canvas: b.current,
+        U({
+          canvas: p.current,
           layout: r,
           media: C,
           mirrored: t,
-          filter: a === "webcam" ? ze : void 0
+          filter: u === "webcam" ? Ne : void 0
         });
       }
     };
-    if (a === "image") {
-      x();
+    if (u === "image") {
+      v();
       return;
     }
-    let u = 0;
-    const E = () => {
-      u = requestAnimationFrame(E), x();
+    let y = 0;
+    const k = () => {
+      y = requestAnimationFrame(k), v();
     };
-    return u = requestAnimationFrame(E), () => cancelAnimationFrame(u);
-  }, [t, e, n, r, a, l]), M(() => {
-    var V;
+    return y = requestAnimationFrame(k), () => cancelAnimationFrame(y);
+  }, [t, e, a, r, u, i]), A(() => {
+    var P;
     if (!e) {
-      y("idle"), R(null), h.current = !1, d.current = null;
+      w("idle"), R(null), s.current = !1, h.current = null;
       return;
     }
     if (!r) {
-      y("initializing");
+      w("initializing");
       return;
     }
-    const x = (s == null ? void 0 : s.id) ?? (((V = l.current) == null ? void 0 : V.srcObject) instanceof MediaStream ? l.current.srcObject.id : "none"), E = a === "webcam" ? `webcam:${x}` : a;
-    d.current !== E && (h.current = !1, d.current = E);
+    const v = (d == null ? void 0 : d.id) ?? (((P = i.current) == null ? void 0 : P.srcObject) instanceof MediaStream ? i.current.srcObject.id : "none"), k = u === "webcam" ? `webcam:${v}` : u;
+    h.current !== k && (s.current = !1, h.current = k);
     let C = !1;
     return (async () => {
       try {
-        if (y("initializing"), h.current || (await c.setFrameSource({
-          canvas: b.current,
-          sourceKind: a
-        }), await c.start(), h.current = !0), C) return;
-        R(null), y("initializing");
-      } catch (z) {
+        w("initializing");
+        const F = !s.current;
+        if (F && await f.setFrameSource({
+          canvas: p.current,
+          sourceKind: u
+        }), await f._setRenderSize(
+          Math.round(r.destination.width),
+          Math.round(r.destination.height)
+        ), F && (await f.start(), s.current = !0), C) return;
+        R(null), w("initializing");
+      } catch (F) {
         if (C) return;
-        y("error"), R(z instanceof Error ? z.message : "Failed to initialize SDK face tracking");
+        w("error"), R(F instanceof Error ? F.message : "Failed to initialize SDK face tracking");
       }
     })(), () => {
       C = !0;
     };
-  }, [e, r, a, c, s, l]), M(() => {
-    !v && e && !p && y("initializing");
-  }, [v, e, p]), M(() => {
-    p && (y("error"), R(p.message));
-  }, [p]), M(() => () => {
-    h.current = !1, c.stop();
-  }, [c]), {
+  }, [e, r, u, f, d, i]), A(() => {
+    !x && e && !l && w("initializing");
+  }, [x, e, l]), A(() => {
+    l && (w("error"), R(l.message));
+  }, [l]), A(() => () => {
+    s.current = !1, f.stop();
+  }, [f]), {
     activeDelegate: "GPU",
-    faces: I,
+    faces: E,
     status: m,
-    error: F
+    error: S
   };
-}, ke = (e, t) => e === "auto" ? t === "webcam" ? "cover" : "contain" : e, Ae = ({
+}, He = (e, t) => e === "auto" ? t === "webcam" ? "cover" : "contain" : e, qe = ({
   imageOptions: e,
   initialImageId: t,
-  initialSource: n,
+  initialSource: a,
   initialVideoId: r,
-  source: o,
-  videoOptions: i
+  source: n,
+  videoOptions: c
 }) => {
-  var l, c, d, h;
-  const a = (o == null ? void 0 : o.kind) ?? n ?? "webcam";
+  var i, f, h, s;
+  const u = (n == null ? void 0 : n.kind) ?? a ?? "webcam";
   return {
-    selectedSource: a === "image" && e.length === 0 || a === "video" && i.length === 0 ? "webcam" : a,
-    selectedImageId: (o == null ? void 0 : o.kind) === "image" ? o.assetId ?? ((l = e[0]) == null ? void 0 : l.id) ?? "" : t ?? ((c = e[0]) == null ? void 0 : c.id) ?? "",
-    selectedVideoId: (o == null ? void 0 : o.kind) === "video" ? o.assetId ?? ((d = i[0]) == null ? void 0 : d.id) ?? "" : r ?? ((h = i[0]) == null ? void 0 : h.id) ?? ""
+    selectedSource: u === "image" && e.length === 0 || u === "video" && c.length === 0 ? "webcam" : u,
+    selectedImageId: (n == null ? void 0 : n.kind) === "image" ? n.assetId ?? ((i = e[0]) == null ? void 0 : i.id) ?? "" : t ?? ((f = e[0]) == null ? void 0 : f.id) ?? "",
+    selectedVideoId: (n == null ? void 0 : n.kind) === "video" ? n.assetId ?? ((h = c[0]) == null ? void 0 : h.id) ?? "" : r ?? ((s = c[0]) == null ? void 0 : s.id) ?? ""
   };
-}, Le = (e, t, n) => {
+}, Ge = (e, t, a) => {
   if (e.width <= 0 || e.height <= 0 || t.width <= 0 || t.height <= 0)
     return null;
-  const r = n === "contain" ? Math.min(t.width / e.width, t.height / e.height) : Math.max(t.width / e.width, t.height / e.height), o = e.width * r, i = e.height * r;
-  return {
-    source: e,
-    destination: t,
-    drawWidth: o,
-    drawHeight: i,
-    offsetX: (t.width - o) * 0.5,
-    offsetY: (t.height - i) * 0.5,
-    scale: r
-  };
-}, Ve = (e) => {
+  const r = he(e, t, a);
+  return r ? { source: e, destination: t, ...r } : null;
+}, Ue = (e) => {
   if (!e) return { width: 0, height: 0 };
   const t = e.getBoundingClientRect();
   return {
     width: t.width || e.clientWidth,
     height: t.height || e.clientHeight
   };
-}, De = (e) => {
-  const [t, n] = S({ width: 0, height: 0 });
-  return ue(() => {
+}, je = (e) => {
+  const [t, a] = M({ width: 0, height: 0 });
+  return Re(() => {
     const r = e.current;
     if (!r) return;
-    let o = 0;
-    const i = () => {
-      const c = Ve(r);
-      n(
-        (d) => d.width === c.width && d.height === c.height ? d : c
+    let n = 0;
+    const c = () => {
+      const f = Ue(r);
+      a(
+        (h) => h.width === f.width && h.height === f.height ? h : f
       );
-    }, a = () => {
-      i(), o && cancelAnimationFrame(o), o = requestAnimationFrame(i);
+    }, u = () => {
+      c(), n && cancelAnimationFrame(n), n = requestAnimationFrame(c);
     };
-    a();
-    const s = new ResizeObserver(a);
-    s.observe(r);
-    const l = window.visualViewport;
-    return window.addEventListener("resize", a), window.addEventListener("orientationchange", a), l == null || l.addEventListener("resize", a), l == null || l.addEventListener("scroll", a), () => {
-      o && cancelAnimationFrame(o), s.disconnect(), window.removeEventListener("resize", a), window.removeEventListener("orientationchange", a), l == null || l.removeEventListener("resize", a), l == null || l.removeEventListener("scroll", a);
+    u();
+    const d = new ResizeObserver(u);
+    d.observe(r);
+    const i = window.visualViewport;
+    return window.addEventListener("resize", u), window.addEventListener("orientationchange", u), i == null || i.addEventListener("resize", u), i == null || i.addEventListener("scroll", u), () => {
+      n && cancelAnimationFrame(n), d.disconnect(), window.removeEventListener("resize", u), window.removeEventListener("orientationchange", u), i == null || i.removeEventListener("resize", u), i == null || i.removeEventListener("scroll", u);
     };
   }, [e]), t;
-}, Be = ({
+}, Ke = ({
   enabled: e,
   selectedSource: t
 }) => {
-  const n = ce(O.FACE_TRACKER);
+  const a = ve(D.FACE_TRACKER);
   return {
-    faces: ee({ node: n, enabled: e, selectedSource: t }),
-    trackerStatus: n ? "ready" : "idle"
+    faces: oe({ node: a, enabled: e, selectedSource: t }),
+    trackerStatus: a ? "ready" : "idle"
   };
-}, J = (e) => {
+}, re = (e) => {
   e && (e.pause(), e.removeAttribute("src"), e.srcObject = null, e.load());
-}, Q = (e) => {
+}, ae = (e) => {
   e && e.removeAttribute("src");
-}, We = ({
+}, Qe = ({
   enabled: e,
   imageAsset: t,
-  selectedSource: n,
+  selectedSource: a,
   videoAsset: r
 }) => {
-  const o = X(null), i = X(null), [a, s] = S(null), [l, c] = S({ width: 0, height: 0 }), [d, h] = S("idle"), [b, f] = S(null);
-  return M(() => {
+  const n = _(null), c = _(null), [u, d] = M(null), [i, f] = M({ width: 0, height: 0 }), [h, s] = M("idle"), [p, g] = M(null);
+  return A(() => {
     if (!e) {
-      J(o.current), Q(i.current), s(null), c({ width: 0, height: 0 }), h("idle"), f(null);
+      re(n.current), ae(c.current), d(null), f({ width: 0, height: 0 }), s("idle"), g(null);
       return;
     }
-    let w = !1, p = null;
-    const m = (x, u) => {
-      w || (c({ width: x, height: u }), h("ready"), f(null));
-    }, y = () => {
-      J(o.current), Q(i.current), p == null || p.getTracks().forEach((x) => x.stop()), p = null, s(null);
-    }, F = async () => {
-      h("requesting");
-      const x = await navigator.mediaDevices.getUserMedia(ve);
-      if (w) {
-        x.getTracks().forEach((E) => E.stop());
+    let o = !1, l = null;
+    const m = (v, y) => {
+      o || (f({ width: v, height: y }), s("ready"), g(null));
+    }, w = () => {
+      re(n.current), ae(c.current), l == null || l.getTracks().forEach((v) => v.stop()), l = null, d(null);
+    }, S = async () => {
+      s("requesting");
+      const v = await navigator.mediaDevices.getUserMedia(Le);
+      if (o) {
+        v.getTracks().forEach((k) => k.stop());
         return;
       }
-      p = x, s(x);
-      const u = o.current;
-      u && (u.srcObject = x, u.muted = !0, u.playsInline = !0, u.autoplay = !0, await u.play(), m(u.videoWidth, u.videoHeight));
-    }, R = async (x) => {
-      h("requesting"), s(null);
-      const u = o.current;
-      u && (u.src = x, u.muted = !0, u.loop = !0, u.playsInline = !0, u.autoplay = !0, u.crossOrigin = "anonymous", await u.play(), m(u.videoWidth, u.videoHeight));
-    }, v = async (x) => {
-      h("requesting"), s(null);
-      const u = i.current;
-      u && (await new Promise((E, C) => {
-        u.onload = () => E(), u.onerror = () => C(new Error("Unable to load image")), u.src = x;
-      }), m(u.naturalWidth, u.naturalHeight));
+      l = v, d(v);
+      const y = n.current;
+      y && (y.srcObject = v, y.muted = !0, y.playsInline = !0, y.autoplay = !0, await y.play(), m(y.videoWidth, y.videoHeight));
+    }, R = async (v) => {
+      s("requesting"), d(null);
+      const y = n.current;
+      y && (y.src = v, y.muted = !0, y.loop = !0, y.playsInline = !0, y.autoplay = !0, y.crossOrigin = "anonymous", await y.play(), m(y.videoWidth, y.videoHeight));
+    }, x = async (v) => {
+      s("requesting"), d(null);
+      const y = c.current;
+      y && (await new Promise((k, C) => {
+        y.onload = () => k(), y.onerror = () => C(new Error("Unable to load image")), y.src = v;
+      }), m(y.naturalWidth, y.naturalHeight));
     };
-    return y(), (async () => {
+    return w(), (async () => {
       try {
-        if (n === "webcam") {
-          await F();
+        if (a === "webcam") {
+          await S();
           return;
         }
-        if (n === "video") {
+        if (a === "video") {
           if (!(r != null && r.src)) throw new Error("Missing video source");
           await R(r.src);
           return;
         }
         if (!(t != null && t.src)) throw new Error("Missing image source");
-        await v(t.src);
-      } catch (x) {
-        if (w) return;
-        h("error"), f(x instanceof Error ? x.message : `Unable to initialize ${n}`);
+        await x(t.src);
+      } catch (v) {
+        if (o) return;
+        s("error"), g(v instanceof Error ? v.message : `Unable to initialize ${a}`);
       }
     })(), () => {
-      w = !0, y();
+      o = !0, w();
     };
-  }, [e, t, n, r]), {
-    videoRef: o,
-    imageRef: i,
-    stream: a,
-    mediaSize: l,
-    status: d,
-    error: b
+  }, [e, t, a, r]), {
+    videoRef: n,
+    imageRef: c,
+    stream: u,
+    mediaSize: i,
+    status: h,
+    error: p
   };
-}, _e = ({
+}, Ye = ({
   enabled: e,
   imageRef: t,
-  selectedSource: n,
+  selectedSource: a,
   status: r,
-  videoRef: o
+  videoRef: n
 }) => {
-  const [i, a] = S(null);
-  return M(() => {
+  const [c, u] = M(null);
+  return A(() => {
     if (!e || r !== "ready") {
-      a((c) => (c == null || c.dispose(), null));
+      u((f) => (f == null || f.dispose(), null));
       return;
     }
-    const s = n === "image" ? t.current : o.current;
-    if (!s) return;
-    const l = n === "image" ? new L.Texture(s) : new L.VideoTexture(s);
-    return l.colorSpace = L.SRGBColorSpace, l.minFilter = L.LinearFilter, l.magFilter = L.LinearFilter, l.generateMipmaps = !1, l.needsUpdate = !0, a((c) => (c == null || c.dispose(), l)), () => {
-      l.dispose();
+    const d = a === "image" ? t.current : n.current;
+    if (!d) return;
+    const i = a === "image" ? new z.Texture(d) : new z.VideoTexture(d);
+    return i.colorSpace = z.SRGBColorSpace, i.minFilter = z.LinearFilter, i.magFilter = z.LinearFilter, i.generateMipmaps = !1, i.needsUpdate = !0, u((f) => (f == null || f.dispose(), i)), () => {
+      i.dispose();
     };
-  }, [e, t, n, r, o]), i;
-}, He = ({
+  }, [e, t, a, r, n]), c;
+}, Je = ({
   externalTracker: e,
   imageOptions: t,
-  layout: n,
+  layout: a,
   managesOwnMedia: r,
-  mediaError: o,
-  mediaFitMode: i,
-  mediaSize: a,
-  mediaStatus: s,
-  mirrored: l,
-  selectedImage: c,
-  selectedImageId: d,
-  selectedSource: h,
-  selectedVideo: b,
-  selectedVideoId: f,
-  setMirrored: w,
-  setSelectedImageId: p,
+  mediaError: n,
+  mediaFitMode: c,
+  mediaSize: u,
+  mediaStatus: d,
+  mirrored: i,
+  selectedImage: f,
+  selectedImageId: h,
+  selectedSource: s,
+  selectedVideo: p,
+  selectedVideoId: g,
+  setMirrored: o,
+  setSelectedImageId: l,
   setSelectedSource: m,
-  setSelectedVideoId: y,
-  setShowMediaControls: F,
+  setSelectedVideoId: w,
+  setShowMediaControls: S,
   showMediaControls: R,
-  tracker: v,
-  videoOptions: I,
-  viewportSize: x
+  tracker: x,
+  videoOptions: E,
+  viewportSize: v
 }) => {
-  const u = h === "image" ? `${A.image.label}: ${(c == null ? void 0 : c.label) ?? ""}` : h === "video" ? `${A.video.label}: ${(b == null ? void 0 : b.label) ?? ""}` : A.webcam.label;
+  const y = s === "image" ? `${O.image.label}: ${(f == null ? void 0 : f.label) ?? ""}` : s === "video" ? `${O.video.label}: ${(p == null ? void 0 : p.label) ?? ""}` : O.webcam.label;
   return {
-    activeDelegate: r ? v.activeDelegate : null,
-    faces: r ? v.faces : e.faces,
+    activeDelegate: r ? x.activeDelegate : null,
+    faces: r ? x.faces : e.faces,
     imageOptions: t,
-    layout: n,
-    mediaError: o,
-    mediaFitMode: i,
-    mediaLabel: u,
-    mediaStatus: s,
-    mirrored: l,
-    selectedImageId: d,
-    selectedSource: h,
-    selectedVideoId: f,
-    setMirrored: w,
-    setSelectedImageId: p,
+    layout: a,
+    mediaError: n,
+    mediaFitMode: c,
+    mediaLabel: y,
+    mediaStatus: d,
+    mirrored: i,
+    selectedImageId: h,
+    selectedSource: s,
+    selectedVideoId: g,
+    setMirrored: o,
+    setSelectedImageId: l,
     setSelectedSource: m,
-    setSelectedVideoId: y,
-    setShowMediaControls: F,
+    setSelectedVideoId: w,
+    setShowMediaControls: S,
     showMediaControls: R,
-    trackerError: r ? v.error : null,
-    trackerStatus: r ? v.status : e.trackerStatus,
-    videoOptions: I,
-    viewportSize: x,
-    mediaSize: a
+    trackerError: r ? x.error : null,
+    trackerStatus: r ? x.status : e.trackerStatus,
+    videoOptions: E,
+    viewportSize: v,
+    mediaSize: u
   };
-}, Pe = ({
+}, Ze = ({
   mediaTexture: e,
   previewMode: t,
-  renderOutputs: n,
+  renderOutputs: a,
   sceneRenderOutputs: r
-}) => $(
+}) => G(
   () => ({
-    requested: n,
+    requested: a,
     previewMode: t,
     mediaColorTexture: e,
     sceneColorTexture: r.sceneColorTexture,
-    finalColorTexture: n.finalColor ? r.sceneColorTexture : null,
+    finalColorTexture: a.finalColor ? r.sceneColorTexture : null,
     sceneDepthTexture: r.sceneDepthTexture,
     estimatedDepthTexture: null,
     available: {
       mediaColor: e !== null,
       sceneColor: r.sceneColorTexture !== null,
-      finalColor: !!(n.finalColor && r.sceneColorTexture),
+      finalColor: !!(a.finalColor && r.sceneColorTexture),
       sceneDepth: r.sceneDepthTexture !== null,
       estimatedDepth: !1
     }
   }),
-  [e, t, n, r]
-), $e = ({
+  [e, t, a, r]
+), et = ({
   fitMode: e,
   imageOptions: t,
-  initialImageId: n,
+  initialImageId: a,
   initialMirrored: r,
-  initialSource: o,
-  initialVideoId: i,
-  mediaStrategy: a,
-  previewMode: s,
-  renderOutputs: l,
-  showMediaControlsByDefault: c,
-  source: d,
-  videoOptions: h
+  initialSource: n,
+  initialVideoId: c,
+  mediaStrategy: u,
+  previewMode: d,
+  renderOutputs: i,
+  showMediaControlsByDefault: f,
+  source: h,
+  videoOptions: s
 }) => {
-  const b = X(null), f = X(null), w = De(b), p = $(
-    () => Ae({
+  const p = _(null), g = _(null), o = je(p), l = G(
+    () => qe({
       imageOptions: t,
-      initialImageId: n,
-      initialSource: o,
-      initialVideoId: i,
-      source: d,
-      videoOptions: h
+      initialImageId: a,
+      initialSource: n,
+      initialVideoId: c,
+      source: h,
+      videoOptions: s
     }),
-    [t, n, o, i, d, h]
-  ), [m, y] = S(r), [F, R] = S(c), [v, I] = S(
-    p.selectedSource
-  ), [x, u] = S(p.selectedImageId), [E, C] = S(p.selectedVideoId), [j, V] = S({
+    [t, a, n, c, h, s]
+  ), [m, w] = M(r), [S, R] = M(f), [x, E] = M(
+    l.selectedSource
+  ), [v, y] = M(l.selectedImageId), [k, C] = M(l.selectedVideoId), [Y, P] = M({
     sceneColorTexture: null,
     sceneDepthTexture: null
-  }), z = a === "internal";
-  M(() => {
-    d && (I(p.selectedSource), u(p.selectedImageId), C(p.selectedVideoId));
-  }, [p, d]);
-  const K = t.find((P) => P.id === x) ?? t[0], G = h.find((P) => P.id === E) ?? h[0], T = We({
-    enabled: z,
-    imageAsset: K,
-    selectedSource: v,
-    videoAsset: G
-  }), _ = ke(e, v), D = $(
-    () => Le(T.mediaSize, w, _),
-    [T.mediaSize, _, w]
-  ), re = _e({
-    enabled: !!(l.mediaColor || l.finalColor),
+  }), F = u === "internal";
+  A(() => {
+    h && (E(l.selectedSource), y(l.selectedImageId), C(l.selectedVideoId));
+  }, [l, h]);
+  const J = t.find((q) => q.id === v) ?? t[0], Z = s.find((q) => q.id === k) ?? s[0], T = Qe({
+    enabled: F,
+    imageAsset: J,
+    selectedSource: x,
+    videoAsset: Z
+  }), W = He(e, x), V = G(
+    () => Ge(T.mediaSize, o, W),
+    [T.mediaSize, W, o]
+  ), de = Ye({
+    enabled: !!(i.mediaColor || i.finalColor),
     imageRef: T.imageRef,
-    selectedSource: v,
+    selectedSource: x,
     status: T.status,
     videoRef: T.videoRef
-  }), H = Me(v, m), ne = Xe({
+  }), H = Be(x, m), ue = We({
     displayMirrored: H,
-    enabled: z && T.status === "ready" && D !== null,
+    enabled: F && T.status === "ready" && V !== null,
     imageRef: T.imageRef,
-    layout: D,
-    selectedSource: v,
+    layout: V,
+    selectedSource: x,
     sourceStream: T.stream,
     videoRef: T.videoRef
-  }), oe = Be({
-    enabled: !z,
-    selectedSource: v
-  }), ie = He({
-    externalTracker: oe,
+  }), me = Ke({
+    enabled: !F,
+    selectedSource: x
+  }), fe = Je({
+    externalTracker: me,
     imageOptions: t,
-    layout: D,
-    managesOwnMedia: z,
+    layout: V,
+    managesOwnMedia: F,
     mediaError: T.error,
-    mediaFitMode: _,
+    mediaFitMode: W,
     mediaSize: T.mediaSize,
     mediaStatus: T.status,
     mirrored: H,
-    selectedImage: K,
-    selectedImageId: x,
-    selectedSource: v,
-    selectedVideo: G,
-    selectedVideoId: E,
-    setMirrored: y,
-    setSelectedImageId: u,
-    setSelectedSource: I,
+    selectedImage: J,
+    selectedImageId: v,
+    selectedSource: x,
+    selectedVideo: Z,
+    selectedVideoId: k,
+    setMirrored: w,
+    setSelectedImageId: y,
+    setSelectedSource: E,
     setSelectedVideoId: C,
     setShowMediaControls: R,
-    showMediaControls: F,
-    tracker: ne,
-    videoOptions: h,
-    viewportSize: w
-  }), ae = Pe({
-    mediaTexture: re,
-    previewMode: s,
-    renderOutputs: l,
-    sceneRenderOutputs: j
+    showMediaControls: S,
+    tracker: ue,
+    videoOptions: s,
+    viewportSize: o
+  }), pe = Ze({
+    mediaTexture: de,
+    previewMode: d,
+    renderOutputs: i,
+    sceneRenderOutputs: Y
   });
   return {
-    containerRef: b,
-    displayCanvasRef: f,
+    containerRef: p,
+    displayCanvasRef: g,
     displayMirrored: H,
-    layout: D,
-    managesOwnMedia: z,
+    layout: V,
+    managesOwnMedia: F,
     media: T,
-    renderOutputState: ae,
-    renderState: ie,
-    selectedImageId: x,
-    selectedSource: v,
-    selectedVideoId: E,
-    setSceneRenderOutputs: V,
-    setSelectedImageId: u,
-    setSelectedSource: I,
+    renderOutputState: pe,
+    renderState: fe,
+    selectedImageId: v,
+    selectedSource: x,
+    selectedVideoId: k,
+    setSceneRenderOutputs: P,
+    setSelectedImageId: y,
+    setSelectedSource: E,
     setSelectedVideoId: C,
-    showMediaControls: F,
-    viewportSize: w
+    showMediaControls: S,
+    viewportSize: o
   };
-}, U = ({ children: e }) => /* @__PURE__ */ g(W, { children: e });
-U.displayName = "XRViewport.Scene";
-const N = ({ children: e }) => /* @__PURE__ */ g(W, { children: e });
-N.displayName = "XRViewport.Overlay";
-const qe = (e, t) => {
+}, K = ({ children: e }) => /* @__PURE__ */ b(N, { children: e });
+K.displayName = "XRViewport.Scene";
+const Q = ({ children: e }) => /* @__PURE__ */ b(N, { children: e });
+Q.displayName = "XRViewport.Overlay";
+const tt = (e, t) => {
   if (e === "dom")
     return {
       sceneContent: null,
       overlayContent: t
     };
-  let n = null, r = null;
-  const o = [];
-  return he.forEach(t, (i) => {
-    var s;
-    if (!me(i)) {
-      i != null && o.push(i);
+  let a = null, r = null;
+  const n = [];
+  return Ce.forEach(t, (c) => {
+    var d;
+    if (!Ee(c)) {
+      c != null && n.push(c);
       return;
     }
-    const a = (s = i.type) == null ? void 0 : s.displayName;
-    if (a === U.displayName) {
-      n = i.props.children;
+    const u = (d = c.type) == null ? void 0 : d.displayName;
+    if (u === K.displayName) {
+      a = c.props.children;
       return;
     }
-    if (a === N.displayName) {
-      r = i.props.children;
+    if (u === Q.displayName) {
+      r = c.props.children;
       return;
     }
-    o.push(i);
-  }), !r && o.length > 0 && (r = o), {
-    sceneContent: n,
+    n.push(c);
+  }), !r && n.length > 0 && (r = n), {
+    sceneContent: a,
     overlayContent: r
   };
-}, Z = (e, t) => typeof e == "function" ? e(t) : e;
-function Ue(e) {
-  return e.Scene = U, e.Overlay = N, e;
+}, ne = (e, t) => typeof e == "function" ? e(t) : e;
+function rt(e) {
+  return e.Scene = K, e.Overlay = Q, e;
 }
-const rt = Ue(({
+const vt = rt(({
   children: e,
   fitMode: t = "auto",
-  imageOptions: n = [],
+  imageOptions: a = [],
   initialImageId: r,
-  initialMirrored: o = !0,
-  initialSource: i = "webcam",
-  initialVideoId: a,
-  mediaStrategy: s = "internal",
-  mediaDock: l = "bottom-left",
-  mode: c = "dom",
-  previewMode: d = "finalColor",
-  renderOutputs: h = {},
-  showMediaControlsByDefault: b = !0,
-  source: f,
-  style: w,
-  videoOptions: p = []
+  initialMirrored: n = !0,
+  initialSource: c = "webcam",
+  initialVideoId: u,
+  mediaStrategy: d = "internal",
+  mediaDock: i = "bottom-left",
+  mode: f = "dom",
+  previewMode: h = "finalColor",
+  renderOutputs: s = {},
+  showMediaControlsByDefault: p = !0,
+  source: g,
+  style: o,
+  videoOptions: l = []
 }) => {
-  const m = $e({
+  const m = et({
     fitMode: t,
-    imageOptions: n,
+    imageOptions: a,
     initialImageId: r,
-    initialMirrored: o,
-    initialSource: i,
-    initialVideoId: a,
-    mediaStrategy: s,
-    previewMode: d,
-    renderOutputs: h,
-    showMediaControlsByDefault: b,
-    source: f,
-    videoOptions: p
-  }), y = typeof e == "function" ? e(m.renderState) : e, { sceneContent: F, overlayContent: R } = qe(c, y), v = Z(
-    F,
+    initialMirrored: n,
+    initialSource: c,
+    initialVideoId: u,
+    mediaStrategy: d,
+    previewMode: h,
+    renderOutputs: s,
+    showMediaControlsByDefault: p,
+    source: g,
+    videoOptions: l
+  }), w = typeof e == "function" ? e(m.renderState) : e, { sceneContent: S, overlayContent: R } = tt(f, w), x = ne(
+    S,
     m.renderState
-  ), I = Z(
+  ), E = ne(
     R,
     m.renderState
   );
-  return /* @__PURE__ */ g(be.Provider, { value: m.renderState, children: /* @__PURE__ */ g(we.Provider, { value: m.renderOutputState, children: /* @__PURE__ */ g(
-    Ee,
+  return /* @__PURE__ */ b(Ie.Provider, { value: m.renderState, children: /* @__PURE__ */ b(Fe.Provider, { value: m.renderOutputState, children: /* @__PURE__ */ b(
+    Pe,
     {
       containerRef: m.containerRef,
       displayCanvasRef: m.displayCanvasRef,
-      imageOptions: n,
+      imageOptions: a,
       imageRef: m.media.imageRef,
       layout: m.layout,
       managesOwnMedia: m.managesOwnMedia,
-      mediaDock: l,
+      mediaDock: i,
       mirrored: m.displayMirrored,
-      mode: c,
-      overlayContent: I,
-      renderOutputs: h,
-      sceneContent: v,
+      mode: f,
+      overlayContent: E,
+      renderOutputs: s,
+      sceneContent: x,
       selectedImageId: m.selectedImageId,
       selectedSource: m.selectedSource,
       selectedVideoId: m.selectedVideoId,
@@ -1034,13 +1044,13 @@ const rt = Ue(({
       setSelectedSource: m.setSelectedSource,
       setSelectedVideoId: m.setSelectedVideoId,
       showMediaControls: m.showMediaControls,
-      style: w,
-      videoOptions: p,
+      style: o,
+      videoOptions: l,
       videoRef: m.media.videoRef,
       viewportSize: m.viewportSize
     }
   ) }) });
-}), Ne = {
+}), at = {
   position: "absolute",
   top: -28,
   left: 0,
@@ -1051,13 +1061,13 @@ const rt = Ue(({
   fontWeight: 700,
   padding: "4px 8px",
   whiteSpace: "nowrap"
-}, nt = ({
+}, xt = ({
   boundingBox: e,
   label: t = "face bounding box",
-  color: n = "#22c55e",
+  color: a = "#22c55e",
   style: r,
-  labelStyle: o
-}) => /* @__PURE__ */ g(
+  labelStyle: n
+}) => /* @__PURE__ */ b(
   "div",
   {
     style: {
@@ -1066,43 +1076,416 @@ const rt = Ue(({
       top: `${e.top * 100}%`,
       width: `${e.width * 100}%`,
       height: `${e.height * 100}%`,
-      border: `3px solid ${n}`,
+      border: `3px solid ${a}`,
       boxSizing: "border-box",
       pointerEvents: "none",
       zIndex: 20,
       ...r
     },
-    children: t !== null && /* @__PURE__ */ g("div", { style: { ...Ne, ...o }, children: t })
+    children: t !== null && /* @__PURE__ */ b("div", { style: { ...at, ...n }, children: t })
+  }
+), j = [
+  {
+    id: "capabilities",
+    title: "Capability report",
+    steps: "Run detectXRCapabilities with model probes.",
+    expect: "Rendering supported (WebGL, OffscreenCanvas, WebAssembly); camera not unsupported; model assets reachable.",
+    mode: "automated",
+    layer: "capability"
+  },
+  {
+    id: "session-start",
+    title: "Session binds and starts",
+    steps: "setMediaSource (webcam or the supplied stream) and start().",
+    expect: "Lifecycle reaches running within the timeout; feed frames advance.",
+    mode: "automated",
+    layer: "lifecycle"
+  },
+  {
+    id: "model-ready",
+    title: "Tracker models initialize",
+    steps: "Acquire each requested model and wait for ready.",
+    expect: "Every model reaches ready; none errors.",
+    mode: "automated",
+    layer: "model"
+  },
+  {
+    id: "model-detects",
+    title: "Trackers run inference",
+    steps: "Sample diagnostics while running.",
+    expect: "Each ready model reports inferences > 0 (detection itself needs a subject in frame).",
+    mode: "automated",
+    layer: "model"
+  },
+  {
+    id: "pause-resume",
+    title: "Pause and resume",
+    steps: "session.pause(), then resume().",
+    expect: "Lifecycle paused then running; feed resumes.",
+    mode: "automated",
+    layer: "lifecycle"
+  },
+  {
+    id: "stop-start",
+    title: "Stop and rebind",
+    steps: "session.stop(), then setMediaSource + start() again.",
+    expect: "Lifecycle stopped then running on the same source.",
+    mode: "automated",
+    layer: "lifecycle"
+  },
+  {
+    id: "performance",
+    title: "Performance sample",
+    steps: "Measure frame rate and tracker inference over the window.",
+    expect: "Frame rate ≥ 20 fps and total inference ≤ 50 ms while running.",
+    mode: "automated",
+    layer: "performance"
+  }
+], nt = [
+  {
+    id: "permission-prompt",
+    title: "First-visit permission prompt",
+    steps: "Open the app in a fresh profile; tap Allow on the prompt.",
+    expect: "Camera starts; no second prompt on reload.",
+    mode: "manual",
+    layer: "capability"
+  },
+  {
+    id: "permission-blocked",
+    title: "Blocked camera recovers",
+    steps: "Block the camera in site settings, reload, then allow it from the address bar.",
+    expect: "Gate shows blocked with instructions; allowing flips it without a reload.",
+    mode: "manual",
+    layer: "capability"
+  },
+  {
+    id: "rear-camera",
+    title: "Rear camera",
+    steps: "Switch front → rear on /camera-switching.",
+    expect: "Rear feed is straight (text readable); tracking stays aligned.",
+    mode: "manual",
+    layer: "lifecycle"
+  },
+  {
+    id: "orientation",
+    title: "Rotate the device",
+    steps: "Rotate portrait ↔ landscape while tracking a face.",
+    expect: "Anchored content stays on the face; no stretched feed.",
+    mode: "manual",
+    layer: "lifecycle"
+  },
+  {
+    id: "background-foreground",
+    title: "Background and return",
+    steps: "Switch apps / lock the screen for 10 s and come back.",
+    expect: "Feed resumes by itself; no frozen frame; trackers continue.",
+    mode: "manual",
+    layer: "lifecycle"
+  },
+  {
+    id: "camera-interrupted",
+    title: "Camera taken by another app",
+    steps: "Take a call or open the native camera, then return.",
+    expect: "Session reports camera-lost and recovers on retry.",
+    mode: "manual",
+    layer: "lifecycle"
+  },
+  {
+    id: "thermal",
+    title: "Sustained use",
+    steps: "Run face + body tracking for 5 minutes.",
+    expect: "Adaptive quality steps down before the frame rate collapses; no crash.",
+    mode: "manual",
+    layer: "performance"
+  },
+  {
+    id: "low-end",
+    title: "Low-end device",
+    steps: "Run the automated set on the slowest supported device.",
+    expect: "All pass; performance may land on the low tier.",
+    mode: "manual",
+    layer: "performance"
+  }
+], Rt = (e) => j.find((t) => t.id === e) ?? nt.find((t) => t.id === e), I = (e, t) => {
+  const a = e.match(t);
+  return a ? a[1] : "";
+}, st = (e) => {
+  const t = /iPhone|iPad|iPod/.test(e) || /Macintosh/.test(e) && /Mobile/.test(e), a = /Android/.test(e);
+  let r = { name: "unknown", version: "" };
+  /Edg\//.test(e) ? r = { name: "Edge", version: I(e, /Edg\/(\d+)/) } : /OPR\//.test(e) ? r = { name: "Opera", version: I(e, /OPR\/(\d+)/) } : /SamsungBrowser\//.test(e) ? r = { name: "Samsung Internet", version: I(e, /SamsungBrowser\/(\d+)/) } : /CriOS\//.test(e) ? r = { name: "Chrome iOS", version: I(e, /CriOS\/(\d+)/) } : /FxiOS\//.test(e) ? r = { name: "Firefox iOS", version: I(e, /FxiOS\/(\d+)/) } : /Firefox\//.test(e) ? r = { name: "Firefox", version: I(e, /Firefox\/(\d+)/) } : /Chrome\//.test(e) ? r = { name: "Chrome", version: I(e, /Chrome\/(\d+)/) } : /Safari\//.test(e) && (r = { name: "Safari", version: I(e, /Version\/(\d+)/) });
+  let n = { name: "unknown", version: "" };
+  return t ? n = { name: "iOS", version: I(e, /OS (\d+[._]\d+)/).replace("_", ".") } : a ? n = { name: "Android", version: I(e, /Android (\d+(?:\.\d+)?)/) } : /Mac OS X/.test(e) ? n = { name: "macOS", version: I(e, /Mac OS X (\d+[._]\d+)/).replace("_", ".") } : /Windows NT/.test(e) ? n = { name: "Windows", version: I(e, /Windows NT (\d+\.\d+)/) } : /Linux/.test(e) && (n = { name: "Linux", version: "" }), { browser: r, os: n, mobile: t || a || /Mobile/.test(e) };
+}, it = () => {
+  var r, n;
+  const e = typeof navigator < "u" ? navigator : void 0, t = (e == null ? void 0 : e.userAgent) ?? "", a = st(t);
+  return {
+    userAgent: t,
+    platform: (e == null ? void 0 : e.platform) ?? "",
+    ...a,
+    screen: typeof window < "u" ? {
+      width: ((r = window.screen) == null ? void 0 : r.width) ?? 0,
+      height: ((n = window.screen) == null ? void 0 : n.height) ?? 0,
+      dpr: window.devicePixelRatio || 1
+    } : { width: 0, height: 0, dpr: 1 },
+    deviceMemoryGb: typeof (e == null ? void 0 : e.deviceMemory) == "number" ? e.deviceMemory : null,
+    hardwareConcurrency: typeof (e == null ? void 0 : e.hardwareConcurrency) == "number" ? e.hardwareConcurrency : null,
+    secureContext: typeof window < "u" ? !!window.isSecureContext : !1,
+    videoCaptureStream: typeof HTMLVideoElement < "u" && ("captureStream" in HTMLVideoElement.prototype || "mozCaptureStream" in HTMLVideoElement.prototype),
+    touch: typeof navigator < "u" && (navigator.maxTouchPoints ?? 0) > 0
+  };
+}, ot = [D.FACE_TRACKER, D.HAND_TRACKER, D.BODY_TRACKER], se = "__xr_compat__", ce = (e) => new Promise((t) => setTimeout(t, e)), L = async (e, t, a = 50) => {
+  const r = Date.now() + t;
+  for (; Date.now() < r; ) {
+    if (e()) return !0;
+    await ce(a);
+  }
+  return e();
+}, lt = (e, t) => e ? /^(camera-|no-camera|webgl-|offscreen-canvas-|wasm-)/.test(e) ? "capability" : /^model-/.test(e) ? "model" : /^(lifecycle|timeout:lifecycle|feed-stalled|start-)/.test(e) ? "lifecycle" : /^(fps|inference|frame)/.test(e) ? "performance" : t : t, ct = (e) => {
+  const t = {
+    pass: 0,
+    fail: 0,
+    skip: 0,
+    causes: { capability: 0, model: 0, lifecycle: 0, performance: 0, unknown: 0 }
+  };
+  for (const a of e)
+    t[a.status] += 1, a.status === "fail" && (t.causes[a.cause ?? "unknown"] += 1);
+  return t;
+}, dt = (e, t, a = {}) => ({
+  version: 1,
+  sdkVersion: a.sdkVersion ?? "dev",
+  checkedAt: (/* @__PURE__ */ new Date()).toISOString(),
+  label: a.label ?? "",
+  environment: it(),
+  capabilities: t,
+  results: e,
+  summary: ct(e)
+}), Ct = async (e, t = {}) => {
+  var h;
+  const a = t.timeoutMs ?? 2e4, r = t.models ?? ot, n = new Set(
+    t.scenarios ?? j.map((s) => s.id)
+  ), c = [];
+  let u = null, d = !1;
+  const i = (s, p, g, o) => {
+    var m;
+    const l = {
+      id: s,
+      status: o.status,
+      cause: o.status === "fail" ? lt(o.code ?? null, p) : null,
+      // Codes describe failures; a pass carries none.
+      code: o.status === "fail" ? o.code ?? null : null,
+      detail: o.detail,
+      durationMs: Math.round(performance.now() - g)
+    };
+    c.push(l), (m = t.onResult) == null || m.call(t, l);
+  }, f = async () => {
+    t.stream ? await e.setMediaSource({
+      source: ee.STREAM,
+      stream: t.stream,
+      sourceKind: "video"
+    }) : await e.setMediaSource({ source: ee.WEBCAM }), await e.start();
+  };
+  try {
+    for (const s of j) {
+      if (!n.has(s.id)) continue;
+      const p = performance.now();
+      try {
+        const g = s.id;
+        switch (g) {
+          case "capabilities": {
+            u = await ye({
+              models: r,
+              timeoutMs: Math.min(a, 8e3)
+            });
+            const o = r.map((m) => we(u, m)).filter((m) => !m.supported && m.reason).map((m) => m.reason.code), l = Array.from(new Set(o));
+            i(s.id, s.layer, p, {
+              status: l.length ? "fail" : "pass",
+              code: l[0] ?? null,
+              detail: l.length ? `blocked: ${l.join(", ")}` : `webgl${u.rendering.webglVersion}, camera ${u.camera.status}`
+            });
+            break;
+          }
+          case "session-start": {
+            await f();
+            const o = await L(
+              () => e.store.getSnapshot().lifecycle === "running",
+              a
+            ), l = e.store.getSnapshot().feedFrames, m = o && await L(() => e.store.getSnapshot().feedFrames > l, a);
+            d = o && m;
+            const w = e.store.getSnapshot().error;
+            i(s.id, s.layer, p, {
+              status: d ? "pass" : "fail",
+              code: w ? w.reason : o ? "feed-stalled" : "timeout:lifecycle",
+              detail: d ? `running on ${e.store.getSnapshot().sourceKind}` : w ? w.message : o ? "running but no feed frames advanced" : `lifecycle ${e.store.getSnapshot().lifecycle}`
+            });
+            break;
+          }
+          case "model-ready": {
+            if (!d) {
+              i(s.id, s.layer, p, {
+                status: "skip",
+                detail: "session did not start"
+              });
+              break;
+            }
+            const o = [];
+            await Promise.all(
+              r.map(async (l) => {
+                try {
+                  await e.registry.acquire(l, se), await L(
+                    () => e.store.getSnapshot().pipeline.has(l),
+                    a
+                  ) || o.push(`${l}: timeout`);
+                } catch (m) {
+                  o.push(`${l}: ${ge(m).code}`);
+                }
+              })
+            ), i(s.id, s.layer, p, {
+              status: o.length ? "fail" : "pass",
+              code: o.length ? o[0].split(": ")[1] === "timeout" ? "model-init-failed" : o[0].split(": ")[1] : null,
+              detail: o.length ? o.join("; ") : `${r.length} models ready`
+            });
+            break;
+          }
+          case "model-detects": {
+            if (!d) {
+              i(s.id, s.layer, p, {
+                status: "skip",
+                detail: "session did not start"
+              });
+              break;
+            }
+            const o = await L(
+              () => $(e, r, null).models.every((R) => R.state !== "ready" || R.inferences > 0),
+              Math.min(a, 8e3)
+            ), l = $(e, r, null), m = l.models.filter((S) => S.state === "ready" && S.inferences === 0).map((S) => S.label), w = l.models.filter((S) => S.state === "error").map((S) => {
+              var R;
+              return `${S.label}: ${((R = S.error) == null ? void 0 : R.message) ?? "error"}`;
+            });
+            i(s.id, s.layer, p, {
+              status: o && !w.length ? "pass" : "fail",
+              code: w.length ? "model-init-failed" : m.length ? "model-idle" : null,
+              detail: w.length ? w.join("; ") : m.length ? `no inference from ${m.join(", ")}` : l.models.map((S) => `${S.label} ${S.inferences} run · ${S.detections ?? "–"} det`).join(", ")
+            });
+            break;
+          }
+          case "pause-resume": {
+            if (!d) {
+              i(s.id, s.layer, p, {
+                status: "skip",
+                detail: "session did not start"
+              });
+              break;
+            }
+            e.pause();
+            const o = e.store.getSnapshot().lifecycle === "paused";
+            await e.resume();
+            const l = await L(
+              () => e.store.getSnapshot().lifecycle === "running",
+              a
+            ), m = e.store.getSnapshot().feedFrames, w = l && await L(() => e.store.getSnapshot().feedFrames > m, a);
+            i(s.id, s.layer, p, {
+              status: o && l && w ? "pass" : "fail",
+              code: o ? l ? "feed-stalled" : "lifecycle:resume" : "lifecycle:pause",
+              detail: o && l && w ? "paused → running, feed advanced" : `paused=${o} resumed=${l} advanced=${w}`
+            });
+            break;
+          }
+          case "stop-start": {
+            if (!d) {
+              i(s.id, s.layer, p, {
+                status: "skip",
+                detail: "session did not start"
+              });
+              break;
+            }
+            await e.stop();
+            const o = e.store.getSnapshot().lifecycle === "stopped";
+            await f();
+            const l = await L(
+              () => e.store.getSnapshot().lifecycle === "running",
+              a
+            );
+            i(s.id, s.layer, p, {
+              status: o && l ? "pass" : "fail",
+              code: o ? "lifecycle:restart" : "lifecycle:stop",
+              detail: o && l ? "stopped → running" : `stopped=${o} running=${l}`
+            });
+            break;
+          }
+          case "performance": {
+            if (!d) {
+              i(s.id, s.layer, p, {
+                status: "skip",
+                detail: "session did not start"
+              });
+              break;
+            }
+            const o = t.performanceWindowMs ?? 3e3;
+            let l = 0, m = 0;
+            const w = () => {
+              l += 1, m = requestAnimationFrame(w);
+            };
+            m = requestAnimationFrame(w);
+            const S = $(e, r, null);
+            await ce(o), cancelAnimationFrame(m);
+            const R = $(e, r, {
+              feedFrames: S.session.feedFrames,
+              sampledAt: S.sampledAt
+            }), x = l * 1e3 / o, E = R.inferenceMsTotal, v = x >= 20 && E <= 50;
+            i(s.id, s.layer, p, {
+              status: v ? "pass" : "fail",
+              code: x < 20 ? "fps-low" : E > 50 ? "inference-high" : null,
+              detail: `${x.toFixed(0)} fps · feed ${R.session.feedFps.toFixed(0)} fps · inference ${E.toFixed(1)} ms`
+            });
+            break;
+          }
+          default:
+            i(g, s.layer, p, { status: "skip", detail: "no runner" });
+        }
+      } catch (g) {
+        const o = g instanceof Error ? g.message : String(g), l = (h = e.store.getSnapshot().error) == null ? void 0 : h.reason;
+        i(s.id, s.layer, p, {
+          status: "fail",
+          code: l ? be(l).code : null,
+          detail: l ? `${o} (${l})` : o
+        });
+      }
+    }
+  } finally {
+    for (const s of r) e.registry.release(s, se);
+    t.keepSessionRunning || await e.stop().catch(() => {
+    });
   }
-), ot = (e) => {
-  const [t, n] = S(null);
-  return M(() => {
+  return dt(c, u, t);
+}, Et = (e) => {
+  const [t, a] = M(null);
+  return A(() => {
     let r = 0;
-    const o = () => {
-      var l, c;
-      r = requestAnimationFrame(o);
-      const i = (c = (l = e == null ? void 0 : e.detectionResults) == null ? void 0 : l.faceLandmarks) == null ? void 0 : c[0];
-      if (!i || i.length === 0) {
-        n(null);
+    const n = () => {
+      var i, f;
+      r = requestAnimationFrame(n);
+      const c = (f = (i = e == null ? void 0 : e.detectionResults) == null ? void 0 : i.faceLandmarks) == null ? void 0 : f[0];
+      if (!c || c.length === 0) {
+        a(null);
         return;
       }
-      const a = fe(i), s = {
-        left: a.minX,
-        top: a.minY,
-        width: a.width,
-        height: a.height
+      const u = Me(c), d = {
+        left: u.minX,
+        top: u.minY,
+        width: u.width,
+        height: u.height
       };
-      n((d) => d && d.left === s.left && d.top === s.top && d.width === s.width && d.height === s.height ? d : s);
+      a((h) => h && h.left === d.left && h.top === d.top && h.width === d.width && h.height === d.height ? h : d);
     };
-    return o(), () => {
+    return n(), () => {
       cancelAnimationFrame(r);
     };
   }, [e]), t;
-}, it = ({
+}, Mt = ({
   background: e = "#000",
   children: t,
-  style: n
-}) => /* @__PURE__ */ g(
+  style: a
+}) => /* @__PURE__ */ b(
   "div",
   {
     style: {
@@ -1110,68 +1493,150 @@ const rt = Ue(({
       inset: 0,
       overflow: "hidden",
       background: e,
-      ...n
+      ...a
     },
     children: t
   }
-), at = (e) => {
-  const { makeDefault: t = !0, ...n } = e;
-  return /* @__PURE__ */ g(
-    pe,
+), kt = (e) => {
+  const { makeDefault: t = !0, ...a } = e;
+  return /* @__PURE__ */ b(
+    ke,
     {
       position: [0, 0, 40],
       fov: 30,
       near: 0.1,
       far: 1e3,
       makeDefault: t,
-      ...n
+      ...a
     }
   );
-}, st = ["fill", "contain"];
+}, Tt = ["fill", "contain"];
 export {
-  zt as BasicAnimatedTextureController,
-  nt as BoundingBoxOverlay,
-  dt as HeadTracker,
-  Xt as MAX_GIF_BYTES,
-  kt as MAX_GIF_FRAMES,
-  At as MAX_GIF_PIXELS,
-  at as PerspectiveCamera,
-  Ct as ScreenRectAspectContext,
-  st as TEXTURE_FITS,
-  Lt as TextureSourceLoadError,
-  it as XRCompositor,
+  Hr as BasicAnimatedTextureController,
+  xt as BoundingBoxOverlay,
+  j as COMPAT_SCENARIOS,
+  At as EMPTY_QUALITY_SIGNALS,
+  ua as FACE_REGION_POLYGONS,
+  kr as HAND_JOINTS,
+  Jt as HeadTracker,
+  ma as IRIS_FULL_OPENNESS,
+  fa as IrisLead,
+  nt as MANUAL_COMPAT_SCENARIOS,
+  qr as MAX_GIF_BYTES,
+  Gr as MAX_GIF_FRAMES,
+  Ur as MAX_GIF_PIXELS,
+  pa as MAX_OVERLAY_LABELS,
+  Tr as OscillationTracker,
+  Ir as POSE_JOINTS,
+  kt as PerspectiveCamera,
+  ha as SEGMENTATION_OVERLAY_FRAGMENT_SHADER,
+  ga as SEGMENTATION_OVERLAY_VERTEX_SHADER,
+  vr as ScreenRectAspectContext,
+  Tt as TEXTURE_FITS,
+  jr as TextureSourceLoadError,
+  Mt as XRCompositor,
   B as XRLayer,
-  xe as XRMediaSurface,
-  tt as XRTrackingOverlay,
-  rt as XRViewport,
-  fe as computeLandmarkBounds,
-  Vt as computeScreenTransform,
-  xt as createFaceInfoTarget,
-  Dt as createTextureSourceResolver,
-  Bt as disposeResolvedTextureSource,
-  vt as getFaceInfo,
-  Wt as getPlaybackFrame,
-  _t as getSequenceFrame,
-  St as getThreeBlending,
-  Rt as getThreeDepthFunction,
-  It as getThreeSide,
-  Ht as gifTextureSourceProvider,
-  Ft as hasFullUnitUVBounds,
-  Me as resolveCalibrationFaceDisplayMirrored,
-  Pt as resolveTextureSource,
-  $t as throwIfAborted,
-  Xe as useCalibrationFaceTracker,
-  ot as useFaceBoundingBox,
-  Et as useScreenSpace,
-  ut as useTrackerContext,
-  mt as useXRCameraTexture,
-  se as useXRContext,
-  ft as useXRError,
-  le as useXRModel,
-  ce as useXRModelNode,
-  pt as useXRPipelineSnapshot,
-  gt as useXRReady,
-  bt as useXRRenderSize,
-  qt as useXRViewportRenderOutputs,
-  Ut as useXRViewportState
+  Ae as XRMediaSurface,
+  St as XRTrackingOverlay,
+  vt as XRViewport,
+  Lt as XR_MODEL_LABELS,
+  _t as classifyCameraFailure,
+  lt as classifyCompatCause,
+  ya as computeIrisEye,
+  Me as computeLandmarkBounds,
+  wa as computeMaskUvTransform,
+  Kr as computeScreenTransform,
+  dt as createCompatReport,
+  wr as createFaceInfoTarget,
+  ia as createGestureDetectorState,
+  ba as createIrisEye,
+  Sa as createIrisResult,
+  Xt as createQualityState,
+  va as createSegmentationOverlayMaterial,
+  xa as createSemanticMaskTexture,
+  Qr as createTextureSourceResolver,
+  it as describeCompatEnvironment,
+  Yr as disposeResolvedTextureSource,
+  Ot as fillLandmarkPolygon,
+  zt as fillPolygon,
+  Rt as findCompatScenario,
+  Fr as fingerExtensions,
+  oa as gestureStatesEqual,
+  br as getFaceInfo,
+  Jr as getPlaybackFrame,
+  Zr as getSequenceFrame,
+  xr as getThreeBlending,
+  Rr as getThreeDepthFunction,
+  Cr as getThreeSide,
+  ea as gifTextureSourceProvider,
+  Nr as hasFullUnitUVBounds,
+  Dt as judgeSample,
+  Pt as lockQuality,
+  Vt as mapDomExceptionToReason,
+  ge as mapModelErrorToReason,
+  Ar as measureArmRaise,
+  Lr as measureFingerPattern,
+  _r as measureGrab,
+  Xr as measureHandHeight,
+  Or as measureOpenPalm,
+  zr as measurePinch,
+  Dr as measureTPose,
+  Pr as measureThumb,
+  st as parseUserAgent,
+  $t as permissionStateToStatus,
+  Ra as rasterizeFaceRegions,
+  Bt as readDeviceSignals,
+  Nt as resetQuality,
+  Ca as resolveActiveOverlayLabelIndices,
+  Be as resolveCalibrationFaceDisplayMirrored,
+  Wt as resolveInitialTierIndex,
+  Ea as resolveMaskSize,
+  Ma as resolveOverlayLabelIndices,
+  Ht as resolvePerformanceBudget,
+  qt as resolveQualityTier,
+  ta as resolveTextureSource,
+  Ct as runCompatChecks,
+  $ as sampleXRDiagnostics,
+  Gt as semanticMaskLabelIndex,
+  be as sessionReasonToFallback,
+  Ut as setQualityTier,
+  la as snapshotGestureState,
+  ca as stepGestureDetector,
+  jt as stepQualityController,
+  ct as summarizeCompatResults,
+  ra as throwIfAborted,
+  Vr as thumbDirection,
+  $r as thumbExtension,
+  Kt as tierToApply,
+  ka as updateIrisResult,
+  Ta as updateSegmentationOverlayMaterial,
+  Ia as uploadSemanticMask,
+  We as useCalibrationFaceTracker,
+  Et as useFaceBoundingBox,
+  Er as useScreenSpace,
+  Fa as useSegmentationOverlayMaterial,
+  Aa as useSemanticMaskTexture,
+  Zt as useTrackerContext,
+  tr as useXRCameraDeviceId,
+  rr as useXRCameraFacing,
+  ar as useXRCameraTexture,
+  ie as useXRContext,
+  Qt as useXRDiagnostics,
+  nr as useXRError,
+  sr as useXRFeedCrop,
+  ir as useXRLifecycle,
+  or as useXRMirrored,
+  Se as useXRModel,
+  lr as useXRModelErrors,
+  ve as useXRModelNode,
+  cr as useXROrientation,
+  dr as useXRPipelineSnapshot,
+  ur as useXRQualityConfig,
+  mr as useXRQualityState,
+  fr as useXRReady,
+  pr as useXRRenderSize,
+  hr as useXRSessionCameraPermission,
+  gr as useXRTrackerStatus,
+  aa as useXRViewportRenderOutputs,
+  na as useXRViewportState
 };