figmagic - npm Package Compare versions

Comparing version 4.5.0 to 4.5.1

package.json

 {
   "name": "figmagic",
-  "version": "4.5.0",
+  "version": "4.5.1",
   "description": "Figmagic is the missing piece between DevOps and design: Generate design tokens, export graphics, and extract design token-driven React components from your Figma documents.",
@@ -5,0 +5,0 @@ "homepage": "https://www.figmagic.com",

readme/elements.md

@@ -19,3 +19,3 @@ # Figmagic Element Sync
 
-You can generate simple **flat** elements or **nested** ones. Use flat elements for anything that is usually less complex (like `hr` and headings like `h1`), and go for nested elements when you want more advanced or “stateful” behavior like being invalid, disabled or if you need subclasses (maybe something like "Warning" and "Error" variants). Open and inspect some of the elements in the [Figmagic template]() to see both patterns! You can make nested elements as deep as you want, but Figmagic will currently only generate code based on the two first nested layers—this is so Figmagic can support the common pattern of Component > Variant > State. Nesting can use either a "subclass" (by having a group or frame), or a pseudo-selector (by using a group or frame prefixed with colon, like ":disabled"). Note that you may mix these as you wish, even something awful like Component > State > State if you need that! :)
+You can generate simple **flat** elements or **nested** ones. Use flat elements for anything that is usually less complex (like `hr` and headings like `h1`), and go for nested elements when you want more advanced or “stateful” behavior like being invalid, disabled or if you need subclasses (maybe something like "Warning" and "Error" states). Open and inspect some of the elements in the [Figmagic template]() to see both patterns! You can make nested elements as deep as you want, but Figmagic will currently only generate code based on the two first nested layers—this is so Figmagic can support the common pattern of Component > Option/Style > State. Nesting can use either a "subclass" (by having a group or frame), or a pseudo-selector (by using a group or frame prefixed with colon, like ":disabled"). Note that you may mix these as you wish, even something awful like Component > State > State if you need that! :)
 
@@ -48,3 +48,3 @@ Figmagic lets you style elements through **typography** and/or **layout** layers. These are communicated through a text layer (Figma's TEXT layer for typography) and a non-text layer (such as Figma's RECT layer) for layout.
 
-- `description={DESCRIPTION}`: defines the text description that will be output to text/markdown. Example: `description=This is an input element with three variants`.
+- `description={DESCRIPTION}`: defines the text description that will be output to text/markdown. Example: `description=This is an input element with three styles`.
 - `element={ELEMENT}`: defines the actual generated element type. Example: `element=input`.
@@ -107,3 +107,3 @@ - `type={TYPE}`: becomes an element property. Useful for complex elements like `input`. Example: `type=checkbox`.
 
-- CSS output can be wonky if you don’t use at least 2 different ”variants” or ”states” in your nested component — try using regular non-nested components/elements when you don’t actually have multiple variants.
+- CSS output can be wonky if you don’t use at least 2 different styles or ”states” in your nested component — try using regular non-nested components/elements when you don’t actually have multiple styles.
 - Layer order matters in nested elements! It will always pick the first layout or text element it finds.
@@ -110,0 +110,0 @@ - Currently only a single layout element per group/frame/nested layer will be picked up.

No alert changes

Improved metrics

Total package byte prevSize

178908

No dependency changes