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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (106) hide show
  1. package/GROUNDING.md +232 -14
  2. package/dist/{DebuggerUI-CEfdddkZ.cjs → DebuggerUI-CatYc-RG.cjs} +1 -1
  3. package/dist/{DebuggerUI-Dgop6Q6o.js → DebuggerUI-gLMKiVwJ.js} +1 -1
  4. package/dist/MediaSourceSwitcher-C-xYg0nQ.js +317 -0
  5. package/dist/MediaSourceSwitcher-Cq3g4IKw.cjs +31 -0
  6. package/dist/components/FaceMesh/canonical/CanonicalFaceMeshRenderer.d.ts +6 -1
  7. package/dist/components/FaceMesh/material/defaults.d.ts +4 -0
  8. package/dist/components/FaceMesh/material/types.d.ts +2 -0
  9. package/dist/components/FaceRetouch/Background.d.ts +6 -1
  10. package/dist/components/FaceRetouch/defaults.d.ts +13 -0
  11. package/dist/components/FaceRetouch/index.d.ts +3 -1
  12. package/dist/components/FaceRetouch/landmarkMask.d.ts +4 -1
  13. package/dist/components/FaceRetouch/useFaceRetouchMask.d.ts +2 -1
  14. package/dist/components/FaceWarp3D/FaceWarp3DHead.d.ts +15 -0
  15. package/dist/components/FaceWarp3D/defaults.d.ts +37 -0
  16. package/dist/components/FaceWarp3D/index.d.ts +3 -0
  17. package/dist/components/FaceWarp3D/warp.d.ts +13 -0
  18. package/dist/components/HandJoints2D/index.d.ts +6 -0
  19. package/dist/components/HandTracker/index.d.ts +2 -2
  20. package/dist/components/HandTracking2D/HandVisual.d.ts +12 -0
  21. package/dist/components/HandTracking2D/index.d.ts +5 -0
  22. package/dist/components/HandTracking2DController/index.d.ts +5 -0
  23. package/dist/components/HandTracking3D/index.d.ts +6 -0
  24. package/dist/components/ScreenImage/index.d.ts +87 -0
  25. package/dist/components/ScreenText/index.d.ts +20 -0
  26. package/dist/components/TextLabel/index.d.ts +99 -0
  27. package/dist/components/XRScene/index.d.ts +14 -3
  28. package/dist/components/XRViewport/index.d.ts +17 -0
  29. package/dist/components/index.d.ts +7 -0
  30. package/dist/debug-ui/default-setting/index.d.ts +37 -0
  31. package/dist/debug-ui/default-setting.cjs +21 -0
  32. package/dist/debug-ui/default-setting.js +777 -0
  33. package/dist/debug-ui/face-warp-3d/index.d.ts +6 -0
  34. package/dist/debug-ui/hand-joints-2d/index.d.ts +6 -0
  35. package/dist/debug-ui/hand-tracking-2d/index.d.ts +6 -0
  36. package/dist/debug-ui/hand-tracking-2d-controller/index.d.ts +6 -0
  37. package/dist/debug-ui/hand-tracking-3d/index.d.ts +6 -0
  38. package/dist/debug-ui/index.d.ts +23 -0
  39. package/dist/debug-ui/layer-panel/index.d.ts +17 -0
  40. package/dist/debug-ui/media-source/MediaSourceSwitcher.d.ts +10 -0
  41. package/dist/debug-ui/media-source/index.d.ts +4 -0
  42. package/dist/debug-ui/media-source/media-preset.d.ts +9 -0
  43. package/dist/debug-ui/media-source.cjs +1 -0
  44. package/dist/debug-ui/media-source.js +7 -0
  45. package/dist/debug-ui/screen-image-settings/index.d.ts +7 -0
  46. package/dist/debug-ui/screen-text-settings/index.d.ts +122 -0
  47. package/dist/debug-ui/settings-panel/index.d.ts +38 -0
  48. package/dist/debug-ui/shared/MaterialSection.d.ts +13 -0
  49. package/dist/debug-ui/shared/ScreenTransformSection.d.ts +29 -0
  50. package/dist/debug-ui.cjs +20 -0
  51. package/dist/debug-ui.js +6063 -0
  52. package/dist/defaults-BLpcN3pG.cjs +1 -0
  53. package/dist/defaults-LtY4M7dg.js +55 -0
  54. package/dist/entries/core.d.ts +5 -1
  55. package/dist/entries/face-effects.d.ts +2 -0
  56. package/dist/entries/low-level.d.ts +3 -0
  57. package/dist/face-effects.cjs +113 -23
  58. package/dist/face-effects.js +1566 -1399
  59. package/dist/handJoints2d.d.ts +49 -0
  60. package/dist/handTracking2d.d.ts +33 -0
  61. package/dist/handTracking2dController.d.ts +65 -0
  62. package/dist/handTracking3d.d.ts +52 -0
  63. package/dist/{index-BD-JWMjE.js → index-BGNbrc4C.js} +113 -137
  64. package/dist/index-BXyObVHF.cjs +1 -0
  65. package/dist/index-CY3bUAcW.js +12 -0
  66. package/dist/index-C_Duh13c.cjs +1 -0
  67. package/dist/index-D8fpPQkC.cjs +1 -0
  68. package/dist/index-DxshgBu0.cjs +1 -0
  69. package/dist/index-O-2crZ3M.js +1102 -0
  70. package/dist/{index-CYMj26Ej.js → index-safCs_af.js} +426 -416
  71. package/dist/{internal-DH5d1Xnq.cjs → internal-BjyhBP8i.cjs} +1 -1
  72. package/dist/{internal-KOKJDxCG.js → internal-Cae1ps15.js} +3 -3
  73. package/dist/internal.cjs +1 -1
  74. package/dist/internal.js +2 -2
  75. package/dist/layerStack.d.ts +29 -0
  76. package/dist/low-level.cjs +1 -1
  77. package/dist/low-level.js +74 -890
  78. package/dist/main.cjs +73 -1
  79. package/dist/main.js +1656 -407
  80. package/dist/models/Hand/HandTracking.d.ts +2 -0
  81. package/dist/screen2d/index.d.ts +4 -0
  82. package/dist/screen2d/material-runtime.d.ts +32 -0
  83. package/dist/screen2d/texture.d.ts +10 -0
  84. package/dist/screen2d/transform.d.ts +25 -0
  85. package/dist/screen2d/types.d.ts +90 -0
  86. package/dist/screenImagePresets.d.ts +13 -0
  87. package/dist/screenImageSettings-6NRg4cx9.js +39 -0
  88. package/dist/screenImageSettings-y_B4_767.cjs +1 -0
  89. package/dist/screenImageSettings.d.ts +50 -0
  90. package/dist/screenTextPresets.d.ts +6 -0
  91. package/dist/screenTextSettings.d.ts +131 -0
  92. package/dist/{selectors-Bub0o3qy.cjs → selectors-BLl2JUWW.cjs} +1 -1
  93. package/dist/{selectors-BHO6TnoC.js → selectors-CXd_x-6t.js} +6 -6
  94. package/dist/tracking.cjs +1 -1
  95. package/dist/tracking.js +193 -168
  96. package/dist/types/hand-tracking.d.ts +8 -0
  97. package/dist/types/nodes.d.ts +2 -0
  98. package/dist/useXRModel-3DcUa28n.cjs +1 -0
  99. package/dist/useXRModel-BMJE1hrk.js +28 -0
  100. package/dist/x-Co8jPhP0.js +127 -0
  101. package/dist/x-KC8E4Gaj.cjs +41 -0
  102. package/package.json +19 -1
  103. package/dist/index-B5J4gzn2.cjs +0 -1
  104. package/dist/index-BVBVg96G.cjs +0 -1
  105. package/dist/index-DtwHElmG.js +0 -157
  106. package/dist/index-PtFmD6B8.cjs +0 -1
