@vectoriox/iox-ui 5.30.0 → 5.31.0

package/src/design-core/flavor-spec.generated.ts

@@ -186,6 +186,18 @@ export const SPEC_TIERS = {
       "group": "colour",
       "desc": "Error fill"
     },
+    {
+      "name": "warning",
+      "type": "color",
+      "group": "colour",
+      "desc": "Warning text (Card v2 badge tone) — AA on warning-bg"
+    },
+    {
+      "name": "warning-bg",
+      "type": "color",
+      "group": "colour",
+      "desc": "Warning fill"
+    },
     {
       "name": "scrim",
       "type": "color",
@@ -911,6 +923,76 @@ export const SPEC_TIERS = {
       "name": "divider-color",
       "type": "color",
       "default": "var(--iox-line)"
+    },
+    {
+      "name": "badge-radius",
+      "type": "radius",
+      "default": "var(--iox-radius-pill)"
+    },
+    {
+      "name": "badge-pad",
+      "type": "spacing",
+      "default": "3px 10px"
+    },
+    {
+      "name": "badge-size",
+      "type": "size",
+      "default": "var(--iox-size-label)"
+    },
+    {
+      "name": "badge-neutral-bg",
+      "type": "color",
+      "default": "var(--iox-surface-2)"
+    },
+    {
+      "name": "badge-neutral-ink",
+      "type": "color",
+      "default": "var(--iox-text)"
+    },
+    {
+      "name": "badge-success-bg",
+      "type": "color",
+      "default": "var(--iox-success-bg)"
+    },
+    {
+      "name": "badge-success-ink",
+      "type": "color",
+      "default": "var(--iox-success)"
+    },
+    {
+      "name": "badge-warning-bg",
+      "type": "color",
+      "default": "var(--iox-warning-bg)"
+    },
+    {
+      "name": "badge-warning-ink",
+      "type": "color",
+      "default": "var(--iox-warning)"
+    },
+    {
+      "name": "badge-accent-bg",
+      "type": "color",
+      "default": "var(--iox-accent)"
+    },
+    {
+      "name": "badge-accent-ink",
+      "type": "color",
+      "default": "var(--iox-accent-ink)"
+    },
+    {
+      "name": "chip-border",
+      "type": "color",
+      "default": "var(--iox-line-strong)"
+    },
+    {
+      "name": "media-scrim",
+      "type": "color",
+      "default": "rgba(0, 0, 0, 0.62)"
+    },
+    {
+      "name": "media-scrim-ink",
+      "type": "color",
+      "default": "#FFFFFF"
     }
   ]
 } as const;
@@ -1186,7 +1268,9 @@ export const SPEC_SCHEMES = {
       "danger": "{{~danger}}",
       "danger-bg": "{{~danger-bg}}",
       "success": "{{~success}}",
-      "success-bg": "{{~success-bg}}"
+      "success-bg": "{{~success-bg}}",
+      "warning": "{{~warning}}",
+      "warning-bg": "{{~warning-bg}}"
     }
   },
   "accent": {
@@ -1210,7 +1294,9 @@ export const SPEC_SCHEMES = {
       "danger": "{{accent-ink}}",
       "danger-bg": "{{accent-hover}}",
       "success": "{{accent-ink}}",
-      "success-bg": "{{accent-hover}}"
+      "success-bg": "{{accent-hover}}",
+      "warning": "{{accent-ink}}",
+      "warning-bg": "{{accent-hover}}"
     }
   }
 } as const;
@@ -1712,6 +1798,114 @@ export const SPEC_ELEMENT_STYLES = [
     ],
     "base": {}
   },
