@44-audio/components 0.1.0-dev.11 → 0.1.0-dev.13

package/dist/recorder.es.js

@@ -1,367 +1,367 @@
-import { h as Cr, C as Dr, D as Sr, E as Ar, F as Mr, G as zr, H as Pr, I as Fr, J as Nr, T as Or, K as kr, L as Ur, M as Br, N as Q, O as Hr, P as jr, d as mr, c as nr, p as cr, a as dr, b as N, l as P, Q as Ir, y as Gr, f as $, g as E, e as S, i as z, z as Kr, q as O, j as u, k as lr, s as w, n as a, m as U, r as L, B as Vr, R as Wr, u as or, S as Z, U as ar, v as sr, V as Xr, W as Jr, o as X, w as ir, x as tr, X as hr, A as Qr, Y as Yr } from "./AudioPlayer-Bha1JWsp.mjs";
-function Zr(e, r, i, d, o) {
-  Cr && Dr();
-  var s = r.$$slots?.[i], v = !1;
-  s === !0 && (s = r.children, v = !0), s === void 0 || s(e, v ? () => d : d);
+import { B as Pr, C as Or, D as Ur, E as Br, F as Hr, G as jr, H as Gr, I as Vr, J as Wr, T as Jr, K as Er, L as Kr, M as Xr, N as Z, O as Qr, P as Yr, d as Lr, c as lr, p as fr, a as vr, b as B, h as P, Q as Sr, w as Tr, f as T, k as C, m as O, i as F, x as Zr, t as G, e as m, g as ur, s as b, l as t, j as H, r as $, z as re, R as ee, S as te, U as tr, u as nr, V as cr, o as _r, W as oe, n as X, q as dr, v as rr, X as ae, Y as xr, A as se, Z as ie } from "./AudioPlayer-DW6UJXCt.mjs";
+function ne(o, r, a, s, d) {
+  Pr && Or();
+  var e = r.$$slots?.[a], v = !1;
+  e === !0 && (e = r.children, v = !0), e === void 0 || e(o, v ? () => s : s);
 }
-const re = () => performance.now(), F = {
+const ce = () => performance.now(), U = {
   // don't access requestAnimationFrame eagerly outside method
   // this allows basic testing of user code without JSDOM
   // bunder will eval and remove ternary when the user's app is built
   tick: (
     /** @param {any} _ */
-    (e) => requestAnimationFrame(e)
+    (o) => requestAnimationFrame(o)
   ),
-  now: () => re(),
+  now: () => ce(),
   tasks: /* @__PURE__ */ new Set()
 };
-function qr() {
-  const e = F.now();
-  F.tasks.forEach((r) => {
-    r.c(e) || (F.tasks.delete(r), r.f());
-  }), F.tasks.size !== 0 && F.tick(qr);
+function Cr() {
+  const o = U.now();
+  U.tasks.forEach((r) => {
+    r.c(o) || (U.tasks.delete(r), r.f());
+  }), U.tasks.size !== 0 && U.tick(Cr);
 }
-function ee(e) {
+function de(o) {
   let r;
-  return F.tasks.size === 0 && F.tick(qr), {
-    promise: new Promise((i) => {
-      F.tasks.add(r = { c: e, f: i });
+  return U.tasks.size === 0 && U.tick(Cr), {
+    promise: new Promise((a) => {
+      U.tasks.add(r = { c: o, f: a });
     }),
     abort() {
-      F.tasks.delete(r);
+      U.tasks.delete(r);
     }
   };
 }
-function er(e, r) {
-  kr(() => {
-    e.dispatchEvent(new CustomEvent(r));
+function ir(o, r) {
+  Er(() => {
+    o.dispatchEvent(new CustomEvent(r));
   });
 }
-function te(e) {
-  if (e === "float") return "cssFloat";
-  if (e === "offset") return "cssOffset";
-  if (e.startsWith("--")) return e;
-  const r = e.split("-");
+function le(o) {
+  if (o === "float") return "cssFloat";
+  if (o === "offset") return "cssOffset";
+  if (o.startsWith("--")) return o;
+  const r = o.split("-");
   return r.length === 1 ? r[0] : r[0] + r.slice(1).map(
     /** @param {any} word */
-    (i) => i[0].toUpperCase() + i.slice(1)
+    (a) => a[0].toUpperCase() + a.slice(1)
   ).join("");
 }
-function _r(e) {
-  const r = {}, i = e.split(";");
-  for (const d of i) {
-    const [o, s] = d.split(":");
-    if (!o || s === void 0) break;
-    const v = te(o.trim());
-    r[v] = s.trim();
+function kr(o) {
+  const r = {}, a = o.split(";");
+  for (const s of a) {
+    const [d, e] = s.split(":");
+    if (!d || e === void 0) break;
+    const v = le(d.trim());
+    r[v] = e.trim();
   }
   return r;
 }
-const oe = (e) => e;
-function gr(e, r, i, d) {
-  var o = (e & Hr) !== 0, s = (e & jr) !== 0, v = o && s, p = (e & Or) !== 0, C = v ? "both" : o ? "in" : "out", l, y = r.inert, _ = r.style.overflow, h, x;
-  function T() {
-    return kr(() => l ??= i()(r, d?.() ?? /** @type {P} */
+const fe = (o) => o;
+function br(o, r, a, s) {
+  var d = (o & Qr) !== 0, e = (o & Yr) !== 0, v = d && e, g = (o & Jr) !== 0, D = v ? "both" : d ? "in" : "out", u, _ = r.inert, w = r.style.overflow, y, q;
+  function I() {
+    return Er(() => u ??= a()(r, s?.() ?? /** @type {P} */
     {}, {
-      direction: C
+      direction: D
     }));
   }
-  var t = {
-    is_global: p,
+  var n = {
+    is_global: g,
     in() {
-      if (r.inert = y, !o) {
-        x?.abort(), x?.reset?.();
+      if (r.inert = _, !d) {
+        q?.abort(), q?.reset?.();
         return;
       }
-      s || h?.abort(), er(r, "introstart"), h = br(r, T(), x, 1, () => {
-        er(r, "introend"), h?.abort(), h = l = void 0, r.style.overflow = _;
+      e || y?.abort(), ir(r, "introstart"), y = hr(r, I(), q, 1, () => {
+        ir(r, "introend"), y?.abort(), y = u = void 0, r.style.overflow = w;
       });
     },
-    out(I) {
-      if (!s) {
-        I?.(), l = void 0;
+    out(x) {
+      if (!e) {
+        x?.(), u = void 0;
         return;
       }
-      r.inert = !0, er(r, "outrostart"), x = br(r, T(), h, 0, () => {
-        er(r, "outroend"), I?.();
+      r.inert = !0, ir(r, "outrostart"), q = hr(r, I(), y, 0, () => {
+        ir(r, "outroend"), x?.();
       });
     },
     stop: () => {
-      h?.abort(), x?.abort();
+      y?.abort(), q?.abort();
     }
-  }, n = (
+  }, f = (
     /** @type {Effect} */
-    Sr
+    Ur
   );
-  if ((n.transitions ??= []).push(t), o && Ar) {
-    var b = p;
-    if (!b) {
-      for (var f = (
+  if ((f.transitions ??= []).push(n), d && Br) {
+    var l = g;
+    if (!l) {
+      for (var p = (
         /** @type {Effect | null} */
-        n.parent
-      ); f && (f.f & Mr) !== 0; )
-        for (; (f = f.parent) && (f.f & zr) === 0; )
+        f.parent
+      ); p && (p.f & Hr) !== 0; )
+        for (; (p = p.parent) && (p.f & jr) === 0; )
           ;
-      b = !f || (f.f & Pr) !== 0;
+      l = !p || (p.f & Gr) !== 0;
     }
-    b && Fr(() => {
-      Nr(() => t.in());
+    l && Vr(() => {
+      Wr(() => n.in());
     });
   }
 }
-function br(e, r, i, d, o) {
-  var s = d === 1;
-  if (Ur(r)) {
-    var v, p = !1;
-    return Br(() => {
-      if (!p) {
-        var n = r({ direction: s ? "in" : "out" });
-        v = br(e, n, i, d, o);
+function hr(o, r, a, s, d) {
+  var e = s === 1;
+  if (Kr(r)) {
+    var v, g = !1;
+    return Xr(() => {
+      if (!g) {
+        var f = r({ direction: e ? "in" : "out" });
+        v = hr(o, f, a, s, d);
       }
     }), {
       abort: () => {
-        p = !0, v?.abort();
+        g = !0, v?.abort();
       },
       deactivate: () => v.deactivate(),
       reset: () => v.reset(),
       t: () => v.t()
     };
   }
-  if (i?.deactivate(), !r?.duration)
-    return o(), {
-      abort: Q,
-      deactivate: Q,
-      reset: Q,
-      t: () => d
+  if (a?.deactivate(), !r?.duration)
+    return d(), {
+      abort: Z,
+      deactivate: Z,
+      reset: Z,
+      t: () => s
     };
-  const { delay: C = 0, css: l, tick: y, easing: _ = oe } = r;
-  var h = [];
-  if (s && i === void 0 && (y && y(0, 1), l)) {
-    var x = _r(l(0, 1));
-    h.push(x, x);
+  const { delay: D = 0, css: u, tick: _, easing: w = fe } = r;
+  var y = [];
+  if (e && a === void 0 && (_ && _(0, 1), u)) {
+    var q = kr(u(0, 1));
+    y.push(q, q);
   }
-  var T = () => 1 - d, t = e.animate(h, { duration: C, fill: "forwards" });
-  return t.onfinish = () => {
-    t.cancel();
-    var n = i?.t() ?? 1 - d;
-    i?.abort();
-    var b = d - n, f = (
+  var I = () => 1 - s, n = o.animate(y, { duration: D, fill: "forwards" });
+  return n.onfinish = () => {
+    n.cancel();
+    var f = a?.t() ?? 1 - s;
+    a?.abort();
+    var l = s - f, p = (
       /** @type {number} */
-      r.duration * Math.abs(b)
-    ), I = [];
-    if (f > 0) {
-      var B = !1;
-      if (l)
-        for (var H = Math.ceil(f / 16.666666666666668), k = 0; k <= H; k += 1) {
-          var c = n + b * _(k / H), g = _r(l(c, 1 - c));
-          I.push(g), B ||= g.overflow === "hidden";
+      r.duration * Math.abs(l)
+    ), x = [];
+    if (p > 0) {
+      var A = !1;
+      if (u)
+        for (var E = Math.ceil(p / 16.666666666666668), h = 0; h <= E; h += 1) {
+          var k = f + l * w(h / E), i = kr(u(k, 1 - k));
+          x.push(i), A ||= i.overflow === "hidden";
         }
-      B && (e.style.overflow = "hidden"), T = () => {
-        var m = (
+      A && (o.style.overflow = "hidden"), I = () => {
+        var c = (
           /** @type {number} */
           /** @type {globalThis.Animation} */
-          t.currentTime
+          n.currentTime
         );
-        return n + b * _(m / f);
-      }, y && ee(() => {
-        if (t.playState !== "running") return !1;
-        var m = T();
-        return y(m, 1 - m), !0;
+        return f + l * w(c / p);
+      }, _ && de(() => {
+        if (n.playState !== "running") return !1;
+        var c = I();
+        return _(c, 1 - c), !0;
       });
     }
-    t = e.animate(I, { duration: f, fill: "forwards" }), t.onfinish = () => {
-      T = () => d, y?.(d, 1 - d), o();
+    n = o.animate(x, { duration: p, fill: "forwards" }), n.onfinish = () => {
+      I = () => s, _?.(s, 1 - s), d();
     };
   }, {
     abort: () => {
-      t && (t.cancel(), t.effect = null, t.onfinish = Q);
+      n && (n.cancel(), n.effect = null, n.onfinish = Z);
     },
     deactivate: () => {
-      o = Q;
+      d = Z;
     },
     reset: () => {
-      d === 0 && y?.(1, 0);
+      s === 0 && _?.(1, 0);
     },
-    t: () => T()
+    t: () => I()
   };
 }
-const ae = (e) => e;
-function se(e) {
-  const r = e - 1;
+const ve = (o) => o;
+function ue(o) {
+  const r = o - 1;
   return r * r * r + 1;
 }
-function wr(e) {
-  const r = typeof e == "string" && e.match(/^\s*(-?[\d.]+)([^\s]*)\s*$/);
+function qr(o) {
+  const r = typeof o == "string" && o.match(/^\s*(-?[\d.]+)([^\s]*)\s*$/);
   return r ? [parseFloat(r[1]), r[2] || "px"] : [
     /** @type {number} */
-    e,
+    o,
     "px"
   ];
 }
-function ie(e, { delay: r = 0, duration: i = 400, easing: d = ae } = {}) {
-  const o = +getComputedStyle(e).opacity;
+function pe(o, { delay: r = 0, duration: a = 400, easing: s = ve } = {}) {
+  const d = +getComputedStyle(o).opacity;
   return {
     delay: r,
-    duration: i,
-    easing: d,
-    css: (s) => `opacity: ${s * o}`
+    duration: a,
+    easing: s,
+    css: (e) => `opacity: ${e * d}`
   };
 }
-function xr(e, { delay: r = 0, duration: i = 400, easing: d = se, x: o = 0, y: s = 0, opacity: v = 0 } = {}) {
-  const p = getComputedStyle(e), C = +p.opacity, l = p.transform === "none" ? "" : p.transform, y = C * (1 - v), [_, h] = wr(o), [x, T] = wr(s);
+function Ir(o, { delay: r = 0, duration: a = 400, easing: s = ue, x: d = 0, y: e = 0, opacity: v = 0 } = {}) {
+  const g = getComputedStyle(o), D = +g.opacity, u = g.transform === "none" ? "" : g.transform, _ = D * (1 - v), [w, y] = qr(d), [q, I] = qr(e);
   return {
     delay: r,
-    duration: i,
-    easing: d,
-    css: (t, n) => `
-			transform: ${l} translate(${(1 - t) * _}${h}, ${(1 - t) * x}${T});
-			opacity: ${C - y * n}`
+    duration: a,
+    easing: s,
+    css: (n, f) => `
+			transform: ${u} translate(${(1 - n) * w}${y}, ${(1 - n) * q}${I});
+			opacity: ${D - _ * f}`
   };
 }
-async function ne(e, r, i, d) {
-  w(r, !a(r)), a(i).length || await d();
+async function ge(o, r, a, s) {
+  b(r, !t(r)), t(a).length || await s();
 }
-var ce = $("<li><button> </button></li>"), de = $('<li><button class="devices-select__option svelte-q87ygv" disabled>No microphones found</button></li>'), le = $('<li><button class="devices-select__option svelte-q87ygv" disabled>Loading Microphones...</button></li>'), fe = $('<ul role="listbox" aria-label="Select microphone"><!> <!> <!></ul>'), ve = $('<div class="container" role="group" aria-label="Audio recorder"><button class="devices-btn svelte-q87ygv" aria-haspopup="listbox"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="devices-btn__icon svelte-q87ygv"><path d="M201.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 338.7 54.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"></path></svg></button> <!></div>');
-const ue = {
+var ye = T("<li><button> </button></li>"), me = T('<li><button class="devices-select__option svelte-q87ygv" disabled>No microphones found</button></li>'), be = T('<li><button class="devices-select__option svelte-q87ygv" disabled>Loading Microphones...</button></li>'), he = T('<ul role="listbox" aria-label="Select microphone"><!> <!> <!></ul>'), _e = T('<div class="container" role="group" aria-label="Audio recorder"><button class="devices-btn svelte-q87ygv" aria-haspopup="listbox"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="devices-btn__icon svelte-q87ygv"><path d="M201.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 338.7 54.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"></path></svg></button> <!></div>');
+const we = {
   hash: "svelte-q87ygv",
   code: '.devices-btn.svelte-q87ygv {background:none;border:none;font-size:inherit;cursor:pointer;color:inherit;}.devices-btn__icon.svelte-q87ygv {width:0.75rem;height:0.75rem;fill:var(--fortyfour-recorder-btn-color);}.devices-select.svelte-q87ygv {display:none;flex-direction:column;list-style:none;margin:0;padding:0;border:var(--fortyfour-recorder-select-border);box-shadow:var(--fortyfour-recorder-select-shadow);border-radius:var(--fortyfour-recorder-select-radius);background:var(--fortyfour-recorder-select-bg);position:absolute;z-index:2147483647;overflow-y:auto;width:11rem;max-height:12rem;}.devices-select--is-open.svelte-q87ygv {display:flex;}.devices-select__option.svelte-q87ygv {padding:0.5rem 1rem;padding-left:0;background:none;border:none;text-align:left;cursor:pointer;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background 0.1s;font:inherit;font-size:var(--fortyfour-recorder-select-font-size);color:var(--fortyfour-recorder-select-color);}.devices-select__option.svelte-q87ygv:hover {background:var(--fortyfour-recorder-select-bg-hover);}.devices-select__option.svelte-q87ygv::before {content:"";display:inline-block;width:2ch;text-align:center;padding:0 0.25rem;}.devices-select__option--is-selected.svelte-q87ygv::before {content:"✓";}.devices-select__option.svelte-q87ygv:disabled {opacity:0.5;cursor:inherit;}.devices-select__option.svelte-q87ygv:disabled:hover {background:inherit;}'
 };
-function Er(e, r) {
-  cr(r, !0), dr(e, ue);
-  let i = N(r, "deviceId", 15, ""), d = N(r, "disabled", 7, !1), o = P(Ir([])), s = P(!1), v = P(!1), p;
-  Gr(() => {
-    function t(n) {
-      n.composedPath().includes(p) || a(s) && w(s, !1);
+function $r(o, r) {
+  fr(r, !0), vr(o, we);
+  let a = B(r, "deviceId", 15, ""), s = B(r, "disabled", 7, !1), d = P(Sr([])), e = P(!1), v = P(!1), g;
+  Tr(() => {
+    function n(f) {
+      f.composedPath().includes(g) || t(e) && b(e, !1);
     }
-    return document.addEventListener("pointerdown", t), () => {
-      document.removeEventListener("pointerdown", t);
+    return document.addEventListener("pointerdown", n), () => {
+      document.removeEventListener("pointerdown", n);
     };
   });
-  async function C() {
+  async function D() {
     try {
-      w(v, !0), (await navigator.mediaDevices.getUserMedia({ audio: !0 })).getTracks().forEach((n) => n.stop()), w(o, await navigator.mediaDevices.enumerateDevices(), !0), w(
-        o,
-        a(o).filter((n) => n.deviceId).filter((n) => n.kind === "audioinput").map((n, b) => ({
-          deviceId: n.deviceId,
-          label: n.label || `Microphone ${b + 1}`
+      b(v, !0), (await navigator.mediaDevices.getUserMedia({ audio: !0 })).getTracks().forEach((f) => f.stop()), b(d, await navigator.mediaDevices.enumerateDevices(), !0), b(
+        d,
+        t(d).filter((f) => f.deviceId).filter((f) => f.kind === "audioinput").map((f, l) => ({
+          deviceId: f.deviceId,
+          label: f.label || `Microphone ${l + 1}`
         })),
         !0
-      ), !i() && a(o).length && i(a(o)[0].deviceId), a(o).sort((n, b) => n.label.localeCompare(b.label)), w(v, !1);
-    } catch (t) {
-      console.error("Error accessing microphones:", t);
+      ), !a() && t(d).length && a(t(d)[0].deviceId), t(d).sort((f, l) => f.label.localeCompare(l.label)), b(v, !1);
+    } catch (n) {
+      console.error("Error accessing microphones:", n);
     }
   }
-  function l(t) {
+  function u(n) {
     return () => {
-      i(t), w(s, !1);
+      a(n), b(e, !1);
     };
   }
-  var y = {
+  var _ = {
     get deviceId() {
-      return i();
+      return a();
     },
-    set deviceId(t = "") {
-      i(t), U();
+    set deviceId(n = "") {
+      a(n), H();
     },
     get disabled() {
-      return d();
+      return s();
     },
-    set disabled(t = !1) {
-      d(t), U();
+    set disabled(n = !1) {
+      s(n), H();
     }
-  }, _ = ve(), h = E(_);
-  h.__click = [ne, s, o, C];
-  var x = S(h, 2);
+  }, w = _e(), y = C(w);
+  y.__click = [ge, e, d, D];
+  var q = O(y, 2);
   {
-    var T = (t) => {
-      var n = fe(), b = E(n);
-      Wr(b, 17, () => a(o), Xr, (k, c) => {
-        var g = ce(), m = E(g), A = or(() => l(a(c).deviceId));
-        m.__click = function(...R) {
-          a(A)?.apply(this, R);
+    var I = (n) => {
+      var f = he(), l = C(f);
+      ee(l, 17, () => t(d), te, (h, k) => {
+        var i = ye(), c = C(i), L = nr(() => u(t(k).deviceId));
+        c.__click = function(...z) {
+          t(L)?.apply(this, z);
         };
-        var q = E(m, !0);
-        L(m), L(g), O(() => {
-          Z(
-            m,
+        var R = C(c, !0);
+        $(c), $(i), G(() => {
+          tr(
+            c,
             1,
-            ar([
+            cr([
               "devices-select__option",
-              a(c).deviceId === i() && "devices-select__option--is-selected"
+              t(k).deviceId === a() && "devices-select__option--is-selected"
             ]),
             "svelte-q87ygv"
-          ), m.disabled = d(), sr(q, a(c).label);
-        }), u(k, g);
+          ), c.disabled = s(), _r(R, t(k).label);
+        }), m(h, i);
       });
-      var f = S(b, 2);
+      var p = O(l, 2);
       {
-        var I = (k) => {
-          var c = de();
-          u(k, c);
+        var x = (h) => {
+          var k = me();
+          m(h, k);
         };
-        z(f, (k) => {
-          !a(o).length && !a(v) && k(I);
+        F(p, (h) => {
+          !t(d).length && !t(v) && h(x);
         });
       }
-      var B = S(f, 2);
+      var A = O(p, 2);
       {
-        var H = (k) => {
-          var c = le();
-          u(k, c);
+        var E = (h) => {
+          var k = be();
+          m(h, k);
         };
-        z(B, (k) => {
-          a(v) && k(H);
+        F(A, (h) => {
+          t(v) && h(E);
         });
       }
-      L(n), O(() => Z(n, 1, `devices-select ${a(s) ? "devices-select--is-open" : ""}`, "svelte-q87ygv")), gr(3, n, () => ie, () => ({ duration: 100 })), u(t, n);
+      $(f), G(() => tr(f, 1, `devices-select ${t(e) ? "devices-select--is-open" : ""}`, "svelte-q87ygv")), br(3, f, () => pe, () => ({ duration: 100 })), m(n, f);
     };
-    z(x, (t) => {
-      a(s) && t(T);
+    F(q, (n) => {
+      t(e) && n(I);
     });
   }
-  return L(_), Kr(_, (t) => p = t, () => p), O(() => Vr(h, "aria-expanded", a(s))), u(e, _), lr(y);
+  return $(w), Zr(w, (n) => g = n, () => g), G(() => re(y, "aria-expanded", t(e))), m(o, w), ur(_);
 }
-mr(["click"]);
-nr(Er, { deviceId: {}, disabled: {} }, [], [], !0);
-var pe = $("<button><!></button>");
-const ye = {
+Lr(["click"]);
+lr($r, { deviceId: {}, disabled: {} }, [], [], !0);
+var xe = T("<button><!></button>");
+const ke = {
   hash: "svelte-f3ispq",
   code: ".btn.svelte-f3ispq {display:flex;align-items:center;gap:var(--fortyfour-recorder-btn-gap);font:inherit;border:none;padding:var(--fortyfour-recorder-btn-padding);border-radius:var(--fortyfour-recorder-btn-radius);background:var(--fortyfour-recorder-btn-bg);color:var(--fortyfour-recorder-btn-color);cursor:pointer;}.btn.svelte-f3ispq:hover {background:var(--fortyfour-recorder-btn-bg-hover);color:var(--fortyfour-recorder-btn-color-hover);}.btn.btn--recording.svelte-f3ispq {background:var(--fortyfour-recorder-red-bg);color:var(--fortyfour-recorder-red-color);}.btn.btn--primary.svelte-f3ispq {background:var(--fortyfour-recorder-btn-primary-bg);color:var(--fortyfour-recorder-btn-primary-color);}.btn.btn--primary.svelte-f3ispq:hover {background:var(--fortyfour-recorder-btn-primary-bg-hover);color:var(--fortyfour-recorder-btn-primary-color-hover);}"
 };
-function Y(e, r) {
-  cr(r, !0), dr(e, ye);
-  const i = N(r, "type", 7), d = N(r, "onclick", 7, () => {
+function er(o, r) {
+  fr(r, !0), vr(o, ke);
+  const a = B(r, "type", 7), s = B(r, "onclick", 7, () => {
   });
-  var o = {
+  var d = {
     get type() {
-      return i();
+      return a();
     },
-    set type(p) {
-      i(p), U();
+    set type(g) {
+      a(g), H();
     },
     get onclick() {
-      return d();
+      return s();
     },
-    set onclick(p = () => {
+    set onclick(g = () => {
     }) {
-      d(p), U();
+      s(g), H();
     }
-  }, s = pe();
-  s.__click = function(...p) {
-    d()?.apply(this, p);
+  }, e = xe();
+  e.__click = function(...g) {
+    s()?.apply(this, g);
   };
-  var v = E(s);
-  return Zr(v, r, "default", {}), L(s), O(() => Z(s, 1, ar(["btn", i() && `btn--${i()}`]), "svelte-f3ispq")), u(e, s), lr(o);
+  var v = C(e);
+  return ne(v, r, "default", {}), $(e), G(() => tr(e, 1, cr(["btn", a() && `btn--${a()}`]), "svelte-f3ispq")), m(o, e), ur(d);
 }
-mr(["click"]);
-nr(Y, { type: {}, onclick: {} }, ["default"], [], !0);
-var ge = $("<div></div> <!>", 1), be = $('<div class="time-elapsed svelte-11ls49v"> </div>'), me = $('<div role="group" aria-label="Audio recorder"><!> <!> <!></div>');
-const he = {
-  hash: "svelte-11ls49v",
-  code: `.container.svelte-11ls49v {display:flex;align-items:center;gap:1rem;}.record-icon.svelte-11ls49v {width:1.25rem;height:1.25rem;background:var(--fortyfour-recorder-red-bg);border-radius:50%;}.record-icon--is-recording.svelte-11ls49v {background:var(--fortyfour-recorder-red-color);
-    animation: svelte-11ls49v-pulse 2s infinite ease-out;}.time-elapsed.svelte-11ls49v {font-variant-numeric:tabular-nums;}
+Lr(["click"]);
+lr(er, { type: {}, onclick: {} }, ["default"], [], !0);
+var qe = T("<div></div> <!>", 1), Ie = T('<div class="recording-info svelte-fc16qh"><div class="live-waveform svelte-fc16qh"><!></div> <div class="time-elapsed svelte-fc16qh"> </div></div>'), Ee = T('<div role="group" aria-label="Audio recorder"><!> <!> <!></div>');
+const Le = {
+  hash: "svelte-fc16qh",
+  code: `.container.svelte-fc16qh {display:flex;align-items:center;gap:1rem;min-height:56px;}.record-icon.svelte-fc16qh {width:1.25rem;height:1.25rem;background:var(--fortyfour-recorder-red-bg);border-radius:50%;}.record-icon--is-recording.svelte-fc16qh {background:var(--fortyfour-recorder-red-color);
+    animation: svelte-fc16qh-pulse 2s infinite ease-out;}.recording-info.svelte-fc16qh {display:flex;align-items:center;gap:0.5rem;flex:1;min-width:0;}.live-waveform.svelte-fc16qh {flex:1;min-width:0;}.time-elapsed.svelte-fc16qh {font-variant-numeric:tabular-nums;flex-shrink:0;}
 
-  @keyframes svelte-11ls49v-pulse {
+  @keyframes svelte-fc16qh-pulse {
     0% {
       transform: scale(1);
       box-shadow: 0 0 0 0 hsla(0, 100%, 100%, 0.7);
@@ -375,317 +375,381 @@ const he = {
     }
   }`
 };
-function Lr(e, r) {
-  cr(r, !0), dr(e, he);
-  let i = N(r, "deviceId", 15, ""), d = N(r, "onDone", 7), o = P(Ir({
+function Ar(o, r) {
+  fr(r, !0), vr(o, Le);
+  let a = B(r, "deviceId", 15, ""), s = B(r, "onDone", 7);
+  const d = 100;
+  let e = P(Sr({
     state: "ready",
     // "ready", "recording"
     timeElapsed: 0,
-    error: null
-  })), s;
-  Jr(() => {
-    s?.stop();
+    error: null,
+    waveformSamples: []
+  })), v, g;
+  oe(() => {
+    v?.stop();
+  }), Tr(() => {
+    function l() {
+      document.hidden && t(e).state === "recording" && _();
+    }
+    return document.addEventListener("visibilitychange", l), () => {
+      document.removeEventListener("visibilitychange", l);
+    };
   });
-  function v() {
-    a(o).state === "ready" ? p() : a(o).state === "recording" && C();
+  function D() {
+    t(e).state === "ready" ? u() : t(e).state === "recording" && _();
   }
-  async function p() {
-    const t = await navigator.mediaDevices.getUserMedia({
-      audio: { deviceId: i() ? { exact: i() } : void 0 }
-    }), n = [];
-    s = new MediaRecorder(t), s.ondataavailable = (f) => n.push(f.data), s.onstop = () => {
-      a(o).state === "recording" && (t.getTracks().forEach((f) => f.stop()), d()(URL.createObjectURL(new Blob(n, { type: s.mimeType }))), a(o).state = "ready");
-    }, s.start();
-    const b = () => {
-      a(o).state === "recording" && (a(o).timeElapsed += 1, setTimeout(b, 1e3));
+  async function u() {
+    const l = await navigator.mediaDevices.getUserMedia({
+      audio: {
+        deviceId: a() ? { exact: a() } : void 0,
+        autoGainControl: !0,
+        noiseSuppression: !0
+      }
+    }), p = [];
+    v = new MediaRecorder(l), v.ondataavailable = (c) => p.push(c.data), g = new AudioContext();
+    const x = g.createAnalyser();
+    x.fftSize = 256, g.createMediaStreamSource(l).connect(x);
+    const E = new Uint8Array(x.frequencyBinCount);
+    let h = 0;
+    function k(c) {
+      if (t(e).state !== "recording") return;
+      x.getByteTimeDomainData(E);
+      let L = 0;
+      for (let S = 0; S < E.length; S++) {
+        const M = (E[S] - 128) / 128;
+        L += M * M;
+      }
+      const R = Math.sqrt(L / E.length), z = Math.min(1, R * 4);
+      c - h >= d && (t(e).waveformSamples = [...t(e).waveformSamples, Math.round(z * 100)], h = c), requestAnimationFrame(k);
+    }
+    v.onstop = () => {
+      if (t(e).state !== "recording")
+        return;
+      l.getTracks().forEach((L) => L.stop()), g?.close();
+      const c = t(e).waveformSamples;
+      t(e).waveformSamples = [], s()({
+        url: URL.createObjectURL(new Blob(p, { type: v.mimeType })),
+        waveform: c
+      }), t(e).state = "ready";
+    }, v.start();
+    const i = () => {
+      t(e).state === "recording" && (t(e).timeElapsed += 1, setTimeout(i, 1e3));
     };
-    setTimeout(b, 1e3), a(o).state = "recording";
+    setTimeout(i, 1e3), t(e).state = "recording", k();
   }
-  function C() {
-    s?.stop();
+  function _() {
+    v?.stop();
   }
-  var l = {
+  var w = {
     get deviceId() {
-      return i();
+      return a();
     },
-    set deviceId(t = "") {
-      i(t), U();
+    set deviceId(l = "") {
+      a(l), H();
     },
     get onDone() {
-      return d();
+      return s();
     },
-    set onDone(t) {
-      d(t), U();
+    set onDone(l) {
+      s(l), H();
     }
-  }, y = me(), _ = E(y);
+  }, y = Ee(), q = C(y);
   {
-    let t = or(() => a(o).state === "recording" && "recording");
-    Y(_, {
-      onclick: v,
+    let l = nr(() => t(e).state === "recording" && "recording");
+    er(q, {
+      onclick: D,
       get type() {
-        return a(t);
+        return t(l);
       },
-      children: (n, b) => {
-        var f = ge(), I = X(f), B = S(I, 2);
+      children: (p, x) => {
+        var A = qe(), E = X(A), h = O(E, 2);
         {
-          var H = (c) => {
-            var g = ir("Record");
-            u(c, g);
-          }, k = (c) => {
-            var g = tr(), m = X(g);
+          var k = (c) => {
+            var L = dr("Record");
+            m(c, L);
+          }, i = (c) => {
+            var L = rr(), R = X(L);
             {
-              var A = (q) => {
-                var R = ir("Recording");
-                u(q, R);
+              var z = (S) => {
+                var M = dr("Recording");
+                m(S, M);
               };
-              z(
-                m,
-                (q) => {
-                  a(o).state === "recording" && q(A);
+              F(
+                R,
+                (S) => {
+                  t(e).state === "recording" && S(z);
                 },
                 !0
               );
             }
-            u(c, g);
+            m(c, L);
           };
-          z(B, (c) => {
-            a(o).state === "ready" ? c(H) : c(k, !1);
+          F(h, (c) => {
+            t(e).state === "ready" ? c(k) : c(i, !1);
           });
         }
-        O(() => Z(
-          I,
+        G(() => tr(
+          E,
           1,
-          ar([
+          cr([
             "record-icon",
-            a(o).state === "recording" && "record-icon--is-recording"
+            t(e).state === "recording" && "record-icon--is-recording"
           ]),
-          "svelte-11ls49v"
-        )), u(n, f);
+          "svelte-fc16qh"
+        )), m(p, A);
       },
       $$slots: { default: !0 }
     });
   }
-  var h = S(_, 2);
+  var I = O(q, 2);
   {
-    let t = or(() => a(o).state === "recording");
-    Er(h, {
+    let l = nr(() => t(e).state === "recording");
+    $r(I, {
       get disabled() {
-        return a(t);
+        return t(l);
       },
       get deviceId() {
-        return i();
+        return a();
       },
-      set deviceId(n) {
-        i(n);
+      set deviceId(p) {
+        a(p);
       }
     });
   }
-  var x = S(h, 2);
+  var n = O(I, 2);
   {
-    var T = (t) => {
-      var n = be(), b = E(n);
-      L(n), O((f, I) => sr(b, `${f ?? ""}:${I ?? ""}`), [
-        () => Math.floor(a(o).timeElapsed / 60).toString(),
-        () => (a(o).timeElapsed % 60).toString().padStart(2, "0")
-      ]), u(t, n);
+    var f = (l) => {
+      var p = Ie(), x = C(p), A = C(x);
+      ae(A, {
+        get data() {
+          return t(e).waveformSamples;
+        }
+      }), $(x);
+      var E = O(x, 2), h = C(E);
+      $(E), $(p), G((k, i) => _r(h, `${k ?? ""}:${i ?? ""}`), [
+        () => Math.floor(t(e).timeElapsed / 60).toString(),
+        () => (t(e).timeElapsed % 60).toString().padStart(2, "0")
+      ]), m(l, p);
     };
-    z(x, (t) => {
-      a(o).state === "recording" && t(T);
+    F(n, (l) => {
+      t(e).state === "recording" && l(f);
     });
   }
-  return L(y), O(() => Z(
+  return $(y), G(() => tr(
     y,
     1,
-    ar([
+    cr([
       "container",
-      a(o).state === "recording" && "is-recording"
+      t(e).state === "recording" && "is-recording"
     ]),
-    "svelte-11ls49v"
-  )), u(e, y), lr(l);
+    "svelte-fc16qh"
+  )), m(o, y), ur(w);
 }
-nr(Lr, { deviceId: {}, onDone: {} }, [], [], !0);
-var _e = $('<div><p>Recording saved! ID:</p> <pre><code> </code></pre></div> <p><button class="primary">Record Again</button></p>', 1), we = $("<p>Processing your recording…</p>"), xe = $('<div class="error svelte-16qftx0"><p class="svelte-16qftx0"> </p> <!></div>'), ke = Yr('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" style="fill: currentColor; width: 1em; height: 1em;"><path d="M232.7 69.9L224 96L128 96C110.3 96 96 110.3 96 128C96 145.7 110.3 160 128 160L512 160C529.7 160 544 145.7 544 128C544 110.3 529.7 96 512 96L416 96L407.3 69.9C402.9 56.8 390.7 48 376.9 48L263.1 48C249.3 48 237.1 56.8 232.7 69.9zM512 208L128 208L149.1 531.1C150.7 556.4 171.7 576 197 576L443 576C468.3 576 489.3 556.4 490.9 531.1L512 208z"></path></svg>'), Ie = $('<div class="confirm svelte-16qftx0"><!> <!> <!></div>'), qe = $('<div class="row"><!></div>'), Ee = $('<div class="recorder svelte-16qftx0" role="group" aria-label="44 audio recorder"><!></div>');
-const Le = {
-  hash: "svelte-16qftx0",
+lr(Ar, { deviceId: {}, onDone: {} }, [], [], !0);
+var Se = T('<p class="status-message svelte-14spe77">Recording saved successfully!</p>'), Te = T('<p class="status-message svelte-14spe77">Uploading...</p>'), Ce = T('<p class="status-message svelte-14spe77">Processing...</p>'), $e = T('<div class="error svelte-14spe77"><p class="svelte-14spe77"> </p> <!></div>'), Ae = ie('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" style="fill: currentColor; width: 1em; height: 1em;"><path d="M232.7 69.9L224 96L128 96C110.3 96 96 110.3 96 128C96 145.7 110.3 160 128 160L512 160C529.7 160 544 145.7 544 128C544 110.3 529.7 96 512 96L416 96L407.3 69.9C402.9 56.8 390.7 48 376.9 48L263.1 48C249.3 48 237.1 56.8 232.7 69.9zM512 208L128 208L149.1 531.1C150.7 556.4 171.7 576 197 576L443 576C468.3 576 489.3 556.4 490.9 531.1L512 208z"></path></svg>'), Re = T('<div class="confirm svelte-14spe77"><!> <div class="confirm-actions svelte-14spe77"><!> <!></div></div>'), Me = T('<div class="row"><!></div>'), De = T('<div class="recorder svelte-14spe77" role="group" aria-label="44 audio recorder"><!></div>');
+const ze = {
+  hash: "svelte-14spe77",
   code: `:host {--fortyfour-recorder-bg-0: #2d2d2d;--fortyfour-recorder-bg-1: #393939;--fortyfour-recorder-bg-2: #515151;--fortyfour-recorder-bg-primary: hsla(210, 50%, 60%, 1);--fortyfour-recorder-bg-primary-light: hsla(210, 55%, 64%, 1);--fortyfour-recorder-color-0: #d3d0c8;--fortyfour-recorder-color-primary: hsla(0, 0%, 100%, 0.9);--fortyfour-recorder-red-bg: #f2777a;--fortyfour-recorder-red-color: #ffffff;--fortyfour-recorder-font-size-lg: 1.25rem;--fortyfour-recorder-font-size-md: 1rem;--fortyfour-recorder-font-size-sm: 0.875rem;--fortyfour-recorder-font-size-xs: 0.6825rem;--fortyfour-recorder-radius-xl: 3rem;--fortyfour-recorder-radius-lg: 1rem;--fortyfour-recorder-radius-md: 0.5rem;--fortyfour-recorder-spacing-md: 1rem;--fortyfour-recorder-spacing-sm-1: 0.85rem;--fortyfour-recorder-spacing-sm: 0.5rem;--fortyfour-recorder-radius: var(--fortyfour-recorder-radius-lg);--fortyfour-recorder-bg: var(--fortyfour-recorder-bg-0);--fortyfour-recorder-color: var(--fortyfour-recorder-color-0);--fortyfour-recorder-btn-radius: var(--fortyfour-recorder-radius-xl);--fortyfour-recorder-btn-padding: var(--fortyfour-recorder-spacing-sm)
-      var(--fortyfour-recorder-spacing-sm-1);--fortyfour-recorder-btn-gap: var(--fortyfour-recorder-spacing-sm);--fortyfour-recorder-btn-bg: var(--fortyfour-recorder-bg-1);--fortyfour-recorder-btn-bg-hover: var(--fortyfour-recorder-bg-2);--fortyfour-recorder-btn-color: var(--fortyfour-recorder-color-0);--fortyfour-recorder-btn-color-hover: var(--fortyfour-recorder-color-0);--fortyfour-recorder-btn-primary-bg: var(--fortyfour-recorder-bg-primary);--fortyfour-recorder-btn-primary-bg-hover: var(--fortyfour-recorder-bg-primary-light);--fortyfour-recorder-btn-primary-color: var(--fortyfour-recorder-color-primary);--fortyfour-recorder-btn-primary-color-hover: var(--fortyfour-recorder-color-primary);--fortyfour-recorder-select-bg: var(--fortyfour-recorder-bg-0);--fortyfour-recorder-select-bg-hover: var(--fortyfour-recorder-bg-1);--fortyfour-recorder-select-border: 1px solid var(--fortyfour-recorder-bg-1);--fortyfour-recorder-select-radius: var(--fortyfour-recorder-radius-md);--fortyfour-recorder-select-shadow: 0 4px 8px hsla(0, 0%, 0%, 0.1);--fortyfour-recorder-select-color: var(--fortyfour-recorder-color-0);--fortyfour-recorder-select-font-size: var(--fortyfour-recorder-font-size-xs);}.recorder.svelte-16qftx0 {padding:var(--fortyfour-recorder-spacing-md);border-radius:var(--fortyfour-recorder-radius);background:var(--fortyfour-recorder-bg);color:var(--fortyfour-recorder-color);}.confirm.svelte-16qftx0 {display:flex;align-items:stretch;gap:var(--fortyfour-recorder-spacing-sm);}.error.svelte-16qftx0 {display:flex;flex-direction:column;gap:var(--fortyfour-recorder-spacing-sm);}.error.svelte-16qftx0 p:where(.svelte-16qftx0) {color:var(--fortyfour-recorder-red-bg);margin:0;}`
+      var(--fortyfour-recorder-spacing-sm-1);--fortyfour-recorder-btn-gap: var(--fortyfour-recorder-spacing-sm);--fortyfour-recorder-btn-bg: var(--fortyfour-recorder-bg-1);--fortyfour-recorder-btn-bg-hover: var(--fortyfour-recorder-bg-2);--fortyfour-recorder-btn-color: var(--fortyfour-recorder-color-0);--fortyfour-recorder-btn-color-hover: var(--fortyfour-recorder-color-0);--fortyfour-recorder-btn-primary-bg: var(--fortyfour-recorder-bg-primary);--fortyfour-recorder-btn-primary-bg-hover: var(--fortyfour-recorder-bg-primary-light);--fortyfour-recorder-btn-primary-color: var(--fortyfour-recorder-color-primary);--fortyfour-recorder-btn-primary-color-hover: var(--fortyfour-recorder-color-primary);--fortyfour-recorder-select-bg: var(--fortyfour-recorder-bg-0);--fortyfour-recorder-select-bg-hover: var(--fortyfour-recorder-bg-1);--fortyfour-recorder-select-border: 1px solid var(--fortyfour-recorder-bg-1);--fortyfour-recorder-select-radius: var(--fortyfour-recorder-radius-md);--fortyfour-recorder-select-shadow: 0 4px 8px hsla(0, 0%, 0%, 0.1);--fortyfour-recorder-select-color: var(--fortyfour-recorder-color-0);--fortyfour-recorder-select-font-size: var(--fortyfour-recorder-font-size-xs);}.recorder.svelte-14spe77 {padding:var(--fortyfour-recorder-spacing-md);border-radius:var(--fortyfour-recorder-radius);background:var(--fortyfour-recorder-bg);color:var(--fortyfour-recorder-color);}.confirm.svelte-14spe77 {display:flex;align-items:center;gap:var(--fortyfour-recorder-spacing-sm);}.confirm-actions.svelte-14spe77 {display:flex;gap:var(--fortyfour-recorder-spacing-sm);flex-shrink:0;}.error.svelte-14spe77 {display:flex;flex-direction:column;gap:var(--fortyfour-recorder-spacing-sm);}.error.svelte-14spe77 p:where(.svelte-14spe77) {color:var(--fortyfour-recorder-red-bg);margin:0;}.status-message.svelte-14spe77 {margin:0;text-align:center;}`
 };
-function Te(e, r) {
-  cr(r, !0), dr(e, Le);
-  const i = r.$$host;
-  let d = N(r, "sessionId", 7), o = N(r, "labels", 7, ""), s = N(r, "apiHost", 7, "api.44.audio");
-  const v = or(() => o() ? o().split(",").map((c) => c.trim()).filter(Boolean) : []), p = 2e3, C = 30;
-  let l = P(
+function Fe(o, r) {
+  fr(r, !0), vr(o, ze);
+  const a = r.$$host;
+  let s = B(r, "sessionId", 7), d = B(r, "labels", 7, ""), e = B(r, "apiHost", 7, "api.44.audio");
+  const v = nr(() => d() ? d().split(",").map((i) => i.trim()).filter(Boolean) : []), g = 2e3, D = 30;
+  let u = P(
     "ready"
-    // "ready", "recording", "confirm", "processing", "done", "error"
-  ), y = P(null), _ = P(null), h = P(""), x = P(null);
-  async function T() {
-    if (a(l) !== "confirm" || !a(_))
-      return;
-    const c = new FormData();
-    c.append("sessionId", d()), a(v).forEach((q) => c.append("labels", q));
-    const m = await (await fetch(a(_))).blob(), A = new File([m], "recording.audio", { type: m.type });
-    c.append("audioFile", A);
-    try {
-      const R = await (await fetch(`https://${s()}/v1/recordings`, { method: "POST", body: c })).json();
-      w(y, R.recordingId, !0), w(l, "processing");
-      let D = !1, G = 0;
-      for (; !D && G < C; )
-        await new Promise((fr) => setTimeout(fr, p)), D = await n(a(y)), G++;
-      if (!D) {
-        w(x, "Recording processing timeout. Please try again."), w(l, "error");
-        return;
+    // "ready", "recording", "confirm", "uploading", "processing", "done", "error"
+  ), _ = P(null), w = P(null), y = P(null), q = P(""), I = P(null);
+  async function n() {
+    if (!(t(u) !== "confirm" || !t(w))) {
+      b(u, "uploading");
+      try {
+        const i = await fetch(t(w));
+        if (!i.ok)
+          throw new Error("Failed to load audio data");
+        const c = await i.blob(), L = new File([c], "recording.audio", { type: c.type }), R = new FormData();
+        R.append("sessionId", s()), t(v).forEach((Q) => R.append("labels", Q)), R.append("audioFile", L), t(y) && R.append("waveform", JSON.stringify(t(y)));
+        const z = await fetch(`https://${e()}/v1/recordings`, { method: "POST", body: R });
+        if (!z.ok)
+          throw new Error(`Upload failed: ${z.status}`);
+        const S = await z.json();
+        b(_, S.recordingId, !0), b(u, "processing");
+        let M = !1, or = 0;
+        for (; !M && or < D; )
+          await new Promise((Q) => setTimeout(Q, g)), M = await l(t(_)), or++;
+        if (!M) {
+          b(I, "Recording processing timeout. Please try again."), b(u, "error");
+          return;
+        }
+        a.dispatchEvent(new CustomEvent("recording-complete", { detail: { recordingId: t(_) } })), b(u, "done");
+      } catch (i) {
+        console.error("Error saving recording:", i), b(I, i.message || "Failed to save recording", !0), b(u, "error");
       }
-      i.dispatchEvent(new CustomEvent("recording-complete", { detail: { recordingId: a(y) } })), w(l, "done");
-    } catch (q) {
-      console.error("Error saving recording:", q), w(x, q.message || "Failed to save recording", !0), w(l, "error");
     }
   }
-  function t() {
-    w(_, null), w(l, "ready");
+  function f() {
+    b(w, null), b(y, null), b(u, "ready");
   }
-  async function n(c) {
+  async function l(i) {
     try {
-      const g = await fetch(`https://${s()}/v1/recordings/${c}/status`);
-      if (!g.ok)
+      const c = await fetch(`https://${e()}/v1/recordings/${i}/status`);
+      if (!c.ok)
         throw new Error("Failed to fetch data");
-      return (await g.json()).status === "ready";
-    } catch (g) {
-      return console.error(g), !1;
+      return (await c.json()).status === "ready";
+    } catch (c) {
+      return console.error(c), !1;
     }
   }
-  function b(c) {
-    w(_, c, !0), w(l, "confirm");
+  function p(i) {
+    b(w, i.url, !0), b(y, i.waveform, !0), b(u, "confirm");
   }
-  var f = {
+  var x = {
     get sessionId() {
-      return d();
+      return s();
     },
-    set sessionId(c) {
-      d(c), U();
+    set sessionId(i) {
+      s(i), H();
     },
     get labels() {
-      return o();
+      return d();
     },
-    set labels(c = "") {
-      o(c), U();
+    set labels(i = "") {
+      d(i), H();
     },
     get apiHost() {
-      return s();
+      return e();
     },
-    set apiHost(c = "api.44.audio") {
-      s(c), U();
+    set apiHost(i = "api.44.audio") {
+      e(i), H();
     }
-  }, I = Ee(), B = E(I);
+  }, A = De(), E = C(A);
   {
-    var H = (c) => {
-      var g = _e(), m = X(g), A = S(E(m), 2), q = E(A), R = E(q, !0);
-      L(q), L(A), L(m);
-      var D = S(m, 2), G = E(D);
-      G.__click = t, L(D), O(() => sr(R, a(y))), u(c, g);
-    }, k = (c) => {
-      var g = tr(), m = X(g);
+    var h = (i) => {
+      var c = Se();
+      m(i, c);
+    }, k = (i) => {
+      var c = rr(), L = X(c);
       {
-        var A = (R) => {
-          var D = we();
-          u(R, D);
-        }, q = (R) => {
-          var D = tr(), G = X(D);
+        var R = (S) => {
+          var M = Te();
+          m(S, M);
+        }, z = (S) => {
+          var M = rr(), or = X(M);
           {
-            var fr = (K) => {
-              var V = xe(), J = E(V), vr = E(J);
-              L(J);
-              var ur = S(J, 2);
-              Y(ur, {
-                onclick: () => w(l, "confirm"),
-                children: (j, M) => {
-                  hr();
-                  var W = ir("Try Again");
-                  u(j, W);
-                },
-                $$slots: { default: !0 }
-              }), L(V), O(() => sr(vr, `Error: ${a(x) ?? ""}`)), u(K, V);
-            }, Tr = (K) => {
-              var V = tr(), J = X(V);
+            var Q = (V) => {
+              var ar = Ce();
+              m(V, ar);
+            }, Rr = (V) => {
+              var ar = rr(), Mr = X(ar);
               {
-                var vr = (j) => {
-                  var M = Ie(), W = E(M);
-                  Qr(W, {
-                    get audioURL() {
-                      return a(_);
-                    }
-                  });
-                  var rr = S(W, 2);
-                  Y(rr, {
-                    onclick: t,
-                    children: (pr, Rr) => {
-                      var yr = ke();
-                      u(pr, yr);
+                var Dr = (W) => {
+                  var J = $e(), Y = C(J), pr = C(Y);
+                  $(Y);
+                  var gr = O(Y, 2);
+                  er(gr, {
+                    onclick: () => b(u, "confirm"),
+                    children: (j, N) => {
+                      xr();
+                      var K = dr("Try Again");
+                      m(j, K);
                     },
                     $$slots: { default: !0 }
-                  });
-                  var $r = S(rr, 2);
-                  Y($r, {
-                    type: "primary",
-                    onclick: T,
-                    children: (pr, Rr) => {
-                      hr();
-                      var yr = ir("Save");
-                      u(pr, yr);
-                    },
-                    $$slots: { default: !0 }
-                  }), L(M), gr(1, M, () => xr, () => ({ y: 20, duration: 700 })), u(j, M);
-                }, ur = (j) => {
-                  var M = qe(), W = E(M);
-                  Lr(W, {
-                    onDone: b,
-                    get deviceId() {
-                      return a(h);
-                    },
-                    set deviceId(rr) {
-                      w(h, rr, !0);
-                    }
-                  }), L(M), gr(1, M, () => xr, () => ({ y: -20, duration: 700 })), u(j, M);
+                  }), $(J), G(() => _r(pr, `Error: ${t(I) ?? ""}`)), m(W, J);
+                }, zr = (W) => {
+                  var J = rr(), Y = X(J);
+                  {
+                    var pr = (j) => {
+                      var N = Re(), K = C(N);
+                      se(K, {
+                        get audioURL() {
+                          return t(w);
+                        },
+                        get waveform() {
+                          return t(y);
+                        }
+                      });
+                      var sr = O(K, 2), wr = C(sr);
+                      er(wr, {
+                        onclick: f,
+                        children: (yr, Nr) => {
+                          var mr = Ae();
+                          m(yr, mr);
+                        },
+                        $$slots: { default: !0 }
+                      });
+                      var Fr = O(wr, 2);
+                      er(Fr, {
+                        type: "primary",
+                        onclick: n,
+                        children: (yr, Nr) => {
+                          xr();
+                          var mr = dr("Save");
+                          m(yr, mr);
+                        },
+                        $$slots: { default: !0 }
+                      }), $(sr), $(N), br(1, N, () => Ir, () => ({ y: 20, duration: 700 })), m(j, N);
+                    }, gr = (j) => {
+                      var N = Me(), K = C(N);
+                      Ar(K, {
+                        onDone: p,
+                        get deviceId() {
+                          return t(q);
+                        },
+                        set deviceId(sr) {
+                          b(q, sr, !0);
+                        }
+                      }), $(N), br(1, N, () => Ir, () => ({ y: -20, duration: 700 })), m(j, N);
+                    };
+                    F(
+                      Y,
+                      (j) => {
+                        t(u) === "confirm" ? j(pr) : j(gr, !1);
+                      },
+                      !0
+                    );
+                  }
+                  m(W, J);
                 };
-                z(
-                  J,
-                  (j) => {
-                    a(l) === "confirm" ? j(vr) : j(ur, !1);
+                F(
+                  Mr,
+                  (W) => {
+                    t(u) === "error" ? W(Dr) : W(zr, !1);
                   },
                   !0
                 );
               }
-              u(K, V);
+              m(V, ar);
             };
-            z(
-              G,
-              (K) => {
-                a(l) === "error" ? K(fr) : K(Tr, !1);
+            F(
+              or,
+              (V) => {
+                t(u) === "processing" ? V(Q) : V(Rr, !1);
               },
               !0
             );
           }
-          u(R, D);
+          m(S, M);
         };
-        z(
-          m,
-          (R) => {
-            a(l) === "processing" ? R(A) : R(q, !1);
+        F(
+          L,
+          (S) => {
+            t(u) === "uploading" ? S(R) : S(z, !1);
           },
           !0
         );
       }
-      u(c, g);
+      m(i, c);
     };
-    z(B, (c) => {
-      a(l) === "done" && a(y) ? c(H) : c(k, !1);
+    F(E, (i) => {
+      t(u) === "done" ? i(h) : i(k, !1);
     });
   }
-  return L(I), u(e, I), lr(f);
+  return $(A), m(o, A), ur(x);
 }
-mr(["click"]);
-customElements.define("fortyfour-audio-recorder", nr(
-  Te,
+customElements.define("fortyfour-audio-recorder", lr(
+  Fe,
   {
     apiHost: { attribute: "api-host" },
     sessionId: { attribute: "session-id" },