@halibegic/react-video-player 0.0.1 → 0.0.3

package/dist/stores/live-player-store.d.ts

@@ -0,0 +1,21 @@
+import { PropsWithChildren } from 'react';
+type State = {
+    delay: number;
+    startDate: Date;
+    endDate: Date;
+    startTime: number;
+    endTime: number;
+};
+type Actions = {
+    setDelay: (delay: number) => void;
+    setStartDate: (startDate: Date) => void;
+    setEndDate: (endDate: Date) => void;
+};
+type LivePlayerStore = State & Actions;
+type LivePlayerStoreProviderProps = PropsWithChildren & {
+    startDate: Date;
+    endDate: Date;
+};
+declare const LivePlayerStoreProvider: ({ children, startDate, endDate, }: LivePlayerStoreProviderProps) => import("react/jsx-runtime").JSX.Element;
+declare const useLivePlayerStore: <T>(selector: (state: LivePlayerStore) => T) => T;
+export { LivePlayerStoreProvider, useLivePlayerStore };

package/dist/stores/player-store.d.ts

@@ -70,6 +70,6 @@ type RefState = {
 };
 type RefSlice = RefState;
 type PlayerStore = PlaybackSlice & IdleLockSlice & FullscreenSlice & AssetSlice & RefSlice;
-declare const PlayerStoreProvider: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
+declare function PlayerStoreProvider({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
 declare const usePlayerStore: <T>(selector: (state: PlayerStore) => T) => T;
 export { PlayerStoreProvider, usePlayerStore };

package/dist/utils/dom.d.ts

@@ -0,0 +1,11 @@
+declare function offset(element: HTMLElement): DOMRect | {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+    width: number;
+    height: number;
+};
+declare function width(element: HTMLElement): number;
+declare function height(element: HTMLElement): number;
+export { height, offset, width };

package/dist/utils/player.d.ts

@@ -1,3 +1,4 @@
-import { PlayerSourceType } from '../config/player';
-declare function getPlayerSourceType(url: string | undefined | null): keyof typeof PlayerSourceType;
-export { getPlayerSourceType };
+declare const getLiveDelay: (startTime: number, skipTime: number) => number;
+declare const getLiveCurrentTime: (startTime: number, delay: number) => number;
+declare const getLiveDurationTime: (startTime: number, endTime: number) => number;
+export { getLiveCurrentTime, getLiveDelay, getLiveDurationTime };

package/dist/vod-player-watch-history-D3ZHK2x3.js

@@ -0,0 +1,37 @@
+import { u as n, a as y } from "./index-DkJtizQx.js";
+import { useRef as T, useCallback as o, useEffect as p } from "react";
+const h = 60, g = 95;
+function W({ storageKey: e }) {
+  const s = n((t) => t.currentTime), a = n((t) => t.duration), f = n((t) => t.isPlaying), i = n((t) => t.setStartTime), c = T(!1), u = o(() => {
+    window.localStorage.setItem(
+      e,
+      JSON.stringify({
+        currentTime: s,
+        duration: a
+      })
+    );
+  }, [s, a, e]), l = o(() => {
+    const t = window.localStorage.getItem(e);
+    if (t) {
+      const r = JSON.parse(t);
+      return {
+        startTime: r.currentTime,
+        progress: r.currentTime / r.duration * 100
+      };
+    }
+    return { startTime: null, progress: null };
+  }, [e]), d = o(() => {
+    s < h || u();
+  }, [s, u]), m = o(() => {
+    if (c.current) return;
+    const { progress: t, startTime: r } = l();
+    r && t && t < g && (i(r), c.current = !0);
+  }, [l, i]);
+  return y(() => d(), f ? 1e3 : null), p(() => {
+    m();
+  }, [m]), null;
+}
+export {
+  W as default
+};
+//# sourceMappingURL=vod-player-watch-history-D3ZHK2x3.js.map

package/dist/vod-player-watch-history-D3ZHK2x3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vod-player-watch-history-D3ZHK2x3.js","sources":["../src/config/player.ts","../src/components/vod-player/vod-player-watch-history.tsx"],"sourcesContent":["const WatchHistoryMinTime = 60;\nconst WatchHistoryMaxPercent = 95;\n\nexport { WatchHistoryMaxPercent, WatchHistoryMinTime };\n","import { WatchHistoryMaxPercent, WatchHistoryMinTime } from \"@/config/player\";\nimport { useInterval } from \"@/hooks/use-interval\";\nimport { usePlayerStore } from \"@/stores/player-store\";\nimport { useCallback, useEffect, useRef } from \"react\";\n\ntype VodPlayerWatchHistoryProps = {\n  storageKey: string;\n};\n\nfunction VodPlayerWatchHistory({ storageKey }: VodPlayerWatchHistoryProps) {\n  const currentTime = usePlayerStore((s) => s.currentTime);\n  const duration = usePlayerStore((s) => s.duration);\n  const isPlaying = usePlayerStore((s) => s.isPlaying);\n  const setStartTime = usePlayerStore((s) => s.setStartTime);\n  const isReadyRef = useRef<boolean>(false);\n\n  const setWatchHistory = useCallback(() => {\n    window.localStorage.setItem(\n      storageKey,\n      JSON.stringify({\n        currentTime,\n        duration,\n      })\n    );\n  }, [currentTime, duration, storageKey]);\n\n  const getWatchHistory = useCallback(() => {\n    const history = window.localStorage.getItem(storageKey);\n\n    if (history) {\n      const data = JSON.parse(history);\n\n      return {\n        startTime: data.currentTime,\n        progress: (data.currentTime / data.duration) * 100,\n      };\n    }\n\n    return { startTime: null, progress: null };\n  }, [storageKey]);\n\n  const handleWatchHistory = useCallback(() => {\n    if (currentTime < WatchHistoryMinTime) return;\n\n    setWatchHistory();\n  }, [currentTime, setWatchHistory]);\n\n  const prepareData = useCallback(() => {\n    if (isReadyRef.current) return;\n\n    const { progress, startTime } = getWatchHistory();\n\n    if (startTime && progress && progress < WatchHistoryMaxPercent) {\n      setStartTime(startTime);\n\n      isReadyRef.current = true;\n    }\n  }, [getWatchHistory, setStartTime]);\n\n  useInterval(() => handleWatchHistory(), isPlaying ? 1000 : null);\n\n  useEffect(() => {\n    prepareData();\n  }, [prepareData]);\n\n  return null;\n}\n\nexport default VodPlayerWatchHistory;\n"],"names":["WatchHistoryMinTime","WatchHistoryMaxPercent","VodPlayerWatchHistory","storageKey","currentTime","usePlayerStore","s","duration","isPlaying","setStartTime","isReadyRef","useRef","setWatchHistory","useCallback","getWatchHistory","history","data","handleWatchHistory","prepareData","progress","startTime","useInterval","useEffect"],"mappings":";;AAAA,MAAMA,IAAsB,IACtBC,IAAyB;ACQ/B,SAASC,EAAsB,EAAE,YAAAC,KAA0C;AACzE,QAAMC,IAAcC,EAAe,CAACC,MAAMA,EAAE,WAAW,GACjDC,IAAWF,EAAe,CAACC,MAAMA,EAAE,QAAQ,GAC3CE,IAAYH,EAAe,CAACC,MAAMA,EAAE,SAAS,GAC7CG,IAAeJ,EAAe,CAACC,MAAMA,EAAE,YAAY,GACnDI,IAAaC,EAAgB,EAAK,GAElCC,IAAkBC,EAAY,MAAM;AACxC,WAAO,aAAa;AAAA,MAClBV;AAAA,MACA,KAAK,UAAU;AAAA,QACb,aAAAC;AAAA,QACA,UAAAG;AAAA,MAAA,CACD;AAAA,IAAA;AAAA,EAEL,GAAG,CAACH,GAAaG,GAAUJ,CAAU,CAAC,GAEhCW,IAAkBD,EAAY,MAAM;AACxC,UAAME,IAAU,OAAO,aAAa,QAAQZ,CAAU;AAEtD,QAAIY,GAAS;AACX,YAAMC,IAAO,KAAK,MAAMD,CAAO;AAE/B,aAAO;AAAA,QACL,WAAWC,EAAK;AAAA,QAChB,UAAWA,EAAK,cAAcA,EAAK,WAAY;AAAA,MAAA;AAAA,IAEnD;AAEA,WAAO,EAAE,WAAW,MAAM,UAAU,KAAA;AAAA,EACtC,GAAG,CAACb,CAAU,CAAC,GAETc,IAAqBJ,EAAY,MAAM;AAC3C,IAAIT,IAAcJ,KAElBY,EAAA;AAAA,EACF,GAAG,CAACR,GAAaQ,CAAe,CAAC,GAE3BM,IAAcL,EAAY,MAAM;AACpC,QAAIH,EAAW,QAAS;AAExB,UAAM,EAAE,UAAAS,GAAU,WAAAC,EAAA,IAAcN,EAAA;AAEhC,IAAIM,KAAaD,KAAYA,IAAWlB,MACtCQ,EAAaW,CAAS,GAEtBV,EAAW,UAAU;AAAA,EAEzB,GAAG,CAACI,GAAiBL,CAAY,CAAC;AAElC,SAAAY,EAAY,MAAMJ,EAAA,GAAsBT,IAAY,MAAO,IAAI,GAE/Dc,EAAU,MAAM;AACd,IAAAJ,EAAA;AAAA,EACF,GAAG,CAACA,CAAW,CAAC,GAET;AACT;"}