+  {
+    "id": "badge-neutral",
+    "label": "Badge · Neutral",
+    "group": "Content blocks",
+    "appliesTo": [
+      "Container"
+    ],
+    "base": {
+      "backgroundColor": "var(--iox-badge-neutral-bg)",
+      "color": "var(--iox-badge-neutral-ink)",
+      "borderRadius": "var(--iox-badge-radius)",
+      "padding": "var(--iox-badge-pad)",
+      "fontFamily": "var(--iox-font-label)",
+      "fontSize": "var(--iox-badge-size)",
+      "fontWeight": "var(--iox-weight-label)",
+      "letterSpacing": "var(--iox-tracking-label)",
+      "textTransform": "var(--iox-case-label)"
+    }
+  },
+  {
+    "id": "badge-success",
+    "label": "Badge · Success",
+    "group": "Content blocks",
+    "appliesTo": [
+      "Container"
+    ],
+    "base": {
+      "backgroundColor": "var(--iox-badge-success-bg)",
+      "color": "var(--iox-badge-success-ink)",
+      "borderRadius": "var(--iox-badge-radius)",
+      "padding": "var(--iox-badge-pad)",
+      "fontFamily": "var(--iox-font-label)",
+      "fontSize": "var(--iox-badge-size)",
+      "fontWeight": "var(--iox-weight-label)",
+      "letterSpacing": "var(--iox-tracking-label)",
+      "textTransform": "var(--iox-case-label)"
+    }
+  },
+  {
+    "id": "badge-warning",
+    "label": "Badge · Warning",
+    "group": "Content blocks",
+    "appliesTo": [
+      "Container"
+    ],
+    "base": {
+      "backgroundColor": "var(--iox-badge-warning-bg)",
+      "color": "var(--iox-badge-warning-ink)",
+      "borderRadius": "var(--iox-badge-radius)",
+      "padding": "var(--iox-badge-pad)",
+      "fontFamily": "var(--iox-font-label)",
+      "fontSize": "var(--iox-badge-size)",
+      "fontWeight": "var(--iox-weight-label)",
+      "letterSpacing": "var(--iox-tracking-label)",
+      "textTransform": "var(--iox-case-label)"
+    }
+  },
+  {
+    "id": "badge-accent",
+    "label": "Badge · Accent",
+    "group": "Content blocks",
+    "appliesTo": [
+      "Container"
+    ],
+    "base": {
+      "backgroundColor": "var(--iox-badge-accent-bg)",
+      "color": "var(--iox-badge-accent-ink)",
+      "borderRadius": "var(--iox-badge-radius)",
+      "padding": "var(--iox-badge-pad)",
+      "fontFamily": "var(--iox-font-label)",
+      "fontSize": "var(--iox-badge-size)",
+      "fontWeight": "var(--iox-weight-label)",
+      "letterSpacing": "var(--iox-tracking-label)",
+      "textTransform": "var(--iox-case-label)"
+    }
+  },
+  {
+    "id": "chip",
+    "label": "Chip",
+    "group": "Content blocks",
+    "appliesTo": [
+      "Container"
+    ],
+    "base": {
+      "backgroundColor": "transparent",
+      "color": "var(--iox-text)",
+      "borderStyle": "solid",
+      "borderWidth": "var(--iox-border-width)",
+      "borderColor": "var(--iox-chip-border)",
+      "borderRadius": "var(--iox-badge-radius)",
+      "padding": "var(--iox-badge-pad)",
+      "fontFamily": "var(--iox-font-label)",
+      "fontSize": "var(--iox-badge-size)",
+      "fontWeight": "var(--iox-weight-label)"
+    }
+  },
+  {
+    "id": "media-scrim",
+    "label": "Text over image",
+    "group": "Content blocks",
+    "appliesTo": [
+      "Container"
+    ],
+    "base": {
+      "backgroundColor": "linear-gradient(180deg, transparent 0%, var(--iox-media-scrim) 45%)",
+      "color": "var(--iox-media-scrim-ink)"
+    }
+  },
   {
     "id": "notice-success",
     "label": "Success message",
@@ -1776,16 +1970,6 @@ export const SPEC_BUTTON_VARIANT_TO_STYLE = {
 } as const;
 
 export const SPEC_PALETTE_PRESETS = [
-  {
-    "label": "Card",
-    "type": "Container",
-    "elementStyle": "card",
-    "styleProps": {
-      "display": "flex",
-      "flexDirection": "column",
-      "gap": "var(--iox-space-gap)"
-    }
-  },
   {
     "label": "Panel",
     "type": "Container",
@@ -2002,6 +2186,33 @@ export const SPEC_INK_SCOPES = [
       "link-hover-color": "currentColor",
       "text-muted": "currentColor"
     }
+  },
+  {
+    "styles": [
+      "badge-neutral",
+      "badge-success",
+      "badge-warning",
+      "badge-accent",
+      "chip"
+    ],
+    "set": {
+      "icon-color": "currentColor"
+    }
+  },
+  {
+    "styles": [
+      "media-scrim"
+    ],
+    "children": true,
+    "set": {
+      "heading-color": "currentColor",
+      "eyebrow-color": "currentColor",
+      "text-muted": "currentColor",
+      "link-color": "currentColor",
+      "link-hover-color": "currentColor",
+      "icon-color": "currentColor",
+      "button-ghost-ink": "currentColor"
+    }
   }
 ] as const;
 
@@ -2067,6 +2278,11 @@ export const SPEC_CONTRAST_AUDIT = {
       "bg": "danger-bg",
       "min": 4.5
     },
+    {
+      "fg": "warning",
+      "bg": "warning-bg",
+      "min": 4.5
+    },
     {
       "fg": "accent-ink",
       "bg": "accent-hover",
@@ -2213,6 +2429,14 @@ export const SPEC_CONTRAST_AUDIT = {
       "fg": "var(--iox-line-strong)",
       "min": 3
     }
+  ],
+  "scrims": [
+    {
+      "style": "media-scrim",
+      "token": "media-scrim",
+      "scheme": "inverse",
+      "image": "#FFFFFF"
+    }
   ]
 } as const;
 
