Merge bc109c2 into 05a70e6

.eslintrc.js

@@ -22,7 +22,9 @@ module.exports = {
         ecmaVersion: 2018,
     },
     rules: {
-        indent: ['error', 4],
+        indent: ['error', 4, {
+            SwitchCase: 1,
+        }],
         'max-len': ['error', 160],
         'no-unused-expressions': 'off',
         'chai-friendly/no-unused-expressions': 'error',

.github/workflows/main.yml

@@ -22,6 +22,9 @@ jobs:
     - name: Install 📦
       run: yarn --frozen-lockfile
 
+    - name: Lint 🔍
+      run: yarn lint
+
     - name: Test 🐛
       run: yarn test
 

.gitignore

@@ -11,3 +11,4 @@ lerna-debug.log
 *.tsbuildinfo
 
 /.figmaexportrc.js
+/.figmaexportrc.ts

.nycrc

@@ -0,0 +1,7 @@
+{
+    "check-coverage": true,
+    "branches": 80,
+    "lines": 80,
+    "functions": 80,
+    "statements": 80
+}

.vscode/launch.json

@@ -0,0 +1,33 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "name": "Launch via NPM",
+            "request": "launch",
+            "runtimeArgs": [
+                "run-script",
+                "test"
+            ],
+            "runtimeExecutable": "npm",
+            "skipFiles": [
+                "<node_internals>/**"
+            ],
+            "type": "pwa-node"
+        },
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "Debug",
+            "skipFiles": ["<node_internals>/**"],
+            "program": "./packages/cli/bin/run",
+            "cwd": "${workspaceFolder}",
+            "args": ["use-config"],
+            "console": "integratedTerminal",
+            "internalConsoleOptions": "neverOpen",
+            "preLaunchTask": "${defaultBuildTask}"
+        }
+    ]
+}

.vscode/tasks.json

@@ -0,0 +1,16 @@
+{
+    "version": "2.0.0",
+    "tasks": [
+        {
+            "type": "npm",
+            "script": "build",
+            "group": {
+                "kind": "build",
+                "isDefault": true
+            },
+            "problemMatcher": [],
+            "label": "npm: build",
+            "detail": "tsc --build packages/**/tsconfig.json"
+        }
+    ]
+}

lint-staged.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-    '!(*.d).{js,ts}': () => 'yarn test',
+    '!(*.d).{js,ts}': () => ['yarn lint --fix', 'yarn coverage', 'git add .'],
 };

package.json

