@glitchlab/vue-video-player 1.0.0

package/dist/index.mjs

@@ -0,0 +1,356 @@
+import { defineComponent as h, ref as y, onMounted as V, watch as D, onUnmounted as I, openBlock as c, createElementBlock as v, normalizeClass as f, renderSlot as H, createElementVNode as n, computed as $, normalizeStyle as T, createVNode as k, withCtx as W, createCommentVNode as M, toDisplayString as Z } from "vue";
+import B from "hls.js";
+const j = ["muted", "loop", "controls", "playsinline", "preload", "poster"], N = /* @__PURE__ */ h({
+  __name: "HLSPlayer",
+  props: {
+    src: {},
+    hlsConfig: {},
+    isHls: { type: Boolean },
+    muted: { type: Boolean, default: !0 },
+    loop: { type: Boolean, default: !1 },
+    controls: { type: Boolean, default: !1 },
+    playsInline: { type: Boolean, default: !0 },
+    preload: { default: "metadata" },
+    poster: {},
+    class: {}
+  },
+  emits: ["play", "pause"],
+  setup(t, { expose: d, emit: a }) {
+    const l = t, w = a, i = y(null), r = y(null), C = globalThis.window !== void 0 && B.isSupported(), m = (o) => !!l.isHls || C && o.endsWith(".m3u8");
+    function b() {
+      r.value && (r.value.destroy(), r.value = null);
+      const o = i.value;
+      if (o) {
+        for (o.pause(), o.removeAttribute("src"); o.firstChild; ) o.firstChild.remove();
+        o.load();
+      }
+    }
+    function x(o) {
+      const u = i.value;
+      if (!(!u || !o))
+        if (b(), m(o)) {
+          const p = new B(l.hlsConfig);
+          r.value = p, p.attachMedia(u), p.loadSource(o), p.on(B.Events.ERROR, (L, P) => {
+            P.fatal && (p.destroy(), r.value = null);
+          });
+        } else
+          u.src = o, u.load();
+    }
+    return V(() => {
+      l.src && x(l.src);
+    }), D(
+      () => l.src,
+      (o) => {
+        o && x(o);
+      }
+    ), I(b), d({ videoEl: i }), (o, u) => (c(), v("video", {
+      ref_key: "videoEl",
+      ref: i,
+      muted: t.muted,
+      loop: t.loop,
+      controls: t.controls,
+      playsinline: t.playsInline,
+      preload: t.preload,
+      poster: t.poster,
+      class: f(l.class),
+      onPlay: u[0] || (u[0] = (p) => w("play")),
+      onPause: u[1] || (u[1] = (p) => w("pause"))
+    }, [
+      H(o.$slots, "default")
+    ], 42, j));
+  }
+}), U = { name: "IconDesktop" }, z = /* @__PURE__ */ h({
+  ...U,
+  props: {
+    class: {}
+  },
+  setup(t) {
+    const d = t;
+    return (a, l) => (c(), v("svg", {
+      class: f(["gvp-icon", d.class]),
+      width: "20",
+      height: "20",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true"
+    }, [...l[0] || (l[0] = [
+      n("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",
+        stroke: "currentColor",
+        "stroke-width": "1.5",
+        "stroke-linecap": "round"
+      }, null, -1),
+      n("path", {
+        d: "M11 15H13",
+        stroke: "currentColor",
+        "stroke-width": "1.5",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      }, null, -1),
+      n("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",
+        stroke: "currentColor",
+        "stroke-width": "1.5",
+        "stroke-linecap": "round"
+      }, null, -1),
+      n("path", {
+        d: "M7 22H17",
+        stroke: "currentColor",
+        "stroke-width": "1.5",
+        "stroke-linecap": "round"
+      }, null, -1)
+    ])], 2));
+  }
+}), A = { name: "IconMobile" }, J = /* @__PURE__ */ h({
+  ...A,
+  props: {
+    class: {}
+  },
+  setup(t) {
+    const d = t;
+    return (a, l) => (c(), v("svg", {
+      class: f(["gvp-icon", d.class]),
+      width: "20",
+      height: "20",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true"
+    }, [...l[0] || (l[0] = [
+      n("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",
+        stroke: "currentColor",
+        "stroke-width": "2",
+        "stroke-linecap": "round"
+      }, null, -1),
+      n("path", {
+        d: "M11 19H13",
+        stroke: "currentColor",
+        "stroke-width": "2",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      }, null, -1),
+      n("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",
+        stroke: "currentColor",
+        "stroke-width": "2",
+        "stroke-linejoin": "round"
+      }, null, -1)
+    ])], 2));
+  }
+}), O = { name: "IconPlay" }, X = /* @__PURE__ */ h({
+  ...O,
+  props: {
+    class: {}
+  },
+  setup(t) {
+    const d = t;
+    return (a, l) => (c(), v("svg", {
+      class: f(["gvp-icon", d.class]),
+      width: "22",
+      height: "22",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true"
+    }, [...l[0] || (l[0] = [
+      n("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"
+      }, null, -1)
+    ])], 2));
+  }
+}), q = { name: "IconX" }, F = /* @__PURE__ */ h({
+  ...q,
+  props: {
+    class: {}
+  },
+  setup(t) {
+    const d = t;
+    return (a, l) => (c(), v("svg", {
+      class: f(["gvp-icon", d.class]),
+      width: "14",
+      height: "14",
+      viewBox: "0 0 14 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true"
+    }, [...l[0] || (l[0] = [
+      n("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: "currentColor"
+      }, null, -1)
+    ])], 2));
+  }
+}), G = {
+  key: 0,
+  class: "gvp-toggle"
+}, K = { class: "gvp-toggle-pill" }, Q = ["aria-pressed"], Y = ["aria-pressed"], _ = {
+  key: 2,
+  class: "gvp-play-wrap"
+}, ee = {
+  key: 0,
+  class: "gvp-tooltip",
+  role: "tooltip"
+}, oe = /* @__PURE__ */ h({
+  __name: "VideoPlayer",
+  props: {
+    src: {},
+    poster: {},
+    showDeviceToggle: { type: Boolean, default: !0 },
+    defaultDevice: { default: "desktop" },
+    hoverPlay: { type: Boolean, default: !1 },
+    tooltipText: {},
+    muted: { type: Boolean, default: !0 },
+    loop: { type: Boolean, default: !1 },
+    controls: { type: Boolean, default: !1 },
+    frameMaxWidth: {},
+    aspectRatio: {},
+    hlsConfig: {},
+    isHls: { type: Boolean },
+    class: { default: "" },
+    closable: { type: Boolean, default: !1 }
+  },
+  emits: ["close", "play", "pause"],
+  setup(t, { emit: d }) {
+    const a = t, l = d, w = y(null), i = y(a.defaultDevice), r = y(!1), C = y(!1), m = y(null), b = $(
+      () => {
+        var s, e;
+        return i.value === "mobile" ? ((s = a.aspectRatio) == null ? void 0 : s.mobile) ?? "9/16" : ((e = a.aspectRatio) == null ? void 0 : e.desktop) ?? "16/9";
+      }
+    ), x = $(
+      () => {
+        var s, e;
+        return i.value === "mobile" ? ((s = a.frameMaxWidth) == null ? void 0 : s.mobile) ?? "420px" : ((e = a.frameMaxWidth) == null ? void 0 : e.desktop) ?? "960px";
+      }
+    ), o = $(() => {
+      var s;
+      return ((s = w.value) == null ? void 0 : s.videoEl) ?? null;
+    });
+    async function u() {
+      const s = o.value;
+      if (s)
+        try {
+          s.readyState < 2 && s.load();
+          const e = s.play();
+          m.value = e, await e, r.value = !0;
+        } catch {
+          r.value = !1;
+        } finally {
+          m.value = null;
+        }
+    }
+    async function p() {
+      const s = o.value;
+      if (s) {
+        if (m.value)
+          try {
+            await m.value;
+          } catch {
+          }
+        s.pause();
+      }
+    }
+    async function L() {
+      a.hoverPlay && await u();
+    }
+    async function P() {
+      a.hoverPlay && (await p(), r.value = !1);
+    }
+    async function R() {
+      const s = o.value;
+      s && (s.paused ? await u() : (await p(), r.value = !1));
+    }
+    function S() {
+      C.value = !0, L();
+    }
+    function E() {
+      C.value = !1, P();
+    }
+    return (s, e) => (c(), v("div", {
+      class: f(["gvp-root", a.class]),
+      style: T({ width: x.value, aspectRatio: b.value }),
+      onMouseenter: S,
+      onMouseleave: E
+    }, [
+      k(N, {
+        ref_key: "hlsPlayerRef",
+        ref: w,
+        controls: t.controls,
+        "hls-config": t.hlsConfig,
+        "is-hls": t.isHls,
+        loop: t.loop,
+        muted: t.muted,
+        "plays-inline": !0,
+        poster: t.poster,
+        src: t.src,
+        class: "gvp-video",
+        preload: "metadata",
+        onPause: e[0] || (e[0] = (g) => {
+          r.value = !1, l("pause");
+        }),
+        onPlay: e[1] || (e[1] = (g) => {
+          r.value = !0, l("play");
+        })
+      }, {
+        default: W(() => [
+          H(s.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["controls", "hls-config", "is-hls", "loop", "muted", "poster", "src"]),
+      e[8] || (e[8] = n("div", { class: "gvp-vignette" }, null, -1)),
+      t.showDeviceToggle ? (c(), v("div", G, [
+        n("div", K, [
+          n("button", {
+            "aria-pressed": i.value === "desktop",
+            class: f(["gvp-toggle-btn", { "is-active": i.value === "desktop" }]),
+            "aria-label": "Desktop view",
+            type: "button",
+            onClick: e[2] || (e[2] = (g) => i.value = "desktop")
+          }, [
+            k(z)
+          ], 10, Q),
+          e[7] || (e[7] = n("div", { class: "gvp-toggle-divider" }, null, -1)),
+          n("button", {
+            "aria-pressed": i.value === "mobile",
+            class: f(["gvp-toggle-btn", { "is-active": i.value === "mobile" }]),
+            "aria-label": "Mobile view",
+            type: "button",
+            onClick: e[3] || (e[3] = (g) => i.value = "mobile")
+          }, [
+            k(J)
+          ], 10, Y)
+        ])
+      ])) : M("", !0),
+      t.closable ? (c(), v("button", {
+        key: 1,
+        "aria-label": "Close",
+        class: "gvp-close",
+        type: "button",
+        onClick: e[4] || (e[4] = (g) => l("close"))
+      }, [
+        k(F)
+      ])) : M("", !0),
+      r.value ? M("", !0) : (c(), v("div", _, [
+        n("button", {
+          "aria-label": "Play",
+          class: "gvp-play",
+          type: "button",
+          onClick: R,
+          onMouseenter: e[5] || (e[5] = (g) => C.value = !0),
+          onMouseleave: e[6] || (e[6] = (g) => C.value = !1)
+        }, [
+          k(X),
+          t.tooltipText && C.value ? (c(), v("span", ee, Z(t.tooltipText), 1)) : M("", !0)
+        ], 32)
+      ])),
+      e[9] || (e[9] = n("div", { class: "gvp-bottom-fade" }, null, -1))
+    ], 38));
+  }
+});
+export {
+  N as HLSPlayer,
+  oe as VueVideoPlayer
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../src/HLSPlayer.vue","../src/components/IconDesktop.vue","../src/components/IconMobile.vue","../src/components/IconPlay.vue","../src/components/IconX.vue","../src/VideoPlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport Hls from \"hls.js\";\nimport { onMounted, onUnmounted, ref, watch } from \"vue\";\nimport type { HlsConfig } from \"hls.js\";\n\nconst props = withDefaults(\n  defineProps<{\n    src: string;\n    hlsConfig?: HlsConfig;\n    isHls?: boolean;\n    muted?: boolean;\n    loop?: boolean;\n    controls?: boolean;\n    playsInline?: boolean;\n    preload?: string;\n    poster?: string;\n    class?: string;\n  }>(),\n  {\n    muted: true,\n    loop: false,\n    controls: false,\n    playsInline: true,\n    preload: \"metadata\"\n  }\n);\n\nconst emit = defineEmits<{\n  play: [];\n  pause: [];\n}>();\n\nconst videoEl = ref<HTMLVideoElement | null>(null);\nconst hlsInstance = ref<Hls | null>(null);\n\nconst canUseHlsJs = globalThis.window !== undefined && Hls.isSupported();\nconst shouldUseHls = (src: string) =>\n  Boolean(props.isHls) || (canUseHlsJs && src.endsWith(\".m3u8\"));\n\nfunction cleanup() {\n  if (hlsInstance.value) {\n    hlsInstance.value.destroy();\n    hlsInstance.value = null;\n  }\n  const el = videoEl.value;\n  if (!el) return;\n  el.pause();\n  el.removeAttribute(\"src\");\n  while (el.firstChild) el.firstChild.remove();\n  el.load();\n}\n\nfunction initPlayer(src: string) {\n  const el = videoEl.value;\n  if (!el || !src) return;\n\n  cleanup();\n\n  if (shouldUseHls(src)) {\n    const hls = new Hls(props.hlsConfig);\n    hlsInstance.value = hls;\n    hls.attachMedia(el);\n    hls.loadSource(src);\n    hls.on(Hls.Events.ERROR, (_evt, data) => {\n      if (data.fatal) {\n        hls.destroy();\n        hlsInstance.value = null;\n      }\n    });\n  } else {\n    el.src = src;\n    el.load();\n  }\n}\n\nonMounted(() => {\n  if (props.src) initPlayer(props.src);\n});\n\nwatch(\n  () => props.src,\n  (src) => {\n    if (src) initPlayer(src);\n  }\n);\n\nonUnmounted(cleanup);\n\ndefineExpose({ videoEl });\n</script>\n\n<template>\n  <video\n    ref=\"videoEl\"\n    :muted=\"muted\"\n    :loop=\"loop\"\n    :controls=\"controls\"\n    :playsinline=\"playsInline\"\n    :preload=\"preload\"\n    :poster=\"poster\"\n    :class=\"props.class\"\n    @play=\"emit('play')\"\n    @pause=\"emit('pause')\"\n  >\n    <slot />\n  </video>\n</template>\n","<script setup lang=\"ts\">\nconst props = defineProps<{ class?: string }>();\n</script>\n\n<template>\n  <svg\n    :class=\"['gvp-icon', props.class]\"\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      stroke-width=\"1.5\"\n      stroke-linecap=\"round\"\n    />\n    <path\n      d=\"M11 15H13\"\n      stroke=\"currentColor\"\n      stroke-width=\"1.5\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"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      stroke-width=\"1.5\"\n      stroke-linecap=\"round\"\n    />\n    <path\n      d=\"M7 22H17\"\n      stroke=\"currentColor\"\n      stroke-width=\"1.5\"\n      stroke-linecap=\"round\"\n    />\n  </svg>\n</template>\n\n<script lang=\"ts\">\nexport default { name: \"IconDesktop\" };\n</script>\n","<script setup lang=\"ts\">\nconst props = defineProps<{ class?: string }>();\n</script>\n\n<template>\n  <svg\n    :class=\"['gvp-icon', props.class]\"\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      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n    />\n    <path\n      d=\"M11 19H13\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"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      stroke-width=\"2\"\n      stroke-linejoin=\"round\"\n    />\n  </svg>\n</template>\n\n<script lang=\"ts\">\nexport default { name: \"IconMobile\" };\n</script>\n","<script setup lang=\"ts\">\nconst props = defineProps<{ class?: string }>();\n</script>\n\n<template>\n  <svg\n    :class=\"['gvp-icon', props.class]\"\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</template>\n\n<script lang=\"ts\">\nexport default { name: \"IconPlay\" };\n</script>\n","<script setup lang=\"ts\">\nconst props = defineProps<{ class?: string }>();\n</script>\n\n<template>\n  <svg\n    :class=\"['gvp-icon', props.class]\"\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</template>\n\n<script lang=\"ts\">\nexport default { name: \"IconX\" };\n</script>\n","<script lang=\"ts\" setup>\nimport { computed, ref } from \"vue\";\nimport HLSPlayer from \"./HLSPlayer.vue\";\nimport IconDesktop from \"./components/IconDesktop.vue\";\nimport IconMobile from \"./components/IconMobile.vue\";\nimport IconPlay from \"./components/IconPlay.vue\";\nimport IconX from \"./components/IconX.vue\";\nimport type { DeviceMode, VideoPlayerProps } from \"./utils/types\";\n\nconst props = withDefaults(\n  defineProps<VideoPlayerProps & { class?: string; closable?: boolean }>(),\n  {\n    showDeviceToggle: true,\n    defaultDevice: \"desktop\",\n    hoverPlay: false,\n    muted: true,\n    loop: false,\n    controls: false,\n    closable: false,\n    class: \"\"\n  }\n);\n\nconst emit = defineEmits<{\n  close: [];\n  play: [];\n  pause: [];\n}>();\n\nconst hlsPlayerRef = ref<InstanceType<typeof HLSPlayer> | null>(null);\nconst device = ref<DeviceMode>(props.defaultDevice);\nconst isPlaying = ref(false);\nconst showTooltip = ref(false);\nconst playPromise = ref<Promise<void> | null>(null);\n\nconst aspectRatio = computed(() =>\n  device.value === \"mobile\"\n    ? (props.aspectRatio?.mobile ?? \"9/16\")\n    : (props.aspectRatio?.desktop ?? \"16/9\")\n);\n\nconst frameMaxWidth = computed(() =>\n  device.value === \"mobile\"\n    ? (props.frameMaxWidth?.mobile ?? \"420px\")\n    : (props.frameMaxWidth?.desktop ?? \"960px\")\n);\n\nconst videoEl = computed(() => hlsPlayerRef.value?.videoEl ?? null);\n\nasync function safePlay() {\n  const el = videoEl.value;\n  if (!el) return;\n  try {\n    if (el.readyState < 2) el.load();\n    const p = el.play();\n    playPromise.value = p;\n    await p;\n    isPlaying.value = true;\n  } catch {\n    isPlaying.value = false;\n  } finally {\n    playPromise.value = null;\n  }\n}\n\nasync function safePause() {\n  const el = videoEl.value;\n  if (!el) return;\n  if (playPromise.value) {\n    try {\n      await playPromise.value;\n    } catch {\n      /* play was interrupted; nothing to await */\n    }\n  }\n  el.pause();\n}\n\nasync function hoverStart() {\n  if (!props.hoverPlay) return;\n  await safePlay();\n}\n\nasync function hoverStop() {\n  if (!props.hoverPlay) return;\n  await safePause();\n  isPlaying.value = false;\n}\n\nasync function togglePlay() {\n  const el = videoEl.value;\n  if (!el) return;\n  if (el.paused) {\n    await safePlay();\n  } else {\n    await safePause();\n    isPlaying.value = false;\n  }\n}\n\nfunction onMouseEnter() {\n  showTooltip.value = true;\n  void hoverStart();\n}\n\nfunction onMouseLeave() {\n  showTooltip.value = false;\n  void hoverStop();\n}\n</script>\n\n<template>\n  <div\n    :class=\"['gvp-root', props.class]\"\n    :style=\"{ width: frameMaxWidth, aspectRatio }\"\n    @mouseenter=\"onMouseEnter\"\n    @mouseleave=\"onMouseLeave\"\n  >\n    <HLSPlayer\n      ref=\"hlsPlayerRef\"\n      :controls=\"controls\"\n      :hls-config=\"hlsConfig\"\n      :is-hls=\"isHls\"\n      :loop=\"loop\"\n      :muted=\"muted\"\n      :plays-inline=\"true\"\n      :poster=\"poster\"\n      :src=\"src\"\n      class=\"gvp-video\"\n      preload=\"metadata\"\n      @pause=\"\n        isPlaying = false;\n        emit('pause');\n      \"\n      @play=\"\n        isPlaying = true;\n        emit('play');\n      \"\n    >\n      <slot />\n    </HLSPlayer>\n\n    <div class=\"gvp-vignette\" />\n\n    <div v-if=\"showDeviceToggle\" class=\"gvp-toggle\">\n      <div class=\"gvp-toggle-pill\">\n        <button\n          :aria-pressed=\"device === 'desktop'\"\n          :class=\"['gvp-toggle-btn', { 'is-active': device === 'desktop' }]\"\n          aria-label=\"Desktop view\"\n          type=\"button\"\n          @click=\"device = 'desktop'\"\n        >\n          <IconDesktop />\n        </button>\n\n        <div class=\"gvp-toggle-divider\" />\n\n        <button\n          :aria-pressed=\"device === 'mobile'\"\n          :class=\"['gvp-toggle-btn', { 'is-active': device === 'mobile' }]\"\n          aria-label=\"Mobile view\"\n          type=\"button\"\n          @click=\"device = 'mobile'\"\n        >\n          <IconMobile />\n        </button>\n      </div>\n    </div>\n\n    <button\n      v-if=\"closable\"\n      aria-label=\"Close\"\n      class=\"gvp-close\"\n      type=\"button\"\n      @click=\"emit('close')\"\n    >\n      <IconX />\n    </button>\n\n    <div v-if=\"!isPlaying\" class=\"gvp-play-wrap\">\n      <button\n        aria-label=\"Play\"\n        class=\"gvp-play\"\n        type=\"button\"\n        @click=\"togglePlay\"\n        @mouseenter=\"showTooltip = true\"\n        @mouseleave=\"showTooltip = false\"\n      >\n        <IconPlay />\n        <span v-if=\"tooltipText && showTooltip\" class=\"gvp-tooltip\" role=\"tooltip\">\n          {{ tooltipText }}\n        </span>\n      </button>\n    </div>\n\n    <div class=\"gvp-bottom-fade\" />\n  </div>\n</template>\n"],"names":["props","__props","emit","__emit","videoEl","ref","hlsInstance","canUseHlsJs","Hls","shouldUseHls","src","cleanup","el","initPlayer","hls","_evt","data","onMounted","watch","onUnmounted","__expose","_createElementBlock","_normalizeClass","_renderSlot","_ctx","__default__","_createElementVNode","hlsPlayerRef","device","isPlaying","showTooltip","playPromise","aspectRatio","computed","_a","_b","frameMaxWidth","safePlay","p","safePause","hoverStart","hoverStop","togglePlay","onMouseEnter","onMouseLeave","_normalizeStyle","_createVNode","HLSPlayer","_cache","$event","_openBlock","_hoisted_1","_hoisted_2","IconDesktop","IconMobile","IconX","_hoisted_5","IconPlay","_hoisted_6","_toDisplayString"],"mappings":"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"}

package/dist/nuxt-module.cjs

@@ -0,0 +1,2 @@
+"use strict";const e=require("@nuxt/kit");var t=typeof document<"u"?document.currentScript:null;const u=e.defineNuxtModule({meta:{name:"@glitchlab/vue-video-player",configKey:"vueVideoPlayer",compatibility:{nuxt:">=3.0.0"}},setup(o,r){const n=e.createResolver(typeof document>"u"?require("url").pathToFileURL(__filename).href:t&&t.tagName.toUpperCase()==="SCRIPT"&&t.src||new URL("nuxt-module.cjs",document.baseURI).href);e.addPlugin(n.resolve("./nuxt-plugin"))}});module.exports=u;
+//# sourceMappingURL=nuxt-module.cjs.map

package/dist/nuxt-module.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"nuxt-module.cjs","sources":["../src/utils/nuxt-module.ts"],"sourcesContent":["import { addPlugin, createResolver, defineNuxtModule } from \"@nuxt/kit\";\n\nexport interface ModuleOptions {\n  /** Reserved for future configuration. */\n  _reserved?: never;\n}\n\nexport default defineNuxtModule<ModuleOptions>({\n  meta: {\n    name: \"@glitchlab/vue-video-player\",\n    configKey: \"vueVideoPlayer\",\n    compatibility: {\n      nuxt: \">=3.0.0\"\n    }\n  },\n  setup(_options, _nuxt) {\n    const resolver = createResolver(import.meta.url);\n    addPlugin(resolver.resolve(\"./nuxt-plugin\"));\n  }\n});\n"],"names":["nuxtModule","defineNuxtModule","_options","_nuxt","resolver","createResolver","addPlugin"],"mappings":"gGAOA,MAAAA,EAAeC,mBAAgC,CAC7C,KAAM,CACJ,KAAM,8BACN,UAAW,iBACX,cAAe,CACb,KAAM,SAAA,CACR,EAEF,MAAMC,EAAUC,EAAO,CACrB,MAAMC,EAAWC,EAAAA,+KAA8B,EAC/CC,EAAAA,UAAUF,EAAS,QAAQ,eAAe,CAAC,CAC7C,CACF,CAAC"}

package/dist/nuxt-module.d.ts

@@ -0,0 +1,3 @@
+export * from './utils/nuxt-module'
+import _default from './utils/nuxt-module'
+export default _default

package/dist/nuxt-module.mjs

@@ -0,0 +1,18 @@
+import { defineNuxtModule as t, createResolver as o, addPlugin as l } from "@nuxt/kit";
+const r = t({
+  meta: {
+    name: "@glitchlab/vue-video-player",
+    configKey: "vueVideoPlayer",
+    compatibility: {
+      nuxt: ">=3.0.0"
+    }
+  },
+  setup(u, i) {
+    const e = o(import.meta.url);
+    l(e.resolve("./nuxt-plugin"));
+  }
+});
+export {
+  r as default
+};
+//# sourceMappingURL=nuxt-module.mjs.map

package/dist/nuxt-module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"nuxt-module.mjs","sources":["../src/utils/nuxt-module.ts"],"sourcesContent":["import { addPlugin, createResolver, defineNuxtModule } from \"@nuxt/kit\";\n\nexport interface ModuleOptions {\n  /** Reserved for future configuration. */\n  _reserved?: never;\n}\n\nexport default defineNuxtModule<ModuleOptions>({\n  meta: {\n    name: \"@glitchlab/vue-video-player\",\n    configKey: \"vueVideoPlayer\",\n    compatibility: {\n      nuxt: \">=3.0.0\"\n    }\n  },\n  setup(_options, _nuxt) {\n    const resolver = createResolver(import.meta.url);\n    addPlugin(resolver.resolve(\"./nuxt-plugin\"));\n  }\n});\n"],"names":["nuxtModule","defineNuxtModule","_options","_nuxt","resolver","createResolver","addPlugin"],"mappings":";AAOA,MAAAA,IAAeC,EAAgC;AAAA,EAC7C,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,WAAW;AAAA,IACX,eAAe;AAAA,MACb,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,MAAMC,GAAUC,GAAO;AACrB,UAAMC,IAAWC,EAAe,YAAY,GAAG;AAC/C,IAAAC,EAAUF,EAAS,QAAQ,eAAe,CAAC;AAAA,EAC7C;AACF,CAAC;"}

package/dist/style.css

@@ -0,0 +1,4 @@
+/*!
+ * @glitchlab/vue-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}

package/dist/utils/nuxt-module.d.ts

@@ -0,0 +1,7 @@
+export interface ModuleOptions {
+    /** Reserved for future configuration. */
+    _reserved?: never;
+}
+declare const _default: NuxtModule<TOptions, TOptions, false>;
+export default _default;
+//# sourceMappingURL=nuxt-module.d.ts.map

