@vincentt-xr/sdk 2.0.0-alpha.2 → 2.0.0-alpha.3

package/GROUNDING.md

@@ -249,7 +249,7 @@ import { ScreenImage, ScreenSpaceUI } from "@vincentt-xr/sdk";
 
 Props:
 
-- `source`: `{ kind: "default" }`, `{ kind: "image", src }`, or `{ kind: "texture", texture }`.
+- `source`: `{ kind: "default" }`, `{ kind: "image", src }`, `{ kind: "gif", src }`, or `{ kind: "texture", texture }`.
 - `src`: shorthand for `{ kind: "image", src }`.
 - `fit`: `"stretch" | "contain" | "cover"`; default `"contain"`.
 - `coordinateSpace`: `"normalized" | "canvas"`; default `"normalized"`.
@@ -275,9 +275,16 @@ Settings:
   position, size, rotation, pivot, render order, overlay/depth behavior, and visibility.
 - `DEFAULT_SCREEN_IMAGE_SETTINGS.image`: source kind, src, fit, opacity, color,
   flips, transparency, and alpha test.
-- The component source union is intentionally small: `default`, static `image`,
-  and an already-loaded Three `texture`. Video/GIF/sequence providers resolve
-  their media to a live `THREE.Texture` and pass it as `kind: "texture"`.
+- GIF URLs are decoded inside `ScreenImage` into a canvas texture. The decoder
+  preserves the GIF canvas size, frame delays, optimized partial-frame
+  compositing, and disposal rules before fitting the texture to the authored
+  rectangle. GIF playback streams into one working canvas buffer plus an
+  optional restore buffer; it does not retain every decoded full frame. Sources
+  over 5 MB, 1,000,000 decoded pixels, or 180 frames are rejected with a warning
+  and fall back to the default texture. Keep authored GIFs around 3-5 MB for
+  mobile AR.
+- Video and image-sequence providers resolve their media to a live
+  `THREE.Texture` and pass it as `kind: "texture"`.
 
 Use `<ScreenImage>` instead of hand-authoring `<ScreenTransform>` + `<mesh>`
 when the object is conceptually a 2D screen image. Use the lower-level mesh path
@@ -1146,7 +1153,9 @@ Supported source behavior:
 - Image: static URL texture. No playback controls.
 - Runtime texture: pass `{ kind: "texture", texture }` when supplying an existing `THREE.Texture`.
 - Video: use a managed `THREE.VideoTexture`; support play/pause, restart, frame stepping, playback rate, forward, and reverse stepping. Negative `playbackRate` is not used.
-- GIF: decode frames into a canvas texture. Preserve GIF dimensions and per-frame delays before applying ScreenImage fitting.
+- GIF: pass `{ kind: "gif", src }` to `ScreenImage`. The SDK decodes frames into
+  a canvas texture, preserves dimensions and per-frame delays, coalesces
+  optimized partial frames, and applies disposal rules before fitting.
 - Image sequence: draw loaded frames into a canvas texture using FPS and frame state.
 
 Animated sources support forward, reverse, ping-pong, random, looping, finite loop
