From 01e6b6682acf02bfa5e68049afbb44cd0ddf2228 Mon Sep 17 00:00:00 2001
From: brahims <bsourny@gmail.com>
Date: Sun, 29 Sep 2024 12:21:46 +0200
Subject: [PATCH] feat(app): add wip

---
 .prettierrc                             |    4 +-
 apps/uikit/src/app/app.tsx              |   63 +-
 apps/uikit/src/app/styles.css           |   97 ++
 package-lock.json                       | 1168 +++++++++++++++++++++--
 package.json                            |    7 +-
 shared-ui/src/index.ts                  |    2 +-
 shared-ui/src/lib/Form/index.tsx        |   52 +
 shared-ui/src/lib/shared-ui.spec.tsx    |   10 -
 shared-ui/src/lib/shared-ui.tsx         |   15 -
 shared-ui/src/lib/styles/GlobalStyle.ts |    7 +
 10 files changed, 1306 insertions(+), 119 deletions(-)
 create mode 100644 apps/uikit/src/app/styles.css
 create mode 100644 shared-ui/src/lib/Form/index.tsx
 delete mode 100644 shared-ui/src/lib/shared-ui.spec.tsx
 delete mode 100644 shared-ui/src/lib/shared-ui.tsx
 create mode 100644 shared-ui/src/lib/styles/GlobalStyle.ts

diff --git a/.prettierrc b/.prettierrc
index 7780def..58972b1 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,7 +1,7 @@
 {
   "singleQuote": true,
   "trailingComma": "all",
-  "printWidth": 120,
   "useTabs": true,
-  "tabWidth": 2
+  "tabWidth": 2,
+  "printWidth": 80
 }
diff --git a/apps/uikit/src/app/app.tsx b/apps/uikit/src/app/app.tsx
index 9665b82..e547223 100644
--- a/apps/uikit/src/app/app.tsx
+++ b/apps/uikit/src/app/app.tsx
@@ -1,13 +1,72 @@
+import React from 'react';
+import * as Form from '@radix-ui/react-form';
 import styled from 'styled-components';
+import { Theme, Button } from '@radix-ui/themes';
+import '@radix-ui/themes/styles.css';
+import './styles.css';
 
 const StyledApp = styled.div`
-	// Your style here
+	display: flex;
+	flex-direction: column;
+	justify-items: center;
+	justify-content: space-between;
+	align-items: center;
 `;
 
-export function App() {
+export function App(): React.ReactElement {
 	return (
 		<StyledApp>
 			<h1>Hello there</h1>
+			<Theme>
+				<Button>Hey 👋</Button>
+				<Button variant="outline">Hey 👋</Button>
+				<Button variant="subtle">Hey 👋</Button>
+
+				<Form.Root className="FormRoot">
+					<Form.Field className="FormField" name="email">
+						<div
+							style={{
+								display: 'flex',
+								alignItems: 'baseline',
+								justifyContent: 'space-between',
+							}}
+						>
+							<Form.Label className="FormLabel">Email</Form.Label>
+							<Form.Message className="FormMessage" match="valueMissing">
+								Please enter your email
+							</Form.Message>
+							<Form.Message className="FormMessage" match="typeMismatch">
+								Please provide a valid email
+							</Form.Message>
+						</div>
+						<Form.Control asChild>
+							<input className="Input" type="email" required />
+						</Form.Control>
+					</Form.Field>
+					<Form.Field className="FormField" name="question">
+						<div
+							style={{
+								display: 'flex',
+								alignItems: 'baseline',
+								justifyContent: 'space-between',
+							}}
+						>
+							<Form.Label className="FormLabel">Question</Form.Label>
+							<Form.Message className="FormMessage" match="valueMissing">
+								Please enter a question
+							</Form.Message>
+						</div>
+						<Form.Control asChild>
+							<textarea className="Textarea" required />
+						</Form.Control>
+					</Form.Field>
+					<Form.Submit asChild>
+						<button className="Button" style={{ marginTop: 10 }}>
+							Post question
+						</button>
+					</Form.Submit>
+				</Form.Root>
+			</Theme>
 		</StyledApp>
 	);
 }
diff --git a/apps/uikit/src/app/styles.css b/apps/uikit/src/app/styles.css
new file mode 100644
index 0000000..7186700
--- /dev/null
+++ b/apps/uikit/src/app/styles.css
@@ -0,0 +1,97 @@
+@import '@radix-ui/colors/black-alpha.css';
+@import '@radix-ui/colors/violet.css';
+@import '@radix-ui/colors/mauve.css';
+
+/* reset */
+input,
+textarea,
+button {
+  all: unset;
+  box-sizing: border-box;
+}
+
+.FormRoot {
+  width: 260px;
+}
+
+.FormField {
+  display: grid;
+  margin-bottom: 10px;
+}
+
+.FormLabel {
+  font-size: 15px;
+  font-weight: 500;
+  line-height: 35px;
+  color: white;
+}
+
+.FormMessage {
+  font-size: 13px;
+  color: white;
+  opacity: 0.8;
+}
+
+.Input,
+.Textarea {
+  width: 100%;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 4px;
+  font-size: 15px;
+  color: white;
+  background-color: var(--black-a2);
+  box-shadow: 0 0 0 1px var(--black-a6);
+}
+
+.Input:hover,
+.Textarea:hover {
+  box-shadow: 0 0 0 1px black;
+}
+
+.Input:focus,
+.Textarea:focus {
+  box-shadow: 0 0 0 2px black;
+}
+
+.Input::selection,
+.Textarea::selection {
+  background-color: var(--black-a6);
+  color: white;
+}
+
+.Input {
+  padding: 0 10px;
+  height: 35px;
+  line-height: 1;
+}
+
+.Textarea {
+  resize: none;
+  padding: 10px;
+}
+
+.Button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 4px;
+  padding: 0 15px;
+  font-size: 15px;
+  line-height: 1;
+  font-weight: 500;
+  height: 35px;
+  width: 100%;
+  background-color: white;
+  color: var(--violet-11);
+  box-shadow: 0 2px 10px var(--black-a4);
+}
+
+.Button:hover {
+  background-color: var(--mauve-3);
+}
+
+.Button:focus {
+  box-shadow: 0 0 0 2px black;
+}
diff --git a/package-lock.json b/package-lock.json
index 1bd28e0..4aa40e8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -31,7 +31,9 @@
 				"@nx/web": "19.8.2",
 				"@nx/workspace": "19.8.2",
 				"@playwright/test": "^1.36.0",
