@layers-app/shared 0.4.6 → 0.4.8

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
+};

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

@@ -0,0 +1,272 @@
+import { factory as ge, useProps as pe, useStyles as ye, Box as ke, createVarsResolver as be, getThemeColor as ve, getRadius as he } from "@mantine/core";
+import u, { useRef as V, useEffect as I, useCallback as k, useState as Te } from "react";
+import { VideoCaptionsButton as Ce } from "./components/VideoCaptionsButton.js";
+import { VideoControls as N } from "./components/VideoControls.js";
+import { VideoFullscreenButton as Ve } from "./components/VideoFullscreenButton.js";
+import { VideoMuteButton as x } from "./components/VideoMuteButton.js";
+import { VideoPiPButton as Pe } from "./components/VideoPiPButton.js";
+import { VideoPlayButton as Re } from "./components/VideoPlayButton.js";
+import { VideoSkipButton as Be } from "./components/VideoSkipButton.js";
+import { VideoTimeDisplay as De } from "./components/VideoTimeDisplay.js";
+import { VideoTimeline as we } from "./components/VideoTimeline.js";
+import { useVideo as Ee } from "./use-video.js";
+import { VideoProvider as Ae } from "./Video.context.js";
+import L from "./Video.module.css.js";
+const Me = {
+  color: "blue",
+  radius: "md",
+  size: "md",
+  variant: "overlay",
+  preload: "metadata",
+  playsInline: !0,
+  fit: "contain",
+  backgroundMuteButton: !0
+}, Fe = be(
+  (l, { color: f, radius: n, fit: d, asBackground: c }) => {
+    const a = ve(f, l);
+    return {
+      root: {
+        "--video-color": a,
+        "--video-radius": n === void 0 ? void 0 : he(n),
+        "--video-bg": "black",
+        "--video-controls-bg": "linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.35) 60%, transparent 100%)",
+        "--video-controls-height": "44px",
+        "--video-controls-text-color": "white",
+        "--video-timeline-color": a,
+        "--video-timeline-thumb-color": a,
+        "--video-object-fit": c ? "cover" : d ?? "contain"
+      }
+    };
+  }
+), t = ge((l) => {
+  const f = pe("Video", Me, l), {
+    ref: n,
+    src: d,
+    sources: c,
+    fallbackSrc: a,
+    poster: _,
+    controls: Se,
+    autoPlay: P,
+    muted: R,
+    loop: B,
+    playsInline: H,
+    preload: j,
+    playing: K,
+    onPlayChange: z,
+    currentTime: U,
+    onCurrentTimeChange: q,
+    volume: J,
+    onVolumeChange: O,
+    playbackRate: X,
+    onPlaybackRateChange: G,
+    color: Ie,
+    radius: Ne,
+    aspectRatio: g,
+    size: Q,
+    variant: b,
+    onEnded: W,
+    onError: Y,
+    onEnterPictureInPicture: Z,
+    onLeavePictureInPicture: $,
+    onFullscreenChange: ee,
+    fit: xe,
+    // Pulled out so they don't leak onto the root DOM element via `...others`.
+    // The effective values are derived from `_props.*` below (background mode
+    // flips their defaults), so the destructured copies are intentionally unused.
+    shortcuts: Le,
+    clickToToggle: _e,
+    doubleClickToFullscreen: He,
+    autoHideControls: je,
+    asBackground: i,
+    backgroundMuteButton: oe,
+    children: te,
+    classNames: re,
+    style: D,
+    styles: le,
+    unstyled: ne,
+    vars: ae,
+    className: ie,
+    mod: ce,
+    ...se
+  } = f, ue = l.controls ?? !i, v = l.shortcuts ?? !i, w = l.clickToToggle ?? !i, E = l.doubleClickToFullscreen ?? !i, s = l.autoHideControls ?? (i ? 0 : 3e3), p = ye({
+    name: "Video",
+    props: f,
+    classes: L,
+    className: ie,
+    style: D,
+    classNames: re,
+    styles: le,
+    unstyled: ne,
+    vars: ae,
+    varsResolver: Fe
+  }), o = Ee({
+    src: d,
+    autoPlay: P,
+    muted: R,
+    loop: B,
+    playing: K,
+    onPlayChange: z,
+    currentTime: U,
+    onCurrentTimeChange: q,
+    volume: J,
+    onVolumeChange: O,
+    playbackRate: X,
+    onPlaybackRateChange: G,
+    onEnded: W,
+    onError: Y,
+    onEnterPictureInPicture: Z,
+    onLeavePictureInPicture: $,
+    onFullscreenChange: ee
+  }), A = Array.isArray(c) && c.length > 0, h = V(!1);
+  I(() => {
+    h.current = !1;
+  }, [d, c, a]);
+  const de = k(() => {
+    if (!a || h.current)
+      return;
+    const e = o.videoRef.current;
+    e && (h.current = !0, e.removeAttribute("src"), e.querySelectorAll("source").forEach((r) => r.remove()), e.src = a, e.load());
+  }, [a, o.videoRef]), [M, T] = Te(!0), m = V(null), y = k(() => {
+    T(!0), m.current && clearTimeout(m.current), s && s > 0 && o.playing && (m.current = setTimeout(() => T(!1), s));
+  }, [s, o.playing]);
+  I(() => (y(), () => {
+    m.current && clearTimeout(m.current);
+  }), [y, o.playing]);
+  const C = V(0), me = k(
+    (e) => {
+      if (e.target !== e.currentTarget && e.target.tagName !== "VIDEO")
+        return;
+      const r = Date.now(), S = r - C.current < 300;
+      if (C.current = r, S && E) {
+        o.toggleFullscreen();
+        return;
+      }
+      w && !S && setTimeout(() => {
+        Date.now() - C.current >= 250 && o.toggle();
+      }, 260);
+    },
+    [w, E, o]
+  ), fe = k(
+    (e) => {
+      if (!v) return;
+      const r = e.target;
+      if (!(r.tagName === "INPUT" || r.tagName === "TEXTAREA"))
+        switch (e.key) {
+          case " ":
+          case "k":
+          case "K":
+            e.preventDefault(), o.toggle();
+            break;
+          case "ArrowLeft":
+          case "j":
+          case "J":
+            e.preventDefault(), o.seekBy(e.key === "ArrowLeft" ? -5 : -10);
+            break;
+          case "ArrowRight":
+          case "l":
+          case "L":
+            e.preventDefault(), o.seekBy(e.key === "ArrowRight" ? 5 : 10);
+            break;
+          case "ArrowUp":
+            e.preventDefault(), o.setVolume(Math.min(1, o.volume + 0.05));
+            break;
+          case "ArrowDown":
+            e.preventDefault(), o.setVolume(Math.max(0, o.volume - 0.05));
+            break;
+          case "m":
+          case "M":
+            e.preventDefault(), o.toggleMute();
+            break;
+          case "f":
+          case "F":
+            e.preventDefault(), o.toggleFullscreen();
+            break;
+          case "p":
+          case "P":
+            e.preventDefault(), o.togglePiP();
+            break;
+        }
+    },
+    [v, o]
+  ), F = b === "minimal" || b === "bordered";
+  return /* @__PURE__ */ u.createElement(
+    Ae,
+    {
+      value: {
+        ...o,
+        getStyles: p,
+        controlsVisible: M,
+        showControls: y
+      }
+    },
+    /* @__PURE__ */ u.createElement(
+      ke,
+      {
+        ...p("root", {
+          style: [
+            g && !F ? { aspectRatio: String(g) } : void 0,
+            D
+          ]
+        }),
+        ...se,
+        ref: (e) => {
+          o.containerRef.current = e, typeof n == "function" ? n(e) : n && typeof n == "object" && (n.current = e);
+        },
+        mod: [
+          {
+            variant: b,
+            size: Q,
+            playing: o.playing,
+            paused: o.paused && !o.ended,
+            ended: o.ended,
+            fullscreen: o.fullscreen,
+            "controls-visible": M,
+            "as-background": i
+          },
+          ce
+        ],
+        tabIndex: v ? 0 : void 0,
+        onMouseMove: y,
+        onMouseLeave: () => {
+          s && s > 0 && o.playing && T(!1);
+        },
+        onClick: me,
+        onKeyDown: fe
+      },
+      /* @__PURE__ */ u.createElement(
+        "video",
+        {
+          ...p("video", {
+            style: g && F ? { aspectRatio: String(g) } : void 0
+          }),
+          ref: o.videoRef,
+          src: A ? void 0 : d,
+          poster: _,
+          autoPlay: P,
+          muted: R,
+          loop: B,
+          playsInline: H,
+          preload: j,
+          onError: de
+        },
+        A ? c.map((e, r) => /* @__PURE__ */ u.createElement("source", { key: r, src: e.src, type: e.type, media: e.media })) : null
+      ),
+      i && oe && /* @__PURE__ */ u.createElement(x, { ...p("backgroundMuteButton") }),
+      te ?? (ue && /* @__PURE__ */ u.createElement(N, null))
+    )
+  );
+});
+t.classes = L;
+t.displayName = "Video";
+t.Controls = N;
+t.PlayButton = Re;
+t.Timeline = we;
+t.TimeDisplay = De;
+t.MuteButton = x;
+t.FullscreenButton = Ve;
+t.PiPButton = Pe;
+t.CaptionsButton = Ce;
+t.SkipButton = Be;
+export {
+  t as Video
+};