@m4l/gclick 0.24.1 → 0.25.0

package/components/VideoPlayer/constants.d.ts

@@ -27,11 +27,17 @@ export declare const VIDEO_PLAYER_SKIN_CLASSES: {
         readonly root: "media-default-skin media-default-skin--video";
         readonly surface: "media-surface";
         readonly groupedTime: false;
+        readonly controlsRoot: "media-controls--root";
+        readonly controlsPrimary: "media-controls--primary";
+        readonly controlsSecondary: "media-controls--secondary";
     };
     readonly minimal: {
         readonly root: "media-minimal-skin media-minimal-skin--video";
         readonly surface: "";
         readonly groupedTime: true;
+        readonly controlsRoot: "";
+        readonly controlsPrimary: "";
+        readonly controlsSecondary: "";
     };
 };
 /**
@@ -46,4 +52,14 @@ export declare const HLS_CROSS_ORIGIN: "use-credentials";
  * supported and let `crossOrigin` cover the native fallback (Safari).
  */
 export declare const HLS_PREFER_PLAYBACK: "mse";
+/**
+ * Optional transport controls, all off by default. They route playback to
+ * another screen or a floating window, which the camera flows do not use, and
+ * each costs a button in a chrome that must stay readable in a small grid tile.
+ */
+export declare const VIDEO_PLAYER_OPTIONAL_CONTROLS: {
+    readonly cast: false;
+    readonly airPlay: false;
+    readonly pictureInPicture: false;
+};
 //# sourceMappingURL=constants.d.ts.map

package/components/VideoPlayer/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../packages/gclick/src/components/VideoPlayer/constants.ts"],"names":[],"mappings":"AAAA,iEAAiE;AACjE,eAAO,MAAM,oCAAoC,mBAAmB,CAAC;AACrE,eAAO,MAAM,8BAA8B,mBAAmB,CAAC;AAE/D;;;GAGG;AACH,eAAO,MAAM,qBAAqB;;;CAGxB,CAAC;AAEX;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,yBAAyB;;;;;;;;;;;CAW5B,CAAC;AAEX;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,EAAG,iBAA0B,CAAC;AAE3D;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAG,KAAc,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../packages/gclick/src/components/VideoPlayer/constants.ts"],"names":[],"mappings":"AAAA,iEAAiE;AACjE,eAAO,MAAM,oCAAoC,mBAAmB,CAAC;AACrE,eAAO,MAAM,8BAA8B,mBAAmB,CAAC;AAE/D;;;GAGG;AACH,eAAO,MAAM,qBAAqB;;;CAGxB,CAAC;AAEX;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;CAyB5B,CAAC;AAEX;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,EAAG,iBAA0B,CAAC;AAE3D;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAG,KAAc,CAAC;AAElD;;;;GAIG;AACH,eAAO,MAAM,8BAA8B;;;;CAIjC,CAAC"}

package/components/VideoPlayer/constants.js

@@ -1,22 +1,41 @@
-const e = "M4LVideoPlayer", i = {
+const o = "M4LVideoPlayer", e = {
   default: "default",
   minimal: "minimal"
 }, a = {
   default: {
     root: "media-default-skin media-default-skin--video",
     surface: "media-surface",
-    groupedTime: !1
+    groupedTime: !1,
+    // The default sheet positions the chrome through these modifiers: `--root`
+    // is `display: contents` and the two groups are absolutely positioned over
+    // the video (the bar at the bottom, the secondary cluster top-right). Emit
+    // a bare `media-controls` instead and the controls are never placed, which
+    // reads as "the controls do not appear on hover".
+    controlsRoot: "media-controls--root",
+    controlsPrimary: "media-controls--primary",
+    controlsSecondary: "media-controls--secondary"
   },
   minimal: {
     root: "media-minimal-skin media-minimal-skin--video",
     surface: "",
-    groupedTime: !0
+    groupedTime: !0,
+    // The minimal sheet styles a single flat bar and ships no rule for the
+    // modifiers above, so grouping there would only add elements its layout
+    // does not account for.
+    controlsRoot: "",
+    controlsPrimary: "",
+    controlsSecondary: ""
   }
-}, m = "use-credentials", d = "mse";
+}, i = "use-credentials", r = "mse", s = {
+  cast: !1,
+  airPlay: !1,
+  pictureInPicture: !1
+};
 export {
-  e as COMPONENT_VIDEO_PLAYER_KEY_COMPONENT,
-  m as HLS_CROSS_ORIGIN,
-  d as HLS_PREFER_PLAYBACK,
+  o as COMPONENT_VIDEO_PLAYER_KEY_COMPONENT,
+  i as HLS_CROSS_ORIGIN,
+  r as HLS_PREFER_PLAYBACK,
+  s as VIDEO_PLAYER_OPTIONAL_CONTROLS,
   a as VIDEO_PLAYER_SKIN_CLASSES,
-  i as VIDEO_PLAYER_VARIANTS
+  e as VIDEO_PLAYER_VARIANTS
 };

