@plasmicapp/nextjs-app-router 1.0.8 → 1.0.10

package/README.codegen.md

@@ -0,0 +1,153 @@
+This package provides helpers for doing extractPlasmicQueryData() with Next.js App Router.
+
+We normally use react-ssr-prepass to fake-render a React tree to gather data requirements. We can't do so in RSC mode, because all the client components are imported as placeholders, so we cannot fake-render them.
+
+The idea here is to use the dev server's SSR instead! At SSR time (instead of RSC time), we do have access to imported client components. So... we could do pre-rendering there, gather the data needs, and respond with them. At RSC time, we hit the SSR endpoint, and parse out the data needs.
+
+So...
+
+1. First update you `plasmic.json` to use the `app` directory for pages and run `plasmic sync` again to automatically move the pages there:
+
+```
+  "nextjsConfig": {
+    "pagesDir": "../app"
+  },
+```
+
+2. Update `app/MyPage/page.tsx` to conditionally wrap the page contents inside `<ExtractPlasmicQueryData>` to extract the query data. It would look something like:
+
+```
+// app/page.tsx
+
+import * as React from "react";
+import { PageParamsProvider as PageParamsProvider__ } from "@plasmicapp/react-web/lib/host";
+import { PlasmicHomepage } from "../components/plasmic/my-plasmic-project/PlasmicHomepage";
+import { PlasmicQueryDataProvider } from "@plasmicapp/react-web/lib/query";
+import { ExtractPlasmicQueryData } from "@plasmicapp/nextjs-app-router";
+import { fetchExtractedQueryData } from "@plasmicapp/nextjs-app-router/react-server";
+
+// (Optional: In case you project uses Global Contexts)
+import GlobalContextsProvider from "../components/plasmic/my-plasmic-project/PlasmicGlobalContextsProvider";
+
+async function Homepage({
+  searchParams,
+}: {
+  searchParams?: Record<string, string | string[]>;
+}) {
+  return withExtractPlasmicQueryData(
+    <GlobalContextsProvider>
+      <PageParamsProvider__ route={"/"} query={searchParams}>
+        <PlasmicHomepage />
+      </PageParamsProvider__>
+    </GlobalContextsProvider>,
+    {
+      pathname: "/",
+      searchParams,
+    }
+  );
+}
+
+export default Homepage;
+
+/**
+ * Helper function to extract Plasmic data.
+ *
+ * Given React element for your page and current pathname + search
+ * params, returns:
+ * - The extracted query data, if `plasmicSsr` search param is set
+ * - A copy of the page element wraped within PlasmicQueryDataProvider to provide the extracted query data, otherwise
+ */
+async function withExtractPlasmicQueryData(
+  pageRootElt: React.ReactElement,
+  {
+    pathname,
+    searchParams,
+  }: {
+    pathname: string;
+    searchParams: Record<string, string | string[]> | undefined;
+  }
+) {
+  const isPlasmicSsr =
+    !!searchParams?.["plasmicSsr"] && searchParams?.["plasmicSsr"] !== "false";
+
+  // If `plasmicSsr` search param is set, just wrap the page inside
+  // <ExtractPlasmicQueryData>
+  if (isPlasmicSsr) {
+    return <ExtractPlasmicQueryData>{pageRootElt}</ExtractPlasmicQueryData>;
+  }
+
+  // Otherwise, fetch the same endpoint, but setting `plasmicSsr` to extract the
+  // query data.
+  const prepassHost =
+    process.env.PLASMIC_PREPASS_HOST ??
+    (process.env.VERCEL_URL && `https://${process.env.VERCEL_URL}`) ??
+    `http://localhost:${process.env.PORT ?? 3000}`;
+
+  // Build a copy of the search params
+  const newSearchParams = new URLSearchParams(
+    Object.entries(searchParams ?? {}).flatMap(([key, values]) =>
+      Array.isArray(values) ? values.map((v) => [key, v]) : [[key, values]]
+    )
+  );
+
+  // Set `plasmicSsr` search param to indicate you are using this endpoint
+  // to extract query data.
+  newSearchParams.set("plasmicSsr", "true");
+
+  if (process.env.VERCEL_AUTOMATION_BYPASS_SECRET) {
+    // If protection bypass is enabled, use it to ensure fetching from
+    // the SSR endpoint will not return the authentication page HTML
+    newSearchParams.set(
+      "x-vercel-protection-bypass",
+      process.env.VERCEL_AUTOMATION_BYPASS_SECRET
+    );
+  }
+
+  // Fetch the data from the endpoint using the new search params
+  const prefetchedQueryData = await fetchExtractedQueryData(
+    `${prepassHost}${pathname}?${newSearchParams.toString()}`
+  );
+
+  // Provide the query data to your page
+  return (
+    <PlasmicQueryDataProvider prefetchedCache={prefetchedQueryData}>
+      {pageRootElt}
+    </PlasmicQueryDataProvider>
+  );
+}
+
+```
+
+`<ExtractPlasmicQueryData />` is a new client component from this package, which basically performs `extractPlasmicQueryData()` on its children, and then renders a `<script data-plasmic-prefetch-id/>` tag with the json of the extracted data. The helper function `withExtractPlasmicQueryData` will likely be moved into the package in the future.
+
+Here, `fetchExtractedQueryData()` basically just hits the same endpoint with `?plasmicSsr=true`, and extracts the data from the json embedded in the `<script/>`.
+
+The `prepassHost` to use is read from `PLASMIC_PREPASS_HOST` or `VERCEL_URL`. `VERCEL_URL` is available when your site is deployed on Vercel; it is the generated deployment url.
+
+3. If you have static generation at build time, `@plasmicapp/nextjs-app-router` also comes with a `with-plasmic-prepass` command that you can use like this in your package.json:
+
+```
+"script": {
+  "build": "with-plasmic-prepass -- next build"
+}
+```
+
+This script will start up the next dev server at some random port (by running npm run dev), run the passed command, and then kill the dev server. It will run the command with the proper `PLASMIC_PREPASS_HOST` env variable, so the user never needs to think about it. You can choose to use a different package.json script command to start the dev server via `with-plasmic-prepass -c prepass -- next build`.
+
+Unfortunately another drawback is that the dev server and the build process will step on each other's toes, so you need to direct them to use different output folders. You do it in `next.config.js`:
+
+```
+module.exports = {
+  distDir: process.env.PLASMIC_PREPASS_SERVER ? ".next-prepass" : ".next"
+}
+```
+
+The `PLASMIC_PREPASS_SERVER` environment variable will be set by with-plasmic-prepass.
+
+4. If you are deploying to Vercel, make sure to either disable [Vercel Authentication](https://vercel.com/docs/security/deployment-protection/methods-to-protect-deployments/vercel-authentication) or provide the [Protection Bypass](https://vercel.com/docs/security/deployment-protection/methods-to-bypass-deployment-protection/protection-bypass-automation) (Note: this is a paid feature). This is to ensure the SSR endpoint will not return Vercel's page authentication HTML.
+
+So...
+
+- At dev time, uses itself for extracting query data (hits `localhost:${PORT}`)
+- At build time, we start a parallel dev server via `with-plasmic-prepass`.
+- In production, with revalidation, it will also use itself for extracting query data (using `VERCEL_URL` as the prepass host).

package/dist/index.esm.js

@@ -1,7 +1,7 @@
 "use client";
 
 // src/ExtractPlasmicQueryData.tsx
-import { extractPlasmicQueryData } from "@plasmicapp/prepass";
+import { plasmicPrepassExtract } from "@plasmicapp/prepass";
 import * as React from "react";
 function ExtractPlasmicQueryData(props) {
   const { children } = props;
@@ -12,17 +12,28 @@ function ExtractPlasmicQueryData(props) {
   }
   const scriptId = `plasmic-prefetch-${React["useId"]()}`;
   if (typeof window === "undefined") {
-    const data = React["use"](
-      extractPlasmicQueryData(/* @__PURE__ */ React.createElement(React.Fragment, null, children))
-    );
+    const {
+      queryData,
+      headMetadata
+    } = React["use"](plasmicPrepassExtract(/* @__PURE__ */ React.createElement(React.Fragment, null, children)));
     return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
       "script",
       {
         type: "application/json",
-        dangerouslySetInnerHTML: { __html: JSON.stringify(data) },
+        dangerouslySetInnerHTML: { __html: JSON.stringify(queryData) },
         "data-plasmic-prefetch-id": scriptId,
         suppressHydrationWarning: true
       }
+    ), headMetadata && /* @__PURE__ */ React.createElement(
+      "script",
+      {
+        type: "application/json",
+        dangerouslySetInnerHTML: {
+          __html: JSON.stringify(headMetadata)
+        },
+        "data-plasmic-head-metadata-id": scriptId,
+        suppressHydrationWarning: true
+      }
     ));
   } else {
     return null;

package/dist/index.esm.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/ExtractPlasmicQueryData.tsx"],
-  "sourcesContent": ["import { extractPlasmicQueryData } from \"@plasmicapp/prepass\";\nimport * as React from \"react\";\n\n/**\n * EXPERIMENTAL\n *\n * A component that serves the same purpose as extractPlasmicQueryData(), but from\n * React server components. This only works from frameworks that support\n * React.useId() and React.use() (like Next.js 13).\n *\n * The children of this component will be run through `extractPlasmicQueryData()`.\n */\nexport function ExtractPlasmicQueryData(props: { children?: React.ReactNode }) {\n  const { children } = props;\n  if (!(\"useId\" in React) || !(\"use\" in React)) {\n    throw new Error(\n      `You can only use <ExtractPlasmicQueryData /> from server components.`\n    );\n  }\n  const scriptId = `plasmic-prefetch-${(React as any)[\"\" + \"useId\"]()}`;\n  if (typeof window === \"undefined\") {\n    const data: Record<string, any> = (React as any)[\"\" + \"use\"](\n      extractPlasmicQueryData(<>{children}</>)\n    );\n    return (\n      <>\n        <script\n          type=\"application/json\"\n          dangerouslySetInnerHTML={{ __html: JSON.stringify(data) }}\n          data-plasmic-prefetch-id={scriptId}\n          suppressHydrationWarning={true}\n        />\n      </>\n    );\n  } else {\n    return null;\n  }\n}\n"],
-  "mappings": ";;;AAAA,SAAS,+BAA+B;AACxC,YAAY,WAAW;AAWhB,SAAS,wBAAwB,OAAuC;AAC7E,QAAM,EAAE,SAAS,IAAI;AACrB,MAAI,EAAE,WAAW,UAAU,EAAE,SAAS,QAAQ;AAC5C,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,QAAM,WAAW,oBAAmC,eAAc;AAClE,MAAI,OAAO,WAAW,aAAa;AACjC,UAAM,OAA2C;AAAA,MAC/C,wBAAwB,0DAAG,QAAS,CAAG;AAAA,IACzC;AACA,WACE,0DACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,yBAAyB,EAAE,QAAQ,KAAK,UAAU,IAAI,EAAE;AAAA,QACxD,4BAA0B;AAAA,QAC1B,0BAA0B;AAAA;AAAA,IAC5B,CACF;AAAA,EAEJ,OAAO;AACL,WAAO;AAAA,EACT;AACF;",
+  "sourcesContent": ["import { plasmicPrepassExtract } from \"@plasmicapp/prepass\";\nimport type { HeadMetadata } from \"@plasmicapp/query\";\nimport * as React from \"react\";\n\n/**\n * EXPERIMENTAL\n *\n * A component that serves the same purpose as extractPlasmicQueryData(), but from\n * React server components. This only works from frameworks that support\n * React.useId() and React.use() (like Next.js 13).\n *\n * The children of this component will be run through `extractPlasmicQueryData()`.\n */\nexport function ExtractPlasmicQueryData(props: { children?: React.ReactNode }) {\n  const { children } = props;\n  if (!(\"useId\" in React) || !(\"use\" in React)) {\n    throw new Error(\n      `You can only use <ExtractPlasmicQueryData /> from server components.`\n    );\n  }\n  const scriptId = `plasmic-prefetch-${(React as any)[\"\" + \"useId\"]()}`;\n  if (typeof window === \"undefined\") {\n    const {\n      queryData,\n      headMetadata,\n    }: { queryData: Record<string, any>; headMetadata: HeadMetadata } = (\n      React as any\n    )[\"\" + \"use\"](plasmicPrepassExtract(<>{children}</>));\n    return (\n      <>\n        <script\n          type=\"application/json\"\n          dangerouslySetInnerHTML={{ __html: JSON.stringify(queryData) }}\n          data-plasmic-prefetch-id={scriptId}\n          suppressHydrationWarning={true}\n        />\n        {headMetadata && (\n          <script\n            type=\"application/json\"\n            dangerouslySetInnerHTML={{\n              __html: JSON.stringify(headMetadata),\n            }}\n            data-plasmic-head-metadata-id={scriptId}\n            suppressHydrationWarning={true}\n          />\n        )}\n      </>\n    );\n  } else {\n    return null;\n  }\n}\n"],
+  "mappings": ";;;AAAA,SAAS,6BAA6B;AAEtC,YAAY,WAAW;AAWhB,SAAS,wBAAwB,OAAuC;AAC7E,QAAM,EAAE,SAAS,IAAI;AACrB,MAAI,EAAE,WAAW,UAAU,EAAE,SAAS,QAAQ;AAC5C,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,QAAM,WAAW,oBAAmC,eAAc;AAClE,MAAI,OAAO,WAAW,aAAa;AACjC,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,IACF,IAEE,aAAY,sBAAsB,0DAAG,QAAS,CAAG,CAAC;AACpD,WACE,0DACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,yBAAyB,EAAE,QAAQ,KAAK,UAAU,SAAS,EAAE;AAAA,QAC7D,4BAA0B;AAAA,QAC1B,0BAA0B;AAAA;AAAA,IAC5B,GACC,gBACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,UAAU,YAAY;AAAA,QACrC;AAAA,QACA,iCAA+B;AAAA,QAC/B,0BAA0B;AAAA;AAAA,IAC5B,CAEJ;AAAA,EAEJ,OAAO;AACL,WAAO;AAAA,EACT;AACF;",
   "names": []
 }

