@figma/code-connect 1.0.6 → 1.1.1

package/dist/react/external.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"external.js","sourceRoot":"","sources":["../../src/react/external.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,6CAA8B;AAC9B,8DAOkC;AAmBjB,wFAzBf,4BAAW,OAyBW;AACV,qFAzBZ,yBAAQ,OAyBQ;AACF,uFAzBd,2BAAU,OAyBU;AACD,4FAzBnB,gCAAe,OAyBe;AACb,0FAzBjB,8BAAa,OAyBa;AACP,4FAzBnB,gCAAe,OAyBe;AAhBhC,SAAS,WAAW,CAAC,UAAmB,EAAE,aAAsB,EAAE,KAAe,IAAS,CAAC;AAiB1E,8BAAO;AAfxB,SAAS,YAAY,CAAC,cAAsB;IAC1C,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;AACnC,CAAC;AAciB,gCAAQ;AAZ1B,SAAS,YAAY,CAAC,OAA0B;IAC9C,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;AACnC,CAAC;AAWiB,gCAAQ"}

package/dist/react/index_react.d.ts

@@ -0,0 +1,94 @@
+/// <reference types="react" />
+import { EnumValue, FigmaConnectAPI, FigmaConnectMeta, ValueOf } from '../connect/api';
+import * as StorybookTypes from '../storybook/external';
+import { FigmaConnectClient } from '../client/figma_client';
+declare const _client: FigmaConnectClient;
+declare const _figma: FigmaConnectAPI<JSX.Element> & {
+    /**
+     * Defines a code snippet that displays in Figma when a component is selected. This function has two signatures:
+     * - When called with a component reference as the first argument, it will infer metadata such as the import statement
+     * and location in source file from the component reference
+     * - When called only with a Figma node URL, this metadata will not be included. This is useful when you want to display a code snippet
+     * for something that isn't a React component, such as a `<button>` element
+     *
+     * @param component A reference to the React component
+     * @param figmaNodeUrl A link to the node in Figma, for example:`https://www.figma.com/file/123abc/My-Component?node-id=123:456`
+     * @param meta {@link FigmaConnectMeta}
+     */
+    connect<P = {}>(component: any, figmaNodeUrl: string, meta?: FigmaConnectMeta<P, React.Component | JSX.Element>): void;
+    /**
+     * Defines a code snippet that displays in Figma when a component is selected. This function has two signatures:
+     * - When called with a component reference as the first argument, it will infer metadata such as the import statement
+     * and location in source file from the component reference
+     * - When called only with a Figma node URL, this metadata will not be included. This is useful when you want to display a code snippet
+     * for something that isn't a React component, such as a `<button>` element
+     *
+     * @param figmaNodeUrl A link to the node in Figma, for example:`https://www.figma.com/file/123abc/My-Component?node-id=123:456`
+     * @param meta {@link FigmaConnectMeta}
+     */
+    connect<P = {}>(figmaNodeUrl: string, meta?: FigmaConnectMeta<P, React.Component | JSX.Element>): void;
+    /**
+     * Maps a Figma property to a boolean value for the connected component. This prop is replaced
+     * with values from the Figma instance when viewed in Dev Mode. For example:
+     * ```ts
+     * props: {
+     *  disabled: figma.boolean('Disabled'),
+     * }
+     * ```
+     * Would show the `disabled` property if the Figma property "Disabled" is true.
+     *
+     * @param figmaPropName The name of the property on the Figma component
+     */
+    boolean(figmaPropName: string): boolean;
+    /**
+     * Maps a Figma boolean property to a set of values for the connected component, providing
+     * a value mapping for `true` and `false`. This prop is replaced with values from the
+     * Figma instance when viewed in Dev Mode. Example:
+     * ```ts
+     * props: {
+     *  label: figma.boolean('Disabled', {
+     *    true: <Label />,
+     *    false: <HiddenLabel />
+     *  }),
+     * }
+     * ```
+     * Would replace `label` with `<Label />` if the Figma property "Disabled" is true.
+     *
+     * @param figmaPropName The name of the property on the Figma component
+     * @param valueMapping A mapping of values for `true` and `false`
+     */
+    boolean<TrueT extends EnumValue, FalseT extends EnumValue>(figmaPropName: string, valueMapping?: {
+        true?: TrueT;
+        false?: FalseT;
+    }): ValueOf<Record<'true' | 'false', TrueT | FalseT>>;
+    /**
+     * Maps nested properties from a Figma instance layer. The first argument
+     * should be the layer name of the nested instance. The mapping object passed
+     * in is in the same format as the `props` object in the `connect` function.
+     * For example:
+     * ```ts
+     * props: {
+     *   nested: figma.nestedProps('Nested', {
+     *     label: figma.string('Text'),
+     *     icon: figma.instance('Icon'),
+     *   }),
+     * }
+     * ```
+     *
+     * Which would then allow you to access the nested properties in the `example` function like so:
+     * ```ts
+     * (props) => <Button label={props.nested.label} icon={props.nested.icon} />
+     * ```
+     */
+    nestedProps<V>(layer: string, input: V): V;
+    /**
+     * A list of import statements that will render in the Code Snippet in Figma.
+     * This overrides the auto-generated imports for the component. When this is specified,
+     * the `importPaths` option in the config file is also ignored.
+     */
+    imports?: string[];
+};
+export { _figma as figma, _client as client };
+export default _figma;
+export type StoryParameters<T = {}> = StorybookTypes.StoryParameters<T>;
+//# sourceMappingURL=index_react.d.ts.map

