adding monkeytype

frontend/storybook/stories/LoadingCircle.stories.tsx

@@ -0,0 +1,52 @@
+import preview from "#.storybook/preview";
+
+import { LoadingCircle } from "../../src/ts/components/common/LoadingCircle";
+
+const meta = preview.meta({
+  title: "Common/LoadingCircle",
+  component: LoadingCircle,
+  parameters: {
+    layout: "centered",
+  },
+  tags: ["autodocs"],
+  argTypes: {
+    mode: {
+      control: "select",
+      options: ["icon", "svg"],
+    },
+    class: { control: "text" },
+  },
+});
+
+export const AllVariants = meta.story({
+  render: () => (
+    <div style={{ display: "flex", gap: "32px", "align-items": "center" }}>
+      <div
+        style={{
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "center",
+          gap: "8px",
+        }}
+      >
+        <LoadingCircle mode="icon" />
+        <div style={{ "font-size": "12px", color: "var(--sub-color)" }}>
+          Icon
+        </div>
+      </div>
+      <div
+        style={{
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "center",
+          gap: "8px",
+        }}
+      >
+        <LoadingCircle mode="svg" class="h-8 w-8" />
+        <div style={{ "font-size": "12px", color: "var(--sub-color)" }}>
+          SVG
+        </div>
+      </div>
+    </div>
+  ),
+});