@@ -2336,6 +2560,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#E7F4EC",
         "danger": "#B3261E",
         "danger-bg": "#FBE9E7",
+        "warning": "#7A4A00",
+        "warning-bg": "#FBF0D9",
         "scrim": "rgba(15, 17, 21, 0.45)"
       },
       "dark": {
@@ -2361,6 +2587,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#13291C",
         "danger": "#FF8A80",
         "danger-bg": "#3A1715",
+        "warning": "#F2C46D",
+        "warning-bg": "#2E2210",
         "scrim": "rgba(0, 0, 0, 0.6)"
       }
     },
@@ -2602,6 +2830,22 @@ export const SPEC_FLAVOR_PACKS = [
         "value": "#FBE9E7",
         "dark": "#3A1715"
       },
+      {
+        "name": "warning",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#7A4A00",
+        "dark": "#F2C46D"
+      },
+      {
+        "name": "warning-bg",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#FBF0D9",
+        "dark": "#2E2210"
+      },
       {
         "name": "scrim",
         "tier": "semantic",
@@ -3543,6 +3787,104 @@ export const SPEC_FLAVOR_PACKS = [
         "type": "color",
         "group": "components",
         "value": "var(--iox-line)"
+      },
+      {
+        "name": "badge-radius",
+        "tier": "component",
+        "type": "radius",
+        "group": "components",
+        "value": "var(--iox-radius-pill)"
+      },
+      {
+        "name": "badge-pad",
+        "tier": "component",
+        "type": "spacing",
+        "group": "components",
+        "value": "3px 10px"
+      },
+      {
+        "name": "badge-size",
+        "tier": "component",
+        "type": "size",
+        "group": "components",
+        "value": "var(--iox-size-label)"
+      },
+      {
+        "name": "badge-neutral-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-surface-2)"
+      },
+      {
+        "name": "badge-neutral-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-text)"
+      },
+      {
+        "name": "badge-success-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success-bg)"
+      },
+      {
+        "name": "badge-success-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success)"
+      },
+      {
+        "name": "badge-warning-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning-bg)"
+      },
+      {
+        "name": "badge-warning-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning)"
+      },
+      {
+        "name": "badge-accent-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent)"
+      },
+      {
+        "name": "badge-accent-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent-ink)"
+      },
+      {
+        "name": "chip-border",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-line-strong)"
+      },
+      {
+        "name": "media-scrim",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "rgba(0, 0, 0, 0.62)"
+      },
+      {
+        "name": "media-scrim-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "#FFFFFF"
       }
     ]
   },
