Merge pull request #1357 from securityscorecard/ondrejrusz-ssc@MAX-3284-monochromatic-business-impact

fix((businessImpactSignal): added support for monochromatic icons and used in BusinessImpactSignal MAX-3284

Author: ondrejrusz-ssc

.storybook/image-snapshots/expected/components_Signal_Business Impact.png

@@ -18,6 +18,7 @@ export default function BusinessImpactSignal({
     <Vertical4Bars
       criticality={criticalityLevels[kind]}
       title={title ?? `${kind} business impact`}
+      monochromatic
       {...props}
     />
   );

.storybook/image-snapshots/expected/components_Signal_Dark Mode.png

@@ -96,9 +96,13 @@ export function Vertical4Bars({
   criticality,
   size = 16,
   title,
+  monochromatic = false,
   ...props
-}: BaseSvgProps & { criticality: 0 | 1 | 2 | 3 | 4 }) {
+}: BaseSvgProps & { criticality: 0 | 1 | 2 | 3 | 4; monochromatic?: boolean }) {
   const getActiveColor = (level: number) => {
+    if (monochromatic) {
+      return 'var(--sscds-color-neutral-13)';
+    }
     const colors = [
       'var(--sscds-color-signal-inactive)',
       'var(--severity-green-40)',
@@ -110,6 +114,9 @@ export function Vertical4Bars({
   };
 
   const getInactiveColor = (level: number) => {
+    if (monochromatic) {
+      return 'var(--sscds-color-signal-inactive)';
+    }
     const colors = [
       'var(--sscds-color-signal-inactive)',
       'var(--severity-green-20)',