@seed-design/figma 1.0.6-alpha-20251021104301 → 1.0.7

package/lib/codegen/index.js

@@ -998,11 +998,11 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:1:155",
             "VariableID:1:156",
             "VariableID:1:164",
-            "VariableID:1:165",
             "VariableID:1:157",
-            "VariableID:1:171",
+            "VariableID:1:165",
             "VariableID:238:17662",
             "VariableID:17544:4057",
+            "VariableID:1:171",
             "VariableID:41186:6437",
             "VariableID:670:2700",
             "VariableID:1:158",
@@ -1079,14 +1079,14 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:14609:41561",
             "VariableID:14609:41562",
             "VariableID:14609:41563",
-            "VariableID:29453:35711",
             "VariableID:12548:1440",
+            "VariableID:29453:35711",
             "VariableID:29453:35712",
             "VariableID:12548:1441",
             "VariableID:12548:1442",
             "VariableID:12548:1443",
-            "VariableID:12548:1444",
             "VariableID:1:21",
+            "VariableID:12548:1444",
             "VariableID:12548:1445",
             "VariableID:1:30",
             "VariableID:1883:92912",
@@ -1344,9 +1344,9 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:289:13772",
             "VariableID:1886:93038",
             "VariableID:289:13773",
-            "VariableID:796:4448",
             "VariableID:15518:15916",
             "VariableID:19225:68732",
+            "VariableID:796:4448",
             "VariableID:17955:50606",
             "VariableID:514:13178",
             "VariableID:535:1747",