@@ -3659,6 +4001,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#E9EEDF",
         "danger": "#9A3324",
         "danger-bg": "#F5E3DC",
+        "warning": "#7A4A00",
+        "warning-bg": "#FBF0D9",
         "scrim": "rgba(31, 27, 22, 0.5)"
       },
       "dark": {
@@ -3684,6 +4028,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#1E2619",
         "danger": "#E8A08F",
         "danger-bg": "#2E1A15",
+        "warning": "#F2C46D",
+        "warning-bg": "#2E2210",
         "scrim": "rgba(0, 0, 0, 0.6)"
       }
     },
@@ -3925,6 +4271,22 @@ export const SPEC_FLAVOR_PACKS = [
         "value": "#F5E3DC",
         "dark": "#2E1A15"
       },
+      {
+        "name": "warning",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#7A4A00",
+        "dark": "#F2C46D"
+      },
+      {
+        "name": "warning-bg",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#FBF0D9",
+        "dark": "#2E2210"
+      },
       {
         "name": "scrim",
         "tier": "semantic",
@@ -4886,20 +5248,118 @@ export const SPEC_FLAVOR_PACKS = [
         "type": "color",
         "group": "components",
         "value": "var(--iox-line)"
-      }
-    ]
-  },
-  {
-    "id": "midnight",
-    "name": "Midnight",
-    "personality": "Bold",
-    "inspiredBy": "Dark product sites — Linear, Vercel, Raycast",
-    "blurb": "Dark, sharp, glowing.",
-    "popularFor": [
-      "SaaS & AI tools",
-      "Fintech",
-      "Gaming",
-      "Events & nightlife"
+      },
+      {
+        "name": "badge-radius",
+        "tier": "component",
+        "type": "radius",
+        "group": "components",
+        "value": "var(--iox-radius-pill)"
+      },
+      {
+        "name": "badge-pad",
+        "tier": "component",
+        "type": "spacing",
+        "group": "components",
+        "value": "3px 10px"
+      },
+      {
+        "name": "badge-size",
+        "tier": "component",
+        "type": "size",
+        "group": "components",
+        "value": "var(--iox-size-label)"
+      },
+      {
+        "name": "badge-neutral-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-surface-2)"
+      },
+      {
+        "name": "badge-neutral-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-text)"
+      },
+      {
+        "name": "badge-success-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success-bg)"
+      },
+      {
+        "name": "badge-success-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success)"
+      },
+      {
+        "name": "badge-warning-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning-bg)"
+      },
+      {
+        "name": "badge-warning-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning)"
+      },
+      {
+        "name": "badge-accent-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent)"
+      },
+      {
+        "name": "badge-accent-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent-ink)"
+      },
+      {
+        "name": "chip-border",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-line-strong)"
+      },
+      {
+        "name": "media-scrim",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "rgba(0, 0, 0, 0.62)"
+      },
+      {
+        "name": "media-scrim-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "#FFFFFF"
+      }
+    ]
+  },
+  {
+    "id": "midnight",
+    "name": "Midnight",
+    "personality": "Bold",
+    "inspiredBy": "Dark product sites — Linear, Vercel, Raycast",
+    "blurb": "Dark, sharp, glowing.",
+    "popularFor": [
+      "SaaS & AI tools",
+      "Fintech",
+      "Gaming",
+      "Events & nightlife"
     ],
     "defaults": {
       "shape": "soft",
@@ -5004,6 +5464,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#E7F4EC",
         "danger": "#B3261E",
         "danger-bg": "#FBE9E7",
+        "warning": "#7A4A00",
+        "warning-bg": "#FBF0D9",
         "scrim": "rgba(8, 9, 10, 0.55)"
       },
       "dark": {
@@ -5029,6 +5491,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#0F2418",
         "danger": "#FF7B72",
         "danger-bg": "#2D1213",
+        "warning": "#F2C46D",
+        "warning-bg": "#2E2210",
         "scrim": "rgba(0, 0, 0, 0.7)"
       }
     },
