@gamelearn/arcade-components 3.34.2 → 3.34.4

package/dist/arcade-components.js

@@ -29720,84 +29720,82 @@ function addPrimitiveAttributes(l, e, n) {
 }
 const defaultCamPos = [0, 14.63, 16], isMobile = DeviceDetection(), loader$1 = new GLTFLoader(), box = new Box3(), worldPos = new Vector3(), size = new Vector3();
 function Panel({ character: l, ttsStarted: e, active: n, visible: t = !0, onLoad: s }) {
-  var v, b, R;
-  const o = useRef(null), d = useRef(null), h = l.type === "character", [f, u] = useState(!1), [p, x] = useState(!1), T = useRef(), _ = useMemo(() => {
-    var y, w, C, D, N, P, k, F;
-    return h ? l.animationId && ((y = l.animation) != null && y.url) ? l.animation : (D = (C = (w = l == null ? void 0 : l.resource) == null ? void 0 : w.animations) == null ? void 0 : C[l.emotion]) != null && D.url ? (P = (N = l == null ? void 0 : l.resource) == null ? void 0 : N.animations) == null ? void 0 : P[l.emotion] : (F = (k = l == null ? void 0 : l.resource) == null ? void 0 : k.animations) == null ? void 0 : F.neutral : {};
-  }, [l.emotion, l == null ? void 0 : l.animationId, l == null ? void 0 : l.animation, (v = l == null ? void 0 : l.resource) == null ? void 0 : v.animations, h]), S = useCallback(() => {
-    if (T.current) {
-      const y = T.current.userData.animator;
-      y.getAction("idle") && y.mix("idle", 0.1);
+  var S, g, v;
+  const o = useRef(null), d = useRef(null), h = l.type === "character", [f, u] = useState(!1), p = useRef(), x = useMemo(() => {
+    var b, R, y, w, C, D, N, P;
+    return h ? l.animationId && ((b = l.animation) != null && b.url) ? l.animation : (w = (y = (R = l == null ? void 0 : l.resource) == null ? void 0 : R.animations) == null ? void 0 : y[l.emotion]) != null && w.url ? (D = (C = l == null ? void 0 : l.resource) == null ? void 0 : C.animations) == null ? void 0 : D[l.emotion] : (P = (N = l == null ? void 0 : l.resource) == null ? void 0 : N.animations) == null ? void 0 : P.neutral : {};
+  }, [l.emotion, l == null ? void 0 : l.animationId, l == null ? void 0 : l.animation, (S = l == null ? void 0 : l.resource) == null ? void 0 : S.animations, h]), T = useCallback(() => {
+    if (p.current) {
+      const b = p.current.userData.animator;
+      b.getAction("idle") && b.mix("idle", 0.1);
     }
   }, []);
   useEffect(() => {
-    var y, w, C, D, N, P;
-    if (n)
+    var b, R, y, w, C, D;
+    if (n && f)
       if (e) {
-        const k = (C = (w = (y = l == null ? void 0 : l.resource) == null ? void 0 : y.animations) == null ? void 0 : w.talking) == null ? void 0 : C.url, M = ((P = (N = (D = l == null ? void 0 : l.resource) == null ? void 0 : D.animations) == null ? void 0 : N["talking-short"]) == null ? void 0 : P.url) || k;
-        if (M && T.current) {
-          const j = T.current.userData.animator, B = `${M}_talking`;
-          j.getAction(B) ? (j.mix(B, 0.1), u(!0)) : loader$1.load(M, ({ animations: z }) => {
-            if (!T.current)
+        const N = (y = (R = (b = l == null ? void 0 : l.resource) == null ? void 0 : b.animations) == null ? void 0 : R.talking) == null ? void 0 : y.url, k = ((D = (C = (w = l == null ? void 0 : l.resource) == null ? void 0 : w.animations) == null ? void 0 : C["talking-short"]) == null ? void 0 : D.url) || N;
+        if (k && p.current) {
+          const F = p.current.userData.animator, M = `${k}_talking`;
+          F.getAction(M) ? F.mix(M, 0.1) : loader$1.load(k, ({ animations: j }) => {
+            if (!p.current)
               return;
-            const X = j.getAction("idle").getClip();
-            j.register(B, mixWithTalkingClip(z[0], X)), j.mix(B, 0.1), u(!0);
+            const B = F.getAction("idle").getClip();
+            F.register(M, mixWithTalkingClip(j[0], B)), F.mix(M, 0.1);
           });
         }
       } else
-        S();
-    else
-      f && S();
-  }, [e, n, S, f, (b = l == null ? void 0 : l.resource) == null ? void 0 : b.animations]);
-  const g = useCallback(
-    (y) => {
+        T();
+  }, [e, n, T, (g = l == null ? void 0 : l.resource) == null ? void 0 : g.animations, f]);
+  const _ = useCallback(
+    (b) => {
       if (l.type === "character") {
-        const w = y.getObjectByName("Head_M", !0);
-        w ? (w.updateMatrixWorld(!0), box.setFromObject(y), box.getSize(size), w.getWorldPosition(worldPos), o.current.lookAt(worldPos)) : o.current.position.setY(size.y - 1.5 * 1.3), o.current.zoom = 1.5;
-        const C = () => {
-          x(!0), s == null || s(), y.removeEventListener("update_bounds", C);
+        const R = b.getObjectByName("Head_M", !0);
+        R ? (R.updateMatrixWorld(!0), box.setFromObject(b), box.getSize(size), R.getWorldPosition(worldPos), o.current.lookAt(worldPos)) : o.current.position.setY(size.y - 1.5 * 1.3), o.current.zoom = 1.5;
+        const y = () => {
+          u(!0), s == null || s(), b.removeEventListener("update_bounds", y);
         };
-        y.addEventListener("update_bounds", C);
+        b.addEventListener("update_bounds", y);
       } else
-        cameraFitAnyObject(y, o.current), o.current.zoom = 1, x(!0);
+        cameraFitAnyObject(b, o.current), o.current.zoom = 1, u(!0);
       o.current.updateProjectionMatrix();
     },
     [l, s]
   );
-  return useFrame(({ gl: y, scene: w }) => {
+  return useFrame(({ gl: b, scene: R }) => {
     if (o.current && d.current) {
-      const C = document.querySelectorAll(".conversation--character__item")[l.slot];
-      if (C) {
-        const D = C.getBoundingClientRect(), N = C.parentNode.getBoundingClientRect(), [P, k] = [D.right - D.left, D.bottom - D.top];
-        if (o.current.aspect = P / k, o.current.updateProjectionMatrix(), h && T.current) {
-          box.setFromObject(T.current), box.getSize(size);
-          const j = T.current.getObjectByName("Head_M", !0);
-          j ? (j.getWorldPosition(worldPos), o.current.lookAt(worldPos)) : o.current.position.setY(size.y - 1.5 * 1.3), o.current.zoom = 1.5;
-        }
-        const F = {
-          top: D.top - N.top,
-          right: D.right - N.right,
-          left: D.left - N.left,
-          bottom: D.bottom - N.bottom
-        }, M = isMobile ? 24 : 40;
-        F.bottom += n ? -M : M, y.setViewport(F.left, F.bottom, P, k), y.setScissor(F.left, F.bottom, P, k), d.current.environment = w.environment, y.render(d.current, o.current);
-      }
-    }
-  }, 1), !((R = l.resource) != null && R.url) || l.type === "image" ? null : /* @__PURE__ */ jsxRuntimeExports.jsxs("scene", { ref: d, children: [
+      const y = document.querySelectorAll(".conversation--character__item")[l.slot];
+      if (y) {
+        const w = y.getBoundingClientRect(), C = y.parentNode.getBoundingClientRect(), [D, N] = [w.right - w.left, w.bottom - w.top];
+        if (o.current.aspect = D / N, o.current.updateProjectionMatrix(), h && p.current) {
+          box.setFromObject(p.current), box.getSize(size);
+          const F = p.current.getObjectByName("Head_M", !0);
+          F ? (F.getWorldPosition(worldPos), o.current.lookAt(worldPos)) : o.current.position.setY(size.y - 1.5 * 1.3), o.current.zoom = 1.5;
+        }
+        const P = {
+          top: w.top - C.top,
+          right: w.right - C.right,
+          left: w.left - C.left,
+          bottom: w.bottom - C.bottom
+        }, k = isMobile ? 24 : 40;
+        P.bottom += n ? -k : k, b.setViewport(P.left, P.bottom, D, N), b.setScissor(P.left, P.bottom, D, N), d.current.environment = R.environment, b.render(d.current, o.current);
+      }
+    }
+  }, 1), !((v = l.resource) != null && v.url) || l.type === "image" ? null : /* @__PURE__ */ jsxRuntimeExports.jsxs("scene", { ref: d, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(
       SceneResource,
       {
-        ref: T,
+        ref: p,
         name: `char_${l.uid}`,
         url: l.resource.url,
-        animationStates: { idle: _.url },
+        animationStates: { idle: x.url },
         type: l.type,
-        onRender: g,
+        onRender: _,
         texturable: !0,
         interactive: !1,
         generate: !1,
         merge: l.type !== "character",
-        visible: p && t
+        visible: f && t
       }
     ),
     /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -29807,8 +29805,8 @@ function Panel({ character: l, ttsStarted: e, active: n, visible: t = !0, onLoad
         fov: 35,
         position: defaultCamPos,
         rotation: [0, 0, 0],
-        onUpdate: (y) => {
-          y.layers.enableAll();
+        onUpdate: (b) => {
+          b.layers.enableAll();
         },
         manual: !0
       }
@@ -62212,7 +62210,7 @@ function SortPuzzleComponent({
         const Re = document.querySelector(`#${Ze.id}`), at = Re.getBoundingClientRect();
         ue.current.find((ve) => !(at.left >= ve.right || at.right <= ve.left || at.top >= ve.bottom || at.bottom <= ve.top)) && (Ge = !0, Re.classList.add("sort-draggable-item--error"), le(Ze, Re));
       }
-    }), Ge ? (M("fail"), G()) : (M("score"), W());
+    }), Ge ? (M("fail"), G()) : (M("score"), P(!0), W());
   }, Le = () => {
     f.forEach((Ge) => {
       const Ze = document.querySelector(`#${Ge.id}`);