@@ -1167,10 +1176,12 @@ Low-level texture integration imports from `@vincentt-xr/sdk/low-level`:
 import {
   BasicAnimatedTextureController,
   createTextureSourceResolver,
+  gifTextureSourceProvider,
   getPlaybackFrame,
   getSequenceFrame,
   type AnimatedTextureController,
   type AnimatedTexturePlayMode,
+  type GifTextureSource,
   type ResolvedTextureSource,
   type TextureSourceResolver,
   type TextureSourceProvider,
@@ -1183,6 +1194,17 @@ Controller lifecycle is: `play()`, `pause()`, `restart()`, optional `seek()`,
 `getSnapshot()` for state, frame/time, duration, frame count, loop, and errors;
 check `capabilities` before rendering a control.
 
+`gifTextureSourceProvider` is the built-in GIF resolver provider used by
+`ScreenImage`. It returns a `ResolvedTextureSource` with a
+`BasicAnimatedTextureController` and streams playback through a bounded canvas
+buffer instead of retaining all decoded frames. Custom resolver users can compose
+it directly when they need controller access for pause, restart, forward playback,
+loop, typed events, and ownership-safe disposal. Because GIF playback is streamed
+instead of full-frame cached, seeking and random/reverse/ping-pong playback are
+not advertised capabilities. Loop restart clears the streamed working buffer
+before frame 0 so optimized partial-frame GIFs do not carry stale pixels across
+cycles.
+
 Frame helpers are also available from the same `/low-level` door:
 `getPlaybackFrame(tick, frameCount, mode, loop, loopCount)` handles forward,
 reverse, ping-pong, random, loop, and ended math; `getSequenceFrame(elapsedSeconds,
@@ -1275,6 +1297,8 @@ renderable mesh itself. Disabled or invisible settings render nothing.
   the primitive mesh.
 - `assetNodeName?`: optional object name inside the loaded GLTF scene. When
   missing or unresolved, the whole cloned scene renders.
+- `assetAnimation?`: optional animation clip name to play. Use `"all"` to play
+  every clip; otherwise provide the exact clip name.
 - `material.type`: `"standard" | "basic"`.
 - `material.color`, `opacity`, `wireframe`, `roughness`, `metalness`: material
   overrides. Wireframe belongs to material state, not geometry state.
@@ -1294,10 +1318,11 @@ renderable mesh itself. Disabled or invisible settings render nothing.
 - `shadowMode`: `"off" | "cast" | "receive" | "castReceive"`.
 
 Current GLTF support is intentionally first-pass: the renderer clones the loaded
-scene and applies color, opacity, wireframe, render-state fields, and shadow
-flags to cloned mesh materials.
-Do not rely on it yet for advanced material graph preservation, animation,
-skinning behavior, or production asset lifecycle guarantees.
+scene, preserves authored GLB material colors, and applies opacity, wireframe,
+render-state fields, and shadow flags to cloned mesh materials. `assetAnimation`
+plays named clips or all clips while preserving playback when material settings
+change. Do not rely on it yet for advanced material graph preservation or
+production asset lifecycle guarantees.
 
 Render-state defaults preserve current behavior: depth test/write on,
 `lessEqual` depth function, color write on, back-face culling, normal blending,

package/dist/{DebuggerUI-Cq28c18s.js → DebuggerUI-xp4bg3gH.js}

@@ -1,7 +1,7 @@
 import { jsx as e, jsxs as r, Fragment as f } from "react/jsx-runtime";
 import { useState as P, useEffect as M } from "react";
 import { createPortal as F } from "react-dom";
-import { f as i } from "./internal-DuMPpcbp.js";
+import { f as i } from "./internal-D7NxAsc6.js";
 const z = {
   position: "fixed",
   top: "10px",

package/dist/{FaceMeshRenderer-6t8OsQhK.js → FaceMeshRenderer-CALA4k49.js}

@@ -4,8 +4,8 @@ import { useMemo as q, useRef as l, useState as We, useCallback as Ge, useEffect
 import * as g from "three";
 import { MathUtils as Xe, Color as Gt, Vector2 as ze } from "three";
 import { l as ne, f as zt, X as Nt } from "./index-JygePOwo.js";
-import { c as Ht, b as Bt } from "./selectors-Dw3C-gSk.js";
-import { t as Vt, p as Wt, b as Xt } from "./index-BgQAX8rs.js";
+import { c as Ht, u as Bt } from "./selectors-twqYByYZ.js";
+import { t as Vt, p as Wt, b as Xt } from "./index-YMUaJU7U.js";
 import { TransformControls as jt } from "@react-three/drei";
 const Re = 8, K = {
   type: "linear",

package/dist/{FaceMeshRenderer-lQLhYIW-.cjs → FaceMeshRenderer-D4PFqsb3.cjs}

@@ -1,4 +1,4 @@
-"use strict";const u=require("react/jsx-runtime"),ee=require("@react-three/fiber"),i=require("react"),J=require("three"),q=require("./index-D4bLzBr6.cjs"),je=require("./selectors-2QvO5RYY.cjs"),_e=require("./index-82aENaRq.cjs"),Xt=require("@react-three/drei");function Wt(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const y=Wt(J),ue=8,V={type:"linear",stops:[{offset:0,color:"#38bdf8"},{offset:1,color:"#a78bfa"}],angle:0,center:{x:.5,y:.5},radius:.5},Yt=e=>{const n=e.slice(0,ue).map(t=>({...t,offset:J.MathUtils.clamp(t.offset,0,1)})).sort((t,r)=>t.offset-r.offset);return n.length>=2?n:V.stops.map(t=>({...t}))},Be=e=>({...V,...e,center:{...V.center,...e==null?void 0:e.center},radius:Math.max(.01,(e==null?void 0:e.radius)??V.radius),stops:Yt((e==null?void 0:e.stops)??V.stops)}),Kt=`
+"use strict";const u=require("react/jsx-runtime"),ee=require("@react-three/fiber"),i=require("react"),J=require("three"),q=require("./index-D4bLzBr6.cjs"),je=require("./selectors-2QvO5RYY.cjs"),_e=require("./index-DqhqBi7O.cjs"),Xt=require("@react-three/drei");function Wt(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const y=Wt(J),ue=8,V={type:"linear",stops:[{offset:0,color:"#38bdf8"},{offset:1,color:"#a78bfa"}],angle:0,center:{x:.5,y:.5},radius:.5},Yt=e=>{const n=e.slice(0,ue).map(t=>({...t,offset:J.MathUtils.clamp(t.offset,0,1)})).sort((t,r)=>t.offset-r.offset);return n.length>=2?n:V.stops.map(t=>({...t}))},Be=e=>({...V,...e,center:{...V.center,...e==null?void 0:e.center},radius:Math.max(.01,(e==null?void 0:e.radius)??V.radius),stops:Yt((e==null?void 0:e.stops)??V.stops)}),Kt=`
   varying vec2 vPosition;
   void main() {
     vPosition = position.xy;

package/dist/{FaceRetouch-DtNl8-4e.cjs → FaceRetouch-Bq2rtPlV.cjs}

@@ -1,4 +1,4 @@
-"use strict";const o=require("./FaceMeshRenderer-lQLhYIW-.cjs"),M=require("react/jsx-runtime"),S=require("react"),D=require("./index-D4bLzBr6.cjs"),y=require("./index-82aENaRq.cjs"),T=require("@react-three/fiber"),U=require("three"),B=require("./selectors-2QvO5RYY.cjs");function N(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const p=N(U),w={enabled:!1,strength:1,faceWidth:0,faceHeight:0,faceRoundness:0,midfaceHeight:0,foreheadHeight:0,foreheadWidth:0,cheekboneWidth:0,cheekWidth:0,cheekHollowness:0,midfaceDepth:0,scalpHeight:0,headCurve:0,faceTwist:0,faceSwirl:0,browDistance:0,browHeight:0,browDepth:0,eyeSize:0,leftEyeSize:0,rightEyeSize:0,eyeDistance:0,leftEyeX:0,rightEyeX:0,leftEyeY:0,rightEyeY:0,noseSize:0,noseLength:0,mouthWidth:0,mouthHeight:0,jawWidth:0,chinHeight:0},I={...w,enabled:!0,strength:1,faceWidth:-.08,faceHeight:.04,foreheadHeight:.04,cheekWidth:-.04,eyeSize:.08,eyeDistance:.03,noseSize:-.05,noseLength:.03,mouthWidth:.06,mouthHeight:.02,jawWidth:-.05,chinHeight:.03},X=[{label:"Wireframe",value:o.FACE_MESH_MATERIAL_TYPES.wireframe},{label:"Basic",value:o.FACE_MESH_MATERIAL_TYPES.basic},{label:"Standard",value:o.FACE_MESH_MATERIAL_TYPES.standard},{label:"Physical",value:o.FACE_MESH_MATERIAL_TYPES.physical},{label:"Toon",value:o.FACE_MESH_MATERIAL_TYPES.toon},{label:"Normal",value:o.FACE_MESH_MATERIAL_TYPES.normal},{label:"Matcap",value:o.FACE_MESH_MATERIAL_TYPES.matcap},{label:"Shader",value:o.FACE_MESH_MATERIAL_TYPES.shader}],W=[{label:"Original Face",value:o.FACE_MESH_SHADER_PRESETS.originalFace},{label:"Composite",value:o.FACE_MESH_SHADER_PRESETS.composite}],Y=[{label:"Front",value:o.FACE_MESH_SIDES.front},{label:"Back",value:o.FACE_MESH_SIDES.back},{label:"Double",value:o.FACE_MESH_SIDES.double}],j=[{label:"None",value:o.FACE_MESH_TEXTURE_MAPS.none},{label:"UV Map 1",value:o.FACE_MESH_TEXTURE_MAPS.canonical},{label:"UV Map 2",value:o.FACE_MESH_TEXTURE_MAPS.style2}],q=[{label:"None",value:o.FACE_MESH_ALPHA_MAPS.none},{label:"Default Mask",value:o.FACE_MESH_ALPHA_MAPS.canonical}],G=[{label:"Solid",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.solid},{label:"Gradient",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.gradient},{label:"Image URL",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.imageUrl},{label:"Media URL",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.mediaUrl}],V=[{label:"Normal",value:o.FACE_MESH_BLEND_MODES.normal},{label:"Add",value:o.FACE_MESH_BLEND_MODES.add},{label:"Subtract",value:o.FACE_MESH_BLEND_MODES.subtract},{label:"Multiply",value:o.FACE_MESH_BLEND_MODES.multiply},{label:"Screen",value:o.FACE_MESH_BLEND_MODES.screen},{label:"Overlay",value:o.FACE_MESH_BLEND_MODES.overlay},{label:"Soft Light",value:o.FACE_MESH_BLEND_MODES.softLight},{label:"Hard Light",value:o.FACE_MESH_BLEND_MODES.hardLight},{label:"Lighten",value:o.FACE_MESH_BLEND_MODES.lighten},{label:"Darken",value:o.FACE_MESH_BLEND_MODES.darken},{label:"Difference",value:o.FACE_MESH_BLEND_MODES.difference},{label:"Exclusion",value:o.FACE_MESH_BLEND_MODES.exclusion}],K=`
+"use strict";const o=require("./FaceMeshRenderer-D4PFqsb3.cjs"),M=require("react/jsx-runtime"),S=require("react"),D=require("./index-D4bLzBr6.cjs"),y=require("./index-DqhqBi7O.cjs"),T=require("@react-three/fiber"),U=require("three"),B=require("./selectors-2QvO5RYY.cjs");function N(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const p=N(U),w={enabled:!1,strength:1,faceWidth:0,faceHeight:0,faceRoundness:0,midfaceHeight:0,foreheadHeight:0,foreheadWidth:0,cheekboneWidth:0,cheekWidth:0,cheekHollowness:0,midfaceDepth:0,scalpHeight:0,headCurve:0,faceTwist:0,faceSwirl:0,browDistance:0,browHeight:0,browDepth:0,eyeSize:0,leftEyeSize:0,rightEyeSize:0,eyeDistance:0,leftEyeX:0,rightEyeX:0,leftEyeY:0,rightEyeY:0,noseSize:0,noseLength:0,mouthWidth:0,mouthHeight:0,jawWidth:0,chinHeight:0},I={...w,enabled:!0,strength:1,faceWidth:-.08,faceHeight:.04,foreheadHeight:.04,cheekWidth:-.04,eyeSize:.08,eyeDistance:.03,noseSize:-.05,noseLength:.03,mouthWidth:.06,mouthHeight:.02,jawWidth:-.05,chinHeight:.03},X=[{label:"Wireframe",value:o.FACE_MESH_MATERIAL_TYPES.wireframe},{label:"Basic",value:o.FACE_MESH_MATERIAL_TYPES.basic},{label:"Standard",value:o.FACE_MESH_MATERIAL_TYPES.standard},{label:"Physical",value:o.FACE_MESH_MATERIAL_TYPES.physical},{label:"Toon",value:o.FACE_MESH_MATERIAL_TYPES.toon},{label:"Normal",value:o.FACE_MESH_MATERIAL_TYPES.normal},{label:"Matcap",value:o.FACE_MESH_MATERIAL_TYPES.matcap},{label:"Shader",value:o.FACE_MESH_MATERIAL_TYPES.shader}],W=[{label:"Original Face",value:o.FACE_MESH_SHADER_PRESETS.originalFace},{label:"Composite",value:o.FACE_MESH_SHADER_PRESETS.composite}],Y=[{label:"Front",value:o.FACE_MESH_SIDES.front},{label:"Back",value:o.FACE_MESH_SIDES.back},{label:"Double",value:o.FACE_MESH_SIDES.double}],j=[{label:"None",value:o.FACE_MESH_TEXTURE_MAPS.none},{label:"UV Map 1",value:o.FACE_MESH_TEXTURE_MAPS.canonical},{label:"UV Map 2",value:o.FACE_MESH_TEXTURE_MAPS.style2}],q=[{label:"None",value:o.FACE_MESH_ALPHA_MAPS.none},{label:"Default Mask",value:o.FACE_MESH_ALPHA_MAPS.canonical}],G=[{label:"Solid",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.solid},{label:"Gradient",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.gradient},{label:"Image URL",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.imageUrl},{label:"Media URL",value:o.FACE_MESH_MASK_TEXTURE_SOURCES.mediaUrl}],V=[{label:"Normal",value:o.FACE_MESH_BLEND_MODES.normal},{label:"Add",value:o.FACE_MESH_BLEND_MODES.add},{label:"Subtract",value:o.FACE_MESH_BLEND_MODES.subtract},{label:"Multiply",value:o.FACE_MESH_BLEND_MODES.multiply},{label:"Screen",value:o.FACE_MESH_BLEND_MODES.screen},{label:"Overlay",value:o.FACE_MESH_BLEND_MODES.overlay},{label:"Soft Light",value:o.FACE_MESH_BLEND_MODES.softLight},{label:"Hard Light",value:o.FACE_MESH_BLEND_MODES.hardLight},{label:"Lighten",value:o.FACE_MESH_BLEND_MODES.lighten},{label:"Darken",value:o.FACE_MESH_BLEND_MODES.darken},{label:"Difference",value:o.FACE_MESH_BLEND_MODES.difference},{label:"Exclusion",value:o.FACE_MESH_BLEND_MODES.exclusion}],K=`
   varying vec2 vUv;
 
   void main() {

package/dist/{FaceRetouch-CDrL0pXg.js → FaceRetouch-DF5UsOsZ.js}

@@ -1,11 +1,11 @@
-import { g as p, h as _, i as w, j as A, F as y, e as u, f as k } from "./FaceMeshRenderer-6t8OsQhK.js";
+import { g as p, h as _, i as w, j as A, F as y, e as c, f as k } from "./FaceMeshRenderer-CALA4k49.js";
 import { jsx as x, jsxs as W } from "react/jsx-runtime";
 import { useMemo as b, useEffect as P } from "react";
 import { X } from "./index-JygePOwo.js";
-import { u as I } from "./index-BgQAX8rs.js";
+import { u as I } from "./index-YMUaJU7U.js";
 import { useThree as Y, useFrame as V } from "@react-three/fiber";
 import * as g from "three";
-import { b as G } from "./selectors-Dw3C-gSk.js";
+import { u as G } from "./selectors-twqYByYZ.js";
 const j = {
   enabled: !1,
   strength: 1,
@@ -85,18 +85,18 @@ const j = {
   { label: "Image URL", value: k.imageUrl },
   { label: "Media URL", value: k.mediaUrl }
 ], Ce = [
-  { label: "Normal", value: u.normal },
-  { label: "Add", value: u.add },
-  { label: "Subtract", value: u.subtract },
-  { label: "Multiply", value: u.multiply },
-  { label: "Screen", value: u.screen },
-  { label: "Overlay", value: u.overlay },
-  { label: "Soft Light", value: u.softLight },
-  { label: "Hard Light", value: u.hardLight },
-  { label: "Lighten", value: u.lighten },
-  { label: "Darken", value: u.darken },
-  { label: "Difference", value: u.difference },
-  { label: "Exclusion", value: u.exclusion }
+  { label: "Normal", value: c.normal },
+  { label: "Add", value: c.add },
+  { label: "Subtract", value: c.subtract },
+  { label: "Multiply", value: c.multiply },
+  { label: "Screen", value: c.screen },
+  { label: "Overlay", value: c.overlay },
+  { label: "Soft Light", value: c.softLight },
+  { label: "Hard Light", value: c.hardLight },
+  { label: "Lighten", value: c.lighten },
+  { label: "Darken", value: c.darken },
+  { label: "Difference", value: c.difference },
+  { label: "Exclusion", value: c.exclusion }
 ], q = `
   varying vec2 vUv;
 
@@ -243,7 +243,7 @@ const j = {
   clipMaxX: d = 1,
   renderOrder: h = -1e3
 }) => {
-  const { camera: c, size: m } = Y(), R = G(), s = b(
+  const { camera: u, size: m } = Y(), R = G(), s = b(
     () => ({
       cameraTexture: { value: null },
       retouchMaskTexture: { value: null },
@@ -260,11 +260,11 @@ const j = {
     }),
     []
   ), E = b(() => {
-    if (!c.isPerspectiveCamera)
+    if (!u.isPerspectiveCamera)
       return [10, 10];
-    const T = c, D = (T.position.z || 5) - -1, N = g.MathUtils.degToRad(T.fov), F = 2 * Math.tan(N / 2) * D;
+    const T = u, D = (T.position.z || 5) - -1, N = g.MathUtils.degToRad(T.fov), F = 2 * Math.tan(N / 2) * D;
     return [F * (m.width / m.height), F];
-  }, [c, m]);
+  }, [u, m]);
   return V(() => {
     s.cameraTexture.value = R ?? null, s.retouchMaskTexture.value = e, s.texelSize.value.set(1 / Math.max(m.width, 1), 1 / Math.max(m.height, 1)), s.retouchAmount.value = a, s.blurRadius.value = r, s.detailPreservation.value = t, s.blemishReduction.value = o, s.blemishRadius.value = l, s.previewMask.value = i ? 1 : 0, s.protectLandmarks.value = v ? 1 : 0, s.clipMinX.value = n, s.clipMaxX.value = d;
   }), R ? /* @__PURE__ */ x("group", { position: [0, 0, -1], children: /* @__PURE__ */ W("mesh", { renderOrder: h, children: [
@@ -407,10 +407,10 @@ const j = {
 }, U = (e, a, r) => {
   const t = f(a, 10, r), o = f(a, 103, r), l = f(a, 332, r), i = f(a, 105, r), v = f(a, 334, r);
   if (!t || !o || !l || !i || !v) return;
-  const n = (i.y + v.y) * 0.5, d = Math.abs(l.x - o.x), h = Math.max(Math.abs(n - t.y) * 0.72, d * 0.08), c = Math.max(0, t.y - h), m = h * 0.34;
-  e.beginPath(), e.moveTo(o.x, o.y - m), e.quadraticCurveTo((o.x + t.x) * 0.5, c, t.x, c), e.quadraticCurveTo(
+  const n = (i.y + v.y) * 0.5, d = Math.abs(l.x - o.x), h = Math.max(Math.abs(n - t.y) * 0.72, d * 0.08), u = Math.max(0, t.y - h), m = h * 0.34;
+  e.beginPath(), e.moveTo(o.x, o.y - m), e.quadraticCurveTo((o.x + t.x) * 0.5, u, t.x, u), e.quadraticCurveTo(
     (l.x + t.x) * 0.5,
-    c,
+    u,
     l.x,
     l.y - m
   ), e.lineTo(v.x, n), e.quadraticCurveTo(t.x, n + h * 0.16, i.x, n), e.closePath(), e.fill();
@@ -469,10 +469,10 @@ const j = {
     step: 0.01
   },
   { key: "previewMask", label: "Preview mask", type: "boolean" }
-], ce = (e) => {
+], ue = (e) => {
   const a = Number(e);
   return Number.isFinite(a) ? Math.max(0, Math.round(a)) : 0;
-}, ue = (e, a) => {
+}, ce = (e, a) => {
   const r = Number(a);
   return Number.isFinite(r) ? Math.max(e + 1, Math.round(r)) : e + 1;
 }, M = {
@@ -504,7 +504,7 @@ const j = {
   clipMaxX: v = 1,
   renderOrder: n
 }) => {
-  const d = ce(e), h = ue(d, a), c = O({
+  const d = ue(e), h = ce(d, a), u = O({
     skinSmoothing: r,
     skinRealism: t,
     blemishReduction: o,
@@ -520,12 +520,12 @@ const j = {
     K,
     {
       retouchMask: E.texture,
-      retouchAmount: c.skinSmoothing,
+      retouchAmount: u.skinSmoothing,
       blurRadius: S.blurRadius,
-      detailPreservation: c.skinRealism,
-      blemishReduction: c.blemishReduction,
+      detailPreservation: u.skinRealism,
+      blemishReduction: u.blemishReduction,
       blemishRadius: S.blemishRadius,
-      previewMask: c.previewMask,
+      previewMask: u.previewMask,
       protectLandmarks: S.protectLandmarks,
       clipMinX: i,
       clipMaxX: v,

package/dist/components/MeshRenderer/index.d.ts

@@ -30,6 +30,7 @@ export type MeshRendererSettings = {
     /** Optional GLTF/GLB asset URL. When set, renders the imported asset instead of a primitive. */
     assetUrl?: string;
     assetNodeName?: string;
+    assetAnimation?: ("all" & {}) | (string & {});
     material: {
         type: MeshRendererMaterialType;
         color: string;

package/dist/components/ScreenImage/source.d.ts

@@ -4,6 +4,9 @@ export type ScreenImageSource = {
 } | {
     kind: "image";
     src: string;
+} | {
+    kind: "gif";
+    src: string;
 } | {
     kind: "texture";
     texture: THREE.Texture;