package/components/VideoPlayer/hlsSource.d.ts

@@ -0,0 +1,41 @@
+import { HlsSource } from '@videojs/media/dom/hls-js';
+/**
+ * `<HlsJsVideo>` source so every HLS request (manifest + each segment) carries
+ * the CloudFront signed cookies.
+ *
+ * video.js v10 has no first-class `withCredentials` prop. The element takes a
+ * structured `source` describing WHAT to play (`src`) and HOW (`preferPlayback`,
+ * plus per-engine options under `engine`). The shape has now moved twice: up to
+ * beta.24 it was flat (`preferPlayback` a top-level prop, `config` the hls.js
+ * bag), beta.25 nested both under a single `config` prop, and beta.32 replaced
+ * `config` with `source` and namespaced the engine options under
+ * `source.engine.hlsJs`. Getting it wrong fails SILENTLY: the loader hooks below
+ * never reach hls.js, no cookie travels, and every segment comes back 403 with
+ * no error surfaced by the player. Keep the nesting.
+ *
+ * `src` is carried INSIDE the source rather than passed as a sibling prop:
+ * assigning `source` derives `src` from `source.src ?? ''`, so a source without
+ * it would blank the element depending on the order React applies the two.
+ * Rebuilding this object per `src` is safe — the element compares the engine
+ * configuration structurally, so only a real change to the options below
+ * recreates the playback engine.
+ *
+ * We hook BOTH the default XHR loader (`xhrSetup`) and the Fetch loader
+ * (`fetchSetup`) so the cookies travel regardless of which loader hls.js
+ * selects, and we force `autoStartLoad` because v10 defaults it to `false` —
+ * without it a muted autoplay tile would mount but never begin fetching.
+ *
+ * The rendition caps (`capRenditionToPlayerSize`, `minAutoResolution`) are left
+ * at the vendor defaults (`true` and `'720p'`) deliberately: a wall of camera
+ * tiles has no use for a rendition larger than the tile, the cap follows the
+ * element as it resizes so fullscreen lifts it again, and the 720p floor keeps
+ * a small tile off the bottom rungs of the ladder.
+ *
+ * The native/Safari HLS path bypasses hls.js entirely; the `crossOrigin`
+ * attribute on `<HlsJsVideo>` (see {@link HLS_CROSS_ORIGIN}) covers that path.
+ * Credentialed CORS forbids `Access-Control-Allow-Origin: *`, so CloudFront
+ * must echo the exact request origin and send
+ * `Access-Control-Allow-Credentials: true` for the segments to authenticate.
+ */
+export declare function buildCredentialedHlsSource(src: string, preferPlayback: HlsSource['preferPlayback']): HlsSource;
+//# sourceMappingURL=hlsSource.d.ts.map

package/components/VideoPlayer/hlsSource.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hlsSource.d.ts","sourceRoot":"","sources":["../../../../../../packages/gclick/src/components/VideoPlayer/hlsSource.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAE3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,wBAAgB,0BAA0B,CACxC,GAAG,EAAE,MAAM,EACX,cAAc,EAAE,SAAS,CAAC,gBAAgB,CAAC,GAC1C,SAAS,CAkCX"}

package/components/VideoPlayer/hlsSource.js

