@figma/code-connect 1.2.4 → 1.3.1

package/dist/connect/wizard/helpers.js

@@ -28,6 +28,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.maybePrefillWizardQuestionsForTesting = maybePrefillWizardQuestionsForTesting;
 exports.getIncludesGlob = getIncludesGlob;
+exports.createEnvFile = createEnvFile;
+exports.addTokenToEnvFile = addTokenToEnvFile;
 exports.createCodeConnectConfig = createCodeConnectConfig;
 exports.parseFilepathExport = parseFilepathExport;
 exports.getFilepathExport = getFilepathExport;
@@ -68,15 +70,34 @@ function getIncludesGlob({ dir, componentDirectory, config, }) {
     }
     return project_1.DEFAULT_INCLUDE_GLOBS_BY_PARSER[config.parser];
 }
-async function createCodeConnectConfig({ dir, componentDirectory, config, }) {
+async function createEnvFile({ dir, accessToken }) {
+    // Create .env file
+    const filePath = (0, project_1.getDefaultConfigPath)(dir);
+    fs_1.default.writeFileSync((0, project_1.getEnvPath)(dir), `FIGMA_ACCESS_TOKEN="${accessToken}"`);
+    logging_1.logger.info((0, logging_1.success)(`Created ${filePath}`));
+}
+function addTokenToEnvFile({ dir, accessToken }) {
+    const filePath = (0, project_1.getDefaultConfigPath)(dir);
+    fs_1.default.appendFileSync((0, project_1.getEnvPath)(dir), `\nFIGMA_ACCESS_TOKEN="${accessToken}"`);
+    logging_1.logger.info((0, logging_1.success)(`Appended access token to ${filePath}`));
+}
+async function createCodeConnectConfig({ dir, componentDirectory, config, figmaUrl, }) {
+    const label = project_1.DEFAULT_LABEL_PER_PARSER[config.parser];
     const includesGlob = getIncludesGlob({ dir, componentDirectory, config });
-    const configJson = `
-{
+    const configJson = label
+        ? `{
   "codeConnect": {
-    "include": ["${includesGlob}"]
-  }
+    "include": ["${includesGlob}"],
+    "label": "${label}",
+    "interactiveSetupFigmaFileUrl": "${figmaUrl}",
 }
-  `;
+}`
+        : `{
+  "codeConnect": {
+    "include": ["${includesGlob}"],
+    "interactiveSetupFigmaFileUrl": "${figmaUrl}",
+  }
+}`;
     const formatted = await prettier.format(configJson, {
         parser: 'json',
     });

package/dist/connect/wizard/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/connect/wizard/helpers.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/connect/wizard/helpers.ts"],"names":[],"mappings":"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"}

package/dist/connect/wizard/run_wizard.d.ts

@@ -2,11 +2,43 @@ import { BaseCommand } from '../../commands/connect';
 import prompts from 'prompts';
 import { FigmaRestApi } from '../figma_rest_api';
 import { ReactProjectInfo, CodeConnectConfig, ProjectInfo } from '../../connect/project';
+import { CreateRequestPayload, CreateRequestPayloadMulti, PropMapping } from '../parser_executable_types';
+import { ComponentTypeSignature } from '../../react/parser';
 type ConnectedComponentMappings = {
     componentName: string;
     filepathExport: string;
 }[];
+/**
+ * enable selection of a subset of components per page
+ * @param components to narrow down from
+ * @returns components narrowed down to the selected pages
+ */
+export declare function narrowDownComponentsPerPage(components: FigmaRestApi.Component[], pages: Record<string, string>): Promise<FigmaRestApi.Component[]>;
 export declare function getComponentChoicesForPrompt(components: FigmaRestApi.Component[], linkedNodeIdsToFilepathExports: Record<string, string>, connectedComponentsMappings: ConnectedComponentMappings, dir: string): prompts.Choice[];
+interface AddPayloadArgs {
+    payloadType: 'MULTI_EXPORT' | 'SINGLE_EXPORT';
+    filepath: string;
+    sourceExport: string;
+    reactTypeSignature?: ComponentTypeSignature;
+    propMapping?: PropMapping;
+    figmaNodeUrl: string;
+    moreComponentProps: FigmaRestApi.Component;
+    destinationDir: string;
+    sourceFilepath: string;
+    normalizedName: string;
+    config: CodeConnectConfig;
+}
+export declare function addPayload(payloads: Record<string, CreateRequestPayloadMulti | CreateRequestPayload>, args: AddPayloadArgs): Promise<void>;
+export declare function createCodeConnectFiles({ linkedNodeIdsToFilepathExports, figmaFileUrl, unconnectedComponentsMap, outDir: outDirArg, projectInfo, cmd, accessToken, useAi, }: {
+    figmaFileUrl: string;
+    linkedNodeIdsToFilepathExports: Record<string, string>;
+    unconnectedComponentsMap: Record<string, FigmaRestApi.Component>;
+    outDir: string | null;
+    projectInfo: ProjectInfo;
+    cmd: BaseCommand;
+    accessToken: string;
+    useAi: boolean;
+}): Promise<boolean>;
 export declare function convertRemoteFileUrlToRelativePath({ remoteFileUrl, gitRootPath, dir, }: {
     remoteFileUrl: string;
     gitRootPath: string;

package/dist/connect/wizard/run_wizard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"run_wizard.d.ts","sourceRoot":"","sources":["../../../src/connect/wizard/run_wizard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAiD,MAAM,wBAAwB,CAAA;AACnG,OAAO,OAAO,MAAM,SAAS,CAAA;AAG7B,OAAO,EAAE,YAAY,EAAa,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EACL,gBAAgB,EAKhB,iBAAiB,EACjB,WAAW,EAEZ,MAAM,uBAAuB,CAAA;AA0B9B,KAAK,0BAA0B,GAAG;IAAE,aAAa,EAAE,MAAM,CAAC;IAAC,cAAc,EAAE,MAAM,CAAA;CAAE,EAAE,CAAA;AAkKrF,wBAAgB,4BAA4B,CAC1C,UAAU,EAAE,YAAY,CAAC,SAAS,EAAE,EACpC,8BAA8B,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACtD,2BAA2B,EAAE,0BAA0B,EACvD,GAAG,EAAE,MAAM,GACV,OAAO,CAAC,MAAM,EAAE,CA2ClB;AA6SD,wBAAgB,kCAAkC,CAAC,EACjD,aAAa,EACb,WAAW,EACX,GAAG,GACJ,EAAE;IACD,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,GAAG,EAAE,MAAM,CAAA;CACZ,iBAYA;AAED,wBAAsB,qDAAqD,CACzE,GAAG,EAAE,WAAW,EAChB,YAAY,EAAE,MAAM,EACpB,kBAAkB,EAAE,YAAY,CAAC,SAAS,EAAE,EAC5C,WAAW,EAAE,WAAW,CAAC,iBAAiB,CAAC,GAAG,gBAAgB;;;GA8C/D;AAsFD,wBAAsB,SAAS,CAAC,GAAG,EAAE,WAAW,iBA+L/C"}
+{"version":3,"file":"run_wizard.d.ts","sourceRoot":"","sources":["../../../src/connect/wizard/run_wizard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAiD,MAAM,wBAAwB,CAAA;AACnG,OAAO,OAAO,MAAM,SAAS,CAAA;AAG7B,OAAO,EAAE,YAAY,EAAa,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EACL,gBAAgB,EAKhB,iBAAiB,EACjB,WAAW,EAGZ,MAAM,uBAAuB,CAAA;AAI9B,OAAO,EACL,oBAAoB,EACpB,yBAAyB,EAGzB,WAAW,EACZ,MAAM,4BAA4B,CAAA;AAuBnC,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAA;AAE3D,KAAK,0BAA0B,GAAG;IAAE,aAAa,EAAE,MAAM,CAAC;IAAC,cAAc,EAAE,MAAM,CAAA;CAAE,EAAE,CAAA;AA6FrF;;;;GAIG;AACH,wBAAsB,2BAA2B,CAC/C,UAAU,EAAE,YAAY,CAAC,SAAS,EAAE,EACpC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,qCA0C9B;AA+ED,wBAAgB,4BAA4B,CAC1C,UAAU,EAAE,YAAY,CAAC,SAAS,EAAE,EACpC,8BAA8B,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACtD,2BAA2B,EAAE,0BAA0B,EACvD,GAAG,EAAE,MAAM,GACV,OAAO,CAAC,MAAM,EAAE,CA2ClB;AA4ND,UAAU,cAAc;IACtB,WAAW,EAAE,cAAc,GAAG,eAAe,CAAA;IAC7C,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,MAAM,CAAA;IACpB,kBAAkB,CAAC,EAAE,sBAAsB,CAAA;IAC3C,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,YAAY,EAAE,MAAM,CAAA;IACpB,kBAAkB,EAAE,YAAY,CAAC,SAAS,CAAA;IAC1C,cAAc,EAAE,MAAM,CAAA;IACtB,cAAc,EAAE,MAAM,CAAA;IACtB,cAAc,EAAE,MAAM,CAAA;IACtB,MAAM,EAAE,iBAAiB,CAAA;CAC1B;AAED,wBAAsB,UAAU,CAC9B,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,yBAAyB,GAAG,oBAAoB,CAAC,EAC1E,IAAI,EAAE,cAAc,iBAwDrB;AAED,wBAAsB,sBAAsB,CAAC,EAC3C,8BAA8B,EAC9B,YAAY,EACZ,wBAAwB,EACxB,MAAM,EAAE,SAAS,EACjB,WAAW,EACX,GAAG,EACH,WAAW,EACX,KAAK,GACN,EAAE;IACD,YAAY,EAAE,MAAM,CAAA;IACpB,8BAA8B,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACtD,wBAAwB,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC,CAAA;IAChE,MAAM,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,WAAW,EAAE,WAAW,CAAA;IACxB,GAAG,EAAE,WAAW,CAAA;IAChB,WAAW,EAAE,MAAM,CAAA;IACnB,KAAK,EAAE,OAAO,CAAA;CACf,oBAoGA;AAED,wBAAgB,kCAAkC,CAAC,EACjD,aAAa,EACb,WAAW,EACX,GAAG,GACJ,EAAE;IACD,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,GAAG,EAAE,MAAM,CAAA;CACZ,iBAYA;AAED,wBAAsB,qDAAqD,CACzE,GAAG,EAAE,WAAW,EAChB,YAAY,EAAE,MAAM,EACpB,kBAAkB,EAAE,YAAY,CAAC,SAAS,EAAE,EAC5C,WAAW,EAAE,WAAW,CAAC,iBAAiB,CAAC,GAAG,gBAAgB;;;GA8C/D;AAsFD,wBAAsB,SAAS,CAAC,GAAG,EAAE,WAAW,iBAyQ/C"}

package/dist/connect/wizard/run_wizard.js

@@ -3,7 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.narrowDownComponentsPerPage = narrowDownComponentsPerPage;
 exports.getComponentChoicesForPrompt = getComponentChoicesForPrompt;
+exports.addPayload = addPayload;
+exports.createCodeConnectFiles = createCodeConnectFiles;
 exports.convertRemoteFileUrlToRelativePath = convertRemoteFileUrlToRelativePath;
 exports.getUnconnectedComponentsAndConnectedComponentMappings = getUnconnectedComponentsAndConnectedComponentMappings;
 exports.runWizard = runWizard;
@@ -30,6 +33,7 @@ const autolinking_1 = require("./autolinking");
 const prop_mapping_helpers_1 = require("./prop_mapping_helpers");
 const fetch_1 = require("../../common/fetch");
 const NONE = '(None)';
+const MAX_COMPONENTS_TO_MAP = 40;
 function clearQuestion(prompt, answer) {
     const displayedAnswer = (Array.isArray(prompt.choices) && prompt.choices.find((c) => c.value === answer)?.title) ||
         answer;
@@ -83,9 +87,51 @@ async function fetchTopLevelComponentsFromFile({ accessToken, figmaUrl, cmd, })
             }
             logging_1.logger.debug(JSON.stringify(err.data));
         }
+        else {
+            logging_1.logger.error(err);
+        }
         (0, helpers_1.exitWithFeedbackMessage)(1);
     }
 }
+/**
+ * enable selection of a subset of components per page
+ * @param components to narrow down from
+ * @returns components narrowed down to the selected pages
+ */
+async function narrowDownComponentsPerPage(components, pages) {
+    const createTitle = (name, id, pad) => {
+        const componentsInPage = components.filter((c) => c.pageId === id);
+        let namesPreview = componentsInPage
+            .slice(0, 4)
+            .map((c) => c.name)
+            .join(', ');
+        namesPreview = componentsInPage.length > 4 ? `${namesPreview}, ...` : `${namesPreview}`;
+        const componentWord = componentsInPage.length === 1 ? 'Component' : 'Components';
+        return `${name.padEnd(pad, ' ')} - ${componentsInPage.length} ${componentWord} ${chalk_1.default.dim(`(${namesPreview})`)}`;
+    };
+    const longestPageName = Math.max(...Object.values(pages).map((name) => name.length));
+    let pagesToMap = [];
+    console.info('');
+    while (true) {
+        const { pagesToMap_temp } = await askQuestion({
+            type: 'multiselect',
+            name: 'pagesToMap_temp',
+            message: `Select the pages with the Figma components you'd like to map (Press ${chalk_1.default.green('space')} to select and ${chalk_1.default.green('enter')} to continue)`,
+            instructions: false,
+            choices: Object.entries(pages).map(([id, name]) => ({
+                title: createTitle(name, id, longestPageName),
+                value: id,
+            })),
+        });
+        if (!pagesToMap_temp || pagesToMap_temp.length === 0) {
+            logging_1.logger.warn('Select at least one page to continue.');
+            continue;
+        }
+        pagesToMap = pagesToMap_temp;
+        break;
+    }
+    return components.filter((c) => pagesToMap.includes(c.pageId));
+}
 /**
  * Asks a Prompts question and adds spacing
  * @param question Prompts question
@@ -142,8 +188,11 @@ async function askQuestionWithExitConfirmation(question) {
     }
 }
 function formatComponentTitle(componentName, filepathExport, pad) {
+    const fileExport = filepathExport ? (0, helpers_2.parseFilepathExport)(filepathExport) : null;
     const nameLabel = `${chalk_1.default.dim('Figma component:')} ${componentName.padEnd(pad, ' ')}`;
-    const linkedLabel = `↔️ ${filepathExport ? (0, helpers_2.parseFilepathExport)(filepathExport).filepath : '-'}`;
+    const filepathLabel = fileExport ? fileExport.filepath : '-';
+    const exportNote = fileExport?.exportName ? ` (${fileExport.exportName})` : '';
+    const linkedLabel = `↔️ ${chalk_1.default.dim('Code Definition:')} ${filepathLabel}${exportNote}`;
     return `${nameLabel}  ${linkedLabel}`;
 }
 function getComponentChoicesForPrompt(components, linkedNodeIdsToFilepathExports, connectedComponentsMappings, dir) {
@@ -162,7 +211,7 @@ function getComponentChoicesForPrompt(components, linkedNodeIdsToFilepathExports
         return {
             title: formatComponentTitle(c.name, filepathExport, longestNameLength),
             value: c.id,
-            description: `${chalk_1.default.green('Edit link')}`,
+            description: `${chalk_1.default.green('Edit Match')}`,
         };
     };
     return [
@@ -188,15 +237,34 @@ function getUnconnectedComponentChoices(componentPaths, dir) {
         }),
     ];
 }
+const escapeHandler = () => {
+    let escPressed = false;
+    const keypressListener = (_, key) => {
+        if (key.name === 'escape') {
+            escPressed = true;
+        }
+    };
+    process.stdin.on('keypress', keypressListener);
+    return {
+        escPressed: () => escPressed,
+        reset: () => {
+            escPressed = false;
+        },
+        destroy: () => {
+            process.stdin.removeListener('keypress', keypressListener);
+        },
+    };
+};
 async function runManualLinking({ unconnectedComponents, linkedNodeIdsToFilepathExports, filepathExports, connectedComponentsMappings, cmd, }) {
     const filesToComponentOptionsMap = (0, helpers_2.getComponentOptionsMap)(filepathExports);
     const dir = (0, connect_1.getDir)(cmd);
+    const escHandler = escapeHandler();
     while (true) {
         // Don't show exit confirmation as we're relying on esc behavior
         const { nodeId } = await (0, prompts_1.default)({
             type: 'select',
             name: 'nodeId',
-            message: `Select a link to edit (Press ${chalk_1.default.green('esc')} when you're ready to continue on)`,
+            message: `Select a Figma component match you'd like to edit (Press ${chalk_1.default.green('esc')} when you're ready to continue on)`,
             choices: getComponentChoicesForPrompt(unconnectedComponents, linkedNodeIdsToFilepathExports, connectedComponentsMappings, dir),
             warn: 'This component already has a local Code Connect file.',
             hint: ' ',
@@ -204,7 +272,7 @@ async function runManualLinking({ unconnectedComponents, linkedNodeIdsToFilepath
             onSubmit: clearQuestion,
         });
         if (!nodeId) {
-            return;
+            break;
         }
         const pathChoices = getUnconnectedComponentChoices(Object.keys(filesToComponentOptionsMap), dir);
         const prevSelectedKey = linkedNodeIdsToFilepathExports[nodeId];
@@ -214,6 +282,7 @@ async function runManualLinking({ unconnectedComponents, linkedNodeIdsToFilepath
                 filepath: null,
                 exportName: null,
             };
+        escHandler.reset();
         const { pathToComponent } = await (0, prompts_1.default)({
             type: 'autocomplete',
             name: 'pathToComponent',
@@ -228,6 +297,9 @@ async function runManualLinking({ unconnectedComponents, linkedNodeIdsToFilepath
         }, {
             onSubmit: clearQuestion,
         });
+        if (escHandler.escPressed()) {
+            continue;
+        }
         if (pathToComponent) {
             if (pathToComponent === NONE) {
                 delete linkedNodeIdsToFilepathExports[nodeId];
@@ -239,6 +311,7 @@ async function runManualLinking({ unconnectedComponents, linkedNodeIdsToFilepath
                     linkedNodeIdsToFilepathExports[nodeId] = pathToComponent;
                 }
                 else {
+                    escHandler.reset();
                     const { filepathExport } = await (0, prompts_1.default)({
                         type: 'autocomplete',
                         name: 'filepathExport',
@@ -253,24 +326,27 @@ async function runManualLinking({ unconnectedComponents, linkedNodeIdsToFilepath
                     }, {
                         onSubmit: clearQuestion,
                     });
+                    if (escHandler.escPressed()) {
+                        continue;
+                    }
                     linkedNodeIdsToFilepathExports[nodeId] = filepathExport;
                 }
             }
         }
     }
+    escHandler.destroy();
 }
 async function runManualLinkingWithConfirmation(manualLinkingArgs) {
     let outDir = manualLinkingArgs.cmd.outDir || null;
-    let hasAskedOutDirQuestion = false;
     while (true) {
         await runManualLinking(manualLinkingArgs);
-        if (!outDir && !hasAskedOutDirQuestion) {
+        if (!outDir) {
+            console.info('\nA Code Connect file is created for each Figma component to code definition match.');
             const { outputDirectory } = await askQuestionWithExitConfirmation({
                 type: 'text',
                 name: 'outputDirectory',
-                message: `What directory should Code Connect files be created in? (Press ${chalk_1.default.green('enter')} to co-locate your files alongside your component files)`,
+                message: `In which directory would you like to store Code Connect files? (Press ${chalk_1.default.green('enter')} to co-locate your files alongside your component files)`,
             });
-            hasAskedOutDirQuestion = true;
             outDir = outputDirectory;
         }
         const linkedNodes = Object.keys(manualLinkingArgs.linkedNodeIdsToFilepathExports);
@@ -310,12 +386,58 @@ async function runManualLinkingWithConfirmation(manualLinkingArgs) {
                     },
                 ],
             });
-            if (confirmation !== 'backToEdit') {
+            if (confirmation === 'backToEdit') {
+                outDir = manualLinkingArgs.cmd.outDir || null;
+            }
+            else {
                 return outDir;
             }
         }
     }
 }
+async function addPayload(payloads, args) {
+    const { payloadType, filepath, sourceExport, reactTypeSignature, propMapping, figmaNodeUrl, moreComponentProps, destinationDir, sourceFilepath, normalizedName, config, } = args;
+    if (payloadType === 'MULTI_EXPORT') {
+        const figmaConnection = {
+            sourceExport,
+            reactTypeSignature,
+            propMapping,
+            component: {
+                figmaNodeUrl,
+                ...moreComponentProps,
+            },
+        };
+        if (payloads[filepath]) {
+            ;
+            payloads[filepath].figmaConnections.push(figmaConnection);
+        }
+        else {
+            const payload = {
+                mode: 'CREATE',
+                destinationDir,
+                sourceFilepath,
+                normalizedName,
+                figmaConnections: [figmaConnection],
+                config,
+            };
+            payloads[filepath] = payload;
+        }
+    }
+    if (payloadType === 'SINGLE_EXPORT') {
+        const payload = {
+            mode: 'CREATE',
+            destinationDir,
+            sourceFilepath,
+            component: {
+                figmaNodeUrl,
+                normalizedName,
+                ...moreComponentProps,
+            },
+            config,
+        };
+        payloads[filepath] = payload;
+    }
+}
 async function createCodeConnectFiles({ linkedNodeIdsToFilepathExports, figmaFileUrl, unconnectedComponentsMap, outDir: outDirArg, projectInfo, cmd, accessToken, useAi, }) {
     const filepathExportsToComponents = Object.entries(linkedNodeIdsToFilepathExports).reduce((map, [nodeId, filepathExport]) => {
         map[filepathExport] = unconnectedComponentsMap[nodeId];
@@ -342,6 +464,7 @@ async function createCodeConnectFiles({ linkedNodeIdsToFilepathExports, figmaFil
         embeddingsFetchSpinner.stop();
     }
     let allFilesCreated = true;
+    const payloads = {};
     for (const [nodeId, filepathExport] of Object.entries(linkedNodeIdsToFilepathExports)) {
         const urlObj = new URL(figmaFileUrl);
         urlObj.search = '';
@@ -349,20 +472,25 @@ async function createCodeConnectFiles({ linkedNodeIdsToFilepathExports, figmaFil
         const { filepath, exportName } = (0, helpers_2.parseFilepathExport)(filepathExport);
         const { name } = path_1.default.parse(filepath);
         const outDir = outDirArg || path_1.default.dirname(filepath);
-        const payload = {
-            mode: 'CREATE',
-            destinationDir: outDir,
-            sourceFilepath: filepath,
-            sourceExport: exportName || undefined,
+        const payloadType = projectInfo.config.parser === 'react' || projectInfo.config.parser === 'html'
+            ? 'MULTI_EXPORT'
+            : 'SINGLE_EXPORT';
+        addPayload(payloads, {
+            payloadType,
+            filepath,
+            sourceExport: exportName || '?',
             reactTypeSignature: propMappingsAndData?.propMappingData[filepathExport]?.signature,
             propMapping: propMappingsAndData?.propMappings[filepathExport],
-            component: {
-                figmaNodeUrl: urlObj.toString(),
-                normalizedName: (0, create_1.normalizeComponentName)(name),
-                ...unconnectedComponentsMap[nodeId],
-            },
+            figmaNodeUrl: urlObj.toString(),
+            moreComponentProps: unconnectedComponentsMap[nodeId],
+            destinationDir: outDir,
+            sourceFilepath: filepath,
+            normalizedName: (0, create_1.normalizeComponentName)(name),
             config: projectInfo.config,
-        };
+        });
+    }
+    for (const payloadKey of Object.keys(payloads)) {
+        const payload = payloads[payloadKey];
         let result;
         if (projectInfo.config.parser === 'react') {
             result = await (0, create_2.createReactCodeConnect)(payload);
@@ -516,10 +644,11 @@ async function runWizard(cmd) {
     }));
     const dir = (0, connect_1.getDir)(cmd);
     const { hasConfigFile, config } = await (0, project_1.parseOrDetermineConfig)(dir, cmd.config);
+    const { hasEnvFile, envHasFigmaToken } = await (0, project_1.checkForEnvAndToken)(dir);
     // This isn't ideal as you see the intro text followed by an error, but we'll
     // add support for this soon so I think it's OK
     if (config.parser === 'html') {
-        (0, logging_1.exitWithError)('HTML projects are currently not supported by Code Connect interactive setup');
+        (0, logging_1.exitWithError)('HTML projects are currently not supported by Code Connect interactive setup. Please use the "npx figma connect create" command instead.');
     }
     let accessToken = (0, connect_1.getAccessToken)(cmd);
     if (!accessToken) {
@@ -533,19 +662,70 @@ async function runWizard(cmd) {
         accessToken = accessTokenEntered;
     }
     logging_1.logger.info('');
+    if (!hasEnvFile) {
+        // If there is no .env file, we should ask the user if they want to create one
+        // to store the Figma token.
+        const { createConfigFile } = await askQuestionOrExit({
+            type: 'select',
+            name: 'createConfigFile',
+            message: "It looks like you don't have a .env file. Would you like to generate one now to store the Figma access token?",
+            choices: [
+                {
+                    title: 'Yes',
+                    value: 'yes',
+                },
+                {
+                    title: 'No',
+                    value: 'no',
+                },
+            ],
+        });
+        if (createConfigFile === 'yes') {
+            await (0, helpers_2.createEnvFile)({ dir, accessToken });
+        }
+    }
+    else if (!envHasFigmaToken) {
+        // If there is a .env file but no Figma token, we should ask the user if they want to add it.
+        const { addFigmaToken } = await askQuestionOrExit({
+            type: 'select',
+            name: 'addFigmaToken',
+            message: 'Would you like to add your Figma access token to your .env file?',
+            choices: [
+                {
+                    title: 'Yes',
+                    value: 'yes',
+                },
+                {
+                    title: 'No',
+                    value: 'no',
+                },
+            ],
+        });
+        if (addFigmaToken === 'yes') {
+            (0, helpers_2.addTokenToEnvFile)({ dir, accessToken });
+        }
+    }
     const { componentDirectory, projectInfo, filepathExports } = await askForTopLevelDirectoryOrDetermineFromConfig({
         dir,
         hasConfigFile,
         config,
         cmd,
     });
-    const { figmaFileUrl } = await askQuestionOrExit({
-        type: 'text',
-        message: "What is the URL of the Figma file containing design components you'd like to connect?",
-        name: 'figmaFileUrl',
-        validate: (value) => (0, helpers_2.isValidFigmaUrl)(value) || 'Please enter a valid Figma file URL.',
-    });
-    const componentsFromFile = await fetchTopLevelComponentsFromFile({
+    let figmaFileUrl;
+    if (config.interactiveSetupFigmaFileUrl) {
+        logging_1.logger.info(`Using Figma file URL from config: ${config.interactiveSetupFigmaFileUrl}\n`);
+        figmaFileUrl = config.interactiveSetupFigmaFileUrl;
+    }
+    else {
+        let { figmaFileUrl: answer } = await askQuestionOrExit({
+            type: 'text',
+            message: "What is the URL of the Figma file containing design components you'd like to connect?",
+            name: 'figmaFileUrl',
+            validate: (value) => (0, helpers_2.isValidFigmaUrl)(value) || 'Please enter a valid Figma file URL.',
+        });
+        figmaFileUrl = answer;
+    }
+    let componentsFromFile = await fetchTopLevelComponentsFromFile({
         accessToken,
         figmaUrl: figmaFileUrl,
         cmd,
@@ -570,7 +750,7 @@ async function runWizard(cmd) {
             ],
         });
         if (createConfigFile === 'yes') {
-            await (0, helpers_2.createCodeConnectConfig)({ dir, componentDirectory, config });
+            await (0, helpers_2.createCodeConnectConfig)({ dir, componentDirectory, config, figmaUrl: figmaFileUrl });
         }
     }
     let useAi = false;
@@ -592,6 +772,15 @@ async function runWizard(cmd) {
         });
         useAi = useAiSelection === 'yes';
     }
+    const pagesFromFile = componentsFromFile.reduce((acc, c) => {
+        acc[c.pageId] = c.pageName;
+        return acc;
+    }, {});
+    const pagesFromFileCount = Object.keys(pagesFromFile).length;
+    if (componentsFromFile.length > MAX_COMPONENTS_TO_MAP && pagesFromFileCount > 1) {
+        logging_1.logger.info(`${componentsFromFile.length} Figma components found in the Figma file across ${pagesFromFileCount} pages.`);
+        componentsFromFile = await narrowDownComponentsPerPage(componentsFromFile, pagesFromFile);
+    }
     const linkedNodeIdsToFilepathExports = {};
     const { unconnectedComponents, connectedComponentsMappings } = await getUnconnectedComponentsAndConnectedComponentMappings(cmd, figmaFileUrl, componentsFromFile, projectInfo);
     (0, autolinking_1.autoLinkComponents)({
@@ -599,7 +788,7 @@ async function runWizard(cmd) {
         linkedNodeIdsToFilepathExports,
         filepathExports,
     });
-    logging_1.logger.info((0, boxen_1.default)(`${chalk_1.default.bold(`Connecting your components`)}\n\n` +
+    logging_1.logger.info((0, boxen_1.default)(`${chalk_1.default.bold(`Connecting your Figma components`)}\n\n` +
         `${chalk_1.default.green(`${chalk_1.default.bold(Object.keys(linkedNodeIdsToFilepathExports).length)} ${Object.keys(linkedNodeIdsToFilepathExports).length === 1
             ? 'component was automatically matched based on its name'
             : 'components were automatically matched based on their names'}`)}\n` +