create-plasmic-app 0.0.96 → 0.0.98

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

@@ -9,46 +9,48 @@
 // Plasmic Project: 47tFXWjN2C4NyHFGGpaYQ3
 // Component: 6uuAAE1jiCew
 import * as React from "react";
-import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/react-web/lib/host";
 import {
-  hasVariant,
+  Stack as Stack__,
   classNames,
   createPlasmicElementProxy,
   deriveRenderOpts,
-  ensureGlobalVariants
+  ensureGlobalVariants,
+  hasVariant
 } from "@plasmicapp/react-web";
+import { useDataEnv } from "@plasmicapp/react-web/lib/host";
 import RandomDynamicPageButton from "../../RandomDynamicPageButton"; // plasmic-import: Q23H1_1M_P/component
 import { useScreenVariants as useScreenVariantsscBjPxgdxdzbv } from "./PlasmicGlobalVariant__Screen"; // plasmic-import: SCBjPXGDXDZBV/globalVariant
 import "@plasmicapp/react-web/lib/plasmic.css";
-import projectcss from "./plasmic_create_plasmic_app.module.css"; // plasmic-import: 47tFXWjN2C4NyHFGGpaYQ3/projectcss
+import projectcss from "./plasmic.module.css"; // plasmic-import: 47tFXWjN2C4NyHFGGpaYQ3/projectcss
 import sty from "./PlasmicHomepage.module.css"; // plasmic-import: 6uuAAE1jiCew/css
 
+createPlasmicElementProxy;
+
 export const PlasmicHomepage__VariantProps = new Array();
 
 export const PlasmicHomepage__ArgProps = new Array();
 
-const __wrapUserFunction =
-  globalThis.__PlasmicWrapUserFunction ?? ((loc, fn) => fn());
-
-const __wrapUserPromise =
-  globalThis.__PlasmicWrapUserPromise ??
-  (async (loc, promise) => {
-    return await promise;
-  });
+const $$ = {};
 
 function PlasmicHomepage__RenderFunc(props) {
   const { variants, overrides, forNode } = props;
-  const $ctx = ph.useDataEnv?.() || {};
-  const args = React.useMemo(() => Object.assign({}, props.args), [props.args]);
+  const args = React.useMemo(
+    () =>
+      Object.assign(
+        {},
+        Object.fromEntries(
+          Object.entries(props.args).filter(([_, v]) => v !== undefined)
+        )
+      ),
+    [props.args]
+  );
   const $props = {
     ...args,
     ...variants
   };
+  const $ctx = useDataEnv?.() || {};
   const refsRef = React.useRef({});
   const $refs = refsRef.current;
-  const currentUser = p.useCurrentUser?.() || {};
-  const [$queries, setDollarQueries] = React.useState({});
   const globalVariants = ensureGlobalVariants({
     screen: useScreenVariantsscBjPxgdxdzbv()
   });
@@ -65,10 +67,11 @@ function PlasmicHomepage__RenderFunc(props) {
             projectcss.root_reset,
             projectcss.plasmic_default_styles,
             projectcss.plasmic_mixins,
+            projectcss.plasmic_tokens,
             sty.root
           )}
         >
-          <p.Stack
+          <Stack__
             as={"section"}
             data-plasmic-name={"section"}
             data-plasmic-override={overrides.section}
@@ -87,7 +90,6 @@ function PlasmicHomepage__RenderFunc(props) {
             >
               {"create-plasmic-app"}
             </h1>
-
             <div
               data-plasmic-name={"text"}
               data-plasmic-override={overrides.text}
@@ -115,7 +117,7 @@ function PlasmicHomepage__RenderFunc(props) {
                 <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—do 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—press the "
+                      "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
@@ -132,7 +134,6 @@ function PlasmicHomepage__RenderFunc(props) {
                 </React.Fragment>
               )}
             </div>
-
             <RandomDynamicPageButton
               data-plasmic-name={"randomDynamicPageButton"}
               data-plasmic-override={overrides.randomDynamicPageButton}
@@ -141,7 +142,7 @@ function PlasmicHomepage__RenderFunc(props) {
                 sty.randomDynamicPageButton
               )}
             />
-          </p.Stack>
+          </Stack__>
         </div>
       </div>
     </React.Fragment>