package/dist/index.js

@@ -47,17 +47,28 @@ function ExtractPlasmicQueryData(props) {
   }
   const scriptId = `plasmic-prefetch-${React["useId"]()}`;
   if (typeof window === "undefined") {
-    const data = React["use"](
-      (0, import_prepass.extractPlasmicQueryData)(/* @__PURE__ */ React.createElement(React.Fragment, null, children))
-    );
+    const {
+      queryData,
+      headMetadata
+    } = React["use"]((0, import_prepass.plasmicPrepassExtract)(/* @__PURE__ */ React.createElement(React.Fragment, null, children)));
     return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
       "script",
       {
         type: "application/json",
-        dangerouslySetInnerHTML: { __html: JSON.stringify(data) },
+        dangerouslySetInnerHTML: { __html: JSON.stringify(queryData) },
         "data-plasmic-prefetch-id": scriptId,
         suppressHydrationWarning: true
       }
+    ), headMetadata && /* @__PURE__ */ React.createElement(
+      "script",
+      {
+        type: "application/json",
+        dangerouslySetInnerHTML: {
+          __html: JSON.stringify(headMetadata)
+        },
+        "data-plasmic-head-metadata-id": scriptId,
+        suppressHydrationWarning: true
+      }
     ));
   } else {
     return null;

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/index.ts", "../src/ExtractPlasmicQueryData.tsx"],
-  "sourcesContent": ["export * from \"./ExtractPlasmicQueryData\";\n", "import { extractPlasmicQueryData } from \"@plasmicapp/prepass\";\nimport * as React from \"react\";\n\n/**\n * EXPERIMENTAL\n *\n * A component that serves the same purpose as extractPlasmicQueryData(), but from\n * React server components. This only works from frameworks that support\n * React.useId() and React.use() (like Next.js 13).\n *\n * The children of this component will be run through `extractPlasmicQueryData()`.\n */\nexport function ExtractPlasmicQueryData(props: { children?: React.ReactNode }) {\n  const { children } = props;\n  if (!(\"useId\" in React) || !(\"use\" in React)) {\n    throw new Error(\n      `You can only use <ExtractPlasmicQueryData /> from server components.`\n    );\n  }\n  const scriptId = `plasmic-prefetch-${(React as any)[\"\" + \"useId\"]()}`;\n  if (typeof window === \"undefined\") {\n    const data: Record<string, any> = (React as any)[\"\" + \"use\"](\n      extractPlasmicQueryData(<>{children}</>)\n    );\n    return (\n      <>\n        <script\n          type=\"application/json\"\n          dangerouslySetInnerHTML={{ __html: JSON.stringify(data) }}\n          data-plasmic-prefetch-id={scriptId}\n          suppressHydrationWarning={true}\n        />\n      </>\n    );\n  } else {\n    return null;\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,qBAAwC;AACxC,YAAuB;AAWhB,SAAS,wBAAwB,OAAuC;AAC7E,QAAM,EAAE,SAAS,IAAI;AACrB,MAAI,EAAE,WAAW,UAAU,EAAE,SAAS,QAAQ;AAC5C,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,QAAM,WAAW,oBAAmC,eAAc;AAClE,MAAI,OAAO,WAAW,aAAa;AACjC,UAAM,OAA2C;AAAA,UAC/C,wCAAwB,0DAAG,QAAS,CAAG;AAAA,IACzC;AACA,WACE,0DACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,yBAAyB,EAAE,QAAQ,KAAK,UAAU,IAAI,EAAE;AAAA,QACxD,4BAA0B;AAAA,QAC1B,0BAA0B;AAAA;AAAA,IAC5B,CACF;AAAA,EAEJ,OAAO;AACL,WAAO;AAAA,EACT;AACF;",
+  "sourcesContent": ["export * from \"./ExtractPlasmicQueryData\";\n", "import { plasmicPrepassExtract } from \"@plasmicapp/prepass\";\nimport type { HeadMetadata } from \"@plasmicapp/query\";\nimport * as React from \"react\";\n\n/**\n * EXPERIMENTAL\n *\n * A component that serves the same purpose as extractPlasmicQueryData(), but from\n * React server components. This only works from frameworks that support\n * React.useId() and React.use() (like Next.js 13).\n *\n * The children of this component will be run through `extractPlasmicQueryData()`.\n */\nexport function ExtractPlasmicQueryData(props: { children?: React.ReactNode }) {\n  const { children } = props;\n  if (!(\"useId\" in React) || !(\"use\" in React)) {\n    throw new Error(\n      `You can only use <ExtractPlasmicQueryData /> from server components.`\n    );\n  }\n  const scriptId = `plasmic-prefetch-${(React as any)[\"\" + \"useId\"]()}`;\n  if (typeof window === \"undefined\") {\n    const {\n      queryData,\n      headMetadata,\n    }: { queryData: Record<string, any>; headMetadata: HeadMetadata } = (\n      React as any\n    )[\"\" + \"use\"](plasmicPrepassExtract(<>{children}</>));\n    return (\n      <>\n        <script\n          type=\"application/json\"\n          dangerouslySetInnerHTML={{ __html: JSON.stringify(queryData) }}\n          data-plasmic-prefetch-id={scriptId}\n          suppressHydrationWarning={true}\n        />\n        {headMetadata && (\n          <script\n            type=\"application/json\"\n            dangerouslySetInnerHTML={{\n              __html: JSON.stringify(headMetadata),\n            }}\n            data-plasmic-head-metadata-id={scriptId}\n            suppressHydrationWarning={true}\n          />\n        )}\n      </>\n    );\n  } else {\n    return null;\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,qBAAsC;AAEtC,YAAuB;AAWhB,SAAS,wBAAwB,OAAuC;AAC7E,QAAM,EAAE,SAAS,IAAI;AACrB,MAAI,EAAE,WAAW,UAAU,EAAE,SAAS,QAAQ;AAC5C,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,QAAM,WAAW,oBAAmC,eAAc;AAClE,MAAI,OAAO,WAAW,aAAa;AACjC,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,IACF,IAEE,iBAAY,sCAAsB,0DAAG,QAAS,CAAG,CAAC;AACpD,WACE,0DACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,yBAAyB,EAAE,QAAQ,KAAK,UAAU,SAAS,EAAE;AAAA,QAC7D,4BAA0B;AAAA,QAC1B,0BAA0B;AAAA;AAAA,IAC5B,GACC,gBACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,yBAAyB;AAAA,UACvB,QAAQ,KAAK,UAAU,YAAY;AAAA,QACrC;AAAA,QACA,iCAA+B;AAAA,QAC/B,0BAA0B;AAAA;AAAA,IAC5B,CAEJ;AAAA,EAEJ,OAAO;AACL,WAAO;AAAA,EACT;AACF;",
   "names": []
 }

package/dist/react-server.d.ts

@@ -1,3 +1,18 @@
+import type { HeadMetadata } from '@plasmicapp/query';
+
+export declare function fetchExtractedHeadMetadata(url: string): Promise<HeadMetadata | undefined>;
+
 export declare function fetchExtractedQueryData(url: string): Promise<any>;
 
+/**
+ * Helper function to extract Head metadata from Plasmic pages.
+ *
+ * Given current pathname + search params, returns an object compatible with
+ * Next.js Metadata interface with SEO metadata.
+ */
+export declare function withPlasmicMetadata({ pathname, searchParams, }: {
+    pathname: string;
+    searchParams: Record<string, string | string[]> | undefined;
+}): Promise<object>;
+
 export { }

package/dist/react-server.esm.js

@@ -36,7 +36,85 @@ function fetchExtractedQueryData(url) {
     return void 0;
   });
 }
