diff --git a/.changeset/rare-mayflies-remain.md b/.changeset/rare-mayflies-remain.md
new file mode 100644
index 0000000000..55febfb376
--- /dev/null
+++ b/.changeset/rare-mayflies-remain.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core': patch
+---
+
+Pass `inverse` prop to Guage from GuageCard
diff --git a/packages/core/src/components/ProgressBars/GaugeCard.stories.tsx b/packages/core/src/components/ProgressBars/GaugeCard.stories.tsx
index 982999f8d6..5d54e5eda6 100644
--- a/packages/core/src/components/ProgressBars/GaugeCard.stories.tsx
+++ b/packages/core/src/components/ProgressBars/GaugeCard.stories.tsx
@@ -45,6 +45,9 @@ export const Default = () => (
+
+
+
);
@@ -67,6 +70,14 @@ export const Subhead = () => (
progress={0.89}
/>
+
+
+
);
@@ -81,5 +92,8 @@ export const LinkInFooter = () => (
+
+
+
);
diff --git a/packages/core/src/components/ProgressBars/GaugeCard.tsx b/packages/core/src/components/ProgressBars/GaugeCard.tsx
index 2154619b01..0f0a85e6d4 100644
--- a/packages/core/src/components/ProgressBars/GaugeCard.tsx
+++ b/packages/core/src/components/ProgressBars/GaugeCard.tsx
@@ -26,6 +26,7 @@ type Props = {
variant?: InfoCardVariants;
/** Progress in % specified as decimal, e.g. "0.23" */
progress: number;
+ inverse?: boolean;
deepLink?: BottomLinkProps;
};
@@ -38,7 +39,7 @@ const useStyles = makeStyles({
export const GaugeCard = (props: Props) => {
const classes = useStyles(props);
- const { title, subheader, progress, deepLink, variant } = props;
+ const { title, subheader, progress, inverse, deepLink, variant } = props;
return (
@@ -48,7 +49,7 @@ export const GaugeCard = (props: Props) => {
deepLink={deepLink}
variant={variant}
>
-
+
);