@plasmicapp/host 2.0.0-alpha.0 → 2.0.0-alpha.1

package/dist/types/shared-controls.d.ts

@@ -0,0 +1,50 @@
+export type GenericContext<Props, Data, Extra = unknown> = [Props, Data, Extra];
+/**
+ * Config option that takes the context (e.g., props) of the component instance
+ * or function to dynamically set its value.
+ */
+export type ContextDependentConfig<Ctx extends any[], R> = (...args: Ctx) => R;
+export type MaybeContextDependentConfig<Ctx extends any[], V> = V | ContextDependentConfig<Ctx, V>;
+export interface CanvasComponentProps<Data = any> {
+    /**
+     * This prop is only provided within the canvas of Plasmic Studio.
+     * Allows the component to set data to be consumed by the props' controls.
+     */
+    setControlContextData?: (data: Data) => void;
+}
+export type ControlExtras = {
+    path: (string | number)[];
+    item?: any;
+};
+export type InferDataType<P> = P extends CanvasComponentProps<infer Data> ? Data : any;
+export interface CommonTypeBase {
+    description?: string;
+    helpText?: string;
+    /**
+     * If true, will hide the prop in a collapsed section; good for props that
+     * should not usually be used.
+     */
+    advanced?: boolean;
+    /**
+     * If the user has chosen to use a dynamic expression for this prop, provide
+     * a hint as to the expected values that the expression should evaluate to.
+     * This hint will be displayed alongside the code editor.  You may use
+     * markdown in the text here.
+     */
+    exprHint?: string;
+    /**
+     * If true, does not allow the user to use a dynamic expression for this prop
+     */
+    disableDynamicValue?: boolean;
+}
+export interface Defaultable<Ctx extends any[], T> {
+    /**
+     * Default value to set for this prop when the component is instantiated
+     */
+    defaultValue?: T;
+    /**
+     * Specify that default when no prop/param is provided,
+     * so the Plasmic user can see it in the studio UI
+     */
+    defaultValueHint?: T | ContextDependentConfig<Ctx, T | undefined>;
+}

package/dist/types/type-utils.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Converts a union type to a tuple type of the same members
+ */
+export type TupleUnion<U extends string, R extends string[] = []> = {
+    [S in U]: Exclude<U, S> extends never ? [...R, S] : TupleUnion<Exclude<U, S>, [...R, S]>;
+}[U] & string[];
+export type Nullish<T> = T | null | undefined;

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const hostVersion = "2.0.0-alpha.0";
+export declare const hostVersion = "2.0.0-alpha.1";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plasmicapp/host",
-  "version": "2.0.0-alpha.0",
+  "version": "2.0.0-alpha.1",
   "description": "plasmic library for app hosting",
   "repository": {
     "type": "git",
@@ -41,14 +41,15 @@
   ],
   "scripts": {
     "build": "./update_version.sh && rollup -c",
-    "test": "TEST_CWD=`pwd` yarn --cwd=../.. test --passWithNoTests",
+    "test": "jest",
+    "test:types": "tstyche --config ../../tstyche.config.json",
     "lint": "eslint",
     "prepublishOnly": "npm run build",
     "size": "size-limit",
     "analyze": "size-limit --why"
   },
   "dependencies": {
-    "@plasmicapp/query": "0.1.79",
+    "@plasmicapp/query": "0.1.82",
     "csstype": "^3.1.2",
     "window-or-global": "^1.0.1"
   },

package/registerComponent/dist/data.d.ts

@@ -51,12 +51,8 @@ export interface PageParamsProviderProps {
      * Page query params (e.g. { q: "search term" })
      */
     query?: Record<string, string | string[] | undefined>;
-    /**
-     * @deprecated Use `route` instead.
-     */
-    path?: string;
 }
-export declare function PageParamsProvider({ children, route, path: deprecatedRoute, params, query, }: PageParamsProviderProps): React.JSX.Element;
+export declare function PageParamsProvider({ children, route, params, query, }: PageParamsProviderProps): React.JSX.Element;
 export declare function DataCtxReader({ children, }: {
     children: ($ctx: DataDict | undefined) => ReactNode;
 }): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;

package/registerComponent/dist/exports.d.ts

@@ -1,12 +1,11 @@
 export { PlasmicCanvasContext, PlasmicCanvasHost, usePlasmicCanvasComponentInfo, usePlasmicCanvasContext, } from "./canvas-host";
 export * from "./data";
 export { PlasmicElement } from "./element-types";
-export { registerFetcher as unstable_registerFetcher } from "./fetcher";
 export * from "./global-actions";
 export * from "./link";
-export { ContextDependentConfig, CustomControlProps, ProjectData, PropType, StudioOps, } from "./prop-types";
-export { Action, ActionProps, CodeComponentMeta, CodeComponentMode, ComponentHelpers, ComponentMeta, ComponentRegistration, ComponentTemplates, StateHelpers, StateSpec, default as registerComponent, stateHelpersKeys, } from "./registerComponent";
-export { CustomFunctionMeta, CustomFunctionRegistration, ParamType, default as registerFunction, } from "./registerFunction";
+export { ChoiceObject, ChoiceOptions, ChoiceValue, ComponentContextConfig, ComponentControlContext, ContextDependentConfig, ControlExtras, CustomControlProps, ProjectData, PropType, StudioOps, } from "./prop-types";
+export { Action, ActionProps, CodeComponentMeta, CodeComponentMode, ComponentHelpers, ComponentRegistration, ComponentTemplates, StateHelpers, StateSpec, default as registerComponent, stateHelpersKeys, } from "./registerComponent";
+export { CustomFunctionMeta, CustomFunctionRegistration, FunctionContextConfig, FunctionControlContext, ParamType, default as registerFunction, } from "./registerFunction";
 export { GlobalContextMeta, PropType as GlobalContextPropType, GlobalContextRegistration, default as registerGlobalContext, } from "./registerGlobalContext";
 export { TokenRegistration, TokenType, default as registerToken, } from "./registerToken";
 export { BasicTrait, ChoiceTrait, TraitMeta, TraitRegistration, default as registerTrait, } from "./registerTrait";