+function fetchExtractedHeadMetadata(url) {
+  return __async(this, null, function* () {
+    const res = yield fetch(url);
+    if (res.status !== 200) {
+      return void 0;
+    }
+    const html = yield res.text();
+    const root = parseHtml(html);
+    const script = root.querySelector("script[data-plasmic-head-metadata-id]");
+    if (script) {
+      return JSON.parse(script.innerHTML);
+    }
+    return void 0;
+  });
+}
+function withPlasmicMetadata(_0) {
+  return __async(this, arguments, function* ({
+    pathname,
+    searchParams
+  }) {
+    var _a, _b, _c;
+    const isPlasmicSsr = !!(searchParams == null ? void 0 : searchParams["plasmicSsr"]) && (searchParams == null ? void 0 : searchParams["plasmicSsr"]) !== "false";
+    if (isPlasmicSsr) {
+      return {};
+    }
+    const prepassHost = (_c = (_a = process.env.PLASMIC_PREPASS_HOST) != null ? _a : process.env.VERCEL_URL && `https://${process.env.VERCEL_URL}`) != null ? _c : `http://localhost:${(_b = process.env.PORT) != null ? _b : 3e3}`;
+    const newSearchParams = new URLSearchParams(
+      Object.entries(searchParams != null ? searchParams : {}).flatMap(
+        ([key, values]) => Array.isArray(values) ? values.map((v) => [key, v]) : [[key, values]]
+      )
+    );
+    newSearchParams.set("plasmicSsr", "true");
+    if (process.env.VERCEL_AUTOMATION_BYPASS_SECRET) {
+      newSearchParams.set(
+        "x-vercel-protection-bypass",
+        process.env.VERCEL_AUTOMATION_BYPASS_SECRET
+      );
+    }
+    const prefetchedHeadMetadata = yield fetchExtractedHeadMetadata(
+      `${prepassHost}${pathname}?${newSearchParams.toString()}`
+    );
+    const headMetadata = {};
+    if (prefetchedHeadMetadata && Object.keys(prefetchedHeadMetadata).length > 0) {
+      if (prefetchedHeadMetadata.image) {
+        headMetadata.twitter = {
+          card: "summary_large_image",
+          images: [prefetchedHeadMetadata.image]
+        };
+        headMetadata.openGraph = {
+          images: [prefetchedHeadMetadata.image]
+        };
+      } else {
+        headMetadata.twitter = {
+          card: "summary"
+        };
+        headMetadata.openGraph = {};
+      }
+      if (prefetchedHeadMetadata.title) {
+        headMetadata.title = prefetchedHeadMetadata.title;
+        headMetadata.twitter.title = prefetchedHeadMetadata.title;
+        headMetadata.openGraph.title = prefetchedHeadMetadata.title;
+      }
+      if (prefetchedHeadMetadata.description) {
+        headMetadata.description = prefetchedHeadMetadata.description;
+        headMetadata.twitter.description = prefetchedHeadMetadata.description;
+        headMetadata.openGraph.description = prefetchedHeadMetadata.description;
+      }
+      if (prefetchedHeadMetadata.canonical) {
+        headMetadata.alternates = {
+          canonical: prefetchedHeadMetadata.canonical
+        };
+      }
+    }
+    return headMetadata;
+  });
+}
 export {
-  fetchExtractedQueryData
+  fetchExtractedHeadMetadata,
+  fetchExtractedQueryData,
+  withPlasmicMetadata
 };
 //# sourceMappingURL=react-server.esm.js.map

