speakid-build-a-sentence 1.0.11 → 1.0.13

package/dist/speakid-build-a-sentence.es.js

@@ -1,4 +1,4 @@
-import rn, { useState as g, useCallback as Ee, useRef as Ie, useEffect as ue, useMemo as on, Component as sn } from "react";
+import on, { useState as g, useCallback as Ee, useRef as je, useEffect as ue, Component as sn } from "react";
 var ve = { exports: {} }, pe = {};
 /**
  * @license React
@@ -9,12 +9,12 @@ var ve = { exports: {} }, pe = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var je;
+var Pe;
 function an() {
-  if (je) return pe;
-  je = 1;
-  var p = Symbol.for("react.transitional.element"), l = Symbol.for("react.fragment");
-  function S(T, W, w) {
+  if (Pe) return pe;
+  Pe = 1;
+  var p = Symbol.for("react.transitional.element"), d = Symbol.for("react.fragment");
+  function S(j, W, w) {
     var P = null;
     if (w !== void 0 && (P = "" + w), W.key !== void 0 && (P = "" + W.key), "key" in W) {
       w = {};
@@ -23,13 +23,13 @@ function an() {
     } else w = W;
     return W = w.ref, {
       $$typeof: p,
-      type: T,
+      type: j,
       key: P,
       ref: W !== void 0 ? W : null,
       props: w
     };
   }
-  return pe.Fragment = l, pe.jsx = S, pe.jsxs = S, pe;
+  return pe.Fragment = d, pe.jsx = S, pe.jsxs = S, pe;
 }
 var fe = {};
 /**
@@ -41,9 +41,9 @@ var fe = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Pe;
-function dn() {
-  return Pe || (Pe = 1, process.env.NODE_ENV !== "production" && (function() {
+var He;
+function ln() {
+  return He || (He = 1, process.env.NODE_ENV !== "production" && (function() {
     function p(e) {
       if (e == null) return null;
       if (typeof e == "function")
@@ -56,7 +56,7 @@ function dn() {
           return "Profiler";
         case U:
           return "StrictMode";
-        case j:
+        case I:
           return "Suspense";
         case ae:
           return "SuspenseList";
@@ -87,12 +87,12 @@ function dn() {
         }
       return null;
     }
-    function l(e) {
+    function d(e) {
       return "" + e;
     }
     function S(e) {
       try {
-        l(e);
+        d(e);
         var a = !1;
       } catch {
         a = !0;
@@ -104,10 +104,10 @@ function dn() {
           a,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
           b
-        ), l(e);
+        ), d(e);
       }
     }
-    function T(e) {
+    function j(e) {
       if (e === E) return "<>";
       if (typeof e == "object" && e !== null && e.$$typeof === J)
         return "<...>";
@@ -126,7 +126,7 @@ function dn() {
       return Error("react-stack-top-frame");
     }
     function P(e) {
-      if (de.call(e, "key")) {
+      if (le.call(e, "key")) {
         var a = Object.getOwnPropertyDescriptor(e, "key").get;
         if (a && a.isReactWarning) return !1;
       }
@@ -150,7 +150,7 @@ function dn() {
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), e = this.props.ref, e !== void 0 ? e : null;
     }
-    function D(e, a, r, b, le, G) {
+    function D(e, a, r, b, de, G) {
       var x = r.ref;
       return e = {
         $$typeof: oe,
@@ -175,7 +175,7 @@ function dn() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: le
+        value: de
       }), Object.defineProperty(e, "_debugTask", {
         configurable: !1,
         enumerable: !1,
@@ -183,20 +183,20 @@ function dn() {
         value: G
       }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
     }
-    function y(e, a, r, b, le, G) {
+    function y(e, a, r, b, de, G) {
       var x = a.children;
       if (x !== void 0)
         if (b)
           if (M(x)) {
             for (b = 0; b < x.length; b++)
-              I(x[b]);
+              T(x[b]);
             Object.freeze && Object.freeze(x);
           } else
             console.error(
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
-        else I(x);
-      if (de.call(a, "key")) {
+        else T(x);
+      if (le.call(a, "key")) {
         x = p(e);
         var O = Object.keys(a).filter(function(Se) {
           return Se !== "key";
@@ -227,17 +227,17 @@ React keys must be passed directly to JSX without using spread:
         x,
         r,
         W(),
-        le,
+        de,
         G
       );
     }
-    function I(e) {
+    function T(e) {
       H(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === J && (e._payload.status === "fulfilled" ? H(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
     }
     function H(e) {
       return typeof e == "object" && e !== null && e.$$typeof === oe;
     }
-    var B = rn, oe = Symbol.for("react.transitional.element"), ge = Symbol.for("react.portal"), E = Symbol.for("react.fragment"), U = Symbol.for("react.strict_mode"), _ = Symbol.for("react.profiler"), he = Symbol.for("react.consumer"), se = Symbol.for("react.context"), me = Symbol.for("react.forward_ref"), j = Symbol.for("react.suspense"), ae = Symbol.for("react.suspense_list"), z = Symbol.for("react.memo"), J = Symbol.for("react.lazy"), $ = Symbol.for("react.activity"), V = Symbol.for("react.client.reference"), we = B.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, de = Object.prototype.hasOwnProperty, M = Array.isArray, A = console.createTask ? console.createTask : function() {
+    var B = on, oe = Symbol.for("react.transitional.element"), ge = Symbol.for("react.portal"), E = Symbol.for("react.fragment"), U = Symbol.for("react.strict_mode"), _ = Symbol.for("react.profiler"), he = Symbol.for("react.consumer"), se = Symbol.for("react.context"), me = Symbol.for("react.forward_ref"), I = Symbol.for("react.suspense"), ae = Symbol.for("react.suspense_list"), z = Symbol.for("react.memo"), J = Symbol.for("react.lazy"), $ = Symbol.for("react.activity"), V = Symbol.for("react.client.reference"), we = B.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, le = Object.prototype.hasOwnProperty, M = Array.isArray, A = console.createTask ? console.createTask : function() {
       return null;
     };
     B = {
@@ -248,7 +248,7 @@ React keys must be passed directly to JSX without using spread:
     var c, F = {}, X = B.react_stack_bottom_frame.bind(
       B,
       w
-    )(), xe = A(T(w)), L = {};
+    )(), xe = A(j(w)), L = {};
     fe.Fragment = E, fe.jsx = function(e, a, r) {
       var b = 1e4 > we.recentlyCreatedOwnerStacks++;
       return y(
@@ -257,7 +257,7 @@ React keys must be passed directly to JSX without using spread:
         r,
         !1,
         b ? Error("react-stack-top-frame") : X,
-        b ? A(T(e)) : xe
+        b ? A(j(e)) : xe
       );
     }, fe.jsxs = function(e, a, r) {
       var b = 1e4 > we.recentlyCreatedOwnerStacks++;
@@ -267,16 +267,16 @@ React keys must be passed directly to JSX without using spread:
         r,
         !0,
         b ? Error("react-stack-top-frame") : X,
-        b ? A(T(e)) : xe
+        b ? A(j(e)) : xe
       );
     };
   })()), fe;
 }
-var He;
-function ln() {
-  return He || (He = 1, process.env.NODE_ENV === "production" ? ve.exports = an() : ve.exports = dn()), ve.exports;
+var Ce;
+function dn() {
+  return Ce || (Ce = 1, process.env.NODE_ENV === "production" ? ve.exports = an() : ve.exports = ln()), ve.exports;
 }
-var s = ln();
+var s = dn();
 const cn = `
   @keyframes magic-sentence-spin {
     from { transform: rotate(0deg); }
@@ -315,7 +315,7 @@ if (typeof document < "u" && !document.getElementById("magic-sentence-keyframes"
   const p = document.createElement("style");
   p.id = "magic-sentence-keyframes", p.innerHTML = cn, document.head.appendChild(p);
 }
-const Ce = {
+const Ae = {
   spin: {
     animation: "magic-sentence-spin 1.4s linear infinite"
   },
@@ -448,12 +448,12 @@ const Ce = {
   },
   gmHourglass: {
     fontSize: "42px",
-    ...Ce.spin
+    ...Ae.spin
   },
   // ===== Анимационные стили =====
-  ...Ce
+  ...Ae
 }, un = () => {
-  const [p, l] = g([]), S = Ee((w, P, R) => {
+  const [p, d] = g([]), S = Ee((w, P, R) => {
     const f = [];
     w.trim() || f.push({
       type: "empty",
@@ -465,15 +465,15 @@ const Ce = {
       type: "characters",
       message: "Only Latin characters, numbers, spaces and punctuation are allowed"
     });
-    const y = R.findIndex((I, H) => H !== P && I.toLowerCase().trim() === w.toLowerCase().trim());
+    const y = R.findIndex((T, H) => H !== P && T.toLowerCase().trim() === w.toLowerCase().trim());
     return y !== -1 && f.push({
       type: "duplicate",
       message: `Duplicate sentence (same as sentence ${y + 1})`
-    }), l(f), {
+    }), d(f), {
       isValid: f.length === 0,
       errors: f
     };
-  }, []), T = Ee((w) => {
+  }, []), j = Ee((w) => {
     const P = [];
     return w.forEach((R, f) => {
       const D = S(R, f, w);
@@ -486,20 +486,20 @@ const Ce = {
       errors: P
     };
   }, [S]), W = Ee(() => {
-    l([]);
+    d([]);
   }, []);
   return {
     errors: p,
     validateSentence: S,
-    validateAllSentences: T,
+    validateAllSentences: j,
     clearErrors: W
   };
-}, pn = (p, l, S) => l && S ? `${p} word "${l}" ${S}` : l ? `${p} word "${l}"` : p, fn = (p, l, S = ["Enter", " "]) => {
-  S.includes(p.key) && (p.preventDefault(), l());
+}, pn = (p, d, S) => d && S ? `${p} word "${d}" ${S}` : d ? `${p} word "${d}"` : p, fn = (p, d, S = ["Enter", " "]) => {
+  S.includes(p.key) && (p.preventDefault(), d());
 }, Y = (p) => {
-  const l = document.createElement("div");
-  l.setAttribute("aria-live", "polite"), l.setAttribute("aria-atomic", "true"), l.style.position = "absolute", l.style.left = "-10000px", l.style.width = "1px", l.style.height = "1px", l.style.overflow = "hidden", document.body.appendChild(l), l.textContent = p, setTimeout(() => {
-    document.body.removeChild(l);
+  const d = document.createElement("div");
+  d.setAttribute("aria-live", "polite"), d.setAttribute("aria-atomic", "true"), d.style.position = "absolute", d.style.left = "-10000px", d.style.width = "1px", d.style.height = "1px", d.style.overflow = "hidden", document.body.appendChild(d), d.textContent = p, setTimeout(() => {
+    document.body.removeChild(d);
   }, 1e3);
 }, gn = () => {
   const p = document.createElement("style");
@@ -532,7 +532,7 @@ const Ce = {
   `, document.head.appendChild(p);
 }, hn = (p) => [...p].sort(() => Math.random() - 0.5);
 function wn(p = {}) {
-  const { logoUrl: l, showLogo: S = !0, baseURL: T } = p, W = Ie(null), { validateAllSentences: w, errors: P } = un(), R = () => r || window.innerWidth < 768, f = () => r || window.innerWidth < 768 || window.innerWidth >= 320 && window.innerWidth <= 932 && window.innerHeight >= 390 && window.innerHeight <= 932, D = (n = "medium") => {
+  const { logoUrl: d, showLogo: S = !0, baseURL: j } = p, W = je(null), { validateAllSentences: w, errors: P } = un(), R = () => r || window.innerWidth < 768, f = () => r || window.innerWidth < 768 || window.innerWidth >= 320 && window.innerWidth <= 932 && window.innerHeight >= 390 && window.innerHeight <= 932, D = (n = "medium") => {
     if (!f())
       return {
         padding: "12px 24px",
@@ -563,64 +563,64 @@ function wn(p = {}) {
   ue(() => (gn(), () => {
     document.body.style.overflow = "";
   }), []);
-  const [y, I] = g("select"), [H, B] = g(null), [oe, ge] = g(null), [E, U] = g([]), [_, he] = g(0), [se, me] = g([]), [j, ae] = g([]), [z, J] = g(20), [$, V] = g(0), [we, de] = g(null), [M, A] = g(null), [c, F] = g(!1), [X, xe] = g(
+  const [y, T] = g("select"), [H, B] = g(null), [oe, ge] = g(null), [E, U] = g([]), [_, he] = g(0), [se, me] = g([]), [I, ae] = g([]), [z, J] = g(20), [$, V] = g(0), [we, le] = g(null), [M, A] = g(null), [c, F] = g(!1), [X, xe] = g(
     Number(localStorage.getItem("magicSentenceBest")) || 0
-  ), L = Ie(null), [e, a] = g({ list: null, index: null, side: null }), [r, b] = g(!1), [le, G] = g(1), [x, O] = g(null), [ce, Se] = g(!1), [q, Ae] = g(!1), [Z, De] = g(!1), [Q, _e] = g(!1), [K, Oe] = g(!1), [ee, ze] = g(!1), [ne, Me] = g(!1), [te, Le] = g(!1), [ie, Ne] = g(!1);
+  ), L = je(null), [e, a] = g({ list: null, index: null, side: null }), [r, b] = g(!1), [de, G] = g(1), [x, O] = g(null), [ce, Se] = g(!1), [q, De] = g(!1), [Z, _e] = g(!1), [Q, Oe] = g(!1), [K, ze] = g(!1), [ee, Me] = g(!1), [ne, Le] = g(!1), [te, Ne] = g(!1), [ie, Be] = g(!1);
   ue(() => {
     const n = () => {
-      const i = window.innerWidth, t = window.innerHeight, o = i < 768 || i === 926 && t === 428 || i === 932 && t === 430, d = t < 700, v = i === 768 && t === 1024, k = i === 1024 && t === 768, u = i === 820 && t === 1180, m = i === 1180 && t === 820, re = i === 540 && t === 720, C = i === 720 && t === 540, Re = i === 1024 && t === 1366, en = i === 1366 && t === 1024, nn = i >= 1200 && t >= 600 && !o;
-      if (Se(nn), Ae(v), De(k), _e(u), Oe(m), ze(re), Me(C), Le(Re), Ne(en), b(o), o)
+      const i = window.innerWidth, t = window.innerHeight, o = i < 768 || i === 926 && t === 428 || i === 932 && t === 430, l = t < 700, v = i === 768 && t === 1024, k = i === 1024 && t === 768, u = i === 820 && t === 1180, m = i === 1180 && t === 820, re = i === 540 && t === 720, C = i === 720 && t === 540, Re = i === 1024 && t === 1366, nn = i === 1366 && t === 1024, tn = i >= 1200 && t >= 600 && !o;
+      if (Se(tn), De(v), _e(k), Oe(u), ze(m), Me(re), Le(C), Ne(Re), Be(nn), b(o), o)
         O(null), G(1);
-      else if (d)
+      else if (l)
         O(null), G(1);
       else {
-        const tn = Math.min(1e3, Math.min(i, t) * 0.9);
-        O(tn), G(1);
+        const rn = Math.min(1e3, Math.min(i, t) * 0.9);
+        O(rn), G(1);
       }
     };
     return n(), window.addEventListener("resize", n), () => window.removeEventListener("resize", n);
   }, []);
   const ye = (n, i, t, o) => {
     if (c) return;
-    let d = [...se], v = [...j];
-    const k = n === "bank" ? d : v, u = i === "bank" ? d : v, m = k.findIndex((Re) => Re.id === t);
+    let l = [...se], v = [...I];
+    const k = n === "bank" ? l : v, u = i === "bank" ? l : v, m = k.findIndex((Re) => Re.id === t);
     if (m === -1) return;
     const [re] = k.splice(m, 1);
     let C = o;
-    n === i && C !== null && C !== void 0 && C > m && (C = C - 1), C == null || C < 0 || C > u.length ? u.push(re) : u.splice(C, 0, re), n === "bank" ? d = k : v = k, i === "bank" ? d = u : v = u, me(d), ae(v);
+    n === i && C !== null && C !== void 0 && C > m && (C = C - 1), C == null || C < 0 || C > u.length ? u.push(re) : u.splice(C, 0, re), n === "bank" ? l = k : v = k, i === "bank" ? l = u : v = u, me(l), ae(v);
   }, be = (n, i, t) => {
     if (n.preventDefault(), c) {
       a({ list: null, index: null, side: null });
       return;
     }
     const o = n.dataTransfer.getData("application/x-token") || (() => {
-      const d = n.dataTransfer.getData("text/plain");
-      if (!d) return "";
-      const v = se.some((m) => m.id === d), k = j.some((m) => m.id === d), u = v ? "bank" : k ? "selected" : null;
-      return u ? JSON.stringify({ from: u, id: d }) : "";
+      const l = n.dataTransfer.getData("text/plain");
+      if (!l) return "";
+      const v = se.some((m) => m.id === l), k = I.some((m) => m.id === l), u = v ? "bank" : k ? "selected" : null;
+      return u ? JSON.stringify({ from: u, id: l }) : "";
     })();
     if (o) {
       try {
-        const d = JSON.parse(o);
-        if (!d || !d.id || !d.from) return;
-        ye(d.from, i, d.id, t);
+        const l = JSON.parse(o);
+        if (!l || !l.id || !l.from) return;
+        ye(l.from, i, l.id, t);
       } catch {
       }
       a({ list: null, index: null, side: null });
     }
-  }, Be = (n) => {
-    B(n), U(Array(n).fill("")), I("time");
   }, $e = (n) => {
-    ge(n), I("type");
-  }, Fe = (n, i) => {
+    B(n), U(Array(n).fill("")), T("time");
+  }, Fe = (n) => {
+    ge(n), T("type");
+  }, Ge = (n, i) => {
     if (i.length > 41 || i && !/^[a-zA-Z0-9\s.,!?;:'"-]*$/.test(i))
       return;
     const o = [...E];
     o[n] = i, U(o);
-    const d = w(o);
-    d.isValid || console.warn("Validation errors:", d.errors);
-  }, Ge = (n) => n.trim().replace(/\s+/g, " "), Te = (n) => n <= 3 ? 20 : n <= 5 ? 18 : n <= 7 ? 16 : n <= 9 ? 14 : 12, Ye = () => {
-    E.some((i) => i.trim().length === 0) || (U((i) => i.map((t) => Ge(t))), V(0), he(0), de(null), I("getready"));
+    const l = w(o);
+    l.isValid || console.warn("Validation errors:", l.errors);
+  }, Ye = (n) => n.trim().replace(/\s+/g, " "), Te = (n) => n <= 3 ? 20 : n <= 5 ? 18 : n <= 7 ? 16 : n <= 9 ? 14 : 12, Ue = () => {
+    E.some((i) => i.trim().length === 0) || (U((i) => i.map((t) => Ye(t))), V(0), he(0), le(null), T("getready"));
   };
   ue(() => {
     if (y === "getready") {
@@ -633,11 +633,11 @@ function wn(p = {}) {
     if (!i) return;
     const o = hn(
       i.trim().split(/\s+/).filter(Boolean)
-    ).map((d, v) => ({
+    ).map((l, v) => ({
       id: `${Date.now()}-${n}-${v}-${Math.random().toString(36).slice(2)}`,
-      text: d
+      text: l
     }));
-    me(o), ae([]), he(n), J(oe || 20), A(null), F(!1), I("play");
+    me(o), ae([]), he(n), J(oe || 20), A(null), F(!1), T("play");
   };
   ue(() => {
     if (y === "play" && !c)
@@ -645,21 +645,21 @@ function wn(p = {}) {
         L.current = window.setTimeout(() => J((n) => n - 1), 1e3);
       else {
         F(!0);
-        const i = E[_].trim().split(/\s+/), t = j.map((u) => u.text), o = i.filter((u) => !t.includes(u)).length, d = t.filter((u) => !i.includes(u)).length, v = i.filter((u, m) => u !== t[m]).length, k = o + d + v;
+        const i = E[_].trim().split(/\s+/), t = I.map((u) => u.text), o = i.filter((u) => !t.includes(u)).length, l = t.filter((u) => !i.includes(u)).length, v = i.filter((u, m) => u !== t[m]).length, k = o + l + v;
         k === 0 ? (A("correct"), N("correct"), Y("Correct! Well done!")) : k === 1 ? (A("almost"), N("half"), Y("Almost correct! Just one mistake.")) : (A("wrong"), N("wrong"), Y("Not quite right. Keep trying!"));
       }
     return () => {
       L.current !== null && window.clearTimeout(L.current);
     };
-  }, [y, z, c, E, _, j]);
-  const Ue = (n = !0) => {
+  }, [y, z, c, E, _, I]);
+  const Je = (n = !0) => {
     if (c && n) {
-      _ + 1 < (H || 0) ? ke(_ + 1) : (I("results"), setTimeout(() => We(), 600));
+      _ + 1 < (H || 0) ? ke(_ + 1) : (T("results"), setTimeout(() => We(), 600));
       return;
     }
     if (n && !c) {
-      const t = E[_].trim().split(/\s+/), o = j.map((m) => m.text), d = t.filter((m) => !o.includes(m)).length, v = o.filter((m) => !t.includes(m)).length, k = t.filter((m, re) => m !== o[re]).length, u = d + v + k;
-      u === 0 && z > 0 ? (V((m) => m + 1), A("correct"), N("correct"), Y("Correct! Well done!")) : u === 1 ? (V((m) => m + 0.5), A("almost"), N("half"), Y("Almost correct! Just one mistake.")) : (A("wrong"), N("wrong"), Y("Not quite right. Keep trying!")), _ + 1 < (H || 0) ? setTimeout(() => ke(_ + 1), 800) : (I("results"), setTimeout(() => We(), 600));
+      const t = E[_].trim().split(/\s+/), o = I.map((m) => m.text), l = t.filter((m) => !o.includes(m)).length, v = o.filter((m) => !t.includes(m)).length, k = t.filter((m, re) => m !== o[re]).length, u = l + v + k;
+      u === 0 && z > 0 ? (V((m) => m + 1), A("correct"), N("correct"), Y("Correct! Well done!")) : u === 1 ? (V((m) => m + 0.5), A("almost"), N("half"), Y("Almost correct! Just one mistake.")) : (A("wrong"), N("wrong"), Y("Not quite right. Keep trying!")), _ + 1 < (H || 0) ? setTimeout(() => ke(_ + 1), 800) : (T("results"), setTimeout(() => We(), 600));
     }
   };
   ue(() => {
@@ -686,7 +686,7 @@ function wn(p = {}) {
     }
     o.gain.setValueAtTime(0.1, i.currentTime), t.start(), t.stop(i.currentTime + 0.2);
   }, We = () => {
-    const i = Date.now() + 2500, t = ["#ec4c44", "#f7c948", "#6fcf97", "#56ccf2", "#bb6bd9"], o = document.createElement("canvas"), d = o.getContext("2d");
+    const i = Date.now() + 2500, t = ["#ec4c44", "#f7c948", "#6fcf97", "#56ccf2", "#bb6bd9"], o = document.createElement("canvas"), l = o.getContext("2d");
     o.width = window.innerWidth, o.height = window.innerHeight, o.style.position = "fixed", o.style.top = "0", o.style.left = "0", o.style.pointerEvents = "none", document.body.appendChild(o);
     const v = Array.from({ length: 100 }).map(() => ({
       x: Math.random() * o.width,
@@ -696,12 +696,12 @@ function wn(p = {}) {
       speed: 2 + Math.random() * 4,
       tilt: Math.random() * 2 * Math.PI
     })), k = () => {
-      d.clearRect(0, 0, o.width, o.height), v.forEach((u) => {
-        d.fillStyle = u.color, d.beginPath(), d.ellipse(u.x, u.y, u.size, u.size / 2, u.tilt, 0, 2 * Math.PI), d.fill(), u.y += u.speed, u.x += Math.sin(u.tilt);
+      l.clearRect(0, 0, o.width, o.height), v.forEach((u) => {
+        l.fillStyle = u.color, l.beginPath(), l.ellipse(u.x, u.y, u.size, u.size / 2, u.tilt, 0, 2 * Math.PI), l.fill(), u.y += u.speed, u.x += Math.sin(u.tilt);
       }), Date.now() < i ? requestAnimationFrame(k) : document.body.removeChild(o);
     };
     k();
-  }, Je = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
+  }, Ve = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
     /* @__PURE__ */ s.jsx("h1", { style: h.gmHeadline1, children: "MAGIC SENTENCE" }),
     /* @__PURE__ */ s.jsx("p", { style: h.gmBodyM, children: "Select number of rounds" }),
     /* @__PURE__ */ s.jsx("div", { style: {
@@ -711,7 +711,7 @@ function wn(p = {}) {
     }, children: [3, 4, 5].map((n) => /* @__PURE__ */ s.jsxs(
       "button",
       {
-        onClick: () => Be(n),
+        onClick: () => $e(n),
         style: {
           ...h.gmButton,
           ...D("medium")
@@ -723,7 +723,7 @@ function wn(p = {}) {
       },
       n
     )) })
-  ] }), Ve = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
+  ] }), Xe = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
     /* @__PURE__ */ s.jsx("h1", { style: h.gmHeadline1, children: "MAGIC SENTENCE" }),
     /* @__PURE__ */ s.jsx("p", { style: h.gmBodyM, children: "Select time per round" }),
     /* @__PURE__ */ s.jsx("div", { style: {
@@ -733,7 +733,7 @@ function wn(p = {}) {
     }, children: [15, 20, 30].map((n) => /* @__PURE__ */ s.jsxs(
       "button",
       {
-        onClick: () => $e(n),
+        onClick: () => Fe(n),
         style: {
           ...h.gmButton,
           ...D("medium")
@@ -745,7 +745,7 @@ function wn(p = {}) {
       },
       n
     )) })
-  ] }), Xe = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
+  ] }), qe = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
     /* @__PURE__ */ s.jsxs("h2", { style: { ...h.gmBodyM, marginBottom: "0px" }, children: [
       "Type down ",
       H,
@@ -769,7 +769,7 @@ function wn(p = {}) {
       {
         value: n,
         placeholder: `Sentence ${i + 1}`,
-        onChange: (t) => Fe(i, t.target.value),
+        onChange: (t) => Ge(i, t.target.value),
         style: {
           ...h.gmInput,
           padding: f() ? "8px 12px" : "12px 16px",
@@ -785,7 +785,7 @@ function wn(p = {}) {
     /* @__PURE__ */ s.jsx(
       "button",
       {
-        onClick: Ye,
+        onClick: Ue,
         disabled: E.some((n) => n.trim().length === 0),
         style: {
           ...h.gmButton,
@@ -797,7 +797,7 @@ function wn(p = {}) {
         children: "PLAY"
       }
     )
-  ] }), qe = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmReadyWrapper, children: [
+  ] }), Ze = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmReadyWrapper, children: [
     /* @__PURE__ */ s.jsx("h1", { style: {
       ...h.gmHeadline1,
       fontSize: f() ? "36px" : "72px",
@@ -806,7 +806,7 @@ function wn(p = {}) {
       animation: "pulse 1s ease-in-out infinite"
     }, children: "GET READY" }),
     /* @__PURE__ */ s.jsx("div", { style: h.gmHourglass, children: "⏳" })
-  ] }), Ze = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmGameLayout, children: [
+  ] }), Qe = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmGameLayout, children: [
     /* @__PURE__ */ s.jsxs("h2", { style: {
       marginBottom: f() ? "5px" : "10px",
       fontSize: f() ? "16px" : "20px"
@@ -879,13 +879,13 @@ function wn(p = {}) {
             },
             onDragOver: (t) => t.preventDefault(),
             onDrop: (t) => {
-              const o = t.currentTarget.getBoundingClientRect(), d = o.left + o.width / 2, v = t.clientX > d ? i + 1 : i;
+              const o = t.currentTarget.getBoundingClientRect(), l = o.left + o.width / 2, v = t.clientX > l ? i + 1 : i;
               a({ list: null, index: null, side: null }), t.stopPropagation(), be(t, "bank", v);
             },
             onDragEnter: (t) => {
               if (c) return;
-              const o = t.currentTarget.getBoundingClientRect(), d = o.left + o.width / 2;
-              a({ list: "bank", index: i, side: t.clientX > d ? "right" : "left" });
+              const o = t.currentTarget.getBoundingClientRect(), l = o.left + o.width / 2;
+              a({ list: "bank", index: i, side: t.clientX > l ? "right" : "left" });
             },
             onDragLeave: () => a({ list: null, index: null, side: null }),
             onClick: () => {
@@ -931,12 +931,12 @@ function wn(p = {}) {
           flexWrap: R() ? "wrap" : "nowrap",
           alignItems: "center",
           justifyContent: "center",
-          fontSize: `${Te(j.length)}px`,
+          fontSize: `${Te(I.length)}px`,
           background: M === "correct" ? "#e8f5e8" : M === "almost" ? "#fff3e0" : M === "wrong" ? "#ffebee" : "#fafafa",
           overflowX: R() ? "hidden" : "auto",
           whiteSpace: R() ? "normal" : "nowrap"
         },
-        children: j.map((n, i) => /* @__PURE__ */ s.jsx(
+        children: I.map((n, i) => /* @__PURE__ */ s.jsx(
           "span",
           {
             draggable: !c,
@@ -952,13 +952,13 @@ function wn(p = {}) {
             },
             onDragOver: (t) => t.preventDefault(),
             onDrop: (t) => {
-              const o = t.currentTarget.getBoundingClientRect(), d = o.left + o.width / 2, v = t.clientX > d ? i + 1 : i;
+              const o = t.currentTarget.getBoundingClientRect(), l = o.left + o.width / 2, v = t.clientX > l ? i + 1 : i;
               a({ list: null, index: null, side: null }), t.stopPropagation(), be(t, "selected", v);
             },
             onDragEnter: (t) => {
               if (c) return;
-              const o = t.currentTarget.getBoundingClientRect(), d = o.left + o.width / 2;
-              a({ list: "selected", index: i, side: t.clientX > d ? "right" : "left" });
+              const o = t.currentTarget.getBoundingClientRect(), l = o.left + o.width / 2;
+              a({ list: "selected", index: i, side: t.clientX > l ? "right" : "left" });
             },
             onDragLeave: () => a({ list: null, index: null, side: null }),
             onClick: () => {
@@ -975,7 +975,7 @@ function wn(p = {}) {
               borderRight: e.list === "selected" && e.index === i && e.side === "right" ? "3px solid #3b82f6" : void 0,
               cursor: c ? "not-allowed" : "pointer",
               userSelect: "none",
-              fontSize: `${Te(j.length)}px`,
+              fontSize: `${Te(I.length)}px`,
               // Адаптивный размер шрифта для слов
               fontFamily: '"Roboto", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif',
               // Более плотный шрифт
@@ -993,22 +993,22 @@ function wn(p = {}) {
     /* @__PURE__ */ s.jsx(
       "button",
       {
-        onClick: () => Ue(!0),
-        disabled: !c && j.length === 0,
+        onClick: () => Je(!0),
+        disabled: !c && I.length === 0,
         style: {
           marginTop: f() ? "15px" : "30px",
           fontSize: f() ? "14px" : "20px",
           padding: f() ? "6px 12px" : "10px 24px",
           borderRadius: f() ? "8px" : "12px",
-          background: c || j.length > 0 ? "#ec4c44" : "#ccc",
+          background: c || I.length > 0 ? "#ec4c44" : "#ccc",
           color: "white",
           border: "none",
-          cursor: c || j.length > 0 ? "pointer" : "not-allowed"
+          cursor: c || I.length > 0 ? "pointer" : "not-allowed"
         },
         children: "NEXT"
       }
     )
-  ] }), Qe = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
+  ] }), Ke = () => /* @__PURE__ */ s.jsxs("div", { style: h.gmCenterScreen, children: [
     /* @__PURE__ */ s.jsx("h1", { style: {
       ...h.gmHeadline1,
       marginTop: (r && window.innerWidth > window.innerHeight || window.innerWidth === 896 && window.innerHeight === 414 || window.innerWidth === 844 && window.innerHeight === 390 || window.innerWidth === 926 && window.innerHeight === 428 || window.innerWidth === 932 && window.innerHeight === 430 || q || Z || Q || K || ee || ne || te || ie, "0px"),
@@ -1046,7 +1046,7 @@ function wn(p = {}) {
         {
           onClick: () => {
             We(), N("start"), setTimeout(() => {
-              I("getready"), de(null), F(!1);
+              T("getready"), le(null), F(!1);
             }, 800);
           },
           style: {
@@ -1060,7 +1060,7 @@ function wn(p = {}) {
         "button",
         {
           onClick: () => {
-            N("click"), I("select"), B(null), ge(null), U([]), V(0), ae([]), F(!1);
+            N("click"), T("select"), B(null), ge(null), U([]), V(0), ae([]), F(!1);
           },
           style: {
             ...h.gmButton,
@@ -1070,24 +1070,7 @@ function wn(p = {}) {
         }
       )
     ] })
-  ] }), Ke = on(
-    () => {
-      let n = l;
-      return n || (T ? n = `${T.endsWith("/") ? T.slice(0, -1) : T}/logo.svg` : typeof window < "u" && window.origin && (n = `${window.origin}/browser/speakid/games/magic%20sentence/logo.svg`)), /* @__PURE__ */ s.jsx("div", { style: {
-        ...h.gmLogoFixed,
-        display: !S || r && window.innerWidth > window.innerHeight || window.innerHeight < 700 ? "none" : "block"
-      }, children: n ? /* @__PURE__ */ s.jsx(
-        "img",
-        {
-          src: n,
-          alt: "SPEAKID Logo",
-          style: h.gmLogoImg,
-          loading: "lazy"
-        }
-      ) : /* @__PURE__ */ s.jsx("div", { style: h.gmLogoImg, children: "SPEAKID" }) });
-    },
-    [r, S, l, T]
-  );
+  ] }), Ie = d || (j ? `${j.endsWith("/") ? j.slice(0, -1) : j}/logo.svg` : typeof window < "u" && window.origin ? `${window.origin}/browser/speakid/games/magic%20sentence/logo.svg` : null), en = !r && S && !(window.innerWidth > window.innerHeight) && window.innerHeight >= 700;
   return /* @__PURE__ */ s.jsx(
     "div",
     {
@@ -1135,13 +1118,24 @@ function wn(p = {}) {
                 alignItems: "center"
               },
               children: /* @__PURE__ */ s.jsxs("div", { id: "magic-sentence-root", children: [
-                !r && Ke,
-                y === "select" && Je(),
-                y === "time" && Ve(),
-                y === "type" && Xe(),
-                y === "getready" && qe(),
-                y === "play" && Ze(),
-                y === "results" && Qe()
+                en ? /* @__PURE__ */ s.jsx("div", { style: {
+                  ...h.gmLogoFixed,
+                  display: "block"
+                }, children: Ie ? /* @__PURE__ */ s.jsx(
+                  "img",
+                  {
+                    src: Ie,
+                    alt: "SPEAKID Logo",
+                    style: h.gmLogoImg,
+                    loading: "lazy"
+                  }
+                ) : /* @__PURE__ */ s.jsx("div", { style: h.gmLogoImg, children: "SPEAKID" }) }) : null,
+                y === "select" ? Ve() : null,
+                y === "time" ? Xe() : null,
+                y === "type" ? qe() : null,
+                y === "getready" ? Ze() : null,
+                y === "play" ? Qe() : null,
+                y === "results" ? Ke() : null
               ] })
             }
           )
@@ -1151,18 +1145,18 @@ function wn(p = {}) {
   );
 }
 class xn extends sn {
-  constructor(l) {
-    super(l), this.state = { hasError: !1 };
+  constructor(d) {
+    super(d), this.state = { hasError: !1 };
   }
-  static getDerivedStateFromError(l) {
+  static getDerivedStateFromError(d) {
     return {
       hasError: !0,
-      error: l
+      error: d
     };
   }
-  componentDidCatch(l, S) {
-    console.error("Game Error:", l, S), this.setState({
-      error: l,
+  componentDidCatch(d, S) {
+    console.error("Game Error:", d, S), this.setState({
+      error: d,
       errorInfo: S
     });
   }
@@ -1198,8 +1192,8 @@ class xn extends sn {
             cursor: "pointer",
             transition: "background-color 0.2s"
           },
-          onMouseOver: (l) => l.currentTarget.style.backgroundColor = "#b91c1c",
-          onMouseOut: (l) => l.currentTarget.style.backgroundColor = "#dc2626",
+          onMouseOver: (d) => d.currentTarget.style.backgroundColor = "#b91c1c",
+          onMouseOut: (d) => d.currentTarget.style.backgroundColor = "#dc2626",
           children: "🔄 Restart Game"
         }
       ),