tokens-bruecke 2.14.4 → 2.16.3

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.
Files changed (7) hide show
  1. package/.github/workflows/release.yml +4 -1
  2. package/CHANGELOG.md +1 -0
  3. package/README.md +52 -16
  4. package/bin/cli.js +1 -1
  5. package/global.d.ts +12 -0
  6. package/package.json +2 -2
  7. package/readme-assets/fig14.webp +0 -0
package/.github/workflows/release.yml CHANGED
@@ -53,7 +53,10 @@ jobs:
53
53
  run: |
54
54
  git config user.name "github-actions[bot]"
55
55
  git config user.email "github-actions[bot]@users.noreply.github.com"
56
+ git fetch origin main
57
+ git checkout main
58
+ git pull origin main
56
59
  npx --yes conventional-changelog-cli -p conventionalcommits -i CHANGELOG.md -s -r 1
57
60
  git add CHANGELOG.md
58
61
  git diff --staged --quiet || git commit -m "docs: update CHANGELOG for ${{ github.ref_name }}"
59
- git push origin HEAD:main
62
+ git push origin main
package/CHANGELOG.md CHANGED
@@ -1,3 +1,4 @@
1
+ ## [2.16.1](https://github.com/tokens-bruecke/figma-plugin/compare/v16.0.1...v2.16.1) (2026-05-11)
1
2
  # Changelog
2
3
 
3
4
  ## [2.11.1](https://github.com/tokens-bruecke/figma-plugin/compare/v2.11.0...v2.11.1) (2026-03-28)
