@hsds/tokens - npm Package Compare versions

Comparing version 7.9.2-alpha.5 to 7.9.2-alpha.6

CHANGELOG.md

@@ -5,2 +5,16 @@ # Changelog
 
+### [7.9.2-alpha.6](https://github.com/helpscout/hsds/compare/tokens-7.9.2-alpha.5...tokens-7.9.2-alpha.6) (2023-08-21)
+
+
+### Features
+
+* **tokens:** adds statusbar tokens ([a2f8b93](https://github.com/helpscout/hsds/commit/a2f8b9307201fc91ae9803ebbb6db188d7cc271b))
+* **tokens:** generate latest tokens ([0444cde](https://github.com/helpscout/hsds/commit/0444cded6b2601eb7ed661eea01d00fcd55d4f2f))
+* **tokens:** updates to latest cobalt palette ([6ba8018](https://github.com/helpscout/hsds/commit/6ba801855b04f8f08e0c0530e83957d2a63f1784))
+
+
+### Bug Fixes
+
+* **tokens:** update incorrect values in tokens ([ea0e3fe](https://github.com/helpscout/hsds/commit/ea0e3fef2800a58b6401c5bc7ac6762ee5b815c1))
+
 ### [7.9.2-alpha.5](https://github.com/helpscout/hsds/compare/tokens-0.1.0...tokens-7.9.2-alpha.5) (2023-08-10)
@@ -7,0 +21,0 @@

js/default/badge.js

@@ -7,29 +7,5 @@ "use strict";
   color: {
-    default: '#93A1B0',
-    status: {
-      error: '#e52f28',
-      info: '#1292EE',
-      success: '#56C288',
-      warning: '#FFC555'
-    },
-    statusInverted: {
-      error: {
-        border: '#e52f28',
-        text: '#e52f28'
-      },
-      info: {
-        border: '#1292EE',
-        text: '#1292EE'
-      },
-      success: {
-        border: '#56C288',
-        text: '#56C288'
-      },
-      warning: {
-        border: '#FFC555',
-        text: '#FFC555'
-      }
-    }
+    default: '#93A1B0'
   }
 };
 exports.badge = badge;

js/default/color.js

@@ -189,4 +189,8 @@ "use strict";
       backgroundColor: '#ffe3e2',
+      backgroundLight: '#ffe3e2',
+      backgroundDark: '#e52f28',
       borderColor: '#e52f28',
-      color: '#9d1f1a'
+      icon: '#e52f28',
+      color: '#e52f28',
+      text: '#e52f28'
     },
@@ -196,4 +200,8 @@ error: {
       backgroundColor: '#ffe3e2',
+      backgroundLight: '#ffe3e2',
+      backgroundDark: '#e52f28',
       borderColor: '#e52f28',
-      color: '#9d1f1a'
+      icon: '#e52f28',
+      color: '#e52f28',
+      text: '#e52f28'
     },
@@ -203,4 +211,8 @@ info: {
       backgroundColor: '#D6EDFF',
+      backgroundLight: '#D6EDFF',
+      backgroundDark: '#1292EE',
       borderColor: '#1292EE',
-      color: '#034077'
+      icon: '#1292EE',
+      color: '#1292EE',
+      text: '#1292EE'
     },
@@ -210,4 +222,8 @@ success: {
       backgroundColor: '#E3FBEE',
+      backgroundLight: '#E3FBEE',
+      backgroundDark: '#56C288',
       borderColor: '#56C288',
-      color: '#106236'
+      icon: '#56C288',
+      color: '#56C288',
+      text: '#56C288'
     },
@@ -217,4 +233,8 @@ warning: {
       backgroundColor: '#FFF2D7',
+      backgroundLight: '#FFF2D7',
+      backgroundDark: '#FFC555',
       borderColor: '#FFC555',
-      color: '#CE7129'
+      icon: '#FFC555',
+      color: '#FFC555',
+      text: '#FFC555'
     }
@@ -221,0 +241,0 @@ },

js/default/index.js

@@ -10,2 +10,3 @@ "use strict";
 var _datePicker = require("./datePicker");
+var _statusBar = require("./statusBar");
 var _statusDot = require("./statusDot");
@@ -20,2 +21,3 @@ var _styledComponents = require("./styled-components");
   datePicker: _datePicker.datePicker,
+  statusBar: _statusBar.statusBar,
   statusDot: _statusDot.statusDot,
@@ -22,0 +24,0 @@ switchComponent: _switchComponent.switchComponent,

js/default/styled-components.js

@@ -6,3 +6,3 @@ "use strict";
 var _styledComponents = require("styled-components");
-const tokens = (0, _styledComponents.css)(["--hsds-attachment-color-removeButton-hover:var(--hsds-color-pink-1000);--hsds-attachment-color-removeButton-borderHover:var(--hsds-color-pink-900);--hsds-attachment-color-error:var(--hsds-color-red-500);--hsds-badge-color-default:var(--hsds-color-charcoal-200);--hsds-badge-color-status-error:var(--hsds-color-state-error-borderColor);--hsds-badge-color-status-info:var(--hsds-color-state-info-borderColor);--hsds-badge-color-status-success:var( --hsds-color-state-success-borderColor );--hsds-badge-color-status-warning:var( --hsds-color-state-warning-borderColor );--hsds-badge-color-statusInverted-error-border:var( --hsds-color-state-error-borderColor );--hsds-badge-color-statusInverted-error-text:var( --hsds-color-state-error-borderColor );--hsds-badge-color-statusInverted-info-border:var( --hsds-color-state-info-borderColor );--hsds-badge-color-statusInverted-info-text:var( --hsds-color-state-info-borderColor );--hsds-badge-color-statusInverted-success-border:var( --hsds-color-state-success-borderColor );--hsds-badge-color-statusInverted-success-text:var( --hsds-color-state-success-borderColor );--hsds-badge-color-statusInverted-warning-border:var( --hsds-color-state-warning-borderColor );--hsds-badge-color-statusInverted-warning-text:var( --hsds-color-state-warning-borderColor );--hsds-button-color-blue-main:var(--hsds-color-blue-500);--hsds-button-color-blue-hover:var(--hsds-color-blue-600);--hsds-button-color-blue-text:white;--hsds-button-color-blue-outline-border:var(--hsds-color-blue-500);--hsds-button-color-blue-outline-borderHover:var(--hsds-color-blue-500);--hsds-button-color-blue-outline-text:var(--hsds-color-blue-600);--hsds-button-color-blue-outline-textHover:var(--hsds-color-blue-700);--hsds-button-color-blue-outline-hover:var(--hsds-color-blue-100);--hsds-button-color-blue-outline-hoverIconOnly:var(--hsds-color-blue-200);--hsds-button-color-blue-outline-textSeamlessHover:var( --hsds-color-blue-800 );--hsds-button-color-red-main:var(--hsds-color-pink-950);--hsds-button-color-red-hover:var(--hsds-color-pink-1000);--hsds-button-color-red-text:white;--hsds-button-color-red-outline-border:var(--hsds-color-pink-900);--hsds-button-color-red-outline-borderHover:var(--hsds-color-pink-900);--hsds-button-color-red-outline-text:var(--hsds-color-pink-950);--hsds-button-color-red-outline-textHover:var(--hsds-color-pink-1000);--hsds-button-color-red-outline-hover:var(--hsds-color-pink-100);--hsds-button-color-red-outline-hoverIconOnly:var(--hsds-color-pink-200);--hsds-button-color-red-outline-textSeamlessHover:var( --hsds-color-pink-1000 );--hsds-button-color-green-main:var(--hsds-color-green-750);--hsds-button-color-green-hover:var(--hsds-color-green-800);--hsds-button-color-green-text:white;--hsds-button-color-green-outline-border:var(--hsds-color-green-500);--hsds-button-color-green-outline-borderHover:var(--hsds-color-green-500);--hsds-button-color-green-outline-text:var(--hsds-color-green-750);--hsds-button-color-green-outline-textHover:var(--hsds-color-green-800);--hsds-button-color-green-outline-hover:var(--hsds-color-green-100);--hsds-button-color-green-outline-hoverIconOnly:var(--hsds-color-green-200);--hsds-button-color-green-outline-textSeamlessHover:var( --hsds-color-green-900 );--hsds-button-color-grey-main:var(--hsds-color-charcoal-400);--hsds-button-color-grey-hover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-text:white;--hsds-button-color-grey-outline-border:var(--hsds-color-grey-700);--hsds-button-color-grey-outline-borderHover:var(--hsds-color-grey-800);--hsds-button-color-grey-outline-text:var(--hsds-color-charcoal-400);--hsds-button-color-grey-outline-textHover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-outline-hover:var(--hsds-color-grey-200);--hsds-button-color-grey-outline-hoverIconOnly:var(--hsds-color-grey-300);--hsds-button-color-grey-outline-textSeamlessHover:var( --hsds-color-charcoal-800 );--hsds-button-color-yellow-main:var(--hsds-color-orange-600);--hsds-button-color-yellow-hover:var(--hsds-color-orange-700);--hsds-button-color-yellow-text:white;--hsds-button-color-yellow-outline-border:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-borderHover:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-text:var(--hsds-color-orange-600);--hsds-button-color-yellow-outline-textHover:var(--hsds-color-orange-700);--hsds-button-color-yellow-outline-hover:var(--hsds-color-yellow-100);--hsds-button-color-yellow-outline-hoverIconOnly:var( --hsds-color-yellow-100 );--hsds-button-color-yellow-outline-textSeamlessHover:var( --hsds-color-orange-700 );--hsds-button-color-disabled-main:var(--hsds-color-grey-500);--hsds-button-color-disabled-text:white;--hsds-button-color-disabled-outline-border:var(--hsds-color-grey-600);--hsds-button-color-disabled-outline-text:var(--hsds-color-grey-800);--hsds-datePicker-color-range-background:var(--hsds-color-blue-200);--hsds-datePicker-color-range-selectedBackground:var(--hsds-color-blue-500);--hsds-datePicker-color-range-text:var(--hsds-color-blue-500);--hsds-datePicker-color-range-textHover:var(--hsds-color-blue-600);--hsds-datePicker-color-current-background:var(--hsds-color-grey-300);--hsds-datePicker-color-current-text:var(--hsds-color-charcoal-700);--hsds-statusDot-color-light-default:var(--hsds-color-grey-600);--hsds-statusDot-color-light-active:var(--hsds-color-green-500);--hsds-statusDot-color-light-inactive:var(--hsds-color-grey-600);--hsds-statusDot-color-light-offline:var(--hsds-color-red-500);--hsds-statusDot-color-light-busy:var(--hsds-color-yellow-500);--hsds-statusDot-color-light-custom:var(--hsds-color-purple-400);--hsds-statusDot-color-dark-default:var(--hsds-color-grey-600);--hsds-statusDot-color-dark-active:var(--hsds-color-green-500);--hsds-statusDot-color-dark-inactive:var(--hsds-color-grey-600);--hsds-statusDot-color-dark-offline:var(--hsds-color-red-500);--hsds-statusDot-color-dark-busy:var(--hsds-color-yellow-500);--hsds-statusDot-color-dark-custom:var(--hsds-color-purple-400);--hsds-switchComponent-color-error:var(--hsds-color-pink-900);--hsds-verificationCode-color-error:var(--hsds-color-pink-900);--hsds-color-red-100:#fef7f6;--hsds-color-red-100-rgb:254,247,246;--hsds-color-red-200:#ffe3e2;--hsds-color-red-200-rgb:255,227,226;--hsds-color-red-300:#ffa2a2;--hsds-color-red-300-rgb:255,162,162;--hsds-color-red-400:#f45b55;--hsds-color-red-400-rgb:244,91,85;--hsds-color-red-500:#e52f28;--hsds-color-red-500-rgb:229,47,40;--hsds-color-red-600:#d21b14;--hsds-color-red-600-rgb:210,27,20;--hsds-color-red-700:#ba1f19;--hsds-color-red-700-rgb:186,31,25;--hsds-color-red-800:#9d1f1a;--hsds-color-red-800-rgb:157,31,26;--hsds-color-red-900:#731814;--hsds-color-red-900-rgb:115,24,20;--hsds-color-red-default:var(--hsds-color-red-500);--hsds-color-purple-100:#fbfbfe;--hsds-color-purple-100-rgb:251,251,254;--hsds-color-purple-200:#eaeafc;--hsds-color-purple-200-rgb:234,234,252;--hsds-color-purple-300:#d1d2f6;--hsds-color-purple-300-rgb:209,210,246;--hsds-color-purple-400:#a3a4f3;--hsds-color-purple-400-rgb:163,164,243;--hsds-color-purple-500:#7e80e7;--hsds-color-purple-500-rgb:126,128,231;--hsds-color-purple-600:#696aca;--hsds-color-purple-600-rgb:105,106,202;--hsds-color-purple-700:#585b9e;--hsds-color-purple-700-rgb:88,91,158;--hsds-color-purple-800:#45467d;--hsds-color-purple-800-rgb:69,70,125;--hsds-color-purple-900:#383966;--hsds-color-purple-900-rgb:56,57,102;--hsds-color-purple-default:var(--hsds-color-purple-500);--hsds-color-orange-100:#fff8f2;--hsds-color-orange-100-rgb:255,248,242;--hsds-color-orange-200:#ffead8;--hsds-color-orange-200-rgb:255,234,216;--hsds-color-orange-300:#ffd3ae;--hsds-color-orange-300-rgb:255,211,174;--hsds-color-orange-400:#ffa75a;--hsds-color-orange-400-rgb:255,167,90;--hsds-color-orange-500:#ff9139;--hsds-color-orange-500-rgb:255,145,57;--hsds-color-orange-600:#e87800;--hsds-color-orange-600-rgb:232,120,0;--hsds-color-orange-700:#c76400;--hsds-color-orange-700-rgb:199,100,0;--hsds-color-orange-800:#a45300;--hsds-color-orange-800-rgb:164,83,0;--hsds-color-orange-900:#813c00;--hsds-color-orange-900-rgb:129,60,0;--hsds-color-orange-default:var(--hsds-color-orange-500);--hsds-color-blue-100:#f3fbff;--hsds-color-blue-100-rgb:243,251,255;--hsds-color-blue-200:#d6edff;--hsds-color-blue-200-rgb:214,237,255;--hsds-color-blue-300:#a0d4ff;--hsds-color-blue-300-rgb:160,212,255;--hsds-color-blue-400:#57b0fb;--hsds-color-blue-400-rgb:87,176,251;--hsds-color-blue-500:#1292ee;--hsds-color-blue-500-rgb:18,146,238;--hsds-color-blue-600:#0077cc;--hsds-color-blue-600-rgb:0,119,204;--hsds-color-blue-700:#005ca4;--hsds-color-blue-700-rgb:0,92,164;--hsds-color-blue-800:#034077;--hsds-color-blue-800-rgb:3,64,119;--hsds-color-blue-900:#002651;--hsds-color-blue-900-rgb:0,38,81;--hsds-color-blue-default:var(--hsds-color-blue-500);--hsds-color-charcoal-200:#93a1b0;--hsds-color-charcoal-200-rgb:147,161,176;--hsds-color-charcoal-300:#748494;--hsds-color-charcoal-300-rgb:116,132,148;--hsds-color-charcoal-400:#556575;--hsds-color-charcoal-400-rgb:85,101,117;--hsds-color-charcoal-500:#405261;--hsds-color-charcoal-500-rgb:64,82,97;--hsds-color-charcoal-600:#314351;--hsds-color-charcoal-600-rgb:49,67,81;--hsds-color-charcoal-700:#253642;--hsds-color-charcoal-700-rgb:37,54,66;--hsds-color-charcoal-800:#1d2b36;--hsds-color-charcoal-800-rgb:29,43,54;--hsds-color-charcoal-default:var(--hsds-color-charcoal-500);--hsds-color-ash-200:#f9fafa;--hsds-color-ash-200-rgb:249,250,250;--hsds-color-ash-300:#f1f3f5;--hsds-color-ash-300-rgb:241,243,245;--hsds-color-ash-400:#e5e9ec;--hsds-color-ash-400-rgb:229,233,236;--hsds-color-ash-500:#d5dce1;--hsds-color-ash-500-rgb:213,220,225;--hsds-color-ash-600:#c5ced6;--hsds-color-ash-600-rgb:197,206,214;--hsds-color-ash-700:#b7c2cc;--hsds-color-ash-700-rgb:183,194,204;--hsds-color-ash-800:#a5b2bd;--hsds-color-ash-800-rgb:165,178,189;--hsds-color-ash-default:var(--hsds-color-ash-500);--hsds-color-grey-200:#f9fafa;--hsds-color-grey-200-rgb:249,250,250;--hsds-color-grey-300:#f1f3f5;--hsds-color-grey-300-rgb:241,243,245;--hsds-color-grey-400:#e5e9ec;--hsds-color-grey-400-rgb:229,233,236;--hsds-color-grey-500:#d5dce1;--hsds-color-grey-500-rgb:213,220,225;--hsds-color-grey-600:#c5ced6;--hsds-color-grey-600-rgb:197,206,214;--hsds-color-grey-700:#b7c2cc;--hsds-color-grey-700-rgb:183,194,204;--hsds-color-grey-800:#a5b2bd;--hsds-color-grey-800-rgb:165,178,189;--hsds-color-grey-default:var(--hsds-color-grey-500);--hsds-color-yellow-50:#fffbf3;--hsds-color-yellow-100:#fff9ef;--hsds-color-yellow-100-rgb:255,249,239;--hsds-color-yellow-200:#fff2d7;--hsds-color-yellow-200-rgb:255,242,215;--hsds-color-yellow-300:#ffe7b8;--hsds-color-yellow-300-rgb:255,231,184;--hsds-color-yellow-400:#fdd88e;--hsds-color-yellow-400-rgb:253,216,142;--hsds-color-yellow-500:#ffc555;--hsds-color-yellow-500-rgb:255,197,85;--hsds-color-yellow-600:#fab347;--hsds-color-yellow-600-rgb:250,179,71;--hsds-color-yellow-700:#e89635;--hsds-color-yellow-700-rgb:232,150,53;--hsds-color-yellow-800:#ce7129;--hsds-color-yellow-800-rgb:206,113,41;--hsds-color-yellow-900:#b24319;--hsds-color-yellow-900-rgb:178,67,25;--hsds-color-yellow-950:#84142d;--hsds-color-yellow-950-rgb:132,20,45;--hsds-color-yellow-default:var(--hsds-color-yellow-500);--hsds-color-green-100:#f5fff9;--hsds-color-green-100-rgb:245,255,249;--hsds-color-green-200:#e3fbee;--hsds-color-green-200-rgb:227,251,238;--hsds-color-green-300:#c2f0d7;--hsds-color-green-300-rgb:194,240,215;--hsds-color-green-400:#87dbae;--hsds-color-green-400-rgb:135,219,174;--hsds-color-green-500:#56c288;--hsds-color-green-500-rgb:86,194,136;--hsds-color-green-600:#39ac6e;--hsds-color-green-600-rgb:57,172,110;--hsds-color-green-700:#268c55;--hsds-color-green-700-rgb:38,140,85;--hsds-color-green-750:#248451;--hsds-color-green-750-rgb:36,132,81;--hsds-color-green-800:#106236;--hsds-color-green-800-rgb:16,98,54;--hsds-color-green-900:#003c1c;--hsds-color-green-900-rgb:0,60,28;--hsds-color-green-default:var(--hsds-color-green-500);--hsds-color-pink-100:#fff9fb;--hsds-color-pink-100-rgb:255,249,251;--hsds-color-pink-200:#ffeef1;--hsds-color-pink-200-rgb:255,238,241;--hsds-color-pink-300:#ffe1e7;--hsds-color-pink-300-rgb:255,225,231;--hsds-color-pink-400:#ffccd7;--hsds-color-pink-400-rgb:255,204,215;--hsds-color-pink-500:#ffb3c3;--hsds-color-pink-500-rgb:255,179,195;--hsds-color-pink-600:#fd9aae;--hsds-color-pink-600-rgb:253,154,174;--hsds-color-pink-700:#fd9aae;--hsds-color-pink-700-rgb:253,154,174;--hsds-color-pink-800:#fc5d7d;--hsds-color-pink-800-rgb:252,93,125;--hsds-color-pink-900:#f23459;--hsds-color-pink-900-rgb:242,52,89;--hsds-color-pink-950:#e9074b;--hsds-color-pink-950-rgb:233,7,75;--hsds-color-pink-1000:#c5003b;--hsds-color-pink-1000-rgb:197,0,59;--hsds-color-pink-default:var(--hsds-color-pink-500);--hsds-color-lavender-100:#f9f9ff;--hsds-color-lavender-100-rgb:249,249,255;--hsds-color-lavender-200:#ebecff;--hsds-color-lavender-200-rgb:235,236,255;--hsds-color-lavender-300:#d9dcfd;--hsds-color-lavender-300-rgb:217,220,253;--hsds-color-lavender-400:#b9beff;--hsds-color-lavender-400-rgb:185,190,255;--hsds-color-lavender-500:#9fa6ff;--hsds-color-lavender-500-rgb:159,166,255;--hsds-color-lavender-600:#818aec;--hsds-color-lavender-600-rgb:129,138,236;--hsds-color-lavender-700:#6269c5;--hsds-color-lavender-700-rgb:98,105,197;--hsds-color-lavender-800:#404996;--hsds-color-lavender-800-rgb:64,73,150;--hsds-color-lavender-900:#232a5c;--hsds-color-lavender-900-rgb:35,42,92;--hsds-color-lavender-default:var(--hsds-color-lavender-500);--hsds-color-indigo-100:#f2f6ff;--hsds-color-indigo-100-rgb:242,246,255;--hsds-color-indigo-200:#dfe7ff;--hsds-color-indigo-200-rgb:223,231,255;--hsds-color-indigo-300:#b2c8fb;--hsds-color-indigo-300-rgb:178,200,251;--hsds-color-indigo-400:#79a1f8;--hsds-color-indigo-400-rgb:121,161,248;--hsds-color-indigo-500:#527ceb;--hsds-color-indigo-500-rgb:82,124,235;--hsds-color-indigo-600:#3b64d2;--hsds-color-indigo-600-rgb:59,100,210;--hsds-color-indigo-700:#2549a8;--hsds-color-indigo-700-rgb:37,73,168;--hsds-color-indigo-800:#16337f;--hsds-color-indigo-800-rgb:22,51,127;--hsds-color-indigo-900:#071e57;--hsds-color-indigo-900-rgb:7,30,87;--hsds-color-indigo-default:var(--hsds-color-indigo-500);--hsds-color-whaletail-100:#f3f7ff;--hsds-color-whaletail-100-rgb:243,247,255;--hsds-color-whaletail-200:#e5edfe;--hsds-color-whaletail-200-rgb:229,237,254;--hsds-color-whaletail-300:#d0defd;--hsds-color-whaletail-300-rgb:208,222,253;--hsds-color-whaletail-400:#afc7f9;--hsds-color-whaletail-400-rgb:175,199,249;--hsds-color-whaletail-500:#8aabf1;--hsds-color-whaletail-500-rgb:138,171,241;--hsds-color-whaletail-600:#7296e1;--hsds-color-whaletail-600-rgb:114,150,225;--hsds-color-whaletail-700:#5174bb;--hsds-color-whaletail-700-rgb:81,116,187;--hsds-color-whaletail-800:#304f8b;--hsds-color-whaletail-800-rgb:48,79,139;--hsds-color-whaletail-900:#142f5e;--hsds-color-whaletail-900-rgb:20,47,94;--hsds-color-whaletail-default:var(--hsds-color-whaletail-500);--hsds-color-link-default:var(--hsds-color-blue-600);--hsds-color-link-base:var(--hsds-color-blue-600);--hsds-color-link-hover:var(--hsds-color-blue-500);--hsds-color-link-active:var(--hsds-color-blue-500);--hsds-color-link-focus:var(--hsds-color-blue-500);--hsds-color-link-disabled:var(--hsds-color-grey-800);--hsds-color-text-default:currentColor;--hsds-color-text-subtle:var(--hsds-color-charcoal-500);--hsds-color-text-slightlyMuted:var(--hsds-color-charcoal-400);--hsds-color-text-muted:var(--hsds-color-charcoal-300);--hsds-color-text-faint:var(--hsds-color-charcoal-200);--hsds-color-text-extraMuted:var(--hsds-color-grey-600);--hsds-color-border-default:var(--hsds-color-grey-400);--hsds-color-border-divider:var(--hsds-color-grey-300);--hsds-color-border-ui-default:var(--hsds-color-grey-500);--hsds-color-border-ui-dark:var(--hsds-color-grey-600);--hsds-color-state-danger-default:var(--hsds-color-red-500);--hsds-color-state-danger-backgroundColor:var(--hsds-color-red-200);--hsds-color-state-danger-borderColor:var(--hsds-color-red-500);--hsds-color-state-danger-color:var(--hsds-color-red-800);--hsds-color-state-error-default:var(--hsds-color-state-danger-default);--hsds-color-state-error-backgroundColor:var( --hsds-color-state-danger-backgroundColor );--hsds-color-state-error-borderColor:var( --hsds-color-state-danger-borderColor );--hsds-color-state-error-color:var(--hsds-color-state-danger-color);--hsds-color-state-info-default:var(--hsds-color-blue-500);--hsds-color-state-info-backgroundColor:var(--hsds-color-blue-200);--hsds-color-state-info-borderColor:var(--hsds-color-blue-500);--hsds-color-state-info-color:var(--hsds-color-blue-800);--hsds-color-state-success-default:var(--hsds-color-green-500);--hsds-color-state-success-backgroundColor:var(--hsds-color-green-200);--hsds-color-state-success-borderColor:var(--hsds-color-green-500);--hsds-color-state-success-color:var(--hsds-color-green-800);--hsds-color-state-warning-default:var(--hsds-color-yellow-500);--hsds-color-state-warning-backgroundColor:var(--hsds-color-yellow-200);--hsds-color-state-warning-borderColor:var(--hsds-color-yellow-500);--hsds-color-state-warning-color:var(--hsds-color-yellow-800);--hsds-color-button-border:#d5d5d5;--hsds-color-button-hover:#e6e6e6;--hsds-color-button-active:#b6b6b6;--hsds-color-focusRing:var(--hsds-color-blue-500);"]);
+const tokens = (0, _styledComponents.css)(["--hsds-attachment-color-removeButton-hover:var(--hsds-color-pink-1000);--hsds-attachment-color-removeButton-borderHover:var(--hsds-color-pink-900);--hsds-attachment-color-error:var(--hsds-color-red-500);--hsds-badge-color-default:var(--hsds-color-charcoal-200);--hsds-button-color-blue-main:var(--hsds-color-blue-500);--hsds-button-color-blue-hover:var(--hsds-color-blue-600);--hsds-button-color-blue-text:white;--hsds-button-color-blue-outline-border:var(--hsds-color-blue-500);--hsds-button-color-blue-outline-borderHover:var(--hsds-color-blue-500);--hsds-button-color-blue-outline-text:var(--hsds-color-blue-600);--hsds-button-color-blue-outline-textHover:var(--hsds-color-blue-700);--hsds-button-color-blue-outline-hover:var(--hsds-color-blue-100);--hsds-button-color-blue-outline-hoverIconOnly:var(--hsds-color-blue-200);--hsds-button-color-blue-outline-textSeamlessHover:var( --hsds-color-blue-800 );--hsds-button-color-red-main:var(--hsds-color-pink-950);--hsds-button-color-red-hover:var(--hsds-color-pink-1000);--hsds-button-color-red-text:white;--hsds-button-color-red-outline-border:var(--hsds-color-pink-900);--hsds-button-color-red-outline-borderHover:var(--hsds-color-pink-900);--hsds-button-color-red-outline-text:var(--hsds-color-pink-950);--hsds-button-color-red-outline-textHover:var(--hsds-color-pink-1000);--hsds-button-color-red-outline-hover:var(--hsds-color-pink-100);--hsds-button-color-red-outline-hoverIconOnly:var(--hsds-color-pink-200);--hsds-button-color-red-outline-textSeamlessHover:var( --hsds-color-pink-1000 );--hsds-button-color-green-main:var(--hsds-color-green-750);--hsds-button-color-green-hover:var(--hsds-color-green-800);--hsds-button-color-green-text:white;--hsds-button-color-green-outline-border:var(--hsds-color-green-500);--hsds-button-color-green-outline-borderHover:var(--hsds-color-green-500);--hsds-button-color-green-outline-text:var(--hsds-color-green-750);--hsds-button-color-green-outline-textHover:var(--hsds-color-green-800);--hsds-button-color-green-outline-hover:var(--hsds-color-green-100);--hsds-button-color-green-outline-hoverIconOnly:var(--hsds-color-green-200);--hsds-button-color-green-outline-textSeamlessHover:var( --hsds-color-green-900 );--hsds-button-color-grey-main:var(--hsds-color-charcoal-400);--hsds-button-color-grey-hover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-text:white;--hsds-button-color-grey-outline-border:var(--hsds-color-grey-700);--hsds-button-color-grey-outline-borderHover:var(--hsds-color-grey-800);--hsds-button-color-grey-outline-text:var(--hsds-color-charcoal-400);--hsds-button-color-grey-outline-textHover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-outline-hover:var(--hsds-color-grey-200);--hsds-button-color-grey-outline-hoverIconOnly:var(--hsds-color-grey-300);--hsds-button-color-grey-outline-textSeamlessHover:var( --hsds-color-charcoal-800 );--hsds-button-color-yellow-main:var(--hsds-color-orange-600);--hsds-button-color-yellow-hover:var(--hsds-color-orange-700);--hsds-button-color-yellow-text:white;--hsds-button-color-yellow-outline-border:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-borderHover:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-text:var(--hsds-color-orange-600);--hsds-button-color-yellow-outline-textHover:var(--hsds-color-orange-700);--hsds-button-color-yellow-outline-hover:var(--hsds-color-yellow-100);--hsds-button-color-yellow-outline-hoverIconOnly:var( --hsds-color-yellow-100 );--hsds-button-color-yellow-outline-textSeamlessHover:var( --hsds-color-orange-700 );--hsds-button-color-disabled-main:var(--hsds-color-grey-500);--hsds-button-color-disabled-text:white;--hsds-button-color-disabled-outline-border:var(--hsds-color-grey-600);--hsds-button-color-disabled-outline-text:var(--hsds-color-grey-800);--hsds-datePicker-color-range-background:var(--hsds-color-blue-200);--hsds-datePicker-color-range-selectedBackground:var(--hsds-color-blue-500);--hsds-datePicker-color-range-text:var(--hsds-color-blue-500);--hsds-datePicker-color-range-textHover:var(--hsds-color-blue-600);--hsds-datePicker-color-current-background:var(--hsds-color-grey-300);--hsds-datePicker-color-current-text:var(--hsds-color-charcoal-700);--hsds-statusBar-color-light-error-border:var(--hsds-color-red-300);--hsds-statusBar-color-light-info-border:var(--hsds-color-blue-300);--hsds-statusBar-color-light-success-border:var(--hsds-color-green-300);--hsds-statusBar-color-light-warning-border:var(--hsds-color-yellow-300);--hsds-statusBar-color-bold-error-border:var(--hsds-color-red-600);--hsds-statusBar-color-bold-error-button:var(--hsds-color-red-700);--hsds-statusBar-color-bold-info-border:var(--hsds-color-blue-600);--hsds-statusBar-color-bold-info-button:var(--hsds-color-blue-700);--hsds-statusBar-color-bold-success-border:var(--hsds-color-green-600);--hsds-statusBar-color-bold-success-button:var(--hsds-color-green-700);--hsds-statusBar-color-bold-warning-border:var(--hsds-color-yellow-600);--hsds-statusBar-color-bold-warning-button:var(--hsds-color-yellow-700);--hsds-statusDot-color-light-default:var(--hsds-color-grey-600);--hsds-statusDot-color-light-active:var(--hsds-color-green-500);--hsds-statusDot-color-light-inactive:var(--hsds-color-grey-600);--hsds-statusDot-color-light-offline:var(--hsds-color-red-500);--hsds-statusDot-color-light-busy:var(--hsds-color-yellow-500);--hsds-statusDot-color-light-custom:var(--hsds-color-purple-400);--hsds-statusDot-color-dark-default:var(--hsds-color-grey-600);--hsds-statusDot-color-dark-active:var(--hsds-color-green-500);--hsds-statusDot-color-dark-inactive:var(--hsds-color-grey-600);--hsds-statusDot-color-dark-offline:var(--hsds-color-red-500);--hsds-statusDot-color-dark-busy:var(--hsds-color-yellow-500);--hsds-statusDot-color-dark-custom:var(--hsds-color-purple-400);--hsds-switchComponent-color-error:var(--hsds-color-pink-900);--hsds-verificationCode-color-error:var(--hsds-color-pink-900);--hsds-color-red-100:#fef7f6;--hsds-color-red-100-rgb:254,247,246;--hsds-color-red-200:#ffe3e2;--hsds-color-red-200-rgb:255,227,226;--hsds-color-red-300:#ffa2a2;--hsds-color-red-300-rgb:255,162,162;--hsds-color-red-400:#f45b55;--hsds-color-red-400-rgb:244,91,85;--hsds-color-red-500:#e52f28;--hsds-color-red-500-rgb:229,47,40;--hsds-color-red-600:#d21b14;--hsds-color-red-600-rgb:210,27,20;--hsds-color-red-700:#ba1f19;--hsds-color-red-700-rgb:186,31,25;--hsds-color-red-800:#9d1f1a;--hsds-color-red-800-rgb:157,31,26;--hsds-color-red-900:#731814;--hsds-color-red-900-rgb:115,24,20;--hsds-color-red-default:var(--hsds-color-red-500);--hsds-color-purple-100:#fbfbfe;--hsds-color-purple-100-rgb:251,251,254;--hsds-color-purple-200:#eaeafc;--hsds-color-purple-200-rgb:234,234,252;--hsds-color-purple-300:#d1d2f6;--hsds-color-purple-300-rgb:209,210,246;--hsds-color-purple-400:#a3a4f3;--hsds-color-purple-400-rgb:163,164,243;--hsds-color-purple-500:#7e80e7;--hsds-color-purple-500-rgb:126,128,231;--hsds-color-purple-600:#696aca;--hsds-color-purple-600-rgb:105,106,202;--hsds-color-purple-700:#585b9e;--hsds-color-purple-700-rgb:88,91,158;--hsds-color-purple-800:#45467d;--hsds-color-purple-800-rgb:69,70,125;--hsds-color-purple-900:#383966;--hsds-color-purple-900-rgb:56,57,102;--hsds-color-purple-default:var(--hsds-color-purple-500);--hsds-color-orange-100:#fff8f2;--hsds-color-orange-100-rgb:255,248,242;--hsds-color-orange-200:#ffead8;--hsds-color-orange-200-rgb:255,234,216;--hsds-color-orange-300:#ffd3ae;--hsds-color-orange-300-rgb:255,211,174;--hsds-color-orange-400:#ffa75a;--hsds-color-orange-400-rgb:255,167,90;--hsds-color-orange-500:#ff9139;--hsds-color-orange-500-rgb:255,145,57;--hsds-color-orange-600:#e87800;--hsds-color-orange-600-rgb:232,120,0;--hsds-color-orange-700:#c76400;--hsds-color-orange-700-rgb:199,100,0;--hsds-color-orange-800:#a45300;--hsds-color-orange-800-rgb:164,83,0;--hsds-color-orange-900:#813c00;--hsds-color-orange-900-rgb:129,60,0;--hsds-color-orange-default:var(--hsds-color-orange-500);--hsds-color-blue-100:#f3fbff;--hsds-color-blue-100-rgb:243,251,255;--hsds-color-blue-200:#d6edff;--hsds-color-blue-200-rgb:214,237,255;--hsds-color-blue-300:#a0d4ff;--hsds-color-blue-300-rgb:160,212,255;--hsds-color-blue-400:#57b0fb;--hsds-color-blue-400-rgb:87,176,251;--hsds-color-blue-500:#1292ee;--hsds-color-blue-500-rgb:18,146,238;--hsds-color-blue-600:#0077cc;--hsds-color-blue-600-rgb:0,119,204;--hsds-color-blue-700:#005ca4;--hsds-color-blue-700-rgb:0,92,164;--hsds-color-blue-800:#034077;--hsds-color-blue-800-rgb:3,64,119;--hsds-color-blue-900:#002651;--hsds-color-blue-900-rgb:0,38,81;--hsds-color-blue-default:var(--hsds-color-blue-500);--hsds-color-charcoal-200:#93a1b0;--hsds-color-charcoal-200-rgb:147,161,176;--hsds-color-charcoal-300:#748494;--hsds-color-charcoal-300-rgb:116,132,148;--hsds-color-charcoal-400:#556575;--hsds-color-charcoal-400-rgb:85,101,117;--hsds-color-charcoal-500:#405261;--hsds-color-charcoal-500-rgb:64,82,97;--hsds-color-charcoal-600:#314351;--hsds-color-charcoal-600-rgb:49,67,81;--hsds-color-charcoal-700:#253642;--hsds-color-charcoal-700-rgb:37,54,66;--hsds-color-charcoal-800:#1d2b36;--hsds-color-charcoal-800-rgb:29,43,54;--hsds-color-charcoal-default:var(--hsds-color-charcoal-500);--hsds-color-ash-200:#f9fafa;--hsds-color-ash-200-rgb:249,250,250;--hsds-color-ash-300:#f1f3f5;--hsds-color-ash-300-rgb:241,243,245;--hsds-color-ash-400:#e5e9ec;--hsds-color-ash-400-rgb:229,233,236;--hsds-color-ash-500:#d5dce1;--hsds-color-ash-500-rgb:213,220,225;--hsds-color-ash-600:#c5ced6;--hsds-color-ash-600-rgb:197,206,214;--hsds-color-ash-700:#b7c2cc;--hsds-color-ash-700-rgb:183,194,204;--hsds-color-ash-800:#a5b2bd;--hsds-color-ash-800-rgb:165,178,189;--hsds-color-ash-default:var(--hsds-color-ash-500);--hsds-color-grey-200:#f9fafa;--hsds-color-grey-200-rgb:249,250,250;--hsds-color-grey-300:#f1f3f5;--hsds-color-grey-300-rgb:241,243,245;--hsds-color-grey-400:#e5e9ec;--hsds-color-grey-400-rgb:229,233,236;--hsds-color-grey-500:#d5dce1;--hsds-color-grey-500-rgb:213,220,225;--hsds-color-grey-600:#c5ced6;--hsds-color-grey-600-rgb:197,206,214;--hsds-color-grey-700:#b7c2cc;--hsds-color-grey-700-rgb:183,194,204;--hsds-color-grey-800:#a5b2bd;--hsds-color-grey-800-rgb:165,178,189;--hsds-color-grey-default:var(--hsds-color-grey-500);--hsds-color-yellow-50:#fffbf3;--hsds-color-yellow-100:#fff9ef;--hsds-color-yellow-100-rgb:255,249,239;--hsds-color-yellow-200:#fff2d7;--hsds-color-yellow-200-rgb:255,242,215;--hsds-color-yellow-300:#ffe7b8;--hsds-color-yellow-300-rgb:255,231,184;--hsds-color-yellow-400:#fdd88e;--hsds-color-yellow-400-rgb:253,216,142;--hsds-color-yellow-500:#ffc555;--hsds-color-yellow-500-rgb:255,197,85;--hsds-color-yellow-600:#fab347;--hsds-color-yellow-600-rgb:250,179,71;--hsds-color-yellow-700:#e89635;--hsds-color-yellow-700-rgb:232,150,53;--hsds-color-yellow-800:#ce7129;--hsds-color-yellow-800-rgb:206,113,41;--hsds-color-yellow-900:#b24319;--hsds-color-yellow-900-rgb:178,67,25;--hsds-color-yellow-950:#84142d;--hsds-color-yellow-950-rgb:132,20,45;--hsds-color-yellow-default:var(--hsds-color-yellow-500);--hsds-color-green-100:#f5fff9;--hsds-color-green-100-rgb:245,255,249;--hsds-color-green-200:#e3fbee;--hsds-color-green-200-rgb:227,251,238;--hsds-color-green-300:#c2f0d7;--hsds-color-green-300-rgb:194,240,215;--hsds-color-green-400:#87dbae;--hsds-color-green-400-rgb:135,219,174;--hsds-color-green-500:#56c288;--hsds-color-green-500-rgb:86,194,136;--hsds-color-green-600:#39ac6e;--hsds-color-green-600-rgb:57,172,110;--hsds-color-green-700:#268c55;--hsds-color-green-700-rgb:38,140,85;--hsds-color-green-750:#248451;--hsds-color-green-750-rgb:36,132,81;--hsds-color-green-800:#106236;--hsds-color-green-800-rgb:16,98,54;--hsds-color-green-900:#003c1c;--hsds-color-green-900-rgb:0,60,28;--hsds-color-green-default:var(--hsds-color-green-500);--hsds-color-pink-100:#fff9fb;--hsds-color-pink-100-rgb:255,249,251;--hsds-color-pink-200:#ffeef1;--hsds-color-pink-200-rgb:255,238,241;--hsds-color-pink-300:#ffe1e7;--hsds-color-pink-300-rgb:255,225,231;--hsds-color-pink-400:#ffccd7;--hsds-color-pink-400-rgb:255,204,215;--hsds-color-pink-500:#ffb3c3;--hsds-color-pink-500-rgb:255,179,195;--hsds-color-pink-600:#fd9aae;--hsds-color-pink-600-rgb:253,154,174;--hsds-color-pink-700:#fd9aae;--hsds-color-pink-700-rgb:253,154,174;--hsds-color-pink-800:#fc5d7d;--hsds-color-pink-800-rgb:252,93,125;--hsds-color-pink-900:#f23459;--hsds-color-pink-900-rgb:242,52,89;--hsds-color-pink-950:#e9074b;--hsds-color-pink-950-rgb:233,7,75;--hsds-color-pink-1000:#c5003b;--hsds-color-pink-1000-rgb:197,0,59;--hsds-color-pink-default:var(--hsds-color-pink-500);--hsds-color-lavender-100:#f9f9ff;--hsds-color-lavender-100-rgb:249,249,255;--hsds-color-lavender-200:#ebecff;--hsds-color-lavender-200-rgb:235,236,255;--hsds-color-lavender-300:#d9dcfd;--hsds-color-lavender-300-rgb:217,220,253;--hsds-color-lavender-400:#b9beff;--hsds-color-lavender-400-rgb:185,190,255;--hsds-color-lavender-500:#9fa6ff;--hsds-color-lavender-500-rgb:159,166,255;--hsds-color-lavender-600:#818aec;--hsds-color-lavender-600-rgb:129,138,236;--hsds-color-lavender-700:#6269c5;--hsds-color-lavender-700-rgb:98,105,197;--hsds-color-lavender-800:#404996;--hsds-color-lavender-800-rgb:64,73,150;--hsds-color-lavender-900:#232a5c;--hsds-color-lavender-900-rgb:35,42,92;--hsds-color-lavender-default:var(--hsds-color-lavender-500);--hsds-color-indigo-100:#f2f6ff;--hsds-color-indigo-100-rgb:242,246,255;--hsds-color-indigo-200:#dfe7ff;--hsds-color-indigo-200-rgb:223,231,255;--hsds-color-indigo-300:#b2c8fb;--hsds-color-indigo-300-rgb:178,200,251;--hsds-color-indigo-400:#79a1f8;--hsds-color-indigo-400-rgb:121,161,248;--hsds-color-indigo-500:#527ceb;--hsds-color-indigo-500-rgb:82,124,235;--hsds-color-indigo-600:#3b64d2;--hsds-color-indigo-600-rgb:59,100,210;--hsds-color-indigo-700:#2549a8;--hsds-color-indigo-700-rgb:37,73,168;--hsds-color-indigo-800:#16337f;--hsds-color-indigo-800-rgb:22,51,127;--hsds-color-indigo-900:#071e57;--hsds-color-indigo-900-rgb:7,30,87;--hsds-color-indigo-default:var(--hsds-color-indigo-500);--hsds-color-whaletail-100:#f3f7ff;--hsds-color-whaletail-100-rgb:243,247,255;--hsds-color-whaletail-200:#e5edfe;--hsds-color-whaletail-200-rgb:229,237,254;--hsds-color-whaletail-300:#d0defd;--hsds-color-whaletail-300-rgb:208,222,253;--hsds-color-whaletail-400:#afc7f9;--hsds-color-whaletail-400-rgb:175,199,249;--hsds-color-whaletail-500:#8aabf1;--hsds-color-whaletail-500-rgb:138,171,241;--hsds-color-whaletail-600:#7296e1;--hsds-color-whaletail-600-rgb:114,150,225;--hsds-color-whaletail-700:#5174bb;--hsds-color-whaletail-700-rgb:81,116,187;--hsds-color-whaletail-800:#304f8b;--hsds-color-whaletail-800-rgb:48,79,139;--hsds-color-whaletail-900:#142f5e;--hsds-color-whaletail-900-rgb:20,47,94;--hsds-color-whaletail-default:var(--hsds-color-whaletail-500);--hsds-color-link-default:var(--hsds-color-blue-600);--hsds-color-link-base:var(--hsds-color-blue-600);--hsds-color-link-hover:var(--hsds-color-blue-500);--hsds-color-link-active:var(--hsds-color-blue-500);--hsds-color-link-focus:var(--hsds-color-blue-500);--hsds-color-link-disabled:var(--hsds-color-grey-800);--hsds-color-text-default:currentColor;--hsds-color-text-subtle:var(--hsds-color-charcoal-500);--hsds-color-text-slightlyMuted:var(--hsds-color-charcoal-400);--hsds-color-text-muted:var(--hsds-color-charcoal-300);--hsds-color-text-faint:var(--hsds-color-charcoal-200);--hsds-color-text-extraMuted:var(--hsds-color-grey-600);--hsds-color-border-default:var(--hsds-color-grey-400);--hsds-color-border-divider:var(--hsds-color-grey-300);--hsds-color-border-ui-default:var(--hsds-color-grey-500);--hsds-color-border-ui-dark:var(--hsds-color-grey-600);--hsds-color-state-danger-default:var(--hsds-color-state-error-default);--hsds-color-state-danger-backgroundColor:var( --hsds-color-state-error-backgroundColor );--hsds-color-state-danger-backgroundLight:var( --hsds-color-state-error-backgroundColor );--hsds-color-state-danger-backgroundDark:var( --hsds-color-state-error-borderColor );--hsds-color-state-danger-borderColor:var( --hsds-color-state-error-borderColor );--hsds-color-state-danger-icon:var(--hsds-color-state-error-borderColor);--hsds-color-state-danger-color:var(--hsds-color-state-error-borderColor);--hsds-color-state-danger-text:var(--hsds-color-state-error-borderColor);--hsds-color-state-error-default:var(--hsds-color-red-500);--hsds-color-state-error-backgroundColor:var(--hsds-color-red-200);--hsds-color-state-error-backgroundLight:var(--hsds-color-red-200);--hsds-color-state-error-backgroundDark:var(--hsds-color-red-500);--hsds-color-state-error-borderColor:var(--hsds-color-red-500);--hsds-color-state-error-icon:var(--hsds-color-red-500);--hsds-color-state-error-color:var(--hsds-color-red-500);--hsds-color-state-error-text:var(--hsds-color-red-500);--hsds-color-state-info-default:var(--hsds-color-blue-500);--hsds-color-state-info-backgroundColor:var(--hsds-color-blue-200);--hsds-color-state-info-backgroundLight:var(--hsds-color-blue-200);--hsds-color-state-info-backgroundDark:var( --hsds-color-state-info-borderColor );--hsds-color-state-info-borderColor:var(--hsds-color-blue-500);--hsds-color-state-info-icon:var(--hsds-color-blue-500);--hsds-color-state-info-color:var(--hsds-color-blue-500);--hsds-color-state-info-text:var(--hsds-color-blue-500);--hsds-color-state-success-default:var(--hsds-color-green-500);--hsds-color-state-success-backgroundColor:var(--hsds-color-green-200);--hsds-color-state-success-backgroundLight:var(--hsds-color-green-200);--hsds-color-state-success-backgroundDark:var( --hsds-color-state-success-borderColor );--hsds-color-state-success-borderColor:var(--hsds-color-green-500);--hsds-color-state-success-icon:var(--hsds-color-green-500);--hsds-color-state-success-color:var(--hsds-color-green-500);--hsds-color-state-success-text:var(--hsds-color-green-500);--hsds-color-state-warning-default:var(--hsds-color-yellow-500);--hsds-color-state-warning-backgroundColor:var(--hsds-color-yellow-200);--hsds-color-state-warning-backgroundLight:var(--hsds-color-yellow-200);--hsds-color-state-warning-backgroundDark:var( --hsds-color-state-warning-borderColor );--hsds-color-state-warning-borderColor:var(--hsds-color-yellow-500);--hsds-color-state-warning-icon:var(--hsds-color-yellow-500);--hsds-color-state-warning-color:var(--hsds-color-yellow-500);--hsds-color-state-warning-text:var(--hsds-color-yellow-500);--hsds-color-button-border:#d5d5d5;--hsds-color-button-hover:#e6e6e6;--hsds-color-button-active:#b6b6b6;--hsds-color-focusRing:var(--hsds-color-blue-500);"]);
 exports.tokens = tokens;

js/newBrand/badge.js

@@ -7,29 +7,5 @@ "use strict";
   color: {
-    default: '#253642',
-    status: {
-      error: '#b83525ff',
-      info: '#2745c2ff',
-      success: '#2d8556ff',
-      warning: '#a35214ff'
-    },
-    statusInverted: {
-      error: {
-        border: '#e54a32ff',
-        text: '#b83525ff'
-      },
-      info: {
-        border: '#3b70f5ff',
-        text: '#2745c2ff'
-      },
-      success: {
-        border: '#47c47dff',
-        text: '#28704cff'
-      },
-      warning: {
-        border: '#fabf5aff',
-        text: '#a35214ff'
-      }
-    }
+    default: '#253642'
   }
 };
 exports.badge = badge;

js/newBrand/button.js

@@ -8,10 +8,10 @@ "use strict";
     blue: {
-      main: '#2745c2ff',
-      hover: '#1e2d94ff',
+      main: '#304ddbff',
+      hover: '#263aadff',
       text: 'white',
       outline: {
-        border: '#3b70f5ff',
-        borderHover: '#3b70f5ff',
-        text: '#2745c2ff',
-        textHover: '#1e2d94ff',
+        border: '#4176faff',
+        borderHover: '#4176faff',
+        text: '#304ddbff',
+        textHover: '#263aadff',
         hover: '#ebf5ffff',
@@ -37,3 +37,3 @@ hoverIconOnly: '#ebf5ffff',
     green: {
-      main: '#28704cff',
+      main: '#2e5940ff',
       hover: '#2e5940ff',
@@ -44,3 +44,3 @@ text: 'white',
         borderHover: '#47c47dff',
-        text: '#28704cff',
+        text: '#2e5940ff',
         textHover: '#2e5940ff',
@@ -47,0 +47,0 @@ hover: '#f2fff0ff',

js/newBrand/color.js

@@ -10,9 +10,9 @@ "use strict";
     300: '#9ecbffff',
-    400: '#5a9afaff',
-    500: '#2745c2ff',
-    600: '#2745c2ff',
-    700: '#1e2d94ff',
+    400: '#66a3ffff',
+    500: '#304ddbff',
+    600: '#304ddbff',
+    700: '#263aadff',
     800: '#1c2674ff',
     900: '#171952ff',
-    default: '#3b70f5ff'
+    default: '#4176faff'
   },
@@ -51,9 +51,9 @@ charcoal: {
     400: '#9ecbffff',
-    500: '#5a9afaff',
-    600: '#3b70f5ff',
-    700: '#2745c2ff',
-    800: '#1e2d94ff',
+    500: '#66a3ffff',
+    600: '#4176faff',
+    700: '#304ddbff',
+    800: '#263aadff',
     900: '#1c2674ff',
     1000: '#171952ff',
-    default: '#5a9afaff'
+    default: '#66a3ffff'
   },
@@ -93,3 +93,3 @@ lavender: {
     700: '#28704cff',
-    750: '#28704cff',
+    750: '#2e5940ff',
     800: '#2e5940ff',
@@ -116,10 +116,10 @@ 900: '#283b2dff',
   link: {
-    default: '#2745c2ff',
-    base: '#2745c2ff',
-    hover: '#1e2d94ff',
+    default: '#304ddbff',
+    base: '#304ddbff',
+    hover: '#263aadff',
     active: '#1c2674ff',
-    focus: '#2745c2ff',
+    focus: '#304ddbff',
     disabled: '#405261'
   },
-  focusRing: '#2745c2ff',
+  focusRing: '#304ddbff',
   text: {
@@ -142,36 +142,46 @@ default: '#405261',
   state: {
-    danger: {
-      default: '#b83525ff',
-      backgroundColor: '#FFE8E4DE',
+    error: {
+      text: '#b83525ff',
+      backgroundDark: '#b83525ff',
+      icon: '#ff6047ff',
       borderColor: '#e54a32ff',
-      color: '#b83525ff',
-      icon: '#ff4747ff'
-    },
-    error: {
+      backgroundLight: '#FA7A6428',
       default: '#b83525ff',
-      backgroundColor: '#FFE8E4DE',
-      borderColor: '#e54a32ff',
-      color: '#b83525ff',
-      icon: '#ff4747ff'
+      color: '#b83525ff'
     },
     info: {
-      default: '#1e2d94ff',
-      backgroundColor: '#ebf5ffff',
-      borderColor: '#3b70f5ff',
-      color: '#1e2d94ff',
-      icon: '#3b70f5ff'
+      text: '#263aadff',
+      backgroundDark: '#304ddbff',
+      icon: '#4176faff',
+      borderColor: '#4176faff',
+      backgroundLight: '#ebf5ffff',
+      default: '#263aadff',
+      color: '#263aadff'
     },
     success: {
+      text: '#2e5940ff',
+      backgroundDark: '#2d8556ff',
+      icon: '#47c47dff',
+      borderColor: '#47c47dff',
+      backgroundLight: '#f2fff0ff',
       default: '#2e5940ff',
-      backgroundColor: '#f2fff0ff',
-      borderColor: '#47c47dff',
-      color: '#2e5940ff',
-      icon: '#47c47dff'
+      color: '#2e5940ff'
     },
     warning: {
-      default: '#e09c24ff',
-      backgroundColor: '#fff6e5ff',
+      text: '#a35214ff',
+      backgroundDark: '#a35214ff',
+      icon: '#ffb83dff',
       borderColor: '#fabf5aff',
+      backgroundLight: '#fff6e5ff',
       color: '#a35214ff',
-      icon: '#ffb83dff'
+      default: '#e09c24ff'
+    },
+    danger: {
+      default: '#b83525ff',
+      backgroundLight: '#FA7A6428',
+      backgroundDark: '#b83525ff',
+      borderColor: '#e54a32ff',
+      color: '#b83525ff',
+      text: '#b83525ff',
+      icon: '#ff6047ff'
     }
@@ -190,3 +200,3 @@ },
     1000: '#2b2123ff',
-    accent: '#ff4747ff'
+    accent: '#ff6047ff'
   },
@@ -223,10 +233,10 @@ orange: {
     300: '#9ecbffff',
-    400: '#5a9afaff',
-    500: '#3b70f5ff',
-    600: '#2745c2ff',
-    700: '#1e2d94ff',
+    400: '#66a3ffff',
+    500: '#4176faff',
+    600: '#304ddbff',
+    700: '#263aadff',
     800: '#1c2674ff',
     900: '#171952ff',
     1000: '#0e0e33ff',
-    accent: '#3377ffff'
+    accent: '#47a3ffff'
   },
@@ -275,4 +285,4 @@ purple: {
     link: {
-      default: '#2745c2ff',
-      hovered: '#1e2d94ff',
+      default: '#304ddbff',
+      hovered: '#263aadff',
       pressed: '#1c2674ff',
@@ -279,0 +289,0 @@ disabled: '#405261'

js/newBrand/datePicker.js

@@ -9,5 +9,5 @@ "use strict";
       background: '#ebf5ffff',
-      selectedBackground: '#2745c2ff',
-      text: '#2745c2ff',
-      textHover: '#1e2d94ff'
+      selectedBackground: '#304ddbff',
+      text: '#304ddbff',
+      textHover: '#263aadff'
     },
@@ -14,0 +14,0 @@ current: {

js/newBrand/index.js

@@ -10,2 +10,3 @@ "use strict";
 var _datePicker = require("./datePicker");
+var _statusBar = require("./statusBar");
 var _statusDot = require("./statusDot");
@@ -20,2 +21,3 @@ var _styledComponents = require("./styled-components");
   datePicker: _datePicker.datePicker,
+  statusBar: _statusBar.statusBar,
   statusDot: _statusDot.statusDot,
@@ -22,0 +24,0 @@ switchComponent: _switchComponent.switchComponent,

js/newBrand/statusDot.js

@@ -19,3 +19,3 @@ "use strict";
       inactive: '#47c2ffff',
-      offline: '#ff4747ff',
+      offline: '#ff6047ff',
       busy: '#ffb83dff',
@@ -22,0 +22,0 @@ custom: '#c285ffff'

js/newBrand/styled-components.js

@@ -6,3 +6,3 @@ "use strict";
 var _styledComponents = require("styled-components");
-const tokens = (0, _styledComponents.css)(["--hsds-attachment-color-removeButton-hover:var(--hsds-color-red-700);--hsds-attachment-color-removeButton-borderHover:var(--hsds-color-red-600);--hsds-attachment-color-error:var(--hsds-color-red-600);--hsds-badge-color-default:var(--hsds-color-charcoal-700);--hsds-badge-color-status-error:var(--hsds-color-red-600);--hsds-badge-color-status-info:var(--hsds-color-cobalt-600);--hsds-badge-color-status-success:var(--hsds-color-green-600);--hsds-badge-color-status-warning:var(--hsds-color-orange-600);--hsds-badge-color-statusInverted-error-border:var(--hsds-color-red-500);--hsds-badge-color-statusInverted-error-text:var(--hsds-color-red-600);--hsds-badge-color-statusInverted-info-border:var(--hsds-color-cobalt-500);--hsds-badge-color-statusInverted-info-text:var(--hsds-color-cobalt-600);--hsds-badge-color-statusInverted-success-border:var(--hsds-color-green-500);--hsds-badge-color-statusInverted-success-text:var(--hsds-color-green-700);--hsds-badge-color-statusInverted-warning-border:var( --hsds-color-yellow-400 );--hsds-badge-color-statusInverted-warning-text:var(--hsds-color-orange-600);--hsds-button-color-blue-main:var(--hsds-color-cobalt-600);--hsds-button-color-blue-hover:var(--hsds-color-cobalt-700);--hsds-button-color-blue-text:white;--hsds-button-color-blue-outline-border:var(--hsds-color-cobalt-500);--hsds-button-color-blue-outline-borderHover:var(--hsds-color-cobalt-500);--hsds-button-color-blue-outline-text:var(--hsds-color-cobalt-600);--hsds-button-color-blue-outline-textHover:var(--hsds-color-cobalt-700);--hsds-button-color-blue-outline-hover:var(--hsds-color-cobalt-100);--hsds-button-color-blue-outline-hoverIconOnly:var(--hsds-color-cobalt-100);--hsds-button-color-blue-outline-textSeamlessHover:var( --hsds-color-cobalt-800 );--hsds-button-color-red-main:var(--hsds-color-red-600);--hsds-button-color-red-hover:var(--hsds-color-red-700);--hsds-button-color-red-text:white;--hsds-button-color-red-outline-border:var(--hsds-color-red-500);--hsds-button-color-red-outline-borderHover:var(--hsds-color-red-500);--hsds-button-color-red-outline-text:var(--hsds-color-red-600);--hsds-button-color-red-outline-textHover:var(--hsds-color-red-700);--hsds-button-color-red-outline-hover:var(--hsds-color-red-100);--hsds-button-color-red-outline-hoverIconOnly:var(--hsds-color-red-100);--hsds-button-color-red-outline-textSeamlessHover:var(--hsds-color-red-700);--hsds-button-color-green-main:var(--hsds-color-green-750);--hsds-button-color-green-hover:var(--hsds-color-green-800);--hsds-button-color-green-text:white;--hsds-button-color-green-outline-border:var(--hsds-color-green-500);--hsds-button-color-green-outline-borderHover:var(--hsds-color-green-500);--hsds-button-color-green-outline-text:var(--hsds-color-green-750);--hsds-button-color-green-outline-textHover:var(--hsds-color-green-800);--hsds-button-color-green-outline-hover:var(--hsds-color-green-100);--hsds-button-color-green-outline-hoverIconOnly:var(--hsds-color-green-100);--hsds-button-color-green-outline-textSeamlessHover:var( --hsds-color-green-900 );--hsds-button-color-grey-main:var(--hsds-color-charcoal-400);--hsds-button-color-grey-hover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-text:white;--hsds-button-color-grey-outline-border:var(--hsds-color-grey-700);--hsds-button-color-grey-outline-borderHover:var(--hsds-color-grey-800);--hsds-button-color-grey-outline-text:var(--hsds-color-charcoal-400);--hsds-button-color-grey-outline-textHover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-outline-hover:var(--hsds-color-grey-200);--hsds-button-color-grey-outline-hoverIconOnly:var(--hsds-color-grey-300);--hsds-button-color-grey-outline-textSeamlessHover:var( --hsds-color-charcoal-800 );--hsds-button-color-yellow-main:var(--hsds-color-orange-600);--hsds-button-color-yellow-hover:var(--hsds-color-orange-700);--hsds-button-color-yellow-text:white;--hsds-button-color-yellow-outline-border:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-borderHover:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-text:var(--hsds-color-orange-600);--hsds-button-color-yellow-outline-textHover:var(--hsds-color-orange-700);--hsds-button-color-yellow-outline-hover:var(--hsds-color-yellow-100);--hsds-button-color-yellow-outline-hoverIconOnly:var( --hsds-color-yellow-100 );--hsds-button-color-yellow-outline-textSeamlessHover:var( --hsds-color-orange-700 );--hsds-button-color-disabled-main:var(--hsds-color-grey-500);--hsds-button-color-disabled-text:white;--hsds-button-color-disabled-outline-border:var(--hsds-color-grey-600);--hsds-button-color-disabled-outline-text:var(--hsds-color-grey-800);--hsds-datePicker-color-range-background:var(--hsds-color-cobalt-100);--hsds-datePicker-color-range-selectedBackground:var( --hsds-color-cobalt-600 );--hsds-datePicker-color-range-text:var(--hsds-color-cobalt-600);--hsds-datePicker-color-range-textHover:var(--hsds-color-cobalt-700);--hsds-datePicker-color-current-background:var(--hsds-color-grey-400);--hsds-datePicker-color-current-text:var(--hsds-color-charcoal-700);--hsds-statusDot-color-light-default:var(--hsds-color-slate-500);--hsds-statusDot-color-light-active:var(--hsds-color-green-500);--hsds-statusDot-color-light-inactive:var(--hsds-color-slate-500);--hsds-statusDot-color-light-offline:var(--hsds-color-red-500);--hsds-statusDot-color-light-busy:var(--hsds-color-yellow-400);--hsds-statusDot-color-light-custom:var(--hsds-color-purple-400);--hsds-statusDot-color-dark-default:var(--hsds-color-slate-accent);--hsds-statusDot-color-dark-active:var(--hsds-color-green-accent);--hsds-statusDot-color-dark-inactive:var(--hsds-color-slate-accent);--hsds-statusDot-color-dark-offline:var(--hsds-color-red-accent);--hsds-statusDot-color-dark-busy:var(--hsds-color-yellow-accent);--hsds-statusDot-color-dark-custom:var(--hsds-color-purple-accent);--hsds-switchComponent-color-error:var(--hsds-color-state-error-default);--hsds-verificationCode-color-error:var(--hsds-color-state-error-default);--hsds-color-blue-100:var(--hsds-color-cobalt-100);--hsds-color-blue-100-rgb:var(--hsds-color-cobalt-100-rgb);--hsds-color-blue-200:var(--hsds-color-cobalt-200);--hsds-color-blue-200-rgb:var(--hsds-color-cobalt-200-rgb);--hsds-color-blue-300:var(--hsds-color-cobalt-300);--hsds-color-blue-300-rgb:var(--hsds-color-cobalt-300-rgb);--hsds-color-blue-400:var(--hsds-color-cobalt-400);--hsds-color-blue-400-rgb:var(--hsds-color-cobalt-400-rgb);--hsds-color-blue-500:var(--hsds-color-cobalt-600);--hsds-color-blue-500-rgb:var(--hsds-color-cobalt-600-rgb);--hsds-color-blue-600:var(--hsds-color-cobalt-600);--hsds-color-blue-600-rgb:var(--hsds-color-cobalt-600-rgb);--hsds-color-blue-700:var(--hsds-color-cobalt-700);--hsds-color-blue-700-rgb:var(--hsds-color-cobalt-700-rgb);--hsds-color-blue-800:var(--hsds-color-cobalt-800);--hsds-color-blue-800-rgb:var(--hsds-color-cobalt-800-rgb);--hsds-color-blue-900:var(--hsds-color-cobalt-900);--hsds-color-blue-900-rgb:var(--hsds-color-cobalt-900-rgb);--hsds-color-blue-default:var(--hsds-color-cobalt-500);--hsds-color-charcoal-200:#7e8e9e;--hsds-color-charcoal-200-rgb:126,142,158;--hsds-color-charcoal-300:#7e8e9e;--hsds-color-charcoal-300-rgb:126,142,158;--hsds-color-charcoal-400:#556575;--hsds-color-charcoal-400-rgb:85,101,117;--hsds-color-charcoal-500:#405261;--hsds-color-charcoal-500-rgb:64,82,97;--hsds-color-charcoal-600:#314351;--hsds-color-charcoal-600-rgb:49,67,81;--hsds-color-charcoal-700:#253642;--hsds-color-charcoal-700-rgb:37,54,66;--hsds-color-charcoal-800:#1d2b36;--hsds-color-charcoal-800-rgb:29,43,54;--hsds-color-charcoal-default:var(--hsds-color-charcoal-500);--hsds-color-grey-200:#f9fafa;--hsds-color-grey-200-rgb:249,250,250;--hsds-color-grey-300:#f1f3f5;--hsds-color-grey-300-rgb:241,243,245;--hsds-color-grey-400:#dfe6eb;--hsds-color-grey-400-rgb:223,230,235;--hsds-color-grey-500:#c8d3de;--hsds-color-grey-500-rgb:200,211,222;--hsds-color-grey-600:#abb9c7;--hsds-color-grey-600-rgb:171,185,199;--hsds-color-grey-700:#abb9c7;--hsds-color-grey-700-rgb:171,185,199;--hsds-color-grey-800:#abb9c7;--hsds-color-grey-800-rgb:171,185,199;--hsds-color-ash-200:var(--hsds-color-grey-200);--hsds-color-ash-200-rgb:var(--hsds-color-grey-200-rgb);--hsds-color-ash-300:var(--hsds-color-grey-300);--hsds-color-ash-300-rgb:var(--hsds-color-grey-300-rgb);--hsds-color-ash-400:var(--hsds-color-grey-400);--hsds-color-ash-400-rgb:var(--hsds-color-grey-400-rgb);--hsds-color-ash-500:var(--hsds-color-grey-500);--hsds-color-ash-500-rgb:var(--hsds-color-grey-500-rgb);--hsds-color-ash-600:var(--hsds-color-grey-600);--hsds-color-ash-600-rgb:var(--hsds-color-grey-600-rgb);--hsds-color-ash-700:var(--hsds-color-grey-700);--hsds-color-ash-700-rgb:var(--hsds-color-grey-700-rgb);--hsds-color-ash-800:var(--hsds-color-grey-800);--hsds-color-ash-800-rgb:var(--hsds-color-grey-800-rgb);--hsds-color-indigo-200:var(--hsds-color-cobalt-100);--hsds-color-indigo-200-rgb:var(--hsds-color-cobalt-100-rgb);--hsds-color-indigo-300:var(--hsds-color-cobalt-200);--hsds-color-indigo-300-rgb:var(--hsds-color-cobalt-200-rgb);--hsds-color-indigo-400:var(--hsds-color-cobalt-300);--hsds-color-indigo-400-rgb:var(--hsds-color-cobalt-300-rgb);--hsds-color-indigo-500:var(--hsds-color-cobalt-400);--hsds-color-indigo-500-rgb:var(--hsds-color-cobalt-400-rgb);--hsds-color-indigo-600:var(--hsds-color-cobalt-500);--hsds-color-indigo-600-rgb:var(--hsds-color-cobalt-500-rgb);--hsds-color-indigo-700:var(--hsds-color-cobalt-600);--hsds-color-indigo-700-rgb:var(--hsds-color-cobalt-600-rgb);--hsds-color-indigo-800:var(--hsds-color-cobalt-700);--hsds-color-indigo-800-rgb:var(--hsds-color-cobalt-700-rgb);--hsds-color-indigo-900:var(--hsds-color-cobalt-800);--hsds-color-indigo-900-rgb:var(--hsds-color-cobalt-800-rgb);--hsds-color-indigo-1000:var(--hsds-color-cobalt-900);--hsds-color-indigo-1000-rgb:var(--hsds-color-cobalt-900-rgb);--hsds-color-indigo-default:var(--hsds-color-indigo-500);--hsds-color-lavender-100:var(--hsds-color-purple-100);--hsds-color-lavender-100-rgb:var(--hsds-color-purple-100-rgb);--hsds-color-lavender-200:var(--hsds-color-purple-200);--hsds-color-lavender-200-rgb:var(--hsds-color-purple-200-rgb);--hsds-color-lavender-300:var(--hsds-color-purple-300);--hsds-color-lavender-300-rgb:var(--hsds-color-purple-300-rgb);--hsds-color-lavender-400:var(--hsds-color-purple-400);--hsds-color-lavender-400-rgb:var(--hsds-color-purple-400-rgb);--hsds-color-lavender-500:var(--hsds-color-purple-500);--hsds-color-lavender-500-rgb:var(--hsds-color-purple-500-rgb);--hsds-color-lavender-600:var(--hsds-color-purple-600);--hsds-color-lavender-600-rgb:var(--hsds-color-purple-600-rgb);--hsds-color-lavender-700:var(--hsds-color-purple-700);--hsds-color-lavender-700-rgb:var(--hsds-color-purple-700-rgb);--hsds-color-lavender-800:var(--hsds-color-purple-800);--hsds-color-lavender-800-rgb:var(--hsds-color-purple-800-rgb);--hsds-color-lavender-900:var(--hsds-color-purple-900);--hsds-color-lavender-900-rgb:var(--hsds-color-purple-900-rgb);--hsds-color-lavender-default:var(--hsds-color-lavender-500);--hsds-color-pink-100:var(--hsds-color-red-100);--hsds-color-pink-100-rgb:var(--hsds-color-red-100-rgb);--hsds-color-pink-200:var(--hsds-color-red-200);--hsds-color-pink-200-rgb:var(--hsds-color-red-200-rgb);--hsds-color-pink-300:var(--hsds-color-red-300);--hsds-color-pink-300-rgb:var(--hsds-color-red-300-rgb);--hsds-color-pink-400:var(--hsds-color-red-400);--hsds-color-pink-400-rgb:var(--hsds-color-red-400-rgb);--hsds-color-pink-500:var(--hsds-color-red-500);--hsds-color-pink-500-rgb:var(--hsds-color-red-500-rgb);--hsds-color-pink-600:var(--hsds-color-red-600);--hsds-color-pink-600-rgb:var(--hsds-color-red-600-rgb);--hsds-color-pink-700:var(--hsds-color-red-700);--hsds-color-pink-700-rgb:var(--hsds-color-red-700-rgb);--hsds-color-pink-800:var(--hsds-color-red-800);--hsds-color-pink-800-rgb:var(--hsds-color-red-800-rgb);--hsds-color-pink-900:var(--hsds-color-red-900);--hsds-color-pink-900-rgb:var(--hsds-color-red-900-rgb);--hsds-color-pink-950:var(--hsds-color-red-900);--hsds-color-pink-950-rgb:var(--hsds-color-red-900-rgb);--hsds-color-pink-1000:var(--hsds-color-red-900);--hsds-color-pink-1000-rgb:var(--hsds-color-red-900-rgb);--hsds-color-green-100:#f2fff0ff;--hsds-color-green-100-rgb:242,255,240;--hsds-color-green-200:#e0fcdeff;--hsds-color-green-200-rgb:224,252,222;--hsds-color-green-300:#b9edbdff;--hsds-color-green-300-rgb:185,237,189;--hsds-color-green-400:#83db9cff;--hsds-color-green-400-rgb:131,219,156;--hsds-color-green-500:#47c47dff;--hsds-color-green-500-rgb:71,196,125;--hsds-color-green-600:#2d8556ff;--hsds-color-green-600-rgb:45,133,86;--hsds-color-green-700:#28704cff;--hsds-color-green-700-rgb:40,112,76;--hsds-color-green-750:var(--hsds-color-green-700);--hsds-color-green-750-rgb:var(--hsds-color-green-700-rgb);--hsds-color-green-800:#2e5940ff;--hsds-color-green-800-rgb:46,89,64;--hsds-color-green-900:#283b2dff;--hsds-color-green-900-rgb:40,59,45;--hsds-color-green-1000:#222923ff;--hsds-color-green-1000-rgb:34,41,35;--hsds-color-green-accent:#56f09eff;--hsds-color-yellow-50:var(--hsds-color-yellow-100);--hsds-color-yellow-100:#fff6e5ff;--hsds-color-yellow-100-rgb:255,246,229;--hsds-color-yellow-200:#ffeeccff;--hsds-color-yellow-200-rgb:255,238,204;--hsds-color-yellow-300:#ffdd99ff;--hsds-color-yellow-300-rgb:255,221,153;--hsds-color-yellow-400:#fabf5aff;--hsds-color-yellow-400-rgb:250,191,90;--hsds-color-yellow-500:#e09c24ff;--hsds-color-yellow-500-rgb:224,156,36;--hsds-color-yellow-600:#ac771bff;--hsds-color-yellow-600-rgb:172,119,27;--hsds-color-yellow-700:#7a581dff;--hsds-color-yellow-700-rgb:122,88,29;--hsds-color-yellow-800:#574323ff;--hsds-color-yellow-800-rgb:87,67,35;--hsds-color-yellow-900:#403521ff;--hsds-color-yellow-900-rgb:64,53,33;--hsds-color-yellow-950:var(--hsds-color-yellow-900);--hsds-color-yellow-950-rgb:var(--hsds-color-yellow-900-rgb);--hsds-color-yellow-1000:#2b261dff;--hsds-color-yellow-1000-rgb:43,38,29;--hsds-color-yellow-accent:#ffb83dff;--hsds-color-link-default:var(--hsds-color-cobalt-600);--hsds-color-link-base:var(--hsds-color-cobalt-600);--hsds-color-link-hover:var(--hsds-color-cobalt-700);--hsds-color-link-active:var(--hsds-color-cobalt-800);--hsds-color-link-focus:var(--hsds-color-cobalt-600);--hsds-color-link-disabled:var(--hsds-color-charcoal-500);--hsds-color-focusRing:var(--hsds-color-cobalt-600);--hsds-color-text-default:var(--hsds-color-charcoal-500);--hsds-color-text-subtle:var(--hsds-color-charcoal-500);--hsds-color-text-slightlyMuted:var(--hsds-color-charcoal-400);--hsds-color-text-muted:var(--hsds-color-charcoal-400);--hsds-color-text-faint:var(--hsds-color-charcoal-200);--hsds-color-text-extraMuted:var(--hsds-color-grey-600);--hsds-color-border-default:var(--hsds-color-grey-400);--hsds-color-border-divider:var(--hsds-color-grey-300);--hsds-color-border-ui-default:var(--hsds-color-grey-500);--hsds-color-border-ui-dark:var(--hsds-color-grey-600);--hsds-color-state-danger-default:var(--hsds-color-red-600);--hsds-color-state-danger-backgroundColor:#ffe8e4de;--hsds-color-state-danger-borderColor:var(--hsds-color-red-500);--hsds-color-state-danger-color:var(--hsds-color-red-600);--hsds-color-state-danger-icon:var(--hsds-color-red-accent);--hsds-color-state-error-default:var(--hsds-color-state-danger-default);--hsds-color-state-error-backgroundColor:var( --hsds-color-state-danger-backgroundColor );--hsds-color-state-error-borderColor:var( --hsds-color-state-danger-borderColor );--hsds-color-state-error-color:var(--hsds-color-state-danger-color);--hsds-color-state-error-icon:var(--hsds-color-state-danger-icon);--hsds-color-state-info-default:var(--hsds-color-cobalt-700);--hsds-color-state-info-backgroundColor:var(--hsds-color-cobalt-100);--hsds-color-state-info-borderColor:var(--hsds-color-cobalt-500);--hsds-color-state-info-color:var(--hsds-color-cobalt-700);--hsds-color-state-info-icon:var(--hsds-color-cobalt-500);--hsds-color-state-success-default:var(--hsds-color-green-800);--hsds-color-state-success-backgroundColor:var(--hsds-color-green-100);--hsds-color-state-success-borderColor:var(--hsds-color-green-500);--hsds-color-state-success-color:var(--hsds-color-green-800);--hsds-color-state-success-icon:var(--hsds-color-green-500);--hsds-color-state-warning-default:var(--hsds-color-yellow-500);--hsds-color-state-warning-backgroundColor:var(--hsds-color-yellow-100);--hsds-color-state-warning-borderColor:var(--hsds-color-yellow-400);--hsds-color-state-warning-color:var(--hsds-color-orange-600);--hsds-color-state-warning-icon:var(--hsds-color-yellow-accent);--hsds-color-red-100:#fff0e8ff;--hsds-color-red-100-rgb:255,240,232;--hsds-color-red-200:#fedfd5ff;--hsds-color-red-200-rgb:254,223,213;--hsds-color-red-300:#ffbcadff;--hsds-color-red-300-rgb:255,188,173;--hsds-color-red-400:#fa7a64ff;--hsds-color-red-400-rgb:250,122,100;--hsds-color-red-500:#e54a32ff;--hsds-color-red-500-rgb:229,74,50;--hsds-color-red-600:#b83525ff;--hsds-color-red-600-rgb:184,53,37;--hsds-color-red-700:#822824ff;--hsds-color-red-700-rgb:130,40,36;--hsds-color-red-800:#592728ff;--hsds-color-red-800-rgb:89,39,40;--hsds-color-red-900:#402629ff;--hsds-color-red-900-rgb:64,38,41;--hsds-color-red-1000:#2b2123ff;--hsds-color-red-1000-rgb:43,33,35;--hsds-color-red-accent:#ff4747ff;--hsds-color-orange-100:#fff2e8ff;--hsds-color-orange-100-rgb:255,242,232;--hsds-color-orange-200:#ffe4d1ff;--hsds-color-orange-200-rgb:255,228,209;--hsds-color-orange-300:#fac096ff;--hsds-color-orange-300-rgb:250,192,150;--hsds-color-orange-400:#f5964eff;--hsds-color-orange-400-rgb:245,150,78;--hsds-color-orange-500:#d67022ff;--hsds-color-orange-500-rgb:214,112,34;--hsds-color-orange-600:#a35214ff;--hsds-color-orange-600-rgb:163,82,20;--hsds-color-orange-700:#7a4518ff;--hsds-color-orange-700-rgb:122,69,24;--hsds-color-orange-800:#573b23ff;--hsds-color-orange-800-rgb:87,59,35;--hsds-color-orange-900:#3d2f22ff;--hsds-color-orange-900-rgb:61,47,34;--hsds-color-orange-1000:#2b241dff;--hsds-color-orange-1000-rgb:43,36,29;--hsds-color-orange-accent:#ff8b33ff;--hsds-color-slate-100:#f2f9fcff;--hsds-color-slate-100-rgb:242,249,252;--hsds-color-slate-200:#e1eef5ff;--hsds-color-slate-200-rgb:225,238,245;--hsds-color-slate-300:#ccdee8ff;--hsds-color-slate-300-rgb:204,222,232;--hsds-color-slate-400:#a9c4d4ff;--hsds-color-slate-400-rgb:169,196,212;--hsds-color-slate-500:#82a7baff;--hsds-color-slate-500-rgb:130,167,186;--hsds-color-slate-600:#658b9eff;--hsds-color-slate-600-rgb:101,139,158;--hsds-color-slate-700:#486878ff;--hsds-color-slate-700-rgb:72,104,120;--hsds-color-slate-800:#344852ff;--hsds-color-slate-800-rgb:52,72,82;--hsds-color-slate-900:#283338ff;--hsds-color-slate-900-rgb:40,51,56;--hsds-color-slate-1000:#1f2426ff;--hsds-color-slate-1000-rgb:31,36,38;--hsds-color-slate-accent:#47c2ffff;--hsds-color-cobalt-100:#ebf5ffff;--hsds-color-cobalt-100-rgb:235,245,255;--hsds-color-cobalt-200:#d1e8ffff;--hsds-color-cobalt-200-rgb:209,232,255;--hsds-color-cobalt-300:#9ecbffff;--hsds-color-cobalt-300-rgb:158,203,255;--hsds-color-cobalt-400:#5a9afaff;--hsds-color-cobalt-400-rgb:90,154,250;--hsds-color-cobalt-500:#3b70f5ff;--hsds-color-cobalt-500-rgb:59,112,245;--hsds-color-cobalt-600:#2745c2ff;--hsds-color-cobalt-600-rgb:39,69,194;--hsds-color-cobalt-700:#1e2d94ff;--hsds-color-cobalt-700-rgb:30,45,148;--hsds-color-cobalt-800:#1c2674ff;--hsds-color-cobalt-800-rgb:28,38,116;--hsds-color-cobalt-900:#171952ff;--hsds-color-cobalt-900-rgb:23,25,82;--hsds-color-cobalt-1000:#0e0e33ff;--hsds-color-cobalt-1000-rgb:14,14,51;--hsds-color-cobalt-accent:#3377ffff;--hsds-color-purple-100:#f9f2ffff;--hsds-color-purple-100-rgb:249,242,255;--hsds-color-purple-200:#f2e5ffff;--hsds-color-purple-200-rgb:242,229,255;--hsds-color-purple-300:#d7baf5ff;--hsds-color-purple-300-rgb:215,186,245;--hsds-color-purple-400:#ad82d8ff;--hsds-color-purple-400-rgb:173,130,216;--hsds-color-purple-500:#9163bfff;--hsds-color-purple-500-rgb:145,99,191;--hsds-color-purple-600:#774ba3ff;--hsds-color-purple-600-rgb:119,75,163;--hsds-color-purple-700:#5d407aff;--hsds-color-purple-700-rgb:93,64,122;--hsds-color-purple-800:#48335cff;--hsds-color-purple-800-rgb:72,51,92;--hsds-color-purple-900:#31253dff;--hsds-color-purple-900-rgb:49,37,61;--hsds-color-purple-1000:#271f2eff;--hsds-color-purple-1000-rgb:39,31,46;--hsds-color-purple-accent:#c285ffff;--hsds-color-magenta-100:#fff2f4ff;--hsds-color-magenta-100-rgb:255,242,244;--hsds-color-magenta-200:#ffe5eaff;--hsds-color-magenta-200-rgb:255,229,234;--hsds-color-magenta-300:#ffc7d3ff;--hsds-color-magenta-300-rgb:255,199,211;--hsds-color-magenta-400:#e5859fff;--hsds-color-magenta-400-rgb:229,133,159;--hsds-color-magenta-500:#bf5878ff;--hsds-color-magenta-500-rgb:191,88,120;--hsds-color-magenta-600:#a34b6bff;--hsds-color-magenta-600-rgb:163,75,107;--hsds-color-magenta-700:#863e5cff;--hsds-color-magenta-700-rgb:134,62,92;--hsds-color-magenta-800:#5e3146ff;--hsds-color-magenta-800-rgb:94,49,70;--hsds-color-magenta-900:#3d2531ff;--hsds-color-magenta-900-rgb:61,37,49;--hsds-color-magenta-1000:#2e2126ff;--hsds-color-magenta-1000-rgb:46,33,38;--hsds-color-magenta-accent:#ff5caaff;--hsds-color-clay-100:#faf8f7ff;--hsds-color-clay-100-rgb:250,248,247;--hsds-color-clay-200:#f5f2f0ff;--hsds-color-clay-200-rgb:245,242,240;--hsds-color-clay-300:#ede8e6ff;--hsds-color-clay-300-rgb:237,232,230;--hsds-color-clay-400:#ded5d1ff;--hsds-color-clay-400-rgb:222,213,209;--hsds-color-clay-500:#c2b4acff;--hsds-color-clay-500-rgb:194,180,172;--hsds-color-clay-600:#9e8f88ff;--hsds-color-clay-600-rgb:158,143,136;--hsds-color-clay-700:#8a7b74ff;--hsds-color-clay-700-rgb:138,123,116;--hsds-color-clay-800:#756963ff;--hsds-color-clay-800-rgb:117,105,99;--hsds-color-clay-900:#574f4bff;--hsds-color-clay-900-rgb:87,79,75;--hsds-color-clay-1000:#4a4441ff;--hsds-color-clay-1000-rgb:74,68,65;--hsds-color-clay-1100:#33302eff;--hsds-color-clay-1100-rgb:51,48,46;--hsds-color-clay-1200:#262423ff;--hsds-color-clay-1200-rgb:38,36,35;--hsds-color-functional-link-default:var(--hsds-color-cobalt-600);--hsds-color-functional-link-hovered:var(--hsds-color-cobalt-700);--hsds-color-functional-link-pressed:var(--hsds-color-cobalt-800);--hsds-color-functional-link-disabled:var(--hsds-color-charcoal-500);--hsds-color-functional-text-headline:var(--hsds-color-charcoal-1200);--hsds-color-functional-text-dark:var(--hsds-color-charcoal-900);--hsds-color-functional-text-default:var(--hsds-color-charcoal-800);--hsds-color-functional-text-light:var(--hsds-color-charcoal-700);--hsds-color-functional-success-text:var(--hsds-color-green-800);--hsds-color-functional-success-icon:var(--hsds-color-green-500);--hsds-color-functional-success-border:var(--hsds-color-green-300);--hsds-color-functional-success-background:var(--hsds-color-green-100);--hsds-color-functional-error-text:var(--hsds-color-red-700);--hsds-color-functional-error-icon:var(--hsds-color-red-500);--hsds-color-functional-error-border:var(--hsds-color-red-300);--hsds-color-functional-error-background:var(--hsds-color-red-100);--hsds-color-functional-warning-text:var(--hsds-color-yellow-800);--hsds-color-functional-warning-icon:var(--hsds-color-yellow-400);--hsds-color-functional-warning-border:var(--hsds-color-yellow-200);--hsds-color-functional-warning-background:var(--hsds-color-yellow-100);--hsds-color-basics-white:#ffffffff;--hsds-color-basics-black:#000000ff;--hsds-color-basics-magenta:#ff00ffff;--hsds-color-basics-cyan:#00ffffff;"]);
+const tokens = (0, _styledComponents.css)(["--hsds-attachment-color-removeButton-hover:var(--hsds-color-red-700);--hsds-attachment-color-removeButton-borderHover:var(--hsds-color-red-600);--hsds-attachment-color-error:var(--hsds-color-red-600);--hsds-badge-color-default:var(--hsds-color-charcoal-700);--hsds-button-color-blue-main:var(--hsds-color-cobalt-600);--hsds-button-color-blue-hover:var(--hsds-color-cobalt-700);--hsds-button-color-blue-text:white;--hsds-button-color-blue-outline-border:var(--hsds-color-cobalt-500);--hsds-button-color-blue-outline-borderHover:var(--hsds-color-cobalt-500);--hsds-button-color-blue-outline-text:var(--hsds-color-cobalt-600);--hsds-button-color-blue-outline-textHover:var(--hsds-color-cobalt-700);--hsds-button-color-blue-outline-hover:var(--hsds-color-cobalt-100);--hsds-button-color-blue-outline-hoverIconOnly:var(--hsds-color-cobalt-100);--hsds-button-color-blue-outline-textSeamlessHover:var( --hsds-color-cobalt-800 );--hsds-button-color-red-main:var(--hsds-color-red-600);--hsds-button-color-red-hover:var(--hsds-color-red-700);--hsds-button-color-red-text:white;--hsds-button-color-red-outline-border:var(--hsds-color-red-500);--hsds-button-color-red-outline-borderHover:var(--hsds-color-red-500);--hsds-button-color-red-outline-text:var(--hsds-color-red-600);--hsds-button-color-red-outline-textHover:var(--hsds-color-red-700);--hsds-button-color-red-outline-hover:var(--hsds-color-red-100);--hsds-button-color-red-outline-hoverIconOnly:var(--hsds-color-red-100);--hsds-button-color-red-outline-textSeamlessHover:var(--hsds-color-red-700);--hsds-button-color-green-main:var(--hsds-color-green-750);--hsds-button-color-green-hover:var(--hsds-color-green-800);--hsds-button-color-green-text:white;--hsds-button-color-green-outline-border:var(--hsds-color-green-500);--hsds-button-color-green-outline-borderHover:var(--hsds-color-green-500);--hsds-button-color-green-outline-text:var(--hsds-color-green-750);--hsds-button-color-green-outline-textHover:var(--hsds-color-green-800);--hsds-button-color-green-outline-hover:var(--hsds-color-green-100);--hsds-button-color-green-outline-hoverIconOnly:var(--hsds-color-green-100);--hsds-button-color-green-outline-textSeamlessHover:var( --hsds-color-green-900 );--hsds-button-color-grey-main:var(--hsds-color-charcoal-400);--hsds-button-color-grey-hover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-text:white;--hsds-button-color-grey-outline-border:var(--hsds-color-grey-700);--hsds-button-color-grey-outline-borderHover:var(--hsds-color-grey-800);--hsds-button-color-grey-outline-text:var(--hsds-color-charcoal-400);--hsds-button-color-grey-outline-textHover:var(--hsds-color-charcoal-500);--hsds-button-color-grey-outline-hover:var(--hsds-color-grey-200);--hsds-button-color-grey-outline-hoverIconOnly:var(--hsds-color-grey-300);--hsds-button-color-grey-outline-textSeamlessHover:var( --hsds-color-charcoal-800 );--hsds-button-color-yellow-main:var(--hsds-color-orange-600);--hsds-button-color-yellow-hover:var(--hsds-color-orange-700);--hsds-button-color-yellow-text:white;--hsds-button-color-yellow-outline-border:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-borderHover:var(--hsds-color-yellow-400);--hsds-button-color-yellow-outline-text:var(--hsds-color-orange-600);--hsds-button-color-yellow-outline-textHover:var(--hsds-color-orange-700);--hsds-button-color-yellow-outline-hover:var(--hsds-color-yellow-100);--hsds-button-color-yellow-outline-hoverIconOnly:var( --hsds-color-yellow-100 );--hsds-button-color-yellow-outline-textSeamlessHover:var( --hsds-color-orange-700 );--hsds-button-color-disabled-main:var(--hsds-color-grey-500);--hsds-button-color-disabled-text:white;--hsds-button-color-disabled-outline-border:var(--hsds-color-grey-600);--hsds-button-color-disabled-outline-text:var(--hsds-color-grey-800);--hsds-datePicker-color-range-background:var(--hsds-color-cobalt-100);--hsds-datePicker-color-range-selectedBackground:var( --hsds-color-cobalt-600 );--hsds-datePicker-color-range-text:var(--hsds-color-cobalt-600);--hsds-datePicker-color-range-textHover:var(--hsds-color-cobalt-700);--hsds-datePicker-color-current-background:var(--hsds-color-grey-400);--hsds-datePicker-color-current-text:var(--hsds-color-charcoal-700);--hsds-statusBar-color-light-error-border:var(--hsds-color-red-200);--hsds-statusBar-color-light-info-border:var(--hsds-color-cobalt-200);--hsds-statusBar-color-light-success-border:var(--hsds-color-green-200);--hsds-statusBar-color-light-warning-border:var(--hsds-color-yellow-200);--hsds-statusBar-color-bold-error-border:var(--hsds-color-red-700);--hsds-statusBar-color-bold-error-button:var(--hsds-color-red-700);--hsds-statusBar-color-bold-info-border:var(--hsds-color-cobalt-700);--hsds-statusBar-color-bold-info-button:var(--hsds-color-cobalt-700);--hsds-statusBar-color-bold-success-border:var(--hsds-color-green-700);--hsds-statusBar-color-bold-success-button:var(--hsds-color-green-700);--hsds-statusBar-color-bold-warning-border:var(--hsds-color-orange-700);--hsds-statusBar-color-bold-warning-button:var(--hsds-color-orange-700);--hsds-statusDot-color-light-default:var(--hsds-color-slate-500);--hsds-statusDot-color-light-active:var(--hsds-color-green-500);--hsds-statusDot-color-light-inactive:var(--hsds-color-slate-500);--hsds-statusDot-color-light-offline:var(--hsds-color-red-500);--hsds-statusDot-color-light-busy:var(--hsds-color-yellow-400);--hsds-statusDot-color-light-custom:var(--hsds-color-purple-400);--hsds-statusDot-color-dark-default:var(--hsds-color-slate-accent);--hsds-statusDot-color-dark-active:var(--hsds-color-green-accent);--hsds-statusDot-color-dark-inactive:var(--hsds-color-slate-accent);--hsds-statusDot-color-dark-offline:var(--hsds-color-red-accent);--hsds-statusDot-color-dark-busy:var(--hsds-color-yellow-accent);--hsds-statusDot-color-dark-custom:var(--hsds-color-purple-accent);--hsds-switchComponent-color-error:var(--hsds-color-state-error-default);--hsds-verificationCode-color-error:var(--hsds-color-state-error-default);--hsds-color-blue-100:var(--hsds-color-cobalt-100);--hsds-color-blue-100-rgb:var(--hsds-color-cobalt-100-rgb);--hsds-color-blue-200:var(--hsds-color-cobalt-200);--hsds-color-blue-200-rgb:var(--hsds-color-cobalt-200-rgb);--hsds-color-blue-300:var(--hsds-color-cobalt-300);--hsds-color-blue-300-rgb:var(--hsds-color-cobalt-300-rgb);--hsds-color-blue-400:var(--hsds-color-cobalt-400);--hsds-color-blue-400-rgb:var(--hsds-color-cobalt-400-rgb);--hsds-color-blue-500:var(--hsds-color-cobalt-600);--hsds-color-blue-500-rgb:var(--hsds-color-cobalt-600-rgb);--hsds-color-blue-600:var(--hsds-color-cobalt-600);--hsds-color-blue-600-rgb:var(--hsds-color-cobalt-600-rgb);--hsds-color-blue-700:var(--hsds-color-cobalt-700);--hsds-color-blue-700-rgb:var(--hsds-color-cobalt-700-rgb);--hsds-color-blue-800:var(--hsds-color-cobalt-800);--hsds-color-blue-800-rgb:var(--hsds-color-cobalt-800-rgb);--hsds-color-blue-900:var(--hsds-color-cobalt-900);--hsds-color-blue-900-rgb:var(--hsds-color-cobalt-900-rgb);--hsds-color-blue-default:var(--hsds-color-cobalt-500);--hsds-color-charcoal-200:#7e8e9e;--hsds-color-charcoal-200-rgb:126,142,158;--hsds-color-charcoal-300:#7e8e9e;--hsds-color-charcoal-300-rgb:126,142,158;--hsds-color-charcoal-400:#556575;--hsds-color-charcoal-400-rgb:85,101,117;--hsds-color-charcoal-500:#405261;--hsds-color-charcoal-500-rgb:64,82,97;--hsds-color-charcoal-600:#314351;--hsds-color-charcoal-600-rgb:49,67,81;--hsds-color-charcoal-700:#253642;--hsds-color-charcoal-700-rgb:37,54,66;--hsds-color-charcoal-800:#1d2b36;--hsds-color-charcoal-800-rgb:29,43,54;--hsds-color-charcoal-default:var(--hsds-color-charcoal-500);--hsds-color-grey-200:#f9fafa;--hsds-color-grey-200-rgb:249,250,250;--hsds-color-grey-300:#f1f3f5;--hsds-color-grey-300-rgb:241,243,245;--hsds-color-grey-400:#dfe6eb;--hsds-color-grey-400-rgb:223,230,235;--hsds-color-grey-500:#c8d3de;--hsds-color-grey-500-rgb:200,211,222;--hsds-color-grey-600:#abb9c7;--hsds-color-grey-600-rgb:171,185,199;--hsds-color-grey-700:#abb9c7;--hsds-color-grey-700-rgb:171,185,199;--hsds-color-grey-800:#abb9c7;--hsds-color-grey-800-rgb:171,185,199;--hsds-color-ash-200:var(--hsds-color-grey-200);--hsds-color-ash-200-rgb:var(--hsds-color-grey-200-rgb);--hsds-color-ash-300:var(--hsds-color-grey-300);--hsds-color-ash-300-rgb:var(--hsds-color-grey-300-rgb);--hsds-color-ash-400:var(--hsds-color-grey-400);--hsds-color-ash-400-rgb:var(--hsds-color-grey-400-rgb);--hsds-color-ash-500:var(--hsds-color-grey-500);--hsds-color-ash-500-rgb:var(--hsds-color-grey-500-rgb);--hsds-color-ash-600:var(--hsds-color-grey-600);--hsds-color-ash-600-rgb:var(--hsds-color-grey-600-rgb);--hsds-color-ash-700:var(--hsds-color-grey-700);--hsds-color-ash-700-rgb:var(--hsds-color-grey-700-rgb);--hsds-color-ash-800:var(--hsds-color-grey-800);--hsds-color-ash-800-rgb:var(--hsds-color-grey-800-rgb);--hsds-color-indigo-200:var(--hsds-color-cobalt-100);--hsds-color-indigo-200-rgb:var(--hsds-color-cobalt-100-rgb);--hsds-color-indigo-300:var(--hsds-color-cobalt-200);--hsds-color-indigo-300-rgb:var(--hsds-color-cobalt-200-rgb);--hsds-color-indigo-400:var(--hsds-color-cobalt-300);--hsds-color-indigo-400-rgb:var(--hsds-color-cobalt-300-rgb);--hsds-color-indigo-500:var(--hsds-color-cobalt-400);--hsds-color-indigo-500-rgb:var(--hsds-color-cobalt-400-rgb);--hsds-color-indigo-600:var(--hsds-color-cobalt-500);--hsds-color-indigo-600-rgb:var(--hsds-color-cobalt-500-rgb);--hsds-color-indigo-700:var(--hsds-color-cobalt-600);--hsds-color-indigo-700-rgb:var(--hsds-color-cobalt-600-rgb);--hsds-color-indigo-800:var(--hsds-color-cobalt-700);--hsds-color-indigo-800-rgb:var(--hsds-color-cobalt-700-rgb);--hsds-color-indigo-900:var(--hsds-color-cobalt-800);--hsds-color-indigo-900-rgb:var(--hsds-color-cobalt-800-rgb);--hsds-color-indigo-1000:var(--hsds-color-cobalt-900);--hsds-color-indigo-1000-rgb:var(--hsds-color-cobalt-900-rgb);--hsds-color-indigo-default:var(--hsds-color-indigo-500);--hsds-color-lavender-100:var(--hsds-color-purple-100);--hsds-color-lavender-100-rgb:var(--hsds-color-purple-100-rgb);--hsds-color-lavender-200:var(--hsds-color-purple-200);--hsds-color-lavender-200-rgb:var(--hsds-color-purple-200-rgb);--hsds-color-lavender-300:var(--hsds-color-purple-300);--hsds-color-lavender-300-rgb:var(--hsds-color-purple-300-rgb);--hsds-color-lavender-400:var(--hsds-color-purple-400);--hsds-color-lavender-400-rgb:var(--hsds-color-purple-400-rgb);--hsds-color-lavender-500:var(--hsds-color-purple-500);--hsds-color-lavender-500-rgb:var(--hsds-color-purple-500-rgb);--hsds-color-lavender-600:var(--hsds-color-purple-600);--hsds-color-lavender-600-rgb:var(--hsds-color-purple-600-rgb);--hsds-color-lavender-700:var(--hsds-color-purple-700);--hsds-color-lavender-700-rgb:var(--hsds-color-purple-700-rgb);--hsds-color-lavender-800:var(--hsds-color-purple-800);--hsds-color-lavender-800-rgb:var(--hsds-color-purple-800-rgb);--hsds-color-lavender-900:var(--hsds-color-purple-900);--hsds-color-lavender-900-rgb:var(--hsds-color-purple-900-rgb);--hsds-color-lavender-default:var(--hsds-color-lavender-500);--hsds-color-pink-100:var(--hsds-color-red-100);--hsds-color-pink-100-rgb:var(--hsds-color-red-100-rgb);--hsds-color-pink-200:var(--hsds-color-red-200);--hsds-color-pink-200-rgb:var(--hsds-color-red-200-rgb);--hsds-color-pink-300:var(--hsds-color-red-300);--hsds-color-pink-300-rgb:var(--hsds-color-red-300-rgb);--hsds-color-pink-400:var(--hsds-color-red-400);--hsds-color-pink-400-rgb:var(--hsds-color-red-400-rgb);--hsds-color-pink-500:var(--hsds-color-red-500);--hsds-color-pink-500-rgb:var(--hsds-color-red-500-rgb);--hsds-color-pink-600:var(--hsds-color-red-600);--hsds-color-pink-600-rgb:var(--hsds-color-red-600-rgb);--hsds-color-pink-700:var(--hsds-color-red-700);--hsds-color-pink-700-rgb:var(--hsds-color-red-700-rgb);--hsds-color-pink-800:var(--hsds-color-red-800);--hsds-color-pink-800-rgb:var(--hsds-color-red-800-rgb);--hsds-color-pink-900:var(--hsds-color-red-900);--hsds-color-pink-900-rgb:var(--hsds-color-red-900-rgb);--hsds-color-pink-950:var(--hsds-color-red-900);--hsds-color-pink-950-rgb:var(--hsds-color-red-900-rgb);--hsds-color-pink-1000:var(--hsds-color-red-900);--hsds-color-pink-1000-rgb:var(--hsds-color-red-900-rgb);--hsds-color-green-100:#f2fff0ff;--hsds-color-green-100-rgb:242,255,240;--hsds-color-green-200:#e0fcdeff;--hsds-color-green-200-rgb:224,252,222;--hsds-color-green-300:#b9edbdff;--hsds-color-green-300-rgb:185,237,189;--hsds-color-green-400:#83db9cff;--hsds-color-green-400-rgb:131,219,156;--hsds-color-green-500:#47c47dff;--hsds-color-green-500-rgb:71,196,125;--hsds-color-green-600:#2d8556ff;--hsds-color-green-600-rgb:45,133,86;--hsds-color-green-700:#28704cff;--hsds-color-green-700-rgb:40,112,76;--hsds-color-green-750:var(--hsds-color-green-800);--hsds-color-green-750-rgb:var(--hsds-color-green-800-rgb);--hsds-color-green-800:#2e5940ff;--hsds-color-green-800-rgb:46,89,64;--hsds-color-green-900:#283b2dff;--hsds-color-green-900-rgb:40,59,45;--hsds-color-green-1000:#222923ff;--hsds-color-green-1000-rgb:34,41,35;--hsds-color-green-accent:#56f09eff;--hsds-color-yellow-50:var(--hsds-color-yellow-100);--hsds-color-yellow-100:#fff6e5ff;--hsds-color-yellow-100-rgb:255,246,229;--hsds-color-yellow-200:#ffeeccff;--hsds-color-yellow-200-rgb:255,238,204;--hsds-color-yellow-300:#ffdd99ff;--hsds-color-yellow-300-rgb:255,221,153;--hsds-color-yellow-400:#fabf5aff;--hsds-color-yellow-400-rgb:250,191,90;--hsds-color-yellow-500:#e09c24ff;--hsds-color-yellow-500-rgb:224,156,36;--hsds-color-yellow-600:#ac771bff;--hsds-color-yellow-600-rgb:172,119,27;--hsds-color-yellow-700:#7a581dff;--hsds-color-yellow-700-rgb:122,88,29;--hsds-color-yellow-800:#574323ff;--hsds-color-yellow-800-rgb:87,67,35;--hsds-color-yellow-900:#403521ff;--hsds-color-yellow-900-rgb:64,53,33;--hsds-color-yellow-950:var(--hsds-color-yellow-900);--hsds-color-yellow-950-rgb:var(--hsds-color-yellow-900-rgb);--hsds-color-yellow-1000:#2b261dff;--hsds-color-yellow-1000-rgb:43,38,29;--hsds-color-yellow-accent:#ffb83dff;--hsds-color-link-default:var(--hsds-color-cobalt-600);--hsds-color-link-base:var(--hsds-color-cobalt-600);--hsds-color-link-hover:var(--hsds-color-cobalt-700);--hsds-color-link-active:var(--hsds-color-cobalt-800);--hsds-color-link-focus:var(--hsds-color-cobalt-600);--hsds-color-link-disabled:var(--hsds-color-charcoal-500);--hsds-color-focusRing:var(--hsds-color-cobalt-600);--hsds-color-text-default:var(--hsds-color-charcoal-500);--hsds-color-text-subtle:var(--hsds-color-charcoal-500);--hsds-color-text-slightlyMuted:var(--hsds-color-charcoal-400);--hsds-color-text-muted:var(--hsds-color-charcoal-400);--hsds-color-text-faint:var(--hsds-color-charcoal-200);--hsds-color-text-extraMuted:var(--hsds-color-grey-600);--hsds-color-border-default:var(--hsds-color-grey-400);--hsds-color-border-divider:var(--hsds-color-grey-300);--hsds-color-border-ui-default:var(--hsds-color-grey-500);--hsds-color-border-ui-dark:var(--hsds-color-grey-600);--hsds-color-state-error-text:var(--hsds-color-red-600);--hsds-color-state-error-backgroundDark:var(--hsds-color-red-600);--hsds-color-state-error-icon:var(--hsds-color-red-accent);--hsds-color-state-error-borderColor:var(--hsds-color-red-500);--hsds-color-state-error-backgroundLight:#fa7a6428;--hsds-color-state-error-default:var(--hsds-color-red-600);--hsds-color-state-error-color:var(--hsds-color-red-600);--hsds-color-state-info-text:var(--hsds-color-cobalt-700);--hsds-color-state-info-backgroundDark:var(--hsds-color-cobalt-600);--hsds-color-state-info-icon:var(--hsds-color-cobalt-500);--hsds-color-state-info-borderColor:var(--hsds-color-cobalt-500);--hsds-color-state-info-backgroundLight:var(--hsds-color-cobalt-100);--hsds-color-state-info-default:var(--hsds-color-cobalt-700);--hsds-color-state-info-color:var(--hsds-color-cobalt-700);--hsds-color-state-success-text:var(--hsds-color-green-800);--hsds-color-state-success-backgroundDark:var(--hsds-color-green-600);--hsds-color-state-success-icon:var(--hsds-color-green-500);--hsds-color-state-success-borderColor:var(--hsds-color-green-500);--hsds-color-state-success-backgroundLight:var(--hsds-color-green-100);--hsds-color-state-success-default:var(--hsds-color-green-800);--hsds-color-state-success-color:var(--hsds-color-green-800);--hsds-color-state-warning-text:var(--hsds-color-orange-600);--hsds-color-state-warning-backgroundDark:var(--hsds-color-orange-600);--hsds-color-state-warning-icon:var(--hsds-color-yellow-accent);--hsds-color-state-warning-borderColor:var(--hsds-color-yellow-400);--hsds-color-state-warning-backgroundLight:var(--hsds-color-yellow-100);--hsds-color-state-warning-color:var(--hsds-color-orange-600);--hsds-color-state-warning-default:var(--hsds-color-yellow-500);--hsds-color-state-danger-default:var(--hsds-color-state-error-default);--hsds-color-state-danger-backgroundLight:var( --hsds-color-state-error-backgroundLight );--hsds-color-state-danger-backgroundDark:var( --hsds-color-state-error-backgroundDark );--hsds-color-state-danger-borderColor:var( --hsds-color-state-error-borderColor );--hsds-color-state-danger-color:var(--hsds-color-state-error-color);--hsds-color-state-danger-text:var(--hsds-color-state-error-text);--hsds-color-state-danger-icon:var(--hsds-color-state-error-icon);--hsds-color-red-100:#fff0e8ff;--hsds-color-red-100-rgb:255,240,232;--hsds-color-red-200:#fedfd5ff;--hsds-color-red-200-rgb:254,223,213;--hsds-color-red-300:#ffbcadff;--hsds-color-red-300-rgb:255,188,173;--hsds-color-red-400:#fa7a64ff;--hsds-color-red-400-rgb:250,122,100;--hsds-color-red-500:#e54a32ff;--hsds-color-red-500-rgb:229,74,50;--hsds-color-red-600:#b83525ff;--hsds-color-red-600-rgb:184,53,37;--hsds-color-red-700:#822824ff;--hsds-color-red-700-rgb:130,40,36;--hsds-color-red-800:#592728ff;--hsds-color-red-800-rgb:89,39,40;--hsds-color-red-900:#402629ff;--hsds-color-red-900-rgb:64,38,41;--hsds-color-red-1000:#2b2123ff;--hsds-color-red-1000-rgb:43,33,35;--hsds-color-red-accent:#ff6047ff;--hsds-color-orange-100:#fff2e8ff;--hsds-color-orange-100-rgb:255,242,232;--hsds-color-orange-200:#ffe4d1ff;--hsds-color-orange-200-rgb:255,228,209;--hsds-color-orange-300:#fac096ff;--hsds-color-orange-300-rgb:250,192,150;--hsds-color-orange-400:#f5964eff;--hsds-color-orange-400-rgb:245,150,78;--hsds-color-orange-500:#d67022ff;--hsds-color-orange-500-rgb:214,112,34;--hsds-color-orange-600:#a35214ff;--hsds-color-orange-600-rgb:163,82,20;--hsds-color-orange-700:#7a4518ff;--hsds-color-orange-700-rgb:122,69,24;--hsds-color-orange-800:#573b23ff;--hsds-color-orange-800-rgb:87,59,35;--hsds-color-orange-900:#3d2f22ff;--hsds-color-orange-900-rgb:61,47,34;--hsds-color-orange-1000:#2b241dff;--hsds-color-orange-1000-rgb:43,36,29;--hsds-color-orange-accent:#ff8b33ff;--hsds-color-slate-100:#f2f9fcff;--hsds-color-slate-100-rgb:242,249,252;--hsds-color-slate-200:#e1eef5ff;--hsds-color-slate-200-rgb:225,238,245;--hsds-color-slate-300:#ccdee8ff;--hsds-color-slate-300-rgb:204,222,232;--hsds-color-slate-400:#a9c4d4ff;--hsds-color-slate-400-rgb:169,196,212;--hsds-color-slate-500:#82a7baff;--hsds-color-slate-500-rgb:130,167,186;--hsds-color-slate-600:#658b9eff;--hsds-color-slate-600-rgb:101,139,158;--hsds-color-slate-700:#486878ff;--hsds-color-slate-700-rgb:72,104,120;--hsds-color-slate-800:#344852ff;--hsds-color-slate-800-rgb:52,72,82;--hsds-color-slate-900:#283338ff;--hsds-color-slate-900-rgb:40,51,56;--hsds-color-slate-1000:#1f2426ff;--hsds-color-slate-1000-rgb:31,36,38;--hsds-color-slate-accent:#47c2ffff;--hsds-color-cobalt-100:#ebf5ffff;--hsds-color-cobalt-100-rgb:235,245,255;--hsds-color-cobalt-200:#d1e8ffff;--hsds-color-cobalt-200-rgb:209,232,255;--hsds-color-cobalt-300:#9ecbffff;--hsds-color-cobalt-300-rgb:158,203,255;--hsds-color-cobalt-400:#66a3ffff;--hsds-color-cobalt-400-rgb:102,163,255;--hsds-color-cobalt-500:#4176faff;--hsds-color-cobalt-500-rgb:65,118,250;--hsds-color-cobalt-600:#304ddbff;--hsds-color-cobalt-600-rgb:48,77,219;--hsds-color-cobalt-700:#263aadff;--hsds-color-cobalt-700-rgb:38,58,173;--hsds-color-cobalt-800:#1c2674ff;--hsds-color-cobalt-800-rgb:28,38,116;--hsds-color-cobalt-900:#171952ff;--hsds-color-cobalt-900-rgb:23,25,82;--hsds-color-cobalt-1000:#0e0e33ff;--hsds-color-cobalt-1000-rgb:14,14,51;--hsds-color-cobalt-accent:#47a3ffff;--hsds-color-purple-100:#f9f2ffff;--hsds-color-purple-100-rgb:249,242,255;--hsds-color-purple-200:#f2e5ffff;--hsds-color-purple-200-rgb:242,229,255;--hsds-color-purple-300:#d7baf5ff;--hsds-color-purple-300-rgb:215,186,245;--hsds-color-purple-400:#ad82d8ff;--hsds-color-purple-400-rgb:173,130,216;--hsds-color-purple-500:#9163bfff;--hsds-color-purple-500-rgb:145,99,191;--hsds-color-purple-600:#774ba3ff;--hsds-color-purple-600-rgb:119,75,163;--hsds-color-purple-700:#5d407aff;--hsds-color-purple-700-rgb:93,64,122;--hsds-color-purple-800:#48335cff;--hsds-color-purple-800-rgb:72,51,92;--hsds-color-purple-900:#31253dff;--hsds-color-purple-900-rgb:49,37,61;--hsds-color-purple-1000:#271f2eff;--hsds-color-purple-1000-rgb:39,31,46;--hsds-color-purple-accent:#c285ffff;--hsds-color-magenta-100:#fff2f4ff;--hsds-color-magenta-100-rgb:255,242,244;--hsds-color-magenta-200:#ffe5eaff;--hsds-color-magenta-200-rgb:255,229,234;--hsds-color-magenta-300:#ffc7d3ff;--hsds-color-magenta-300-rgb:255,199,211;--hsds-color-magenta-400:#e5859fff;--hsds-color-magenta-400-rgb:229,133,159;--hsds-color-magenta-500:#bf5878ff;--hsds-color-magenta-500-rgb:191,88,120;--hsds-color-magenta-600:#a34b6bff;--hsds-color-magenta-600-rgb:163,75,107;--hsds-color-magenta-700:#863e5cff;--hsds-color-magenta-700-rgb:134,62,92;--hsds-color-magenta-800:#5e3146ff;--hsds-color-magenta-800-rgb:94,49,70;--hsds-color-magenta-900:#3d2531ff;--hsds-color-magenta-900-rgb:61,37,49;--hsds-color-magenta-1000:#2e2126ff;--hsds-color-magenta-1000-rgb:46,33,38;--hsds-color-magenta-accent:#ff5caaff;--hsds-color-clay-100:#faf8f7ff;--hsds-color-clay-100-rgb:250,248,247;--hsds-color-clay-200:#f5f2f0ff;--hsds-color-clay-200-rgb:245,242,240;--hsds-color-clay-300:#ede8e6ff;--hsds-color-clay-300-rgb:237,232,230;--hsds-color-clay-400:#ded5d1ff;--hsds-color-clay-400-rgb:222,213,209;--hsds-color-clay-500:#c2b4acff;--hsds-color-clay-500-rgb:194,180,172;--hsds-color-clay-600:#9e8f88ff;--hsds-color-clay-600-rgb:158,143,136;--hsds-color-clay-700:#8a7b74ff;--hsds-color-clay-700-rgb:138,123,116;--hsds-color-clay-800:#756963ff;--hsds-color-clay-800-rgb:117,105,99;--hsds-color-clay-900:#574f4bff;--hsds-color-clay-900-rgb:87,79,75;--hsds-color-clay-1000:#4a4441ff;--hsds-color-clay-1000-rgb:74,68,65;--hsds-color-clay-1100:#33302eff;--hsds-color-clay-1100-rgb:51,48,46;--hsds-color-clay-1200:#262423ff;--hsds-color-clay-1200-rgb:38,36,35;--hsds-color-functional-link-default:var(--hsds-color-cobalt-600);--hsds-color-functional-link-hovered:var(--hsds-color-cobalt-700);--hsds-color-functional-link-pressed:var(--hsds-color-cobalt-800);--hsds-color-functional-link-disabled:var(--hsds-color-charcoal-500);--hsds-color-functional-text-headline:var(--hsds-color-charcoal-1200);--hsds-color-functional-text-dark:var(--hsds-color-charcoal-900);--hsds-color-functional-text-default:var(--hsds-color-charcoal-800);--hsds-color-functional-text-light:var(--hsds-color-charcoal-700);--hsds-color-functional-success-text:var(--hsds-color-green-800);--hsds-color-functional-success-icon:var(--hsds-color-green-500);--hsds-color-functional-success-border:var(--hsds-color-green-300);--hsds-color-functional-success-background:var(--hsds-color-green-100);--hsds-color-functional-error-text:var(--hsds-color-red-700);--hsds-color-functional-error-icon:var(--hsds-color-red-500);--hsds-color-functional-error-border:var(--hsds-color-red-300);--hsds-color-functional-error-background:var(--hsds-color-red-100);--hsds-color-functional-warning-text:var(--hsds-color-yellow-800);--hsds-color-functional-warning-icon:var(--hsds-color-yellow-400);--hsds-color-functional-warning-border:var(--hsds-color-yellow-200);--hsds-color-functional-warning-background:var(--hsds-color-yellow-100);--hsds-color-basics-white:#ffffffff;--hsds-color-basics-black:#000000ff;--hsds-color-basics-magenta:#ff00ffff;--hsds-color-basics-cyan:#00ffffff;"]);
 exports.tokens = tokens;

package.json

 {
   "name": "@hsds/tokens",
-  "version": "7.9.2-alpha.5",
+  "version": "7.9.2-alpha.6",
   "peerDependencies": {
@@ -5,0 +5,0 @@ "prop-types": "~15.7.2",

src/js/default/badge.js

 export const badge = {
   color: {
     default: '#93A1B0',
-    status: {
-      error: '#e52f28',
-      info: '#1292EE',
-      success: '#56C288',
-      warning: '#FFC555',
-    },
-    statusInverted: {
-      error: {
-        border: '#e52f28',
-        text: '#e52f28',
-      },
-      info: {
-        border: '#1292EE',
-        text: '#1292EE',
-      },
-      success: {
-        border: '#56C288',
-        text: '#56C288',
-      },
-      warning: {
-        border: '#FFC555',
-        text: '#FFC555',
-      },
-    },
   },
 }

src/js/default/color.js

@@ -185,4 +185,8 @@ export const color = {
       backgroundColor: '#ffe3e2',
+      backgroundLight: '#ffe3e2',
+      backgroundDark: '#e52f28',
       borderColor: '#e52f28',
-      color: '#9d1f1a',
+      icon: '#e52f28',
+      color: '#e52f28',
+      text: '#e52f28',
     },
@@ -192,4 +196,8 @@ error: {
       backgroundColor: '#ffe3e2',
+      backgroundLight: '#ffe3e2',
+      backgroundDark: '#e52f28',
       borderColor: '#e52f28',
-      color: '#9d1f1a',
+      icon: '#e52f28',
+      color: '#e52f28',
+      text: '#e52f28',
     },
@@ -199,4 +207,8 @@ info: {
       backgroundColor: '#D6EDFF',
+      backgroundLight: '#D6EDFF',
+      backgroundDark: '#1292EE',
       borderColor: '#1292EE',
-      color: '#034077',
+      icon: '#1292EE',
+      color: '#1292EE',
+      text: '#1292EE',
     },
@@ -206,4 +218,8 @@ success: {
       backgroundColor: '#E3FBEE',
+      backgroundLight: '#E3FBEE',
+      backgroundDark: '#56C288',
       borderColor: '#56C288',
-      color: '#106236',
+      icon: '#56C288',
+      color: '#56C288',
+      text: '#56C288',
     },
@@ -213,4 +229,8 @@ warning: {
       backgroundColor: '#FFF2D7',
+      backgroundLight: '#FFF2D7',
+      backgroundDark: '#FFC555',
       borderColor: '#FFC555',
-      color: '#CE7129',
+      icon: '#FFC555',
+      color: '#FFC555',
+      text: '#FFC555',
     },
@@ -217,0 +237,0 @@ },

src/js/default/index.js

@@ -6,2 +6,3 @@ import { attachment } from './attachment'
 import { datePicker } from './datePicker'
+import { statusBar } from './statusBar'
 import { statusDot } from './statusDot'
@@ -17,2 +18,3 @@ import { tokens } from './styled-components'
   datePicker,
+  statusBar,
   statusDot,
@@ -19,0 +21,0 @@ switchComponent,

src/js/default/styled-components.js

@@ -8,34 +8,2 @@ import { css } from 'styled-components'
   --hsds-badge-color-default: var(--hsds-color-charcoal-200);
-  --hsds-badge-color-status-error: var(--hsds-color-state-error-borderColor);
-  --hsds-badge-color-status-info: var(--hsds-color-state-info-borderColor);
-  --hsds-badge-color-status-success: var(
-    --hsds-color-state-success-borderColor
-  );
-  --hsds-badge-color-status-warning: var(
-    --hsds-color-state-warning-borderColor
-  );
-  --hsds-badge-color-statusInverted-error-border: var(
-    --hsds-color-state-error-borderColor
-  );
-  --hsds-badge-color-statusInverted-error-text: var(
-    --hsds-color-state-error-borderColor
-  );
-  --hsds-badge-color-statusInverted-info-border: var(
-    --hsds-color-state-info-borderColor
-  );
-  --hsds-badge-color-statusInverted-info-text: var(
-    --hsds-color-state-info-borderColor
-  );
-  --hsds-badge-color-statusInverted-success-border: var(
-    --hsds-color-state-success-borderColor
-  );
-  --hsds-badge-color-statusInverted-success-text: var(
-    --hsds-color-state-success-borderColor
-  );
-  --hsds-badge-color-statusInverted-warning-border: var(
-    --hsds-color-state-warning-borderColor
-  );
-  --hsds-badge-color-statusInverted-warning-text: var(
-    --hsds-color-state-warning-borderColor
-  );
   --hsds-button-color-blue-main: var(--hsds-color-blue-500);
@@ -113,2 +81,14 @@ --hsds-button-color-blue-hover: var(--hsds-color-blue-600);
   --hsds-datePicker-color-current-text: var(--hsds-color-charcoal-700);
+  --hsds-statusBar-color-light-error-border: var(--hsds-color-red-300);
+  --hsds-statusBar-color-light-info-border: var(--hsds-color-blue-300);
+  --hsds-statusBar-color-light-success-border: var(--hsds-color-green-300);
+  --hsds-statusBar-color-light-warning-border: var(--hsds-color-yellow-300);
+  --hsds-statusBar-color-bold-error-border: var(--hsds-color-red-600);
+  --hsds-statusBar-color-bold-error-button: var(--hsds-color-red-700);
+  --hsds-statusBar-color-bold-info-border: var(--hsds-color-blue-600);
+  --hsds-statusBar-color-bold-info-button: var(--hsds-color-blue-700);
+  --hsds-statusBar-color-bold-success-border: var(--hsds-color-green-600);
+  --hsds-statusBar-color-bold-success-button: var(--hsds-color-green-700);
+  --hsds-statusBar-color-bold-warning-border: var(--hsds-color-yellow-600);
+  --hsds-statusBar-color-bold-warning-button: var(--hsds-color-yellow-700);
   --hsds-statusDot-color-light-default: var(--hsds-color-grey-600);
@@ -388,26 +368,56 @@ --hsds-statusDot-color-light-active: var(--hsds-color-green-500);
   --hsds-color-border-ui-dark: var(--hsds-color-grey-600);
-  --hsds-color-state-danger-default: var(--hsds-color-red-500);
-  --hsds-color-state-danger-backgroundColor: var(--hsds-color-red-200);
-  --hsds-color-state-danger-borderColor: var(--hsds-color-red-500);
-  --hsds-color-state-danger-color: var(--hsds-color-red-800);
-  --hsds-color-state-error-default: var(--hsds-color-state-danger-default);
-  --hsds-color-state-error-backgroundColor: var(
-    --hsds-color-state-danger-backgroundColor
+  --hsds-color-state-danger-default: var(--hsds-color-state-error-default);
+  --hsds-color-state-danger-backgroundColor: var(
+    --hsds-color-state-error-backgroundColor
   );
-  --hsds-color-state-error-borderColor: var(
-    --hsds-color-state-danger-borderColor
+  --hsds-color-state-danger-backgroundLight: var(
+    --hsds-color-state-error-backgroundColor
   );
-  --hsds-color-state-error-color: var(--hsds-color-state-danger-color);
+  --hsds-color-state-danger-backgroundDark: var(
+    --hsds-color-state-error-borderColor
+  );
+  --hsds-color-state-danger-borderColor: var(
+    --hsds-color-state-error-borderColor
+  );
+  --hsds-color-state-danger-icon: var(--hsds-color-state-error-borderColor);
+  --hsds-color-state-danger-color: var(--hsds-color-state-error-borderColor);
+  --hsds-color-state-danger-text: var(--hsds-color-state-error-borderColor);
+  --hsds-color-state-error-default: var(--hsds-color-red-500);
+  --hsds-color-state-error-backgroundColor: var(--hsds-color-red-200);
+  --hsds-color-state-error-backgroundLight: var(--hsds-color-red-200);
+  --hsds-color-state-error-backgroundDark: var(--hsds-color-red-500);
+  --hsds-color-state-error-borderColor: var(--hsds-color-red-500);
+  --hsds-color-state-error-icon: var(--hsds-color-red-500);
+  --hsds-color-state-error-color: var(--hsds-color-red-500);
+  --hsds-color-state-error-text: var(--hsds-color-red-500);
   --hsds-color-state-info-default: var(--hsds-color-blue-500);
   --hsds-color-state-info-backgroundColor: var(--hsds-color-blue-200);
+  --hsds-color-state-info-backgroundLight: var(--hsds-color-blue-200);
+  --hsds-color-state-info-backgroundDark: var(
+    --hsds-color-state-info-borderColor
+  );
   --hsds-color-state-info-borderColor: var(--hsds-color-blue-500);
-  --hsds-color-state-info-color: var(--hsds-color-blue-800);
+  --hsds-color-state-info-icon: var(--hsds-color-blue-500);
+  --hsds-color-state-info-color: var(--hsds-color-blue-500);
+  --hsds-color-state-info-text: var(--hsds-color-blue-500);
   --hsds-color-state-success-default: var(--hsds-color-green-500);
   --hsds-color-state-success-backgroundColor: var(--hsds-color-green-200);
+  --hsds-color-state-success-backgroundLight: var(--hsds-color-green-200);
+  --hsds-color-state-success-backgroundDark: var(
+    --hsds-color-state-success-borderColor
+  );
   --hsds-color-state-success-borderColor: var(--hsds-color-green-500);
-  --hsds-color-state-success-color: var(--hsds-color-green-800);
+  --hsds-color-state-success-icon: var(--hsds-color-green-500);
+  --hsds-color-state-success-color: var(--hsds-color-green-500);
+  --hsds-color-state-success-text: var(--hsds-color-green-500);
   --hsds-color-state-warning-default: var(--hsds-color-yellow-500);
   --hsds-color-state-warning-backgroundColor: var(--hsds-color-yellow-200);
+  --hsds-color-state-warning-backgroundLight: var(--hsds-color-yellow-200);
+  --hsds-color-state-warning-backgroundDark: var(
+    --hsds-color-state-warning-borderColor
+  );
   --hsds-color-state-warning-borderColor: var(--hsds-color-yellow-500);
-  --hsds-color-state-warning-color: var(--hsds-color-yellow-800);
+  --hsds-color-state-warning-icon: var(--hsds-color-yellow-500);
+  --hsds-color-state-warning-color: var(--hsds-color-yellow-500);
+  --hsds-color-state-warning-text: var(--hsds-color-yellow-500);
   --hsds-color-button-border: #d5d5d5;
@@ -414,0 +424,0 @@ --hsds-color-button-hover: #e6e6e6;

src/js/newBrand/badge.js

 export const badge = {
   color: {
     default: '#253642',
-    status: {
-      error: '#b83525ff',
-      info: '#2745c2ff',
-      success: '#2d8556ff',
-      warning: '#a35214ff',
-    },
-    statusInverted: {
-      error: {
-        border: '#e54a32ff',
-        text: '#b83525ff',
-      },
-      info: {
-        border: '#3b70f5ff',
-        text: '#2745c2ff',
-      },
-      success: {
-        border: '#47c47dff',
-        text: '#28704cff',
-      },
-      warning: {
-        border: '#fabf5aff',
-        text: '#a35214ff',
-      },
-    },
   },
 }

src/js/newBrand/button.js

 export const button = {
   color: {
     blue: {
-      main: '#2745c2ff',
-      hover: '#1e2d94ff',
+      main: '#304ddbff',
+      hover: '#263aadff',
       text: 'white',
       outline: {
-        border: '#3b70f5ff',
-        borderHover: '#3b70f5ff',
-        text: '#2745c2ff',
-        textHover: '#1e2d94ff',
+        border: '#4176faff',
+        borderHover: '#4176faff',
+        text: '#304ddbff',
+        textHover: '#263aadff',
         hover: '#ebf5ffff',
@@ -32,3 +32,3 @@ hoverIconOnly: '#ebf5ffff',
     green: {
-      main: '#28704cff',
+      main: '#2e5940ff',
       hover: '#2e5940ff',
@@ -39,3 +39,3 @@ text: 'white',
         borderHover: '#47c47dff',
-        text: '#28704cff',
+        text: '#2e5940ff',
         textHover: '#2e5940ff',
@@ -42,0 +42,0 @@ hover: '#f2fff0ff',

src/js/newBrand/color.js

@@ -6,9 +6,9 @@ export const color = {
     300: '#9ecbffff',
-    400: '#5a9afaff',
-    500: '#2745c2ff',
-    600: '#2745c2ff',
-    700: '#1e2d94ff',
+    400: '#66a3ffff',
+    500: '#304ddbff',
+    600: '#304ddbff',
+    700: '#263aadff',
     800: '#1c2674ff',
     900: '#171952ff',
-    default: '#3b70f5ff',
+    default: '#4176faff',
   },
@@ -47,9 +47,9 @@ charcoal: {
     400: '#9ecbffff',
-    500: '#5a9afaff',
-    600: '#3b70f5ff',
-    700: '#2745c2ff',
-    800: '#1e2d94ff',
+    500: '#66a3ffff',
+    600: '#4176faff',
+    700: '#304ddbff',
+    800: '#263aadff',
     900: '#1c2674ff',
     1000: '#171952ff',
-    default: '#5a9afaff',
+    default: '#66a3ffff',
   },
@@ -89,3 +89,3 @@ lavender: {
     700: '#28704cff',
-    750: '#28704cff',
+    750: '#2e5940ff',
     800: '#2e5940ff',
@@ -112,10 +112,10 @@ 900: '#283b2dff',
   link: {
-    default: '#2745c2ff',
-    base: '#2745c2ff',
-    hover: '#1e2d94ff',
+    default: '#304ddbff',
+    base: '#304ddbff',
+    hover: '#263aadff',
     active: '#1c2674ff',
-    focus: '#2745c2ff',
+    focus: '#304ddbff',
     disabled: '#405261',
   },
-  focusRing: '#2745c2ff',
+  focusRing: '#304ddbff',
   text: {
@@ -138,37 +138,47 @@ default: '#405261',
   state: {
-    danger: {
-      default: '#b83525ff',
-      backgroundColor: '#FFE8E4DE',
+    error: {
+      text: '#b83525ff',
+      backgroundDark: '#b83525ff',
+      icon: '#ff6047ff',
       borderColor: '#e54a32ff',
-      color: '#b83525ff',
-      icon: '#ff4747ff',
-    },
-    error: {
+      backgroundLight: '#FA7A6428',
       default: '#b83525ff',
-      backgroundColor: '#FFE8E4DE',
-      borderColor: '#e54a32ff',
       color: '#b83525ff',
-      icon: '#ff4747ff',
     },
     info: {
-      default: '#1e2d94ff',
-      backgroundColor: '#ebf5ffff',
-      borderColor: '#3b70f5ff',
-      color: '#1e2d94ff',
-      icon: '#3b70f5ff',
+      text: '#263aadff',
+      backgroundDark: '#304ddbff',
+      icon: '#4176faff',
+      borderColor: '#4176faff',
+      backgroundLight: '#ebf5ffff',
+      default: '#263aadff',
+      color: '#263aadff',
     },
     success: {
+      text: '#2e5940ff',
+      backgroundDark: '#2d8556ff',
+      icon: '#47c47dff',
+      borderColor: '#47c47dff',
+      backgroundLight: '#f2fff0ff',
       default: '#2e5940ff',
-      backgroundColor: '#f2fff0ff',
-      borderColor: '#47c47dff',
       color: '#2e5940ff',
-      icon: '#47c47dff',
     },
     warning: {
-      default: '#e09c24ff',
-      backgroundColor: '#fff6e5ff',
+      text: '#a35214ff',
+      backgroundDark: '#a35214ff',
+      icon: '#ffb83dff',
       borderColor: '#fabf5aff',
+      backgroundLight: '#fff6e5ff',
       color: '#a35214ff',
-      icon: '#ffb83dff',
+      default: '#e09c24ff',
     },
+    danger: {
+      default: '#b83525ff',
+      backgroundLight: '#FA7A6428',
+      backgroundDark: '#b83525ff',
+      borderColor: '#e54a32ff',
+      color: '#b83525ff',
+      text: '#b83525ff',
+      icon: '#ff6047ff',
+    },
   },
@@ -186,3 +196,3 @@ red: {
     1000: '#2b2123ff',
-    accent: '#ff4747ff',
+    accent: '#ff6047ff',
   },
@@ -219,10 +229,10 @@ orange: {
     300: '#9ecbffff',
-    400: '#5a9afaff',
-    500: '#3b70f5ff',
-    600: '#2745c2ff',
-    700: '#1e2d94ff',
+    400: '#66a3ffff',
+    500: '#4176faff',
+    600: '#304ddbff',
+    700: '#263aadff',
     800: '#1c2674ff',
     900: '#171952ff',
     1000: '#0e0e33ff',
-    accent: '#3377ffff',
+    accent: '#47a3ffff',
   },
@@ -271,4 +281,4 @@ purple: {
     link: {
-      default: '#2745c2ff',
-      hovered: '#1e2d94ff',
+      default: '#304ddbff',
+      hovered: '#263aadff',
       pressed: '#1c2674ff',
@@ -275,0 +285,0 @@ disabled: '#405261',

src/js/newBrand/datePicker.js

@@ -5,5 +5,5 @@ export const datePicker = {
       background: '#ebf5ffff',
-      selectedBackground: '#2745c2ff',
-      text: '#2745c2ff',
-      textHover: '#1e2d94ff',
+      selectedBackground: '#304ddbff',
+      text: '#304ddbff',
+      textHover: '#263aadff',
     },
@@ -10,0 +10,0 @@ current: {

src/js/newBrand/index.js

@@ -6,2 +6,3 @@ import { attachment } from './attachment'
 import { datePicker } from './datePicker'
+import { statusBar } from './statusBar'
 import { statusDot } from './statusDot'
@@ -17,2 +18,3 @@ import { tokens } from './styled-components'
   datePicker,
+  statusBar,
   statusDot,
@@ -19,0 +21,0 @@ switchComponent,

src/js/newBrand/statusDot.js

@@ -15,3 +15,3 @@ export const statusDot = {
       inactive: '#47c2ffff',
-      offline: '#ff4747ff',
+      offline: '#ff6047ff',
       busy: '#ffb83dff',
@@ -18,0 +18,0 @@ custom: '#c285ffff',

src/js/newBrand/styled-components.js

@@ -8,16 +8,2 @@ import { css } from 'styled-components'
   --hsds-badge-color-default: var(--hsds-color-charcoal-700);
-  --hsds-badge-color-status-error: var(--hsds-color-red-600);
-  --hsds-badge-color-status-info: var(--hsds-color-cobalt-600);
-  --hsds-badge-color-status-success: var(--hsds-color-green-600);
-  --hsds-badge-color-status-warning: var(--hsds-color-orange-600);
-  --hsds-badge-color-statusInverted-error-border: var(--hsds-color-red-500);
-  --hsds-badge-color-statusInverted-error-text: var(--hsds-color-red-600);
-  --hsds-badge-color-statusInverted-info-border: var(--hsds-color-cobalt-500);
-  --hsds-badge-color-statusInverted-info-text: var(--hsds-color-cobalt-600);
-  --hsds-badge-color-statusInverted-success-border: var(--hsds-color-green-500);
-  --hsds-badge-color-statusInverted-success-text: var(--hsds-color-green-700);
-  --hsds-badge-color-statusInverted-warning-border: var(
-    --hsds-color-yellow-400
-  );
-  --hsds-badge-color-statusInverted-warning-text: var(--hsds-color-orange-600);
   --hsds-button-color-blue-main: var(--hsds-color-cobalt-600);
@@ -95,2 +81,14 @@ --hsds-button-color-blue-hover: var(--hsds-color-cobalt-700);
   --hsds-datePicker-color-current-text: var(--hsds-color-charcoal-700);
+  --hsds-statusBar-color-light-error-border: var(--hsds-color-red-200);
+  --hsds-statusBar-color-light-info-border: var(--hsds-color-cobalt-200);
+  --hsds-statusBar-color-light-success-border: var(--hsds-color-green-200);
+  --hsds-statusBar-color-light-warning-border: var(--hsds-color-yellow-200);
+  --hsds-statusBar-color-bold-error-border: var(--hsds-color-red-700);
+  --hsds-statusBar-color-bold-error-button: var(--hsds-color-red-700);
+  --hsds-statusBar-color-bold-info-border: var(--hsds-color-cobalt-700);
+  --hsds-statusBar-color-bold-info-button: var(--hsds-color-cobalt-700);
+  --hsds-statusBar-color-bold-success-border: var(--hsds-color-green-700);
+  --hsds-statusBar-color-bold-success-button: var(--hsds-color-green-700);
+  --hsds-statusBar-color-bold-warning-border: var(--hsds-color-orange-700);
+  --hsds-statusBar-color-bold-warning-button: var(--hsds-color-orange-700);
   --hsds-statusDot-color-light-default: var(--hsds-color-slate-500);
@@ -246,4 +244,4 @@ --hsds-statusDot-color-light-active: var(--hsds-color-green-500);
   --hsds-color-green-700-rgb: 40, 112, 76;
-  --hsds-color-green-750: var(--hsds-color-green-700);
-  --hsds-color-green-750-rgb: var(--hsds-color-green-700-rgb);
+  --hsds-color-green-750: var(--hsds-color-green-800);
+  --hsds-color-green-750-rgb: var(--hsds-color-green-800-rgb);
   --hsds-color-green-800: #2e5940ff;
@@ -297,31 +295,43 @@ --hsds-color-green-800-rgb: 46, 89, 64;
   --hsds-color-border-ui-dark: var(--hsds-color-grey-600);
-  --hsds-color-state-danger-default: var(--hsds-color-red-600);
-  --hsds-color-state-danger-backgroundColor: #ffe8e4de;
-  --hsds-color-state-danger-borderColor: var(--hsds-color-red-500);
-  --hsds-color-state-danger-color: var(--hsds-color-red-600);
-  --hsds-color-state-danger-icon: var(--hsds-color-red-accent);
-  --hsds-color-state-error-default: var(--hsds-color-state-danger-default);
-  --hsds-color-state-error-backgroundColor: var(
-    --hsds-color-state-danger-backgroundColor
-  );
-  --hsds-color-state-error-borderColor: var(
-    --hsds-color-state-danger-borderColor
-  );
-  --hsds-color-state-error-color: var(--hsds-color-state-danger-color);
-  --hsds-color-state-error-icon: var(--hsds-color-state-danger-icon);
+  --hsds-color-state-error-text: var(--hsds-color-red-600);
+  --hsds-color-state-error-backgroundDark: var(--hsds-color-red-600);
+  --hsds-color-state-error-icon: var(--hsds-color-red-accent);
+  --hsds-color-state-error-borderColor: var(--hsds-color-red-500);
+  --hsds-color-state-error-backgroundLight: #fa7a6428;
+  --hsds-color-state-error-default: var(--hsds-color-red-600);
+  --hsds-color-state-error-color: var(--hsds-color-red-600);
+  --hsds-color-state-info-text: var(--hsds-color-cobalt-700);
+  --hsds-color-state-info-backgroundDark: var(--hsds-color-cobalt-600);
+  --hsds-color-state-info-icon: var(--hsds-color-cobalt-500);
+  --hsds-color-state-info-borderColor: var(--hsds-color-cobalt-500);
+  --hsds-color-state-info-backgroundLight: var(--hsds-color-cobalt-100);
   --hsds-color-state-info-default: var(--hsds-color-cobalt-700);
-  --hsds-color-state-info-backgroundColor: var(--hsds-color-cobalt-100);
-  --hsds-color-state-info-borderColor: var(--hsds-color-cobalt-500);
   --hsds-color-state-info-color: var(--hsds-color-cobalt-700);
-  --hsds-color-state-info-icon: var(--hsds-color-cobalt-500);
+  --hsds-color-state-success-text: var(--hsds-color-green-800);
+  --hsds-color-state-success-backgroundDark: var(--hsds-color-green-600);
+  --hsds-color-state-success-icon: var(--hsds-color-green-500);
+  --hsds-color-state-success-borderColor: var(--hsds-color-green-500);
+  --hsds-color-state-success-backgroundLight: var(--hsds-color-green-100);
   --hsds-color-state-success-default: var(--hsds-color-green-800);
-  --hsds-color-state-success-backgroundColor: var(--hsds-color-green-100);
-  --hsds-color-state-success-borderColor: var(--hsds-color-green-500);
   --hsds-color-state-success-color: var(--hsds-color-green-800);
-  --hsds-color-state-success-icon: var(--hsds-color-green-500);
-  --hsds-color-state-warning-default: var(--hsds-color-yellow-500);
-  --hsds-color-state-warning-backgroundColor: var(--hsds-color-yellow-100);
+  --hsds-color-state-warning-text: var(--hsds-color-orange-600);
+  --hsds-color-state-warning-backgroundDark: var(--hsds-color-orange-600);
+  --hsds-color-state-warning-icon: var(--hsds-color-yellow-accent);
   --hsds-color-state-warning-borderColor: var(--hsds-color-yellow-400);
+  --hsds-color-state-warning-backgroundLight: var(--hsds-color-yellow-100);
   --hsds-color-state-warning-color: var(--hsds-color-orange-600);
-  --hsds-color-state-warning-icon: var(--hsds-color-yellow-accent);
+  --hsds-color-state-warning-default: var(--hsds-color-yellow-500);
+  --hsds-color-state-danger-default: var(--hsds-color-state-error-default);
+  --hsds-color-state-danger-backgroundLight: var(
+    --hsds-color-state-error-backgroundLight
+  );
+  --hsds-color-state-danger-backgroundDark: var(
+    --hsds-color-state-error-backgroundDark
+  );
+  --hsds-color-state-danger-borderColor: var(
+    --hsds-color-state-error-borderColor
+  );
+  --hsds-color-state-danger-color: var(--hsds-color-state-error-color);
+  --hsds-color-state-danger-text: var(--hsds-color-state-error-text);
+  --hsds-color-state-danger-icon: var(--hsds-color-state-error-icon);
   --hsds-color-red-100: #fff0e8ff;
@@ -347,3 +357,3 @@ --hsds-color-red-100-rgb: 255, 240, 232;
   --hsds-color-red-1000-rgb: 43, 33, 35;
-  --hsds-color-red-accent: #ff4747ff;
+  --hsds-color-red-accent: #ff6047ff;
   --hsds-color-orange-100: #fff2e8ff;
@@ -397,10 +407,10 @@ --hsds-color-orange-100-rgb: 255, 242, 232;
   --hsds-color-cobalt-300-rgb: 158, 203, 255;
-  --hsds-color-cobalt-400: #5a9afaff;
-  --hsds-color-cobalt-400-rgb: 90, 154, 250;
-  --hsds-color-cobalt-500: #3b70f5ff;
-  --hsds-color-cobalt-500-rgb: 59, 112, 245;
-  --hsds-color-cobalt-600: #2745c2ff;
-  --hsds-color-cobalt-600-rgb: 39, 69, 194;
-  --hsds-color-cobalt-700: #1e2d94ff;
-  --hsds-color-cobalt-700-rgb: 30, 45, 148;
+  --hsds-color-cobalt-400: #66a3ffff;
+  --hsds-color-cobalt-400-rgb: 102, 163, 255;
+  --hsds-color-cobalt-500: #4176faff;
+  --hsds-color-cobalt-500-rgb: 65, 118, 250;
+  --hsds-color-cobalt-600: #304ddbff;
+  --hsds-color-cobalt-600-rgb: 48, 77, 219;
+  --hsds-color-cobalt-700: #263aadff;
+  --hsds-color-cobalt-700-rgb: 38, 58, 173;
   --hsds-color-cobalt-800: #1c2674ff;
@@ -412,3 +422,3 @@ --hsds-color-cobalt-800-rgb: 28, 38, 116;
   --hsds-color-cobalt-1000-rgb: 14, 14, 51;
-  --hsds-color-cobalt-accent: #3377ffff;
+  --hsds-color-cobalt-accent: #47a3ffff;
   --hsds-color-purple-100: #f9f2ffff;
@@ -415,0 +425,0 @@ --hsds-color-purple-100-rgb: 249, 242, 255;

src/json/default/badge.json

 {
   "color": {
-    "default": "#93A1B0",
-    "status": {
-      "error": "#e52f28",
-      "info": "#1292EE",
-      "success": "#56C288",
-      "warning": "#FFC555"
-    },
-    "statusInverted": {
-      "error": {
-        "border": "#e52f28",
-        "text": "#e52f28"
-      },
-      "info": {
-        "border": "#1292EE",
-        "text": "#1292EE"
-      },
-      "success": {
-        "border": "#56C288",
-        "text": "#56C288"
-      },
-      "warning": {
-        "border": "#FFC555",
-        "text": "#FFC555"
-      }
-    }
+    "default": "#93A1B0"
   }
 }

src/json/default/color.json

@@ -185,4 +185,8 @@ {
       "backgroundColor": "#ffe3e2",
+      "backgroundLight": "#ffe3e2",
+      "backgroundDark": "#e52f28",
       "borderColor": "#e52f28",
-      "color": "#9d1f1a"
+      "icon": "#e52f28",
+      "color": "#e52f28",
+      "text": "#e52f28"
     },
@@ -192,4 +196,8 @@ "error": {
       "backgroundColor": "#ffe3e2",
+      "backgroundLight": "#ffe3e2",
+      "backgroundDark": "#e52f28",
       "borderColor": "#e52f28",
-      "color": "#9d1f1a"
+      "icon": "#e52f28",
+      "color": "#e52f28",
+      "text": "#e52f28"
     },
@@ -199,4 +207,8 @@ "info": {
       "backgroundColor": "#D6EDFF",
+      "backgroundLight": "#D6EDFF",
+      "backgroundDark": "#1292EE",
       "borderColor": "#1292EE",
-      "color": "#034077"
+      "icon": "#1292EE",
+      "color": "#1292EE",
+      "text": "#1292EE"
     },
@@ -206,4 +218,8 @@ "success": {
       "backgroundColor": "#E3FBEE",
+      "backgroundLight": "#E3FBEE",
+      "backgroundDark": "#56C288",
       "borderColor": "#56C288",
-      "color": "#106236"
+      "icon": "#56C288",
+      "color": "#56C288",
+      "text": "#56C288"
     },
@@ -213,4 +229,8 @@ "warning": {
       "backgroundColor": "#FFF2D7",
+      "backgroundLight": "#FFF2D7",
+      "backgroundDark": "#FFC555",
       "borderColor": "#FFC555",
-      "color": "#CE7129"
+      "icon": "#FFC555",
+      "color": "#FFC555",
+      "text": "#FFC555"
     }
@@ -217,0 +237,0 @@ },

src/json/newBrand/badge.json

 {
   "color": {
-    "default": "#253642",
-    "status": {
-      "error": "#b83525ff",
-      "info": "#2745c2ff",
-      "success": "#2d8556ff",
-      "warning": "#a35214ff"
-    },
-    "statusInverted": {
-      "error": {
-        "border": "#e54a32ff",
-        "text": "#b83525ff"
-      },
-      "info": {
-        "border": "#3b70f5ff",
-        "text": "#2745c2ff"
-      },
-      "success": {
-        "border": "#47c47dff",
-        "text": "#28704cff"
-      },
-      "warning": {
-        "border": "#fabf5aff",
-        "text": "#a35214ff"
-      }
-    }
+    "default": "#253642"
   }
 }

src/json/newBrand/button.json

 {
   "color": {
     "blue": {
-      "main": "#2745c2ff",
-      "hover": "#1e2d94ff",
+      "main": "#304ddbff",
+      "hover": "#263aadff",
       "text": "white",
       "outline": {
-        "border": "#3b70f5ff",
-        "borderHover": "#3b70f5ff",
-        "text": "#2745c2ff",
-        "textHover": "#1e2d94ff",
+        "border": "#4176faff",
+        "borderHover": "#4176faff",
+        "text": "#304ddbff",
+        "textHover": "#263aadff",
         "hover": "#ebf5ffff",
@@ -32,3 +32,3 @@ "hoverIconOnly": "#ebf5ffff",
     "green": {
-      "main": "#28704cff",
+      "main": "#2e5940ff",
       "hover": "#2e5940ff",
@@ -39,3 +39,3 @@ "text": "white",
         "borderHover": "#47c47dff",
-        "text": "#28704cff",
+        "text": "#2e5940ff",
         "textHover": "#2e5940ff",
@@ -42,0 +42,0 @@ "hover": "#f2fff0ff",

src/json/newBrand/color.json

@@ -6,9 +6,9 @@ {
     "300": "#9ecbffff",
-    "400": "#5a9afaff",
-    "500": "#2745c2ff",
-    "600": "#2745c2ff",
-    "700": "#1e2d94ff",
+    "400": "#66a3ffff",
+    "500": "#304ddbff",
+    "600": "#304ddbff",
+    "700": "#263aadff",
     "800": "#1c2674ff",
     "900": "#171952ff",
-    "default": "#3b70f5ff"
+    "default": "#4176faff"
   },
@@ -47,9 +47,9 @@ "charcoal": {
     "400": "#9ecbffff",
-    "500": "#5a9afaff",
-    "600": "#3b70f5ff",
-    "700": "#2745c2ff",
-    "800": "#1e2d94ff",
+    "500": "#66a3ffff",
+    "600": "#4176faff",
+    "700": "#304ddbff",
+    "800": "#263aadff",
     "900": "#1c2674ff",
     "1000": "#171952ff",
-    "default": "#5a9afaff"
+    "default": "#66a3ffff"
   },
@@ -89,3 +89,3 @@ "lavender": {
     "700": "#28704cff",
-    "750": "#28704cff",
+    "750": "#2e5940ff",
     "800": "#2e5940ff",
@@ -112,10 +112,10 @@ "900": "#283b2dff",
   "link": {
-    "default": "#2745c2ff",
-    "base": "#2745c2ff",
-    "hover": "#1e2d94ff",
+    "default": "#304ddbff",
+    "base": "#304ddbff",
+    "hover": "#263aadff",
     "active": "#1c2674ff",
-    "focus": "#2745c2ff",
+    "focus": "#304ddbff",
     "disabled": "#405261"
   },
-  "focusRing": "#2745c2ff",
+  "focusRing": "#304ddbff",
   "text": {
@@ -138,36 +138,46 @@ "default": "#405261",
   "state": {
-    "danger": {
-      "default": "#b83525ff",
-      "backgroundColor": "#FFE8E4DE",
+    "error": {
+      "text": "#b83525ff",
+      "backgroundDark": "#b83525ff",
+      "icon": "#ff6047ff",
       "borderColor": "#e54a32ff",
-      "color": "#b83525ff",
-      "icon": "#ff4747ff"
-    },
-    "error": {
+      "backgroundLight": "#FA7A6428",
       "default": "#b83525ff",
-      "backgroundColor": "#FFE8E4DE",
-      "borderColor": "#e54a32ff",
-      "color": "#b83525ff",
-      "icon": "#ff4747ff"
+      "color": "#b83525ff"
     },
     "info": {
-      "default": "#1e2d94ff",
-      "backgroundColor": "#ebf5ffff",
-      "borderColor": "#3b70f5ff",
-      "color": "#1e2d94ff",
-      "icon": "#3b70f5ff"
+      "text": "#263aadff",
+      "backgroundDark": "#304ddbff",
+      "icon": "#4176faff",
+      "borderColor": "#4176faff",
+      "backgroundLight": "#ebf5ffff",
+      "default": "#263aadff",
+      "color": "#263aadff"
     },
     "success": {
+      "text": "#2e5940ff",
+      "backgroundDark": "#2d8556ff",
+      "icon": "#47c47dff",
+      "borderColor": "#47c47dff",
+      "backgroundLight": "#f2fff0ff",
       "default": "#2e5940ff",
-      "backgroundColor": "#f2fff0ff",
-      "borderColor": "#47c47dff",
-      "color": "#2e5940ff",
-      "icon": "#47c47dff"
+      "color": "#2e5940ff"
     },
     "warning": {
-      "default": "#e09c24ff",
-      "backgroundColor": "#fff6e5ff",
+      "text": "#a35214ff",
+      "backgroundDark": "#a35214ff",
+      "icon": "#ffb83dff",
       "borderColor": "#fabf5aff",
+      "backgroundLight": "#fff6e5ff",
       "color": "#a35214ff",
-      "icon": "#ffb83dff"
+      "default": "#e09c24ff"
+    },
+    "danger": {
+      "default": "#b83525ff",
+      "backgroundLight": "#FA7A6428",
+      "backgroundDark": "#b83525ff",
+      "borderColor": "#e54a32ff",
+      "color": "#b83525ff",
+      "text": "#b83525ff",
+      "icon": "#ff6047ff"
     }
@@ -186,3 +196,3 @@ },
     "1000": "#2b2123ff",
-    "accent": "#ff4747ff"
+    "accent": "#ff6047ff"
   },
@@ -219,10 +229,10 @@ "orange": {
     "300": "#9ecbffff",
-    "400": "#5a9afaff",
-    "500": "#3b70f5ff",
-    "600": "#2745c2ff",
-    "700": "#1e2d94ff",
+    "400": "#66a3ffff",
+    "500": "#4176faff",
+    "600": "#304ddbff",
+    "700": "#263aadff",
     "800": "#1c2674ff",
     "900": "#171952ff",
     "1000": "#0e0e33ff",
-    "accent": "#3377ffff"
+    "accent": "#47a3ffff"
   },
@@ -271,4 +281,4 @@ "purple": {
     "link": {
-      "default": "#2745c2ff",
-      "hovered": "#1e2d94ff",
+      "default": "#304ddbff",
+      "hovered": "#263aadff",
       "pressed": "#1c2674ff",
@@ -275,0 +285,0 @@ "disabled": "#405261"

src/json/newBrand/datePicker.json

@@ -5,5 +5,5 @@ {
       "background": "#ebf5ffff",
-      "selectedBackground": "#2745c2ff",
-      "text": "#2745c2ff",
-      "textHover": "#1e2d94ff"
+      "selectedBackground": "#304ddbff",
+      "text": "#304ddbff",
+      "textHover": "#263aadff"
     },
@@ -10,0 +10,0 @@ "current": {

src/json/newBrand/statusDot.json

@@ -15,3 +15,3 @@ {
       "inactive": "#47c2ffff",
-      "offline": "#ff4747ff",
+      "offline": "#ff6047ff",
       "busy": "#ffb83dff",
@@ -18,0 +18,0 @@ "custom": "#c285ffff"

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

158686

increased by5.61%

Number of package files

70

increased by9.38%

Lines of code

3994

increased by5.3%

No dependency changes