@@ -5270,6 +5734,22 @@ export const SPEC_FLAVOR_PACKS = [
         "value": "#FBE9E7",
         "dark": "#2D1213"
       },
+      {
+        "name": "warning",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#7A4A00",
+        "dark": "#F2C46D"
+      },
+      {
+        "name": "warning-bg",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#FBF0D9",
+        "dark": "#2E2210"
+      },
       {
         "name": "scrim",
         "tier": "semantic",
@@ -6220,6 +6700,104 @@ export const SPEC_FLAVOR_PACKS = [
         "type": "color",
         "group": "components",
         "value": "var(--iox-line)"
+      },
+      {
+        "name": "badge-radius",
+        "tier": "component",
+        "type": "radius",
+        "group": "components",
+        "value": "var(--iox-radius-pill)"
+      },
+      {
+        "name": "badge-pad",
+        "tier": "component",
+        "type": "spacing",
+        "group": "components",
+        "value": "3px 10px"
+      },
+      {
+        "name": "badge-size",
+        "tier": "component",
+        "type": "size",
+        "group": "components",
+        "value": "var(--iox-size-label)"
+      },
+      {
+        "name": "badge-neutral-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-surface-2)"
+      },
+      {
+        "name": "badge-neutral-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-text)"
+      },
+      {
+        "name": "badge-success-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success-bg)"
+      },
+      {
+        "name": "badge-success-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success)"
+      },
+      {
+        "name": "badge-warning-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning-bg)"
+      },
+      {
+        "name": "badge-warning-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning)"
+      },
+      {
+        "name": "badge-accent-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent)"
+      },
+      {
+        "name": "badge-accent-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent-ink)"
+      },
+      {
+        "name": "chip-border",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-line-strong)"
+      },
+      {
+        "name": "media-scrim",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "rgba(0, 0, 0, 0.62)"
+      },
+      {
+        "name": "media-scrim-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "#FFFFFF"
       }
     ]
   },
@@ -6335,6 +6913,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#E3F5EA",
         "danger": "#B3261E",
         "danger-bg": "#FCE8E6",
+        "warning": "#7A4A00",
+        "warning-bg": "#FBF0D9",
         "scrim": "rgba(15, 23, 42, 0.30)"
       },
       "dark": {
@@ -6364,6 +6944,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#12291C",
         "danger": "#FF8A80",
         "danger-bg": "#3A1715",
+        "warning": "#F2C46D",
+        "warning-bg": "#2E2210",
         "scrim": "rgba(0, 0, 0, 0.5)"
       }
     },
@@ -6616,6 +7198,22 @@ export const SPEC_FLAVOR_PACKS = [
         "value": "#FCE8E6",
         "dark": "#3A1715"
       },