@@ -0,0 +1,20 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $e=require("./MediaSourceSwitcher-Cq3g4IKw.cjs"),Ht=require("./debug-ui/default-setting.cjs"),e=require("react/jsx-runtime"),ie=require("react-dom"),c=require("react"),Kt=require("./screenImageSettings-y_B4_767.cjs"),Bt=require("./defaults-BLpcN3pG.cjs"),$t={enabled:!0,bothHands:!0,space:"scene",showJoints:!0,showBones:!0,showLabels:!1,handScale:1,depthScale:1,trackingDistanceM:.6096,projectionDistanceM:2,fitX:1,fitY:.9,offsetX:0,offsetY:0,offsetZ:0,jointRadius:.012,boneRadius:.012,opacity:.88,smoothing:.35},Vt={enabled:!0,attachImageEnabled:!0,showBoundingBox:!1,verticalAlign:"middle",horizontalAlign:"center",sizeResponsiveToHandBoundingBox:!1,size:1,offsetX:0,offsetY:.02,rotation:0,alpha:1,smoothFollowing:!0,smoothing:.35},At=[{label:"Top",value:"top"},{label:"Middle",value:"middle"},{label:"Bottom",value:"bottom"}],Nt=[{label:"Left",value:"left"},{label:"Middle",value:"center"},{label:"Right",value:"right"}],Dt={enabled:!0,bothHands:!0,visualScale:1,opacity:.92,pointRadius:3,lineWidth:3,labelScale:1.2,smoothing:.35,color:"#22d3ee",showBoundingBox:!0,showLabels:!1,logToConsole:!1},Ot={enabled:!0,bothHands:!0,countEnabled:!0,minCountConfidence:.35,showBones:!0,showJoints:!0,showBoundingBox:!0,showLabels:!1,visualScale:1,opacity:.9,jointRadius:3,lineWidth:1.5,labelScale:1,smoothing:.35},Pt={clean:{fontWeight:400,strokeLayers:[],shadowLayers:[]},sticker:{color:"#101828",fontWeight:800,strokeLayers:[{color:"#ffffff",width:26,opacity:1},{color:"#101828",width:10,opacity:1}],shadowLayers:[]},"shadow-pop":{color:"#fff8df",fontWeight:800,strokeLayers:[{color:"#101828",width:12,opacity:1}],shadowLayers:[{color:"#0f172a",blur:0,offsetX:18,offsetY:18,opacity:.9},{color:"#0f172a",blur:10,offsetX:10,offsetY:10,opacity:.35}]},neon:{color:"#ffffff",fontWeight:700,strokeLayers:[{color:"#9be7ff",width:8,opacity:.9}],shadowLayers:[{color:"#38bdf8",blur:18,opacity:.8},{color:"#0ea5e9",blur:40,opacity:.7},{color:"#7c3aed",blur:70,opacity:.5}]},editorial:{color:"#f8fafc",fontWeight:500,strokeLayers:[{color:"#0f172a",width:4,opacity:.5}],shadowLayers:[]},"comic-burst":{color:"#fff06a",fontWeight:900,strokeLayers:[{color:"#ef4444",width:28,opacity:1},{color:"#111827",width:12,opacity:1}],shadowLayers:[{color:"#111827",blur:0,offsetX:12,offsetY:12,opacity:.65}]},"ice-outline":{color:"#eff8ff",fontWeight:800,strokeLayers:[{color:"#dbeafe",width:16,opacity:1},{color:"#1d4ed8",width:6,opacity:.95}],shadowLayers:[{color:"#38bdf8",blur:24,opacity:.32}]},"sunset-glow":{color:"#fff7ed",fontWeight:800,strokeLayers:[{color:"#fb7185",width:8,opacity:.95}],shadowLayers:[{color:"#fb7185",blur:18,opacity:.7},{color:"#f97316",blur:42,opacity:.55},{color:"#facc15",blur:70,opacity:.28}]},cutout:{color:"#fffaf0",fontWeight:800,strokeLayers:[{color:"#0f172a",width:6,opacity:.9}],shadowLayers:[{color:"#0f172a",blur:0,offsetX:8,offsetY:8,opacity:.95},{color:"#0f172a",blur:0,offsetX:16,offsetY:16,opacity:.4}]},"badge-arc":{color:"#ffffff",fontWeight:900,outlineEnabled:!0,shadowEnabled:!0,glowEnabled:!1,innerShadowEnabled:!1,bendEnabled:!0,bend:{preset:"arc",strength:100},strokeLayers:[{color:"#0b1020",width:24,opacity:1},{color:"#ffffff",width:8,opacity:1}],shadowLayers:[{color:"#020617",blur:8,offset:10,angle:-45,feather:.2,opacity:.65}]},"chrome-bulge":{color:"#f8fafc",fontWeight:900,outlineEnabled:!0,shadowEnabled:!1,glowEnabled:!0,innerShadowEnabled:!0,bendEnabled:!0,bend:{preset:"bulge",strength:100},glow:{color:"#dbeafe",style:"contoured",intensity:.55,range:.35,horizontalAngle:0,verticalAngle:0},innerShadow:{color:"#64748b",opacity:.9,offset:16,angle:-45,feather:.25},strokeLayers:[{color:"#0f172a",width:5,opacity:.9}],shadowLayers:[]},"retro-wave":{color:"#fffbeb",fontWeight:900,outlineEnabled:!0,shadowEnabled:!0,glowEnabled:!0,innerShadowEnabled:!1,bendEnabled:!0,bend:{preset:"wave",strength:100},glow:{color:"#fb7185",style:"outward",intensity:.65,range:.55,horizontalAngle:0,verticalAngle:0},strokeLayers:[{color:"#fb7185",width:12,opacity:1},{color:"#7c2d12",width:5,opacity:.9}],shadowLayers:[{color:"#7c2d12",blur:4,offset:14,angle:45,feather:.1,opacity:.75}]},"flag-pop":{color:"#ffffff",fontWeight:900,outlineEnabled:!0,shadowEnabled:!0,glowEnabled:!0,innerShadowEnabled:!1,bendEnabled:!0,bend:{preset:"flag",strength:100},glow:{color:"#38bdf8",style:"outward",intensity:.5,range:.45,horizontalAngle:.15,verticalAngle:-.1},strokeLayers:[{color:"#fde047",width:18,opacity:1},{color:"#111827",width:7,opacity:1}],shadowLayers:[{color:"#111827",blur:0,offset:14,angle:35,feather:0,opacity:.75}]},"fisheye-poster":{color:"#fff7ed",fontWeight:900,outlineEnabled:!0,shadowEnabled:!0,glowEnabled:!1,innerShadowEnabled:!0,bendEnabled:!0,bend:{preset:"fisheye",strength:100},innerShadow:{color:"#92400e",opacity:.55,offset:10,angle:-45,feather:.15},strokeLayers:[{color:"#020617",width:24,opacity:1},{color:"#f97316",width:8,opacity:.9}],shadowLayers:[{color:"#020617",blur:0,offset:12,angle:40,feather:0,opacity:.8}]}},Zt={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},P={display:"flex",flexDirection:"column",gap:4},Se={...P,gridColumn:"1 / -1"},M={fontSize:9,color:"rgba(226,232,240,0.72)"},kt={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},_t={...kt,fontVariantNumeric:"tabular-nums"},Fe={display:"flex",alignItems:"center",justifyContent:"space-between",gap:12,minHeight:24},Me={width:16,height:16},Xt={width:"100%",height:26,borderRadius:8,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(56,189,248,0.16)",color:"#e0f2fe",fontSize:10.5,fontWeight:700,cursor:"pointer"},Gt=t=>/^-?\d*(\.\d*)?$/.test(t),X=({value:t,onChange:i,step:p=1,min:w,max:j,disabled:S=!1})=>{const[R,k]=c.useState(String(t));c.useEffect(()=>k(String(t)),[t]);const u=r=>{let o=r;return typeof w=="number"&&(o=Math.max(w,o)),typeof j=="number"&&(o=Math.min(j,o)),o};return e.jsx("input",{type:"text",inputMode:"decimal",pattern:"-?[0-9]*[.,]?[0-9]*",style:_t,value:R,disabled:S,onChange:r=>{const o=r.target.value;if(!Gt(o)||(k(o),o===""||o==="-"||o==="."||o==="-."))return;const v=Number(o);Number.isNaN(v)||i(u(v))},onBlur:()=>{const r=Number(R);if(Number.isNaN(r)){k(String(t));return}const o=u(r);k(String(o)),i(o)},onKeyDown:r=>{if(r.key!=="ArrowUp"&&r.key!=="ArrowDown")return;r.preventDefault();const o=r.shiftKey?p*10:r.altKey?p/10:p,v=r.key==="ArrowUp"?t+o:t-o;i(u(Number.isInteger(v)?v:Number(v.toFixed(6))))}})},vt=({value:t,onChange:i,guideLabel:p,copyLabel:w,copyValue:j,showRenderOrder:S=!0})=>{const[R,k]=c.useState(!1),u=t.coordinateSpace??"normalized",r=t.canvasSize??{width:720,height:1280},o=u==="canvas",v=async()=>{await navigator.clipboard.writeText(JSON.stringify(j??{name:w??"Selected layer",transform:t},null,2)),k(!0),window.setTimeout(()=>k(!1),1200)};return e.jsxs("div",{style:Zt,children:[e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Coordinate Space"}),e.jsxs("select",{style:kt,value:u,onChange:d=>i({...t,coordinateSpace:d.target.value}),children:[e.jsx("option",{value:"normalized",children:"Normalized"}),e.jsx("option",{value:"canvas",children:"Canvas"})]})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Canvas Width"}),e.jsx(X,{value:r.width,min:1,max:4096,step:1,disabled:!o,onChange:d=>i({...t,canvasSize:{...r,width:d}})})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Canvas Height"}),e.jsx(X,{value:r.height,min:1,max:4096,step:1,disabled:!o,onChange:d=>i({...t,canvasSize:{...r,height:d}})})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Position X"}),e.jsx(X,{value:t.position.x,min:o?-r.width:-10,max:o?r.width:10,step:o?1:.01,onChange:d=>i({...t,position:{...t.position,x:d}})})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Position Y"}),e.jsx(X,{value:t.position.y,min:o?-r.height:-10,max:o?r.height:10,step:o?1:.01,onChange:d=>i({...t,position:{...t.position,y:d}})})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Size Width"}),e.jsx(X,{value:t.size.width,min:o?0:-10,max:o?r.width*2:10,step:o?1:.01,onChange:d=>i({...t,size:{...t.size,width:d}})})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Size Height"}),e.jsx(X,{value:t.size.height,min:o?0:-10,max:o?r.height*2:10,step:o?1:.01,onChange:d=>i({...t,size:{...t.size,height:d}})})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Rotation"}),e.jsx(X,{value:t.rotation,min:-360,max:360,step:1,onChange:d=>i({...t,rotation:d})})]}),S?e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Render Order"}),e.jsx(X,{value:t.renderOrder,min:-9999,max:9999,step:1,onChange:d=>i({...t,renderOrder:d})})]}):null,e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Pivot X"}),e.jsx(X,{value:t.pivot[0],min:0,max:1,step:.01,onChange:d=>i({...t,pivot:[d,t.pivot[1]]})})]}),e.jsxs("label",{style:P,children:[e.jsx("span",{style:M,children:"Pivot Y"}),e.jsx(X,{value:t.pivot[1],min:0,max:1,step:.01,onChange:d=>i({...t,pivot:[t.pivot[0],d]})})]}),e.jsx("label",{style:Se,children:e.jsxs("div",{style:Fe,children:[e.jsx("span",{style:M,children:p}),e.jsx("input",{type:"checkbox",style:Me,checked:t.showGuides,onChange:d=>i({...t,showGuides:d.target.checked})})]})}),e.jsx("label",{style:Se,children:e.jsxs("div",{style:Fe,children:[e.jsx("span",{style:M,children:"Enabled"}),e.jsx("input",{type:"checkbox",style:Me,checked:t.enabled,onChange:d=>i({...t,enabled:d.target.checked})})]})}),e.jsx("label",{style:Se,children:e.jsxs("div",{style:Fe,children:[e.jsx("span",{style:M,children:"Visible"}),e.jsx("input",{type:"checkbox",style:Me,checked:t.visible,onChange:d=>i({...t,visible:d.target.checked})})]})}),e.jsx("label",{style:Se,children:e.jsxs("div",{style:Fe,children:[e.jsx("span",{style:M,children:"Overlay"}),e.jsx("input",{type:"checkbox",style:Me,checked:t.overlay,onChange:d=>i({...t,overlay:d.target.checked})})]})}),e.jsx("div",{style:Se,children:e.jsx("button",{type:"button",style:Xt,onClick:v,children:R?"Copied Transform":"Copy Transform"})})]})},Yt=[{label:"Space Grotesk",value:'"Space Grotesk", sans-serif'},{label:"Bebas Neue",value:'"Bebas Neue", sans-serif'},{label:"DM Serif Display",value:'"DM Serif Display", serif'},{label:"Caveat",value:'"Caveat", cursive'}],Ut=["clean","sticker","shadow-pop","neon","editorial","comic-burst","ice-outline","sunset-glow","cutout","badge-arc","chrome-bulge","retro-wave","flag-pop","fisheye-poster"],Jt={clean:"NONE",sticker:"sticker","shadow-pop":"shadow-pop",neon:"neon",editorial:"editorial","comic-burst":"comic-burst","ice-outline":"ice-outline","sunset-glow":"sunset-glow",cutout:"cutout","badge-arc":"badge-arc","chrome-bulge":"chrome-bulge","retro-wave":"retro-wave","flag-pop":"flag-pop","fisheye-poster":"fisheye-poster"},qt=()=>({color:"#000000",opacity:1,width:30}),De=()=>({color:"#000000",opacity:1,offset:10,angle:-45,feather:0,blur:0,offsetX:7.071,offsetY:-7.071}),Qe=()=>({color:"#ffffff",style:"outward",intensity:.5,range:.5,horizontalAngle:0,verticalAngle:0}),et=()=>({preset:"arc",strength:100}),Qt=[{label:"Arc",value:"arc"},{label:"Arc Lower",value:"arc-lower"},{label:"Arc Upper",value:"arc-upper"},{label:"Arch",value:"arch"},{label:"Bulge",value:"bulge"},{label:"Shell Lower",value:"shell-lower"},{label:"Shell Upper",value:"shell-upper"},{label:"Flag",value:"flag"},{label:"Wave",value:"wave"},{label:"Fish",value:"fish"},{label:"Rise",value:"rise"},{label:"Fisheye",value:"fisheye"},{label:"Inflate",value:"inflate"},{label:"Squeeze",value:"squeeze"},{label:"Twist",value:"twist"}],es=(t,i)=>{const p=Pt[i],w=p.strokeLayers??t.style.strokeLayers,j=p.shadowLayers??t.style.shadowLayers;return{...t,textArtPreset:i,style:{...t.style,...p,fontWeight:t.style.bold?"bold":p.fontWeight??t.style.fontWeight,background:{...t.style.background,...p.background},outlineEnabled:p.strokeLayers?p.strokeLayers.length>0:t.style.outlineEnabled,shadowEnabled:p.shadowLayers?p.shadowLayers.length>0:t.style.shadowEnabled,strokeLayers:w,shadowLayers:j}}},ts={position:"fixed",left:14,top:104,zIndex:2e4,pointerEvents:"none"},Ct={pointerEvents:"auto",width:298,borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflowX:"hidden",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},ss={...Ct,width:32,height:32,borderRadius:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},ns={position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:7,padding:"7px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)"},ls={width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},is={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:600,minWidth:0},tt={display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},os={display:"grid",gap:6,padding:7},rs={borderRadius:12,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)",overflow:"hidden"},as={display:"flex",alignItems:"center",gap:7,padding:"6px 7px"},ds={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:500,flex:"1 1 auto",minWidth:0},cs={width:28,height:16,borderRadius:999,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.08)",padding:2,display:"flex",alignItems:"center",cursor:"pointer",flex:"0 0 auto"},hs=t=>({width:10,height:10,borderRadius:999,background:t?"#f8fafc":"rgba(148,163,184,0.7)",transform:t?"translateX(12px)":"translateX(0)",transition:"transform 140ms ease, background 140ms ease"}),ps={display:"grid",gap:7,padding:"0 7px 7px"},U={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},z={display:"flex",flexDirection:"column",gap:4},T={...z,gridColumn:"1 / -1"},ge={gridColumn:"1 / -1",display:"grid",gap:6,padding:"8px 8px 2px 12px",marginTop:-2,borderLeft:"1px solid rgba(255,255,255,0.10)"},be={display:"flex",alignItems:"center",justifyContent:"space-between",gap:6,width:"100%",padding:0,border:0,background:"transparent",fontSize:9,color:"rgba(226,232,240,0.64)",textTransform:"uppercase",cursor:"pointer"},ue={display:"flex",alignItems:"center",gap:6,minWidth:0},fe={width:16,height:16,borderRadius:999,display:"inline-flex",alignItems:"center",justifyContent:"center",background:"rgba(255,255,255,0.06)",color:"rgba(226,232,240,0.72)",flex:"0 0 auto"},x={fontSize:9,color:"rgba(226,232,240,0.72)"},Ve={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},ys={...Ve,height:72,padding:"7px",resize:"vertical",lineHeight:1.35,fontFamily:"inherit"},Q={...Ve,padding:2,cursor:"pointer"},J={...Ve,appearance:"none"},xs={...Ve,fontVariantNumeric:"tabular-nums"},zt={opacity:.45,cursor:"not-allowed"},F={display:"flex",alignItems:"center",justifyContent:"space-between",gap:12,minHeight:24},B={width:16,height:16},ke={display:"inline-flex",alignItems:"center",justifyContent:"center",width:24,height:24,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.05)",color:"#e2e8f0",cursor:"pointer",padding:0,flex:"0 0 auto"},gs=()=>e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 10h10v2H7v-2zm0 4h10v2H7v-2zm0-8h10v2H7V6z"})}),bs=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M18.3 5.71 12 12l6.3 6.29-1.41 1.41L10.59 13.41 4.29 19.7 2.88 18.29 9.17 12 2.88 5.71 4.29 4.3l6.3 6.29 6.29-6.3z"})}),us=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M8 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"})}),fs=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M6 4h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2zm1 3v2h4v8h2V9h4V7H7z"})}),st=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M4 6V4h16v2h-7v14h-2V6H4z"})}),js=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 3a9 9 0 1 0 0 18h1.2a2.8 2.8 0 0 0 0-5.6h-.4a1.8 1.8 0 0 1 0-3.6H16a5 5 0 0 0 0-10h-4zm-4 7a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm1 5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm6-7a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"})}),ms=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M4 4h6v2H7.4l3.3 3.3-1.4 1.4L6 7.4V10H4V4zm10 0h6v6h-2V7.4l-3.3 3.3-1.4-1.4L16.6 6H14V4zM9.3 13.3l1.4 1.4L7.4 18H10v2H4v-6h2v2.6l3.3-3.3zm5.4 0 3.3 3.3V14h2v6h-6v-2h2.6l-3.3-3.3 1.4-1.4z"})}),ws=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M3 5h18v2H3V5zm0 6h12v2H3v-2zm0 6h18v2H3v-2z"})}),Ss=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 7h10a5 5 0 1 1 0 10H7A5 5 0 1 1 7 7zm0 2a3 3 0 1 0 0 6h10a3 3 0 1 0 0-6H7z"})}),je=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 5h10v2H9v6h8v2H7V5zm4 8h6v6h-6v-2h4v-2h-4v-2z"})}),ks=t=>/^-?\d*(\.\d*)?$/.test(t),E=({value:t,onChange:i,step:p=1,min:w,max:j,disabled:S=!1})=>{const[R,k]=c.useState(String(t));c.useEffect(()=>k(String(t)),[t]);const u=r=>{let o=r;return typeof w=="number"&&(o=Math.max(w,o)),typeof j=="number"&&(o=Math.min(j,o)),o};return e.jsx("input",{type:"text",inputMode:"decimal",pattern:"-?[0-9]*[.,]?[0-9]*",style:{...xs,...S?zt:{}},value:R,disabled:S,onChange:r=>{if(S)return;const o=r.target.value;if(!ks(o)||(k(o),o===""||o==="-"||o==="."||o==="-."))return;const v=Number(o);Number.isNaN(v)||i(u(v))},onBlur:()=>{if(S)return;const r=Number(R);if(Number.isNaN(r)){k(String(t));return}const o=u(r);k(String(o)),i(o)},onKeyDown:r=>{if(S||r.key!=="ArrowUp"&&r.key!=="ArrowDown")return;r.preventDefault();const o=r.shiftKey?p*10:r.altKey?p/10:p,v=r.key==="ArrowUp"?t+o:t-o;i(u(Number.isInteger(v)?v:Number(v.toFixed(6))))}})},nt=t=>({enabled:t.enabled,showGuides:t.showTransformGuides,coordinateSpace:t.coordinateSpace,canvasSize:t.canvasSize,position:t.position,size:t.size,rotation:t.rotation,pivot:t.pivot,renderOrder:t.renderOrder,overlay:t.overlay,visible:t.visible}),vs=(t,i)=>({...i,enabled:t.enabled,showTransformGuides:t.showGuides,coordinateSpace:t.coordinateSpace,canvasSize:t.canvasSize,position:t.position,size:t.size,rotation:t.rotation,pivot:t.pivot,renderOrder:t.renderOrder,overlay:t.overlay,visible:t.visible}),Cs=({value:t,onChange:i,copyLabel:p})=>{var qe;const[w,j]=c.useState(!0),[S,R]=c.useState({x:14,y:104}),[k,u]=c.useState(typeof window>"u"?0:window.innerHeight),[r,o]=c.useState(!0),[v,d]=c.useState(!0),[h,s]=c.useState(!0),[y,a]=c.useState(!0),[b,I]=c.useState(!0),[N,C]=c.useState(!0),[D,K]=c.useState({renderer:!0,content:!0,transformation:!0,style:!0,layout:!0,visibility:!1}),Y=c.useRef(null),Lt=Math.max(240,k-S.y-16);c.useEffect(()=>{const l=W=>{Y.current&&R({x:Math.max(8,W.clientX-Y.current.x),y:Math.max(8,W.clientY-Y.current.y)})},n=()=>{Y.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",l),window.addEventListener("pointerup",n),()=>{window.removeEventListener("pointermove",l),window.removeEventListener("pointerup",n)}},[]),c.useEffect(()=>{const l=()=>u(window.innerHeight);return window.addEventListener("resize",l),()=>window.removeEventListener("resize",l)},[]);const Ft=l=>{const n=l.currentTarget.getBoundingClientRect();Y.current={x:l.clientX-n.left,y:l.clientY-n.top},document.body.classList.add("select-none"),l.currentTarget.setPointerCapture(l.pointerId)},g=l=>{i({...t,screenText:l(t.screenText)})},Mt=l=>{g(n=>({...n,transformation:l(n.transformation)}))},Ae=t.screenText.style.strokeLayers??[],Ne=t.screenText.style.shadowEnabled!==!1&&(((qe=t.screenText.style.shadowLayers)==null?void 0:qe.length)??0)===0?[De()]:t.screenText.style.shadowLayers??[],_=t.screenText.style.innerShadow??{color:"#000000",opacity:1,offset:10,angle:-45,feather:0},O=t.screenText.style.glow??Qe(),Le=t.screenText.style.bend??et(),xe=(l,n,W,m)=>e.jsxs("div",{style:rs,children:[e.jsxs("div",{style:as,children:[e.jsx("button",{type:"button",onClick:()=>K(f=>({...f,[l]:!f[l]})),style:cs,children:e.jsx("div",{style:hs(D[l])})}),e.jsxs("div",{style:ds,children:[e.jsx("span",{style:tt,children:W}),e.jsx("span",{children:n})]})]}),D[l]?e.jsx("div",{style:ps,children:m}):null]},l);return typeof document>"u"?null:ie.createPortal(e.jsxs("div",{style:{...ts,left:S.x,top:S.y},children:[e.jsx("style",{children:`
2
+ .xr-screen-text-settings-scroll::-webkit-scrollbar { width: 10px; }
3
+ .xr-screen-text-settings-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,0.06); border-radius: 999px; }
4
+ .xr-screen-text-settings-scroll::-webkit-scrollbar-thumb { background: rgba(148,163,184,0.55); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
5
+ .xr-screen-text-settings-scroll::-webkit-scrollbar-thumb:hover { background: rgba(226,232,240,0.68); background-clip: padding-box; }
6
+ `}),w?e.jsxs("div",{className:"xr-screen-text-settings-scroll",style:{...Ct,height:Lt},children:[e.jsxs("div",{style:ns,children:[e.jsx("div",{onPointerDown:Ft,style:ls,children:e.jsx(us,{})}),e.jsxs("div",{style:is,children:[e.jsx("span",{style:tt,children:e.jsx(fs,{})}),e.jsx("span",{children:"Screen Text"})]}),e.jsx("div",{style:{flex:"1 1 auto"}}),e.jsx("button",{type:"button",onClick:()=>j(!1),style:ke,children:e.jsx(bs,{})})]}),e.jsx("div",{style:os,children:xe("renderer","Text Renderer",e.jsx(st,{}),e.jsxs(e.Fragment,{children:[xe("content","Content",e.jsx(st,{}),e.jsxs("div",{style:U,children:[e.jsxs("label",{style:T,children:[e.jsx("span",{style:x,children:"Text"}),e.jsx("textarea",{style:ys,value:t.screenText.content.text,onChange:l=>g(n=>({...n,content:{...n.content,text:l.target.value}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Text Art"}),e.jsx("select",{style:J,value:t.screenText.textArtPreset,onChange:l=>g(n=>es(n,l.target.value)),children:Ut.map(l=>e.jsx("option",{value:l,children:Jt[l]},l))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Font"}),e.jsx("select",{style:J,value:t.screenText.style.fontFamily,onChange:l=>g(n=>({...n,style:{...n.style,fontFamily:l.target.value}})),children:Yt.map(l=>e.jsx("option",{value:l.value,children:l.label},l.value))})]})]})),xe("transformation","Transformation",e.jsx(ms,{}),e.jsx(vt,{value:nt(t.screenText.transformation),guideLabel:"Show Transform Guides",copyLabel:p,copyValue:{name:p??"Selected screen text",kind:"screenText",transform:nt(t.screenText.transformation),content:t.screenText.content,style:t.screenText.style,layout:t.screenText.layout,screenSpaceUI:t.screenSpaceUI},showRenderOrder:!1,onChange:l=>Mt(n=>vs(l,n))})),xe("style","Style",e.jsx(js,{}),e.jsxs("div",{style:U,children:[e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Text Color"}),e.jsx("input",{style:Q,type:"color",value:t.screenText.style.color,onChange:l=>g(n=>({...n,style:{...n.style,color:l.target.value}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Font Size"}),e.jsx(E,{value:t.screenText.style.fontSize,min:16,max:180,step:4,onChange:l=>g(n=>({...n,layout:{...n.layout,minFontSize:Math.min(n.layout.minFontSize??l,l)},style:{...n.style,fontSize:l}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Letter Spacing"}),e.jsx(E,{value:t.screenText.style.letterSpacing,min:0,max:1,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,letterSpacing:l}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Line Spacing"}),e.jsx(E,{value:t.screenText.style.lineSpacing,min:0,max:1,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,lineSpacing:l}}))})]}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Bold"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.bold===!0,onChange:l=>g(n=>({...n,style:{...n.style,bold:l.target.checked}}))})]})}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Italic"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.fontStyle==="italic",onChange:l=>g(n=>({...n,style:{...n.style,fontStyle:l.target.checked?"italic":"normal"}}))})]})}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Underline"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.underline===!0,onChange:l=>g(n=>({...n,style:{...n.style,underline:l.target.checked}}))})]})}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Outline"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.outlineEnabled!==!1,onChange:l=>g(n=>({...n,style:{...n.style,outlineEnabled:l.target.checked}}))})]})}),t.screenText.style.outlineEnabled!==!1?e.jsxs("div",{style:ge,children:[e.jsxs("button",{type:"button",style:be,onClick:()=>o(l=>!l),children:[e.jsxs("span",{style:ue,children:[e.jsx(je,{}),e.jsx("span",{children:"Outline Editor"})]}),e.jsx("span",{style:fe,children:r?"−":"+"})]}),r?e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{...F,gridColumn:"1 / -1"},children:[e.jsxs("span",{style:x,children:["Layers: ",Ae.length]}),e.jsx("button",{type:"button",style:ke,onClick:()=>g(l=>({...l,style:{...l.style,strokeLayers:[...l.style.strokeLayers??[],qt()]}})),children:"+"})]}),Ae.length>0?Ae.map((l,n)=>e.jsxs("div",{style:{gridColumn:"1 / -1",display:"grid",gap:6,padding:"8px",borderRadius:10,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)"},children:[e.jsxs("div",{style:F,children:[e.jsxs("span",{style:x,children:["Outline ",n+1]}),e.jsx("button",{type:"button",style:ke,onClick:()=>g(W=>({...W,style:{...W.style,strokeLayers:(W.style.strokeLayers??[]).filter((m,f)=>f!==n)}})),children:"×"})]}),e.jsxs("div",{style:U,children:[e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Outline Color"}),e.jsx("input",{style:Q,type:"color",value:l.color,onChange:W=>g(m=>{const f=[...m.style.strokeLayers??[]];return f[n]={...f[n],color:W.target.value},{...m,style:{...m.style,strokeLayers:f}}})})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Outline Opacity"}),e.jsx(E,{value:l.opacity??1,min:0,max:1,step:.05,onChange:W=>g(m=>{const f=[...m.style.strokeLayers??[]];return f[n]={...f[n],opacity:W},{...m,style:{...m.style,strokeLayers:f}}})})]}),e.jsxs("label",{style:T,children:[e.jsx("span",{style:x,children:"Outline Size"}),e.jsx(E,{value:l.width,min:0,max:100,step:1,onChange:W=>g(m=>{const f=[...m.style.strokeLayers??[]];return f[n]={...f[n],width:W},{...m,style:{...m.style,strokeLayers:f}}})})]})]})]},n)):e.jsx("div",{style:{...x,gridColumn:"1 / -1"},children:"No outlines. Use `+` to add one."})]}):null]}):null,e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Outer Shadow"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.shadowEnabled!==!1,onChange:l=>g(n=>{var W;return{...n,style:{...n.style,shadowEnabled:l.target.checked,shadowLayers:l.target.checked&&(((W=n.style.shadowLayers)==null?void 0:W.length)??0)===0?[De()]:n.style.shadowLayers}}})})]})}),t.screenText.style.shadowEnabled!==!1?e.jsxs("div",{style:ge,children:[e.jsxs("button",{type:"button",style:be,onClick:()=>d(l=>!l),children:[e.jsxs("span",{style:ue,children:[e.jsx(je,{}),e.jsx("span",{children:"Shadow Editor"})]}),e.jsx("span",{style:fe,children:v?"−":"+"})]}),v?e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{...F,gridColumn:"1 / -1"},children:[e.jsxs("span",{style:x,children:["Layers: ",Ne.length]}),e.jsx("button",{type:"button",style:ke,onClick:()=>g(l=>({...l,style:{...l.style,shadowLayers:[...l.style.shadowLayers??[],De()]}})),children:"+"})]}),Ne.length>0?Ne.map((l,n)=>e.jsxs("div",{style:{gridColumn:"1 / -1",display:"grid",gap:6,padding:"8px",borderRadius:10,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)"},children:[e.jsxs("div",{style:F,children:[e.jsxs("span",{style:x,children:["Shadow ",n+1]}),e.jsx("button",{type:"button",style:ke,onClick:()=>g(W=>({...W,style:{...W.style,shadowLayers:(W.style.shadowLayers??[]).filter((m,f)=>f!==n)}})),children:"×"})]}),e.jsxs("div",{style:U,children:[e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Color"}),e.jsx("input",{style:Q,type:"color",value:l.color,onChange:W=>g(m=>{const f=[...m.style.shadowLayers??[]];return f[n]={...f[n],color:W.target.value},{...m,style:{...m.style,shadowLayers:f}}})})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Opacity"}),e.jsx(E,{value:l.opacity??1,min:0,max:1,step:.05,onChange:W=>g(m=>{const f=[...m.style.shadowLayers??[]];return f[n]={...f[n],opacity:W},{...m,style:{...m.style,shadowLayers:f}}})})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Offset"}),e.jsx(E,{value:l.offset??10,min:0,max:100,step:1,onChange:W=>g(m=>{const f=[...m.style.shadowLayers??[]];return f[n]={...f[n],offset:W},{...m,style:{...m.style,shadowLayers:f}}})})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Angle"}),e.jsx(E,{value:l.angle??-45,min:-180,max:180,step:1,onChange:W=>g(m=>{const f=[...m.style.shadowLayers??[]];return f[n]={...f[n],angle:W},{...m,style:{...m.style,shadowLayers:f}}})})]}),e.jsxs("label",{style:T,children:[e.jsx("span",{style:x,children:"Shadow Feather"}),e.jsx(E,{value:l.feather??0,min:0,max:1,step:.05,onChange:W=>g(m=>{const f=[...m.style.shadowLayers??[]];return f[n]={...f[n],feather:W},{...m,style:{...m.style,shadowLayers:f}}})})]})]})]},n)):e.jsx("div",{style:{...x,gridColumn:"1 / -1"},children:"No outer shadows. Use `+` to add one."})]}):null]}):null,e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Inner Shadow"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.innerShadowEnabled===!0,onChange:l=>g(n=>({...n,style:{...n.style,innerShadowEnabled:l.target.checked,innerShadow:n.style.innerShadow??{color:"#000000",opacity:1,offset:10,angle:-45,feather:0}}}))})]})}),t.screenText.style.innerShadowEnabled===!0?e.jsxs("div",{style:ge,children:[e.jsxs("button",{type:"button",style:be,onClick:()=>a(l=>!l),children:[e.jsxs("span",{style:ue,children:[e.jsx(je,{}),e.jsx("span",{children:"Inner Shadow"})]}),e.jsx("span",{style:fe,children:y?"−":"+"})]}),y?e.jsxs("div",{style:U,children:[e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Color"}),e.jsx("input",{style:Q,type:"color",value:_.color,onChange:l=>g(n=>({...n,style:{...n.style,innerShadow:{...n.style.innerShadow??_,color:l.target.value}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Opacity"}),e.jsx(E,{value:_.opacity??1,min:0,max:1,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,innerShadow:{...n.style.innerShadow??_,opacity:l}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Offset"}),e.jsx(E,{value:_.offset??10,min:0,max:100,step:1,onChange:l=>g(n=>({...n,style:{...n.style,innerShadow:{...n.style.innerShadow??_,offset:l}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Shadow Angle"}),e.jsx(E,{value:_.angle??-45,min:-180,max:180,step:1,onChange:l=>g(n=>({...n,style:{...n.style,innerShadow:{...n.style.innerShadow??_,angle:l}}}))})]}),e.jsxs("label",{style:T,children:[e.jsx("span",{style:x,children:"Shadow Feather"}),e.jsx(E,{value:_.feather??0,min:0,max:1,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,innerShadow:{...n.style.innerShadow??_,feather:l}}}))})]})]}):null]}):null,e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Glow"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.glowEnabled===!0,onChange:l=>g(n=>({...n,style:{...n.style,glowEnabled:l.target.checked,glow:n.style.glow??Qe()}}))})]})}),t.screenText.style.glowEnabled===!0?e.jsxs("div",{style:ge,children:[e.jsxs("button",{type:"button",style:be,onClick:()=>s(l=>!l),children:[e.jsxs("span",{style:ue,children:[e.jsx(je,{}),e.jsx("span",{children:"Glow"})]}),e.jsx("span",{style:fe,children:h?"−":"+"})]}),h?e.jsxs("div",{style:U,children:[e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Color"}),e.jsx("input",{style:Q,type:"color",value:O.color,onChange:l=>g(n=>({...n,style:{...n.style,glow:{...n.style.glow??O,color:l.target.value}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Style"}),e.jsxs("select",{style:J,value:O.style,onChange:l=>g(n=>({...n,style:{...n.style,glow:{...n.style.glow??O,style:l.target.value}}})),children:[e.jsx("option",{value:"outward",children:"Outward"}),e.jsx("option",{value:"contoured",children:"Contoured"})]})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Intensity"}),e.jsx(E,{value:O.intensity??.5,min:0,max:1,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,glow:{...n.style.glow??O,intensity:l}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Range"}),e.jsx(E,{value:O.range??.5,min:0,max:1,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,glow:{...n.style.glow??O,range:l}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Horizontal Angle"}),e.jsx(E,{value:O.horizontalAngle??0,min:-.5,max:.5,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,glow:{...n.style.glow??O,horizontalAngle:l}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Vertical Angle"}),e.jsx(E,{value:O.verticalAngle??0,min:-.5,max:.5,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,glow:{...n.style.glow??O,verticalAngle:l}}}))})]})]}):null]}):null,e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Bend"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.bendEnabled===!0,onChange:l=>g(n=>({...n,style:{...n.style,bendEnabled:l.target.checked,bend:n.style.bend??et()}}))})]})}),t.screenText.style.bendEnabled===!0?e.jsxs("div",{style:ge,children:[e.jsxs("button",{type:"button",style:be,onClick:()=>I(l=>!l),children:[e.jsxs("span",{style:ue,children:[e.jsx(je,{}),e.jsx("span",{children:"Bend"})]}),e.jsx("span",{style:fe,children:b?"−":"+"})]}),b?e.jsxs("div",{style:U,children:[e.jsxs("label",{style:T,children:[e.jsx("span",{style:x,children:"Bend Preset"}),e.jsx("select",{style:J,value:Le.preset,onChange:l=>g(n=>({...n,style:{...n.style,bend:{...n.style.bend??Le,preset:l.target.value}}})),children:Qt.map(l=>e.jsx("option",{value:l.value,children:l.label},l.value))})]}),e.jsxs("label",{style:T,children:[e.jsx("span",{style:x,children:"Bend Strength"}),e.jsx(E,{value:Le.strength,min:-100,max:100,step:1,onChange:l=>g(n=>({...n,style:{...n.style,bend:{...n.style.bend??Le,strength:l}}}))})]})]}):null]}):null,e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Background Enabled"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.background.enabled,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,enabled:l.target.checked}}}))})]})}),t.screenText.style.background.enabled?e.jsxs("div",{style:ge,children:[e.jsxs("button",{type:"button",style:be,onClick:()=>C(l=>!l),children:[e.jsxs("span",{style:ue,children:[e.jsx(je,{}),e.jsx("span",{children:"Background Settings"})]}),e.jsx("span",{style:fe,children:N?"−":"+"})]}),N?e.jsxs(e.Fragment,{children:[e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Fill Mode"}),e.jsxs("select",{style:J,value:t.screenText.style.background.fillMode,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,fillMode:l.target.value}}})),children:[e.jsx("option",{value:"solid",children:"solid"}),e.jsx("option",{value:"gradient",children:"gradient"})]})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Fill Area"}),e.jsxs("select",{style:J,value:t.screenText.style.background.fit,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,fit:l.target.value}}})),children:[e.jsx("option",{value:"text",children:"text"}),e.jsx("option",{value:"full",children:"full"})]})]}),t.screenText.style.background.fillMode==="solid"?e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Background Color"}),e.jsx("input",{style:Q,type:"color",value:t.screenText.style.background.color,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,color:l.target.value}}}))})]}):e.jsx("div",{style:{gridColumn:"1 / -1",display:"grid",gap:6},children:t.screenText.style.background.gradientStops.slice(0,3).map((l,n)=>e.jsxs("label",{style:z,children:[e.jsxs("span",{style:x,children:["Gradient ",n+1]}),e.jsxs("div",{style:{display:"grid",gridTemplateColumns:"1fr 60px",gap:4},children:[e.jsx("input",{style:Q,type:"color",value:l.color,onChange:W=>g(m=>{const f=[...m.style.background.gradientStops];return f[n]={...f[n],color:W.target.value},{...m,style:{...m.style,background:{...m.style.background,gradientStops:f}}}})}),e.jsx(E,{value:l.position,min:0,max:1,step:.05,onChange:W=>g(m=>{const f=[...m.style.background.gradientStops];return f[n]={...f[n],position:W},{...m,style:{...m.style,background:{...m.style.background,gradientStops:f}}}})})]})]},n))}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Background Opacity"}),e.jsx(E,{value:t.screenText.style.background.opacity,min:0,max:1,step:.05,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,opacity:l}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Corner Radius"}),e.jsx(E,{value:t.screenText.style.background.borderRadius,min:0,max:200,step:2,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,borderRadius:l}}}))})]}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Background Stroke"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.background.borderEnabled,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,borderEnabled:l.target.checked,borderColor:l.target.checked&&n.style.background.borderColor==="transparent"?"#ffffff":n.style.background.borderColor,borderWidth:l.target.checked?Math.max(n.style.background.borderWidth,2):n.style.background.borderWidth}}}))})]})}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Stroke Color"}),e.jsx("input",{style:{...Q,...t.screenText.style.background.borderEnabled?{}:zt},type:"color",value:t.screenText.style.background.borderColor,disabled:!t.screenText.style.background.borderEnabled,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,borderColor:l.target.value}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Stroke Width"}),e.jsx(E,{value:t.screenText.style.background.borderWidth,min:0,max:64,step:1,disabled:!t.screenText.style.background.borderEnabled,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,borderWidth:l}}}))})]}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Auto Width / Height"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.style.background.autoSize,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,autoSize:l.target.checked}}}))})]})}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Width"}),e.jsx(E,{value:t.screenText.style.background.width,min:32,max:1024,step:8,disabled:t.screenText.style.background.autoSize,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,width:l}}}))})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Height"}),e.jsx(E,{value:t.screenText.style.background.height,min:32,max:1024,step:8,disabled:t.screenText.style.background.autoSize,onChange:l=>g(n=>({...n,style:{...n.style,background:{...n.style.background,height:l}}}))})]})]}):null]}):null]})),xe("layout","Layout",e.jsx(ws,{}),e.jsxs("div",{style:U,children:[e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Text Align"}),e.jsxs("select",{style:J,value:t.screenText.layout.textAlign??"center",onChange:l=>g(n=>({...n,layout:{...n.layout,textAlign:l.target.value}})),children:[e.jsx("option",{value:"left",children:"left"}),e.jsx("option",{value:"center",children:"center"}),e.jsx("option",{value:"right",children:"right"})]})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Y Position"}),e.jsxs("select",{style:J,value:t.screenText.layout.verticalAlign??"center",onChange:l=>g(n=>({...n,layout:{...n.layout,verticalAlign:l.target.value}})),children:[e.jsx("option",{value:"top",children:"top"}),e.jsx("option",{value:"center",children:"center"}),e.jsx("option",{value:"bottom",children:"bottom"})]})]}),e.jsxs("label",{style:z,children:[e.jsx("span",{style:x,children:"Overflow"}),e.jsxs("select",{style:J,value:t.screenText.layout.overflow,onChange:l=>g(n=>({...n,layout:{...n.layout,overflow:l.target.value}})),children:[e.jsx("option",{value:"clip",children:"clip"}),e.jsx("option",{value:"ellipsis",children:"ellipsis"}),e.jsx("option",{value:"clamp",children:"clamp"}),e.jsx("option",{value:"shrink",children:"shrink"})]})]}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Resize To Fit"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.layout.resizeToFit===!0,onChange:l=>g(n=>({...n,layout:{...n.layout,resizeToFit:l.target.checked}}))})]})})]})),xe("visibility","Visibility",e.jsx(Ss,{}),e.jsxs("div",{style:U,children:[e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Enable UI"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenSpaceUI.enabled,onChange:l=>i({...t,screenSpaceUI:{...t.screenSpaceUI,enabled:l.target.checked}})})]})}),e.jsx("label",{style:T,children:e.jsxs("div",{style:F,children:[e.jsx("span",{style:x,children:"Enable Text"}),e.jsx("input",{type:"checkbox",style:B,checked:t.screenText.enabled,onChange:l=>g(n=>({...n,enabled:l.target.checked}))})]})})]}))]}))})]}):e.jsx("div",{role:"button",tabIndex:0,onClick:()=>j(!0),style:ss,children:e.jsx(gs,{})})]}),document.body)},zs="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAtAAAAUAAgMAAAAToI2uAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAlQTFRFqampbGxsAAAA/lGquwAAAAN0Uk5T//8A18oNQQAABPRJREFUeJztzssNQWEYQEG3CP1oQqJGsdCfBFs7j8X8+eRMBbPtBtpWB35RWimtlFZKK6WV0kppZWj6uLrwrceltFFaKa2UVkorpZXSSmlldPp2XT350P5Q2iitlFZKK6WV0kpppbRSWimtlFZKK3+RPq8OvXM/lTZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK6WV0kpppbRSWimtlFZKK3+THqG0UloprZRWSiulldJKaaW0UloprZRWSiuv6VFKK6WV0kpppbRSWimtlFbGpgcqrZRWSiulldJKaaW0MjL9BFWtRqVFuJpUAAAAAElFTkSuQmCC",Rs={placeholder:"Placeholder","hero-image":"Hero Image","photo-frame":"Default Frame"},Ws=Object.entries(Rs).map(([t,i])=>({value:t,label:i})),Is={placeholder:{transformation:{showFitGuides:!1},image:{sourceKind:"default",stretchMode:"fit",materialType:"unlit",blendMode:"normal",opacity:1,color:"#ffffff",flipX:!1,flipY:!1,transparent:!0,alphaTest:0}},"hero-image":{transformation:{position:{x:0,y:.08},size:{width:.96,height:.62},rotation:0,pivot:[.5,.5],overlay:!0,visible:!0},image:{sourceKind:"image",stretchMode:"fillAndCut",materialType:"unlit",blendMode:"normal",opacity:1,color:"#ffffff",flipX:!1,flipY:!1,transparent:!0,alphaTest:0}},"photo-frame":{transformation:{position:{x:0,y:.01},size:{width:2,height:2},rotation:0,pivot:[.5,.5],overlay:!0,visible:!0},image:{sourceKind:"image",src:zs,stretchMode:"fill",materialType:"unlit",blendMode:"normal",opacity:1,color:"#ffffff",flipX:!1,flipY:!1,transparent:!0,alphaTest:0}}},Es=(t,i)=>{const p=Is[i];return{...t,preset:i,...p.enabled!==void 0?{enabled:p.enabled}:{},transformation:{...t.transformation,...p.transformation??{}},image:{...t.image,...p.image??{}}}},Ts={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},Te={display:"flex",flexDirection:"column",gap:4},Ls={...Te,gridColumn:"1 / -1"},ve={fontSize:9,color:"rgba(226,232,240,0.72)"},Je={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},lt={...Je,appearance:"none"},Fs={...Je,fontVariantNumeric:"tabular-nums"},Ms={...Je,padding:2,cursor:"pointer"},Hs=t=>/^-?\d*(\.\d*)?$/.test(t),it=({value:t,onChange:i,step:p=1,min:w,max:j})=>{const[S,R]=c.useState(String(t));c.useEffect(()=>R(String(t)),[t]);const k=u=>{let r=u;return typeof w=="number"&&(r=Math.max(w,r)),typeof j=="number"&&(r=Math.min(j,r)),r};return e.jsx("input",{type:"text",inputMode:"decimal",pattern:"-?[0-9]*[.,]?[0-9]*",style:Fs,value:S,onChange:u=>{const r=u.target.value;if(!Hs(r)||(R(r),r===""||r==="-"||r==="."||r==="-."))return;const o=Number(r);Number.isNaN(o)||i(k(o))},onBlur:()=>{const u=Number(S);if(Number.isNaN(u)){R(String(t));return}const r=k(u);R(String(r)),i(r)},onKeyDown:u=>{if(u.key!=="ArrowUp"&&u.key!=="ArrowDown")return;u.preventDefault();const r=u.shiftKey?p*10:u.altKey?p/10:p,o=u.key==="ArrowUp"?t+r:t-r;i(k(Number.isInteger(o)?o:Number(o.toFixed(6))))}})},Ks=({value:t,onChange:i})=>e.jsxs("div",{style:Ts,children:[e.jsxs("label",{style:Te,children:[e.jsx("span",{style:ve,children:"Material Type"}),e.jsxs("select",{style:lt,value:t.materialType,onChange:p=>i({...t,materialType:p.target.value}),children:[e.jsx("option",{value:"unlit",children:"Unlit"}),e.jsx("option",{value:"standardPBR",children:"Standard PBR"}),e.jsx("option",{value:"matcap",children:"Matcap"})]})]}),e.jsxs("label",{style:Te,children:[e.jsx("span",{style:ve,children:"Blend Mode"}),e.jsxs("select",{style:lt,value:t.blendMode,onChange:p=>i({...t,blendMode:p.target.value}),children:[e.jsx("option",{value:"normal",children:"Normal"}),e.jsx("option",{value:"add",children:"Add"}),e.jsx("option",{value:"subtract",children:"Subtract"}),e.jsx("option",{value:"multiply",children:"Multiply"}),e.jsx("option",{value:"screen",children:"Screen"}),e.jsx("option",{value:"lighten",children:"Lighten"}),e.jsx("option",{value:"darken",children:"Darken"}),e.jsx("option",{value:"overlay",children:"Overlay"}),e.jsx("option",{value:"softLight",children:"Soft Light"}),e.jsx("option",{value:"hardLight",children:"Hard Light"}),e.jsx("option",{value:"difference",children:"Difference"}),e.jsx("option",{value:"exclusion",children:"Exclusion"})]})]}),e.jsxs("label",{style:Te,children:[e.jsx("span",{style:ve,children:"Opacity"}),e.jsx(it,{value:t.opacity,min:0,max:1,step:.01,onChange:p=>i({...t,opacity:p})})]}),e.jsxs("label",{style:Te,children:[e.jsx("span",{style:ve,children:"Tint"}),e.jsx("input",{type:"color",style:Ms,value:t.color,onChange:p=>i({...t,color:p.target.value})})]}),e.jsxs("label",{style:Ls,children:[e.jsx("span",{style:ve,children:"Alpha Test"}),e.jsx(it,{value:t.alphaTest,min:0,max:1,step:.01,onChange:p=>i({...t,alphaTest:p})})]})]}),Bs={position:"fixed",left:14,top:104,zIndex:2e4,pointerEvents:"none"},Rt={pointerEvents:"auto",width:298,borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflowX:"hidden",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},$s={...Rt,width:32,height:32,borderRadius:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},Vs={position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:7,padding:"7px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)"},As={width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},Ns={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:600,minWidth:0},ot={display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},Ds={display:"grid",gap:6,padding:7},Os={borderRadius:12,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)",overflow:"hidden"},Ps={display:"flex",alignItems:"center",gap:7,padding:"6px 7px"},Zs={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:500,flex:"1 1 auto",minWidth:0},_s={width:28,height:16,borderRadius:999,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.08)",padding:2,display:"flex",alignItems:"center",cursor:"pointer",flex:"0 0 auto"},Xs=t=>({width:10,height:10,borderRadius:999,background:t?"#f8fafc":"rgba(148,163,184,0.7)",transform:t?"translateX(12px)":"translateX(0)",transition:"transform 140ms ease, background 140ms ease"}),Gs={display:"grid",gap:7,padding:"0 7px 7px"},Ys={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},Ge={display:"flex",flexDirection:"column",gap:4},ee={...Ge,gridColumn:"1 / -1"},G={fontSize:9,color:"rgba(226,232,240,0.72)"},Us={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},rt={...Us,appearance:"none"},te={display:"flex",alignItems:"center",justifyContent:"space-between",gap:12,minHeight:24},se={width:16,height:16},at={display:"inline-flex",alignItems:"center",justifyContent:"center",width:24,height:24,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.05)",color:"#e2e8f0",cursor:"pointer",padding:0,flex:"0 0 auto"},Js=()=>e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 10h10v2H7v-2zm0 4h10v2H7v-2zm0-8h10v2H7V6z"})}),qs=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M18.3 5.71 12 12l6.3 6.29-1.41 1.41L10.59 13.41 4.29 19.7 2.88 18.29 9.17 12 2.88 5.71 4.29 4.3l6.3 6.29 6.29-6.3z"})}),Qs=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M8 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"})}),dt=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M5 4h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2zm0 2v8.76l4.5-4.5 3.2 3.2 2.8-2.8L19 14.16V6H5zm12 3a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"})}),en=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M11 2h2v4h3l-4 4-4-4h3V2zm0 20v-4H8l4-4 4 4h-3v4h-2zM2 11h4V8l4 4-4 4v-3H2v-2zm20 0v2h-4v3l-4-4 4-4v3h4z"})}),tn=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 7h10a5 5 0 1 1 0 10H7A5 5 0 1 1 7 7zm0 2a3 3 0 1 0 0 6h10a3 3 0 1 0 0-6H7z"})}),sn=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 5V2L7 7l5 5V9a4 4 0 1 1-4 4H6a6 6 0 1 0 6-8z"})}),ct=t=>({enabled:t.enabled,showGuides:t.showFitGuides,coordinateSpace:t.coordinateSpace,canvasSize:t.canvasSize,position:t.position,size:t.size,rotation:t.rotation,pivot:t.pivot,renderOrder:t.renderOrder,overlay:t.overlay,visible:t.visible}),nn=(t,i)=>({...i,enabled:t.enabled,showFitGuides:t.showGuides,coordinateSpace:t.coordinateSpace,canvasSize:t.canvasSize,position:t.position,size:t.size,rotation:t.rotation,pivot:t.pivot,renderOrder:t.renderOrder,overlay:t.overlay,visible:t.visible}),ln=({value:t,onChange:i,copyLabel:p})=>{const[w,j]=c.useState(!0),[S,R]=c.useState({x:14,y:104}),[k,u]=c.useState(typeof window>"u"?0:window.innerHeight),[r,o]=c.useState({transformation:!0,image:!0,visibility:!1}),v=c.useRef(null),d=Math.max(240,k-S.y-16);c.useEffect(()=>{const a=I=>{v.current&&R({x:Math.max(8,I.clientX-v.current.x),y:Math.max(8,I.clientY-v.current.y)})},b=()=>{v.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",a),window.addEventListener("pointerup",b),()=>{window.removeEventListener("pointermove",a),window.removeEventListener("pointerup",b)}},[]),c.useEffect(()=>{const a=()=>u(window.innerHeight);return window.addEventListener("resize",a),()=>window.removeEventListener("resize",a)},[]);const h=a=>{const b=a.currentTarget.getBoundingClientRect();v.current={x:a.clientX-b.left,y:a.clientY-b.top},document.body.classList.add("select-none"),a.currentTarget.setPointerCapture(a.pointerId)},s=a=>{i({...t,screenImage:a(t.screenImage)})},y=(a,b,I,N)=>e.jsxs("div",{style:Os,children:[e.jsxs("div",{style:Ps,children:[e.jsx("button",{type:"button",onClick:()=>o(C=>({...C,[a]:!C[a]})),style:_s,children:e.jsx("div",{style:Xs(r[a])})}),e.jsxs("div",{style:Zs,children:[e.jsx("span",{style:ot,children:I}),e.jsx("span",{children:b})]})]}),r[a]?e.jsx("div",{style:Gs,children:N}):null]},a);return typeof document>"u"?null:ie.createPortal(e.jsxs("div",{style:{...Bs,left:S.x,top:S.y},children:[e.jsx("style",{children:`
7
+ .xr-screen-image-settings-scroll::-webkit-scrollbar { width: 10px; }
8
+ .xr-screen-image-settings-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,0.06); border-radius: 999px; }
9
+ .xr-screen-image-settings-scroll::-webkit-scrollbar-thumb { background: rgba(148,163,184,0.55); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
10
+ .xr-screen-image-settings-scroll::-webkit-scrollbar-thumb:hover { background: rgba(226,232,240,0.68); background-clip: padding-box; }
11
+ `}),w?e.jsxs("div",{className:"xr-screen-image-settings-scroll",style:{...Rt,height:d},children:[e.jsxs("div",{style:Vs,children:[e.jsx("div",{onPointerDown:h,style:As,children:e.jsx(Qs,{})}),e.jsxs("div",{style:Ns,children:[e.jsx("span",{style:ot,children:e.jsx(dt,{})}),e.jsx("span",{children:"Screen Image"})]}),e.jsx("div",{style:{flex:"1 1 auto"}}),e.jsx("button",{type:"button",onClick:()=>i(Kt.DEFAULT_SCREEN_IMAGE_SCENE_SETTINGS),style:at,children:e.jsx(sn,{})}),e.jsx("button",{type:"button",onClick:()=>j(!1),style:at,children:e.jsx(qs,{})})]}),e.jsxs("div",{style:Ds,children:[y("transformation","Transformation",e.jsx(en,{}),e.jsx(vt,{value:ct(t.screenImage.transformation),guideLabel:"Show Fit Guides",copyLabel:p,copyValue:{name:p??"Selected screen image",kind:"screenImage",transform:ct(t.screenImage.transformation),image:t.screenImage.image,material:{materialType:t.screenImage.image.materialType,blendMode:t.screenImage.image.blendMode,opacity:t.screenImage.image.opacity,color:t.screenImage.image.color,alphaTest:t.screenImage.image.alphaTest,transparent:t.screenImage.image.transparent},screenSpaceUI:t.screenSpaceUI},showRenderOrder:!1,onChange:a=>s(b=>({...b,transformation:nn(a,b.transformation)}))})),y("image","Image",e.jsx(dt,{}),e.jsxs("div",{style:{display:"grid",gap:6},children:[e.jsxs("label",{style:Ge,children:[e.jsx("span",{style:G,children:"Preset"}),e.jsx("select",{style:rt,value:t.screenImage.preset,onChange:a=>s(b=>Es(b,a.target.value)),children:Ws.map(a=>e.jsx("option",{value:a.value,children:a.label},a.value))})]}),e.jsxs("label",{style:Ge,children:[e.jsx("span",{style:G,children:"Stretch Mode"}),e.jsxs("select",{style:rt,value:t.screenImage.image.stretchMode,onChange:a=>s(b=>({...b,image:{...b.image,stretchMode:a.target.value}})),children:[e.jsx("option",{value:"fit",children:"Fit"}),e.jsx("option",{value:"fitWidth",children:"Fit Width"}),e.jsx("option",{value:"fitHeight",children:"Fit Height"}),e.jsx("option",{value:"stretch",children:"Stretch"}),e.jsx("option",{value:"fill",children:"Fill"}),e.jsx("option",{value:"fillAndCut",children:"Fill and Cut"})]})]}),e.jsx(Ks,{value:t.screenImage.image,onChange:a=>s(b=>({...b,image:{...b.image,materialType:a.materialType,blendMode:a.blendMode,opacity:a.opacity,color:a.color,alphaTest:a.alphaTest}}))})]})),y("visibility","Visibility",e.jsx(tn,{}),e.jsxs("div",{style:Ys,children:[e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"ScreenSpaceUI Enabled"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenSpaceUI.enabled,onChange:a=>i({...t,screenSpaceUI:{enabled:a.target.checked}})})]})}),e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"Screen Image Enabled"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenImage.enabled,onChange:a=>s(b=>({...b,enabled:a.target.checked}))})]})}),e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"Transformation Enabled"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenImage.transformation.enabled,onChange:a=>s(b=>({...b,transformation:{...b.transformation,enabled:a.target.checked}}))})]})}),e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"Visible"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenImage.transformation.visible,onChange:a=>s(b=>({...b,transformation:{...b.transformation,visible:a.target.checked}}))})]})}),e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"Overlay"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenImage.transformation.overlay,onChange:a=>s(b=>({...b,transformation:{...b.transformation,overlay:a.target.checked}}))})]})}),e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"Flip X"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenImage.image.flipX,onChange:a=>s(b=>({...b,image:{...b.image,flipX:a.target.checked}}))})]})}),e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"Flip Y"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenImage.image.flipY,onChange:a=>s(b=>({...b,image:{...b.image,flipY:a.target.checked}}))})]})}),e.jsx("label",{style:ee,children:e.jsxs("div",{style:te,children:[e.jsx("span",{style:G,children:"Transparent"}),e.jsx("input",{type:"checkbox",style:se,checked:t.screenImage.image.transparent,onChange:a=>s(b=>({...b,image:{...b.image,transparent:a.target.checked}}))})]})})]}))]})]}):e.jsx("div",{role:"button",tabIndex:0,onClick:()=>j(!0),style:$s,children:e.jsx(Js,{})})]}),document.body)},on={position:"fixed",left:14,top:104,zIndex:2e4,pointerEvents:"none"},Wt={pointerEvents:"auto",width:286,borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflowX:"hidden",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},rn={...Wt,width:32,height:32,borderRadius:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},an={position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:7,padding:"7px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)"},dn={width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},cn={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:600,minWidth:0},ht={display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},hn={display:"grid",gap:6,padding:7},pn={borderRadius:12,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)",overflow:"hidden"},yn={display:"flex",alignItems:"center",gap:7,padding:"6px 7px"},xn={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:500,flex:"1 1 auto",minWidth:0},gn={width:28,height:16,borderRadius:999,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.08)",padding:2,display:"flex",alignItems:"center",cursor:"pointer",flex:"0 0 auto"},bn=t=>({width:10,height:10,borderRadius:999,background:t?"#f8fafc":"rgba(148,163,184,0.7)",transform:t?"translateX(12px)":"translateX(0)",transition:"transform 140ms ease, background 140ms ease"}),un={display:"grid",gap:7,padding:"0 7px 7px"},fn={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},ye={display:"flex",flexDirection:"column",gap:4},Ce={...ye,gridColumn:"1 / -1"},Z={fontSize:9,color:"rgba(226,232,240,0.72)"},me={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},ze={display:"flex",alignItems:"center",justifyContent:"space-between",gap:12,minHeight:24},Re={width:16,height:16},pt={display:"inline-flex",alignItems:"center",justifyContent:"center",width:24,height:24,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.05)",color:"#e2e8f0",cursor:"pointer",padding:0,flex:"0 0 auto"},jn=()=>e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 10h10v2H7v-2zm0 4h10v2H7v-2zm0-8h10v2H7V6z"})}),mn=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M18.3 5.71 12 12l6.3 6.29-1.41 1.41L10.59 13.41 4.29 19.7 2.88 18.29 9.17 12 2.88 5.71 4.29 4.3l6.3 6.29 6.29-6.3z"})}),wn=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M8 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"})}),Oe=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M11 2a1 1 0 0 1 1 1v6h1V3a1 1 0 1 1 2 0v6h1V4a1 1 0 1 1 2 0v7.3l1.6 2.4a5 5 0 0 1 .8 2.7V18a4 4 0 0 1-4 4H9a6 6 0 0 1-6-6v-3.5a2.5 2.5 0 0 1 5 0V15h1V3a1 1 0 0 1 1-1z"})}),Sn=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 5V2L7 7l5 5V9a4 4 0 1 1-4 4H6a6 6 0 1 0 6-8z"})}),kn=({value:t,onChange:i})=>{const[p,w]=c.useState(!0),[j,S]=c.useState({x:14,y:104}),[R,k]=c.useState(typeof window>"u"?0:window.innerHeight),[u,r]=c.useState({overlay:!0,visibility:!1}),o=c.useRef(null),v=Math.max(240,R-j.y-16);c.useEffect(()=>{const s=a=>{o.current&&S({x:Math.max(8,a.clientX-o.current.x),y:Math.max(8,a.clientY-o.current.y)})},y=()=>{o.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",s),window.addEventListener("pointerup",y),()=>{window.removeEventListener("pointermove",s),window.removeEventListener("pointerup",y)}},[]),c.useEffect(()=>{const s=()=>k(window.innerHeight);return window.addEventListener("resize",s),()=>window.removeEventListener("resize",s)},[]);const d=s=>{const y=s.currentTarget.getBoundingClientRect();o.current={x:s.clientX-y.left,y:s.clientY-y.top},document.body.classList.add("select-none"),s.currentTarget.setPointerCapture(s.pointerId)},h=(s,y,a,b)=>e.jsxs("div",{style:pn,children:[e.jsxs("div",{style:yn,children:[e.jsx("button",{type:"button",onClick:()=>r(I=>({...I,[s]:!I[s]})),style:gn,children:e.jsx("div",{style:bn(u[s])})}),e.jsxs("div",{style:xn,children:[e.jsx("span",{style:ht,children:a}),e.jsx("span",{children:y})]})]}),u[s]?e.jsx("div",{style:un,children:b}):null]},s);return typeof document>"u"?null:ie.createPortal(e.jsxs("div",{style:{...on,left:j.x,top:j.y},children:[e.jsx("style",{children:`
12
+ .xr-hand-tracking-2d-scroll::-webkit-scrollbar { width: 10px; }
13
+ .xr-hand-tracking-2d-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,0.06); border-radius: 999px; }
14
+ .xr-hand-tracking-2d-scroll::-webkit-scrollbar-thumb { background: rgba(148,163,184,0.55); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
15
+ .xr-hand-tracking-2d-scroll::-webkit-scrollbar-thumb:hover { background: rgba(226,232,240,0.68); background-clip: padding-box; }
16
+ `}),p?e.jsxs("div",{className:"xr-hand-tracking-2d-scroll",style:{...Wt,height:v},children:[e.jsxs("div",{style:an,children:[e.jsx("div",{onPointerDown:d,style:dn,children:e.jsx(wn,{})}),e.jsxs("div",{style:cn,children:[e.jsx("span",{style:ht,children:e.jsx(Oe,{})}),e.jsx("span",{children:"HandTracking2D"})]}),e.jsx("div",{style:{flex:"1 1 auto"}}),e.jsx("button",{type:"button",onClick:()=>i(Dt),style:pt,children:e.jsx(Sn,{})}),e.jsx("button",{type:"button",onClick:()=>w(!1),style:pt,children:e.jsx(mn,{})})]}),e.jsxs("div",{style:hn,children:[h("overlay","Overlay",e.jsx(Oe,{}),e.jsxs("div",{style:fn,children:[e.jsxs("label",{style:ye,children:[e.jsx("span",{style:Z,children:"Hand Size"}),e.jsx("input",{style:me,type:"number",min:.25,max:1.8,step:.05,value:t.visualScale,onChange:s=>i({...t,visualScale:Number(s.target.value)})})]}),e.jsxs("label",{style:ye,children:[e.jsx("span",{style:Z,children:"Opacity"}),e.jsx("input",{style:me,type:"number",min:0,max:1,step:.01,value:t.opacity,onChange:s=>i({...t,opacity:Number(s.target.value)})})]}),e.jsxs("label",{style:ye,children:[e.jsx("span",{style:Z,children:"Joint Radius"}),e.jsx("input",{style:me,type:"number",min:1,max:20,step:1,value:t.pointRadius,onChange:s=>i({...t,pointRadius:Number(s.target.value)})})]}),e.jsxs("label",{style:ye,children:[e.jsx("span",{style:Z,children:"Stroke"}),e.jsx("input",{style:me,type:"number",min:.01,max:100,step:.01,value:t.lineWidth,onChange:s=>i({...t,lineWidth:Number(s.target.value)})})]}),e.jsxs("label",{style:ye,children:[e.jsx("span",{style:Z,children:"Smoothing"}),e.jsx("input",{style:me,type:"number",min:0,max:1,step:.01,value:t.smoothing,onChange:s=>i({...t,smoothing:Number(s.target.value)})})]}),e.jsxs("label",{style:ye,children:[e.jsx("span",{style:Z,children:"Label Size"}),e.jsx("input",{style:me,type:"number",min:.25,max:3,step:.05,value:t.labelScale,onChange:s=>i({...t,labelScale:Number(s.target.value)})})]}),e.jsx("label",{style:Ce,children:e.jsxs("div",{style:ze,children:[e.jsx("span",{style:Z,children:"Bounding Box"}),e.jsx("input",{type:"checkbox",style:Re,checked:t.showBoundingBox,onChange:s=>i({...t,showBoundingBox:s.target.checked})})]})})]})),h("visibility","Visibility",e.jsx(Oe,{}),e.jsxs(e.Fragment,{children:[e.jsx("label",{style:Ce,children:e.jsxs("div",{style:ze,children:[e.jsx("span",{style:Z,children:"Show Overlay"}),e.jsx("input",{type:"checkbox",style:Re,checked:t.enabled,onChange:s=>i({...t,enabled:s.target.checked})})]})}),e.jsx("label",{style:Ce,children:e.jsxs("div",{style:ze,children:[e.jsx("span",{style:Z,children:"Both Hands"}),e.jsx("input",{type:"checkbox",style:Re,checked:t.bothHands,onChange:s=>i({...t,bothHands:s.target.checked})})]})}),e.jsx("label",{style:Ce,children:e.jsxs("div",{style:ze,children:[e.jsx("span",{style:Z,children:"Show Labels"}),e.jsx("input",{type:"checkbox",style:Re,checked:t.showLabels,onChange:s=>i({...t,showLabels:s.target.checked})})]})}),e.jsx("label",{style:Ce,children:e.jsxs("div",{style:ze,children:[e.jsx("span",{style:Z,children:"Log to Console"}),e.jsx("input",{type:"checkbox",style:Re,checked:t.logToConsole,onChange:s=>i({...t,logToConsole:s.target.checked})})]})})]}))]})]}):e.jsx("div",{role:"button",tabIndex:0,onClick:()=>w(!0),style:rn,children:e.jsx(jn,{})})]}),document.body)},vn={position:"fixed",left:320,top:104,zIndex:2e4,pointerEvents:"none"},It={pointerEvents:"auto",width:286,borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflowX:"hidden",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},Cn={...It,width:32,height:32,borderRadius:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},zn={position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:7,padding:"7px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)"},Rn={display:"grid",gap:6,padding:7},Wn={borderRadius:12,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)",overflow:"hidden"},In={display:"flex",alignItems:"center",gap:7,padding:"6px 7px"},En={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:500,flex:"1 1 auto",minWidth:0},Tn={width:28,height:16,borderRadius:999,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.08)",padding:2,display:"flex",alignItems:"center",cursor:"pointer",flex:"0 0 auto"},Ln=t=>({width:10,height:10,borderRadius:999,background:t?"#f8fafc":"rgba(148,163,184,0.7)",transform:t?"translateX(12px)":"translateX(0)",transition:"transform 140ms ease, background 140ms ease"}),Fn={display:"grid",gap:7,padding:"0 7px 7px"},Mn={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},q={display:"flex",flexDirection:"column",gap:4},oe={...q,gridColumn:"1 / -1"},H={fontSize:9,color:"rgba(226,232,240,0.72)"},ne={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},re={display:"flex",alignItems:"center",justifyContent:"space-between",gap:12,minHeight:24},ae={width:16,height:16},yt={display:"inline-flex",alignItems:"center",justifyContent:"center",width:24,height:24,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.05)",color:"#e2e8f0",cursor:"pointer",padding:0,flex:"0 0 auto"},Hn=()=>e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 10h10v2H7v-2zm0 4h10v2H7v-2zm0-8h10v2H7V6z"})}),Kn=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M18.3 5.71 12 12l6.3 6.29-1.41 1.41L10.59 13.41 4.29 19.7 2.88 18.29 9.17 12 2.88 5.71 4.29 4.3l6.3 6.29 6.29-6.3z"})}),Bn=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M8 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"})}),Pe=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M11 2a1 1 0 0 1 1 1v6h1V3a1 1 0 1 1 2 0v6h1V4a1 1 0 1 1 2 0v7.3l1.6 2.4a5 5 0 0 1 .8 2.7V18a4 4 0 0 1-4 4H9a6 6 0 0 1-6-6v-3.5a2.5 2.5 0 0 1 5 0V15h1V3a1 1 0 0 1 1-1z"})}),$n=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 5V2L7 7l5 5V9a4 4 0 1 1-4 4H6a6 6 0 1 0 6-8z"})}),Vn=({value:t,onChange:i})=>{const[p,w]=c.useState(!0),[j,S]=c.useState({x:320,y:104}),[R,k]=c.useState(typeof window>"u"?0:window.innerHeight),[u,r]=c.useState({controller:!0,visibility:!1}),o=c.useRef(null),v=Math.max(240,R-j.y-16);c.useEffect(()=>{const s=a=>{o.current&&S({x:Math.max(8,a.clientX-o.current.x),y:Math.max(8,a.clientY-o.current.y)})},y=()=>{o.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",s),window.addEventListener("pointerup",y),()=>{window.removeEventListener("pointermove",s),window.removeEventListener("pointerup",y)}},[]),c.useEffect(()=>{const s=()=>k(window.innerHeight);return window.addEventListener("resize",s),()=>window.removeEventListener("resize",s)},[]);const d=s=>{const y=s.currentTarget.getBoundingClientRect();o.current={x:s.clientX-y.left,y:s.clientY-y.top},document.body.classList.add("select-none"),s.currentTarget.setPointerCapture(s.pointerId)},h=(s,y,a,b)=>e.jsxs("div",{style:Wn,children:[e.jsxs("div",{style:In,children:[e.jsx("button",{type:"button",onClick:()=>r(I=>({...I,[s]:!I[s]})),style:Tn,children:e.jsx("div",{style:Ln(u[s])})}),e.jsxs("div",{style:En,children:[e.jsx("span",{style:{display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},children:a}),e.jsx("span",{children:y})]})]}),u[s]?e.jsx("div",{style:Fn,children:b}):null]},s);return typeof document>"u"?null:ie.createPortal(e.jsxs("div",{style:{...vn,left:j.x,top:j.y},children:[e.jsx("style",{children:`
17
+ .xr-hand-tracking-2d-controller-scroll::-webkit-scrollbar { width: 10px; }
18
+ .xr-hand-tracking-2d-controller-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,0.06); border-radius: 999px; }
19
+ .xr-hand-tracking-2d-controller-scroll::-webkit-scrollbar-thumb { background: rgba(148,163,184,0.55); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
20
+ `}),p?e.jsxs("div",{className:"xr-hand-tracking-2d-controller-scroll",style:{...It,height:v},children:[e.jsxs("div",{style:zn,children:[e.jsx("div",{onPointerDown:d,style:{width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},children:e.jsx(Bn,{})}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:600,minWidth:0},children:[e.jsx("span",{style:{display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},children:e.jsx(Pe,{})}),e.jsx("span",{children:"HandTracking2DController"})]}),e.jsx("div",{style:{flex:"1 1 auto"}}),e.jsx("button",{type:"button",onClick:()=>i(Vt),style:yt,children:e.jsx($n,{})}),e.jsx("button",{type:"button",onClick:()=>w(!1),style:yt,children:e.jsx(Kn,{})})]}),e.jsxs("div",{style:Rn,children:[h("controller","Controller",e.jsx(Pe,{}),e.jsxs("div",{style:Mn,children:[e.jsx("label",{style:oe,children:e.jsxs("div",{style:re,children:[e.jsx("span",{style:H,children:"Enabled"}),e.jsx("input",{type:"checkbox",style:ae,checked:t.enabled,onChange:s=>i({...t,enabled:s.target.checked})})]})}),e.jsx("label",{style:oe,children:e.jsxs("div",{style:re,children:[e.jsx("span",{style:H,children:"Attach Image"}),e.jsx("input",{type:"checkbox",style:ae,checked:t.attachImageEnabled,onChange:s=>i({...t,attachImageEnabled:s.target.checked})})]})}),e.jsx("label",{style:oe,children:e.jsxs("div",{style:re,children:[e.jsx("span",{style:H,children:"Size Responsive to Hand Bounding Box"}),e.jsx("input",{type:"checkbox",style:ae,checked:t.sizeResponsiveToHandBoundingBox,onChange:s=>i({...t,sizeResponsiveToHandBoundingBox:s.target.checked})})]})}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Size"}),e.jsx("input",{style:ne,type:"number",min:.1,max:3,step:.01,value:t.size,onChange:s=>i({...t,size:Number(s.target.value)})})]}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Vertical Align"}),e.jsx("select",{style:ne,value:t.verticalAlign,onChange:s=>i({...t,verticalAlign:s.target.value}),children:At.map(s=>e.jsx("option",{value:s.value,children:s.label},s.value))})]}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Horizontal Align"}),e.jsx("select",{style:ne,value:t.horizontalAlign,onChange:s=>i({...t,horizontalAlign:s.target.value}),children:Nt.map(s=>e.jsx("option",{value:s.value,children:s.label},s.value))})]}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Offset X"}),e.jsx("input",{style:ne,type:"number",min:-1,max:1,step:.01,value:t.offsetX,onChange:s=>i({...t,offsetX:Number(s.target.value)})})]}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Offset Y"}),e.jsx("input",{style:ne,type:"number",min:-1,max:1,step:.01,value:t.offsetY,onChange:s=>i({...t,offsetY:Number(s.target.value)})})]}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Rotation"}),e.jsx("input",{style:ne,type:"number",min:-180,max:180,step:.1,value:t.rotation,onChange:s=>i({...t,rotation:Number(s.target.value)})})]}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Alpha"}),e.jsx("input",{style:ne,type:"number",min:0,max:1,step:.01,value:t.alpha,onChange:s=>i({...t,alpha:Number(s.target.value)})})]}),e.jsx("label",{style:oe,children:e.jsxs("div",{style:re,children:[e.jsx("span",{style:H,children:"Smooth Following"}),e.jsx("input",{type:"checkbox",style:ae,checked:t.smoothFollowing,onChange:s=>i({...t,smoothFollowing:s.target.checked})})]})}),e.jsxs("label",{style:q,children:[e.jsx("span",{style:H,children:"Smoothing"}),e.jsx("input",{style:ne,type:"number",min:0,max:1,step:.01,value:t.smoothing,onChange:s=>i({...t,smoothing:Number(s.target.value)})})]})]})),h("visibility","Visibility",e.jsx(Pe,{}),e.jsxs(e.Fragment,{children:[e.jsx("label",{style:oe,children:e.jsxs("div",{style:re,children:[e.jsx("span",{style:H,children:"Show Overlay"}),e.jsx("input",{type:"checkbox",style:ae,checked:t.enabled,onChange:s=>i({...t,enabled:s.target.checked})})]})}),e.jsx("label",{style:oe,children:e.jsxs("div",{style:re,children:[e.jsx("span",{style:H,children:"Show Attach Image"}),e.jsx("input",{type:"checkbox",style:ae,checked:t.attachImageEnabled,onChange:s=>i({...t,attachImageEnabled:s.target.checked})})]})}),e.jsx("label",{style:oe,children:e.jsxs("div",{style:re,children:[e.jsx("span",{style:H,children:"Show Bounding Box"}),e.jsx("input",{type:"checkbox",style:ae,checked:t.showBoundingBox,onChange:s=>i({...t,showBoundingBox:s.target.checked})})]})})]}))]})]}):e.jsx("div",{role:"button",tabIndex:0,onClick:()=>w(!0),style:Cn,children:e.jsx(Hn,{})})]}),document.body)},An={position:"fixed",left:320,top:104,zIndex:2e4,pointerEvents:"none"},Et={pointerEvents:"auto",width:286,borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflowX:"hidden",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},Nn={...Et,width:32,height:32,borderRadius:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},Dn={position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:7,padding:"7px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)"},On={display:"grid",gap:6,padding:7},Pn={borderRadius:12,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)",overflow:"hidden"},Zn={display:"flex",alignItems:"center",gap:7,padding:"6px 7px"},_n={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:500,flex:"1 1 auto",minWidth:0},Xn={width:28,height:16,borderRadius:999,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.08)",padding:2,display:"flex",alignItems:"center",cursor:"pointer",flex:"0 0 auto"},Gn=t=>({width:10,height:10,borderRadius:999,background:t?"#f8fafc":"rgba(148,163,184,0.7)",transform:t?"translateX(12px)":"translateX(0)",transition:"transform 140ms ease, background 140ms ease"}),Yn={display:"grid",gap:7,padding:"0 7px 7px"},xt={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},le={display:"flex",flexDirection:"column",gap:4},de={...le,gridColumn:"1 / -1"},$={fontSize:9,color:"rgba(226,232,240,0.72)"},ce={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},he={display:"flex",alignItems:"center",justifyContent:"space-between",gap:12,minHeight:24},pe={width:16,height:16},gt={display:"inline-flex",alignItems:"center",justifyContent:"center",width:24,height:24,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.05)",color:"#e2e8f0",cursor:"pointer",padding:0,flex:"0 0 auto"},Un=()=>e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 10h10v2H7v-2zm0 4h10v2H7v-2zm0-8h10v2H7V6z"})}),Jn=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M18.3 5.71 12 12l6.3 6.29-1.41 1.41L10.59 13.41 4.29 19.7 2.88 18.29 9.17 12 2.88 5.71 4.29 4.3l6.3 6.29 6.29-6.3z"})}),qn=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M8 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"})}),Ze=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M8 5a3 3 0 1 1-3-3 3 3 0 0 1 3 3zm11 11a3 3 0 1 0 3 3 3 3 0 0 0-3-3zM7.1 7.1l9.8 9.8 1.4-1.4-9.8-9.8-1.4 1.4zM19 2a3 3 0 1 0 3 3 3 3 0 0 0-3-3zM7.1 16.9l9.8-9.8-1.4-1.4-9.8 9.8 1.4 1.4zM5 16a3 3 0 1 0 3 3 3 3 0 0 0-3-3z"})}),Qn=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 5V2L7 7l5 5V9a4 4 0 1 1-4 4H6a6 6 0 1 0 6-8z"})}),el=({value:t,onChange:i})=>{const[p,w]=c.useState(!0),[j,S]=c.useState({x:320,y:104}),[R,k]=c.useState(typeof window>"u"?0:window.innerHeight),[u,r]=c.useState({joints:!0,visibility:!0}),o=c.useRef(null),v=Math.max(240,R-j.y-16);c.useEffect(()=>{const s=a=>{o.current&&S({x:Math.max(8,a.clientX-o.current.x),y:Math.max(8,a.clientY-o.current.y)})},y=()=>{o.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",s),window.addEventListener("pointerup",y),()=>{window.removeEventListener("pointermove",s),window.removeEventListener("pointerup",y)}},[]),c.useEffect(()=>{const s=()=>k(window.innerHeight);return window.addEventListener("resize",s),()=>window.removeEventListener("resize",s)},[]);const d=s=>{const y=s.currentTarget.getBoundingClientRect();o.current={x:s.clientX-y.left,y:s.clientY-y.top},document.body.classList.add("select-none"),s.currentTarget.setPointerCapture(s.pointerId)},h=(s,y,a,b)=>e.jsxs("div",{style:Pn,children:[e.jsxs("div",{style:Zn,children:[e.jsx("button",{type:"button",onClick:()=>r(I=>({...I,[s]:!I[s]})),style:Xn,children:e.jsx("div",{style:Gn(u[s])})}),e.jsxs("div",{style:_n,children:[e.jsx("span",{style:{display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},children:a}),e.jsx("span",{children:y})]})]}),u[s]?e.jsx("div",{style:Yn,children:b}):null]},s);return typeof document>"u"?null:ie.createPortal(e.jsx("div",{style:{...An,left:j.x,top:j.y},children:p?e.jsxs("div",{style:{...Et,height:v},children:[e.jsxs("div",{style:Dn,children:[e.jsx("div",{onPointerDown:d,style:{width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},children:e.jsx(qn,{})}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:600,minWidth:0},children:[e.jsx("span",{style:{display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},children:e.jsx(Ze,{})}),e.jsx("span",{children:"HandJoints2D"})]}),e.jsx("div",{style:{flex:"1 1 auto"}}),e.jsx("button",{type:"button",onClick:()=>i(Ot),style:gt,children:e.jsx(Qn,{})}),e.jsx("button",{type:"button",onClick:()=>w(!1),style:gt,children:e.jsx(Jn,{})})]}),e.jsxs("div",{style:On,children:[h("joints","Joints",e.jsx(Ze,{}),e.jsxs("div",{style:xt,children:[e.jsxs("label",{style:le,children:[e.jsx("span",{style:$,children:"Visual Scale"}),e.jsx("input",{style:ce,type:"number",min:.25,max:2,step:.01,value:t.visualScale,onChange:s=>i({...t,visualScale:Number(s.target.value)})})]}),e.jsxs("label",{style:le,children:[e.jsx("span",{style:$,children:"Opacity"}),e.jsx("input",{style:ce,type:"number",min:0,max:1,step:.01,value:t.opacity,onChange:s=>i({...t,opacity:Number(s.target.value)})})]}),e.jsxs("label",{style:le,children:[e.jsx("span",{style:$,children:"Joint Radius"}),e.jsx("input",{style:ce,type:"number",min:.5,max:24,step:.5,value:t.jointRadius,onChange:s=>i({...t,jointRadius:Number(s.target.value)})})]}),e.jsxs("label",{style:le,children:[e.jsx("span",{style:$,children:"Line Width"}),e.jsx("input",{style:ce,type:"number",min:.01,max:100,step:.1,value:t.lineWidth,onChange:s=>i({...t,lineWidth:Number(s.target.value)})})]}),e.jsxs("label",{style:le,children:[e.jsx("span",{style:$,children:"Label Size"}),e.jsx("input",{style:ce,type:"number",min:.25,max:3,step:.05,value:t.labelScale,onChange:s=>i({...t,labelScale:Number(s.target.value)})})]}),e.jsxs("label",{style:le,children:[e.jsx("span",{style:$,children:"Smoothing"}),e.jsx("input",{style:ce,type:"number",min:0,max:1,step:.01,value:t.smoothing,onChange:s=>i({...t,smoothing:Number(s.target.value)})})]}),e.jsxs("label",{style:le,children:[e.jsx("span",{style:$,children:"Min Count Confidence"}),e.jsx("input",{style:ce,type:"number",min:0,max:1,step:.01,value:t.minCountConfidence,onChange:s=>i({...t,minCountConfidence:Number(s.target.value)})})]})]})),h("visibility","Visibility",e.jsx(Ze,{}),e.jsxs("div",{style:xt,children:[e.jsx("label",{style:de,children:e.jsxs("div",{style:he,children:[e.jsx("span",{style:$,children:"Show Joints"}),e.jsx("input",{type:"checkbox",style:pe,checked:t.enabled,onChange:s=>i({...t,enabled:s.target.checked})})]})}),e.jsx("label",{style:de,children:e.jsxs("div",{style:he,children:[e.jsx("span",{style:$,children:"Both Hands"}),e.jsx("input",{type:"checkbox",style:pe,checked:t.bothHands,onChange:s=>i({...t,bothHands:s.target.checked})})]})}),e.jsx("label",{style:de,children:e.jsxs("div",{style:he,children:[e.jsx("span",{style:$,children:"Count Fingers"}),e.jsx("input",{type:"checkbox",style:pe,checked:t.countEnabled,onChange:s=>i({...t,countEnabled:s.target.checked})})]})}),e.jsx("label",{style:de,children:e.jsxs("div",{style:he,children:[e.jsx("span",{style:$,children:"Joint Dots"}),e.jsx("input",{type:"checkbox",style:pe,checked:t.showJoints,onChange:s=>i({...t,showJoints:s.target.checked})})]})}),e.jsx("label",{style:de,children:e.jsxs("div",{style:he,children:[e.jsx("span",{style:$,children:"Bone Lines"}),e.jsx("input",{type:"checkbox",style:pe,checked:t.showBones,onChange:s=>i({...t,showBones:s.target.checked})})]})}),e.jsx("label",{style:de,children:e.jsxs("div",{style:he,children:[e.jsx("span",{style:$,children:"Bounding Box"}),e.jsx("input",{type:"checkbox",style:pe,checked:t.showBoundingBox,onChange:s=>i({...t,showBoundingBox:s.target.checked})})]})}),e.jsx("label",{style:de,children:e.jsxs("div",{style:he,children:[e.jsx("span",{style:$,children:"Labels"}),e.jsx("input",{type:"checkbox",style:pe,checked:t.showLabels,onChange:s=>i({...t,showLabels:s.target.checked})})]})})]}))]})]}):e.jsx("div",{role:"button",tabIndex:0,onClick:()=>w(!0),style:Nn,children:e.jsx(Un,{})})}),document.body)},tl={position:"fixed",left:320,top:104,zIndex:2e4,pointerEvents:"none"},Tt={pointerEvents:"auto",width:286,borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflowX:"hidden",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},sl={...Tt,width:32,height:32,borderRadius:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},nl={position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:7,padding:"7px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)"},ll={display:"grid",gap:6,padding:7},il={borderRadius:12,border:"1px solid rgba(255,255,255,0.08)",background:"rgba(255,255,255,0.03)",overflow:"hidden"},ol={display:"flex",alignItems:"center",gap:7,padding:"6px 7px"},rl={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:500,flex:"1 1 auto",minWidth:0},al={width:28,height:16,borderRadius:999,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.08)",padding:2,display:"flex",alignItems:"center",cursor:"pointer",flex:"0 0 auto"},dl=t=>({width:10,height:10,borderRadius:999,background:t?"#f8fafc":"rgba(148,163,184,0.7)",transform:t?"translateX(12px)":"translateX(0)",transition:"transform 140ms ease, background 140ms ease"}),cl={display:"grid",gap:7,padding:"0 7px 7px"},_e={display:"grid",gridTemplateColumns:"repeat(2, minmax(0, 1fr))",gap:6},A={display:"flex",flexDirection:"column",gap:4},we={...A,gridColumn:"1 / -1"},L={fontSize:9,color:"rgba(226,232,240,0.72)"},V={width:"100%",height:24,borderRadius:7,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.68)",color:"#f8fafc",fontSize:10.5,outline:"none",padding:"0 7px",boxSizing:"border-box"},We={display:"flex",alignItems:"center",justifyContent:"space-between",gap:12,minHeight:24},Ie={width:16,height:16},bt={display:"inline-flex",alignItems:"center",justifyContent:"center",width:24,height:24,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.05)",color:"#e2e8f0",cursor:"pointer",padding:0,flex:"0 0 auto"},hl=()=>e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M7 10h10v2H7v-2zm0 4h10v2H7v-2zm0-8h10v2H7V6z"})}),pl=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M18.3 5.71 12 12l6.3 6.29-1.41 1.41L10.59 13.41 4.29 19.7 2.88 18.29 9.17 12 2.88 5.71 4.29 4.3l6.3 6.29 6.29-6.3z"})}),yl=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M8 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM8 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 6a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0zM16 18a2 2 0 1 1-4 0 2 2 0 0 1 4 0z"})}),He=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M11 2a1 1 0 0 1 1 1v6h1V3a1 1 0 1 1 2 0v6h1V4a1 1 0 1 1 2 0v7.3l1.6 2.4a5 5 0 0 1 .8 2.7V18a4 4 0 0 1-4 4H9a6 6 0 0 1-6-6v-3.5a2.5 2.5 0 0 1 5 0V15h1V3a1 1 0 0 1 1-1z"})}),xl=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 5V2L7 7l5 5V9a4 4 0 1 1-4 4H6a6 6 0 1 0 6-8z"})}),gl=({value:t,onChange:i})=>{const[p,w]=c.useState(!0),[j,S]=c.useState({x:320,y:104}),[R,k]=c.useState(typeof window>"u"?0:window.innerHeight),[u,r]=c.useState({visual:!0,calibration:!0,visibility:!0}),o=c.useRef(null),v=Math.max(240,R-j.y-16);c.useEffect(()=>{const s=a=>{o.current&&S({x:Math.max(8,a.clientX-o.current.x),y:Math.max(8,a.clientY-o.current.y)})},y=()=>{o.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",s),window.addEventListener("pointerup",y),()=>{window.removeEventListener("pointermove",s),window.removeEventListener("pointerup",y)}},[]),c.useEffect(()=>{const s=()=>k(window.innerHeight);return window.addEventListener("resize",s),()=>window.removeEventListener("resize",s)},[]);const d=s=>{const y=s.currentTarget.getBoundingClientRect();o.current={x:s.clientX-y.left,y:s.clientY-y.top},document.body.classList.add("select-none"),s.currentTarget.setPointerCapture(s.pointerId)},h=(s,y,a,b)=>e.jsxs("div",{style:il,children:[e.jsxs("div",{style:ol,children:[e.jsx("button",{type:"button",onClick:()=>r(I=>({...I,[s]:!I[s]})),style:al,children:e.jsx("div",{style:dl(u[s])})}),e.jsxs("div",{style:rl,children:[e.jsx("span",{style:{display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},children:a}),e.jsx("span",{children:y})]})]}),u[s]?e.jsx("div",{style:cl,children:b}):null]},s);return typeof document>"u"?null:ie.createPortal(e.jsx("div",{style:{...tl,left:j.x,top:j.y},children:p?e.jsxs("div",{style:{...Tt,height:v},children:[e.jsxs("div",{style:nl,children:[e.jsx("div",{onPointerDown:d,style:{width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},children:e.jsx(yl,{})}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:600,minWidth:0},children:[e.jsx("span",{style:{display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},children:e.jsx(He,{})}),e.jsx("span",{children:"HandTracking3D"})]}),e.jsx("div",{style:{flex:"1 1 auto"}}),e.jsx("button",{type:"button",onClick:()=>i($t),style:bt,children:e.jsx(xl,{})}),e.jsx("button",{type:"button",onClick:()=>w(!1),style:bt,children:e.jsx(pl,{})})]}),e.jsxs("div",{style:ll,children:[h("visual","Visual",e.jsx(He,{}),e.jsxs("div",{style:_e,children:[e.jsxs("label",{style:we,children:[e.jsx("span",{style:L,children:"Space"}),e.jsxs("select",{style:V,value:t.space,onChange:s=>i({...t,space:s.target.value}),children:[e.jsx("option",{value:"scene",children:"Scene"}),e.jsx("option",{value:"screen",children:"Screen Fit"})]})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Joint Size"}),e.jsx("input",{style:V,type:"number",min:5e-4,max:.08,step:5e-4,value:t.jointRadius,onChange:s=>i({...t,jointRadius:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Bone Radius"}),e.jsx("input",{style:V,type:"number",min:.001,max:.12,step:.001,value:t.boneRadius,onChange:s=>i({...t,boneRadius:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Opacity"}),e.jsx("input",{style:V,type:"number",min:0,max:1,step:.01,value:t.opacity,onChange:s=>i({...t,opacity:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Smoothing"}),e.jsx("input",{style:V,type:"number",min:0,max:1,step:.01,value:t.smoothing,onChange:s=>i({...t,smoothing:Number(s.target.value)})})]})]})),h("calibration","Calibration",e.jsx(He,{}),e.jsxs("div",{style:_e,children:[e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Hand Distance Ref (m)"}),e.jsx("input",{style:V,type:"number",min:.05,max:5,step:.01,value:t.trackingDistanceM,onChange:s=>i({...t,trackingDistanceM:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Projection Distance"}),e.jsx("input",{style:V,type:"number",min:.05,max:10,step:.01,value:t.projectionDistanceM,onChange:s=>i({...t,projectionDistanceM:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Hand Scale"}),e.jsx("input",{style:V,type:"number",min:.1,max:8,step:.01,value:t.handScale,onChange:s=>i({...t,handScale:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Fit X"}),e.jsx("input",{style:V,type:"number",min:.1,max:4,step:.01,value:t.fitX,onChange:s=>i({...t,fitX:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Fit Y"}),e.jsx("input",{style:V,type:"number",min:.1,max:4,step:.01,value:t.fitY,onChange:s=>i({...t,fitY:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Offset X"}),e.jsx("input",{style:V,type:"number",min:-5,max:5,step:.01,value:t.offsetX,onChange:s=>i({...t,offsetX:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Offset Y"}),e.jsx("input",{style:V,type:"number",min:-5,max:5,step:.01,value:t.offsetY,onChange:s=>i({...t,offsetY:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Offset Z"}),e.jsx("input",{style:V,type:"number",min:-5,max:5,step:.01,value:t.offsetZ,onChange:s=>i({...t,offsetZ:Number(s.target.value)})})]}),e.jsxs("label",{style:A,children:[e.jsx("span",{style:L,children:"Depth Scale"}),e.jsx("input",{style:V,type:"number",min:0,max:10,step:.1,value:t.depthScale,onChange:s=>i({...t,depthScale:Number(s.target.value)})})]})]})),h("visibility","Visibility",e.jsx(He,{}),e.jsxs("div",{style:_e,children:[e.jsx("label",{style:we,children:e.jsxs("div",{style:We,children:[e.jsx("span",{style:L,children:"Show 3D Hand"}),e.jsx("input",{type:"checkbox",style:Ie,checked:t.enabled,onChange:s=>i({...t,enabled:s.target.checked})})]})}),e.jsx("label",{style:we,children:e.jsxs("div",{style:We,children:[e.jsx("span",{style:L,children:"Both Hands"}),e.jsx("input",{type:"checkbox",style:Ie,checked:t.bothHands,onChange:s=>i({...t,bothHands:s.target.checked})})]})}),e.jsx("label",{style:we,children:e.jsxs("div",{style:We,children:[e.jsx("span",{style:L,children:"Joint Spheres"}),e.jsx("input",{type:"checkbox",style:Ie,checked:t.showJoints,onChange:s=>i({...t,showJoints:s.target.checked})})]})}),e.jsx("label",{style:we,children:e.jsxs("div",{style:We,children:[e.jsx("span",{style:L,children:"Bone Cylinders"}),e.jsx("input",{type:"checkbox",style:Ie,checked:t.showBones,onChange:s=>i({...t,showBones:s.target.checked})})]})}),e.jsx("label",{style:we,children:e.jsxs("div",{style:We,children:[e.jsx("span",{style:L,children:"Labels"}),e.jsx("input",{type:"checkbox",style:Ie,checked:t.showLabels,onChange:s=>i({...t,showLabels:s.target.checked})})]})})]}))]})]}):e.jsx("div",{role:"button",tabIndex:0,onClick:()=>w(!0),style:sl,children:e.jsx(hl,{})})}),document.body)},bl=1e3;function ul(t,i=bl){return t.map((p,w)=>({...p,renderOrder:i+(t.length-w)}))}function fl(t,i,p){const w=t.findIndex(k=>k.id===i),j=t.findIndex(k=>k.id===p);if(w<0||j<0||w===j)return t;const S=[...t],[R]=S.splice(w,1);return S.splice(j,0,R),ul(S)}const jl={position:"fixed",left:14,top:104,zIndex:2e4,pointerEvents:"none"},ut={pointerEvents:"auto",width:284,borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.58)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflowX:"hidden",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},Ye={display:"inline-flex",alignItems:"center",justifyContent:"center",width:22,height:22,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(255,255,255,0.05)",color:"#e2e8f0",cursor:"pointer",padding:0,flex:"0 0 auto"},ml={position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:8,padding:"8px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)"},wl={width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},Sl={display:"flex",alignItems:"center",gap:6,fontSize:11,fontWeight:600,minWidth:0},kl={display:"flex",width:18,height:18,alignItems:"center",justifyContent:"center",borderRadius:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.08)",color:"#e2e8f0",flex:"0 0 auto"},vl={display:"grid",gap:6,padding:7},Cl=t=>({display:"grid",gridTemplateColumns:"20px 20px 20px minmax(0, 1fr)",alignItems:"center",gap:6,minHeight:34,padding:"6px 7px",borderRadius:10,border:t?"1px solid rgba(56,189,248,0.5)":"1px solid rgba(255,255,255,0.08)",background:t?"rgba(56,189,248,0.10)":"rgba(255,255,255,0.03)",cursor:"pointer",opacity:1}),zl={display:"flex",flexDirection:"column",gap:2,minWidth:0},Rl={fontSize:10,fontWeight:600,lineHeight:1.15,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},Wl={fontSize:9,color:"rgba(226,232,240,0.6)",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},Xe={...Ye,width:20,height:20,borderRadius:7,fontSize:11,lineHeight:1},Il=({off:t=!1})=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:t?e.jsx("path",{d:"M2 2l20 20-1.4 1.4-3.2-3.2C15.9 21 14.1 21.5 12 21.5 6.5 21.5 2 16 1 12c.4-1.8 1.1-3.4 2.2-4.8L.6 4.6 2 2zm10 4c3.9 0 7.4 2.8 9.2 6-1 1.8-2.6 3.5-4.4 4.6l-2-2c.1-.3.2-.7.2-1.1a3 3 0 0 0-3-3c-.4 0-.8.1-1.1.2l-1.9-1.9C10.2 6.8 11.1 6 12 6z"}):e.jsx("path",{d:"M12 5c5.5 0 10 5 11 7-.9 2-5.5 7-11 7S2 14 1 12c1-2 5.5-7 11-7zm0 3.2A3.8 3.8 0 1 0 12 16.8 3.8 3.8 0 0 0 12 8.2z"})}),El=({off:t=!1})=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:t?e.jsx("path",{d:"M18 8h-1V6a5 5 0 0 0-9.1-2.9l1.5 1.5A3 3 0 0 1 16 6v2H8a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h9.2l1.8 1.8 1.4-1.4L2.6 3.4 1.2 4.8 5 8.6V20h14a2 2 0 0 0 2-2v-8a2 2 0 0 0-2-2z"}):e.jsx("path",{d:"M7 10V8a5 5 0 0 1 10 0v2h1a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h1zm2 0h6V8a3 3 0 0 0-6 0v2z"})}),Tl=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M11 2h2v4h3l-4 4-4-4h3V2zm0 20v-4H8l4-4 4 4h-3v4h-2zM2 11h4V8l4 4-4 4v-3H2v-2zm20 0v2h-4v3l-4-4 4-4v3h4z"})}),ft=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M12 3 1 9l11 6 11-6-11-6zm0 8L1 5v4l11 6 11-6V5l-11 6zm0 6L1 11v4l11 6 11-6v-4l-11 6z"})}),Ll=({layers:t,selectedLayerId:i,onSelectLayer:p,onToggleVisible:w,onToggleEnabled:j,onReorder:S,onToggleLocked:R,initialPosition:k})=>{const[u,r]=c.useState(!0),[o,v]=c.useState(k??{x:644,y:104}),[d,h]=c.useState(typeof window>"u"?0:window.innerHeight),s=c.useRef(null),[y,a]=c.useState(null),b=Math.max(240,d-o.y-16);if(c.useEffect(()=>{const C=K=>{s.current&&v({x:Math.max(8,K.clientX-s.current.x),y:Math.max(8,K.clientY-s.current.y)})},D=()=>{s.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",C),window.addEventListener("pointerup",D),()=>{window.removeEventListener("pointermove",C),window.removeEventListener("pointerup",D)}},[]),c.useEffect(()=>{const C=()=>h(window.innerHeight);return window.addEventListener("resize",C),()=>window.removeEventListener("resize",C)},[]),typeof document>"u")return null;const I=C=>{const D=C.currentTarget.getBoundingClientRect();s.current={x:C.clientX-D.left,y:C.clientY-D.top},document.body.classList.add("select-none"),C.currentTarget.setPointerCapture(C.pointerId)},N=C=>{if(!y||y===C){a(null);return}const D=t.findIndex(Y=>Y.id===y),K=t.findIndex(Y=>Y.id===C);if(D<0||K<0){a(null);return}S(fl(t,y,C)),a(null)};return ie.createPortal(e.jsx("div",{style:{...jl,left:o.x,top:o.y},children:u?e.jsxs("div",{style:{...ut,height:b},children:[e.jsxs("div",{style:ml,children:[e.jsx("div",{onPointerDown:I,style:wl,children:e.jsx(Tl,{})}),e.jsxs("div",{style:Sl,children:[e.jsx("span",{style:kl,children:e.jsx(ft,{})}),e.jsx("span",{children:"Layers"})]}),e.jsx("div",{style:{flex:"1 1 auto"}}),e.jsx("button",{type:"button",onClick:()=>r(!1),style:Ye,children:"−"})]}),e.jsx("div",{style:vl,children:t.map((C,D)=>e.jsxs("div",{style:Cl(i===C.id),draggable:!0,onDragStart:()=>a(C.id),onDragOver:K=>K.preventDefault(),onDrop:()=>N(C.id),onClick:()=>p(C.id),title:C.label,children:[e.jsx("button",{type:"button",style:Xe,onClick:K=>{K.stopPropagation(),w(C.id,!C.visible)},children:e.jsx(Il,{off:!C.visible})}),e.jsx("button",{type:"button",style:Xe,onClick:K=>{K.stopPropagation(),j(C.id,!C.enabled)},children:C.enabled?"●":"○"}),e.jsx("button",{type:"button",style:Xe,onClick:K=>{K.stopPropagation(),R==null||R(C.id,!C.locked)},children:e.jsx(El,{off:!C.locked})}),e.jsxs("div",{style:zl,children:[e.jsx("div",{style:Rl,children:C.label}),e.jsxs("div",{style:Wl,children:[C.domain," / ",C.type," • #",t.length-D]})]})]},C.id))})]}):e.jsx("div",{role:"button",tabIndex:0,onClick:()=>r(!0),style:{...ut,...Ye,width:32,height:32,display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx(ft,{})})}),document.body)},Fl={position:"fixed",zIndex:2e4,pointerEvents:"none"},Ml={pointerEvents:"auto",width:284,maxHeight:"min(620px, calc(100vh - 32px))",borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8, 15, 28, 0.62)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",WebkitBackdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",overflow:"hidden",fontFamily:"Inter, ui-sans-serif, system-ui, sans-serif"},Hl={display:"flex",alignItems:"center",justifyContent:"space-between",gap:8,padding:"8px 8px",borderBottom:"1px solid rgba(255,255,255,0.08)",background:"rgba(8, 15, 28, 0.88)"},Kl={display:"flex",alignItems:"center",gap:6,minWidth:0,fontSize:11,fontWeight:700},Bl={width:16,height:16,display:"flex",alignItems:"center",justifyContent:"center",cursor:"grab",color:"rgba(148,163,184,0.82)",flex:"0 0 auto"},$l={display:"grid",gap:8,padding:10,maxHeight:"min(548px, calc(100vh - 104px))",overflowY:"auto",scrollbarWidth:"thin",scrollbarColor:"rgba(148,163,184,0.55) rgba(255,255,255,0.06)",overscrollBehavior:"contain"},Ee={display:"grid",gap:4,fontSize:10,color:"rgba(226,232,240,0.78)"},Ke={width:"100%",minWidth:0,height:28,borderRadius:8,border:"1px solid rgba(255,255,255,0.10)",background:"rgba(15,23,42,0.8)",color:"#f8fafc",padding:"0 8px",boxSizing:"border-box"},Vl={height:24,borderRadius:8,border:"1px solid rgba(56,189,248,0.25)",background:"rgba(56,189,248,0.16)",color:"#e0f2fe",cursor:"pointer",fontSize:10,fontWeight:700,padding:"0 8px"},Al={display:"grid",gridTemplateColumns:"1fr 74px",alignItems:"center",gap:8},Nl=()=>e.jsx("svg",{width:"11",height:"15",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M11 2h2v4h3l-4 4-4-4h3V2zm0 20v-4H8l4-4 4 4h-3v4h-2zM2 11h4V8l4 4-4 4v-3H2v-2zm20 0v2h-4v3l-4-4 4-4v3h4z"})}),Dl=()=>e.jsx("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"currentColor",children:e.jsx("path",{d:"M19.4 13.5c.1-.5.1-1 .1-1.5s0-1-.1-1.5l2.1-1.6-2-3.5-2.5 1a8 8 0 0 0-2.6-1.5L14 2h-4l-.4 2.9A8 8 0 0 0 7 6.4l-2.5-1-2 3.5 2.1 1.6A10 10 0 0 0 4.5 12c0 .5 0 1 .1 1.5l-2.1 1.6 2 3.5 2.5-1a8 8 0 0 0 2.6 1.5L10 22h4l.4-2.9a8 8 0 0 0 2.6-1.5l2.5 1 2-3.5-2.1-1.6zM12 15.5A3.5 3.5 0 1 1 12 8a3.5 3.5 0 0 1 0 7.5z"})}),Ol=(t,i)=>{const p=t.find(w=>String(w.value)===i);return(p==null?void 0:p.value)??i};function Pl({title:t,value:i,fields:p,onChange:w,copyLabel:j,copyPayload:S,initialPosition:R}){const[k,u]=c.useState(R??{x:14,y:452}),r=c.useRef(null);c.useEffect(()=>{const h=y=>{r.current&&u({x:Math.max(8,y.clientX-r.current.x),y:Math.max(8,y.clientY-r.current.y)})},s=()=>{r.current=null,document.body.classList.remove("select-none")};return window.addEventListener("pointermove",h),window.addEventListener("pointerup",s),()=>{window.removeEventListener("pointermove",h),window.removeEventListener("pointerup",s)}},[]);const o=(h,s)=>{w({...i,[h]:s})},v=async()=>{var s;const h=(S==null?void 0:S(i))??{name:j??t,kind:"settings",settings:i};await((s=navigator.clipboard)==null?void 0:s.writeText(JSON.stringify(h,null,2)))},d=h=>{var y;const s=(y=h.currentTarget.parentElement)==null?void 0:y.parentElement;s&&(r.current={x:h.clientX-s.getBoundingClientRect().left,y:h.clientY-s.getBoundingClientRect().top},document.body.classList.add("select-none"))};return e.jsx("div",{style:{...Fl,left:k.x,top:k.y},children:e.jsxs("div",{style:Ml,children:[e.jsxs("div",{style:Hl,children:[e.jsxs("div",{style:Kl,children:[e.jsx("span",{style:Bl,onPointerDown:d,children:e.jsx(Nl,{})}),e.jsx(Dl,{}),e.jsx("span",{children:t})]}),e.jsx("button",{style:Vl,type:"button",onClick:v,children:"Copy"})]}),e.jsx("div",{style:$l,children:p.map(h=>{const s=i[h.key];if(h.type==="boolean")return e.jsxs("label",{style:Ee,children:[e.jsx("span",{children:h.label}),e.jsx("input",{type:"checkbox",checked:!!s,onChange:y=>o(h.key,y.target.checked)})]},h.key);if(h.type==="number"){const y=Number(s),a=h.min??0,b=h.max??1,I=h.step??.01;return e.jsxs("label",{style:Ee,children:[e.jsx("span",{children:h.label}),e.jsxs("div",{style:Al,children:[e.jsx("input",{type:"range",min:a,max:b,step:I,value:y,onChange:N=>o(h.key,Number(N.target.value))}),e.jsx("input",{style:Ke,type:"number",min:a,max:b,step:I,value:y,onChange:N=>o(h.key,Number(N.target.value))})]})]},h.key)}return h.type==="color"?e.jsxs("label",{style:Ee,children:[e.jsx("span",{children:h.label}),e.jsx("input",{style:{...Ke,padding:2},type:"color",value:String(s),onChange:y=>o(h.key,y.target.value)})]},h.key):h.type==="select"?e.jsxs("label",{style:Ee,children:[e.jsx("span",{children:h.label}),e.jsx("select",{style:Ke,value:String(s),onChange:y=>o(h.key,Ol(h.options,y.target.value)),children:h.options.map(y=>e.jsx("option",{value:String(y.value),children:y.label},`${h.key}-${String(y.value)}`))})]},h.key):e.jsxs("label",{style:Ee,children:[e.jsx("span",{children:h.label}),e.jsx("input",{style:Ke,type:"text",value:String(s),onChange:y=>o(h.key,y.target.value)})]},h.key)})})]})})}var Ue,Be=ie;if(process.env.NODE_ENV==="production")Ue=Be.createRoot,Be.hydrateRoot;else{var jt=Be.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;Ue=function(t,i){jt.usingClientEntryPoint=!0;try{return Be.createRoot(t,i)}finally{jt.usingClientEntryPoint=!1}}}const mt=[{title:"Head and Face",controls:[{key:"strength",label:"Overall Strength",min:0},{key:"faceWidth",label:"Face Width"},{key:"faceHeight",label:"Face Height"},{key:"faceRoundness",label:"Face Roundness"},{key:"midfaceHeight",label:"Midface Height"},{key:"foreheadHeight",label:"Forehead Height"},{key:"foreheadWidth",label:"Forehead Width"},{key:"cheekboneWidth",label:"Cheekbone Width"},{key:"cheekWidth",label:"Cheek Width"},{key:"cheekHollowness",label:"Cheek Hollowness"},{key:"midfaceDepth",label:"Midface Depth"},{key:"scalpHeight",label:"Scalp Height"},{key:"headCurve",label:"Head Curve"},{key:"faceTwist",label:"Face Twist"},{key:"faceSwirl",label:"Face Swirl"}]},{title:"Eyebrows",controls:[{key:"browDistance",label:"Brow Distance"},{key:"browHeight",label:"Brow Height"},{key:"browDepth",label:"Brow Depth"}]},{title:"Eyes",controls:[{key:"leftEyeSize",label:"Left Eye Size"},{key:"rightEyeSize",label:"Right Eye Size"},{key:"eyeDistance",label:"Eye Distance"},{key:"leftEyeX",label:"Left Eye X Offset"},{key:"rightEyeX",label:"Right Eye X Offset"},{key:"leftEyeY",label:"Left Eye Y Offset"},{key:"rightEyeY",label:"Right Eye Y Offset"}]},{title:"Nose, Mouth and Jaw",controls:[{key:"noseSize",label:"Nose Size"},{key:"noseLength",label:"Nose Length"},{key:"mouthWidth",label:"Mouth Width"},{key:"mouthHeight",label:"Mouth Height"},{key:"jawWidth",label:"Jaw Width"},{key:"chinHeight",label:"Chin Height"}]}],wt={pointerEvents:"auto",width:300,maxHeight:"calc(100vh - 32px)",overflow:"auto",borderRadius:16,border:"1px solid rgba(255,255,255,0.12)",background:"rgba(8,15,28,0.72)",boxShadow:"0 16px 36px rgba(0,0,0,0.28)",backdropFilter:"blur(20px) saturate(1.1)",color:"#f8fafc",fontFamily:"system-ui, sans-serif"},St={width:26,height:26,borderRadius:8,border:"1px solid rgba(255,255,255,0.1)",background:"rgba(255,255,255,0.06)",color:"#e2e8f0",cursor:"pointer"},Zl=({value:t,onChange:i})=>{const[p,w]=c.useState(!0),[j,S]=c.useState({x:16,y:96}),[R,k]=c.useState(Object.fromEntries(mt.map(({title:d})=>[d,!0]))),u=c.useRef(null),r=c.useRef(null);c.useEffect(()=>{const d=s=>{u.current&&S({x:Math.max(8,s.clientX-u.current.x),y:Math.max(8,s.clientY-u.current.y)})},h=()=>{u.current=null};return window.addEventListener("pointermove",d),window.addEventListener("pointerup",h),()=>{window.removeEventListener("pointermove",d),window.removeEventListener("pointerup",h)}},[]);const o=d=>{const h=d.currentTarget.getBoundingClientRect();u.current={x:d.clientX-h.left,y:d.clientY-h.top},d.currentTarget.setPointerCapture(d.pointerId)},v=e.jsx("div",{style:{position:"fixed",left:j.x,top:j.y,zIndex:2e4},children:p?e.jsxs("div",{style:wt,children:[e.jsxs("div",{onPointerDown:o,style:{position:"sticky",top:0,zIndex:1,display:"flex",alignItems:"center",gap:8,padding:8,background:"rgba(8,15,28,0.94)",borderBottom:"1px solid rgba(255,255,255,0.08)",cursor:"grab"},children:[e.jsx("span",{style:{fontSize:11,fontWeight:650,flex:1},children:"3D Face Warp"}),e.jsxs("label",{style:{display:"flex",alignItems:"center",gap:5,fontSize:9},children:[e.jsx("span",{children:"Enabled"}),e.jsx("input",{type:"checkbox",checked:t.enabled,onPointerDown:d=>d.stopPropagation(),onChange:d=>i({...t,enabled:d.target.checked})})]}),e.jsx("button",{type:"button",style:St,title:"Reset",onPointerDown:d=>d.stopPropagation(),onClick:()=>i({...Bt.DEFAULT_FACE_WARP_3D_SETTINGS,enabled:!0}),children:"↺"}),e.jsx("button",{type:"button",style:St,title:"Close",onPointerDown:d=>d.stopPropagation(),onClick:()=>w(!1),children:"×"})]}),e.jsx("div",{style:{display:"grid",gap:6,padding:7},children:mt.map(({title:d,controls:h})=>e.jsxs("section",{style:{border:"1px solid rgba(255,255,255,0.08)",borderRadius:12,overflow:"hidden"},children:[e.jsxs("button",{type:"button",onClick:()=>k(s=>({...s,[d]:!s[d]})),style:{width:"100%",padding:"8px",border:0,background:"rgba(255,255,255,0.03)",color:"#e2e8f0",display:"flex",justifyContent:"space-between",cursor:"pointer",fontSize:10.5},children:[e.jsx("span",{children:d}),e.jsx("span",{children:R[d]?"−":"+"})]}),R[d]?e.jsx("div",{style:{display:"grid",gap:6,padding:8},children:h.map(({key:s,label:y,min:a=-100,max:b=100})=>{const I=Math.round(t[s]*100);return e.jsxs("label",{style:{display:"grid",gridTemplateColumns:"105px 32px 1fr",gap:7,alignItems:"center",fontSize:9},children:[e.jsx("span",{style:{color:"rgba(226,232,240,0.76)"},children:y}),e.jsx("output",{style:{textAlign:"right",fontVariantNumeric:"tabular-nums"},children:I}),e.jsx("input",{type:"range",min:a,max:b,value:I,onChange:N=>i({...t,[s]:Number(N.target.value)/100}),style:{width:"100%",accentColor:"#e2e8f0"}})]},s)})}):null]},d))})]}):e.jsx("button",{type:"button",style:{...wt,width:38,height:38,cursor:"pointer"},onClick:()=>w(!0),title:"Open 3D Face Warp settings",children:"3D"})});return c.useEffect(()=>{const d=document.createElement("div");return d.dataset.xrDebugUi="face-warp-3d",document.body.appendChild(d),r.current=Ue(d),()=>{var h;(h=r.current)==null||h.unmount(),r.current=null,d.remove()}},[]),c.useEffect(()=>{var d;(d=r.current)==null||d.render(v)},[v]),null};exports.MediaSourceSwitcher=$e.MediaSourceSwitcher;exports.defaultMediaSources=$e.defaultMediaSources;exports.sdkImageMediaSources=$e.sdkImageMediaSources;exports.sdkVideoMediaSources=$e.sdkVideoMediaSources;exports.DefaultSettingPanel=Ht.DefaultSettingPanel;exports.FaceWarp3DSettingsPanel=Zl;exports.HandJoints2DSettingsPanel=el;exports.HandTracking2DControllerSettingsPanel=Vn;exports.HandTracking2DSettingsPanel=kn;exports.HandTracking3DSettingsPanel=gl;exports.LayerPanel=Ll;exports.ScreenImageSettingsPanel=ln;exports.ScreenTextSettingsPanel=Cs;exports.SettingsPanel=Pl;