figmagic - npm Package Compare versions

Comparing version 0.4.3 to 0.4.5

package.json

 {
   "name": "figmagic",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "author": "Mikael Vesavuori",
@@ -17,15 +17,12 @@ "main": "index.js",
   },
-  "config": {
-    "figmagicPath": "./node_modules/figmagic"
-  },
   "scripts": {
     "figmagic": "yarn figmagic:clean && yarn run figmagic:saveFromApi && yarn figmagic:build && yarn figmagic:getImages && yarn figmagic:downloadImages",
-    "figmagic:clean": "rm -rf specs/ && rm -rf tokens/ && rm -rf figma && mkdir tokens && cp $npm_package_config_figmagicPath/.gridTemplate.mjs tokens/ && mv tokens/.gridTemplate.mjs tokens/grid.mjs",
+    "figmagic:clean": "rm -rf specs/ && rm -rf tokens/ && rm -rf figma && mkdir tokens && cp .gridTemplate.mjs tokens/ && mv tokens/.gridTemplate.mjs tokens/grid.mjs",
     "figmagic:saveFromApi": "mkdir -p figma && wget 'https://api.figma.com/v1/files/{URL}' --header='X-Figma-Token: {TOKEN}' -O figma/figma.json",
     "figmagic:tokens": "yarn figmagic:clean && yarn figmagic:saveFromApi && yarn figmagic:build",
-    "figmagic:build": "node --experimental-modules $npm_package_config_figmagicPath/bin/index.mjs",
-    "figmagic:getImages": "node --experimental-modules $npm_package_config_figmagicPath/bin/getImages.mjs",
-    "figmagic:downloadImages": "node --experimental-modules $npm_package_config_figmagicPath/bin/downloadImages.mjs",
+    "figmagic:build": "node --experimental-modules bin/index.mjs",
+    "figmagic:getImages": "node --experimental-modules bin/getImages.mjs",
+    "figmagic:downloadImages": "node --experimental-modules bin/downloadImages.mjs",
     "precommit": "echo Running pre-commit linting... && pretty-quick --staged && npm --no-git-tag-version version patch && git add package.json"
   }
 }

readme.md

@@ -91,2 +91,18 @@ # Figmagic
 
+## Figma styles
+
+Figma styles became publicly available in June 2018 and are incredibly valuable for designers to create single-sources-of-truth when it comes to design values (tokens). When using Figmagic though, the thinking and usage is a bit different from how Figma styles work.
+
+### Unidimensional or multidimensional values
+
+A Figma style is multidimensional: It contains any number of properties wrapped into one style, acting as kind of a package. This is extremely handy in a design environment and is very practical from a user standpoint. The user doesn't have to think too hard about storing "redundant" values that are the same in another component, such as N number of units for line height: They are all taken care of.
+
+Figmagic instead expresses tokens as instances of every individual value, thus being unidimensional – storing only one value per item. Examples could be sets of line heights, font weights, or font sizes, each one individually specified. This means that values can be used and mixed as pleased in any number of contexts, not becoming bound to one specific context such as a certain kind of heading. This is good for a developer because we would rather just map out the definitive values for something, onto a component (a "context" so to speak).
+
+Because of this difference, the appropriate way to structure a Figmagic-compatible Figma design document is to display one or more items/tokens in the respective frames that correspond to the accepted token types (line height, font size...) where each item has only one key property that's changed in-between them (such as one text using size 48, the next using size 40...), since those items are what Figmagic loops through when creating your code tokens.
+
+### OK, but should I use Figma styles (also) when using Figmagic?
+
+Whatever suits you! As long as you remember that what Figmagic fetches are those single (unidimensional) values from each design item/token it should all work. Figma styles may help you to work though, and is probably just a good thing. Again, Figmagic does not use those values.
+
 ## Token formatting/conversion
@@ -93,0 +109,0 @@

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

462453

increased by18.63%

Number of package files

50

increased by42.86%

Lines of code

2676

increased by325.44%

Number of lines in readme file

195

increased by8.94%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes