@mottosports/motto-video-player 1.0.1-rc.75 → 1.0.1-rc.76

package/dist/index.mjs

@@ -449,7 +449,7 @@ var supportsWidevinePersistentLicenses = () => {
 import initShakaPlayerMux from "@mux/mux-data-shakaplayer";
 
 // package.json
-var version = "1.0.1-rc.75";
+var version = "1.0.1-rc.76";
 
 // src/utils/licenseCache.ts
 var PERSISTENT_LICENSE_PREFIX = "motto_lic_";
@@ -1987,8 +1987,8 @@ var useAdEvents = (playerRef, handlers) => {
 
 // src/components/Loading.tsx
 import { twMerge } from "tailwind-merge";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var Loading = ({ className }) => /* @__PURE__ */ jsxs3(
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Loading = ({ className }) => /* @__PURE__ */ jsx4(
   "div",
   {
     className: twMerge(
@@ -1996,38 +1996,35 @@ var Loading = ({ className }) => /* @__PURE__ */ jsxs3(
       className
     ),
     role: "status",
-    children: [
-      /* @__PURE__ */ jsx4("div", { className: "shaka-spinner-container flex justify-center items-center", children: /* @__PURE__ */ jsx4(
-        "svg",
-        {
-          className: "shaka-spinner-svg animate-spin h-12 w-12",
-          viewBox: "0 0 64 64",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /* @__PURE__ */ jsx4(
-            "circle",
-            {
-              className: "shaka-spinner-path",
-              cx: "32",
-              cy: "32",
-              r: "28",
-              strokeWidth: "4",
-              strokeLinecap: "round",
-              stroke: "currentColor",
-              fill: "none",
-              strokeDasharray: "176",
-              strokeDashoffset: "120"
-            }
-          )
-        }
-      ) }),
-      /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Loading..." })
-    ]
+    children: /* @__PURE__ */ jsx4("div", { className: " flex justify-center items-center", children: /* @__PURE__ */ jsx4(
+      "svg",
+      {
+        className: "shaka-spinner-svg animate-spin h-12 w-12",
+        viewBox: "0 0 64 64",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /* @__PURE__ */ jsx4(
+          "circle",
+          {
+            className: "shaka-spinner-path",
+            cx: "32",
+            cy: "32",
+            r: "28",
+            strokeWidth: "4",
+            strokeLinecap: "round",
+            stroke: "currentColor",
+            fill: "none",
+            strokeDasharray: "176",
+            strokeDashoffset: "120"
+          }
+        )
+      }
+    ) })
   }
 );
 
 // src/components/ErrorScreen.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var ErrorScreen = ({ title, description }) => /* @__PURE__ */ jsx5("div", { className: "w-full h-full md:rounded-2xl! aspect-video bg-black", children: /* @__PURE__ */ jsxs4("div", { className: "bg-[#151515] text-white w-full h-full flex justify-stretch items-center", children: [
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+var ErrorScreen = ({ title, description }) => /* @__PURE__ */ jsx5("div", { className: "w-full h-full md:rounded-2xl! aspect-video bg-black flex", children: /* @__PURE__ */ jsxs3("div", { className: "bg-[#151515] text-white w-full h-full flex justify-center items-center", children: [
   /* @__PURE__ */ jsx5(
     "svg",
     {
@@ -2048,7 +2045,7 @@ var ErrorScreen = ({ title, description }) => /* @__PURE__ */ jsx5("div", { clas
       )
     }
   ),
-  /* @__PURE__ */ jsxs4("div", { children: [
+  /* @__PURE__ */ jsxs3("div", { children: [
     /* @__PURE__ */ jsx5("h3", { className: "text-2xl mb-2", children: title || "Playback Error" }),
     /* @__PURE__ */ jsx5("div", { className: "text-lg", children: description || "Unable to play the video. Please try again later." })
   ] })
@@ -2059,7 +2056,7 @@ import { jsx as jsx6 } from "react/jsx-runtime";
 var Title = ({ title }) => /* @__PURE__ */ jsx6("div", { className: "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 to-transparent p-4", children: /* @__PURE__ */ jsx6("h2", { className: "text-white text-xl font-semibold", children: title }) });
 
 // src/components/LiveBadge.tsx
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 var LiveBadge = ({
   isVisible,
   position = "top-right",
@@ -2091,7 +2088,7 @@ var LiveBadge = ({
         ${className}
       `,
       style,
-      children: /* @__PURE__ */ jsxs5("span", { className: "flex items-center gap-1", children: [
+      children: /* @__PURE__ */ jsxs4("span", { className: "flex items-center gap-1", children: [
         /* @__PURE__ */ jsx7("span", { className: "w-2 h-2 bg-white rounded-full animate-pulse" }),
         text
       ] })
@@ -2176,7 +2173,7 @@ async function waitForGlobals(globalNames, timeout = 5e3) {
 }
 
 // src/Player.tsx
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 var Player = forwardRef(
   ({
     src,
@@ -2517,7 +2514,7 @@ var Player = forwardRef(
     const videoStyle = isResponsive ? {} : { width, height };
     const filteredVideoProps = { ...videoProps };
     delete filteredVideoProps.controls;
-    return /* @__PURE__ */ jsxs6(
+    return /* @__PURE__ */ jsxs5(
       "div",
       {
         ref: containerRef,
@@ -3018,7 +3015,7 @@ var useMessages = (locale) => {
 var useMessages_default = useMessages;
 
 // src/Video.tsx
-import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
 var Video = ({
   videoId,
   publicKey,
@@ -3076,7 +3073,7 @@ var Video = ({
     }
     const title = t(errorKey) || t("DEFAULT_ERROR");
     const description = t(`${errorKey}_DESCRIPTION`) || t("DEFAULT_ERROR_DESCRIPTION");
-    return /* @__PURE__ */ jsx9("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs7("div", { className: "relative w-full h-full", children: [
+    return /* @__PURE__ */ jsx9("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs6("div", { className: "relative w-full h-full", children: [
       /* @__PURE__ */ jsx9(
         ErrorScreen,
         {
@@ -3088,7 +3085,7 @@ var Video = ({
     ] }) });
   }
   if (!activePlaylist || !activePlaylistHasUrl) {
-    return /* @__PURE__ */ jsx9("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs7("div", { className: "relative w-full h-full bg-[#151515]", children: [
+    return /* @__PURE__ */ jsx9("div", { className: twMerge3("md:rounded-2xl overflow-hidden aspect-video", className), children: /* @__PURE__ */ jsxs6("div", { className: "relative w-full h-full bg-[#151515]", children: [
       /* @__PURE__ */ jsx9(Title, { title: video?.name || "" }),
       children
     ] }) });
@@ -3115,7 +3112,7 @@ var Video = ({
 import { useCallback as useCallback10, useEffect as useEffect8, useState as useState6 } from "react";
 import { twMerge as twMerge4 } from "tailwind-merge";
 import { useQuery as useQuery2 } from "@tanstack/react-query";
-import { Fragment, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 var Event = ({
   publicKey,
   eventId,
@@ -3267,7 +3264,7 @@ var Event = ({
   if (activePlaylist && activeVideoId && videosData) {
     const activeVideo = videosData.find((video) => video.id === activeVideoId);
     console.log("activeVideo?.ad?.adTagUrl", activeVideo?.ad?.adTagUrl);
-    return /* @__PURE__ */ jsxs8("div", { className: twMerge4("", className), children: [
+    return /* @__PURE__ */ jsxs7("div", { className: twMerge4("", className), children: [
       /* @__PURE__ */ jsx10("div", { className: "relative w-full h-full", children: /* @__PURE__ */ jsx10(
         Player,
         {
@@ -3340,9 +3337,9 @@ function PreEvent({
     const minutes = Math.floor(remainingTime / 1e3 / 60) % 60;
     const hours = Math.floor(remainingTime / 1e3 / 60 / 60) % 24;
     const days = Math.floor(remainingTime / 1e3 / 60 / 60 / 24);
-    return /* @__PURE__ */ jsxs8("div", { className: "grid grid-flow-col gap-1 md:gap-5 text-center auto-cols-max", children: [
-      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
-        /* @__PURE__ */ jsx10("span", { className: "font-mono text-lg md:text-5xl leading-none", children: /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsxs7("div", { className: "grid grid-flow-col gap-1 md: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__ */ jsx10("span", { className: "font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx10(
           "span",
           {
             "aria-live": "polite",
@@ -3352,7 +3349,7 @@ function PreEvent({
         ) }),
         /* @__PURE__ */ jsx10("span", { className: "text-xs uppercase tracking-widest mt-1", children: t("DAYS") })
       ] }),
-      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
+      /* @__PURE__ */ jsxs7("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
         /* @__PURE__ */ jsx10("span", { className: "countdown font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx10(
           "span",
           {
@@ -3364,7 +3361,7 @@ function PreEvent({
         ) }),
         /* @__PURE__ */ jsx10("span", { className: "text-xs uppercase tracking-widest mt-1", children: t("HOURS") })
       ] }),
-      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
+      /* @__PURE__ */ jsxs7("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
         /* @__PURE__ */ jsx10("span", { className: "countdown font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx10(
           "span",
           {
@@ -3376,7 +3373,7 @@ function PreEvent({
         ) }),
         /* @__PURE__ */ jsx10("span", { className: "text-xs uppercase tracking-widest mt-1", children: t("MINUTES") })
       ] }),
-      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
+      /* @__PURE__ */ jsxs7("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
         /* @__PURE__ */ jsx10("span", { className: "countdown font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx10(
           "span",
           {
@@ -3390,7 +3387,7 @@ function PreEvent({
       ] })
     ] });
   }, [remainingTime, shouldBeStarted, t]);
-  return /* @__PURE__ */ jsx10(Fragment, { children: event?.posterUrl ? /* @__PURE__ */ jsxs8(Fragment, { children: [
+  return /* @__PURE__ */ jsx10(Fragment, { children: event?.posterUrl ? /* @__PURE__ */ jsxs7(Fragment, { children: [
     /* @__PURE__ */ jsx10(
       "div",
       {
@@ -3412,7 +3409,7 @@ function PreEvent({
         locale
       }
     )
-  ] }) : /* @__PURE__ */ jsxs8(Fragment, { children: [
+  ] }) : /* @__PURE__ */ jsxs7(Fragment, { children: [
     /* @__PURE__ */ jsx10(
       "div",
       {
@@ -3441,9 +3438,9 @@ var TitleAndDescription = ({
   locale = "en",
   className
 }) => {
-  return /* @__PURE__ */ jsxs8("div", { className: twMerge4("mt-3 mb-6 m-event-details-ctn px-4 text-left w-full", className), children: [
+  return /* @__PURE__ */ jsxs7("div", { className: twMerge4("mt-3 mb-6 m-event-details-ctn px-4 text-left w-full", className), children: [
     /* @__PURE__ */ jsx10("div", { className: "text-base md:text-xl m-event-title text-base-content font-medium", children: title }),
-    startTime ? /* @__PURE__ */ jsxs8("div", { className: "text-xs md:text-base text-base-content/70 m-event-start-time", children: [
+    startTime ? /* @__PURE__ */ jsxs7("div", { className: "text-xs md:text-base text-base-content/70 m-event-start-time", children: [
       new Date(startTime || "").toLocaleDateString(locale || "default", {
         month: "long",
         year: "numeric",
@@ -3464,7 +3461,7 @@ var TitleAndDescription = ({
 import { useEffect as useEffect9, useState as useState7 } from "react";
 import { twMerge as twMerge5 } from "tailwind-merge";
 import { useQuery as useQuery3 } from "@tanstack/react-query";
-import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
 var CreativeWork = ({
   publicKey,
   creativeWorkId,
@@ -3626,7 +3623,7 @@ var CreativeWork = ({
   }
   if (activeVideoId && activePlaylist && !loadingPlaylist) {
     const activeVideo = videosData?.find((video) => video.id === activeVideoId);
-    return /* @__PURE__ */ jsx11("div", { className: twMerge5("", className), children: /* @__PURE__ */ jsxs9("div", { className: "relative w-full h-full", children: [
+    return /* @__PURE__ */ jsx11("div", { className: twMerge5("", className), children: /* @__PURE__ */ jsxs8("div", { className: "relative w-full h-full", children: [
       /* @__PURE__ */ jsx11(
         Player,
         {
@@ -3695,8 +3692,8 @@ function PreCreativeWork({
     const minutes = Math.floor(remainingTime / 1e3 / 60) % 60;
     const hours = Math.floor(remainingTime / 1e3 / 60 / 60) % 24;
     const days = Math.floor(remainingTime / 1e3 / 60 / 60 / 24);
-    return /* @__PURE__ */ jsxs9("div", { className: "grid grid-flow-col md:gap-5 gap-1 text-center auto-cols-max", children: [
-      /* @__PURE__ */ jsxs9("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
+    return /* @__PURE__ */ jsxs8("div", { className: "grid grid-flow-col md:gap-5 gap-1 text-center auto-cols-max", children: [
+      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
         /* @__PURE__ */ jsx11("span", { className: "font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx11(
           "span",
           {
@@ -3707,7 +3704,7 @@ function PreCreativeWork({
         ) }),
         /* @__PURE__ */ jsx11("span", { className: "text-xs uppercase tracking-widest mt-1", children: t("DAYS") })
       ] }),
-      /* @__PURE__ */ jsxs9("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
+      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
         /* @__PURE__ */ jsx11("span", { className: "countdown font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx11(
           "span",
           {
@@ -3719,7 +3716,7 @@ function PreCreativeWork({
         ) }),
         /* @__PURE__ */ jsx11("span", { className: "text-xs uppercase tracking-widest mt-1", children: t("HOURS") })
       ] }),
-      /* @__PURE__ */ jsxs9("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
+      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
         /* @__PURE__ */ jsx11("span", { className: "countdown font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx11(
           "span",
           {
@@ -3731,7 +3728,7 @@ function PreCreativeWork({
         ) }),
         /* @__PURE__ */ jsx11("span", { className: "text-xs uppercase tracking-widest mt-1", children: t("MINUTES") })
       ] }),
-      /* @__PURE__ */ jsxs9("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
+      /* @__PURE__ */ jsxs8("div", { className: "flex flex-col p-2 bg-neutral rounded-box text-neutral-content", children: [
         /* @__PURE__ */ jsx11("span", { className: "countdown font-mono text-lg md:text-5xl", children: /* @__PURE__ */ jsx11(
           "span",
           {
@@ -3745,8 +3742,8 @@ function PreCreativeWork({
       ] })
     ] });
   };
-  return /* @__PURE__ */ jsxs9(Fragment2, { children: [
-    /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs8(Fragment2, { children: [
+    /* @__PURE__ */ jsxs8(
       "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",
@@ -3777,9 +3774,9 @@ var TitleAndDescription2 = ({
   locale = "en",
   className
 }) => {
-  return /* @__PURE__ */ jsxs9("div", { className: twMerge5("mt-3 mb-6 m-event-details-ctn px-4 text-left w-full", className), children: [
+  return /* @__PURE__ */ jsxs8("div", { className: twMerge5("mt-3 mb-6 m-event-details-ctn px-4 text-left w-full", className), children: [
     /* @__PURE__ */ jsx11("div", { className: "text-base md:text-xl m-event-title text-base-content font-medium", children: title }),
-    releaseTime ? /* @__PURE__ */ jsxs9("div", { className: "text-sm md:text-base text-base-content/70 m-event-start-time", children: [
+    releaseTime ? /* @__PURE__ */ jsxs8("div", { className: "text-sm md:text-base text-base-content/70 m-event-start-time", children: [
       new Date(releaseTime || "").toLocaleDateString(locale || "default", {
         month: "long",
         year: "numeric",