feat(react-dom): add options to preload

Author: r17x

src/ReactDOM.re

@@ -478,6 +478,61 @@ external unmountComponentAtNode: Dom.element => unit =
 external flushSync: (unit => unit) => unit = "flushSync";
 
 module Experimental = {
+  [@deriving jsProperties]
+  type preloadOptions = {
+    [@mel.as "as"] [@mel.optional]
+    _as: option([ 
+      | `audio
+      | `document
+      | `embed
+      | `fetch
+      | `font
+      | `image
+      | [@mel.as "object"] `object_
+      | `script
+      | `style
+      | `track
+      | `video
+      | `worker 
+    ]),
+    [@mel.optional]
+    fetchPriority: option([ `auto | `high | `low ]),
+    [@mel.optional]
+    referrerPolicy: option([ 
+      | [@mel.as "no-referrer"] `noReferrer 
+      | [@mel.as "no-referrer-when-downgrade"] `noReferrerWhenDowngrade
+      | [@mel.as "origin"] `origin
+      | [@mel.as "origin-when-cross-origin"] `originWhenCrossOrigin
+      | [@mel.as "unsafe-url"] `unsafeUrl
+    ]),
+    [@mel.optional]
+    imageSrcSet: option(string),
+    [@mel.optional]
+    imageSizes: option(string),
+    [@mel.optional]
+    crossOrigin: option(string),
+    [@mel.optional]
+    integrity: option(string),
+    [@mel.optional]
+    nonce: option(string),
+  };
+
+  [@deriving jsProperties]
+  type preinitOptions = {
+    [@mel.as "as"] [@mel.optional]
+    _as: option([ | `script | `style ]),
+    [@mel.optional]
+    fetchPriority: option([ `auto | `high | `low ]),
+    [@mel.optional]
+    precedence: option([ `reset | `low | `medium | `high ]),
+    [@mel.optional]
+    crossOrigin: option(string),
+    [@mel.optional]
+    integrity: option(string),
+    [@mel.optional]
+    nonce: option(string),
+  };
+
   [@deriving jsProperties]
   type preinitOptions = {
     [@mel.as "as"] [@mel.optional]
@@ -515,7 +570,7 @@ module Experimental = {
   [@mel.module "react-dom"]
   external preinitModule: (string, ~options: preOptions=?, unit) => unit = "preinitModule";
   [@mel.module "react-dom"]
-  external preload: string => unit = "preload";
+  external preload: (string, ~options: preloadOptions=?, unit) => unit = "preload";
   [@mel.module "react-dom"]
   external preloadModule: (string, ~options: preOptions=?, unit) => unit = "preloadModule";
 } 

src/ReactDOM.rei

@@ -480,6 +480,77 @@ external flushSync: (unit => unit) => unit = "flushSync";
 
 module Experimental: {
   /* This module is used to bind to APIs for future versions of ReactDOM. There is no guarantee of backwards compatibility or stability. */
+  /*
+     preload options.
+     https://react.dev/reference/react-dom/preload#parameters
+   */
+  [@deriving jsProperties]
+  type preloadOptions = {
+    /* Its possible values are audio, document, embed, fetch, font, image, object, script, style, track, video, worker. */
+    [@mel.as "as"] [@mel.optional]
+    _as: option([ 
+      | `audio
+      | `document
+      | `embed
+      | `fetch
+      | `font
+      | `image
+      | [@mel.as "object"] `object_
+      | `script
+      | `style
+      | `track
+      | `video
+      | `worker 
+    ]),
+    /*
+        Suggests a relative priority for fetching the resource.
+        The possible values are auto (the default), high, and low.
+     */
+    [@mel.optional]
+    fetchPriority: option([ `auto | `high | `low ]),
+    /*
+        The Referrer header to send when fetching.
+        Its possible values are no-referrer-when-downgrade (the default), no-referrer, origin, origin-when-cross-origin, and unsafe-url.
+     */
+    [@mel.optional]
+    referrerPolicy: option([ 
+      | [@mel.as "no-referrer"] `noReferrer 
+      | [@mel.as "no-referrer-when-downgrade"] `noReferrerWhenDowngrade
+      | [@mel.as "origin"] `origin
+      | [@mel.as "origin-when-cross-origin"] `originWhenCrossOrigin
+      | [@mel.as "unsafe-url"] `unsafeUrl
+    ]),
+    /* 
+        For use only with as: "image". Specifies the source set of the image.
+        https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images
+     */
+    [@mel.optional]
+    imageSrcSet: option(string),
+    /* 
+        For use only with as: "image". Specifies the source sizes of the image.
+        https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images
+     */
+    [@mel.optional]
+    imageSizes: option(string),
+    /*
+        a required string. It must be "anonymous", "use-credentials", and "".
+        https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin
+     */
+    [@mel.optional]
+    crossOrigin: option(string),
+    /*
+        A cryptographic hash of the module, to verify its authenticity.
+        https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity
+     */
+    [@mel.optional]
+    integrity: option(string),
+    /*
+        A cryptographic nonce to allow the module when using a strict Content Security Policy.
+        https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce
+     */
+    [@mel.optional]
+    nonce: option(string),
+  };
 
   /*
      preinit options.
@@ -562,7 +633,7 @@ module Experimental: {
   [@mel.module "react-dom"]
   external preinitModule: (string, ~options: preOptions=?, unit) => unit = "preinitModule";
   [@mel.module "react-dom"]
-  external preload: string => unit = "preload";
+  external preload: (string, ~options: preloadOptions=?, unit) => unit = "preload";
   [@mel.module "react-dom"]
   external preloadModule: (string, ~options: preOptions=?, unit) => unit = "preloadModule";
 }