@plasmicapp/cli 0.1.162

package/dist/plasmic.schema.json

@@ -0,0 +1,463 @@
+{
+    "$schema": "http://json-schema.org/draft-07/schema#",
+    "definitions": {
+        "CodeComponentConfig": {
+            "properties": {
+                "componentImportPath": {
+                    "type": "string"
+                },
+                "id": {
+                    "type": "string"
+                },
+                "name": {
+                    "type": "string"
+                }
+            },
+            "required": [
+                "componentImportPath",
+                "id",
+                "name"
+            ],
+            "type": "object"
+        },
+        "CodeConfig": {
+            "properties": {
+                "lang": {
+                    "description": "Language to generate code in",
+                    "enum": [
+                        "js",
+                        "ts"
+                    ],
+                    "type": "string"
+                },
+                "reactRuntime": {
+                    "enum": [
+                        "automatic",
+                        "classic"
+                    ],
+                    "type": "string"
+                },
+                "scheme": {
+                    "description": "The default code generation scheme. Each component can override the scheme.",
+                    "enum": [
+                        "blackbox",
+                        "direct"
+                    ],
+                    "type": "string"
+                }
+            },
+            "required": [
+                "lang",
+                "reactRuntime",
+                "scheme"
+            ],
+            "type": "object"
+        },
+        "ComponentConfig": {
+            "properties": {
+                "componentType": {
+                    "enum": [
+                        "component",
+                        "page"
+                    ],
+                    "type": "string"
+                },
+                "cssFilePath": {
+                    "description": "The file path for the component css file, relative to srcDir.",
+                    "type": "string"
+                },
+                "id": {
+                    "description": "Component ID",
+                    "type": "string"
+                },
+                "importSpec": {
+                    "$ref": "#/definitions/ImportSpec",
+                    "description": "How to import this Component from another component file"
+                },
+                "name": {
+                    "description": "Javascript name of component",
+                    "type": "string"
+                },
+                "plumeType": {
+                    "description": "Plume type if component is a Plume component",
+                    "type": "string"
+                },
+                "projectId": {
+                    "description": "Plasmic project that this component belongs in",
+                    "type": "string"
+                },
+                "renderModuleFilePath": {
+                    "description": "The file path for the blackbox render module, relative to srcDir.",
+                    "type": "string"
+                },
+                "scheme": {
+                    "description": "Code generation scheme used for this component",
+                    "enum": [
+                        "blackbox",
+                        "direct"
+                    ],
+                    "type": "string"
+                },
+                "type": {
+                    "description": "Whether this component is managed by Plasmic -- with Plasmic* files generated -- or mapped to an external library",
+                    "enum": [
+                        "managed",
+                        "mapped"
+                    ],
+                    "type": "string"
+                }
+            },
+            "required": [
+                "componentType",
+                "cssFilePath",
+                "id",
+                "importSpec",
+                "name",
+                "projectId",
+                "renderModuleFilePath",
+                "scheme",
+                "type"
+            ],
+            "type": "object"
+        },
+        "GlobalVariantGroupConfig": {
+            "properties": {
+                "contextFilePath": {
+                    "description": "File path for the global variant group React context definition, relative to srcDir",
+                    "type": "string"
+                },
+                "id": {
+                    "description": "ID of the global variant group",
+                    "type": "string"
+                },
+                "name": {
+                    "description": "Javascript name of the global variant group",
+                    "type": "string"
+                },
+                "projectId": {
+                    "description": "Plasmic project this global variant group belongs to",
+                    "type": "string"
+                }
+            },
+            "required": [
+                "contextFilePath",
+                "id",
+                "name",
+                "projectId"
+            ],
+            "type": "object"
+        },
+        "GlobalVariantsConfig": {
+            "properties": {
+                "variantGroups": {
+                    "items": {
+                        "$ref": "#/definitions/GlobalVariantGroupConfig"
+                    },
+                    "type": "array"
+                }
+            },
+            "required": [
+                "variantGroups"
+            ],
+            "type": "object"
+        },
+        "IconConfig": {
+            "properties": {
+                "id": {
+                    "description": "ID of icon",
+                    "type": "string"
+                },
+                "moduleFilePath": {
+                    "description": "The file path for the React component file for this icon, relative to srcDir.",
+                    "type": "string"
+                },
+                "name": {
+                    "description": "Javascript name of the React component for this icon",
+                    "type": "string"
+                }
+            },
+            "required": [
+                "id",
+                "moduleFilePath",
+                "name"
+            ],
+            "type": "object"
+        },
+        "ImageConfig": {
+            "properties": {
+                "filePath": {
+                    "description": "File path for the image file, relative to srcDir",
+                    "type": "string"
+                },
+                "id": {
+                    "description": "ID of image",
+                    "type": "string"
+                },
+                "name": {
+                    "description": "name of image",
+                    "type": "string"
+                }
+            },
+            "required": [
+                "filePath",
+                "id",
+                "name"
+            ],
+            "type": "object"
+        },
+        "ImagesConfig": {
+            "properties": {
+                "publicDir": {
+                    "description": "The folder where \"public\" static files are stored. Plasmic-managed image files will be stored as \"plasmic/project-name/image-name\" under this folder.  Relative to srcDir; for example, \"../public\"",
+                    "type": "string"
+                },
+                "publicUrlPrefix": {
+                    "description": "The url prefix where \"public\" static files are stored.  For example, if publicDir is \"public\", publicUrlPrefix is \"/static\", then a file at public/test.png will be served at /static/test.png.",
+                    "type": "string"
+                },
+                "scheme": {
+                    "description": "How image files should be referenced from generated React components. The choices are:\n* \"files\" - imported as relative files, like \"import img from './image.png'\". Not all bundlers support this.\n* \"public-files\" - images are stored in a public folder, and referenced from some url prefix, like `<img src=\"/static/image.png\"/>`.\n* \"inlined\" - inlined directly into React files and css files as base64-encoded data-URIs.\n* \"cdn\" - images are served from Plasmic's CDN.  Allows for dynamic resizing of images for\n  serving the optimal file size given browser viewport.",
+                    "enum": [
+                        "cdn",
+                        "files",
+                        "inlined",
+                        "public-files"
+                    ],
+                    "type": "string"
+                }
+            },
+            "required": [
+                "scheme"
+            ],
+            "type": "object"
+        },
+        "ImportSpec": {
+            "description": "Describes how to import a Component",
+            "properties": {
+                "exportName": {
+                    "description": "If the Component is a named export of the module, then this is the name.  If the Component\nis the default export, then this is undefined.",
+                    "type": "string"
+                },
+                "modulePath": {
+                    "description": "The import path to use to instantiate this Component.  The modulePath can be:\n* An external npm module, like \"antd/lib/button\"\n* A local file, like \"components/Button.tsx\" (path is relative to srcDir, and file extension is fully specified).  If local file is specified, then the module is imported via relative path.\n\nFor this to be an external npm module, the ComponentConfig.type must be \"mapped\".",
+                    "type": "string"
+                }
+            },
+            "required": [
+                "modulePath"
+            ],
+            "type": "object"
+        },
+        "JsBundleThemeConfig": {
+            "properties": {
+                "bundleName": {
+                    "type": "string"
+                },
+                "themeFilePath": {
+                    "type": "string"
+                }
+            },
+            "required": [
+                "bundleName",
+                "themeFilePath"
+            ],
+            "type": "object"
+        },
+        "ProjectConfig": {
+            "properties": {
+                "codeComponents": {
+                    "items": {
+                        "$ref": "#/definitions/CodeComponentConfig"
+                    },
+                    "type": "array"
+                },
+                "components": {
+                    "description": "Metadata for each synced component in this project.",
+                    "items": {
+                        "$ref": "#/definitions/ComponentConfig"
+                    },
+                    "type": "array"
+                },
+                "cssFilePath": {
+                    "description": "File location for the project-wide css styles. Relative to srcDir",
+                    "type": "string"
+                },
+                "icons": {
+                    "description": "Metadata for each synced icon in this project",
+                    "items": {
+                        "$ref": "#/definitions/IconConfig"
+                    },
+                    "type": "array"
+                },
+                "images": {
+                    "description": "Metadata for each synced image in this project",
+                    "items": {
+                        "$ref": "#/definitions/ImageConfig"
+                    },
+                    "type": "array"
+                },
+                "jsBundleThemes": {
+                    "items": {
+                        "$ref": "#/definitions/JsBundleThemeConfig"
+                    },
+                    "type": "array"
+                },
+                "projectApiToken": {
+                    "description": "Project API token. Grants read-only sync access to just this specific project and its dependencies.",
+                    "type": "string"
+                },
+                "projectId": {
+                    "description": "Project ID",
+                    "type": "string"
+                },
+                "projectName": {
+                    "description": "Project name synced down from Studio",
+                    "type": "string"
+                },
+                "version": {
+                    "description": "A version range for syncing this project. Can be:\n* \"latest\" - always syncs down whatever has been saved in the project.\n* \">0\" - always syncs down the latest published version of the project.\n* any other semver string you'd like",
+                    "type": "string"
+                }
+            },
+            "required": [
+                "components",
+                "cssFilePath",
+                "icons",
+                "images",
+                "projectId",
+                "projectName",
+                "version"
+            ],
+            "type": "object"
+        },
+        "StyleConfig": {
+            "properties": {
+                "defaultStyleCssFilePath": {
+                    "description": "File location for global css styles shared by all components. Relative to srcDir",
+                    "type": "string"
+                },
+                "scheme": {
+                    "description": "Styling framework to use",
+                    "enum": [
+                        "css",
+                        "css-modules"
+                    ],
+                    "type": "string"
+                }
+            },
+            "required": [
+                "defaultStyleCssFilePath",
+                "scheme"
+            ],
+            "type": "object"
+        },
+        "TokensConfig": {
+            "properties": {
+                "scheme": {
+                    "enum": [
+                        "theo"
+                    ],
+                    "type": "string"
+                },
+                "tokensFilePath": {
+                    "type": "string"
+                }
+            },
+            "required": [
+                "scheme",
+                "tokensFilePath"
+            ],
+            "type": "object"
+        }
+    },
+    "properties": {
+        "cliVersion": {
+            "description": "The version of cli when this file was written",
+            "type": "string"
+        },
+        "code": {
+            "$ref": "#/definitions/CodeConfig",
+            "description": "Config for code generation"
+        },
+        "defaultPlasmicDir": {
+            "description": "The default folder where Plasmic-managed files will be stored. These include\nblackbox component files, svg component files, style files, etc.  The path\nis relative to the srcDir.",
+            "type": "string"
+        },
+        "gatsbyConfig": {
+            "description": "Gatsby-specific config",
+            "properties": {
+                "pagesDir": {
+                    "description": "The folder containing page components source files.",
+                    "type": "string"
+                }
+            },
+            "type": "object"
+        },
+        "globalVariants": {
+            "$ref": "#/definitions/GlobalVariantsConfig",
+            "description": "Metadata for global variant groups"
+        },
+        "images": {
+            "$ref": "#/definitions/ImagesConfig",
+            "description": "Config for pictures"
+        },
+        "nextjsConfig": {
+            "description": "Next.js specific config",
+            "properties": {
+                "pagesDir": {
+                    "description": "The folder containing page components source files.",
+                    "type": "string"
+                }
+            },
+            "type": "object"
+        },
+        "platform": {
+            "description": "Target platform to generate code for",
+            "enum": [
+                "gatsby",
+                "nextjs",
+                "react"
+            ],
+            "type": "string"
+        },
+        "postSyncCommands": {
+            "description": "Arbitrary command to run after `plasmic sync` has run; useful for linting and code formatting synced files",
+            "items": {
+                "type": "string"
+            },
+            "type": "array"
+        },
+        "projects": {
+            "description": "Metadata for each project that has been synced",
+            "items": {
+                "$ref": "#/definitions/ProjectConfig"
+            },
+            "type": "array"
+        },
+        "srcDir": {
+            "description": "The folder containing the component source files; this is the default place where\nall files are generated and stored.",
+            "type": "string"
+        },
+        "style": {
+            "$ref": "#/definitions/StyleConfig",
+            "description": "Config for style generation"
+        },
+        "tokens": {
+            "$ref": "#/definitions/TokensConfig",
+            "description": "Config for style tokens"
+        }
+    },
+    "required": [
+        "code",
+        "defaultPlasmicDir",
+        "globalVariants",
+        "images",
+        "platform",
+        "projects",
+        "srcDir",
+        "style",
+        "tokens"
+    ],
+    "type": "object"
+}
+

