@codecademy/gamut-styles 16.3.0 → 16.3.1-alpha.2e8e59.0

package/dist/ColorMode.d.ts

@@ -398,34 +398,43 @@ export declare const providerProps: import("@codecademy/variance/dist/types/conf
     };
     readonly borderRadius: {
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusLeft: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTop: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottom: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusRight: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTopLeft: {
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTopRight: {
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottomRight: {
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottomLeft: {
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderStyle: {
         readonly property: "borderStyle";
@@ -663,6 +672,7 @@ export declare const VariableProvider: import("@emotion/styled").StyledComponent
     }>;
     borderRadius?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRight";
@@ -825,30 +835,38 @@ export declare const VariableProvider: import("@emotion/styled").StyledComponent
     borderRadiusLeft?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusTop?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusBottom?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusTopLeft?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRadiusTopRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRadiusBottomRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRadiusBottomLeft?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     }>;
     borderStyleX?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderStyle";
@@ -1061,6 +1079,7 @@ export declare const ColorMode: import("react").ForwardRefExoticComponent<Pick<O
     }>;
     borderRadius?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRight";
@@ -1223,30 +1242,38 @@ export declare const ColorMode: import("react").ForwardRefExoticComponent<Pick<O
     borderRadiusLeft?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusTop?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusBottom?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     }>;
     borderRadiusTopLeft?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRadiusTopRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRadiusBottomRight?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     }>;
     borderRadiusBottomLeft?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     }>;
     borderStyleX?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "borderStyle";

package/dist/themes/admin.d.ts

@@ -24,6 +24,14 @@ export declare const adminTheme: Record<"breakpoints", {
         lg: string;
         xl: string;
     };
