@twilio-paste/design-tokens - npm Package Compare versions

Comparing version 5.3.2 to 5.4.0

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [5.4.0](https://github.com/twilio-labs/paste/compare/@twilio-paste/design-tokens@5.3.2...@twilio-paste/design-tokens@5.4.0) (2020-07-14)
+
+
+### Features
+
+* **design-tokens:** add color-border-light and color-border-lighter ([83d0b04](https://github.com/twilio-labs/paste/commit/83d0b045bed4cc904fbc5ab4f69ff7ed62909071))
+
+
+
+
+
 ## [5.3.2](https://github.com/twilio-labs/paste/compare/@twilio-paste/design-tokens@5.3.1...@twilio-paste/design-tokens@5.3.2) (2020-07-14)
@@ -8,0 +19,0 @@

dist/themes/console/tokens.common.d.ts

@@ -54,3 +54,4 @@ export declare const borderRadius0 = "0";
 export declare const colorBorderInverse = "rgb(255, 255, 255)";
-export declare const colorBorderLight = "rgb(228, 231, 233)";
+export declare const colorBorderLight = "rgb(200, 204, 207)";
+export declare const colorBorderLighter = "rgb(228, 231, 233)";
 export declare const colorBorderNeutralLight = "rgb(200, 204, 207)";
@@ -263,3 +264,4 @@ export declare const colorBorderPrimary = "rgb(2, 122, 197)";
   colorBorderInverse: "rgb(255, 255, 255)";
-  colorBorderLight: "rgb(228, 231, 233)";
+  colorBorderLight: "rgb(200, 204, 207)";
+  colorBorderLighter: "rgb(228, 231, 233)";
   colorBorderNeutralLight: "rgb(200, 204, 207)";
@@ -266,0 +268,0 @@ colorBorderPrimary: "rgb(2, 122, 197)";

dist/themes/console/tokens.common.js

@@ -54,3 +54,4 @@ const borderRadius0 = "0";
 const colorBorderInverse = "rgb(255, 255, 255)";
-const colorBorderLight = "rgb(228, 231, 233)";
+const colorBorderLight = "rgb(200, 204, 207)";
+const colorBorderLighter = "rgb(228, 231, 233)";
 const colorBorderNeutralLight = "rgb(200, 204, 207)";
@@ -273,2 +274,3 @@ const colorBorderPrimary = "rgb(2, 122, 197)";
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -482,2 +484,3 @@ colorBorderPrimary,
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -484,0 +487,0 @@ colorBorderPrimary,

dist/themes/console/tokens.es6.d.ts

@@ -54,3 +54,4 @@ export declare const borderRadius0 = "0";
 export declare const colorBorderInverse = "rgb(255, 255, 255)";
-export declare const colorBorderLight = "rgb(228, 231, 233)";
+export declare const colorBorderLight = "rgb(200, 204, 207)";
+export declare const colorBorderLighter = "rgb(228, 231, 233)";
 export declare const colorBorderNeutralLight = "rgb(200, 204, 207)";
@@ -263,3 +264,4 @@ export declare const colorBorderPrimary = "rgb(2, 122, 197)";
   colorBorderInverse: "rgb(255, 255, 255)";
-  colorBorderLight: "rgb(228, 231, 233)";
+  colorBorderLight: "rgb(200, 204, 207)";
+  colorBorderLighter: "rgb(228, 231, 233)";
   colorBorderNeutralLight: "rgb(200, 204, 207)";
@@ -266,0 +268,0 @@ colorBorderPrimary: "rgb(2, 122, 197)";

dist/themes/console/tokens.es6.js

@@ -54,3 +54,4 @@ export const borderRadius0 = "0";
 export const colorBorderInverse = "rgb(255, 255, 255)";
-export const colorBorderLight = "rgb(228, 231, 233)";
+export const colorBorderLight = "rgb(200, 204, 207)";
+export const colorBorderLighter = "rgb(228, 231, 233)";
 export const colorBorderNeutralLight = "rgb(200, 204, 207)";
@@ -264,2 +265,3 @@ export const colorBorderPrimary = "rgb(2, 122, 197)";
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -266,0 +268,0 @@ colorBorderPrimary,

dist/themes/console/tokens.gatsby.json

@@ -8,3 +8,3 @@ {
     "categoryName": "border-colors",
-    "tokens": [{"type":"color","category":"border-color","value":"rgb(136, 140, 142)","comment":"Default border color","originalValue":"{!palette-gray-60}","name":"color-border"},{"type":"color","category":"border-color","value":"rgb(136, 140, 142)","comment":"Dark border color","originalValue":"{!palette-gray-60}","name":"color-border-dark"},{"type":"color","category":"border-color","value":"rgb(226, 37, 37)","comment":"Destructive border color","originalValue":"{!palette-red-60}","name":"color-border-destructive"},{"type":"color","category":"border-color","value":"rgb(146, 18, 0)","comment":"Destructive focus border color","originalValue":"{!palette-red-80}","name":"color-border-destructive-dark"},{"type":"color","category":"border-color","value":"rgb(96, 1, 1)","comment":"Darker destructive hover border color","originalValue":"{!palette-red-90}","name":"color-border-destructive-darker"},{"type":"color","category":"border-color","value":"rgb(236, 182, 182)","comment":"Destructive focus border color","originalValue":"{!palette-red-40}","name":"color-border-destructive-light"},{"type":"color","category":"border-color","value":"rgb(245, 221, 221)","comment":"Destructive focus border color","originalValue":"{!palette-red-30}","name":"color-border-destructive-lighter"},{"type":"color","category":"border-color","value":"rgb(226, 37, 37)","comment":"Error border color","originalValue":"{!palette-red-60}","name":"color-border-error"},{"type":"color","category":"border-color","value":"rgb(146, 18, 0)","comment":"Dark error border color","originalValue":"{!palette-red-80}","name":"color-border-error-dark"},{"type":"color","category":"border-color","value":"rgb(222, 88, 88)","comment":"Light error border color","originalValue":"{!palette-red-50}","name":"color-border-error-light"},{"type":"color","category":"border-color","value":"rgb(255, 233, 231)","comment":"Lightest error border color","originalValue":"{!palette-red-10}","name":"color-border-error-lightest"},{"type":"color","category":"border-color","value":"rgb(255, 255, 255)","comment":"Border on inverse backgrounds","originalValue":"{!palette-gray-0}","name":"color-border-inverse"},{"type":"color","category":"border-color","value":"rgb(228, 231, 233)","comment":"Light border color","originalValue":"{!palette-gray-40}","name":"color-border-light"},{"type":"color","category":"border-color","value":"rgb(200, 204, 207)","comment":"Light neutral border color","originalValue":"{!palette-gray-50}","name":"color-border-neutral-light"},{"type":"color","category":"border-color","value":"rgb(2, 122, 197)","comment":"Primary border color","originalValue":"{!palette-blue-60}","name":"color-border-primary"},{"type":"color","category":"border-color","value":"rgb(0, 62, 130)","comment":"Dark primary border color","originalValue":"{!palette-blue-80}","name":"color-border-primary-dark"},{"type":"color","category":"border-color","value":"rgb(3, 44, 94)","comment":"Darker primary border color","originalValue":"{!palette-blue-90}","name":"color-border-primary-darker"},{"type":"color","category":"border-color","value":"rgb(179, 211, 233)","comment":"Light primary border color","originalValue":"{!palette-blue-40}","name":"color-border-primary-light"},{"type":"color","category":"border-color","value":"rgb(220, 234, 244)","comment":"Lighter primary border color","originalValue":"{!palette-blue-30}","name":"color-border-primary-lighter"},{"type":"color","category":"border-color","value":"rgb(0, 153, 74)","comment":"Success border color","originalValue":"{!palette-green-60}","name":"color-border-success"},{"type":"color","category":"border-color","value":"rgb(224, 255, 239)","comment":"Lightest success border color","originalValue":"{!palette-green-10}","name":"color-border-success-lightest"},{"type":"color","category":"border-color","value":"rgb(228, 98, 22)","comment":"Warning border color","originalValue":"{!palette-orange-60}","name":"color-border-warning"},{"type":"color","category":"border-color","value":"rgb(242, 133, 16)","comment":"Light warning border color","originalValue":"{!palette-orange-50}","name":"color-border-warning-light"},{"type":"color","category":"border-color","value":"rgb(255, 236, 216)","comment":"Lightest warning border color","originalValue":"{!palette-orange-10}","name":"color-border-warning-lightest"}]
+    "tokens": [{"type":"color","category":"border-color","value":"rgb(136, 140, 142)","comment":"Default border color","originalValue":"{!palette-gray-60}","name":"color-border"},{"type":"color","category":"border-color","value":"rgb(136, 140, 142)","comment":"Dark border color","originalValue":"{!palette-gray-60}","name":"color-border-dark"},{"type":"color","category":"border-color","value":"rgb(226, 37, 37)","comment":"Destructive border color","originalValue":"{!palette-red-60}","name":"color-border-destructive"},{"type":"color","category":"border-color","value":"rgb(146, 18, 0)","comment":"Destructive focus border color","originalValue":"{!palette-red-80}","name":"color-border-destructive-dark"},{"type":"color","category":"border-color","value":"rgb(96, 1, 1)","comment":"Darker destructive hover border color","originalValue":"{!palette-red-90}","name":"color-border-destructive-darker"},{"type":"color","category":"border-color","value":"rgb(236, 182, 182)","comment":"Destructive focus border color","originalValue":"{!palette-red-40}","name":"color-border-destructive-light"},{"type":"color","category":"border-color","value":"rgb(245, 221, 221)","comment":"Destructive focus border color","originalValue":"{!palette-red-30}","name":"color-border-destructive-lighter"},{"type":"color","category":"border-color","value":"rgb(226, 37, 37)","comment":"Error border color","originalValue":"{!palette-red-60}","name":"color-border-error"},{"type":"color","category":"border-color","value":"rgb(146, 18, 0)","comment":"Dark error border color","originalValue":"{!palette-red-80}","name":"color-border-error-dark"},{"type":"color","category":"border-color","value":"rgb(222, 88, 88)","comment":"Light error border color","originalValue":"{!palette-red-50}","name":"color-border-error-light"},{"type":"color","category":"border-color","value":"rgb(255, 233, 231)","comment":"Lightest error border color","originalValue":"{!palette-red-10}","name":"color-border-error-lightest"},{"type":"color","category":"border-color","value":"rgb(255, 255, 255)","comment":"Border on inverse backgrounds","originalValue":"{!palette-gray-0}","name":"color-border-inverse"},{"type":"color","category":"border-color","value":"rgb(200, 204, 207)","comment":"Light border color","originalValue":"{!palette-gray-50}","name":"color-border-light"},{"type":"color","category":"border-color","value":"rgb(228, 231, 233)","comment":"Lighter border color","originalValue":"{!palette-gray-40}","name":"color-border-lighter"},{"type":"color","category":"border-color","value":"rgb(200, 204, 207)","comment":"Light neutral border color","originalValue":"{!palette-gray-50}","name":"color-border-neutral-light"},{"type":"color","category":"border-color","value":"rgb(2, 122, 197)","comment":"Primary border color","originalValue":"{!palette-blue-60}","name":"color-border-primary"},{"type":"color","category":"border-color","value":"rgb(0, 62, 130)","comment":"Dark primary border color","originalValue":"{!palette-blue-80}","name":"color-border-primary-dark"},{"type":"color","category":"border-color","value":"rgb(3, 44, 94)","comment":"Darker primary border color","originalValue":"{!palette-blue-90}","name":"color-border-primary-darker"},{"type":"color","category":"border-color","value":"rgb(179, 211, 233)","comment":"Light primary border color","originalValue":"{!palette-blue-40}","name":"color-border-primary-light"},{"type":"color","category":"border-color","value":"rgb(220, 234, 244)","comment":"Lighter primary border color","originalValue":"{!palette-blue-30}","name":"color-border-primary-lighter"},{"type":"color","category":"border-color","value":"rgb(0, 153, 74)","comment":"Success border color","originalValue":"{!palette-green-60}","name":"color-border-success"},{"type":"color","category":"border-color","value":"rgb(224, 255, 239)","comment":"Lightest success border color","originalValue":"{!palette-green-10}","name":"color-border-success-lightest"},{"type":"color","category":"border-color","value":"rgb(228, 98, 22)","comment":"Warning border color","originalValue":"{!palette-orange-60}","name":"color-border-warning"},{"type":"color","category":"border-color","value":"rgb(242, 133, 16)","comment":"Light warning border color","originalValue":"{!palette-orange-50}","name":"color-border-warning-light"},{"type":"color","category":"border-color","value":"rgb(255, 236, 216)","comment":"Lightest warning border color","originalValue":"{!palette-orange-10}","name":"color-border-warning-lightest"}]
   },
@@ -11,0 +11,0 @@ {

dist/themes/console/tokens.ios.json

@@ -279,2 +279,9 @@ {
       "category": "border-color",
+      "value": "rgb(228, 231, 233)",
+      "comment": "Lighter border color",
+      "name": "colorBorderLighter"
+    },
+    {
+      "type": "color",
+      "category": "border-color",
       "value": "rgb(255, 233, 231)",
@@ -385,3 +392,3 @@ "comment": "Lightest error border color",
       "category": "border-color",
-      "value": "rgb(228, 231, 233)",
+      "value": "rgb(200, 204, 207)",
       "comment": "Light border color",
@@ -388,0 +395,0 @@ "name": "colorBorderLight"

dist/themes/console/tokens.json

@@ -41,2 +41,3 @@ {
   "color-border-success": "rgb(0, 153, 74)",
+  "color-border-lighter": "rgb(228, 231, 233)",
   "color-border-error-lightest": "rgb(255, 233, 231)",
@@ -57,3 +58,3 @@ "color-border-dark": "rgb(136, 140, 142)",
   "color-border-error-light": "rgb(222, 88, 88)",
-  "color-border-light": "rgb(228, 231, 233)",
+  "color-border-light": "rgb(200, 204, 207)",
   "border-radius-0": "0",
@@ -60,0 +61,0 @@ "border-radius-10": "3px",

dist/themes/sendgrid/tokens.common.d.ts

@@ -54,3 +54,4 @@ export declare const borderRadius0 = "0";
 export declare const colorBorderInverse = "rgb(255, 255, 255)";
-export declare const colorBorderLight = "rgb(204, 210, 220)";
+export declare const colorBorderLight = "rgb(182, 191, 206)";
+export declare const colorBorderLighter = "rgb(204, 210, 220)";
 export declare const colorBorderNeutralLight = "rgb(182, 191, 206)";
@@ -263,3 +264,4 @@ export declare const colorBorderPrimary = "rgb(51, 104, 250)";
   colorBorderInverse: "rgb(255, 255, 255)";
-  colorBorderLight: "rgb(204, 210, 220)";
+  colorBorderLight: "rgb(182, 191, 206)";
+  colorBorderLighter: "rgb(204, 210, 220)";
   colorBorderNeutralLight: "rgb(182, 191, 206)";
@@ -266,0 +268,0 @@ colorBorderPrimary: "rgb(51, 104, 250)";

dist/themes/sendgrid/tokens.common.js

@@ -54,3 +54,4 @@ const borderRadius0 = "0";
 const colorBorderInverse = "rgb(255, 255, 255)";
-const colorBorderLight = "rgb(204, 210, 220)";
+const colorBorderLight = "rgb(182, 191, 206)";
+const colorBorderLighter = "rgb(204, 210, 220)";
 const colorBorderNeutralLight = "rgb(182, 191, 206)";
@@ -273,2 +274,3 @@ const colorBorderPrimary = "rgb(51, 104, 250)";
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -482,2 +484,3 @@ colorBorderPrimary,
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -484,0 +487,0 @@ colorBorderPrimary,

dist/themes/sendgrid/tokens.es6.d.ts

@@ -54,3 +54,4 @@ export declare const borderRadius0 = "0";
 export declare const colorBorderInverse = "rgb(255, 255, 255)";
-export declare const colorBorderLight = "rgb(204, 210, 220)";
+export declare const colorBorderLight = "rgb(182, 191, 206)";
+export declare const colorBorderLighter = "rgb(204, 210, 220)";
 export declare const colorBorderNeutralLight = "rgb(182, 191, 206)";
@@ -263,3 +264,4 @@ export declare const colorBorderPrimary = "rgb(51, 104, 250)";
   colorBorderInverse: "rgb(255, 255, 255)";
-  colorBorderLight: "rgb(204, 210, 220)";
+  colorBorderLight: "rgb(182, 191, 206)";
+  colorBorderLighter: "rgb(204, 210, 220)";
   colorBorderNeutralLight: "rgb(182, 191, 206)";
@@ -266,0 +268,0 @@ colorBorderPrimary: "rgb(51, 104, 250)";

dist/themes/sendgrid/tokens.es6.js

@@ -54,3 +54,4 @@ export const borderRadius0 = "0";
 export const colorBorderInverse = "rgb(255, 255, 255)";
-export const colorBorderLight = "rgb(204, 210, 220)";
+export const colorBorderLight = "rgb(182, 191, 206)";
+export const colorBorderLighter = "rgb(204, 210, 220)";
 export const colorBorderNeutralLight = "rgb(182, 191, 206)";
@@ -264,2 +265,3 @@ export const colorBorderPrimary = "rgb(51, 104, 250)";
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -266,0 +268,0 @@ colorBorderPrimary,

dist/themes/sendgrid/tokens.gatsby.json

@@ -8,3 +8,3 @@ {
     "categoryName": "border-colors",
-    "tokens": [{"type":"color","category":"border-color","value":"rgb(136, 148, 170)","comment":"Default border color","originalValue":"{!palette-gray-70}","name":"color-border"},{"type":"color","category":"border-color","value":"rgb(156, 167, 186)","comment":"Dark border color","originalValue":"{!palette-gray-60}","name":"color-border-dark"},{"type":"color","category":"border-color","value":"rgb(206, 36, 26)","comment":"Destructive border color","originalValue":"{!palette-red-50}","name":"color-border-destructive"},{"type":"color","category":"border-color","value":"rgb(112, 6, 0)","comment":"Destructive focus border color","originalValue":"{!palette-red-80}","name":"color-border-destructive-dark"},{"type":"color","category":"border-color","value":"rgb(71, 5, 0)","comment":"Darker destructive hover border color","originalValue":"{!palette-red-90}","name":"color-border-destructive-darker"},{"type":"color","category":"border-color","value":"rgb(255, 140, 133)","comment":"Destructive focus border color","originalValue":"{!palette-red-30}","name":"color-border-destructive-light"},{"type":"color","category":"border-color","value":"rgb(255, 185, 179)","comment":"Destructive focus border color","originalValue":"{!palette-red-20}","name":"color-border-destructive-lighter"},{"type":"color","category":"border-color","value":"rgb(172, 30, 22)","comment":"Error border color","originalValue":"{!palette-red-60}","name":"color-border-error"},{"type":"color","category":"border-color","value":"rgb(148, 8, 0)","comment":"Dark error border color","originalValue":"{!palette-red-70}","name":"color-border-error-dark"},{"type":"color","category":"border-color","value":"rgb(232, 83, 74)","comment":"Light error border color","originalValue":"{!palette-red-40}","name":"color-border-error-light"},{"type":"color","category":"border-color","value":"rgb(255, 233, 231)","comment":"Lightest error border color","originalValue":"{!palette-red-10}","name":"color-border-error-lightest"},{"type":"color","category":"border-color","value":"rgb(255, 255, 255)","comment":"Border on inverse backgrounds","originalValue":"{!palette-gray-0}","name":"color-border-inverse"},{"type":"color","category":"border-color","value":"rgb(204, 210, 220)","comment":"Light border color","originalValue":"{!palette-gray-40}","name":"color-border-light"},{"type":"color","category":"border-color","value":"rgb(182, 191, 206)","comment":"Light neutral border color","originalValue":"{!palette-gray-50}","name":"color-border-neutral-light"},{"type":"color","category":"border-color","value":"rgb(51, 104, 250)","comment":"Primary border color","originalValue":"{!palette-blue-50}","name":"color-border-primary"},{"type":"color","category":"border-color","value":"rgb(0, 44, 166)","comment":"Dark primary border color","originalValue":"{!palette-blue-70}","name":"color-border-primary-dark"},{"type":"color","category":"border-color","value":"rgb(0, 31, 117)","comment":"Darker primary border color","originalValue":"{!palette-blue-80}","name":"color-border-primary-darker"},{"type":"color","category":"border-color","value":"rgb(186, 204, 255)","comment":"Light primary border color","originalValue":"{!palette-blue-30}","name":"color-border-primary-light"},{"type":"color","category":"border-color","value":"rgb(219, 230, 255)","comment":"Lighter primary border color","originalValue":"{!palette-blue-20}","name":"color-border-primary-lighter"},{"type":"color","category":"border-color","value":"rgb(0, 153, 74)","comment":"Success border color","originalValue":"{!palette-green-60}","name":"color-border-success"},{"type":"color","category":"border-color","value":"rgb(224, 255, 239)","comment":"Lightest success border color","originalValue":"{!palette-green-10}","name":"color-border-success-lightest"},{"type":"color","category":"border-color","value":"rgb(228, 98, 22)","comment":"Warning border color","originalValue":"{!palette-orange-60}","name":"color-border-warning"},{"type":"color","category":"border-color","value":"rgb(250, 156, 102)","comment":"Light warning border color","originalValue":"{!palette-orange-40}","name":"color-border-warning-light"},{"type":"color","category":"border-color","value":"rgb(255, 236, 216)","comment":"Lightest warning border color","originalValue":"{!palette-orange-10}","name":"color-border-warning-lightest"}]
+    "tokens": [{"type":"color","category":"border-color","value":"rgb(136, 148, 170)","comment":"Default border color","originalValue":"{!palette-gray-70}","name":"color-border"},{"type":"color","category":"border-color","value":"rgb(156, 167, 186)","comment":"Dark border color","originalValue":"{!palette-gray-60}","name":"color-border-dark"},{"type":"color","category":"border-color","value":"rgb(206, 36, 26)","comment":"Destructive border color","originalValue":"{!palette-red-50}","name":"color-border-destructive"},{"type":"color","category":"border-color","value":"rgb(112, 6, 0)","comment":"Destructive focus border color","originalValue":"{!palette-red-80}","name":"color-border-destructive-dark"},{"type":"color","category":"border-color","value":"rgb(71, 5, 0)","comment":"Darker destructive hover border color","originalValue":"{!palette-red-90}","name":"color-border-destructive-darker"},{"type":"color","category":"border-color","value":"rgb(255, 140, 133)","comment":"Destructive focus border color","originalValue":"{!palette-red-30}","name":"color-border-destructive-light"},{"type":"color","category":"border-color","value":"rgb(255, 185, 179)","comment":"Destructive focus border color","originalValue":"{!palette-red-20}","name":"color-border-destructive-lighter"},{"type":"color","category":"border-color","value":"rgb(172, 30, 22)","comment":"Error border color","originalValue":"{!palette-red-60}","name":"color-border-error"},{"type":"color","category":"border-color","value":"rgb(148, 8, 0)","comment":"Dark error border color","originalValue":"{!palette-red-70}","name":"color-border-error-dark"},{"type":"color","category":"border-color","value":"rgb(232, 83, 74)","comment":"Light error border color","originalValue":"{!palette-red-40}","name":"color-border-error-light"},{"type":"color","category":"border-color","value":"rgb(255, 233, 231)","comment":"Lightest error border color","originalValue":"{!palette-red-10}","name":"color-border-error-lightest"},{"type":"color","category":"border-color","value":"rgb(255, 255, 255)","comment":"Border on inverse backgrounds","originalValue":"{!palette-gray-0}","name":"color-border-inverse"},{"type":"color","category":"border-color","value":"rgb(182, 191, 206)","comment":"Light border color","originalValue":"{!palette-gray-50}","name":"color-border-light"},{"type":"color","category":"border-color","value":"rgb(204, 210, 220)","comment":"Lighter border color","originalValue":"{!palette-gray-40}","name":"color-border-lighter"},{"type":"color","category":"border-color","value":"rgb(182, 191, 206)","comment":"Light neutral border color","originalValue":"{!palette-gray-50}","name":"color-border-neutral-light"},{"type":"color","category":"border-color","value":"rgb(51, 104, 250)","comment":"Primary border color","originalValue":"{!palette-blue-50}","name":"color-border-primary"},{"type":"color","category":"border-color","value":"rgb(0, 44, 166)","comment":"Dark primary border color","originalValue":"{!palette-blue-70}","name":"color-border-primary-dark"},{"type":"color","category":"border-color","value":"rgb(0, 31, 117)","comment":"Darker primary border color","originalValue":"{!palette-blue-80}","name":"color-border-primary-darker"},{"type":"color","category":"border-color","value":"rgb(186, 204, 255)","comment":"Light primary border color","originalValue":"{!palette-blue-30}","name":"color-border-primary-light"},{"type":"color","category":"border-color","value":"rgb(219, 230, 255)","comment":"Lighter primary border color","originalValue":"{!palette-blue-20}","name":"color-border-primary-lighter"},{"type":"color","category":"border-color","value":"rgb(0, 153, 74)","comment":"Success border color","originalValue":"{!palette-green-60}","name":"color-border-success"},{"type":"color","category":"border-color","value":"rgb(224, 255, 239)","comment":"Lightest success border color","originalValue":"{!palette-green-10}","name":"color-border-success-lightest"},{"type":"color","category":"border-color","value":"rgb(228, 98, 22)","comment":"Warning border color","originalValue":"{!palette-orange-60}","name":"color-border-warning"},{"type":"color","category":"border-color","value":"rgb(250, 156, 102)","comment":"Light warning border color","originalValue":"{!palette-orange-40}","name":"color-border-warning-light"},{"type":"color","category":"border-color","value":"rgb(255, 236, 216)","comment":"Lightest warning border color","originalValue":"{!palette-orange-10}","name":"color-border-warning-lightest"}]
   },
@@ -11,0 +11,0 @@ {

dist/themes/sendgrid/tokens.ios.json

@@ -279,2 +279,9 @@ {
       "category": "border-color",
+      "value": "rgb(204, 210, 220)",
+      "comment": "Lighter border color",
+      "name": "colorBorderLighter"
+    },
+    {
+      "type": "color",
+      "category": "border-color",
       "value": "rgb(255, 233, 231)",
@@ -385,3 +392,3 @@ "comment": "Lightest error border color",
       "category": "border-color",
-      "value": "rgb(204, 210, 220)",
+      "value": "rgb(182, 191, 206)",
       "comment": "Light border color",
@@ -388,0 +395,0 @@ "name": "colorBorderLight"

dist/themes/sendgrid/tokens.json

@@ -41,2 +41,3 @@ {
   "color-border-success": "rgb(0, 153, 74)",
+  "color-border-lighter": "rgb(204, 210, 220)",
   "color-border-error-lightest": "rgb(255, 233, 231)",
@@ -57,3 +58,3 @@ "color-border-dark": "rgb(156, 167, 186)",
   "color-border-error-light": "rgb(232, 83, 74)",
-  "color-border-light": "rgb(204, 210, 220)",
+  "color-border-light": "rgb(182, 191, 206)",
   "border-radius-0": "0",
@@ -60,0 +61,0 @@ "border-radius-10": "3px",

dist/tokens.common.d.ts

@@ -54,3 +54,4 @@ export declare const borderRadius0 = "0";
 export declare const colorBorderInverse = "rgb(255, 255, 255)";
-export declare const colorBorderLight = "rgb(225, 227, 234)";
+export declare const colorBorderLight = "rgb(136, 145, 170)";
+export declare const colorBorderLighter = "rgb(174, 178, 193)";
 export declare const colorBorderNeutralLight = "rgb(136, 145, 170)";
@@ -263,3 +264,4 @@ export declare const colorBorderPrimary = "rgb(2, 99, 224)";
   colorBorderInverse: "rgb(255, 255, 255)";
-  colorBorderLight: "rgb(225, 227, 234)";
+  colorBorderLight: "rgb(136, 145, 170)";
+  colorBorderLighter: "rgb(174, 178, 193)";
   colorBorderNeutralLight: "rgb(136, 145, 170)";
@@ -266,0 +268,0 @@ colorBorderPrimary: "rgb(2, 99, 224)";

dist/tokens.common.js

@@ -54,3 +54,4 @@ const borderRadius0 = "0";
 const colorBorderInverse = "rgb(255, 255, 255)";
-const colorBorderLight = "rgb(225, 227, 234)";
+const colorBorderLight = "rgb(136, 145, 170)";
+const colorBorderLighter = "rgb(174, 178, 193)";
 const colorBorderNeutralLight = "rgb(136, 145, 170)";
@@ -273,2 +274,3 @@ const colorBorderPrimary = "rgb(2, 99, 224)";
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -482,2 +484,3 @@ colorBorderPrimary,
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -484,0 +487,0 @@ colorBorderPrimary,

dist/tokens.es6.d.ts

@@ -54,3 +54,4 @@ export declare const borderRadius0 = "0";
 export declare const colorBorderInverse = "rgb(255, 255, 255)";
-export declare const colorBorderLight = "rgb(225, 227, 234)";
+export declare const colorBorderLight = "rgb(136, 145, 170)";
+export declare const colorBorderLighter = "rgb(174, 178, 193)";
 export declare const colorBorderNeutralLight = "rgb(136, 145, 170)";
@@ -263,3 +264,4 @@ export declare const colorBorderPrimary = "rgb(2, 99, 224)";
   colorBorderInverse: "rgb(255, 255, 255)";
-  colorBorderLight: "rgb(225, 227, 234)";
+  colorBorderLight: "rgb(136, 145, 170)";
+  colorBorderLighter: "rgb(174, 178, 193)";
   colorBorderNeutralLight: "rgb(136, 145, 170)";
@@ -266,0 +268,0 @@ colorBorderPrimary: "rgb(2, 99, 224)";

dist/tokens.es6.js

@@ -54,3 +54,4 @@ export const borderRadius0 = "0";
 export const colorBorderInverse = "rgb(255, 255, 255)";
-export const colorBorderLight = "rgb(225, 227, 234)";
+export const colorBorderLight = "rgb(136, 145, 170)";
+export const colorBorderLighter = "rgb(174, 178, 193)";
 export const colorBorderNeutralLight = "rgb(136, 145, 170)";
@@ -264,2 +265,3 @@ export const colorBorderPrimary = "rgb(2, 99, 224)";
 colorBorderLight,
+colorBorderLighter,
 colorBorderNeutralLight,
@@ -266,0 +268,0 @@ colorBorderPrimary,

dist/tokens.gatsby.json

@@ -8,3 +8,3 @@ {
     "categoryName": "border-colors",
-    "tokens": [{"type":"color","category":"border-color","value":"rgb(174, 178, 193)","comment":"Default border color","originalValue":"{!palette-gray-40}","name":"color-border"},{"type":"color","category":"border-color","value":"rgb(96, 107, 133)","comment":"Dark border color","originalValue":"{!palette-gray-60}","name":"color-border-dark"},{"type":"color","category":"border-color","value":"rgb(214, 31, 31)","comment":"Destructive border color","originalValue":"{!palette-red-60}","name":"color-border-destructive"},{"type":"color","category":"border-color","value":"rgb(117, 12, 12)","comment":"Destructive focus border color","originalValue":"{!palette-red-80}","name":"color-border-destructive-dark"},{"type":"color","category":"border-color","value":"rgb(74, 11, 11)","comment":"Darker destructive hover border color","originalValue":"{!palette-red-90}","name":"color-border-destructive-darker"},{"type":"color","category":"border-color","value":"rgb(245, 138, 138)","comment":"Destructive focus border color","originalValue":"{!palette-red-40}","name":"color-border-destructive-light"},{"type":"color","category":"border-color","value":"rgb(252, 207, 207)","comment":"Destructive focus border color","originalValue":"{!palette-red-20}","name":"color-border-destructive-lighter"},{"type":"color","category":"border-color","value":"rgb(214, 31, 31)","comment":"Error border color","originalValue":"{!palette-red-60}","name":"color-border-error"},{"type":"color","category":"border-color","value":"rgb(117, 12, 12)","comment":"Dark error border color","originalValue":"{!palette-red-80}","name":"color-border-error-dark"},{"type":"color","category":"border-color","value":"rgb(245, 138, 138)","comment":"Light error border color","originalValue":"{!palette-red-40}","name":"color-border-error-light"},{"type":"color","category":"border-color","value":"rgb(254, 236, 236)","comment":"Lightest error border color","originalValue":"{!palette-red-10}","name":"color-border-error-lightest"},{"type":"color","category":"border-color","value":"rgb(255, 255, 255)","comment":"Border on inverse backgrounds","originalValue":"{!palette-gray-0}","name":"color-border-inverse"},{"type":"color","category":"border-color","value":"rgb(225, 227, 234)","comment":"Light border color","originalValue":"{!palette-gray-20}","name":"color-border-light"},{"type":"color","category":"border-color","value":"rgb(136, 145, 170)","comment":"Light neutral border color","originalValue":"{!palette-gray-50}","name":"color-border-neutral-light"},{"type":"color","category":"border-color","value":"rgb(2, 99, 224)","comment":"Primary border color","originalValue":"{!palette-blue-60}","name":"color-border-primary"},{"type":"color","category":"border-color","value":"rgb(0, 20, 137)","comment":"Dark primary border color","originalValue":"{!palette-blue-80}","name":"color-border-primary-dark"},{"type":"color","category":"border-color","value":"rgb(3, 11, 93)","comment":"Darker primary border color","originalValue":"{!palette-blue-90}","name":"color-border-primary-darker"},{"type":"color","category":"border-color","value":"rgb(102, 179, 255)","comment":"Light primary border color","originalValue":"{!palette-blue-40}","name":"color-border-primary-light"},{"type":"color","category":"border-color","value":"rgb(204, 228, 255)","comment":"Lighter primary border color","originalValue":"{!palette-blue-20}","name":"color-border-primary-lighter"},{"type":"color","category":"border-color","value":"rgb(20, 176, 83)","comment":"Success border color","originalValue":"{!palette-green-60}","name":"color-border-success"},{"type":"color","category":"border-color","value":"rgb(237, 253, 243)","comment":"Lightest success border color","originalValue":"{!palette-green-10}","name":"color-border-success-lightest"},{"type":"color","category":"border-color","value":"rgb(244, 124, 34)","comment":"Warning border color","originalValue":"{!palette-orange-60}","name":"color-border-warning"},{"type":"color","category":"border-color","value":"rgb(255, 179, 122)","comment":"Light warning border color","originalValue":"{!palette-orange-40}","name":"color-border-warning-light"},{"type":"color","category":"border-color","value":"rgb(254, 245, 238)","comment":"Lightest warning border color","originalValue":"{!palette-orange-10}","name":"color-border-warning-lightest"}]
+    "tokens": [{"type":"color","category":"border-color","value":"rgb(174, 178, 193)","comment":"Default border color","originalValue":"{!palette-gray-40}","name":"color-border"},{"type":"color","category":"border-color","value":"rgb(96, 107, 133)","comment":"Dark border color","originalValue":"{!palette-gray-60}","name":"color-border-dark"},{"type":"color","category":"border-color","value":"rgb(214, 31, 31)","comment":"Destructive border color","originalValue":"{!palette-red-60}","name":"color-border-destructive"},{"type":"color","category":"border-color","value":"rgb(117, 12, 12)","comment":"Destructive focus border color","originalValue":"{!palette-red-80}","name":"color-border-destructive-dark"},{"type":"color","category":"border-color","value":"rgb(74, 11, 11)","comment":"Darker destructive hover border color","originalValue":"{!palette-red-90}","name":"color-border-destructive-darker"},{"type":"color","category":"border-color","value":"rgb(245, 138, 138)","comment":"Destructive focus border color","originalValue":"{!palette-red-40}","name":"color-border-destructive-light"},{"type":"color","category":"border-color","value":"rgb(252, 207, 207)","comment":"Destructive focus border color","originalValue":"{!palette-red-20}","name":"color-border-destructive-lighter"},{"type":"color","category":"border-color","value":"rgb(214, 31, 31)","comment":"Error border color","originalValue":"{!palette-red-60}","name":"color-border-error"},{"type":"color","category":"border-color","value":"rgb(117, 12, 12)","comment":"Dark error border color","originalValue":"{!palette-red-80}","name":"color-border-error-dark"},{"type":"color","category":"border-color","value":"rgb(245, 138, 138)","comment":"Light error border color","originalValue":"{!palette-red-40}","name":"color-border-error-light"},{"type":"color","category":"border-color","value":"rgb(254, 236, 236)","comment":"Lightest error border color","originalValue":"{!palette-red-10}","name":"color-border-error-lightest"},{"type":"color","category":"border-color","value":"rgb(255, 255, 255)","comment":"Border on inverse backgrounds","originalValue":"{!palette-gray-0}","name":"color-border-inverse"},{"type":"color","category":"border-color","value":"rgb(136, 145, 170)","comment":"Light border color","originalValue":"{!palette-gray-50}","name":"color-border-light"},{"type":"color","category":"border-color","value":"rgb(174, 178, 193)","comment":"Lighter border color","originalValue":"{!palette-gray-40}","name":"color-border-lighter"},{"type":"color","category":"border-color","value":"rgb(136, 145, 170)","comment":"Light neutral border color","originalValue":"{!palette-gray-50}","name":"color-border-neutral-light"},{"type":"color","category":"border-color","value":"rgb(2, 99, 224)","comment":"Primary border color","originalValue":"{!palette-blue-60}","name":"color-border-primary"},{"type":"color","category":"border-color","value":"rgb(0, 20, 137)","comment":"Dark primary border color","originalValue":"{!palette-blue-80}","name":"color-border-primary-dark"},{"type":"color","category":"border-color","value":"rgb(3, 11, 93)","comment":"Darker primary border color","originalValue":"{!palette-blue-90}","name":"color-border-primary-darker"},{"type":"color","category":"border-color","value":"rgb(102, 179, 255)","comment":"Light primary border color","originalValue":"{!palette-blue-40}","name":"color-border-primary-light"},{"type":"color","category":"border-color","value":"rgb(204, 228, 255)","comment":"Lighter primary border color","originalValue":"{!palette-blue-20}","name":"color-border-primary-lighter"},{"type":"color","category":"border-color","value":"rgb(20, 176, 83)","comment":"Success border color","originalValue":"{!palette-green-60}","name":"color-border-success"},{"type":"color","category":"border-color","value":"rgb(237, 253, 243)","comment":"Lightest success border color","originalValue":"{!palette-green-10}","name":"color-border-success-lightest"},{"type":"color","category":"border-color","value":"rgb(244, 124, 34)","comment":"Warning border color","originalValue":"{!palette-orange-60}","name":"color-border-warning"},{"type":"color","category":"border-color","value":"rgb(255, 179, 122)","comment":"Light warning border color","originalValue":"{!palette-orange-40}","name":"color-border-warning-light"},{"type":"color","category":"border-color","value":"rgb(254, 245, 238)","comment":"Lightest warning border color","originalValue":"{!palette-orange-10}","name":"color-border-warning-lightest"}]
   },
@@ -11,0 +11,0 @@ {

dist/tokens.ios.json

@@ -279,2 +279,9 @@ {
       "category": "border-color",
+      "value": "rgb(174, 178, 193)",
+      "comment": "Lighter border color",
+      "name": "colorBorderLighter"
+    },
+    {
+      "type": "color",
+      "category": "border-color",
       "value": "rgb(254, 236, 236)",
@@ -385,3 +392,3 @@ "comment": "Lightest error border color",
       "category": "border-color",
-      "value": "rgb(225, 227, 234)",
+      "value": "rgb(136, 145, 170)",
       "comment": "Light border color",
@@ -388,0 +395,0 @@ "name": "colorBorderLight"

dist/tokens.json

@@ -41,2 +41,3 @@ {
   "color-border-success": "rgb(20, 176, 83)",
+  "color-border-lighter": "rgb(174, 178, 193)",
   "color-border-error-lightest": "rgb(254, 236, 236)",
@@ -57,3 +58,3 @@ "color-border-dark": "rgb(96, 107, 133)",
   "color-border-error-light": "rgb(245, 138, 138)",
-  "color-border-light": "rgb(225, 227, 234)",
+  "color-border-light": "rgb(136, 145, 170)",
   "border-radius-0": "0",
@@ -60,0 +61,0 @@ "border-radius-10": "3px",

package.json

 {
   "name": "@twilio-paste/design-tokens",
-  "version": "5.3.2",
+  "version": "5.4.0",
   "description": "Paste Design System Tokens package with a number of different formats for Web, Mobile, and Sketch.",
@@ -24,3 +24,3 @@ "main": "dist/tokens.common.js",
   },
-  "gitHead": "58f1b343222a2f6f59c2c9a00ee41de74410b71c"
+  "gitHead": "36be3707496710858e07844707336b84ff66736d"
 }

No alert changes

Improved metrics

Total package byte prevSize

948022

increased by0.52%

Lines of code

20253

increased by0.42%

No dependency changes