@mottosports/motto-video-player 1.0.1-rc.5 → 1.0.1-rc.7

package/dist/index.mjs

@@ -27,11 +27,9 @@ styleInject('/*! tailwindcss v4.1.8 | MIT License | https://tailwindcss.com */\n
 
 // src/Player.tsx
 import { forwardRef, useEffect as useEffect5, useRef as useRef8, useImperativeHandle } from "react";
-import shaka2 from "shaka-player/dist/shaka-player.ui";
 
 // src/hooks/useShakePlayer.ts
 import { useRef, useCallback } from "react";
-import { Player as ShakaPlayer, polyfill } from "shaka-player/dist/shaka-player.ui";
 var useShakePlayer = ({
   src,
   shakaConfig,
@@ -42,6 +40,7 @@ var useShakePlayer = ({
   const playerRef = useRef(null);
   const initializePlayer = useCallback(async (video) => {
     try {
+      const { Player: ShakaPlayer, polyfill } = await import("shaka-player/dist/shaka-player.ui");
       polyfill.installAll();
       if (!ShakaPlayer.isBrowserSupported()) {
         throw new Error("Browser not supported by Shaka Player");
@@ -1240,10 +1239,11 @@ var Player = forwardRef(
       controls: uiRef.current,
       manualStreamStartDate: streamStartDate
     });
-    const initializeAds = () => {
+    const initializeAds = async () => {
       if (!imaConfig || !playerRef.current || !videoRef.current) return;
       const adManager = playerRef.current.getAdManager();
       if (!adManager) return;
+      const shaka2 = await import("shaka-player/dist/shaka-player.ui");
       adManager.addEventListener(shaka2.ads?.Utils?.AD_STARTED, () => {
         events?.onAdStart?.();
       });
@@ -1291,7 +1291,7 @@ var Player = forwardRef(
           configureQuality();
           await initializeUI();
           initializeMux();
-          initializeAds();
+          await initializeAds();
           initializeChromecast();
         } catch (error) {
           console.error("Error during player initialization:", error);
@@ -1387,40 +1387,8 @@ var Player = forwardRef(
 );
 Player.displayName = "Player";
 
-// src/ClientOnlyPlayer.tsx
-import { forwardRef as forwardRef2, useEffect as useEffect6, useState as useState4 } from "react";
-import { jsx as jsx6 } from "react/jsx-runtime";
-var ClientOnlyPlayer = forwardRef2(
-  (props, ref) => {
-    const [isClient, setIsClient] = useState4(false);
-    useEffect6(() => {
-      setIsClient(true);
-    }, []);
-    if (!isClient) {
-      return /* @__PURE__ */ jsx6(
-        "div",
-        {
-          className: props.containerClassName,
-          style: {
-            width: props.width,
-            height: props.height,
-            aspectRatio: props.aspectRatio ? props.aspectRatio.toString() : "16/9",
-            backgroundColor: "#000",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center"
-          },
-          children: /* @__PURE__ */ jsx6("div", { style: { color: "white" }, children: "Loading player..." })
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx6(Player, { ...props, ref });
-  }
-);
-ClientOnlyPlayer.displayName = "ClientOnlyPlayer";
-
 // src/Video.tsx
-import { useEffect as useEffect8 } from "react";
+import { useEffect as useEffect7 } from "react";
 import { twMerge as twMerge3 } from "tailwind-merge";
 import { useQuery } from "@tanstack/react-query";
 
@@ -1571,7 +1539,7 @@ var getErrorType = (error, video) => {
 };
 
 // src/messages/useMessages.tsx
-import { useState as useState5, useEffect as useEffect7 } from "react";
+import { useState as useState4, useEffect as useEffect6 } from "react";
 
 // src/messages/en.json
 var en_default = {
@@ -1880,9 +1848,9 @@ var getBrowserLanguage = () => {
   }
 };
 var useMessages = (locale) => {
-  const [language, setLanguage] = useState5("en");
-  const [translations, setTranslations] = useState5(availableLanguages.en);
-  useEffect7(() => {
+  const [language, setLanguage] = useState4("en");
+  const [translations, setTranslations] = useState4(availableLanguages.en);
+  useEffect6(() => {
     const lang = !!availableLanguages?.[locale] ? locale : getBrowserLanguage();
     setLanguage(lang);
     setTranslations(availableLanguages[lang]);
@@ -1907,7 +1875,7 @@ var useMessages = (locale) => {
 var useMessages_default = useMessages;
 
 // src/Video.tsx
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var Video = ({
   videoId,
   publicKey,
@@ -1943,13 +1911,13 @@ var Video = ({
   const { t } = useMessages_default(locale);
   const activePlaylist = findHLSPlaylist(video);
   const hlsUrl = activePlaylist?.url;
-  useEffect8(() => {
+  useEffect7(() => {
     if (events?.onVideoData && video) {
       events.onVideoData(video);
     }
   }, [video, events]);
   if (isLoading || !providedVideoData && !video) {
-    return /* @__PURE__ */ jsx7("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx7("div", { className: "relative w-full h-full bg-[#151515]", children: /* @__PURE__ */ jsx7(Loading, {}) }) });
+    return /* @__PURE__ */ jsx6("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx6("div", { className: "relative w-full h-full bg-[#151515]", children: /* @__PURE__ */ jsx6(Loading, {}) }) });
   }
   if (!isLoading && video && !hlsUrl && events?.onEmptyPlaylists) {
     events.onEmptyPlaylists();
@@ -1962,8 +1930,8 @@ var Video = ({
     }
     const title = t(errorKey) || t("DEFAULT_ERROR");
     const description = t(`${errorKey}_DESCRIPTION`) || t("DEFAULT_ERROR_DESCRIPTION");
-    return /* @__PURE__ */ jsx7("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs5("div", { className: "relative w-full h-full", children: [
-      /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx6("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs5("div", { className: "relative w-full h-full", children: [
+      /* @__PURE__ */ jsx6(
         ErrorScreen,
         {
           title,
@@ -1974,13 +1942,13 @@ var Video = ({
     ] }) });
   }
   if (!hlsUrl) {
-    return /* @__PURE__ */ jsx7("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs5("div", { className: "relative w-full h-full bg-[#151515]", children: [
-      /* @__PURE__ */ jsx7(Title, { title: video?.name || "" }),
+    return /* @__PURE__ */ jsx6("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs5("div", { className: "relative w-full h-full bg-[#151515]", children: [
+      /* @__PURE__ */ jsx6(Title, { title: video?.name || "" }),
       children
     ] }) });
   }
   console.log("hlsUrl", hlsUrl);
-  return /* @__PURE__ */ jsx7("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx7("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx6("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx6("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx6(
     Player,
     {
       ...props,
@@ -1994,10 +1962,10 @@ var Video = ({
 };
 
 // src/Event.tsx
-import { useCallback as useCallback7, useEffect as useEffect9, useState as useState6 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect8, useState as useState5 } from "react";
 import { twMerge as twMerge4 } from "tailwind-merge";
 import { useQuery as useQuery2 } from "@tanstack/react-query";
-import { Fragment, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 var Event = ({
   publicKey,
   eventId,
@@ -2027,8 +1995,8 @@ var Event = ({
     retry: queryOptions.retry ?? 3,
     retryDelay: queryOptions.retryDelay ?? ((attemptIndex) => Math.min(1e3 * 2 ** attemptIndex, 3e4))
   });
-  const [activePlaylist, setActivePlaylist] = useState6();
-  const [activeVideoId, setActiveVideoId] = useState6();
+  const [activePlaylist, setActivePlaylist] = useState5();
+  const [activeVideoId, setActiveVideoId] = useState5();
   const videoIds = eventData?.videoIds ?? [];
   const {
     data: videosData,
@@ -2044,8 +2012,8 @@ var Event = ({
     retry: queryOptions.retry ?? 3,
     retryDelay: queryOptions.retryDelay ?? ((attemptIndex) => Math.min(1e3 * 2 ** attemptIndex, 3e4))
   });
-  const [loadingApisState, setLoadingApisState] = useState6(true);
-  useEffect9(() => {
+  const [loadingApisState, setLoadingApisState] = useState5(true);
+  useEffect8(() => {
     if (videosData !== void 0) {
       setLoadingApisState(false);
       const videosWithPlaylists = videosData.filter(
@@ -2077,12 +2045,12 @@ var Event = ({
     }
   }, [videosData, eventData]);
   const { t } = useMessages_default(locale);
-  useEffect9(() => {
+  useEffect8(() => {
     if (events?.onEventData && eventData) {
       events.onEventData(eventData);
     }
   }, [eventData, events]);
-  useEffect9(() => {
+  useEffect8(() => {
     if (events?.onVideoData && activeVideoId && videosData) {
       const activeVideo = videosData.find((video) => video.id === activeVideoId);
       if (activeVideo) {
@@ -2090,10 +2058,10 @@ var Event = ({
       }
     }
   }, [activeVideoId, videosData, events]);
-  const [error, setError] = useState6(null);
-  const [loadingPlaylist, setLoadingPlaylist] = useState6(true);
+  const [error, setError] = useState5(null);
+  const [loadingPlaylist, setLoadingPlaylist] = useState5(true);
   const videosDataError = videosData?.some((video) => !!video.error);
-  useEffect9(() => {
+  useEffect8(() => {
     if (eventError || videosError || videosDataError) {
       const errorObj = eventError || videosError || videosData?.find((video) => !!video.error)?.error && new Error(videosData?.find((video) => !!video.error)?.error) || new Error("default");
       setError(errorObj);
@@ -2104,7 +2072,7 @@ var Event = ({
       setError(null);
     }
   }, [eventError, videosError, videosDataError, videosData, events]);
-  useEffect9(() => {
+  useEffect8(() => {
     const eventLoadedWithNoVideos = !isEventLoading && eventData && eventData.videoIds && (!eventData.videoIds || eventData?.videoIds?.length === 0) && !loadingApisState;
     const allApisLoadedWithPotentialVideos = !isEventLoading && !videosIsLoading && eventData && !loadingApisState;
     if (eventLoadedWithNoVideos || allApisLoadedWithPotentialVideos) {
@@ -2114,7 +2082,7 @@ var Event = ({
   if (error) {
     const title = t(error.message)?.length ? t(error.message) : t("DEFAULT_ERROR");
     const description = t(`${error.message}_DESCRIPTION`)?.length ? t(`${error.message}_DESCRIPTION`) : t("DEFAULT_ERROR_DESCRIPTION");
-    return /* @__PURE__ */ jsx8("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx8("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx7("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx7("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx7(
       ErrorScreen,
       {
         title,
@@ -2126,12 +2094,12 @@ var Event = ({
     events.onEmptyPlaylists();
   }
   if (loadingPlaylist) {
-    return /* @__PURE__ */ jsx8("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx8("div", { className: "relative w-full h-full bg-[#151515]", children: /* @__PURE__ */ jsx8(Loading, {}) }) });
+    return /* @__PURE__ */ jsx7("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx7("div", { className: "relative w-full h-full bg-[#151515]", children: /* @__PURE__ */ jsx7(Loading, {}) }) });
   }
   if (activePlaylist && activeVideoId && videosData) {
     const activeVideo = videosData.find((video) => video.id === activeVideoId);
-    return /* @__PURE__ */ jsx8("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs6("div", { className: "relative w-full h-full", children: [
-      /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx7("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs6("div", { className: "relative w-full h-full", children: [
+      /* @__PURE__ */ jsx7(
         Player,
         {
           ...props,
@@ -2141,7 +2109,7 @@ var Event = ({
           containerClassName: "w-full h-full"
         }
       ),
-      !hideTitle && eventData && /* @__PURE__ */ jsx8(
+      !hideTitle && eventData && /* @__PURE__ */ jsx7(
         TitleAndDescription,
         {
           title: eventData.title,
@@ -2153,7 +2121,7 @@ var Event = ({
     ] }) });
   }
   if (eventData) {
-    return /* @__PURE__ */ jsx8("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx8("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx7("div", { className: twMerge4("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx7("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx7(
       PreEvent,
       {
         event: eventData,
@@ -2175,12 +2143,12 @@ function PreEvent({
 }) {
   const date = new Date(event.startTime);
   const now = /* @__PURE__ */ new Date();
-  const [remainingTime, setRemainingTime] = useState6(
+  const [remainingTime, setRemainingTime] = useState5(
     date.getTime() - now.getTime()
   );
   const shouldBeStarted = remainingTime < 0;
   const { t } = useMessages_default(locale);
-  useEffect9(() => {
+  useEffect8(() => {
     const interval = setInterval(() => {
       if (remainingTime < 0) {
         clearInterval(interval);
@@ -2192,7 +2160,7 @@ function PreEvent({
   }, [date, remainingTime]);
   const renderCountdown = useCallback7(() => {
     if (shouldBeStarted) {
-      return /* @__PURE__ */ jsx8("span", { className: "text-base-content text-xl", children: t("EVENT_NOT_STARTED") });
+      return /* @__PURE__ */ jsx7("span", { className: "text-base-content text-xl", children: t("EVENT_NOT_STARTED") });
     }
     const seconds = Math.floor(remainingTime / 1e3) % 60;
     const minutes = Math.floor(remainingTime / 1e3 / 60) % 60;
@@ -2200,7 +2168,7 @@ function PreEvent({
     const days = Math.floor(remainingTime / 1e3 / 60 / 60 / 24);
     return /* @__PURE__ */ jsxs6("div", { className: "grid grid-flow-col gap-5 text-center auto-cols-max", children: [
       /* @__PURE__ */ jsxs6("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx7("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx7(
           "span",
           {
             style: { "--value": days },
@@ -2209,10 +2177,10 @@ function PreEvent({
             children: days?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("DAYS") })
+        /* @__PURE__ */ jsx7("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("DAYS") })
       ] }),
       /* @__PURE__ */ jsxs6("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx7("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx7(
           "span",
           {
             style: { "--value": hours },
@@ -2221,10 +2189,10 @@ function PreEvent({
             children: hours?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("HOURS") })
+        /* @__PURE__ */ jsx7("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("HOURS") })
       ] }),
       /* @__PURE__ */ jsxs6("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx7("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx7(
           "span",
           {
             style: { "--value": minutes },
@@ -2233,10 +2201,10 @@ function PreEvent({
             children: minutes?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("MINUTES") })
+        /* @__PURE__ */ jsx7("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("MINUTES") })
       ] }),
       /* @__PURE__ */ jsxs6("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx7("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx7(
           "span",
           {
             style: { "--value": seconds },
@@ -2245,11 +2213,12 @@ function PreEvent({
             children: seconds?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("SECONDS") })
+        /* @__PURE__ */ jsx7("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("SECONDS") })
       ] })
     ] });
   }, [remainingTime, shouldBeStarted, t]);
-  return /* @__PURE__ */ jsx8(Fragment, { children: event?.posterUrl ? /* @__PURE__ */ jsxs6(Fragment, { children: [
+  console.log("event", event);
+  return /* @__PURE__ */ jsx7(Fragment, { children: event?.posterUrl ? /* @__PURE__ */ jsxs6(Fragment, { children: [
     /* @__PURE__ */ jsxs6(
       "div",
       {
@@ -2260,12 +2229,12 @@ function PreEvent({
           backgroundSize: "cover"
         },
         children: [
-          /* @__PURE__ */ jsx8("div", { className: "absolute inset-0 bg-base-200" }),
-          /* @__PURE__ */ jsx8("div", { className: "relative z-10", children: renderCountdown() })
+          /* @__PURE__ */ jsx7("div", { className: "absolute inset-0 bg-base-200" }),
+          /* @__PURE__ */ jsx7("div", { className: "relative z-10", children: renderCountdown() })
         ]
       }
     ),
-    !hideTitle && /* @__PURE__ */ jsx8(
+    !hideTitle && /* @__PURE__ */ jsx7(
       TitleAndDescription,
       {
         title: event.title,
@@ -2275,20 +2244,17 @@ function PreEvent({
       }
     )
   ] }) : /* @__PURE__ */ jsxs6(Fragment, { children: [
-    /* @__PURE__ */ jsxs6(
+    /* @__PURE__ */ jsx7(
       "div",
       {
         className: "relative overflow-hidden md:rounded-2xl bg-base-200 aspect-video text-base-content flex flex-col justify-center items-center w-full h-full bg-cover bg-center bg-no-repeat",
         style: {
           backgroundImage: backgroundImageUrl ? `url(${backgroundImageUrl})` : ""
         },
-        children: [
-          backgroundImageUrl && /* @__PURE__ */ jsx8("div", { className: "absolute inset-0 bg-black bg-opacity-40" }),
-          /* @__PURE__ */ jsx8("div", { className: "relative z-10", children: renderCountdown() })
-        ]
+        children: /* @__PURE__ */ jsx7("div", { className: "relative z-10", children: renderCountdown() })
       }
     ),
-    !hideTitle && /* @__PURE__ */ jsx8(
+    !hideTitle && /* @__PURE__ */ jsx7(
       TitleAndDescription,
       {
         title: event.title,
@@ -2307,7 +2273,7 @@ var TitleAndDescription = ({
   className
 }) => {
   return /* @__PURE__ */ jsxs6("div", { className: twMerge4("mt-3 mb-6 m-event-details-ctn px-4 text-left w-full", className), children: [
-    /* @__PURE__ */ jsx8("div", { className: "text-base md:text-xl m-event-title text-base-content font-medium", children: title }),
+    /* @__PURE__ */ jsx7("div", { className: "text-base md:text-xl m-event-title text-base-content font-medium", children: title }),
     startTime ? /* @__PURE__ */ jsxs6("div", { className: "text-sm md:text-base text-base-content/70 m-event-start-time", children: [
       new Date(startTime || "").toLocaleDateString(locale || "default", {
         month: "long",
@@ -2321,15 +2287,15 @@ var TitleAndDescription = ({
         minute: "2-digit"
       })
     ] }) : null,
-    description && /* @__PURE__ */ jsx8("div", { className: "text-xs md:text-sm text-base-content/60 uppercase", children: description })
+    description && /* @__PURE__ */ jsx7("div", { className: "text-xs md:text-sm text-base-content/60 uppercase", children: description })
   ] });
 };
 
 // src/CreativeWork.tsx
-import { useEffect as useEffect10, useState as useState7 } from "react";
+import { useEffect as useEffect9, useState as useState6 } from "react";
 import { twMerge as twMerge5 } from "tailwind-merge";
 import { useQuery as useQuery3 } from "@tanstack/react-query";
-import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 var CreativeWork = ({
   publicKey,
   creativeWorkId,
@@ -2359,9 +2325,9 @@ var CreativeWork = ({
     retry: queryOptions.retry ?? 3,
     retryDelay: queryOptions.retryDelay ?? ((attemptIndex) => Math.min(1e3 * 2 ** attemptIndex, 3e4))
   });
-  const [activePlaylist, setActivePlaylist] = useState7();
-  const [activeVideoId, setActiveVideoId] = useState7();
-  const [showCountDown, setShowCountDown] = useState7(false);
+  const [activePlaylist, setActivePlaylist] = useState6();
+  const [activeVideoId, setActiveVideoId] = useState6();
+  const [showCountDown, setShowCountDown] = useState6(false);
   const videoIds = creativeWorkData?.videoIds ?? [];
   const {
     data: videosData,
@@ -2377,8 +2343,8 @@ var CreativeWork = ({
     retry: queryOptions.retry ?? 3,
     retryDelay: queryOptions.retryDelay ?? ((attemptIndex) => Math.min(1e3 * 2 ** attemptIndex, 3e4))
   });
-  const [loadingApisState, setLoadingApisState] = useState7(true);
-  useEffect10(() => {
+  const [loadingApisState, setLoadingApisState] = useState6(true);
+  useEffect9(() => {
     if (videosData !== void 0) {
       setLoadingApisState(false);
       const videosWithPlaylists = videosData.filter(
@@ -2410,7 +2376,7 @@ var CreativeWork = ({
     }
   }, [videosData, creativeWorkData]);
   const { t } = useMessages_default(locale);
-  useEffect10(() => {
+  useEffect9(() => {
     if (events?.onCreativeWorkData && creativeWorkData) {
       events.onCreativeWorkData(creativeWorkData);
     }
@@ -2418,7 +2384,7 @@ var CreativeWork = ({
       setShowCountDown(true);
     }
   }, [creativeWorkData, events]);
-  useEffect10(() => {
+  useEffect9(() => {
     if (events?.onVideoData && activeVideoId && videosData) {
       const activeVideo = videosData.find((video) => video.id === activeVideoId);
       if (activeVideo) {
@@ -2426,9 +2392,9 @@ var CreativeWork = ({
       }
     }
   }, [activeVideoId, videosData, events]);
-  const [error, setError] = useState7(null);
+  const [error, setError] = useState6(null);
   const videosDataError = videosData?.some((video) => !!video.error);
-  useEffect10(() => {
+  useEffect9(() => {
     if (creativeWorkError || videosError || videosDataError) {
       const errorObj = creativeWorkError || videosError || videosData?.find((video) => !!video.error)?.error && new Error(videosData?.find((video) => !!video.error)?.error) || new Error("default");
       setError(errorObj);
@@ -2442,7 +2408,7 @@ var CreativeWork = ({
   if (error) {
     const title = t(error.message)?.length ? t(error.message) : t("DEFAULT_ERROR");
     const description = t(`${error.message}_DESCRIPTION`)?.length ? t(`${error.message}_DESCRIPTION`) : t("DEFAULT_ERROR_DESCRIPTION");
-    return /* @__PURE__ */ jsx9("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx9("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx9(
+    return /* @__PURE__ */ jsx8("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx8("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx8(
       ErrorScreen,
       {
         title,
@@ -2450,8 +2416,8 @@ var CreativeWork = ({
       }
     ) }) });
   }
-  const [loadingPlaylist, setLoadingPlaylist] = useState7(true);
-  useEffect10(() => {
+  const [loadingPlaylist, setLoadingPlaylist] = useState6(true);
+  useEffect9(() => {
     const creativeWorkLoadedWithNoVideos = !isCreativeWorkLoading && creativeWorkData && creativeWorkData.videoIds && creativeWorkData.videoIds.length === 0;
     const creativeWorkLoadedWithNoData = !isCreativeWorkLoading && creativeWorkData && !creativeWorkData.videoIds;
     const isEventsFinished = !videosIsLoading && videosData && videosData.length > 0 && videosData.every((video) => video.playlists && video.playlists.length === 0);
@@ -2472,10 +2438,10 @@ var CreativeWork = ({
     events
   ]);
   if (isCreativeWorkLoading || videosIsLoading || loadingApisState) {
-    return /* @__PURE__ */ jsx9("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx9("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx9(Loading, {}) }) });
+    return /* @__PURE__ */ jsx8("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx8("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx8(Loading, {}) }) });
   }
   if (showCountDown && creativeWorkData) {
-    return /* @__PURE__ */ jsx9("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx9("div", { className: "relative w-full h-full bg-base-200 text-base-content flex justify-center items-center flex-col", children: /* @__PURE__ */ jsx9(
+    return /* @__PURE__ */ jsx8("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsx8("div", { className: "relative w-full h-full bg-base-200 text-base-content flex justify-center items-center flex-col", children: /* @__PURE__ */ jsx8(
       PreCreativeWork,
       {
         creativeWork: creativeWorkData,
@@ -2488,8 +2454,8 @@ var CreativeWork = ({
   }
   if (activeVideoId && activePlaylist && !loadingPlaylist) {
     const activeVideo = videosData?.find((video) => video.id === activeVideoId);
-    return /* @__PURE__ */ jsx9("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs7("div", { className: "relative w-full h-full", children: [
-      /* @__PURE__ */ jsx9(
+    return /* @__PURE__ */ jsx8("div", { className: twMerge5("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs7("div", { className: "relative w-full h-full", children: [
+      /* @__PURE__ */ jsx8(
         Player,
         {
           ...props,
@@ -2501,7 +2467,7 @@ var CreativeWork = ({
           containerClassName: "w-full h-full"
         }
       ),
-      !hideTitle && /* @__PURE__ */ jsx9(
+      !hideTitle && /* @__PURE__ */ jsx8(
         TitleAndDescription2,
         {
           title: creativeWorkData?.title || "",
@@ -2514,7 +2480,7 @@ var CreativeWork = ({
     ] }) });
   }
   if (loadingPlaylist) {
-    return /* @__PURE__ */ jsx9(Loading, {});
+    return /* @__PURE__ */ jsx8(Loading, {});
   }
   return null;
 };
@@ -2527,12 +2493,12 @@ function PreCreativeWork({
 }) {
   const date = new Date(creativeWork.releaseTime);
   const now = /* @__PURE__ */ new Date();
-  const [remainingTime, setRemainingTime] = useState7(
+  const [remainingTime, setRemainingTime] = useState6(
     date.getTime() - now.getTime()
   );
   const shouldBeStarted = remainingTime < 0;
   const { t } = useMessages_default(locale);
-  useEffect10(() => {
+  useEffect9(() => {
     const interval = setInterval(() => {
       if (remainingTime < 0) {
         clearInterval(interval);
@@ -2546,7 +2512,7 @@ function PreCreativeWork({
   }, [date, remainingTime]);
   const renderCountdown = () => {
     if (shouldBeStarted) {
-      return /* @__PURE__ */ jsx9("span", { className: "text-base-content text-xl", children: t("EVENT_NOT_STARTED") });
+      return /* @__PURE__ */ jsx8("span", { className: "text-base-content text-xl", children: t("EVENT_NOT_STARTED") });
     }
     const seconds = Math.floor(remainingTime / 1e3) % 60;
     const minutes = Math.floor(remainingTime / 1e3 / 60) % 60;
@@ -2554,7 +2520,7 @@ function PreCreativeWork({
     const days = Math.floor(remainingTime / 1e3 / 60 / 60 / 24);
     return /* @__PURE__ */ jsxs7("div", { className: "grid grid-flow-col gap-5 text-center auto-cols-max", children: [
       /* @__PURE__ */ jsxs7("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx9("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
           "span",
           {
             style: { "--value": days },
@@ -2563,10 +2529,10 @@ function PreCreativeWork({
             children: days?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx9("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("DAYS") })
+        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("DAYS") })
       ] }),
       /* @__PURE__ */ jsxs7("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx9("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
           "span",
           {
             style: { "--value": hours },
@@ -2575,10 +2541,10 @@ function PreCreativeWork({
             children: hours?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx9("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("HOURS") })
+        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("HOURS") })
       ] }),
       /* @__PURE__ */ jsxs7("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx9("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
           "span",
           {
             style: { "--value": minutes },
@@ -2587,10 +2553,10 @@ function PreCreativeWork({
             children: minutes?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx9("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("MINUTES") })
+        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("MINUTES") })
       ] }),
       /* @__PURE__ */ jsxs7("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx9("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx8("span", { className: "countdown font-mono text-5xl", children: /* @__PURE__ */ jsx8(
           "span",
           {
             style: { "--value": seconds },
@@ -2599,7 +2565,7 @@ function PreCreativeWork({
             children: seconds?.toString()?.padStart(2, "0")
           }
         ) }),
-        /* @__PURE__ */ jsx9("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("SECONDS") })
+        /* @__PURE__ */ jsx8("span", { className: "text-sm uppercase tracking-widest mt-1", children: t("SECONDS") })
       ] })
     ] });
   };
@@ -2612,12 +2578,12 @@ function PreCreativeWork({
           backgroundImage: backgroundImageUrl ? `url(${backgroundImageUrl})` : ""
         },
         children: [
-          backgroundImageUrl && /* @__PURE__ */ jsx9("div", { className: "absolute inset-0 bg-black bg-opacity-40" }),
-          /* @__PURE__ */ jsx9("div", { className: "relative z-10", children: renderCountdown() })
+          backgroundImageUrl && /* @__PURE__ */ jsx8("div", { className: "absolute inset-0 bg-black bg-opacity-40" }),
+          /* @__PURE__ */ jsx8("div", { className: "relative z-10", children: renderCountdown() })
         ]
       }
     ),
-    !hideTitle && /* @__PURE__ */ jsx9(
+    !hideTitle && /* @__PURE__ */ jsx8(
       TitleAndDescription2,
       {
         title: creativeWork.title,
@@ -2636,7 +2602,7 @@ var TitleAndDescription2 = ({
   className
 }) => {
   return /* @__PURE__ */ jsxs7("div", { className: twMerge5("mt-3 mb-6 m-event-details-ctn px-4 text-left w-full", className), children: [
-    /* @__PURE__ */ jsx9("div", { className: "text-base md:text-xl m-event-title text-base-content font-medium", children: title }),
+    /* @__PURE__ */ jsx8("div", { className: "text-base md:text-xl m-event-title text-base-content font-medium", children: title }),
     releaseTime ? /* @__PURE__ */ jsxs7("div", { className: "text-sm md:text-base text-base-content/70 m-event-start-time", children: [
       new Date(releaseTime || "").toLocaleDateString(locale || "default", {
         month: "long",
@@ -2650,27 +2616,13 @@ var TitleAndDescription2 = ({
         minute: "2-digit"
       })
     ] }) : null,
-    description && /* @__PURE__ */ jsx9("div", { className: "text-xs md:text-sm text-base-content/60 uppercase", children: description })
+    description && /* @__PURE__ */ jsx8("div", { className: "text-xs md:text-sm text-base-content/60 uppercase", children: description })
   ] });
 };
 
-// src/ClientSideEvent.tsx
-import React6 from "react";
-import { jsx as jsx10 } from "react/jsx-runtime";
-var ClientSideEvent = (props) => {
-  const [isClient, setIsClient] = React6.useState(false);
-  React6.useEffect(() => {
-    setIsClient(true);
-  }, []);
-  if (!isClient) {
-    return /* @__PURE__ */ jsx10("div", { className: "md:rounded-2xl overflow-hidden aspect-video", children: /* @__PURE__ */ jsx10("div", { className: "relative w-full h-full bg-[#151515] flex items-center justify-center", children: /* @__PURE__ */ jsx10("div", { className: "text-white", children: "Loading..." }) }) });
-  }
-  return /* @__PURE__ */ jsx10(Event, { ...props });
-};
-
 // src/QueryProvider.tsx
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var queryClient = new QueryClient({
   defaultOptions: {
     queries: {
@@ -2684,14 +2636,12 @@ var queryClient = new QueryClient({
   }
 });
 var QueryProvider = ({ children }) => {
-  return /* @__PURE__ */ jsx11(QueryClientProvider, { client: queryClient, children });
+  return /* @__PURE__ */ jsx9(QueryClientProvider, { client: queryClient, children });
 };
 
 // src/index.ts
 var index_default = { Player };
 export {
-  ClientOnlyPlayer,
-  ClientSideEvent,
   CreativeWork,
   CreativeWorksSortDirection,
   Event,