@@ -0,0 +1,35 @@
+function n(r, u) {
+  return {
+    src: r,
+    // Playback path selection. Left outside the source it would land on the
+    // `<video>` element as an unknown DOM attribute and be ignored.
+    preferPlayback: u,
+    engine: {
+      // Everything below is forwarded verbatim to the hls.js constructor.
+      hlsJs: {
+        // v10 default is `false` (lazy load); force eager load so muted autoplay
+        // starts fetching as soon as the tile mounts.
+        autoStartLoad: !0,
+        // Start from the beginning, NOT the live edge. hls.js defaults to the live
+        // edge for live streams, which anchors the MSE timeline mid-stream — once a
+        // finished live stream flips to VOD, the segments before the join point can
+        // no longer be buffered, so the seek bar cannot reach 0:00 (it loops
+        // re-fetching the first segment). Anchoring at 0 buffers the whole stream
+        // from the start, so the recording is fully seekable once it ends.
+        startPosition: 0,
+        /** Default XHR loader hook — sends cookies on every manifest + segment XHR. */
+        xhrSetup: (e) => {
+          e.withCredentials = !0;
+        },
+        /**
+         * Fetch loader hook — `xhrSetup` only fires when hls.js uses the XHR
+         * loader, so we also set `credentials: 'include'` for the Fetch path.
+         */
+        fetchSetup: (e, t) => (t.credentials = "include", new Request(e.url, t))
+      }
+    }
+  };
+}
+export {
+  n as buildCredentialedHlsSource
+};

package/components/VideoPlayer/hooks/useMediaReadiness.d.ts

@@ -0,0 +1,22 @@
+import { RefObject } from 'react';
+/**
+ * Call `onReady` every time the media element becomes able to start playing,
+ * and re-arm when it goes back to empty.
+ *
+ * The player store exposes `canPlay`, but it means `readyState >= HAVE_ENOUGH_DATA`
+ * — the `canplaythrough` threshold, which the spec defines as "can be played
+ * through TO THE END without interruption". A live manifest has no end, so that
+ * threshold is not merely late, it is undefined: Firefox parks a live MSE stream
+ * at HAVE_FUTURE_DATA forever (hls.js#118, hls.js#4624) and Safari is erratic
+ * about `canplay` (hls.js#1686). Chrome reaches it optimistically, which is why
+ * autoplay only ever worked there.
+ *
+ * HAVE_CURRENT_DATA is the threshold that actually answers "can playback start",
+ * and it is the one MDN's own `readyState` example gates `play()` on.
+ *
+ * Edge-triggered on purpose: a source swapped in place (`replay`, the degenerate
+ * manifest reload) fires `emptied` and then loads again, and each of those load
+ * cycles is a new start. A latch that only ever fires once would break replay.
+ */
+export declare function useMediaReadiness(videoRef: RefObject<HTMLVideoElement | null>, onReady: () => void): void;
+//# sourceMappingURL=useMediaReadiness.d.ts.map

package/components/VideoPlayer/hooks/useMediaReadiness.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMediaReadiness.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/hooks/useMediaReadiness.ts"],"names":[],"mappings":"AACA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAc1D;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,EAC5C,OAAO,EAAE,MAAM,IAAI,GAClB,IAAI,CAkCN"}

package/components/VideoPlayer/hooks/useMediaReadiness.js

@@ -0,0 +1,21 @@
+import { useRef as d, useEffect as i } from "react";
+const o = ["loadeddata", "canplay", "loadstart", "emptied"], f = 2;
+function u(n, a) {
+  const s = d(a);
+  s.current = a, i(() => {
+    const t = n.current;
+    if (!t)
+      return;
+    let c = !1;
+    const r = () => {
+      const e = t.readyState >= f;
+      e !== c && (c = e, e && s.current());
+    };
+    return r(), o.forEach((e) => t.addEventListener(e, r)), () => {
+      o.forEach((e) => t.removeEventListener(e, r));
+    };
+  }, [n]);
+}
+export {
+  u as useMediaReadiness
+};

package/components/VideoPlayer/hooks/usePlaybackIntent.d.ts

@@ -0,0 +1,14 @@
+import { StreamPlayerStore } from '../player.factory';
+/**
+ * Own this player's play/pause intent: the one-shot muted autostart and the
+ * soft-suspension sync. Returns the callback that starts playback once the
+ * media element is ready.
+ *
+ * React's canonical pattern for media is a desired state synchronized by an
+ * effect, not an imperative order pushed in from outside. An external `pause()`
+ * can land before the store has a target, which is both a crash and a no-op, so
+ * both decisions live here and there is exactly one answer to "should this clip
+ * be playing right now".
+ */
+export declare function usePlaybackIntent(store: StreamPlayerStore, suspended: boolean): () => void;
+//# sourceMappingURL=usePlaybackIntent.d.ts.map