package/dist/react/index_react.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index_react.d.ts","sourceRoot":"","sources":["../../src/react/index_react.ts"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AAEtF,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAG3D,QAAA,MAAM,OAAO,EAAE,kBAAgC,CAAA;AAC/C,QAAA,MAAM,MAAM,EAAE,eAAe,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG;IAC3C;;;;;;;;;;OAUG;IACH,OAAO,CAAC,CAAC,GAAG,EAAE,EACZ,SAAS,EAAE,GAAG,EACd,YAAY,EAAE,MAAM,EACpB,IAAI,CAAC,EAAE,gBAAgB,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,GAAG,CAAC,OAAO,CAAC,GACxD,IAAI,CAAA;IAEP;;;;;;;;;OASG;IACH,OAAO,CAAC,CAAC,GAAG,EAAE,EACZ,YAAY,EAAE,MAAM,EACpB,IAAI,CAAC,EAAE,gBAAgB,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,GAAG,CAAC,OAAO,CAAC,GACxD,IAAI,CAAA;IAEP;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,aAAa,EAAE,MAAM,GAAG,OAAO,CAAA;IAEvC;;;;;;;;;;;;;;;;OAgBG;IACH,OAAO,CAAC,KAAK,SAAS,SAAS,EAAE,MAAM,SAAS,SAAS,EACvD,aAAa,EAAE,MAAM,EACrB,YAAY,CAAC,EAAE;QACb,IAAI,CAAC,EAAE,KAAK,CAAA;QACZ,KAAK,CAAC,EAAE,MAAM,CAAA;KACf,GACA,OAAO,CAAC,MAAM,CAAC,MAAM,GAAG,OAAO,EAAE,KAAK,GAAG,MAAM,CAAC,CAAC,CAAA;IAEpD;;;;;;;;;;;;;;;;;;OAkBG;IACH,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,GAAG,CAAC,CAAA;IAE1C;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;CACX,CAAA;AAET,OAAO,EAAE,MAAM,IAAI,KAAK,EAAE,OAAO,IAAI,MAAM,EAAE,CAAA;AAC7C,eAAe,MAAM,CAAA;AAErB,MAAM,MAAM,eAAe,CAAC,CAAC,GAAG,EAAE,IAAI,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC,CAAA"}

package/dist/{index.js → react/index_react.js}

@@ -1,6 +1,6 @@
 "use strict";
 // IMPORTANT: be careful to ensure you don't accidentally add code which has a
-// dependency on Node.js-only modules here, as it will break co=located
+// dependency on Node.js-only modules here, as it will break co-located
 // components. We don't have a test for this yet. Any such code should be
 // conditionally required - see `client` for an example. Reach out in
 // #feat-code-connect if you're unsure.
@@ -29,25 +29,11 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.client = exports.figma = void 0;
-const figma = __importStar(require("./common/external"));
-// `client/external`'s dependency chain ends up including code which is not safe
-// in a browser context, e.g. `child_process`. This would mean that if you
-// co-locate your Code Connect with React components, your app will be broken in
-// a browser, because of this import chain.
-//
-// To get around this, we only import `client/external` if you are in a Node
-// context – it is only used for the icon script, so none of the code which runs
-// in the browser should touch it.
-//
-// Note that you may still see messages from the JS bundler about Node modules,
-// but these won't be included at runtime.
-let client = {};
-if (typeof process !== 'undefined' && process.versions && process.versions.node) {
-    client = require('./client/external');
-}
-const _client = client;
+const figma = __importStar(require("./external"));
+const index_common_1 = require("../connect/index_common");
+const _client = (0, index_common_1.getClient)();
 exports.client = _client;
 const _figma = figma;
 exports.figma = _figma;
 exports.default = _figma;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index_react.js.map