+				"@radix-ui/react-avatar": "^1.1.0",
 				"@radix-ui/react-popover": "^1.1.1",
+				"@radix-ui/themes": "^3.1.4",
 				"@storybook/addon-essentials": "^8.2.8",
 				"@storybook/addon-interactions": "^8.2.8",
 				"@storybook/core-server": "^8.2.8",
@@ -49,7 +51,7 @@
 				"@types/react": "18.3.1",
 				"@types/react-dom": "18.3.0",
 				"@types/react-is": "18.3.0",
-				"@types/styled-components": "5.1.26",
+				"@types/styled-components": "^5.1.34",
 				"@vitejs/plugin-react": "^4.2.0",
 				"@vitest/ui": "^1.3.1",
 				"babel-jest": "^29.7.0",
@@ -65,8 +67,9 @@
 				"jest-environment-jsdom": "^29.7.0",
 				"jsdom": "~22.1.0",
 				"nx": "19.8.2",
-				"prettier": "^2.6.2",
+				"prettier": "^3.3.3",
 				"react-router-dom": "^6.26.2",
+				"remove": "^0.1.5",
 				"storybook": "^8.2.8",
 				"ts-jest": "^29.1.0",
 				"ts-node": "10.9.1",
@@ -5000,6 +5003,20 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/@radix-ui/colors": {
+			"version": "3.0.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/colors/-/colors-3.0.0.tgz",
+			"integrity": "sha512-FUOsGBkHrYJwCSEtWRCIfQbZG7q1e6DgxCIOe1SUQzDe/7rXXeA47s8yCn6fuTNQAj1Zq4oTFi9Yjp3wzElcxg==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/@radix-ui/number": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/number/-/number-1.1.0.tgz",
+			"integrity": "sha512-V3gRzhVNU1ldS5XhAPTom1fOIo4ccrjjJgmE+LI2h/WaFpHmx0MQApT+KZHnx8abG6Avtfcz4WoEciMnpFT3HQ==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/@radix-ui/primitive": {
 			"version": "1.1.0",
 			"resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.1.0.tgz",
@@ -5007,6 +5024,59 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/@radix-ui/react-accessible-icon": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-accessible-icon/-/react-accessible-icon-1.1.0.tgz",
+			"integrity": "sha512-i9Zg4NOSXlfUva0agzI2DjWrvFJm9uO4L6CMW7nmMa5CIOOX/Yin894W7WwjodFQWPwe5kmAJ4JF33R8slKI2g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-visually-hidden": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-alert-dialog": {
+			"version": "1.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-alert-dialog/-/react-alert-dialog-1.1.1.tgz",
+			"integrity": "sha512-wmCoJwj7byuVuiLKqDLlX7ClSUU0vd9sdCeM+2Ls+uf13+cpSJoMgwysHq1SGVVkJj5Xn0XWi1NoRCdkMpr6Mw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-dialog": "1.1.1",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-slot": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
 		"node_modules/@radix-ui/react-arrow": {
 			"version": "1.1.0",
 			"resolved": "https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.1.0.tgz",
@@ -5031,6 +5101,115 @@
 				}
 			}
 		},
+		"node_modules/@radix-ui/react-aspect-ratio": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-aspect-ratio/-/react-aspect-ratio-1.1.0.tgz",
+			"integrity": "sha512-dP87DM/Y7jFlPgUZTlhx6FF5CEzOiaxp2rBCKlaXlpH5Ip/9Fg5zZ9lDOQ5o/MOfUlf36eak14zoWYpgcgGoOg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-primitive": "2.0.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-avatar": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-avatar/-/react-avatar-1.1.0.tgz",
+			"integrity": "sha512-Q/PbuSMk/vyAd/UoIShVGZ7StHHeRFYU7wXmi5GV+8cLXflZAEpHL/F697H1klrzxKXNtZ97vWiC0q3RKUH8UA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-layout-effect": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-checkbox": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-checkbox/-/react-checkbox-1.1.0.tgz",
+			"integrity": "sha512-3+kSzVfMONtP3B6CvaOrXLVTyGYws7tGmG5kOY0AfyH9sexkLytIwciNwjZhY0RoGOEbxI7bMS21XYB8H5itWQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"@radix-ui/react-use-previous": "1.1.0",
+				"@radix-ui/react-use-size": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-collection": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-collection/-/react-collection-1.1.0.tgz",
+			"integrity": "sha512-GZsZslMJEyo1VKm5L1ZJY8tGDxZNPAoUeQUIbKeJfoi7Q4kmig5AsgLMYYuyYbfjd8fBmFORAIwYAkXMnXZgZw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-slot": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
 		"node_modules/@radix-ui/react-compose-refs": {
 			"version": "1.1.0",
 			"resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.1.0.tgz",
@@ -5063,18 +5242,621 @@
 				}
 			}
 		},
