@hyperstream/videoplayer 0.1.7 → 0.1.8

package/dist/index.mjs

@@ -15177,6 +15177,7 @@ var init_SettingsMenu = __esm({
             absolute z-30 w-56 max-h-80 overflow-y-auto bg-black/90 border border-white/20 backdrop-blur-sm rounded-lg shadow-2xl
             ${isFullscreen ? "bottom-20 right-4" : "bottom-16 right-4"}
           `,
+          onClick: (e) => e.stopPropagation(),
           children: menuLevel === "main" ? (
             // Main Menu
             /* @__PURE__ */ jsxs11("div", { className: "p-2", children: [
@@ -15438,6 +15439,7 @@ var init_DockPanel = __esm({
             border-l border-white/20 shadow-2xl flex flex-col z-20
             ${containerWidth < 768 ? "w-full" : containerWidth < 1024 ? "w-[50%]" : "w-[30%]"}
           `,
+          onClick: (e) => e.stopPropagation(),
           style: {
             height: showControls ? `calc(100% - ${containerWidth < 640 ? "60px" : "80px"})` : "100%"
           },
@@ -15795,6 +15797,7 @@ var init_PopupOverlay = __esm({
             activePopup,
             ((_g = activePopupStyles.overlay) == null ? void 0 : _g.padding) || "12px"
           )),
+          onClick: (e) => e.stopPropagation(),
           children: /* @__PURE__ */ jsxs13(
             motion.div,
             __spreadProps(__spreadValues({}, getPopupAnimationConfig(activePopup)), {
@@ -18109,6 +18112,7 @@ var ErrorDisplay = memo3(function ErrorDisplay2({
       animate: { opacity: 1 },
       exit: { opacity: 0 },
       className: "absolute inset-0 flex items-center justify-center z-30 bg-black/90",
+      onClick: (e) => e.stopPropagation(),
       children: /* @__PURE__ */ jsxs3("div", { className: "text-center px-6 max-w-md", children: [
         /* @__PURE__ */ jsx9(
           "div",
@@ -18243,7 +18247,10 @@ var PosterOverlay = memo4(function PosterOverlay2({
       transition: { duration: 0.3 },
       className: "absolute inset-0 z-50 cursor-pointer",
       style: { backgroundColor: "black" },
-      onClick: onPlay,
+      onClick: (e) => {
+        e.stopPropagation();
+        onPlay();
+      },
       children: [
         /* @__PURE__ */ jsx11(
           "img",
@@ -19563,6 +19570,7 @@ function ControlBar({
       exit: { opacity: 0, y: 20 },
       transition: { duration: 0.25, ease: "easeOut" },
       className: "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/95 via-black/70 to-transparent backdrop-blur-md",
+      onClick: (e) => e.stopPropagation(),
       style: {
         padding: containerWidth < 400 ? "8px" : containerWidth < 640 ? "12px" : "16px"
       },
@@ -20113,6 +20121,7 @@ var PasswordDialog = memo6(function PasswordDialog2({
           animate: { scale: 1, opacity: 1 },
           exit: { scale: 0.9, opacity: 0 },
           className: "w-full max-w-sm mx-4",
+          onClick: (e) => e.stopPropagation(),
           children: /* @__PURE__ */ jsxs9("div", { className: "bg-gray-900/95 backdrop-blur-md rounded-xl shadow-2xl border border-white/10 p-6", children: [
             /* @__PURE__ */ jsxs9("div", { className: "text-center mb-6", children: [
               /* @__PURE__ */ jsx23(
@@ -22020,7 +22029,7 @@ function UpNextOverlay({
   const maxSeconds = 10;
   const percentage = Math.max(0, Math.min(100, displaySeconds / maxSeconds * 100));
   const strokeDasharray = `${percentage} 100`;
-  return /* @__PURE__ */ jsx25("div", { className: "absolute right-6 bottom-[80px] z-[60] animate-in fade-in slide-in-from-bottom-4 duration-300", children: /* @__PURE__ */ jsxs10("div", { className: "bg-black/80 backdrop-blur-md border border-white/10 rounded-xl p-4 shadow-2xl flex items-center gap-4 w-[320px] transition-all hover:bg-black/90", children: [
+  return /* @__PURE__ */ jsx25("div", { className: "absolute right-6 bottom-[80px] z-[60] animate-in fade-in slide-in-from-bottom-4 duration-300", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsxs10("div", { className: "bg-black/80 backdrop-blur-md border border-white/10 rounded-xl p-4 shadow-2xl flex items-center gap-4 w-[320px] transition-all hover:bg-black/90", children: [
     /* @__PURE__ */ jsxs10("div", { className: "relative w-16 h-16 shrink-0 flex items-center justify-center rounded-lg bg-white/5 overflow-hidden group cursor-pointer", onClick: onPlayNext, children: [
       thumbnailUrl ? /* @__PURE__ */ jsx25("img", { src: thumbnailUrl, alt: nextVideoTitle, className: "w-full h-full object-cover opacity-60 group-hover:opacity-40 transition-opacity" }) : /* @__PURE__ */ jsx25("div", { className: "absolute inset-0 bg-white/5 group-hover:bg-white/10 transition-colors" }),
       /* @__PURE__ */ jsxs10("svg", { className: "absolute inset-0 w-full h-full -rotate-90 pointer-events-none", viewBox: "0 0 36 36", children: [
@@ -26322,7 +26331,8 @@ function SimpleVideoPlayer({
     if (!showControls) {
       viewDispatch(viewActions.setShowControls(true));
     }
-  }, [showControls]);
+    togglePlay();
+  }, [showControls, togglePlay]);
   useKeyboardShortcuts({
     containerRef,
     togglePlay,