package/dist/test-common/fixtures.d.ts

@@ -0,0 +1,13 @@
+import { SyncArgs } from "../actions/sync";
+import { PlasmicConfig, ProjectConfig } from "../utils/config-utils";
+import { TempRepo } from "../utils/test-utils";
+export declare const mockApi: any;
+export declare let opts: SyncArgs;
+export declare let tmpRepo: TempRepo;
+export declare const defaultPlasmicJson: PlasmicConfig;
+export declare function standardTestSetup(includeDep?: boolean): void;
+export declare function standardTestTeardown(): void;
+export declare function expectProject1Components(): void;
+export declare const project1Config: ProjectConfig;
+export declare function expectProject1PlasmicJson(): void;
+export declare function expectProjectAndDepPlasmicJson(): void;

package/dist/test-common/fixtures.js

@@ -0,0 +1,165 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.expectProjectAndDepPlasmicJson = exports.expectProject1PlasmicJson = exports.project1Config = exports.expectProject1Components = exports.standardTestTeardown = exports.standardTestSetup = exports.defaultPlasmicJson = exports.tmpRepo = exports.opts = exports.mockApi = void 0;
+const lodash_1 = __importDefault(require("lodash"));
+const test_utils_1 = require("../utils/test-utils");
+jest.mock("../api");
+exports.mockApi = require("../api");
+exports.defaultPlasmicJson = {
+    platform: "react",
+    code: {
+        lang: "ts",
+        scheme: "blackbox",
+        reactRuntime: "classic",
+    },
+    style: {
+        scheme: "css",
+        defaultStyleCssFilePath: "plasmic/PP__plasmic__default_style.css",
+    },
+    images: {
+        scheme: "inlined",
+    },
+    tokens: {
+        scheme: "theo",
+        tokensFilePath: "plasmic-tokens.theo.json",
+    },
+    srcDir: "src/",
+    defaultPlasmicDir: "./plasmic",
+    projects: [],
+    globalVariants: {
+        variantGroups: [],
+    },
+    cliVersion: "0.1.44",
+};
+function standardTestSetup(includeDep = true) {
+    process.env.PLASMIC_DISABLE_AUTH_SEARCH = "1";
+    // Setup server-side mock data
+    const project1 = {
+        projectId: "projectId1",
+        projectApiToken: "abc",
+        version: "1.2.3",
+        projectName: "project1",
+        components: [
+            {
+                id: "buttonId",
+                name: "Button",
+            },
+            {
+                id: "containerId",
+                name: "Container",
+            },
+        ],
+        dependencies: includeDep
+            ? {
+                dependencyId1: "2.3.4",
+            }
+            : {},
+    };
+    const dependency = {
+        projectId: "dependencyId1",
+        projectApiToken: "def",
+        version: "2.3.4",
+        projectName: "dependency1",
+        components: [
+            {
+                id: "depComponentId",
+                name: "DepComponent",
+            },
+        ],
+        dependencies: {},
+    };
+    [project1, dependency].forEach((p) => exports.mockApi.addMockProject(p));
+    // Setup client-side directory
+    exports.tmpRepo = new test_utils_1.TempRepo();
+    exports.tmpRepo.writePlasmicAuth({
+        host: "http://localhost:3003",
+        user: "yang@plasmic.app",
+        token: "faketoken",
+    });
+    exports.tmpRepo.writePlasmicJson(exports.defaultPlasmicJson);
+    // Default opts and config
+    exports.opts = {
+        projects: [],
+        yes: true,
+        force: true,
+        nonRecursive: false,
+        skipUpgradeCheck: true,
+        forceOverwrite: true,
+        newComponentScheme: "blackbox",
+        appendJsxOnMissingBase: false,
+        config: exports.tmpRepo.plasmicJsonPath(),
+        auth: exports.tmpRepo.plasmicAuthPath(),
+        loaderConfig: exports.tmpRepo.plasmicLoaderJsonPath(),
+        baseDir: process.cwd(),
+    };
+}
+exports.standardTestSetup = standardTestSetup;
+function standardTestTeardown() {
+    exports.tmpRepo.destroy();
+    exports.mockApi.clear();
+    delete process.env["PLASMIC_DISABLE_AUTH_SEARCH"];
+}
+exports.standardTestTeardown = standardTestTeardown;
+function expectProject1Components() {
+    // Check correct files exist
+    const button = exports.mockApi.stringToMockComponent(exports.tmpRepo.getComponentFileContents("projectId1", "buttonId"));
+    const container = exports.mockApi.stringToMockComponent(exports.tmpRepo.getComponentFileContents("projectId1", "containerId"));
+    expect(button).toBeTruthy();
+    expect(container).toBeTruthy();
+    expect(button === null || button === void 0 ? void 0 : button.name).toEqual("Button");
+    expect(button === null || button === void 0 ? void 0 : button.version).toEqual("1.2.3");
+    expect(container === null || container === void 0 ? void 0 : container.name).toEqual("Container");
+    expect(container === null || container === void 0 ? void 0 : container.version).toEqual("1.2.3");
+}
+exports.expectProject1Components = expectProject1Components;
+exports.project1Config = {
+    projectId: "projectId1",
+    projectName: "Project 1",
+    version: "latest",
+    cssFilePath: "plasmic/PP__demo.css",
+    components: [
+        {
+            id: "buttonId",
+            name: "Button",
+            type: "managed",
+            projectId: "projectId1",
+            renderModuleFilePath: "plasmic/project_id_1/PlasmicButton.tsx",
+            importSpec: {
+                modulePath: "Button.tsx",
+            },
+            cssFilePath: "plasmic/PlasmicButton.css",
+            scheme: "blackbox",
+            componentType: "component",
+        },
+    ],
+    icons: [],
+    images: [],
+    jsBundleThemes: [],
+};
+function expectProject1PlasmicJson() {
+    const plasmicJson = exports.tmpRepo.readPlasmicJson();
+    expect(plasmicJson.projects.length).toEqual(1);
+    const projectConfig = plasmicJson.projects[0];
+    expect(projectConfig.projectApiToken).toBe("abc");
+    expect(projectConfig.components.length).toEqual(2);
+    const componentNames = projectConfig.components.map((c) => c.name);
+    expect(componentNames).toContain("Button");
+    expect(componentNames).toContain("Container");
+}
+exports.expectProject1PlasmicJson = expectProject1PlasmicJson;
+function expectProjectAndDepPlasmicJson() {
+    const plasmicJson = exports.tmpRepo.readPlasmicJson();
+    expect(plasmicJson.projects.length).toEqual(2);
+    const projectConfigMap = lodash_1.default.keyBy(plasmicJson.projects, (p) => p.projectId);
+    expect(projectConfigMap["projectId1"]).toBeTruthy();
+    expect(projectConfigMap["dependencyId1"]).toBeTruthy();
+    const projectComponentNames = projectConfigMap["projectId1"].components.map((c) => c.name);
+    const depComponentNames = projectConfigMap["dependencyId1"].components.map((c) => c.name);
+    expect(projectComponentNames).toContain("Button");
+    expect(projectComponentNames).toContain("Container");
+    expect(depComponentNames).toContain("DepComponent");
+}
+exports.expectProjectAndDepPlasmicJson = expectProjectAndDepPlasmicJson;