package/components/VideoPlayer/hooks/usePlaybackIntent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePlaybackIntent.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/hooks/usePlaybackIntent.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAG3D;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,OAAO,GACjB,MAAM,IAAI,CA4DZ"}

package/components/VideoPlayer/hooks/usePlaybackIntent.js

@@ -0,0 +1,33 @@
+import { useRef as c, useCallback as a, useEffect as o } from "react";
+import { runStoreAction as f } from "../storeSafety.js";
+function m(t, e) {
+  const r = c(!1), u = c(e);
+  u.current = e;
+  const n = a(() => {
+    f(t, () => {
+      t.play().catch(() => {
+      });
+    });
+  }, [t]);
+  return o(() => {
+    if (e) {
+      const { paused: i, ended: l, started: s } = t.state;
+      s && !i && !l && f(t, () => {
+        t.pause();
+      }) && (r.current = !0);
+      return;
+    }
+    r.current && (r.current = !1, t.state.ended || n());
+  }, [n, t, e]), a(() => {
+    if (!t.state.started) {
+      if (u.current) {
+        r.current = !0;
+        return;
+      }
+      n();
+    }
+  }, [n, t]);
+}
+export {
+  m as usePlaybackIntent
+};

package/components/VideoPlayer/hooks/usePlayerControl.d.ts

@@ -7,6 +7,12 @@ import { VideoPlayerControl } from '../types';
  * element) on invocation, so the handle identity only changes when the store
  * does. The handle is a thin store adapter — it deliberately exposes none of
  * the underlying video.js internals.
+ *
+ * Every mutation goes through `runStoreAction`, so the handle is inert — never
+ * throwing — while the store has no `<video>` attached. That window is not an
+ * edge case: v10 attaches from an effect on a second commit, so the first
+ * commit of every player is always detached, and this handle is registered for
+ * outside callers (`useCameraStreamPlayers()`) before it closes.
  */
 export declare function usePlayerControl(ref: Ref<VideoPlayerControl> | undefined, store: StreamPlayerStore, videoRef: RefObject<HTMLVideoElement | null>): void;
 //# sourceMappingURL=usePlayerControl.d.ts.map

package/components/VideoPlayer/hooks/usePlayerControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePlayerControl.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/hooks/usePlayerControl.ts"],"names":[],"mappings":"AACA,OAAO,EAAuB,KAAK,GAAG,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAEnD;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAC9B,GAAG,EAAE,GAAG,CAAC,kBAAkB,CAAC,GAAG,SAAS,EACxC,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,GAC3C,IAAI,CAwFN"}
+{"version":3,"file":"usePlayerControl.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/hooks/usePlayerControl.ts"],"names":[],"mappings":"AACA,OAAO,EAAuB,KAAK,GAAG,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAG3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAEnD;;;;;;;;;;;;GAYG;AACH,wBAAgB,gBAAgB,CAC9B,GAAG,EAAE,GAAG,CAAC,kBAAkB,CAAC,GAAG,SAAS,EACxC,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,GAC3C,IAAI,CAiGN"}

package/components/VideoPlayer/hooks/usePlayerControl.js

@@ -1,78 +1,87 @@
-import { useImperativeHandle as l } from "react";
+import { useImperativeHandle as d } from "react";
+import { runStoreAction as n, absorbDetachedStoreRejection as m } from "../storeSafety.js";
 import { resolveIsLive as s } from "../utils.js";
