From 918ea79ee9a6e24660c38d3fe87558aa26221210 Mon Sep 17 00:00:00 2001
From: Jonathan Langton <jonathan@langtons.me>
Date: Tue, 20 May 2025 15:51:28 +0100
Subject: [PATCH] feat: allow configurable fetchPriority for poster image

---
 src/components/players/background-player.tsx | 3 ++-
 src/components/players/default-player.tsx    | 2 ++
 src/components/types.ts                      | 5 +++++
 3 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/players/background-player.tsx b/src/components/players/background-player.tsx
index 9c8e79e..e7816f4 100644
--- a/src/components/players/background-player.tsx
+++ b/src/components/players/background-player.tsx
@@ -10,7 +10,7 @@ import type { MediaProps } from './media/index.js';
 
 const BackgroundPlayer = forwardRef<HTMLVideoElement, Omit<MediaProps, 'ref'> & PlayerProps>(
   (allProps, forwardedRef) => {
-    let { style, className, children, asset, poster, blurDataURL, onPlaying, onLoadStart, ...rest } = allProps;
+    let { style, className, children, asset, poster, posterFetchPriority="auto", blurDataURL, onPlaying, onLoadStart, ...rest } = allProps;
 
     const slottedPoster = Children.toArray(children).find((child) => {
       return typeof child === 'object' && 'type' in child && (child.props as any).slot === 'poster';
@@ -137,6 +137,7 @@ const BackgroundPlayer = forwardRef<HTMLVideoElement, Omit<MediaProps, 'ref'> &
                 hidden={posterHidden}
                 decoding="async"
                 aria-hidden="true"
+                fetchPriority={posterFetchPriority}
               />
             )}
             <div className="next-video-bg-text">{children}</div>
diff --git a/src/components/players/default-player.tsx b/src/components/players/default-player.tsx
index e157a13..b7044e3 100644
--- a/src/components/players/default-player.tsx
+++ b/src/components/players/default-player.tsx
@@ -16,6 +16,7 @@ const DefaultPlayer = forwardRef<HTMLVideoElement, Omit<MediaProps, 'ref'> & Pla
     asset,
     controls = true,
     poster,
+    posterFetchPriority = 'auto',
     blurDataURL,
     theme: Theme = Sutro,
     ...rest
@@ -96,6 +97,7 @@ const DefaultPlayer = forwardRef<HTMLVideoElement, Omit<MediaProps, 'ref'> & Pla
           style={imgStyleProps}
           decoding="async"
           aria-hidden="true"
+          fetchPriority={posterFetchPriority}
         />
       );
       poster = '';
diff --git a/src/components/types.ts b/src/components/types.ts
index 1f50847..1e4a8b9 100644
--- a/src/components/types.ts
+++ b/src/components/types.ts
@@ -132,6 +132,11 @@ export type PlayerProps = {
    */
   poster?: StaticImageData | string;
 
+  /**
+   * The poster image fetch priority for the video.
+   */
+  posterFetchPriority?: 'high' | 'low' | 'auto';
+
   /**
    * Set a manual data URL to be used as a placeholder image before the poster image successfully loads.
    * For imported videos this will be automatically generated.