package/dist/utils/nuxt-module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nuxt-module.d.ts","sourceRoot":"","sources":["../../src/utils/nuxt-module.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,aAAa;IAC5B,yCAAyC;IACzC,SAAS,CAAC,EAAE,KAAK,CAAC;CACnB;;AAED,wBAYG"}

package/dist/utils/types.d.ts

@@ -0,0 +1,54 @@
+import { HlsConfig } from 'hls.js';
+
+export type DeviceMode = "desktop" | "mobile";
+export type AspectRatio = `${number}/${number}`;
+export interface VideoPlayerProps {
+    /** Video source URL. `.m3u8` URLs are routed through hls.js automatically. */
+    src: string;
+    /** Poster image shown before playback. */
+    poster?: string;
+    /** Show the desktop/mobile toggle pill in the top-left. Defaults to `true`. */
+    showDeviceToggle?: boolean;
+    /** Initial device mode. Defaults to `"desktop"`. */
+    defaultDevice?: DeviceMode;
+    /** Start playback on mouse enter, pause on mouse leave. Defaults to `false`. */
+    hoverPlay?: boolean;
+    /** Text shown in a tooltip above the play button. */
+    tooltipText?: string;
+    /** Mute the video. Defaults to `true`. */
+    muted?: boolean;
+    /** Loop playback. Defaults to `false`. */
+    loop?: boolean;
+    /** Show native browser controls. Defaults to `false`. */
+    controls?: boolean;
+    /** Maximum width of the player in each device mode. */
+    frameMaxWidth?: {
+        desktop?: string;
+        mobile?: string;
+    };
+    /** Aspect ratio in each device mode. */
+    aspectRatio?: {
+        desktop?: AspectRatio;
+        mobile?: AspectRatio;
+    };
+    /**
+     * Optional hls.js configuration. Pass a stable reference to avoid tearing
+     * down and rebuilding the HLS instance on each render.
+     */
+    hlsConfig?: HlsConfig;
+    /** Force HLS routing even when the URL doesn't end in `.m3u8`. */
+    isHls?: boolean;
+}
+export interface HLSPlayerProps {
+    src: string;
+    hlsConfig?: HlsConfig;
+    isHls?: boolean;
+    muted?: boolean;
+    loop?: boolean;
+    controls?: boolean;
+    playsInline?: boolean;
+    preload?: string;
+    poster?: string;
+    class?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/utils/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/utils/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAExC,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE9C,MAAM,MAAM,WAAW,GAAG,GAAG,MAAM,IAAI,MAAM,EAAE,CAAC;AAEhD,MAAM,WAAW,gBAAgB;IAC/B,8EAA8E;IAC9E,GAAG,EAAE,MAAM,CAAC;IACZ,0CAA0C;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,+EAA+E;IAC/E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oDAAoD;IACpD,aAAa,CAAC,EAAE,UAAU,CAAC;IAE3B,gFAAgF;IAChF,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,qDAAqD;IACrD,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,uDAAuD;IACvD,aAAa,CAAC,EAAE;QACd,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IAEF,wCAAwC;IACxC,WAAW,CAAC,EAAE;QACZ,OAAO,CAAC,EAAE,WAAW,CAAC;QACtB,MAAM,CAAC,EAAE,WAAW,CAAC;KACtB,CAAC;IAEF;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,kEAAkE;IAClE,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}

