create-plasmic-app 0.0.42 → 0.0.45

package/dist/index.js

@@ -202,8 +202,8 @@ function run() {
             const rawProjectId = yield maybePrompt({
                 name: "projectId",
                 message: `What is the URL of your project?
-(If you don't have a project yet, create one by going to
-https://studio.plasmic.app/starters/simple-light):
+If you don't have a project yet, create one by going to
+https://studio.plasmic.app/starters/simple-light
 `,
             });
             projectId = rawProjectId

package/dist/templates/gatsby.js

@@ -48,7 +48,7 @@ const PlasmicGatsbyPage = ({ data }${file_utils_1.ifTs(ts, ": PlasmicGatsbyPageP
         {pageMetadata.description && <meta property="og:description" content={pageMetadata.description} />}
         {pageMetadata.openGraphImageUrl && <meta property="og:image" content={pageMetadata.openGraphImageUrl} />}
       </Helmet>
-      <PlasmicComponent component={pageMeta.name} />
+      <PlasmicComponent component={pageMeta.displayName} />
     </PlasmicRootProvider>
   );
 };
@@ -140,16 +140,7 @@ exports.GATSBY_SSR_CONFIG = `
 
 const React = require("react")
 
-/**
- * Add preamble to allow functional code components in studio.
- *
- * See: https://docs.plasmic.app/learn/functional-code-components/
- */
 const HeadComponents = [
-  <script
-    key="plasmic-preamble"
-    src="https://static1.plasmic.app/preamble.js"
-  />,
   <script
     key="plasmic-hmr"
     type="text/javascript"

package/dist/templates/nextjs.js

@@ -58,7 +58,7 @@ export default function PlasmicLoaderPage(props${file_utils_1.ifTs(ts, `: {
       prefetchedData={plasmicData}
       prefetchedQueryData={queryCache}
     >
-      <PlasmicComponent component={plasmicData.entryCompMetas[0].name} />
+      <PlasmicComponent component={plasmicData.entryCompMetas[0].displayName} />
     </PlasmicRootProvider>
   );
 }
@@ -74,7 +74,7 @@ export const getStaticProps${file_utils_1.ifTs(ts, `: GetStaticProps`)} = async
   // Cache the necessary data fetched for the page
   const queryCache = await extractPlasmicQueryData(
     <PlasmicRootProvider loader={PLASMIC} prefetchedData={plasmicData}>
-      <PlasmicComponent component={plasmicData.entryCompMetas[0].name} />
+      <PlasmicComponent component={plasmicData.entryCompMetas[0].displayName} />
     </PlasmicRootProvider>
   );
   // Use revalidate if you want incremental static regeneration
@@ -110,15 +110,7 @@ import { PlasmicCanvasHost } from '@plasmicapp/loader-nextjs';
 import { PLASMIC } from '../plasmic-init';
 
 export default function PlasmicHost() {
-  return PLASMIC && (
-    <div>
-      <Script
-        src="https://static1.plasmic.app/preamble.js"
-        strategy="beforeInteractive"
-      />
-      <PlasmicCanvasHost />
-    </div>
-  );
+  return PLASMIC && <PlasmicCanvasHost />;
 }
     `;
     }
@@ -137,15 +129,7 @@ import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/host';
 // registerComponent(...)
 
 export default function PlasmicHost() {
-  return (
-    <div>
-      <Script
-        src="https://static1.plasmic.app/preamble.js"
-        strategy="beforeInteractive"
-      />
-      <PlasmicCanvasHost />
-    </div>
-  );
+  return <PlasmicCanvasHost />;
 }
     `;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-plasmic-app",
-  "version": "0.0.42",
+  "version": "0.0.45",
   "description": "Create Plasmic-powered React apps",
   "main": "./dist/lib.js",
   "types": "./dist/lib.d.ts",

package/src/index.ts

@@ -185,8 +185,8 @@ async function run(): Promise<void> {
     const rawProjectId = await maybePrompt({
       name: "projectId",
       message: `What is the URL of your project?
-(If you don't have a project yet, create one by going to
-https://studio.plasmic.app/starters/simple-light):
+If you don't have a project yet, create one by going to
+https://studio.plasmic.app/starters/simple-light
 `,
     });
     projectId = rawProjectId

package/src/templates/gatsby.ts

@@ -53,7 +53,7 @@ const PlasmicGatsbyPage = ({ data }${ifTs(ts, ": PlasmicGatsbyPageProps")}) => {
         {pageMetadata.description && <meta property="og:description" content={pageMetadata.description} />}
         {pageMetadata.openGraphImageUrl && <meta property="og:image" content={pageMetadata.openGraphImageUrl} />}
       </Helmet>
-      <PlasmicComponent component={pageMeta.name} />
+      <PlasmicComponent component={pageMeta.displayName} />
     </PlasmicRootProvider>
   );
 };
@@ -157,16 +157,7 @@ export const GATSBY_SSR_CONFIG = `
 
 const React = require("react")
 
-/**
- * Add preamble to allow functional code components in studio.
- *
- * See: https://docs.plasmic.app/learn/functional-code-components/
- */
 const HeadComponents = [
-  <script
-    key="plasmic-preamble"
-    src="https://static1.plasmic.app/preamble.js"
-  />,
   <script
     key="plasmic-hmr"
     type="text/javascript"
@@ -235,7 +226,7 @@ export function initPlasmicLoaderWithRegistrations(plasmicOptions${ifTs(
 `.trim();
 };
 