package/dist/react-server.esm.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/extracted-data-fetcher.ts"],
-  "sourcesContent": ["import { parse as parseHtml } from \"node-html-parser\";\n\nexport async function fetchExtractedQueryData(url: string) {\n  const res = await fetch(url);\n  if (res.status !== 200) {\n    return undefined;\n  }\n\n  const html = await res.text();\n  const root = parseHtml(html);\n  const script = root.querySelector(\"script[data-plasmic-prefetch-id]\");\n  if (script) {\n    return JSON.parse(script.innerHTML);\n  }\n  return undefined;\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,SAAS,iBAAiB;AAEnC,SAAsB,wBAAwB,KAAa;AAAA;AACzD,UAAM,MAAM,MAAM,MAAM,GAAG;AAC3B,QAAI,IAAI,WAAW,KAAK;AACtB,aAAO;AAAA,IACT;AAEA,UAAM,OAAO,MAAM,IAAI,KAAK;AAC5B,UAAM,OAAO,UAAU,IAAI;AAC3B,UAAM,SAAS,KAAK,cAAc,kCAAkC;AACpE,QAAI,QAAQ;AACV,aAAO,KAAK,MAAM,OAAO,SAAS;AAAA,IACpC;AACA,WAAO;AAAA,EACT;AAAA;",
+  "sourcesContent": ["import type { HeadMetadata } from \"@plasmicapp/query\";\nimport { parse as parseHtml } from \"node-html-parser\";\nimport { Metadata } from \"next\";\n\nexport async function fetchExtractedQueryData(url: string) {\n  const res = await fetch(url);\n  if (res.status !== 200) {\n    return undefined;\n  }\n\n  const html = await res.text();\n  const root = parseHtml(html);\n  const script = root.querySelector(\"script[data-plasmic-prefetch-id]\");\n  if (script) {\n    return JSON.parse(script.innerHTML);\n  }\n  return undefined;\n}\n\nexport async function fetchExtractedHeadMetadata(\n  url: string\n): Promise<HeadMetadata | undefined> {\n  const res = await fetch(url);\n  if (res.status !== 200) {\n    return undefined;\n  }\n\n  const html = await res.text();\n  const root = parseHtml(html);\n  const script = root.querySelector(\"script[data-plasmic-head-metadata-id]\");\n  if (script) {\n    return JSON.parse(script.innerHTML);\n  }\n  return undefined;\n}\n\n/**\n * Helper function to extract Head metadata from Plasmic pages.\n *\n * Given current pathname + search params, returns an object compatible with\n * Next.js Metadata interface with SEO metadata.\n */\nexport async function withPlasmicMetadata({\n  pathname,\n  searchParams,\n}: {\n  pathname: string;\n  searchParams: Record<string, string | string[]> | undefined;\n}): Promise<object> {\n  const isPlasmicSsr =\n    !!searchParams?.[\"plasmicSsr\"] && searchParams?.[\"plasmicSsr\"] !== \"false\";\n\n  if (isPlasmicSsr) {\n    // We're building the metadata for SSR endpoint here; this endpoint is not\n    // exposed for users, so we can just return an empty object.\n    return {};\n  }\n\n  // Fetch the same page from SSR endpoint to retrieve Head metadata\n  const prepassHost =\n    process.env.PLASMIC_PREPASS_HOST ??\n    (process.env.VERCEL_URL && `https://${process.env.VERCEL_URL}`) ??\n    `http://localhost:${process.env.PORT ?? 3000}`;\n\n  // Build a copy of the search params\n  const newSearchParams = new URLSearchParams(\n    Object.entries(searchParams ?? {}).flatMap(([key, values]) =>\n      Array.isArray(values) ? values.map((v) => [key, v]) : [[key, values]]\n    )\n  );\n\n  // Set `plasmicSsr` search param to indicate you are using the SSR endpoint.\n  newSearchParams.set(\"plasmicSsr\", \"true\");\n\n  if (process.env.VERCEL_AUTOMATION_BYPASS_SECRET) {\n    // If protection bypass is enabled, use it to ensure fetching from\n    // the SSR endpoint will not return the authentication page HTML\n    newSearchParams.set(\n      \"x-vercel-protection-bypass\",\n      process.env.VERCEL_AUTOMATION_BYPASS_SECRET\n    );\n  }\n\n  // Fetch and return the data from the endpoint using the new search params\n  const prefetchedHeadMetadata = await fetchExtractedHeadMetadata(\n    `${prepassHost}${pathname}?${newSearchParams.toString()}`\n  );\n\n  // Create metadata object\n  const headMetadata: Metadata = {};\n  if (\n    prefetchedHeadMetadata &&\n    Object.keys(prefetchedHeadMetadata).length > 0\n  ) {\n    if (prefetchedHeadMetadata.image) {\n      headMetadata.twitter = {\n        card: \"summary_large_image\",\n        images: [prefetchedHeadMetadata.image],\n      };\n      headMetadata.openGraph = {\n        images: [prefetchedHeadMetadata.image],\n      };\n    } else {\n      headMetadata.twitter = {\n        card: \"summary\",\n      };\n      headMetadata.openGraph = {};\n    }\n    if (prefetchedHeadMetadata.title) {\n      headMetadata.title = prefetchedHeadMetadata.title;\n      headMetadata.twitter.title = prefetchedHeadMetadata.title;\n      headMetadata.openGraph.title = prefetchedHeadMetadata.title;\n    }\n    if (prefetchedHeadMetadata.description) {\n      headMetadata.description = prefetchedHeadMetadata.description;\n      headMetadata.twitter.description = prefetchedHeadMetadata.description;\n      headMetadata.openGraph.description = prefetchedHeadMetadata.description;\n    }\n    if (prefetchedHeadMetadata.canonical) {\n      headMetadata.alternates = {\n        canonical: prefetchedHeadMetadata.canonical,\n      };\n    }\n  }\n\n  return headMetadata;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AACA,SAAS,SAAS,iBAAiB;AAGnC,SAAsB,wBAAwB,KAAa;AAAA;AACzD,UAAM,MAAM,MAAM,MAAM,GAAG;AAC3B,QAAI,IAAI,WAAW,KAAK;AACtB,aAAO;AAAA,IACT;AAEA,UAAM,OAAO,MAAM,IAAI,KAAK;AAC5B,UAAM,OAAO,UAAU,IAAI;AAC3B,UAAM,SAAS,KAAK,cAAc,kCAAkC;AACpE,QAAI,QAAQ;AACV,aAAO,KAAK,MAAM,OAAO,SAAS;AAAA,IACpC;AACA,WAAO;AAAA,EACT;AAAA;AAEA,SAAsB,2BACpB,KACmC;AAAA;AACnC,UAAM,MAAM,MAAM,MAAM,GAAG;AAC3B,QAAI,IAAI,WAAW,KAAK;AACtB,aAAO;AAAA,IACT;AAEA,UAAM,OAAO,MAAM,IAAI,KAAK;AAC5B,UAAM,OAAO,UAAU,IAAI;AAC3B,UAAM,SAAS,KAAK,cAAc,uCAAuC;AACzE,QAAI,QAAQ;AACV,aAAO,KAAK,MAAM,OAAO,SAAS;AAAA,IACpC;AACA,WAAO;AAAA,EACT;AAAA;AAQA,SAAsB,oBAAoB,IAMtB;AAAA,6CANsB;AAAA,IACxC;AAAA,IACA;AAAA,EACF,GAGoB;AAhDpB;AAiDE,UAAM,eACJ,CAAC,EAAC,6CAAe,mBAAiB,6CAAe,mBAAkB;AAErE,QAAI,cAAc;AAGhB,aAAO,CAAC;AAAA,IACV;AAGA,UAAM,eACJ,mBAAQ,IAAI,yBAAZ,YACC,QAAQ,IAAI,cAAc,WAAW,QAAQ,IAAI,iBADlD,YAEA,qBAAoB,aAAQ,IAAI,SAAZ,YAAoB;AAG1C,UAAM,kBAAkB,IAAI;AAAA,MAC1B,OAAO,QAAQ,sCAAgB,CAAC,CAAC,EAAE;AAAA,QAAQ,CAAC,CAAC,KAAK,MAAM,MACtD,MAAM,QAAQ,MAAM,IAAI,OAAO,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,MAAM,CAAC;AAAA,MACtE;AAAA,IACF;AAGA,oBAAgB,IAAI,cAAc,MAAM;AAExC,QAAI,QAAQ,IAAI,iCAAiC;AAG/C,sBAAgB;AAAA,QACd;AAAA,QACA,QAAQ,IAAI;AAAA,MACd;AAAA,IACF;AAGA,UAAM,yBAAyB,MAAM;AAAA,MACnC,GAAG,cAAc,YAAY,gBAAgB,SAAS;AAAA,IACxD;AAGA,UAAM,eAAyB,CAAC;AAChC,QACE,0BACA,OAAO,KAAK,sBAAsB,EAAE,SAAS,GAC7C;AACA,UAAI,uBAAuB,OAAO;AAChC,qBAAa,UAAU;AAAA,UACrB,MAAM;AAAA,UACN,QAAQ,CAAC,uBAAuB,KAAK;AAAA,QACvC;AACA,qBAAa,YAAY;AAAA,UACvB,QAAQ,CAAC,uBAAuB,KAAK;AAAA,QACvC;AAAA,MACF,OAAO;AACL,qBAAa,UAAU;AAAA,UACrB,MAAM;AAAA,QACR;AACA,qBAAa,YAAY,CAAC;AAAA,MAC5B;AACA,UAAI,uBAAuB,OAAO;AAChC,qBAAa,QAAQ,uBAAuB;AAC5C,qBAAa,QAAQ,QAAQ,uBAAuB;AACpD,qBAAa,UAAU,QAAQ,uBAAuB;AAAA,MACxD;AACA,UAAI,uBAAuB,aAAa;AACtC,qBAAa,cAAc,uBAAuB;AAClD,qBAAa,QAAQ,cAAc,uBAAuB;AAC1D,qBAAa,UAAU,cAAc,uBAAuB;AAAA,MAC9D;AACA,UAAI,uBAAuB,WAAW;AACpC,qBAAa,aAAa;AAAA,UACxB,WAAW,uBAAuB;AAAA,QACpC;AAAA,MACF;AAAA,IACF;AAEA,WAAO;AAAA,EACT;AAAA;",
   "names": []
 }

package/dist/react-server.js

@@ -40,7 +40,9 @@ var __async = (__this, __arguments, generator) => {
 // src/react-server.ts
 var react_server_exports = {};
 __export(react_server_exports, {
-  fetchExtractedQueryData: () => fetchExtractedQueryData
+  fetchExtractedHeadMetadata: () => fetchExtractedHeadMetadata,
+  fetchExtractedQueryData: () => fetchExtractedQueryData,
+  withPlasmicMetadata: () => withPlasmicMetadata
 });
 module.exports = __toCommonJS(react_server_exports);
 
@@ -61,4 +63,80 @@ function fetchExtractedQueryData(url) {
     return void 0;
   });
 }
