payload-live-preview 2.0.6 → 2.1.0

package/dist/adapters/nextjs/index.d.ts

@@ -1,5 +1,5 @@
-import { P as PreviewAdapterOptions } from '../../options-uHKrDM2U.js';
-import { F as FragmentEndpointOptions$1, a as FragmentRegistry$1, b as FragmentRegistryEntry$1, c as FragmentRenderer$1, d as FragmentRenderInput } from '../../fragment-endpoint-DATKU183.js';
+import { P as PreviewAdapterOptions } from '../../options-Cm8fC7dj.js';
+import { F as FragmentEndpointOptions$1, a as FragmentRegistry$1, b as FragmentRegistryEntry$1, c as FragmentRenderer$1, d as FragmentRenderInput } from '../../fragment-endpoint-B2qcRw5T.js';
 
 /**
  * Next.js adapter. The script goes into the root layout, because
@@ -203,22 +203,26 @@ declare function createRuntimeAssetRoute(options?: LivePreviewNextOptions): Runt
  * import { LivePreviewScript } from 'payload-live-preview/nextjs';
  *
  * export default async function RootLayout({ children }: { children: ReactNode }) {
+ *   const livePreview = await LivePreviewScript({
+ *     request: new Request(SITE_URL, { headers: await headers() }),
+ *     inject: 'always',
+ *     allowedOrigins: [ADMIN_URL],
+ *     authorizePreview: authorize,
+ *   });
  *   return (
  *     <html lang="en">
- *       <head>
- *         <LivePreviewScript
- *           request={new Request(SITE_URL, { headers: await headers() })}
- *           inject="always"
- *           allowedOrigins={[ADMIN_URL]}
- *           authorizePreview={authorize}
- *         />
- *       </head>
+ *       <head>{livePreview}</head>
  *       <body>{children}</body>
  *     </html>
  *   );
  * }
  * ```
  *
+ * It is awaited rather than rendered as `<LivePreviewScript />`: an element of
+ * an async server component arrives in React's stream after the page, and the
+ * React that Next.js 15.5 ships begins to hydrate `<head>` before it has, which
+ * it reports as error #418 (docs/nextjs.md, "Await it in the layout").
+ *
  * A `Request` rather than a shape of our own: it is what `authorizePreview`
  * and `shouldInject` already receive from the middleware, so one options object
  * serves both entry points and neither hook has to be written twice.
@@ -255,8 +259,9 @@ interface LivePreviewScriptElement {
     readonly key: null;
 }
 /**
- * Renders the runtime for an authorized preview and nothing at all for
- * everyone else. Mount it in the layout or page that owns `<head>`.
+ * Resolves to the runtime's `<script>` element for an authorized preview and to
+ * `null` for everyone else. Await it in the layout or page that owns `<head>`
+ * and render the result there.
  */
 declare function LivePreviewScript(props: LivePreviewScriptComponentProps): Promise<LivePreviewScriptElement | null>;