textmode.export.js 1.2.0 → 1.2.2

package/dist/textmode.export.esm.js

@@ -24,13 +24,13 @@ class Q {
     return `textmode-export-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 19).replace(/:/g, "-")}`;
   }
 }
-function ft(s, t) {
-  return { r: s[t], g: s[t + 1], b: s[t + 2], a: s[t + 3] };
+function ft(n, t) {
+  return { r: n[t], g: n[t + 1], b: n[t + 2], a: n[t + 3] };
 }
-class Wt extends At {
+class qt extends At {
   _extractTransformData(t, e) {
-    const r = t[e + 2], a = !!(1 & r), i = !!(2 & r), n = !!(4 & r), c = t[e + 3] / 255;
-    return { isInverted: a, flipHorizontal: i, flipVertical: n, rotation: Math.round(360 * c * 100) / 100 };
+    const r = t[e + 2], a = !!(1 & r), i = !!(2 & r), s = !!(4 & r), l = t[e + 3] / 255;
+    return { isInverted: a, flipHorizontal: i, flipVertical: s, rotation: Math.round(360 * l * 100) / 100 };
   }
   _calculateCellPosition(t, e, r) {
     return { x: t, y: e, cellX: t * r.cellWidth, cellY: e * r.cellHeight };
@@ -38,50 +38,49 @@ class Wt extends At {
   $extractSVGCellData(t, e) {
     const r = [];
     let a = 0;
-    for (let i = 0; i < e.rows; i++) for (let n = 0; n < e.cols; n++) {
-      const c = 4 * a, l = this.$getCharacterIndex(t.characterPixels, c);
-      let p = ft(t.primaryColorPixels, c), o = ft(t.secondaryColorPixels, c);
-      const d = this._extractTransformData(t.characterPixels, c);
-      if (d.isInverted) {
+    for (let i = 0; i < e.rows; i++) for (let s = 0; s < e.cols; s++) {
+      const l = 4 * a, d = this.$getCharacterIndex(t.characterPixels, l);
+      let p = ft(t.primaryColorPixels, l), o = ft(t.secondaryColorPixels, l);
+      const c = this._extractTransformData(t.characterPixels, l);
+      if (c.isInverted) {
         const m = p;
         p = o, o = m;
       }
-      const u = this._calculateCellPosition(n, i, e);
-      r.push({ charIndex: l, primaryColor: p, secondaryColor: o, transform: d, position: u }), a++;
+      const u = this._calculateCellPosition(s, i, e);
+      r.push({ charIndex: d, primaryColor: p, secondaryColor: o, transform: c, position: u }), a++;
     }
     return r;
   }
 }
-class qt {
+class Ht {
   _createGlyphPath(t, e, r, a, i) {
-    const n = i / t.head.unitsPerEm;
-    return { getBoundingBox: () => ({ x1: r + e.xMin * n, y1: a + -e.yMax * n, x2: r + e.xMax * n, y2: a + -e.yMin * n }), toSVG: () => this._glyphToSVGPath(e, r, a, n) };
+    const s = i / t.head.unitsPerEm;
+    return { getBoundingBox: () => ({ x1: r + e.xMin * s, y1: a + -e.yMax * s, x2: r + e.xMax * s, y2: a + -e.yMin * s }), toSVG: () => this._glyphToSVGPath(e, r, a, s) };
   }
   _glyphToSVGPath(t, e, r, a) {
     if (!t || !t.xs) return "";
-    const { xs: i, ys: n, endPts: c, flags: l } = t;
-    if (!(i && n && c && l)) return "";
+    const { xs: i, ys: s, endPts: l, flags: d } = t;
+    if (!(i && s && l && d)) return "";
     let p = "", o = 0;
-    for (let d = 0; d < c.length; d++) {
-      const u = c[d];
+    for (let c = 0; c < l.length; c++) {
+      const u = l[c];
       if (!(u < o)) {
         if (u >= o) {
-          const m = e + i[o] * a, x = r - n[o] * a;
+          const m = e + i[o] * a, x = r - s[o] * a;
           p += `M${m.toFixed(2)},${x.toFixed(2)}`;
           let h = o + 1;
           for (; h <= u; )
-            if (1 & l[h]) {
-              const f = e + i[h] * a, _ = r - n[h] * a;
-              p += `L${f.toFixed(2)},${_.toFixed(2)}`, h++;
+            if (1 & d[h]) {
+              const g = e + i[h] * a, _ = r - s[h] * a;
+              p += `L${g.toFixed(2)},${_.toFixed(2)}`, h++;
             } else {
-              const f = e + i[h] * a, _ = r - n[h] * a;
-              let v = h + 1 > u ? o : h + 1;
-              if (1 & l[v]) {
-                const g = e + i[v] * a, C = r - n[v] * a;
-                p += `Q${f.toFixed(2)},${_.toFixed(2)} ${g.toFixed(2)},${C.toFixed(2)}`, h = v + 1;
+              const g = e + i[h] * a, _ = r - s[h] * a, v = h + 1 > u ? o : h + 1;
+              if (1 & d[v]) {
+                const f = e + i[v] * a, C = r - s[v] * a;
+                p += `Q${g.toFixed(2)},${_.toFixed(2)} ${f.toFixed(2)},${C.toFixed(2)}`, h = v + 1;
               } else {
-                const g = (f + (e + i[v] * a)) / 2, C = (_ + (r - n[v] * a)) / 2;
-                p += `Q${f.toFixed(2)},${_.toFixed(2)} ${g.toFixed(2)},${C.toFixed(2)}`, h = v;
+                const f = (g + (e + i[v] * a)) / 2, C = (_ + (r - s[v] * a)) / 2;
+                p += `Q${g.toFixed(2)},${_.toFixed(2)} ${f.toFixed(2)},${C.toFixed(2)}`, h = v;
               }
             }
           p += "Z";
@@ -92,19 +91,19 @@ class qt {
     return p;
   }
   _generateCharacterPath(t, e, r, a, i) {
-    const n = e.characterMap.get(t).glyphData;
-    return n ? this._createGlyphPath(e.font, n, r, a, i) : null;
+    const s = e.characterMap.get(t)?.glyphData;
+    return s ? this._createGlyphPath(e.font, s, r, a, i) : null;
   }
-  $generatePositionedCharacterPath(t, e, r, a, i, n, c, l) {
-    if (!l) return null;
-    const p = c / e.font.head.unitsPerEm, o = r + (i - l.advanceWidth * p) / 2, d = a + (n + 0.7 * c) / 2, u = this._generateCharacterPath(t, e, o, d, c);
+  $generatePositionedCharacterPath(t, e, r, a, i, s, l, d) {
+    if (!d) return null;
+    const p = l / e.font.head.unitsPerEm, o = r + (i - d.advanceWidth * p) / 2, c = a + (s + 0.7 * l) / 2, u = this._generateCharacterPath(t, e, o, c, l);
     return u && u.toSVG() || null;
   }
 }
-class Ht {
+class jt {
   _pathGenerator;
   constructor() {
-    this._pathGenerator = new qt();
+    this._pathGenerator = new Ht();
   }
   $generateSVGHeader(t) {
     const { width: e, height: r } = t;
@@ -116,43 +115,43 @@ class Ht {
   _generateTransformAttribute(t, e) {
     const { transform: r, position: a } = t;
     if (!r.flipHorizontal && !r.flipVertical && !r.rotation) return "";
-    const i = a.cellX + e.cellWidth / 2, n = a.cellY + e.cellHeight / 2, c = [];
+    const i = a.cellX + e.cellWidth / 2, s = a.cellY + e.cellHeight / 2, l = [];
     if (r.flipHorizontal || r.flipVertical) {
-      const l = r.flipHorizontal ? -1 : 1, p = r.flipVertical ? -1 : 1;
-      c.push(`translate(${i} ${n})scale(${l} ${p})translate(${-i} ${-n})`);
+      const d = r.flipHorizontal ? -1 : 1, p = r.flipVertical ? -1 : 1;
+      l.push(`translate(${i} ${s})scale(${d} ${p})translate(${-i} ${-s})`);
     }
-    return r.rotation && c.push(`rotate(${r.rotation} ${i} ${n})`), ` transform="${c.join(" ")}"`;
+    return r.rotation && l.push(`rotate(${r.rotation} ${i} ${s})`), ` transform="${l.join(" ")}"`;
   }
   _generateCellBackground(t, e, r) {
     if (!r.includeBackgroundRectangles || t.secondaryColor.a === 0) return "";
-    const { position: a } = t, { r: i, g: n, b: c, a: l } = t.secondaryColor, p = `rgba(${i},${n},${c},${l / 255})`;
+    const { position: a } = t, { r: i, g: s, b: l, a: d } = t.secondaryColor, p = `rgba(${i},${s},${l},${d / 255})`;
     return r.drawMode === "stroke" ? `<rect x="${a.cellX}" y="${a.cellY}" width="${e.cellWidth}" height="${e.cellHeight}" stroke="${p}" fill="none" stroke-width="${r.strokeWidth}"/>` : `<rect x="${a.cellX}" y="${a.cellY}" width="${e.cellWidth}" height="${e.cellHeight}" fill="${p}"/>`;
   }
   _generateCharacterPath(t, e, r, a) {
     const i = r.characters[t.charIndex];
     if (!i) return "";
-    const n = this._pathGenerator.$generatePositionedCharacterPath(i.character, r, t.position.cellX, t.position.cellY, e.cellWidth, e.cellHeight, r.fontSize, i.glyphData);
-    if (!n) return "";
-    const { r: c, g: l, b: p, a: o } = t.primaryColor, d = `rgba(${c},${l},${p},${o / 255})`;
-    return a.drawMode === "stroke" ? `<path d="${n}" stroke="${d}" stroke-width="${a.strokeWidth}" fill="none"/>` : `<path d="${n}" fill="${d}"/>`;
+    const s = this._pathGenerator.$generatePositionedCharacterPath(i.character, r, t.position.cellX, t.position.cellY, e.cellWidth, e.cellHeight, r.fontSize, i.glyphData);
+    if (!s) return "";
+    const { r: l, g: d, b: p, a: o } = t.primaryColor, c = `rgba(${l},${d},${p},${o / 255})`;
+    return a.drawMode === "stroke" ? `<path d="${s}" stroke="${c}" stroke-width="${a.strokeWidth}" fill="none"/>` : `<path d="${s}" fill="${c}"/>`;
   }
   $generateCellContent(t, e, r, a) {
-    const i = [], n = this._generateCellBackground(t, e, a);
-    n && i.push(n);
-    const c = this._generateCharacterPath(t, e, r, a);
-    if (c) {
-      const l = this._generateTransformAttribute(t, e);
-      i.push(l ? `<g${l}>${c}</g>` : c);
+    const i = [], s = this._generateCellBackground(t, e, a);
+    s && i.push(s);
+    const l = this._generateCharacterPath(t, e, r, a);
+    if (l) {
+      const d = this._generateTransformAttribute(t, e);
+      i.push(d ? `<g${d}>${l}</g>` : l);
     }
     return i.join("");
   }
   $generateSVGContent(t, e, r, a) {
     const i = [this.$generateSVGHeader(e), '<g id="ascii-cells">'];
-    for (const n of t) i.push(this.$generateCellContent(n, e, r, a));
+    for (const s of t) i.push(this.$generateCellContent(s, e, r, a));
     return i.push(this.$generateSVGFooter()), i.join("");
   }
   $optimizeSVGContent(t) {
-    return t.replace(/<path[^>]*d=""[^>]*\/>/g, "").replace(/\s+/g, " ").replace(/> </g, "><");
+    return t.replace(/\s+/g, " ").replace(/> </g, "><");
   }
 }
 class gt {
@@ -160,8 +159,8 @@ class gt {
     return { includeBackgroundRectangles: t.includeBackgroundRectangles ?? !0, drawMode: t.drawMode ?? "fill", strokeWidth: t.strokeWidth ?? 1, filename: t.filename };
   }
   $generateSVG(t, e = {}) {
-    const r = new Wt(), a = new Ht(), i = r.$extractSVGCellData(r.$extractFramebufferData(t.layers.base.drawFramebuffer), t.grid), n = a.$generateSVGContent(i, t.grid, t.font, this._applyDefaultOptions(e));
-    return a.$optimizeSVGContent(n);
+    const r = new qt(), a = new jt(), i = r.$extractSVGCellData(r.$extractFramebufferData(t.layers.base.drawFramebuffer), t.grid), s = a.$generateSVGContent(i, t.grid, t.font, this._applyDefaultOptions(e));
+    return a.$optimizeSVGContent(s);
   }
   $saveSVG(t, e = {}) {
     new Q().$downloadFile(new Blob([this.$generateSVG(t, e)], { type: "image/svg+xml;charset=utf-8" }), e.filename);
@@ -176,10 +175,10 @@ class bt {
     if (!(t.format in st)) throw new Error(`Saving '${t.format}' files is not supported`);
   }
   async $generateImageBlob(t, e) {
-    const r = t, a = document.createElement("canvas"), i = a.getContext("2d"), n = Math.round(r.width * e.scale), c = Math.round(r.height * e.scale);
-    return a.width = n, a.height = c, i.imageSmoothingEnabled = !1, i.clearRect(0, 0, n, c), i.drawImage(r, 0, 0, r.width, r.height, 0, 0, n, c), await new Promise((l, p) => {
+    const r = t, a = document.createElement("canvas"), i = a.getContext("2d"), s = Math.round(r.width * e.scale), l = Math.round(r.height * e.scale);
+    return a.width = s, a.height = l, i.imageSmoothingEnabled = !1, i.clearRect(0, 0, s, l), i.drawImage(r, 0, 0, r.width, r.height, 0, 0, s, l), await new Promise((d, p) => {
       a.toBlob((o) => {
-        o ? l(o) : p(new Error(`Failed to generate ${e.format.toUpperCase()} blob`));
+        o ? d(o) : p(new Error(`Failed to generate ${e.format.toUpperCase()} blob`));
       }, st[e.format]);
     });
   }
@@ -202,25 +201,17 @@ class vt {
     return { preserveTrailingSpaces: t.preserveTrailingSpaces ?? !1, emptyCharacter: t.emptyCharacter ?? " ", filename: t.filename };
   }
   _createTXTContent(t, e) {
-    const r = new At();
-    console.log(t);
-    let a = r.$extractFramebufferData(t.layers.base.drawFramebuffer);
-    const i = [];
-    let n = 0;
-    for (let l = 0; l < t.grid.rows; l++) {
-      const p = [];
+    const r = new At(), a = t.layers.base.drawFramebuffer, i = r.$extractFramebufferData(a), s = [];
+    let l = 0;
+    for (let d = 0; d < t.grid.rows; d++) {
+      let p = "";
       for (let o = 0; o < t.grid.cols; o++) {
-        const d = 4 * n, u = r.$getCharacterIndex(a.characterPixels, d), m = t.font.characters[u]?.character || e.emptyCharacter;
-        p.push(m), n++;
+        const c = 4 * l, u = r.$getCharacterIndex(i.characterPixels, c);
+        p += t.font.characters[u]?.character || e.emptyCharacter, l++;
       }
-      i.push(p);
-    }
-    const c = [];
-    for (const l of i) {
-      let p = l.join("");
-      e.preserveTrailingSpaces || (p = p.replace(/\s+$/, "")), c.push(p);
+      e.preserveTrailingSpaces || (p = p.trimEnd()), s.push(p);
     }
-    return c.join(`
+    return s.join(`
 `);
   }
   $generateTXT(t, e = {}) {
@@ -231,133 +222,133 @@ class vt {
     new Q().$downloadFile(i, r.filename);
   }
 }
-class jt {
+class Qt {
   _canvas;
   _ctx;
   async $record(t, e, r, a) {
-    const i = Math.max(1, Math.round(e.frameRate)), n = Math.round(1e3 / i), c = Math.max(1, Math.round(e.frameCount));
-    return await new Promise((l, p) => {
+    const i = Math.max(1, Math.round(e.frameRate)), s = Math.round(1e3 / i), l = Math.max(1, Math.round(e.frameCount));
+    return await new Promise((d, p) => {
       const o = [];
-      let d, u = 0, m = !1;
+      let c, u = 0, m = !1;
       const x = () => {
-        d && (d(), d = void 0);
+        c && (c(), c = void 0);
       }, h = (_) => {
-        m || (m = !0, x(), l(_));
-      }, f = () => {
-        if (u >= c) h(o);
+        m || (m = !0, x(), d(_));
+      }, g = () => {
+        if (u >= l) h(o);
         else try {
-          const _ = e.scale, v = Math.max(1, Math.round(t.width * _)), g = Math.max(1, Math.round(t.height * _));
-          this._canvas || (this._canvas = document.createElement("canvas")), this._canvas.width === v && this._canvas.height === g || (this._canvas.width = v, this._canvas.height = g), this._ctx || (this._ctx = this._canvas.getContext("2d"));
+          const _ = e.scale, v = Math.max(1, Math.round(t.width * _)), f = Math.max(1, Math.round(t.height * _));
+          this._canvas || (this._canvas = document.createElement("canvas")), this._canvas.width === v && this._canvas.height === f || (this._canvas.width = v, this._canvas.height = f), this._ctx || (this._ctx = this._canvas.getContext("2d"));
           const C = this._ctx;
-          C.imageSmoothingEnabled = !1, C.clearRect(0, 0, v, g), C.drawImage(t, 0, 0, t.width, t.height, 0, 0, v, g);
-          const S = { imageData: C.getImageData(0, 0, v, g), width: v, height: g, delayMs: n };
-          o.push(S), u += 1, a?.({ state: "recording", frameIndex: u, totalFrames: c }), u >= c && h(o);
+          C.imageSmoothingEnabled = !1, C.clearRect(0, 0, v, f), C.drawImage(t, 0, 0, t.width, t.height, 0, 0, v, f);
+          const S = { imageData: C.getImageData(0, 0, v, f), width: v, height: f, delayMs: s };
+          o.push(S), u += 1, a?.({ state: "recording", frameIndex: u, totalFrames: l }), u >= l && h(o);
         } catch (_) {
           ((v) => {
             if (m) return;
             m = !0, x();
-            const g = v instanceof Error ? v.message : "GIF recording failed";
-            a?.({ state: "error", message: g }), p(v instanceof Error ? v : new Error(String(v)));
+            const f = v instanceof Error ? v.message : "GIF recording failed";
+            a?.({ state: "error", message: f }), p(v instanceof Error ? v : new Error(String(v)));
           })(_);
         }
       };
-      d = r(() => {
-        f();
-      }), a?.({ state: "recording", frameIndex: 0, totalFrames: c });
+      c = r(() => {
+        g();
+      }), a?.({ state: "recording", frameIndex: 0, totalFrames: l });
     });
   }
 }
-var Pt = Object.defineProperty, Qt = (s) => Pt(s, "__esModule", { value: !0 }), Xt = (s, t) => () => (t || s((t = { exports: {} }).exports, t), t.exports), Yt = (s, t) => {
-  for (var e in t) Pt(s, e, { get: t[e], enumerable: !0 });
-}, Jt = Xt((s) => {
-  function t(d, u, m) {
-    return 0.29889531 * d + 0.58662247 * u + 0.11448223 * m;
+var Pt = Object.defineProperty, Xt = (n) => Pt(n, "__esModule", { value: !0 }), Yt = (n, t) => () => (t || n((t = { exports: {} }).exports, t), t.exports), Jt = (n, t) => {
+  for (var e in t) Pt(n, e, { get: t[e], enumerable: !0 });
+}, Kt = Yt((n) => {
+  function t(c, u, m) {
+    return 0.29889531 * c + 0.58662247 * u + 0.11448223 * m;
   }
-  function e(d, u, m) {
-    return 0.59597799 * d - 0.2741761 * u - 0.32180189 * m;
+  function e(c, u, m) {
+    return 0.59597799 * c - 0.2741761 * u - 0.32180189 * m;
   }
-  function r(d, u, m) {
-    return 0.21147017 * d - 0.52261711 * u + 0.31114694 * m;
+  function r(c, u, m) {
+    return 0.21147017 * c - 0.52261711 * u + 0.31114694 * m;
   }
-  function a(d, u) {
-    let m = d[0] - u[0], x = d[1] - u[1], h = d[2] - u[2], f = i(d) - i(u);
-    return m * m * 0.5053 + x * x * 0.299 + h * h * 0.1957 + f * f;
+  function a(c, u) {
+    let m = c[0] - u[0], x = c[1] - u[1], h = c[2] - u[2], g = i(c) - i(u);
+    return m * m * 0.5053 + x * x * 0.299 + h * h * 0.1957 + g * g;
   }
-  function i(d) {
-    return d[3] != null ? d[3] : 255;
+  function i(c) {
+    return c[3] != null ? c[3] : 255;
   }
-  function n(d, u) {
-    return Math.sqrt(a(d, u));
+  function s(c, u) {
+    return Math.sqrt(a(c, u));
   }
-  function c(d, u) {
-    let [m, x, h] = d, [f, _, v] = u, g = t(m, x, h) - t(f, _, v), C = e(m, x, h) - e(f, _, v), S = r(m, x, h) - r(f, _, v), E = i(d) - i(u);
-    return g * g * 0.5053 + C * C * 0.299 + S * S * 0.1957 + E * E;
+  function l(c, u) {
+    let [m, x, h] = c, [g, _, v] = u, f = t(m, x, h) - t(g, _, v), C = e(m, x, h) - e(g, _, v), S = r(m, x, h) - r(g, _, v), E = i(c) - i(u);
+    return f * f * 0.5053 + C * C * 0.299 + S * S * 0.1957 + E * E;
   }
-  function l(d, u) {
-    return Math.sqrt(c(d, u));
+  function d(c, u) {
+    return Math.sqrt(l(c, u));
   }
-  function p(d, u) {
+  function p(c, u) {
     var m, x = 0;
-    for (m = 0; m < d.length; m++) {
-      let h = d[m] - u[m];
+    for (m = 0; m < c.length; m++) {
+      let h = c[m] - u[m];
       x += h * h;
     }
     return x;
   }
-  function o(d, u) {
-    return Math.sqrt(p(d, u));
+  function o(c, u) {
+    return Math.sqrt(p(c, u));
   }
-  Qt(s), Yt(s, { colorDifferenceRGBToYIQ: () => l, colorDifferenceRGBToYIQSquared: () => c, colorDifferenceYIQ: () => n, colorDifferenceYIQSquared: () => a, euclideanDistance: () => o, euclideanDistanceSquared: () => p });
-}), Kt = { trailer: 59 };
-function Dt(s = 256) {
-  let t = 0, e = new Uint8Array(s);
+  Xt(n), Jt(n, { colorDifferenceRGBToYIQ: () => d, colorDifferenceRGBToYIQSquared: () => l, colorDifferenceYIQ: () => s, colorDifferenceYIQSquared: () => a, euclideanDistance: () => o, euclideanDistanceSquared: () => p });
+}), Zt = { trailer: 59 };
+function Dt(n = 256) {
+  let t = 0, e = new Uint8Array(n);
   return { get buffer() {
     return e.buffer;
   }, reset() {
     t = 0;
   }, bytesView: () => e.subarray(0, t), bytes: () => e.slice(0, t), writeByte(a) {
     r(t + 1), e[t] = a, t++;
-  }, writeBytes(a, i = 0, n = a.length) {
-    r(t + n);
-    for (let c = 0; c < n; c++) e[t++] = a[c + i];
-  }, writeBytesView(a, i = 0, n = a.byteLength) {
-    r(t + n), e.set(a.subarray(i, i + n), t), t += n;
+  }, writeBytes(a, i = 0, s = a.length) {
+    r(t + s);
+    for (let l = 0; l < s; l++) e[t++] = a[l + i];
+  }, writeBytesView(a, i = 0, s = a.byteLength) {
+    r(t + s), e.set(a.subarray(i, i + s), t), t += s;
   } };
   function r(a) {
     var i = e.length;
     if (i >= a) return;
     a = Math.max(a, i * (i < 1048576 ? 2 : 1.125) >>> 0), i != 0 && (a = Math.max(a, 256));
-    let n = e;
-    e = new Uint8Array(a), t > 0 && e.set(n.subarray(0, t), 0);
-  }
-}
-var Z = 12, xt = 5003, Zt = [0, 1, 3, 7, 15, 31, 63, 127, 255, 511, 1023, 2047, 4095, 8191, 16383, 32767, 65535];
-function te(s, t, e, r, a, i, n, c) {
-  a = a || Dt(512), i = i || new Uint8Array(256), n = n || new Int32Array(xt), c = c || new Int32Array(xt);
-  let l = n.length, p = Math.max(2, r);
-  i.fill(0), c.fill(0), L();
-  let o = 0, d = 0, u = p + 1, m = u, x = !1, h = m, f = D(h), _ = 1 << u - 1, v = _ + 1, g = _ + 2, C = 0, S = e[0], E = 0;
-  for (let k = l; k < 65536; k *= 2) ++E;
-  E = 8 - E, a.writeByte(p), O(_);
+    let s = e;
+    e = new Uint8Array(a), t > 0 && e.set(s.subarray(0, t), 0);
+  }
+}
+var Z = 12, xt = 5003, te = [0, 1, 3, 7, 15, 31, 63, 127, 255, 511, 1023, 2047, 4095, 8191, 16383, 32767, 65535];
+function ee(n, t, e, r, a, i, s, l) {
+  a = a || Dt(512), i = i || new Uint8Array(256), s = s || new Int32Array(xt), l = l || new Int32Array(xt);
+  let d = s.length, p = Math.max(2, r);
+  i.fill(0), l.fill(0), L();
+  let o = 0, c = 0, u = p + 1, m = u, x = !1, h = m, g = D(h), _ = 1 << u - 1, v = _ + 1, f = _ + 2, C = 0, S = e[0], E = 0;
+  for (let k = d; k < 65536; k *= 2) ++E;
+  E = 8 - E, a.writeByte(p), T(_);
   for (let k = 1; k < e.length; k++) V(e[k]);
-  return O(S), O(v), a.writeByte(0), a.bytesView();
+  return T(S), T(v), a.writeByte(0), a.bytesView();
   function A(k) {
     i[C++] = k, C >= 254 && B();
   }
   function L() {
-    n.fill(-1);
+    s.fill(-1);
   }
   function V(k) {
     let R = (k << Z) + S, y = k << E ^ S;
-    if (n[y] === R) S = c[y];
+    if (s[y] === R) S = l[y];
     else {
-      if (n[y] >= 0) {
-        let w = y === 0 ? 1 : l - y;
+      if (s[y] >= 0) {
+        let w = y === 0 ? 1 : d - y;
         do
-          if (y -= w, y < 0 && (y += l), n[y] === R) return void (S = c[y]);
-        while (n[y] >= 0);
+          if (y -= w, y < 0 && (y += d), s[y] === R) return void (S = l[y]);
+        while (s[y] >= 0);
       }
-      O(S), S = k, g < 1 << Z ? (c[y] = g++, n[y] = R) : (L(), g = _ + 2, x = !0, O(_));
+      T(S), S = k, f < 1 << Z ? (l[y] = f++, s[y] = R) : (L(), f = _ + 2, x = !0, T(_));
     }
   }
   function B() {
@@ -366,36 +357,36 @@ function te(s, t, e, r, a, i, n, c) {
   function D(k) {
     return (1 << k) - 1;
   }
-  function O(k) {
-    for (o &= Zt[d], d > 0 ? o |= k << d : o = k, d += h; d >= 8; ) A(255 & o), o >>= 8, d -= 8;
-    if ((g > f || x) && (x ? (h = m, f = D(h), x = !1) : (++h, f = h == Z ? 1 << Z : D(h))), k == v) {
-      for (; d > 0; ) A(255 & o), o >>= 8, d -= 8;
+  function T(k) {
+    for (o &= te[c], c > 0 ? o |= k << c : o = k, c += h; c >= 8; ) A(255 & o), o >>= 8, c -= 8;
+    if ((f > g || x) && (x ? (h = m, g = D(h), x = !1) : (++h, g = h == Z ? 1 << Z : D(h))), k == v) {
+      for (; c > 0; ) A(255 & o), o >>= 8, c -= 8;
       B();
     }
   }
 }
-var ee = te;
-function Vt(s, t, e) {
-  return s << 8 & 63488 | t << 2 & 992 | e >> 3 & 31;
+var re = ee;
+function Vt(n, t, e) {
+  return n << 8 & 63488 | t << 2 & 992 | e >> 3 & 31;
 }
-function Tt(s, t, e, r) {
-  return s >> 4 | 240 & t | (240 & e) << 4 | (240 & r) << 8;
+function Ot(n, t, e, r) {
+  return n >> 4 | 240 & t | (240 & e) << 4 | (240 & r) << 8;
 }
-function Ot(s, t, e) {
-  return s >> 4 << 8 | t >> 4 << 4 | e >> 4;
+function Tt(n, t, e) {
+  return n >> 4 << 8 | t >> 4 << 4 | e >> 4;
 }
-function tt(s, t, e) {
-  return s < t ? t : s > e ? e : s;
+function tt(n, t, e) {
+  return n < t ? t : n > e ? e : n;
 }
-function at(s) {
-  return s * s;
+function at(n) {
+  return n * n;
 }
-function yt(s, t, e) {
-  for (var r = 0, a = 1e100, i = s[t], n = i.cnt, c = (i.ac, i.rc), l = i.gc, p = i.bc, o = i.fw; o != 0; o = s[o].fw) {
-    var d = s[o].cnt, u = n * d / (n + d);
+function yt(n, t, e) {
+  for (var r = 0, a = 1e100, i = n[t], s = i.cnt, l = (i.ac, i.rc), d = i.gc, p = i.bc, o = i.fw; o != 0; o = n[o].fw) {
+    var c = n[o].cnt, u = s * c / (s + c);
     if (!(u >= a)) {
       var m = 0;
-      !((m += u * at(s[o].rc - c)) >= a) && !((m += u * at(s[o].gc - l)) >= a) && !((m += u * at(s[o].bc - p)) >= a) && (a = m, r = o);
+      !((m += u * at(n[o].rc - l)) >= a) && !((m += u * at(n[o].gc - d)) >= a) && !((m += u * at(n[o].bc - p)) >= a) && (a = m, r = o);
     }
   }
   i.err = a, i.nn = r;
@@ -403,37 +394,37 @@ function yt(s, t, e) {
 function dt() {
   return { ac: 0, rc: 0, gc: 0, bc: 0, cnt: 0, nn: 0, fw: 0, bk: 0, tm: 0, mtm: 0, err: 0 };
 }
-function re(s, t) {
-  let e = new Array(t === "rgb444" ? 4096 : 65536), r = s.length;
+function ae(n, t) {
+  let e = new Array(t === "rgb444" ? 4096 : 65536), r = n.length;
   if (t === "rgba4444") for (let a = 0; a < r; ++a) {
-    let i = s[a], n = i >> 24 & 255, c = i >> 16 & 255, l = i >> 8 & 255, p = 255 & i, o = Tt(p, l, c, n), d = o in e ? e[o] : e[o] = dt();
-    d.rc += p, d.gc += l, d.bc += c, d.ac += n, d.cnt++;
+    let i = n[a], s = i >> 24 & 255, l = i >> 16 & 255, d = i >> 8 & 255, p = 255 & i, o = Ot(p, d, l, s), c = o in e ? e[o] : e[o] = dt();
+    c.rc += p, c.gc += d, c.bc += l, c.ac += s, c.cnt++;
   }
   else if (t === "rgb444") for (let a = 0; a < r; ++a) {
-    let i = s[a], n = i >> 16 & 255, c = i >> 8 & 255, l = 255 & i, p = Ot(l, c, n), o = p in e ? e[p] : e[p] = dt();
-    o.rc += l, o.gc += c, o.bc += n, o.cnt++;
+    let i = n[a], s = i >> 16 & 255, l = i >> 8 & 255, d = 255 & i, p = Tt(d, l, s), o = p in e ? e[p] : e[p] = dt();
+    o.rc += d, o.gc += l, o.bc += s, o.cnt++;
   }
   else for (let a = 0; a < r; ++a) {
-    let i = s[a], n = i >> 16 & 255, c = i >> 8 & 255, l = 255 & i, p = Vt(l, c, n), o = p in e ? e[p] : e[p] = dt();
-    o.rc += l, o.gc += c, o.bc += n, o.cnt++;
+    let i = n[a], s = i >> 16 & 255, l = i >> 8 & 255, d = 255 & i, p = Vt(d, l, s), o = p in e ? e[p] : e[p] = dt();
+    o.rc += d, o.gc += l, o.bc += s, o.cnt++;
   }
   return e;
 }
-function ae(s, t, e) {
-  let { format: r = "rgb565", clearAlpha: a = !0, clearAlphaColor: i = 0, clearAlphaThreshold: n = 0, oneBitAlpha: c = !1 } = e || {}, l = e.useSqrt !== !1, p = r === "rgba4444", o = re(s, r), d = o.length, u = d - 1, m = new Uint32Array(d + 1);
+function ie(n, t, e) {
+  let { format: r = "rgb565", clearAlpha: a = !0, clearAlphaColor: i = 0, clearAlphaThreshold: s = 0, oneBitAlpha: l = !1 } = e || {}, d = e.useSqrt !== !1, p = r === "rgba4444", o = ae(n, r), c = o.length, u = c - 1, m = new Uint32Array(c + 1);
   for (var x = 0, h = 0; h < o.length; ++h) {
     let k = o[h];
     if (k != null) {
-      var f = 1 / k.cnt;
-      p && (k.ac *= f), k.rc *= f, k.gc *= f, k.bc *= f, o[x++] = k;
+      var g = 1 / k.cnt;
+      p && (k.ac *= g), k.rc *= g, k.gc *= g, k.bc *= g, o[x++] = k;
     }
   }
-  for (at(t) / x < 0.022 && (l = !1), h = 0; h < x - 1; ++h) o[h].fw = h + 1, o[h + 1].bk = h, l && (o[h].cnt = Math.sqrt(o[h].cnt));
-  var _, v, g;
-  for (l && (o[h].cnt = Math.sqrt(o[h].cnt)), h = 0; h < x; ++h) {
+  for (at(t) / x < 0.022 && (d = !1), h = 0; h < x - 1; ++h) o[h].fw = h + 1, o[h + 1].bk = h, d && (o[h].cnt = Math.sqrt(o[h].cnt));
+  var _, v, f;
+  for (d && (o[h].cnt = Math.sqrt(o[h].cnt)), h = 0; h < x; ++h) {
     yt(o, h);
     var C = o[h].err;
-    for (v = ++m[0]; v > 1 && !(o[_ = m[g = v >> 1]].err <= C); v = g) m[v] = _;
+    for (v = ++m[0]; v > 1 && !(o[_ = m[f = v >> 1]].err <= C); v = f) m[v] = _;
     m[v] = h;
   }
   var S = x - t;
@@ -441,138 +432,139 @@ function ae(s, t, e) {
     for (var E; ; ) {
       var A = m[1];
       if ((E = o[A]).tm >= E.mtm && o[E.nn].mtm <= E.tm) break;
-      for (E.mtm == u ? A = m[1] = m[m[0]--] : (yt(o, A), E.tm = h), C = o[A].err, v = 1; (g = v + v) <= m[0] && (g < m[0] && o[m[g]].err > o[m[g + 1]].err && g++, !(C <= o[_ = m[g]].err)); v = g) m[v] = _;
+      for (E.mtm == u ? A = m[1] = m[m[0]--] : (yt(o, A), E.tm = h), C = o[A].err, v = 1; (f = v + v) <= m[0] && (f < m[0] && o[m[f]].err > o[m[f + 1]].err && f++, !(C <= o[_ = m[f]].err)); v = f) m[v] = _;
       m[v] = A;
     }
     var L = o[E.nn], V = E.cnt, B = L.cnt;
-    f = 1 / (V + B), p && (E.ac = f * (V * E.ac + B * L.ac)), E.rc = f * (V * E.rc + B * L.rc), E.gc = f * (V * E.gc + B * L.gc), E.bc = f * (V * E.bc + B * L.bc), E.cnt += L.cnt, E.mtm = ++h, o[L.bk].fw = L.fw, o[L.fw].bk = L.bk, L.mtm = u;
+    g = 1 / (V + B), p && (E.ac = g * (V * E.ac + B * L.ac)), E.rc = g * (V * E.rc + B * L.rc), E.gc = g * (V * E.gc + B * L.gc), E.bc = g * (V * E.bc + B * L.bc), E.cnt += L.cnt, E.mtm = ++h, o[L.bk].fw = L.fw, o[L.fw].bk = L.bk, L.mtm = u;
   }
   let D = [];
-  var O = 0;
-  for (h = 0; ; ++O) {
+  var T = 0;
+  for (h = 0; ; ++T) {
     let k = tt(Math.round(o[h].rc), 0, 255), R = tt(Math.round(o[h].gc), 0, 255), y = tt(Math.round(o[h].bc), 0, 255), w = 255;
-    p && (w = tt(Math.round(o[h].ac), 0, 255), c && (w = w <= (typeof c == "number" ? c : 127) ? 0 : 255), a && w <= n && (k = R = y = i, w = 0));
+    p && (w = tt(Math.round(o[h].ac), 0, 255), l && (w = w <= (typeof l == "number" ? l : 127) ? 0 : 255), a && w <= s && (k = R = y = i, w = 0));
     let F = p ? [k, R, y, w] : [k, R, y];
-    if (ie(D, F) || D.push(F), (h = o[h].fw) == 0) break;
+    if (oe(D, F) || D.push(F), (h = o[h].fw) == 0) break;
   }
   return D;
 }
-function ie(s, t) {
-  for (let e = 0; e < s.length; e++) {
-    let r = s[e], a = r[0] === t[0] && r[1] === t[1] && r[2] === t[2], i = !(r.length >= 4 && t.length >= 4) || r[3] === t[3];
+function oe(n, t) {
+  for (let e = 0; e < n.length; e++) {
+    let r = n[e], a = r[0] === t[0] && r[1] === t[1] && r[2] === t[2], i = !(r.length >= 4 && t.length >= 4) || r[3] === t[3];
     if (a && i) return !0;
   }
   return !1;
 }
-function oe(s, t, e) {
-  let r = (e = e || "rgb565") === "rgb444" ? 4096 : 65536, a = new Uint8Array(s.length), i = new Array(r);
-  if (e === "rgba4444") for (let n = 0; n < s.length; n++) {
-    let c, l = s[n], p = l >> 24 & 255, o = l >> 16 & 255, d = l >> 8 & 255, u = 255 & l, m = Tt(u, d, o, p);
-    i[m] != null ? c = i[m] : (c = ne(u, d, o, p, t), i[m] = c), a[n] = c;
+function ne(n, t, e) {
+  let r = (e = e || "rgb565") === "rgb444" ? 4096 : 65536, a = new Uint8Array(n.length), i = new Array(r);
+  if (e === "rgba4444") for (let s = 0; s < n.length; s++) {
+    let l, d = n[s], p = d >> 24 & 255, o = d >> 16 & 255, c = d >> 8 & 255, u = 255 & d, m = Ot(u, c, o, p);
+    i[m] != null ? l = i[m] : (l = se(u, c, o, p, t), i[m] = l), a[s] = l;
   }
-  else for (let n = 0; n < s.length; n++) {
-    let c, l = s[n], p = l >> 16 & 255, o = l >> 8 & 255, d = 255 & l, u = e === "rgb444" ? Ot(d, o, p) : Vt(d, o, p);
-    i[u] != null ? c = i[u] : (c = se(d, o, p, t), i[u] = c), a[n] = c;
+  else for (let s = 0; s < n.length; s++) {
+    let l, d = n[s], p = d >> 16 & 255, o = d >> 8 & 255, c = 255 & d, u = e === "rgb444" ? Tt(c, o, p) : Vt(c, o, p);
+    i[u] != null ? l = i[u] : (l = le(c, o, p, t), i[u] = l), a[s] = l;
   }
   return a;
 }
-function ne(s, t, e, r, a) {
-  let i = 0, n = 1e100;
-  for (let c = 0; c < a.length; c++) {
-    let l = a[c], p = l[0], o = l[1], d = l[2], u = W(l[3] - r);
-    u > n || (u += W(p - s), !(u > n) && (u += W(o - t), !(u > n) && (u += W(d - e), !(u > n) && (n = u, i = c))));
+function se(n, t, e, r, a) {
+  let i = 0, s = 1e100;
+  for (let l = 0; l < a.length; l++) {
+    let d = a[l], p = d[0], o = d[1], c = d[2], u = W(d[3] - r);
+    u > s || (u += W(p - n), !(u > s) && (u += W(o - t), !(u > s) && (u += W(c - e), !(u > s) && (s = u, i = l))));
   }
   return i;
 }
-function se(s, t, e, r) {
+function le(n, t, e, r) {
   let a = 0, i = 1e100;
-  for (let n = 0; n < r.length; n++) {
-    let c = r[n], l = c[0], p = c[1], o = c[2], d = W(l - s);
-    d > i || (d += W(p - t), !(d > i) && (d += W(o - e), !(d > i) && (i = d, a = n)));
+  for (let s = 0; s < r.length; s++) {
+    let l = r[s], d = l[0], p = l[1], o = l[2], c = W(d - n);
+    c > i || (c += W(p - t), !(c > i) && (c += W(o - e), !(c > i) && (i = c, a = s)));
   }
   return a;
 }
-function W(s) {
-  return s * s;
+function W(n) {
+  return n * n;
 }
-function le(s = {}) {
-  let { initialCapacity: t = 4096, auto: e = !0 } = s, r = Dt(t), a = new Uint8Array(256), i = new Int32Array(5003), n = new Int32Array(5003), c = !1;
+function de(n = {}) {
+  let { initialCapacity: t = 4096, auto: e = !0 } = n, r = Dt(t), a = new Uint8Array(256), i = new Int32Array(5003), s = new Int32Array(5003), l = !1;
   return { reset() {
-    r.reset(), c = !1;
+    r.reset(), l = !1;
   }, finish() {
-    r.writeByte(Kt.trailer);
+    r.writeByte(Zt.trailer);
   }, bytes: () => r.bytes(), bytesView: () => r.bytesView(), get buffer() {
     return r.buffer;
   }, get stream() {
     return r;
-  }, writeHeader: l, writeFrame(p, o, d, u = {}) {
-    let { transparent: m = !1, transparentIndex: x = 0, delay: h = 0, palette: f = null, repeat: _ = 0, colorDepth: v = 8, dispose: g = -1 } = u, C = !1;
-    if (e ? c || (C = !0, l(), c = !0) : C = !!u.first, o = Math.max(0, Math.floor(o)), d = Math.max(0, Math.floor(d)), C) {
-      if (!f) throw new Error("First frame must include a { palette } option");
-      ce(r, o, d, f, v), _t(r, f), _ >= 0 && ue(r, _);
+  }, writeHeader: d, writeFrame(p, o, c, u = {}) {
+    let { transparent: m = !1, transparentIndex: x = 0, delay: h = 0, palette: g = null, repeat: _ = 0, colorDepth: v = 8, dispose: f = -1 } = u, C = !1;
+    if (e ? l || (C = !0, d(), l = !0) : C = !!u.first, o = Math.max(0, Math.floor(o)), c = Math.max(0, Math.floor(c)), C) {
+      if (!g) throw new Error("First frame must include a { palette } option");
+      ue(r, o, c, g, v), _t(r, g), _ >= 0 && pe(r, _);
     }
     let S = Math.round(h / 10);
-    de(r, g, S, m, x);
-    let E = !!f && !C;
-    pe(r, o, d, E ? f : null), E && _t(r, f), he(r, p, o, d, v, a, i, n);
+    ce(r, f, S, m, x);
+    let E = !!g && !C;
+    he(r, o, c, E ? g : null), E && _t(r, g), me(r, p, o, c, v, a, i, s);
   } };
-  function l() {
+  function d() {
     Rt(r, "GIF89a");
   }
 }
-function de(s, t, e, r, a) {
-  var i, n;
-  s.writeByte(33), s.writeByte(249), s.writeByte(4), a < 0 && (a = 0, r = !1), r ? (i = 1, n = 2) : (i = 0, n = 0), t >= 0 && (n = 7 & t), n <<= 2, s.writeByte(0 | n | i), N(s, e), s.writeByte(a || 0), s.writeByte(0);
+function ce(n, t, e, r, a) {
+  var i, s;
+  n.writeByte(33), n.writeByte(249), n.writeByte(4), a < 0 && (a = 0, r = !1), r ? (i = 1, s = 2) : (i = 0, s = 0), t >= 0 && (s = 7 & t), s <<= 2, n.writeByte(0 | s | i), N(n, e), n.writeByte(a || 0), n.writeByte(0);
 }
-function ce(s, t, e, r, a = 8) {
+function ue(n, t, e, r, a = 8) {
   let i = 128 | a - 1 << 4 | ht(r.length) - 1;
-  N(s, t), N(s, e), s.writeBytes([i, 0, 0]);
+  N(n, t), N(n, e), n.writeBytes([i, 0, 0]);
 }
-function ue(s, t) {
-  s.writeByte(33), s.writeByte(255), s.writeByte(11), Rt(s, "NETSCAPE2.0"), s.writeByte(3), s.writeByte(1), N(s, t), s.writeByte(0);
+function pe(n, t) {
+  n.writeByte(33), n.writeByte(255), n.writeByte(11), Rt(n, "NETSCAPE2.0"), n.writeByte(3), n.writeByte(1), N(n, t), n.writeByte(0);
 }
-function _t(s, t) {
+function _t(n, t) {
   let e = 1 << ht(t.length);
   for (let r = 0; r < e; r++) {
     let a = [0, 0, 0];
-    r < t.length && (a = t[r]), s.writeByte(a[0]), s.writeByte(a[1]), s.writeByte(a[2]);
+    r < t.length && (a = t[r]), n.writeByte(a[0]), n.writeByte(a[1]), n.writeByte(a[2]);
   }
 }
-function pe(s, t, e, r) {
-  if (s.writeByte(44), N(s, 0), N(s, 0), N(s, t), N(s, e), r) {
-    let a = 0, i = 0, n = ht(r.length) - 1;
-    s.writeByte(128 | a | i | n);
-  } else s.writeByte(0);
+function he(n, t, e, r) {
+  if (n.writeByte(44), N(n, 0), N(n, 0), N(n, t), N(n, e), r) {
+    let a = 0, i = 0, s = ht(r.length) - 1;
+    n.writeByte(128 | a | i | s);
+  } else n.writeByte(0);
 }
-function he(s, t, e, r, a = 8, i, n, c) {
-  ee(e, r, t, a, s, i, n, c);
+function me(n, t, e, r, a = 8, i, s, l) {
+  re(e, r, t, a, n, i, s, l);
 }
-function N(s, t) {
-  s.writeByte(255 & t), s.writeByte(t >> 8 & 255);
+function N(n, t) {
+  n.writeByte(255 & t), n.writeByte(t >> 8 & 255);
 }
-function Rt(s, t) {
-  for (var e = 0; e < t.length; e++) s.writeByte(t.charCodeAt(e));
+function Rt(n, t) {
+  for (var e = 0; e < t.length; e++) n.writeByte(t.charCodeAt(e));
 }
-function ht(s) {
-  return Math.max(Math.ceil(Math.log2(s)), 1);
+function ht(n) {
+  return Math.max(Math.ceil(Math.log2(n)), 1);
 }
-Jt();
-class me {
+Kt();
+class fe {
   _recorder;
   _textmodifier;
   _registerPostDrawHook;
   constructor(t, e) {
-    this._recorder = new jt(), this._textmodifier = t, this._registerPostDrawHook = e;
+    this._recorder = new Qt(), this._textmodifier = t, this._registerPostDrawHook = e;
   }
   async $saveGIF(t = {}) {
     const e = this._textmodifier.canvas, r = this._applyDefaultOptions(t), a = t.onProgress;
     try {
-      const i = await this._recorder.$record(e, r, this._registerPostDrawHook, a), n = le(), { repeat: c } = t;
-      i.forEach((o, d) => {
-        const { width: u, height: m, imageData: x, delayMs: h } = o, f = new Uint32Array(x.data.buffer.slice(0)), _ = ae(f, 256, {}), v = oe(f, _);
-        n.writeFrame(v, u, m, { palette: _, delay: h, repeat: d === 0 ? c : -1 });
-      }), n.finish();
-      const l = n.bytes(), p = l.buffer.slice(l.byteOffset, l.byteOffset + l.byteLength);
+      const i = await this._recorder.$record(e, r, this._registerPostDrawHook, a), s = de(), { repeat: l } = t;
+      for (let o = 0; o < i.length; o++) {
+        const c = i[o], { width: u, height: m, imageData: x, delayMs: h } = c, g = new Uint32Array(x.data.buffer), _ = ie(g, 256, {}), v = ne(g, _);
+        s.writeFrame(v, u, m, { palette: _, delay: h, repeat: o === 0 ? l : -1 }), o % 2 != 0 && o !== i.length - 1 || (a?.({ state: "encoding", frameIndex: o + 1, totalFrames: i.length }), await new Promise((f) => setTimeout(f, 0)));
+      }
+      s.finish();
+      const d = s.bytes(), p = d.buffer.slice(d.byteOffset, d.byteOffset + d.byteLength);
       new Q().$downloadFile(new Blob([p], { type: "image/gif" }), r.filename), a?.({ state: "completed", totalFrames: r.frameCount });
     } catch (i) {
       throw a?.({ state: "error", message: i instanceof Error ? i.message : "GIF export failed" }), i;
@@ -583,69 +575,69 @@ class me {
     return { filename: t.filename, frameCount: e, frameRate: r, scale: a, repeat: i };
   }
 }
-function fe(s) {
-  return s && s.__esModule && Object.prototype.hasOwnProperty.call(s, "default") ? s.default : s;
+function ge(n) {
+  return n && n.__esModule && Object.prototype.hasOwnProperty.call(n, "default") ? n.default : n;
 }
 var wt, Ct = { exports: {} };
-function ge() {
-  return wt || (wt = 1, s = Ct, (function() {
-    function t(l, p) {
+function be() {
+  return wt || (wt = 1, n = Ct, (function() {
+    function t(d, p) {
       return (function(o) {
         if (typeof o != "string" || !o.match(/^data:image\/webp;base64,/i)) throw new Error("Failed to decode WebP Base64 URL");
         return window.atob(o.substring(23));
-      })(typeof l == "string" && /^data:image\/webp/.test(l) ? l : l.toDataURL("image/webp", p));
+      })(typeof d == "string" && /^data:image\/webp/.test(d) ? d : d.toDataURL("image/webp", p));
     }
-    function e(l) {
-      return (l.charCodeAt(0) | l.charCodeAt(1) << 8 | l.charCodeAt(2) << 16 | l.charCodeAt(3) << 24) >>> 0;
+    function e(d) {
+      return (d.charCodeAt(0) | d.charCodeAt(1) << 8 | d.charCodeAt(2) << 16 | d.charCodeAt(3) << 24) >>> 0;
     }
-    function r(l) {
-      let p = l.indexOf("VP8", 12);
+    function r(d) {
+      let p = d.indexOf("VP8", 12);
       if (p === -1) throw new Error("Bad image format, does this browser support WebP?");
       let o = !1;
-      for (; p < l.length - 8; ) {
-        let d, u;
-        switch (u = l.substring(p, p + 4), p += 4, d = e(l.substring(p, p + 4)), p += 4, u) {
+      for (; p < d.length - 8; ) {
+        let c, u;
+        switch (u = d.substring(p, p + 4), p += 4, c = e(d.substring(p, p + 4)), p += 4, u) {
           case "VP8 ":
-            return { frame: l.substring(p, p + d), hasAlpha: o };
+            return { frame: d.substring(p, p + c), hasAlpha: o };
           case "ALPH":
             o = !0;
         }
-        p += d, 1 & d && p++;
+        p += c, 1 & c && p++;
       }
       throw new Error("Failed to find VP8 keyframe in WebP image, is this image mistakenly encoded in the Lossless WebP format?");
     }
-    function a(l) {
-      this.value = l;
+    function a(d) {
+      this.value = d;
     }
-    function i(l) {
-      this.value = l;
+    function i(d) {
+      this.value = d;
     }
-    function n(l, p, o) {
-      if (Array.isArray(o)) for (let d = 0; d < o.length; d++) n(l, p, o[d]);
-      else if (typeof o == "string") l.writeString(o);
-      else if (o instanceof Uint8Array) l.writeBytes(o);
+    function s(d, p, o) {
+      if (Array.isArray(o)) for (let c = 0; c < o.length; c++) s(d, p, o[c]);
+      else if (typeof o == "string") d.writeString(o);
+      else if (o instanceof Uint8Array) d.writeBytes(o);
       else {
         if (!o.id) throw new Error("Bad EBML datatype " + typeof o.data);
-        if (o.offset = l.pos + p, l.writeUnsignedIntBE(o.id), Array.isArray(o.data)) {
-          let d, u, m;
-          o.size === -1 ? l.writeByte(255) : o.size === -2 ? (d = l.pos, l.writeBytes([15, 255, 255, 255, 255])) : (d = l.pos, l.writeBytes([0, 0, 0, 0])), u = l.pos, o.dataOffset = u + p, n(l, p, o.data), o.size !== -1 && o.size !== -2 && (m = l.pos, o.size = m - u, l.seek(d), l.writeEBMLVarIntWidth(o.size, 4), l.seek(m));
-        } else if (typeof o.data == "string") l.writeEBMLVarInt(o.data.length), o.dataOffset = l.pos + p, l.writeString(o.data);
-        else if (typeof o.data == "number") o.size || (o.size = l.measureUnsignedInt(o.data)), l.writeEBMLVarInt(o.size), o.dataOffset = l.pos + p, l.writeUnsignedIntBE(o.data, o.size);
-        else if (o.data instanceof i) l.writeEBMLVarInt(8), o.dataOffset = l.pos + p, l.writeDoubleBE(o.data.value);
-        else if (o.data instanceof a) l.writeEBMLVarInt(4), o.dataOffset = l.pos + p, l.writeFloatBE(o.data.value);
+        if (o.offset = d.pos + p, d.writeUnsignedIntBE(o.id), Array.isArray(o.data)) {
+          let c, u, m;
+          o.size === -1 ? d.writeByte(255) : o.size === -2 ? (c = d.pos, d.writeBytes([15, 255, 255, 255, 255])) : (c = d.pos, d.writeBytes([0, 0, 0, 0])), u = d.pos, o.dataOffset = u + p, s(d, p, o.data), o.size !== -1 && o.size !== -2 && (m = d.pos, o.size = m - u, d.seek(c), d.writeEBMLVarIntWidth(o.size, 4), d.seek(m));
+        } else if (typeof o.data == "string") d.writeEBMLVarInt(o.data.length), o.dataOffset = d.pos + p, d.writeString(o.data);
+        else if (typeof o.data == "number") o.size || (o.size = d.measureUnsignedInt(o.data)), d.writeEBMLVarInt(o.size), o.dataOffset = d.pos + p, d.writeUnsignedIntBE(o.data, o.size);
+        else if (o.data instanceof i) d.writeEBMLVarInt(8), o.dataOffset = d.pos + p, d.writeDoubleBE(o.data.value);
+        else if (o.data instanceof a) d.writeEBMLVarInt(4), o.dataOffset = d.pos + p, d.writeFloatBE(o.data.value);
         else {
           if (!(o.data instanceof Uint8Array)) throw new Error("Bad EBML datatype " + typeof o.data);
-          l.writeEBMLVarInt(o.data.byteLength), o.dataOffset = l.pos + p, l.writeBytes(o.data);
+          d.writeEBMLVarInt(o.data.byteLength), o.dataOffset = d.pos + p, d.writeBytes(o.data);
         }
       }
     }
-    let c = function(l, p) {
+    let l = function(d, p) {
       return function(o) {
-        let d, u, m = !1, x = 0, h = 0, f = null, _ = null, v = null, g = [], C = 0, S = 0, E = { quality: 0.95, transparent: !1, alphaQuality: void 0, fileWriter: null, fd: null, frameDuration: null, frameRate: null }, A = { Cues: { id: new Uint8Array([28, 83, 187, 107]), positionEBML: null }, SegmentInfo: { id: new Uint8Array([21, 73, 169, 102]), positionEBML: null }, Tracks: { id: new Uint8Array([22, 84, 174, 107]), positionEBML: null } }, L = { id: 17545, data: new i(0) }, V = [], B = new p(o.fileWriter || o.fd);
+        let c, u, m = !1, x = 0, h = 0, g = null, _ = null, v = null, f = [], C = 0, S = 0, E = { quality: 0.95, transparent: !1, alphaQuality: void 0, fileWriter: null, fd: null, frameDuration: null, frameRate: null }, A = { Cues: { id: new Uint8Array([28, 83, 187, 107]), positionEBML: null }, SegmentInfo: { id: new Uint8Array([21, 73, 169, 102]), positionEBML: null }, Tracks: { id: new Uint8Array([22, 84, 174, 107]), positionEBML: null } }, L = { id: 17545, data: new i(0) }, V = [], B = new p(o.fileWriter || o.fd);
         function D(y) {
-          return y - d.dataOffset;
+          return y - c.dataOffset;
         }
-        function O() {
+        function T() {
           u = (function() {
             let M = { id: 21420, size: 5, data: 0 }, U = { id: 290298740, data: [] };
             for (let I in A) {
@@ -657,59 +649,59 @@ function ge() {
           let y = { id: 357149030, data: [{ id: 2807729, data: 1e6 }, { id: 19840, data: "webm-writer-js" }, { id: 22337, data: "webm-writer-js" }, L] }, w = [{ id: 176, data: x }, { id: 186, data: h }];
           o.transparent && w.push({ id: 21440, data: 1 });
           let F = { id: 374648427, data: [{ id: 174, data: [{ id: 215, data: 1 }, { id: 29637, data: 1 }, { id: 156, data: 0 }, { id: 2274716, data: "und" }, { id: 134, data: "V_VP8" }, { id: 2459272, data: "VP8" }, { id: 131, data: 1 }, { id: 224, data: w }] }] };
-          d = { id: 408125543, size: -2, data: [u, y, F] };
-          let $ = new l(256);
-          n($, B.pos, [{ id: 440786851, data: [{ id: 17030, data: 1 }, { id: 17143, data: 1 }, { id: 17138, data: 4 }, { id: 17139, data: 8 }, { id: 17026, data: "webm" }, { id: 17031, data: 2 }, { id: 17029, data: 2 }] }, d]), B.write($.getAsDataArray()), A.SegmentInfo.positionEBML.data = D(y.offset), A.Tracks.positionEBML.data = D(F.offset), m = !0;
+          c = { id: 408125543, size: -2, data: [u, y, F] };
+          let $ = new d(256);
+          s($, B.pos, [{ id: 440786851, data: [{ id: 17030, data: 1 }, { id: 17143, data: 1 }, { id: 17138, data: 4 }, { id: 17139, data: 8 }, { id: 17026, data: "webm" }, { id: 17031, data: 2 }, { id: 17029, data: 2 }] }, c]), B.write($.getAsDataArray()), A.SegmentInfo.positionEBML.data = D(y.offset), A.Tracks.positionEBML.data = D(F.offset), m = !0;
         }
         function k(y) {
           return y.alpha ? (function(w) {
-            let F, $, M = new l(4);
+            let F, $, M = new d(4);
             if (!(w.trackNumber > 0 && w.trackNumber < 127)) throw new Error("TrackNumber must be > 0 and < 127");
             return M.writeEBMLVarInt(w.trackNumber), M.writeU16BE(w.timecode), M.writeByte(0), F = { id: 161, data: [M.getAsDataArray(), w.frame] }, $ = { id: 30113, data: [{ id: 166, data: [{ id: 238, data: 1 }, { id: 165, data: w.alpha }] }] }, { id: 160, data: [F, $] };
           })(y) : (function(w) {
-            let F = new l(4);
+            let F = new d(4);
             if (!(w.trackNumber > 0 && w.trackNumber < 127)) throw new Error("TrackNumber must be > 0 and < 127");
             return F.writeEBMLVarInt(w.trackNumber), F.writeU16BE(w.timecode), F.writeByte(128), { id: 163, data: [F.getAsDataArray(), w.frame] };
           })(y);
         }
         function R() {
-          if (g.length === 0) return;
+          if (f.length === 0) return;
           let y = 0;
-          for (let I = 0; I < g.length; I++) y += g[I].frame.length + (g[I].alpha ? g[I].alpha.length : 0);
-          let w = new l(y + 64 * g.length), F = (function(I) {
+          for (let I = 0; I < f.length; I++) y += f[I].frame.length + (f[I].alpha ? f[I].alpha.length : 0);
+          let w = new d(y + 64 * f.length), F = (function(I) {
             return { id: 524531317, data: [{ id: 231, data: Math.round(I.timecode) }] };
           })({ timecode: Math.round(C) });
-          for (let I = 0; I < g.length; I++) F.data.push(k(g[I]));
+          for (let I = 0; I < f.length; I++) F.data.push(k(f[I]));
           var $, M, U;
-          n(w, B.pos, F), B.write(w.getAsDataArray()), $ = 1, M = Math.round(C), U = F.offset, V.push({ id: 187, data: [{ id: 179, data: M }, { id: 183, data: [{ id: 247, data: $ }, { id: 241, data: D(U) }] }] }), g = [], C += S, S = 0;
+          s(w, B.pos, F), B.write(w.getAsDataArray()), $ = 1, M = Math.round(C), U = F.offset, V.push({ id: 187, data: [{ id: 179, data: M }, { id: 183, data: [{ id: 247, data: $ }, { id: 241, data: D(U) }] }] }), f = [], C += S, S = 0;
         }
         this.addFrame = function(y, w, F) {
-          m || (x = y.width || 0, h = y.height || 0, O());
+          m || (x = y.width || 0, h = y.height || 0, T());
           let $, M = r(t(y, o.quality)), U = null;
           $ = F || (typeof w == "number" ? w : o.frameDuration), o.transparent && (w instanceof HTMLCanvasElement || typeof w == "string" ? U = w : M.hasAlpha && (U = (function(I) {
-            f !== null && f.width === I.width && f.height === I.height || (f = document.createElement("canvas"), f.width = I.width, f.height = I.height, _ = f.getContext("2d"), v = _.createImageData(f.width, f.height));
-            let q = I.getContext("2d").getImageData(0, 0, I.width, I.height).data, J = v.data, K = 0, zt = I.width * I.height * 4;
-            for (let ot = 3; ot < zt; ot += 4) {
+            g !== null && g.width === I.width && g.height === I.height || (g = document.createElement("canvas"), g.width = I.width, g.height = I.height, _ = g.getContext("2d"), v = _.createImageData(g.width, g.height));
+            let q = I.getContext("2d").getImageData(0, 0, I.width, I.height).data, J = v.data, K = 0, Wt = I.width * I.height * 4;
+            for (let ot = 3; ot < Wt; ot += 4) {
               let nt = q[ot];
               J[K++] = nt, J[K++] = nt, J[K++] = nt, J[K++] = 255;
             }
-            return _.putImageData(v, 0, 0), f;
+            return _.putImageData(v, 0, 0), g;
           })(y))), (function(I) {
-            I.trackNumber = 1, I.timecode = Math.round(S), g.push(I), S += I.duration, S >= 5e3 && R();
+            I.trackNumber = 1, I.timecode = Math.round(S), f.push(I), S += I.duration, S >= 5e3 && R();
           })({ frame: M.frame, duration: $, alpha: U ? r(t(U, o.alphaQuality)).frame : null });
         }, this.complete = function() {
-          return m || O(), R(), (function() {
-            let y = { id: 475249515, data: V }, w = new l(16 + 32 * V.length);
-            n(w, B.pos, y), B.write(w.getAsDataArray()), A.Cues.positionEBML.data = D(y.offset);
+          return m || T(), R(), (function() {
+            let y = { id: 475249515, data: V }, w = new d(16 + 32 * V.length);
+            s(w, B.pos, y), B.write(w.getAsDataArray()), A.Cues.positionEBML.data = D(y.offset);
           })(), (function() {
-            let y = new l(u.size), w = B.pos;
-            n(y, u.dataOffset, u.data), B.seek(u.dataOffset), B.write(y.getAsDataArray()), B.seek(w);
+            let y = new d(u.size), w = B.pos;
+            s(y, u.dataOffset, u.data), B.seek(u.dataOffset), B.write(y.getAsDataArray()), B.seek(w);
           })(), (function() {
-            let y = new l(8), w = B.pos;
+            let y = new d(8), w = B.pos;
             y.writeDoubleBE(C), B.seek(L.dataOffset), B.write(y.getAsDataArray()), B.seek(w);
           })(), (function() {
-            let y = new l(10), w = B.pos;
-            y.writeUnsignedIntBE(d.id), y.writeEBMLVarIntWidth(B.pos - d.dataOffset, 5), B.seek(d.offset), B.write(y.getAsDataArray()), B.seek(w);
+            let y = new d(10), w = B.pos;
+            y.writeUnsignedIntBE(c.id), y.writeEBMLVarIntWidth(B.pos - c.dataOffset, 5), B.seek(c.offset), B.write(y.getAsDataArray()), B.seek(w);
           })(), B.complete("video/webm");
         }, this.getWrittenSize = function() {
           return B.length;
@@ -727,13 +719,13 @@ function ge() {
         })();
       };
     };
-    s.exports = c;
+    n.exports = l;
   })()), Ct.exports;
-  var s;
+  var n;
 }
 var Et, kt = { exports: {} };
-function be() {
-  return Et || (Et = 1, s = kt, (function() {
+function ve() {
+  return Et || (Et = 1, n = kt, (function() {
     let t = function(e) {
       this.data = new Uint8Array(e), this.pos = 0;
     };
@@ -804,138 +796,138 @@ function be() {
       if (this.pos < this.data.byteLength) return this.data.subarray(0, this.pos);
       if (this.pos == this.data.byteLength) return this.data;
       throw new Error("ArrayBufferDataStream's pos lies beyond end of buffer");
-    }, s.exports = t;
+    }, n.exports = t;
   })()), kt.exports;
-  var s;
+  var n;
 }
 var Bt, It, St, Ft = { exports: {} };
-function ve() {
-  return Bt || (Bt = 1, s = Ft, (function() {
+function xe() {
+  return Bt || (Bt = 1, n = Ft, (function() {
     let t = function(e) {
       return function(r) {
-        let a = [], i = Promise.resolve(), n = null, c = null;
-        function l(d) {
+        let a = [], i = Promise.resolve(), s = null, l = null;
+        function d(c) {
           return new Promise(function(u, m) {
             let x = new FileReader();
             x.addEventListener("loadend", function() {
               u(x.result);
-            }), x.readAsArrayBuffer(d);
+            }), x.readAsArrayBuffer(c);
           });
         }
-        function p(d) {
+        function p(c) {
           return new Promise(function(u, m) {
-            d instanceof Uint8Array ? u(d) : d instanceof ArrayBuffer || ArrayBuffer.isView(d) ? u(new Uint8Array(d)) : d instanceof Blob ? u(l(d).then(function(x) {
+            c instanceof Uint8Array ? u(c) : c instanceof ArrayBuffer || ArrayBuffer.isView(c) ? u(new Uint8Array(c)) : c instanceof Blob ? u(d(c).then(function(x) {
               return new Uint8Array(x);
-            })) : u(l(new Blob([d])).then(function(x) {
+            })) : u(d(new Blob([c])).then(function(x) {
               return new Uint8Array(x);
             }));
           });
         }
-        function o(d) {
-          let u = d.byteLength || d.length || d.size;
+        function o(c) {
+          let u = c.byteLength || c.length || c.size;
           if (!Number.isInteger(u)) throw new Error("Failed to determine size of element");
           return u;
         }
-        r && r.constructor.name === "FileWriter" ? n = r : e && r && (c = r), this.pos = 0, this.length = 0, this.seek = function(d) {
-          if (d < 0) throw new Error("Offset may not be negative");
-          if (isNaN(d)) throw new Error("Offset may not be NaN");
-          if (d > this.length) throw new Error("Seeking beyond the end of file is not allowed");
-          this.pos = d;
-        }, this.write = function(d) {
-          let u = { offset: this.pos, data: d, length: o(d) }, m = u.offset >= this.length;
+        r && r.constructor.name === "FileWriter" ? s = r : e && r && (l = r), this.pos = 0, this.length = 0, this.seek = function(c) {
+          if (c < 0) throw new Error("Offset may not be negative");
+          if (isNaN(c)) throw new Error("Offset may not be NaN");
+          if (c > this.length) throw new Error("Seeking beyond the end of file is not allowed");
+          this.pos = c;
+        }, this.write = function(c) {
+          let u = { offset: this.pos, data: c, length: o(c) }, m = u.offset >= this.length;
           this.pos += u.length, this.length = Math.max(this.length, this.pos), i = i.then(function() {
-            if (c) return new Promise(function(x, h) {
-              p(u.data).then(function(f) {
-                let _ = 0, v = Buffer.from(f.buffer), g = function(C, S, E) {
-                  _ += S, _ >= E.length ? x() : e.write(c, E, _, E.length - _, u.offset + _, g);
+            if (l) return new Promise(function(x, h) {
+              p(u.data).then(function(g) {
+                let _ = 0, v = Buffer.from(g.buffer), f = function(C, S, E) {
+                  _ += S, _ >= E.length ? x() : e.write(l, E, _, E.length - _, u.offset + _, f);
                 };
-                e.write(c, v, 0, v.length, u.offset, g);
+                e.write(l, v, 0, v.length, u.offset, f);
               });
             });
-            if (n) return new Promise(function(x, h) {
-              n.onwriteend = x, n.seek(u.offset), n.write(new Blob([u.data]));
+            if (s) return new Promise(function(x, h) {
+              s.onwriteend = x, s.seek(u.offset), s.write(new Blob([u.data]));
             });
             if (!m) for (let x = 0; x < a.length; x++) {
               let h = a[x];
               if (!(u.offset + u.length <= h.offset || u.offset >= h.offset + h.length)) {
                 if (u.offset < h.offset || u.offset + u.length > h.offset + h.length) throw new Error("Overwrite crosses blob boundaries");
-                return u.offset == h.offset && u.length == h.length ? void (h.data = u.data) : p(h.data).then(function(f) {
-                  return h.data = f, p(u.data);
-                }).then(function(f) {
-                  u.data = f, h.data.set(u.data, u.offset - h.offset);
+                return u.offset == h.offset && u.length == h.length ? void (h.data = u.data) : p(h.data).then(function(g) {
+                  return h.data = g, p(u.data);
+                }).then(function(g) {
+                  u.data = g, h.data.set(u.data, u.offset - h.offset);
                 });
               }
             }
             a.push(u);
           });
-        }, this.complete = function(d) {
-          return i = c || n ? i.then(function() {
+        }, this.complete = function(c) {
+          return i = l || s ? i.then(function() {
             return null;
           }) : i.then(function() {
             let u = [];
             for (let m = 0; m < a.length; m++) u.push(a[m].data);
-            return new Blob(u, { type: d });
+            return new Blob(u, { type: c });
           }), i;
         };
       };
     };
-    s.exports = t;
+    n.exports = t;
   })()), Ft.exports;
-  var s;
+  var n;
 }
-function xe() {
-  return St ? It : (St = 1, It = ge()(be(), ve()(null)));
+function ye() {
+  return St ? It : (St = 1, It = be()(ve(), xe()(null)));
 }
-var ye = xe();
-const _e = fe(ye);
-class we {
+var _e = ye();
+const we = ge(_e);
+class Ce {
   async $record(t, e, r, a) {
-    const i = Math.max(1, Math.round(e.frameRate)), n = Math.max(1, Math.round(e.frameCount)), c = new _e({ quality: e.quality, alphaQuality: e.transparent ? e.quality : void 0, transparent: e.transparent, frameRate: i }), l = this._createSnapshotSurface();
+    const i = Math.max(1, Math.round(e.frameRate)), s = Math.max(1, Math.round(e.frameCount)), l = new we({ quality: e.quality, alphaQuality: e.transparent ? e.quality : void 0, transparent: e.transparent, frameRate: i }), d = this._createSnapshotSurface();
     return await new Promise((p, o) => {
-      let d, u = "capturing", m = !1, x = 0;
+      let c, u = "capturing", m = !1, x = 0;
       const h = () => {
-        d && (d(), d = void 0);
-      }, f = () => {
-        a?.({ state: "recording", frameIndex: x, totalFrames: n });
-      }, _ = (g) => {
+        c && (c(), c = void 0);
+      }, g = () => {
+        a?.({ state: "recording", frameIndex: x, totalFrames: s });
+      }, _ = (f) => {
         if (m) return;
         m = !0, h();
-        const C = g instanceof Error ? g.message : "WEBM export failed";
-        a?.({ state: "error", message: C }), o(g instanceof Error ? g : new Error(String(g)));
+        const C = f instanceof Error ? f.message : "WEBM export failed";
+        a?.({ state: "error", message: C }), o(f instanceof Error ? f : new Error(String(f)));
       }, v = () => {
-        u !== "capturing" || m || (u = "encoding", h(), c.complete().then((g) => {
+        u !== "capturing" || m || (u = "encoding", h(), l.complete().then((f) => {
           ((C) => {
-            m || (m = !0, a?.({ state: "completed", frameIndex: Math.min(n, x), totalFrames: n }), p(C));
-          })(g);
+            m || (m = !0, a?.({ state: "completed", frameIndex: Math.min(s, x), totalFrames: s }), p(C));
+          })(f);
         }).catch(_));
       };
-      d = r(() => {
+      c = r(() => {
         (() => {
-          if (u === "capturing") if (x >= n) v();
+          if (u === "capturing") if (x >= s) v();
           else try {
-            const g = l(t);
-            c.addFrame(g), x += 1, f(), x >= n && v();
-          } catch (g) {
-            _(g);
+            const f = d(t);
+            l.addFrame(f), x += 1, g(), x >= s && v();
+          } catch (f) {
+            _(f);
           }
         })();
-      }), f();
+      }), g();
     });
   }
   _createSnapshotSurface() {
     let t = null, e = null;
     return (r) => {
-      const a = Math.max(1, r.width), i = Math.max(1, r.height), n = ((c, l) => (t || (t = document.createElement("canvas")), t.width !== c || t.height !== l ? (t.width = c, t.height = l, e = t.getContext("2d"), e && (e.imageSmoothingEnabled = !1)) : e || (e = t.getContext("2d"), e && (e.imageSmoothingEnabled = !1)), e ? t : null))(a, i);
-      return n && e ? (e.clearRect(0, 0, a, i), e.drawImage(r, 0, 0, a, i), n) : r;
+      const a = Math.max(1, r.width), i = Math.max(1, r.height), s = ((l, d) => (t || (t = document.createElement("canvas")), t.width !== l || t.height !== d ? (t.width = l, t.height = d, e = t.getContext("2d"), e && (e.imageSmoothingEnabled = !1)) : e || (e = t.getContext("2d"), e && (e.imageSmoothingEnabled = !1)), e ? t : null))(a, i);
+      return s && e ? (e.clearRect(0, 0, a, i), e.drawImage(r, 0, 0, a, i), s) : r;
     };
   }
 }
-class Ce {
+class Ee {
   _recorder;
   _textmodifier;
   _registerPostDrawHook;
   constructor(t, e) {
-    this._recorder = new we(), this._textmodifier = t, this._registerPostDrawHook = e;
+    this._recorder = new Ce(), this._textmodifier = t, this._registerPostDrawHook = e;
   }
   async $saveWEBM(t = {}) {
     const e = this._textmodifier.canvas, r = this._applyDefaultOptions(t);
@@ -951,7 +943,7 @@ class Ce {
   }
 }
 const b = { root: "textmode-export-overlay", stack: "textmode-export-overlay__stack", stackDense: "textmode-export-overlay__stack--dense", stackCompact: "textmode-export-overlay__stack--compact", section: "textmode-export-overlay__section", header: "textmode-export-overlay__header", headerTitleRow: "textmode-export-overlay__header-title-row", headerLinks: "textmode-export-overlay__header-links", row: "textmode-export-overlay__row", label: "textmode-export-overlay__label", field: "textmode-export-overlay__field", fieldCompact: "textmode-export-overlay__field--compact", fieldDense: "textmode-export-overlay__field--dense", fieldFull: "textmode-export-overlay__field--full", fieldChannel: "textmode-export-overlay__field--channel", input: "textmode-export-overlay__input", checkbox: "textmode-export-overlay__checkbox", muted: "textmode-export-overlay__muted", status: "textmode-export-overlay__status", statusGif: "textmode-export-overlay__status--gif", statusVideo: "textmode-export-overlay__status--video", statusTitle: "textmode-export-overlay__status-title", statusValue: "textmode-export-overlay__status-value", divider: "textmode-export-overlay__divider", title: "textmode-export-overlay__title", button: "textmode-export-overlay__button", buttonPrimary: "textmode-export-overlay__button--primary", buttonSecondary: "textmode-export-overlay__button--secondary", buttonFull: "textmode-export-overlay__button--full", supportLink: "textmode-export-overlay__support-link", supportIcon: "textmode-export-overlay__support-icon", linkIcon: "textmode-export-overlay__link-icon" };
-class T {
+class O {
   element;
   mounted = !1;
   destroyed = !1;
@@ -986,7 +978,7 @@ class T {
     return this.mounted;
   }
 }
-class H extends T {
+class H extends O {
   static _iconNamespace = "http://www.w3.org/2000/svg";
   render() {
     const t = document.createElement("div");
@@ -997,10 +989,10 @@ class H extends T {
     r.textContent = "textmode.export.js", r.classList.add(b.title);
     const a = document.createElement("div");
     a.classList.add(b.headerLinks);
-    const i = this._createLink("https://github.com/humanbydefinition/textmode.export.js", "View repository on GitHub", b.linkIcon, [{ d: "M0 0h24v24H0z", fill: "none", stroke: "none" }, { d: "M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5" }]), n = this._createLink("https://code.textmode.art/support.html", "Support textmode.export.js", b.supportIcon, [{ d: "M0 0h24v24H0z", fill: "none", stroke: "none" }, { d: "M3 14c.83 .642 2.077 1.017 3.5 1c1.423 .017 2.67 -.358 3.5 -1c.83 -.642 2.077 -1.017 3.5 -1c1.423 -.017 2.67 .358 3.5 1" }, { d: "M8 3a2.4 2.4 0 0 0 -1 2a2.4 2.4 0 0 0 1 2" }, { d: "M12 3a2.4 2.4 0 0 0 -1 2a2.4 2.4 0 0 0 1 2" }, { d: "M3 10h14v5a6 6 0 0 1 -6 6h-2a6 6 0 0 1 -6 -6v-5z" }, { d: "M16.746 16.726a3 3 0 1 0 .252 -5.555" }]);
-    a.appendChild(i), a.appendChild(n), e.appendChild(r), e.appendChild(a);
-    const c = document.createElement("div");
-    return c.classList.add(b.divider), t.appendChild(e), t.appendChild(c), t;
+    const i = this._createLink("https://github.com/humanbydefinition/textmode.export.js", "View repository on GitHub", b.linkIcon, [{ d: "M0 0h24v24H0z", fill: "none", stroke: "none" }, { d: "M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5" }]), s = this._createLink("https://code.textmode.art/docs/support", "Support textmode.export.js", b.supportIcon, [{ d: "M0 0h24v24H0z", fill: "none", stroke: "none" }, { d: "M3 14c.83 .642 2.077 1.017 3.5 1c1.423 .017 2.67 -.358 3.5 -1c.83 -.642 2.077 -1.017 3.5 -1c1.423 -.017 2.67 .358 3.5 1" }, { d: "M8 3a2.4 2.4 0 0 0 -1 2a2.4 2.4 0 0 0 1 2" }, { d: "M12 3a2.4 2.4 0 0 0 -1 2a2.4 2.4 0 0 0 1 2" }, { d: "M3 10h14v5a6 6 0 0 1 -6 6h-2a6 6 0 0 1 -6 -6v-5z" }, { d: "M16.746 16.726a3 3 0 1 0 .252 -5.555" }]);
+    a.appendChild(i), a.appendChild(s), e.appendChild(r), e.appendChild(a);
+    const l = document.createElement("div");
+    return l.classList.add(b.divider), t.appendChild(e), t.appendChild(l), t;
   }
   _createLink(t, e, r, a) {
     const i = document.createElement("a");
@@ -1011,13 +1003,13 @@ class H extends T {
     r.setAttribute("xmlns", H._iconNamespace), r.setAttribute("width", "18"), r.setAttribute("height", "18"), r.setAttribute("viewBox", "0 0 24 24"), r.setAttribute("fill", "none"), r.setAttribute("stroke", "currentColor"), r.setAttribute("stroke-width", "2"), r.setAttribute("stroke-linecap", "round"), r.setAttribute("stroke-linejoin", "round"), r.classList.add(t);
     for (const a of e) {
       const i = document.createElementNS(H._iconNamespace, "path");
-      for (const [n, c] of Object.entries(a)) i.setAttribute(n, c);
+      for (const [s, l] of Object.entries(a)) i.setAttribute(s, l);
       r.appendChild(i);
     }
     return r;
   }
 }
-class P extends T {
+class P extends O {
   props;
   constructor(t) {
     super(), this.props = t;
@@ -1064,7 +1056,7 @@ class P extends T {
     }
   }
 }
-class mt extends T {
+class mt extends O {
   props;
   select;
   handleChange = () => {
@@ -1105,7 +1097,7 @@ class mt extends T {
     }
   }
 }
-class Lt extends T {
+class Lt extends O {
   props;
   button;
   constructor(t) {
@@ -1127,7 +1119,7 @@ class Lt extends T {
     this.props = t, this.button.textContent = t.label, this.button.disabled = !!t.disabled, t.variant === "secondary" ? (this.button.classList.add(b.buttonSecondary), this.button.classList.remove(b.buttonPrimary)) : (this.button.classList.add(b.buttonPrimary), this.button.classList.remove(b.buttonSecondary)), this.button.classList.toggle(b.buttonFull, !!t.fullWidth);
   }
 }
-class Ee {
+class ke {
   api;
   constructor(t) {
     this.api = t;
@@ -1152,7 +1144,7 @@ class Ee {
     }
   }
 }
-class ke {
+class Be {
   api;
   events;
   constructor(t, e) {
@@ -1190,7 +1182,7 @@ class ke {
     }
   }
 }
-class Be {
+class Ie {
   modifier;
   overlay;
   animationFrameId = null;
@@ -1214,13 +1206,13 @@ class Be {
     this.animationFrameId !== null && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = null), this.bound && (window.removeEventListener("resize", this.handleUpdate), window.removeEventListener("scroll", this.handleUpdate, !0), this.bound = !1);
   }
 }
-const X = "textmode-export-number-input", Ie = `${X}__field`, Se = `${X}__controls`, Fe = `${X}__control`, Ut = `${X}__display`, et = `${Ut}--visible`, Le = (s) => {
-  s.dispatchEvent(new Event("input", { bubbles: !0 })), s.dispatchEvent(new Event("change", { bubbles: !0 }));
-}, Mt = (s) => {
+const X = "textmode-export-number-input", Se = `${X}__field`, Fe = `${X}__controls`, Le = `${X}__control`, Ut = `${X}__display`, et = `${Ut}--visible`, Me = (n) => {
+  n.dispatchEvent(new Event("input", { bubbles: !0 })), n.dispatchEvent(new Event("change", { bubbles: !0 }));
+}, Mt = (n) => {
   const t = document.createElement("button");
-  return t.type = "button", t.className = Fe, t.textContent = s > 0 ? "▲" : "▼", t;
+  return t.type = "button", t.className = Le, t.textContent = n > 0 ? "▲" : "▼", t;
 };
-class G extends T {
+class G extends O {
   props;
   input;
   display;
@@ -1236,9 +1228,9 @@ class G extends T {
   }
   render() {
     const t = document.createElement("div");
-    t.className = X, this.input = document.createElement("input"), this.input.type = "number", this.input.value = this.props.defaultValue, Object.assign(this.input, this.props.attributes), this.input.className = Ie, this.display = document.createElement("div"), this.display.className = Ut;
+    t.className = X, this.input = document.createElement("input"), this.input.type = "number", this.input.value = this.props.defaultValue, Object.assign(this.input, this.props.attributes), this.input.className = Se, this.display = document.createElement("div"), this.display.className = Ut;
     const e = document.createElement("div");
-    return e.className = Se, this.incrementButton = Mt(1), this.decrementButton = Mt(-1), e.appendChild(this.incrementButton), e.appendChild(this.decrementButton), t.appendChild(this.input), t.appendChild(this.display), t.appendChild(e), this.bindStepControls(), this.bindHoldBehavior(), this.bindInputListeners(), this.observeDisabledState(t), this.updateDisplay(), t;
+    return e.className = Fe, this.incrementButton = Mt(1), this.decrementButton = Mt(-1), e.appendChild(this.incrementButton), e.appendChild(this.decrementButton), t.appendChild(this.input), t.appendChild(this.display), t.appendChild(e), this.bindStepControls(), this.bindHoldBehavior(), this.bindInputListeners(), this.observeDisabledState(t), this.updateDisplay(), t;
   }
   get inputElement() {
     return this.input;
@@ -1258,27 +1250,27 @@ class G extends T {
   bindStepControls() {
     const t = (i) => () => {
       if (this.input.disabled) return;
-      const n = this.input.value, c = this.input.getAttribute("step");
-      if (c && c !== "any") i > 0 ? this.input.stepUp() : this.input.stepDown();
+      const s = this.input.value, l = this.input.getAttribute("step");
+      if (l && l !== "any") i > 0 ? this.input.stepUp() : this.input.stepDown();
       else {
-        const l = i > 0 ? 1 : -1, p = Number.parseFloat(this.input.value || "0"), o = Number.isFinite(p) ? p + l : l;
+        const d = i > 0 ? 1 : -1, p = Number.parseFloat(this.input.value || "0"), o = Number.isFinite(p) ? p + d : d;
         this.input.value = String(o);
       }
-      this.input.value !== n && Le(this.input), this.updateDisplay(), this.input.focus({ preventScroll: !0 });
-    }, e = t(1), r = t(-1), a = (i, n) => (c) => {
-      if (this.suppressClickAfterPointer.get(i)) return this.suppressClickAfterPointer.set(i, !1), void c.preventDefault();
-      n();
+      this.input.value !== s && Me(this.input), this.updateDisplay(), this.input.focus({ preventScroll: !0 });
+    }, e = t(1), r = t(-1), a = (i, s) => (l) => {
+      if (this.suppressClickAfterPointer.get(i)) return this.suppressClickAfterPointer.set(i, !1), void l.preventDefault();
+      s();
     };
     this.incrementButton.addEventListener("click", a(this.incrementButton, e)), this.decrementButton.addEventListener("click", a(this.decrementButton, r));
   }
   bindHoldBehavior() {
     const t = (e, r) => {
       const a = r > 0 ? () => this.incrementButton.click() : () => this.decrementButton.click();
-      e.addEventListener("pointerdown", (c) => {
-        if (c.button === 0) {
-          c.preventDefault(), this.suppressClickAfterPointer.set(e, !0), this.activePointerId = c.pointerId;
+      e.addEventListener("pointerdown", (l) => {
+        if (l.button === 0) {
+          l.preventDefault(), this.suppressClickAfterPointer.set(e, !0), this.activePointerId = l.pointerId;
           try {
-            e.setPointerCapture(c.pointerId);
+            e.setPointerCapture(l.pointerId);
           } catch {
           }
           a(), this.holdTimeoutId = window.setTimeout(() => {
@@ -1294,10 +1286,10 @@ class G extends T {
           }
           this.activePointerId = void 0;
         }
-      }, n = () => {
+      }, s = () => {
         this.clearHoldTimers(), i();
       };
-      e.addEventListener("pointerup", n), e.addEventListener("pointerleave", n), e.addEventListener("pointercancel", n);
+      e.addEventListener("pointerup", s), e.addEventListener("pointerleave", s), e.addEventListener("pointercancel", s);
     };
     t(this.incrementButton, 1), t(this.decrementButton, -1);
   }
@@ -1324,7 +1316,7 @@ class G extends T {
     this.holdTimeoutId !== void 0 && (window.clearTimeout(this.holdTimeoutId), this.holdTimeoutId = void 0), this.holdIntervalId !== void 0 && (window.clearInterval(this.holdIntervalId), this.holdIntervalId = void 0);
   }
 }
-class j extends T {
+class j extends O {
   variant;
   additionalClasses;
   constructor(t = "stack", e = []) {
@@ -1336,7 +1328,7 @@ class j extends T {
   }
 }
 const $t = { neutral: "textmode-export-overlay__status-value--neutral", active: "textmode-export-overlay__status-value--active", alert: "textmode-export-overlay__status-value--alert" };
-class Nt extends T {
+class Nt extends O {
   props;
   container;
   messageElement;
@@ -1358,7 +1350,7 @@ class Nt extends T {
     this.messageElement.classList.remove(...Object.values($t)), this.messageElement.classList.add($t[t]);
   }
 }
-class Y extends T {
+class Y extends O {
   _config;
   _managedComponents = /* @__PURE__ */ new Set();
   constructor(t) {
@@ -1397,10 +1389,10 @@ class ut extends Y {
     a.mount(e.root), this.frameRateInput.mount(a.root), this.frameRateInput.inputElement.id = "textmode-export-gif-frame-rate";
     const i = new j("row");
     i.mount(t);
-    const n = new P({ label: "scale", labelFor: "textmode-export-gif-scale", variant: "dense" });
-    n.mount(i.root), this.scaleInput.mount(n.root), this.scaleInput.inputElement.id = "textmode-export-gif-scale";
-    const c = new P({ label: "loop count", labelFor: "textmode-export-gif-repeat", variant: "dense" });
-    return c.mount(i.root), this.repeatInput.mount(c.root), this.repeatInput.inputElement.id = "textmode-export-gif-repeat", this.status.mount(t), t;
+    const s = new P({ label: "scale", labelFor: "textmode-export-gif-scale", variant: "dense" });
+    s.mount(i.root), this.scaleInput.mount(s.root), this.scaleInput.inputElement.id = "textmode-export-gif-scale";
+    const l = new P({ label: "loop count", labelFor: "textmode-export-gif-repeat", variant: "dense" });
+    return l.mount(i.root), this.repeatInput.mount(l.root), this.repeatInput.inputElement.id = "textmode-export-gif-repeat", this.status.mount(t), t;
   }
   getOptions() {
     const t = this._config.defaultOptions ?? {};
@@ -1414,11 +1406,11 @@ class ut extends Y {
     return Number.isFinite(t) && t > 0 && Number.isFinite(e) && e > 0 && Number.isFinite(r) && r > 0;
   }
   isRecording() {
-    return this.recordingState === "recording";
+    return this.recordingState === "recording" || this.recordingState === "encoding";
   }
   setRecordingState(t, e) {
     this.recordingState = t;
-    const r = t === "recording";
+    const r = t === "recording" || t === "encoding";
     switch (this.frameCountInput.inputElement.disabled = r, this.frameRateInput.inputElement.disabled = r, this.scaleInput.inputElement.disabled = r, this.repeatInput.inputElement.disabled = r, t) {
       case "recording":
         if (e?.totalFrames) {
@@ -1426,6 +1418,12 @@ class ut extends Y {
           this.status.setMessage(`recording ${a}/${e.totalFrames}`, "active");
         } else this.status.setMessage("recording…", "active");
         break;
+      case "encoding":
+        if (e?.totalFrames) {
+          const a = e.frameIndex ?? 0;
+          this.status.setMessage(`encoding ${a}/${e.totalFrames}`, "active");
+        } else this.status.setMessage("encoding…", "active");
+        break;
       case "completed":
         this.status.setMessage("GIF saved successfully", "active");
         break;
@@ -1437,7 +1435,11 @@ class ut extends Y {
     }
   }
   handleProgress(t) {
-    t.state === "recording" && t.totalFrames ? this.status.setMessage(`recording ${t.frameIndex ?? 0}/${t.totalFrames}`, "active") : t.state === "completed" ? this.status.setMessage("GIF saved successfully", "active") : t.state === "error" && this.status.setMessage(t.message ?? "failed to export GIF", "alert");
+    if (t.state !== "recording" && t.state !== "encoding" || !t.totalFrames) t.state === "completed" ? this.status.setMessage("GIF saved successfully", "active") : t.state === "error" && this.status.setMessage(t.message ?? "failed to export GIF", "alert");
+    else {
+      const e = t.state === "recording" ? "recording" : "encoding";
+      this.status.setMessage(`${e} ${t.frameIndex ?? 0}/${t.totalFrames}`, "active");
+    }
   }
   applyDefaults() {
     const t = this._config.defaultOptions ?? {}, e = t.frameCount ?? z.frameCount, r = t.frameRate ?? z.frameRate, a = t.scale ?? z.scale, i = t.repeat ?? z.repeat;
@@ -1452,12 +1454,12 @@ class ut extends Y {
     return Number.isFinite(r) ? r : e;
   }
 }
-const it = "textmode-export-range-input", Me = `${it}__field`, $e = `${it}__tooltip`, ct = `${it}__tooltip--visible`, rt = (s, t) => {
-  if (typeof s != "string" || s.length === 0) return t;
-  const e = Number.parseFloat(s);
+const it = "textmode-export-range-input", $e = `${it}__field`, Ae = `${it}__tooltip`, ct = `${it}__tooltip--visible`, rt = (n, t) => {
+  if (typeof n != "string" || n.length === 0) return t;
+  const e = Number.parseFloat(n);
   return Number.isFinite(e) ? e : t;
-}, Ae = (s, t, e) => Math.min(e, Math.max(t, s));
-class Pe extends T {
+}, Pe = (n, t, e) => Math.min(e, Math.max(t, n));
+class De extends O {
   props;
   input;
   tooltip;
@@ -1473,7 +1475,7 @@ class Pe extends T {
   }
   render() {
     const t = document.createElement("div");
-    return t.className = it, this.input = document.createElement("input"), this.input.type = "range", this.input.value = this.props.defaultValue, Object.assign(this.input, this.props.attributes), this.input.className = Me, this.tooltip = document.createElement("div"), this.tooltip.className = $e, t.appendChild(this.input), t.appendChild(this.tooltip), this.bindEvents(t), this.updateTooltip(), this.syncDisabledState(t), t;
+    return t.className = it, this.input = document.createElement("input"), this.input.type = "range", this.input.value = this.props.defaultValue, Object.assign(this.input, this.props.attributes), this.input.className = $e, this.tooltip = document.createElement("div"), this.tooltip.className = Ae, t.appendChild(this.input), t.appendChild(this.tooltip), this.bindEvents(t), this.updateTooltip(), this.syncDisabledState(t), t;
   }
   get inputElement() {
     return this.input;
@@ -1549,7 +1551,7 @@ class Pe extends T {
     this.tooltip.textContent = t(e, this.input);
   }
   updateTooltipPosition() {
-    const t = this.getMin(), e = this.getMax(), r = Ae(this.getCurrentValue(), t, e), a = e - t, i = a === 0 ? 0 : (r - t) / a;
+    const t = this.getMin(), e = this.getMax(), r = Pe(this.getCurrentValue(), t, e), a = e - t, i = a === 0 ? 0 : (r - t) / a;
     this.tooltip.style.left = 100 * i + "%";
   }
   getMin() {
@@ -1562,18 +1564,18 @@ class Pe extends T {
     return rt(this.input.value, rt(this.props.defaultValue, 0));
   }
 }
-function De(s) {
-  if (!Number.isFinite(s)) return "default quality";
-  const t = Math.max(0, Math.min(1, s));
+function Ve(n) {
+  if (!Number.isFinite(n)) return "default quality";
+  const t = Math.max(0, Math.min(1, n));
   return t >= 0.995 ? "near-lossless" : t >= 0.98 ? "maximum detail" : t >= 0.88 ? "ultra quality" : t >= 0.7 ? "high quality" : t >= 0.5 ? "balanced" : t >= 0.25 ? "compact" : t >= 0.1 ? "lightweight" : "draft";
 }
-function Ve(s) {
-  return `${De(s)} (quality ≈ ${s.toFixed(3)})`;
+function Oe(n) {
+  return `${Ve(n)} (quality ≈ ${n.toFixed(3)})`;
 }
 class pt extends Y {
   frameRateInput = this._manageComponent(new G({ defaultValue: String(60), attributes: { min: String(1), max: String(60), step: "1" }, formatDisplay: (t) => Number.isFinite(t) ? `${t} fps` : null }));
   frameCountInput = this._manageComponent(new G({ defaultValue: String(480), attributes: { min: String(1), max: String(3600), step: "1" } }));
-  qualityInput = this._manageComponent(new Pe({ defaultValue: String(0.7), attributes: { min: String(0), max: String(1), step: "0.001" }, formatValue: (t) => Ve(t) }));
+  qualityInput = this._manageComponent(new De({ defaultValue: String(0.7), attributes: { min: String(0), max: String(1), step: "0.001" }, formatValue: (t) => Oe(t) }));
   status = this._manageComponent(new Nt({ title: "status", message: "ready to record", variant: "neutral", context: "video" }));
   recordingState = "idle";
   constructor(t) {
@@ -1643,7 +1645,7 @@ class pt extends Y {
   }
 }
 const Te = `@layer textmode-export-overlay{.textmode-export-overlay{--overlay-bg: rgba(20, 20, 20, .8);--overlay-surface: rgba(40, 40, 40, .9);--overlay-border: rgba(255, 255, 255, .14);--overlay-border-strong: rgba(255, 255, 255, .2);--overlay-border-focus: rgba(160, 160, 160, .6);--overlay-focus-shadow: 0 0 0 1px rgba(140, 140, 140, .28);--overlay-text: #ffffff;--overlay-muted: rgba(200, 200, 200, .74);--overlay-radius: .75rem;--overlay-stack-gap: .55rem;position:absolute;top:0;left:0;display:flex;flex-direction:column;gap:var(--overlay-stack-gap);min-width:236px;max-width:236px;padding:.65rem .8rem;background:var(--overlay-bg);color:var(--overlay-text);border-radius:var(--overlay-radius);border:1px solid var(--overlay-border);box-shadow:0 12px 28px #0000004d;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.82rem;line-height:1.35;pointer-events:auto;z-index:2147483647}.textmode-export-overlay *{box-sizing:border-box}.textmode-export-overlay__header{display:flex;flex-direction:column;gap:.4rem}.textmode-export-overlay__header-title-row{display:flex;align-items:center;justify-content:space-between;gap:.4rem}.textmode-export-overlay__header-links{display:inline-flex;align-items:center;gap:.3rem}.textmode-export-overlay__support-link{display:inline-flex;align-items:center;justify-content:center;padding:.2rem;border-radius:.45rem;border:1px solid transparent;color:#d7d7d7d1;background:transparent;text-decoration:none;line-height:0;transition:background .18s ease,color .18s ease,transform .18s ease,border-color .18s ease}.textmode-export-overlay__support-link:hover{color:#fff;background:#5a5a5a4d;border-color:#c8c8c824}.textmode-export-overlay__support-link:focus-visible{outline:none;border-color:var(--overlay-border-focus);box-shadow:var(--overlay-focus-shadow)}.textmode-export-overlay__support-icon,.textmode-export-overlay__link-icon{display:block;width:1rem;height:1rem}.textmode-export-overlay__stack{display:flex;flex-direction:column;gap:var(--overlay-stack-gap)}.textmode-export-overlay__stack--dense{gap:.3rem}.textmode-export-overlay__stack--compact{gap:.45rem}.textmode-export-overlay__section{display:flex;flex-direction:column;gap:.4rem}.textmode-export-overlay__title{font-size:.92rem;font-weight:600}.textmode-export-overlay__divider{width:100%;height:1px;background:#ffffff29;margin-top:.25rem}.textmode-export-overlay__label{font-weight:500;opacity:.9}.textmode-export-overlay__checkbox{display:flex;align-items:center;gap:.5rem}.textmode-export-overlay__checkbox input[type=checkbox]{width:1rem;height:1rem;accent-color:rgba(100,100,100,.9)}.textmode-export-overlay__row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:flex-start;width:100%}.textmode-export-overlay__field{display:flex;flex-direction:column;gap:.3rem;flex:1 1 120px;min-width:120px}.textmode-export-overlay__field--compact{flex:1 1 100px;min-width:100px}.textmode-export-overlay__field--dense{flex:1 1 90px;min-width:90px}.textmode-export-overlay__field--channel{flex:1 1 0;min-width:0}.textmode-export-overlay__field--full{width:100%;flex:1 1 100%}.textmode-export-overlay__input,.textmode-export-overlay select.textmode-export-overlay__input,.textmode-export-overlay input.textmode-export-overlay__input{width:100%;padding:.35rem .5rem;border-radius:.4rem;border:1px solid var(--overlay-border-strong);background:var(--overlay-surface);color:var(--overlay-text);font:inherit;line-height:1.35;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}.textmode-export-overlay select.textmode-export-overlay__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(200, 200, 200, 0.74)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .5rem center;background-size:1rem;padding-right:2rem}.textmode-export-overlay__input:focus{outline:none;border-color:var(--overlay-border-focus);box-shadow:var(--overlay-focus-shadow);background:#2d2f42eb}.textmode-export-overlay__input::placeholder{color:var(--overlay-muted);opacity:.7}.textmode-export-overlay__muted{font-size:.75rem;opacity:.7;display:block}.textmode-export-overlay__button{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;border-radius:.45rem;border:none;font-weight:600;padding:.45rem .7rem;cursor:pointer;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}.textmode-export-overlay__button--primary{background:#505050;color:#fff}.textmode-export-overlay__button--secondary{background:#606060;color:#fff}.textmode-export-overlay__button--full{width:100%}.textmode-export-overlay__button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 7px 18px #00000073}.textmode-export-overlay__button--primary:hover:not(:disabled){background:#404040}.textmode-export-overlay__button--secondary:hover:not(:disabled){background:#4a4a4a}.textmode-export-overlay__button:disabled{cursor:default;opacity:.55;transform:none;box-shadow:none}.textmode-export-overlay__status{display:flex;flex-direction:column;gap:.25rem;padding:.45rem .55rem;border-radius:.45rem;border:1px solid rgba(110,110,110,.22);background:#4646462e}.textmode-export-overlay__status--gif{background:#5050501f;border-color:#78787840}.textmode-export-overlay__status--video{background:#4646461f;border-color:#6e6e6e40}.textmode-export-overlay__status-title{font-weight:600;font-size:.75rem;opacity:.85;text-transform:uppercase;letter-spacing:.04em}.textmode-export-overlay__status-value{font-size:.82rem;color:#dedede;transition:color .18s ease}.textmode-export-overlay__status-value--neutral{color:#cfcfcf}.textmode-export-overlay__status-value--active{color:#f5f5f5}.textmode-export-overlay__status-value--alert{color:#b8b8b8}.textmode-export-number-input,.textmode-export-overlay .textmode-export-number-input{display:flex;align-items:stretch;width:100%;background:var(--overlay-surface);border:1px solid var(--overlay-border-strong);border-radius:.4rem;overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;position:relative}.textmode-export-number-input:focus-within{border-color:var(--overlay-border-focus);box-shadow:var(--overlay-focus-shadow)}.textmode-export-number-input.is-disabled{opacity:.55}.textmode-export-number-input__field{flex:1 1 auto;min-width:0;border:none;background:transparent;color:var(--overlay-text);font:inherit;padding:.35rem .5rem;appearance:textfield}.textmode-export-number-input__field::-webkit-outer-spin-button,.textmode-export-number-input__field::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.textmode-export-number-input__field:focus{outline:none}.textmode-export-number-input__controls{display:flex;flex-direction:column;border-left:1px solid rgba(255,255,255,.12);min-width:1.6rem}.textmode-export-number-input__control{display:flex;align-items:center;justify-content:center;width:100%;flex:1;border:none;background:#32323299;color:#d0d0d0;font-size:.68rem;line-height:1;cursor:pointer;transition:background .15s ease,color .15s ease;padding:0}.textmode-export-number-input__control:hover:not(:disabled){background:#5a5a5ad9;color:#fff}.textmode-export-number-input__control:disabled{cursor:default;opacity:.4;background:#28282880;color:#c8c8c866}.textmode-export-number-input:focus-within .textmode-export-number-input__control{background:#3c3c3cbf;color:#e8e8e8}.textmode-export-number-input__display{position:absolute;inset:0;display:flex;align-items:center;padding:.4rem .55rem;pointer-events:none;color:#f8fafc;opacity:0;transition:opacity .14s ease}.textmode-export-number-input__display--visible{opacity:1}.textmode-export-range-input{position:relative;width:100%}.textmode-export-range-input.is-disabled{opacity:.55}.textmode-export-range-input__field{width:100%;height:1.4rem;padding:0;margin:0;background:transparent;cursor:pointer;appearance:none;-webkit-appearance:none}.textmode-export-range-input__field::-webkit-slider-thumb{width:12px;height:12px;margin-top:-3.5px;-webkit-appearance:none;border-radius:50%;background:#a0a0a0;border:2px solid #303030;box-shadow:0 0 0 2px #00000059}.textmode-export-range-input__field::-webkit-slider-runnable-track{height:5px;border-radius:999px;background:linear-gradient(90deg,#8c8c8cd9,#646464a6)}.textmode-export-range-input__field::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#a0a0a0;border:2px solid #303030;margin-top:-3.5px}.textmode-export-range-input__field::-moz-range-track{height:5px;border-radius:999px;background:linear-gradient(90deg,#8c8c8cd9,#646464a6)}.textmode-export-range-input__tooltip{position:absolute;top:-1.5rem;left:0;transform:translate(-50%);padding:.2rem .35rem;border-radius:.35rem;background:#1e1e1ee0;color:#f8fafc;font-size:.68rem;line-height:1;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s ease}.textmode-export-range-input__tooltip--visible{opacity:1}}`;
-class Oe {
+class Re {
   _textmodifier;
   _state;
   _events;
@@ -1679,10 +1681,22 @@ class Oe {
     });
   };
   constructor(t, e, r, a, i) {
-    this._textmodifier = t, this._state = r, this._events = a, this._exportService = new ke(e, a), this._clipboardService = new Ee(e), this._definitions = i, this._currentFormat = r.snapshot.format, this._initializeFormatMap(), this._registerEventHandlers();
+    this._textmodifier = t, this._state = r, this._events = a, this._exportService = new Be(e, a), this._clipboardService = new ke(e), this._definitions = i, this._currentFormat = r.snapshot.format, this._initializeFormatMap(), this._registerEventHandlers();
   }
   $mount() {
-    this._createOverlay(), this._renderStaticContent(), this._positionService = new Be(this._textmodifier, this._shadowHost), this._positionService.bind(), this._switchFormat(this._currentFormat);
+    this._createOverlay(), this._renderStaticContent(), this._positionService = new Ie(this._textmodifier, this._shadowHost), this._positionService.bind(), this._switchFormat(this._currentFormat);
+  }
+  show() {
+    this._shadowHost && (this._shadowHost.style.display = "");
+  }
+  hide() {
+    this._shadowHost && (this._shadowHost.style.display = "none");
+  }
+  toggle() {
+    this.isVisible() ? this.hide() : this.show();
+  }
+  isVisible() {
+    return !!this._shadowHost && this._shadowHost.style.display !== "none";
   }
   $dispose() {
     this._formatSelect.isMounted() && this._formatSelect.selectElement.removeEventListener("change", this._handleFormatSelectChange), this._exportButton.isMounted() && this._exportButton.buttonElement.removeEventListener("click", this._handleExportClickSafe), this._copyButton.isMounted() && this._copyButton.buttonElement.removeEventListener("click", this._handleCopyClickSafe);
@@ -1793,7 +1807,20 @@ class Oe {
     const t = this._currentBlade.definition.format, e = this._currentBlade.blade.getOptions(), r = this._copyButton.buttonElement.dataset.defaultLabel ?? "copy to clipboard";
     this._copyButton.setDisabled(!0), this._copyButton.setLabel("copying…");
     try {
-      await this._clipboardService.$copy(t, e), this._copyButton.setLabel("copied!");
+      switch (t) {
+        case "txt":
+          await this._clipboardService.$copy("txt", e);
+          break;
+        case "svg":
+          await this._clipboardService.$copy("svg", e);
+          break;
+        case "image":
+          await this._clipboardService.$copy("image", e);
+          break;
+        default:
+          return;
+      }
+      this._copyButton.setLabel("copied!");
     } catch (a) {
       console.error("[textmode-export] Failed to copy to clipboard", a), this._copyButton.setLabel("copy failed!");
     } finally {
@@ -1808,9 +1835,12 @@ class Oe {
     if (t === "gif" && this._currentBlade.blade instanceof ut) {
       const r = this._currentBlade.blade, a = this._state.snapshot.gifProgress;
       if (r.isRecording()) if (this._exportButton.setDisabled(!0), a?.totalFrames) {
-        const i = a.frameIndex ?? 0;
-        this._exportButton.setLabel(`recording ${i}/${a.totalFrames}`);
-      } else this._exportButton.setLabel("recording…");
+        const i = a.frameIndex ?? 0, s = a.state === "encoding" ? "encoding" : "recording";
+        this._exportButton.setLabel(`${s} ${i}/${a.totalFrames}`);
+      } else {
+        const i = a?.state === "encoding" ? "encoding" : "recording";
+        this._exportButton.setLabel(`${i}…`);
+      }
       else this._exportButton.setDisabled(!1), this._exportButton.setLabel("start recording");
       return;
     }
@@ -1827,17 +1857,22 @@ class Oe {
     this._exportButton.setDisabled(e), this._exportButton.setLabel(e ? "exporting…" : "download file");
   }
 }
-class Re {
-  _listeners = /* @__PURE__ */ new Map();
+class Ue {
+  _listeners = {};
+  _getPool(t) {
+    const e = this._listeners[t];
+    if (e) return e;
+    const r = /* @__PURE__ */ new Set();
+    return this._listeners[t] = r, r;
+  }
   $on(t, e) {
-    this._listeners.has(t) || this._listeners.set(t, /* @__PURE__ */ new Set());
-    const r = this._listeners.get(t);
+    const r = this._getPool(t);
     return r.add(e), () => {
-      r.delete(e), r.size === 0 && this._listeners.delete(t);
+      r.delete(e), r.size === 0 && delete this._listeners[t];
     };
   }
   $emit(t, e) {
-    const r = this._listeners.get(t);
+    const r = this._listeners[t];
     if (r) for (const a of [...r]) try {
       a(e);
     } catch (i) {
@@ -1845,10 +1880,10 @@ class Re {
     }
   }
   $clear() {
-    this._listeners.clear();
+    for (const t of Object.keys(this._listeners)) delete this._listeners[t];
   }
 }
-class Ue {
+class Ne {
   _state;
   _listeners = /* @__PURE__ */ new Set();
   constructor(t) {
@@ -1877,8 +1912,8 @@ class Ue {
     for (const r of [...this._listeners]) r(e);
   }
 }
-const Ne = (s) => ({ format: s, isBusy: !1 });
-class Gt extends T {
+const Ge = (n) => ({ format: n, isBusy: !1 });
+class Gt extends O {
   props;
   checkbox;
   labelElement;
@@ -1909,7 +1944,7 @@ class Gt extends T {
     this.props = t, t.id && (this.checkbox.id = t.id, this.labelElement.htmlFor = t.id), this.checkbox.checked = !!t.defaultChecked, this.labelElement.lastElementChild && (this.labelElement.lastElementChild.textContent = t.label);
   }
 }
-class Ge extends T {
+class ze extends O {
   props;
   input;
   handleInput = () => {
@@ -1937,9 +1972,9 @@ class Ge extends T {
     this.props = t, t.id && (this.input.id = t.id), t.maxLength !== void 0 && (this.input.maxLength = t.maxLength), t.defaultValue !== void 0 && (this.input.value = t.defaultValue);
   }
 }
-class ze extends Y {
+class We extends Y {
   trailingSpaces = this._manageComponent(new Gt({ label: "preserve trailing spaces", defaultChecked: !1 }));
-  emptyCharacter = this._manageComponent(new Ge({ id: "textmode-export-empty-character", defaultValue: " ", maxLength: 1 }));
+  emptyCharacter = this._manageComponent(new ze({ id: "textmode-export-empty-character", defaultValue: " ", maxLength: 1 }));
   constructor(t) {
     super(t);
   }
@@ -1964,7 +1999,7 @@ class ze extends Y {
     this.trailingSpaces.checked = t.preserveTrailingSpaces ?? !1, this.emptyCharacter.value = t.emptyCharacter ?? " ";
   }
 }
-class We extends Y {
+class qe extends Y {
   formatSelect = this._manageComponent(new mt({ id: "textmode-export-image-format", options: [{ value: "png", label: `PNG (${lt.png})` }, { value: "jpg", label: `JPG (${lt.jpg})` }, { value: "webp", label: `WEBP (${lt.webp})` }], defaultValue: "png" }));
   scaleInput = this._manageComponent(new G({ defaultValue: "1", attributes: { min: "0.1", step: "0.1" } }));
   constructor(t) {
@@ -1998,7 +2033,7 @@ class We extends Y {
     this.scaleInput.value = String(e);
   }
 }
-class qe extends Y {
+class He extends Y {
   includeBackground = this._manageComponent(new Gt({ id: "textmode-export-svg-include-backgrounds", label: "include cell backgrounds", defaultChecked: !0 }));
   drawMode = this._manageComponent(new mt({ id: "textmode-export-svg-draw-mode", options: [{ value: "fill", label: "fill" }, { value: "stroke", label: "stroke" }], defaultValue: "fill" }));
   strokeWidth = this._manageComponent(new G({ defaultValue: "1", attributes: { min: "0", step: "0.1" } }));
@@ -2036,31 +2071,35 @@ class qe extends Y {
     this.strokeWidth.value = String(e), this.strokeWidth.refresh();
   }
 }
-const He = [{ format: "txt", label: "plain text (.txt)", supportsClipboard: !0, createBlade: () => new ze({ format: "txt", label: "plain text (.txt)", supportsClipboard: !0, defaultOptions: { preserveTrailingSpaces: !1, emptyCharacter: " " } }) }, { format: "image", label: "image (.png / .jpg / .webp)", supportsClipboard: !0, createBlade: () => new We({ format: "image", label: "image (.png / .jpg / .webp)", supportsClipboard: !0, defaultOptions: { format: "png", scale: 1 } }) }, { format: "svg", label: "vector (.svg)", supportsClipboard: !0, createBlade: () => new qe({ format: "svg", label: "vector (.svg)", supportsClipboard: !0, defaultOptions: { includeBackgroundRectangles: !0, drawMode: "fill", strokeWidth: 1 } }) }, { format: "gif", label: "animated GIF (.gif)", supportsClipboard: !1, createBlade: () => new ut({ format: "gif", label: "animated GIF (.gif)", supportsClipboard: !1, defaultOptions: { frameCount: 300, frameRate: 60, scale: 1, repeat: 0 } }) }, { format: "video", label: "video (.webm)", supportsClipboard: !1, createBlade: () => new pt({ format: "video", label: "video (.webm)", supportsClipboard: !1, defaultOptions: { frameCount: 480, frameRate: 60, quality: 0.7 } }) }];
-function je() {
-  return He;
-}
-function Qe(s, t) {
-  const e = je(), r = e[0]?.format, a = new Ue(Ne(r)), i = new Re(), n = new Oe(s, t, a, i, e);
-  return n.$mount(), n;
-}
-const Xe = (s = {}) => {
-  const t = s.overlay ?? !0;
-  let e;
-  return { name: "textmode-export", version: "1.0.0", async install(r, a) {
-    const i = { saveCanvas: async (n = {}) => new bt().$saveImage(r.canvas, n), copyCanvas: async (n = {}) => new bt().$copyImageToClipboard(r.canvas, n), saveSVG: (n = {}) => {
-      new gt().$saveSVG(r, n);
-    }, saveStrings: (n = {}) => {
-      new vt().$saveTXT(r, n);
-    }, toSVG: (n = {}) => new gt().$generateSVG(r, n), toString: (n = {}) => new vt().$generateTXT(r, n), saveGIF: async (n = {}) => new me(r, a.registerPostDrawHook).$saveGIF(n), saveWEBM: async (n = {}) => new Ce(r, a.registerPostDrawHook).$saveWEBM(n) };
-    Object.assign(r, i), t && (e = Qe(r, i));
-  }, async uninstall(r) {
-    e?.$dispose(), e = void 0;
-    const a = ["saveCanvas", "copyCanvas", "saveSVG", "saveStrings", "toSVG", "toString", "saveGIF", "saveWEBM"];
-    for (const i of a) delete r[i];
-  } };
+const je = [{ format: "txt", label: "plain text (.txt)", supportsClipboard: !0, createBlade: () => new We({ format: "txt", label: "plain text (.txt)", supportsClipboard: !0, defaultOptions: { preserveTrailingSpaces: !1, emptyCharacter: " " } }) }, { format: "image", label: "image (.png / .jpg / .webp)", supportsClipboard: !0, createBlade: () => new qe({ format: "image", label: "image (.png / .jpg / .webp)", supportsClipboard: !0, defaultOptions: { format: "png", scale: 1 } }) }, { format: "svg", label: "vector (.svg)", supportsClipboard: !0, createBlade: () => new He({ format: "svg", label: "vector (.svg)", supportsClipboard: !0, defaultOptions: { includeBackgroundRectangles: !0, drawMode: "fill", strokeWidth: 1 } }) }, { format: "gif", label: "animated GIF (.gif)", supportsClipboard: !1, createBlade: () => new ut({ format: "gif", label: "animated GIF (.gif)", supportsClipboard: !1, defaultOptions: { frameCount: 300, frameRate: 60, scale: 1, repeat: 0 } }) }, { format: "video", label: "video (.webm)", supportsClipboard: !1, createBlade: () => new pt({ format: "video", label: "video (.webm)", supportsClipboard: !1, defaultOptions: { frameCount: 480, frameRate: 60, quality: 0.7 } }) }];
+function Qe() {
+  return je;
+}
+function Xe(n, t) {
+  const e = Qe(), r = e[0]?.format, a = new Ne(Ge(r)), i = new Ue(), s = new Re(n, t, a, i, e);
+  return s.$mount(), s;
+}
+const zt = { name: "textmode.export", version: "1.2.1", async install(n, t) {
+  const e = { saveCanvas: async (l = {}) => new bt().$saveImage(n.canvas, l), copyCanvas: async (l = {}) => new bt().$copyImageToClipboard(n.canvas, l), saveSVG: (l = {}) => {
+    new gt().$saveSVG(n, l);
+  }, saveStrings: (l = {}) => {
+    new vt().$saveTXT(n, l);
+  }, toSVG: (l = {}) => new gt().$generateSVG(n, l), toString: (l = {}) => new vt().$generateTXT(n, l), saveGIF: async (l = {}) => new fe(n, t.registerPostDrawHook).$saveGIF(l), saveWEBM: async (l = {}) => new Ee(n, t.registerPostDrawHook).$saveWEBM(l) }, r = Xe(n, e), a = { show: () => r.show(), hide: () => r.hide(), toggle: () => r.toggle(), isVisible: () => r.isVisible() }, i = { ...e, exportOverlay: a }, s = n;
+  Object.assign(s, i), s._exportOverlayController = r;
+}, async uninstall(n) {
+  const t = n;
+  t._exportOverlayController?.$dispose(), delete t._exportOverlayController;
+  const r = ["exportOverlay", "saveCanvas", "copyCanvas", "saveSVG", "saveStrings", "toSVG", "toString", "saveGIF", "saveWEBM"];
+  for (const a of r) delete t[a];
+} }, Ye = (n = {}) => {
+  const t = n.overlay ?? !0, e = { ...zt }, r = e.install;
+  return e.install = async (a, i) => {
+    const s = a;
+    await r.call(e, s, i), t || s.exportOverlay?.hide();
+  }, e;
 };
-typeof window < "u" && (window.createTextmodeExportPlugin = Xe);
+typeof window < "u" && (window.ExportPlugin = zt, window.createTextmodeExportPlugin = Ye);
 export {
-  Xe as createTextmodeExportPlugin
+  zt as ExportPlugin,
+  Ye as createTextmodeExportPlugin
 };