package/package.json

@@ -1,15 +1,13 @@
 {
   "name": "@halibegic/react-video-player",
-  "description": "A React video player library with HLS.js/Dash.js support for VOD and Live streaming",
-  "version": "0.0.1",
+  "description": "A React video player library with HLS support for VOD and Live streaming",
+  "version": "0.0.3",
   "license": "MIT",
   "keywords": [
     "react",
     "video-player",
     "hls",
     "hls.js",
-    "dash",
-    "dash.js",
     "video-player",
     "streaming",
     "vod",
@@ -52,12 +50,9 @@
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "dependencies": {
+    "@radix-ui/react-slider": "^1.3.6",
     "@types/styled-components": "^5.1.34",
-    "dashjs": "^5.0.3",
     "hls.js": "^1.6.11",
-    "install": "^0.13.0",
-    "lucide-react": "^0.542.0",
-    "npm": "^11.5.2",
     "styled-components": "^6.1.19",
     "zustand": "^5.0.8"
   },

package/dist/components/player/tech/player-dash-tech.d.ts

@@ -1,6 +0,0 @@
-type PlayerDashTechProps = {
-    url: string;
-    isLive: boolean;
-};
-declare const PlayerDashTech: ({ url, isLive }: PlayerDashTechProps) => null;
-export default PlayerDashTech;

package/dist/components/player/tech/player-hls-tech.d.ts

@@ -1,6 +0,0 @@
-type PlayerHlsTechProps = {
-    url: string;
-    isLive: boolean;
-};
-declare function PlayerHlsTech({ url, isLive }: PlayerHlsTechProps): null;
-export default PlayerHlsTech;