package/dist/react/index_react.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index_react.js","sourceRoot":"","sources":["../../src/react/index_react.ts"],"names":[],"mappings":";AAAA,8EAA8E;AAC9E,uEAAuE;AACvE,yEAAyE;AACzE,qEAAqE;AACrE,uCAAuC;;;;;;;;;;;;;;;;;;;;;;;;;;AAGvC,kDAAmC;AAGnC,0DAAmD;AAEnD,MAAM,OAAO,GAAuB,IAAA,wBAAS,GAAE,CAAA;AAsGV,yBAAM;AArG3C,MAAM,MAAM,GAmGR,KAAK,CAAA;AAEU,uBAAK;AACxB,kBAAe,MAAM,CAAA"}

package/dist/react/parser.d.ts

@@ -1,26 +1,8 @@
 import ts from 'typescript';
-import { CodeConnectReactConfig } from '../connect/project';
-import { PropMappings } from '../common/intrinsics';
-interface ParserErrorContext {
-    sourceFile: ts.SourceFile;
-    node: ts.Node | undefined;
-}
-export declare class ParserError extends Error {
-    sourceFilePosition: ts.LineAndCharacter | null;
-    sourceFileName: string;
-    constructor(message: string, context?: ParserErrorContext);
-    toString(): string;
-    toDebugString(): string;
-}
-export declare class InternalError extends ParserError {
-    constructor(message: string);
-}
-export interface ParserContext {
-    checker: ts.TypeChecker;
-    sourceFile: ts.SourceFile;
-    config: CodeConnectReactConfig;
-    absPath: string;
-}
+import { PropMappings } from '../connect/intrinsics';
+import { CodeConnectJSON } from '../connect/figma_connect';
+import { ParserContext, ParseOptions } from '../connect/parser_common';
+export declare function findAndResolveImports(program: ts.Program, sourceFile: ts.SourceFile): Record<string, string>;
 export type ComponentTypeSignature = Record<string, string>;
 /**
  * Extracts the type signature from the interface of a React component as a map of
@@ -46,19 +28,11 @@ export declare function extractComponentTypeSignature(symbol: ts.Symbol, checker
  * @param node The node being parsed. Used for error logging.
  * @returns Metadata object
  */