+		"node_modules/@radix-ui/react-context-menu": {
+			"version": "2.2.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-context-menu/-/react-context-menu-2.2.1.tgz",
+			"integrity": "sha512-wvMKKIeb3eOrkJ96s722vcidZ+2ZNfcYZWBPRHIB1VWrF+fiF851Io6LX0kmK5wTDQFKdulCCKJk2c3SBaQHvA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-menu": "2.1.1",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-dialog": {
+			"version": "1.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-dialog/-/react-dialog-1.1.1.tgz",
+			"integrity": "sha512-zysS+iU4YP3STKNS6USvFVqI4qqx8EpiwmT5TuCApVEBca+eRCbONi4EgzfNSuVnOXvC5UPHHMjs8RXO6DH9Bg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-dismissable-layer": "1.1.0",
+				"@radix-ui/react-focus-guards": "1.1.0",
+				"@radix-ui/react-focus-scope": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-portal": "1.1.1",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-slot": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"aria-hidden": "^1.1.1",
+				"react-remove-scroll": "2.5.7"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-direction": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-direction/-/react-direction-1.1.0.tgz",
+			"integrity": "sha512-BUuBvgThEiAXh2DWu93XsT+a3aWrGqolGlqqw5VU1kG7p/ZH2cuDlM1sRLNnY3QcBS69UIz2mcKhMxDsdewhjg==",
+			"dev": true,
+			"license": "MIT",
+			"peerDependencies": {
+				"@types/react": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				}
+			}
+		},
 		"node_modules/@radix-ui/react-dismissable-layer": {
 			"version": "1.1.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.1.0.tgz",
-			"integrity": "sha512-/UovfmmXGptwGcBQawLzvn2jOfM0t4z3/uKffoBlj724+n3FvBbZ7M0aaBOmkp6pqFYpO4yx8tSVJjx3Fl2jig==",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.1.0.tgz",
+			"integrity": "sha512-/UovfmmXGptwGcBQawLzvn2jOfM0t4z3/uKffoBlj724+n3FvBbZ7M0aaBOmkp6pqFYpO4yx8tSVJjx3Fl2jig==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-escape-keydown": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-dropdown-menu": {
+			"version": "2.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-2.1.1.tgz",
+			"integrity": "sha512-y8E+x9fBq9qvteD2Zwa4397pUVhYsh9iq44b5RD5qu1GMJWBCBuVg1hMyItbc6+zH00TxGRqd9Iot4wzf3OoBQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-menu": "2.1.1",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-focus-guards": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-focus-guards/-/react-focus-guards-1.1.0.tgz",
+			"integrity": "sha512-w6XZNUPVv6xCpZUqb/yN9DL6auvpGX3C/ee6Hdi16v2UUy25HV2Q5bcflsiDyT/g5RwbPQ/GIT1vLkeRb+ITBw==",
+			"dev": true,
+			"license": "MIT",
+			"peerDependencies": {
+				"@types/react": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-focus-scope": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-focus-scope/-/react-focus-scope-1.1.0.tgz",
+			"integrity": "sha512-200UD8zylvEyL8Bx+z76RJnASR2gRMuxlgFCPAe/Q/679a/r0eK3MBVYMb7vZODZcffZBdob1EGnky78xmVvcA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-form": {
+			"version": "0.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-form/-/react-form-0.1.0.tgz",
+			"integrity": "sha512-1/oVYPDjbFILOLIarcGcMKo+y6SbTVT/iUKVEw59CF4offwZgBgC3ZOeSBewjqU0vdA6FWTPWTN63obj55S/tQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-label": "2.1.0",
+				"@radix-ui/react-primitive": "2.0.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-hover-card": {
+			"version": "1.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-hover-card/-/react-hover-card-1.1.1.tgz",
+			"integrity": "sha512-IwzAOP97hQpDADYVKrEEHUH/b2LA+9MgB0LgdmnbFO2u/3M5hmEofjjr2M6CyzUblaAqJdFm6B7oFtU72DPXrA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-dismissable-layer": "1.1.0",
+				"@radix-ui/react-popper": "1.2.0",
+				"@radix-ui/react-portal": "1.1.1",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-id": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.0.tgz",
+			"integrity": "sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-use-layout-effect": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-label": {
+			"version": "2.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-label/-/react-label-2.1.0.tgz",
+			"integrity": "sha512-peLblDlFw/ngk3UWq0VnYaOLy6agTZZ+MUO/WhVfm14vJGML+xH4FAl2XQGLqdefjNb7ApRg6Yn7U42ZhmYXdw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-primitive": "2.0.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-menu": {
+			"version": "2.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-menu/-/react-menu-2.1.1.tgz",
+			"integrity": "sha512-oa3mXRRVjHi6DZu/ghuzdylyjaMXLymx83irM7hTxutQbD+7IhPKdMdRHD26Rm+kHRrWcrUkkRPv5pd47a2xFQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-collection": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-dismissable-layer": "1.1.0",
+				"@radix-ui/react-focus-guards": "1.1.0",
+				"@radix-ui/react-focus-scope": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-popper": "1.2.0",
+				"@radix-ui/react-portal": "1.1.1",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-roving-focus": "1.1.0",
+				"@radix-ui/react-slot": "1.1.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"aria-hidden": "^1.1.1",
+				"react-remove-scroll": "2.5.7"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-navigation-menu": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-navigation-menu/-/react-navigation-menu-1.2.0.tgz",
+			"integrity": "sha512-OQ8tcwAOR0DhPlSY3e4VMXeHiol7la4PPdJWhhwJiJA+NLX0SaCaonOkRnI3gCDHoZ7Fo7bb/G6q25fRM2Y+3Q==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-collection": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-dismissable-layer": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"@radix-ui/react-use-layout-effect": "1.1.0",
+				"@radix-ui/react-use-previous": "1.1.0",
+				"@radix-ui/react-visually-hidden": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-popover": {
+			"version": "1.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-popover/-/react-popover-1.1.1.tgz",
+			"integrity": "sha512-3y1A3isulwnWhvTTwmIreiB8CF4L+qRjZnK1wYLO7pplddzXKby/GnZ2M7OZY3qgnl6p9AodUIHRYGXNah8Y7g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-dismissable-layer": "1.1.0",
+				"@radix-ui/react-focus-guards": "1.1.0",
+				"@radix-ui/react-focus-scope": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-popper": "1.2.0",
+				"@radix-ui/react-portal": "1.1.1",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-slot": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"aria-hidden": "^1.1.1",
+				"react-remove-scroll": "2.5.7"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-popper": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.2.0.tgz",
+			"integrity": "sha512-ZnRMshKF43aBxVWPWvbj21+7TQCvhuULWJ4gNIKYpRlQt5xGRhLx66tMp8pya2UkGHTSlhpXwmjqltDYHhw7Vg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@floating-ui/react-dom": "^2.0.0",
+				"@radix-ui/react-arrow": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-layout-effect": "1.1.0",
+				"@radix-ui/react-use-rect": "1.1.0",
+				"@radix-ui/react-use-size": "1.1.0",
+				"@radix-ui/rect": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-portal": {
+			"version": "1.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.1.tgz",
+			"integrity": "sha512-A3UtLk85UtqhzFqtoC8Q0KvR2GbXF3mtPgACSazajqq6A41mEQgo53iPzY4i6BwDxlIFqWIhiQ2G729n+2aw/g==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-layout-effect": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-presence": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.0.tgz",
+			"integrity": "sha512-Gq6wuRN/asf9H/E/VzdKoUtT8GC9PQc9z40/vEr0VCJ4u5XvvhWIrSsCB6vD2/cH7ugTdSfYq9fLJCcM00acrQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-use-layout-effect": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-primitive": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.0.0.tgz",
+			"integrity": "sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-slot": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-progress": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-progress/-/react-progress-1.1.0.tgz",
+			"integrity": "sha512-aSzvnYpP725CROcxAOEBVZZSIQVQdHgBr2QQFKySsaD14u8dNT0batuXI+AAGDdAHfXH8rbnHmjYFqVJ21KkRg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-radio-group": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-radio-group/-/react-radio-group-1.2.0.tgz",
+			"integrity": "sha512-yv+oiLaicYMBpqgfpSPw6q+RyXlLdIpQWDHZbUKURxe+nEh53hFXPPlfhfQQtYkS5MMK/5IWIa76SksleQZSzw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-roving-focus": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"@radix-ui/react-use-previous": "1.1.0",
+				"@radix-ui/react-use-size": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-roving-focus": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-roving-focus/-/react-roving-focus-1.1.0.tgz",
+			"integrity": "sha512-EA6AMGeq9AEeQDeSH0aZgG198qkfHSbvWTf1HvoDmOB5bBG/qTxjYMWUKMnYiV6J/iP/J8MEFSuB2zRU2n7ODA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-collection": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/react-scroll-area": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-scroll-area/-/react-scroll-area-1.1.0.tgz",
+			"integrity": "sha512-9ArIZ9HWhsrfqS765h+GZuLoxaRHD/j0ZWOWilsCvYTpYJp8XwCqNG7Dt9Nu/TItKOdgLGkOPCodQvDc+UMwYg==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
+				"@radix-ui/number": "1.1.0",
 				"@radix-ui/primitive": "1.1.0",
 				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-presence": "1.1.0",
 				"@radix-ui/react-primitive": "2.0.0",
 				"@radix-ui/react-use-callback-ref": "1.1.0",
-				"@radix-ui/react-use-escape-keydown": "1.1.0"
+				"@radix-ui/react-use-layout-effect": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5091,32 +5873,68 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-focus-guards": {
-			"version": "1.1.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-focus-guards/-/react-focus-guards-1.1.0.tgz",
-			"integrity": "sha512-w6XZNUPVv6xCpZUqb/yN9DL6auvpGX3C/ee6Hdi16v2UUy25HV2Q5bcflsiDyT/g5RwbPQ/GIT1vLkeRb+ITBw==",
+		"node_modules/@radix-ui/react-select": {
+			"version": "2.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-select/-/react-select-2.1.1.tgz",
+			"integrity": "sha512-8iRDfyLtzxlprOo9IicnzvpsO1wNCkuwzzCM+Z5Rb5tNOpCdMvcc2AkzX0Fz+Tz9v6NJ5B/7EEgyZveo4FBRfQ==",
 			"dev": true,
 			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/number": "1.1.0",
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-collection": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-dismissable-layer": "1.1.0",
+				"@radix-ui/react-focus-guards": "1.1.0",
+				"@radix-ui/react-focus-scope": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-popper": "1.2.0",
+				"@radix-ui/react-portal": "1.1.1",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-slot": "1.1.0",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"@radix-ui/react-use-layout-effect": "1.1.0",
+				"@radix-ui/react-use-previous": "1.1.0",
+				"@radix-ui/react-visually-hidden": "1.1.0",
+				"aria-hidden": "^1.1.1",
+				"react-remove-scroll": "2.5.7"
+			},
 			"peerDependencies": {
 				"@types/react": "*",
-				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
 			},
 			"peerDependenciesMeta": {
 				"@types/react": {
 					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-focus-scope": {
-			"version": "1.1.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-focus-scope/-/react-focus-scope-1.1.0.tgz",
-			"integrity": "sha512-200UD8zylvEyL8Bx+z76RJnASR2gRMuxlgFCPAe/Q/679a/r0eK3MBVYMb7vZODZcffZBdob1EGnky78xmVvcA==",
+		"node_modules/@radix-ui/react-slider": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-slider/-/react-slider-1.2.0.tgz",
+			"integrity": "sha512-dAHCDA4/ySXROEPaRtaMV5WHL8+JB/DbtyTbJjYkY0RXmKMO2Ln8DFZhywG5/mVQ4WqHDBc8smc14yPXPqZHYA==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
+				"@radix-ui/number": "1.1.0",
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-collection": "1.1.0",
 				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
 				"@radix-ui/react-primitive": "2.0.0",
-				"@radix-ui/react-use-callback-ref": "1.1.0"
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"@radix-ui/react-use-layout-effect": "1.1.0",
+				"@radix-ui/react-use-previous": "1.1.0",
+				"@radix-ui/react-use-size": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5133,14 +5951,14 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-id": {
+		"node_modules/@radix-ui/react-slot": {
 			"version": "1.1.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.0.tgz",
-			"integrity": "sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.1.0.tgz",
+			"integrity": "sha512-FUCf5XMfmW4dtYl69pdS4DbxKy8nj4M7SafBgPllysxmdachynNflAdp/gCsnYWNDnge6tI9onzMp5ARYc1KNw==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
-				"@radix-ui/react-use-layout-effect": "1.1.0"
+				"@radix-ui/react-compose-refs": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5152,28 +5970,20 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-popover": {
-			"version": "1.1.1",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-popover/-/react-popover-1.1.1.tgz",
-			"integrity": "sha512-3y1A3isulwnWhvTTwmIreiB8CF4L+qRjZnK1wYLO7pplddzXKby/GnZ2M7OZY3qgnl6p9AodUIHRYGXNah8Y7g==",
+		"node_modules/@radix-ui/react-switch": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-switch/-/react-switch-1.1.0.tgz",
+			"integrity": "sha512-OBzy5WAj641k0AOSpKQtreDMe+isX0MQJ1IVyF03ucdF3DunOnROVrjWs8zsXUxC3zfZ6JL9HFVCUlMghz9dJw==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@radix-ui/primitive": "1.1.0",
 				"@radix-ui/react-compose-refs": "1.1.0",
 				"@radix-ui/react-context": "1.1.0",
-				"@radix-ui/react-dismissable-layer": "1.1.0",
-				"@radix-ui/react-focus-guards": "1.1.0",
-				"@radix-ui/react-focus-scope": "1.1.0",
-				"@radix-ui/react-id": "1.1.0",
-				"@radix-ui/react-popper": "1.2.0",
-				"@radix-ui/react-portal": "1.1.1",
-				"@radix-ui/react-presence": "1.1.0",
 				"@radix-ui/react-primitive": "2.0.0",
-				"@radix-ui/react-slot": "1.1.0",
 				"@radix-ui/react-use-controllable-state": "1.1.0",
-				"aria-hidden": "^1.1.1",
-				"react-remove-scroll": "2.5.7"
+				"@radix-ui/react-use-previous": "1.1.0",
+				"@radix-ui/react-use-size": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5190,23 +6000,21 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-popper": {
-			"version": "1.2.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.2.0.tgz",
-			"integrity": "sha512-ZnRMshKF43aBxVWPWvbj21+7TQCvhuULWJ4gNIKYpRlQt5xGRhLx66tMp8pya2UkGHTSlhpXwmjqltDYHhw7Vg==",
+		"node_modules/@radix-ui/react-tabs": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-tabs/-/react-tabs-1.1.0.tgz",
+			"integrity": "sha512-bZgOKB/LtZIij75FSuPzyEti/XBhJH52ExgtdVqjCIh+Nx/FW+LhnbXtbCzIi34ccyMsyOja8T0thCzoHFXNKA==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
-				"@floating-ui/react-dom": "^2.0.0",
-				"@radix-ui/react-arrow": "1.1.0",
-				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/primitive": "1.1.0",
 				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-presence": "1.1.0",
 				"@radix-ui/react-primitive": "2.0.0",
-				"@radix-ui/react-use-callback-ref": "1.1.0",
-				"@radix-ui/react-use-layout-effect": "1.1.0",
-				"@radix-ui/react-use-rect": "1.1.0",
-				"@radix-ui/react-use-size": "1.1.0",
-				"@radix-ui/rect": "1.1.0"
+				"@radix-ui/react-roving-focus": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5223,15 +6031,16 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-portal": {
-			"version": "1.1.1",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.1.tgz",
-			"integrity": "sha512-A3UtLk85UtqhzFqtoC8Q0KvR2GbXF3mtPgACSazajqq6A41mEQgo53iPzY4i6BwDxlIFqWIhiQ2G729n+2aw/g==",
+		"node_modules/@radix-ui/react-toggle": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-toggle/-/react-toggle-1.1.0.tgz",
+			"integrity": "sha512-gwoxaKZ0oJ4vIgzsfESBuSgJNdc0rv12VhHgcqN0TEJmmZixXG/2XpsLK8kzNWYcnaoRIEEQc0bEi3dIvdUpjw==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
+				"@radix-ui/primitive": "1.1.0",
 				"@radix-ui/react-primitive": "2.0.0",
-				"@radix-ui/react-use-layout-effect": "1.1.0"
+				"@radix-ui/react-use-controllable-state": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5248,15 +6057,20 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-presence": {
+		"node_modules/@radix-ui/react-toggle-group": {
 			"version": "1.1.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.0.tgz",
-			"integrity": "sha512-Gq6wuRN/asf9H/E/VzdKoUtT8GC9PQc9z40/vEr0VCJ4u5XvvhWIrSsCB6vD2/cH7ugTdSfYq9fLJCcM00acrQ==",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-toggle-group/-/react-toggle-group-1.1.0.tgz",
+			"integrity": "sha512-PpTJV68dZU2oqqgq75Uzto5o/XfOVgkrJ9rulVmfTKxWp3HfUjHE6CP/WLRR4AzPX9HWxw7vFow2me85Yu+Naw==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
-				"@radix-ui/react-compose-refs": "1.1.0",
-				"@radix-ui/react-use-layout-effect": "1.1.0"
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-roving-focus": "1.1.0",
+				"@radix-ui/react-toggle": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5273,14 +6087,25 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-primitive": {
-			"version": "2.0.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.0.0.tgz",
-			"integrity": "sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==",
+		"node_modules/@radix-ui/react-tooltip": {
+			"version": "1.1.1",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.1.1.tgz",
+			"integrity": "sha512-LLE8nzNE4MzPMw3O2zlVlkLFid3y9hMUs7uCbSHyKSo+tCN4yMCf+ZCCcfrYgsOC0TiHBPQ1mtpJ2liY3ZT3SQ==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
-				"@radix-ui/react-slot": "1.1.0"
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-dismissable-layer": "1.1.0",
+				"@radix-ui/react-id": "1.1.0",
+				"@radix-ui/react-popper": "1.2.0",
+				"@radix-ui/react-portal": "1.1.1",
+				"@radix-ui/react-presence": "1.1.0",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-slot": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"@radix-ui/react-visually-hidden": "1.1.0"
 			},
 			"peerDependencies": {
 				"@types/react": "*",
@@ -5297,25 +6122,6 @@
 				}
 			}
 		},
-		"node_modules/@radix-ui/react-slot": {
-			"version": "1.1.0",
-			"resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.1.0.tgz",
-			"integrity": "sha512-FUCf5XMfmW4dtYl69pdS4DbxKy8nj4M7SafBgPllysxmdachynNflAdp/gCsnYWNDnge6tI9onzMp5ARYc1KNw==",
-			"dev": true,
-			"license": "MIT",
-			"dependencies": {
-				"@radix-ui/react-compose-refs": "1.1.0"
-			},
-			"peerDependencies": {
-				"@types/react": "*",
-				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
-			},
-			"peerDependenciesMeta": {
-				"@types/react": {
-					"optional": true
-				}
-			}
-		},
 		"node_modules/@radix-ui/react-use-callback-ref": {
 			"version": "1.1.0",
 			"resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.1.0.tgz",
@@ -5386,6 +6192,22 @@
 				}
 			}
 		},
+		"node_modules/@radix-ui/react-use-previous": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-use-previous/-/react-use-previous-1.1.0.tgz",
+			"integrity": "sha512-Z/e78qg2YFnnXcW88A4JmTtm4ADckLno6F7OXotmkQfeuCVaKuYzqAATPhVzl3delXE7CxIV8shofPn3jPc5Og==",
+			"dev": true,
+			"license": "MIT",
+			"peerDependencies": {
+				"@types/react": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				}
+			}
+		},
 		"node_modules/@radix-ui/react-use-rect": {
 			"version": "1.1.0",
 			"resolved": "https://registry.npmjs.org/@radix-ui/react-use-rect/-/react-use-rect-1.1.0.tgz",
@@ -5424,6 +6246,30 @@
 				}
 			}
 		},
+		"node_modules/@radix-ui/react-visually-hidden": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.1.0.tgz",
+			"integrity": "sha512-N8MDZqtgCgG5S3aV60INAB475osJousYpZ4cTJ2cFbMpdHS5Y6loLTH8LPtkj2QN0x93J30HT/M3qJXM0+lyeQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/react-primitive": "2.0.0"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
 		"node_modules/@radix-ui/rect": {
 			"version": "1.1.0",
 			"resolved": "https://registry.npmjs.org/@radix-ui/rect/-/rect-1.1.0.tgz",
@@ -5431,6 +6277,87 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/@radix-ui/themes": {
+			"version": "3.1.4",
+			"resolved": "https://registry.npmjs.org/@radix-ui/themes/-/themes-3.1.4.tgz",
+			"integrity": "sha512-HmyU8UpoYPmdfXSQIwbEnJS2Wv/5wbzxe/Niw/sMLMJTrlZiUKM/dEOM7N+bc7w2OMpUaQ8OH9czCGpcjHx98w==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@radix-ui/colors": "3.0.0",
+				"@radix-ui/primitive": "1.1.0",
+				"@radix-ui/react-accessible-icon": "1.1.0",
+				"@radix-ui/react-alert-dialog": "1.1.1",
+				"@radix-ui/react-aspect-ratio": "1.1.0",
+				"@radix-ui/react-avatar": "1.1.0",
+				"@radix-ui/react-checkbox": "1.1.0",
+				"@radix-ui/react-compose-refs": "1.1.0",
+				"@radix-ui/react-context": "1.1.0",
+				"@radix-ui/react-context-menu": "2.2.1",
+				"@radix-ui/react-dialog": "1.1.1",
+				"@radix-ui/react-direction": "1.1.0",
+				"@radix-ui/react-dropdown-menu": "2.1.1",
+				"@radix-ui/react-form": "0.1.0",
+				"@radix-ui/react-hover-card": "1.1.1",
+				"@radix-ui/react-navigation-menu": "1.2.0",
+				"@radix-ui/react-popover": "1.1.1",
+				"@radix-ui/react-portal": "1.1.1",
+				"@radix-ui/react-primitive": "2.0.0",
+				"@radix-ui/react-progress": "1.1.0",
+				"@radix-ui/react-radio-group": "1.2.0",
+				"@radix-ui/react-roving-focus": "1.1.0",
+				"@radix-ui/react-scroll-area": "1.1.0",
+				"@radix-ui/react-select": "2.1.1",
+				"@radix-ui/react-slider": "1.2.0",
+				"@radix-ui/react-slot": "1.1.0",
+				"@radix-ui/react-switch": "1.1.0",
+				"@radix-ui/react-tabs": "1.1.0",
+				"@radix-ui/react-toggle-group": "1.1.0",
+				"@radix-ui/react-tooltip": "1.1.1",
+				"@radix-ui/react-use-callback-ref": "1.1.0",
+				"@radix-ui/react-use-controllable-state": "1.1.0",
+				"@radix-ui/react-visually-hidden": "1.1.0",
+				"classnames": "2.3.2",
+				"react-remove-scroll-bar": "2.3.4"
+			},
+			"peerDependencies": {
+				"@types/react": "*",
+				"@types/react-dom": "*",
+				"react": "16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+				"react-dom": "16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				},
+				"@types/react-dom": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@radix-ui/themes/node_modules/react-remove-scroll-bar": {
+			"version": "2.3.4",
+			"resolved": "https://registry.npmjs.org/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.4.tgz",
+			"integrity": "sha512-63C4YQBUt0m6ALadE9XV56hV8BgJWDmmTPY758iIJjfQKt2nYwoUrPk0LXRXcB/yIj82T1/Ixfdpdk68LwIB0A==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"react-style-singleton": "^2.2.1",
+				"tslib": "^2.0.0"
+			},
+			"engines": {
+				"node": ">=10"
+			},
+			"peerDependencies": {
+				"@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+				"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+			},
+			"peerDependenciesMeta": {
+				"@types/react": {
+					"optional": true
+				}
+			}
+		},
 		"node_modules/@remix-run/router": {
 			"version": "1.19.2",
 			"resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.19.2.tgz",
@@ -10753,9 +11680,9 @@
 			"license": "MIT"
 		},
 		"node_modules/@types/styled-components": {
-			"version": "5.1.26",
-			"resolved": "https://registry.npmjs.org/@types/styled-components/-/styled-components-5.1.26.tgz",
-			"integrity": "sha512-KuKJ9Z6xb93uJiIyxo/+ksS7yLjS1KzG6iv5i78dhVg/X3u5t1H7juRWqVmodIdz6wGVaIApo1u01kmFRdJHVw==",
+			"version": "5.1.34",
+			"resolved": "https://registry.npmjs.org/@types/styled-components/-/styled-components-5.1.34.tgz",
+			"integrity": "sha512-mmiVvwpYklFIv9E8qfxuPyIt/OuyIrn6gMOAMOFUO3WJfSrSE+sGUoa4PiZj77Ut7bKZpaa6o1fBKS/4TOEvnA==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
@@ -13134,6 +14061,19 @@
 				"node": ">=4"
 			}
 		},
