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

package/dist/player.es.js

@@ -1,219 +1,218 @@
-import { d as ne, c as W, p as X, a as Y, b as k, s as n, f as p, A as le, i as y, e as i, g as Z, h as E, j as x, k as _, l as g, u as de, r as h, m as b, n as I, t as R, o as M, q as V, v as Q, w as ce, x as ve, y as ue, z as ge } from "./AudioPlayer-DW6UJXCt.mjs";
-function pe(c, t) {
-  n(t, !g(t));
+import { d as ut, c as Q, p as V, a as W, b as v, f as y, A as pt, i as S, t as h, s as ft, e as i, g as X, h as g, j as n, u as G, k as _, l as b, r as m, m as T, n as L, o as F, q as D, v as u, w as N, x as bt, y as ht } from "./AudioPlayer-BnKA5uw-.mjs";
+function _t(d, e) {
+  u(e, !n(e));
 }
-var me = p('&bull; <button class="link svelte-8utcjm"> </button>', 1), fe = (c, t) => n(t, !0), _e = p(' <button class="link svelte-8utcjm">Show more</button>', 1), he = (c, t) => n(t, !1), be = p(' <button class="link svelte-8utcjm">Show less</button>', 1), ye = p('<div class="details svelte-8utcjm"><div class="title svelte-8utcjm">Transcription <!></div> <div class="transcription"><!></div></div>'), ke = p('<div class="container svelte-8utcjm" role="group" aria-label="44 audio player"><div class="display svelte-8utcjm"><!></div> <!></div>');
-const xe = {
-  hash: "svelte-8utcjm",
-  code: "button.svelte-8utcjm {font:inherit;margin:0;padding:0;box-sizing:border-box;border:none;background:none;cursor:pointer;}.link.svelte-8utcjm {background:none;border:none;color:var(--44-color-2);cursor:pointer;padding:0;font:inherit;}.link.svelte-8utcjm:hover {color:var(--44-color-3);text-decoration:underline;}.container.svelte-8utcjm {padding:16px;}.display.svelte-8utcjm {display:flex;align-items:center;gap:12px;}.details.svelte-8utcjm .title:where(.svelte-8utcjm) {font-weight:bold;margin-top:16px;margin-bottom:8px;}"
+var mt = y('<p class="error svelte-47ttlb">Error loading recording.</p>'), yt = y('&bull; <button class="link svelte-47ttlb"> </button>', 1), xt = (d, e) => u(e, !0), kt = y(' <button class="link svelte-47ttlb">Show more</button>', 1), wt = (d, e) => u(e, !1), Ht = y(' <button class="link svelte-47ttlb">Show less</button>', 1), It = y('<span class="placeholder svelte-47ttlb"></span>'), zt = y('<div role="group" aria-label="44 audio player"><div class="display svelte-47ttlb"><!></div> <!> <div class="details svelte-47ttlb"><div class="title svelte-47ttlb">Transcription <!></div> <div class="transcription"><!></div></div></div>');
+const St = {
+  hash: "svelte-47ttlb",
+  code: "button.svelte-47ttlb {font:inherit;margin:0;padding:0;box-sizing:border-box;border:none;background:none;cursor:pointer;}.link.svelte-47ttlb {background:none;border:none;color:var(--44-color-2);cursor:pointer;padding:0;font:inherit;}.link.svelte-47ttlb:hover {color:var(--44-color-3);text-decoration:underline;}.container.svelte-47ttlb {padding:16px;}.container.loading.svelte-47ttlb .display:where(.svelte-47ttlb) {opacity:0.5;}.display.svelte-47ttlb {display:flex;align-items:center;gap:12px;transition:opacity 0.2s;}.details.svelte-47ttlb {transition:opacity 0.2s;}.container.loading.svelte-47ttlb .details:where(.svelte-47ttlb) {opacity:0.5;}.details.svelte-47ttlb .title:where(.svelte-47ttlb) {font-weight:bold;margin-top:16px;margin-bottom:8px;}.error.svelte-47ttlb {margin:16px 0 0;opacity:0.7;}.placeholder.svelte-47ttlb {display:block;height:1em;width:100%;background:currentColor;opacity:0.15;border-radius:4px;}"
 };
-function $(c, t) {
-  X(t, !0), Y(c, xe);
-  let l = k(t, "recordingId", 7), r = k(t, "recording", 7), a = k(t, "audioRef", 7), P = k(t, "apiHost", 7), L = E(!1), m = E(!1), T = E(0), f = E("idle");
-  a().addEventListener("play", () => {
-    n(f, "playing");
-  }), a().addEventListener("pause", () => {
-    n(f, "paused");
-  }), a().addEventListener("ended", () => {
-    n(f, "idle"), n(T, 0);
-  }), a().addEventListener("timeupdate", () => {
-    n(T, a().currentTime * 1e3);
-  });
-  var O = {
+function Y(d, e) {
+  V(e, !0), W(d, St);
+  let l = v(e, "recordingId", 7), a = v(e, "recording", 7, null), c = v(e, "loading", 7, !1), j = v(e, "error", 7, !1), x = v(e, "apiHost", 7), p = L(!1), f = L(!1);
+  const O = G(() => a()?.waveform ?? Array(100).fill(0));
+  var k = {
     get recordingId() {
       return l();
     },
-    set recordingId(e) {
-      l(e), x();
+    set recordingId(t) {
+      l(t), g();
     },
     get recording() {
-      return r();
+      return a();
     },
-    set recording(e) {
-      r(e), x();
+    set recording(t = null) {
+      a(t), g();
     },
-    get audioRef() {
-      return a();
+    get loading() {
+      return c();
+    },
+    set loading(t = !1) {
+      c(t), g();
+    },
+    get error() {
+      return j();
     },
-    set audioRef(e) {
-      a(e), x();
+    set error(t = !1) {
+      j(t), g();
     },
     get apiHost() {
-      return P();
+      return x();
     },
-    set apiHost(e) {
-      P(e), x();
+    set apiHost(t) {
+      x(t), g();
     }
-  }, v = ke(), j = _(v), U = _(j);
+  }, w = zt();
+  let r;
+  var o = _(w), Z = _(o);
   {
-    let e = de(() => `https://${P()}/v1/recordings/${l()}/audio.mp3`);
-    le(U, {
+    let t = G(() => `https://${x()}/v1/recordings/${l()}/audio.mp3`);
+    pt(Z, {
       get audioURL() {
-        return g(e);
+        return n(t);
       },
       get waveform() {
-        return r().waveform;
+        return n(O);
       }
     });
   }
-  h(j);
-  var B = b(j, 2);
+  m(o);
+  var J = b(o, 2);
   {
-    var F = (e) => {
-      var o = ye(), q = _(o), D = b(_(q));
-      {
-        var G = (s) => {
-          var u = me(), C = b(I(u));
-          C.__click = [pe, L];
-          var K = _(C, !0);
-          h(C), R(() => M(K, g(L) ? "Original" : "Translation")), i(s, u);
-        };
-        y(D, (s) => {
-          r().translation && s(G);
-        });
-      }
-      h(q);
-      var d = b(q, 2), J = _(d);
+    var $ = (t) => {
+      var s = mt();
+      i(t, s);
+    };
+    S(J, (t) => {
+      j() && t($);
+    });
+  }
+  var K = b(J, 2), R = _(K), tt = b(_(R));
+  {
+    var et = (t) => {
+      var s = yt(), A = b(T(s));
+      A.__click = [_t, p];
+      var U = _(A, !0);
+      m(A), h(() => F(U, n(p) ? "Original" : "Translation")), i(t, s);
+    };
+    S(tt, (t) => {
+      a()?.translation && t(et);
+    });
+  }
+  m(R);
+  var M = b(R, 2), rt = _(M);
+  {
+    var at = (t) => {
+      var s = D(), A = T(s);
       {
-        var ee = (s) => {
-          var u = V();
-          R(() => M(u, r().translation)), i(s, u);
-        }, te = (s) => {
-          var u = Q(), C = I(u);
+        var U = (H) => {
+          var C = N();
+          h(() => F(C, a().translation)), i(H, C);
+        }, it = (H) => {
+          var C = D(), lt = T(C);
           {
-            var K = (w) => {
-              var S = Q(), ae = I(S);
+            var nt = (I) => {
+              var E = D(), dt = T(E);
               {
-                var oe = (H) => {
-                  var z = _e(), A = I(z), N = b(A);
-                  N.__click = [fe, m], R((se) => M(A, `${se ?? ""}... `), [() => r().transcription.slice(0, 200)]), i(H, z);
-                }, ie = (H) => {
-                  var z = be(), A = I(z), N = b(A);
-                  N.__click = [he, m], R(() => M(A, `${r().transcription ?? ""} `)), i(H, z);
+                var ct = (z) => {
+                  var P = kt(), q = T(P), B = b(q);
+                  B.__click = [xt, f], h((gt) => F(q, `${gt ?? ""}... `), [() => a().transcription.slice(0, 200)]), i(z, P);
+                }, vt = (z) => {
+                  var P = Ht(), q = T(P), B = b(q);
+                  B.__click = [wt, f], h(() => F(q, `${a().transcription ?? ""} `)), i(z, P);
                 };
-                y(ae, (H) => {
-                  g(m) ? H(ie, !1) : H(oe);
+                S(dt, (z) => {
+                  n(f) ? z(vt, !1) : z(ct);
                 });
               }
-              i(w, S);
-            }, re = (w) => {
-              var S = V();
-              R(() => M(S, r().transcription)), i(w, S);
+              i(I, E);
+            }, st = (I) => {
+              var E = N();
+              h(() => F(E, a().transcription)), i(I, E);
             };
-            y(
-              C,
-              (w) => {
-                r().transcription.length > 200 ? w(K) : w(re, !1);
+            S(
+              lt,
+              (I) => {
+                a().transcription.length > 200 ? I(nt) : I(st, !1);
               },
               !0
             );
           }
-          i(s, u);
+          i(H, C);
         };
-        y(J, (s) => {
-          g(L) ? s(ee) : s(te, !1);
+        S(A, (H) => {
+          n(p) ? H(U) : H(it, !1);
         });
       }
-      h(d), h(o), i(e, o);
+      i(t, s);
+    }, ot = (t) => {
+      var s = It();
+      i(t, s);
     };
-    y(B, (e) => {
-      r().transcription && e(F);
+    S(rt, (t) => {
+      a()?.transcription ? t(at) : t(ot, !1);
     });
   }
-  return h(v), i(c, v), Z(O);
+  return m(M), m(K), m(w), h((t) => r = ft(w, 1, "container svelte-47ttlb", null, r, t), [() => ({ loading: c() })]), i(d, w), X(k);
 }
-ne(["click"]);
-W($, { recordingId: {}, recording: {}, audioRef: {}, apiHost: {} }, [], [], !0);
-var je = p("<p>Loading...</p>"), we = p("<p>Error loading recording.</p>"), He = p('<div class="container svelte-1kcle3q" role="group" aria-label="44 audio player"><!> <audio></audio></div>');
-const Ie = {
-  hash: "svelte-1kcle3q",
-  code: ":host {display:inline-block;font-size:inherit;font-family:system-ui;line-height:1.35;color:var(--44-color-1);}.container.svelte-1kcle3q {width:100%;border-radius:16px;background:var(--44-color-0);color:var(--44-color-1);}"
+ut(["click"]);
+Q(
+  Y,
+  {
+    recordingId: {},
+    recording: {},
+    loading: {},
+    error: {},
+    apiHost: {}
+  },
+  [],
+  [],
+  !0
+);
+var Tt = y('<div class="container svelte-yizh5h" role="group" aria-label="44 audio player"><!></div>');
+const jt = {
+  hash: "svelte-yizh5h",
+  code: ":host {display:block;font-size:inherit;font-family:system-ui;line-height:1.35;color:var(--44-color-1);min-height:150px;}.container.svelte-yizh5h {width:100%;border-radius:16px;background:var(--44-color-0);color:var(--44-color-1);}"
 };
-function Re(c, t) {
-  X(t, !0), Y(c, Ie);
-  let l = k(t, "recordingId", 7), r = k(t, "theme", 7), a = k(t, "apiHost", 7, "api.44.audio");
-  const L = r().split(",").map((e) => e.trim()).map((e, o) => `--44-color-${o}: ${e};`).join(" ");
-  let m, T = E(!0), f = E(null);
-  ce(async () => {
-    try {
-      const e = await fetch(`https://${a()}/v1/recordings/${l()}/player`);
-      if (!e.ok)
+function At(d, e) {
+  V(e, !0), W(d, jt);
+  let l = v(e, "recordingId", 7), a = v(e, "theme", 7), c = v(e, "apiHost", 7, "api.44.audio");
+  const j = G(() => a().split(",").map((r, o) => `--44-color-${o}: ${r.trim()};`).join(" "));
+  let x = L(null), p = L(!0), f = L(!1);
+  bt(() => {
+    const r = l();
+    u(p, !0), u(f, !1), fetch(`https://${c()}/v1/recordings/${r}/player`).then((o) => {
+      if (!o.ok)
         throw new Error("Failed to fetch data");
-      const o = await e.json();
-      o.status === "ready" && n(f, o, !0);
-    } catch (e) {
-      console.error(e);
-    } finally {
-      n(T, !1);
-    }
+      return o.json();
+    }).then((o) => {
+      l() === r && o.status === "ready" && u(x, o, !0);
+    }).catch((o) => {
+      console.error(o), l() === r && u(f, !0);
+    }).finally(() => {
+      l() === r && u(p, !1);
+    });
   });
   var O = {
     get recordingId() {
       return l();
     },
-    set recordingId(e) {
-      l(e), x();
+    set recordingId(r) {
+      l(r), g();
     },
     get theme() {
-      return r();
+      return a();
     },
-    set theme(e) {
-      r(e), x();
+    set theme(r) {
+      a(r), g();
     },
     get apiHost() {
-      return a();
+      return c();
     },
-    set apiHost(e = "api.44.audio") {
-      a(e), x();
+    set apiHost(r = "api.44.audio") {
+      c(r), g();
     }
-  }, v = He(), j = _(v);
-  {
-    var U = (e) => {
-      var o = je();
-      i(e, o);
-    }, B = (e) => {
-      var o = Q(), q = I(o);
-      {
-        var D = (d) => {
-          $(d, {
-            get apiHost() {
-              return a();
-            },
-            get recordingId() {
-              return l();
-            },
-            get recording() {
-              return g(f);
-            },
-            get audioRef() {
-              return m;
-            }
-          });
-        }, G = (d) => {
-          var J = we();
-          i(d, J);
-        };
-        y(
-          q,
-          (d) => {
-            g(f) ? d(D) : d(G, !1);
-          },
-          !0
-        );
-      }
-      i(e, o);
-    };
-    y(j, (e) => {
-      g(T) ? e(U) : e(B, !1);
-    });
-  }
-  var F = b(j, 2);
-  return ve(F, (e) => m = e, () => m), h(v), R(() => {
-    ue(v, L), ge(F, "src", `https://${a() ?? ""}/v1/recordings/${l() ?? ""}/audio.mp3`);
-  }), i(c, v), Z(O);
+  }, k = Tt(), w = _(k);
+  return Y(w, {
+    get apiHost() {
+      return c();
+    },
+    get recordingId() {
+      return l();
+    },
+    get recording() {
+      return n(x);
+    },
+    get loading() {
+      return n(p);
+    },
+    get error() {
+      return n(f);
+    }
+  }), m(k), h(() => ht(k, n(j))), i(d, k), X(O);
 }
-customElements.define("fortyfour-audio-player", W(
-  Re,
+customElements.define("fortyfour-audio-player", Q(
+  At,
   {
     apiHost: { attribute: "api-host" },
     recordingId: { attribute: "recording-id" },

package/dist/recorder.es.js

@@ -1,4 +1,4 @@
-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";
+import { z as Pr, B as Or, C as Ur, D as Br, E as Hr, F as jr, G as Gr, H as Vr, I as Wr, T as Jr, J as Er, K as Kr, L as Xr, M as Z, N as Qr, O as Yr, d as Lr, c as lr, p as fr, a as vr, b as B, n as P, P as Sr, Q as Tr, f as T, k as C, l as O, i as F, R as Zr, t as G, e as m, g as ur, v as b, j as t, h as H, r as $, S as re, U as ee, V as te, s as tr, u as nr, W as cr, o as _r, X as oe, m as X, w as dr, q as rr, Y as ae, Z as xr, A as se, _ as ie } from "./AudioPlayer-BnKA5uw-.mjs";
 function ne(o, r, a, s, d) {
   Pr && Or();
   var e = r.$$slots?.[a], v = !1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@44-audio/components",
-  "version": "0.1.0-dev.13",
+  "version": "0.1.0-dev.14",
   "private": false,
   "files": [
     "dist"