@glitchlab/react-video-player 0.1.2 → 1.0.1

package/dist/index.mjs

@@ -1,43 +1,58 @@
-import { jsx as t, jsxs as w, Fragment as V } from "react/jsx-runtime";
-import _, { useRef as x, useImperativeHandle as U, useEffect as Z, useState as y, useMemo as H } from "react";
-import m from "hls.js";
-const P = _.forwardRef(
-  ({ src: e, hlsConfig: l, isHls: o, ...r }, d) => {
-    const f = x(null), s = x(null);
-    U(d, () => f.current);
-    const k = typeof window < "u" && m.isSupported(), C = !!o || k && typeof e == "string" && e.endsWith(".m3u8");
-    return Z(() => {
+"use client";
+import { jsx as r, jsxs as v } from "react/jsx-runtime";
+import X, { useRef as m, useImperativeHandle as _, useEffect as q, useState as M, useMemo as B, useCallback as C } from "react";
+import S from "hls.js";
+function x(e) {
+  var o, l, t = "";
+  if (typeof e == "string" || typeof e == "number") t += e;
+  else if (typeof e == "object") if (Array.isArray(e)) {
+    var i = e.length;
+    for (o = 0; o < i; o++) e[o] && (l = x(e[o])) && (t && (t += " "), t += l);
+  } else for (l in e) e[l] && (t && (t += " "), t += l);
+  return t;
+}
+function I() {
+  for (var e, o, l = 0, t = "", i = arguments.length; l < i; l++) (e = arguments[l]) && (o = x(e)) && (t && (t += " "), t += o);
+  return t;
+}
+const Z = X.forwardRef(
+  ({ src: e, hlsConfig: o, isHls: l, children: t, ...i }, h) => {
+    const p = m(null), a = m(null);
+    _(h, () => p.current);
+    const H = globalThis.window !== void 0 && S.isSupported(), g = !!l || H && typeof e == "string" && e.endsWith(".m3u8");
+    return q(() => {
       if (!e) return;
-      const n = f.current;
+      const n = p.current;
       if (n) {
-        for (s.current && (s.current.destroy(), s.current = null), n.pause(), n.removeAttribute("src"); n.firstChild; ) n.removeChild(n.firstChild);
-        if (C) {
-          const h = new m(l);
-          s.current = h, h.attachMedia(n), h.loadSource(e), h.on(m.Events.ERROR, (c, a) => {
-            a.fatal && (h.destroy(), s.current = null);
+        for (a.current && (a.current.destroy(), a.current = null), n.pause(), n.removeAttribute("src"); n.firstChild; ) n.firstChild.remove();
+        if (g) {
+          const s = new S(o);
+          a.current = s, s.attachMedia(n), s.loadSource(e), s.on(S.Events.ERROR, (d, P) => {
+            P.fatal && (s.destroy(), a.current = null);
           });
         } else
           n.src = e, n.load();
         return () => {
-          for (s.current && (s.current.destroy(), s.current = null), n.pause(), n.removeAttribute("src"); n.firstChild; ) n.removeChild(n.firstChild);
+          for (a.current && (a.current.destroy(), a.current = null), n.pause(), n.removeAttribute("src"); n.firstChild; ) n.firstChild.remove();
           n.load();
         };
       }
-    }, [e, C, l]), /* @__PURE__ */ t("video", { ref: f, ...r });
+    }, [e, g, o]), /* @__PURE__ */ r("video", { ref: p, ...i, children: t });
   }
 );
-P.displayName = "HLSPlayer";
-const z = ({ className: e = "" }) => /* @__PURE__ */ w(
+Z.displayName = "HLSPlayer";
+const V = "gvp-icon", N = (e) => e ? `${V} ${e}` : V, z = ({ className: e }) => /* @__PURE__ */ v(
   "svg",
   {
-    className: e,
-    width: "24",
-    height: "24",
+    className: N(e),
+    width: "20",
+    height: "20",
     viewBox: "0 0 24 24",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true",
     children: [
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ r(
         "path",
         {
           d: "M14 2H10C6.72077 2 5.08116 2 3.91891 2.81382C3.48891 3.1149 3.1149 3.48891 2.81382 3.91891C2 5.08116 2 6.72077 2 10C2 13.2792 2 14.9188 2.81382 16.0811C3.1149 16.5111 3.48891 16.8851 3.91891 17.1862C5.08116 18 6.72077 18 10 18H14C17.2792 18 18.9188 18 20.0811 17.1862C20.5111 16.8851 20.8851 16.5111 21.1862 16.0811C22 14.9188 22 13.2792 22 10C22 6.72077 22 5.08116 21.1862 3.91891C20.8851 3.48891 20.5111 3.1149 20.0811 2.81382C18.9188 2 17.2792 2 14 2Z",
@@ -46,7 +61,7 @@ const z = ({ className: e = "" }) => /* @__PURE__ */ w(
           strokeLinecap: "round"
         }
       ),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ r(
         "path",
         {
           d: "M11 15H13",
@@ -56,7 +71,7 @@ const z = ({ className: e = "" }) => /* @__PURE__ */ w(
           strokeLinejoin: "round"
         }
       ),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ r(
         "path",
         {
           d: "M14.5 22L14.1845 21.5811C13.4733 20.6369 13.2969 19.1944 13.7468 18M9.5 22L9.8155 21.5811C10.5267 20.6369 10.7031 19.1944 10.2532 18",
@@ -65,20 +80,21 @@ const z = ({ className: e = "" }) => /* @__PURE__ */ w(
           strokeLinecap: "round"
         }
       ),
-      /* @__PURE__ */ t("path", { d: "M7 22H17", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+      /* @__PURE__ */ r("path", { d: "M7 22H17", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
     ]
   }
-), O = ({ className: e = "" }) => /* @__PURE__ */ w(
+), G = ({ className: e }) => /* @__PURE__ */ v(
   "svg",
   {
-    className: e,
-    width: "24",
-    height: "24",
+    className: N(e),
+    width: "20",
+    height: "20",
     viewBox: "0 0 24 24",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true",
     children: [
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ r(
         "path",
         {
           d: "M5 9C5 5.70017 5 4.05025 6.02513 3.02513C7.05025 2 8.70017 2 12 2C15.2998 2 16.9497 2 17.9749 3.02513C19 4.05025 19 5.70017 19 9V15C19 18.2998 19 19.9497 17.9749 20.9749C16.9497 22 15.2998 22 12 22C8.70017 22 7.05025 22 6.02513 20.9749C5 19.9497 5 18.2998 5 15V9Z",
@@ -87,7 +103,7 @@ const z = ({ className: e = "" }) => /* @__PURE__ */ w(
           strokeLinecap: "round"
         }
       ),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ r(
         "path",
         {
           d: "M11 19H13",
@@ -97,7 +113,7 @@ const z = ({ className: e = "" }) => /* @__PURE__ */ w(
           strokeLinejoin: "round"
         }
       ),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ r(
         "path",
         {
           d: "M9 2L9.089 2.53402C9.28188 3.69129 9.37832 4.26993 9.77519 4.62204C10.1892 4.98934 10.7761 5 12 5C13.2239 5 13.8108 4.98934 14.2248 4.62204C14.6217 4.26993 14.7181 3.69129 14.911 2.53402L15 2",
@@ -108,202 +124,188 @@ const z = ({ className: e = "" }) => /* @__PURE__ */ w(
       )
     ]
   }
-), R = ({ className: e = "" }) => /* @__PURE__ */ t(
+), K = ({ className: e }) => /* @__PURE__ */ r(
   "svg",
   {
-    className: e,
+    className: N(e),
     width: "14",
     height: "14",
     viewBox: "0 0 14 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ t(
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ r(
       "path",
       {
         d: "M6.94994 5.53594L12.1929 0.292938C12.5834 -0.0975275 13.2165 -0.0975279 13.6069 0.292938C13.9974 0.683403 13.9974 1.31647 13.6069 1.70694L8.36394 6.94994L13.6069 12.1929C13.9974 12.5834 13.9974 13.2165 13.6069 13.6069C13.2165 13.9974 12.5834 13.9974 12.1929 13.6069L6.94994 8.36394L1.70694 13.6069C1.31647 13.9974 0.683403 13.9974 0.292938 13.6069C-0.0975279 13.2165 -0.0975277 12.5834 0.292938 12.1929L5.53594 6.94994L0.292938 1.70694C-0.0975279 1.31647 -0.0975279 0.683403 0.292938 0.292938C0.683403 -0.0975279 1.31647 -0.0975277 1.70694 0.292938L6.94994 5.53594Z",
-        fill: "white"
+        fill: "currentColor"
       }
     )
   }
-), T = ({ className: e = "" }) => /* @__PURE__ */ w(
+), Q = ({ className: e }) => /* @__PURE__ */ r(
   "svg",
   {
-    className: e,
-    width: "16",
-    height: "16",
+    className: N(e),
+    width: "22",
+    height: "22",
     viewBox: "0 0 16 16",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ t(
-        "mask",
-        {
-          id: "mask0_4364_137031",
-          style: { maskType: "alpha" },
-          maskUnits: "userSpaceOnUse",
-          x: "0",
-          y: "0",
-          width: "16",
-          height: "16",
-          children: /* @__PURE__ */ t("rect", { width: "16", height: "16", fill: "#D9D9D9" })
-        }
-      ),
-      /* @__PURE__ */ t("g", { mask: "url(#mask0_4364_137031)", children: /* @__PURE__ */ t(
-        "path",
-        {
-          d: "M5.3335 11.45V4.54997C5.3335 4.36108 5.40016 4.20275 5.5335 4.07497C5.66683 3.94719 5.82238 3.8833 6.00016 3.8833C6.05572 3.8833 6.11405 3.89163 6.17516 3.9083C6.23627 3.92497 6.29461 3.94997 6.35016 3.9833L11.7835 7.4333C11.8835 7.49997 11.9585 7.5833 12.0085 7.6833C12.0585 7.7833 12.0835 7.88886 12.0835 7.99997C12.0835 8.11108 12.0585 8.21663 12.0085 8.31663C11.9585 8.41663 11.8835 8.49997 11.7835 8.56663L6.35016 12.0166C6.29461 12.05 6.23627 12.075 6.17516 12.0916C6.11405 12.1083 6.05572 12.1166 6.00016 12.1166C5.82238 12.1166 5.66683 12.0527 5.5335 11.925C5.40016 11.7972 5.3335 11.6389 5.3335 11.45Z",
-          fill: "white"
-        }
-      ) })
-    ]
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ r(
+      "path",
+      {
+        d: "M5.3335 11.45V4.54997C5.3335 4.36108 5.40016 4.20275 5.5335 4.07497C5.66683 3.94719 5.82238 3.8833 6.00016 3.8833C6.05572 3.8833 6.11405 3.89163 6.17516 3.9083C6.23627 3.92497 6.29461 3.94997 6.35016 3.9833L11.7835 7.4333C11.8835 7.49997 11.9585 7.5833 12.0085 7.6833C12.0585 7.7833 12.0835 7.88886 12.0835 7.99997C12.0835 8.11108 12.0585 8.21663 12.0085 8.31663C11.9585 8.41663 11.8835 8.49997 11.7835 8.56663L6.35016 12.0166C6.29461 12.05 6.23627 12.075 6.17516 12.0916C6.11405 12.1083 6.05572 12.1166 6.00016 12.1166C5.82238 12.1166 5.66683 12.0527 5.5335 11.925C5.40016 11.7972 5.3335 11.6389 5.3335 11.45Z",
+        fill: "currentColor"
+      }
+    )
   }
-);
-function S(e) {
-  var l, o, r = "";
-  if (typeof e == "string" || typeof e == "number") r += e;
-  else if (typeof e == "object") if (Array.isArray(e)) {
-    var d = e.length;
-    for (l = 0; l < d; l++) e[l] && (o = S(e[l])) && (r && (r += " "), r += o);
-  } else for (o in e) e[o] && (r && (r += " "), r += o);
-  return r;
-}
-function b() {
-  for (var e, l, o = 0, r = "", d = arguments.length; o < d; o++) (e = arguments[o]) && (l = S(e)) && (r && (r += " "), r += l);
-  return r;
-}
-const q = ({
+), e1 = ({
   src: e,
-  poster: l,
-  showDeviceToggle: o = !0,
-  defaultDevice: r = "desktop",
-  hoverPlay: d = !1,
-  tooltipText: f,
-  onClose: s,
-  className: k = "",
-  muted: C = !0,
-  loop: n = !1,
-  controls: h = !1,
-  frameMaxWidth: c,
-  aspectRatio: a
+  poster: o,
+  showDeviceToggle: l = !0,
+  defaultDevice: t = "desktop",
+  hoverPlay: i = !1,
+  tooltipText: h,
+  onClose: p,
+  className: a = "",
+  muted: H = !0,
+  loop: g = !1,
+  controls: n = !1,
+  frameMaxWidth: s,
+  aspectRatio: d,
+  hlsConfig: P,
+  children: D
 }) => {
-  const g = x(null), [p, L] = y(r), [N, u] = y(!1), [M, v] = y(!1), j = H(() => p === "mobile" ? (a == null ? void 0 : a.mobile) ?? "9/16" : (a == null ? void 0 : a.desktop) ?? "16/9", [p, a]), I = H(() => p === "mobile" ? (c == null ? void 0 : c.mobile) ?? "420px" : (c == null ? void 0 : c.desktop) ?? "960px", [p, c]), E = async () => {
-    if (!d) return;
-    const i = g.current;
-    if (i)
-      try {
-        i.readyState < 2 && i.load(), await i.play(), u(!0);
-      } catch {
-        u(!1);
-      }
-  }, B = () => {
-    if (!d) return;
-    const i = g.current;
-    i && (i.pause(), u(!1));
-  }, D = async () => {
-    const i = g.current;
-    if (i)
+  const w = m(null), k = m(null), [u, j] = M(t), [R, f] = M(!1), [T, y] = M(!1), U = B(() => u === "mobile" ? (d == null ? void 0 : d.mobile) ?? "9/16" : (d == null ? void 0 : d.desktop) ?? "16/9", [u, d]), $ = B(() => u === "mobile" ? (s == null ? void 0 : s.mobile) ?? "420px" : (s == null ? void 0 : s.desktop) ?? "960px", [u, s]), b = C(async () => {
+    const c = w.current;
+    if (c) {
+      if (k.current)
+        try {
+          await k.current;
+        } catch {
+        }
+      c.pause();
+    }
+  }, []), L = C(async () => {
+    const c = w.current;
+    if (c)
       try {
-        i.paused ? (await i.play(), u(!0)) : (i.pause(), u(!1));
+        c.readyState < 2 && c.load();
+        const E = c.play();
+        k.current = E, await E, f(!0);
       } catch {
-        u(!1);
+        f(!1);
+      } finally {
+        k.current = null;
       }
-  };
-  return /* @__PURE__ */ w(
-    "div",
-    {
-      className: b(
-        "relative overflow-hidden rounded-3xl",
-        "bg-neutral-900/30 shadow-2xl",
-        "ring-1 ring-white/10",
-        "mx-auto w-full",
-        k
-      ),
-      style: { width: I, aspectRatio: j },
-      onMouseEnter: () => {
-        v(!0), E();
-      },
-      onMouseLeave: () => {
-        v(!1), B();
-      },
-      children: [
-        /* @__PURE__ */ t(
-          P,
-          {
-            ref: g,
-            src: e,
-            poster: l,
-            muted: C,
-            loop: n,
-            playsInline: !0,
-            preload: "metadata",
-            controls: h,
-            className: "h-full w-full object-cover",
-            onPlay: () => u(!0),
-            onPause: () => u(!1)
-          }
-        ),
-        /* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 bg-linear-to-tr from-black/35 via-black/0 to-black/35" }),
-        o && /* @__PURE__ */ t("div", { className: "absolute left-4 top-4", children: /* @__PURE__ */ w("div", { className: "flex items-center overflow-hidden rounded-2xl bg-white/95 shadow-lg ring-1 ring-black/5", children: [
-          /* @__PURE__ */ t(
+  }, []), J = C(() => {
+    i && L();
+  }, [i, L]), O = C(() => {
+    i && b().then(() => f(!1));
+  }, [i, b]), W = C(async () => {
+    const c = w.current;
+    c && (c.paused ? await L() : (await b(), f(!1)));
+  }, [L, b]);
+  return (
+    // The mouse handlers are a progressive enhancement (hoverPlay + tooltip).
+    // Keyboard/click users reach the same actions via the inner <button> elements,
+    // so the outer container is intentionally non-interactive at the role level.
+    // NOSONAR: typescript:S6848
+    /* @__PURE__ */ v(
+      "div",
+      {
+        className: I("gvp-root", a),
+        style: { width: $, aspectRatio: U },
+        onMouseEnter: () => {
+          y(!0), J();
+        },
+        onMouseLeave: () => {
+          y(!1), O();
+        },
+        children: [
+          /* @__PURE__ */ r(
+            Z,
+            {
+              ref: w,
+              src: e,
+              poster: o,
+              muted: H,
+              loop: g,
+              playsInline: !0,
+              preload: "metadata",
+              controls: n,
+              hlsConfig: P,
+              className: "gvp-video",
+              onPlay: () => f(!0),
+              onPause: () => f(!1),
+              children: D
+            }
+          ),
+          /* @__PURE__ */ r("div", { className: "gvp-vignette" }),
+          l && /* @__PURE__ */ r("div", { className: "gvp-toggle", children: /* @__PURE__ */ v("div", { className: "gvp-toggle-pill", children: [
+            /* @__PURE__ */ r(
+              "button",
+              {
+                type: "button",
+                onClick: () => j("desktop"),
+                className: I(
+                  "gvp-toggle-btn",
+                  u === "desktop" && "is-active"
+                ),
+                "aria-label": "Desktop view",
+                "aria-pressed": u === "desktop",
+                children: /* @__PURE__ */ r(z, {})
+              }
+            ),
+            /* @__PURE__ */ r("div", { className: "gvp-toggle-divider" }),
+            /* @__PURE__ */ r(
+              "button",
+              {
+                type: "button",
+                onClick: () => j("mobile"),
+                className: I(
+                  "gvp-toggle-btn",
+                  u === "mobile" && "is-active"
+                ),
+                "aria-label": "Mobile view",
+                "aria-pressed": u === "mobile",
+                children: /* @__PURE__ */ r(G, {})
+              }
+            )
+          ] }) }),
+          p && /* @__PURE__ */ r(
             "button",
             {
               type: "button",
-              onClick: () => L("desktop"),
-              className: b(
-                "flex items-center gap-2 px-4 py-2 text-sm font-semibold z-10 cursor-pointer",
-                p === "desktop" ? "text-violet-700" : "text-neutral-500 hover:text-neutral-700"
-              ),
-              children: /* @__PURE__ */ t(z, { className: "h-5 w-5" })
+              onClick: p,
+              className: "gvp-close",
+              "aria-label": "Close",
+              children: /* @__PURE__ */ r(K, {})
             }
           ),
-          /* @__PURE__ */ t("div", { className: "h-7 w-px bg-neutral-200" }),
-          /* @__PURE__ */ t(
+          !R && /* @__PURE__ */ r("div", { className: "gvp-play-wrap", children: /* @__PURE__ */ v(
             "button",
             {
               type: "button",
-              onClick: () => L("mobile"),
-              className: b(
-                "flex items-center gap-2 px-4 py-2 text-sm font-semibold z-10 cursor-pointer",
-                p === "mobile" ? "text-violet-700" : "text-neutral-500 hover:text-neutral-700"
-              ),
-              children: /* @__PURE__ */ t(O, { className: "h-5 w-5 " })
+              onClick: () => void W(),
+              onMouseEnter: () => y(!0),
+              onMouseLeave: () => y(!1),
+              className: "gvp-play",
+              "aria-label": "Play",
+              children: [
+                /* @__PURE__ */ r(Q, {}),
+                h && T && /* @__PURE__ */ r("span", { className: "gvp-tooltip", role: "tooltip", children: h })
+              ]
             }
-          )
-        ] }) }),
-        s && /* @__PURE__ */ t(
-          "button",
-          {
-            type: "button",
-            onClick: s,
-            className: "absolute right-4 top-4 grid h-10 w-10 place-items-center rounded-full bg-black/35 text-white backdrop-blur-md ring-1 ring-white/15 hover:bg-black/50 cursor-pointer z-10",
-            "aria-label": "Close",
-            children: /* @__PURE__ */ t(R, { className: "h-5 w-5" })
-          }
-        ),
-        !N && /* @__PURE__ */ t(V, { children: /* @__PURE__ */ t("div", { className: "absolute inset-0 grid place-items-center", children: /* @__PURE__ */ w(
-          "button",
-          {
-            type: "button",
-            onClick: () => void D(),
-            onMouseEnter: () => v(!0),
-            onMouseLeave: () => v(!1),
-            className: b(
-              "relative grid h-14 w-14 place-items-center rounded-full cursor-pointer ring-1 ring-white/15",
-              "bg-violet-700/50 hover:bg-violet-700/90 bg-neutral-200/5 bg-blend-overlay shadow-xl",
-              "transition-opacity duration-200"
-            ),
-            "aria-label": "Play",
-            children: [
-              /* @__PURE__ */ t(T, { className: "h-7 w-7 translate-x-px" }),
-              f && M && !N && /* @__PURE__ */ t("div", { className: "absolute -top-12 left-1/2 -translate-x-1/2 whitespace-nowrap rounded-xl bg-black/70 px-3 py-1.5 text-xs text-white shadow-lg ring-1 ring-white/10 backdrop-blur", children: f })
-            ]
-          }
-        ) }) }),
-        /* @__PURE__ */ t("div", { className: "pointer-events-none absolute bottom-0 left-0 right-0 h-16 bg-linear-to-t from-black/35 to-transparent" })
-      ]
-    }
+          ) }),
+          /* @__PURE__ */ r("div", { className: "gvp-bottom-fade" })
+        ]
+      }
+    )
   );
 };
 export {
-  q as ReactVideoPlayer
+  e1 as ReactVideoPlayer
 };
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../src/HLSPlayer.tsx","../src/utils/icons.tsx","../src/VideoPlayerWrapper.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","\"use client\";\n\nimport Hls from \"hls.js\";\nimport React, { useEffect, useImperativeHandle, useRef } from \"react\";\nimport type { HLSPlayerProps } from \"./types\";\n\nexport const HLSPlayer = React.forwardRef<HTMLVideoElement, HLSPlayerProps>(\n    ({ src, hlsConfig, isHls, children, ...videoProps }, forwardedRef) => {\n        const internalRef = useRef<HTMLVideoElement | null>(null);\n        const hlsRef = useRef<Hls | null>(null);\n\n        useImperativeHandle(forwardedRef, () => internalRef.current as HTMLVideoElement);\n\n        const canUseHlsJs = globalThis.window !== undefined && Hls.isSupported();\n        const shouldUseHls =\n            Boolean(isHls) || (canUseHlsJs && typeof src === \"string\" && src.endsWith(\".m3u8\"));\n\n        useEffect(() => {\n            if (!src) return;\n            const videoEl = internalRef.current;\n            if (!videoEl) return;\n\n            // destroy previous\n            if (hlsRef.current) {\n                hlsRef.current.destroy();\n                hlsRef.current = null;\n            }\n\n            // reset video element\n            videoEl.pause();\n            videoEl.removeAttribute(\"src\");\n            while (videoEl.firstChild) videoEl.firstChild.remove();\n\n            if (shouldUseHls) {\n                const hls = new Hls(hlsConfig);\n                hlsRef.current = hls;\n\n                hls.attachMedia(videoEl);\n                hls.loadSource(src);\n\n                hls.on(Hls.Events.ERROR, (_evt, data) => {\n                    if (data.fatal) {\n                        hls.destroy();\n                        hlsRef.current = null;\n                    }\n                });\n            } else {\n                // native playback\n                videoEl.src = src;\n                videoEl.load();\n            }\n\n            return () => {\n                if (hlsRef.current) {\n                    hlsRef.current.destroy();\n                    hlsRef.current = null;\n                }\n                videoEl.pause();\n                videoEl.removeAttribute(\"src\");\n                while (videoEl.firstChild) videoEl.firstChild.remove();\n                videoEl.load();\n            };\n        }, [src, shouldUseHls, hlsConfig]);\n\n        // Captions are the consumer's responsibility — pass <track> elements as children.\n        // NOSONAR: typescript:S4084\n        return (\n            <video ref={internalRef} {...videoProps}>\n                {children}\n            </video>\n        );\n    }\n);\n\nHLSPlayer.displayName = \"HLSPlayer\";\nexport default HLSPlayer;\n","\"use client\";\n\nimport React from \"react\";\n\ntype IconProps = { className?: string };\n\nconst baseClass = \"gvp-icon\";\nconst cls = (extra?: string) => (extra ? `${baseClass} ${extra}` : baseClass);\n\nexport const IconDesktop: React.FC<IconProps> = ({ className }) => (\n    <svg\n        className={cls(className)}\n        width=\"20\"\n        height=\"20\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        aria-hidden=\"true\"\n    >\n        <path\n            d=\"M14 2H10C6.72077 2 5.08116 2 3.91891 2.81382C3.48891 3.1149 3.1149 3.48891 2.81382 3.91891C2 5.08116 2 6.72077 2 10C2 13.2792 2 14.9188 2.81382 16.0811C3.1149 16.5111 3.48891 16.8851 3.91891 17.1862C5.08116 18 6.72077 18 10 18H14C17.2792 18 18.9188 18 20.0811 17.1862C20.5111 16.8851 20.8851 16.5111 21.1862 16.0811C22 14.9188 22 13.2792 22 10C22 6.72077 22 5.08116 21.1862 3.91891C20.8851 3.48891 20.5111 3.1149 20.0811 2.81382C18.9188 2 17.2792 2 14 2Z\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n        />\n        <path\n            d=\"M11 15H13\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n        />\n        <path\n            d=\"M14.5 22L14.1845 21.5811C13.4733 20.6369 13.2969 19.1944 13.7468 18M9.5 22L9.8155 21.5811C10.5267 20.6369 10.7031 19.1944 10.2532 18\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n        />\n        <path d=\"M7 22H17\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n    </svg>\n);\n\nexport const IconMobile: React.FC<IconProps> = ({ className }) => (\n    <svg\n        className={cls(className)}\n        width=\"20\"\n        height=\"20\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        aria-hidden=\"true\"\n    >\n        <path\n            d=\"M5 9C5 5.70017 5 4.05025 6.02513 3.02513C7.05025 2 8.70017 2 12 2C15.2998 2 16.9497 2 17.9749 3.02513C19 4.05025 19 5.70017 19 9V15C19 18.2998 19 19.9497 17.9749 20.9749C16.9497 22 15.2998 22 12 22C8.70017 22 7.05025 22 6.02513 20.9749C5 19.9497 5 18.2998 5 15V9Z\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinecap=\"round\"\n        />\n        <path\n            d=\"M11 19H13\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n        />\n        <path\n            d=\"M9 2L9.089 2.53402C9.28188 3.69129 9.37832 4.26993 9.77519 4.62204C10.1892 4.98934 10.7761 5 12 5C13.2239 5 13.8108 4.98934 14.2248 4.62204C14.6217 4.26993 14.7181 3.69129 14.911 2.53402L15 2\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinejoin=\"round\"\n        />\n    </svg>\n);\n\nexport const IconX: React.FC<IconProps> = ({ className }) => (\n    <svg\n        className={cls(className)}\n        width=\"14\"\n        height=\"14\"\n        viewBox=\"0 0 14 14\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        aria-hidden=\"true\"\n    >\n        <path\n            d=\"M6.94994 5.53594L12.1929 0.292938C12.5834 -0.0975275 13.2165 -0.0975279 13.6069 0.292938C13.9974 0.683403 13.9974 1.31647 13.6069 1.70694L8.36394 6.94994L13.6069 12.1929C13.9974 12.5834 13.9974 13.2165 13.6069 13.6069C13.2165 13.9974 12.5834 13.9974 12.1929 13.6069L6.94994 8.36394L1.70694 13.6069C1.31647 13.9974 0.683403 13.9974 0.292938 13.6069C-0.0975279 13.2165 -0.0975277 12.5834 0.292938 12.1929L5.53594 6.94994L0.292938 1.70694C-0.0975279 1.31647 -0.0975279 0.683403 0.292938 0.292938C0.683403 -0.0975279 1.31647 -0.0975277 1.70694 0.292938L6.94994 5.53594Z\"\n            fill=\"currentColor\"\n        />\n    </svg>\n);\n\nexport const IconPlay: React.FC<IconProps> = ({ className }) => (\n    <svg\n        className={cls(className)}\n        width=\"22\"\n        height=\"22\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        aria-hidden=\"true\"\n    >\n        <path\n            d=\"M5.3335 11.45V4.54997C5.3335 4.36108 5.40016 4.20275 5.5335 4.07497C5.66683 3.94719 5.82238 3.8833 6.00016 3.8833C6.05572 3.8833 6.11405 3.89163 6.17516 3.9083C6.23627 3.92497 6.29461 3.94997 6.35016 3.9833L11.7835 7.4333C11.8835 7.49997 11.9585 7.5833 12.0085 7.6833C12.0585 7.7833 12.0835 7.88886 12.0835 7.99997C12.0835 8.11108 12.0585 8.21663 12.0085 8.31663C11.9585 8.41663 11.8835 8.49997 11.7835 8.56663L6.35016 12.0166C6.29461 12.05 6.23627 12.075 6.17516 12.0916C6.11405 12.1083 6.05572 12.1166 6.00016 12.1166C5.82238 12.1166 5.66683 12.0527 5.5335 11.925C5.40016 11.7972 5.3335 11.6389 5.3335 11.45Z\"\n            fill=\"currentColor\"\n        />\n    </svg>\n);\n","\"use client\";\n\nimport clsx from \"clsx\";\nimport React, { useCallback, useMemo, useRef, useState } from \"react\";\nimport { HLSPlayer } from \"./HLSPlayer\";\nimport type { DeviceMode, VideoPlayerWrapperProps } from \"./types\";\nimport { IconDesktop, IconMobile, IconPlay, IconX } from \"./utils/icons\";\n\nexport const VideoPlayerWrapper: React.FC<VideoPlayerWrapperProps> = ({\n    src,\n    poster,\n    showDeviceToggle = true,\n    defaultDevice = \"desktop\",\n    hoverPlay = false,\n    tooltipText,\n    onClose,\n    className = \"\",\n    muted = true,\n    loop = false,\n    controls = false,\n    frameMaxWidth: customFrameMaxWidth,\n    aspectRatio: customAspectRatio,\n    hlsConfig,\n    children,\n}) => {\n    const videoRef = useRef<HTMLVideoElement | null>(null);\n    const playPromiseRef = useRef<Promise<void> | null>(null);\n\n    const [device, setDevice] = useState<DeviceMode>(defaultDevice);\n    const [isPlaying, setIsPlaying] = useState(false);\n    const [showTooltip, setShowTooltip] = useState(false);\n\n    const aspectRatio = useMemo(() => {\n        return device === \"mobile\"\n            ? (customAspectRatio?.mobile ?? \"9/16\")\n            : (customAspectRatio?.desktop ?? \"16/9\");\n    }, [device, customAspectRatio]);\n\n    const frameMaxWidth = useMemo(() => {\n        return device === \"mobile\"\n            ? (customFrameMaxWidth?.mobile ?? \"420px\")\n            : (customFrameMaxWidth?.desktop ?? \"960px\");\n    }, [device, customFrameMaxWidth]);\n\n    const safePause = useCallback(async () => {\n        const el = videoRef.current;\n        if (!el) return;\n        if (playPromiseRef.current) {\n            try {\n                await playPromiseRef.current;\n            } catch {\n                /* play was interrupted; nothing to await */\n            }\n        }\n        el.pause();\n    }, []);\n\n    const safePlay = useCallback(async () => {\n        const el = videoRef.current;\n        if (!el) return;\n        try {\n            if (el.readyState < 2) el.load();\n            const p = el.play();\n            playPromiseRef.current = p;\n            await p;\n            setIsPlaying(true);\n        } catch {\n            setIsPlaying(false);\n        } finally {\n            playPromiseRef.current = null;\n        }\n    }, []);\n\n    const hoverStart = useCallback(() => {\n        if (!hoverPlay) return;\n        void safePlay();\n    }, [hoverPlay, safePlay]);\n\n    const hoverStop = useCallback(() => {\n        if (!hoverPlay) return;\n        void safePause().then(() => setIsPlaying(false));\n    }, [hoverPlay, safePause]);\n\n    const togglePlay = useCallback(async () => {\n        const el = videoRef.current;\n        if (!el) return;\n        if (el.paused) {\n            await safePlay();\n        } else {\n            await safePause();\n            setIsPlaying(false);\n        }\n    }, [safePlay, safePause]);\n\n    return (\n        // The mouse handlers are a progressive enhancement (hoverPlay + tooltip).\n        // Keyboard/click users reach the same actions via the inner <button> elements,\n        // so the outer container is intentionally non-interactive at the role level.\n        // NOSONAR: typescript:S6848\n        <div\n            className={clsx(\"gvp-root\", className)}\n            style={{ width: frameMaxWidth, aspectRatio }}\n            onMouseEnter={() => {\n                setShowTooltip(true);\n                hoverStart();\n            }}\n            onMouseLeave={() => {\n                setShowTooltip(false);\n                hoverStop();\n            }}\n        >\n            <HLSPlayer\n                ref={videoRef}\n                src={src}\n                poster={poster}\n                muted={muted}\n                loop={loop}\n                playsInline\n                preload=\"metadata\"\n                controls={controls}\n                hlsConfig={hlsConfig}\n                className=\"gvp-video\"\n                onPlay={() => setIsPlaying(true)}\n                onPause={() => setIsPlaying(false)}\n            >\n                {children}\n            </HLSPlayer>\n\n            <div className=\"gvp-vignette\" />\n\n            {showDeviceToggle && (\n                <div className=\"gvp-toggle\">\n                    <div className=\"gvp-toggle-pill\">\n                        <button\n                            type=\"button\"\n                            onClick={() => setDevice(\"desktop\")}\n                            className={clsx(\n                                \"gvp-toggle-btn\",\n                                device === \"desktop\" && \"is-active\"\n                            )}\n                            aria-label=\"Desktop view\"\n                            aria-pressed={device === \"desktop\"}\n                        >\n                            <IconDesktop />\n                        </button>\n\n                        <div className=\"gvp-toggle-divider\" />\n\n                        <button\n                            type=\"button\"\n                            onClick={() => setDevice(\"mobile\")}\n                            className={clsx(\n                                \"gvp-toggle-btn\",\n                                device === \"mobile\" && \"is-active\"\n                            )}\n                            aria-label=\"Mobile view\"\n                            aria-pressed={device === \"mobile\"}\n                        >\n                            <IconMobile />\n                        </button>\n                    </div>\n                </div>\n            )}\n\n            {onClose && (\n                <button\n                    type=\"button\"\n                    onClick={onClose}\n                    className=\"gvp-close\"\n                    aria-label=\"Close\"\n                >\n                    <IconX />\n                </button>\n            )}\n\n            {!isPlaying && (\n                <div className=\"gvp-play-wrap\">\n                    <button\n                        type=\"button\"\n                        onClick={() => void togglePlay()}\n                        onMouseEnter={() => setShowTooltip(true)}\n                        onMouseLeave={() => setShowTooltip(false)}\n                        className=\"gvp-play\"\n                        aria-label=\"Play\"\n                    >\n                        <IconPlay />\n                        {tooltipText && showTooltip && (\n                            <span className=\"gvp-tooltip\" role=\"tooltip\">\n                                {tooltipText}\n                            </span>\n                        )}\n                    </button>\n                </div>\n            )}\n\n            <div className=\"gvp-bottom-fade\" />\n        </div>\n    );\n};\n\nexport default VideoPlayerWrapper;\n"],"names":["r","t","f","n","o","clsx","HLSPlayer","React","src","hlsConfig","isHls","children","videoProps","forwardedRef","internalRef","useRef","hlsRef","useImperativeHandle","canUseHlsJs","Hls","shouldUseHls","useEffect","videoEl","hls","_evt","data","baseClass","cls","extra","IconDesktop","className","jsxs","jsx","IconMobile","IconX","IconPlay","VideoPlayerWrapper","poster","showDeviceToggle","defaultDevice","hoverPlay","tooltipText","onClose","muted","loop","controls","customFrameMaxWidth","customAspectRatio","videoRef","playPromiseRef","device","setDevice","useState","isPlaying","setIsPlaying","showTooltip","setShowTooltip","aspectRatio","useMemo","frameMaxWidth","safePause","useCallback","el","safePlay","p","hoverStart","hoverStop","togglePlay"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/style.css

@@ -1 +1,4 @@
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-violet-700:oklch(49.1% .27 292.581);--color-neutral-200:oklch(92.2% 0 0);--color-neutral-500:oklch(55.6% 0 0);--color-neutral-700:oklch(37.1% 0 0);--color-neutral-900:oklch(20.5% 0 0);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--font-weight-semibold:600;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--blur-md:12px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:calc(var(--spacing) * 0)}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.-top-12{top:calc(var(--spacing) * -12)}.top-4{top:calc(var(--spacing) * 4)}.right-0{right:calc(var(--spacing) * 0)}.right-4{right:calc(var(--spacing) * 4)}.bottom-0{bottom:calc(var(--spacing) * 0)}.left-0{left:calc(var(--spacing) * 0)}.left-1\/2{left:50%}.left-4{left:calc(var(--spacing) * 4)}.z-10{z-index:10}.mx-auto{margin-inline:auto}.flex{display:flex}.grid{display:grid}.h-5{height:calc(var(--spacing) * 5)}.h-7{height:calc(var(--spacing) * 7)}.h-10{height:calc(var(--spacing) * 10)}.h-14{height:calc(var(--spacing) * 14)}.h-16{height:calc(var(--spacing) * 16)}.h-full{height:100%}.w-5{width:calc(var(--spacing) * 5)}.w-7{width:calc(var(--spacing) * 7)}.w-10{width:calc(var(--spacing) * 10)}.w-14{width:calc(var(--spacing) * 14)}.w-full{width:100%}.w-px{width:1px}.-translate-x-1\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-px{--tw-translate-x:1px;translate:var(--tw-translate-x) var(--tw-translate-y)}.cursor-pointer{cursor:pointer}.place-items-center{place-items:center}.items-center{align-items:center}.gap-2{gap:calc(var(--spacing) * 2)}.overflow-hidden{overflow:hidden}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:3.40282e38px}.rounded-xl{border-radius:var(--radius-xl)}.bg-black\/35{background-color:#00000059}@supports (color:color-mix(in lab,red,red)){.bg-black\/35{background-color:color-mix(in oklab,var(--color-black) 35%,transparent)}}.bg-black\/70{background-color:#000000b3}@supports (color:color-mix(in lab,red,red)){.bg-black\/70{background-color:color-mix(in oklab,var(--color-black) 70%,transparent)}}.bg-neutral-200{background-color:var(--color-neutral-200)}.bg-neutral-200\/5{background-color:#e5e5e50d}@supports (color:color-mix(in lab,red,red)){.bg-neutral-200\/5{background-color:color-mix(in oklab,var(--color-neutral-200) 5%,transparent)}}.bg-neutral-900\/30{background-color:#1717174d}@supports (color:color-mix(in lab,red,red)){.bg-neutral-900\/30{background-color:color-mix(in oklab,var(--color-neutral-900) 30%,transparent)}}.bg-violet-700\/50{background-color:#7008e780}@supports (color:color-mix(in lab,red,red)){.bg-violet-700\/50{background-color:color-mix(in oklab,var(--color-violet-700) 50%,transparent)}}.bg-white\/95{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.bg-white\/95{background-color:color-mix(in oklab,var(--color-white) 95%,transparent)}}.bg-linear-to-t{--tw-gradient-position:to top}@supports (background-image:linear-gradient(in lab,red,red)){.bg-linear-to-t{--tw-gradient-position:to top in oklab}}.bg-linear-to-t{background-image:linear-gradient(var(--tw-gradient-stops))}.bg-linear-to-tr{--tw-gradient-position:to top right}@supports (background-image:linear-gradient(in lab,red,red)){.bg-linear-to-tr{--tw-gradient-position:to top right in oklab}}.bg-linear-to-tr{background-image:linear-gradient(var(--tw-gradient-stops))}.from-black\/35{--tw-gradient-from:#00000059}@supports (color:color-mix(in lab,red,red)){.from-black\/35{--tw-gradient-from:color-mix(in oklab, var(--color-black) 35%, transparent)}}.from-black\/35{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.via-black\/0{--tw-gradient-via:#0000}@supports (color:color-mix(in lab,red,red)){.via-black\/0{--tw-gradient-via:color-mix(in oklab, var(--color-black) 0%, transparent)}}.via-black\/0{--tw-gradient-via-stops:var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-via-stops)}.to-black\/35{--tw-gradient-to:#00000059}@supports (color:color-mix(in lab,red,red)){.to-black\/35{--tw-gradient-to:color-mix(in oklab, var(--color-black) 35%, transparent)}}.to-black\/35{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.object-cover{object-fit:cover}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.whitespace-nowrap{white-space:nowrap}.text-neutral-500{color:var(--color-neutral-500)}.text-violet-700{color:var(--color-violet-700)}.text-white{color:var(--color-white)}.bg-blend-overlay{background-blend-mode:overlay}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-black\/5{--tw-ring-color:#0000000d}@supports (color:color-mix(in lab,red,red)){.ring-black\/5{--tw-ring-color:color-mix(in oklab, var(--color-black) 5%, transparent)}}.ring-white\/10{--tw-ring-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.ring-white\/10{--tw-ring-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.ring-white\/15{--tw-ring-color:#ffffff26}@supports (color:color-mix(in lab,red,red)){.ring-white\/15{--tw-ring-color:color-mix(in oklab, var(--color-white) 15%, transparent)}}.backdrop-blur{--tw-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}@media (hover:hover){.hover\:bg-black\/50:hover{background-color:#00000080}@supports (color:color-mix(in lab,red,red)){.hover\:bg-black\/50:hover{background-color:color-mix(in oklab,var(--color-black) 50%,transparent)}}.hover\:bg-violet-700\/90:hover{background-color:#7008e7e6}@supports (color:color-mix(in lab,red,red)){.hover\:bg-violet-700\/90:hover{background-color:color-mix(in oklab,var(--color-violet-700) 90%,transparent)}}.hover\:text-neutral-700:hover{color:var(--color-neutral-700)}}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}
+/*!
+ * @glitchlab/react-video-player styles
+ * Scoped under .gvp-root — no global resets, no theme tokens, safe for any host.
+ */.gvp-root{position:relative;overflow:hidden;border-radius:1.5rem;background-color:#1717174d;box-shadow:0 25px 50px -12px #00000040;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}.gvp-root *,.gvp-root *:before,.gvp-root *:after{box-sizing:border-box}.gvp-video{height:100%;width:100%;object-fit:cover;display:block}.gvp-vignette{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to top right,#00000059,#0000,#00000059)}.gvp-bottom-fade{pointer-events:none;position:absolute;bottom:0;left:0;right:0;height:4rem;background-image:linear-gradient(to top,rgb(0 0 0 / .35),transparent)}.gvp-toggle{position:absolute;left:1rem;top:1rem}.gvp-toggle-pill{display:flex;align-items:center;overflow:hidden;border-radius:1rem;background-color:#fffffff2;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(0 0 0 / .05);outline-offset:-1px}.gvp-toggle-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;cursor:pointer;background:transparent;border:0;color:#737373;transition:color .15s ease;font-family:inherit}.gvp-toggle-btn:hover{color:#404040}.gvp-toggle-btn.is-active{color:#5b21b6}.gvp-toggle-divider{height:1.75rem;width:1px;background-color:#e5e5e5}.gvp-close{position:absolute;right:1rem;top:1rem;display:grid;place-items:center;height:2.5rem;width:2.5rem;border:0;border-radius:9999px;background-color:#00000059;color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;cursor:pointer;z-index:10;transition:background-color .15s ease}.gvp-close:hover{background-color:#00000080}.gvp-play-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.gvp-play{position:relative;display:grid;place-items:center;height:3.5rem;width:3.5rem;border:0;border-radius:9999px;cursor:pointer;outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;background-color:#5b21b680;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;transition:background-color .2s ease,opacity .2s ease;color:#fff}.gvp-play:hover{background-color:#5b21b6e6}.gvp-tooltip{position:absolute;top:-3rem;left:50%;transform:translate(-50%);white-space:nowrap;border-radius:.75rem;background-color:#000000b3;padding:.375rem .75rem;font-size:.75rem;line-height:1rem;color:#fff;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.gvp-icon{display:block}