@wix/legends-platform-sdk 1.32.0 → 1.34.0

package/README.md

@@ -140,6 +140,8 @@ const { messages, status, send, fetchNext } = useTextChat();
 await send({ message: 'Hello' });
 ```
 
+Pass `useTextChat({ conversationLanguage: 'es' })` (or the same option to `useTextChatStream`) to send that language on every message, tool results included. Omit it to keep the default language behavior.
+
 #### `useTextChatStream(options)`
 
 Streaming counterpart to `useTextChat`. Sends messages over SSE and drips the assistant reply into `streamingText` at a steady rate via `requestAnimationFrame`.

package/dist/cjs/components/ChromaKey/ChromaKey.js

@@ -2,6 +2,8 @@
 
 exports.__esModule = true;
 exports.ChromaKey = ChromaKey;
+var _useStartupAttempt = require("../../startup-telemetry/useStartupAttempt");
+var _frame = require("../../startup-telemetry/frame");
 var _react = _interopRequireWildcard(require("react"));
 var _chromaKey = require("./chroma-key");
 var _usePictureInPicture = require("../../hooks/usePictureInPicture");
@@ -33,6 +35,8 @@ function ChromaKey(props) {
   } = children.props;
   const [isPlayable, setIsPlayable] = (0, _react.useState)(false);
   const [isWebGLAvailable, setIsWebGLAvailable] = (0, _react.useState)(null);
+  const startupAttempt = (0, _useStartupAttempt.useStartupAttempt)();
+  const visibleAttempt = children.props.type === 'agent' ? startupAttempt : undefined;
   const $video = (0, _react.useRef)(null);
   const $canvas = (0, _react.useRef)(null);
   const isPiPActive = (0, _jotai.useAtomValue)(_usePictureInPicture.pipActiveAtom);
@@ -57,7 +61,12 @@ function ChromaKey(props) {
       spill,
       similarity,
       smoothness,
-      background
+      background,
+      onFrameDrawn: () => {
+        if ($canvas.current && $video.current) {
+          (0, _frame.recordCanvasFrame)(visibleAttempt, $canvas.current, $video.current);
+        }
+      }
     });
     setIsWebGLAvailable(process !== null);
     if (!process) {
@@ -84,7 +93,7 @@ function ChromaKey(props) {
       isActive = false;
       cancelAnimationFrame(rafId);
     };
-  }, [color, spill, similarity, smoothness, isPlayable, debug, background]);
+  }, [color, spill, similarity, smoothness, isPlayable, debug, background, visibleAttempt]);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: className,
     style: {
@@ -95,7 +104,7 @@ function ChromaKey(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 128,
+      lineNumber: 149,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement("canvas", {
@@ -115,12 +124,13 @@ function ChromaKey(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 136,
+      lineNumber: 157,
       columnNumber: 7
     }
   }), !isPlayable && fallback, showPipFallback && pipFallback, /*#__PURE__*/_react.default.cloneElement(children, {
     ...restVideoProps,
     // cloneElement retains original props; only ChromaKey should own PiP.
+    startupRenderSurface: useVideoFallback ? 'video' : 'canvas',
     pip: false,
     pipFallback: undefined,
     onPiPEnter: undefined,

package/dist/cjs/components/ChromaKey/ChromaKey.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_chromaKey","_usePictureInPicture","_jotai","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ChromaKey","props","debug","children","color","spill","smoothness","similarity","fallback","background","className","style","width","height","pip","pipFallback","onPiPEnter","onPiPExit","onPiPError","restVideoProps","isPlayable","setIsPlayable","useState","isWebGLAvailable","setIsWebGLAvailable","$video","useRef","$canvas","isPiPActive","useAtomValue","pipActiveAtom","useVideoFallback","pipElement","current","usePictureInPictureAuto","element","onEnter","onExit","onError","showPipFallback","useEffect","console","warn","process","chromaKey","log","rafId","isActive","loop","requestAnimationFrame","cancelAnimationFrame","createElement","__self","__source","fileName","lineNumber","columnNumber","ref","display","position","opacity","pointerEvents","visibility","zIndex","React","cloneElement","undefined","onCanPlay","checkPlayable","onLoadedMetadata","event","readyState","currentTarget","HTMLMediaElement","HAVE_FUTURE_DATA"],"sources":["../../../../src/components/ChromaKey/ChromaKey.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { chromaKey } from './chroma-key';\nimport {\n  pipActiveAtom,\n  usePictureInPictureAuto,\n} from '../../hooks/usePictureInPicture';\nimport { useAtomValue } from 'jotai';\n\ninterface ChromaKeyProps extends React.HTMLAttributes<HTMLCanvasElement> {\n  debug?: boolean;\n  color?: string;\n  spill?: number;\n  similarity?: number;\n  smoothness?: number;\n  fallback?: React.ReactNode;\n  background?: string | null;\n  children: React.ReactElement<\n    React.VideoHTMLAttributes<HTMLVideoElement> & {\n      ref?: React.Ref<HTMLVideoElement>;\n      pip?: boolean;\n      pipFallback?: React.ReactNode;\n      onPiPEnter?: () => void;\n      onPiPExit?: () => void;\n      onPiPError?: (error: Error) => void;\n    }\n  >;\n}\n\nexport function ChromaKey(props: ChromaKeyProps) {\n  const {\n    debug = false,\n    children,\n    color = '#03ff9c',\n    spill = 0.1,\n    smoothness = 0.15,\n    similarity = 0.3,\n    fallback,\n    background,\n  } = props;\n\n  const {\n    className,\n    style,\n    width,\n    height,\n    pip,\n    pipFallback,\n    onPiPEnter,\n    onPiPExit,\n    onPiPError,\n    ...restVideoProps\n  } = children.props;\n  const [isPlayable, setIsPlayable] = useState(false);\n  const [isWebGLAvailable, setIsWebGLAvailable] = useState<boolean | null>(\n    null,\n  );\n\n  const $video = useRef<HTMLVideoElement>(null);\n  const $canvas = useRef<HTMLCanvasElement>(null);\n  const isPiPActive = useAtomValue(pipActiveAtom);\n  const useVideoFallback = isWebGLAvailable === false;\n  const pipElement =\n    isWebGLAvailable === null\n      ? null\n      : useVideoFallback\n      ? $video.current\n      : $canvas.current;\n\n  // Setup PiP - hook handles canvas → video conversion internally\n  usePictureInPictureAuto({\n    element: pip && isPlayable ? pipElement : null,\n    onEnter: onPiPEnter,\n    onExit: onPiPExit,\n    onError: onPiPError,\n  });\n\n  const showPipFallback = pip && isPiPActive;\n\n  useEffect(() => {\n    if (!$video.current || !$canvas.current || !isPlayable) {\n      debug && console.warn('Video or canvas is not initialized');\n\n      return;\n    }\n\n    const process = chromaKey($video.current, $canvas.current, {\n      color,\n      spill,\n      similarity,\n      smoothness,\n      background,\n    });\n    setIsWebGLAvailable(process !== null);\n    if (!process) {\n      return;\n    }\n\n    debug &&\n      console.log('Chroma key initialized', $video.current, $canvas.current, {\n        color,\n        spill,\n        similarity,\n        smoothness,\n      });\n\n    let rafId: number;\n    let isActive = true;\n\n    function loop() {\n      if (!isActive) {\n        return;\n      }\n      process?.();\n      rafId = requestAnimationFrame(loop);\n    }\n\n    rafId = requestAnimationFrame(loop);\n\n    return () => {\n      debug && console.log('Chroma key process cleanup');\n      isActive = false;\n      cancelAnimationFrame(rafId);\n    };\n  }, [color, spill, similarity, smoothness, isPlayable, debug, background]);\n\n  return (\n    <div\n      className={className}\n      style={{\n        ...style,\n        width,\n        height,\n      }}\n    >\n      <canvas\n        ref={$canvas}\n        style={{\n          width: '100%',\n          height: '100%',\n          display: useVideoFallback || showPipFallback ? 'none' : 'block',\n          ...(isPlayable\n            ? {}\n            : {\n                position: 'absolute',\n                opacity: 0,\n                pointerEvents: 'none',\n                visibility: 'hidden',\n                zIndex: -1,\n              }),\n        }}\n      />\n      {!isPlayable && fallback}\n      {showPipFallback && pipFallback}\n\n      {React.cloneElement(children, {\n        ...restVideoProps,\n        // cloneElement retains original props; only ChromaKey should own PiP.\n        pip: false,\n        pipFallback: undefined,\n        onPiPEnter: undefined,\n        onPiPExit: undefined,\n        onPiPError: undefined,\n        ref: $video,\n        style: useVideoFallback\n          ? {\n              width: '100%',\n              height: '100%',\n              ...style,\n              display: isPlayable && !showPipFallback ? style?.display : 'none',\n            }\n          : { display: 'none' },\n        onCanPlay: checkPlayable,\n        onLoadedMetadata: checkPlayable,\n      })}\n    </div>\n  );\n\n  function checkPlayable(event: React.SyntheticEvent<HTMLVideoElement>) {\n    const readyState = event.currentTarget.readyState;\n\n    setIsPlayable(readyState >= HTMLMediaElement.HAVE_FUTURE_DATA);\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_useStartupAttempt","require","_frame","_react","_interopRequireWildcard","_chromaKey","_usePictureInPicture","_jotai","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ChromaKey","props","debug","children","color","spill","smoothness","similarity","fallback","background","className","style","width","height","pip","pipFallback","onPiPEnter","onPiPExit","onPiPError","restVideoProps","isPlayable","setIsPlayable","useState","isWebGLAvailable","setIsWebGLAvailable","startupAttempt","useStartupAttempt","visibleAttempt","type","undefined","$video","useRef","$canvas","isPiPActive","useAtomValue","pipActiveAtom","useVideoFallback","pipElement","current","usePictureInPictureAuto","element","onEnter","onExit","onError","showPipFallback","useEffect","console","warn","process","chromaKey","onFrameDrawn","recordCanvasFrame","log","rafId","isActive","loop","requestAnimationFrame","cancelAnimationFrame","createElement","__self","__source","fileName","lineNumber","columnNumber","ref","display","position","opacity","pointerEvents","visibility","zIndex","React","cloneElement","startupRenderSurface","onCanPlay","checkPlayable","onLoadedMetadata","event","readyState","currentTarget","HTMLMediaElement","HAVE_FUTURE_DATA"],"sources":["../../../../src/components/ChromaKey/ChromaKey.tsx"],"sourcesContent":["import { useStartupAttempt } from '../../startup-telemetry/useStartupAttempt';\nimport { recordCanvasFrame } from '../../startup-telemetry/frame';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { chromaKey } from './chroma-key';\nimport {\n  pipActiveAtom,\n  usePictureInPictureAuto,\n} from '../../hooks/usePictureInPicture';\nimport { useAtomValue } from 'jotai';\n\ninterface ChromaKeyProps extends React.HTMLAttributes<HTMLCanvasElement> {\n  debug?: boolean;\n  color?: string;\n  spill?: number;\n  similarity?: number;\n  smoothness?: number;\n  fallback?: React.ReactNode;\n  background?: string | null;\n  children: React.ReactElement<\n    React.VideoHTMLAttributes<HTMLVideoElement> & {\n      ref?: React.Ref<HTMLVideoElement>;\n      startupRenderSurface?: 'video' | 'canvas';\n      type?: 'agent' | 'user' | 'screen';\n      pip?: boolean;\n      pipFallback?: React.ReactNode;\n      onPiPEnter?: () => void;\n      onPiPExit?: () => void;\n      onPiPError?: (error: Error) => void;\n    }\n  >;\n}\n\nexport function ChromaKey(props: ChromaKeyProps) {\n  const {\n    debug = false,\n    children,\n    color = '#03ff9c',\n    spill = 0.1,\n    smoothness = 0.15,\n    similarity = 0.3,\n    fallback,\n    background,\n  } = props;\n\n  const {\n    className,\n    style,\n    width,\n    height,\n    pip,\n    pipFallback,\n    onPiPEnter,\n    onPiPExit,\n    onPiPError,\n    ...restVideoProps\n  } = children.props;\n  const [isPlayable, setIsPlayable] = useState(false);\n  const [isWebGLAvailable, setIsWebGLAvailable] = useState<boolean | null>(\n    null,\n  );\n\n  const startupAttempt = useStartupAttempt();\n  const visibleAttempt =\n    children.props.type === 'agent' ? startupAttempt : undefined;\n  const $video = useRef<HTMLVideoElement>(null);\n  const $canvas = useRef<HTMLCanvasElement>(null);\n  const isPiPActive = useAtomValue(pipActiveAtom);\n  const useVideoFallback = isWebGLAvailable === false;\n  const pipElement =\n    isWebGLAvailable === null\n      ? null\n      : useVideoFallback\n      ? $video.current\n      : $canvas.current;\n\n  // Setup PiP - hook handles canvas → video conversion internally\n  usePictureInPictureAuto({\n    element: pip && isPlayable ? pipElement : null,\n    onEnter: onPiPEnter,\n    onExit: onPiPExit,\n    onError: onPiPError,\n  });\n\n  const showPipFallback = pip && isPiPActive;\n\n  useEffect(() => {\n    if (!$video.current || !$canvas.current || !isPlayable) {\n      debug && console.warn('Video or canvas is not initialized');\n\n      return;\n    }\n\n    const process = chromaKey($video.current, $canvas.current, {\n      color,\n      spill,\n      similarity,\n      smoothness,\n      background,\n      onFrameDrawn: () => {\n        if ($canvas.current && $video.current) {\n          recordCanvasFrame(visibleAttempt, $canvas.current, $video.current);\n        }\n      },\n    });\n    setIsWebGLAvailable(process !== null);\n    if (!process) {\n      return;\n    }\n\n    debug &&\n      console.log('Chroma key initialized', $video.current, $canvas.current, {\n        color,\n        spill,\n        similarity,\n        smoothness,\n      });\n\n    let rafId: number;\n    let isActive = true;\n\n    function loop() {\n      if (!isActive) {\n        return;\n      }\n      process?.();\n      rafId = requestAnimationFrame(loop);\n    }\n\n    rafId = requestAnimationFrame(loop);\n\n    return () => {\n      debug && console.log('Chroma key process cleanup');\n      isActive = false;\n      cancelAnimationFrame(rafId);\n    };\n  }, [\n    color,\n    spill,\n    similarity,\n    smoothness,\n    isPlayable,\n    debug,\n    background,\n    visibleAttempt,\n  ]);\n\n  return (\n    <div\n      className={className}\n      style={{\n        ...style,\n        width,\n        height,\n      }}\n    >\n      <canvas\n        ref={$canvas}\n        style={{\n          width: '100%',\n          height: '100%',\n          display: useVideoFallback || showPipFallback ? 'none' : 'block',\n          ...(isPlayable\n            ? {}\n            : {\n                position: 'absolute',\n                opacity: 0,\n                pointerEvents: 'none',\n                visibility: 'hidden',\n                zIndex: -1,\n              }),\n        }}\n      />\n      {!isPlayable && fallback}\n      {showPipFallback && pipFallback}\n\n      {React.cloneElement(children, {\n        ...restVideoProps,\n        // cloneElement retains original props; only ChromaKey should own PiP.\n        startupRenderSurface: useVideoFallback ? 'video' : 'canvas',\n        pip: false,\n        pipFallback: undefined,\n        onPiPEnter: undefined,\n        onPiPExit: undefined,\n        onPiPError: undefined,\n        ref: $video,\n        style: useVideoFallback\n          ? {\n              width: '100%',\n              height: '100%',\n              ...style,\n              display: isPlayable && !showPipFallback ? style?.display : 'none',\n            }\n          : { display: 'none' },\n        onCanPlay: checkPlayable,\n        onLoadedMetadata: checkPlayable,\n      })}\n    </div>\n  );\n\n  function checkPlayable(event: React.SyntheticEvent<HTMLVideoElement>) {\n    const readyState = event.currentTarget.readyState;\n\n    setIsPlayable(readyState >= HTMLMediaElement.HAVE_FUTURE_DATA);\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ChromaKey/chroma-key.js

@@ -96,6 +96,9 @@ function chromaKey($video, $canvas, options) {
     gl.uniform3f($color$, parseInt(color.substr(1, 2), 16) / 255, parseInt(color.substr(3, 2), 16) / 255, parseInt(color.substr(5, 2), 16) / 255);
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, $video);
     gl.drawArrays(gl.TRIANGLE_FAN, 0, 4);
+    if (!gl.isContextLost()) {
+      options.onFrameDrawn == null || options.onFrameDrawn();
+    }
   };
 }
 //# sourceMappingURL=chroma-key.js.map

package/dist/cjs/components/ChromaKey/chroma-key.js.map

@@ -1 +1 @@
-{"version":3,"names":["_invariant","_interopRequireDefault","require","shaders","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","chromaKey","$video","$canvas","options","gl","getContext","alpha","premultipliedAlpha","preserveDrawingBuffer","BUFFER","createBuffer","TEXTURE","createTexture","program","createProgram","_VS_","createShader","VERTEX_SHADER","_FS_","FRAGMENT_SHADER","invariant","shaderSource","VertexAlign","ChromaKey","compileShader","getShaderParameter","COMPILE_STATUS","console","error","getShaderInfoLog","attachShader","linkProgram","useProgram","bindTexture","TEXTURE_2D","bindBuffer","ARRAY_BUFFER","bufferData","Float32Array","STATIC_DRAW","texParameteri","TEXTURE_MIN_FILTER","LINEAR","TEXTURE_WRAP_S","CLAMP_TO_EDGE","TEXTURE_WRAP_T","$coords$","getAttribLocation","$texture$","getUniformLocation","$width$","$height$","$color$","$similarity$","$smoothness$","$spill$","vertexAttribPointer","FLOAT","enableVertexAttribArray","activeTexture","TEXTURE0","enable","BLEND","blendFunc","SRC_ALPHA","ONE_MINUS_SRC_ALPHA","process","color","spill","similarity","smoothness","background","videoWidth","videoHeight","width","window","devicePixelRatio","height","viewport","parseInt","substring","g","b","clearColor","clear","COLOR_BUFFER_BIT","uniform1i","uniform1f","uniform3f","substr","texImage2D","RGB","UNSIGNED_BYTE","drawArrays","TRIANGLE_FAN"],"sources":["../../../../src/components/ChromaKey/chroma-key.ts"],"sourcesContent":["import invariant from 'invariant';\n\nimport * as shaders from './shaders';\n\nexport type ProcessCallback = () => void;\n\nexport function chromaKey(\n  $video: HTMLVideoElement,\n  $canvas: HTMLCanvasElement,\n  options: {\n    color: string;\n    spill: number;\n    similarity: number;\n    smoothness: number;\n    background?: string | null;\n  },\n): ProcessCallback | null {\n  const gl = $canvas.getContext('webgl', {\n    alpha: true,\n    premultipliedAlpha: false,\n    preserveDrawingBuffer: true,\n  });\n\n  if (!gl) {\n    return null;\n  }\n\n  const BUFFER = gl.createBuffer();\n  const TEXTURE = gl.createTexture();\n  const program = gl.createProgram();\n  const _VS_ = gl.createShader(gl.VERTEX_SHADER);\n  const _FS_ = gl.createShader(gl.FRAGMENT_SHADER);\n\n  invariant(program, 'Program is not initialized');\n  invariant(_VS_, 'Vertex shader is not initialized');\n  invariant(_FS_, 'Fragment shader is not initialized');\n\n  gl.shaderSource(_VS_, shaders.VertexAlign);\n  gl.shaderSource(_FS_, shaders.ChromaKey);\n\n  gl.compileShader(_VS_);\n  gl.compileShader(_FS_);\n\n  if (!gl.getShaderParameter(_FS_, gl.COMPILE_STATUS)) {\n    console.error(\n      'Fragment shader compilation failed',\n      gl.getShaderInfoLog(_FS_),\n    );\n  }\n\n  gl.attachShader(program, _VS_);\n  gl.attachShader(program, _FS_);\n\n  gl.linkProgram(program);\n  gl.useProgram(program);\n\n  gl.bindTexture(gl.TEXTURE_2D, TEXTURE);\n  gl.bindBuffer(gl.ARRAY_BUFFER, BUFFER);\n\n  gl.bufferData(\n    gl.ARRAY_BUFFER,\n    new Float32Array([-1, 1, -1, -1, 1, -1, 1, 1]),\n    gl.STATIC_DRAW,\n  );\n\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);\n\n  const $coords$ = gl.getAttribLocation(program, 'coords');\n  const $texture$ = gl.getUniformLocation(program, 'tex');\n  const $width$ = gl.getUniformLocation(program, 'texWidth');\n  const $height$ = gl.getUniformLocation(program, 'texHeight');\n  const $color$ = gl.getUniformLocation(program, 'keyColor');\n  const $similarity$ = gl.getUniformLocation(program, 'similarity');\n  const $smoothness$ = gl.getUniformLocation(program, 'smoothness');\n  const $spill$ = gl.getUniformLocation(program, 'spill');\n\n  gl.vertexAttribPointer($coords$, 2, gl.FLOAT, false, 0, 0);\n  gl.enableVertexAttribArray($coords$);\n\n  gl.activeTexture(gl.TEXTURE0);\n\n  // Enable blending for transparency (critical for Safari)\n  gl.enable(gl.BLEND);\n  gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);\n\n  return function process() {\n    const { color, spill, similarity, smoothness, background } = options;\n\n    // Use video dimensions directly instead of metadata (for Safari compatibility)\n    const videoWidth = $video.videoWidth;\n    const videoHeight = $video.videoHeight;\n\n    if (!videoWidth || !videoHeight) {\n      return; // Video not ready yet\n    }\n\n    const width = videoWidth * window.devicePixelRatio;\n    const height = videoHeight * window.devicePixelRatio;\n\n    $canvas.width = width;\n    $canvas.height = height;\n\n    gl.viewport(0, 0, width, height);\n\n    // Clear with background color or transparent\n    if (background) {\n      const r = parseInt(background.substring(1, 3), 16) / 255;\n      const g = parseInt(background.substring(3, 5), 16) / 255;\n      const b = parseInt(background.substring(5, 7), 16) / 255;\n      gl.clearColor(r, g, b, 1);\n    } else {\n      gl.clearColor(0, 0, 0, 0);\n    }\n    gl.clear(gl.COLOR_BUFFER_BIT);\n\n    gl.useProgram(program);\n\n    gl.uniform1i($texture$, 0);\n    gl.uniform1f($width$, width);\n    gl.uniform1f($height$, height);\n    gl.uniform1f($spill$, spill);\n    gl.uniform1f($similarity$, similarity);\n    gl.uniform1f($smoothness$, smoothness);\n    gl.uniform3f(\n      $color$,\n      parseInt(color.substr(1, 2), 16) / 255,\n      parseInt(color.substr(3, 2), 16) / 255,\n      parseInt(color.substr(5, 2), 16) / 255,\n    );\n\n    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, $video);\n    gl.drawArrays(gl.TRIANGLE_FAN, 0, 4);\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_invariant","_interopRequireDefault","require","shaders","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","chromaKey","$video","$canvas","options","gl","getContext","alpha","premultipliedAlpha","preserveDrawingBuffer","BUFFER","createBuffer","TEXTURE","createTexture","program","createProgram","_VS_","createShader","VERTEX_SHADER","_FS_","FRAGMENT_SHADER","invariant","shaderSource","VertexAlign","ChromaKey","compileShader","getShaderParameter","COMPILE_STATUS","console","error","getShaderInfoLog","attachShader","linkProgram","useProgram","bindTexture","TEXTURE_2D","bindBuffer","ARRAY_BUFFER","bufferData","Float32Array","STATIC_DRAW","texParameteri","TEXTURE_MIN_FILTER","LINEAR","TEXTURE_WRAP_S","CLAMP_TO_EDGE","TEXTURE_WRAP_T","$coords$","getAttribLocation","$texture$","getUniformLocation","$width$","$height$","$color$","$similarity$","$smoothness$","$spill$","vertexAttribPointer","FLOAT","enableVertexAttribArray","activeTexture","TEXTURE0","enable","BLEND","blendFunc","SRC_ALPHA","ONE_MINUS_SRC_ALPHA","process","color","spill","similarity","smoothness","background","videoWidth","videoHeight","width","window","devicePixelRatio","height","viewport","parseInt","substring","g","b","clearColor","clear","COLOR_BUFFER_BIT","uniform1i","uniform1f","uniform3f","substr","texImage2D","RGB","UNSIGNED_BYTE","drawArrays","TRIANGLE_FAN","isContextLost","onFrameDrawn"],"sources":["../../../../src/components/ChromaKey/chroma-key.ts"],"sourcesContent":["import invariant from 'invariant';\n\nimport * as shaders from './shaders';\n\nexport type ProcessCallback = () => void;\n\nexport function chromaKey(\n  $video: HTMLVideoElement,\n  $canvas: HTMLCanvasElement,\n  options: {\n    onFrameDrawn?: () => void;\n    color: string;\n    spill: number;\n    similarity: number;\n    smoothness: number;\n    background?: string | null;\n  },\n): ProcessCallback | null {\n  const gl = $canvas.getContext('webgl', {\n    alpha: true,\n    premultipliedAlpha: false,\n    preserveDrawingBuffer: true,\n  });\n\n  if (!gl) {\n    return null;\n  }\n\n  const BUFFER = gl.createBuffer();\n  const TEXTURE = gl.createTexture();\n  const program = gl.createProgram();\n  const _VS_ = gl.createShader(gl.VERTEX_SHADER);\n  const _FS_ = gl.createShader(gl.FRAGMENT_SHADER);\n\n  invariant(program, 'Program is not initialized');\n  invariant(_VS_, 'Vertex shader is not initialized');\n  invariant(_FS_, 'Fragment shader is not initialized');\n\n  gl.shaderSource(_VS_, shaders.VertexAlign);\n  gl.shaderSource(_FS_, shaders.ChromaKey);\n\n  gl.compileShader(_VS_);\n  gl.compileShader(_FS_);\n\n  if (!gl.getShaderParameter(_FS_, gl.COMPILE_STATUS)) {\n    console.error(\n      'Fragment shader compilation failed',\n      gl.getShaderInfoLog(_FS_),\n    );\n  }\n\n  gl.attachShader(program, _VS_);\n  gl.attachShader(program, _FS_);\n\n  gl.linkProgram(program);\n  gl.useProgram(program);\n\n  gl.bindTexture(gl.TEXTURE_2D, TEXTURE);\n  gl.bindBuffer(gl.ARRAY_BUFFER, BUFFER);\n\n  gl.bufferData(\n    gl.ARRAY_BUFFER,\n    new Float32Array([-1, 1, -1, -1, 1, -1, 1, 1]),\n    gl.STATIC_DRAW,\n  );\n\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);\n  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);\n\n  const $coords$ = gl.getAttribLocation(program, 'coords');\n  const $texture$ = gl.getUniformLocation(program, 'tex');\n  const $width$ = gl.getUniformLocation(program, 'texWidth');\n  const $height$ = gl.getUniformLocation(program, 'texHeight');\n  const $color$ = gl.getUniformLocation(program, 'keyColor');\n  const $similarity$ = gl.getUniformLocation(program, 'similarity');\n  const $smoothness$ = gl.getUniformLocation(program, 'smoothness');\n  const $spill$ = gl.getUniformLocation(program, 'spill');\n\n  gl.vertexAttribPointer($coords$, 2, gl.FLOAT, false, 0, 0);\n  gl.enableVertexAttribArray($coords$);\n\n  gl.activeTexture(gl.TEXTURE0);\n\n  // Enable blending for transparency (critical for Safari)\n  gl.enable(gl.BLEND);\n  gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);\n\n  return function process() {\n    const { color, spill, similarity, smoothness, background } = options;\n\n    // Use video dimensions directly instead of metadata (for Safari compatibility)\n    const videoWidth = $video.videoWidth;\n    const videoHeight = $video.videoHeight;\n\n    if (!videoWidth || !videoHeight) {\n      return; // Video not ready yet\n    }\n\n    const width = videoWidth * window.devicePixelRatio;\n    const height = videoHeight * window.devicePixelRatio;\n\n    $canvas.width = width;\n    $canvas.height = height;\n\n    gl.viewport(0, 0, width, height);\n\n    // Clear with background color or transparent\n    if (background) {\n      const r = parseInt(background.substring(1, 3), 16) / 255;\n      const g = parseInt(background.substring(3, 5), 16) / 255;\n      const b = parseInt(background.substring(5, 7), 16) / 255;\n      gl.clearColor(r, g, b, 1);\n    } else {\n      gl.clearColor(0, 0, 0, 0);\n    }\n    gl.clear(gl.COLOR_BUFFER_BIT);\n\n    gl.useProgram(program);\n\n    gl.uniform1i($texture$, 0);\n    gl.uniform1f($width$, width);\n    gl.uniform1f($height$, height);\n    gl.uniform1f($spill$, spill);\n    gl.uniform1f($similarity$, similarity);\n    gl.uniform1f($smoothness$, smoothness);\n    gl.uniform3f(\n      $color$,\n      parseInt(color.substr(1, 2), 16) / 255,\n      parseInt(color.substr(3, 2), 16) / 255,\n      parseInt(color.substr(5, 2), 16) / 255,\n    );\n\n    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, $video);\n    gl.drawArrays(gl.TRIANGLE_FAN, 0, 4);\n    if (!gl.isContextLost()) {\n      options.onFrameDrawn?.();\n    }\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/LegendsPlatform/LegendsPlatform.js

@@ -9,9 +9,11 @@ var _reactQuery = require("@tanstack/react-query");
 var _reactBus = require("react-bus");
 var _FetchPersonaChatService = require("../../services/FetchPersonaChatService");
 var _sdkConsumer = require("../../sdk-consumer");
+var _attempt = require("../../startup-telemetry/attempt");
 var _jsxFileName = "/home/builduser/work/cfec65c05e11cc5b/packages/legends-platform-sdk/dist/cjs/components/LegendsPlatform/LegendsPlatform.tsx";
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function LegendsPlatform(props) {
+  var _props$startupTelemet, _props$startupTelemet2, _props$startupTelemet3;
   const {
     chatId,
     namespace,
@@ -39,18 +41,41 @@ function LegendsPlatform(props) {
     }
     return undefined;
   }, [personaChatService, apiKey]);
+  const telemetryRef = (0, _react.useRef)(props.startupTelemetry);
+  telemetryRef.current = props.startupTelemetry;
+  const telemetryEnabled = (_props$startupTelemet = props.startupTelemetry) == null ? void 0 : _props$startupTelemet.enabled;
+  const intentId = (_props$startupTelemet2 = props.startupTelemetry) == null || (_props$startupTelemet2 = _props$startupTelemet2.intent) == null ? void 0 : _props$startupTelemet2.id;
+  const attemptId = (_props$startupTelemet3 = props.startupTelemetry) == null || (_props$startupTelemet3 = _props$startupTelemet3.attempt) == null ? void 0 : _props$startupTelemet3.id;
+  const startupTelemetrySession = (0, _react.useMemo)(() => {
+    const config = telemetryRef.current;
+    if (!telemetryEnabled || !config) {
+      return undefined;
+    }
+    return new _attempt.StartupTelemetrySession({
+      ...config,
+      report: event => {
+        var _telemetryRef$current;
+        if ((_telemetryRef$current = telemetryRef.current) != null && _telemetryRef$current.enabled) {
+          return telemetryRef.current.report == null ? void 0 : telemetryRef.current.report(event);
+        }
+        return undefined;
+      }
+    }, chatId);
+    // A new intent/attempt changes ownership; report callbacks stay live via the ref.
+  }, [chatId, telemetryEnabled, intentId, attemptId]);
   const consumer = (0, _react.useMemo)(() => ({
     chatId,
     namespace,
     tools,
-    personaChatService: resolvedService
-  }), [chatId, namespace, tools, resolvedService]);
+    personaChatService: resolvedService,
+    startupTelemetrySession
+  }), [chatId, namespace, tools, resolvedService, startupTelemetrySession]);
   return /*#__PURE__*/_react.default.createElement(_sdkConsumer.SdkConsumerContext.Provider, {
     value: consumer,
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 65,
+      lineNumber: 101,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(_reactQuery.QueryClientProvider, {
@@ -58,7 +83,7 @@ function LegendsPlatform(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 66,
+      lineNumber: 102,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement(_jotai.Provider, {
@@ -66,14 +91,14 @@ function LegendsPlatform(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 67,
+      lineNumber: 103,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_reactBus.Provider, {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 68,
+      lineNumber: 104,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement(_componentsReact.LiveKitRoom, {
@@ -83,7 +108,7 @@ function LegendsPlatform(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 69,
+      lineNumber: 105,
       columnNumber: 13
     }
   }, children)))));

package/dist/cjs/components/LegendsPlatform/LegendsPlatform.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_jotai","_componentsReact","_reactQuery","_reactBus","_FetchPersonaChatService","_sdkConsumer","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","LegendsPlatform","props","chatId","namespace","children","className","tools","apiKey","personaChatService","store","useMemo","createStore","queryClient","QueryClient","defaultOptions","queries","refetchOnMount","refetchOnWindowFocus","resolvedService","FetchPersonaChatService","undefined","consumer","createElement","SdkConsumerContext","Provider","value","__self","__source","fileName","lineNumber","columnNumber","QueryClientProvider","client","LiveKitRoom","serverUrl","token"],"sources":["../../../../src/components/LegendsPlatform/LegendsPlatform.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Provider, createStore } from 'jotai';\nimport { type Store } from 'jotai/vanilla/store';\nimport { LiveKitRoom } from '@livekit/components-react';\nimport { QueryClientProvider, QueryClient } from '@tanstack/react-query';\nimport { Provider as BusProvider } from 'react-bus';\n\nimport type { ToolsRegistry } from '../../hooks/useTools/model/types';\nimport type { IPersonaChatService } from '../../types/service';\nimport { FetchPersonaChatService } from '../../services/FetchPersonaChatService';\nimport { SdkConsumerContext } from '../../sdk-consumer';\n\nexport type LegendsPlatformProps = {\n  chatId: string;\n  namespace: string;\n  apiKey?: string;\n  personaChatService?: IPersonaChatService;\n  store?: Store;\n  tools?: ToolsRegistry;\n  children: React.ReactNode;\n  queryClient?: QueryClient;\n  className?: string;\n};\n\nexport function LegendsPlatform(props: LegendsPlatformProps) {\n  const {\n    chatId,\n    namespace,\n    children,\n    className,\n    tools = {},\n    apiKey,\n    personaChatService,\n  } = props;\n\n  const store = useMemo(() => props.store || createStore(), [props.store]);\n\n  const queryClient = useMemo(\n    () =>\n      props.queryClient ||\n      new QueryClient({\n        defaultOptions: {\n          queries: { refetchOnMount: false, refetchOnWindowFocus: false },\n        },\n      }),\n    [props.queryClient],\n  );\n\n  const resolvedService = useMemo<IPersonaChatService | undefined>(() => {\n    if (personaChatService) {\n      return personaChatService;\n    }\n    if (apiKey) {\n      return new FetchPersonaChatService(apiKey);\n    }\n    return undefined;\n  }, [personaChatService, apiKey]);\n\n  const consumer = useMemo(\n    () => ({ chatId, namespace, tools, personaChatService: resolvedService }),\n    [chatId, namespace, tools, resolvedService],\n  );\n\n  return (\n    <SdkConsumerContext.Provider value={consumer}>\n      <QueryClientProvider client={queryClient}>\n        <Provider store={store}>\n          <BusProvider>\n            <LiveKitRoom\n              className={className}\n              serverUrl={undefined}\n              token={undefined}\n            >\n              {children}\n            </LiveKitRoom>\n          </BusProvider>\n        </Provider>\n      </QueryClientProvider>\n    </SdkConsumerContext.Provider>\n  );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_jotai","_componentsReact","_reactQuery","_reactBus","_FetchPersonaChatService","_sdkConsumer","_attempt","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","LegendsPlatform","props","_props$startupTelemet","_props$startupTelemet2","_props$startupTelemet3","chatId","namespace","children","className","tools","apiKey","personaChatService","store","useMemo","createStore","queryClient","QueryClient","defaultOptions","queries","refetchOnMount","refetchOnWindowFocus","resolvedService","FetchPersonaChatService","undefined","telemetryRef","useRef","startupTelemetry","current","telemetryEnabled","enabled","intentId","intent","id","attemptId","attempt","startupTelemetrySession","config","StartupTelemetrySession","report","event","_telemetryRef$current","consumer","createElement","SdkConsumerContext","Provider","value","__self","__source","fileName","lineNumber","columnNumber","QueryClientProvider","client","LiveKitRoom","serverUrl","token"],"sources":["../../../../src/components/LegendsPlatform/LegendsPlatform.tsx"],"sourcesContent":["import React, { useMemo, useRef } from 'react';\nimport { Provider, createStore } from 'jotai';\nimport { type Store } from 'jotai/vanilla/store';\nimport { LiveKitRoom } from '@livekit/components-react';\nimport { QueryClientProvider, QueryClient } from '@tanstack/react-query';\nimport { Provider as BusProvider } from 'react-bus';\n\nimport type { ToolsRegistry } from '../../hooks/useTools/model/types';\nimport type { IPersonaChatService } from '../../types/service';\nimport { FetchPersonaChatService } from '../../services/FetchPersonaChatService';\nimport { SdkConsumerContext } from '../../sdk-consumer';\nimport {\n  StartupTelemetrySession,\n  type StartupTelemetryOptions,\n} from '../../startup-telemetry/attempt';\n\nexport type LegendsPlatformProps = {\n  startupTelemetry?: StartupTelemetryOptions;\n  chatId: string;\n  namespace: string;\n  apiKey?: string;\n  personaChatService?: IPersonaChatService;\n  store?: Store;\n  tools?: ToolsRegistry;\n  children: React.ReactNode;\n  queryClient?: QueryClient;\n  className?: string;\n};\n\nexport function LegendsPlatform(props: LegendsPlatformProps) {\n  const {\n    chatId,\n    namespace,\n    children,\n    className,\n    tools = {},\n    apiKey,\n    personaChatService,\n  } = props;\n\n  const store = useMemo(() => props.store || createStore(), [props.store]);\n\n  const queryClient = useMemo(\n    () =>\n      props.queryClient ||\n      new QueryClient({\n        defaultOptions: {\n          queries: { refetchOnMount: false, refetchOnWindowFocus: false },\n        },\n      }),\n    [props.queryClient],\n  );\n\n  const resolvedService = useMemo<IPersonaChatService | undefined>(() => {\n    if (personaChatService) {\n      return personaChatService;\n    }\n    if (apiKey) {\n      return new FetchPersonaChatService(apiKey);\n    }\n    return undefined;\n  }, [personaChatService, apiKey]);\n\n  const telemetryRef = useRef(props.startupTelemetry);\n  telemetryRef.current = props.startupTelemetry;\n  const telemetryEnabled = props.startupTelemetry?.enabled;\n  const intentId = props.startupTelemetry?.intent?.id;\n  const attemptId = props.startupTelemetry?.attempt?.id;\n  const startupTelemetrySession = useMemo(() => {\n    const config = telemetryRef.current;\n    if (!telemetryEnabled || !config) {\n      return undefined;\n    }\n    return new StartupTelemetrySession(\n      {\n        ...config,\n        report: (event) => {\n          if (telemetryRef.current?.enabled) {\n            return telemetryRef.current.report?.(event);\n          }\n          return undefined;\n        },\n      },\n      chatId,\n    );\n    // A new intent/attempt changes ownership; report callbacks stay live via the ref.\n  }, [chatId, telemetryEnabled, intentId, attemptId]);\n\n  const consumer = useMemo(\n    () => ({\n      chatId,\n      namespace,\n      tools,\n      personaChatService: resolvedService,\n      startupTelemetrySession,\n    }),\n    [chatId, namespace, tools, resolvedService, startupTelemetrySession],\n  );\n\n  return (\n    <SdkConsumerContext.Provider value={consumer}>\n      <QueryClientProvider client={queryClient}>\n        <Provider store={store}>\n          <BusProvider>\n            <LiveKitRoom\n              className={className}\n              serverUrl={undefined}\n              token={undefined}\n            >\n              {children}\n            </LiveKitRoom>\n          </BusProvider>\n        </Provider>\n      </QueryClientProvider>\n    </SdkConsumerContext.Provider>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Video/Video.js

@@ -11,11 +11,14 @@ var _conversation = require("../../conversation");
 var _useAttachVideo = require("./useAttachVideo");
 var _useEmitConversationEvent = require("../../hooks/useConversationEvents/useEmitConversationEvent");
 var _usePictureInPicture = require("../../hooks/usePictureInPicture");
+var _useStartupAttempt = require("../../startup-telemetry/useStartupAttempt");
+var _frame = require("../../startup-telemetry/frame");
 var _jsxFileName = "/home/builduser/work/cfec65c05e11cc5b/packages/legends-platform-sdk/dist/cjs/components/Video/Video.tsx";
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const Video = exports.Video = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
   const {
     type,
+    startupRenderSurface = 'video',
     fallback: Fallback = () => null,
     fit = 'cover',
     automirror = true,
@@ -30,6 +33,7 @@ const Video = exports.Video = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =
   const [mirror, setMirror] = (0, _react.useState)(props.mirror);
   const conversation = (0, _jotai.useAtomValue)(_conversation.state.conversation);
   const emitEvent = (0, _useEmitConversationEvent.useEmitConversationEvent)();
+  const startupAttempt = (0, _useStartupAttempt.useStartupAttempt)();
   (0, _invariant.default)(conversation, 'Conversation is not initialized');
   (0, _invariant.default)(type === 'screen' ? true : conversation.type === 'video', 'Conversation type is not video');
   const {
@@ -57,6 +61,16 @@ const Video = exports.Video = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =
       });
     }
   }, [isVideoPlayable, type]);
+  (0, _react.useEffect)(() => {
+    if (!startupAttempt || type !== 'agent' || !isVideoPlayable || !videoRef.current) {
+      return;
+    }
+    startupAttempt.mark('track_subscribed');
+    if (startupRenderSurface === 'video') {
+      return (0, _frame.observeVideoFrame)(startupAttempt, videoRef.current);
+    }
+    return undefined;
+  }, [startupAttempt, type, isVideoPlayable, startupRenderSurface, videoRef]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("video", (0, _extends2.default)({
     ref: videoRef,
     muted: true,
@@ -72,7 +86,7 @@ const Video = exports.Video = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 73,
+      lineNumber: 93,
       columnNumber: 7
     }
   })), !isVideoPlayable && /*#__PURE__*/_react.default.createElement(Fallback, {
@@ -80,7 +94,7 @@ const Video = exports.Video = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 86,
+      lineNumber: 106,
       columnNumber: 28
     }
   }), showPipFallback && pipFallback);

package/dist/cjs/components/Video/Video.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_invariant","_interopRequireDefault","_jotai","_conversation","_useAttachVideo","_useEmitConversationEvent","_usePictureInPicture","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Video","exports","forwardRef","props","ref","type","fallback","Fallback","fit","automirror","pip","onPiPEnter","onPiPExit","onPiPError","pipFallback","style","videoProps","mirror","setMirror","useState","conversation","useAtomValue","state","emitEvent","useEmitConversationEvent","invariant","videoRef","isVideoPlayable","useAttachVideo","usePictureInPictureAuto","element","current","onEnter","onExit","onError","isPiPActive","pipActiveAtom","useImperativeHandle","showPipFallback","useEffect","createElement","Fragment","_extends2","muted","playsInline","autoPlay","objectFit","display","transform","__self","__source","fileName","lineNumber","columnNumber"],"sources":["../../../../src/components/Video/Video.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useState,\n} from 'react';\nimport invariant from 'invariant';\nimport { useAtomValue } from 'jotai';\nimport { state } from '../../conversation';\nimport { useAttachVideo } from './useAttachVideo';\nimport { useEmitConversationEvent } from '../../hooks/useConversationEvents/useEmitConversationEvent';\nimport {\n  usePictureInPictureAuto,\n  pipActiveAtom,\n} from '../../hooks/usePictureInPicture';\nimport { type VideoProps } from './types';\n\nexport const Video = forwardRef<HTMLVideoElement, VideoProps>((props, ref) => {\n  const {\n    type,\n    fallback: Fallback = () => null,\n    fit = 'cover',\n    automirror = true,\n    pip = false,\n    onPiPEnter,\n    onPiPExit,\n    onPiPError,\n    pipFallback,\n    style,\n    ...videoProps\n  } = props;\n\n  const [mirror, setMirror] = useState(props.mirror);\n\n  const conversation = useAtomValue(state.conversation);\n  const emitEvent = useEmitConversationEvent();\n\n  invariant(conversation, 'Conversation is not initialized');\n  invariant(\n    type === 'screen' ? true : conversation.type === 'video',\n    'Conversation type is not video',\n  );\n\n  const { videoRef, isVideoPlayable } = useAttachVideo({ type });\n\n  usePictureInPictureAuto({\n    element: pip && isVideoPlayable ? videoRef.current : null,\n    onEnter: onPiPEnter,\n    onExit: onPiPExit,\n    onError: onPiPError,\n  });\n\n  const isPiPActive = useAtomValue(pipActiveAtom);\n\n  useImperativeHandle(ref, () => videoRef.current!);\n\n  const showPipFallback = pip && isPiPActive;\n\n  useEffect(() => {\n    setMirror(props.mirror ?? (automirror && type === 'user'));\n  }, [automirror, type, props.mirror]);\n\n  useEffect(() => {\n    if (isVideoPlayable && type === 'agent') {\n      emitEvent('agentVideoLoaded', {\n        videoRef,\n      });\n    }\n  }, [isVideoPlayable, type]);\n\n  return (\n    <>\n      <video\n        ref={videoRef}\n        muted\n        playsInline\n        autoPlay\n        style={{\n          objectFit: fit,\n          display: isVideoPlayable && !showPipFallback ? 'block' : 'none',\n          transform: mirror ? 'scaleX(-1)' : 'none',\n          ...style,\n        }}\n        {...videoProps}\n      />\n      {!isVideoPlayable && <Fallback style={style} />}\n      {showPipFallback && pipFallback}\n    </>\n  );\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_invariant","_interopRequireDefault","_jotai","_conversation","_useAttachVideo","_useEmitConversationEvent","_usePictureInPicture","_useStartupAttempt","_frame","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Video","exports","forwardRef","props","ref","type","startupRenderSurface","fallback","Fallback","fit","automirror","pip","onPiPEnter","onPiPExit","onPiPError","pipFallback","style","videoProps","mirror","setMirror","useState","conversation","useAtomValue","state","emitEvent","useEmitConversationEvent","startupAttempt","useStartupAttempt","invariant","videoRef","isVideoPlayable","useAttachVideo","usePictureInPictureAuto","element","current","onEnter","onExit","onError","isPiPActive","pipActiveAtom","useImperativeHandle","showPipFallback","useEffect","mark","observeVideoFrame","undefined","createElement","Fragment","_extends2","muted","playsInline","autoPlay","objectFit","display","transform","__self","__source","fileName","lineNumber","columnNumber"],"sources":["../../../../src/components/Video/Video.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useState,\n} from 'react';\nimport invariant from 'invariant';\nimport { useAtomValue } from 'jotai';\nimport { state } from '../../conversation';\nimport { useAttachVideo } from './useAttachVideo';\nimport { useEmitConversationEvent } from '../../hooks/useConversationEvents/useEmitConversationEvent';\nimport {\n  usePictureInPictureAuto,\n  pipActiveAtom,\n} from '../../hooks/usePictureInPicture';\nimport { type VideoProps } from './types';\nimport { useStartupAttempt } from '../../startup-telemetry/useStartupAttempt';\nimport { observeVideoFrame } from '../../startup-telemetry/frame';\n\nexport const Video = forwardRef<HTMLVideoElement, VideoProps>((props, ref) => {\n  const {\n    type,\n    startupRenderSurface = 'video',\n    fallback: Fallback = () => null,\n    fit = 'cover',\n    automirror = true,\n    pip = false,\n    onPiPEnter,\n    onPiPExit,\n    onPiPError,\n    pipFallback,\n    style,\n    ...videoProps\n  } = props;\n\n  const [mirror, setMirror] = useState(props.mirror);\n\n  const conversation = useAtomValue(state.conversation);\n  const emitEvent = useEmitConversationEvent();\n  const startupAttempt = useStartupAttempt();\n\n  invariant(conversation, 'Conversation is not initialized');\n  invariant(\n    type === 'screen' ? true : conversation.type === 'video',\n    'Conversation type is not video',\n  );\n\n  const { videoRef, isVideoPlayable } = useAttachVideo({ type });\n\n  usePictureInPictureAuto({\n    element: pip && isVideoPlayable ? videoRef.current : null,\n    onEnter: onPiPEnter,\n    onExit: onPiPExit,\n    onError: onPiPError,\n  });\n\n  const isPiPActive = useAtomValue(pipActiveAtom);\n\n  useImperativeHandle(ref, () => videoRef.current!);\n\n  const showPipFallback = pip && isPiPActive;\n\n  useEffect(() => {\n    setMirror(props.mirror ?? (automirror && type === 'user'));\n  }, [automirror, type, props.mirror]);\n\n  useEffect(() => {\n    if (isVideoPlayable && type === 'agent') {\n      emitEvent('agentVideoLoaded', {\n        videoRef,\n      });\n    }\n  }, [isVideoPlayable, type]);\n\n  useEffect(() => {\n    if (\n      !startupAttempt ||\n      type !== 'agent' ||\n      !isVideoPlayable ||\n      !videoRef.current\n    ) {\n      return;\n    }\n    startupAttempt.mark('track_subscribed');\n    if (startupRenderSurface === 'video') {\n      return observeVideoFrame(startupAttempt, videoRef.current);\n    }\n    return undefined;\n  }, [startupAttempt, type, isVideoPlayable, startupRenderSurface, videoRef]);\n\n  return (\n    <>\n      <video\n        ref={videoRef}\n        muted\n        playsInline\n        autoPlay\n        style={{\n          objectFit: fit,\n          display: isVideoPlayable && !showPipFallback ? 'block' : 'none',\n          transform: mirror ? 'scaleX(-1)' : 'none',\n          ...style,\n        }}\n        {...videoProps}\n      />\n      {!isVideoPlayable && <Fallback style={style} />}\n      {showPipFallback && pipFallback}\n    </>\n  );\n});\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Video/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../../src/components/Video/types.ts"],"sourcesContent":["import React from 'react';\n\nexport type FallbackProps = {\n  style?: React.CSSProperties;\n};\n\nexport type VideoProps = {\n  mirror?: boolean;\n  automirror?: boolean;\n  type: 'user' | 'agent' | 'screen';\n  fit?: 'contain' | 'cover';\n  fallback?: React.ComponentType<FallbackProps>;\n  /** Enable Picture-in-Picture mode */\n  pip?: boolean;\n  /** Callback when entering PiP */\n  onPiPEnter?: () => void;\n  /** Callback when exiting PiP */\n  onPiPExit?: () => void;\n  /** Callback when PiP error occurs */\n  onPiPError?: (error: Error) => void;\n  /** Content to render when PiP is active */\n  pipFallback?: React.ReactNode;\n} & Omit<React.VideoHTMLAttributes<HTMLVideoElement>, 'onResize'>;\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["../../../../src/components/Video/types.ts"],"sourcesContent":["import React from 'react';\n\nexport type FallbackProps = {\n  style?: React.CSSProperties;\n};\n\nexport type VideoProps = {\n  /** Internal: canvas wrappers own the final presentation milestone. */\n  startupRenderSurface?: 'video' | 'canvas';\n  mirror?: boolean;\n  automirror?: boolean;\n  type: 'user' | 'agent' | 'screen';\n  fit?: 'contain' | 'cover';\n  fallback?: React.ComponentType<FallbackProps>;\n  /** Enable Picture-in-Picture mode */\n  pip?: boolean;\n  /** Callback when entering PiP */\n  onPiPEnter?: () => void;\n  /** Callback when exiting PiP */\n  onPiPExit?: () => void;\n  /** Callback when PiP error occurs */\n  onPiPError?: (error: Error) => void;\n  /** Content to render when PiP is active */\n  pipFallback?: React.ReactNode;\n} & Omit<React.VideoHTMLAttributes<HTMLVideoElement>, 'onResize'>;\n"],"mappings":"","ignoreList":[]}

package/dist/cjs/components/VideoPostProcessor/VideoPostProcessor.js

@@ -3,6 +3,8 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.VideoPostProcessor = VideoPostProcessor;
+var _useStartupAttempt = require("../../startup-telemetry/useStartupAttempt");
+var _frame = require("../../startup-telemetry/frame");
 var _react = _interopRequireWildcard(require("react"));
 var _effects = require("./effects");
 var _invariant = _interopRequireDefault(require("invariant"));
@@ -12,6 +14,11 @@ function VideoPostProcessor({
   effects,
   children
 }) {
+  const startupAttempt = (0, _useStartupAttempt.useStartupAttempt)();
+  const visibleAttempt = children.props.type === 'agent' ? startupAttempt : undefined;
+  const effectsKey = effects.join(',');
+  const effectsRef = (0, _react.useRef)(effects);
+  effectsRef.current = effects;
   const $video = (0, _react.useRef)(null);
   const $canvas = (0, _react.useRef)(null);
   (0, _react.useEffect)(() => {
@@ -30,16 +37,17 @@ function VideoPostProcessor({
       (0, _invariant.default)($video.current, 'Video is not initialized');
       (0, _invariant.default)($canvas.current, 'Canvas is not initialized');
       (0, _effects.render)($video.current, $canvas.current);
-      for (const effect of effects) {
+      for (const effect of effectsRef.current) {
         switch (effect) {
           case 'transparent-background':
             (0, _effects.transparentBackground)($canvas.current);
             break;
         }
       }
+      (0, _frame.recordCanvasFrame)(visibleAttempt, $canvas.current, $video.current);
       id = requestAnimationFrame(process);
     }
-  }, [effects.join(',')]);
+  }, [effectsKey, visibleAttempt]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("canvas", {
     ref: $canvas,
     style: children.props.style,
@@ -47,11 +55,12 @@ function VideoPostProcessor({
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 66,
+      lineNumber: 77,
       columnNumber: 7
     }
   }), /*#__PURE__*/_react.default.cloneElement(children, {
     ...children.props,
+    startupRenderSurface: 'canvas',
     ref: $video,
     style: {
       display: 'none'

package/dist/cjs/components/VideoPostProcessor/VideoPostProcessor.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_effects","_invariant","_interopRequireDefault","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","VideoPostProcessor","effects","children","$video","useRef","$canvas","useEffect","id","requestAnimationFrame","init","cancelAnimationFrame","current","videoWidth","videoHeight","process","invariant","render","effect","transparentBackground","join","createElement","Fragment","ref","style","props","className","__self","__source","fileName","lineNumber","columnNumber","React","cloneElement","display"],"sources":["../../../../src/components/VideoPostProcessor/VideoPostProcessor.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\n\nimport { transparentBackground, render } from './effects';\nimport invariant from 'invariant';\n\ntype VideoPostProcessorEffect = 'transparent-background';\n\ninterface VideoPostProcessorProps {\n  effects: VideoPostProcessorEffect[];\n\n  children: React.ReactElement<\n    React.VideoHTMLAttributes<HTMLVideoElement> & {\n      ref: React.RefObject<HTMLVideoElement>;\n    }\n  >;\n}\n\nexport function VideoPostProcessor({\n  effects,\n  children,\n}: VideoPostProcessorProps) {\n  const $video = useRef<HTMLVideoElement>(null);\n  const $canvas = useRef<HTMLCanvasElement>(null);\n\n  useEffect(() => {\n    let id = requestAnimationFrame(init);\n\n    return () => {\n      cancelAnimationFrame(id);\n    };\n\n    function init() {\n      if (\n        !$video.current ||\n        !$canvas.current ||\n        !$video.current.videoWidth ||\n        !$video.current.videoHeight\n      ) {\n        id = requestAnimationFrame(init);\n        return;\n      }\n\n      id = requestAnimationFrame(process);\n    }\n\n    function process() {\n      invariant($video.current, 'Video is not initialized');\n      invariant($canvas.current, 'Canvas is not initialized');\n\n      render($video.current, $canvas.current);\n\n      for (const effect of effects) {\n        switch (effect) {\n          case 'transparent-background':\n            transparentBackground($canvas.current);\n            break;\n        }\n      }\n\n      id = requestAnimationFrame(process);\n    }\n  }, [effects.join(',')]);\n\n  return (\n    <>\n      <canvas\n        ref={$canvas}\n        style={children.props.style}\n        className={children.props.className}\n      />\n\n      {React.cloneElement(children, {\n        ...children.props,\n        ref: $video,\n        style: { display: 'none' },\n      })}\n    </>\n  );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_useStartupAttempt","require","_frame","_react","_interopRequireWildcard","_effects","_invariant","_interopRequireDefault","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","VideoPostProcessor","effects","children","startupAttempt","useStartupAttempt","visibleAttempt","props","type","undefined","effectsKey","join","effectsRef","useRef","current","$video","$canvas","useEffect","id","requestAnimationFrame","init","cancelAnimationFrame","videoWidth","videoHeight","process","invariant","render","effect","transparentBackground","recordCanvasFrame","createElement","Fragment","ref","style","className","__self","__source","fileName","lineNumber","columnNumber","React","cloneElement","startupRenderSurface","display"],"sources":["../../../../src/components/VideoPostProcessor/VideoPostProcessor.tsx"],"sourcesContent":["import { useStartupAttempt } from '../../startup-telemetry/useStartupAttempt';\nimport { recordCanvasFrame } from '../../startup-telemetry/frame';\nimport React, { useEffect, useRef } from 'react';\n\nimport { transparentBackground, render } from './effects';\nimport invariant from 'invariant';\n\ntype VideoPostProcessorEffect = 'transparent-background';\n\ninterface VideoPostProcessorProps {\n  effects: VideoPostProcessorEffect[];\n\n  children: React.ReactElement<\n    React.VideoHTMLAttributes<HTMLVideoElement> & {\n      ref: React.RefObject<HTMLVideoElement>;\n      startupRenderSurface?: 'video' | 'canvas';\n      type?: 'agent' | 'user' | 'screen';\n    }\n  >;\n}\n\nexport function VideoPostProcessor({\n  effects,\n  children,\n}: VideoPostProcessorProps) {\n  const startupAttempt = useStartupAttempt();\n  const visibleAttempt =\n    children.props.type === 'agent' ? startupAttempt : undefined;\n  const effectsKey = effects.join(',');\n  const effectsRef = useRef(effects);\n  effectsRef.current = effects;\n  const $video = useRef<HTMLVideoElement>(null);\n  const $canvas = useRef<HTMLCanvasElement>(null);\n\n  useEffect(() => {\n    let id = requestAnimationFrame(init);\n\n    return () => {\n      cancelAnimationFrame(id);\n    };\n\n    function init() {\n      if (\n        !$video.current ||\n        !$canvas.current ||\n        !$video.current.videoWidth ||\n        !$video.current.videoHeight\n      ) {\n        id = requestAnimationFrame(init);\n        return;\n      }\n\n      id = requestAnimationFrame(process);\n    }\n\n    function process() {\n      invariant($video.current, 'Video is not initialized');\n      invariant($canvas.current, 'Canvas is not initialized');\n\n      render($video.current, $canvas.current);\n\n      for (const effect of effectsRef.current) {\n        switch (effect) {\n          case 'transparent-background':\n            transparentBackground($canvas.current);\n            break;\n        }\n      }\n\n      recordCanvasFrame(visibleAttempt, $canvas.current, $video.current);\n      id = requestAnimationFrame(process);\n    }\n  }, [effectsKey, visibleAttempt]);\n\n  return (\n    <>\n      <canvas\n        ref={$canvas}\n        style={children.props.style}\n        className={children.props.className}\n      />\n\n      {React.cloneElement(children, {\n        ...children.props,\n        startupRenderSurface: 'canvas',\n        ref: $video,\n        style: { display: 'none' },\n      })}\n    </>\n  );\n}\n"],"mappings":"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","ignoreList":[]}