package/README.md CHANGED
@@ -43,6 +43,7 @@ The plugin converts Figma variables into design-tokens JSON that are compatible
43
43
  - [Custom server](#custom-server)
44
44
  - [Show output](#show-output)
45
45
  - [Plugin window height](#plugin-window-height)
46
+ - [Multiple profiles](#multiple-profiles)
46
47
  - [Config autosaving](#config-autosaving)
47
48
  - [Styles support](#styles-support)
48
49
  - [Typography](#typography)
@@ -111,7 +112,7 @@ The plugin supports both **exporting** and **importing** design tokens:
111
112
  Allows you to choose the color mode for the generated JSON. Default value is `HEX`. The plugin supports the following color modes:
112
113
 
113
114
  - `HEX` — HEX color format. Could be converted into `HEXA` if the color has an alpha channel.
114
- - `RGBA CSS` — RGBA color format in CSS syntax, e.g. `rgba(0, 0, 0, 0.5)`.
115
+ - `RGBA CSS` — RGBA color format in CSS syntax, e.g. `rgba(0, 0, 0, 0.5)`. When alpha is `1`, the output is `rgb(r, g, b)` (no alpha channel).
115
116
  - `RGBA Object` — RGBA color format in object syntax, e.g. `{ r: 0, g: 0, b: 0, a: 0.5 }`.
116
117
  - `HSLA CSS` — HSLA color format in CSS syntax, e.g. `hsla(0, 0%, 0%, 0.5)`.
117
118
  - `HSLA Object` — HSLA color format in object syntax, e.g. `{ h: 0, s: 0, l: 0, a: 0.5 }`.
@@ -226,16 +227,28 @@ If the format is `DTCG`:
226
227
 
227
228
  ### Include Figma metadata
228
229
 
229
- Is `off` by default. Allows you to include Figma metadata like `styleId`, `variableId`, etc. into the generated JSON. It will be added to the `$extensions` object.
230
+ Is `off` by default. Allows you to include Figma metadata like `variableId`, `codeSyntax`, etc. into the generated JSON. It is merged into the existing `$extensions` object alongside `mode`.
230
231
 
231
232
  ```json
232
- "figma": {
233
- "codeSyntax": {},
234
- "variableId": "VariableID:1:4",
235
- "collection": {
236
- "id": "VariableCollectionId:1:3",
237
- "name": "Primitives",
238
- "defaultModeId": "1:0"
233
+ "button": {
234
+ "background": {
235
+ "type": "color",
236
+ "value": "{colors.primary.10}",
237
+ "$extensions": {
238
+ "mode": {
239
+ "light": "{colors.primary.10}",
240
+ "dark": "{colors.primary.90}"
241
+ },
242
+ "figma": {
243
+ "codeSyntax": {},
244
+ "variableId": "VariableID:1:4",
245
+ "collection": {
246
+ "id": "VariableCollectionId:1:3",
247
+ "name": "Primitives",
248
+ "defaultModeId": "1:0"
249
+ }
250
+ }
251
+ }
239
252
  }
240
253
  }
241
254
  ```
@@ -441,6 +454,26 @@ The plugin window auto-fits the height of its content, but you can adjust it man
441
454
 
442
455
  ---
443
456
 
457
+ ## Multiple profiles
458
+
459
+ The plugin supports multiple named profiles. Each profile stores its own complete set of export settings and server configurations, so you can switch between different setups without reconfiguring every time.
460
+
461
+ **Profile management controls** appear in the header of the settings view:
462
+
463
+ - **Profile dropdown** — shows the currently active profile. Click to switch to another profile.
464
+ - **`+` button** — creates a new profile. Enter a name and click **Create**. The new profile starts with default settings.
465
+ - **`⋮` button** — opens the active profile's detail view where you can rename or delete it.
466
+
467
+ > [!NOTE]
468
+ > Each profile's settings are saved independently. Switching profiles immediately applies that profile's export options and server credentials.
469
+
470
+ > [!WARNING]
471
+ > The last remaining profile cannot be deleted.
472
+
473
+ ![fig.14](readme-assets/fig14.webp)
474
+
475
+ ---
476
+
444
477
  ## Config autosaving
445
478
 
446
479
  The plugin saves the config automatically. So, you don't need to set it up every time you run the plugin.
@@ -734,16 +767,19 @@ It follows the same pattern as used by [Cobalt](https://cobalt-ui.pages.dev/guid
734
767
 
735
768
  Unlike design tokens, Figma variables now [support only 4 types](https://www.figma.com/plugin-docs/api/VariableResolvedDataType) — `COLOR`, `BOOLEAN`, `FLOAT` and `STRING`. So, the plugin converts them into the corresponding types from the [Design Tokens specification](https://design-tokens.github.io/community-group/format/#types).
736
769
 
737
- | Figma type | Design Tokens type |
738
- | ---------- | ----------------------------------------------------------------------------------- |
739
- | COLOR | [color](https://design-tokens.github.io/community-group/format/#color) |
740
- | BOOLEAN | _boolean_ \* |
741
- | FLOAT | [dimension](https://design-tokens.github.io/community-group/format/#dimension) \*\* |
742
- | STRING | _string_ \* |
770
+ | Figma type | Scope condition | Design Tokens type |
771
+ | ---------- | ------------------------ | ----------------------------------------------------------------------------------- |
772
+ | COLOR | — | [color](https://design-tokens.github.io/community-group/format/#color) |
773
+ | BOOLEAN | — | _boolean_ \* |
774
+ | FLOAT | `FONT_WEIGHT` scope | _string_ \* |
775
+ | FLOAT | `OPACITY` scope (no %) | _number_ \* |
776
+ | FLOAT | `OPACITY` scope (with %) | _string_ (e.g. `"10%"`) \* |
777
+ | FLOAT | all other scopes | [dimension](https://design-tokens.github.io/community-group/format/#dimension) \*\* |
778
+ | STRING | — | _string_ \* |
743
779
 
744
780
  \* native JSON types. The specification doesn't restrict the type of the value, so it could be any JSON type. Also see [this issue](https://github.com/design-tokens/community-group/issues/120#issuecomment-1279527414).
745
781
 
746
- \*\* currently figma supports only the `FLOAT` type for dimensions, that could be used only for `px` values. So, the plugin converts `FLOAT` values into `dimension` type with `px` unit.
782
+ \*\* Figma currently supports only `FLOAT` for numeric values used as dimensions, which map to `px` units. The plugin appends `px` to produce a valid dimension token.
747
783
 
748
784
  ---
749
785