Add TypeScript to all packages except 'cli' (#33)

marcomontalbano · Feb 25, 2020 · 1b39c03 · 1b39c03
1 parent 7d6f7bb
commit 1b39c03
Show file tree

Hide file tree

Showing 41 changed files with 444 additions and 289 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -38,6 +38,12 @@ module.exports = {
           }
         ]
       }
+    },
+    {
+      files: ['**.test.ts'],
+      rules: {
+        'import/no-extraneous-dependencies': 'off',
+      }
     }
   ],
   globals: {

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,25 +9,20 @@
   },
   "scripts": {
     "clean": "rm -rf node_modules/ output/ */*/node_modules */*/output */*/dist */*/tsconfig.tsbuildinfo",
-
     "postinstall": "lerna bootstrap --force-local",
-
     "build": "tsc --build packages/**/tsconfig.json",
     "prepublish": "npm run build",
-
     "lint": "eslint . --ignore-pattern=node_modules --ignore-pattern=/output --ignore-pattern=dist --ext .js,.ts",
     "pretest": "npm run build",
     "posttest": "npm run lint",
-    "test": "mocha",
+    "test": "TS_NODE_PROJECT='./tsconfig.mocha.json' mocha",
     "test:watch": "npm test -- --watch --reporter=dot",
     "coverage": "nyc --reporter=lcov --reporter=text npm test -- --reporter=dot",
     "coverage:watch": "npx nodemon --exec npm run coverage",
-
     "prewebsite:start": "npm run build",
     "website:start": "lerna run --scope @figma-export/website start --stream",
     "prewebsite:build": "lerna bootstrap --force-local",
     "website:build": "lerna run --scope @figma-export/website build --stream",
-
     "lerna:version": "lerna version",
     "lerna:install": "lerna exec npm install --stream",
     "lerna:update": "lerna exec npm update --stream",
@@ -44,6 +39,7 @@
   "devDependencies": {
     "@types/chai": "~4.2.7",
     "@types/chai-things": "0.0.34",
+    "@types/figma": "~1.0.2",
     "@types/mocha": "~5.2.7",
     "@types/node": "~13.7.1",
     "@types/sinon": "~7.5.1",
@@ -75,7 +71,7 @@
     "npm": ">= 5.3 <= 6.x"
   },
   "lint-staged": {
-    "*.js": [
+    "*.{js,ts}": [
       "npm test"
     ]
   },

diff --git a/packages/cli/src/commands/components.test.js b/packages/cli/src/commands/components.test.js
@@ -1,3 +1,6 @@
+/* eslint-disable import/no-extraneous-dependencies */
+
+const sinon = require('sinon');
 const { expect, test } = require('@oclif/test');
 
 const figmaExport = require('@figma-export/core');

diff --git a/packages/core/.npmignore b/packages/core/.npmignore
@@ -0,0 +1,3 @@
+src
+tsconfig.json
+tsconfig.tsbuildinfo
diff --git a/packages/core/index.js b/packages/core/index.js
diff --git a/packages/core/lib/export-components.js b/packages/core/lib/export-components.js
diff --git a/packages/core/lib/figma.js b/packages/core/lib/figma.js
diff --git a/packages/core/package.json b/packages/core/package.json
@@ -2,7 +2,8 @@
     "name": "@figma-export/core",
     "version": "1.2.0",
     "description": "@figma-export core functionalities",
-    "main": "index.js",
+    "main": "dist/index.js",
+    "types": "dist/index.d.ts",
     "repository": {
         "type": "git",
         "url": "git+https://github.com/marcomontalbano/figma-exporter.git",
@@ -14,6 +15,7 @@
         "access": "public"
     },
     "dependencies": {
+        "@figma-export/types": "^1.2.0",
         "axios": "~0.19.2",
         "figma-js": "~1.9.0"
     }

diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
@@ -0,0 +1 @@
+export { components } from './lib/export-components';
diff --git a/packages/core/lib/_config.test.js → packages/core/src/lib/_config.test.ts b/packages/core/lib/_config.test.js → packages/core/src/lib/_config.test.ts
@@ -1,3 +1,4 @@
+import { FigmaExportComponentNode } from '@figma-export/types';
 
 const svg = {
     domain: 'https://s3-us-west-2.amazonaws.com',
@@ -20,7 +21,8 @@ const componentWithSlashedName = {
     type: 'COMPONENT',
 };
 
-const component1 = {
+const component1: FigmaExportComponentNode = {
+    ...({} as ComponentNode),
     id: '10:8',
     name: 'Figma-Logo',
     type: 'COMPONENT',
@@ -31,14 +33,20 @@ const component1 = {
     },
 };
 
-const component2 = {
+const component2: FigmaExportComponentNode = {
+    ...({} as ComponentNode),
     id: '8:1',
     name: 'Search',
     type: 'COMPONENT',
     svg: '<svg id="c2"></svg>',
+    figmaExport: {
+        dirname: '.',
+        basename: 'Figma-Search',
+    },
 };
 
-const component3 = {
+const component3: FigmaExportComponentNode = {
+    ...({} as ComponentNode),
     id: '9:1',
     name: 'Login',
     type: 'COMPONENT',
@@ -49,50 +57,60 @@ const component3 = {
     },
 };
 
-const group1 = {
+const group1: GroupNode = {
+    ...({} as GroupNode),
     id: '26:0',
     name: 'A Group',
     type: 'GROUP',
     children: [component3],
 };
 
-const page1 = {
+const page1: PageNode = {
+    ...({} as PageNode),
     id: '10:6',
     name: 'page1',
-    type: 'CANVAS',
+    type: 'PAGE',
     children: [
         component1,
         component2,
     ],
 };
 
-const page2 = {
+const page2: PageNode = {
+    ...({} as PageNode),
     id: '10:7',
     name: 'page2',
-    type: 'CANVAS',
+    type: 'PAGE',
     children: [
         group1,
     ],
 };
 
-const createPage = (children) => ({
+const createDocument = (props: any): DocumentNode => ({
+    ...({} as DocumentNode),
+    ...props,
+});
+
+const createPage = (children: any): DocumentNode => ({
+    ...({} as DocumentNode),
     children: [{
+        ...({} as PageNode),
         id: '10:8',
         name: 'fakePage',
-        type: 'CANVAS',
         children,
     }],
 });
 
-module.exports = {
+export {
     componentWithNumber,
     componentWithSlashedName,
     component1,
     component2,
     component3,
     group1,
-    createPage,
     page1,
     page2,
     svg,
+    createPage,
+    createDocument,
 };
diff --git a/packages/core/src/lib/export-components.ts b/packages/core/src/lib/export-components.ts
@@ -0,0 +1,38 @@
+import {
+    FigmaExportPageNode,
+} from '@figma-export/types/src';
+import { Document } from 'figma-js';
+
+import {
+    getClient,
+    getPages,
+    enrichPagesWithSvg,
+} from './figma';
+
+type FigmaExportComponentsProps = {
+    [key: string]: any;
+    token: string;
+}
+
+export const components = async ({
+    token,
+    fileId,
+    onlyFromPages = [],
+    transformers = [],
+    outputters = [],
+    log = (msg: string): void => { console.log(msg); },
+}: FigmaExportComponentsProps): Promise<FigmaExportPageNode[]> => {
+    const client = getClient(token);
+
+    log('fetching document');
+    const { data: { document } = {} }: { data?: { document?: Document } } = await client.file(fileId);
+
+    const pages = getPages((document as unknown as DocumentNode), { only: onlyFromPages });
+
+    log('fetching components');
+    const pagesWithSvg = await enrichPagesWithSvg(client, fileId, pages, transformers);
+
+    await Promise.all(outputters.map((outputter: Function) => outputter(pagesWithSvg)));
+
+    return pagesWithSvg;
+};