package/registerComponent/dist/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../src/registerComponent.ts"],"sourcesContent":["import { CodeComponentElement, CSSProperties } from \"./element-types\";\nimport {\n  ContextDependentConfig,\n  InferDataType,\n  ProjectData,\n  PropType,\n  RestrictPropType,\n  StudioOps,\n} from \"./prop-types\";\nimport { TupleUnion } from \"./type-utils\";\nexport type * from \"./prop-types\";\n\nconst root = globalThis as any;\n\nexport interface ActionProps<P> {\n  componentProps: P;\n  /**\n   * `contextData` can be `null` if the prop controls are rendering before\n   * the component instance itself (it will re-render once the component\n   * calls `setControlContextData`)\n   */\n  contextData: InferDataType<P> | null;\n  /**\n   * Operations available to the editor that allow modifying the entire component.\n   */\n  studioOps: StudioOps;\n  /**\n   * Metadata from the studio project.\n   */\n  projectData: ProjectData;\n  /**\n   * The document that the component will be rendered into; instead of using\n   * `document` directly (for, say, `document.querySelector()` etc.), you\n   * should use this instead.\n   */\n  studioDocument: typeof document;\n}\n\nexport type Action<P> =\n  | {\n      type: \"button-action\";\n      label: string;\n      onClick: (props: ActionProps<P>) => void;\n      hidden?: ContextDependentConfig<P, boolean>;\n    }\n  | {\n      type: \"custom-action\";\n      control: React.ComponentType<ActionProps<P>>;\n      hidden?: ContextDependentConfig<P, boolean>;\n    };\n\ntype DistributedKeyOf<T> = T extends any ? keyof T : never;\n\ninterface ComponentTemplate<P>\n  extends Omit<CodeComponentElement<P>, \"type\" | \"name\"> {\n  /**\n   * A preview picture for the template.\n   */\n  previewImg?: string;\n}\n\nexport interface ComponentTemplates<P> {\n  [name: string]: ComponentTemplate<P>;\n}\n\nexport type StateSpec<P> = {\n  onChangeProp: string;\n\n  /**\n   * If true, will hide the state on studio.\n   */\n  hidden?: ContextDependentConfig<P, boolean>;\n\n  /**\n   * If true, will hide the state in a collapsed section; good for states that\n   * should not usually be used.\n   */\n  advanced?: ContextDependentConfig<P, boolean>;\n} & (\n  | {\n      type: \"readonly\";\n      variableType: \"text\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"number\";\n      initVal?: number;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"boolean\";\n      initVal?: boolean;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"array\";\n      initVal?: any[];\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"object\";\n      initVal?: object;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateString\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateRangeStrings\";\n      initVal?: [string, string];\n    }\n  | {\n      type: \"writable\";\n      variableType:\n        | \"text\"\n        | \"number\"\n        | \"boolean\"\n        | \"array\"\n        | \"object\"\n        | \"dateString\"\n        | \"dateRangeStrings\";\n      valueProp: string;\n    }\n);\n\nexport interface StateHelpers<P, T> {\n  initFunc?: ($props: P) => T;\n  onChangeArgsToValue?: (...args: any) => T;\n  onMutate?: (stateValue: T, $ref: any) => void;\n}\n\n// A compile-time error will occur if a new field is added to the StateHelper\n// interface but not included in the keys array of state helper.\nexport const stateHelpersKeys: TupleUnion<keyof StateHelpers<any, any>> = [\n  \"initFunc\",\n  \"onChangeArgsToValue\",\n  \"onMutate\",\n];\n\nexport type ComponentHelpers<P> = {\n  states: Record<string, StateHelpers<P, any>>;\n};\n\nexport type ExternalComponentHelpers<P> = {\n  helpers: ComponentHelpers<P>;\n  importPath: string;\n} & (\n  | {\n      importName: string;\n    }\n  | {\n      isDefaultExport: true;\n    }\n);\n\nexport type StyleSection =\n  | \"visibility\"\n  | \"typography\"\n  | \"sizing\"\n  | \"spacing\"\n  | \"background\"\n  | \"transform\"\n  | \"transitions\"\n  | \"layout\"\n  | \"overflow\"\n  | \"border\"\n  | \"shadows\"\n  | \"effects\";\n\nexport interface CodeComponentMeta<P> {\n  /**\n   * Any unique string name used to identify that component. Each component\n   * should be registered with a different `meta.name`, even if they have the\n   * same name in the code.\n   */\n  name: string;\n  /**\n   * The name to be displayed for the component in Studio. Optional: if not\n   * specified, `meta.name` is used.\n   */\n  displayName?: string;\n  /**\n   * The description of the component to be shown in Studio.\n   */\n  description?: string;\n  /**\n   * A specific section to which the component should be displayed in Studio. By default, the component will be displayed in the \"Custom Components\" section.\n   * A new section will be created to display the components with the same `section` value.\n   */\n  section?: string;\n  /**\n   * A link to an image that will be displayed as a thumbnail of the component in the Studio, if the component has a `section` specified.\n   */\n  thumbnailUrl?: string;\n  /**\n   * The javascript name to be used when generating code. Optional: if not\n   * provided, `meta.name` is used.\n   */\n  importName?: string;\n  /**\n   * An object describing the component properties to be used in Studio.\n   * For each `prop`, there should be an entry `meta.props[prop]` describing\n   * its type.\n   */\n  props: { [prop in DistributedKeyOf<P>]?: RestrictPropType<P[prop], P> } & {\n    [prop: string]: PropType<P>;\n  };\n  /**\n   * An object describing the component states to be used in Studio.\n   */\n  states?: Record<string, StateSpec<P>>;\n  /**\n   * An object describing the components helpers to be used in Studio.\n   *   1. states helpers: Each state can receive an \"initFunc\" prop to initialize\n   *      the implicit state in Studio, and an \"onChangeArgsToValue\" prop to\n   *      transform the event handler arguments into a value\n   */\n  componentHelpers?: ExternalComponentHelpers<P>;\n  /**\n   * An array describing the component actions to be used in Studio.\n   */\n  actions?: Action<P>[];\n  /**\n   * Whether style sections should be shown in Studio. For styles to work, the\n   * component must accept a `className` prop. If unset, defaults to all styles.\n   * Set to `false` if this component cannot be styled (for example, if it doesn't\n   * render any DOM elements).\n   */\n  styleSections?: StyleSection[] | boolean;\n  /**\n   * Whether the element can be repeated in Studio. If unset, defaults to true.\n   */\n  isRepeatable?: boolean;\n  /**\n   * The path to be used when importing the component in the generated code.\n   * It can be the name of the package that contains the component, or the path\n   * to the file in the project (relative to the root directory).\n   */\n  importPath: string;\n  /**\n   *  Whether the component is the default export from that path. Optional: if\n   * not specified, it's considered `false`.\n   */\n  isDefaultExport?: boolean;\n  /**\n   * The prop that expects the CSS classes with styles to be applied to the\n   * component. Optional: if not specified, Plasmic will expect it to be\n   * `className`. Notice that if the component does not accept CSS classes, the\n   * component will not be able to receive styles from the Studio.\n   */\n  classNameProp?: string;\n  /**\n   * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`\n   * to interact with components, so it's not used in the generated code.\n   * Optional: If not provided, the usual `ref` is used.\n   */\n  refProp?: string;\n  /**\n   * Default styles to start with when instantiating the component in Plasmic.\n   */\n  defaultStyles?: CSSProperties;\n  /**\n   * Component templates to start with on Plasmic.\n   */\n  templates?: ComponentTemplates<P>;\n  /**\n   * Registered name of parent component, used for grouping related components.\n   */\n  parentComponentName?: string;\n  /**\n   * Whether the component can be used as an attachment to an element.\n   */\n  isAttachment?: boolean;\n  /**\n   * Whether the component provides data to its slots using DataProvider.\n   */\n  providesData?: boolean;\n\n  /**\n   * If specified, then Figma components with the specified names will be mapped\n   * to this component when you paste Figma content into Plasmic\n   */\n  figmaMappings?: {\n    figmaComponentName: string;\n  }[];\n\n  /**\n   * If specified, then Figma components will have their properties transformed\n   * before being applied to this component. This is useful for transforming Figma\n   * properties to the format expected by the component.\n   */\n  figmaPropsTransform?: (\n    props: Record<string, string | number | boolean>\n  ) => Record<\n    string,\n    string | number | boolean | null | unknown[] | Record<string, unknown>\n  >;\n\n  /**\n   * If true, when an instance of this component is added, the element\n   * will always be named by the name of this component.\n   */\n  alwaysAutoName?: boolean;\n\n  /**\n   * If true, then won't be listed in the insert menu for content creators.\n   */\n  hideFromContentCreators?: boolean;\n\n  refActions?: Record<string, RefActionRegistration<P>>;\n\n  /**\n   * Optional function that takes in component props and context, and returns\n   * a string that will be used for labeling this element in the Outline panel\n   * on the left of the Studio.  This makes it easy to identify an element when\n   * looking at the tree.\n   */\n  treeLabel?: ContextDependentConfig<P, string>;\n\n  /**\n   * The value of the CSS display property used by this component.\n   * Plasmic passes in a class name prop to components to let users style them,\n   * but normally this does not include layout properties like display.\n   * However, if the user has set the components visibility to be visible\n   * (for instance, in the base variant it was set to not visible ie display none,\n   * but in a variant it's overridden to be visible), then Plasmic needs to know\n   * what display property to set.\n   * Defaults to \"flex\".\n   */\n  defaultDisplay?: string;\n\n  /**\n   * When true, when you click for the first time anywhere in the component including its slots, the component itself is\n   * selected, making it easier to select the component instead of slot contents. So for instance, setting this on a\n   * Button ensures that clicking on the Button’s text will still select the Button and not the text element in its\n   * slot. Clicking again will deep-select the slot content.\n   */\n  trapsFocus?: boolean;\n\n  /**\n   * An object registering code component's variants that should be allowed in Studio, when the component is\n   * used as the root of a Studio component.\n   */\n  variants?: Record<\n    string,\n    {\n      cssSelector: string;\n      displayName: string;\n    }\n  >;\n}\n\nexport type CodeComponentMode =\n  | \"advanced\"\n  | \"simplified\"\n  | \"database-schema-driven\";\n\n/**\n * @deprecated use CodeComponentMeta instead\n */\nexport type ComponentMeta<P> = CodeComponentMeta<P>;\n\nexport interface FunctionParam<P> {\n  name: string;\n  displayName?: string;\n  type: PropType<P>;\n}\n\nexport interface RefActionRegistration<P> {\n  displayName?: string;\n  description?: string;\n  argTypes: FunctionParam<P>[];\n}\n\nexport interface ComponentRegistration {\n  component: React.ComponentType<any>;\n  meta: CodeComponentMeta<any>;\n}\n\ndeclare global {\n  interface Window {\n    __PlasmicComponentRegistry: ComponentRegistration[];\n  }\n}\n\nif (root.__PlasmicComponentRegistry == null) {\n  root.__PlasmicComponentRegistry = [];\n}\n\nexport default function registerComponent<T extends React.ComponentType<any>>(\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>\n) {\n  // Check for duplicates\n  if (\n    root.__PlasmicComponentRegistry.some(\n      (r: ComponentRegistration) =>\n        r.component === component && r.meta.name === meta.name\n    )\n  ) {\n    return;\n  }\n  root.__PlasmicComponentRegistry.push({ component, meta });\n}\n"],"names":[],"mappings":";;;;;AAYA,IAAM,IAAI,GAAG,UAAiB,CAAC;AA0H/B;AACA;AACa,IAAA,gBAAgB,GAA6C;IACxE,UAAU;IACV,qBAAqB;IACrB,UAAU;EACV;AAwPF,IAAI,IAAI,CAAC,0BAA0B,IAAI,IAAI,EAAE;AAC3C,IAAA,IAAI,CAAC,0BAA0B,GAAG,EAAE,CAAC;AACtC,CAAA;AAEa,SAAU,iBAAiB,CACvC,SAAY,EACZ,IAAgD,EAAA;;AAGhD,IAAA,IACE,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAClC,UAAC,CAAwB,EAAA;AACvB,QAAA,OAAA,CAAC,CAAC,SAAS,KAAK,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAA;AAAtD,KAAsD,CACzD,EACD;QACA,OAAO;AACR,KAAA;AACD,IAAA,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,EAAE,SAAS,EAAA,SAAA,EAAE,IAAI,EAAA,IAAA,EAAE,CAAC,CAAC;AAC5D;;;;;"}
+{"version":3,"file":"index.cjs.js","sources":["../../src/registerComponent.ts"],"sourcesContent":["import { CodeComponentElement, CSSProperties } from \"./element-types\";\nimport {\n  ComponentContextConfig,\n  ProjectData,\n  PropType,\n  RestrictPropType,\n  StudioOps,\n} from \"./types/component-types\";\nimport { InferDataType } from \"./types/shared-controls\";\nimport { TupleUnion } from \"./types/type-utils\";\nexport type * from \"./prop-types\";\n\nconst root = globalThis as any;\n\nexport interface ActionProps<P> {\n  componentProps: P;\n  /**\n   * `contextData` can be `null` if the prop controls are rendering before\n   * the component instance itself (it will re-render once the component\n   * calls `setControlContextData`)\n   */\n  contextData: InferDataType<P> | null;\n  /**\n   * Operations available to the editor that allow modifying the entire component.\n   */\n  studioOps: StudioOps;\n  /**\n   * Metadata from the studio project.\n   */\n  projectData: ProjectData;\n  /**\n   * The document that the component will be rendered into; instead of using\n   * `document` directly (for, say, `document.querySelector()` etc.), you\n   * should use this instead.\n   */\n  studioDocument: typeof document;\n}\n\nexport type Action<P> =\n  | {\n      type: \"button-action\";\n      label: string;\n      onClick: (props: ActionProps<P>) => void;\n      hidden?: ComponentContextConfig<P, boolean>;\n    }\n  | {\n      type: \"custom-action\";\n      control: React.ComponentType<ActionProps<P>>;\n      hidden?: ComponentContextConfig<P, boolean>;\n    };\n\ntype DistributedKeyOf<T> = T extends any ? keyof T : never;\n\ninterface ComponentTemplate<P>\n  extends Omit<CodeComponentElement<P>, \"type\" | \"name\"> {\n  /**\n   * A preview picture for the template.\n   */\n  previewImg?: string;\n}\n\nexport interface ComponentTemplates<P> {\n  [name: string]: ComponentTemplate<P>;\n}\n\nexport type StateSpec<P> = {\n  onChangeProp: string;\n\n  /**\n   * If true, will hide the state on studio.\n   */\n  hidden?: ComponentContextConfig<P, boolean>;\n\n  /**\n   * If true, will hide the state in a collapsed section; good for states that\n   * should not usually be used.\n   */\n  advanced?: ComponentContextConfig<P, boolean>;\n} & (\n  | {\n      type: \"readonly\";\n      variableType: \"text\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"number\";\n      initVal?: number;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"boolean\";\n      initVal?: boolean;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"array\";\n      initVal?: any[];\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"object\";\n      initVal?: object;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateString\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateRangeStrings\";\n      initVal?: [string, string];\n    }\n  | {\n      type: \"writable\";\n      variableType:\n        | \"text\"\n        | \"number\"\n        | \"boolean\"\n        | \"array\"\n        | \"object\"\n        | \"dateString\"\n        | \"dateRangeStrings\";\n      valueProp: string;\n    }\n);\n\nexport interface StateHelpers<P, T> {\n  initFunc?: ($props: P) => T;\n  onChangeArgsToValue?: (...args: any) => T;\n  onMutate?: (stateValue: T, $ref: any) => void;\n}\n\n// A compile-time error will occur if a new field is added to the StateHelper\n// interface but not included in the keys array of state helper.\nexport const stateHelpersKeys: TupleUnion<keyof StateHelpers<any, any>> = [\n  \"initFunc\",\n  \"onChangeArgsToValue\",\n  \"onMutate\",\n];\n\nexport type ComponentHelpers<P> = {\n  states: Record<string, StateHelpers<P, any>>;\n};\n\nexport type ExternalComponentHelpers<P> = {\n  helpers: ComponentHelpers<P>;\n  importPath: string;\n} & (\n  | {\n      importName: string;\n    }\n  | {\n      isDefaultExport: true;\n    }\n);\n\nexport type StyleSection =\n  | \"visibility\"\n  | \"typography\"\n  | \"sizing\"\n  | \"spacing\"\n  | \"background\"\n  | \"transform\"\n  | \"transitions\"\n  | \"layout\"\n  | \"overflow\"\n  | \"border\"\n  | \"shadows\"\n  | \"effects\";\n\nexport interface CodeComponentMeta<P> {\n  /**\n   * Any unique string name used to identify that component. Each component\n   * should be registered with a different `meta.name`, even if they have the\n   * same name in the code.\n   */\n  name: string;\n  /**\n   * The name to be displayed for the component in Studio. Optional: if not\n   * specified, `meta.name` is used.\n   */\n  displayName?: string;\n  /**\n   * The description of the component to be shown in Studio.\n   */\n  description?: string;\n  /**\n   * A specific section to which the component should be displayed in Studio. By default, the component will be displayed in the \"Custom Components\" section.\n   * A new section will be created to display the components with the same `section` value.\n   */\n  section?: string;\n  /**\n   * A link to an image that will be displayed as a thumbnail of the component in the Studio, if the component has a `section` specified.\n   */\n  thumbnailUrl?: string;\n  /**\n   * The javascript name to be used when generating code. Optional: if not\n   * provided, `meta.name` is used.\n   */\n  importName?: string;\n  /**\n   * An object describing the component properties to be used in Studio.\n   * For each `prop`, there should be an entry `meta.props[prop]` describing\n   * its type.\n   */\n  props: { [prop in DistributedKeyOf<P>]?: RestrictPropType<P[prop], P> } & {\n    [prop: string]: PropType<P>;\n  };\n  /**\n   * An object describing the component states to be used in Studio.\n   */\n  states?: Record<string, StateSpec<P>>;\n  /**\n   * An object describing the components helpers to be used in Studio.\n   *   1. states helpers: Each state can receive an \"initFunc\" prop to initialize\n   *      the implicit state in Studio, and an \"onChangeArgsToValue\" prop to\n   *      transform the event handler arguments into a value\n   */\n  componentHelpers?: ExternalComponentHelpers<P>;\n  /**\n   * An array describing the component actions to be used in Studio.\n   */\n  actions?: Action<P>[];\n  /**\n   * Whether style sections should be shown in Studio. For styles to work, the\n   * component must accept a `className` prop. If unset, defaults to all styles.\n   * Set to `false` if this component cannot be styled (for example, if it doesn't\n   * render any DOM elements).\n   */\n  styleSections?: StyleSection[] | boolean;\n  /**\n   * Whether the element can be repeated in Studio. If unset, defaults to true.\n   */\n  isRepeatable?: boolean;\n  /**\n   * The path to be used when importing the component in the generated code.\n   * It can be the name of the package that contains the component, or the path\n   * to the file in the project (relative to the root directory).\n   */\n  importPath: string;\n  /**\n   *  Whether the component is the default export from that path. Optional: if\n   * not specified, it's considered `false`.\n   */\n  isDefaultExport?: boolean;\n  /**\n   * The prop that expects the CSS classes with styles to be applied to the\n   * component. Optional: if not specified, Plasmic will expect it to be\n   * `className`. Notice that if the component does not accept CSS classes, the\n   * component will not be able to receive styles from the Studio.\n   */\n  classNameProp?: string;\n  /**\n   * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`\n   * to interact with components, so it's not used in the generated code.\n   * Optional: If not provided, the usual `ref` is used.\n   */\n  refProp?: string;\n  /**\n   * Default styles to start with when instantiating the component in Plasmic.\n   */\n  defaultStyles?: CSSProperties;\n  /**\n   * Component templates to start with on Plasmic.\n   */\n  templates?: ComponentTemplates<P>;\n  /**\n   * Registered name of parent component, used for grouping related components.\n   */\n  parentComponentName?: string;\n  /**\n   * Whether the component can be used as an attachment to an element.\n   */\n  isAttachment?: boolean;\n  /**\n   * Whether the component provides data to its slots using DataProvider.\n   */\n  providesData?: boolean;\n\n  /**\n   * If specified, then Figma components with the specified names will be mapped\n   * to this component when you paste Figma content into Plasmic\n   */\n  figmaMappings?: {\n    figmaComponentName: string;\n  }[];\n\n  /**\n   * If specified, then Figma components will have their properties transformed\n   * before being applied to this component. This is useful for transforming Figma\n   * properties to the format expected by the component.\n   */\n  figmaPropsTransform?: (\n    props: Record<string, string | number | boolean>\n  ) => Record<\n    string,\n    string | number | boolean | null | unknown[] | Record<string, unknown>\n  >;\n\n  /**\n   * If true, when an instance of this component is added, the element\n   * will always be named by the name of this component.\n   */\n  alwaysAutoName?: boolean;\n\n  /**\n   * If true, then won't be listed in the insert menu for content creators.\n   */\n  hideFromContentCreators?: boolean;\n\n  refActions?: Record<string, RefActionRegistration<P>>;\n\n  /**\n   * Optional function that takes in component props and context, and returns\n   * a string that will be used for labeling this element in the Outline panel\n   * on the left of the Studio.  This makes it easy to identify an element when\n   * looking at the tree.\n   */\n  treeLabel?: ComponentContextConfig<P, string>;\n\n  /**\n   * The value of the CSS display property used by this component.\n   * Plasmic passes in a class name prop to components to let users style them,\n   * but normally this does not include layout properties like display.\n   * However, if the user has set the components visibility to be visible\n   * (for instance, in the base variant it was set to not visible ie display none,\n   * but in a variant it's overridden to be visible), then Plasmic needs to know\n   * what display property to set.\n   * Defaults to \"flex\".\n   */\n  defaultDisplay?: string;\n\n  /**\n   * When true, when you click for the first time anywhere in the component including its slots, the component itself is\n   * selected, making it easier to select the component instead of slot contents. So for instance, setting this on a\n   * Button ensures that clicking on the Button’s text will still select the Button and not the text element in its\n   * slot. Clicking again will deep-select the slot content.\n   */\n  trapsFocus?: boolean;\n\n  /**\n   * An object registering code component's variants that should be allowed in Studio, when the component is\n   * used as the root of a Studio component.\n   */\n  variants?: Record<\n    string,\n    {\n      cssSelector: string;\n      displayName: string;\n    }\n  >;\n}\n\nexport type CodeComponentMode =\n  | \"advanced\"\n  | \"simplified\"\n  | \"database-schema-driven\";\n\nexport interface FunctionParam<P> {\n  name: string;\n  displayName?: string;\n  type: PropType<P>;\n}\n\nexport interface RefActionRegistration<P> {\n  displayName?: string;\n  description?: string;\n  argTypes: FunctionParam<P>[];\n}\n\nexport interface ComponentRegistration {\n  component: React.ComponentType<any>;\n  meta: CodeComponentMeta<any>;\n}\n\ndeclare global {\n  interface Window {\n    __PlasmicComponentRegistry: ComponentRegistration[];\n  }\n}\n\nif (root.__PlasmicComponentRegistry == null) {\n  root.__PlasmicComponentRegistry = [];\n}\n\nexport default function registerComponent<T extends React.ComponentType<any>>(\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>\n) {\n  // Check for duplicates\n  if (\n    root.__PlasmicComponentRegistry.some(\n      (r: ComponentRegistration) =>\n        r.component === component && r.meta.name === meta.name\n    )\n  ) {\n    return;\n  }\n  root.__PlasmicComponentRegistry.push({ component, meta });\n}\n"],"names":[],"mappings":";;;;;AAYA,IAAM,IAAI,GAAG,UAAiB,CAAC;AA0H/B;AACA;AACa,IAAA,gBAAgB,GAA6C;IACxE,UAAU;IACV,qBAAqB;IACrB,UAAU;EACV;AAmPF,IAAI,IAAI,CAAC,0BAA0B,IAAI,IAAI,EAAE;AAC3C,IAAA,IAAI,CAAC,0BAA0B,GAAG,EAAE,CAAC;AACtC,CAAA;AAEa,SAAU,iBAAiB,CACvC,SAAY,EACZ,IAAgD,EAAA;;AAGhD,IAAA,IACE,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAClC,UAAC,CAAwB,EAAA;AACvB,QAAA,OAAA,CAAC,CAAC,SAAS,KAAK,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAA;AAAtD,KAAsD,CACzD,EACD;QACA,OAAO;AACR,KAAA;AACD,IAAA,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,EAAE,SAAS,EAAA,SAAA,EAAE,IAAI,EAAA,IAAA,EAAE,CAAC,CAAC;AAC5D;;;;;"}