-export function wrapAppRootForCodegen() {
+export function wrapAppRootForCodegen(): string {
   return `
 import React from "react";
 import { PlasmicRootProvider } from "@plasmicapp/react-web";

package/src/templates/nextjs.ts

@@ -64,7 +64,7 @@ export default function PlasmicLoaderPage(props${ifTs(
       prefetchedData={plasmicData}
       prefetchedQueryData={queryCache}
     >
-      <PlasmicComponent component={plasmicData.entryCompMetas[0].name} />
+      <PlasmicComponent component={plasmicData.entryCompMetas[0].displayName} />
     </PlasmicRootProvider>
   );
 }
@@ -83,7 +83,7 @@ export const getStaticProps${ifTs(
   // Cache the necessary data fetched for the page
   const queryCache = await extractPlasmicQueryData(
     <PlasmicRootProvider loader={PLASMIC} prefetchedData={plasmicData}>
-      <PlasmicComponent component={plasmicData.entryCompMetas[0].name} />
+      <PlasmicComponent component={plasmicData.entryCompMetas[0].displayName} />
     </PlasmicRootProvider>
   );
   // Use revalidate if you want incremental static regeneration
@@ -120,15 +120,7 @@ import { PlasmicCanvasHost } from '@plasmicapp/loader-nextjs';
 import { PLASMIC } from '../plasmic-init';
 
 export default function PlasmicHost() {
-  return PLASMIC && (
-    <div>
-      <Script
-        src="https://static1.plasmic.app/preamble.js"
-        strategy="beforeInteractive"
-      />
-      <PlasmicCanvasHost />
-    </div>
-  );
+  return PLASMIC && <PlasmicCanvasHost />;
 }
     `;
   } else {
@@ -146,21 +138,13 @@ import { PlasmicCanvasHost, registerComponent } from '@plasmicapp/host';
 // registerComponent(...)
 
 export default function PlasmicHost() {
-  return (
-    <div>
-      <Script
-        src="https://static1.plasmic.app/preamble.js"
-        strategy="beforeInteractive"
-      />
-      <PlasmicCanvasHost />
-    </div>
-  );
+  return <PlasmicCanvasHost />;
 }
     `;
   }
 }
 
-export function wrapAppRootForCodegen() {
+export function wrapAppRootForCodegen(): string {
   return `
 import '../styles/globals.css'
 import { PlasmicRootProvider } from "@plasmicapp/react-web";