diff --git a/.storybook/image-snapshots/expected/components_Signal_Breach Risk.png b/.storybook/image-snapshots/expected/components_Signal_Breach Risk.png
index 724b049c8..4a6b9aae5 100644
Binary files a/.storybook/image-snapshots/expected/components_Signal_Breach Risk.png and b/.storybook/image-snapshots/expected/components_Signal_Breach Risk.png differ
diff --git a/.storybook/image-snapshots/expected/components_Signal_Business Impact.png b/.storybook/image-snapshots/expected/components_Signal_Business Impact.png
index 123d2098c..c46270ac7 100644
Binary files a/.storybook/image-snapshots/expected/components_Signal_Business Impact.png and b/.storybook/image-snapshots/expected/components_Signal_Business Impact.png differ
diff --git a/.storybook/image-snapshots/expected/components_Signal_Dark Mode.png b/.storybook/image-snapshots/expected/components_Signal_Dark Mode.png
new file mode 100644
index 000000000..0a8f46c86
Binary files /dev/null and b/.storybook/image-snapshots/expected/components_Signal_Dark Mode.png differ
diff --git a/.storybook/image-snapshots/expected/components_Signal_Incident Likelihood.png b/.storybook/image-snapshots/expected/components_Signal_Incident Likelihood.png
index 2ddc9b131..00cd2cef5 100644
Binary files a/.storybook/image-snapshots/expected/components_Signal_Incident Likelihood.png and b/.storybook/image-snapshots/expected/components_Signal_Incident Likelihood.png differ
diff --git a/.storybook/image-snapshots/expected/components_Signal_Severity.png b/.storybook/image-snapshots/expected/components_Signal_Severity.png
index 14ca5bf3e..a31df9da8 100644
Binary files a/.storybook/image-snapshots/expected/components_Signal_Severity.png and b/.storybook/image-snapshots/expected/components_Signal_Severity.png differ
diff --git a/.storybook/image-snapshots/expected/components_Signal_Sized Signals.png b/.storybook/image-snapshots/expected/components_Signal_Sized Signals.png
index 36e9c75eb..f5b769944 100644
Binary files a/.storybook/image-snapshots/expected/components_Signal_Sized Signals.png and b/.storybook/image-snapshots/expected/components_Signal_Sized Signals.png differ
diff --git a/src/components/Chip/Chip.tsx b/src/components/Chip/Chip.tsx
index 18ab96aea..2bfc4603f 100644
--- a/src/components/Chip/Chip.tsx
+++ b/src/components/Chip/Chip.tsx
@@ -18,7 +18,7 @@ function Chip({
return (
-
+
{children}
diff --git a/src/components/Chip/InteractiveChip.tsx b/src/components/Chip/InteractiveChip.tsx
index d80816ed8..e1eceb049 100644
--- a/src/components/Chip/InteractiveChip.tsx
+++ b/src/components/Chip/InteractiveChip.tsx
@@ -33,7 +33,7 @@ function InteractiveChip({
return (
-
+
{children}
diff --git a/src/components/Chip/components.tsx b/src/components/Chip/components.tsx
index 5df06b049..49d4f94de 100644
--- a/src/components/Chip/components.tsx
+++ b/src/components/Chip/components.tsx
@@ -23,7 +23,7 @@ export const ChipRoot = styled.div`
var(--sscds-interactivechip-color-border-hover, transparent);
}
- .sscds-chip-label {
+ .sscds-chip-content > *:not(.sscds-iconbox) {
&:first-child {
padding-inline-start: var(--sscds-space-1x);
}
diff --git a/src/components/Signal/IncidentLikelihoodSignal.tsx b/src/components/Signal/IncidentLikelihoodSignal.tsx
index 60adb83ea..afec469a9 100644
--- a/src/components/Signal/IncidentLikelihoodSignal.tsx
+++ b/src/components/Signal/IncidentLikelihoodSignal.tsx
@@ -1,4 +1,4 @@
-import { HorizontalBars, Icon, criticalityLevels } from './common';
+import { Icon, Vertical3Bars, criticalityLevels } from './common';
import { BaseSignalProps, IncidentLikelihoodSignalKinds } from './Signal.types';
function hasValidKind(kind: string): kind is IncidentLikelihoodSignalKinds {
@@ -16,7 +16,7 @@ export default function IncidentLikelihoodSignal({
if (kind !== 'critical') {
return (
- (
);
+
+export const DarkMode: Story = (args) => (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+);
+DarkMode.args = {
+ size: 32,
+};
+DarkMode.parameters = {
+ themes: {
+ themeOverride: 'Dark',
+ },
+};
diff --git a/src/components/Signal/common.tsx b/src/components/Signal/common.tsx
index 89fed2566..80e014f60 100644
--- a/src/components/Signal/common.tsx
+++ b/src/components/Signal/common.tsx
@@ -17,16 +17,9 @@ export const criticalityLevels = {
const criticalityColorsSeverity = [
undefined,
- 'var(--sscds-severity-low)',
- 'var(--sscds-severity-medium)',
- 'var(--sscds-severity-high)',
-];
-
-const criticalityColorsLikelihood = [
- undefined,
- 'var(--sscds-likelihood-low)',
- 'var(--sscds-likelihood-medium)',
- 'var(--sscds-likelihood-high)',
+ 'var(--sscds-color-signal-low)',
+ 'var(--sscds-color-signal-medium)',
+ 'var(--sscds-color-signal-high)',
];
function Svg({
@@ -53,7 +46,7 @@ function Svg({
function VerticalBar({
height,
xPos,
- fill = 'rgb(0 0 0 / 0.1)',
+ fill = 'var(--sscds-color-signal-inactive)',
}: {
height: number;
xPos: number;
@@ -107,7 +100,7 @@ export function Vertical4Bars({
return (