npm - create-plasmic-app - Versions diffs - 0.0.67 → 0.0.68 - Mend

create-plasmic-app 0.0.67 → 0.0.68

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (99) hide show

package/cpa-out/nextjs-pages-codegen-js/components/plasmic/create_plasmic_app/PlasmicDynamicPage.jsx ADDED Viewed

@@ -0,0 +1,184 @@
+// @ts-nocheck
+/* eslint-disable */
+/* tslint:disable */
+/* prettier-ignore-start */
+/** @jsxRuntime classic */
+/** @jsx createPlasmicElementProxy */
+/** @jsxFrag React.Fragment */
+// This class is auto-generated by Plasmic; please do not edit!
+// Plasmic Project: 47tFXWjN2C4NyHFGGpaYQ3
+// Component: AO44A-w7hh
+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/react-web/lib/host";
+import {
+  classNames,
+  createPlasmicElementProxy,
+  deriveRenderOpts
+} from "@plasmicapp/react-web";
+import RandomDynamicPageButton from "../../RandomDynamicPageButton"; // plasmic-import: Q23H1_1M_P/component
+import "@plasmicapp/react-web/lib/plasmic.css";
+import projectcss from "./plasmic_create_plasmic_app.module.css"; // plasmic-import: 47tFXWjN2C4NyHFGGpaYQ3/projectcss
+import sty from "./PlasmicDynamicPage.module.css"; // plasmic-import: AO44A-w7hh/css
+export const PlasmicDynamicPage__VariantProps = new Array();
+export const PlasmicDynamicPage__ArgProps = new Array();
+const __wrapUserFunction =
+  globalThis.__PlasmicWrapUserFunction ?? ((loc, fn) => fn());
+const __wrapUserPromise =
+  globalThis.__PlasmicWrapUserPromise ??
+  (async (loc, promise) => {
+    return await promise;
+  });
+function useNextRouter() {
+  try {
+    return useRouter();
+  } catch {}
+  return undefined;
+}
+function PlasmicDynamicPage__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({});
+  return (
+    <React.Fragment>
+      <Head></Head>
+      <style>{`
+        body {
+          margin: 0;
+        }
+      `}</style>
+      <div className={projectcss.plasmic_page_wrapper}>
+        <div
+          data-plasmic-name={"root"}
+          data-plasmic-override={overrides.root}
+          data-plasmic-root={true}
+          data-plasmic-for-node={forNode}
+          className={classNames(
+            projectcss.all,
+            projectcss.root_reset,
+            projectcss.plasmic_default_styles,
+            projectcss.plasmic_mixins,
+            sty.root
+          )}
+        >
+          <p.Stack
+            as={"section"}
+            data-plasmic-name={"section"}
+            data-plasmic-override={overrides.section}
+            hasGap={true}
+            className={classNames(projectcss.all, sty.section)}
+          >
+            <h1
+              data-plasmic-name={"h1"}
+              data-plasmic-override={overrides.h1}
+              className={classNames(
+                projectcss.all,
+                projectcss.h1,
+                projectcss.__wab_text,
+                sty.h1
+              )}
+            >
+              {(() => {
+                try {
+                  return $ctx.params.slug;
+                } catch (e) {
+                  if (e instanceof TypeError) {
+                    return "Page 1";
+                  }
+                  throw e;
+                }
+              })()}
+            </h1>
+            <RandomDynamicPageButton
+              data-plasmic-name={"randomDynamicPageButton"}
+              data-plasmic-override={overrides.randomDynamicPageButton}
+              className={classNames(
+                "__wab_instance",
+                sty.randomDynamicPageButton
+              )}
+            />
+          </p.Stack>
+        </div>
+      </div>
+    </React.Fragment>
+  );
+}
+const PlasmicDescendants = {
+  root: ["root", "section", "h1", "randomDynamicPageButton"],
+  section: ["section", "h1", "randomDynamicPageButton"],
+  h1: ["h1"],
+  randomDynamicPageButton: ["randomDynamicPageButton"]
+};
+function makeNodeComponent(nodeName) {
+  const func = function (props) {
+    const { variants, args, overrides } = React.useMemo(
+      () =>
+        deriveRenderOpts(props, {
+          name: nodeName,
+          descendantNames: [...PlasmicDescendants[nodeName]],
+          internalArgPropNames: PlasmicDynamicPage__ArgProps,
+          internalVariantPropNames: PlasmicDynamicPage__VariantProps
+        }),
+      [props, nodeName]
+    );
+    return PlasmicDynamicPage__RenderFunc({
+      variants,
+      args,
+      overrides,
+      forNode: nodeName
+    });
+  };
+  if (nodeName === "root") {
+    func.displayName = "PlasmicDynamicPage";
+  } else {
+    func.displayName = `PlasmicDynamicPage.${nodeName}`;
+  }
+  return func;
+}
+export const PlasmicDynamicPage = Object.assign(
+  // Top-level PlasmicDynamicPage renders the root element
+  makeNodeComponent("root"),
+  {
+    // Helper components rendering sub-elements
+    section: makeNodeComponent("section"),
+    h1: makeNodeComponent("h1"),
+    randomDynamicPageButton: makeNodeComponent("randomDynamicPageButton"),
+    // Metadata about props expected for PlasmicDynamicPage
+    internalVariantProps: PlasmicDynamicPage__VariantProps,
+    internalArgProps: PlasmicDynamicPage__ArgProps,
+    // Page metadata
+    pageMetadata: {
+      title: "",
+      description: "",
+      ogImageSrc: "",
+      canonical: ""
+    }
+  }
+);
+export default PlasmicDynamicPage;
+/* prettier-ignore-end */

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

