@gitlab/ui 122.0.0 → 122.1.0

package/dist/tokens/figma/constants.tokens.json

@@ -1702,5 +1702,231 @@
         "com.figma.scope": []
       }
     }
+  },
+  "spacing-scale": {
+    "0": {
+      "$value": "0",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "1": {
+      "$value": "0.125rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "2": {
+      "$value": "0.25rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "3": {
+      "$value": "0.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "4": {
+      "$value": "0.75rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "5": {
+      "$value": "1rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "6": {
+      "$value": "1.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "7": {
+      "$value": "2rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "8": {
+      "$value": "2.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "9": {
+      "$value": "3rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "10": {
+      "$value": "3.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "11": {
+      "$value": "4rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "12": {
+      "$value": "5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "13": {
+      "$value": "6rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "15": {
+      "$value": "7.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "18": {
+      "$value": "9rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "20": {
+      "$value": "10rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "26": {
+      "$value": "13rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "28": {
+      "$value": "14rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "30": {
+      "$value": "15rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "31": {
+      "$value": "15.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "33": {
+      "$value": "16.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "34": {
+      "$value": "17rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "37": {
+      "$value": "18.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "48": {
+      "$value": "24rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "62": {
+      "$value": "31rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "75": {
+      "$value": "37.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "80": {
+      "$value": "40rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "88": {
+      "$value": "44rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "px": {
+      "$value": "1px",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "2-5": {
+      "$value": "0.375rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    },
+    "11-5": {
+      "$value": "4.5rem",
+      "$type": "dimension",
+      "$extensions": {
+        "com.figma.scope": []
+      }
+    }
   }
 }

package/dist/tokens/figma/semantic.tokens.json

@@ -1163,6 +1163,163 @@
           ]
         }
       }
