@liiift-studio/threadtext 0.1.0 → 0.2.0

package/dist/index.js

@@ -1,6 +1,6 @@
-import { useRef as wt, useLayoutEffect as me, useEffect as Qt, forwardRef as ye, useCallback as xe } from "react";
-import { jsx as ge } from "react/jsx-runtime";
-const Bt = {
+import { useRef as Tt, useLayoutEffect as Se, useEffect as ne, forwardRef as Ae, useCallback as Fe } from "react";
+import { jsx as Le } from "react/jsx-runtime";
+const zt = {
   /** Base canvas: the baked satin stitches (transparent ground). */
   bg: "tt-bg",
   /** Overlay canvas: cursor sheen (`mix-blend-mode: screen`). */
@@ -8,95 +8,98 @@ const Bt = {
   /** Blinking text caret shown in editable mode. */
   caret: "tt-caret"
 };
-function J(m, e) {
-  let o = Math.imul(m | 0, 374761393) + Math.imul(e | 0, 668265263) | 0;
-  return o = Math.imul(o ^ o >>> 13, 1274126177), ((o ^ o >>> 16) >>> 0) / 4294967295;
+function nt(x, o) {
+  let r = Math.imul(x | 0, 374761393) + Math.imul(o | 0, 668265263) | 0;
+  return r = Math.imul(r ^ r >>> 13, 1274126177), ((r ^ r >>> 16) >>> 0) / 4294967295;
 }
-function Zt(m, e) {
-  const o = Math.floor(m), r = Math.floor(e), i = m - o, a = e - r, f = i * i * (3 - 2 * i), A = a * a * (3 - 2 * a), E = J(o, r), C = J(o + 1, r), c = J(o, r + 1), u = J(o + 1, r + 1);
-  return E + (C - E) * f + (c - E) * A + (E - C - c + u) * f * A;
+function oe(x, o) {
+  const r = Math.floor(x), l = Math.floor(o), c = x - r, s = o - l, h = c * c * (3 - 2 * c), L = s * s * (3 - 2 * s), S = nt(r, l), P = nt(r + 1, l), f = nt(r, l + 1), m = nt(r + 1, l + 1);
+  return S + (P - S) * h + (f - S) * L + (S - P - f + m) * h * L;
 }
-const pt = 1e20;
-function Ht(m, e, o, r, i) {
-  let a = 0;
-  r[0] = 0, i[0] = -pt, i[1] = pt;
-  for (let f = 1; f < e; f++) {
-    let A = (m[f] + f * f - (m[r[a]] + r[a] * r[a])) / (2 * f - 2 * r[a]);
-    for (; A <= i[a]; )
-      a--, A = (m[f] + f * f - (m[r[a]] + r[a] * r[a])) / (2 * f - 2 * r[a]);
-    a++, r[a] = f, i[a] = A, i[a + 1] = pt;
-  }
-  a = 0;
-  for (let f = 0; f < e; f++) {
-    for (; i[a + 1] < f; ) a++;
-    o[f] = (f - r[a]) * (f - r[a]) + m[r[a]];
+const St = 1e20;
+function re(x, o, r, l, c) {
+  let s = 0;
+  l[0] = 0, c[0] = -St, c[1] = St;
+  for (let h = 1; h < o; h++) {
+    let L = (x[h] + h * h - (x[l[s]] + l[s] * l[s])) / (2 * h - 2 * l[s]);
+    for (; L <= c[s]; )
+      s--, L = (x[h] + h * h - (x[l[s]] + l[s] * l[s])) / (2 * h - 2 * l[s]);
+    s++, l[s] = h, c[s] = L, c[s + 1] = St;
+  }
+  s = 0;
+  for (let h = 0; h < o; h++) {
+    for (; c[s + 1] < h; ) s++;
+    r[h] = (h - l[s]) * (h - l[s]) + x[l[s]];
   }
 }
-function we(m, e, o) {
-  const r = new Float64Array(e * o);
-  for (let c = 0; c < e * o; c++) r[c] = m[c] ? pt : 0;
-  const i = Math.max(e, o), a = new Float64Array(i), f = new Float64Array(i), A = new Int32Array(i), E = new Float64Array(i + 1);
-  for (let c = 0; c < e; c++) {
-    for (let u = 0; u < o; u++) a[u] = r[u * e + c];
-    Ht(a, o, f, A, E);
-    for (let u = 0; u < o; u++) r[u * e + c] = f[u];
-  }
-  for (let c = 0; c < o; c++) {
-    for (let u = 0; u < e; u++) a[u] = r[c * e + u];
-    Ht(a, e, f, A, E);
-    for (let u = 0; u < e; u++) r[c * e + u] = f[u];
-  }
-  const C = new Float32Array(e * o);
-  for (let c = 0; c < e * o; c++) C[c] = Math.sqrt(r[c]);
-  return C;
+function Re(x, o, r) {
+  const l = new Float64Array(o * r);
+  for (let f = 0; f < o * r; f++) l[f] = x[f] ? St : 0;
+  const c = Math.max(o, r), s = new Float64Array(c), h = new Float64Array(c), L = new Int32Array(c), S = new Float64Array(c + 1);
+  for (let f = 0; f < o; f++) {
+    for (let m = 0; m < r; m++) s[m] = l[m * o + f];
+    re(s, r, h, L, S);
+    for (let m = 0; m < r; m++) l[m * o + f] = h[m];
+  }
+  for (let f = 0; f < r; f++) {
+    for (let m = 0; m < o; m++) s[m] = l[f * o + m];
+    re(s, o, h, L, S);
+    for (let m = 0; m < o; m++) l[f * o + m] = h[m];
+  }
+  const P = new Float32Array(o * r);
+  for (let f = 0; f < o * r; f++) P[f] = Math.sqrt(l[f]);
+  return P;
 }
-function Wt(m, e, o, r, i) {
-  let a = Float32Array.from(m);
-  const f = new Float32Array(e * o), A = 1 / (2 * r + 1), E = (C, c) => C < 0 ? 0 : C > c ? c : C;
-  for (let C = 0; C < i; C++) {
-    for (let c = 0; c < o; c++) {
-      const u = c * e;
-      let $ = 0;
-      for (let D = -r; D <= r; D++) $ += a[u + E(D, e - 1)];
-      for (let D = 0; D < e; D++)
-        f[u + D] = $ * A, $ += a[u + E(D + r + 1, e - 1)] - a[u + E(D - r, e - 1)];
+function ie(x, o, r, l, c) {
+  let s = Float32Array.from(x);
+  const h = new Float32Array(o * r), L = 1 / (2 * l + 1), S = (P, f) => P < 0 ? 0 : P > f ? f : P;
+  for (let P = 0; P < c; P++) {
+    for (let f = 0; f < r; f++) {
+      const m = f * o;
+      let B = 0;
+      for (let q = -l; q <= l; q++) B += s[m + S(q, o - 1)];
+      for (let q = 0; q < o; q++)
+        h[m + q] = B * L, B += s[m + S(q + l + 1, o - 1)] - s[m + S(q - l, o - 1)];
     }
-    for (let c = 0; c < e; c++) {
-      let u = 0;
-      for (let $ = -r; $ <= r; $++) u += f[E($, o - 1) * e + c];
-      for (let $ = 0; $ < o; $++)
-        a[$ * e + c] = u * A, u += f[E($ + r + 1, o - 1) * e + c] - f[E($ - r, o - 1) * e + c];
+    for (let f = 0; f < o; f++) {
+      let m = 0;
+      for (let B = -l; B <= l; B++) m += h[S(B, r - 1) * o + f];
+      for (let B = 0; B < r; B++)
+        s[B * o + f] = m * L, m += h[S(B + l + 1, r - 1) * o + f] - h[S(B - l, r - 1) * o + f];
     }
   }
-  return a;
+  return s;
 }
-function te(m, e) {
-  if (!m) return e;
-  const o = m.trim();
-  if (o[0] === "#") {
-    let i = o.slice(1);
-    if (i.length === 3 && (i = i[0] + i[0] + i[1] + i[1] + i[2] + i[2]), i.length >= 6) {
-      const a = parseInt(i.slice(0, 2), 16), f = parseInt(i.slice(2, 4), 16), A = parseInt(i.slice(4, 6), 16);
-      if (!Number.isNaN(a) && !Number.isNaN(f) && !Number.isNaN(A)) return [a, f, A];
+function ae(x, o) {
+  if (!x) return o;
+  const r = x.trim();
+  if (r[0] === "#") {
+    let c = r.slice(1);
+    if (c.length === 3 && (c = c[0] + c[0] + c[1] + c[1] + c[2] + c[2]), c.length >= 6) {
+      const s = parseInt(c.slice(0, 2), 16), h = parseInt(c.slice(2, 4), 16), L = parseInt(c.slice(4, 6), 16);
+      if (!Number.isNaN(s) && !Number.isNaN(h) && !Number.isNaN(L)) return [s, h, L];
     }
-    return e;
+    return o;
   }
-  const r = o.match(/rgba?\(([^)]+)\)/i);
-  if (r) {
-    const i = r[1].split(",").map((a) => parseFloat(a));
-    if (i.length >= 3 && i.slice(0, 3).every((a) => !Number.isNaN(a)))
-      return [Math.round(i[0]), Math.round(i[1]), Math.round(i[2])];
+  const l = r.match(/rgba?\(([^)]+)\)/i);
+  if (l) {
+    const c = l[1].split(",").map((s) => parseFloat(s));
+    if (c.length >= 3 && c.slice(0, 3).every((s) => !Number.isNaN(s)))
+      return [Math.round(c[0]), Math.round(c[1]), Math.round(c[2])];
   }
-  return e;
+  return o;
 }
-function K(m) {
-  return m < 0 ? 0 : m > 255 ? 255 : Math.round(m);
+function J(x) {
+  return x < 0 ? 0 : x > 255 ? 255 : Math.round(x);
 }
-function ee(m) {
-  return (m.split(",")[0] || "serif").trim().replace(/^["']|["']$/g, "");
+function Et(x, o, r) {
+  return x < o ? o : x > r ? r : x;
 }
-function pe(m, e) {
-  if (typeof window > "u" || typeof document > "u" || !m)
+function le(x) {
+  return (x.split(",")[0] || "serif").trim().replace(/^["']|["']$/g, "");
+}
+function Ie(x, o) {
+  if (typeof window > "u" || typeof document > "u" || !x)
     return { setText() {
     }, replay() {
     }, resize() {
@@ -104,390 +107,475 @@ function pe(m, e) {
     }, focus() {
     }, destroy() {
     }, get text() {
-      return e.text ?? "";
+      return o.text ?? "";
     } };
-  let o = e.text ?? "", r = e.font ?? "Georgia, serif", i = e.weight ?? 680, a = e.fill ?? 0.9, f = e.sewRate ?? 110, A = e.sheen ?? !0, E = e.animate ?? !0, C = e.editable ?? !1, c = e.pitch, u = e.onTextChange, $ = ee(r);
-  const D = e.reducedMotion ?? !!(window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
-  let k = te(e.threadColor ?? "#fffbf3", [255, 251, 243]), W = [0, 0, 0], N = [0, 0, 0];
-  function tt(t) {
-    k = te(t, [255, 251, 243]), W = [k[0] * 0.585, k[1] * 0.585, k[2] * 0.585], N = [k[0] * 0.47, k[1] * 0.47, k[2] * 0.47];
-  }
-  tt(e.threadColor ?? "#fffbf3");
-  const G = [];
-  let P, g;
-  m instanceof HTMLCanvasElement ? (P = m, g = m.parentElement ?? m) : (g = m, P = document.createElement("canvas"), G.push(P), g.appendChild(P)), P.classList.add(Bt.bg);
-  const O = document.createElement("canvas");
-  G.push(O), O.classList.add(Bt.fx), g.appendChild(O), getComputedStyle(g).position === "static" && (g.style.position = "relative"), P.style.display = "block", P.style.width = "100%", Object.assign(O.style, { position: "absolute", inset: "0", width: "100%", pointerEvents: "none", mixBlendMode: "screen" });
-  let S = null, Q = !1, s = 0, h = 0, Z = 0, Mt = 0, st = 4, et = [], nt = 0, ot = 0, bt = new Uint8Array(0), Ct = new Float32Array(0), ft = new Float32Array(0), dt = new Float32Array(0), U = null, rt = null, ut = null, ht = [], mt = 3;
-  const R = { rows: [], idx: 0, acc: 0, rate: 0, on: !1 }, V = { x: 0, y: 0, set: !1 };
-  let H = !0, vt = 0, Dt = !1, yt = 0, z = !1, Y = !1;
-  function ne() {
-    const t = g.getBoundingClientRect(), n = Math.max(1, Math.round(t.width || Math.min(window.innerWidth * 0.95, 1240))), l = o || "Ag", y = P.getContext("2d");
-    let v = 100;
-    y && (y.font = `${i} 100px ${r}`, v = y.measureText(l).width || 100);
-    let b = Math.max(8, 100 * (n * a) / v), T = b * 0.7, L = b * 0.3, I = n * a;
-    if (y) {
-      y.font = `${i} ${b}px ${r}`;
-      const p = y.measureText(l);
-      I = p.width || I, p.actualBoundingBoxAscent > 0 && (T = p.actualBoundingBoxAscent), p.actualBoundingBoxDescent > 0 && (L = p.actualBoundingBoxDescent);
+  let r = o.text ?? "", l = o.font ?? "Georgia, serif", c = Et(o.weight ?? 680, 1, 1e3), s = Et(o.fill ?? 0.9, 0.05, 1), h = Math.max(1, o.sewRate ?? 110), L = o.sewStyle === "hand" ? "hand" : "machine", S = o.sheen ?? !0, P = o.animate ?? !0, f = o.editable ?? !1, m = o.pitch, B = o.onTextChange, q = le(l);
+  const gt = o.reducedMotion ?? !!(window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+  let N = ae(o.threadColor ?? "#fffbf3", [255, 251, 243]), ft = [0, 0, 0], U = [0, 0, 0];
+  function dt(t) {
+    N = ae(t, [255, 251, 243]), ft = [N[0] * 0.585, N[1] * 0.585, N[2] * 0.585], U = [N[0] * 0.47, N[1] * 0.47, N[2] * 0.47];
+  }
+  dt(o.threadColor ?? "#fffbf3");
+  const Y = [];
+  let O, k;
+  x instanceof HTMLCanvasElement ? (O = x, k = x.parentElement ?? x) : (k = x, O = document.createElement("canvas"), Y.push(O), k.appendChild(O)), O.classList.add(zt.bg);
+  const X = document.createElement("canvas");
+  Y.push(X), X.classList.add(zt.fx), k.appendChild(X), getComputedStyle(k).position === "static" && (k.style.position = "relative"), O.style.display = "block", O.style.width = "100%", Object.assign(X.style, { position: "absolute", inset: "0", width: "100%", pointerEvents: "none", mixBlendMode: "screen" });
+  let w = null, F = null, W = !1, d = 0, g = 0, ot = 0, At = 0, rt = 4, it = [], ut = 0, ht = 0, qt = -1, _t = "", Gt = -1, Ut = -1, Ft = new Uint8Array(0), Lt = new Float32Array(0), pt = new Float32Array(0), wt = new Float32Array(0), Q = null, at = null, Mt = null, lt = [], tt = 3;
+  const I = { rows: [], idx: 0, acc: 0, rate: 0, on: !1 }, H = { x: 0, y: 0, set: !1 };
+  let et = !0, Rt = 0, mt = !1, yt = 0, K = !1, Z = !1;
+  function ce() {
+    const t = k.getBoundingClientRect(), e = Math.max(1, Math.round(t.width || Math.min(window.innerWidth * 0.95, 1240))), i = r || "Ag", u = O.getContext("2d");
+    u && (u.textBaseline = "middle");
+    let T = 100;
+    u && (u.font = `${c} 100px ${l}`, T = u.measureText(i).width || 100);
+    const C = Math.max(8, 100 * (e * s) / T);
+    let b = C * 0.62, A = C * 0.62, E = e * s;
+    if (u) {
+      u.font = `${c} ${C}px ${l}`;
+      const a = u.measureText(i);
+      E = a.width || E, a.actualBoundingBoxAscent > 0 && (b = a.actualBoundingBoxAscent), a.actualBoundingBoxDescent > 0 && (A = a.actualBoundingBoxDescent);
     }
-    const w = Math.max(1, Math.round(2 * Math.max(T, L) * 1.12));
-    let d = Math.min(window.devicePixelRatio || 1, 1.7);
-    for (; n * d * w * d > 9e5 && d > 0.4; ) d -= 0.1;
-    s = Math.max(1, Math.round(n * d)), h = Math.max(1, Math.round(w * d)), Z = Math.max(4, Math.round(b * d)), Mt = Math.round(s / 2 - I * d / 2);
-    for (const p of [P, O])
-      p.width = s, p.height = h, p.style.height = w + "px";
-    g.style.height = w + "px", st = c ?? Math.max(3, h * 95e-4);
-  }
-  function oe() {
-    rt = document.createElement("canvas"), rt.width = s, rt.height = h, ut = rt.getContext("2d", { willReadFrequently: !0 });
-  }
-  function Nt() {
-    const t = Math.max(7, st * 2.5), n = Math.max(3.2, st * 1.3);
-    nt = Math.ceil(t) + 2, ot = Math.ceil(n) + 2, et = [];
-    for (let l = 0; l < 20; l++) {
-      const y = 0.34 + l / 19 * 0.82, v = document.createElement("canvas");
-      v.width = nt, v.height = ot;
-      const b = v.getContext("2d");
-      if (!b) {
-        et.push(v);
+    const M = Math.max(1, Math.round(2 * Math.max(b, A) * 1.1));
+    let n = Math.min(window.devicePixelRatio || 1, 1.7);
+    for (; e * n * M * n > 9e5 && n > 0.4; ) n -= 0.1;
+    d = Math.max(1, Math.round(e * n)), g = Math.max(1, Math.round(M * n)), ot = Math.max(4, Math.round(C * n)), At = Math.round(d / 2 - E * n / 2);
+    for (const a of [O, X])
+      a.width = d, a.height = g, a.style.height = M + "px";
+    k.style.height = M + "px", rt = m ?? Math.max(3, g * 95e-4);
+  }
+  function se() {
+    at && Gt === d && Ut === g || (at = document.createElement("canvas"), at.width = d, at.height = g, Mt = at.getContext("2d", { willReadFrequently: !0 }), Gt = d, Ut = g);
+  }
+  function Xt() {
+    const t = Math.max(7, rt * 2.5), e = Math.max(3.2, rt * 1.3);
+    ut = Math.ceil(t) + 2, ht = Math.ceil(e) + 2, it = [];
+    for (let i = 0; i < 20; i++) {
+      const u = 0.34 + i / 19 * 0.82, T = document.createElement("canvas");
+      T.width = ut, T.height = ht;
+      const C = T.getContext("2d");
+      if (!C) {
+        it.push(T);
         continue;
       }
-      const T = nt / 2, L = ot / 2, I = b.createLinearGradient(0, L - n / 2, 0, L + n / 2), w = (B, j) => `rgba(${K(B[0] * y)},${K(B[1] * y)},${K(B[2] * y)},${j})`;
-      I.addColorStop(0, w(N, 0)), I.addColorStop(0.16, w(W, 1)), I.addColorStop(0.5, w(k, 1)), I.addColorStop(0.84, w(W, 1)), I.addColorStop(1, w(N, 0)), b.fillStyle = I, b.beginPath();
-      const d = n / 2;
-      b.moveTo(T - t / 2 + d, L - d), b.lineTo(T + t / 2 - d, L - d), b.arc(T + t / 2 - d, L, d, -Math.PI / 2, Math.PI / 2), b.lineTo(T - t / 2 + d, L + d), b.arc(T - t / 2 + d, L, d, Math.PI / 2, -Math.PI / 2), b.closePath(), b.fill(), b.globalCompositeOperation = "destination-in";
-      const p = b.createLinearGradient(T - t / 2, 0, T + t / 2, 0);
-      p.addColorStop(0, "rgba(0,0,0,0)"), p.addColorStop(0.22, "rgba(0,0,0,1)"), p.addColorStop(0.78, "rgba(0,0,0,1)"), p.addColorStop(1, "rgba(0,0,0,0)"), b.fillStyle = p, b.fillRect(0, 0, nt, ot), et.push(v);
+      const b = ut / 2, A = ht / 2, E = C.createLinearGradient(0, A - e / 2, 0, A + e / 2), M = (R, $) => `rgba(${J(R[0] * u)},${J(R[1] * u)},${J(R[2] * u)},${$})`;
+      E.addColorStop(0, M(U, 0)), E.addColorStop(0.16, M(ft, 1)), E.addColorStop(0.5, M(N, 1)), E.addColorStop(0.84, M(ft, 1)), E.addColorStop(1, M(U, 0)), C.fillStyle = E, C.beginPath();
+      const n = e / 2;
+      C.moveTo(b - t / 2 + n, A - n), C.lineTo(b + t / 2 - n, A - n), C.arc(b + t / 2 - n, A, n, -Math.PI / 2, Math.PI / 2), C.lineTo(b - t / 2 + n, A + n), C.arc(b - t / 2 + n, A, n, Math.PI / 2, -Math.PI / 2), C.closePath(), C.fill(), C.globalCompositeOperation = "destination-in";
+      const a = C.createLinearGradient(b - t / 2, 0, b + t / 2, 0);
+      a.addColorStop(0, "rgba(0,0,0,0)"), a.addColorStop(0.22, "rgba(0,0,0,1)"), a.addColorStop(0.78, "rgba(0,0,0,1)"), a.addColorStop(1, "rgba(0,0,0,0)"), C.fillStyle = a, C.fillRect(0, 0, ut, ht), it.push(T);
     }
+    qt = rt, _t = N.join(",");
   }
-  function re() {
-    if (!ut) return;
-    const t = ut;
-    t.clearRect(0, 0, s, h), t.fillStyle = "#fff", t.textAlign = "left", t.textBaseline = "middle", t.font = `${i} ${Z}px ${r}`, t.fillText(o, Mt, h * 0.5);
-    const n = t.getImageData(0, 0, s, h).data, l = new Uint8Array(s * h);
-    for (let x = 0; x < h; x++) for (let M = 0; M < s; M++) {
-      const F = x * s + M, q = n[F * 4 + 3] / 255, _ = Zt(M * 0.5, x * 0.5) * 0.22 + Zt(M * 1.8, x * 1.8) * 0.1;
-      l[F] = q > 0.5 + (_ - 0.16) ? 1 : 0;
+  function fe() {
+    it.length && qt === rt && _t === N.join(",") || Xt();
+  }
+  function de() {
+    if (!Mt) return;
+    const t = Mt;
+    t.clearRect(0, 0, d, g), t.fillStyle = "#fff", t.textAlign = "left", t.textBaseline = "middle", t.font = `${c} ${ot}px ${l}`, t.fillText(r, At, g * 0.5);
+    const e = t.getImageData(0, 0, d, g).data, i = new Uint8Array(d * g);
+    for (let y = 0; y < g; y++) for (let p = 0; p < d; p++) {
+      const v = y * d + p, _ = e[v * 4 + 3] / 255, z = oe(p * 0.5, y * 0.5) * 0.22 + oe(p * 1.8, y * 1.8) * 0.1;
+      i[v] = _ > 0.5 + (z - 0.16) ? 1 : 0;
     }
-    bt = l;
-    const y = we(l, s, h), v = new Float32Array(s * h);
-    for (let x = 1; x < h - 1; x++) for (let M = 1; M < s - 1; M++) {
-      const F = x * s + M;
-      v[F] = (y[F] * 4 + y[F - 1] + y[F + 1] + y[F - s] + y[F + s]) / 8;
+    Ft = i;
+    const u = Re(i, d, g), T = new Float32Array(d * g);
+    for (let y = 1; y < g - 1; y++) for (let p = 1; p < d - 1; p++) {
+      const v = y * d + p;
+      T[v] = (u[v] * 4 + u[v - 1] + u[v + 1] + u[v - d] + u[v + d]) / 8;
     }
-    const b = new Float32Array(s * h), T = new Float32Array(s * h), L = new Float32Array(s * h), I = new Float32Array(s * h);
-    for (let x = 1; x < h - 1; x++) for (let M = 1; M < s - 1; M++) {
-      const F = x * s + M;
-      if (!l[F]) continue;
-      const q = (v[F + 1] - v[F - 1]) * 0.5, _ = (v[F + s] - v[F - s]) * 0.5;
-      L[F] = q, I[F] = _, b[F] = q * q - _ * _, T[F] = 2 * q * _;
+    const C = new Float32Array(d * g), b = new Float32Array(d * g), A = new Float32Array(d * g), E = new Float32Array(d * g);
+    for (let y = 1; y < g - 1; y++) for (let p = 1; p < d - 1; p++) {
+      const v = y * d + p;
+      if (!i[v]) continue;
+      const _ = (T[v + 1] - T[v - 1]) * 0.5, z = (T[v + d] - T[v - d]) * 0.5;
+      A[v] = _, E[v] = z, C[v] = _ * _ - z * z, b[v] = 2 * _ * z;
     }
-    const w = Math.max(7, Math.round(h * 0.05)), d = Wt(b, s, h, w, 2), p = Wt(T, s, h, w, 2);
-    ft = new Float32Array(s * h), dt = new Float32Array(s * h);
-    for (let x = 0; x < s * h; x++) {
-      if (!l[x]) continue;
-      const M = 0.5 * Math.atan2(p[x], d[x]);
-      ft[x] = Math.cos(M), dt[x] = Math.sin(M);
+    const M = Math.max(7, Math.round(g * 0.05)), n = ie(C, d, g, M, 2), a = ie(b, d, g, M, 2);
+    pt = new Float32Array(d * g), wt = new Float32Array(d * g);
+    for (let y = 0; y < d * g; y++) {
+      if (!i[y]) continue;
+      const p = 0.5 * Math.atan2(a[y], n[y]);
+      pt[y] = Math.cos(p), wt[y] = Math.sin(p);
     }
-    const B = Math.max(9, h * 0.04), j = new Float32Array(s * h), lt = -0.45, ct = -0.62, gt = 0.64;
-    for (let x = 1; x < h - 1; x++) for (let M = 1; M < s - 1; M++) {
-      const F = x * s + M;
-      if (!l[F]) continue;
-      let q = L[F], _ = I[F];
-      const Xt = Math.hypot(q, _) || 1;
-      q /= Xt, _ /= Xt;
-      const Vt = v[F], Yt = (1 - Math.min(Vt / B, 1)) * 1.25;
-      let $t = -q * Yt, It = -_ * Yt;
-      const Jt = 1.5, Pt = Math.hypot($t, It, Jt);
-      $t /= Pt, It /= Pt;
-      let kt = $t * lt + It * ct + Jt / Pt * gt;
-      kt < 0 && (kt = 0);
-      const he = Math.min(1, 0.45 + 0.55 * Math.min(Vt / (B * 0.7), 1));
-      j[F] = Math.min(1.12, (0.5 + 0.75 * kt) * he);
+    const R = Math.max(9, g * 0.04), $ = new Float32Array(d * g), G = -0.45, V = -0.62, D = 0.64;
+    for (let y = 1; y < g - 1; y++) for (let p = 1; p < d - 1; p++) {
+      const v = y * d + p;
+      if (!i[v]) continue;
+      let _ = A[v], z = E[v];
+      const xt = Math.hypot(_, z) || 1;
+      _ /= xt, z /= xt;
+      const Wt = T[v], te = (1 - Math.min(Wt / R, 1)) * 1.25;
+      let Nt = -_ * te, Ot = -z * te;
+      const ee = 1.5, Dt = Math.hypot(Nt, Ot, ee);
+      Nt /= Dt, Ot /= Dt;
+      let jt = Nt * G + Ot * V + ee / Dt * D;
+      jt < 0 && (jt = 0);
+      const Ee = Math.min(1, 0.45 + 0.55 * Math.min(Wt / (R * 0.7), 1));
+      $[v] = Math.min(1.12, (0.5 + 0.75 * jt) * Ee);
     }
-    Ct = j, U = document.createElement("canvas"), U.width = s, U.height = h;
-    const X = U.getContext("2d");
-    if (X) {
-      const x = X.createImageData(s, h);
-      for (let M = 0; M < s * h; M++) l[M] && (x.data[M * 4] = 255, x.data[M * 4 + 1] = 255, x.data[M * 4 + 2] = 255, x.data[M * 4 + 3] = 255);
-      X.putImageData(x, 0, 0);
+    Lt = $, Q = document.createElement("canvas"), Q.width = d, Q.height = g;
+    const j = Q.getContext("2d");
+    if (j) {
+      const y = j.createImageData(d, g);
+      for (let p = 0; p < d * g; p++) i[p] && (y.data[p * 4] = 255, y.data[p * 4 + 1] = 255, y.data[p * 4 + 2] = 255, y.data[p * 4 + 3] = 255);
+      j.putImageData(y, 0, 0);
     }
   }
-  function ie() {
-    const t = Math.max(1.6, st * 0.6);
-    mt = t;
-    const n = [];
-    for (let l = 0; l < h; l += t) for (let y = 0; y < s; y += t) {
-      const v = (J(Math.floor(y), Math.floor(l)) - 0.5) * t * 0.9, b = (J(Math.floor(l), Math.floor(y)) - 0.5) * t * 0.9, T = Math.round(y + v), L = Math.round(l + b);
-      if (T < 1 || L < 1 || T >= s - 1 || L >= h - 1) continue;
-      const I = L * s + T;
-      if (!bt[I]) continue;
-      const w = Math.atan2(dt[I], ft[I]), d = 0.86 + J(T * 7, L * 13) * 0.18;
-      let p = Ct[I] * d;
-      p = p < 0 ? 0 : p > 1.12 ? 1.12 : p, n.push({ x: T, y: L, ang: w, idx: Math.min(19, Math.max(0, Math.round(p / 1.12 * 19))) });
+  function ue() {
+    const t = Math.max(1.6, rt * 0.6);
+    tt = t;
+    const e = [];
+    for (let i = 0; i < g; i += t) for (let u = 0; u < d; u += t) {
+      const T = (nt(Math.floor(u), Math.floor(i)) - 0.5) * t * 0.9, C = (nt(Math.floor(i), Math.floor(u)) - 0.5) * t * 0.9, b = Math.round(u + T), A = Math.round(i + C);
+      if (b < 1 || A < 1 || b >= d - 1 || A >= g - 1) continue;
+      const E = A * d + b;
+      if (!Ft[E]) continue;
+      const M = Math.atan2(wt[E], pt[E]), n = 0.86 + nt(b * 7, A * 13) * 0.18;
+      let a = Lt[E] * n;
+      a = a < 0 ? 0 : a > 1.12 ? 1.12 : a, e.push({ x: b, y: A, ang: M, idx: Math.min(19, Math.max(0, Math.round(a / 1.12 * 19))) });
     }
-    n.sort((l, y) => l.x - y.x), ht = n;
+    lt = e;
   }
-  function Ot(t, n) {
-    t.save(), t.translate(n.x, n.y), t.rotate(n.ang), t.drawImage(et[n.idx], -nt / 2, -ot / 2), t.restore();
+  function Kt(t, e) {
+    t.save(), t.translate(e.x, e.y), t.rotate(e.ang), t.drawImage(it[e.idx], -ut / 2, -ht / 2), t.restore();
   }
-  function Tt() {
-    const t = P.getContext("2d");
+  function It() {
+    const t = O.getContext("2d");
     if (t)
-      for (const n of ht) Ot(t, n);
+      for (const e of lt) Kt(t, e);
   }
-  function At() {
-    const t = P.getContext("2d");
-    t && t.clearRect(0, 0, s, h);
+  function $t() {
+    const t = O.getContext("2d");
+    t && t.clearRect(0, 0, d, g);
   }
-  function ae(t) {
+  function he(t) {
     if (!t.length) return [];
-    const n = Math.max(4, mt * 1.5), l = /* @__PURE__ */ new Map(), y = (w, d) => w + "," + d;
-    t.forEach((w, d) => {
-      const p = y(Math.floor(w.x / n), Math.floor(w.y / n));
-      let B = l.get(p);
-      B || l.set(p, B = []), B.push(d);
+    const e = Math.max(4, tt * 1.5), i = /* @__PURE__ */ new Map(), u = (M, n) => M + "," + n;
+    t.forEach((M, n) => {
+      const a = u(Math.floor(M.x / e), Math.floor(M.y / e));
+      let R = i.get(a);
+      R || i.set(a, R = []), R.push(n);
     });
-    const v = mt * 1.8 * (mt * 1.8);
-    function b(w) {
-      const d = t[w], p = Math.floor(d.x / n), B = Math.floor(d.y / n), j = [];
-      for (let lt = -1; lt <= 1; lt++) for (let ct = -1; ct <= 1; ct++) {
-        const gt = l.get(y(p + lt, B + ct));
-        if (gt)
-          for (const X of gt) {
-            if (X === w) continue;
-            const x = t[X].x - d.x, M = t[X].y - d.y;
-            x * x + M * M <= v && j.push(X);
+    const T = tt * 1.8 * (tt * 1.8);
+    function C(M) {
+      const n = t[M], a = Math.floor(n.x / e), R = Math.floor(n.y / e), $ = [];
+      for (let G = -1; G <= 1; G++) for (let V = -1; V <= 1; V++) {
+        const D = i.get(u(a + G, R + V));
+        if (D)
+          for (const j of D) {
+            if (j === M) continue;
+            const y = t[j].x - n.x, p = t[j].y - n.y;
+            y * y + p * p <= T && $.push(j);
           }
       }
-      return j;
+      return $;
     }
-    const T = new Uint8Array(t.length), L = [], I = t.map((w, d) => d).sort((w, d) => t[w].x + t[w].y - (t[d].x + t[d].y));
-    for (const w of I) {
-      if (T[w]) continue;
-      let d = [w];
-      for (T[w] = 1; d.length; ) {
-        L.push(d.map((B) => t[B]));
-        const p = [];
-        for (const B of d) for (const j of b(B)) T[j] || (T[j] = 1, p.push(j));
-        d = p;
+    const b = new Uint8Array(t.length), A = [], E = t.map((M, n) => n).sort((M, n) => t[M].x + t[M].y - (t[n].x + t[n].y));
+    for (const M of E) {
+      if (b[M]) continue;
+      let n = [M];
+      for (b[M] = 1; n.length; ) {
+        A.push(n.map((R) => t[R]));
+        const a = [];
+        for (const R of n) for (const $ of C(R)) b[$] || (b[$] = 1, a.push($));
+        n = a;
       }
     }
-    return L;
+    return A;
   }
-  function le() {
-    if (At(), D || !E) {
-      Tt(), R.on = !1;
+  function me(t) {
+    if (!t.length) return [];
+    const e = Math.max(4, tt * 1.5), i = /* @__PURE__ */ new Map(), u = (n, a) => n + "," + a;
+    t.forEach((n, a) => {
+      const R = u(Math.floor(n.x / e), Math.floor(n.y / e));
+      let $ = i.get(R);
+      $ || i.set(R, $ = []), $.push(a);
+    });
+    const T = tt * 1.8 * (tt * 1.8), C = (n) => {
+      const a = t[n], R = u(Math.floor(a.x / e), Math.floor(a.y / e)), $ = i.get(R);
+      if (!$) return;
+      const G = $.indexOf(n);
+      G >= 0 && $.splice(G, 1), $.length || i.delete(R);
+    };
+    function b(n) {
+      const a = t[n], R = Math.floor(a.x / e), $ = Math.floor(a.y / e);
+      let G = -1, V = 1 / 0;
+      for (let D = -1; D <= 1; D++) for (let j = -1; j <= 1; j++) {
+        const y = i.get(u(R + D, $ + j));
+        if (y)
+          for (const p of y) {
+            const v = t[p].x - a.x, _ = t[p].y - a.y, z = v * v + _ * _;
+            z <= T && z < V && (V = z, G = p);
+          }
+      }
+      return G;
+    }
+    function A(n) {
+      const a = t[n], R = Math.floor(a.x / e), $ = Math.floor(a.y / e);
+      let G = -1, V = 1 / 0;
+      for (let D = 1; D < 512; D++) {
+        for (let j = -D; j <= D; j++) for (let y = -D; y <= D; y++) {
+          if (Math.max(Math.abs(j), Math.abs(y)) !== D) continue;
+          const p = i.get(u(R + j, $ + y));
+          if (p)
+            for (const v of p) {
+              const _ = t[v].x - a.x, z = t[v].y - a.y, xt = _ * _ + z * z;
+              xt < V && (V = xt, G = v);
+            }
+        }
+        if (G >= 0 && D > Math.ceil(Math.sqrt(V) / e) + 1) break;
+      }
+      return G;
+    }
+    let E = 0;
+    for (let n = 1; n < t.length; n++) t[n].x + t[n].y < t[E].x + t[E].y && (E = n);
+    const M = [t[E]];
+    C(E);
+    for (let n = 1; n < t.length; n++) {
+      let a = b(E);
+      if (a < 0 && (a = A(E)), a < 0) break;
+      M.push(t[a]), C(a), E = a;
+    }
+    return M;
+  }
+  function ye() {
+    if ($t(), gt || !P) {
+      It(), I.on = !1;
       return;
     }
-    R.rows = ae(ht), R.idx = 0, R.acc = 0, R.rate = f, R.on = R.rows.length > 0;
-  }
-  function ce(t) {
-    const n = P.getContext("2d");
-    if (n)
-      for (t > R.rows.length && (t = R.rows.length); R.idx < t; ) {
-        const l = R.rows[R.idx++];
-        for (const y of l) Ot(n, y);
+    L === "hand" ? (I.rows = me(lt).map((t) => [t]), I.rate = Math.max(h, lt.length / 3.2)) : (I.rows = he(lt), I.rate = h), I.idx = 0, I.acc = 0, I.on = I.rows.length > 0;
+  }
+  function xe(t) {
+    const e = O.getContext("2d");
+    if (e)
+      for (t > I.rows.length && (t = I.rows.length); I.idx < t; ) {
+        const i = I.rows[I.idx++];
+        for (const u of i) Kt(e, u);
       }
   }
-  function se(t, n) {
-    const l = O.getContext("2d");
-    if (!l || (l.clearRect(0, 0, s, h), !A || !U)) return;
-    const y = s * 0.32, v = l.createRadialGradient(t, n, 0, t, n, y);
-    v.addColorStop(0, "rgba(255,250,238,0.18)"), v.addColorStop(0.5, "rgba(255,250,238,0.055)"), v.addColorStop(1, "rgba(255,250,238,0)"), l.fillStyle = v, l.fillRect(0, 0, s, h), l.globalCompositeOperation = "destination-in", l.drawImage(U, 0, 0), l.globalCompositeOperation = "source-over";
+  function ge(t, e) {
+    const i = X.getContext("2d");
+    if (!i || (i.clearRect(0, 0, d, g), !S || !Q)) return;
+    const u = d * 0.32, T = i.createRadialGradient(t, e, 0, t, e, u);
+    T.addColorStop(0, "rgba(255,250,238,0.18)"), T.addColorStop(0.5, "rgba(255,250,238,0.055)"), T.addColorStop(1, "rgba(255,250,238,0)"), i.fillStyle = T, i.fillRect(0, 0, d, g), i.globalCompositeOperation = "destination-in", i.drawImage(Q, 0, 0), i.globalCompositeOperation = "source-over";
   }
-  function fe() {
-    S || !C || (S = document.createElement("span"), S.className = Bt.caret, S.setAttribute("aria-hidden", "true"), Object.assign(S.style, { position: "absolute", pointerEvents: "none", borderRadius: "1px", opacity: "0", background: `rgb(${K(k[0])},${K(k[1])},${K(k[2])})` }), g.appendChild(S), G.push(S));
+  function pe() {
+    F || !f || (F = document.createElement("span"), F.className = zt.caret, F.setAttribute("aria-hidden", "true"), Object.assign(F.style, { position: "absolute", pointerEvents: "none", borderRadius: "1px", opacity: "0", background: `rgb(${J(N[0])},${J(N[1])},${J(N[2])})` }), k.appendChild(F), Y.push(F));
   }
-  function Et() {
-    if (!C || !S) return;
-    const t = P.getContext("2d");
+  function kt() {
+    if (!f || !F) return;
+    const t = O.getContext("2d");
     if (!t) return;
-    t.font = `${i} ${Z}px ${r}`;
-    const n = t.measureText(o).width, l = (P.clientWidth || s) / s, y = Z * 0.7;
-    S.style.left = (Mt + n + Z * 0.05) * l + "px", S.style.top = 0.5 * (P.clientHeight || h) - y * l / 2 + "px", S.style.height = y * l + "px", S.style.width = Math.max(2, Math.round(Z * 0.02 * l)) + "px", S.style.background = `rgb(${K(k[0])},${K(k[1])},${K(k[2])})`;
+    t.font = `${c} ${ot}px ${l}`;
+    const e = t.measureText(r).width, i = (O.clientWidth || d) / d, u = ot * 0.7;
+    F.style.left = (At + e + ot * 0.05) * i + "px", F.style.top = 0.5 * (O.clientHeight || g) - u * i / 2 + "px", F.style.height = u * i + "px", F.style.width = Math.max(2, Math.round(ot * 0.02 * i)) + "px", F.style.background = `rgb(${J(N[0])},${J(N[1])},${J(N[2])})`;
   }
-  function jt(t) {
-    if (z) return;
+  function ct() {
+    K || mt || (mt = !0, yt = 0, Rt = requestAnimationFrame(Vt));
+  }
+  function Vt(t) {
+    if (K) {
+      mt = !1;
+      return;
+    }
     yt || (yt = t);
-    const n = Math.min(0.25, (t - yt) / 1e3);
-    yt = t, R.on && (R.acc += R.rate * n, ce(R.acc), R.idx >= R.rows.length && (R.on = !1)), H && U && (se(V.set ? V.x : s * 0.5, V.set ? V.y : h * 0.34), H = !1), S && (S.style.opacity = C && Q && Math.floor(t / 530) % 2 === 0 ? "1" : "0"), vt = requestAnimationFrame(jt);
+    const e = Math.min(0.25, (t - yt) / 1e3);
+    yt = t, I.on && (I.acc += I.rate * e, xe(I.acc), I.idx >= I.rows.length && (I.on = !1)), et && Q && (ge(H.set ? H.x : d * 0.5, H.set ? H.y : g * 0.45), et = !1);
+    const i = f && W;
+    if (F && (F.style.opacity = i && Math.floor(t / 530) % 2 === 0 ? "1" : "0"), !I.on && !et && !i) {
+      mt = !1;
+      return;
+    }
+    Rt = requestAnimationFrame(Vt);
   }
-  function xt(t) {
-    const n = O.getBoundingClientRect();
-    V.x = (t.clientX - n.left) / (n.width || 1) * s, V.y = (t.clientY - n.top) / (n.height || 1) * h, V.set = !0, H = !0;
+  function Ct(t) {
+    const e = k.getBoundingClientRect();
+    H.x = (t.clientX - e.left) / (e.width || 1) * d, H.y = (t.clientY - e.top) / (e.height || 1) * g, H.set = !0, et = !0, ct();
   }
-  function zt(t) {
-    if (!(!C || t.metaKey || t.ctrlKey || t.altKey)) {
-      if (t.key === "Backspace") {
-        t.preventDefault(), Ft(o.slice(0, -1), !0);
-        return;
-      }
-      if (t.key === "Enter") {
-        t.preventDefault(), Rt.replay();
-        return;
-      }
-      [...t.key].length === 1 && (t.preventDefault(), Ft(o + t.key, !0));
-    }
+  function vt() {
+    H.set = !1, et = !0, ct();
+  }
+  function we() {
+    w && Ht(w.value, !0);
   }
-  function qt() {
-    Q = !0;
+  function Me(t) {
+    t.key === "Enter" && (t.preventDefault(), Bt.replay());
   }
-  function _t() {
-    Q = !1, S && (S.style.opacity = "0");
+  function Ce() {
+    W = !0, ct();
   }
-  function Kt() {
-    C && g.focus();
+  function ve() {
+    W = !1, F && (F.style.opacity = "0");
   }
-  function St(t) {
-    C = t, t ? (g.tabIndex = 0, g.setAttribute("role", "textbox"), g.getAttribute("aria-label") || g.setAttribute("aria-label", "Editable embroidered text — type to change it"), fe(), g.addEventListener("keydown", zt), g.addEventListener("focus", qt), g.addEventListener("blur", _t), g.addEventListener("pointerdown", Kt), Et()) : (g.removeAttribute("tabindex"), g.removeAttribute("role"), g.removeEventListener("keydown", zt), g.removeEventListener("focus", qt), g.removeEventListener("blur", _t), g.removeEventListener("pointerdown", Kt), S && (S.style.opacity = "0"));
+  function Yt(t) {
+    t === f && w || (f = t, t ? (w || (w = document.createElement("input"), w.type = "text", w.value = r, w.maxLength = 64, w.setAttribute("aria-label", "Embroidered text — type to change it"), w.setAttribute("autocomplete", "off"), w.setAttribute("autocapitalize", "off"), w.spellcheck = !1, Object.assign(w.style, { position: "absolute", inset: "0", width: "100%", height: "100%", margin: "0", padding: "0", border: "0", outline: "none", background: "transparent", color: "transparent", caretColor: "transparent", font: "inherit", textAlign: "center", cursor: "text" }), w.addEventListener("input", we), w.addEventListener("keydown", Me), w.addEventListener("focus", Ce), w.addEventListener("blur", ve), k.appendChild(w), Y.push(w)), pe(), kt()) : (w && (w.remove(), w = null), W = !1, F && (F.style.opacity = "0")));
   }
-  function de(t) {
-    if (t !== A)
-      if (A = t, t)
-        window.addEventListener("pointermove", xt, { passive: !0 }), H = !0;
+  function be(t) {
+    if (t !== S)
+      if (S = t, t)
+        k.addEventListener("pointermove", Ct, { passive: !0 }), k.addEventListener("pointerleave", vt, { passive: !0 }), H.set = !1, et = !0, ct();
       else {
-        window.removeEventListener("pointermove", xt);
-        const n = O.getContext("2d");
-        n && n.clearRect(0, 0, s, h);
+        k.removeEventListener("pointermove", Ct), k.removeEventListener("pointerleave", vt);
+        const e = X.getContext("2d");
+        e && e.clearRect(0, 0, d, g);
       }
   }
-  function it(t) {
-    ne(), oe(), Nt(), re(), ie(), t ? le() : (At(), Tt(), R.on = !1), Et(), H = !0;
+  function st(t) {
+    ce(), se(), fe(), de(), ue(), t ? ye() : ($t(), It(), I.on = !1), w && w.value !== r && (w.value = r), kt(), et = !0, ct();
   }
-  function Ft(t, n) {
-    t = t ?? "", !(t === o && Y) && (o = t, Y && (it(!1), n && u && u(o)));
+  function Ht(t, e) {
+    t = t ?? "", !(t === r && Z) && (r = t, Z && (st(!1), e && B && B(r)));
   }
-  let at;
-  function Gt(t, n, l) {
-    const y = `${n} 200px ${t}`;
-    let v = !1;
+  const bt = /* @__PURE__ */ new Set();
+  function Jt(t, e, i) {
+    const u = `${e} 200px ${t}`;
+    let T = !1;
     try {
-      v = !!document.fonts && document.fonts.check(y);
+      T = !!document.fonts && document.fonts.check(u);
     } catch {
-      v = !0;
+      T = !0;
     }
-    if (!document.fonts || v) {
-      l();
+    if (!document.fonts || T) {
+      i();
       return;
     }
-    let b = !1;
-    const T = () => {
-      b || (b = !0, at && clearTimeout(at), l());
+    let C = !1, b;
+    const A = () => {
+      C || (C = !0, clearTimeout(b), bt.delete(b), K || i());
     };
-    document.fonts.load(y, o).then(() => document.fonts.ready).then(T, T), at = setTimeout(T, 1500);
-  }
-  function ue() {
-    z || (it(!0), Y = !0, Dt || (Dt = !0, vt = requestAnimationFrame(jt)));
-  }
-  C && St(!0), A && window.addEventListener("pointermove", xt, { passive: !0 }), Gt($, i, ue);
-  let Lt;
-  function Ut() {
-    clearTimeout(Lt), Lt = setTimeout(() => Rt.resize(), 200);
-  }
-  window.addEventListener("resize", Ut);
-  const Rt = {
+    document.fonts.load(u, r).then(() => document.fonts.ready).then(A, A), b = setTimeout(A, 1500), bt.add(b);
+  }
+  function Te() {
+    K || (st(!0), Z = !0);
+  }
+  f && (f = !1, Yt(!0)), S && (k.addEventListener("pointermove", Ct, { passive: !0 }), k.addEventListener("pointerleave", vt, { passive: !0 })), Jt(q, c, Te);
+  let Pt, Qt = -1;
+  function Zt() {
+    clearTimeout(Pt), Pt = setTimeout(() => {
+      if (K || !Z) return;
+      const t = Math.round(k.getBoundingClientRect().width);
+      t !== Qt && (Qt = t, st(!1));
+    }, 200);
+  }
+  window.addEventListener("resize", Zt);
+  const Bt = {
     get text() {
-      return o;
+      return r;
     },
     setText(t) {
-      if (!z) {
-        if (!Y) {
-          o = t ?? "";
+      if (!K) {
+        if (!Z) {
+          r = t ?? "", w && (w.value = r);
           return;
         }
-        Ft(t, !1);
+        Ht(t, !1);
       }
     },
     replay() {
-      z || !Y || it(!0);
+      K || !Z || st(!0);
     },
     resize() {
-      z || !Y || it(!1);
+      K || !Z || st(!1);
     },
     update(t) {
-      if (z) return;
-      let n = !1, l = !1;
-      t.font !== void 0 && t.font !== r && (r = t.font, $ = ee(r), n = !0), t.weight !== void 0 && t.weight !== i && (i = t.weight, n = !0), t.fill !== void 0 && t.fill !== a && (a = t.fill, n = !0), t.pitch !== void 0 && t.pitch !== c && (c = t.pitch, n = !0), t.threadColor !== void 0 && (tt(t.threadColor), l = !0), t.sewRate !== void 0 && (f = t.sewRate), t.animate !== void 0 && (E = t.animate), t.onTextChange !== void 0 && (u = t.onTextChange), t.sheen !== void 0 && de(t.sheen), t.editable !== void 0 && t.editable !== C && St(t.editable), Y && (n ? Gt($, i, () => {
-        z || it(!1);
-      }) : l && (Nt(), At(), Tt(), Et()), H = !0);
+      if (K) return;
+      t.text !== void 0 && Bt.setText(t.text);
+      let e = !1, i = !1;
+      if (t.font !== void 0 && t.font !== l && (l = t.font, q = le(l), e = !0), t.weight !== void 0) {
+        const u = Et(t.weight, 1, 1e3);
+        u !== c && (c = u, e = !0);
+      }
+      if (t.fill !== void 0) {
+        const u = Et(t.fill, 0.05, 1);
+        u !== s && (s = u, e = !0);
+      }
+      t.pitch !== void 0 && t.pitch !== m && (m = t.pitch, e = !0), t.threadColor !== void 0 && (dt(t.threadColor), i = !0), t.sewRate !== void 0 && (h = Math.max(1, t.sewRate)), t.sewStyle !== void 0 && (L = t.sewStyle === "hand" ? "hand" : "machine"), t.animate !== void 0 && (P = t.animate), t.onTextChange !== void 0 && (B = t.onTextChange), t.sheen !== void 0 && be(t.sheen), t.editable !== void 0 && Yt(t.editable), Z && (e ? Jt(q, c, () => {
+        K || st(!1);
+      }) : i && (Xt(), $t(), It(), kt(), ct()));
     },
     focus() {
-      !z && C && g.focus();
+      !K && f && (w == null || w.focus());
     },
     destroy() {
-      if (!z) {
-        z = !0, cancelAnimationFrame(vt), clearTimeout(Lt), at && clearTimeout(at), window.removeEventListener("resize", Ut), window.removeEventListener("pointermove", xt), C && St(!1);
-        for (const t of G) t.remove();
-        et = [], ht = [], R.rows = [], bt = new Uint8Array(0), Ct = new Float32Array(0), ft = new Float32Array(0), dt = new Float32Array(0), U = rt = null, ut = null, S = null;
+      if (!K) {
+        K = !0, mt = !1, cancelAnimationFrame(Rt), clearTimeout(Pt);
+        for (const t of bt) clearTimeout(t);
+        bt.clear(), window.removeEventListener("resize", Zt), k.removeEventListener("pointermove", Ct), k.removeEventListener("pointerleave", vt);
+        for (const t of Y) t.remove();
+        it = [], lt = [], I.rows = [], Ft = new Uint8Array(0), Lt = new Float32Array(0), pt = new Float32Array(0), wt = new Float32Array(0), Q = at = null, Mt = null, F = null, w = null;
       }
     }
   };
-  return Rt;
+  return Bt;
 }
-function Me(m) {
-  const e = wt(null), o = wt(null), r = wt(m);
-  r.current = m;
-  const i = wt(m.onTextChange);
-  i.current = m.onTextChange;
-  const { text: a, font: f, weight: A, threadColor: E, pitch: C, fill: c, animate: u, sewRate: $, sheen: D, editable: k, reducedMotion: W } = m;
-  return me(() => {
-    const N = e.current;
-    if (!N) return;
-    const tt = pe(N, {
-      ...r.current,
+function $e(x) {
+  const o = Tt(null), r = Tt(null), l = Tt(x);
+  l.current = x;
+  const c = Tt(x.onTextChange);
+  c.current = x.onTextChange;
+  const { text: s, font: h, weight: L, threadColor: S, pitch: P, fill: f, animate: m, sewStyle: B, sewRate: q, sheen: gt, editable: N, reducedMotion: ft } = x;
+  return Se(() => {
+    const U = o.current;
+    if (!U) return;
+    const dt = Ie(U, {
+      ...l.current,
       // Stable callback wrapper so typing edits always reach the latest handler.
-      onTextChange: (O) => {
-        var S;
-        return (S = i.current) == null ? void 0 : S.call(i, O);
+      onTextChange: (w) => {
+        var F;
+        return (F = c.current) == null ? void 0 : F.call(c, w);
       }
     });
-    o.current = tt;
-    let G = 0, P = 0, g;
-    return typeof ResizeObserver < "u" && (g = new ResizeObserver((O) => {
-      const S = Math.round(O[0].contentRect.width);
-      S !== P && (P = S, cancelAnimationFrame(G), G = requestAnimationFrame(() => {
-        var Q;
-        return (Q = o.current) == null ? void 0 : Q.resize();
+    r.current = dt;
+    let Y = 0, O = 0, k = !0, X;
+    return typeof ResizeObserver < "u" && (X = new ResizeObserver((w) => {
+      const F = Math.round(w[0].contentRect.width);
+      if (k) {
+        k = !1, O = F;
+        return;
+      }
+      F !== O && (O = F, cancelAnimationFrame(Y), Y = requestAnimationFrame(() => {
+        var W;
+        return (W = r.current) == null ? void 0 : W.resize();
       }));
-    }), g.observe(N)), () => {
-      g == null || g.disconnect(), cancelAnimationFrame(G), tt.destroy(), o.current = null;
+    }), X.observe(U)), () => {
+      X == null || X.disconnect(), cancelAnimationFrame(Y), dt.destroy(), r.current = null;
     };
-  }, [W]), Qt(() => {
-    var N;
-    (N = o.current) == null || N.update({ font: f, weight: A, threadColor: E, pitch: C, fill: c, animate: u, sewRate: $, sheen: D, editable: k });
-  }, [f, A, E, C, c, u, $, D, k]), Qt(() => {
-    var N;
-    (N = o.current) == null || N.setText(a);
-  }, [a]), e;
+  }, [ft]), ne(() => {
+    var U;
+    (U = r.current) == null || U.update({ font: h, weight: L, threadColor: S, pitch: P, fill: f, animate: m, sewStyle: B, sewRate: q, sheen: gt, editable: N });
+  }, [h, L, S, P, f, m, B, q, gt, N]), ne(() => {
+    var U;
+    (U = r.current) == null || U.setText(s);
+  }, [s]), o;
 }
-const be = ye(
-  function({ className: e, style: o, as: r = "div", "aria-label": i, role: a, "aria-describedby": f, ...A }, E) {
-    const C = Me(A), c = xe(
-      (u) => {
-        C.current = u, typeof E == "function" ? E(u) : E && (E.current = u);
+const ke = Ae(
+  function({ className: o, style: r, as: l = "div", "aria-label": c, role: s, "aria-describedby": h, ...L }, S) {
+    const P = $e(L), f = Fe(
+      (m) => {
+        P.current = m, typeof S == "function" ? S(m) : S && (S.current = m);
       },
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [C, E]
+      [P, S]
     );
-    return /* @__PURE__ */ ge(
-      r,
+    return /* @__PURE__ */ Le(
+      l,
       {
-        ref: c,
-        className: e,
-        style: o,
-        role: a ?? "img",
-        "aria-label": i ?? A.text,
-        "aria-describedby": f
+        ref: f,
+        className: o,
+        style: r,
+        role: L.editable ? s : s ?? "img",
+        "aria-label": L.editable ? c : c ?? L.text,
+        "aria-describedby": h
       }
     );
   }
 );
-be.displayName = "ThreadText";
+ke.displayName = "ThreadText";
 export {
-  Bt as THREAD_TEXT_CLASSES,
-  be as ThreadText,
-  pe as createThreadText,
-  Me as useThreadText
+  zt as THREAD_TEXT_CLASSES,
+  ke as ThreadText,
+  Ie as createThreadText,
+  $e as useThreadText
 };