✨(components) add react repo

This repo only contains a Button which is here only for demonstration purpose.
Its purpose is to contain all the future react-based components of the
design system.

packages/react/src/components/Button/index.scss

@@ -0,0 +1,8 @@
+.c__button {
+  background-color: var(--c--colors--primary);
+  padding: 8px 30px;
+  border-radius: 6px;
+  border: none;
+  color: white;
+  font-weight: bold;
+}

packages/react/src/components/Button/index.spec.tsx

@@ -0,0 +1,12 @@
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import React from "react";
+import { Button } from "./index";
+
+describe("<Button/>", () => {
+  it("renders", () => {
+    render(<Button />);
+    const button = screen.getByRole("button", { name: "<Button/>" });
+    expect(button.classList.contains("c__button")).toBe(true);
+  });
+});

packages/react/src/components/Button/index.stories.tsx

@@ -0,0 +1,13 @@
+import { ComponentMeta, ComponentStory } from "@storybook/react";
+import React from "react";
+import { Button } from "./index";
+
+export default {
+  title: "Button",
+  component: Button,
+} as ComponentMeta<typeof Button>;
+
+const Template: ComponentStory<typeof Button> = () => <Button />;
+
+export const Default = Template.bind({});
+Default.args = {};

packages/react/src/components/Button/index.tsx

@@ -0,0 +1,5 @@
+import React from "react";
+
+export const Button = () => {
+  return <button className="c__button">{"<Button/>"}</button>;
+};