@ama-styling/figma-extractor 12.5.0-prerelease.51
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +26 -0
- package/README.md +61 -0
- package/cli/figma-extract.d.ts +3 -0
- package/cli/figma-extract.d.ts.map +1 -0
- package/cli/figma-extract.js +115 -0
- package/cli/figma-extract.js.map +1 -0
- package/collection.json +11 -0
- package/core/constants.d.ts +3 -0
- package/core/constants.d.ts.map +1 -0
- package/core/constants.js +6 -0
- package/core/constants.js.map +1 -0
- package/core/generators/generate-manifest.d.ts +38 -0
- package/core/generators/generate-manifest.d.ts.map +1 -0
- package/core/generators/generate-manifest.js +35 -0
- package/core/generators/generate-manifest.js.map +1 -0
- package/core/generators/generate-package.d.ts +19 -0
- package/core/generators/generate-package.d.ts.map +1 -0
- package/core/generators/generate-package.js +42 -0
- package/core/generators/generate-package.js.map +1 -0
- package/core/generators/generate-tokens.d.ts +26 -0
- package/core/generators/generate-tokens.d.ts.map +1 -0
- package/core/generators/generate-tokens.js +31 -0
- package/core/generators/generate-tokens.js.map +1 -0
- package/core/generators/index.d.ts +5 -0
- package/core/generators/index.d.ts.map +1 -0
- package/core/generators/index.js +8 -0
- package/core/generators/index.js.map +1 -0
- package/core/generators/styles/generate-color.d.ts +25 -0
- package/core/generators/styles/generate-color.d.ts.map +1 -0
- package/core/generators/styles/generate-color.js +53 -0
- package/core/generators/styles/generate-color.js.map +1 -0
- package/core/generators/styles/generate-effect.d.ts +26 -0
- package/core/generators/styles/generate-effect.d.ts.map +1 -0
- package/core/generators/styles/generate-effect.js +54 -0
- package/core/generators/styles/generate-effect.js.map +1 -0
- package/core/generators/styles/generate-grid.d.ts +17 -0
- package/core/generators/styles/generate-grid.d.ts.map +1 -0
- package/core/generators/styles/generate-grid.js +41 -0
- package/core/generators/styles/generate-grid.js.map +1 -0
- package/core/generators/styles/generate-text.d.ts +25 -0
- package/core/generators/styles/generate-text.d.ts.map +1 -0
- package/core/generators/styles/generate-text.js +53 -0
- package/core/generators/styles/generate-text.js.map +1 -0
- package/core/generators/styles/index.d.ts +6 -0
- package/core/generators/styles/index.d.ts.map +1 -0
- package/core/generators/styles/index.js +9 -0
- package/core/generators/styles/index.js.map +1 -0
- package/core/generators/styles/interfaces.d.ts +15 -0
- package/core/generators/styles/interfaces.d.ts.map +1 -0
- package/core/generators/styles/interfaces.js +11 -0
- package/core/generators/styles/interfaces.js.map +1 -0
- package/core/generators/tokens/token-from-local-variables.d.ts +19 -0
- package/core/generators/tokens/token-from-local-variables.d.ts.map +1 -0
- package/core/generators/tokens/token-from-local-variables.js +59 -0
- package/core/generators/tokens/token-from-local-variables.js.map +1 -0
- package/core/helpers/color-hex.helpers.d.ts +12 -0
- package/core/helpers/color-hex.helpers.d.ts.map +1 -0
- package/core/helpers/color-hex.helpers.js +22 -0
- package/core/helpers/color-hex.helpers.js.map +1 -0
- package/core/helpers/context.helpers.d.ts +12 -0
- package/core/helpers/context.helpers.d.ts.map +1 -0
- package/core/helpers/context.helpers.js +20 -0
- package/core/helpers/context.helpers.js.map +1 -0
- package/core/helpers/create-output-folder.d.ts +8 -0
- package/core/helpers/create-output-folder.d.ts.map +1 -0
- package/core/helpers/create-output-folder.js +19 -0
- package/core/helpers/create-output-folder.js.map +1 -0
- package/core/helpers/file-names.d.ts +13 -0
- package/core/helpers/file-names.d.ts.map +1 -0
- package/core/helpers/file-names.js +23 -0
- package/core/helpers/file-names.js.map +1 -0
- package/core/helpers/generate-token-tree.helpers.d.ts +11 -0
- package/core/helpers/generate-token-tree.helpers.d.ts.map +1 -0
- package/core/helpers/generate-token-tree.helpers.js +26 -0
- package/core/helpers/generate-token-tree.helpers.js.map +1 -0
- package/core/helpers/name-to-reference.d.ts +6 -0
- package/core/helpers/name-to-reference.d.ts.map +1 -0
- package/core/helpers/name-to-reference.js +13 -0
- package/core/helpers/name-to-reference.js.map +1 -0
- package/core/helpers/variable-formatter.d.ts +7 -0
- package/core/helpers/variable-formatter.d.ts.map +1 -0
- package/core/helpers/variable-formatter.js +21 -0
- package/core/helpers/variable-formatter.js.map +1 -0
- package/core/helpers/vector.d.ts +11 -0
- package/core/helpers/vector.d.ts.map +1 -0
- package/core/helpers/vector.js +16 -0
- package/core/helpers/vector.js.map +1 -0
- package/core/interfaces.d.ts +31 -0
- package/core/interfaces.d.ts.map +1 -0
- package/core/interfaces.js +3 -0
- package/core/interfaces.js.map +1 -0
- package/core/requests/get-file.request.d.ts +12 -0
- package/core/requests/get-file.request.d.ts.map +1 -0
- package/core/requests/get-file.request.js +18 -0
- package/core/requests/get-file.request.js.map +1 -0
- package/core/requests/get-text-weight.request.d.ts +14 -0
- package/core/requests/get-text-weight.request.d.ts.map +1 -0
- package/core/requests/get-text-weight.request.js +31 -0
- package/core/requests/get-text-weight.request.js.map +1 -0
- package/core/requests/get-variable.request.d.ts +14 -0
- package/core/requests/get-variable.request.d.ts.map +1 -0
- package/core/requests/get-variable.request.js +21 -0
- package/core/requests/get-variable.request.js.map +1 -0
- package/core/requests/get-versions.request.d.ts +53 -0
- package/core/requests/get-versions.request.d.ts.map +1 -0
- package/core/requests/get-versions.request.js +95 -0
- package/core/requests/get-versions.request.js.map +1 -0
- package/generate-json.d.ts +22 -0
- package/generate-json.d.ts.map +1 -0
- package/generate-json.js +77 -0
- package/generate-json.js.map +1 -0
- package/package.json +176 -0
- package/public_api.d.ts +4 -0
- package/public_api.d.ts.map +1 -0
- package/public_api.js +7 -0
- package/public_api.js.map +1 -0
- package/schematics/ng-add/index.d.ts +8 -0
- package/schematics/ng-add/index.d.ts.map +1 -0
- package/schematics/ng-add/index.js +44 -0
- package/schematics/ng-add/schema.d.ts +12 -0
- package/schematics/ng-add/schema.d.ts.map +1 -0
- package/schematics/ng-add/schema.js +3 -0
- package/schematics/ng-add/schema.json +31 -0
- package/schematics/package.json +3 -0
package/LICENSE
ADDED
@@ -0,0 +1,26 @@
|
|
1
|
+
Copyright Amadeus SAS
|
2
|
+
|
3
|
+
Redistribution and use in source and binary forms, with or without modification,
|
4
|
+
are permitted provided that the following conditions are met:
|
5
|
+
|
6
|
+
1. Redistributions of source code must retain the above copyright notice, this
|
7
|
+
list of conditions and the following disclaimer.
|
8
|
+
|
9
|
+
2. Redistributions in binary form must reproduce the above copyright notice,
|
10
|
+
this list of conditions and the following disclaimer in the documentation and/or
|
11
|
+
other materials provided with the distribution.
|
12
|
+
|
13
|
+
3. Neither the name of the copyright holder nor the names of its contributors
|
14
|
+
may be used to endorse or promote products derived from this software without
|
15
|
+
specific prior written permission.
|
16
|
+
|
17
|
+
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
|
18
|
+
ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
|
19
|
+
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
|
20
|
+
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR
|
21
|
+
ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
|
22
|
+
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
|
23
|
+
LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
|
24
|
+
ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
25
|
+
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
|
26
|
+
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
package/README.md
ADDED
@@ -0,0 +1,61 @@
|
|
1
|
+
<h1 align="center">Otter Figma Extractor</h1>
|
2
|
+
<p align="center">
|
3
|
+
<img src="https://raw.githubusercontent.com/AmadeusITGroup/otter/main/assets/logo/otter.png" alt="Super cute Otter!" width="40%"/>
|
4
|
+
</p>
|
5
|
+
|
6
|
+
This package is an [Otter Framework Module](https://github.com/AmadeusITGroup/otter/tree/main/docs/core/MODULE.md).
|
7
|
+
<br />
|
8
|
+
<br />
|
9
|
+
|
10
|
+
## Description
|
11
|
+
|
12
|
+
[](https://www.npmjs.com/package/@ama-styling/figma-extractor)
|
13
|
+
[](https://www.npmjs.com/package/@ama-styling/figma-extractor)
|
14
|
+
|
15
|
+
This module will extract the [Design Token](https://tr.designtokens.org/format/) metadata from a given Figma file.
|
16
|
+
|
17
|
+
## How to execute
|
18
|
+
|
19
|
+
The package exposes to commands: `extract-file` and `extract-project`.\
|
20
|
+
The 2 commands extract the [Design Tokens](https://tr.designtokens.org/format/) from a single file but the `extract-project` will determine the file to extract based on the filename pattern and the versions extract from it.
|
21
|
+
|
22
|
+
### Common Options
|
23
|
+
|
24
|
+
| Option | Env Variables | Descriptions |
|
25
|
+
| -- | -- | -- |
|
26
|
+
| **--help** | | Show help |
|
27
|
+
| **-a**, **--accessToken** *[string]* | FIGMA_TOKEN | Access Token to read the Figma File information |
|
28
|
+
| **-o**, **--output** *[string]* | FIGMA_OUTPUT | Folder to extract the Design Token to |
|
29
|
+
| **-n**, **--name** *[string]* | FIGMA_DT_NAME | Name of the Design Token collection (default: *"Design Tokens"*) |
|
30
|
+
| **--verbose** | | Determine if the logger display debug messages (default: *false*) |
|
31
|
+
| **-q**, **--quiet** | | Determine if it should ignore message in the console (default: *false*) |
|
32
|
+
| **-g**, **--generatePackage** | | Request the generation of the NPM package.json (default: *false*) |
|
33
|
+
| **--packageName** *[string]* | | Version of the Design Token collection (if not provided, the `name` option value will be used) |
|
34
|
+
|
35
|
+
### Extract single Figma File
|
36
|
+
|
37
|
+
Extract the [Design Tokens](https://tr.designtokens.org/format/) from a single Figma file.
|
38
|
+
|
39
|
+
```shell
|
40
|
+
npx @ama-styling/figma-extractor extract-file <fileKey> [options]
|
41
|
+
```
|
42
|
+
|
43
|
+
### Extract Figma Project
|
44
|
+
|
45
|
+
Extract the [Design Tokens](https://tr.designtokens.org/format/) from a Figma file part of a project.
|
46
|
+
|
47
|
+
```shell
|
48
|
+
npx @ama-styling/figma-extractor extract-project <projectKey> [options]
|
49
|
+
```
|
50
|
+
|
51
|
+
The following options are dedicated to the `extract-project` command:
|
52
|
+
|
53
|
+
| Option | Env Variables | Descriptions |
|
54
|
+
| -- | -- | -- |
|
55
|
+
| **-P**, **--filenamePattern** *[string]* | FIGMA_PROJECT_FILENAME_MATCHER | Pattern of the filename, capturing its version, to match in the project (default: *"v((?:[0-9]+\\.){0,2}[0-9]+(?:-[^ ]+)?)$"*) |
|
56
|
+
| **--versionRange** | | Restricted range of versions of the File to be considered |
|
57
|
+
| **projectKey** *[string]* | FIGMA_PROJECT_KEY | Figma Project Key where is the file to extract |
|
58
|
+
|
59
|
+
## Setup automation
|
60
|
+
|
61
|
+
A complete documentation is available on [Figma Extractor documentation](https://github.com/AmadeusITGroup/otter/tree/main/docs/figma-extractor/figma-extractor-setup.md)
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"figma-extract.d.ts","sourceRoot":"","sources":["../../src/cli/figma-extract.ts"],"names":[],"mappings":""}
|
@@ -0,0 +1,115 @@
|
|
1
|
+
#!/usr/bin/env node
|
2
|
+
"use strict";
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
+
const node_process_1 = require("node:process");
|
5
|
+
const yargs = require("yargs");
|
6
|
+
const helpers_1 = require("yargs/helpers");
|
7
|
+
const get_versions_request_1 = require("../core/requests/get-versions.request");
|
8
|
+
const public_api_1 = require("../public_api");
|
9
|
+
void yargs((0, helpers_1.hideBin)(process.argv))
|
10
|
+
.option('accessToken', {
|
11
|
+
alias: 'a',
|
12
|
+
type: 'string',
|
13
|
+
description: 'Access Token to read the Figma File information',
|
14
|
+
default: node_process_1.env.FIGMA_TOKEN
|
15
|
+
})
|
16
|
+
.option('output', {
|
17
|
+
alias: 'o',
|
18
|
+
type: 'string',
|
19
|
+
description: 'Folder to extract the Design Token to',
|
20
|
+
default: node_process_1.env.FIGMA_OUTPUT || './design-token'
|
21
|
+
})
|
22
|
+
.option('verbose', {
|
23
|
+
alias: 'v',
|
24
|
+
type: 'boolean',
|
25
|
+
description: 'Determine if the logger display debug messages',
|
26
|
+
default: false
|
27
|
+
})
|
28
|
+
.option('quiet', {
|
29
|
+
alias: 'q',
|
30
|
+
type: 'boolean',
|
31
|
+
description: 'Determine if it should ignore message in the console',
|
32
|
+
default: false
|
33
|
+
})
|
34
|
+
.option('name', {
|
35
|
+
alias: 'n',
|
36
|
+
type: 'string',
|
37
|
+
description: 'Name of the Design Token collection',
|
38
|
+
default: node_process_1.env.FIGMA_DT_NAME || 'Design Tokens'
|
39
|
+
})
|
40
|
+
.option('generatePackage', {
|
41
|
+
alias: 'p',
|
42
|
+
type: 'boolean',
|
43
|
+
description: 'Request the generation of the NPM Package',
|
44
|
+
default: false
|
45
|
+
})
|
46
|
+
.option('packageName', {
|
47
|
+
type: 'string',
|
48
|
+
description: 'Version of the Design Token collection (if not provided, the `name` option value will be used)'
|
49
|
+
})
|
50
|
+
.command('extract-file [fileKey]', 'Extract file Design Token', (yargsExtract) => {
|
51
|
+
return yargsExtract
|
52
|
+
.positional('fileKey', {
|
53
|
+
type: 'string',
|
54
|
+
describe: 'File Key of the Figma file to extract',
|
55
|
+
default: node_process_1.env.FIGMA_FILE_KEY
|
56
|
+
});
|
57
|
+
}, (argv) => {
|
58
|
+
if (!argv.accessToken) {
|
59
|
+
throw new Error('Should provide Access Token.');
|
60
|
+
}
|
61
|
+
if (!argv.fileKey) {
|
62
|
+
throw new Error('File key is mandatory.');
|
63
|
+
}
|
64
|
+
// eslint-disable-next-line no-console -- Logging for CLI
|
65
|
+
const logger = argv.quiet ? undefined : { ...console, debug: argv.verbose ? console.debug : undefined };
|
66
|
+
return (0, public_api_1.generateJsonFiles)({
|
67
|
+
accessToken: argv.accessToken,
|
68
|
+
fileKey: argv.fileKey,
|
69
|
+
output: argv.output,
|
70
|
+
name: argv.name,
|
71
|
+
packageName: argv.packageName,
|
72
|
+
generatePackage: argv.generatePackage,
|
73
|
+
logger
|
74
|
+
});
|
75
|
+
})
|
76
|
+
.command('extract-project [projectKey]', 'Extract the design token of the latest version of a dedicated project', (yargsExtract) => {
|
77
|
+
return yargsExtract
|
78
|
+
.option('filenamePattern', {
|
79
|
+
alias: 'P',
|
80
|
+
description: 'Pattern of the filename, capturing its version, to match in the project',
|
81
|
+
default: node_process_1.env.FIGMA_PROJECT_FILENAME_MATCHER || get_versions_request_1.DEFAULT_FILENAME_MATCHER,
|
82
|
+
type: 'string'
|
83
|
+
})
|
84
|
+
.option('versionRange', {
|
85
|
+
alias: 'R',
|
86
|
+
description: 'Restricted range of versions of the File to be considered',
|
87
|
+
type: 'string'
|
88
|
+
})
|
89
|
+
.positional('projectKey', {
|
90
|
+
describe: 'Figma Project Key where is the file to extract',
|
91
|
+
type: 'string',
|
92
|
+
default: node_process_1.env.FIGMA_PROJECT_KEY
|
93
|
+
});
|
94
|
+
}, (argv) => {
|
95
|
+
if (!argv.accessToken) {
|
96
|
+
throw new Error('Should provide Access Token.');
|
97
|
+
}
|
98
|
+
if (!argv.projectKey) {
|
99
|
+
throw new Error('File key is mandatory.');
|
100
|
+
}
|
101
|
+
// eslint-disable-next-line no-console -- Logging for CLI
|
102
|
+
const logger = argv.quiet ? undefined : { ...console, debug: argv.verbose ? console.debug : undefined };
|
103
|
+
return (0, public_api_1.generateJsonFiles)({
|
104
|
+
accessToken: argv.accessToken,
|
105
|
+
projectKey: argv.projectKey,
|
106
|
+
output: argv.output,
|
107
|
+
name: argv.name,
|
108
|
+
packageName: argv.packageName,
|
109
|
+
generatePackage: argv.generatePackage,
|
110
|
+
versionRange: argv.versionRange,
|
111
|
+
logger
|
112
|
+
});
|
113
|
+
})
|
114
|
+
.parse();
|
115
|
+
//# sourceMappingURL=figma-extract.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"figma-extract.js","sourceRoot":"","sources":["../../src/cli/figma-extract.ts"],"names":[],"mappings":"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"}
|
package/collection.json
ADDED
@@ -0,0 +1,11 @@
|
|
1
|
+
{
|
2
|
+
"$schema": "https://raw.githubusercontent.com/angular/angular-cli/main/packages/angular_devkit/schematics/collection-schema.json",
|
3
|
+
"schematics": {
|
4
|
+
"ng-add": {
|
5
|
+
"description": "Add Figma Design Token Extractor to the project.",
|
6
|
+
"factory": "./schematics/ng-add/index#ngAdd",
|
7
|
+
"schema": "./schematics/ng-add/schema.json",
|
8
|
+
"aliases": ["install", "i"]
|
9
|
+
}
|
10
|
+
}
|
11
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/core/constants.ts"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,eAAO,MAAM,4BAA4B,MAAM,CAAC"}
|
@@ -0,0 +1,6 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.VARIABLE_NAME_PATH_SEPARATOR = void 0;
|
4
|
+
/** Path Name separator as defined in Figma variable */
|
5
|
+
exports.VARIABLE_NAME_PATH_SEPARATOR = '/';
|
6
|
+
//# sourceMappingURL=constants.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/core/constants.ts"],"names":[],"mappings":";;;AAAA,uDAAuD;AAC1C,QAAA,4BAA4B,GAAG,GAAG,CAAC"}
|
@@ -0,0 +1,38 @@
|
|
1
|
+
import type { GetLocalVariables200ResponseMeta, Style } from '@ama-styling/figma-sdk';
|
2
|
+
import type { FigmaFileContext } from '../interfaces';
|
3
|
+
import { type ManifestStyle } from './styles/interfaces';
|
4
|
+
/** Collection as described in Figma variables */
|
5
|
+
export interface Collection {
|
6
|
+
/** List of variables modes */
|
7
|
+
modes: Record<string, string[]>;
|
8
|
+
}
|
9
|
+
/** Manifest describing the Design Token files associated */
|
10
|
+
export interface Manifest {
|
11
|
+
/** Name of the Design Token set */
|
12
|
+
name: string;
|
13
|
+
/** List of the variable collections */
|
14
|
+
collections: Record<string, Collection>;
|
15
|
+
/** List of Figma defined styles */
|
16
|
+
styles: ManifestStyle;
|
17
|
+
}
|
18
|
+
/** Options for the Manifest generating function */
|
19
|
+
export interface GenerateManifestOptions extends FigmaFileContext {
|
20
|
+
/** Name of the Design Token Manifest */
|
21
|
+
name?: string;
|
22
|
+
}
|
23
|
+
/**
|
24
|
+
* Generate the Design Token Manifest
|
25
|
+
* @param localVariablesResponse Information relative to the Figma File local variables
|
26
|
+
* @param stylesFromFile List of Styles from the Figma File information
|
27
|
+
* @param options
|
28
|
+
*/
|
29
|
+
export declare const generateManifest: (localVariablesResponse: Promise<GetLocalVariables200ResponseMeta>, stylesFromFile: Promise<{
|
30
|
+
styles: Record<string, Style>;
|
31
|
+
}>, options?: GenerateManifestOptions) => Promise<{
|
32
|
+
name: string;
|
33
|
+
collections: {
|
34
|
+
[k: string]: Collection;
|
35
|
+
};
|
36
|
+
styles: ManifestStyle;
|
37
|
+
}>;
|
38
|
+
//# sourceMappingURL=generate-manifest.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-manifest.d.ts","sourceRoot":"","sources":["../../../src/core/generators/generate-manifest.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,gCAAgC,EAChC,KAAK,EACN,MAAM,wBAAwB,CAAC;AAKhC,OAAO,KAAK,EACV,gBAAgB,EACjB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,KAAK,aAAa,EAEnB,MAAM,qBAAqB,CAAC;AAE7B,iDAAiD;AACjD,MAAM,WAAW,UAAU;IACzB,8BAA8B;IAC9B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;CACjC;AAED,4DAA4D;AAC5D,MAAM,WAAW,QAAQ;IACvB,mCAAmC;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,uCAAuC;IACvC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACxC,mCAAmC;IACnC,MAAM,EAAE,aAAa,CAAC;CACvB;AAED,mDAAmD;AACnD,MAAM,WAAW,uBAAwB,SAAQ,gBAAgB;IAC/D,wCAAwC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAC3B,wBAAwB,OAAO,CAAC,gCAAgC,CAAC,EACjE,gBAAgB,OAAO,CAAC;IAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;CAAE,CAAC,EAC1D,UAAU,uBAAuB;;;;;;EA6BlC,CAAC"}
|
@@ -0,0 +1,35 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.generateManifest = void 0;
|
4
|
+
const file_names_1 = require("../helpers/file-names");
|
5
|
+
const interfaces_1 = require("./styles/interfaces");
|
6
|
+
/**
|
7
|
+
* Generate the Design Token Manifest
|
8
|
+
* @param localVariablesResponse Information relative to the Figma File local variables
|
9
|
+
* @param stylesFromFile List of Styles from the Figma File information
|
10
|
+
* @param options
|
11
|
+
*/
|
12
|
+
const generateManifest = async (localVariablesResponse, stylesFromFile, options) => {
|
13
|
+
const styleTypes = [...new Set(Object.values((await stylesFromFile).styles)
|
14
|
+
.map(({ styleType }) => styleType))];
|
15
|
+
const styles = styleTypes.reduce((acc, styleType) => {
|
16
|
+
const styleLabel = interfaces_1.styleTypeMapping[styleType];
|
17
|
+
acc[styleLabel] = [(0, file_names_1.getStyleFileName)(styleType)];
|
18
|
+
return acc;
|
19
|
+
}, {});
|
20
|
+
const collections = Object.fromEntries(Object.values((await localVariablesResponse).variableCollections)
|
21
|
+
.filter(({ remote }) => !remote)
|
22
|
+
.map(({ modes, name }) => ([
|
23
|
+
name,
|
24
|
+
{
|
25
|
+
modes: Object.fromEntries(modes.map((mode) => ([mode.name, [(0, file_names_1.getCollectionFileName)(name, mode)]])))
|
26
|
+
}
|
27
|
+
])));
|
28
|
+
return {
|
29
|
+
name: options?.name || 'Design Tokens',
|
30
|
+
collections,
|
31
|
+
styles
|
32
|
+
};
|
33
|
+
};
|
34
|
+
exports.generateManifest = generateManifest;
|
35
|
+
//# sourceMappingURL=generate-manifest.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-manifest.js","sourceRoot":"","sources":["../../../src/core/generators/generate-manifest.ts"],"names":[],"mappings":";;;AAIA,sDAG+B;AAI/B,oDAG6B;AAwB7B;;;;;GAKG;AACI,MAAM,gBAAgB,GAAG,KAAK,EACnC,sBAAiE,EACjE,cAA0D,EAC1D,OAAiC,EACjC,EAAE;IACF,MAAM,UAAU,GAAG,CAAC,GAAG,IAAI,GAAG,CAC5B,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,cAAc,CAAC,CAAC,MAAM,CAAC;aACzC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,SAAS,CAAC,CACrC,CAAC,CAAC;IAEH,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,SAAS,EAAE,EAAE;QAClD,MAAM,UAAU,GAAG,6BAAgB,CAAC,SAAS,CAAC,CAAC;QAC/C,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,IAAA,6BAAgB,EAAC,SAAS,CAAC,CAAC,CAAC;QAChD,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,EAAmB,CAAC,CAAC;IAExB,MAAM,WAAW,GAAG,MAAM,CAAC,WAAW,CACpC,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,sBAAsB,CAAC,CAAC,mBAAmB,CAAC;SAC9D,MAAM,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC;SAC/B,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAwB,EAAE,CAAC,CAAC;QAC/C,IAAI;QACJ;YACE,KAAK,EAAE,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,IAAA,kCAAqB,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SACnG;KACF,CAAC,CAAC,CACN,CAAC;IAEF,OAAO;QACL,IAAI,EAAE,OAAO,EAAE,IAAI,IAAI,eAAe;QACtC,WAAW;QACX,MAAM;KACY,CAAC;AACvB,CAAC,CAAC;AAhCW,QAAA,gBAAgB,oBAgC3B"}
|
@@ -0,0 +1,19 @@
|
|
1
|
+
import { PackageJson } from 'type-fest';
|
2
|
+
/** Package.json generation option */
|
3
|
+
export interface GeneratePackageOptions {
|
4
|
+
/** Name of the manifest.json file to target */
|
5
|
+
manifestFile: string;
|
6
|
+
/** Name of the NPM package */
|
7
|
+
name: string;
|
8
|
+
/**
|
9
|
+
* Version number to apply to the package
|
10
|
+
* @default '0.0.0-placeholder'
|
11
|
+
*/
|
12
|
+
version?: string;
|
13
|
+
}
|
14
|
+
/**
|
15
|
+
* Generate the NPM package.json content file
|
16
|
+
* @param options
|
17
|
+
*/
|
18
|
+
export declare const generatePackage: (options: GeneratePackageOptions) => Promise<PackageJson>;
|
19
|
+
//# sourceMappingURL=generate-package.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-package.d.ts","sourceRoot":"","sources":["../../../src/core/generators/generate-package.ts"],"names":[],"mappings":"AAMA,OAAO,EACL,WAAW,EACZ,MAAM,WAAW,CAAC;AAEnB,qCAAqC;AACrC,MAAM,WAAW,sBAAsB;IACrC,+CAA+C;IAC/C,YAAY,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;GAGG;AACH,eAAO,MAAM,eAAe,GAAU,SAAS,sBAAsB,KAAG,OAAO,CAAC,WAAW,CA8B1F,CAAC"}
|
@@ -0,0 +1,42 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.generatePackage = void 0;
|
4
|
+
const promises_1 = require("node:fs/promises");
|
5
|
+
const node_path_1 = require("node:path");
|
6
|
+
/**
|
7
|
+
* Generate the NPM package.json content file
|
8
|
+
* @param options
|
9
|
+
*/
|
10
|
+
const generatePackage = async (options) => {
|
11
|
+
const ownPackage = JSON.parse(await (0, promises_1.readFile)((0, node_path_1.resolve)(__dirname, '..', '..', 'package.json'), { encoding: 'utf8' }));
|
12
|
+
return {
|
13
|
+
name: options.name?.replaceAll(' ', '-').toLowerCase(),
|
14
|
+
version: options.version || '0.0.0-placeholder',
|
15
|
+
preferUnplugged: true,
|
16
|
+
peerDependencies: {
|
17
|
+
'@ama-styling/style-dictionary': ownPackage.generatorDependencies?.['@ama-styling/style-dictionary'],
|
18
|
+
'style-dictionary': ownPackage.generatorDependencies?.['style-dictionary']
|
19
|
+
},
|
20
|
+
peerDependenciesMeta: {
|
21
|
+
'@ama-styling/style-dictionary': {
|
22
|
+
optional: true
|
23
|
+
},
|
24
|
+
'style-dictionary': {
|
25
|
+
optional: true
|
26
|
+
}
|
27
|
+
},
|
28
|
+
exports: {
|
29
|
+
'.': {
|
30
|
+
default: `./${options.manifestFile}`
|
31
|
+
},
|
32
|
+
'./package.json': {
|
33
|
+
default: './package.json'
|
34
|
+
},
|
35
|
+
'./*.json': {
|
36
|
+
default: './*.json'
|
37
|
+
}
|
38
|
+
}
|
39
|
+
};
|
40
|
+
};
|
41
|
+
exports.generatePackage = generatePackage;
|
42
|
+
//# sourceMappingURL=generate-package.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-package.js","sourceRoot":"","sources":["../../../src/core/generators/generate-package.ts"],"names":[],"mappings":";;;AAAA,+CAE0B;AAC1B,yCAEmB;AAkBnB;;;GAGG;AACI,MAAM,eAAe,GAAG,KAAK,EAAE,OAA+B,EAAwB,EAAE;IAC7F,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,IAAA,mBAAQ,EAAC,IAAA,mBAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,CAAC,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,CAAqE,CAAC;IACxL,OAAO;QACL,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,WAAW,EAAE;QACtD,OAAO,EAAE,OAAO,CAAC,OAAO,IAAI,mBAAmB;QAC/C,eAAe,EAAE,IAAI;QACrB,gBAAgB,EAAE;YAChB,+BAA+B,EAAE,UAAU,CAAC,qBAAqB,EAAE,CAAC,+BAA+B,CAAE;YACrG,kBAAkB,EAAE,UAAU,CAAC,qBAAqB,EAAE,CAAC,kBAAkB,CAAE;SAC5E;QACD,oBAAoB,EAAE;YACpB,+BAA+B,EAAE;gBAC/B,QAAQ,EAAE,IAAI;aACf;YACD,kBAAkB,EAAE;gBAClB,QAAQ,EAAE,IAAI;aACf;SACF;QACD,OAAO,EAAE;YACP,GAAG,EAAE;gBACH,OAAO,EAAE,KAAK,OAAO,CAAC,YAAY,EAAE;aACrC;YACD,gBAAgB,EAAE;gBAChB,OAAO,EAAE,gBAAgB;aAC1B;YACD,UAAU,EAAE;gBACV,OAAO,EAAE,UAAU;aACpB;SACF;KACF,CAAC;AACJ,CAAC,CAAC;AA9BW,QAAA,eAAe,mBA8B1B"}
|
@@ -0,0 +1,26 @@
|
|
1
|
+
import type { ApiClient } from '@ama-sdk/core';
|
2
|
+
import type { GetFile200Response, GetLocalVariables200ResponseMeta } from '@ama-styling/figma-sdk';
|
3
|
+
import type { FigmaFileContext } from '../interfaces';
|
4
|
+
interface GroupedVariable {
|
5
|
+
collection: string;
|
6
|
+
mode: {
|
7
|
+
modeId: string;
|
8
|
+
name: string;
|
9
|
+
};
|
10
|
+
tokens: any;
|
11
|
+
}
|
12
|
+
/** Options to {@link getTokensFromLocalVariables} */
|
13
|
+
export interface TokenVariablesOptions extends FigmaFileContext {
|
14
|
+
/** Default unit to apply to number when not excluded */
|
15
|
+
defaultUnit?: string;
|
16
|
+
}
|
17
|
+
/**
|
18
|
+
* Get the list of tokens regrouped by Mode and Collection
|
19
|
+
* @param apiClient Api Client
|
20
|
+
* @param figmaFile Figma file description
|
21
|
+
* @param variableList List of variables
|
22
|
+
* @param options Options
|
23
|
+
*/
|
24
|
+
export declare const getTokensVariables: (apiClient: ApiClient, figmaFile: Promise<GetFile200Response>, variableList: Promise<GetLocalVariables200ResponseMeta>, options: TokenVariablesOptions) => Promise<GroupedVariable[]>;
|
25
|
+
export {};
|
26
|
+
//# sourceMappingURL=generate-tokens.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-tokens.d.ts","sourceRoot":"","sources":["../../../src/core/generators/generate-tokens.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,SAAS,EACV,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,EACV,kBAAkB,EAClB,gCAAgC,EACjC,MAAM,wBAAwB,CAAC;AAChC,OAAO,KAAK,EACV,gBAAgB,EACjB,MAAM,eAAe,CAAC;AAQvB,UAAU,eAAe;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACvC,MAAM,EAAE,GAAG,CAAC;CACb;AAED,qDAAqD;AACrD,MAAM,WAAW,qBAAsB,SAAQ,gBAAgB;IAC7D,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,kBAAkB,GAC7B,WAAW,SAAS,EACpB,WAAW,OAAO,CAAC,kBAAkB,CAAC,EACtC,cAAc,OAAO,CAAC,gCAAgC,CAAC,EACvD,SAAS,qBAAqB,+BAkB/B,CAAC"}
|
@@ -0,0 +1,31 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.getTokensVariables = void 0;
|
4
|
+
const get_text_weight_request_1 = require("../requests/get-text-weight.request");
|
5
|
+
const token_from_local_variables_1 = require("./tokens/token-from-local-variables");
|
6
|
+
/**
|
7
|
+
* Get the list of tokens regrouped by Mode and Collection
|
8
|
+
* @param apiClient Api Client
|
9
|
+
* @param figmaFile Figma file description
|
10
|
+
* @param variableList List of variables
|
11
|
+
* @param options Options
|
12
|
+
*/
|
13
|
+
const getTokensVariables = async (apiClient, figmaFile, variableList, options) => {
|
14
|
+
const textWeightVariableIds = await (0, get_text_weight_request_1.getTextWeightVariableIds)(apiClient, figmaFile, options);
|
15
|
+
const variables = await variableList;
|
16
|
+
return Object.values(variables.variableCollections).reduce((acc, collection) => {
|
17
|
+
collection.modes.forEach((mode) => {
|
18
|
+
const tokenFile = {
|
19
|
+
collection: collection.name,
|
20
|
+
mode,
|
21
|
+
tokens: (0, token_from_local_variables_1.getTokensFromLocalVariables)(variables, textWeightVariableIds, { ...options, modeId: mode.modeId, collectionId: collection.id })
|
22
|
+
};
|
23
|
+
if (Object.keys(tokenFile.tokens).length > 0) {
|
24
|
+
acc.push(tokenFile);
|
25
|
+
}
|
26
|
+
});
|
27
|
+
return acc;
|
28
|
+
}, []);
|
29
|
+
};
|
30
|
+
exports.getTokensVariables = getTokensVariables;
|
31
|
+
//# sourceMappingURL=generate-tokens.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-tokens.js","sourceRoot":"","sources":["../../../src/core/generators/generate-tokens.ts"],"names":[],"mappings":";;;AAUA,iFAE6C;AAC7C,oFAE6C;AAc7C;;;;;;GAMG;AACI,MAAM,kBAAkB,GAAG,KAAK,EACrC,SAAoB,EACpB,SAAsC,EACtC,YAAuD,EACvD,OAA8B,EAC9B,EAAE;IACF,MAAM,qBAAqB,GAAG,MAAM,IAAA,kDAAwB,EAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;IAC5F,MAAM,SAAS,GAAG,MAAM,YAAY,CAAC;IAErC,OAAO,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,UAAU,EAAE,EAAE;QAC7E,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;YAChC,MAAM,SAAS,GAAG;gBAChB,UAAU,EAAE,UAAU,CAAC,IAAI;gBAC3B,IAAI;gBACJ,MAAM,EAAE,IAAA,wDAA2B,EAAC,SAAS,EAAE,qBAAqB,EAAE,EAAE,GAAG,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,YAAY,EAAE,UAAU,CAAC,EAAE,EAAE,CAAC;aACxI,CAAC;YACF,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBAC7C,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;YACtB,CAAC;QACH,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,EAAuB,CAAC,CAAC;AAC9B,CAAC,CAAC;AAtBW,QAAA,kBAAkB,sBAsB7B"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/generators/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC"}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
const tslib_1 = require("tslib");
|
4
|
+
tslib_1.__exportStar(require("./generate-package"), exports);
|
5
|
+
tslib_1.__exportStar(require("./generate-manifest"), exports);
|
6
|
+
tslib_1.__exportStar(require("./generate-tokens"), exports);
|
7
|
+
tslib_1.__exportStar(require("./styles/index"), exports);
|
8
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/generators/index.ts"],"names":[],"mappings":";;;AAAA,6DAAmC;AACnC,8DAAoC;AACpC,4DAAkC;AAClC,yDAA+B"}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import type { ApiClient } from '@ama-sdk/core';
|
2
|
+
import { type GetFile200Response, type GetLocalVariables200ResponseMeta } from '@ama-styling/figma-sdk';
|
3
|
+
import type { FigmaFileContext } from '../../interfaces';
|
4
|
+
interface GradientScope {
|
5
|
+
color: string;
|
6
|
+
position: number | string;
|
7
|
+
}
|
8
|
+
export interface Gradient {
|
9
|
+
type: string;
|
10
|
+
angle: number;
|
11
|
+
stops: GradientScope[];
|
12
|
+
}
|
13
|
+
/** Options to {@link generateColorStyles} */
|
14
|
+
export interface ColorStylesOptions extends FigmaFileContext {
|
15
|
+
}
|
16
|
+
/**
|
17
|
+
* Generate colors style tokens
|
18
|
+
* @param apiClient Api Client
|
19
|
+
* @param figmaFile Figma File information
|
20
|
+
* @param localVariablesResponse list of file variables
|
21
|
+
* @param options Options
|
22
|
+
*/
|
23
|
+
export declare const generateColorStyles: (apiClient: ApiClient, figmaFile: Promise<GetFile200Response>, localVariablesResponse: Promise<GetLocalVariables200ResponseMeta>, options: ColorStylesOptions) => Promise<import("../../interfaces").DesignTokenTree<Gradient>>;
|
24
|
+
export {};
|
25
|
+
//# sourceMappingURL=generate-color.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-color.d.ts","sourceRoot":"","sources":["../../../../src/core/generators/styles/generate-color.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,SAAS,EACV,MAAM,eAAe,CAAC;AACvB,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,gCAAgC,EAGtC,MAAM,wBAAwB,CAAC;AAahC,OAAO,KAAK,EACV,gBAAgB,EACjB,MAAM,kBAAkB,CAAC;AAE1B,UAAU,aAAa;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAC;CAC3B;AAED,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,EAAE,CAAC;CACxB;AASD,6CAA6C;AAC7C,MAAM,WAAW,kBAAmB,SAAQ,gBAAgB;CAC3D;AAED;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,GAC9B,WAAW,SAAS,EACpB,WAAW,OAAO,CAAC,kBAAkB,CAAC,EACtC,wBAAwB,OAAO,CAAC,gCAAgC,CAAC,EACjE,SAAS,kBAAkB,kEA8B5B,CAAC"}
|
@@ -0,0 +1,53 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.generateColorStyles = void 0;
|
4
|
+
const figma_sdk_1 = require("@ama-styling/figma-sdk");
|
5
|
+
const color_hex_helpers_1 = require("../../helpers/color-hex.helpers");
|
6
|
+
const generate_token_tree_helpers_1 = require("../../helpers/generate-token-tree.helpers");
|
7
|
+
const variable_formatter_1 = require("../../helpers/variable-formatter");
|
8
|
+
const vector_1 = require("../../helpers/vector");
|
9
|
+
const GRADIENT_TYPES = {
|
10
|
+
GRADIENT_LINEAR: 'linear',
|
11
|
+
GRADIENT_RADIAL: 'radical',
|
12
|
+
GRADIENT_ANGULAR: 'angular',
|
13
|
+
GRADIENT_DIAMOND: 'diamond'
|
14
|
+
};
|
15
|
+
/**
|
16
|
+
* Generate colors style tokens
|
17
|
+
* @param apiClient Api Client
|
18
|
+
* @param figmaFile Figma File information
|
19
|
+
* @param localVariablesResponse list of file variables
|
20
|
+
* @param options Options
|
21
|
+
*/
|
22
|
+
const generateColorStyles = async (apiClient, figmaFile, localVariablesResponse, options) => {
|
23
|
+
const formatVariables = (0, variable_formatter_1.getVariablesFormatter)(await localVariablesResponse);
|
24
|
+
const filesApi = new figma_sdk_1.FilesApi(apiClient);
|
25
|
+
const styles = (await figmaFile).styles;
|
26
|
+
const ids = Object.entries(styles)
|
27
|
+
.filter(([, { styleType, remote }]) => styleType === 'FILL' && !remote)
|
28
|
+
.map(([id]) => id)
|
29
|
+
.join(',');
|
30
|
+
const nodes = (await filesApi.getFileNodes({ file_key: options.fileKey, ids })).nodes;
|
31
|
+
const ret = Object.values(nodes)
|
32
|
+
.filter(({ document }) => !!document.fills[0].gradientStops)
|
33
|
+
.reduce((acc, { document }) => {
|
34
|
+
const doc = document;
|
35
|
+
const gradient = doc.fills[0];
|
36
|
+
const gradientType = GRADIENT_TYPES[gradient.type];
|
37
|
+
const stops = gradient.gradientStops
|
38
|
+
.map((stop) => ({
|
39
|
+
position: stop.position,
|
40
|
+
color: formatVariables(stop.boundVariables?.color) ?? (0, color_hex_helpers_1.getRgbaColorHex)(stop.color)
|
41
|
+
}));
|
42
|
+
const value = {
|
43
|
+
type: gradientType,
|
44
|
+
angle: (0, vector_1.getAngleWithScreenYAxis)(gradient.gradientHandlePositions),
|
45
|
+
stops
|
46
|
+
};
|
47
|
+
acc[doc.name] = { value, description: styles[document.id].description };
|
48
|
+
return acc;
|
49
|
+
}, {});
|
50
|
+
return (0, generate_token_tree_helpers_1.generateTokenTree)(ret, 'gradient');
|
51
|
+
};
|
52
|
+
exports.generateColorStyles = generateColorStyles;
|
53
|
+
//# sourceMappingURL=generate-color.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-color.js","sourceRoot":"","sources":["../../../../src/core/generators/styles/generate-color.ts"],"names":[],"mappings":";;;AAGA,sDAMgC;AAChC,uEAEyC;AACzC,2FAEmD;AACnD,yEAE0C;AAC1C,iDAE8B;AAgB9B,MAAM,cAAc,GAAG;IACrB,eAAe,EAAE,QAAQ;IACzB,eAAe,EAAE,SAAS;IAC1B,gBAAgB,EAAE,SAAS;IAC3B,gBAAgB,EAAE,SAAS;CACnB,CAAC;AAMX;;;;;;GAMG;AACI,MAAM,mBAAmB,GAAG,KAAK,EACtC,SAAoB,EACpB,SAAsC,EACtC,sBAAiE,EACjE,OAA2B,EAC3B,EAAE;IACF,MAAM,eAAe,GAAG,IAAA,0CAAqB,EAAC,MAAM,sBAAsB,CAAC,CAAC;IAC5E,MAAM,QAAQ,GAAG,IAAI,oBAAQ,CAAC,SAAS,CAAC,CAAC;IACzC,MAAM,MAAM,GAAG,CAAC,MAAM,SAAS,CAAC,CAAC,MAAM,CAAC;IACxC,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC;SAC/B,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,SAAS,KAAK,MAAM,IAAI,CAAC,MAAM,CAAC;SACtE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC;SACjB,IAAI,CAAC,GAAG,CAAC,CAAC;IACb,MAAM,KAAK,GAAG,CAAC,MAAM,QAAQ,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;IACtF,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC;SAC7B,MAAM,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,CAAG,QAA0B,CAAC,KAAK,CAAC,CAAC,CAAmB,CAAC,aAAa,CAAC;SACjG,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC5B,MAAM,GAAG,GAAG,QAAyB,CAAC;QACtC,MAAM,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAkB,CAAC;QAC/C,MAAM,YAAY,GAAG,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;QACnD,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa;aACjC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YACd,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC,cAAc,EAAE,KAAK,CAAC,IAAI,IAAA,mCAAe,EAAC,IAAI,CAAC,KAAK,CAAC;SAClF,CAAC,CAAC,CAAC;QACN,MAAM,KAAK,GAAG;YACZ,IAAI,EAAE,YAAY;YAClB,KAAK,EAAE,IAAA,gCAAuB,EAAC,QAAQ,CAAC,uBAAuB,CAAC;YAChE,KAAK;SACa,CAAC;QACrB,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;QACxE,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,EAA+D,CAAC,CAAC;IACtE,OAAO,IAAA,+CAAiB,EAAC,GAAG,EAAE,UAAU,CAAC,CAAC;AAC5C,CAAC,CAAC;AAlCW,QAAA,mBAAmB,uBAkC9B"}
|
@@ -0,0 +1,26 @@
|
|
1
|
+
import type { ApiClient } from '@ama-sdk/core';
|
2
|
+
import { type GetFile200Response, type GetLocalVariables200ResponseMeta } from '@ama-styling/figma-sdk';
|
3
|
+
import type { FigmaFileContext } from '../../interfaces';
|
4
|
+
interface Effect {
|
5
|
+
offsetX: string;
|
6
|
+
offsetY: string;
|
7
|
+
blur: string;
|
8
|
+
spread: string;
|
9
|
+
color: string;
|
10
|
+
inset?: boolean;
|
11
|
+
}
|
12
|
+
/** Options to {@link generateEffectStyles} */
|
13
|
+
export interface EffectStylesOptions extends FigmaFileContext {
|
14
|
+
/** Default unit to apply to number when not excluded */
|
15
|
+
defaultUnit?: string;
|
16
|
+
}
|
17
|
+
/**
|
18
|
+
* Generate effect style tokens
|
19
|
+
* @param apiClient Api Client
|
20
|
+
* @param figmaFile Figma File information
|
21
|
+
* @param localVariablesResponse list of file variables
|
22
|
+
* @param options Options
|
23
|
+
*/
|
24
|
+
export declare const generateEffectStyles: (apiClient: ApiClient, figmaFile: Promise<GetFile200Response>, localVariablesResponse: Promise<GetLocalVariables200ResponseMeta>, options: EffectStylesOptions) => Promise<import("../../interfaces").DesignTokenTree<Effect[]>>;
|
25
|
+
export {};
|
26
|
+
//# sourceMappingURL=generate-effect.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"generate-effect.d.ts","sourceRoot":"","sources":["../../../../src/core/generators/styles/generate-effect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,SAAS,EACV,MAAM,eAAe,CAAC;AACvB,OAAO,EAGL,KAAK,kBAAkB,EACvB,KAAK,gCAAgC,EACtC,MAAM,wBAAwB,CAAC;AAUhC,OAAO,KAAK,EACV,gBAAgB,EACjB,MAAM,kBAAkB,CAAC;AAE1B,UAAU,MAAM;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,8CAA8C;AAC9C,MAAM,WAAW,mBAAoB,SAAQ,gBAAgB;IAC3D,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAC/B,WAAW,SAAS,EACpB,WAAW,OAAO,CAAC,kBAAkB,CAAC,EACtC,wBAAwB,OAAO,CAAC,gCAAgC,CAAC,EACjE,SAAS,mBAAmB,kEAsC7B,CAAC"}
|