@@ -20,6 +20,7 @@ import {
   deriveRenderOpts,
   ensureGlobalVariants
 } from "@plasmicapp/react-web";
+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
@@ -149,6 +150,15 @@ function PlasmicHomepage__RenderFunc(props) {
                 </React.Fragment>
               )}
             </div>
+            <RandomDynamicPageButton
+              data-plasmic-name={"randomDynamicPageButton"}
+              data-plasmic-override={overrides.randomDynamicPageButton}
+              className={classNames(
+                "__wab_instance",
+                sty.randomDynamicPageButton
+              )}
+            />
           </p.Stack>
         </div>
       </div>
@@ -157,10 +167,11 @@ function PlasmicHomepage__RenderFunc(props) {
 }
 const PlasmicDescendants = {
-  root: ["root", "section", "h1", "text"],
-  section: ["section", "h1", "text"],
+  root: ["root", "section", "h1", "text", "randomDynamicPageButton"],
+  section: ["section", "h1", "text", "randomDynamicPageButton"],
   h1: ["h1"],
-  text: ["text"]
+  text: ["text"],
+  randomDynamicPageButton: ["randomDynamicPageButton"]
 };
 function makeNodeComponent(nodeName) {
@@ -199,6 +210,7 @@ export const PlasmicHomepage = Object.assign(
     section: makeNodeComponent("section"),
     h1: makeNodeComponent("h1"),
     text: makeNodeComponent("text"),
+    randomDynamicPageButton: makeNodeComponent("randomDynamicPageButton"),
     // Metadata about props expected for PlasmicHomepage
     internalVariantProps: PlasmicHomepage__VariantProps,
     internalArgProps: PlasmicHomepage__ArgProps,

package/cpa-out/nextjs-pages-codegen-js/components/plasmic/create_plasmic_app/PlasmicRandomDynamicPageButton.jsx ADDED Viewed

@@ -0,0 +1,170 @@
+// @ts-nocheck
+/* eslint-disable */
+/* tslint:disable */
+/* prettier-ignore-start */
+/** @jsxRuntime classic */
+/** @jsx createPlasmicElementProxy */
+/** @jsxFrag React.Fragment */
+// This class is auto-generated by Plasmic; please do not edit!
+// Plasmic Project: 47tFXWjN2C4NyHFGGpaYQ3
+// Component: Q23H1_1M_P
+import * as React from "react";
+import { useRouter } from "next/router";
+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 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
+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;
+  });
+function useNextRouter() {
+  try {
+    return useRouter();
+  } catch {}
+  return undefined;
+}
+function PlasmicRandomDynamicPageButton__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({});
+  return (
+    <Button
+      data-plasmic-name={"root"}
+      data-plasmic-override={overrides.root}
+      data-plasmic-root={true}
+      data-plasmic-for-node={forNode}
+      className={classNames("__wab_instance", sty.root)}
+      onClick={async event => {
+        const $steps = {};
+        $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;
+                      }
+                    })()}`
+                )
+              };
+              return __wrapUserFunction(
+                {
+                  type: "InteractionLoc",
+                  actionName: "navigation",
+                  interactionUuid: "9Y3jL0zxjA",
+                  componentUuid: "Q23H1_1M_P"
+                },
+                () =>
+                  (({ destination }) => {
+                    __nextRouter?.push(destination);
+                  })?.apply(null, [actionArgs]),
+                actionArgs
+              );
+            })()
+          : undefined;
+        if (
+          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"]
+          );
+        }
+      }}
+    >
+      {"Random Dynamic Page"}
+    </Button>
+  );
+}
+const PlasmicDescendants = {
+  root: ["root"]
+};
+function makeNodeComponent(nodeName) {
+  const func = function (props) {
+    const { variants, args, overrides } = React.useMemo(
+      () =>
+        deriveRenderOpts(props, {
+          name: nodeName,
+          descendantNames: [...PlasmicDescendants[nodeName]],
+          internalArgPropNames: PlasmicRandomDynamicPageButton__ArgProps,
+          internalVariantPropNames: PlasmicRandomDynamicPageButton__VariantProps
+        }),
+      [props, nodeName]
+    );
+    return PlasmicRandomDynamicPageButton__RenderFunc({
+      variants,
+      args,
+      overrides,
+      forNode: nodeName
+    });
+  };
+  if (nodeName === "root") {
+    func.displayName = "PlasmicRandomDynamicPageButton";
+  } else {
+    func.displayName = `PlasmicRandomDynamicPageButton.${nodeName}`;
+  }
+  return func;
+}
+export const PlasmicRandomDynamicPageButton = Object.assign(
+  // Top-level PlasmicRandomDynamicPageButton renders the root element
+  makeNodeComponent("root"),
+  {
+    // Helper components rendering sub-elements
+    // Metadata about props expected for PlasmicRandomDynamicPageButton
+    internalVariantProps: PlasmicRandomDynamicPageButton__VariantProps,
+    internalArgProps: PlasmicRandomDynamicPageButton__ArgProps
+  }
+);
+export default PlasmicRandomDynamicPageButton;
+/* prettier-ignore-end */

package/cpa-out/nextjs-pages-codegen-js/components/plasmic/create_plasmic_app/icons/PlasmicIcon__Checksvg.jsx ADDED Viewed

@@ -0,0 +1,39 @@
+// @ts-nocheck
+/* eslint-disable */
+/* tslint:disable */
+/* prettier-ignore-start */
+import React from "react";
+import { classNames } from "@plasmicapp/react-web";
+export function ChecksvgIcon(props) {
+  const { className, style, title, ...restProps } = props;
+  return (
+    <svg
+      xmlns={"http://www.w3.org/2000/svg"}
+      fill={"none"}
+      viewBox={"0 0 24 24"}
+      height={"1em"}
+      width={"1em"}
+      style={{
+        fill: "currentcolor",
+        ...(style || {}),
+      }}
+      className={classNames("plasmic-default__svg", className)}
+      {...restProps}
+    >
+      {title && <title>{title}</title>}
+      <path
+        fillRule={"evenodd"}
+        clipRule={"evenodd"}
+        d={
+          "M18.416 5.876a.75.75 0 01.208 1.04L11.42 17.721a1.75 1.75 0 01-2.871.06l-3.156-4.34a.75.75 0 111.214-.882l3.155 4.339a.25.25 0 00.41-.009l7.204-10.805a.75.75 0 011.04-.208z"
+        }
+        fill={"currentColor"}
+      ></path>
+    </svg>
+  );
+}
+export default ChecksvgIcon;
+/* prettier-ignore-end */

package/cpa-out/nextjs-pages-codegen-js/components/plasmic/create_plasmic_app/icons/PlasmicIcon__Icon.jsx ADDED Viewed

@@ -0,0 +1,37 @@
+// @ts-nocheck
+/* eslint-disable */
+/* tslint:disable */
+/* prettier-ignore-start */
+import React from "react";
+import { classNames } from "@plasmicapp/react-web";
+export function IconIcon(props) {
+  const { className, style, title, ...restProps } = props;
+  return (
+    <svg
+      xmlns={"http://www.w3.org/2000/svg"}
+      stroke={"currentColor"}
+      fill={"currentColor"}
+      strokeWidth={"0"}
+      viewBox={"0 0 16 16"}
+      height={"1em"}
+      width={"1em"}
+      className={classNames("plasmic-default__svg", className)}
+      style={style}
+      {...restProps}
+    >
+      {title && <title>{title}</title>}
+      <path
+        fillRule={"evenodd"}
+        d={
+          "M1 8a.5.5 0 01.5-.5h11.793l-3.147-3.146a.5.5 0 01.708-.708l4 4a.5.5 0 010 .708l-4 4a.5.5 0 01-.708-.708L13.293 8.5H1.5A.5.5 0 011 8z"
+        }
+        stroke={"none"}
+      ></path>
+    </svg>
+  );
+}
+export default IconIcon;
+/* prettier-ignore-end */

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

@@ -9,8 +9,8 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@plasmicapp/cli": "^0.1.225",
-    "@plasmicapp/react-web": "^0.2.170",
+    "@plasmicapp/cli": "^0.1.231",
+    "@plasmicapp/react-web": "^0.2.174",
     "eslint": "8.36.0",
     "eslint-config-next": "13.2.4",
     "next": "13.2.4",

package/cpa-out/nextjs-pages-codegen-js/pages/dynamic/[slug].jsx ADDED Viewed

@@ -0,0 +1,35 @@
+// 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/react-web/lib/host";
+import { PlasmicDynamicPage } from "../../components/plasmic/create_plasmic_app/PlasmicDynamicPage";
+import { useRouter } from "next/router";
+function DynamicPage() {
+  // Use PlasmicDynamicPage to render this component as it was
+  // designed in Plasmic, by activating the appropriate variants,
+  // attaching the appropriate event handlers, etc.  You
+  // can also install whatever React hooks you need here to manage state or
+  // fetch data.
+  //
+  // Props you can pass into PlasmicDynamicPage are:
+  // 1. Variants you want to activate,
+  // 2. Contents for slots you want to fill,
+  // 3. Overrides for any named node in the component to attach behavior and data,
+  // 4. Props to set on the root node.
+  //
+  // By default, PlasmicDynamicPage is wrapped by your project's global
+  // variant context providers. These wrappers may be moved to
+  // Next.js Custom App component
+  // (https://nextjs.org/docs/advanced-features/custom-app).
+  return (
+    <ph.PageParamsProvider
+      params={useRouter()?.query}
+      query={useRouter()?.query}
+    >
+      <PlasmicDynamicPage />
+    </ph.PageParamsProvider>
+  );
+}
+export default DynamicPage;

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

@@ -40,9 +40,60 @@
           "cssFilePath": "plasmic/create_plasmic_app/PlasmicHomepage.module.css",
           "scheme": "blackbox",
           "componentType": "page"
+        },
+        {
+          "id": "AO44A-w7hh",
+          "name": "DynamicPage",
+          "type": "managed",
+          "projectId": "47tFXWjN2C4NyHFGGpaYQ3",
+          "renderModuleFilePath": "plasmic/create_plasmic_app/PlasmicDynamicPage.jsx",
+          "importSpec": {
+            "modulePath": "../pages/dynamic/[slug].jsx"
+          },
+          "cssFilePath": "plasmic/create_plasmic_app/PlasmicDynamicPage.module.css",
+          "scheme": "blackbox",
+          "componentType": "page"
+        },
+        {
+          "id": "TQcvW_pSKi3",
+          "name": "Button",
+          "type": "managed",
+          "projectId": "47tFXWjN2C4NyHFGGpaYQ3",
+          "renderModuleFilePath": "plasmic/create_plasmic_app/PlasmicButton.jsx",
+          "importSpec": {
+            "modulePath": "Button.jsx"
+          },
+          "cssFilePath": "plasmic/create_plasmic_app/PlasmicButton.module.css",
+          "scheme": "blackbox",
+          "componentType": "component",
+          "plumeType": "button"
+        },
+        {
+          "id": "Q23H1_1M_P",
+          "name": "RandomDynamicPageButton",
+          "type": "managed",
+          "projectId": "47tFXWjN2C4NyHFGGpaYQ3",
+          "renderModuleFilePath": "plasmic/create_plasmic_app/PlasmicRandomDynamicPageButton.jsx",
+          "importSpec": {
+            "modulePath": "RandomDynamicPageButton.jsx"
+          },
+          "cssFilePath": "plasmic/create_plasmic_app/PlasmicRandomDynamicPageButton.module.css",
+          "scheme": "blackbox",
+          "componentType": "component"
+        }
+      ],
+      "icons": [
+        {
+          "id": "gj-_D7n31Ho",
+          "name": "ChecksvgIcon",
+          "moduleFilePath": "plasmic/create_plasmic_app/icons/PlasmicIcon__Checksvg.jsx"
+        },
+        {
+          "id": "6PNxx3YMyDQ",
+          "name": "IconIcon",
+          "moduleFilePath": "plasmic/create_plasmic_app/icons/PlasmicIcon__Icon.jsx"
         }
       ],
-      "icons": [],
       "images": [],
       "indirect": false,
       "globalContextsFilePath": "",
@@ -74,6 +125,6 @@
   "nextjsConfig": {
     "pagesDir": "../pages"
   },
-  "cliVersion": "0.1.225",
-  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.225/dist/plasmic.schema.json"
+  "cliVersion": "0.1.231",
+  "$schema": "https://unpkg.com/@plasmicapp/cli@0.1.231/dist/plasmic.schema.json"
 }

package/cpa-out/nextjs-pages-codegen-ts/components/Button.tsx ADDED Viewed

@@ -0,0 +1,36 @@
+import * as React from "react";
+import {
+  PlasmicButton,
+  DefaultButtonProps
+} from "./plasmic/create_plasmic_app/PlasmicButton";
+import {
+  ButtonRef,
+  HtmlAnchorOnlyProps,
+  HtmlButtonOnlyProps
+} from "@plasmicapp/react-web";
+interface ButtonProps extends DefaultButtonProps {
+  // Feel free to add any additional props that this component should receive
+}
+function Button_(props: ButtonProps, ref: ButtonRef) {
+  const { plasmicProps } = PlasmicButton.useBehavior<ButtonProps>(props, ref);
+  return <PlasmicButton {...plasmicProps} />;
+}
+type ButtonComponentType = {
+  (
+    props: Omit<ButtonProps, HtmlAnchorOnlyProps> & {
+      ref?: React.Ref<HTMLButtonElement>;
+    }
+  ): React.ReactElement;
+  (
+    props: Omit<ButtonProps, HtmlButtonOnlyProps> & {
+      ref?: React.Ref<HTMLAnchorElement>;
+    }
+  ): React.ReactElement;
+};
+const Button = React.forwardRef(Button_) as any as ButtonComponentType;
+export default Object.assign(Button, {
+  __plumeType: "button"
+});

package/cpa-out/nextjs-pages-codegen-ts/components/RandomDynamicPageButton.tsx ADDED Viewed

@@ -0,0 +1,44 @@
+// This is a skeleton starter React component generated by Plasmic.
+// This file is owned by you, feel free to edit as you see fit.
+import * as React from "react";
+import {
+  PlasmicRandomDynamicPageButton,
+  DefaultRandomDynamicPageButtonProps
+} from "./plasmic/create_plasmic_app/PlasmicRandomDynamicPageButton";
+// Your component props start with props for variants and slots you defined
+// in Plasmic, but you can add more here, like event handlers that you can
+// attach to named nodes in your component.
+//
+// If you don't want to expose certain variants or slots as a prop, you can use
+// Omit to hide them:
+//
+// interface RandomDynamicPageButtonProps extends Omit<DefaultRandomDynamicPageButtonProps, "hideProps1"|"hideProp2"> {
+//   // etc.
+// }
+//
+// You can also stop extending from DefaultRandomDynamicPageButtonProps altogether and have
+// total control over the props for your component.
+export interface RandomDynamicPageButtonProps
+  extends DefaultRandomDynamicPageButtonProps {}
+function RandomDynamicPageButton(props: RandomDynamicPageButtonProps) {
+  // Use PlasmicRandomDynamicPageButton to render this component as it was
+  // designed in Plasmic, by activating the appropriate variants,
+  // attaching the appropriate event handlers, etc.  You
+  // can also install whatever React hooks you need here to manage state or
+  // fetch data.
+  //
+  // Props you can pass into PlasmicRandomDynamicPageButton are:
+  // 1. Variants you want to activate,
+  // 2. Contents for slots you want to fill,
+  // 3. Overrides for any named node in the component to attach behavior and data,
+  // 4. Props to set on the root node.
+  //
+  // By default, we are just piping all RandomDynamicPageButtonProps here, but feel free
+  // to do whatever works for you.
+  return <PlasmicRandomDynamicPageButton {...props} />;
+}
+export default RandomDynamicPageButton;