+function fetchExtractedHeadMetadata(url) {
+  return __async(this, null, function* () {
+    const res = yield fetch(url);
+    if (res.status !== 200) {
+      return void 0;
+    }
+    const html = yield res.text();
+    const root = (0, import_node_html_parser.parse)(html);
+    const script = root.querySelector("script[data-plasmic-head-metadata-id]");
+    if (script) {
+      return JSON.parse(script.innerHTML);
+    }
+    return void 0;
+  });
+}
+function withPlasmicMetadata(_0) {
+  return __async(this, arguments, function* ({
+    pathname,
+    searchParams
+  }) {
+    var _a, _b, _c;
+    const isPlasmicSsr = !!(searchParams == null ? void 0 : searchParams["plasmicSsr"]) && (searchParams == null ? void 0 : searchParams["plasmicSsr"]) !== "false";
+    if (isPlasmicSsr) {
+      return {};
+    }
+    const prepassHost = (_c = (_a = process.env.PLASMIC_PREPASS_HOST) != null ? _a : process.env.VERCEL_URL && `https://${process.env.VERCEL_URL}`) != null ? _c : `http://localhost:${(_b = process.env.PORT) != null ? _b : 3e3}`;
+    const newSearchParams = new URLSearchParams(
+      Object.entries(searchParams != null ? searchParams : {}).flatMap(
+        ([key, values]) => Array.isArray(values) ? values.map((v) => [key, v]) : [[key, values]]
+      )
+    );
+    newSearchParams.set("plasmicSsr", "true");
+    if (process.env.VERCEL_AUTOMATION_BYPASS_SECRET) {
+      newSearchParams.set(
+        "x-vercel-protection-bypass",
+        process.env.VERCEL_AUTOMATION_BYPASS_SECRET
+      );
+    }
+    const prefetchedHeadMetadata = yield fetchExtractedHeadMetadata(
+      `${prepassHost}${pathname}?${newSearchParams.toString()}`
+    );
+    const headMetadata = {};
+    if (prefetchedHeadMetadata && Object.keys(prefetchedHeadMetadata).length > 0) {
+      if (prefetchedHeadMetadata.image) {
+        headMetadata.twitter = {
+          card: "summary_large_image",
+          images: [prefetchedHeadMetadata.image]
+        };
+        headMetadata.openGraph = {
+          images: [prefetchedHeadMetadata.image]
+        };
+      } else {
+        headMetadata.twitter = {
+          card: "summary"
+        };
+        headMetadata.openGraph = {};
+      }
+      if (prefetchedHeadMetadata.title) {
+        headMetadata.title = prefetchedHeadMetadata.title;
+        headMetadata.twitter.title = prefetchedHeadMetadata.title;
+        headMetadata.openGraph.title = prefetchedHeadMetadata.title;
+      }
+      if (prefetchedHeadMetadata.description) {
+        headMetadata.description = prefetchedHeadMetadata.description;
+        headMetadata.twitter.description = prefetchedHeadMetadata.description;
+        headMetadata.openGraph.description = prefetchedHeadMetadata.description;
+      }
+      if (prefetchedHeadMetadata.canonical) {
+        headMetadata.alternates = {
+          canonical: prefetchedHeadMetadata.canonical
+        };
+      }
+    }
+    return headMetadata;
+  });
+}
 //# sourceMappingURL=react-server.js.map