package/registerComponent/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../src/registerComponent.ts"],"sourcesContent":["import { CodeComponentElement, CSSProperties } from \"./element-types\";\nimport {\n  ContextDependentConfig,\n  InferDataType,\n  ProjectData,\n  PropType,\n  RestrictPropType,\n  StudioOps,\n} from \"./prop-types\";\nimport { TupleUnion } from \"./type-utils\";\nexport type * from \"./prop-types\";\n\nconst root = globalThis as any;\n\nexport interface ActionProps<P> {\n  componentProps: P;\n  /**\n   * `contextData` can be `null` if the prop controls are rendering before\n   * the component instance itself (it will re-render once the component\n   * calls `setControlContextData`)\n   */\n  contextData: InferDataType<P> | null;\n  /**\n   * Operations available to the editor that allow modifying the entire component.\n   */\n  studioOps: StudioOps;\n  /**\n   * Metadata from the studio project.\n   */\n  projectData: ProjectData;\n  /**\n   * The document that the component will be rendered into; instead of using\n   * `document` directly (for, say, `document.querySelector()` etc.), you\n   * should use this instead.\n   */\n  studioDocument: typeof document;\n}\n\nexport type Action<P> =\n  | {\n      type: \"button-action\";\n      label: string;\n      onClick: (props: ActionProps<P>) => void;\n      hidden?: ContextDependentConfig<P, boolean>;\n    }\n  | {\n      type: \"custom-action\";\n      control: React.ComponentType<ActionProps<P>>;\n      hidden?: ContextDependentConfig<P, boolean>;\n    };\n\ntype DistributedKeyOf<T> = T extends any ? keyof T : never;\n\ninterface ComponentTemplate<P>\n  extends Omit<CodeComponentElement<P>, \"type\" | \"name\"> {\n  /**\n   * A preview picture for the template.\n   */\n  previewImg?: string;\n}\n\nexport interface ComponentTemplates<P> {\n  [name: string]: ComponentTemplate<P>;\n}\n\nexport type StateSpec<P> = {\n  onChangeProp: string;\n\n  /**\n   * If true, will hide the state on studio.\n   */\n  hidden?: ContextDependentConfig<P, boolean>;\n\n  /**\n   * If true, will hide the state in a collapsed section; good for states that\n   * should not usually be used.\n   */\n  advanced?: ContextDependentConfig<P, boolean>;\n} & (\n  | {\n      type: \"readonly\";\n      variableType: \"text\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"number\";\n      initVal?: number;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"boolean\";\n      initVal?: boolean;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"array\";\n      initVal?: any[];\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"object\";\n      initVal?: object;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateString\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateRangeStrings\";\n      initVal?: [string, string];\n    }\n  | {\n      type: \"writable\";\n      variableType:\n        | \"text\"\n        | \"number\"\n        | \"boolean\"\n        | \"array\"\n        | \"object\"\n        | \"dateString\"\n        | \"dateRangeStrings\";\n      valueProp: string;\n    }\n);\n\nexport interface StateHelpers<P, T> {\n  initFunc?: ($props: P) => T;\n  onChangeArgsToValue?: (...args: any) => T;\n  onMutate?: (stateValue: T, $ref: any) => void;\n}\n\n// A compile-time error will occur if a new field is added to the StateHelper\n// interface but not included in the keys array of state helper.\nexport const stateHelpersKeys: TupleUnion<keyof StateHelpers<any, any>> = [\n  \"initFunc\",\n  \"onChangeArgsToValue\",\n  \"onMutate\",\n];\n\nexport type ComponentHelpers<P> = {\n  states: Record<string, StateHelpers<P, any>>;\n};\n\nexport type ExternalComponentHelpers<P> = {\n  helpers: ComponentHelpers<P>;\n  importPath: string;\n} & (\n  | {\n      importName: string;\n    }\n  | {\n      isDefaultExport: true;\n    }\n);\n\nexport type StyleSection =\n  | \"visibility\"\n  | \"typography\"\n  | \"sizing\"\n  | \"spacing\"\n  | \"background\"\n  | \"transform\"\n  | \"transitions\"\n  | \"layout\"\n  | \"overflow\"\n  | \"border\"\n  | \"shadows\"\n  | \"effects\";\n\nexport interface CodeComponentMeta<P> {\n  /**\n   * Any unique string name used to identify that component. Each component\n   * should be registered with a different `meta.name`, even if they have the\n   * same name in the code.\n   */\n  name: string;\n  /**\n   * The name to be displayed for the component in Studio. Optional: if not\n   * specified, `meta.name` is used.\n   */\n  displayName?: string;\n  /**\n   * The description of the component to be shown in Studio.\n   */\n  description?: string;\n  /**\n   * A specific section to which the component should be displayed in Studio. By default, the component will be displayed in the \"Custom Components\" section.\n   * A new section will be created to display the components with the same `section` value.\n   */\n  section?: string;\n  /**\n   * A link to an image that will be displayed as a thumbnail of the component in the Studio, if the component has a `section` specified.\n   */\n  thumbnailUrl?: string;\n  /**\n   * The javascript name to be used when generating code. Optional: if not\n   * provided, `meta.name` is used.\n   */\n  importName?: string;\n  /**\n   * An object describing the component properties to be used in Studio.\n   * For each `prop`, there should be an entry `meta.props[prop]` describing\n   * its type.\n   */\n  props: { [prop in DistributedKeyOf<P>]?: RestrictPropType<P[prop], P> } & {\n    [prop: string]: PropType<P>;\n  };\n  /**\n   * An object describing the component states to be used in Studio.\n   */\n  states?: Record<string, StateSpec<P>>;\n  /**\n   * An object describing the components helpers to be used in Studio.\n   *   1. states helpers: Each state can receive an \"initFunc\" prop to initialize\n   *      the implicit state in Studio, and an \"onChangeArgsToValue\" prop to\n   *      transform the event handler arguments into a value\n   */\n  componentHelpers?: ExternalComponentHelpers<P>;\n  /**\n   * An array describing the component actions to be used in Studio.\n   */\n  actions?: Action<P>[];\n  /**\n   * Whether style sections should be shown in Studio. For styles to work, the\n   * component must accept a `className` prop. If unset, defaults to all styles.\n   * Set to `false` if this component cannot be styled (for example, if it doesn't\n   * render any DOM elements).\n   */\n  styleSections?: StyleSection[] | boolean;\n  /**\n   * Whether the element can be repeated in Studio. If unset, defaults to true.\n   */\n  isRepeatable?: boolean;\n  /**\n   * The path to be used when importing the component in the generated code.\n   * It can be the name of the package that contains the component, or the path\n   * to the file in the project (relative to the root directory).\n   */\n  importPath: string;\n  /**\n   *  Whether the component is the default export from that path. Optional: if\n   * not specified, it's considered `false`.\n   */\n  isDefaultExport?: boolean;\n  /**\n   * The prop that expects the CSS classes with styles to be applied to the\n   * component. Optional: if not specified, Plasmic will expect it to be\n   * `className`. Notice that if the component does not accept CSS classes, the\n   * component will not be able to receive styles from the Studio.\n   */\n  classNameProp?: string;\n  /**\n   * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`\n   * to interact with components, so it's not used in the generated code.\n   * Optional: If not provided, the usual `ref` is used.\n   */\n  refProp?: string;\n  /**\n   * Default styles to start with when instantiating the component in Plasmic.\n   */\n  defaultStyles?: CSSProperties;\n  /**\n   * Component templates to start with on Plasmic.\n   */\n  templates?: ComponentTemplates<P>;\n  /**\n   * Registered name of parent component, used for grouping related components.\n   */\n  parentComponentName?: string;\n  /**\n   * Whether the component can be used as an attachment to an element.\n   */\n  isAttachment?: boolean;\n  /**\n   * Whether the component provides data to its slots using DataProvider.\n   */\n  providesData?: boolean;\n\n  /**\n   * If specified, then Figma components with the specified names will be mapped\n   * to this component when you paste Figma content into Plasmic\n   */\n  figmaMappings?: {\n    figmaComponentName: string;\n  }[];\n\n  /**\n   * If specified, then Figma components will have their properties transformed\n   * before being applied to this component. This is useful for transforming Figma\n   * properties to the format expected by the component.\n   */\n  figmaPropsTransform?: (\n    props: Record<string, string | number | boolean>\n  ) => Record<\n    string,\n    string | number | boolean | null | unknown[] | Record<string, unknown>\n  >;\n\n  /**\n   * If true, when an instance of this component is added, the element\n   * will always be named by the name of this component.\n   */\n  alwaysAutoName?: boolean;\n\n  /**\n   * If true, then won't be listed in the insert menu for content creators.\n   */\n  hideFromContentCreators?: boolean;\n\n  refActions?: Record<string, RefActionRegistration<P>>;\n\n  /**\n   * Optional function that takes in component props and context, and returns\n   * a string that will be used for labeling this element in the Outline panel\n   * on the left of the Studio.  This makes it easy to identify an element when\n   * looking at the tree.\n   */\n  treeLabel?: ContextDependentConfig<P, string>;\n\n  /**\n   * The value of the CSS display property used by this component.\n   * Plasmic passes in a class name prop to components to let users style them,\n   * but normally this does not include layout properties like display.\n   * However, if the user has set the components visibility to be visible\n   * (for instance, in the base variant it was set to not visible ie display none,\n   * but in a variant it's overridden to be visible), then Plasmic needs to know\n   * what display property to set.\n   * Defaults to \"flex\".\n   */\n  defaultDisplay?: string;\n\n  /**\n   * When true, when you click for the first time anywhere in the component including its slots, the component itself is\n   * selected, making it easier to select the component instead of slot contents. So for instance, setting this on a\n   * Button ensures that clicking on the Button’s text will still select the Button and not the text element in its\n   * slot. Clicking again will deep-select the slot content.\n   */\n  trapsFocus?: boolean;\n\n  /**\n   * An object registering code component's variants that should be allowed in Studio, when the component is\n   * used as the root of a Studio component.\n   */\n  variants?: Record<\n    string,\n    {\n      cssSelector: string;\n      displayName: string;\n    }\n  >;\n}\n\nexport type CodeComponentMode =\n  | \"advanced\"\n  | \"simplified\"\n  | \"database-schema-driven\";\n\n/**\n * @deprecated use CodeComponentMeta instead\n */\nexport type ComponentMeta<P> = CodeComponentMeta<P>;\n\nexport interface FunctionParam<P> {\n  name: string;\n  displayName?: string;\n  type: PropType<P>;\n}\n\nexport interface RefActionRegistration<P> {\n  displayName?: string;\n  description?: string;\n  argTypes: FunctionParam<P>[];\n}\n\nexport interface ComponentRegistration {\n  component: React.ComponentType<any>;\n  meta: CodeComponentMeta<any>;\n}\n\ndeclare global {\n  interface Window {\n    __PlasmicComponentRegistry: ComponentRegistration[];\n  }\n}\n\nif (root.__PlasmicComponentRegistry == null) {\n  root.__PlasmicComponentRegistry = [];\n}\n\nexport default function registerComponent<T extends React.ComponentType<any>>(\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>\n) {\n  // Check for duplicates\n  if (\n    root.__PlasmicComponentRegistry.some(\n      (r: ComponentRegistration) =>\n        r.component === component && r.meta.name === meta.name\n    )\n  ) {\n    return;\n  }\n  root.__PlasmicComponentRegistry.push({ component, meta });\n}\n"],"names":[],"mappings":";AAYA,IAAM,IAAI,GAAG,UAAiB,CAAC;AA0H/B;AACA;AACa,IAAA,gBAAgB,GAA6C;IACxE,UAAU;IACV,qBAAqB;IACrB,UAAU;EACV;AAwPF,IAAI,IAAI,CAAC,0BAA0B,IAAI,IAAI,EAAE;AAC3C,IAAA,IAAI,CAAC,0BAA0B,GAAG,EAAE,CAAC;AACtC,CAAA;AAEa,SAAU,iBAAiB,CACvC,SAAY,EACZ,IAAgD,EAAA;;AAGhD,IAAA,IACE,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAClC,UAAC,CAAwB,EAAA;AACvB,QAAA,OAAA,CAAC,CAAC,SAAS,KAAK,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAA;AAAtD,KAAsD,CACzD,EACD;QACA,OAAO;AACR,KAAA;AACD,IAAA,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,EAAE,SAAS,EAAA,SAAA,EAAE,IAAI,EAAA,IAAA,EAAE,CAAC,CAAC;AAC5D;;;;"}
+{"version":3,"file":"index.esm.js","sources":["../../src/registerComponent.ts"],"sourcesContent":["import { CodeComponentElement, CSSProperties } from \"./element-types\";\nimport {\n  ComponentContextConfig,\n  ProjectData,\n  PropType,\n  RestrictPropType,\n  StudioOps,\n} from \"./types/component-types\";\nimport { InferDataType } from \"./types/shared-controls\";\nimport { TupleUnion } from \"./types/type-utils\";\nexport type * from \"./prop-types\";\n\nconst root = globalThis as any;\n\nexport interface ActionProps<P> {\n  componentProps: P;\n  /**\n   * `contextData` can be `null` if the prop controls are rendering before\n   * the component instance itself (it will re-render once the component\n   * calls `setControlContextData`)\n   */\n  contextData: InferDataType<P> | null;\n  /**\n   * Operations available to the editor that allow modifying the entire component.\n   */\n  studioOps: StudioOps;\n  /**\n   * Metadata from the studio project.\n   */\n  projectData: ProjectData;\n  /**\n   * The document that the component will be rendered into; instead of using\n   * `document` directly (for, say, `document.querySelector()` etc.), you\n   * should use this instead.\n   */\n  studioDocument: typeof document;\n}\n\nexport type Action<P> =\n  | {\n      type: \"button-action\";\n      label: string;\n      onClick: (props: ActionProps<P>) => void;\n      hidden?: ComponentContextConfig<P, boolean>;\n    }\n  | {\n      type: \"custom-action\";\n      control: React.ComponentType<ActionProps<P>>;\n      hidden?: ComponentContextConfig<P, boolean>;\n    };\n\ntype DistributedKeyOf<T> = T extends any ? keyof T : never;\n\ninterface ComponentTemplate<P>\n  extends Omit<CodeComponentElement<P>, \"type\" | \"name\"> {\n  /**\n   * A preview picture for the template.\n   */\n  previewImg?: string;\n}\n\nexport interface ComponentTemplates<P> {\n  [name: string]: ComponentTemplate<P>;\n}\n\nexport type StateSpec<P> = {\n  onChangeProp: string;\n\n  /**\n   * If true, will hide the state on studio.\n   */\n  hidden?: ComponentContextConfig<P, boolean>;\n\n  /**\n   * If true, will hide the state in a collapsed section; good for states that\n   * should not usually be used.\n   */\n  advanced?: ComponentContextConfig<P, boolean>;\n} & (\n  | {\n      type: \"readonly\";\n      variableType: \"text\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"number\";\n      initVal?: number;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"boolean\";\n      initVal?: boolean;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"array\";\n      initVal?: any[];\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"object\";\n      initVal?: object;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateString\";\n      initVal?: string;\n    }\n  | {\n      type: \"readonly\";\n      variableType: \"dateRangeStrings\";\n      initVal?: [string, string];\n    }\n  | {\n      type: \"writable\";\n      variableType:\n        | \"text\"\n        | \"number\"\n        | \"boolean\"\n        | \"array\"\n        | \"object\"\n        | \"dateString\"\n        | \"dateRangeStrings\";\n      valueProp: string;\n    }\n);\n\nexport interface StateHelpers<P, T> {\n  initFunc?: ($props: P) => T;\n  onChangeArgsToValue?: (...args: any) => T;\n  onMutate?: (stateValue: T, $ref: any) => void;\n}\n\n// A compile-time error will occur if a new field is added to the StateHelper\n// interface but not included in the keys array of state helper.\nexport const stateHelpersKeys: TupleUnion<keyof StateHelpers<any, any>> = [\n  \"initFunc\",\n  \"onChangeArgsToValue\",\n  \"onMutate\",\n];\n\nexport type ComponentHelpers<P> = {\n  states: Record<string, StateHelpers<P, any>>;\n};\n\nexport type ExternalComponentHelpers<P> = {\n  helpers: ComponentHelpers<P>;\n  importPath: string;\n} & (\n  | {\n      importName: string;\n    }\n  | {\n      isDefaultExport: true;\n    }\n);\n\nexport type StyleSection =\n  | \"visibility\"\n  | \"typography\"\n  | \"sizing\"\n  | \"spacing\"\n  | \"background\"\n  | \"transform\"\n  | \"transitions\"\n  | \"layout\"\n  | \"overflow\"\n  | \"border\"\n  | \"shadows\"\n  | \"effects\";\n\nexport interface CodeComponentMeta<P> {\n  /**\n   * Any unique string name used to identify that component. Each component\n   * should be registered with a different `meta.name`, even if they have the\n   * same name in the code.\n   */\n  name: string;\n  /**\n   * The name to be displayed for the component in Studio. Optional: if not\n   * specified, `meta.name` is used.\n   */\n  displayName?: string;\n  /**\n   * The description of the component to be shown in Studio.\n   */\n  description?: string;\n  /**\n   * A specific section to which the component should be displayed in Studio. By default, the component will be displayed in the \"Custom Components\" section.\n   * A new section will be created to display the components with the same `section` value.\n   */\n  section?: string;\n  /**\n   * A link to an image that will be displayed as a thumbnail of the component in the Studio, if the component has a `section` specified.\n   */\n  thumbnailUrl?: string;\n  /**\n   * The javascript name to be used when generating code. Optional: if not\n   * provided, `meta.name` is used.\n   */\n  importName?: string;\n  /**\n   * An object describing the component properties to be used in Studio.\n   * For each `prop`, there should be an entry `meta.props[prop]` describing\n   * its type.\n   */\n  props: { [prop in DistributedKeyOf<P>]?: RestrictPropType<P[prop], P> } & {\n    [prop: string]: PropType<P>;\n  };\n  /**\n   * An object describing the component states to be used in Studio.\n   */\n  states?: Record<string, StateSpec<P>>;\n  /**\n   * An object describing the components helpers to be used in Studio.\n   *   1. states helpers: Each state can receive an \"initFunc\" prop to initialize\n   *      the implicit state in Studio, and an \"onChangeArgsToValue\" prop to\n   *      transform the event handler arguments into a value\n   */\n  componentHelpers?: ExternalComponentHelpers<P>;\n  /**\n   * An array describing the component actions to be used in Studio.\n   */\n  actions?: Action<P>[];\n  /**\n   * Whether style sections should be shown in Studio. For styles to work, the\n   * component must accept a `className` prop. If unset, defaults to all styles.\n   * Set to `false` if this component cannot be styled (for example, if it doesn't\n   * render any DOM elements).\n   */\n  styleSections?: StyleSection[] | boolean;\n  /**\n   * Whether the element can be repeated in Studio. If unset, defaults to true.\n   */\n  isRepeatable?: boolean;\n  /**\n   * The path to be used when importing the component in the generated code.\n   * It can be the name of the package that contains the component, or the path\n   * to the file in the project (relative to the root directory).\n   */\n  importPath: string;\n  /**\n   *  Whether the component is the default export from that path. Optional: if\n   * not specified, it's considered `false`.\n   */\n  isDefaultExport?: boolean;\n  /**\n   * The prop that expects the CSS classes with styles to be applied to the\n   * component. Optional: if not specified, Plasmic will expect it to be\n   * `className`. Notice that if the component does not accept CSS classes, the\n   * component will not be able to receive styles from the Studio.\n   */\n  classNameProp?: string;\n  /**\n   * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`\n   * to interact with components, so it's not used in the generated code.\n   * Optional: If not provided, the usual `ref` is used.\n   */\n  refProp?: string;\n  /**\n   * Default styles to start with when instantiating the component in Plasmic.\n   */\n  defaultStyles?: CSSProperties;\n  /**\n   * Component templates to start with on Plasmic.\n   */\n  templates?: ComponentTemplates<P>;\n  /**\n   * Registered name of parent component, used for grouping related components.\n   */\n  parentComponentName?: string;\n  /**\n   * Whether the component can be used as an attachment to an element.\n   */\n  isAttachment?: boolean;\n  /**\n   * Whether the component provides data to its slots using DataProvider.\n   */\n  providesData?: boolean;\n\n  /**\n   * If specified, then Figma components with the specified names will be mapped\n   * to this component when you paste Figma content into Plasmic\n   */\n  figmaMappings?: {\n    figmaComponentName: string;\n  }[];\n\n  /**\n   * If specified, then Figma components will have their properties transformed\n   * before being applied to this component. This is useful for transforming Figma\n   * properties to the format expected by the component.\n   */\n  figmaPropsTransform?: (\n    props: Record<string, string | number | boolean>\n  ) => Record<\n    string,\n    string | number | boolean | null | unknown[] | Record<string, unknown>\n  >;\n\n  /**\n   * If true, when an instance of this component is added, the element\n   * will always be named by the name of this component.\n   */\n  alwaysAutoName?: boolean;\n\n  /**\n   * If true, then won't be listed in the insert menu for content creators.\n   */\n  hideFromContentCreators?: boolean;\n\n  refActions?: Record<string, RefActionRegistration<P>>;\n\n  /**\n   * Optional function that takes in component props and context, and returns\n   * a string that will be used for labeling this element in the Outline panel\n   * on the left of the Studio.  This makes it easy to identify an element when\n   * looking at the tree.\n   */\n  treeLabel?: ComponentContextConfig<P, string>;\n\n  /**\n   * The value of the CSS display property used by this component.\n   * Plasmic passes in a class name prop to components to let users style them,\n   * but normally this does not include layout properties like display.\n   * However, if the user has set the components visibility to be visible\n   * (for instance, in the base variant it was set to not visible ie display none,\n   * but in a variant it's overridden to be visible), then Plasmic needs to know\n   * what display property to set.\n   * Defaults to \"flex\".\n   */\n  defaultDisplay?: string;\n\n  /**\n   * When true, when you click for the first time anywhere in the component including its slots, the component itself is\n   * selected, making it easier to select the component instead of slot contents. So for instance, setting this on a\n   * Button ensures that clicking on the Button’s text will still select the Button and not the text element in its\n   * slot. Clicking again will deep-select the slot content.\n   */\n  trapsFocus?: boolean;\n\n  /**\n   * An object registering code component's variants that should be allowed in Studio, when the component is\n   * used as the root of a Studio component.\n   */\n  variants?: Record<\n    string,\n    {\n      cssSelector: string;\n      displayName: string;\n    }\n  >;\n}\n\nexport type CodeComponentMode =\n  | \"advanced\"\n  | \"simplified\"\n  | \"database-schema-driven\";\n\nexport interface FunctionParam<P> {\n  name: string;\n  displayName?: string;\n  type: PropType<P>;\n}\n\nexport interface RefActionRegistration<P> {\n  displayName?: string;\n  description?: string;\n  argTypes: FunctionParam<P>[];\n}\n\nexport interface ComponentRegistration {\n  component: React.ComponentType<any>;\n  meta: CodeComponentMeta<any>;\n}\n\ndeclare global {\n  interface Window {\n    __PlasmicComponentRegistry: ComponentRegistration[];\n  }\n}\n\nif (root.__PlasmicComponentRegistry == null) {\n  root.__PlasmicComponentRegistry = [];\n}\n\nexport default function registerComponent<T extends React.ComponentType<any>>(\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>\n) {\n  // Check for duplicates\n  if (\n    root.__PlasmicComponentRegistry.some(\n      (r: ComponentRegistration) =>\n        r.component === component && r.meta.name === meta.name\n    )\n  ) {\n    return;\n  }\n  root.__PlasmicComponentRegistry.push({ component, meta });\n}\n"],"names":[],"mappings":";AAYA,IAAM,IAAI,GAAG,UAAiB,CAAC;AA0H/B;AACA;AACa,IAAA,gBAAgB,GAA6C;IACxE,UAAU;IACV,qBAAqB;IACrB,UAAU;EACV;AAmPF,IAAI,IAAI,CAAC,0BAA0B,IAAI,IAAI,EAAE;AAC3C,IAAA,IAAI,CAAC,0BAA0B,GAAG,EAAE,CAAC;AACtC,CAAA;AAEa,SAAU,iBAAiB,CACvC,SAAY,EACZ,IAAgD,EAAA;;AAGhD,IAAA,IACE,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAClC,UAAC,CAAwB,EAAA;AACvB,QAAA,OAAA,CAAC,CAAC,SAAS,KAAK,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAA;AAAtD,KAAsD,CACzD,EACD;QACA,OAAO;AACR,KAAA;AACD,IAAA,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,EAAE,SAAS,EAAA,SAAA,EAAE,IAAI,EAAA,IAAA,EAAE,CAAC,CAAC;AAC5D;;;;"}