@@ -8,17 +8,18 @@
     "url": "https://github.com/marcomontalbano/figma-export"
   },
   "scripts": {
+    "predebug": "yarn build",
+    "debug": "./packages/cli/bin/run use-config",
     "preinstall": "node -e \"if(process.env.npm_execpath.indexOf('yarn') === -1) throw new Error('You must use Yarn to install, not NPM')\"",
     "clean": "rm -rf node_modules/ output/ */*/node_modules */*/output */*/dist */*/tsconfig.tsbuildinfo",
     "postinstall": "lerna bootstrap",
     "build": "tsc --build packages/**/tsconfig.json",
     "prepublish": "yarn build",
     "lint": "eslint . --ignore-pattern=node_modules --ignore-pattern=output --ignore-pattern=dist --ext .js,.ts",
     "pretest": "yarn build",
-    "posttest": "yarn lint",
     "test": "TS_NODE_PROJECT='./tsconfig.mocha.json' mocha",
-    "test:watch": "yarn test -- --watch --reporter=dot",
-    "coverage": "nyc --reporter=lcov --reporter=text yarn test -- --reporter=dot",
+    "test:watch": "yarn test --watch --reporter=dot",
+    "coverage": "nyc --reporter=lcov --reporter=text yarn test --reporter=dot",
     "coverage:watch": "npx nodemon -e js,mjs,ts --exec yarn coverage",
     "prewebsite:start": "yarn build",
     "website:start": "lerna run --scope @figma-export/website start --stream",
@@ -38,6 +39,7 @@
   },
   "devDependencies": {
     "@types/chai": "~4.2.12",
+    "@types/chai-as-promised": "^7.1.3",
     "@types/chai-things": "0.0.34",
     "@types/mocha": "~8.0.1",
     "@types/node": "~14.0.27",
@@ -46,6 +48,7 @@
     "@typescript-eslint/eslint-plugin": "~3.8.0",
     "@typescript-eslint/parser": "~3.8.0",
     "chai": "~4.2.0",
+    "chai-as-promised": "^7.1.1",
     "chai-things": "~0.2.0",
     "eslint": "~7.6.0",
     "eslint-config-airbnb-base": "~14.2.0",

packages/cli/src/commands/components.ts

@@ -1,7 +1,7 @@
 import { Command, flags as commandFlags } from '@oclif/command';
 
 import * as figmaExport from '@figma-export/core';
-import { FigmaExport } from '@figma-export/types';
+import * as FigmaExport from '@figma-export/types';
 
 import fs = require('fs');
 import path = require('path');
@@ -51,7 +51,7 @@ class ComponentsCommand extends Command {
             token: process.env.FIGMA_TOKEN || '',
             onlyFromPages: page,
             transformers: requirePackages<FigmaExport.StringTransformer>(transformer),
-            outputters: requirePackages<FigmaExport.Outputter>(outputter, { output }),
+            outputters: requirePackages<FigmaExport.ComponentOutputter>(outputter, { output }),
             log: (message: string) => { spinner.text = message; },
         }).then(() => {
             spinner.stop();

packages/cli/src/commands/use-config.ts

@@ -26,31 +26,34 @@ class UseConfigCommand extends Command {
         // eslint-disable-next-line import/no-dynamic-require, global-require
         const { commands = [] } = fs.existsSync(configPath) ? require(configPath) : {};
 
-        Promise.all(commands.map((command: FigmaExportCommand) => {
-            const [commandName, options] = command;
-
-            spinner.start();
-
-            let figmaExporter;
-            switch (commandName) {
-            case 'components':
-                figmaExporter = figmaExport.components;
-                break;
-            default:
-                throw new Error(`Command ${commandName} is not found.`);
-            }
-
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const handlePromise = (figmaExporter: (options: any) => Promise<any>, options: Record<string, unknown>) => {
             return figmaExporter({
                 token: process.env.FIGMA_TOKEN || '',
                 fileId: '',
                 ...options,
-                log: (message) => { spinner.text = message; },
+                log: (message: string) => { spinner.text = message; },
             }).then(() => {
                 spinner.stop();
             }).catch((err: Error) => {
                 spinner.stop();
                 this.error(err, { exit: 1 });
             });
+        };
+
+        Promise.all(commands.map((command: FigmaExportCommand) => {
+            const [commandName, options] = command;
+
+            spinner.start();
+
+            switch (commandName) {
+                case 'components':
+                    return handlePromise(figmaExport.components, options);
+                case 'styles':
+                    return handlePromise(figmaExport.styles, options);
+                default:
+                    throw new Error(`Command ${commandName} is not found.`);
+            }
         }));
     }
 }

packages/core/src/index.ts

@@ -1 +1,2 @@
 export { components } from './lib/export-components';
+export { styles } from './lib/export-styles';

packages/core/src/lib/_config.test.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { FigmaExport } from '@figma-export/types';
+import * as FigmaExport from '@figma-export/types';
 import * as Figma from 'figma-js';
 
 const svg = {
@@ -89,6 +89,14 @@ const page2: Figma.Canvas = {
     ],
 };
 
+const pageWithoutComponents: Figma.Canvas = {
+    ...({} as Figma.Canvas),
+    id: '10:7',
+    name: 'page2',
+    type: 'CANVAS',
+    children: [],
+};
+
 const createDocument = (props: any): Figma.Document => ({
     ...({} as Figma.Document),
     ...props,
@@ -113,6 +121,7 @@ export {
     group1,
     page1,
     page2,
+    pageWithoutComponents,
     svg,
     createPage,
     createDocument,

packages/core/src/lib/_mocks_/README.md

@@ -0,0 +1,17 @@
+# MOCKS
+
+## Files Endpoint
+
+https://www.figma.com/developers/api#files-endpoints
+
+```sh
+curl -H "X-FIGMA-TOKEN: $FIGMA_TOKEN" "https://api.figma.com/v1/files/RSzpKJcnb6uBRQ3rOfLIyUs5" > ./packages/core/src/lib/_mocks_/figma.files.json
+```
+
+## Get File Nodes Endpoint
+
+https://www.figma.com/developers/api#get-file-nodes-endpoint
+
+```sh
+curl -H "X-FIGMA-TOKEN: $FIGMA_TOKEN" "https://api.figma.com/v1/files/RSzpKJcnb6uBRQ3rOfLIyUs5/nodes?ids=121:10,121:12,121:16,121:17,121:18,122:14,122:16,122:18,124:8,124:18,296:7,330:1,336:5,339:0,339:1,339:2,339:3,339:5,339:7,341:2,376:2,376:9,376:13,376:15,400:33,254:1,254:2,254:3" > ./packages/core/src/lib/_mocks_/figma.fileNodes.json
+```