+		"node_modules/chainsaw": {
+			"version": "0.0.9",
+			"resolved": "https://registry.npmjs.org/chainsaw/-/chainsaw-0.0.9.tgz",
+			"integrity": "sha512-nG8PYH+/4xB+8zkV4G844EtfvZ5tTiLFoX3dZ4nhF4t3OCKIb9UvaFyNmeZO2zOSmRWzBoTD+napN6hiL+EgcA==",
+			"dev": true,
+			"license": "MIT/X11",
+			"dependencies": {
+				"traverse": ">=0.3.0 <0.4"
+			},
+			"engines": {
+				"node": "*"
+			}
+		},
 		"node_modules/chalk": {
 			"version": "4.1.2",
 			"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
@@ -13232,6 +14172,13 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/classnames": {
+			"version": "2.3.2",
+			"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz",
+			"integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/clean-stack": {
 			"version": "2.2.0",
 			"resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz",
@@ -17665,6 +18612,19 @@
 				"node": ">=8"
 			}
 		},
+		"node_modules/hashish": {
+			"version": "0.0.4",
+			"resolved": "https://registry.npmjs.org/hashish/-/hashish-0.0.4.tgz",
+			"integrity": "sha512-xyD4XgslstNAs72ENaoFvgMwtv8xhiDtC2AtzCG+8yF7W/Knxxm9BX+e2s25mm+HxMKh0rBmXVOEGF3zNImXvA==",
+			"dev": true,
+			"license": "MIT/X11",
+			"dependencies": {
+				"traverse": ">=0.2.4"
+			},
+			"engines": {
+				"node": "*"
+			}
+		},
 		"node_modules/hasown": {
 			"version": "2.0.2",
 			"resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
@@ -23480,16 +24440,16 @@
 			}
 		},
 		"node_modules/prettier": {
-			"version": "2.8.8",
-			"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
-			"integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
+			"version": "3.3.3",
+			"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
+			"integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
 			"dev": true,
 			"license": "MIT",
 			"bin": {
-				"prettier": "bin-prettier.js"
+				"prettier": "bin/prettier.cjs"
 			},
 			"engines": {
-				"node": ">=10.13.0"
+				"node": ">=14"
 			},
 			"funding": {
 				"url": "https://github.com/prettier/prettier?sponsor=1"
@@ -24346,6 +25306,16 @@
 				"node": ">=4"
 			}
 		},
