create-plasmic-app 0.0.150 → 0.0.152

package/cpa-out/nextjs-app-codegen-js/components/plasmic/create_plasmic_app/PlasmicDynamicPageServer.jsx

@@ -9,6 +9,8 @@ import * as React from "react";
 import { ClientDynamicPage } from "../../../app/dynamic/[slug]/page-client"; // plasmic-import: AO44A-w7hh/rscClient
 
 const $$ = {};
+import { unstable_executePlasmicQueries } from "@plasmicapp/react-web/lib/data-sources";
+import { PlasmicQueryDataProvider } from "@plasmicapp/react-web/lib/query";
 
 export function generateDynamicMetadata($q, $ctx) {
   return {
@@ -19,6 +21,95 @@ export function generateDynamicMetadata($q, $ctx) {
   };
 }
 
+export const serverQueryTree = {
+  type: "component",
+  queries: {
+    sha256: {
+      id: "custom:krgWtF9Kkesx",
+      fn: async ({ $q, $props, $ctx, $state }) => {
+        console.log("Running SHA-256");
+        const data = new TextEncoder().encode($ctx.params.slug);
+        const hash = await crypto.subtle.digest("SHA-256", data);
+        return [...new Uint8Array(hash)]
+          .map(b => b.toString(16).padStart(2, "0"))
+          .join("-");
+      },
+      args: ({ $q, $props, $ctx, $state }) => {
+        return [
+          {
+            $ctx: {
+              params: $ctx["params"]
+            },
+            $props: {},
+            $q: {},
+            $state: {}
+          }
+        ];
+      }
+    }
+  },
+  stateSpecs: [],
+  propsContext: {},
+  children: [
+    {
+      type: "component",
+      queries: {},
+      stateSpecs: [],
+      propsContext: {},
+      children: [
+        {
+          type: "component",
+          queries: {},
+          stateSpecs: [
+            {
+              path: "showStartIcon",
+              type: "private",
+              variableType: "variant",
+              initFunc: ({ $props, $state, $queries, $q, $ctx }) =>
+                $props.showStartIcon
+            },
+            {
+              path: "showEndIcon",
+              type: "private",
+              variableType: "variant",
+              initFunc: ({ $props, $state, $queries, $q, $ctx }) =>
+                $props.showEndIcon
+            },
+            {
+              path: "isDisabled",
+              type: "private",
+              variableType: "variant",
+              initFunc: ({ $props, $state, $queries, $q, $ctx }) =>
+                $props.isDisabled
+            },
+            {
+              path: "shape",
+              type: "private",
+              variableType: "variant",
+              initFunc: ({ $props, $state, $queries, $q, $ctx }) => $props.shape
+            },
+            {
+              path: "size",
+              type: "private",
+              variableType: "variant",
+              initFunc: ({ $props, $state, $queries, $q, $ctx }) => $props.size
+            },
+            {
+              path: "color",
+              type: "private",
+              variableType: "variant",
+              initFunc: ({ $props, $state, $queries, $q, $ctx }) => $props.color
+            }
+          ],
+
+          propsContext: { submitsForm: ({ $q, $props, $ctx, $state }) => true },
+          children: []
+        }
+      ]
+    }
+  ]
+};
+
 function mkPathFromRouteAndParams(route, params) {
   if (!params) {
     return route;
@@ -51,6 +142,16 @@ export async function makeAppRouterPageCtx({ params, searchParams }) {
   return ctx;
 }
 
-export function PlasmicDynamicPageServer(props) {
-  return <ClientDynamicPage {...props} />;
+export async function PlasmicDynamicPageServer(props) {
+  const { params, searchParams, ...rest } = props;
+  const ctx = await makeAppRouterPageCtx({ params, searchParams });
+  const { cache: prefetchedCache } = await unstable_executePlasmicQueries(
+    serverQueryTree,
+    { $props: rest, $ctx: ctx }
+  );
+  return (
+    <PlasmicQueryDataProvider prefetchedCache={prefetchedCache}>
+      <ClientDynamicPage {...rest} />
+    </PlasmicQueryDataProvider>
+  );
 }

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

@@ -124,7 +124,9 @@ function PlasmicHomepage__RenderFunc(props) {
                 sty.h1
               )}
             >
-              {"create-plasmic-app"}
+              {hasVariant(globalVariants, "screen", "desktopOnly")
+                ? "create-plasmic-app"
+                : "cpa"}
             </h1>
             <div
               data-plasmic-name={"text"}
@@ -135,44 +137,9 @@ function PlasmicHomepage__RenderFunc(props) {
                 sty.text
               )}
             >
-              {hasVariant(globalVariants, "screen", "desktopOnly") ? (
-                <React.Fragment>
-                  <React.Fragment>
-                    {
-                      "This project is used by run-cpa.ts in the create-plasmic-app repo.\n\nrun-cpa.ts runs create-plasmic-app for many combinations of args (e.g. nextjs + appDir + loader + typescript) to check for changes in generated files. Any changes to this project will result in lots of changes to the generated files. "
-                    }
-                  </React.Fragment>
-                  <span
-                    className={
-                      "plasmic_default__all plasmic_default__span plasmic_default__span__47tFX"
-                    }
-                    style={{ fontWeight: 700 }}
-                  >
-                    {"Therefore, please avoid changing this project."}
-                  </span>
-                </React.Fragment>
-              ) : (
-                <React.Fragment>
-                  <React.Fragment>
-                    {
-                      "If you haven't already done so, go back and learn the basics by going through the Plasmic Levels tutorial.\n\nIt's always easier to start from examples! Add a new page using a template\u2014do this from the list of pages in the top left (the gray + button).\n\nOr press the big blue + button to start dragging items into this page.\n\nIntegrate this project into your codebase\u2014press the "
-                    }
-                  </React.Fragment>
-                  <span
-                    className={
-                      "plasmic_default__all plasmic_default__span plasmic_default__span__47tFX"
-                    }
-                    style={{ fontWeight: 700 }}
-                  >
-                    {"Code"}
-                  </span>
-                  <React.Fragment>
-                    {
-                      " button in the top right and follow the quickstart instructions.\n\nJoin our Slack community (icon in bottom left) for help any time."
-                    }
-                  </React.Fragment>
-                </React.Fragment>
-              )}
+              {
+                "This project is used by run-cpa.ts in the create-plasmic-app repo.\n\n\nrun-cpa.ts runs create-plasmic-app for many combinations of args (e.g. nextjs + appDir + loader + typescript) to check for changes in generated files. Any changes to this project will result in lots of changes to the generated files. Therefore, please avoid changing this project.\n"
+              }
             </div>
             <RandomDynamicPageButton
               data-plasmic-name={"randomDynamicPageButton"}

package/cpa-out/nextjs-app-codegen-js/components/plasmic/create_plasmic_app/PlasmicHomepage.module.css

@@ -0,0 +1,43 @@
+.root {
+  display: flex;
+  position: relative;
+  width: 100%;
+  height: 100%;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  min-width: 0;
+  min-height: 0;
+  padding: 0px;
+}
+.section {
+  display: flex;
+  position: relative;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-start;
+  width: 100%;
+  height: auto;
+  max-width: 100%;
+  row-gap: 16px;
+  min-width: 0;
+  padding: 96px 24px;
+}
+.h1 {
+  position: relative;
+  max-width: 800px;
+  height: auto;
+  width: 100%;
+  min-width: 0;
+}
+.text {
+  position: relative;
+  max-width: 800px;
+  height: auto;
+  width: 100%;
+  min-width: 0;
+}
+.randomDynamicPageButton:global(.__wab_instance):global(.__wab_instance) {
+  max-width: 100%;
+  position: relative;
+}

package/cpa-out/nextjs-app-codegen-js/components/plasmic/create_plasmic_app/PlasmicRandomDynamicPageButton.module.css

@@ -0,0 +1,16 @@
+.root:global(.__wab_instance) {
+  max-width: 100%;
+  position: relative;
+}
+.svg__p2Hdu {
+  position: relative;
+  object-fit: cover;
+  width: auto;
+  height: 1em;
+}
+.svg__jkBz {
+  position: relative;
+  object-fit: cover;
+  width: auto;
+  height: 1em;
+}