-export declare function parseComponentMetadata(node: ts.PropertyAccessExpression | ts.Identifier | ts.Expression, { checker, sourceFile, absPath }: ParserContext, silent?: boolean): Promise<{
+export declare function parseComponentMetadata(node: ts.PropertyAccessExpression | ts.Identifier | ts.Expression, parserContext: ParserContext, silent?: boolean): Promise<{
     source: string;
     line: number;
     component: string;
 }>;
-/**
- * Checks if a file contains Code Connect by looking for the `figma.connect()` function call
- *
- * @param program
- * @param file
- * @returns
- */
-export declare function isFigmaConnectFile(program: ts.Program, file: string): boolean;
 /**
  * Parses the render function passed to `figma.connect()`, extracting the code and
  * any import statements matching the JSX elements used in the function body
@@ -78,11 +52,5 @@ export declare function parseRenderFunction(exp: ts.ArrowFunction | ts.FunctionE
     nestable: boolean;
 };
 export declare function getDefaultTemplate(componentMetadata: Awaited<ReturnType<typeof parseComponentMetadata>>): string;
-type ParseOptions = {
-    repoUrl?: string;
-    debug?: boolean;
-    silent?: boolean;
-};
-export declare function parse(program: ts.Program, file: string, config: CodeConnectReactConfig, absPath: string, parseOptions?: ParseOptions): Promise<any[]>;
-export {};
+export declare function parseReactDoc(node: ts.CallExpression, parserContext: ParserContext, { repoUrl, silent }: ParseOptions): Promise<CodeConnectJSON>;
 //# sourceMappingURL=parser.d.ts.map

package/dist/react/parser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"parser.d.ts","sourceRoot":"","sources":["../../src/react/parser.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,sBAAsB,EAAuC,MAAM,oBAAoB,CAAA;AAahG,OAAO,EAGL,YAAY,EAGb,MAAM,sBAAsB,CAAA;AAM7B,UAAU,kBAAkB;IAC1B,UAAU,EAAE,EAAE,CAAC,UAAU,CAAA;IACzB,IAAI,EAAE,EAAE,CAAC,IAAI,GAAG,SAAS,CAAA;CAC1B;AAED,qBAAa,WAAY,SAAQ,KAAK;IACpC,kBAAkB,EAAE,EAAE,CAAC,gBAAgB,GAAG,IAAI,CAAA;IAC9C,cAAc,EAAE,MAAM,CAAA;gBAEV,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,kBAAkB;IAUzD,QAAQ;IAUR,aAAa;CAGd;AAED,qBAAa,aAAc,SAAQ,WAAW;gBAChC,OAAO,EAAE,MAAM;CAI5B;AAED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,EAAE,CAAC,WAAW,CAAA;IACvB,UAAU,EAAE,EAAE,CAAC,UAAU,CAAA;IACzB,MAAM,EAAE,sBAAsB,CAAA;IAC9B,OAAO,EAAE,MAAM,CAAA;CAChB;AAuOD,MAAM,MAAM,sBAAsB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAE3D;;;;;;;;;;;;GAYG;AACH,wBAAgB,6BAA6B,CAC3C,MAAM,EAAE,EAAE,CAAC,MAAM,EACjB,OAAO,EAAE,EAAE,CAAC,WAAW,EACvB,UAAU,EAAE,EAAE,CAAC,UAAU,0BAsD1B;AAED;;;;;;;;;GASG;AACH,wBAAsB,sBAAsB,CAC1C,IAAI,EAAE,EAAE,CAAC,wBAAwB,GAAG,EAAE,CAAC,UAAU,GAAG,EAAE,CAAC,UAAU,EACjE,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,aAAa,EAC/C,MAAM,CAAC,EAAE,OAAO;;;;GA2GjB;AAeD;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,EAAE,IAAI,EAAE,MAAM,WAmBnE;AAkFD;;;;;;;;;GASG;AACH,wBAAgB,mBAAmB,CACjC,GAAG,EAAE,EAAE,CAAC,aAAa,GAAG,EAAE,CAAC,kBAAkB,GAAG,EAAE,CAAC,mBAAmB,EACtE,aAAa,EAAE,aAAa,EAC5B,YAAY,CAAC,EAAE,YAAY;;;;;;;EA+T5B;AA+LD,wBAAgB,kBAAkB,CAChC,iBAAiB,EAAE,OAAO,CAAC,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC,UAItE;AAkHD,KAAK,YAAY,GAAG;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,wBAAsB,KAAK,CACzB,OAAO,EAAE,EAAE,CAAC,OAAO,EACnB,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,MAAM,EACf,YAAY,GAAE,YAAiB,GAC9B,OAAO,CAAC,GAAG,EAAE,CAAC,CAmChB"}
+{"version":3,"file":"parser.d.ts","sourceRoot":"","sources":["../../src/react/parser.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,YAAY,CAAA;AAW3B,OAAO,EAAsB,YAAY,EAAoB,MAAM,uBAAuB,CAAA;AAC1F,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAE1D,OAAO,EAIL,aAAa,EASb,YAAY,EACb,MAAM,0BAA0B,CAAA;AAgFjC,wBAAgB,qBAAqB,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,UAAU,0BAanF;AAsMD,MAAM,MAAM,sBAAsB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAE3D;;;;;;;;;;;;GAYG;AACH,wBAAgB,6BAA6B,CAC3C,MAAM,EAAE,EAAE,CAAC,MAAM,EACjB,OAAO,EAAE,EAAE,CAAC,WAAW,EACvB,UAAU,EAAE,EAAE,CAAC,UAAU,0BA0E1B;AAED;;;;;;;;;GASG;AACH,wBAAsB,sBAAsB,CAC1C,IAAI,EAAE,EAAE,CAAC,wBAAwB,GAAG,EAAE,CAAC,UAAU,GAAG,EAAE,CAAC,UAAU,EACjE,aAAa,EAAE,aAAa,EAC5B,MAAM,CAAC,EAAE,OAAO;;;;GA4GjB;AAED;;;;;;;;;GASG;AACH,wBAAgB,mBAAmB,CACjC,GAAG,EAAE,EAAE,CAAC,aAAa,GAAG,EAAE,CAAC,kBAAkB,GAAG,EAAE,CAAC,mBAAmB,EACtE,aAAa,EAAE,aAAa,EAC5B,YAAY,CAAC,EAAE,YAAY;;;;;;;EA8O5B;AA+LD,wBAAgB,kBAAkB,CAChC,iBAAiB,EAAE,OAAO,CAAC,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC,UAItE;AAED,wBAAsB,aAAa,CACjC,IAAI,EAAE,EAAE,CAAC,cAAc,EACvB,aAAa,EAAE,aAAa,EAC5B,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,YAAY,GAChC,OAAO,CAAC,eAAe,CAAC,CAyG1B"}