@@ -4658,9 +4658,9 @@ const FIGMA_VARIABLES = {
         "hiddenFromPublishing": false,
         "valuesByMode": {
             "1928:7": {
-                "r": 1,
-                "g": 0.9254902005195618,
-                "b": 0.9215686321258545,
+                "r": 0.9919999837875366,
+                "g": 0.9279999732971191,
+                "b": 0.9301332831382751,
                 "a": 1
             },
             "1928:8": {
@@ -4686,9 +4686,9 @@ const FIGMA_VARIABLES = {
         "hiddenFromPublishing": false,
         "valuesByMode": {
             "1928:7": {
-                "r": 0.9529411792755127,
-                "g": 0.03921568766236305,
-                "b": 0.007843137718737125,
+                "r": 0.9079999923706055,
+                "g": 0.171999990940094,
+                "b": 0.2701333165168762,
                 "a": 1
             },
             "1928:8": {
@@ -8312,11 +8312,11 @@ const actionButton = {
             "type": "VARIANT",
             "variantOptions": [
                 "Neutral Solid",
-                "Neutral Weak",
-                "Neutral Outline",
                 "Brand Solid",
+                "Critical Solid",
+                "Neutral Weak",
                 "Brand Outline",
-                "Critical Solid"
+                "Neutral Outline"
             ]
         },
         "State": {
@@ -8572,9 +8572,10 @@ const callout = {
             "variantOptions": [
                 "Neutral",
                 "Informative",
-                "Warning",
                 "Critical",
-                "Magic"
+                "Warning",
+                "Magic",
+                "Positive"
             ]
         },
         "Show Title": {
@@ -9370,8 +9371,8 @@ const radio = {
         "Tone": {
             "type": "VARIANT",
             "variantOptions": [
-                "🚫[Deprecated]Brand",
-                "Neutral"
+                "Neutral",
+                "🚫[Deprecated]Brand"
             ]
         },
         "Weight": {
@@ -9780,6 +9781,29 @@ const tabs = {
         }
     }
 };
+const tagGroup = {
+    "name": "tagGroup",
+    "key": "30d4c37f3bc5f292633cf0aba9a0b640d31ec301",
+    "componentPropertyDefinitions": {
+        "Size": {
+            "type": "VARIANT",
+            "variantOptions": [
+                "t2(12pt)",
+                "t3(13pt)",
+                "t4(14pt)"
+            ]
+        },
+        "Tag Count": {
+            "type": "VARIANT",
+            "variantOptions": [
+                "1",
+                "2",
+                "3",
+                "4"
+            ]
+        }
+    }
+};
 const textField = {
     "name": "textField",
     "key": "c49873c37a639f0dffdea4efd0eb43760d66c141",
@@ -10019,6 +10043,7 @@ var FIGMA_COMPONENTS = {
   superscriptChild: superscriptChild,
   switchMark: switchMark,
   tabs: tabs,
+  tagGroup: tagGroup,
   templateBannerDetach: templateBannerDetach,
   templateButtonGroup: templateButtonGroup,
   templateChipGroup: templateChipGroup,

package/lib/codegen/targets/react/index.cjs

@@ -1267,11 +1267,11 @@ const actionButton = {
             "type": "VARIANT",
             "variantOptions": [
                 "Neutral Solid",
-                "Neutral Weak",
-                "Neutral Outline",
                 "Brand Solid",
+                "Critical Solid",
+                "Neutral Weak",
                 "Brand Outline",
-                "Critical Solid"
+                "Neutral Outline"
             ]
         },
         "State": {
@@ -1527,9 +1527,10 @@ const callout = {
             "variantOptions": [
                 "Neutral",
                 "Informative",
-                "Warning",
                 "Critical",
-                "Magic"
+                "Warning",
+                "Magic",
+                "Positive"
             ]
         },
         "Show Title": {
@@ -2325,8 +2326,8 @@ const radio = {
         "Tone": {
             "type": "VARIANT",
             "variantOptions": [
-                "🚫[Deprecated]Brand",
-                "Neutral"
+                "Neutral",
+                "🚫[Deprecated]Brand"
             ]
         },
         "Weight": {
@@ -2735,6 +2736,29 @@ const tabs = {
         }
     }
 };
+const tagGroup = {
+    "name": "tagGroup",
+    "key": "30d4c37f3bc5f292633cf0aba9a0b640d31ec301",
+    "componentPropertyDefinitions": {
+        "Size": {
+            "type": "VARIANT",
+            "variantOptions": [
+                "t2(12pt)",
+                "t3(13pt)",
+                "t4(14pt)"
+            ]
+        },
+        "Tag Count": {
+            "type": "VARIANT",
+            "variantOptions": [
+                "1",
+                "2",
+                "3",
+                "4"
+            ]
+        }
+    }
+};
 const textField = {
     "name": "textField",
     "key": "c49873c37a639f0dffdea4efd0eb43760d66c141",
@@ -2974,6 +2998,7 @@ var FIGMA_COMPONENTS = {
   superscriptChild: superscriptChild,
   switchMark: switchMark,
   tabs: tabs,
+  tagGroup: tagGroup,
   templateBannerDetach: templateBannerDetach,
   templateButtonGroup: templateButtonGroup,
   templateChipGroup: templateChipGroup,
@@ -4456,6 +4481,66 @@ const createToggleButtonHandler = (ctx)=>defineComponentHandler(toggleButton.key
         ]);
     });
 
+const createTagGroupHandler = (ctx)=>{
+    const itemHandler = createTagGroupItemHandler(ctx);
+    return defineComponentHandler(tagGroup.key, (node, traverse)=>{
+        const itemNodes = findAllInstances({
+            node,
+            key: TAG_GROUP_ITEM_KEY
+        });
+        const items = itemNodes.map((itemNode)=>itemHandler.transform(itemNode, traverse));
+        if (items.length === 0) {
+            return createSeedReactElement("TagGroup.Root");
+        }
+        // if size/weight/tone are all the same among item[n].props, lift them up to TagGroup.Root
+        const consistent = {
+            size: items.map((item)=>item.props.size).every((size)=>size === items[0].props.size),
+            weight: items.map((item)=>item.props.weight).every((weight)=>weight === items[0].props.weight),
+            tone: items.map((item)=>item.props.tone).every((tone)=>tone === items[0].props.tone)
+        };
+        return createSeedReactElement("TagGroup.Root", {
+            // lift up consistent props
+            ...consistent.size && {
+                size: items[0].props.size
+            },
+            ...consistent.weight && {
+                weight: items[0].props.weight
+            },
+            ...consistent.tone && {
+                tone: items[0].props.tone
+            }
+        }, items.map((item)=>({
+                ...item,
+                props: {
+                    // remove lifted props
+                    ...item.props,
+                    size: consistent.size ? undefined : item.props.size,
+                    weight: consistent.weight ? undefined : item.props.weight,
+                    tone: consistent.tone ? undefined : item.props.tone
+                }
+            })));
+    });
+};
+const TAG_GROUP_ITEM_KEY = "a7bbc318919053f96be00e509469f6294d6bb6bb";
+const createTagGroupItemHandler = (ctx)=>defineComponentHandler(TAG_GROUP_ITEM_KEY, ({ componentProperties: props })=>{
+        const size = tsPattern.match(props.Size.value).with("t2(12pt)", ()=>"t2").with("t3(13pt)", ()=>"t3").with("t4(14pt)", ()=>"t4").exhaustive();
+        const commonProps = {
+            size,
+            weight: changeCase.camelCase(props["Weight"].value),
+            tone: changeCase.camelCase(props["Tone"].value)
+        };
+        const children = [
+            props.Layout.value === "Icon First" ? createSeedReactElement("PrefixIcon", {
+                svg: ctx.iconHandler.transform(props["Prefix Icon#47948:0"])
+            }) : undefined,
+            props["Label#5409:0"].value,
+            props.Layout.value === "Icon Last" ? createSeedReactElement("SuffixIcon", {
+                svg: ctx.iconHandler.transform(props["Suffix Icon#47948:55"])
+            }) : undefined
+        ].filter(Boolean);
+        return createSeedReactElement("TagGroup.Item", commonProps, children);
+    });
+
 function bindComponentHandler(unbound, deps) {
     return unbound(deps);
 }
@@ -4497,6 +4582,8 @@ const unboundSeedComponentHandlers = [
     createSwitchHandler,
     createSwitchMarkHandler,
     createTabsHandler,
+    createTagGroupHandler,
+    createTagGroupItemHandler,
     createTextFieldHandler,
     createToggleButtonHandler
 ];
@@ -8178,11 +8265,11 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:1:155",
             "VariableID:1:156",
             "VariableID:1:164",
-            "VariableID:1:165",
             "VariableID:1:157",
-            "VariableID:1:171",
+            "VariableID:1:165",
             "VariableID:238:17662",
             "VariableID:17544:4057",
+            "VariableID:1:171",
             "VariableID:41186:6437",
             "VariableID:670:2700",
             "VariableID:1:158",
@@ -8259,14 +8346,14 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:14609:41561",
             "VariableID:14609:41562",
             "VariableID:14609:41563",
-            "VariableID:29453:35711",
             "VariableID:12548:1440",
+            "VariableID:29453:35711",
             "VariableID:29453:35712",
             "VariableID:12548:1441",
             "VariableID:12548:1442",
             "VariableID:12548:1443",
-            "VariableID:12548:1444",
             "VariableID:1:21",
+            "VariableID:12548:1444",
             "VariableID:12548:1445",
             "VariableID:1:30",
             "VariableID:1883:92912",
@@ -8524,9 +8611,9 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:289:13772",
             "VariableID:1886:93038",
             "VariableID:289:13773",
-            "VariableID:796:4448",
             "VariableID:15518:15916",
             "VariableID:19225:68732",
+            "VariableID:796:4448",
             "VariableID:17955:50606",
             "VariableID:514:13178",
             "VariableID:535:1747",
@@ -11838,9 +11925,9 @@ const FIGMA_VARIABLES = {
         "hiddenFromPublishing": false,
         "valuesByMode": {
             "1928:7": {
-                "r": 1,
-                "g": 0.9254902005195618,
-                "b": 0.9215686321258545,
+                "r": 0.9919999837875366,
+                "g": 0.9279999732971191,
+                "b": 0.9301332831382751,
                 "a": 1
             },
             "1928:8": {
@@ -11866,9 +11953,9 @@ const FIGMA_VARIABLES = {
         "hiddenFromPublishing": false,
         "valuesByMode": {
             "1928:7": {
-                "r": 0.9529411792755127,
-                "g": 0.03921568766236305,
-                "b": 0.007843137718737125,
+                "r": 0.9079999923706055,
+                "g": 0.171999990940094,
+                "b": 0.2701333165168762,
                 "a": 1
             },
             "1928:8": {