+		"node_modules/remove": {
+			"version": "0.1.5",
+			"resolved": "https://registry.npmjs.org/remove/-/remove-0.1.5.tgz",
+			"integrity": "sha512-AJMA9oWvJzdTjwIGwSQZsjGQiRx73YTmiOWmfCp1fpLa/D4n7jKcpoA+CZiVLJqKcEKUuh1Suq80c5wF+L/qVQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"seq": ">= 0.3.5"
+			}
+		},
 		"node_modules/require-directory": {
 			"version": "2.1.1",
 			"resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -24954,6 +25924,20 @@
 				"node": ">= 0.8"
 			}
 		},
+		"node_modules/seq": {
+			"version": "0.3.5",
+			"resolved": "https://registry.npmjs.org/seq/-/seq-0.3.5.tgz",
+			"integrity": "sha512-sisY2Ln1fj43KBkRtXkesnRHYNdswIkIibvNe/0UKm2GZxjMbqmccpiatoKr/k2qX5VKiLU8xm+tz/74LAho4g==",
+			"dev": true,
+			"license": "MIT/X11",
+			"dependencies": {
+				"chainsaw": ">=0.0.7 <0.1",
+				"hashish": ">=0.0.2 <0.1"
+			},
+			"engines": {
+				"node": "*"
+			}
+		},
 		"node_modules/serialize-javascript": {
 			"version": "6.0.2",
 			"resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz",
@@ -26641,6 +27625,16 @@
 				"node": ">=14"
 			}
 		},