+      {
+        "name": "warning",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#7A4A00",
+        "dark": "#F2C46D"
+      },
+      {
+        "name": "warning-bg",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#FBF0D9",
+        "dark": "#2E2210"
+      },
       {
         "name": "scrim",
         "tier": "semantic",
@@ -7585,6 +8183,104 @@ export const SPEC_FLAVOR_PACKS = [
         "type": "color",
         "group": "components",
         "value": "var(--iox-line)"
+      },
+      {
+        "name": "badge-radius",
+        "tier": "component",
+        "type": "radius",
+        "group": "components",
+        "value": "var(--iox-radius-pill)"
+      },
+      {
+        "name": "badge-pad",
+        "tier": "component",
+        "type": "spacing",
+        "group": "components",
+        "value": "3px 10px"
+      },
+      {
+        "name": "badge-size",
+        "tier": "component",
+        "type": "size",
+        "group": "components",
+        "value": "var(--iox-size-label)"
+      },
+      {
+        "name": "badge-neutral-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-surface-2)"
+      },
+      {
+        "name": "badge-neutral-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-text)"
+      },
+      {
+        "name": "badge-success-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success-bg)"
+      },
+      {
+        "name": "badge-success-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success)"
+      },
+      {
+        "name": "badge-warning-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning-bg)"
+      },
+      {
+        "name": "badge-warning-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning)"
+      },
+      {
+        "name": "badge-accent-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent)"
+      },
+      {
+        "name": "badge-accent-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent-ink)"
+      },
+      {
+        "name": "chip-border",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-line-strong)"
+      },
+      {
+        "name": "media-scrim",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "rgba(0, 0, 0, 0.62)"
+      },
+      {
+        "name": "media-scrim-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "#FFFFFF"
       }
     ]
   },
@@ -7700,6 +8396,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#DDF3E3",
         "danger": "#B3261E",
         "danger-bg": "#F9DEDC",
+        "warning": "#7A4A00",
+        "warning-bg": "#FBF0D9",
         "scrim": "rgba(29, 27, 32, 0.4)"
       },
       "dark": {
@@ -7725,6 +8423,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#123620",
         "danger": "#F2B8B5",
         "danger-bg": "#601410",
+        "warning": "#F2C46D",
+        "warning-bg": "#2E2210",
         "scrim": "rgba(0, 0, 0, 0.55)"
       }
     },
@@ -7965,6 +8665,22 @@ export const SPEC_FLAVOR_PACKS = [
         "value": "#F9DEDC",
         "dark": "#601410"
       },
+      {
+        "name": "warning",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#7A4A00",
+        "dark": "#F2C46D"
+      },
+      {
+        "name": "warning-bg",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#FBF0D9",
+        "dark": "#2E2210"
+      },
       {
         "name": "scrim",
         "tier": "semantic",
@@ -8918,6 +9634,104 @@ export const SPEC_FLAVOR_PACKS = [
         "type": "color",
         "group": "components",
         "value": "var(--iox-line)"
+      },
+      {
+        "name": "badge-radius",
+        "tier": "component",
+        "type": "radius",
+        "group": "components",
+        "value": "var(--iox-radius-pill)"
+      },
+      {
+        "name": "badge-pad",
+        "tier": "component",
+        "type": "spacing",
+        "group": "components",
+        "value": "3px 10px"
+      },
+      {
+        "name": "badge-size",
+        "tier": "component",
+        "type": "size",
+        "group": "components",
+        "value": "var(--iox-size-label)"
+      },
+      {
+        "name": "badge-neutral-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-surface-2)"
+      },
+      {
+        "name": "badge-neutral-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-text)"
+      },
+      {
+        "name": "badge-success-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success-bg)"
+      },
+      {
+        "name": "badge-success-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success)"
+      },
+      {
+        "name": "badge-warning-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning-bg)"
+      },
+      {
+        "name": "badge-warning-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning)"
+      },
+      {
+        "name": "badge-accent-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent)"
+      },
+      {
+        "name": "badge-accent-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent-ink)"
+      },
+      {
+        "name": "chip-border",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-line-strong)"
+      },
+      {
+        "name": "media-scrim",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "rgba(0, 0, 0, 0.62)"
+      },
+      {
+        "name": "media-scrim-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "#FFFFFF"
       }
     ]
   },
@@ -9037,6 +9851,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#C9F2D9",
         "danger": "#B3261E",
         "danger-bg": "#FFD9D2",
