@layers-app/shared 0.4.7 → 0.4.8

package/dist/node_modules/@gfazioli/mantine-audio/dist/esm/components/AudioTimeDisplay.js

@@ -0,0 +1,44 @@
+import { Text as s } from "@mantine/core";
+import c, { forwardRef as u } from "react";
+import { useAudioContext as f } from "../Audio.context.js";
+const l = u(
+  ({ format: e = "current/duration", ...t }, r) => {
+    const o = f(), n = p(e, o.currentTime, o.duration);
+    return /* @__PURE__ */ c.createElement(
+      s,
+      {
+        ref: r,
+        size: "sm",
+        ff: "monospace",
+        ta: "center",
+        ...o.getStyles("timeDisplay"),
+        ...t
+      },
+      n
+    );
+  }
+);
+l.displayName = "AudioTimeDisplay";
+function a(e) {
+  if (!Number.isFinite(e) || e < 0)
+    return "0:00";
+  const t = Math.floor(e), r = Math.floor(t / 3600), o = Math.floor(t % 3600 / 60), n = t % 60, i = r > 0 ? String(o).padStart(2, "0") : String(o), m = String(n).padStart(2, "0");
+  return r > 0 ? `${r}:${i}:${m}` : `${i}:${m}`;
+}
+function p(e, t, r) {
+  switch (e) {
+    case "current":
+      return a(t);
+    case "duration":
+      return a(r);
+    case "remaining":
+      return a(Math.max(r - t, 0));
+    case "current/-remaining":
+      return `${a(t)} / -${a(Math.max(r - t, 0))}`;
+    default:
+      return `${a(t)} / ${a(r)}`;
+  }
+}
+export {
+  l as AudioTimeDisplay
+};

package/dist/node_modules/@gfazioli/mantine-audio/dist/esm/components/AudioTimeline.js

@@ -0,0 +1,71 @@
+import { Box as p, Slider as v } from "@mantine/core";
+import b, { forwardRef as R, useState as w, useRef as f, useEffect as A, useCallback as S } from "react";
+import { useAudioContext as E } from "../Audio.context.js";
+const $ = R(
+  ({ sliderProps: u, liveScrub: n = !0, scrubSound: l, ...o }, m) => {
+    const e = E(), t = l ?? e.scrubSound, [y, h] = w(null), d = f(!1), c = f(!1), r = f(null), a = f(null), s = Number.isFinite(e.duration) && e.duration > 0 ? e.duration : 0, g = y ?? e.currentTime, C = s > 0 ? e.buffered / s * 100 : 0;
+    A(
+      () => () => {
+        r.current !== null && cancelAnimationFrame(r.current);
+      },
+      []
+    );
+    const x = S(
+      (i) => {
+        d.current || (d.current = !0, c.current = e.playing, n && (t && !e.playing ? e.play() : !t && e.playing && e.pause())), h(i), n && (a.current = i, r.current === null && (r.current = requestAnimationFrame(() => {
+          r.current = null, a.current !== null && (e.seek(a.current), a.current = null);
+        })));
+      },
+      [e, n, t]
+    ), k = S(
+      (i) => {
+        r.current !== null && (cancelAnimationFrame(r.current), r.current = null), a.current = null, e.seek(i), h(null), d.current = !1, t && !c.current ? e.pause() : !t && c.current && e.play(), c.current = !1;
+      },
+      [e, t]
+    );
+    return /* @__PURE__ */ b.createElement(p, { ref: m, ...e.getStyles("timeline"), ...o }, /* @__PURE__ */ b.createElement(
+      p,
+      {
+        ...e.getStyles("timelineBuffered"),
+        style: { width: `${C}%` },
+        "aria-hidden": !0
+      }
+    ), /* @__PURE__ */ b.createElement(
+      v,
+      {
+        value: Math.min(g, s || g),
+        onChange: x,
+        onChangeEnd: k,
+        min: 0,
+        max: s || 1e-4,
+        step: 0.01,
+        label: (i) => F(i),
+        showLabelOnHover: !0,
+        color: "var(--audio-timeline-color)",
+        size: "xs",
+        "aria-label": "Seek",
+        styles: {
+          root: { flex: 1, width: "100%" },
+          bar: { backgroundColor: "var(--audio-timeline-color)" },
+          thumb: {
+            backgroundColor: "var(--audio-timeline-thumb-color)",
+            borderColor: "var(--audio-timeline-thumb-color)",
+            width: "var(--audio-timeline-thumb-size)",
+            height: "var(--audio-timeline-thumb-size)"
+          }
+        },
+        ...u
+      }
+    ));
+  }
+);
+$.displayName = "AudioTimeline";
+function F(u) {
+  if (!Number.isFinite(u) || u < 0)
+    return "0:00";
+  const n = Math.floor(u), l = Math.floor(n / 3600), o = Math.floor(n % 3600 / 60), m = n % 60, e = l > 0 ? String(o).padStart(2, "0") : String(o), t = String(m).padStart(2, "0");
+  return l > 0 ? `${l}:${e}:${t}` : `${e}:${t}`;
+}
+export {
+  $ as AudioTimeline
+};

