create-plasmic-app 0.0.64 → 0.0.66

package/cpa-out/gatsby-codegen-js/package.json

@@ -14,11 +14,10 @@
     "clean": "gatsby clean"
   },
   "dependencies": {
-    "@plasmicapp/cli": "^0.1.205",
-    "@plasmicapp/host": "^1.0.100",
-    "@plasmicapp/react-web": "^0.2.150",
-    "gatsby": "^5.5.0",
-    "gatsby-plugin-react-helmet": "^6.5.0",
+    "@plasmicapp/cli": "^0.1.222",
+    "@plasmicapp/react-web": "^0.2.167",
+    "gatsby": "^5.7.0",
+    "gatsby-plugin-react-helmet": "^6.7.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-helmet": "^6.1.0"

package/cpa-out/gatsby-codegen-js/plasmic.json

@@ -74,6 +74,6 @@
   "gatsbyConfig": {
     "pagesDir": "../pages"
   },
-  "cliVersion": "0.1.205",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.205/dist/plasmic.schema.json"
+  "cliVersion": "0.1.222",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.222/dist/plasmic.schema.json"
 }

package/cpa-out/gatsby-codegen-js/src/components/plasmic/create_plasmic_app/PlasmicHomepage.jsx

@@ -10,7 +10,7 @@
 // Component: 6uuAAE1jiCew
 import * as React from "react";
 import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 import {
   hasVariant,
   classNames,
@@ -48,6 +48,8 @@ function PlasmicHomepage__RenderFunc(props) {
     ...args,
     ...variants
   };
+  const refsRef = React.useRef({});
+  const $refs = refsRef.current;
   const currentUser = p.useCurrentUser?.() || {};
   const [$queries, setDollarQueries] = React.useState({});
   const globalVariants = ensureGlobalVariants({

package/cpa-out/gatsby-codegen-js/src/pages/index.jsx

@@ -1,7 +1,7 @@
 // This is a skeleton starter React page generated by Plasmic.
 // This file is owned by you, feel free to edit as you see fit.
 import * as React from "react";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 import {
   PlasmicHomepage,
   Head

package/cpa-out/gatsby-codegen-ts/package.json

@@ -15,20 +15,19 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@plasmicapp/cli": "^0.1.205",
-    "@plasmicapp/host": "^1.0.100",
-    "@plasmicapp/react-web": "^0.2.150",
-    "gatsby": "^5.5.0",
-    "gatsby-plugin-react-helmet": "^6.5.0",
+    "@plasmicapp/cli": "^0.1.222",
+    "@plasmicapp/react-web": "^0.2.167",
+    "gatsby": "^5.7.0",
+    "gatsby-plugin-react-helmet": "^6.7.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-helmet": "^6.1.0"
   },
   "devDependencies": {
-    "@types/node": "^18.11.18",
-    "@types/react": "^18.0.27",
-    "@types/react-dom": "^18.0.10",
+    "@types/node": "^18.15.0",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
     "@types/react-helmet": "^6.1.6",
-    "typescript": "^4.9.4"
+    "typescript": "^4.9.5"
   }
 }

package/cpa-out/gatsby-codegen-ts/plasmic.json

@@ -74,6 +74,6 @@
   "gatsbyConfig": {
     "pagesDir": "../pages"
   },
-  "cliVersion": "0.1.205",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.205/dist/plasmic.schema.json"
+  "cliVersion": "0.1.222",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.222/dist/plasmic.schema.json"
 }

package/cpa-out/gatsby-codegen-ts/src/components/plasmic/create_plasmic_app/PlasmicHomepage.tsx

@@ -12,10 +12,14 @@
 // Component: 6uuAAE1jiCew
 import * as React from "react";
 
-import { Link, GatsbyLinkProps as LinkProps } from "gatsby";
+import {
+  Link,
+  GatsbyLinkProps as LinkProps,
+  navigate as __gatsbyNavigate
+} from "gatsby";
 
 import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 
 import {
   hasVariant,
@@ -89,9 +93,10 @@ function PlasmicHomepage__RenderFunc(props: {
     ...args,
     ...variants
   };
+  const refsRef = React.useRef({});
+  const $refs = refsRef.current;
 
   const currentUser = p.useCurrentUser?.() || {};
-
   const [$queries, setDollarQueries] = React.useState({});
 
   const globalVariants = ensureGlobalVariants({

package/cpa-out/gatsby-codegen-ts/src/pages/index.tsx

@@ -1,7 +1,7 @@
 // This is a skeleton starter React page generated by Plasmic.
 // This file is owned by you, feel free to edit as you see fit.
 import * as React from "react";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 
 import { ScreenVariantProvider } from "../components/plasmic/create_plasmic_app/PlasmicGlobalVariant__Screen";
 import {

package/cpa-out/nextjs-app-loader-js/app/[[...catchall]]/page.jsx

@@ -1,7 +1,7 @@
 import { PlasmicComponent } from "@plasmicapp/loader-nextjs";
 import { notFound } from "next/navigation";
-import { PLASMIC } from "plasmic-init";
-import { ClientPlasmicRootProvider } from "plasmic-init-client";
+import { PLASMIC } from "@/plasmic-init";
+import { ClientPlasmicRootProvider } from "@/plasmic-init-client";
 
 // Use revalidate if you want incremental static regeneration
 export const revalidate = 60;

package/cpa-out/nextjs-app-loader-js/app/api/hello/route.js

@@ -0,0 +1,3 @@
+export async function GET(request) {
+  return new Response('Hello, Next.js!')
+}

package/cpa-out/nextjs-app-loader-js/app/layout.js

@@ -1,13 +1,13 @@
 import './globals.css'
 
+export const metadata = {
+  title: 'Create Next App',
+  description: 'Generated by create next app',
+}
+
 export default function RootLayout({ children }) {
   return (
     <html lang="en">
-      {/*
-        <head /> will contain the components returned by the nearest parent
-        head.js. Find out more at https://beta.nextjs.org/docs/api-reference/file-conventions/head
-      */}
-      <head />
       <body>{children}</body>
     </html>
   )

package/cpa-out/nextjs-app-loader-js/app/plasmic-host/page.jsx

@@ -1,5 +1,5 @@
 import { PlasmicCanvasHost } from "@plasmicapp/loader-nextjs";
-import "plasmic-init-client";
+import "@/plasmic-init-client";
 
 export default function PlasmicHost() {
   return <PlasmicCanvasHost />;

package/cpa-out/nextjs-app-loader-js/package.json

@@ -9,11 +9,10 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@next/font": "13.1.6",
-    "@plasmicapp/loader-nextjs": "^1.0.224",
-    "eslint": "8.33.0",
-    "eslint-config-next": "13.1.6",
-    "next": "13.1.6",
+    "@plasmicapp/loader-nextjs": "^1.0.233",
+    "eslint": "8.35.0",
+    "eslint-config-next": "13.2.3",
+    "next": "13.2.3",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   }

package/cpa-out/nextjs-app-loader-js/plasmic-init-client.jsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { PlasmicRootProvider } from "@plasmicapp/loader-nextjs";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/
@@ -22,7 +22,7 @@ import { PLASMIC } from "plasmic-init";
  * In a Server Component like app/<your-path>/path.tsx, rendering the following would not work:
  *
  * ```tsx
- * import { PLASMIC } from "plasmic-init";
+ * import { PLASMIC } from "@/plasmic-init";
  * import { PlasmicRootProvider } from "plasmicapp/loader-nextjs";
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
@@ -42,8 +42,8 @@ import { PLASMIC } from "plasmic-init";
  * while allowing your Server Component to pass in prefetched data and other serializable props:
  *
  * ```tsx
- * import { PLASMIC } from "plasmic-init";
- * import { ClientPlasmicRootProvider } from "plasmic-init-client"; // changed
+ * import { PLASMIC } from "@/plasmic-init";
+ * import { ClientPlasmicRootProvider } from "@/plasmic-init-client"; // changed
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
  *   return (

package/cpa-out/nextjs-app-loader-ts/app/[[...catchall]]/page.tsx

@@ -1,7 +1,7 @@
 import { PlasmicComponent } from "@plasmicapp/loader-nextjs";
 import { notFound } from "next/navigation";
-import { PLASMIC } from "plasmic-init";
-import { ClientPlasmicRootProvider } from "plasmic-init-client";
+import { PLASMIC } from "@/plasmic-init";
+import { ClientPlasmicRootProvider } from "@/plasmic-init-client";
 
 // Use revalidate if you want incremental static regeneration
 export const revalidate = 60;

package/cpa-out/nextjs-app-loader-ts/app/api/hello/route.ts

@@ -0,0 +1,3 @@
+export async function GET(request: Request) {
+  return new Response('Hello, Next.js!')
+}

package/cpa-out/nextjs-app-loader-ts/app/layout.tsx

@@ -1,5 +1,10 @@
 import './globals.css'
 
+export const metadata = {
+  title: 'Create Next App',
+  description: 'Generated by create next app',
+}
+
 export default function RootLayout({
   children,
 }: {
@@ -7,11 +12,6 @@ export default function RootLayout({
 }) {
   return (
     <html lang="en">
-      {/*
-        <head /> will contain the components returned by the nearest parent
-        head.tsx. Find out more at https://beta.nextjs.org/docs/api-reference/file-conventions/head
-      */}
-      <head />
       <body>{children}</body>
     </html>
   )

package/cpa-out/nextjs-app-loader-ts/app/plasmic-host/page.tsx

@@ -1,5 +1,5 @@
 import { PlasmicCanvasHost } from "@plasmicapp/loader-nextjs";
-import "plasmic-init-client";
+import "@/plasmic-init-client";
 
 export default function PlasmicHost() {
   return <PlasmicCanvasHost />;

package/cpa-out/nextjs-app-loader-ts/package.json

@@ -9,14 +9,13 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@next/font": "13.1.6",
-    "@plasmicapp/loader-nextjs": "^1.0.224",
-    "@types/node": "18.11.18",
-    "@types/react": "18.0.27",
-    "@types/react-dom": "18.0.10",
-    "eslint": "8.33.0",
-    "eslint-config-next": "13.1.6",
-    "next": "13.1.6",
+    "@plasmicapp/loader-nextjs": "^1.0.233",
+    "@types/node": "18.14.2",
+    "@types/react": "18.0.28",
+    "@types/react-dom": "18.0.11",
+    "eslint": "8.35.0",
+    "eslint-config-next": "13.2.3",
+    "next": "13.2.3",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "typescript": "4.9.5"

package/cpa-out/nextjs-app-loader-ts/plasmic-init-client.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { PlasmicRootProvider } from "@plasmicapp/loader-nextjs";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/
@@ -22,7 +22,7 @@ import { PLASMIC } from "plasmic-init";
  * In a Server Component like app/<your-path>/path.tsx, rendering the following would not work:
  *
  * ```tsx
- * import { PLASMIC } from "plasmic-init";
+ * import { PLASMIC } from "@/plasmic-init";
  * import { PlasmicRootProvider } from "plasmicapp/loader-nextjs";
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
@@ -42,8 +42,8 @@ import { PLASMIC } from "plasmic-init";
  * while allowing your Server Component to pass in prefetched data and other serializable props:
  *
  * ```tsx
- * import { PLASMIC } from "plasmic-init";
- * import { ClientPlasmicRootProvider } from "plasmic-init-client"; // changed
+ * import { PLASMIC } from "@/plasmic-init";
+ * import { ClientPlasmicRootProvider } from "@/plasmic-init-client"; // changed
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
  *   return (

package/cpa-out/nextjs-app-loader-ts/tsconfig.json

@@ -19,7 +19,6 @@
         "name": "next"
       }
     ],
-    "baseUrl": ".",
     "paths": {
       "@/*": ["./*"]
     }

package/cpa-out/nextjs-pages-codegen-js/components/plasmic/create_plasmic_app/PlasmicHomepage.jsx

@@ -10,8 +10,9 @@
 // Component: 6uuAAE1jiCew
 import * as React from "react";
 import Head from "next/head";
+import { useRouter } from "next/router";
 import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 import {
   hasVariant,
   classNames,
@@ -37,14 +38,24 @@ const __wrapUserPromise =
     return await promise;
   });
 
+function useNextRouter() {
+  try {
+    return useRouter();
+  } catch {}
+  return undefined;
+}
+
 function PlasmicHomepage__RenderFunc(props) {
   const { variants, overrides, forNode } = props;
+  const __nextRouter = useNextRouter();
   const $ctx = ph.useDataEnv?.() || {};
   const args = React.useMemo(() => Object.assign({}, props.args), [props.args]);
   const $props = {
     ...args,
     ...variants
   };
+  const refsRef = React.useRef({});
+  const $refs = refsRef.current;
   const currentUser = p.useCurrentUser?.() || {};
   const [$queries, setDollarQueries] = React.useState({});
   const globalVariants = ensureGlobalVariants({

package/cpa-out/nextjs-pages-codegen-js/package.json

@@ -9,13 +9,11 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@next/font": "13.1.6",
-    "@plasmicapp/cli": "^0.1.205",
-    "@plasmicapp/host": "^1.0.100",
-    "@plasmicapp/react-web": "^0.2.150",
-    "eslint": "8.33.0",
-    "eslint-config-next": "13.1.6",
-    "next": "13.1.6",
+    "@plasmicapp/cli": "^0.1.222",
+    "@plasmicapp/react-web": "^0.2.167",
+    "eslint": "8.36.0",
+    "eslint-config-next": "13.2.4",
+    "next": "13.2.4",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   }

package/cpa-out/nextjs-pages-codegen-js/pages/index.jsx

@@ -1,7 +1,7 @@
 // This is a skeleton starter React page generated by Plasmic.
 // This file is owned by you, feel free to edit as you see fit.
 import * as React from "react";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 import { PlasmicHomepage } from "../components/plasmic/create_plasmic_app/PlasmicHomepage";
 import { useRouter } from "next/router";
 

package/cpa-out/nextjs-pages-codegen-js/pages/plasmic-host.jsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/host';
+import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/react-web/lib/host';
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/

package/cpa-out/nextjs-pages-codegen-js/plasmic.json

@@ -74,6 +74,6 @@
   "nextjsConfig": {
     "pagesDir": "../pages"
   },
-  "cliVersion": "0.1.205",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.205/dist/plasmic.schema.json"
+  "cliVersion": "0.1.222",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.222/dist/plasmic.schema.json"
 }

package/cpa-out/nextjs-pages-codegen-ts/components/plasmic/create_plasmic_app/PlasmicHomepage.tsx

@@ -14,9 +14,10 @@ import * as React from "react";
 
 import Head from "next/head";
 import Link, { LinkProps } from "next/link";
+import { useRouter } from "next/router";
 
 import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 
 import {
   hasVariant,
@@ -68,6 +69,13 @@ const __wrapUserPromise =
     return await promise;
   });
 
+function useNextRouter() {
+  try {
+    return useRouter();
+  } catch {}
+  return undefined;
+}
+
 function PlasmicHomepage__RenderFunc(props: {
   variants: PlasmicHomepage__VariantsArgs;
   args: PlasmicHomepage__ArgsType;
@@ -76,6 +84,7 @@ function PlasmicHomepage__RenderFunc(props: {
   forNode?: string;
 }) {
   const { variants, overrides, forNode } = props;
+  const __nextRouter = useNextRouter();
 
   const $ctx = ph.useDataEnv?.() || {};
   const args = React.useMemo(() => Object.assign({}, props.args), [props.args]);
@@ -84,9 +93,10 @@ function PlasmicHomepage__RenderFunc(props: {
     ...args,
     ...variants
   };
+  const refsRef = React.useRef({});
+  const $refs = refsRef.current;
 
   const currentUser = p.useCurrentUser?.() || {};
-
   const [$queries, setDollarQueries] = React.useState({});
 
   const globalVariants = ensureGlobalVariants({

package/cpa-out/nextjs-pages-codegen-ts/package.json

@@ -9,16 +9,14 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@next/font": "13.1.6",
-    "@plasmicapp/cli": "^0.1.205",
-    "@plasmicapp/host": "^1.0.100",
-    "@plasmicapp/react-web": "^0.2.150",
-    "@types/node": "18.11.18",
-    "@types/react": "18.0.27",
-    "@types/react-dom": "18.0.10",
-    "eslint": "8.33.0",
-    "eslint-config-next": "13.1.6",
-    "next": "13.1.6",
+    "@plasmicapp/cli": "^0.1.222",
+    "@plasmicapp/react-web": "^0.2.167",
+    "@types/node": "18.15.2",
+    "@types/react": "18.0.28",
+    "@types/react-dom": "18.0.11",
+    "eslint": "8.36.0",
+    "eslint-config-next": "13.2.4",
+    "next": "13.2.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "typescript": "4.9.5"

package/cpa-out/nextjs-pages-codegen-ts/pages/index.tsx

@@ -1,7 +1,7 @@
 // This is a skeleton starter React page generated by Plasmic.
 // This file is owned by you, feel free to edit as you see fit.
 import * as React from "react";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 
 import { ScreenVariantProvider } from "../components/plasmic/create_plasmic_app/PlasmicGlobalVariant__Screen";
 import { PlasmicHomepage } from "../components/plasmic/create_plasmic_app/PlasmicHomepage";

package/cpa-out/nextjs-pages-codegen-ts/pages/plasmic-host.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/host';
+import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/react-web/lib/host';
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/

package/cpa-out/nextjs-pages-codegen-ts/plasmic.json

@@ -74,6 +74,6 @@
   "nextjsConfig": {
     "pagesDir": "../pages"
   },
-  "cliVersion": "0.1.205",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.205/dist/plasmic.schema.json"
+  "cliVersion": "0.1.222",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.222/dist/plasmic.schema.json"
 }

package/cpa-out/nextjs-pages-codegen-ts/tsconfig.json

@@ -14,7 +14,6 @@
     "isolatedModules": true,
     "jsx": "preserve",
     "incremental": true,
-    "baseUrl": ".",
     "paths": {
       "@/*": ["./*"]
     }

package/cpa-out/nextjs-pages-loader-js/package.json

@@ -9,11 +9,10 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@next/font": "13.1.6",
-    "@plasmicapp/loader-nextjs": "^1.0.224",
-    "eslint": "8.33.0",
-    "eslint-config-next": "13.1.6",
-    "next": "13.1.6",
+    "@plasmicapp/loader-nextjs": "^1.0.233",
+    "eslint": "8.35.0",
+    "eslint-config-next": "13.2.3",
+    "next": "13.2.3",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   }

package/cpa-out/nextjs-pages-loader-js/pages/[[...catchall]].jsx

@@ -8,7 +8,7 @@ import {
 
 import Error from "next/error";
 import { useRouter } from "next/router";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 export default function PlasmicLoaderPage(props) {
   const { plasmicData, queryCache } = props;

package/cpa-out/nextjs-pages-loader-js/pages/plasmic-host.jsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { PlasmicCanvasHost } from '@plasmicapp/loader-nextjs';
-import { PLASMIC } from 'plasmic-init';
+import { PLASMIC } from '@/plasmic-init';
 
 export default function PlasmicHost() {
   return PLASMIC && <PlasmicCanvasHost />;

package/cpa-out/nextjs-pages-loader-ts/package.json

@@ -9,14 +9,13 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@next/font": "13.1.6",
-    "@plasmicapp/loader-nextjs": "^1.0.224",
-    "@types/node": "18.11.18",
-    "@types/react": "18.0.27",
-    "@types/react-dom": "18.0.10",
-    "eslint": "8.33.0",
-    "eslint-config-next": "13.1.6",
-    "next": "13.1.6",
+    "@plasmicapp/loader-nextjs": "^1.0.233",
+    "@types/node": "18.14.2",
+    "@types/react": "18.0.28",
+    "@types/react-dom": "18.0.11",
+    "eslint": "8.35.0",
+    "eslint-config-next": "13.2.3",
+    "next": "13.2.3",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "typescript": "4.9.5"

package/cpa-out/nextjs-pages-loader-ts/pages/[[...catchall]].tsx

@@ -9,7 +9,7 @@ import type { GetStaticPaths, GetStaticProps } from "next";
 
 import Error from "next/error";
 import { useRouter } from "next/router";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 export default function PlasmicLoaderPage(props: {
   plasmicData?: ComponentRenderData;

package/cpa-out/nextjs-pages-loader-ts/pages/plasmic-host.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { PlasmicCanvasHost } from '@plasmicapp/loader-nextjs';
-import { PLASMIC } from 'plasmic-init';
+import { PLASMIC } from '@/plasmic-init';
 
 export default function PlasmicHost() {
   return PLASMIC && <PlasmicCanvasHost />;

package/cpa-out/nextjs-pages-loader-ts/tsconfig.json

@@ -14,7 +14,6 @@
     "isolatedModules": true,
     "jsx": "preserve",
     "incremental": true,
-    "baseUrl": ".",
     "paths": {
       "@/*": ["./*"]
     }

package/cpa-out/react-codegen-js/package.json

@@ -3,9 +3,8 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@plasmicapp/cli": "^0.1.205",
-    "@plasmicapp/host": "^1.0.100",
-    "@plasmicapp/react-web": "^0.2.150",
+    "@plasmicapp/cli": "^0.1.222",
+    "@plasmicapp/react-web": "^0.2.167",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^13.0.0",
     "@testing-library/user-event": "^13.2.1",

package/cpa-out/react-codegen-js/plasmic.json

@@ -71,6 +71,6 @@
     ]
   },
   "wrapPagesWithGlobalContexts": true,
-  "cliVersion": "0.1.205",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.205/dist/plasmic.schema.json"
+  "cliVersion": "0.1.222",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.222/dist/plasmic.schema.json"
 }

package/cpa-out/react-codegen-js/src/components/plasmic/create_plasmic_app/PlasmicHomepage.jsx

@@ -10,7 +10,7 @@
 // Component: 6uuAAE1jiCew
 import * as React from "react";
 import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 import {
   hasVariant,
   classNames,
@@ -44,6 +44,8 @@ function PlasmicHomepage__RenderFunc(props) {
     ...args,
     ...variants
   };
+  const refsRef = React.useRef({});
+  const $refs = refsRef.current;
   const currentUser = p.useCurrentUser?.() || {};
   const [$queries, setDollarQueries] = React.useState({});
   const globalVariants = ensureGlobalVariants({

package/cpa-out/react-codegen-ts/package.json

@@ -3,9 +3,8 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@plasmicapp/cli": "^0.1.205",
-    "@plasmicapp/host": "^1.0.100",
-    "@plasmicapp/react-web": "^0.2.150",
+    "@plasmicapp/cli": "^0.1.222",
+    "@plasmicapp/react-web": "^0.2.167",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^13.0.0",
     "@testing-library/user-event": "^13.2.1",

package/cpa-out/react-codegen-ts/plasmic.json

@@ -71,6 +71,6 @@
     ]
   },
   "wrapPagesWithGlobalContexts": true,
-  "cliVersion": "0.1.205",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.205/dist/plasmic.schema.json"
+  "cliVersion": "0.1.222",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.222/dist/plasmic.schema.json"
 }

package/cpa-out/react-codegen-ts/src/components/plasmic/create_plasmic_app/PlasmicHomepage.tsx

@@ -13,7 +13,7 @@
 import * as React from "react";
 
 import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/host";
+import * as ph from "@plasmicapp/react-web/lib/host";
 
 import {
   hasVariant,
@@ -83,9 +83,10 @@ function PlasmicHomepage__RenderFunc(props: {
     ...args,
     ...variants
   };
+  const refsRef = React.useRef({});
+  const $refs = refsRef.current;
 
   const currentUser = p.useCurrentUser?.() || {};
-
   const [$queries, setDollarQueries] = React.useState({});
 
   const globalVariants = ensureGlobalVariants({

package/dist/gatsby/template.js

@@ -114,7 +114,7 @@ export default function Host({ data }${(0, file_utils_1.ifTs)(jsOrTs, ": HostPro
     }
     else {
         return `import * as React from "react"
-import { PlasmicCanvasHost, registerComponent } from "@plasmicapp/host";
+import { PlasmicCanvasHost, registerComponent } from "@plasmicapp/react-web/lib/host";
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/

package/dist/nextjs/templates/app-loader/catchall-page.js

@@ -5,8 +5,8 @@ const file_utils_1 = require("../../../utils/file-utils");
 function makeCatchallPage_app_loader(jsOrTs) {
     return `import { PlasmicComponent } from "@plasmicapp/loader-nextjs";
 import { notFound } from "next/navigation";
-import { PLASMIC } from "plasmic-init";
-import { ClientPlasmicRootProvider } from "plasmic-init-client";
+import { PLASMIC } from "@/plasmic-init";
+import { ClientPlasmicRootProvider } from "@/plasmic-init-client";
 
 // Use revalidate if you want incremental static regeneration
 export const revalidate = 60;

package/dist/nextjs/templates/app-loader/plasmic-host.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.makePlasmicHostPage_app_loader = void 0;
 function makePlasmicHostPage_app_loader() {
     return `import { PlasmicCanvasHost } from "@plasmicapp/loader-nextjs";
-import "plasmic-init-client";
+import "@/plasmic-init-client";
 
 export default function PlasmicHost() {
   return <PlasmicCanvasHost />;

package/dist/nextjs/templates/app-loader/plasmic-init-client.js

@@ -6,7 +6,7 @@ function makePlasmicInitClient_app_loader(jsOrTs) {
     return `"use client";
 
 import { PlasmicRootProvider } from "@plasmicapp/loader-nextjs";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/
@@ -27,7 +27,7 @@ import { PLASMIC } from "plasmic-init";
  * In a Server Component like app/<your-path>/path.tsx, rendering the following would not work:
  *
  * \`\`\`tsx
- * import { PLASMIC } from "plasmic-init";
+ * import { PLASMIC } from "@/plasmic-init";
  * import { PlasmicRootProvider } from "plasmicapp/loader-nextjs";
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
@@ -47,8 +47,8 @@ import { PLASMIC } from "plasmic-init";
  * while allowing your Server Component to pass in prefetched data and other serializable props:
  *
  * \`\`\`tsx
- * import { PLASMIC } from "plasmic-init";
- * import { ClientPlasmicRootProvider } from "plasmic-init-client"; // changed
+ * import { PLASMIC } from "@/plasmic-init";
+ * import { ClientPlasmicRootProvider } from "@/plasmic-init-client"; // changed
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
  *   return (

package/dist/nextjs/templates/pages-codegen/plasmic-host.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.makePlasmicHostPage_pages_codegen = void 0;
 function makePlasmicHostPage_pages_codegen() {
     return `import * as React from 'react';
-import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/host';
+import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/react-web/lib/host';
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/

package/dist/nextjs/templates/pages-loader/catchall-page.js

@@ -13,7 +13,7 @@ import {
 ${(0, file_utils_1.ifTs)(jsOrTs, `import type { GetStaticPaths, GetStaticProps } from "next";\n`)}
 import Error from "next/error";
 import { useRouter } from "next/router";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 export default function PlasmicLoaderPage(props${(0, file_utils_1.ifTs)(jsOrTs, `: {
   plasmicData?: ComponentRenderData;

package/dist/nextjs/templates/pages-loader/plasmic-host.js

@@ -4,7 +4,7 @@ exports.makePlasmicHostPage_pages_loader = void 0;
 function makePlasmicHostPage_pages_loader() {
     return `import * as React from 'react';
 import { PlasmicCanvasHost } from '@plasmicapp/loader-nextjs';
-import { PLASMIC } from 'plasmic-init';
+import { PLASMIC } from '@/plasmic-init';
 
 export default function PlasmicHost() {
   return PLASMIC && <PlasmicCanvasHost />;

package/dist/utils/codegen.js

@@ -16,8 +16,7 @@ const npm_utils_1 = require("../utils/npm-utils");
 function installCodegenDeps(opts) {
     return __awaiter(this, void 0, void 0, function* () {
         const { projectPath } = opts;
-        return ((yield (0, npm_utils_1.installUpgrade)("@plasmicapp/cli", { workingDir: projectPath })) &&
-            (yield (0, npm_utils_1.installUpgrade)("@plasmicapp/host", { workingDir: projectPath })));
+        return yield (0, npm_utils_1.installUpgrade)("@plasmicapp/cli", { workingDir: projectPath });
     });
 }
 exports.installCodegenDeps = installCodegenDeps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-plasmic-app",
-  "version": "0.0.64",
+  "version": "0.0.66",
   "description": "Create Plasmic-powered React apps",
   "main": "./dist/lib.js",
   "types": "./dist/lib.d.ts",
@@ -55,5 +55,5 @@
     "validate-npm-package-name": "^3.0.0",
     "yargs": "^16.2.0"
   },
-  "gitHead": "56c15e54ed33294aaef992171bbb1b3ab1aa6c3a"
+  "gitHead": "67e119ae46c42a2b4440cd98b4d168d0b69ca229"
 }

package/src/gatsby/template.ts

@@ -134,7 +134,7 @@ export default function Host({ data }${ifTs(jsOrTs, ": HostProps")}) {
 `;
   } else {
     return `import * as React from "react"
-import { PlasmicCanvasHost, registerComponent } from "@plasmicapp/host";
+import { PlasmicCanvasHost, registerComponent } from "@plasmicapp/react-web/lib/host";
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/

package/src/nextjs/templates/app-loader/catchall-page.ts

@@ -4,8 +4,8 @@ import { JsOrTs } from "../../../utils/types";
 export function makeCatchallPage_app_loader(jsOrTs: JsOrTs): string {
   return `import { PlasmicComponent } from "@plasmicapp/loader-nextjs";
 import { notFound } from "next/navigation";
-import { PLASMIC } from "plasmic-init";
-import { ClientPlasmicRootProvider } from "plasmic-init-client";
+import { PLASMIC } from "@/plasmic-init";
+import { ClientPlasmicRootProvider } from "@/plasmic-init-client";
 
 // Use revalidate if you want incremental static regeneration
 export const revalidate = 60;

package/src/nextjs/templates/app-loader/plasmic-host.ts

@@ -1,6 +1,6 @@
 export function makePlasmicHostPage_app_loader(): string {
   return `import { PlasmicCanvasHost } from "@plasmicapp/loader-nextjs";
-import "plasmic-init-client";
+import "@/plasmic-init-client";
 
 export default function PlasmicHost() {
   return <PlasmicCanvasHost />;

package/src/nextjs/templates/app-loader/plasmic-init-client.ts

@@ -5,7 +5,7 @@ export function makePlasmicInitClient_app_loader(jsOrTs: JsOrTs): string {
   return `"use client";
 
 import { PlasmicRootProvider } from "@plasmicapp/loader-nextjs";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/
@@ -26,7 +26,7 @@ import { PLASMIC } from "plasmic-init";
  * In a Server Component like app/<your-path>/path.tsx, rendering the following would not work:
  *
  * \`\`\`tsx
- * import { PLASMIC } from "plasmic-init";
+ * import { PLASMIC } from "@/plasmic-init";
  * import { PlasmicRootProvider } from "plasmicapp/loader-nextjs";
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
@@ -46,8 +46,8 @@ import { PLASMIC } from "plasmic-init";
  * while allowing your Server Component to pass in prefetched data and other serializable props:
  *
  * \`\`\`tsx
- * import { PLASMIC } from "plasmic-init";
- * import { ClientPlasmicRootProvider } from "plasmic-init-client"; // changed
+ * import { PLASMIC } from "@/plasmic-init";
+ * import { ClientPlasmicRootProvider } from "@/plasmic-init-client"; // changed
  * export default function MyPage() {
  *   const prefetchedData = await PLASMIC.fetchComponentData("YourPage");
  *   return (

package/src/nextjs/templates/pages-codegen/plasmic-host.ts

@@ -1,6 +1,6 @@
 export function makePlasmicHostPage_pages_codegen(): string {
   return `import * as React from 'react';
-import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/host';
+import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/react-web/lib/host';
 
 // You can register any code components that you want to use here; see
 // https://docs.plasmic.app/learn/code-components-ref/

package/src/nextjs/templates/pages-loader/catchall-page.ts

@@ -12,7 +12,7 @@ import {
 ${ifTs(jsOrTs, `import type { GetStaticPaths, GetStaticProps } from "next";\n`)}
 import Error from "next/error";
 import { useRouter } from "next/router";
-import { PLASMIC } from "plasmic-init";
+import { PLASMIC } from "@/plasmic-init";
 
 export default function PlasmicLoaderPage(props${ifTs(
     jsOrTs,

package/src/nextjs/templates/pages-loader/plasmic-host.ts

@@ -1,7 +1,7 @@
 export function makePlasmicHostPage_pages_loader(): string {
   return `import * as React from 'react';
 import { PlasmicCanvasHost } from '@plasmicapp/loader-nextjs';
-import { PLASMIC } from 'plasmic-init';
+import { PLASMIC } from '@/plasmic-init';
 
 export default function PlasmicHost() {
   return PLASMIC && <PlasmicCanvasHost />;

package/src/utils/codegen.ts

@@ -4,10 +4,7 @@ import { installUpgrade } from "../utils/npm-utils";
 
 export async function installCodegenDeps(opts: { projectPath: string }) {
   const { projectPath } = opts;
-  return (
-    (await installUpgrade("@plasmicapp/cli", { workingDir: projectPath })) &&
-    (await installUpgrade("@plasmicapp/host", { workingDir: projectPath }))
-  );
+  return await installUpgrade("@plasmicapp/cli", { workingDir: projectPath });
 }
 
 export async function runCodegenSync(opts: {

package/cpa-out/nextjs-app-loader-js/app/head.js

@@ -1,10 +0,0 @@
-export default function Head() {
-  return (
-    <>
-      <title>Create Next App</title>
-      <meta content="width=device-width, initial-scale=1" name="viewport" />
-      <meta name="description" content="Generated by create next app" />
-      <link rel="icon" href="/favicon.ico" />
-    </>
-  )
-}

package/cpa-out/nextjs-app-loader-js/pages/api/hello.js

@@ -1,5 +0,0 @@
-// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
-
-export default function handler(req, res) {
-  res.status(200).json({ name: 'John Doe' })
-}

package/cpa-out/nextjs-app-loader-ts/app/head.tsx

@@ -1,10 +0,0 @@
-export default function Head() {
-  return (
-    <>
-      <title>Create Next App</title>
-      <meta content="width=device-width, initial-scale=1" name="viewport" />
-      <meta name="description" content="Generated by create next app" />
-      <link rel="icon" href="/favicon.ico" />
-    </>
-  )
-}

package/cpa-out/nextjs-app-loader-ts/pages/api/hello.ts

@@ -1,13 +0,0 @@
-// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
-import type { NextApiRequest, NextApiResponse } from 'next'
-
-type Data = {
-  name: string
-}
-
-export default function handler(
-  req: NextApiRequest,
-  res: NextApiResponse<Data>
-) {
-  res.status(200).json({ name: 'John Doe' })
-}