+        "warning": "#7A4A00",
+        "warning-bg": "#FBF0D9",
         "scrim": "rgba(10, 10, 10, 0.5)"
       },
       "dark": {
@@ -9061,6 +9877,8 @@ export const SPEC_FLAVOR_PACKS = [
         "success-bg": "#0F2A1A",
         "danger": "#FF8A80",
         "danger-bg": "#3A1715",
+        "warning": "#F2C46D",
+        "warning-bg": "#2E2210",
         "scrim": "rgba(0, 0, 0, 0.6)"
       }
     },
@@ -9290,6 +10108,22 @@ export const SPEC_FLAVOR_PACKS = [
         "value": "#FFD9D2",
         "dark": "#3A1715"
       },
+      {
+        "name": "warning",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#7A4A00",
+        "dark": "#F2C46D"
+      },
+      {
+        "name": "warning-bg",
+        "tier": "semantic",
+        "type": "color",
+        "group": "colour",
+        "value": "#FBF0D9",
+        "dark": "#2E2210"
+      },
       {
         "name": "scrim",
         "tier": "semantic",
@@ -10256,6 +11090,104 @@ export const SPEC_FLAVOR_PACKS = [
         "type": "color",
         "group": "components",
         "value": "var(--iox-line)"
+      },
+      {
+        "name": "badge-radius",
+        "tier": "component",
+        "type": "radius",
+        "group": "components",
+        "value": "var(--iox-radius-pill)"
+      },
+      {
+        "name": "badge-pad",
+        "tier": "component",
+        "type": "spacing",
+        "group": "components",
+        "value": "3px 10px"
+      },
+      {
+        "name": "badge-size",
+        "tier": "component",
+        "type": "size",
+        "group": "components",
+        "value": "var(--iox-size-label)"
+      },
+      {
+        "name": "badge-neutral-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-surface-2)"
+      },
+      {
+        "name": "badge-neutral-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-text)"
+      },
+      {
+        "name": "badge-success-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success-bg)"
+      },
+      {
+        "name": "badge-success-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-success)"
+      },
+      {
+        "name": "badge-warning-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning-bg)"
+      },
+      {
+        "name": "badge-warning-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-warning)"
+      },
+      {
+        "name": "badge-accent-bg",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent)"
+      },
+      {
+        "name": "badge-accent-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-accent-ink)"
+      },
+      {
+        "name": "chip-border",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "var(--iox-line-strong)"
+      },
+      {
+        "name": "media-scrim",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "rgba(0, 0, 0, 0.62)"
+      },
+      {
+        "name": "media-scrim-ink",
+        "tier": "component",
+        "type": "color",
+        "group": "components",
+        "value": "#FFFFFF"
       }
     ]
   }