+    borderRadii: {
+        none: string;
+        sm: string;
+        m: string;
+        l: string;
+        xl: string;
+        full: string;
+    };
     fontSize: {
         readonly 64: string;
         readonly 44: string;

package/dist/themes/core.d.ts

@@ -23,6 +23,14 @@ export declare const coreTheme: Record<"elements", Record<"elements", import("@c
         lg: string;
         xl: string;
     };
+    borderRadii: {
+        none: string;
+        sm: string;
+        m: string;
+        l: string;
+        xl: string;
+        full: string;
+    };
     fontSize: {
         readonly 64: string;
         readonly 44: string;

package/dist/themes/core.js

@@ -1,5 +1,5 @@
 import { createTheme } from '@codecademy/variance';
-import { corePalette, elements, fontFamily, fontSize, fontWeight, lineHeight, mediaQueries, spacing } from '../variables';
+import { borderRadii, corePalette, elements, fontFamily, fontSize, fontWeight, lineHeight, mediaQueries, spacing } from '../variables';
 
 /**
  *  @description  This is the core theme that all other Codecademy themes are extended from
@@ -9,6 +9,7 @@ import { corePalette, elements, fontFamily, fontSize, fontWeight, lineHeight, me
 
 export var coreTheme = createTheme({
   breakpoints: mediaQueries,
+  borderRadii: borderRadii,
   fontSize: fontSize,
   fontFamily: fontFamily,
   lineHeight: lineHeight,

package/dist/themes/platform.d.ts

@@ -34,6 +34,14 @@ export declare const platformTheme: Record<"breakpoints", {
         lg: string;
         xl: string;
     };
+    borderRadii: {
+        none: string;
+        sm: string;
+        m: string;
+        l: string;
+        xl: string;
+        full: string;
+    };
     fontSize: {
         readonly 64: string;
         readonly 44: string;

package/dist/variables/borderRadii.d.ts

@@ -0,0 +1,8 @@
+export declare const borderRadii: {
+    none: string;
+    sm: string;
+    m: string;
+    l: string;
+    xl: string;
+    full: string;
+};

package/dist/variables/borderRadii.js

@@ -0,0 +1,8 @@
+export var borderRadii = {
+  none: '0px',
+  sm: '2px',
+  m: '4px',
+  l: '8px',
+  xl: '16px',
+  full: '50%'
+};

package/dist/variables/index.d.ts

@@ -1,7 +1,8 @@
+export * from './borderRadii';
 export * from './colors';
+export * from './elements';
 export * from './responsive';
 export * from './spacing';
-export * from './typography';
 export * from './timing';
-export * from './elements';
+export * from './typography';
 export * from './deprecated-colors';

package/dist/variables/index.js

@@ -1,8 +1,9 @@
+export * from './borderRadii';
 export * from './colors';
+export * from './elements';
 export * from './responsive';
 export * from './spacing';
-export * from './typography';
 export * from './timing';
-export * from './elements';
+export * from './typography';
 // Deprecated variables
 export * from './deprecated-colors';

package/dist/variance/config.d.ts

@@ -98,34 +98,43 @@ export declare const border: {
     };
     readonly borderRadius: {
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusLeft: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTop: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottom: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusRight: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTopLeft: {
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTopRight: {
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottomRight: {
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottomLeft: {
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderStyle: {
         readonly property: "borderStyle";
@@ -709,34 +718,43 @@ export declare const all: {
     };
     borderRadius: {
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusLeft: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTop: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusBottom: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusRight: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTopLeft: {
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusTopRight: {
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomRight: {
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomLeft: {
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderStyle: {
         readonly property: "borderStyle";

package/dist/variance/config.js

@@ -107,35 +107,44 @@ export var border = {
   },
   // Radius
   borderRadius: {
-    property: 'borderRadius'
+    property: 'borderRadius',
+    scale: 'borderRadii'
   },
   borderRadiusLeft: {
     property: 'borderRadius',
-    properties: ['borderTopLeftRadius', 'borderBottomLeftRadius']
+    properties: ['borderTopLeftRadius', 'borderBottomLeftRadius'],
+    scale: 'borderRadii'
   },
   borderRadiusTop: {
     property: 'borderRadius',
-    properties: ['borderTopLeftRadius', 'borderTopRightRadius']
+    properties: ['borderTopLeftRadius', 'borderTopRightRadius'],
+    scale: 'borderRadii'
   },
   borderRadiusBottom: {
     property: 'borderRadius',
-    properties: ['borderBottomLeftRadius', 'borderBottomRightRadius']
+    properties: ['borderBottomLeftRadius', 'borderBottomRightRadius'],
+    scale: 'borderRadii'
   },
   borderRadiusRight: {
     property: 'borderRadius',
-    properties: ['borderTopRightRadius', 'borderBottomRightRadius']
+    properties: ['borderTopRightRadius', 'borderBottomRightRadius'],
+    scale: 'borderRadii'
   },
   borderRadiusTopLeft: {
-    property: 'borderTopLeftRadius'
+    property: 'borderTopLeftRadius',
+    scale: 'borderRadii'
   },
   borderRadiusTopRight: {
-    property: 'borderTopRightRadius'
+    property: 'borderTopRightRadius',
+    scale: 'borderRadii'
   },
   borderRadiusBottomRight: {
-    property: 'borderBottomRightRadius'
+    property: 'borderBottomRightRadius',
+    scale: 'borderRadii'
   },
   borderRadiusBottomLeft: {
-    property: 'borderBottomLeftRadius'
+    property: 'borderBottomLeftRadius',
+    scale: 'borderRadii'
   },
   // Style
   borderStyle: {

package/dist/variance/props.d.ts

@@ -454,34 +454,43 @@ export declare const border: import("@codecademy/variance/dist/types/config").Pa
     };
     readonly borderRadius: {
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusLeft: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTop: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottom: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusRight: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTopLeft: {
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusTopRight: {
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottomRight: {
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderRadiusBottomLeft: {
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     };
     readonly borderStyle: {
         readonly property: "borderStyle";
@@ -712,34 +721,43 @@ export declare const css: import("@codecademy/variance/dist/types/config").CSS<i
     };
     borderRadius: {
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusLeft: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTop: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusBottom: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusRight: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTopLeft: {
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusTopRight: {
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomRight: {
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomLeft: {
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderStyle: {
         readonly property: "borderStyle";
@@ -1154,34 +1172,43 @@ export declare const variant: import("@codecademy/variance/dist/types/config").V
     };
     borderRadius: {
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusLeft: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTop: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusBottom: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusRight: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTopLeft: {
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusTopRight: {
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomRight: {
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomLeft: {
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderStyle: {
         readonly property: "borderStyle";
@@ -1596,34 +1623,43 @@ export declare const states: import("@codecademy/variance/dist/types/config").St
     };
     borderRadius: {
         readonly property: "borderRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusLeft: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderBottomLeftRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTop: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopLeftRadius", "borderTopRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusBottom: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderBottomLeftRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusRight: {
         readonly property: "borderRadius";
         readonly properties: readonly ["borderTopRightRadius", "borderBottomRightRadius"];
+        readonly scale: "borderRadii";
     };
     borderRadiusTopLeft: {
         readonly property: "borderTopLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusTopRight: {
         readonly property: "borderTopRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomRight: {
         readonly property: "borderBottomRightRadius";
+        readonly scale: "borderRadii";
     };
     borderRadiusBottomLeft: {
         readonly property: "borderBottomLeftRadius";
+        readonly scale: "borderRadii";
     };
     borderStyle: {
         readonly property: "borderStyle";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@codecademy/gamut-styles",
   "description": "Styleguide & Component library for codecademy.com",
-  "version": "16.3.0",
+  "version": "16.3.1-alpha.2e8e59.0",
   "author": "Jake Hiller <jake@codecademy.com>",
   "dependencies": {
     "@codecademy/variance": "0.21.3",
@@ -34,5 +34,5 @@
   "scripts": {
     "build": "nx build @codecademy/gamut-styles"
   },
-  "gitHead": "421d693a6c32721cb669213802e4d3d23e078a05"
+  "gitHead": "2ecc1c696cfc4b1096e5b8a4eb69f4ff7e230d2f"
 }