From 41dff2a36f02a393d09117dd75f519ceb7fcdfcd Mon Sep 17 00:00:00 2001
From: Brandon <bdow@homebound.com>
Date: Thu, 14 Dec 2023 09:14:55 -0500
Subject: [PATCH] feat: Allow Tag to support custom bg and text color via xss
 (#981)

---
 src/components/Tag.stories.tsx | 1 +
 src/components/Tag.tsx         | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/Tag.stories.tsx b/src/components/Tag.stories.tsx
index 23c62fe65..21f292a3e 100644
--- a/src/components/Tag.stories.tsx
+++ b/src/components/Tag.stories.tsx
@@ -23,6 +23,7 @@ export function NoIcon() {
       <div css={Css.wPx(200).$}>
         <Tag text="Tag text that will truncate as it is too long." />
       </div>
+      <Tag text="Custom color" xss={Css.bgPurple200.$} />
     </div>
   );
 }
diff --git a/src/components/Tag.tsx b/src/components/Tag.tsx
index 30298c295..92ab0bce3 100644
--- a/src/components/Tag.tsx
+++ b/src/components/Tag.tsx
@@ -2,7 +2,7 @@ import { Icon, IconKey } from "src/components";
 import { Css, Margin, Only, Xss } from "src/Css";
 import { useTestIds } from "src/utils";
 
-type TagXss = Margin;
+type TagXss = Margin | "backgroundColor" | "color";
 export type TagType = "info" | "caution" | "warning" | "success" | "neutral";
 interface TagProps<X> {
   text: string;