minior fixes

config/_default/menus.toml

@@ -4,10 +4,16 @@
 name = "Components"
 identifier = "components"
 url = "/components"
-weight = 25
+weight = 45
 
 [[global]]
 name = "Docs"
 identifier = "docs"
 url = "/docs"
-weight = 15
+weight = 25
+
+[[global]]
+name = "Tokens"
+identifier = "tokens"
+url ="/tokens"
+weight=15

src/scss/_button-group.scss

@@ -1,6 +1,5 @@
 .btn-group,
-.btn-group-vertical,
-.btn-group-segmented {
+.btn-group-vertical {
   position: relative;
   display: inline-flex;
   vertical-align: middle;
@@ -30,26 +29,19 @@
   }
 }
 
-.btn-group-segmented {
-  @include border-radius($btn-border-radius);
-
-  // Bring the hover, focused, and "active" buttons to the front to overlay
-  // the borders properly
-  > .btn-check:checked + .btn,
-  > .btn-check:focus + .btn,
-  > .btn:hover,
-  > .btn:focus,
-  > .btn:active,
-  > .btn.active {
-    z-index: 1;
-  }
+.btn-group-narrow {
+  --#{$prefix}btn-group-spacing: 0;
 
   // Prevent double borders when buttons are next to each other
-  > :not(.btn-check:first-child) + .btn,
-  > .btn-group:not(:first-child) {
-    margin-left: calc(
-      #{$btn-border-width} * -1
-    ); // stylelint-disable-line function-disallowed-list
+  // > :not(.btn-check:first-child) + .btn,
+  //> .btn-group:not(:first-child) {
+  // margin-left: calc(#{$btn-border-width} * -1);
+  // }
+
+  @each $color, $value in $theme-colors {
+    > .btn-outline-#{$color}:not(.btn-check:first-child) + .btn-outline-#{$color} {
+      margin-left: calc(#{$btn-border-width} * -1);
+    }
   }
 
   // Reset rounded corners

src/scss/_dropdown.scss

@@ -4,6 +4,7 @@
   display: inline-flex;
   vertical-align: top;
 
+  &.is-hoverable,
   &.dropdown-hover {
     &:hover {
       .dropdown-menu {

src/scss/_functions.scss

@@ -1,7 +1,7 @@
 @function light($token) {
-  @return nth(map-get($all-tokens, $token), 1);
+  @return nth(map-get($color-tokens, $token), 1);
 }
 
 @function dark($token) {
-  @return nth(map-get($all-tokens, $token), 2);
+  @return nth(map-get($color-tokens, $token), 2);
 }

src/scss/_root.scss

@@ -1,14 +1,35 @@
+$space-tokens: (
+  "space-0": $ds-space-0,
+  "space-025": $ds-space-025,
+  "space-050": $ds-space-050,
+  "space-075": $ds-space-075,
+  "space-100": $ds-space-100,
+  "space-150": $ds-space-150,
+  "space-200": $ds-space-200,
+  "space-250": $ds-space-250,
+  "space-300": $ds-space-300,
+  "space-400": $ds-space-400,
+  "space-500": $ds-space-500,
+  "space-600": $ds-space-600,
+  "space-800": $ds-space-800,
+  "space-1000": $ds-space-1000,
+);
+
 :root,
 [data-bs-theme="light"] {
-  @each $color, $values in $all-tokens {
+  @each $color, $values in $color-tokens {
     $value: nth($values, 1);
     --#{$ds-prefix}#{$color}: #{$value};
   }
+
+  @each $name, $value in $space-tokens {
+    --#{$ds-prefix}#{$name}: #{$value};
+  }
 }
 
 @if $enable-dark-mode {
   @include color-mode(dark, true) {
-    @each $color, $values in $all-tokens {
+    @each $color, $values in $color-tokens {
       $value: nth($values, 2);
       --#{$ds-prefix}#{$color}: #{$value};
     }
@@ -18,4 +39,4 @@
       --#{$prefix}light-rgb: #{to-rgb(dark("background-neutral"))};
     }
   }
-}
+}

src/scss/_utilities.scss

@@ -145,10 +145,10 @@ $utilities: map-merge(
     ),
     "nagative-rotate": (
       property: transform,
-      class: rotate,
+      class: -rotate,
       values: (
-        n45: rotate(-45deg),
-        n90: rotate(-90deg),
+        45: rotate(-45deg),
+        90: rotate(-90deg),
       ),
     ),
     "min-width": (