-function m(c, e, r) {
-  l(c, () => ({
+function o(l, t, c) {
+  d(l, () => ({
     /** Resume playback, swallowing autoplay rejection. */
     async play() {
       try {
-        await e.play();
+        await t.play();
       } catch {
       }
     },
-    /** Pause playback. */
+    /** Pause playback; a no-op while no `<video>` is attached. */
     pause() {
-      e.pause();
+      n(t, () => {
+        t.pause();
+      });
     },
     /** Whether playback is currently paused. */
     isPaused() {
-      return e.state.paused ?? !1;
+      return t.state.paused ?? !1;
     },
     /** Force the muted flag to `muted` (v10 only exposes a toggle). */
-    setMuted(t) {
-      (e.state.muted ?? !1) !== t && e.toggleMuted();
+    setMuted(e) {
+      (t.state.muted ?? !1) !== e && n(t, () => {
+        t.toggleMuted();
+      });
     },
     /** Whether the player is currently muted. */
     isMuted() {
-      return e.state.muted ?? !1;
+      return t.state.muted ?? !1;
     },
     /** Whether the underlying manifest is still live. */
     isLive() {
-      return s(e.state.streamType, e.state.duration);
+      return s(t.state.streamType, t.state.duration);
     },
     /** Seek to `seconds`; no-op on live streams (no seekable window). */
-    seek(t) {
-      s(e.state.streamType, e.state.duration) || e.seek(t);
+    seek(e) {
+      s(t.state.streamType, t.state.duration) || n(t, () => {
+        t.seek(e).catch(m);
+      });
     },
     /** Set the playback rate. */
-    setPlaybackRate(t) {
-      e.setPlaybackRate(t);
+    setPlaybackRate(e) {
+      n(t, () => {
+        t.setPlaybackRate(e);
+      });
     },
     /** Request native fullscreen, swallowing rejection (no user gesture / unsupported). */
     async requestFullscreen() {
       try {
-        await e.requestFullscreen();
+        await t.requestFullscreen();
       } catch {
       }
     },
     /** Request Picture-in-Picture, swallowing rejection (unsupported / blocked). */
     async requestPictureInPicture() {
       try {
-        await e.requestPictureInPicture();
+        await t.requestPictureInPicture();
       } catch {
       }
     },
     /** Capture the current frame as a PNG data URL, or `null` when unavailable. */
     snapshot() {
-      const t = r.current;
-      if (!t)
+      const e = c.current;
+      if (!e)
         return null;
-      const { videoWidth: u, videoHeight: n } = t;
-      if (!u || !n)
+      const { videoWidth: u, videoHeight: r } = e;
+      if (!u || !r)
         return null;
       const a = document.createElement("canvas");
-      a.width = u, a.height = n;
+      a.width = u, a.height = r;
       const i = a.getContext("2d");
       if (!i)
         return null;
       try {
-        return i.drawImage(t, 0, 0, u, n), a.toDataURL("image/png");
+        return i.drawImage(e, 0, 0, u, r), a.toDataURL("image/png");
       } catch {
         return null;
       }
     }
     // `ref` is the handle target (not a reactive dependency) and is omitted.
-  }), [e, r]);
+  }), [t, c]);
 }
 export {
-  m as usePlayerControl
+  o as usePlayerControl
 };

package/components/VideoPlayer/hooks/usePlayerEvents.d.ts

@@ -2,7 +2,6 @@ import { StreamPlayerStore } from '../player.factory';
 import { VideoPlayerError } from '../types';
 /** Consumer callbacks the event bridge forwards from the player store. */
 export interface PlayerEventHandlers {
-    onReady?: () => void;
     onPlay?: () => void;
     onPause?: () => void;
     onEnded?: () => void;
@@ -15,6 +14,11 @@ export interface PlayerEventHandlers {
  * has no React-style `onPlay`/`onEnded` props, so we subscribe once and diff
  * the relevant primitives across changes. Handlers are read from a ref so
  * consumers can pass inline callbacks without re-subscribing the listener.
+ *
+ * Readiness is deliberately absent: the store's `canPlay` is the
+ * `canplaythrough` threshold, which never arrives for a live manifest on
+ * Firefox or Safari. `onReady` is emitted from `useMediaReadiness` instead,
+ * which reads the element directly — see that hook for the full reasoning.
  */
 export declare function usePlayerEvents(store: StreamPlayerStore, handlers: PlayerEventHandlers): void;
 //# sourceMappingURL=usePlayerEvents.d.ts.map

package/components/VideoPlayer/hooks/usePlayerEvents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePlayerEvents.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/hooks/usePlayerEvents.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,0EAA0E;AAC1E,MAAM,WAAW,mBAAmB;IAClC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,KAAK,IAAI,CAAC;IACnD,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAChE;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,mBAAmB,GAC5B,IAAI,CA+DN"}
+{"version":3,"file":"usePlayerEvents.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/hooks/usePlayerEvents.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,0EAA0E;AAC1E,MAAM,WAAW,mBAAmB;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,KAAK,IAAI,CAAC;IACnD,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAChE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,mBAAmB,GAC5B,IAAI,CA6CN"}

package/components/VideoPlayer/hooks/usePlayerEvents.js

@@ -1,16 +1,15 @@
-import { useRef as y, useEffect as m } from "react";
-import { resolveIsLive as v } from "../utils.js";
-function E(n, t) {
-  const i = y(t);
-  i.current = t, m(() => {
+import { useRef as l, useEffect as m } from "react";
+import { resolveIsLive as g } from "../utils.js";
+function E(n, a) {
+  const i = l(a);
+  i.current = a, m(() => {
     const r = n.state;
-    let o = r.paused, d = r.ended, s = r.waiting, u = r.canPlay, l = r.duration, p = r.streamType, c = r.error;
-    const f = () => {
-      const e = n.state, a = i.current;
-      e.paused !== o && (o = e.paused, (e.paused ? a.onPause : a.onPlay)?.()), e.ended !== d && (d = e.ended, e.ended && a.onEnded?.()), e.waiting !== s && (s = e.waiting, e.waiting && a.onWaiting?.()), e.canPlay !== u && (u = e.canPlay, e.canPlay && (a.onReady?.(), e.started || n.play().catch(() => {
-      }))), (e.duration !== l || e.streamType !== p) && (l = e.duration, p = e.streamType, a.onDurationChange?.(e.duration, v(e.streamType, e.duration))), e.error !== c && (c = e.error, a.onError?.(e.error ? { code: e.error.code, message: e.error.message } : null));
+    let o = r.paused, s = r.ended, d = r.waiting, u = r.duration, p = r.streamType, f = r.error;
+    const c = () => {
+      const e = n.state, t = i.current;
+      e.paused !== o && (o = e.paused, (e.paused ? t.onPause : t.onPlay)?.()), e.ended !== s && (s = e.ended, e.ended && t.onEnded?.()), e.waiting !== d && (d = e.waiting, e.waiting && t.onWaiting?.()), (e.duration !== u || e.streamType !== p) && (u = e.duration, p = e.streamType, t.onDurationChange?.(e.duration, g(e.streamType, e.duration))), e.error !== f && (f = e.error, t.onError?.(e.error ? { code: e.error.code, message: e.error.message } : null));
     };
-    return n.subscribe(f);
+    return n.subscribe(c);
   }, [n]);
 }
 export {

package/components/VideoPlayer/player.factory.d.ts

@@ -1,8 +1,20 @@
-import { MediaAudioTrackState, MediaErrorState, MediaFullscreenState, MediaLiveState, MediaPictureInPictureState, MediaPlaybackRateState, MediaPlaybackState, MediaQualityState, MediaSourceState, MediaStreamTypeState, MediaTimeState, MediaVolumeState } from '@videojs/core';
-import { BaseStore } from '@videojs/store';
+import { PlayerFeature, PlayerStore, VideoFeatures } from '@videojs/core/dom';
+import { MediaLiveState, MediaStreamTypeState } from '@videojs/media';
+import { CreatePlayerResult } from '@videojs/react';
+/**
+ * The stock video preset plus the two features we compose on top of it. Spelled
+ * out because this package publishes declarations: the type `createPlayer`
+ * infers reaches internal feature symbols that cannot be named from outside the
+ * vendor, so `tsc` refuses to emit a `.d.ts` for an un-annotated `StreamPlayer`.
+ */
+type StreamPlayerFeatures = [
+    ...VideoFeatures,
+    PlayerFeature<MediaStreamTypeState>,
+    PlayerFeature<MediaLiveState>
+];
 /**
  * Module-scope player factory for the Gclick HLS player. video.js v10 expects
- * `createPlayer` to be called once per logical player type; every `<Provider>`
+ * `createPlayer` to be called once per logical player type; every `<Player>`
  * mount then owns an isolated, typed store.
  *
  * We extend the stock `videoFeatures` preset (playback, volume, time, source,
@@ -13,20 +25,15 @@ import { BaseStore } from '@videojs/store';
  * (it assumes the stream stays live forever), which is the opposite of our
  * cameras → recording transition, so we compose our own feature set instead.
  */
-export declare const StreamPlayer: import('@videojs/react').CreatePlayerResult<import('@videojs/react').PlayerStore<[import('@videojs/react').PlayerFeature<MediaPlaybackState>, import('@videojs/react').PlayerFeature<MediaPlaybackRateState>, import('@videojs/react').PlayerFeature<MediaQualityState>, import('@videojs/react').PlayerFeature<MediaAudioTrackState>, import('@videojs/react').PlayerFeature<MediaVolumeState>, import('@videojs/react').PlayerFeature<MediaTimeState>, import('@videojs/react').PlayerFeature<MediaSourceState>, import('@videojs/react').PlayerFeature<import('@videojs/core').MediaBufferState>, import('@videojs/react').PlayerFeature<MediaFullscreenState>, import('@videojs/react').PlayerFeature<MediaPictureInPictureState>, import('@videojs/react').PlayerFeature<import('@videojs/core').MediaRemotePlaybackState>, import('@videojs/react').PlayerFeature<import('@videojs/core').MediaControlsState>, import('@videojs/react').PlayerFeature<import('@videojs/core').MediaTextTrackState>, import('@videojs/react').PlayerFeature<MediaErrorState>, import('@videojs/react').PlayerFeature<MediaStreamTypeState>, import('@videojs/react').PlayerFeature<MediaLiveState>]>>;
+export declare const StreamPlayer: CreatePlayerResult<StreamPlayerStore>;
 /**
- * Merged state of {@link StreamPlayer}'s store — the intersection of the
- * feature states we enable. v10's generics widen a spread feature array to
- * `unknown`, so we name the state explicitly from the per-feature state
- * contracts (which the selectors are typed against) instead of relying on
- * inference.
- */
-export type StreamPlayerState = MediaPlaybackState & MediaVolumeState & MediaTimeState & MediaSourceState & MediaPlaybackRateState & MediaFullscreenState & MediaPictureInPictureState & MediaErrorState & MediaStreamTypeState & MediaLiveState & MediaQualityState & MediaAudioTrackState;
-/**
- * The store handle returned by `StreamPlayer.usePlayer()` (no selector): a
- * `BaseStore` intersected with the merged feature state, so actions and state
- * are flattened onto it (`store.play()`, `store.state.paused`,
- * `store.subscribe(...)`, …).
+ * The store handle returned by `StreamPlayer.usePlayer()` (no selector): the
+ * feature states flattened onto the store, so actions and state sit together
+ * (`store.play()`, `store.state.paused`, `store.subscribe(...)`, …).
+ *
+ * Derived from the feature list rather than restated field by field, so it
+ * cannot drift from what the player actually composes.
  */
-export type StreamPlayerStore = BaseStore<unknown, StreamPlayerState> & StreamPlayerState;
+export type StreamPlayerStore = PlayerStore<StreamPlayerFeatures>;
+export {};
 //# sourceMappingURL=player.factory.d.ts.map

package/components/VideoPlayer/player.factory.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"player.factory.d.ts","sourceRoot":"","sources":["../../../../../../packages/gclick/src/components/VideoPlayer/player.factory.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,oBAAoB,EACpB,eAAe,EACf,oBAAoB,EACpB,cAAc,EACd,0BAA0B,EAC1B,sBAAsB,EACtB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,oBAAoB,EACpB,cAAc,EACd,gBAAgB,EACjB,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEhD;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,YAAY,4nCAGvB,CAAC;AAEH;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,kBAAkB,GAC9C,gBAAgB,GAChB,cAAc,GACd,gBAAgB,GAChB,sBAAsB,GACtB,oBAAoB,GACpB,0BAA0B,GAC1B,eAAe,GACf,oBAAoB,GACpB,cAAc,GAMd,iBAAiB,GACjB,oBAAoB,CAAC;AAEzB;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GAAG,SAAS,CAAC,OAAO,EAAE,iBAAiB,CAAC,GAAG,iBAAiB,CAAC"}
+{"version":3,"file":"player.factory.d.ts","sourceRoot":"","sources":["../../../../../../packages/gclick/src/components/VideoPlayer/player.factory.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACnF,OAAO,KAAK,EAAE,cAAc,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAKL,KAAK,kBAAkB,EACxB,MAAM,gBAAgB,CAAC;AAExB;;;;;GAKG;AACH,KAAK,oBAAoB,GAAG;IAC1B,GAAG,aAAa;IAChB,aAAa,CAAC,oBAAoB,CAAC;IACnC,aAAa,CAAC,cAAc,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,YAAY,EAAE,kBAAkB,CAAC,iBAAiB,CAG7D,CAAC;AAEH;;;;;;;GAOG;AACH,MAAM,MAAM,iBAAiB,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC"}

package/components/VideoPlayer/storeSafety.d.ts

@@ -0,0 +1,15 @@
+import { StreamPlayerStore } from './player.factory';
+/** Whether the store refused an action because it is detached or already destroyed. */
+export declare function isDetachedStoreError(error: unknown): boolean;
+/**
+ * Dispatch a synchronous store action, skipping it while the store has no media
+ * element attached. Returns whether the action actually reached the element, so
+ * a caller can tell a real dispatch from a lifecycle no-op.
+ */
+export declare function runStoreAction(store: StreamPlayerStore, action: () => void): boolean;
+/**
+ * Swallow the detach/destroy rejection of an async store action and rethrow
+ * anything else, so a real failure still surfaces as an unhandled rejection.
+ */
+export declare function absorbDetachedStoreRejection(error: unknown): void;
+//# sourceMappingURL=storeSafety.d.ts.map

package/components/VideoPlayer/storeSafety.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"storeSafety.d.ts","sourceRoot":"","sources":["../../../../../../packages/gclick/src/components/VideoPlayer/storeSafety.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAgB1D,uFAAuF;AACvF,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,OAAO,GAAG,OAAO,CAE5D;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM,IAAI,GAAG,OAAO,CAepF;AAED;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAKjE"}

package/components/VideoPlayer/storeSafety.js

@@ -0,0 +1,25 @@
+import { isStoreError as n } from "@videojs/store";
+const c = ["NO_TARGET", "DESTROYED"];
+function e(r) {
+  return n(r) && c.includes(r.code);
+}
+function u(r, o) {
+  if (!r.target || r.destroyed)
+    return !1;
+  try {
+    return o(), !0;
+  } catch (t) {
+    if (e(t))
+      return !1;
+    throw t;
+  }
+}
+function f(r) {
+  if (!e(r))
+    throw r;
+}
+export {
+  f as absorbDetachedStoreRejection,
+  e as isDetachedStoreError,
+  u as runStoreAction
+};

package/components/VideoPlayer/subcomponents/GclickVideoSkin.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { VideoPlayerVariant } from '../types';
+import { VideoPlayerOptionalControls, VideoPlayerVariant } from '../types';
 /** Public props of the composed skin — the official skin contract plus `isLive`. */
 export interface GclickVideoSkinProps {
     children?: ReactNode;
@@ -9,6 +9,8 @@ export interface GclickVideoSkinProps {
     isLive: boolean;
     /** Which vendor skin to wear. Decides the class names, not the stylesheet. */
     variant: VideoPlayerVariant;
+    /** Opt in to the transport controls that are hidden by default. */
+    optionalControls?: VideoPlayerOptionalControls;
 }
 /**
  * Single official-v10 skin for both live and VOD, composed from the dependency's
@@ -20,5 +22,5 @@ export interface GclickVideoSkinProps {
  * slider. Because it is one component (no skin swap), the `<video>` is never
  * remounted on the live → VOD transition.
  */
-export declare function GclickVideoSkin({ children, className, poster, isLive, variant, }: GclickVideoSkinProps): ReactNode;
+export declare function GclickVideoSkin({ children, className, poster, isLive, variant, optionalControls, }: GclickVideoSkinProps): ReactNode;
 //# sourceMappingURL=GclickVideoSkin.d.ts.map

package/components/VideoPlayer/subcomponents/GclickVideoSkin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GclickVideoSkin.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/subcomponents/GclickVideoSkin.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAqCvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAQnD,oFAAoF;AACpF,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2EAA2E;IAC3E,MAAM,EAAE,OAAO,CAAC;IAChB,8EAA8E;IAC9E,OAAO,EAAE,kBAAkB,CAAC;CAC7B;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,SAAS,EACT,MAAM,EACN,MAAM,EACN,OAAO,GACR,EAAE,oBAAoB,GAAG,SAAS,CAQlC"}
+{"version":3,"file":"GclickVideoSkin.d.ts","sourceRoot":"","sources":["../../../../../../../packages/gclick/src/components/VideoPlayer/subcomponents/GclickVideoSkin.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAqCvC,OAAO,KAAK,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAShF,oFAAoF;AACpF,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2EAA2E;IAC3E,MAAM,EAAE,OAAO,CAAC;IAChB,8EAA8E;IAC9E,OAAO,EAAE,kBAAkB,CAAC;IAC5B,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,2BAA2B,CAAC;CAChD;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,SAAS,EACT,MAAM,EACN,MAAM,EACN,OAAO,EACP,gBAAgB,GACjB,EAAE,oBAAoB,GAAG,SAAS,CAalC"}