From cc81724f88a2bb36140447ebc5ec9be59a15f10b Mon Sep 17 00:00:00 2001
From: PernilleChristiansen
 <114920138+PernilleChristiansen@users.noreply.github.com>
Date: Tue, 21 Nov 2023 12:04:27 +0100
Subject: [PATCH] add button design tokens

---
 tokens.json | 1035 ++++++++++++++++++++++++++++++++++++---------------
 1 file changed, 726 insertions(+), 309 deletions(-)

diff --git a/tokens.json b/tokens.json
index 4f0b98ef58..b590486366 100644
--- a/tokens.json
+++ b/tokens.json
@@ -1,459 +1,876 @@
 {
   "core": {
+    "size": {
+      "1": {
+        "value": "0.0625rem",
+        "type": "sizing",
+        "description": "1px"
+      },
+      "5": {
+        "value": "0.125rem",
+        "type": "sizing",
+        "description": "2px"
+      },
+      "10": {
+        "value": "0.25rem",
+        "type": "sizing",
+        "description": "4px"
+      },
+      "50": {
+        "value": "0.5rem",
+        "type": "sizing",
+        "description": "8px"
+      },
+      "75": {
+        "value": "0.75rem",
+        "type": "sizing",
+        "description": "12px"
+      },
+      "90": {
+        "value": "0.875",
+        "type": "sizing",
+        "description": "14px"
+      },
+      "100": {
+        "value": "1rem",
+        "type": "sizing",
+        "description": "16px"
+      },
+      "125": {
+        "value": "1.25rem",
+        "type": "sizing",
+        "description": "20px"
+      },
+      "150": {
+        "value": "1.5rem",
+        "type": "sizing",
+        "description": "24px"
+      },
+      "175": {
+        "value": "1.75rem",
+        "type": "sizing",
+        "description": "28px"
+      },
+      "200": {
+        "value": "2rem",
+        "type": "sizing"
+      },
+      "225": {
+        "value": "2.25rem",
+        "type": "sizing",
+        "description": "36px"
+      },
+      "250": {
+        "value": "2.5rem",
+        "type": "sizing",
+        "description": "40px"
+      },
+      "275": {
+        "value": "2.75rem",
+        "type": "sizing",
+        "description": "44px"
+      },
+      "300": {
+        "value": "3rem",
+        "type": "sizing",
+        "description": "48px"
+      },
+      "350": {
+        "value": "3.5rem",
+        "type": "sizing",
+        "description": "56px"
+      },
+      "600": {
+        "value": "15rem",
+        "type": "sizing",
+        "description": "240px"
+      }
+    },
     "color": {
-      "primary": {
+      "grey": {
         "100": {
-          "value": "#EBF5F5",
+          "value": "#212121",
           "type": "color"
         },
-        "300": {
-          "value": "#B2D0D2",
+        "200": {
+          "value": "#424242",
           "type": "color"
         },
-        "500": {
-          "value": "#00847C",
+        "400": {
+          "value": "#757575",
           "type": "color"
         },
         "700": {
-          "value": "#005D5C",
+          "value": "#E0E0E0",
           "type": "color"
         },
         "900": {
-          "value": "#02525E",
+          "value": "#F5F5F5",
           "type": "color"
         }
       },
-      "black": {
-        "value": "#000000",
-        "type": "color"
-      },
-      "white": {
-        "value": "#ffffff",
-        "type": "color"
-      },
-      "secondary": {
+      "red": {
         "500": {
-          "value": "#F8AD3C",
-          "type": "color"
-        },
-        "700": {
-          "value": "#EE9331",
+          "value": "#D12923",
           "type": "color"
         }
       },
-      "green": {
+      "primary": {
         "200": {
-          "value": "#DFEBDA",
+          "value": "#02525E",
+          "type": "color"
+        },
+        "400": {
+          "value": "#005D5C",
           "type": "color"
         },
         "500": {
-          "value": "#7FB069",
+          "value": "#00847C",
+          "type": "color"
+        },
+        "1000": {
+          "value": "#EBF5F5",
           "type": "color"
         }
       },
-      "blue": {
+      "white": {
+        "value": "#FFFFFF",
+        "type": "color"
+      },
+      "secondary": {
         "500": {
-          "value": "#0B3C5D",
+          "value": "#F8AD3C",
           "type": "color"
         }
       },
-      "neutral": {
-        "300": {
-          "value": "#E0E0E0",
+      "black": {
+        "value": "#000000",
+        "type": "color"
+      },
+      "transparent": {
+        "black": {
+          "100": {
+            "value": "rgba({color.black}, {opacity.100})",
+            "type": "color"
+          },
+          "200": {
+            "value": "rgba({color.black}, {opacity.200})",
+            "type": "color"
+          }
+        },
+        "primary": {
+          "50": {
+            "value": "rgba( {color.primary.500}, {opacity.50})",
+            "type": "color"
+          },
+          "100": {
+            "value": "rgba( {color.primary.500}, {opacity.100})",
+            "type": "color"
+          }
+        }
+      },
+      "state-layer": {
+        "on-primary": {
+          "value": "{color.white}",
           "type": "color"
         }
       }
     },
-    "spacing": {
-      "0": {
-        "value": "0px",
-        "type": "spacing"
-      },
-      "50": {
-        "value": "4px",
-        "type": "spacing"
-      },
-      "100": {
-        "value": "8px",
-        "type": "spacing"
+    "fontFamily": {
+      "body": {
+        "value": "Open Sans",
+        "type": "fontFamilies"
       },
-      "200": {
-        "value": "16px",
-        "type": "spacing"
+      "headings": {
+        "value": "Open Sans",
+        "type": "fontFamilies"
+      }
+    },
+    "fontWeight": {
+      "400": {
+        "value": "400",
+        "type": "fontWeights"
       },
-      "300": {
-        "value": "24px",
-        "type": "spacing"
+      "600": {
+        "value": "600",
+        "type": "fontWeights"
+      }
+    },
+    "borderWidth": {
+      "1": {
+        "value": "{size.1}",
+        "type": "borderWidth"
       },
-      "400": {
-        "value": "32px",
-        "type": "spacing"
+      "2": {
+        "value": "{size.5}",
+        "type": "borderWidth"
       },
-      "500": {
-        "value": "40px",
-        "type": "spacing"
+      "10": {
+        "value": "{size.10}",
+        "type": "borderWidth"
       }
     },
     "borderRadius": {
-      "0": {
-        "value": "0px",
+      "10": {
+        "value": "{size.10}",
         "type": "borderRadius"
       },
       "50": {
-        "value": "2px",
-        "type": "borderRadius"
-      },
-      "100": {
-        "value": "4px",
+        "value": "{size.50}",
         "type": "borderRadius"
       },
-      "200": {
-        "value": "8px",
+      "250": {
+        "value": "{size.250}",
         "type": "borderRadius"
       }
     },
-    "fontFamily": {
-      "sans-serif": {
-        "value": "Open Sans",
-        "type": "fontFamilies"
-      }
-    },
-    "fontWeight": {
-      "regular": {
-        "value": "400",
-        "type": "fontWeights"
+    "spacing": {
+      "10": {
+        "value": "{size.10}",
+        "type": "spacing"
       },
-      "semibold": {
-        "value": "600",
-        "type": "fontWeights"
+      "50": {
+        "value": "{size.50}",
+        "type": "spacing"
+      },
+      "75": {
+        "value": "{size.75}",
+        "type": "spacing"
+      },
+      "100": {
+        "value": "{size.100}",
+        "type": "spacing"
+      },
+      "150": {
+        "value": "{size.150}",
+        "type": "spacing"
       }
     },
     "fontSize": {
       "100": {
-        "value": "12px",
-        "type": "fontSizes"
-      },
-      "200": {
-        "value": "14px",
+        "value": "{size.90}",
         "type": "fontSizes"
       },
-      "300": {
-        "value": "16px",
-        "type": "fontSizes"
-      },
-      "400": {
-        "value": "20px",
+      "700": {
+        "value": "{size.125}",
         "type": "fontSizes"
       },
-      "500": {
-        "value": "24px",
-        "type": "fontSizes"
-      },
-      "600": {
-        "value": "28px",
+      "800": {
+        "value": "{size.150}",
         "type": "fontSizes"
       }
     },
-    "borderWidth": {
-      "none": {
-        "value": "0px",
-        "type": "borderWidth"
-      },
-      "xs": {
-        "value": "1px",
-        "type": "borderWidth"
-      },
-      "md": {
-        "value": "3px",
-        "type": "borderWidth"
+    "lineHeight": {
+      "125": {
+        "value": "{size.125}",
+        "type": "lineHeights"
+      },
+      "175": {
+        "value": "{size.175}",
+        "type": "lineHeights"
+      },
+      "225": {
+        "value": "{size.225}",
+        "type": "lineHeights"
+      }
+    },
+    "boxShadow": {
+      "dropShadow": {
+        "200": {
+          "value": {
+            "x": "0",
+            "y": "1",
+            "blur": "2",
+            "spread": "0",
+            "color": "{color.transparent.black.200}",
+            "type": "dropShadow"
+          },
+          "type": "boxShadow"
+        },
+        "300": {
+          "value": {
+            "x": "0",
+            "y": "2",
+            "blur": "6",
+            "spread": "2",
+            "color": "{color.transparent.black.100}",
+            "type": "dropShadow"
+          },
+          "type": "boxShadow"
+        }
       }
     },
     "opacity": {
+      "50": {
+        "value": "8%",
+        "type": "opacity"
+      },
       "100": {
-        "value": "87%",
+        "value": "15%",
         "type": "opacity"
       },
       "200": {
-        "value": "62%",
+        "value": "30%",
         "type": "opacity"
-      }
-    },
-    "textCase": {
-      "uppercase": {
-        "value": "uppercase",
-        "type": "textCase"
-      },
-      "none": {
-        "value": "As typed",
-        "type": "textCase"
-      }
-    },
-    "boxShadow": {
-      "300": {
-        "value": {
-          "x": "0",
-          "y": "1",
-          "blur": "6",
-          "spread": "0",
-          "color": "rgba({color.blue.500}, 0.15)",
-          "type": "dropShadow"
-        },
-        "type": "boxShadow"
-      }
-    },
-    "size": {
-      "300": {
-        "value": "24px",
-        "type": "sizing"
       },
-      "500": {
-        "value": "56px",
-        "type": "sizing"
+      "015": {
+        "value": "0.15",
+        "type": "opacity"
       }
     }
   },
   "semantic": {
     "typography": {
-      "h1": {
-        "value": {
-          "fontFamily": "{fontFamily.sans-serif}",
-          "fontWeight": "{fontWeight.semibold}",
-          "fontSize": "{fontSize.600}"
-        },
-        "type": "typography"
-      },
-      "h3": {
-        "value": {
-          "fontFamily": "{fontFamily.sans-serif}",
-          "fontWeight": "{fontWeight.semibold}",
-          "fontSize": "{fontSize.400}"
-        },
-        "type": "typography"
-      },
-      "button": {
+      "body": {
         "value": {
-          "fontFamily": "{fontFamily.sans-serif}",
-          "fontWeight": "{fontWeight.semibold}",
-          "fontSize": "{fontSize.300}"
+          "fontFamily": "{fontFamily.body}",
+          "fontWeight": "{fontWeight.400}",
+          "lineHeight": "{lineHeight.125}",
+          "fontSize": "{fontSize.100}"
         },
         "type": "typography"
       },
       "label": {
         "value": {
-          "fontFamily": "{fontFamily.sans-serif}",
-          "fontWeight": "{fontWeight.semibold}",
-          "fontSize": "{fontSize.200}",
-          "textCase": "{textCase.uppercase}"
+          "fontFamily": "{fontFamily.body}",
+          "fontWeight": "{fontWeight.600}",
+          "lineHeight": "{lineHeight.125}",
+          "fontSize": "{fontSize.100}"
         },
         "type": "typography"
       },
-      "body": {
-        "value": {
-          "fontFamily": "{fontFamily.sans-serif}",
-          "fontWeight": "{fontWeight.regular}",
-          "fontSize": "{fontSize.200}",
-          "textCase": "{textCase.none}"
+      "headings": {
+        "1": {
+          "value": {
+            "fontFamily": "{fontFamily.headings}",
+            "fontWeight": "{fontWeight.400}",
+            "lineHeight": "{lineHeight.225}",
+            "fontSize": "{fontSize.800}"
+          },
+          "type": "typography"
         },
-        "type": "typography"
+        "2": {
+          "value": {
+            "fontFamily": "{fontFamily.headings}",
+            "fontWeight": "{fontWeight.600}",
+            "lineHeight": "{lineHeight.175}",
+            "fontSize": "{fontSize.700}"
+          },
+          "type": "typography"
+        }
       }
     },
-    "fg": {
-      "default": {
-        "value": "rgba({color.black}, {opacity.100})",
-        "type": "color"
+    "input-container": {
+      "borderRadius": {
+        "value": "{borderRadius.10}",
+        "type": "borderRadius",
+        "description": "Text fields\nDropdowns"
+      },
+      "borderWidth": {
+        "value": "{borderWidth.1}",
+        "type": "borderWidth"
       },
-      "muted": {
-        "value": "rgba({color.black}, {opacity.200})",
-        "type": "color"
+      "color": {
+        "border": {
+          "enabled": {
+            "value": "{color.grey.400}",
+            "type": "color"
+          },
+          "hover": {
+            "value": "{color.grey.100}",
+            "type": "color"
+          },
+          "active": {
+            "value": "{color.primary.500}",
+            "type": "color"
+          },
+          "error": {
+            "value": "{color.red.500}",
+            "type": "color"
+          }
+        }
       },
-      "primary": {
-        "value": "{color.primary.500}",
-        "type": "color"
+      "size": {
+        "height": {
+          "value": "{size.275}",
+          "type": "sizing"
+        }
       }
     },
-    "bg": {
-      "default": {
-        "value": "{color.white}",
-        "type": "color"
-      },
-      "cta": {
-        "value": "{color.primary.500}",
-        "type": "color"
-      },
-      "success": {
-        "value": "{color.green.200}",
-        "type": "color"
+    "font": {
+      "color": {
+        "body": {
+          "high-emphasis": {
+            "value": "{color.grey.100}",
+            "type": "color"
+          },
+          "error": {
+            "value": "{color.red.500}",
+            "type": "color"
+          }
+        }
       }
     },
-    "sizing": {
-      "interactive-element": {
-        "value": "44px",
-        "type": "sizing"
-      }
-    }
-  },
-  "component": {
-    "bg": {
-      "button": {
-        "high-emphasis": {
-          "value": "{bg.cta}",
+    "icon": {
+      "color": {
+        "default": {
+          "value": "{color.grey.200}",
           "type": "color"
         },
-        "medium-emphasis": {
-          "value": "{bg.default}",
+        "on-primary": {
+          "value": "{color.white}",
           "type": "color"
         }
       },
-      "badge": {
-        "success": {
-          "value": "{bg.success}",
-          "type": "color"
+      "size": {
+        "300": {
+          "value": "{size.150}",
+          "type": "sizing"
+        }
+      }
+    },
+    "action": {
+      "color": {
+        "background": {
+          "high-emphasis": {
+            "enabled": {
+              "value": "{color.primary.500}",
+              "type": "color"
+            },
+            "hover": {
+              "value": "{color.primary.400}",
+              "type": "color"
+            }
+          },
+          "medium-emphasis": {
+            "hover": {
+              "value": "{color.grey.900}",
+              "type": "color"
+            },
+            "enabled": {
+              "value": "none",
+              "type": "color"
+            }
+          }
+        },
+        "label": {
+          "high-emphasis": {
+            "value": "{color.white}",
+            "type": "color"
+          },
+          "medium-emphasis": {
+            "enabled": {
+              "value": "{color.primary.500}",
+              "type": "color"
+            },
+            "hover": {
+              "value": "{color.primary.400}",
+              "type": "color"
+            }
+          }
+        },
+        "border": {
+          "medium-emphasis": {
+            "value": "{color.primary.500}",
+            "type": "color"
+          }
         }
       },
-      "card": {
-        "value": "{bg.default}",
-        "type": "color"
+      "borderRadius": {
+        "value": "{borderRadius.250}",
+        "type": "borderRadius"
       },
-      "tab": {
-        "value": "{bg.default}",
-        "type": "color"
+      "spacing": {
+        "inline": {
+          "gap": {
+            "value": "{spacing.50}",
+            "type": "spacing"
+          },
+          "padding": {
+            "value": "{spacing.150}",
+            "type": "spacing"
+          }
+        },
+        "low-emphasis": {
+          "inline": {
+            "padding": {
+              "value": "{spacing.100}",
+              "type": "spacing"
+            }
+          }
+        }
       },
-      "table": {
-        "value": "{bg.default}",
-        "type": "color"
+      "size": {
+        "height": {
+          "value": "{size.300}",
+          "type": "sizing"
+        }
       },
-      "table-column-header": {
-        "value": "{color.green.200}",
-        "type": "color"
+      "borderWidth": {
+        "value": "{borderWidth.1}",
+        "type": "borderWidth"
       }
     },
-    "fg": {
-      "button": {
-        "high-emphasis": {
-          "value": "{color.white}",
-          "type": "color"
+    "testaction": {
+      "color": {
+        "background": {
+          "high-emphasis": {
+            "enabled": {
+              "value": "{color.primary.400}",
+              "type": "color"
+            }
+          }
         },
-        "medium-emphasis": {
-          "value": "{fg.primary}",
-          "type": "color"
+        "label": {
+          "high-emphasis": {
+            "value": "{color.white}",
+            "type": "color"
+          }
+        },
+        "state-layer": {
+          "on-primary": {
+            "value": "rgba({color.state-layer.on-primary}, {opacity.015})",
+            "type": "color"
+          }
+        }
+      }
+    },
+    "selection": {
+      "color": {
+        "icon": {
+          "unselected": {
+            "enabled": {
+              "value": "{icon.color.default}",
+              "type": "color"
+            },
+            "hover": {
+              "value": "{color.grey.100}",
+              "type": "color"
+            }
+          },
+          "selected": {
+            "enabled": {
+              "value": "{color.primary.500}",
+              "type": "color"
+            },
+            "hover": {
+              "value": "{color.primary.400}",
+              "type": "color"
+            }
+          }
+        },
+        "border": {
+          "enabled": {
+            "value": "{color.grey.400}",
+            "type": "color"
+          },
+          "hover": {
+            "value": "{color.grey.100}",
+            "type": "color"
+          }
+        },
+        "background": {
+          "hover": {
+            "value": "{color.grey.900}",
+            "type": "color"
+          }
         }
       },
-      "badge": {
-        "success": {
-          "value": "{color.primary.700}",
-          "type": "color"
+      "spacing": {
+        "inline": {
+          "gap": {
+            "value": "{spacing.10}",
+            "type": "spacing"
+          },
+          "padding": {
+            "value": "{spacing.75}",
+            "type": "spacing"
+          }
         }
       },
-      "tab": {
-        "enabled": {
-          "value": "{fg.muted}",
-          "type": "color"
-        },
-        "active": {
-          "value": "{fg.primary}",
-          "type": "color"
+      "size": {
+        "height": {
+          "value": "{size.200}",
+          "type": "sizing"
         }
       },
-      "table": {
-        "value": "{fg.default}",
-        "type": "color"
+      "borderRadius": {
+        "value": "{borderRadius.50}",
+        "type": "borderRadius"
       },
-      "table-column-header": {
-        "value": "{fg.table}",
-        "type": "color"
+      "borderWidth": {
+        "value": "{borderWidth.1}",
+        "type": "borderWidth"
+      },
+      "chip": {
+        "color": {
+          "background": {
+            "selected": {
+              "enabled": {
+                "value": "{color.transparent.primary.50}",
+                "type": "color"
+              },
+              "hover": {
+                "value": "{color.transparent.primary.100}",
+                "type": "color"
+              }
+            }
+          }
+        }
       }
     },
-    "borderRadius": {
-      "button": {
-        "value": "{borderRadius.100}",
-        "type": "borderRadius"
+    "nav-item": {
+      "local": {
+        "spacing": {
+          "inline": {
+            "gap": {
+              "value": "{spacing.10}",
+              "type": "spacing"
+            },
+            "padding": {
+              "value": "{spacing.150}",
+              "type": "spacing"
+            }
+          }
+        },
+        "color": {
+          "label": {
+            "default": {
+              "value": "{color.grey.200}",
+              "type": "color"
+            },
+            "active": {
+              "value": "{color.grey.100}",
+              "type": "color"
+            }
+          },
+          "background": {
+            "hover": {
+              "value": "{color.grey.900}",
+              "type": "color"
+            },
+            "enabled": {
+              "value": "none",
+              "type": "color"
+            }
+          },
+          "border": {
+            "active": {
+              "value": "{color.primary.500}",
+              "type": "color"
+            }
+          },
+          "icon": {
+            "default": {
+              "value": "{color.grey.200}",
+              "type": "color"
+            },
+            "active": {
+              "value": "{color.primary.500}",
+              "type": "color"
+            },
+            "completed": {
+              "value": "{color.primary.500}",
+              "type": "color"
+            }
+          }
+        },
+        "borderWidth": {
+          "active": {
+            "value": "{borderWidth.2}",
+            "type": "borderWidth"
+          }
+        }
       },
-      "badge": {
-        "value": "{borderRadius.100}",
-        "type": "borderRadius"
+      "size": {
+        "height": {
+          "value": "{size.350}",
+          "type": "sizing"
+        },
+        "width": {
+          "value": "100%",
+          "type": "sizing"
+        }
       },
-      "card": {
-        "value": "{borderRadius.100}",
-        "type": "borderRadius"
+      "global": {
+        "spacing": {
+          "inline": {
+            "gap": {
+              "value": "{spacing.100}",
+              "type": "spacing"
+            },
+            "padding": {
+              "value": "{spacing.150}",
+              "type": "spacing"
+            }
+          }
+        },
+        "color": {
+          "background": {
+            "enabled": {
+              "value": "{color.primary.500}",
+              "type": "color"
+            },
+            "hover": {
+              "value": "{color.primary.400}",
+              "type": "color"
+            }
+          },
+          "border": {
+            "active": {
+              "value": "{color.secondary.500}",
+              "type": "color"
+            }
+          },
+          "label": {
+            "value": "{color.white}",
+            "type": "color"
+          }
+        },
+        "borderWidth": {
+          "active": {
+            "value": "{borderWidth.10}",
+            "type": "borderWidth"
+          }
+        }
       }
     },
-    "spacing": {
-      "button": {
-        "padding": {
-          "value": "{spacing.200}",
-          "type": "spacing"
+    "input-field": {
+      "spacing": {
+        "label": {
+          "inline": {
+            "start": {
+              "value": "{spacing.10}",
+              "type": "spacing"
+            }
+          }
+        },
+        "supporting-text": {
+          "inline": {
+            "start": {
+              "value": "{spacing.10}",
+              "type": "spacing"
+            }
+          }
+        }
+      }
+    },
+    "menu-item": {
+      "size": {
+        "height": {
+          "value": "{size.300}",
+          "type": "sizing"
+        },
+        "width": {
+          "value": "100%",
+          "type": "sizing"
         }
       },
-      "table": {
+      "spacing": {
         "padding": {
           "value": "{spacing.100}",
           "type": "spacing"
         }
       },
-      "badge": {
-        "padding": {
-          "value": "{spacing.50}",
-          "type": "spacing"
+      "color": {
+        "background": {
+          "hover": {
+            "value": "{color.grey.900}",
+            "type": "color"
+          }
         }
       }
     },
     "boxShadow": {
-      "card": {
-        "value": "{boxShadow.300}",
+      "menu": {
+        "value": "{boxShadow.dropShadow.200}",
+        "type": "boxShadow"
+      },
+      "topBar": {
+        "value": "{boxShadow.dropShadow.200}",
         "type": "boxShadow"
       }
     },
-    "size": {
-      "table-cell": {
-        "value": "{size.500}",
-        "type": "sizing"
-      },
-      "tab": {
-        "value": "{size.500}",
-        "type": "sizing"
+    "menu": {
+      "color": {
+        "background": {
+          "default": {
+            "value": "{color.white}",
+            "type": "color"
+          }
+        }
       },
-      "button": {
-        "value": "{sizing.interactive-element}",
-        "type": "sizing"
+      "borderRadius": {
+        "value": "{borderRadius.10}",
+        "type": "borderRadius"
       },
-      "badge": {
-        "value": "{size.300}",
-        "type": "sizing"
+      "spacing": {
+        "block": {
+          "padding": {
+            "value": "{spacing.50}",
+            "type": "spacing"
+          }
+        }
       }
     },
-    "border": {
-      "button": {
-        "medium-emphasis": {
-          "value": {
-            "color": "{color.primary.500}",
-            "width": "{borderWidth.xs}",
-            "style": "solid"
-          },
-          "type": "border"
+    "layout": {
+      "color": {
+        "divider": {
+          "value": "{color.grey.700}",
+          "type": "color"
         }
       },
-      "table-cell": {
-        "value": {
-          "color": "{color.neutral.300}",
-          "width": "{borderWidth.xs}",
-          "style": "solid"
+      "size": {
+        "divider": {
+          "value": "{size.1}",
+          "type": "sizing"
+        }
+      }
+    },
+    "topBar": {
+      "color": {
+        "background": {
+          "value": "{color.white}",
+          "type": "color"
+        }
+      }
+    },
+    "badge": {
+      "size": {
+        "height": {
+          "value": "{size.200}",
+          "type": "sizing"
         },
-        "type": "border"
+        "width": {
+          "value": "{size.250}",
+          "type": "sizing"
+        }
       },
-      "tab": {
-        "active": {
-          "value": {
-            "color": "{fg.button.medium-emphasis}",
-            "width": "{borderWidth.md}",
-            "style": "solid"
-          },
-          "type": "border"
+      "spacing": {
+        "inline": {
+          "padding": {
+            "value": "{spacing.50}",
+            "type": "spacing"
+          }
         }
+      },
+      "color": {
+        "background": {
+          "value": "{color.grey.700}",
+          "type": "color"
+        }
+      },
+      "borderRadius": {
+        "value": "{borderRadius.250}",
+        "type": "borderRadius"
       }
     }
   },
   "$themes": [],
   "$metadata": {
-    "tokenSetOrder": ["core", "semantic", "component"]
+    "tokenSetOrder": [
+      "core",
+      "semantic"
+    ]
   }
-}
+}
\ No newline at end of file