package/dist/node_modules/@gfazioli/mantine-audio/dist/esm/components/AudioVolumeSlider.js

@@ -0,0 +1,43 @@
+import { Slider as i } from "@mantine/core";
+import u, { forwardRef as d, useCallback as m } from "react";
+import { useAudioContext as n } from "../Audio.context.js";
+const s = d(
+  ({ ...r }, a) => {
+    const e = n(), l = e.muted ? 0 : Math.round(e.volume * 100), t = m(
+      (o) => {
+        e.setVolume(o / 100);
+      },
+      [e]
+    );
+    return /* @__PURE__ */ u.createElement(
+      i,
+      {
+        ref: a,
+        value: l,
+        onChange: t,
+        min: 0,
+        max: 100,
+        step: 1,
+        label: (o) => `${o}%`,
+        showLabelOnHover: !0,
+        size: "xs",
+        "aria-label": "Volume",
+        styles: {
+          bar: { backgroundColor: "var(--audio-color)" },
+          thumb: {
+            backgroundColor: "var(--audio-color)",
+            borderColor: "var(--audio-color)",
+            width: "var(--audio-timeline-thumb-size)",
+            height: "var(--audio-timeline-thumb-size)"
+          }
+        },
+        ...e.getStyles("volumeSlider"),
+        ...r
+      }
+    );
+  }
+);
+s.displayName = "AudioVolumeSlider";
+export {
+  s as AudioVolumeSlider
+};

package/dist/node_modules/@gfazioli/mantine-audio/dist/esm/components/AudioWaveform.js