package/dist/react-server.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/react-server.ts", "../src/extracted-data-fetcher.ts"],
-  "sourcesContent": ["export * from \"./extracted-data-fetcher\";\n", "import { parse as parseHtml } from \"node-html-parser\";\n\nexport async function fetchExtractedQueryData(url: string) {\n  const res = await fetch(url);\n  if (res.status !== 200) {\n    return undefined;\n  }\n\n  const html = await res.text();\n  const root = parseHtml(html);\n  const script = root.querySelector(\"script[data-plasmic-prefetch-id]\");\n  if (script) {\n    return JSON.parse(script.innerHTML);\n  }\n  return undefined;\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,8BAAmC;AAEnC,SAAsB,wBAAwB,KAAa;AAAA;AACzD,UAAM,MAAM,MAAM,MAAM,GAAG;AAC3B,QAAI,IAAI,WAAW,KAAK;AACtB,aAAO;AAAA,IACT;AAEA,UAAM,OAAO,MAAM,IAAI,KAAK;AAC5B,UAAM,WAAO,wBAAAA,OAAU,IAAI;AAC3B,UAAM,SAAS,KAAK,cAAc,kCAAkC;AACpE,QAAI,QAAQ;AACV,aAAO,KAAK,MAAM,OAAO,SAAS;AAAA,IACpC;AACA,WAAO;AAAA,EACT;AAAA;",
+  "sourcesContent": ["export * from \"./extracted-data-fetcher\";\n", "import type { HeadMetadata } from \"@plasmicapp/query\";\nimport { parse as parseHtml } from \"node-html-parser\";\nimport { Metadata } from \"next\";\n\nexport async function fetchExtractedQueryData(url: string) {\n  const res = await fetch(url);\n  if (res.status !== 200) {\n    return undefined;\n  }\n\n  const html = await res.text();\n  const root = parseHtml(html);\n  const script = root.querySelector(\"script[data-plasmic-prefetch-id]\");\n  if (script) {\n    return JSON.parse(script.innerHTML);\n  }\n  return undefined;\n}\n\nexport async function fetchExtractedHeadMetadata(\n  url: string\n): Promise<HeadMetadata | undefined> {\n  const res = await fetch(url);\n  if (res.status !== 200) {\n    return undefined;\n  }\n\n  const html = await res.text();\n  const root = parseHtml(html);\n  const script = root.querySelector(\"script[data-plasmic-head-metadata-id]\");\n  if (script) {\n    return JSON.parse(script.innerHTML);\n  }\n  return undefined;\n}\n\n/**\n * Helper function to extract Head metadata from Plasmic pages.\n *\n * Given current pathname + search params, returns an object compatible with\n * Next.js Metadata interface with SEO metadata.\n */\nexport async function withPlasmicMetadata({\n  pathname,\n  searchParams,\n}: {\n  pathname: string;\n  searchParams: Record<string, string | string[]> | undefined;\n}): Promise<object> {\n  const isPlasmicSsr =\n    !!searchParams?.[\"plasmicSsr\"] && searchParams?.[\"plasmicSsr\"] !== \"false\";\n\n  if (isPlasmicSsr) {\n    // We're building the metadata for SSR endpoint here; this endpoint is not\n    // exposed for users, so we can just return an empty object.\n    return {};\n  }\n\n  // Fetch the same page from SSR endpoint to retrieve Head metadata\n  const prepassHost =\n    process.env.PLASMIC_PREPASS_HOST ??\n    (process.env.VERCEL_URL && `https://${process.env.VERCEL_URL}`) ??\n    `http://localhost:${process.env.PORT ?? 3000}`;\n\n  // Build a copy of the search params\n  const newSearchParams = new URLSearchParams(\n    Object.entries(searchParams ?? {}).flatMap(([key, values]) =>\n      Array.isArray(values) ? values.map((v) => [key, v]) : [[key, values]]\n    )\n  );\n\n  // Set `plasmicSsr` search param to indicate you are using the SSR endpoint.\n  newSearchParams.set(\"plasmicSsr\", \"true\");\n\n  if (process.env.VERCEL_AUTOMATION_BYPASS_SECRET) {\n    // If protection bypass is enabled, use it to ensure fetching from\n    // the SSR endpoint will not return the authentication page HTML\n    newSearchParams.set(\n      \"x-vercel-protection-bypass\",\n      process.env.VERCEL_AUTOMATION_BYPASS_SECRET\n    );\n  }\n\n  // Fetch and return the data from the endpoint using the new search params\n  const prefetchedHeadMetadata = await fetchExtractedHeadMetadata(\n    `${prepassHost}${pathname}?${newSearchParams.toString()}`\n  );\n\n  // Create metadata object\n  const headMetadata: Metadata = {};\n  if (\n    prefetchedHeadMetadata &&\n    Object.keys(prefetchedHeadMetadata).length > 0\n  ) {\n    if (prefetchedHeadMetadata.image) {\n      headMetadata.twitter = {\n        card: \"summary_large_image\",\n        images: [prefetchedHeadMetadata.image],\n      };\n      headMetadata.openGraph = {\n        images: [prefetchedHeadMetadata.image],\n      };\n    } else {\n      headMetadata.twitter = {\n        card: \"summary\",\n      };\n      headMetadata.openGraph = {};\n    }\n    if (prefetchedHeadMetadata.title) {\n      headMetadata.title = prefetchedHeadMetadata.title;\n      headMetadata.twitter.title = prefetchedHeadMetadata.title;\n      headMetadata.openGraph.title = prefetchedHeadMetadata.title;\n    }\n    if (prefetchedHeadMetadata.description) {\n      headMetadata.description = prefetchedHeadMetadata.description;\n      headMetadata.twitter.description = prefetchedHeadMetadata.description;\n      headMetadata.openGraph.description = prefetchedHeadMetadata.description;\n    }\n    if (prefetchedHeadMetadata.canonical) {\n      headMetadata.alternates = {\n        canonical: prefetchedHeadMetadata.canonical,\n      };\n    }\n  }\n\n  return headMetadata;\n}\n"],
+  "mappings": "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",
   "names": ["parseHtml"]
 }