@@ -10275,6 +11207,7 @@ export const SPEC_CONTRAST = {
     "light:inverse-accent/inverse-bg": 8.34,
     "light:success/success-bg": 5.77,
     "light:danger/danger-bg": 5.58,
+    "light:warning/warning-bg": 6.61,
     "light:accent-ink/accent-hover": 7.43,
     "light:text-muted/surface-2": 5.79,
     "light:text/surface-2": 17.6,
@@ -10298,6 +11231,7 @@ export const SPEC_CONTRAST = {
     "dark:inverse-accent/inverse-bg": 5.14,
     "dark:success/success-bg": 8,
     "dark:danger/danger-bg": 7,
+    "dark:warning/warning-bg": 9.53,
     "dark:accent-ink/accent-hover": 9.37,
     "dark:text-muted/surface-2": 6.28,
     "dark:text/surface-2": 14.84,
@@ -10323,6 +11257,7 @@ export const SPEC_CONTRAST = {
     "light:inverse-accent/inverse-bg": 7.61,
     "light:success/success-bg": 5.26,
     "light:danger/danger-bg": 5.88,
+    "light:warning/warning-bg": 6.61,
     "light:accent-ink/accent-hover": 8.41,
     "light:text-muted/surface-2": 5.33,
     "light:text/surface-2": 14.21,
@@ -10346,6 +11281,7 @@ export const SPEC_CONTRAST = {
     "dark:inverse-accent/inverse-bg": 5.15,
     "dark:success/success-bg": 8.41,
     "dark:danger/danger-bg": 7.73,
+    "dark:warning/warning-bg": 9.53,
     "dark:accent-ink/accent-hover": 10.41,
     "dark:text-muted/surface-2": 6.74,
     "dark:text/surface-2": 14.32,
@@ -10371,6 +11307,7 @@ export const SPEC_CONTRAST = {
     "light:inverse-accent/inverse-bg": 8.32,
     "light:success/success-bg": 5.77,
     "light:danger/danger-bg": 5.58,
+    "light:warning/warning-bg": 6.61,
     "light:accent-ink/accent-hover": 7.31,
     "light:text-muted/surface-2": 5.5,
     "light:text/surface-2": 17.79,
@@ -10394,6 +11331,7 @@ export const SPEC_CONTRAST = {
     "dark:inverse-accent/inverse-bg": 5.46,
     "dark:success/success-bg": 9.37,
     "dark:danger/danger-bg": 6.9,
+    "dark:warning/warning-bg": 9.53,
     "dark:accent-ink/accent-hover": 5.83,
     "dark:text-muted/surface-2": 5.79,
     "dark:text/surface-2": 16.53,
@@ -10416,6 +11354,7 @@ export const SPEC_CONTRAST = {
     "light:inverse-accent/inverse-bg": 6.88,
     "light:success/success-bg": 5.76,
     "light:danger/danger-bg": 5.55,
+    "light:warning/warning-bg": 6.61,
     "light:accent-ink/accent-hover": 6.76,
     "light:text-muted/surface-2": 6.51,
     "light:text/surface-2": 18.2,
@@ -10436,6 +11375,7 @@ export const SPEC_CONTRAST = {
     "dark:inverse-accent/inverse-bg": 4.79,
     "dark:success/success-bg": 8.02,
     "dark:danger/danger-bg": 7,
+    "dark:warning/warning-bg": 9.53,
     "dark:accent-ink/accent-hover": 8.44,
     "dark:text-muted/surface-2": 6.54,
     "dark:text/surface-2": 14.41,
@@ -10458,6 +11398,7 @@ export const SPEC_CONTRAST = {
     "light:inverse-accent/inverse-bg": 7.74,
     "light:success/success-bg": 5.59,
     "light:danger/danger-bg": 5.14,
+    "light:warning/warning-bg": 6.61,
     "light:accent-ink/accent-hover": 7.86,
     "light:text-muted/surface-2": 8.15,
     "light:text/surface-2": 14.84,
@@ -10481,6 +11422,7 @@ export const SPEC_CONTRAST = {
     "dark:inverse-accent/inverse-bg": 4.97,
     "dark:success/success-bg": 8.02,
     "dark:danger/danger-bg": 7.66,
+    "dark:warning/warning-bg": 9.53,
     "dark:accent-ink/accent-hover": 8.79,
     "dark:text-muted/surface-2": 8.43,
     "dark:text/surface-2": 11.1,
@@ -10506,6 +11448,7 @@ export const SPEC_CONTRAST = {
     "light:inverse-accent/inverse-bg": 13.71,
     "light:success/success-bg": 5.41,
     "light:danger/danger-bg": 5.01,
+    "light:warning/warning-bg": 6.61,
     "light:accent-ink/accent-hover": 7.72,
     "light:text-muted/surface-2": 7.52,
     "light:text/surface-2": 13.71,
@@ -10529,6 +11472,7 @@ export const SPEC_CONTRAST = {
     "dark:inverse-accent/inverse-bg": 5.59,
     "dark:success/success-bg": 7.98,
     "dark:danger/danger-bg": 7,
+    "dark:warning/warning-bg": 9.53,
     "dark:accent-ink/accent-hover": 9.2,
     "dark:text-muted/surface-2": 7.59,
     "dark:text/surface-2": 13.12,