@thecb/components 7.10.4 → 7.10.5-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "7.10.4",
+  "version": "7.10.5-beta.2",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "typings": "dist/index.d.ts",

package/src/constants/colors.js

@@ -14,6 +14,7 @@ const ALABASTER_WHITE = "#F7F7F7";
 const AQUA_HAZE_WHITE = "#F7F9FA";
 const BLEACH_WHITE = "#FEF4d7";
 const CATSKILL_WHITE = "#EAF2F6";
+const HALF_COLONIAL_WHITE = "#FDF4D2";
 // GREY
 const ATHENS_GREY = "#F6F6F9"; // CBS-100
 const ALTO_GREY = "#d1d1d1";
@@ -116,6 +117,26 @@ const ALERT_COLORS = {
   link: SCIENCE_BLUE
 };
 
+// These pill colors match the current CityBase design and are grouped for convenience.
+const PILL_COLORS = {
+  danger: {
+    background: RAZZMATAZZ_RED,
+    text: BLUSH_RED
+  },
+  neutral: {
+    background: GRECIAN_GREY,
+    text: CHARADE_GREY
+  },
+  success: {
+    background: HINT_GREEN,
+    text: SEA_GREEN
+  },
+  warning: {
+    background: ZEST_ORANGE,
+    text: HALF_COLONIAL_WHITE
+  }
+};
+
 export {
   BLACK,
   TRANSPARENT,
@@ -177,6 +198,7 @@ export {
   SELECTIVE_YELLOW,
   MUSTARD_YELLOW,
   FIRE_YELLOW,
+  HALF_COLONIAL_WHITE,
   CARROT_ORANGE,
   ZEST_ORANGE,
   APRICOT_ORANGE,
@@ -189,5 +211,6 @@ export {
   BLUSH_RED,
   RASPBERRY,
   ALERT_COLORS,
+  PILL_COLORS,
   ERROR_COLOR
 };