From b470bf6996750edfa945d08b104e0ece846b63e4 Mon Sep 17 00:00:00 2001
From: knownotunknown <78577376+knownotunknown@users.noreply.github.com>
Date: Sat, 3 Feb 2024 14:15:18 -0600
Subject: [PATCH 1/3] Chip Implemented

Styled inline since I'll need to rewrite in TailwindCSS anyways
---
 src/stories/components/Chip.stories.tsx   | 24 ++++++++++++++++
 src/views/components/common/Chip/Chip.tsx | 35 +++++++++++++++++++++++
 2 files changed, 59 insertions(+)
 create mode 100644 src/stories/components/Chip.stories.tsx
 create mode 100644 src/views/components/common/Chip/Chip.tsx

diff --git a/src/stories/components/Chip.stories.tsx b/src/stories/components/Chip.stories.tsx
new file mode 100644
index 00000000..2e1d23dd
--- /dev/null
+++ b/src/stories/components/Chip.stories.tsx
@@ -0,0 +1,24 @@
+import React from 'react';
+import { Meta, StoryObj } from '@storybook/react';
+import { Chip } from 'src/views/components/common/Chip/Chip';
+
+const meta = {
+    title: 'Components/Common/Chip',
+    component: Chip,
+    parameters: {
+        layout: 'centered',
+    },
+    tags: ['autodocs'],
+    argTypes: {
+        label: { control: 'text' },
+    },
+} satisfies Meta<typeof Chip>;
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    args: {
+        label: 'QR',
+    },
+};
\ No newline at end of file
diff --git a/src/views/components/common/Chip/Chip.tsx b/src/views/components/common/Chip/Chip.tsx
new file mode 100644
index 00000000..7ffbee71
--- /dev/null
+++ b/src/views/components/common/Chip/Chip.tsx
@@ -0,0 +1,35 @@
+import classNames from 'classnames';
+import React from 'react';
+import Text from '../Text/Text';
+import styles from './Chip.module.scss';
+
+
+export const flags = ["WR", "QR", "GC", "CD", "E", "II"]
+
+interface Props {
+    label: string;
+}
+
+/**
+ * A reusable chip component that follows the design system of the extension.
+ * @returns
+ */
+export function Chip({
+    label
+}: React.PropsWithChildren<Props>): JSX.Element {
+    return (
+        <Text as = {'div'} variant = 'h4'
+            style = {{
+                display: "inline-flex",
+                minWidth: "21px",
+                padding: "1px 4px",
+                justifyContent: "center",
+                alignItems: "center",
+                gap: "10px",
+                borderRadius: "8px",
+                background: "#FFD600", //Yellow
+            }}>
+            {label}
+        </Text>
+    );
+}

From 80043dc6524adb15b052469a2d7a59e121c793d9 Mon Sep 17 00:00:00 2001
From: knownotunknown <78577376+knownotunknown@users.noreply.github.com>
Date: Sat, 3 Feb 2024 14:20:48 -0600
Subject: [PATCH 2/3] Deleted unnecessary imports

---
 src/views/components/common/Chip/Chip.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/views/components/common/Chip/Chip.tsx b/src/views/components/common/Chip/Chip.tsx
index 7ffbee71..2135cbe4 100644
--- a/src/views/components/common/Chip/Chip.tsx
+++ b/src/views/components/common/Chip/Chip.tsx
@@ -1,7 +1,5 @@
-import classNames from 'classnames';
 import React from 'react';
 import Text from '../Text/Text';
-import styles from './Chip.module.scss';
 
 
 export const flags = ["WR", "QR", "GC", "CD", "E", "II"]

From 6e595d21aa94abaf0b63cc27ad51143dd7f6209d Mon Sep 17 00:00:00 2001
From: knownotunknown <78577376+knownotunknown@users.noreply.github.com>
Date: Sat, 3 Feb 2024 14:29:07 -0600
Subject: [PATCH 3/3] Update Chip.stories.tsx

---
 src/stories/components/Chip.stories.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/stories/components/Chip.stories.tsx b/src/stories/components/Chip.stories.tsx
index 2e1d23dd..ed0f0b3f 100644
--- a/src/stories/components/Chip.stories.tsx
+++ b/src/stories/components/Chip.stories.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import { Meta, StoryObj } from '@storybook/react';
 import { Chip } from 'src/views/components/common/Chip/Chip';