+    },
+    "radius": {
+      "6": {
+        "$value": "{spacing-scale.6}",
+        "$type": "dimension",
+        "$description": "",
+        "$deprecated": true,
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "7": {
+        "$value": "{spacing-scale.7}",
+        "$type": "dimension",
+        "$description": "",
+        "$deprecated": true,
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "none": {
+        "$value": "{spacing-scale.0}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "base": {
+        "$value": "{spacing-scale.2}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "xs": {
+        "$value": "{spacing-scale.px}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "sm": {
+        "$value": "{spacing-scale.1}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "md": {
+        "$value": "{spacing-scale.2}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "lg": {
+        "$value": "{spacing-scale.3}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "xl": {
+        "$value": "{spacing-scale.4}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "2xl": {
+        "$value": "{spacing-scale.5}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "3xl": {
+        "$value": "{spacing-scale.6}",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "small": {
+        "$value": "{spacing-scale.1}",
+        "$type": "dimension",
+        "$description": "",
+        "$deprecated": true,
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "large": {
+        "$value": "{spacing-scale.3}",
+        "$type": "dimension",
+        "$description": "",
+        "$deprecated": true,
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "pill": {
+        "$value": "{spacing-scale.4}",
+        "$type": "dimension",
+        "$description": "",
+        "$deprecated": true,
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      },
+      "full": {
+        "$value": "9999px",
+        "$type": "dimension",
+        "$description": "",
+        "$extensions": {
+          "com.figma.scope": [
+            "CORNER_RADIUS"
+          ]
+        }
+      }
     }
   },
   "control": {

package/dist/tokens/js/tokens.dark.js

@@ -238,6 +238,38 @@ export const GL_LINE_HEIGHT_36 = "2.25rem";
 export const GL_LINE_HEIGHT_42 = "2.625rem";
 export const GL_LINE_HEIGHT_44 = "2.75rem";
 export const GL_LINE_HEIGHT_52 = "3.25rem";
+export const GL_SPACING_SCALE_0 = "0";
+export const GL_SPACING_SCALE_1 = "0.125rem";
+export const GL_SPACING_SCALE_2 = "0.25rem";
+export const GL_SPACING_SCALE_3 = "0.5rem";
+export const GL_SPACING_SCALE_4 = "0.75rem";
+export const GL_SPACING_SCALE_5 = "1rem";
+export const GL_SPACING_SCALE_6 = "1.5rem";
+export const GL_SPACING_SCALE_7 = "2rem";
+export const GL_SPACING_SCALE_8 = "2.5rem";
+export const GL_SPACING_SCALE_9 = "3rem";
+export const GL_SPACING_SCALE_10 = "3.5rem";
+export const GL_SPACING_SCALE_11 = "4rem";
+export const GL_SPACING_SCALE_12 = "5rem";
+export const GL_SPACING_SCALE_13 = "6rem";
+export const GL_SPACING_SCALE_15 = "7.5rem";
+export const GL_SPACING_SCALE_18 = "9rem";
+export const GL_SPACING_SCALE_20 = "10rem";
+export const GL_SPACING_SCALE_26 = "13rem";
+export const GL_SPACING_SCALE_28 = "14rem";
+export const GL_SPACING_SCALE_30 = "15rem";
+export const GL_SPACING_SCALE_31 = "15.5rem";
+export const GL_SPACING_SCALE_33 = "16.5rem";
+export const GL_SPACING_SCALE_34 = "17rem";
+export const GL_SPACING_SCALE_37 = "18.5rem";
+export const GL_SPACING_SCALE_48 = "24rem";
+export const GL_SPACING_SCALE_62 = "31rem";
+export const GL_SPACING_SCALE_75 = "37.5rem";
+export const GL_SPACING_SCALE_80 = "40rem";
+export const GL_SPACING_SCALE_88 = "44rem";
+export const GL_SPACING_SCALE_PX = "1px";
+export const GL_SPACING_SCALE_2_5 = "0.375rem";
+export const GL_SPACING_SCALE_11_5 = "4.5rem";
 export const GL_ALERT_NEUTRAL_TITLE_COLOR = "#fff";
 export const GL_ALERT_NEUTRAL_BACKGROUND_COLOR = "#28272d";
 export const GL_ALERT_NEUTRAL_BORDER_TOP_COLOR = "#89888d";
@@ -1005,6 +1037,21 @@ export const GL_BORDER_COLOR_SUBTLE = "#3a383f";
 export const GL_BORDER_COLOR_STRONG = "#626168";
 export const GL_BORDER_COLOR_SECTION = "#18171d";
 export const GL_BORDER_COLOR_TRANSPARENT = "transparent";
+export const GL_BORDER_RADIUS_6 = "1.5rem";
+export const GL_BORDER_RADIUS_7 = "2rem";
+export const GL_BORDER_RADIUS_NONE = "0";
+export const GL_BORDER_RADIUS_BASE = "0.25rem";
+export const GL_BORDER_RADIUS_XS = "1px";
+export const GL_BORDER_RADIUS_SM = "0.125rem";
+export const GL_BORDER_RADIUS_MD = "0.25rem";
+export const GL_BORDER_RADIUS_LG = "0.5rem";
+export const GL_BORDER_RADIUS_XL = "0.75rem";
+export const GL_BORDER_RADIUS_2XL = "1rem";
+export const GL_BORDER_RADIUS_3XL = "1.5rem";
+export const GL_BORDER_RADIUS_SMALL = "0.125rem";
+export const GL_BORDER_RADIUS_LARGE = "0.5rem";
+export const GL_BORDER_RADIUS_PILL = "0.75rem";
+export const GL_BORDER_RADIUS_FULL = "9999px";
 export const GL_CONTROL_BACKGROUND_COLOR_DEFAULT = "rgba(05, 05, 06, 0.4)";
 export const GL_CONTROL_BACKGROUND_COLOR_DISABLED = "rgba(255, 255, 255, 0.04)";
 export const GL_CONTROL_BACKGROUND_COLOR_CONCATENATION =

package/dist/tokens/js/tokens.js

@@ -238,6 +238,38 @@ export const GL_LINE_HEIGHT_36 = "2.25rem";
 export const GL_LINE_HEIGHT_42 = "2.625rem";
 export const GL_LINE_HEIGHT_44 = "2.75rem";
 export const GL_LINE_HEIGHT_52 = "3.25rem";
+export const GL_SPACING_SCALE_0 = "0";
+export const GL_SPACING_SCALE_1 = "0.125rem";
+export const GL_SPACING_SCALE_2 = "0.25rem";
+export const GL_SPACING_SCALE_3 = "0.5rem";
+export const GL_SPACING_SCALE_4 = "0.75rem";
+export const GL_SPACING_SCALE_5 = "1rem";
+export const GL_SPACING_SCALE_6 = "1.5rem";
+export const GL_SPACING_SCALE_7 = "2rem";
+export const GL_SPACING_SCALE_8 = "2.5rem";
+export const GL_SPACING_SCALE_9 = "3rem";
+export const GL_SPACING_SCALE_10 = "3.5rem";
+export const GL_SPACING_SCALE_11 = "4rem";
+export const GL_SPACING_SCALE_12 = "5rem";
+export const GL_SPACING_SCALE_13 = "6rem";
+export const GL_SPACING_SCALE_15 = "7.5rem";
+export const GL_SPACING_SCALE_18 = "9rem";
+export const GL_SPACING_SCALE_20 = "10rem";
+export const GL_SPACING_SCALE_26 = "13rem";
+export const GL_SPACING_SCALE_28 = "14rem";
+export const GL_SPACING_SCALE_30 = "15rem";
+export const GL_SPACING_SCALE_31 = "15.5rem";
+export const GL_SPACING_SCALE_33 = "16.5rem";
+export const GL_SPACING_SCALE_34 = "17rem";
+export const GL_SPACING_SCALE_37 = "18.5rem";
+export const GL_SPACING_SCALE_48 = "24rem";
+export const GL_SPACING_SCALE_62 = "31rem";
+export const GL_SPACING_SCALE_75 = "37.5rem";
+export const GL_SPACING_SCALE_80 = "40rem";
+export const GL_SPACING_SCALE_88 = "44rem";
+export const GL_SPACING_SCALE_PX = "1px";
+export const GL_SPACING_SCALE_2_5 = "0.375rem";
+export const GL_SPACING_SCALE_11_5 = "4.5rem";
 export const GL_ALERT_NEUTRAL_TITLE_COLOR = "#18171d";
 export const GL_ALERT_NEUTRAL_BACKGROUND_COLOR = "#ececef";
 export const GL_ALERT_NEUTRAL_BORDER_TOP_COLOR = "transparent";
@@ -995,6 +1027,21 @@ export const GL_BORDER_COLOR_SUBTLE = "#ececef";
 export const GL_BORDER_COLOR_STRONG = "#bfbfc3";
 export const GL_BORDER_COLOR_SECTION = "#dcdcde";
 export const GL_BORDER_COLOR_TRANSPARENT = "transparent";
+export const GL_BORDER_RADIUS_6 = "1.5rem";
+export const GL_BORDER_RADIUS_7 = "2rem";
+export const GL_BORDER_RADIUS_NONE = "0";
+export const GL_BORDER_RADIUS_BASE = "0.25rem";
+export const GL_BORDER_RADIUS_XS = "1px";
+export const GL_BORDER_RADIUS_SM = "0.125rem";
+export const GL_BORDER_RADIUS_MD = "0.25rem";
+export const GL_BORDER_RADIUS_LG = "0.5rem";
+export const GL_BORDER_RADIUS_XL = "0.75rem";
+export const GL_BORDER_RADIUS_2XL = "1rem";
+export const GL_BORDER_RADIUS_3XL = "1.5rem";
+export const GL_BORDER_RADIUS_SMALL = "0.125rem";
+export const GL_BORDER_RADIUS_LARGE = "0.5rem";
+export const GL_BORDER_RADIUS_PILL = "0.75rem";
+export const GL_BORDER_RADIUS_FULL = "9999px";
 export const GL_CONTROL_BACKGROUND_COLOR_DEFAULT = "#fff";
 export const GL_CONTROL_BACKGROUND_COLOR_DISABLED = "#fbfafd";
 export const GL_CONTROL_BACKGROUND_COLOR_CONCATENATION = "#fbfafd";