package/package.json

@@ -0,0 +1,104 @@
+{
+  "name": "@glitchlab/vue-video-player",
+  "version": "1.0.0",
+  "description": "Vue 3 / Nuxt 3 video player with HLS support, device-mode toggle, hover-to-play, and zero global CSS side-effects.",
+  "license": "MIT",
+  "author": "im-fahad",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "style": "./dist/style.css",
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    },
+    "./style.css": "./dist/style.css",
+    "./nuxt": {
+      "types": "./dist/nuxt-module.d.ts",
+      "import": "./dist/nuxt-module.mjs",
+      "require": "./dist/nuxt-module.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "keywords": [
+    "vue",
+    "vue3",
+    "nuxt",
+    "nuxt3",
+    "video",
+    "player",
+    "hls",
+    "hls.js",
+    "streaming",
+    "m3u8",
+    "video-player",
+    "vue-player",
+    "typescript",
+    "responsive",
+    "mobile",
+    "desktop",
+    "adaptive",
+    "overlay",
+    "hover-play",
+    "device-toggle"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/im-fahad/react-video-player.git",
+    "directory": "packages/vue-video-player"
+  },
+  "homepage": "https://github.com/im-fahad/react-video-player/tree/main/packages/vue-video-player#readme",
+  "bugs": {
+    "url": "https://github.com/im-fahad/react-video-player/issues"
+  },
+  "peerDependencies": {
+    "hls.js": ">=1",
+    "vue": ">=3"
+  },
+  "peerDependenciesMeta": {
+    "@nuxt/kit": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@eslint/js": "^9",
+    "@nuxt/kit": "^3.0.0",
+    "@types/node": "^20",
+    "eslint": "^9",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-vue": "^9.32.0",
+    "@vitejs/plugin-vue": "^5",
+    "@vue/test-utils": "^2.4.6",
+    "hls.js": "^1.5.0",
+    "jsdom": "^25.0.1",
+    "typescript": "^5",
+    "vite": "^5",
+    "vite-plugin-dts": "^3",
+    "vitest": "^2.1.8",
+    "vue": "^3.4.0",
+    "vue-tsc": "^2",
+    "typescript-eslint": "^8.56.1"
+  },
+  "scripts": {
+    "build": "vite build",
+    "build:watch": "vite build --watch",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "lint": "eslint src",
+    "type-check": "vue-tsc --noEmit"
+  }
+}