import { DeepPartial } from "utility-types"; import { PlasmicApi } from "../api"; export declare const DEFAULT_HOST: string; export declare const AUTH_FILE_NAME = ".plasmic.auth"; export declare const CONFIG_FILE_NAME = "plasmic.json"; export declare const LOCK_FILE_NAME = "plasmic.lock"; export declare const CONFIG_SCHEMA_FILE_NAME = "plasmic.schema.json"; export declare const ENV_AUTH_HOST = "PLASMIC_AUTH_HOST"; export declare const ENV_AUTH_USER = "PLASMIC_AUTH_USER"; export declare const ENV_AUTH_TOKEN = "PLASMIC_AUTH_TOKEN"; export interface PlasmicConfig { /** Target platform to generate code for */ platform: "react" | "nextjs" | "gatsby" | "tanstack"; /** * The folder containing the component source files; this is the default place where * all files are generated and stored. */ srcDir: string; /** * The default folder where Plasmic-managed files will be stored. These include * blackbox component files, svg component files, style files, etc. The path * is relative to the srcDir. */ defaultPlasmicDir: string; /** * Next.js specific config */ nextjsConfig?: { /** The folder containing page components source files. */ pagesDir?: string; }; /** Gatsby-specific config */ gatsbyConfig?: { /** The folder containing page components source files. */ pagesDir?: string; }; /** Tanstack-specific config */ tanstackConfig?: { /** The folder containing page components source files. */ pagesDir?: string; }; /** Config for code generation */ code: CodeConfig; /** Config for pictures */ images: ImagesConfig; /** Config for fonts import */ fontOpts?: FontConfig; /** Config for style generation */ style: StyleConfig; /** Config for style tokens */ tokens: TokensConfig; /** Metadata for global variant groups */ globalVariants: GlobalVariantsConfig; /** Metadata for each project that has been synced */ projects: ProjectConfig[]; /** Wether we should wrap the pages with the project global contexts or not */ wrapPagesWithGlobalContexts: boolean; /** Whether to preserve js / ts / jsx / tsx file extensions in import statements */ preserveJsImportExtensions: boolean; /** The version of cli when this file was written */ cliVersion?: string; /** Configuration for localization */ i18n?: I18NConfig; /** Arbitrary command to run after `plasmic sync` has run; useful for linting and code formatting synced files */ postSyncCommands?: string[]; /** * Package manager to use when installing or upgrading required * packages. If not specified, then it is best-effort automatically * derived. */ packageManager?: "npm" | "yarn" | "yarn2" | "pnpm"; } export interface CodeConfig { /** Language to generate code in */ lang: "ts" | "js"; /** The default code generation scheme. Each component can override the scheme. */ scheme: "blackbox"; reactRuntime: "classic" | "automatic"; } export interface StyleConfig { /** Styling framework to use */ scheme: "css" | "css-modules"; /** File location for global css styles shared by all components. Relative to srcDir */ defaultStyleCssFilePath: string; skipGlobalCssImport?: boolean; } export interface ImagesConfig { /** * How image files should be referenced from generated React components. The choices are: * * "files" - imported as relative files, like "import img from './image.png'". Not all bundlers support this. * * "public-files" - images are stored in a public folder, and referenced from some url prefix, like ``. * * "inlined" - inlined directly into React files and css files as base64-encoded data-URIs. * * "cdn" - images are served from Plasmic's CDN. Allows for dynamic resizing of images for * serving the optimal file size given browser viewport. */ scheme: "inlined" | "files" | "public-files" | "cdn"; /** * 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" */ publicDir?: string; /** * 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. */ publicUrlPrefix?: string; } export interface CodeComponentConfig { id: string; name: string; displayName: string; componentImportPath: string; helper?: { name: string; importPath: string; }; } export interface CustomFunctionConfig { id: string; name: string; namespace?: string | null; importPath: string; defaultExport: boolean; } export interface ProjectConfig { /** Project ID */ projectId: string; /** Project API token. Grants read-only sync access to just this specific project and its dependencies. */ projectApiToken?: string; /** Project name synced down from Studio */ projectName: string; /** Project branch to be synced */ projectBranchName?: string; /** * A version range for syncing this project. Can be: * * "latest" - always syncs down whatever has been saved in the project. * * ">0" - always syncs down the latest published version of the project. * * any other semver string you'd like */ version: string; /** File location for the project-wide css styles. Relative to srcDir */ cssFilePath: string; /** File location for the project-wide global contexts. Relative to srcDir */ globalContextsFilePath: string; /** File location for the project-wide splits provider. Relative to srcDir */ splitsProviderFilePath: string; /** File location for the project-wide style tokens provider. Relative to srcDir */ styleTokensProviderFilePath: string; /** File location for the project-wide data tokens provider. Relative to srcDir */ dataTokensFilePath: string; /** File location for the project-wide plasmic.ts file. Relative to srcDir */ projectModuleFilePath: string; codeComponents?: CodeComponentConfig[]; customFunctions?: CustomFunctionConfig[]; /** Metadata for each synced component in this project. */ components: ComponentConfig[]; /** Metadata for each synced icon in this project */ icons: IconConfig[]; /** Metadata for each synced image in this project */ images: ImageConfig[]; /** * True if the project was installed indirectly (as a dependency); if set, * codegen will not generate pages. */ indirect: boolean; } export declare function createProjectConfig(base: { projectId: string; projectApiToken: string; projectName: string; version: string; cssFilePath: string; indirect: boolean; }): ProjectConfig; export interface TokensConfig { scheme: "theo"; tokensFilePath: string; } /** * Describes how to import a Component */ export interface ImportSpec { /** * The import path to use to instantiate this Component. The modulePath can be: * * An external npm module, like "antd/lib/button" * * 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. * * For this to be an external npm module, the ComponentConfig.type must be "mapped". */ modulePath: string; /** * If the Component is a named export of the module, then this is the name. If the Component * is the default export, then this is undefined. */ exportName?: string; } export interface ComponentConfig { /** Component ID */ id: string; /** Javascript name of component */ name: string; /** Plasmic project that this component belongs in */ projectId: string; /** Whether this component is managed by Plasmic -- with Plasmic* files generated -- or mapped to an external library */ type: "managed" | "mapped"; /** How to import this Component from another component file */ importSpec: ImportSpec; /** The file path for the blackbox render module, relative to srcDir. */ renderModuleFilePath: string; /** The file path for the component css file, relative to srcDir. */ cssFilePath: string; /** Code generation scheme used for this component */ scheme: "blackbox" | "direct"; componentType: "page" | "component"; /** Page path if the component is a page */ path?: string; /** Plume type if component is a Plume component */ plumeType?: string; /** * RSC metadata for this component. The structure of the config changes when this is set: * renderModuleFilePath points to the client blackbox render module. * importSpec points to the server skeleton file. */ rsc?: { /** The server blackbox render module */ serverModulePath: string; /** The client skeleton file */ clientModulePath: string; }; } export interface IconConfig { /** ID of icon */ id: string; /** Javascript name of the React component for this icon */ name: string; /** The file path for the React component file for this icon, relative to srcDir. */ moduleFilePath: string; } export interface ImageConfig { /** ID of image */ id: string; /** name of image */ name: string; /** File path for the image file, relative to srcDir */ filePath: string; } export interface FontConfig { /** "import" generates `@import url(...)` * * "none" doesn't generate anything; you need to load the font yourself. */ scheme: "import" | "none"; } export interface GlobalVariantsConfig { variantGroups: GlobalVariantGroupConfig[]; } export interface GlobalVariantGroupConfig { /** ID of the global variant group */ id: string; /** Javascript name of the global variant group */ name: string; /** Plasmic project this global variant group belongs to */ projectId: string; /** File path for the global variant group React context definition, relative to srcDir */ contextFilePath: string; } export interface FileLock { type: "renderModule" | "cssRules" | "icon" | "image" | "projectCss" | "globalVariant" | "globalContexts" | "splitsProvider" | "styleTokensProvider" | "dataTokens" | "projectModule"; checksum: string; assetId: string; } export interface ProjectLock { projectId: string; branchName: string; version: string; dependencies: { [projectId: string]: string; }; lang: "ts" | "js"; fileLocks: FileLock[]; codegenVersion?: string; } export interface I18NConfig { /** * For localization, whether the extracted strings are keyed by its content, * or by a hash of its content, or by where the string is found ("path") */ keyScheme: "content" | "hash" | "path"; /** * For localization, rich text with embedded tags are exported as * "Hello <0>there, I am <1>here". Some frameworks, like * react-intl, doesn't work with numbers as tag names, so you can * specify a prefix. For example, a tagPrefix of "n" turns the above * into "Hello there, I am here". */ tagPrefix?: string; } export interface PlasmicLock { projects: ProjectLock[]; cliVersion?: string; } /** * PlasmicContext is the PlasmicConfig plus context in which the PlasmicConfig was * created. */ export interface PlasmicContext { configFile: string; lockFile: string; rootDir: string; absoluteSrcDir: string; config: PlasmicConfig; lock: PlasmicLock; auth: AuthConfig; api: PlasmicApi; cliArgs: any; } export interface AuthConfig { host: string; user: string; token: string; basicAuthUser?: string; basicAuthPassword?: string; } export declare const DEFAULT_CONFIG: PlasmicConfig; export declare const DEFAULT_PUBLIC_FILES_CONFIG: ImagesConfig; /** * Finds the full path to the plasmic.json file in `dir`. If * `opts.traverseParents` is set to true, then will also look in ancestor * directories until the plasmic.json file is found. If none is found, * returns undefined. */ export declare function findConfigFile(dir: string, opts: { traverseParents?: boolean; }): string | undefined; /** * Given some partial configs for PlasmicConfig, fills in all required fields * with default values. */ export declare function fillDefaults(config: DeepPartial): PlasmicConfig; export declare function readConfig(configFile: string, autoFillDefaults: boolean): PlasmicConfig; export declare function writeConfig(configFile: string, config: PlasmicConfig): Promise; export declare function writeLock(lockFile: string, lock: PlasmicLock): Promise; export declare function updateConfig(context: PlasmicContext, newConfig: PlasmicConfig): Promise; export declare function getOrAddProjectConfig(context: PlasmicContext, projectId: string, base?: ProjectConfig): ProjectConfig; export declare function getOrAddProjectLock(context: PlasmicContext, projectId: string, branchName: string, base?: ProjectLock): ProjectLock; export declare function isPageAwarePlatform(platform: string): boolean;