package/dist/with-plasmic-prepass.cjs.js

@@ -7603,7 +7603,6 @@ async function main() {
       import_process.default.exit(commandProcess.exitCode ?? void 0);
     }).catch((err) => {
       console.error(`Plasmic: Failed to kill dev server: ${err}`);
-      import_process.default.exit(1);
     });
   };
   const command2 = argv._.map((x) => `${x}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plasmicapp/nextjs-app-router",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",
   "module": "./dist/index.esm.js",
@@ -25,7 +25,8 @@
     "prepare": "if-env PREPARE_NO_BUILD=true || yarn build"
   },
   "dependencies": {
-    "@plasmicapp/prepass": "1.0.16",
+    "@plasmicapp/prepass": "1.0.17",
+    "@plasmicapp/query": "0.1.79",
     "fkill": "^8.1.0",
     "get-port": "^7.0.0",
     "node-html-parser": "^6.1.5",
@@ -67,8 +68,9 @@
     "@types/node": "^20.8.9",
     "@types/react": "^18.0.27",
     "@types/yargs": "^17.0.32",
+    "next": "^13.2.0",
     "react": "^18.2.0",
     "typescript": "^5.2.2"
   },
-  "gitHead": "0597c84c0fa0df12523bfdbc1ba21ce81d34d63c"
+  "gitHead": "2f8ee12f8f9c75c0f0af3834b8302b0bea542cbd"
 }