@@ -162,13 +163,12 @@ function makeNodeComponent(nodeName) {
       () =>
         deriveRenderOpts(props, {
           name: nodeName,
-          descendantNames: [...PlasmicDescendants[nodeName]],
+          descendantNames: PlasmicDescendants[nodeName],
           internalArgPropNames: PlasmicHomepage__ArgProps,
           internalVariantPropNames: PlasmicHomepage__VariantProps
         }),
       [props, nodeName]
     );
-
     return PlasmicHomepage__RenderFunc({
       variants,
       args,

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

@@ -9,42 +9,43 @@
 // Plasmic Project: 47tFXWjN2C4NyHFGGpaYQ3
 // Component: Q23H1_1M_P
 import * as React from "react";
-import * as p from "@plasmicapp/react-web";
-import * as ph from "@plasmicapp/react-web/lib/host";
 import {
   classNames,
   createPlasmicElementProxy,
   deriveRenderOpts
 } from "@plasmicapp/react-web";
+import { useDataEnv } from "@plasmicapp/react-web/lib/host";
 import Button from "../../Button"; // plasmic-import: TQcvW_pSKi3/component
 import "@plasmicapp/react-web/lib/plasmic.css";
 import sty from "./PlasmicRandomDynamicPageButton.module.css"; // plasmic-import: Q23H1_1M_P/css
 
+createPlasmicElementProxy;
+
 export const PlasmicRandomDynamicPageButton__VariantProps = new Array();
 
 export const PlasmicRandomDynamicPageButton__ArgProps = new Array();
 
-const __wrapUserFunction =
-  globalThis.__PlasmicWrapUserFunction ?? ((loc, fn) => fn());
-
-const __wrapUserPromise =
-  globalThis.__PlasmicWrapUserPromise ??
-  (async (loc, promise) => {
-    return await promise;
-  });
+const $$ = {};
 
 function PlasmicRandomDynamicPageButton__RenderFunc(props) {
   const { variants, overrides, forNode } = props;
-  const $ctx = ph.useDataEnv?.() || {};
-  const args = React.useMemo(() => Object.assign({}, props.args), [props.args]);
+  const args = React.useMemo(
+    () =>
+      Object.assign(
+        {},
+        Object.fromEntries(
+          Object.entries(props.args).filter(([_, v]) => v !== undefined)
+        )
+      ),
+    [props.args]
+  );
   const $props = {
     ...args,
     ...variants
   };
+  const $ctx = useDataEnv?.() || {};
   const refsRef = React.useRef({});
   const $refs = refsRef.current;
-  const currentUser = p.useCurrentUser?.() || {};
-  const [$queries, setDollarQueries] = React.useState({});
   return (
     <Button
       data-plasmic-name={"root"}
@@ -57,57 +58,43 @@ function PlasmicRandomDynamicPageButton__RenderFunc(props) {
         $steps["goToDynamicPage"] = true
           ? (() => {
               const actionArgs = {
-                destination: __wrapUserFunction(
-                  {
-                    type: "InteractionArgLoc",
-                    actionName: "navigation",
-                    interactionUuid: "9Y3jL0zxjA",
-                    componentUuid: "Q23H1_1M_P",
-                    argName: "destination"
-                  },
-                  () =>
-                    `/dynamic/${(() => {
-                      try {
-                        return Math.random().toString(36).slice(2);
-                      } catch (e) {
-                        if (e instanceof TypeError) {
-                          return "value";
-                        }
-                        throw e;
-                      }
-                    })()}`
-                )
+                destination: `/dynamic/${(() => {
+                  try {
+                    return Math.random().toString(36).slice(2);
+                  } catch (e) {
+                    if (
+                      e instanceof TypeError ||
+                      e?.plasmicType === "PlasmicUndefinedDataError"
+                    ) {
+                      return "value";
+                    }
+                    throw e;
+                  }
+                })()}`
               };
-              return __wrapUserFunction(
-                {
-                  type: "InteractionLoc",
-                  actionName: "navigation",
-                  interactionUuid: "9Y3jL0zxjA",
-                  componentUuid: "Q23H1_1M_P"
-                },
-                () =>
-                  (({ destination }) => {
-                    location.assign(destination);
-                  })?.apply(null, [actionArgs]),
-                actionArgs
-              );
+              return (({ destination }) => {
+                if (
+                  typeof destination === "string" &&
+                  destination.startsWith("#")
+                ) {
+                  document
+                    .getElementById(destination.substr(1))
+                    .scrollIntoView({ behavior: "smooth" });
+                } else {
+                  location.assign(destination);
+                }
+              })?.apply(null, [actionArgs]);
             })()
           : undefined;
         if (
+          $steps["goToDynamicPage"] != null &&
           typeof $steps["goToDynamicPage"] === "object" &&
           typeof $steps["goToDynamicPage"].then === "function"
         ) {
-          $steps["goToDynamicPage"] = await __wrapUserPromise(
-            {
-              type: "InteractionLoc",
-              actionName: "navigation",
-              interactionUuid: "9Y3jL0zxjA",
-              componentUuid: "Q23H1_1M_P"
-            },
-            $steps["goToDynamicPage"]
-          );
+          $steps["goToDynamicPage"] = await $steps["goToDynamicPage"];
         }
       }}
+      submitsForm={true}
     >
       {"Random Dynamic Page"}
     </Button>
@@ -124,13 +111,12 @@ function makeNodeComponent(nodeName) {
       () =>
         deriveRenderOpts(props, {
           name: nodeName,
-          descendantNames: [...PlasmicDescendants[nodeName]],
+          descendantNames: PlasmicDescendants[nodeName],
           internalArgPropNames: PlasmicRandomDynamicPageButton__ArgProps,
           internalVariantPropNames: PlasmicRandomDynamicPageButton__VariantProps
         }),
       [props, nodeName]
     );
-
     return PlasmicRandomDynamicPageButton__RenderFunc({
       variants,
       args,

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

@@ -5,7 +5,7 @@
 import React from "react";
 import { classNames } from "@plasmicapp/react-web";
 
-export function ChecksvgIcon(props) {
+export function CheckSvgIcon(props) {
   const { className, style, title, ...restProps } = props;
   return (
     <svg
@@ -35,5 +35,5 @@ export function ChecksvgIcon(props) {
   );
 }
 
-export default ChecksvgIcon;
+export default CheckSvgIcon;
 /* prettier-ignore-end */

package/cpa-out/react-codegen-js/src/main.jsx

@@ -0,0 +1,10 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import './index.css'
+import App from './App.jsx'
+
+createRoot(document.getElementById('root')).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+)

package/cpa-out/react-codegen-js/vite.config.js

@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [react()],
+})

package/cpa-out/react-codegen-ts/eslint.config.js

@@ -0,0 +1,28 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+
+export default tseslint.config(
+  { ignores: ['dist'] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+    },
+  },
+)

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

@@ -1,45 +1,31 @@
 {
   "name": "react-codegen-ts",
-  "version": "0.1.0",
   "private": true,
-  "dependencies": {
-    "@plasmicapp/cli": "^0.1.231",
-    "@plasmicapp/react-web": "^0.2.174",
-    "@testing-library/jest-dom": "^5.14.1",
-    "@testing-library/react": "^13.0.0",
-    "@testing-library/user-event": "^13.2.1",
-    "@types/jest": "^27.0.1",
-    "@types/node": "^16.7.13",
-    "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-scripts": "5.0.1",
-    "typescript": "^4.4.2",
-    "web-vitals": "^2.1.0"
-  },
+  "version": "0.0.0",
+  "type": "module",
   "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
   },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
+  "dependencies": {
+    "@plasmicapp/cli": "^0.1.335",
+    "@plasmicapp/react-web": "^0.2.366",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
+  "devDependencies": {
+    "@eslint/js": "^9.19.0",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
+    "@vitejs/plugin-react": "^4.3.4",
+    "eslint": "^9.19.0",
+    "eslint-plugin-react-hooks": "^5.0.0",
+    "eslint-plugin-react-refresh": "^0.4.18",
+    "globals": "^15.14.0",
+    "typescript": "~5.7.2",
+    "typescript-eslint": "^8.22.0",
+    "vite": "^6.1.0"
   }
 }

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

@@ -10,8 +10,8 @@
     "defaultStyleCssFilePath": "plasmic/plasmic__default_style.css"
   },
   "images": {
-    "scheme": "files",
-    "publicDir": "../../public",
+    "scheme": "inlined",
+    "publicDir": "../public",
     "publicUrlPrefix": "/static/"
   },
   "tokens": {
@@ -26,7 +26,7 @@
       "projectApiToken": "7BRFratDxPLMGZHnd2grV5QP6mlHcZ1AK3BJSIeh7xzUlHgWh25XpgXvUaKAqHXFMXQQuzpADqboibF6nqNWQ",
       "projectName": "create-plasmic-app",
       "version": "latest",
-      "cssFilePath": "plasmic/create_plasmic_app/plasmic_create_plasmic_app.module.css",
+      "cssFilePath": "plasmic/create_plasmic_app/plasmic.module.css",
       "components": [
         {
           "id": "6uuAAE1jiCew",
@@ -39,7 +39,8 @@
           },
           "cssFilePath": "plasmic/create_plasmic_app/PlasmicHomepage.module.css",
           "scheme": "blackbox",
-          "componentType": "page"
+          "componentType": "page",
+          "path": "/"
         },
         {
           "id": "AO44A-w7hh",
@@ -52,7 +53,8 @@
           },
           "cssFilePath": "plasmic/create_plasmic_app/PlasmicDynamicPage.module.css",
           "scheme": "blackbox",
-          "componentType": "page"
+          "componentType": "page",
+          "path": "/dynamic/[slug]"
         },
         {
           "id": "TQcvW_pSKi3",
@@ -85,8 +87,8 @@
       "icons": [
         {
           "id": "gj-_D7n31Ho",
-          "name": "ChecksvgIcon",
-          "moduleFilePath": "plasmic/create_plasmic_app/icons/PlasmicIcon__Checksvg.tsx"
+          "name": "CheckSvgIcon",
+          "moduleFilePath": "plasmic/create_plasmic_app/icons/PlasmicIcon__CheckSvg.tsx"
         },
         {
           "id": "6PNxx3YMyDQ",
@@ -97,18 +99,22 @@
       "images": [],
       "indirect": false,
       "globalContextsFilePath": "",
+      "splitsProviderFilePath": "",
       "codeComponents": [
         {
           "id": "P6aGdYWZ2R",
           "name": "PlasmicHead",
+          "displayName": "hostless-plasmic-head",
           "componentImportPath": "@plasmicapp/react-web"
         },
         {
           "id": "8G2A-uTjGa",
           "name": "Fetcher",
+          "displayName": "plasmic-data-source-fetcher",
           "componentImportPath": "@plasmicapp/react-web/lib/data-sources"
         }
-      ]
+      ],
+      "customFunctions": []
     }
   ],
   "globalVariants": {
@@ -122,6 +128,6 @@
     ]
   },
   "wrapPagesWithGlobalContexts": true,
-  "cliVersion": "0.1.231",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.231/dist/plasmic.schema.json"
+  "cliVersion": "0.1.335",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.335/dist/plasmic.schema.json"
 }