@@ -0,0 +1,166 @@
+import { useMantineTheme as ut, getThemeColor as ft, Box as K, getRadius as dt } from "@mantine/core";
+import H, { forwardRef as mt, useRef as R, useState as Q, useEffect as $, useCallback as Y } from "react";
+import { useAudioContext as pt } from "../Audio.context.js";
+function Z(r) {
+  if (!r)
+    return "transparent";
+  if (r.startsWith("#") || r.startsWith("rgb") || r.startsWith("hsl") || r === "transparent" || typeof document > "u")
+    return r;
+  const i = document.createElement("div");
+  i.style.color = r, document.body.appendChild(i);
+  const d = getComputedStyle(i).color;
+  return i.remove(), d || r;
+}
+const ht = mt(
+  ({
+    height: r = 64,
+    barGap: i = 2,
+    barWidth: d,
+    barRadius: A = 1,
+    radius: z,
+    color: L,
+    mirror: F = !0,
+    mirrorGap: O = 0,
+    interactive: v = !0,
+    scrubSound: G,
+    ...tt
+  }, x) => {
+    const et = ut(), U = L ? ft(L, et) : null, e = pt(), C = G ?? e.scrubSound, V = R(null), B = R(null), [u, X] = Q(0), [_, j] = Q(null), M = R(!1), m = R(!1), k = R(null), p = R(() => {
+    }), S = e.audioRef;
+    $(() => {
+      const t = B.current;
+      if (!t || typeof ResizeObserver > "u")
+        return;
+      const n = new ResizeObserver((c) => {
+        for (const o of c)
+          X(o.contentRect.width);
+      });
+      return n.observe(t), X(t.getBoundingClientRect().width), () => n.disconnect();
+    }, []), $(() => {
+      const t = V.current;
+      if (!t) {
+        p.current = () => {
+        };
+        return;
+      }
+      const n = e.peaks;
+      if (!n || n.length === 0 || u <= 0) {
+        const s = window.devicePixelRatio || 1;
+        t.width = u * s, t.height = r * s, t.getContext("2d")?.clearRect(0, 0, t.width, t.height), p.current = () => {
+        };
+        return;
+      }
+      const c = window.devicePixelRatio || 1;
+      t.width = u * c, t.height = r * c, t.style.width = `${u}px`, t.style.height = `${r}px`;
+      const o = t.getContext("2d");
+      if (!o) {
+        p.current = () => {
+        };
+        return;
+      }
+      o.scale(c, c);
+      const P = !d || d <= 0, rt = P ? 2 : d, ot = Math.max(1, Math.floor((u + i) / (rt + i))), h = Math.min(n.length, ot), E = P ? Math.max(1, (u - i * (h - 1)) / h) : d, D = n.length / h, ct = U || getComputedStyle(t).getPropertyValue("--audio-waveform-played-color").trim() || "#228be6", st = getComputedStyle(t).getPropertyValue("--audio-waveform-color").trim() || "rgba(120, 120, 120, 0.4)", at = Z(ct), it = Z(st), N = new Float32Array(h);
+      for (let s = 0; s < h; s += 1) {
+        const y = Math.floor(s * D), g = Math.floor((s + 1) * D);
+        let a = 0;
+        for (let l = y; l < g; l += 1) {
+          const f = n[l] ?? 0;
+          f > a && (a = f);
+        }
+        N[s] = a;
+      }
+      const b = (s, y, g, a, l) => {
+        o.fillStyle = l, A > 0 && typeof o.roundRect == "function" ? (o.beginPath(), o.roundRect(s, y, g, a, Math.min(A, g / 2, Math.max(0, a / 2))), o.fill()) : o.fillRect(s, y, g, a);
+      };
+      p.current = (s) => {
+        o.clearRect(0, 0, u, r);
+        const y = s * h, g = Math.floor(y), a = r / 2, l = F ? O / 2 : 0;
+        for (let f = 0; f < h; f += 1) {
+          const J = N[f], W = f * (E + i), q = f < g ? at : it;
+          if (F) {
+            const w = Math.max(1, J * (a - l));
+            b(W, a - l - w, E, w, q), b(W, a + l, E, w, q);
+          } else {
+            const w = Math.max(2, J * r);
+            b(W, r - w, E, w, q);
+          }
+        }
+      };
+      const I = e.duration, lt = I > 0 ? (S.current?.currentTime ?? 0) / I : 0;
+      p.current(Math.max(0, Math.min(1, lt)));
+    }, [e.peaks, u, r, i, d, A, F, O, U]), $(() => {
+      const t = () => {
+        const n = S.current, c = n?.duration ?? 0, o = n?.currentTime ?? 0, P = c > 0 ? Math.max(0, Math.min(1, o / c)) : 0;
+        p.current(P), k.current = requestAnimationFrame(t);
+      };
+      if (e.playing)
+        k.current = requestAnimationFrame(t);
+      else {
+        const n = e.duration, c = S.current?.currentTime ?? 0, o = n > 0 ? Math.max(0, Math.min(1, c / n)) : 0;
+        p.current(o);
+      }
+      return () => {
+        k.current !== null && (cancelAnimationFrame(k.current), k.current = null);
+      };
+    }, [e.playing, e.duration, e.currentTime, S]);
+    const T = Y(
+      (t) => {
+        const n = B.current;
+        if (!n || e.duration <= 0)
+          return;
+        const c = n.getBoundingClientRect(), o = Math.max(0, Math.min(1, (t.clientX - c.left) / c.width));
+        e.seek(o * e.duration);
+      },
+      [e]
+    ), nt = Y(
+      (t) => {
+        const n = B.current;
+        if (!n)
+          return;
+        const c = n.getBoundingClientRect(), o = Math.max(0, Math.min(1, (t.clientX - c.left) / c.width));
+        j(o), M.current && v && T(t);
+      },
+      [v, T]
+    );
+    return /* @__PURE__ */ H.createElement(
+      K,
+      {
+        ref: (t) => {
+          B.current = t, typeof x == "function" ? x(t) : x && typeof x == "object" && (x.current = t);
+        },
+        ...e.getStyles("waveform"),
+        style: {
+          height: r,
+          cursor: v ? "pointer" : "default",
+          borderRadius: z === void 0 ? void 0 : dt(z)
+        },
+        onMouseDown: (t) => {
+          v && (M.current = !0, m.current = e.playing, C ? e.playing || e.play() : e.playing && e.pause(), T(t));
+        },
+        onMouseUp: () => {
+          M.current && (M.current = !1, C && !m.current ? e.pause() : !C && m.current && e.play(), m.current = !1);
+        },
+        onMouseMove: nt,
+        onMouseLeave: () => {
+          M.current && (C && !m.current ? e.pause() : !C && m.current && e.play()), M.current = !1, m.current = !1, j(null);
+        },
+        "data-loading": e.peaksLoading || void 0,
+        "data-error": e.peaksError ? "true" : void 0,
+        ...tt
+      },
+      /* @__PURE__ */ H.createElement("canvas", { ref: V, ...e.getStyles("waveformCanvas") }),
+      _ !== null && v && /* @__PURE__ */ H.createElement(
+        K,
+        {
+          ...e.getStyles("waveformHover"),
+          style: { left: `${_ * 100}%` },
+          "aria-hidden": !0
+        }
+      )
+    );
+  }
+);
+ht.displayName = "AudioWaveform";
+export {
+  ht as AudioWaveform
+};