+		"node_modules/traverse": {
+			"version": "0.3.9",
+			"resolved": "https://registry.npmjs.org/traverse/-/traverse-0.3.9.tgz",
+			"integrity": "sha512-iawgk0hLP3SxGKDfnDJf8wTz4p2qImnyihM5Hh/sGvQ3K37dPi/w8sRhdNIxYA1TwFwc5mDhIJq+O0RsvXBKdQ==",
+			"dev": true,
+			"license": "MIT/X11",
+			"engines": {
+				"node": "*"
+			}
+		},
 		"node_modules/tree-dump": {
 			"version": "1.0.2",
 			"resolved": "https://registry.npmjs.org/tree-dump/-/tree-dump-1.0.2.tgz",
diff --git a/package.json b/package.json
index ea714cd..2ad7283 100644
--- a/package.json
+++ b/package.json
@@ -27,7 +27,9 @@
 		"@nx/web": "19.8.2",
 		"@nx/workspace": "19.8.2",
 		"@playwright/test": "^1.36.0",
+		"@radix-ui/react-avatar": "^1.1.0",
 		"@radix-ui/react-popover": "^1.1.1",
+		"@radix-ui/themes": "^3.1.4",
 		"@storybook/addon-essentials": "^8.2.8",
 		"@storybook/addon-interactions": "^8.2.8",
 		"@storybook/core-server": "^8.2.8",
@@ -45,7 +47,7 @@
 		"@types/react": "18.3.1",
 		"@types/react-dom": "18.3.0",
 		"@types/react-is": "18.3.0",
-		"@types/styled-components": "5.1.26",
+		"@types/styled-components": "^5.1.34",
 		"@vitejs/plugin-react": "^4.2.0",
 		"@vitest/ui": "^1.3.1",
 		"babel-jest": "^29.7.0",
@@ -61,8 +63,9 @@
 		"jest-environment-jsdom": "^29.7.0",
 		"jsdom": "~22.1.0",
 		"nx": "19.8.2",
-		"prettier": "^2.6.2",
+		"prettier": "^3.3.3",
 		"react-router-dom": "^6.26.2",
+		"remove": "^0.1.5",
 		"storybook": "^8.2.8",
 		"ts-jest": "^29.1.0",
 		"ts-node": "10.9.1",
diff --git a/shared-ui/src/index.ts b/shared-ui/src/index.ts
index 2f5d4f6..644ad07 100644
--- a/shared-ui/src/index.ts
+++ b/shared-ui/src/index.ts
@@ -1 +1 @@
-export * from './lib/shared-ui';
+export * from './lib/Form';
diff --git a/shared-ui/src/lib/Form/index.tsx b/shared-ui/src/lib/Form/index.tsx
new file mode 100644
index 0000000..3eb2c66
--- /dev/null
+++ b/shared-ui/src/lib/Form/index.tsx
@@ -0,0 +1,52 @@
+import React from 'react';
+import * as Form from '@radix-ui/react-form';
+import './styles.css';
+
+const FormDemo = (): React.ReactElement => (
+	<Form.Root className="FormRoot">
+		<Form.Field className="FormField" name="email">
+			<div
+				style={{
+					display: 'flex',
+					alignItems: 'baseline',
+					justifyContent: 'space-between',
+				}}
+			>
+				<Form.Label className="FormLabel">Email</Form.Label>
+				<Form.Message className="FormMessage" match="valueMissing">
+					Please enter your email
+				</Form.Message>
+				<Form.Message className="FormMessage" match="typeMismatch">
+					Please provide a valid email
+				</Form.Message>
+			</div>
+			<Form.Control asChild>
+				<input className="Input" type="email" required />
+			</Form.Control>
+		</Form.Field>
+		<Form.Field className="FormField" name="question">
+			<div
+				style={{
+					display: 'flex',
+					alignItems: 'baseline',
+					justifyContent: 'space-between',
+				}}
+			>
+				<Form.Label className="FormLabel">Question</Form.Label>
+				<Form.Message className="FormMessage" match="valueMissing">
+					Please enter a question
+				</Form.Message>
+			</div>
+			<Form.Control asChild>
+				<textarea className="Textarea" required />
+			</Form.Control>
+		</Form.Field>
+		<Form.Submit asChild>
+			<button className="Button" style={{ marginTop: 10 }}>
+				Post question
+			</button>
+		</Form.Submit>
+	</Form.Root>
+);
+
+export default FormDemo;
diff --git a/shared-ui/src/lib/shared-ui.spec.tsx b/shared-ui/src/lib/shared-ui.spec.tsx
deleted file mode 100644
index 7915c48..0000000
--- a/shared-ui/src/lib/shared-ui.spec.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import SharedUi from './shared-ui';
-
-describe('SharedUi', () => {
-	it('should render successfully', () => {
-		const { baseElement } = render(<SharedUi />);
-		expect(baseElement).toBeTruthy();
-	});
-});
diff --git a/shared-ui/src/lib/shared-ui.tsx b/shared-ui/src/lib/shared-ui.tsx
deleted file mode 100644
index 1eaec15..0000000
--- a/shared-ui/src/lib/shared-ui.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import styled from 'styled-components';
-
-const StyledSharedUi = styled.div`
-	color: pink;
-`;
-
-export function SharedUi() {
-	return (
-		<StyledSharedUi>
-			<h1>Welcome to SharedUi!</h1>
-		</StyledSharedUi>
-	);
-}
-
-export default SharedUi;
diff --git a/shared-ui/src/lib/styles/GlobalStyle.ts b/shared-ui/src/lib/styles/GlobalStyle.ts
new file mode 100644
index 0000000..40e45d8
--- /dev/null
+++ b/shared-ui/src/lib/styles/GlobalStyle.ts
@@ -0,0 +1,7 @@
+import { createGlobalStyle } from 'styled-components';
+export const GlobalStyle = createGlobalStyle<{ $dark?: boolean }>`
+  body {
+      background-color: ${(props) => (props.$dark ? 'black' : 'white')};
+      color: ${(props) => (props.$dark ? 'white' : 'black')}
+  }
+`;