Merge d483891 into 667456d

marcomontalbano · Oct 21, 2021 · 53c2aeb · 53c2aeb
2 parents 667456d + d483891
commit 53c2aeb
Show file tree

Hide file tree

Showing 17 changed files with 32 additions and 16 deletions.
diff --git a/.figmaexportrc.example.js b/.figmaexportrc.example.js
@@ -3,6 +3,7 @@ module.exports = {
     commands: [
         ['styles', {
             fileId: 'fzYhvQpqwhZDUImRz431Qo',
+            version: 'xxx123456', // marcomontalbano example figma is not on a paid team so has no version history
             outputters: [
                 require('@figma-export/output-styles-as-sass')({
                     output: './output'

diff --git a/README.md b/README.md
@@ -173,6 +173,7 @@ module.exports = {
 
         ['styles', {
             fileId: 'fzYhvQpqwhZDUImRz431Qo',
+            version: 'xxx123456', // marcomontalbano example figma is not on a paid team so has no version history
             outputters: [
                 require('@figma-export/output-styles-as-sass')({
                     output: './output/styles'

diff --git a/packages/core/src/lib/export-components.test.ts b/packages/core/src/lib/export-components.test.ts
@@ -73,6 +73,7 @@ describe('export-component', () => {
     it('should use transformers and outputter to export components', async () => {
         const pagesWithSvg = await exportComponents({
             fileId: 'fileABCD',
+            version: 'versionABCD',
             token: 'token1234',
             log: logger,
             outputters: [outputter],
@@ -87,7 +88,7 @@ describe('export-component', () => {
             ids: ['10:8', '8:1', '9:1'],
             svg_include_id: true,
         });
-        expect(clientFile).to.have.been.calledOnceWithExactly('fileABCD');
+        expect(clientFile).to.have.been.calledOnceWithExactly('fileABCD', { version: 'versionABCD' });
 
         expect(logger).to.have.been.callCount(5);
         expect(logger.getCall(0)).to.have.been.calledWith('fetching document');

diff --git a/packages/core/src/lib/export-components.ts b/packages/core/src/lib/export-components.ts
@@ -7,6 +7,7 @@ type Options = FigmaExport.BaseCommandOptions & FigmaExport.ComponentsCommandOpt
 export const components = async ({
     token,
     fileId,
+    version,
     onlyFromPages = [],
     transformers = [],
     outputters = [],
@@ -19,8 +20,8 @@ export const components = async ({
     const client = getClient(token);
 
     log('fetching document');
-    const { data: { document = null } = {} } = await client.file(fileId).catch((error: Error) => {
-        throw new Error(`while fetching file "${fileId}": ${error.message}`);
+    const { data: { document = null } = {} } = await client.file(fileId, { version }).catch((error: Error) => {
+        throw new Error(`while fetching file "${fileId}${version ? `?version=${version}` : ''}": ${error.message}`);
     });
 
     if (!document) {

diff --git a/packages/core/src/lib/export-styles.test.ts b/packages/core/src/lib/export-styles.test.ts
@@ -47,14 +47,15 @@ describe('export-styles', () => {
     it('should use outputter to export styles', async () => {
         const pagesWithSvg = await exportStyles({
             fileId: 'fileABCD',
+            version: 'versionABCD',
             token: 'token1234',
             log: logger,
             outputters: [outputter],
         });
 
         expect(FigmaExport.getClient).to.have.been.calledOnceWithExactly('token1234');
-        expect(clientFileNodes).to.have.been.calledOnceWith('fileABCD', { ids: nodeIds });
-        expect(clientFile).to.have.been.calledOnceWithExactly('fileABCD');
+        expect(clientFileNodes).to.have.been.calledOnceWith('fileABCD', { ids: nodeIds, version: 'versionABCD' });
+        expect(clientFile).to.have.been.calledOnceWithExactly('fileABCD', { version: 'versionABCD' });
 
         expect(logger).to.have.been.calledTwice;
         expect(logger.firstCall).to.have.been.calledWith('fetching styles');

diff --git a/packages/core/src/lib/export-styles.ts b/packages/core/src/lib/export-styles.ts
@@ -8,6 +8,7 @@ type Options = FigmaExport.BaseCommandOptions & FigmaExport.StylesCommandOptions
 export const styles = async ({
     token,
     fileId,
+    version,
     outputters = [],
     log = (msg): void => {
         // eslint-disable-next-line no-console
@@ -17,7 +18,7 @@ export const styles = async ({
     const client = getClient(token);
 
     log('fetching styles');
-    const styleNodes = await fetchStyles(client, fileId);
+    const styleNodes = await fetchStyles(client, fileId, version);
 
     log('parsing styles');
     const parsedStyles = parseStyles(styleNodes);

diff --git a/packages/core/src/lib/figmaStyles/index.test.ts b/packages/core/src/lib/figmaStyles/index.test.ts
@@ -60,10 +60,10 @@ describe('figmaStyles.', () => {
                 }),
             };
 
-            const styleNodes = await figmaStyles.fetchStyles(client, 'ABC123');
+            const styleNodes = await figmaStyles.fetchStyles(client, 'ABC123', 'version123');
 
-            expect(client.file).to.have.been.calledOnceWith('ABC123');
-            expect(client.fileNodes).to.have.been.calledWith('ABC123', { ids: ['121:10', '131:20'] });
+            expect(client.file).to.have.been.calledOnceWith('ABC123', { version: 'version123' });
+            expect(client.fileNodes).to.have.been.calledWith('ABC123', { ids: ['121:10', '131:20'], version: 'version123' });
 
             expect(styleNodes.length).to.equal(2);
             expect(styleNodes).to.deep.equal([
@@ -79,10 +79,10 @@ describe('figmaStyles.', () => {
                 fileNodes: sinon.stub().resolves({ data: fileNodes }),
             };
 
-            const styleNodes = await figmaStyles.fetchStyles(client, 'ABC123');
+            const styleNodes = await figmaStyles.fetchStyles(client, 'ABC123', 'version123');
 
-            expect(client.file).to.have.been.calledOnceWith('ABC123');
-            expect(client.fileNodes).to.have.been.calledWith('ABC123', { ids: nodeIds });
+            expect(client.file).to.have.been.calledOnceWith('ABC123', { version: 'version123' });
+            expect(client.fileNodes).to.have.been.calledWith('ABC123', { ids: nodeIds, version: 'version123' });
 
             const expectedStyleNodesLength = 30;
             const expectedUnusedLength = 1;

diff --git a/packages/core/src/lib/figmaStyles/index.ts b/packages/core/src/lib/figmaStyles/index.ts
@@ -8,16 +8,16 @@ import { parse as parseEffectStyle } from './effectStyle';
 import { parse as parseTextStyle } from './textStyle';
 // import { parse as parseGridStyle } from './gridStyle';
 
-const fetchStyles = async (client: Figma.ClientInterface, fileId: string): Promise<FigmaExport.StyleNode[]> => {
-    const { data: { styles = null } = {} } = await client.file(fileId).catch((error: Error) => {
-        throw new Error(`while fetching file "${fileId}": ${error.message}`);
+const fetchStyles = async (client: Figma.ClientInterface, fileId: string, version?: string): Promise<FigmaExport.StyleNode[]> => {
+    const { data: { styles = null } = {} } = await client.file(fileId, { version }).catch((error: Error) => {
+        throw new Error(`while fetching file "${fileId}${version ? `?version=${version}` : ''}": ${error.message}`);
     });
 
     if (!styles) {
         throw new Error('\'styles\' are missing.');
     }
 
-    const { data: { nodes } } = await client.fileNodes(fileId, { ids: Object.keys(styles) }).catch((error: Error) => {
+    const { data: { nodes } } = await client.fileNodes(fileId, { ids: Object.keys(styles), version }).catch((error: Error) => {
         throw new Error(`while fetching fileNodes: ${error.message}`);
     });
 

diff --git a/packages/types/src/commands.ts b/packages/types/src/commands.ts
@@ -8,6 +8,7 @@ export type BaseCommandOptions = {
 
 export type ComponentsCommandOptions = {
     fileId: string;
+    version?: string;
     onlyFromPages?: string[];
     transformers?: StringTransformer[];
     outputters?: ComponentOutputter[];
@@ -16,6 +17,7 @@ export type ComponentsCommandOptions = {
 
 export type StylesCommandOptions = {
     fileId: string;
+    version?: string;
     outputters?: StyleOutputter[];
 }
 

diff --git a/packages/website/src/output-components/ComponentsAsES6_base64.js b/packages/website/src/output-components/ComponentsAsES6_base64.js
@@ -23,6 +23,7 @@ const props = {
             commands: [
                 ['components', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     onlyFromPages: ['icons'],
                     outputters: [
                         require('@figma-export/output-components-as-es6')({

diff --git a/packages/website/src/output-components/ComponentsAsES6_dataUrl.js b/packages/website/src/output-components/ComponentsAsES6_dataUrl.js
@@ -23,6 +23,7 @@ const props = {
             commands: [
                 ['components', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     onlyFromPages: ['icons'],
                     outputters: [
                         require('@figma-export/output-components-as-es6')({

diff --git a/packages/website/src/output-components/ComponentsAsSvgr_default.js b/packages/website/src/output-components/ComponentsAsSvgr_default.js
@@ -27,6 +27,7 @@ const props = {
             commands: [
                 ['components', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     onlyFromPages: ['octicons-by-github'],
                     outputters: [
                         require('@figma-export/output-components-as-svgr')({

diff --git a/packages/website/src/output-components/ComponentsAsSvgstore_default.js b/packages/website/src/output-components/ComponentsAsSvgstore_default.js
@@ -25,6 +25,7 @@ const props = {
             commands: [
                 ['components', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     onlyFromPages: ['icons'],
                     outputters: [
                         require('@figma-export/output-components-as-svgstore')({

diff --git a/packages/website/src/output-components/ComponentsAsSvgstore_monochrome.js b/packages/website/src/output-components/ComponentsAsSvgstore_monochrome.js
@@ -24,6 +24,7 @@ const props = {
             commands: [
                 ['components', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     onlyFromPages: ['icons'],
                     outputters: [
                         require('@figma-export/output-components-as-svgstore')({

diff --git a/packages/website/src/output-styles/AsCss.js b/packages/website/src/output-styles/AsCss.js
@@ -27,6 +27,7 @@ const props = {
             commands: [
                 ['styles', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     outputters: [
                         require('@figma-export/output-styles-as-css')({
                             output: './output/css',

diff --git a/packages/website/src/output-styles/AsLess.js b/packages/website/src/output-styles/AsLess.js
@@ -31,6 +31,7 @@ const props = {
             commands: [
                 ['styles', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     outputters: [
                         require('@figma-export/output-styles-as-less')({
                             output: './output/less',

diff --git a/packages/website/src/output-styles/AsSass.js b/packages/website/src/output-styles/AsSass.js
@@ -32,6 +32,7 @@ const props = {
             commands: [
                 ['styles', {
                     fileId: 'fzYhvQpqwhZDUImRz431Qo',
+                    version: 'ABC123' // optional Figma file version ID
                     outputters: [
                         require('@figma-export/output-styles-as-sass')({
                             output: './output/scss',