package/cpa-out/react-codegen-ts/src/App.tsx

@@ -1,9 +1,9 @@
 
 import Homepage from './components/Homepage';
 
+
 function App() {
   return (<Homepage />);
 }
 
 export default App;
-  

package/cpa-out/react-codegen-ts/src/components/Button.tsx

@@ -3,13 +3,14 @@ import {
   PlasmicButton,
   DefaultButtonProps
 } from "./plasmic/create_plasmic_app/PlasmicButton";
+
 import {
   ButtonRef,
   HtmlAnchorOnlyProps,
   HtmlButtonOnlyProps
 } from "@plasmicapp/react-web";
 
-interface ButtonProps extends DefaultButtonProps {
+export interface ButtonProps extends DefaultButtonProps {
   // Feel free to add any additional props that this component should receive
 }
 function Button_(props: ButtonProps, ref: ButtonRef) {
@@ -17,7 +18,7 @@ function Button_(props: ButtonProps, ref: ButtonRef) {
   return <PlasmicButton {...plasmicProps} />;
 }
 
-type ButtonComponentType = {
+export type ButtonComponentType = {
   (
     props: Omit<ButtonProps, HtmlAnchorOnlyProps> & {
       ref?: React.Ref<HTMLButtonElement>;
@@ -31,6 +32,4 @@ type ButtonComponentType = {
 };
 const Button = React.forwardRef(Button_) as any as ButtonComponentType;
 
-export default Object.assign(Button, {
-  __plumeType: "button"
-});
+export default Object.assign(Button, { __plumeType: "button" });