package/dist/node_modules/@gfazioli/mantine-audio/dist/esm/use-audio.js

@@ -0,0 +1,201 @@
+import { useRef as x, useState as a, useEffect as v, useCallback as i } from "react";
+function me(n, r) {
+  const h = n.getChannelData(0), f = Math.floor(h.length / r), E = new Float32Array(r);
+  for (let m = 0; m < r; m += 1) {
+    const L = m * f;
+    let y = 0;
+    for (let g = 0; g < f; g += 1) {
+      const b = Math.abs(h[L + g] ?? 0);
+      b > y && (y = b);
+    }
+    E[m] = y;
+  }
+  return E;
+}
+function ye(n = {}) {
+  const r = x(null), [h, f] = a(!1), [E, m] = a(0), [L, y] = a(0), [g, b] = a(0), [j, R] = a(n.volume ?? 1), [H, S] = a(n.muted ?? !1), [U, T] = a(n.playbackRate ?? 1), [$, P] = a(!1), [q, p] = a(!1), [J, K] = a(null), [O, A] = a(!1), [Q, M] = a(null), [X, w] = a(!1), [Y, D] = a(null), [Z, _] = a(null), [ee, te] = a(null), [C, ne] = a(null), s = x(n);
+  s.current = n;
+  const d = x(null);
+  v(() => {
+    const e = r.current;
+    if (!e)
+      return;
+    const t = () => {
+      f(!0), P(!1), s.current.onPlayChange?.(!0);
+    }, c = () => {
+      f(!1), s.current.onPlayChange?.(!1);
+    }, l = () => {
+      P(!0), f(!1), s.current.onEnded?.();
+    }, o = () => {
+      m(e.currentTime), s.current.onCurrentTimeChange?.(e.currentTime);
+    }, u = () => {
+      const G = e.duration || 0;
+      y(G), e.currentSrc && ne(e.currentSrc), s.current.onDurationChange?.(G);
+    }, F = () => {
+      R(e.volume), S(e.muted), s.current.onVolumeChange?.(e.volume);
+    }, N = () => {
+      T(e.playbackRate), s.current.onPlaybackRateChange?.(e.playbackRate);
+    }, V = () => p(!0), W = () => p(!1), z = () => {
+      A(!0), p(!1);
+    }, B = () => {
+      e.buffered.length > 0 && b(e.buffered.end(e.buffered.length - 1));
+    }, I = () => {
+      K(e.error), p(!1), s.current.onError?.(e.error);
+    };
+    return e.addEventListener("play", t), e.addEventListener("pause", c), e.addEventListener("ended", l), e.addEventListener("timeupdate", o), e.addEventListener("durationchange", u), e.addEventListener("loadedmetadata", u), e.addEventListener("volumechange", F), e.addEventListener("ratechange", N), e.addEventListener("waiting", V), e.addEventListener("playing", W), e.addEventListener("canplay", z), e.addEventListener("progress", B), e.addEventListener("error", I), Number.isFinite(e.duration) && e.duration > 0 && y(e.duration), e.currentTime > 0 && m(e.currentTime), (e.volume !== 1 || e.muted) && (R(e.volume), S(e.muted)), e.playbackRate !== 1 && T(e.playbackRate), e.paused || f(!0), e.readyState >= 3 && A(!0), e.buffered.length > 0 && b(e.buffered.end(e.buffered.length - 1)), () => {
+      e.removeEventListener("play", t), e.removeEventListener("pause", c), e.removeEventListener("ended", l), e.removeEventListener("timeupdate", o), e.removeEventListener("durationchange", u), e.removeEventListener("loadedmetadata", u), e.removeEventListener("volumechange", F), e.removeEventListener("ratechange", N), e.removeEventListener("waiting", V), e.removeEventListener("playing", W), e.removeEventListener("canplay", z), e.removeEventListener("progress", B), e.removeEventListener("error", I);
+    };
+  }, []), v(() => {
+    if (n.playing === void 0)
+      return;
+    const e = r.current;
+    e && (n.playing && e.paused ? e.play().catch(() => {
+    }) : !n.playing && !e.paused && e.pause());
+  }, [n.playing]), v(() => {
+    if (n.currentTime === void 0)
+      return;
+    const e = r.current;
+    e && Math.abs(e.currentTime - n.currentTime) > 0.5 && (e.currentTime = n.currentTime);
+  }, [n.currentTime]), v(() => {
+    if (n.volume === void 0)
+      return;
+    const e = r.current;
+    e && Math.abs(e.volume - n.volume) > 0.01 && (e.volume = Math.max(0, Math.min(1, n.volume)));
+  }, [n.volume]), v(() => {
+    if (n.playbackRate === void 0)
+      return;
+    const e = r.current;
+    e && e.playbackRate !== n.playbackRate && (e.playbackRate = n.playbackRate);
+  }, [n.playbackRate]), v(() => {
+    if (n.disableWebAudio)
+      return;
+    const e = C || n.src;
+    if (!e || typeof window > "u")
+      return;
+    const t = window.AudioContext || window.webkitAudioContext;
+    if (!t)
+      return;
+    const c = n.waveformSamples ?? 512;
+    if (c <= 0)
+      return;
+    let l = !1;
+    M(null), D(null), w(!0);
+    const o = new t();
+    return fetch(e).then((u) => {
+      if (!u.ok)
+        throw new Error(`Failed to fetch audio: HTTP ${u.status}`);
+      return u.arrayBuffer();
+    }).then((u) => o.decodeAudioData(u.slice(0))).then((u) => {
+      l || (M(me(u, c)), w(!1));
+    }).catch((u) => {
+      l || (D(u instanceof Error ? u : new Error(String(u))), w(!1));
+    }).finally(() => {
+      o.close().catch(() => {
+      });
+    }), () => {
+      l = !0;
+    };
+  }, [C, n.src, n.disableWebAudio, n.waveformSamples]);
+  const k = i(() => {
+    if (d.current && d.current.ctx.state !== "closed")
+      return d.current;
+    if (d.current = null, s.current.disableWebAudio || typeof window > "u")
+      return null;
+    const e = r.current;
+    if (!e)
+      return null;
+    const t = window.AudioContext || window.webkitAudioContext;
+    if (!t)
+      return null;
+    try {
+      const c = new t(), l = c.createMediaElementSource(e), o = c.createAnalyser();
+      return o.fftSize = s.current.fftSize ?? 256, l.connect(o), o.connect(c.destination), d.current = { ctx: c, source: l, analyser: o }, te(c), _(o), d.current;
+    } catch {
+      return null;
+    }
+  }, []);
+  v(() => () => {
+    d.current?.ctx.close().catch(() => {
+    }), d.current = null;
+  }, []);
+  const re = i(async () => {
+    const e = r.current;
+    if (!e)
+      return;
+    const t = k();
+    t && t.ctx.state === "suspended" && await t.ctx.resume().catch(() => {
+    });
+    try {
+      await e.play();
+    } catch {
+    }
+  }, [k]), ae = i(() => {
+    r.current?.pause();
+  }, []), ue = i(() => {
+    const e = r.current;
+    if (!e)
+      return;
+    const t = k();
+    t && t.ctx.state === "suspended" && t.ctx.resume().catch(() => {
+    }), e.paused ? e.play().catch(() => {
+    }) : e.pause();
+  }, [k]), ce = i((e) => {
+    const t = r.current;
+    if (!t)
+      return;
+    const c = Number.isFinite(t.duration) ? t.duration : 1 / 0;
+    t.currentTime = Math.max(0, Math.min(e, c));
+  }, []), se = i((e) => {
+    const t = r.current;
+    if (!t)
+      return;
+    const c = Number.isFinite(t.duration) ? t.duration : 1 / 0;
+    t.currentTime = Math.max(0, Math.min(t.currentTime + e, c));
+  }, []), oe = i((e) => {
+    const t = r.current;
+    t && (t.volume = Math.max(0, Math.min(1, e)), e > 0 && t.muted && (t.muted = !1));
+  }, []), ie = i(() => {
+    r.current && (r.current.muted = !0);
+  }, []), le = i(() => {
+    r.current && (r.current.muted = !1);
+  }, []), de = i(() => {
+    const e = r.current;
+    e && (e.muted = !e.muted);
+  }, []), fe = i((e) => {
+    r.current && (r.current.playbackRate = e);
+  }, []);
+  return {
+    audioRef: r,
+    playing: h,
+    paused: !h,
+    ended: $,
+    currentTime: E,
+    duration: L,
+    buffered: g,
+    volume: j,
+    muted: H,
+    playbackRate: U,
+    isLoading: q,
+    error: J,
+    canPlay: O,
+    currentSrc: C,
+    peaks: Q,
+    peaksLoading: X,
+    peaksError: Y,
+    analyser: Z,
+    audioContext: ee,
+    play: re,
+    pause: ae,
+    toggle: ue,
+    seek: ce,
+    seekBy: se,
+    setVolume: oe,
+    mute: ie,
+    unmute: le,
+    toggleMute: de,
+    setPlaybackRate: fe
+  };
+}
+export {
+  ye as useAudio
+};

package/dist/node_modules/@gfazioli/mantine-video/dist/esm/Video.context.js

@@ -0,0 +1,15 @@
+import { createContext as t, useContext as n } from "react";
+const o = t(null), d = o.Provider;
+function i() {
+  const e = n(o);
+  if (!e)
+    throw new Error(
+      "Video compound component must be rendered inside a <Video /> parent. If you need access to the video state outside the <Video /> tree, use the useVideo() hook instead."
+    );
+  return e;
+}
+export {
+  o as VideoContext,
+  d as VideoProvider,
+  i as useVideoContext
+};