migrate to radix ui, make header draft

2026-01-20 00:50:12 +03:00
parent 4688f65c5a
commit 3dfb9453ec
62 changed files with 1757 additions and 165 deletions
@@ -37,7 +37,9 @@ const otherArgs = args.slice(2).join(" ")
 let componentPath = "./src/"
-if (layer === "shared" || layer === "app") {
+if (layer === "shared") {
 	componentPath += `${layer}/ui/${component}`
 } else if (layer === "app") {
 	componentPath += `${layer}/${component}`
 } else if (layer === "entity" || layer === "entities") {
 	componentPath += `entities/${component}`
@@ -225,3 +225,7 @@ export const Button: FC<IButtonProps> = ({ variant, onClick }): JSX.Element => {
 Write less complicated code, simple but readable code
 Less overhead - better
 Write all components with html semantics in mind
 To import classNames lib use
 `import cs from 'classnames'`
 Always install packages using
 `bun install <package>`
@@ -1,26 +1,33 @@
 import type { Metadata } from "next"
 import type { ReactNode } from "react"
-import "@shared/styles/global.scss"
+import { Open_Sans } from "next/font/google"
 import "bootstrap/dist/css/bootstrap.min.css"
-import { QueryClientProvider } from "@shared/context/QueryClientProvider"
+import "@shared/styles/global.scss"
 import { AppProviders } from "@shared/context/AppProviders"
 export const metadata: Metadata = {
 	title: "Coffee Project",
 	description: "Standalone Next.js app using FSD structure",
 }
 const open_sans = Open_Sans({
 	preload: true,
 	display: "swap",
 	variable: "--font-open-sans",
 })
 export default function RootLayout({
 	children,
 }: Readonly<{
 	children: ReactNode
 }>) {
 	return (
-		<html lang="en">
+		<html lang="ru" className={open_sans.variable}>
-			<QueryClientProvider>
+			<body>
-				<body>{children}</body>
+				<AppProviders>{children}</AppProviders>
-			</QueryClientProvider>
+			</body>
 		</html>
 	)
 }
@@ -1,7 +1,14 @@
 import { Header } from "@widgets/Header"
 export default function EssentialTemplate({
 	children,
 }: {
 	children: React.ReactNode
 }) {
-	return children
+	return (
 		<div>
 			<Header />
 			{children}
 		</div>
 	)
 }
@@ -5,11 +5,18 @@
    "": {
      "name": "fsd-nest-template",
      "dependencies": {
        "@radix-ui/react-checkbox": "^1.3.3",
        "@radix-ui/react-dialog": "^1.1.15",
        "@radix-ui/react-dropdown-menu": "^2.1.16",
        "@radix-ui/react-label": "^2.1.8",
        "@radix-ui/react-radio-group": "^1.3.8",
        "@radix-ui/react-select": "^2.2.6",
        "@radix-ui/react-tabs": "^1.1.13",
        "@radix-ui/themes": "^3.2.1",
        "@reduxjs/toolkit": "^2.11.2",
        "@tanstack/react-query": "^5.90.14",
        "@tanstack/react-query-devtools": "^5.91.2",
        "axios": "^1.13.2",
        "bootstrap": "^5.3.8",
        "classnames": "^2.5.1",
        "framer-motion": "^12.23.26",
        "js-cookie": "^3.0.5",
@@ -22,11 +29,11 @@
        "openapi-react-query": "^0.5.1",
        "react": "^19.2.3",
        "react-aria-components": "^1.14.0",
        "react-bootstrap": "^2.10.10",
        "react-dom": "^19.2.3",
        "react-dropzone": "^14.3.8",
        "react-hook-form": "^7.71.0",
        "react-modern-drawer": "^1.4.0",
        "react-redux": "^9.2.0",
        "react-toastify": "^11.0.5",
        "use-mask-input": "^3.6.0",
        "usehooks-ts": "^3.1.1",
@@ -88,8 +95,6 @@
    "@babel/parser": ["@babel/parser@7.28.5", "", { "dependencies": { "@babel/types": "^7.28.5" }, "bin": "./bin/babel-parser.js" }, "sha512-KKBU1VGYR7ORr3At5HAtUQ+TV3SzRCXmA/8OdDZiLDBIZxVyzXuztPjfLd3BV1PRAQGCMWWSHYhL0F8d5uHBDQ=="],
    "@babel/runtime": ["@babel/runtime@7.28.4", "", {}, "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ=="],
    "@babel/template": ["@babel/template@7.27.2", "", { "dependencies": { "@babel/code-frame": "^7.27.1", "@babel/parser": "^7.27.2", "@babel/types": "^7.27.1" } }, "sha512-LPDZ85aEJyYSd18/DkjNh4/y1ntkE5KwUHWTiqgRxruuZL2F1yuHligVHLvcHY2vMHXttKFpJn6LwfI7cw7ODw=="],
    "@babel/traverse": ["@babel/traverse@7.28.5", "", { "dependencies": { "@babel/code-frame": "^7.27.1", "@babel/generator": "^7.28.5", "@babel/helper-globals": "^7.28.0", "@babel/parser": "^7.28.5", "@babel/template": "^7.27.2", "@babel/types": "^7.28.5", "debug": "^4.3.1" } }, "sha512-TCCj4t55U90khlYkVV/0TfkJkAkUg3jZFA3Neb7unZT8CPok7iiRfaX0F+WnqWqt7OxhOn0uBKXCw4lbL8W0aQ=="],
@@ -298,18 +303,38 @@
    "@parcel/watcher-win32-x64": ["@parcel/watcher-win32-x64@2.5.1", "", { "os": "win32", "cpu": "x64" }, "sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA=="],
-    "@popperjs/core": ["@popperjs/core@2.11.8", "", {}, "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="],
+    "@radix-ui/colors": ["@radix-ui/colors@3.0.0", "", {}, "sha512-FUOsGBkHrYJwCSEtWRCIfQbZG7q1e6DgxCIOe1SUQzDe/7rXXeA47s8yCn6fuTNQAj1Zq4oTFi9Yjp3wzElcxg=="],
    "@radix-ui/number": ["@radix-ui/number@1.1.1", "", {}, "sha512-MkKCwxlXTgz6CFoJx3pCwn07GKp36+aZyu/u2Ln2VrA5DcdyCZkASEDBTd8x5whTQQL5CiYf4prXKLcgQdv29g=="],
    "@radix-ui/primitive": ["@radix-ui/primitive@1.1.3", "", {}, "sha512-JTF99U/6XIjCBo0wqkU5sK10glYe27MRRsfwoiq5zzOEZLHU3A3KCMa5X/azekYRCJ0HlwI0crAXS/5dEHTzDg=="],
    "@radix-ui/react-accessible-icon": ["@radix-ui/react-accessible-icon@1.1.7", "", { "dependencies": { "@radix-ui/react-visually-hidden": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-XM+E4WXl0OqUJFovy6GjmxxFyx9opfCAIUku4dlKRd5YEPqt4kALOkQOp0Of6reHuUkJuiPBEc5k0o4z4lTC8A=="],
    "@radix-ui/react-accordion": ["@radix-ui/react-accordion@1.2.12", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collapsible": "1.1.12", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-T4nygeh9YE9dLRPhAHSeOZi7HBXo+0kYIPJXayZfvWOWA0+n3dESrZbjfDPUABkUNym6Hd+f2IR113To8D2GPA=="],
    "@radix-ui/react-alert-dialog": ["@radix-ui/react-alert-dialog@1.1.15", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-dialog": "1.1.15", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-slot": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-oTVLkEw5GpdRe29BqJ0LSDFWI3qu0vR1M0mUkOQWDIUnY/QIkLpgDMWuKxP94c2NAC2LGcgVhG1ImF3jkZ5wXw=="],
    "@radix-ui/react-arrow": ["@radix-ui/react-arrow@1.1.7", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-F+M1tLhO+mlQaOWspE8Wstg+z6PwxwRd8oQ8IXceWz92kfAmalTRf0EjrouQeo7QssEPfCn05B4Ihs1K9WQ/7w=="],
    "@radix-ui/react-aspect-ratio": ["@radix-ui/react-aspect-ratio@1.1.7", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-Yq6lvO9HQyPwev1onK1daHCHqXVLzPhSVjmsNjCa2Zcxy2f7uJD2itDtxknv6FzAKCwD1qQkeVDmX/cev13n/g=="],
    "@radix-ui/react-avatar": ["@radix-ui/react-avatar@1.1.10", "", { "dependencies": { "@radix-ui/react-context": "1.1.2", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-is-hydrated": "0.1.0", "@radix-ui/react-use-layout-effect": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-V8piFfWapM5OmNCXTzVQY+E1rDa53zY+MQ4Y7356v4fFz6vqCyUtIz2rUD44ZEdwg78/jKmMJHj07+C/Z/rcog=="],
    "@radix-ui/react-checkbox": ["@radix-ui/react-checkbox@1.3.3", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-previous": "1.1.1", "@radix-ui/react-use-size": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-wBbpv+NQftHDdG86Qc0pIyXk5IR3tM8Vd0nWLKDcX8nNn4nXFOFwsKuqw2okA/1D/mpaAkmuyndrPJTYDNZtFw=="],
    "@radix-ui/react-collapsible": ["@radix-ui/react-collapsible@1.1.12", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-layout-effect": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-Uu+mSh4agx2ib1uIGPP4/CKNULyajb3p92LsVXmH2EHVMTfZWpll88XJ0j4W0z3f8NK1eYl1+Mf/szHPmcHzyA=="],
    "@radix-ui/react-collection": ["@radix-ui/react-collection@1.1.7", "", { "dependencies": { "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-slot": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-Fh9rGN0MoI4ZFUNyfFVNU4y9LUz93u9/0K+yLgA2bwRojxM8JU1DyvvMBabnZPBgMWREAJvU2jjVzq+LrFUglw=="],
    "@radix-ui/react-compose-refs": ["@radix-ui/react-compose-refs@1.1.2", "", { "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-z4eqJvfiNnFMHIIvXP3CY57y2WJs5g2v3X0zm9mEJkrkNv4rDxu+sg9Jh8EkXyeqBkB7SOcboo9dMVqhyrACIg=="],
    "@radix-ui/react-context": ["@radix-ui/react-context@1.1.2", "", { "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-jCi/QKUM2r1Ju5a3J64TH2A5SpKAgh0LpknyqdQ4m6DCV0xJ2HG1xARRwNGPQfi1SLdLWZ1OJz6F4OMBBNiGJA=="],
    "@radix-ui/react-context-menu": ["@radix-ui/react-context-menu@2.2.16", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-menu": "2.1.16", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-O8morBEW+HsVG28gYDZPTrT9UUovQUlJue5YO836tiTJhuIWBm/zQHc7j388sHWtdH/xUZurK9olD2+pcqx5ww=="],
    "@radix-ui/react-dialog": ["@radix-ui/react-dialog@1.1.15", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-focus-guards": "1.1.3", "@radix-ui/react-focus-scope": "1.1.7", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-slot": "1.2.3", "@radix-ui/react-use-controllable-state": "1.2.2", "aria-hidden": "^1.2.4", "react-remove-scroll": "^2.6.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-TCglVRtzlffRNxRMEyR36DGBLJpeusFcgMVD9PZEzAKnUs1lKCgX5u9BmC2Yg+LL9MgZDugFFs1Vl+Jp4t/PGw=="],
    "@radix-ui/react-direction": ["@radix-ui/react-direction@1.1.1", "", { "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-1UEWRX6jnOA2y4H5WczZ44gOOjTEmlqv1uNW4GAJEO5+bauCBhv8snY65Iw5/VOS/ghKN9gr2KjnLKxrsvoMVw=="],
    "@radix-ui/react-dismissable-layer": ["@radix-ui/react-dismissable-layer@1.1.11", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-escape-keydown": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-Nqcp+t5cTB8BinFkZgXiMJniQH0PsUt2k51FUhbdfeKvc4ACcG2uQniY/8+h1Yv6Kza4Q7lD7PQV0z0oicE0Mg=="],
@@ -320,10 +345,26 @@
    "@radix-ui/react-focus-scope": ["@radix-ui/react-focus-scope@1.1.7", "", { "dependencies": { "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-t2ODlkXBQyn7jkl6TNaw/MtVEVvIGelJDCG41Okq/KwUsJBwQ4XVZsHAVUkK4mBv3ewiAS3PGuUWuY2BoK4ZUw=="],
    "@radix-ui/react-form": ["@radix-ui/react-form@0.1.8", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-label": "2.1.7", "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-QM70k4Zwjttifr5a4sZFts9fn8FzHYvQ5PiB19O2HsYibaHSVt9fH9rzB0XZo/YcM+b7t/p7lYCT/F5eOeF5yQ=="],
    "@radix-ui/react-hover-card": ["@radix-ui/react-hover-card@1.1.15", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-popper": "1.2.8", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-qgTkjNT1CfKMoP0rcasmlH2r1DAiYicWsDsufxl940sT2wHNEWWv6FMWIQXWhVdmC1d/HYfbhQx60KYyAtKxjg=="],
    "@radix-ui/react-id": ["@radix-ui/react-id@1.1.1", "", { "dependencies": { "@radix-ui/react-use-layout-effect": "1.1.1" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-kGkGegYIdQsOb4XjsfM97rXsiHaBwco+hFI66oO4s9LU+PLAC5oJ7khdOVFxkhsmlbpUqDAvXw11CluXP+jkHg=="],
    "@radix-ui/react-label": ["@radix-ui/react-label@2.1.8", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-FmXs37I6hSBVDlO4y764TNz1rLgKwjJMQ0EGte6F3Cb3f4bIuHB/iLa/8I9VKkmOy+gNHq8rql3j686ACVV21A=="],
    "@radix-ui/react-menu": ["@radix-ui/react-menu@2.1.16", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-focus-guards": "1.1.3", "@radix-ui/react-focus-scope": "1.1.7", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-popper": "1.2.8", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-slot": "1.2.3", "@radix-ui/react-use-callback-ref": "1.1.1", "aria-hidden": "^1.2.4", "react-remove-scroll": "^2.6.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-72F2T+PLlphrqLcAotYPp0uJMr5SjP5SL01wfEspJbru5Zs5vQaSHb4VB3ZMJPimgHHCHG7gMOeOB9H3Hdmtxg=="],
    "@radix-ui/react-menubar": ["@radix-ui/react-menubar@1.1.16", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-menu": "2.1.16", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-EB1FktTz5xRRi2Er974AUQZWg2yVBb1yjip38/lgwtCVRd3a+maUoGHN/xs9Yv8SY8QwbSEb+YrxGadVWbEutA=="],
    "@radix-ui/react-navigation-menu": ["@radix-ui/react-navigation-menu@1.2.14", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-layout-effect": "1.1.1", "@radix-ui/react-use-previous": "1.1.1", "@radix-ui/react-visually-hidden": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-YB9mTFQvCOAQMHU+C/jVl96WmuWeltyUEpRJJky51huhds5W2FQr1J8D/16sQlf0ozxkPK8uF3niQMdUwZPv5w=="],
    "@radix-ui/react-one-time-password-field": ["@radix-ui/react-one-time-password-field@0.1.8", "", { "dependencies": { "@radix-ui/number": "1.1.1", "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-effect-event": "0.0.2", "@radix-ui/react-use-is-hydrated": "0.1.0", "@radix-ui/react-use-layout-effect": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-ycS4rbwURavDPVjCb5iS3aG4lURFDILi6sKI/WITUMZ13gMmn/xGjpLoqBAalhJaDk8I3UbCM5GzKHrnzwHbvg=="],
    "@radix-ui/react-password-toggle-field": ["@radix-ui/react-password-toggle-field@0.1.3", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-effect-event": "0.0.2", "@radix-ui/react-use-is-hydrated": "0.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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-/UuCrDBWravcaMix4TdT+qlNdVwOM1Nck9kWx/vafXsdfj1ChfhOdfi3cy9SGBpWgTXwYCuboT/oYpJy3clqfw=="],
    "@radix-ui/react-popover": ["@radix-ui/react-popover@1.1.15", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-focus-guards": "1.1.3", "@radix-ui/react-focus-scope": "1.1.7", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-popper": "1.2.8", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-slot": "1.2.3", "@radix-ui/react-use-controllable-state": "1.2.2", "aria-hidden": "^1.2.4", "react-remove-scroll": "^2.6.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-kr0X2+6Yy/vJzLYJUPCZEc8SfQcf+1COFoAqauJm74umQhta9M7lNJHP7QQS3vkvcGLQUbWpMzwrXYwrYztHKA=="],
    "@radix-ui/react-popper": ["@radix-ui/react-popper@1.2.8", "", { "dependencies": { "@floating-ui/react-dom": "^2.0.0", "@radix-ui/react-arrow": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-layout-effect": "1.1.1", "@radix-ui/react-use-rect": "1.1.1", "@radix-ui/react-use-size": "1.1.1", "@radix-ui/rect": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-0NJQ4LFFUuWkE7Oxf0htBKS6zLkkjBH+hM1uk7Ng705ReR8m/uelduy1DBo0PyBXPKVnBA6YBlU94MBGXrSBCw=="],
    "@radix-ui/react-portal": ["@radix-ui/react-portal@1.1.9", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-layout-effect": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-bpIxvq03if6UNwXZ+HTK71JLh4APvnXntDc6XOX8UVq4XQOVl7lwok0AvIl+b8zgCw3fSaVTZMpAPPagXbKmHQ=="],
@@ -332,10 +373,36 @@
    "@radix-ui/react-primitive": ["@radix-ui/react-primitive@2.1.3", "", { "dependencies": { "@radix-ui/react-slot": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-m9gTwRkhy2lvCPe6QJp4d3G1TYEUHn/FzJUtq9MjH46an1wJU+GdoGC5VLof8RX8Ft/DlpshApkhswDLZzHIcQ=="],
    "@radix-ui/react-progress": ["@radix-ui/react-progress@1.1.7", "", { "dependencies": { "@radix-ui/react-context": "1.1.2", "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-vPdg/tF6YC/ynuBIJlk1mm7Le0VgW6ub6J2UWnTQ7/D23KXcPI1qy+0vBkgKgd38RCMJavBXpB83HPNFMTb0Fg=="],
    "@radix-ui/react-radio-group": ["@radix-ui/react-radio-group@1.3.8", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-previous": "1.1.1", "@radix-ui/react-use-size": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-VBKYIYImA5zsxACdisNQ3BjCBfmbGH3kQlnFVqlWU4tXwjy7cGX8ta80BcrO+WJXIn5iBylEH3K6ZTlee//lgQ=="],
    "@radix-ui/react-roving-focus": ["@radix-ui/react-roving-focus@1.1.11", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-7A6S9jSgm/S+7MdtNDSb+IU859vQqJ/QAtcYQcfFC6W8RS4IxIZDldLR0xqCFZ6DCyrQLjLPsxtTNch5jVA4lA=="],
    "@radix-ui/react-scroll-area": ["@radix-ui/react-scroll-area@1.2.10", "", { "dependencies": { "@radix-ui/number": "1.1.1", "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-layout-effect": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-tAXIa1g3sM5CGpVT0uIbUx/U3Gs5N8T52IICuCtObaos1S8fzsrPXG5WObkQN3S6NVl6wKgPhAIiBGbWnvc97A=="],
    "@radix-ui/react-select": ["@radix-ui/react-select@2.2.6", "", { "dependencies": { "@radix-ui/number": "1.1.1", "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-focus-guards": "1.1.3", "@radix-ui/react-focus-scope": "1.1.7", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-popper": "1.2.8", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-slot": "1.2.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-layout-effect": "1.1.1", "@radix-ui/react-use-previous": "1.1.1", "@radix-ui/react-visually-hidden": "1.2.3", "aria-hidden": "^1.2.4", "react-remove-scroll": "^2.6.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-I30RydO+bnn2PQztvo25tswPH+wFBjehVGtmagkU78yMdwTwVf12wnAOF+AeP8S2N8xD+5UPbGhkUfPyvT+mwQ=="],
    "@radix-ui/react-separator": ["@radix-ui/react-separator@1.1.7", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-0HEb8R9E8A+jZjvmFCy/J4xhbXy3TV+9XSnGJ3KvTtjlIUy/YQ/p6UYZvi7YbeoeXdyU9+Y3scizK6hkY37baA=="],
    "@radix-ui/react-slider": ["@radix-ui/react-slider@1.3.6", "", { "dependencies": { "@radix-ui/number": "1.1.1", "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-layout-effect": "1.1.1", "@radix-ui/react-use-previous": "1.1.1", "@radix-ui/react-use-size": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-JPYb1GuM1bxfjMRlNLE+BcmBC8onfCi60Blk7OBqi2MLTFdS+8401U4uFjnwkOr49BLmXxLC6JHkvAsx5OJvHw=="],
    "@radix-ui/react-slot": ["@radix-ui/react-slot@1.2.3", "", { "dependencies": { "@radix-ui/react-compose-refs": "1.1.2" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-aeNmHnBxbi2St0au6VBVC7JXFlhLlOnvIIlePNniyUNAClzmtAUEY8/pBiK3iHjufOlwA+c20/8jngo7xcrg8A=="],
    "@radix-ui/react-switch": ["@radix-ui/react-switch@1.2.6", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-previous": "1.1.1", "@radix-ui/react-use-size": "1.1.1" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-bByzr1+ep1zk4VubeEVViV592vu2lHE2BZY5OnzehZqOOgogN80+mNtCqPkhn2gklJqOpxWgPoYTSnhBCqpOXQ=="],
    "@radix-ui/react-tabs": ["@radix-ui/react-tabs@1.1.13", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-7xdcatg7/U+7+Udyoj2zodtI9H/IIopqo+YOIcZOq1nJwXWBZ9p8xiu5llXlekDbZkca79a/fozEYQXIA4sW6A=="],
    "@radix-ui/react-toast": ["@radix-ui/react-toast@1.2.15", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-layout-effect": "1.1.1", "@radix-ui/react-visually-hidden": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-3OSz3TacUWy4WtOXV38DggwxoqJK4+eDkNMl5Z/MJZaoUPaP4/9lf81xXMe1I2ReTAptverZUpbPY4wWwWyL5g=="],
    "@radix-ui/react-toggle": ["@radix-ui/react-toggle@1.1.10", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-lS1odchhFTeZv3xwHH31YPObmJn8gOg7Lq12inrr0+BH/l3Tsq32VfjqH1oh80ARM3mlkfMic15n0kg4sD1poQ=="],
    "@radix-ui/react-toggle-group": ["@radix-ui/react-toggle-group@1.1.11", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-toggle": "1.1.10", "@radix-ui/react-use-controllable-state": "1.2.2" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-5umnS0T8JQzQT6HbPyO7Hh9dgd82NmS36DQr+X/YJ9ctFNCiiQd6IJAYYZ33LUwm8M+taCz5t2ui29fHZc4Y6Q=="],
    "@radix-ui/react-toolbar": ["@radix-ui/react-toolbar@1.1.11", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-separator": "1.1.7", "@radix-ui/react-toggle-group": "1.1.11" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-4ol06/1bLoFu1nwUqzdD4Y5RZ9oDdKeiHIsntug54Hcr1pgaHiPqHFEaXI1IFP/EsOfROQZ8Mig9VTIRza6Tjg=="],
    "@radix-ui/react-tooltip": ["@radix-ui/react-tooltip@1.2.8", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-id": "1.1.1", "@radix-ui/react-popper": "1.2.8", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-slot": "1.2.3", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-visually-hidden": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-tY7sVt1yL9ozIxvmbtN5qtmH2krXcBCfjEiCgKGLqunJHvgvZG2Pcl2oQ3kbcZARb1BGEHdkLzcYGO8ynVlieg=="],
    "@radix-ui/react-use-callback-ref": ["@radix-ui/react-use-callback-ref@1.1.1", "", { "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-FkBMwD+qbGQeMu1cOHnuGB6x4yzPjho8ap5WtbEJ26umhgqVXbhekKUQO+hZEL1vU92a3wHwdp0HAcqAUF5iDg=="],
    "@radix-ui/react-use-controllable-state": ["@radix-ui/react-use-controllable-state@1.2.2", "", { "dependencies": { "@radix-ui/react-use-effect-event": "0.0.2", "@radix-ui/react-use-layout-effect": "1.1.1" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-BjasUjixPFdS+NKkypcyyN5Pmg83Olst0+c6vGov0diwTEo6mgdqVR6hxcEgFuh4QrAs7Rc+9KuGJ9TVCj0Zzg=="],
@@ -344,14 +411,22 @@
    "@radix-ui/react-use-escape-keydown": ["@radix-ui/react-use-escape-keydown@1.1.1", "", { "dependencies": { "@radix-ui/react-use-callback-ref": "1.1.1" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-Il0+boE7w/XebUHyBjroE+DbByORGR9KKmITzbR7MyQ4akpORYP/ZmbhAr0DG7RmmBqoOnZdy2QlvajJ2QA59g=="],
    "@radix-ui/react-use-is-hydrated": ["@radix-ui/react-use-is-hydrated@0.1.0", "", { "dependencies": { "use-sync-external-store": "^1.5.0" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-U+UORVEq+cTnRIaostJv9AGdV3G6Y+zbVd+12e18jQ5A3c0xL03IhnHuiU4UV69wolOQp5GfR58NW/EgdQhwOA=="],
    "@radix-ui/react-use-layout-effect": ["@radix-ui/react-use-layout-effect@1.1.1", "", { "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-RbJRS4UWQFkzHTTwVymMTUv8EqYhOp8dOOviLj2ugtTiXRaRQS7GLGxZTLL1jWhMeoSCf5zmcZkqTl9IiYfXcQ=="],
    "@radix-ui/react-use-previous": ["@radix-ui/react-use-previous@1.1.1", "", { "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-2dHfToCj/pzca2Ck724OZ5L0EVrr3eHRNsG/b3xQJLA2hZpVCS99bLAX+hm1IHXDEnzU6by5z/5MIY794/a8NQ=="],
    "@radix-ui/react-use-rect": ["@radix-ui/react-use-rect@1.1.1", "", { "dependencies": { "@radix-ui/rect": "1.1.1" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-QTYuDesS0VtuHNNvMh+CjlKJ4LJickCMUAqjlE3+j8w+RlRpwyX3apEQKGFzbZGdo7XNG1tXa+bQqIE7HIXT2w=="],
    "@radix-ui/react-use-size": ["@radix-ui/react-use-size@1.1.1", "", { "dependencies": { "@radix-ui/react-use-layout-effect": "1.1.1" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-ewrXRDTAqAXlkl6t/fkXWNAhFX9I+CkKlw6zjEwk86RSPKwZr3xpBRso655aqYafwtnbpHLj6toFzmd6xdVptQ=="],
    "@radix-ui/react-visually-hidden": ["@radix-ui/react-visually-hidden@1.2.3", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-pzJq12tEaaIhqjbzpCuv/OypJY/BPavOofm+dbab+MHLajy277+1lLm6JFcGgF5eskJ6mquGirhXY2GD/8u8Ug=="],
    "@radix-ui/rect": ["@radix-ui/rect@1.1.1", "", {}, "sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw=="],
    "@radix-ui/themes": ["@radix-ui/themes@3.2.1", "", { "dependencies": { "@radix-ui/colors": "^3.0.0", "classnames": "^2.3.2", "radix-ui": "^1.1.3", "react-remove-scroll-bar": "^2.3.8" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-WJL2YKAGItkunwm3O4cLTFKCGJTfAfF6Hmq7f5bCo1ggqC9qJQ/wfg/25AAN72aoEM1yqXZQ+pslsw48AFR0Xg=="],
    "@react-aria/autocomplete": ["@react-aria/autocomplete@3.0.0-rc.4", "", { "dependencies": { "@react-aria/combobox": "^3.14.1", "@react-aria/focus": "^3.21.3", "@react-aria/i18n": "^3.12.14", "@react-aria/interactions": "^3.26.0", "@react-aria/listbox": "^3.15.1", "@react-aria/searchfield": "^3.8.10", "@react-aria/textfield": "^3.18.3", "@react-aria/utils": "^3.32.0", "@react-stately/autocomplete": "3.0.0-beta.4", "@react-stately/combobox": "^3.12.1", "@react-types/autocomplete": "3.0.0-alpha.36", "@react-types/button": "^3.14.1", "@react-types/shared": "^3.32.1", "@swc/helpers": "^0.5.0" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1", "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1" } }, "sha512-4bMMVNaCuYDZX9HM4ZNSAImZMcL/orwhLLe818+lyzmSrvGmW9h433PZxTolb0d+FnJVfn1MDY0zEWLiyI86GA=="],
    "@react-aria/breadcrumbs": ["@react-aria/breadcrumbs@3.5.30", "", { "dependencies": { "@react-aria/i18n": "^3.12.14", "@react-aria/link": "^3.8.7", "@react-aria/utils": "^3.32.0", "@react-types/breadcrumbs": "^3.7.17", "@react-types/shared": "^3.32.1", "@swc/helpers": "^0.5.0" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1", "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1" } }, "sha512-DZymglA70SwvDJA7GB147sUexvdDy6vWcriGrlEHhMMzBLhGB30I5J96R4pPzURLxXISrWFH56KC5rRgIqsqqg=="],
@@ -574,12 +649,14 @@
    "@redocly/openapi-core": ["@redocly/openapi-core@1.34.6", "", { "dependencies": { "@redocly/ajv": "^8.11.2", "@redocly/config": "^0.22.0", "colorette": "^1.2.0", "https-proxy-agent": "^7.0.5", "js-levenshtein": "^1.1.6", "js-yaml": "^4.1.0", "minimatch": "^5.0.1", "pluralize": "^8.0.0", "yaml-ast-parser": "0.0.43" } }, "sha512-2+O+riuIUgVSuLl3Lyh5AplWZyVMNuG2F98/o6NrutKJfW4/GTZdPpZlIphS0HGgcOHgmWcCSHj+dWFlZaGSHw=="],
-    "@restart/hooks": ["@restart/hooks@0.4.16", "", { "dependencies": { "dequal": "^2.0.3" }, "peerDependencies": { "react": ">=16.8.0" } }, "sha512-f7aCv7c+nU/3mF7NWLtVVr0Ra80RqsO89hO72r+Y/nvQr5+q0UFGkocElTH6MJApvReVh6JHUFYn2cw1WdHF3w=="],
+    "@reduxjs/toolkit": ["@reduxjs/toolkit@2.11.2", "", { "dependencies": { "@standard-schema/spec": "^1.0.0", "@standard-schema/utils": "^0.3.0", "immer": "^11.0.0", "redux": "^5.0.1", "redux-thunk": "^3.1.0", "reselect": "^5.1.0" }, "peerDependencies": { "react": "^16.9.0 || ^17.0.0 || ^18 || ^19", "react-redux": "^7.2.1 || ^8.1.3 || ^9.0.0" }, "optionalPeers": ["react", "react-redux"] }, "sha512-Kd6kAHTA6/nUpp8mySPqj3en3dm0tdMIgbttnQ1xFMVpufoj+ADi8pXLBsd4xzTRHQa7t/Jv8W5UnCuW4kuWMQ=="],
    "@restart/ui": ["@restart/ui@1.9.4", "", { "dependencies": { "@babel/runtime": "^7.26.0", "@popperjs/core": "^2.11.8", "@react-aria/ssr": "^3.5.0", "@restart/hooks": "^0.5.0", "@types/warning": "^3.0.3", "dequal": "^2.0.3", "dom-helpers": "^5.2.0", "uncontrollable": "^8.0.4", "warning": "^4.0.3" }, "peerDependencies": { "react": ">=16.14.0", "react-dom": ">=16.14.0" } }, "sha512-N4C7haUc3vn4LTwVUPlkJN8Ach/+yIMvRuTVIhjilNHqegY60SGLrzud6errOMNJwSnmYFnt1J0H/k8FE3A4KA=="],
    "@rtsao/scc": ["@rtsao/scc@1.1.0", "", {}, "sha512-zt6OdqaDoOnJ1ZYsCYGt9YmWzDXl4vQdKTyJev62gFhRGKdx7mcT54V9KIjg+d2wi9EXsPvAPKe7i7WjfVWB8g=="],
    "@standard-schema/spec": ["@standard-schema/spec@1.1.0", "", {}, "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w=="],
    "@standard-schema/utils": ["@standard-schema/utils@0.3.0", "", {}, "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g=="],
    "@svgr/babel-plugin-add-jsx-attribute": ["@svgr/babel-plugin-add-jsx-attribute@8.0.0", "", { "peerDependencies": { "@babel/core": "^7.0.0-0" } }, "sha512-b9MIk7yhdS1pMCZM8VeNfUlSKVRhsHZNMl5O9SfaX0l0t5wjdgu4IDzGB8bpnGBBOjGST3rRFVsaaEtI4W6f7g=="],
    "@svgr/babel-plugin-remove-jsx-attribute": ["@svgr/babel-plugin-remove-jsx-attribute@8.0.0", "", { "peerDependencies": { "@babel/core": "^7.0.0-0" } }, "sha512-BcCkm/STipKvbCl6b7QFrMh/vx00vIP63k2eM66MfHJzPr6O2U0jYEViXkHJWqXqQYjdeA9cuCl5KWmlwjDvbA=="],
@@ -644,15 +721,11 @@
    "@types/node": ["@types/node@25.0.3", "", { "dependencies": { "undici-types": "~7.16.0" } }, "sha512-W609buLVRVmeW693xKfzHeIV6nJGGz98uCPfeXI1ELMLXVeKYZ9m15fAMSaUPBHYLGFsVRcMmSCksQOrZV9BYA=="],
    "@types/prop-types": ["@types/prop-types@15.7.15", "", {}, "sha512-F6bEyamV9jKGAFBEmlQnesRPGOQqS2+Uwi0Em15xenOxHaf2hv6L8YCVn3rPdPJOiJfPiCnLIRyvwVaqMY3MIw=="],
    "@types/react": ["@types/react@19.2.7", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-MWtvHrGZLFttgeEj28VXHxpmwYbor/ATPYbBfSFZEIRK0ecCFLl2Qo55z52Hss+UV9CRN7trSeq1zbgx7YDWWg=="],
    "@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="],
-    "@types/react-transition-group": ["@types/react-transition-group@4.4.12", "", { "peerDependencies": { "@types/react": "*" } }, "sha512-8TV6R3h2j7a91c+1DXdJi3Syo69zzIZbz7Lg5tORM5LEJG7X/E6a1V3drRyBRZq7/utz7A+c4OgYLiLcYGHG6w=="],
+    "@types/use-sync-external-store": ["@types/use-sync-external-store@0.0.6", "", {}, "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg=="],
    "@types/warning": ["@types/warning@3.0.3", "", {}, "sha512-D1XC7WK8K+zZEveUPY+cf4+kgauk8N4eHr/XIHXGlGYkHLud6hK9lYfZk1ry1TNh798cZUCgb6MqGEG8DkJt6Q=="],
    "@typescript-eslint/eslint-plugin": ["@typescript-eslint/eslint-plugin@8.50.1", "", { "dependencies": { "@eslint-community/regexpp": "^4.10.0", "@typescript-eslint/scope-manager": "8.50.1", "@typescript-eslint/type-utils": "8.50.1", "@typescript-eslint/utils": "8.50.1", "@typescript-eslint/visitor-keys": "8.50.1", "ignore": "^7.0.0", "natural-compare": "^1.4.0", "ts-api-utils": "^2.1.0" }, "peerDependencies": { "@typescript-eslint/parser": "^8.50.1", "eslint": "^8.57.0 || ^9.0.0", "typescript": ">=4.8.4 <6.0.0" } }, "sha512-PKhLGDq3JAg0Jk/aK890knnqduuI/Qj+udH7wCf0217IGi4gt+acgCyPVe79qoT+qKUvHMDQkwJeKW9fwl8Cyw=="],
@@ -778,8 +851,6 @@
    "boolbase": ["boolbase@1.0.0", "", {}, "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww=="],
    "bootstrap": ["bootstrap@5.3.8", "", { "peerDependencies": { "@popperjs/core": "^2.11.8" } }, "sha512-HP1SZDqaLDPwsNiqRqi5NcP0SSXciX2s9E+RyqJIIqGo+vJeN5AJVM98CXmW/Wux0nQ5L7jeWUdplCEf0Ee+tg=="],
    "brace-expansion": ["brace-expansion@1.1.12", "", { "dependencies": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" } }, "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg=="],
    "braces": ["braces@3.0.3", "", { "dependencies": { "fill-range": "^7.1.1" } }, "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA=="],
@@ -878,8 +949,6 @@
    "delayed-stream": ["delayed-stream@1.0.0", "", {}, "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ=="],
    "dequal": ["dequal@2.0.3", "", {}, "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA=="],
    "detect-libc": ["detect-libc@1.0.3", "", { "bin": { "detect-libc": "./bin/detect-libc.js" } }, "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg=="],
    "detect-node-es": ["detect-node-es@1.1.0", "", {}, "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ=="],
@@ -890,8 +959,6 @@
    "doctrine": ["doctrine@2.1.0", "", { "dependencies": { "esutils": "^2.0.2" } }, "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw=="],
    "dom-helpers": ["dom-helpers@5.2.1", "", { "dependencies": { "@babel/runtime": "^7.8.7", "csstype": "^3.0.2" } }, "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA=="],
    "dom-serializer": ["dom-serializer@2.0.0", "", { "dependencies": { "domelementtype": "^2.3.0", "domhandler": "^5.0.2", "entities": "^4.2.0" } }, "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg=="],
    "domelementtype": ["domelementtype@2.3.0", "", {}, "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw=="],
@@ -1080,6 +1147,8 @@
    "ignore": ["ignore@5.3.2", "", {}, "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g=="],
    "immer": ["immer@11.1.3", "", {}, "sha512-6jQTc5z0KJFtr1UgFpIL3N9XSC3saRaI9PwWtzM2pSqkNGtiNkYY2OSwkOGDK2XcTRcLb1pi/aNkKZz0nxVH4Q=="],
    "immutable": ["immutable@5.1.4", "", {}, "sha512-p6u1bG3YSnINT5RQmx/yRZBpenIl30kVxkTLDyHLIMk0gict704Q9n+thfDI7lTRm9vXdDYutVzXhzcThxTnXA=="],
    "import-fresh": ["import-fresh@3.3.1", "", { "dependencies": { "parent-module": "^1.0.0", "resolve-from": "^4.0.0" } }, "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ=="],
@@ -1098,8 +1167,6 @@
    "intl-messageformat": ["intl-messageformat@10.7.18", "", { "dependencies": { "@formatjs/ecma402-abstract": "2.3.6", "@formatjs/fast-memoize": "2.2.7", "@formatjs/icu-messageformat-parser": "2.11.4", "tslib": "^2.8.0" } }, "sha512-m3Ofv/X/tV8Y3tHXLohcuVuhWKo7BBq62cqY15etqmLxg2DZ34AGGgQDeR+SCta2+zICb1NX83af0GJmbQ1++g=="],
    "invariant": ["invariant@2.2.4", "", { "dependencies": { "loose-envify": "^1.0.0" } }, "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA=="],
    "is-array-buffer": ["is-array-buffer@3.0.5", "", { "dependencies": { "call-bind": "^1.0.8", "call-bound": "^1.0.3", "get-intrinsic": "^1.2.6" } }, "sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A=="],
    "is-arrayish": ["is-arrayish@0.2.1", "", {}, "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg=="],
@@ -1346,8 +1413,6 @@
    "prop-types": ["prop-types@15.8.1", "", { "dependencies": { "loose-envify": "^1.4.0", "object-assign": "^4.1.1", "react-is": "^16.13.1" } }, "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg=="],
    "prop-types-extra": ["prop-types-extra@1.1.1", "", { "dependencies": { "react-is": "^16.3.2", "warning": "^4.0.0" }, "peerDependencies": { "react": ">=0.14.0" } }, "sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew=="],
    "proxy-from-env": ["proxy-from-env@1.1.0", "", {}, "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="],
    "punycode": ["punycode@2.3.1", "", {}, "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg=="],
@@ -1356,14 +1421,14 @@
    "queue-microtask": ["queue-microtask@1.2.3", "", {}, "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A=="],
    "radix-ui": ["radix-ui@1.4.3", "", { "dependencies": { "@radix-ui/primitive": "1.1.3", "@radix-ui/react-accessible-icon": "1.1.7", "@radix-ui/react-accordion": "1.2.12", "@radix-ui/react-alert-dialog": "1.1.15", "@radix-ui/react-arrow": "1.1.7", "@radix-ui/react-aspect-ratio": "1.1.7", "@radix-ui/react-avatar": "1.1.10", "@radix-ui/react-checkbox": "1.3.3", "@radix-ui/react-collapsible": "1.1.12", "@radix-ui/react-collection": "1.1.7", "@radix-ui/react-compose-refs": "1.1.2", "@radix-ui/react-context": "1.1.2", "@radix-ui/react-context-menu": "2.2.16", "@radix-ui/react-dialog": "1.1.15", "@radix-ui/react-direction": "1.1.1", "@radix-ui/react-dismissable-layer": "1.1.11", "@radix-ui/react-dropdown-menu": "2.1.16", "@radix-ui/react-focus-guards": "1.1.3", "@radix-ui/react-focus-scope": "1.1.7", "@radix-ui/react-form": "0.1.8", "@radix-ui/react-hover-card": "1.1.15", "@radix-ui/react-label": "2.1.7", "@radix-ui/react-menu": "2.1.16", "@radix-ui/react-menubar": "1.1.16", "@radix-ui/react-navigation-menu": "1.2.14", "@radix-ui/react-one-time-password-field": "0.1.8", "@radix-ui/react-password-toggle-field": "0.1.3", "@radix-ui/react-popover": "1.1.15", "@radix-ui/react-popper": "1.2.8", "@radix-ui/react-portal": "1.1.9", "@radix-ui/react-presence": "1.1.5", "@radix-ui/react-primitive": "2.1.3", "@radix-ui/react-progress": "1.1.7", "@radix-ui/react-radio-group": "1.3.8", "@radix-ui/react-roving-focus": "1.1.11", "@radix-ui/react-scroll-area": "1.2.10", "@radix-ui/react-select": "2.2.6", "@radix-ui/react-separator": "1.1.7", "@radix-ui/react-slider": "1.3.6", "@radix-ui/react-slot": "1.2.3", "@radix-ui/react-switch": "1.2.6", "@radix-ui/react-tabs": "1.1.13", "@radix-ui/react-toast": "1.2.15", "@radix-ui/react-toggle": "1.1.10", "@radix-ui/react-toggle-group": "1.1.11", "@radix-ui/react-toolbar": "1.1.11", "@radix-ui/react-tooltip": "1.2.8", "@radix-ui/react-use-callback-ref": "1.1.1", "@radix-ui/react-use-controllable-state": "1.2.2", "@radix-ui/react-use-effect-event": "0.0.2", "@radix-ui/react-use-escape-keydown": "1.1.1", "@radix-ui/react-use-is-hydrated": "0.1.0", "@radix-ui/react-use-layout-effect": "1.1.1", "@radix-ui/react-use-size": "1.1.1", "@radix-ui/react-visually-hidden": "1.2.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-aWizCQiyeAenIdUbqEpXgRA1ya65P13NKn/W8rWkcN0OPkRDxdBVLWnIEDsS2RpwCK2nobI7oMUSmexzTDyAmA=="],
    "react": ["react@19.2.3", "", {}, "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA=="],
    "react-aria": ["react-aria@3.45.0", "", { "dependencies": { "@internationalized/string": "^3.2.7", "@react-aria/breadcrumbs": "^3.5.30", "@react-aria/button": "^3.14.3", "@react-aria/calendar": "^3.9.3", "@react-aria/checkbox": "^3.16.3", "@react-aria/color": "^3.1.3", "@react-aria/combobox": "^3.14.1", "@react-aria/datepicker": "^3.15.3", "@react-aria/dialog": "^3.5.32", "@react-aria/disclosure": "^3.1.1", "@react-aria/dnd": "^3.11.4", "@react-aria/focus": "^3.21.3", "@react-aria/gridlist": "^3.14.2", "@react-aria/i18n": "^3.12.14", "@react-aria/interactions": "^3.26.0", "@react-aria/label": "^3.7.23", "@react-aria/landmark": "^3.0.8", "@react-aria/link": "^3.8.7", "@react-aria/listbox": "^3.15.1", "@react-aria/menu": "^3.19.4", "@react-aria/meter": "^3.4.28", "@react-aria/numberfield": "^3.12.3", "@react-aria/overlays": "^3.31.0", "@react-aria/progress": "^3.4.28", "@react-aria/radio": "^3.12.3", "@react-aria/searchfield": "^3.8.10", "@react-aria/select": "^3.17.1", "@react-aria/selection": "^3.27.0", "@react-aria/separator": "^3.4.14", "@react-aria/slider": "^3.8.3", "@react-aria/ssr": "^3.9.10", "@react-aria/switch": "^3.7.9", "@react-aria/table": "^3.17.9", "@react-aria/tabs": "^3.10.9", "@react-aria/tag": "^3.7.3", "@react-aria/textfield": "^3.18.3", "@react-aria/toast": "^3.0.9", "@react-aria/tooltip": "^3.9.0", "@react-aria/tree": "^3.1.5", "@react-aria/utils": "^3.32.0", "@react-aria/visually-hidden": "^3.8.29", "@react-types/shared": "^3.32.1" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1", "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1" } }, "sha512-QsdWIhhm3+IAiW3SU9tEm7pmeIcveEPAO6riZ1IUF78ZCvH/47nU4zVztcdtYmwYWSL4168QxLncWKtlMva3BA=="],
    "react-aria-components": ["react-aria-components@1.14.0", "", { "dependencies": { "@internationalized/date": "^3.10.1", "@internationalized/string": "^3.2.7", "@react-aria/autocomplete": "3.0.0-rc.4", "@react-aria/collections": "^3.0.1", "@react-aria/dnd": "^3.11.4", "@react-aria/focus": "^3.21.3", "@react-aria/interactions": "^3.26.0", "@react-aria/live-announcer": "^3.4.4", "@react-aria/overlays": "^3.31.0", "@react-aria/ssr": "^3.9.10", "@react-aria/textfield": "^3.18.3", "@react-aria/toolbar": "3.0.0-beta.22", "@react-aria/utils": "^3.32.0", "@react-aria/virtualizer": "^4.1.11", "@react-stately/autocomplete": "3.0.0-beta.4", "@react-stately/layout": "^4.5.2", "@react-stately/selection": "^3.20.7", "@react-stately/table": "^3.15.2", "@react-stately/utils": "^3.11.0", "@react-stately/virtualizer": "^4.4.4", "@react-types/form": "^3.7.16", "@react-types/grid": "^3.3.6", "@react-types/shared": "^3.32.1", "@react-types/table": "^3.13.4", "@swc/helpers": "^0.5.0", "client-only": "^0.0.1", "react-aria": "^3.45.0", "react-stately": "^3.43.0", "use-sync-external-store": "^1.4.0" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1", "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1" } }, "sha512-u21N/yS6Ozk9P9oO8wxMNZSFiPk6F3aAE9w6aN7pseGPApkjXqDyPNCnTsTTvMtVL3QRBkVbf7fJ5yi2hksVEg=="],
    "react-bootstrap": ["react-bootstrap@2.10.10", "", { "dependencies": { "@babel/runtime": "^7.24.7", "@restart/hooks": "^0.4.9", "@restart/ui": "^1.9.4", "@types/prop-types": "^15.7.12", "@types/react-transition-group": "^4.4.6", "classnames": "^2.3.2", "dom-helpers": "^5.2.1", "invariant": "^2.2.4", "prop-types": "^15.8.1", "prop-types-extra": "^1.1.0", "react-transition-group": "^4.4.5", "uncontrollable": "^7.2.1", "warning": "^4.0.3" }, "peerDependencies": { "@types/react": ">=16.14.8", "react": ">=16.14.0", "react-dom": ">=16.14.0" }, "optionalPeers": ["@types/react"] }, "sha512-gMckKUqn8aK/vCnfwoBpBVFUGT9SVQxwsYrp9yDHt0arXMamxALerliKBxr1TPbntirK/HGrUAHYbAeQTa9GHQ=="],
    "react-dom": ["react-dom@19.2.3", "", { "dependencies": { "scheduler": "^0.27.0" }, "peerDependencies": { "react": "^19.2.3" } }, "sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg=="],
    "react-dropzone": ["react-dropzone@14.3.8", "", { "dependencies": { "attr-accept": "^2.2.4", "file-selector": "^2.1.0", "prop-types": "^15.8.1" }, "peerDependencies": { "react": ">= 16.8 || 18.0.0" } }, "sha512-sBgODnq+lcA4P296DY4wacOZz3JFpD99fp+hb//iBO2HHnyeZU3FwWyXJ6salNpqQdsZrgMrotuko/BdJMV8Ug=="],
@@ -1372,10 +1437,10 @@
    "react-is": ["react-is@16.13.1", "", {}, "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="],
    "react-lifecycles-compat": ["react-lifecycles-compat@3.0.4", "", {}, "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="],
    "react-modern-drawer": ["react-modern-drawer@1.4.0", "", { "peerDependencies": { "react": ">16.0.0" } }, "sha512-5OkcUstqUdd/CNW9+BvLkzm36R2G54RFXWF2mWCH13cUsz5SNo9aB9KzPRbJp2LEVfRL/u+MgikOWRe7/6wKEQ=="],
    "react-redux": ["react-redux@9.2.0", "", { "dependencies": { "@types/use-sync-external-store": "^0.0.6", "use-sync-external-store": "^1.4.0" }, "peerDependencies": { "@types/react": "^18.2.25 || ^19", "react": "^18.0 || ^19", "redux": "^5.0.0" }, "optionalPeers": ["@types/react", "redux"] }, "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g=="],
    "react-remove-scroll": ["react-remove-scroll@2.7.2", "", { "dependencies": { "react-remove-scroll-bar": "^2.3.7", "react-style-singleton": "^2.2.3", "tslib": "^2.1.0", "use-callback-ref": "^1.3.3", "use-sidecar": "^1.1.3" }, "peerDependencies": { "@types/react": "*", "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-Iqb9NjCCTt6Hf+vOdNIZGdTiH1QSqr27H/Ek9sv/a97gfueI/5h1s3yRi1nngzMUaOOToin5dI1dXKdXiF+u0Q=="],
    "react-remove-scroll-bar": ["react-remove-scroll-bar@2.3.8", "", { "dependencies": { "react-style-singleton": "^2.2.2", "tslib": "^2.0.0" }, "peerDependencies": { "@types/react": "*", "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" }, "optionalPeers": ["@types/react"] }, "sha512-9r+yi9+mgU33AKcj6IbT9oRCO78WriSj6t/cF8DWBZJ9aOGPOTEDvdUDz1FwKim7QXWwmHqtdHnRJfhAxEG46Q=="],
@@ -1386,10 +1451,12 @@
    "react-toastify": ["react-toastify@11.0.5", "", { "dependencies": { "clsx": "^2.1.1" }, "peerDependencies": { "react": "^18 || ^19", "react-dom": "^18 || ^19" } }, "sha512-EpqHBGvnSTtHYhCPLxML05NLY2ZX0JURbAdNYa6BUkk+amz4wbKBQvoKQAB0ardvSarUBuY4Q4s1sluAzZwkmA=="],
    "react-transition-group": ["react-transition-group@4.4.5", "", { "dependencies": { "@babel/runtime": "^7.5.5", "dom-helpers": "^5.0.1", "loose-envify": "^1.4.0", "prop-types": "^15.6.2" }, "peerDependencies": { "react": ">=16.6.0", "react-dom": ">=16.6.0" } }, "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g=="],
    "readdirp": ["readdirp@4.1.2", "", {}, "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg=="],
    "redux": ["redux@5.0.1", "", {}, "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w=="],
    "redux-thunk": ["redux-thunk@3.1.0", "", { "peerDependencies": { "redux": "^5.0.0" } }, "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw=="],
    "reflect.getprototypeof": ["reflect.getprototypeof@1.0.10", "", { "dependencies": { "call-bind": "^1.0.8", "define-properties": "^1.2.1", "es-abstract": "^1.23.9", "es-errors": "^1.3.0", "es-object-atoms": "^1.0.0", "get-intrinsic": "^1.2.7", "get-proto": "^1.0.1", "which-builtin-type": "^1.2.1" } }, "sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw=="],
    "regexp.prototype.flags": ["regexp.prototype.flags@1.5.4", "", { "dependencies": { "call-bind": "^1.0.8", "define-properties": "^1.2.1", "es-errors": "^1.3.0", "get-proto": "^1.0.1", "gopd": "^1.2.0", "set-function-name": "^2.0.2" } }, "sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA=="],
@@ -1398,6 +1465,8 @@
    "require-from-string": ["require-from-string@2.0.2", "", {}, "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="],
    "reselect": ["reselect@5.1.1", "", {}, "sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w=="],
    "resolve": ["resolve@1.22.11", "", { "dependencies": { "is-core-module": "^2.16.1", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" }, "bin": { "resolve": "bin/resolve" } }, "sha512-RfqAvLnMl313r7c9oclB1HhUEAezcpLjz95wFH4LVuhk9JF/r22qmVP9AMmOU4vMX7Q8pN8jwNg/CSpdFnMjTQ=="],
    "resolve-from": ["resolve-from@5.0.0", "", {}, "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw=="],
@@ -1550,8 +1619,6 @@
    "unbox-primitive": ["unbox-primitive@1.1.0", "", { "dependencies": { "call-bound": "^1.0.3", "has-bigints": "^1.0.2", "has-symbols": "^1.1.0", "which-boxed-primitive": "^1.1.1" } }, "sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw=="],
    "uncontrollable": ["uncontrollable@7.2.1", "", { "dependencies": { "@babel/runtime": "^7.6.3", "@types/react": ">=16.9.11", "invariant": "^2.2.4", "react-lifecycles-compat": "^3.0.4" }, "peerDependencies": { "react": ">=15.0.0" } }, "sha512-svtcfoTADIB0nT9nltgjujTi7BzVmwjZClOmskKu/E8FW9BXzg9os8OLr4f8Dlnk0rYWJIWr4wv9eKUXiQvQwQ=="],
    "undici-types": ["undici-types@7.16.0", "", {}, "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw=="],
    "unrs-resolver": ["unrs-resolver@1.11.1", "", { "dependencies": { "napi-postinstall": "^0.3.0" }, "optionalDependencies": { "@unrs/resolver-binding-android-arm-eabi": "1.11.1", "@unrs/resolver-binding-android-arm64": "1.11.1", "@unrs/resolver-binding-darwin-arm64": "1.11.1", "@unrs/resolver-binding-darwin-x64": "1.11.1", "@unrs/resolver-binding-freebsd-x64": "1.11.1", "@unrs/resolver-binding-linux-arm-gnueabihf": "1.11.1", "@unrs/resolver-binding-linux-arm-musleabihf": "1.11.1", "@unrs/resolver-binding-linux-arm64-gnu": "1.11.1", "@unrs/resolver-binding-linux-arm64-musl": "1.11.1", "@unrs/resolver-binding-linux-ppc64-gnu": "1.11.1", "@unrs/resolver-binding-linux-riscv64-gnu": "1.11.1", "@unrs/resolver-binding-linux-riscv64-musl": "1.11.1", "@unrs/resolver-binding-linux-s390x-gnu": "1.11.1", "@unrs/resolver-binding-linux-x64-gnu": "1.11.1", "@unrs/resolver-binding-linux-x64-musl": "1.11.1", "@unrs/resolver-binding-wasm32-wasi": "1.11.1", "@unrs/resolver-binding-win32-arm64-msvc": "1.11.1", "@unrs/resolver-binding-win32-ia32-msvc": "1.11.1", "@unrs/resolver-binding-win32-x64-msvc": "1.11.1" } }, "sha512-bSjt9pjaEBnNiGgc9rUiHGKv5l4/TGzDmYw3RhnkJGtLhbnnA/5qJj7x3dNDCRx/PJxu774LlH8lCOlB4hEfKg=="],
@@ -1574,8 +1641,6 @@
    "v8-compile-cache-lib": ["v8-compile-cache-lib@3.0.1", "", {}, "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg=="],
    "warning": ["warning@4.0.3", "", { "dependencies": { "loose-envify": "^1.0.0" } }, "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w=="],
    "which": ["which@2.0.2", "", { "dependencies": { "isexe": "^2.0.0" }, "bin": { "node-which": "./bin/node-which" } }, "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA=="],
    "which-boxed-primitive": ["which-boxed-primitive@1.1.1", "", { "dependencies": { "is-bigint": "^1.1.0", "is-boolean-object": "^1.2.1", "is-number-object": "^1.1.1", "is-string": "^1.1.1", "is-symbol": "^1.1.1" } }, "sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA=="],
@@ -1634,14 +1699,14 @@
    "@next/eslint-plugin-next/fast-glob": ["fast-glob@3.3.1", "", { "dependencies": { "@nodelib/fs.stat": "^2.0.2", "@nodelib/fs.walk": "^1.2.3", "glob-parent": "^5.1.2", "merge2": "^1.3.0", "micromatch": "^4.0.4" } }, "sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg=="],
    "@radix-ui/react-form/@radix-ui/react-label": ["@radix-ui/react-label@2.1.7", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-YT1GqPSL8kJn20djelMX7/cTRp/Y9w5IZHvfxQTVHrOqa2yMl7i/UfMqKRU5V7mEyKTrUVgJXhNQPVCG8PBLoQ=="],
    "@radix-ui/react-label/@radix-ui/react-primitive": ["@radix-ui/react-primitive@2.1.4", "", { "dependencies": { "@radix-ui/react-slot": "1.2.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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-9hQc4+GNVtJAIEPEqlYqW5RiYdrr8ea5XQ0ZOnD6fgru+83kqT15mq2OCcbe8KnjRZl5vF3ks69AKz3kh1jrhg=="],
    "@redocly/ajv/json-schema-traverse": ["json-schema-traverse@1.0.0", "", {}, "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="],
    "@redocly/openapi-core/minimatch": ["minimatch@5.1.6", "", { "dependencies": { "brace-expansion": "^2.0.1" } }, "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g=="],
    "@restart/ui/@restart/hooks": ["@restart/hooks@0.5.1", "", { "dependencies": { "dequal": "^2.0.3" }, "peerDependencies": { "react": ">=16.8.0" } }, "sha512-EMoH04NHS1pbn07iLTjIjgttuqb7qu4+/EyhAx27MHpoENcB2ZdSsLTNxmKD+WEPnZigo62Qc8zjGnNxoSE/5Q=="],
    "@restart/ui/uncontrollable": ["uncontrollable@8.0.4", "", { "peerDependencies": { "react": ">=16.14.0" } }, "sha512-ulRWYWHvscPFc0QQXvyJjY6LIXU56f0h8pQFvhxiKk5V1fcI8gp9Ht9leVAhrVjzqMw0BgjspBINx9r6oyJUvQ=="],
    "@svgr/core/cosmiconfig": ["cosmiconfig@8.3.6", "", { "dependencies": { "import-fresh": "^3.3.0", "js-yaml": "^4.1.0", "parse-json": "^5.2.0", "path-type": "^4.0.0" }, "peerDependencies": { "typescript": ">=4.9.5" }, "optionalPeers": ["typescript"] }, "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA=="],
    "@svgr/plugin-prettier/prettier": ["prettier@2.8.8", "", { "bin": { "prettier": "bin-prettier.js" } }, "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q=="],
@@ -1690,6 +1755,8 @@
    "openapi-typescript/supports-color": ["supports-color@10.2.2", "", {}, "sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g=="],
    "radix-ui/@radix-ui/react-label": ["@radix-ui/react-label@2.1.7", "", { "dependencies": { "@radix-ui/react-primitive": "2.1.3" }, "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" }, "optionalPeers": ["@types/react", "@types/react-dom"] }, "sha512-YT1GqPSL8kJn20djelMX7/cTRp/Y9w5IZHvfxQTVHrOqa2yMl7i/UfMqKRU5V7mEyKTrUVgJXhNQPVCG8PBLoQ=="],
    "sharp/detect-libc": ["detect-libc@2.1.2", "", {}, "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ=="],
    "string-width/emoji-regex": ["emoji-regex@8.0.0", "", {}, "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="],
@@ -1712,6 +1779,8 @@
    "@next/eslint-plugin-next/fast-glob/glob-parent": ["glob-parent@5.1.2", "", { "dependencies": { "is-glob": "^4.0.1" } }, "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow=="],
    "@radix-ui/react-label/@radix-ui/react-primitive/@radix-ui/react-slot": ["@radix-ui/react-slot@1.2.4", "", { "dependencies": { "@radix-ui/react-compose-refs": "1.1.2" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-Jl+bCv8HxKnlTLVrcDE8zTMJ09R9/ukw4qBs/oZClOfoQk/cOTbDn+NceXfV7j09YPVQUryJPHurafcSg6EVKA=="],
    "@redocly/openapi-core/minimatch/brace-expansion": ["brace-expansion@2.0.2", "", { "dependencies": { "balanced-match": "^1.0.0" } }, "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ=="],
    "@svgr/core/cosmiconfig/parse-json": ["parse-json@5.2.0", "", { "dependencies": { "@babel/code-frame": "^7.0.0", "error-ex": "^1.3.1", "json-parse-even-better-errors": "^2.3.0", "lines-and-columns": "^1.1.6" } }, "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg=="],
@@ -14,11 +14,18 @@
 		"gen:api-types": "openapi-typescript http://127.0.0.1:8000/api/schema/ --output src/shared/api/__generated__/openapi.types.ts"
 	},
 	"dependencies": {
 		"@radix-ui/react-checkbox": "^1.3.3",
 		"@radix-ui/react-dialog": "^1.1.15",
 		"@radix-ui/react-dropdown-menu": "^2.1.16",
 		"@radix-ui/react-label": "^2.1.8",
 		"@radix-ui/react-radio-group": "^1.3.8",
 		"@radix-ui/react-select": "^2.2.6",
 		"@radix-ui/react-tabs": "^1.1.13",
 		"@radix-ui/themes": "^3.2.1",
 		"@reduxjs/toolkit": "^2.11.2",
 		"@tanstack/react-query": "^5.90.14",
 		"@tanstack/react-query-devtools": "^5.91.2",
 		"axios": "^1.13.2",
 		"bootstrap": "^5.3.8",
 		"classnames": "^2.5.1",
 		"framer-motion": "^12.23.26",
 		"js-cookie": "^3.0.5",
@@ -31,11 +38,11 @@
 		"openapi-react-query": "^0.5.1",
 		"react": "^19.2.3",
 		"react-aria-components": "^1.14.0",
 		"react-bootstrap": "^2.10.10",
 		"react-dom": "^19.2.3",
 		"react-dropzone": "^14.3.8",
 		"react-hook-form": "^7.71.0",
 		"react-modern-drawer": "^1.4.0",
 		"react-redux": "^9.2.0",
 		"react-toastify": "^11.0.5",
 		"use-mask-input": "^3.6.0",
 		"usehooks-ts": "^3.1.1",
@@ -0,0 +1,338 @@
 <!DOCTYPE html>
 <html class="light" lang="en">
 <head>
  <meta charset="utf-8" />
  <meta content="width=device-width, initial-scale=1.0" name="viewport" />
  <title>Video Projects Dashboard</title>
  <!-- Google Fonts: Spline Sans -->
  <link href="https://fonts.googleapis.com" rel="preconnect" />
  <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect" />
  <link href="https://fonts.googleapis.com/css2?family=Spline+Sans:wght@300;400;500;600;700&amp;display=swap"
    rel="stylesheet" />
  <!-- Material Symbols -->
  <link
    href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap"
    rel="stylesheet" />
  <link
    href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap"
    rel="stylesheet" />
  <!-- Tailwind CSS with Plugins -->
  <script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
  <!-- Tailwind Config -->
  <script id="tailwind-config">
    tailwind.config = {
      darkMode: "class",
      theme: {
        extend: {
          colors: {
            "primary": "#b722bf",
            "secondary": "#166534", /* green-800 as requested for success states */
            "background-light": "#fbf8fc", /* Tinted white */
            "background-dark": "#1f1220",
          },
          fontFamily: {
            "display": ["Spline Sans", "sans-serif"],
            "sans": ["Spline Sans", "sans-serif"]
          },
          borderRadius: {
            "DEFAULT": "0.375rem", /* rounded-md */
            "md": "0.375rem",
            "lg": "0.5rem",
            "xl": "0.75rem",
            "full": "9999px"
          },
        },
      },
    }
  </script>
  <style>
    body {
      font-family: "Spline Sans", sans-serif;
    }
    /* Custom scrollbar for modern feel */
    ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }
    ::-webkit-scrollbar-track {
      background: transparent;
    }
    ::-webkit-scrollbar-thumb {
      background: #e5e7eb;
      border-radius: 4px;
    }
    ::-webkit-scrollbar-thumb:hover {
      background: #d1d5db;
    }
  </style>
 </head>
 <body class="bg-background-light dark:bg-background-dark min-h-screen text-[#171217] dark:text-white">
  <div class="flex flex-col min-h-screen">
    <!-- Header Section -->
    <header
      class="sticky top-0 z-50 bg-white/80 dark:bg-[#1f1220]/80 backdrop-blur-md border-b border-gray-100 dark:border-white/10 px-6 py-3">
      <div class="max-w-7xl mx-auto flex items-center justify-between">
        <!-- Left: Drawer Toggle + Branding -->
        <div class="flex items-center gap-6">
          <button
            class="p-2 rounded-md hover:bg-gray-100 dark:hover:bg-white/10 text-gray-600 dark:text-gray-300 transition-colors">
            <span class="material-symbols-outlined">menu</span>
          </button>
          <div class="flex items-center gap-3">
            <div class="size-8 bg-primary/10 rounded-md flex items-center justify-center text-primary">
              <span class="material-symbols-outlined text-[20px]">movie_edit</span>
            </div>
            <div class="flex items-baseline gap-2">
              <h1 class="text-lg font-bold tracking-tight">VideoMaker AI</h1>
              <span class="text-gray-400 dark:text-gray-600 text-sm">/</span>
              <span class="text-gray-500 dark:text-gray-400 font-medium">Projects</span>
            </div>
          </div>
        </div>
        <!-- Right: Profile -->
        <div class="flex items-center gap-4">
          <button
            class="flex items-center gap-3 pl-1 pr-2 py-1 rounded-full hover:bg-gray-50 dark:hover:bg-white/5 transition-colors border border-transparent hover:border-gray-100 dark:hover:border-white/10">
            <div class="size-8 rounded-full bg-cover bg-center border border-gray-200 dark:border-white/10"
              data-alt="User avatar image showing a smiling person"
              style="background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuCG63w6W0fAjE2QetrYIuBmnDjHDN8v-c1NGJrPcIzwpHhsQrmqC2zVPxyB7ek0j5CoROV0FK95b5LVA3i5MluzVtcel10s3nAl4Jv180_5QYBnbD4yb_suwfVTTkZFNMYn01dJO6sIwR1FEmfbMfebnk5K6LXumbKoo6SxL-tug38Nq59rd5voqQhGGt2eI6We-_51l7njgws_Z-sJYEdmaq_B7e8_GmUWYHfpXBjbSftbQDo_cg5oLPiAfEtot_LJe7XABHsWMFP_');">
            </div>
            <span class="text-sm font-medium hidden sm:block">Alex Editor</span>
            <span class="material-symbols-outlined text-gray-400 text-[20px]">expand_more</span>
          </button>
        </div>
      </div>
    </header>
    <!-- Main Content Area -->
    <main class="flex-1 w-full max-w-7xl mx-auto px-6 py-8">
      <!-- Toolbar: Breadcrumbs & Action Button -->
      <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4 mb-8">
        <div>
          <h2 class="text-3xl font-bold tracking-tight mb-1">My Projects</h2>
          <p class="text-gray-500 dark:text-gray-400 text-sm">Manage and edit your latest video creations.</p>
        </div>
        <button
          class="flex items-center justify-center gap-2 bg-primary hover:bg-primary/90 text-white px-5 py-2.5 rounded-md shadow-md shadow-primary/20 transition-all active:scale-95 font-medium">
          <span class="material-symbols-outlined text-[20px]">add</span>
          <span>New Project</span>
        </button>
      </div>
      <!-- Filters / Search (Optional but good for dashboards) -->
      <div class="flex items-center gap-4 mb-6 overflow-x-auto pb-2">
        <div class="relative group">
          <span
            class="material-symbols-outlined absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 group-focus-within:text-primary transition-colors text-[20px]">search</span>
          <input
            class="pl-10 pr-4 py-2 bg-white dark:bg-white/5 border border-gray-200 dark:border-white/10 rounded-md text-sm focus:outline-none focus:ring-2 focus:ring-primary/50 w-64 transition-all"
            placeholder="Search projects..." type="text" />
        </div>
        <div class="h-6 w-px bg-gray-200 dark:bg-white/10"></div>
        <button
          class="px-3 py-1.5 text-sm font-medium text-primary bg-primary/10 rounded-md border border-primary/20">All</button>
        <button
          class="px-3 py-1.5 text-sm font-medium text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-white/5 rounded-md transition-colors">Processing</button>
        <button
          class="px-3 py-1.5 text-sm font-medium text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-white/5 rounded-md transition-colors">Completed</button>
      </div>
      <!-- Projects Grid -->
      <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
        <!-- Card 1: Completed -->
        <article
          class="group relative flex flex-col bg-white dark:bg-[#2a1d2b] rounded-md shadow-sm border border-gray-100 dark:border-white/5 hover:shadow-md hover:-translate-y-1 transition-all duration-300">
          <!-- Image Container -->
          <div class="relative w-full aspect-video rounded-t-md overflow-hidden bg-gray-100">
            <div class="absolute inset-0 bg-cover bg-center transition-transform duration-500 group-hover:scale-105"
              data-alt="Microphone in a recording studio setup"
              style="background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuCrsNsYlZ4iyOqSvJFpinZX7WhTDlLimzJdfFd1erK6v1QOZHlroofe0kTN9yquQ2CwZRmIbHUQ3gecVBYL9Schtg6EQ_R5f5d_SsRerP02RzBT8vEGXu-BMA3LDmb1stZyvh9pKuBr_f3znfV_AQUgRHP70NxF82b0nlBqcdXUekCFhhGyzDi8a51Y15vJ4ApL2Rk0ld65N31qsyLgyP2P-Soe4rigskM6XGNXGQmU7pL0VCwIzCz5NaXB3o2Fjn6Rn5Rghjw3kqlu');">
            </div>
            <!-- Overlay -->
            <div
              class="absolute inset-0 bg-black/40 flex flex-col items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300 backdrop-blur-[2px]">
              <button
                class="bg-white/20 hover:bg-white/30 text-white rounded-full p-3 backdrop-blur-md transition-colors">
                <span class="material-symbols-outlined text-[32px]">play_arrow</span>
              </button>
            </div>
            <!-- Completed Badge (Success Green) -->
            <div class="absolute top-3 right-3">
              <span
                class="inline-flex items-center gap-1 px-2 py-1 rounded text-xs font-bold bg-secondary text-white shadow-sm">
                <span class="material-symbols-outlined text-[14px]">check_circle</span>
                Done
              </span>
            </div>
            <!-- Progress Ring (Hidden when done or show full circle) -->
            <div class="absolute bottom-3 right-3 size-10">
              <svg class="transform -rotate-90 size-full" viewbox="0 0 36 36">
                <path class="text-white/30"
                  d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none"
                  stroke="currentColor" stroke-width="3"></path>
                <path class="text-secondary drop-shadow-md"
                  d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none"
                  stroke="currentColor" stroke-dasharray="100, 100" stroke-width="3"></path>
              </svg>
              <div
                class="absolute inset-0 flex items-center justify-center text-[10px] font-bold text-white drop-shadow-md">
                100%</div>
            </div>
          </div>
          <!-- Content -->
          <div class="flex flex-col p-4 gap-2">
            <div class="flex justify-between items-start">
              <h3
                class="font-bold text-lg leading-tight text-gray-900 dark:text-white group-hover:text-primary transition-colors cursor-pointer truncate pr-4">
                Podcast Episode #42</h3>
              <button class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200">
                <span class="material-symbols-outlined text-[20px]">more_vert</span>
              </button>
            </div>
            <div class="flex items-center justify-between text-sm text-gray-500 dark:text-gray-400">
              <span>2 hours ago</span>
              <span class="text-secondary font-medium">Completed</span>
            </div>
          </div>
        </article>
        <!-- Card 2: Rendering (Primary Purple) -->
        <article
          class="group relative flex flex-col bg-white dark:bg-[#2a1d2b] rounded-md shadow-sm border border-gray-100 dark:border-white/5 hover:shadow-md hover:-translate-y-1 transition-all duration-300">
          <div class="relative w-full aspect-video rounded-t-md overflow-hidden bg-gray-100">
            <div class="absolute inset-0 bg-cover bg-center transition-transform duration-500 group-hover:scale-105"
              data-alt="Modern tech gadgets on a desk workspace"
              style="background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuA6mk-AZUlwKY3w-zyUKaNTnRbC_fS4uMN3NfT_p-sv3jhm7YXtkMla96gr6MhO0OIVjZhWG3NRQx79sjJUL8NEJ0hTcgKPz_W5hoHNkUqA9y3Z2atVRmGybfchL_2SC77bwdCkQ4CykhTRDN95rmNpiJAxOanEE5f0BeYmo9UfQNCEGbgctJ82FyW1C0oRTrEZMgR9WlNthfjHzYDCT5aQefG4TBNMPEiac1xs2iwuS4Hj5kAeQ-_BkekkV6gfOPrObkPrkVEJ32Uk');">
            </div>
            <!-- Active Overlay for processing -->
            <div class="absolute inset-0 bg-black/60 flex flex-col items-center justify-center backdrop-blur-sm">
              <div class="relative size-16">
                <svg class="transform -rotate-90 size-full" viewbox="0 0 36 36">
                  <path class="text-white/20"
                    d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none"
                    stroke="currentColor" stroke-width="3"></path>
                  <path
                    class="text-primary drop-shadow-[0_0_10px_rgba(183,34,191,0.5)] animate-[dash_1.5s_ease-in-out_infinite]"
                    d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none"
                    stroke="currentColor" stroke-dasharray="45, 100" stroke-width="3"></path>
                </svg>
                <div class="absolute inset-0 flex items-center justify-center text-sm font-bold text-white">45%</div>
              </div>
              <span class="mt-2 text-xs font-bold text-white uppercase tracking-wider animate-pulse">Rendering...</span>
            </div>
          </div>
          <div class="flex flex-col p-4 gap-2">
            <div class="flex justify-between items-start">
              <h3
                class="font-bold text-lg leading-tight text-gray-900 dark:text-white group-hover:text-primary transition-colors cursor-pointer truncate pr-4">
                Tech Review V1</h3>
              <button class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200">
                <span class="material-symbols-outlined text-[20px]">more_vert</span>
              </button>
            </div>
            <div class="flex items-center justify-between text-sm text-gray-500 dark:text-gray-400">
              <span>5 mins ago</span>
              <span class="text-primary font-medium">Processing</span>
            </div>
          </div>
        </article>
        <!-- Card 3: Uploading (Primary Purple) -->
        <article
          class="group relative flex flex-col bg-white dark:bg-[#2a1d2b] rounded-md shadow-sm border border-gray-100 dark:border-white/5 hover:shadow-md hover:-translate-y-1 transition-all duration-300">
          <div class="relative w-full aspect-video rounded-t-md overflow-hidden bg-gray-100">
            <div class="absolute inset-0 bg-cover bg-center transition-transform duration-500 group-hover:scale-105"
              data-alt="Scenic landscape of mountains and road for travel vlog"
              style="background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuCxvRno9_6XsO32q3YVwUZF_JUczE5sO5QGTXFI80K_wjlPmm3X7QgenZ7LgeNfYwCm3DwVJmputd8PQOBR3uZIGdXAddULI4EVl35amZj1Ro3Q-e73hhfzCD7zFGvRGiCkMhk2FWhL785uBJzwuEWEzuVb_FSJhbuvJm1fEjcYJfnVuE8eE04I7SfwOBnqGh9BMDzGhHGsQ9R6pMW69pj2CwH3QQq5yGlktTLE7XrwE96Dfl6L3u-vX-UBhgS0IdzK-lOZSvlG61N2');">
            </div>
            <!-- Active Overlay for processing -->
            <div class="absolute inset-0 bg-black/60 flex flex-col items-center justify-center backdrop-blur-sm">
              <div class="relative size-16">
                <svg class="transform -rotate-90 size-full" viewbox="0 0 36 36">
                  <path class="text-white/20"
                    d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none"
                    stroke="currentColor" stroke-width="3"></path>
                  <path class="text-primary drop-shadow-[0_0_10px_rgba(183,34,191,0.5)]"
                    d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none"
                    stroke="currentColor" stroke-dasharray="12, 100" stroke-width="3"></path>
                </svg>
                <div class="absolute inset-0 flex items-center justify-center text-sm font-bold text-white">12%</div>
              </div>
              <span class="mt-2 text-xs font-bold text-white uppercase tracking-wider">Uploading...</span>
            </div>
          </div>
          <div class="flex flex-col p-4 gap-2">
            <div class="flex justify-between items-start">
              <h3
                class="font-bold text-lg leading-tight text-gray-900 dark:text-white group-hover:text-primary transition-colors cursor-pointer truncate pr-4">
                Travel Vlog Intro</h3>
              <button class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200">
                <span class="material-symbols-outlined text-[20px]">more_vert</span>
              </button>
            </div>
            <div class="flex items-center justify-between text-sm text-gray-500 dark:text-gray-400">
              <span>1 day ago</span>
              <span class="text-primary font-medium">Uploading</span>
            </div>
          </div>
        </article>
        <!-- Card 4: Draft (Gray) -->
        <article
          class="group relative flex flex-col bg-white dark:bg-[#2a1d2b] rounded-md shadow-sm border border-gray-100 dark:border-white/5 hover:shadow-md hover:-translate-y-1 transition-all duration-300">
          <div class="relative w-full aspect-video rounded-t-md overflow-hidden bg-gray-100">
            <div
              class="absolute inset-0 bg-cover bg-center grayscale transition-all duration-500 group-hover:grayscale-0 group-hover:scale-105"
              data-alt="Modern office meeting room with glass walls"
              style="background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuCoijVEiEQ7I9dlbVSBMULIfmEPcWeRpzU-lbsnMwrOIfcEeLVja7-phtCDKxMzOWjS6M_ZfHrf5G4ELuq1Zx8MwIixQCnEdg5Bw2gT1g1Y5sLmUII0DHRrQj5bTfTbBx6Qpvn-_Dq0YvX9pzoMOOStawNO4pfFlELOYXjTipq5_IF2_7MMPXSpqgQElkA9UNBcv9dxuu5YE5I73Rg6eJ4Jyanbcc22EqFtvfOTO4fXnJupZ5rmjSK30hXm5r5a7IVRAvExsbGqRybE');">
            </div>
            <div class="absolute inset-0 bg-black/20 group-hover:bg-black/40 transition-colors duration-300">
              <!-- Play button appears on hover -->
              <div
                class="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300">
                <button class="bg-white/90 hover:bg-white text-primary rounded-full p-3 shadow-lg transition-colors">
                  <span class="material-symbols-outlined text-[32px]">edit</span>
                </button>
              </div>
            </div>
            <!-- Draft Badge -->
            <div class="absolute top-3 left-3">
              <span
                class="inline-flex items-center gap-1 px-2 py-1 rounded text-xs font-bold bg-gray-800/80 backdrop-blur-sm text-white shadow-sm border border-white/10">
                Draft
              </span>
            </div>
          </div>
          <div class="flex flex-col p-4 gap-2">
            <div class="flex justify-between items-start">
              <h3
                class="font-bold text-lg leading-tight text-gray-900 dark:text-white group-hover:text-primary transition-colors cursor-pointer truncate pr-4">
                Q3 Marketing Clip</h3>
              <button class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200">
                <span class="material-symbols-outlined text-[20px]">more_vert</span>
              </button>
            </div>
            <div class="flex items-center justify-between text-sm text-gray-500 dark:text-gray-400">
              <span>1 week ago</span>
              <span class="text-gray-500 font-medium">Draft</span>
            </div>
          </div>
        </article>
        <!-- Card 5: New Project Placeholder -->
        <article
          class="group relative flex flex-col items-center justify-center bg-gray-50 dark:bg-white/5 border-2 border-dashed border-gray-300 dark:border-white/10 rounded-md min-h-[280px] hover:border-primary hover:bg-primary/5 transition-all cursor-pointer">
          <div class="flex flex-col items-center gap-3 text-gray-400 group-hover:text-primary transition-colors">
            <div
              class="size-12 rounded-full bg-white dark:bg-white/10 shadow-sm flex items-center justify-center group-hover:scale-110 transition-transform">
              <span class="material-symbols-outlined text-[24px]">add</span>
            </div>
            <span class="font-bold text-lg">Create New</span>
          </div>
        </article>
      </div>
    </main>
  </div>
 </body>
 </html>
@@ -0,0 +1,26 @@
 "use client"
 import type { JSX, ReactNode } from "react"
 import { Theme } from "@radix-ui/themes"
 import { Provider as ReduxProvider } from "react-redux"
 import { store } from "@shared/store"
 import { QueryClientProvider } from "./QueryClientProvider"
 export const AppProviders = ({
 	children,
 }: {
 	children: ReactNode
 }): JSX.Element => {
 	return (
 		<ReduxProvider store={store}>
 			<QueryClientProvider>
 				<Theme accentColor="violet" grayColor="slate" radius="medium">
 					{children}
 				</Theme>
 			</QueryClientProvider>
 		</ReduxProvider>
 	)
 }
@@ -1,14 +1,15 @@
 "use client"
 import type { JSX, ReactNode } from "react"
 import { QueryClientProvider as QueryClientProviderTanstack } from "@tanstack/react-query"
 import { JSX, Suspense } from "react"
 import { queryClient } from "@shared/lib/query_client"
 export const QueryClientProvider = ({
 	children,
 }: {
-	children: React.ReactNode
+	children: ReactNode
 }): JSX.Element => {
 	return (
 		<QueryClientProviderTanstack client={queryClient}>
@@ -0,0 +1,5 @@
 import type { AppDispatch } from "@shared/store"
 import { useDispatch } from "react-redux"
 export const useAppDispatch = useDispatch.withTypes<AppDispatch>()
@@ -0,0 +1,5 @@
 import type { RootState } from "@shared/store"
 import { useSelector } from "react-redux"
 export const useAppSelector = useSelector.withTypes<RootState>()
@@ -0,0 +1,27 @@
 import type { PayloadAction } from "@reduxjs/toolkit"
 import { createSlice } from "@reduxjs/toolkit"
 export interface AppState {
 	currentScreenName: string
 }
 const initialState: AppState = {
 	currentScreenName: "",
 }
 const appStateSlice = createSlice({
 	name: "appState",
 	initialState,
 	reducers: {
 		setCurrentScreenName(state, action: PayloadAction<string>) {
 			state.currentScreenName = action.payload
 		},
 		resetAppState(state) {
 			state.currentScreenName = initialState.currentScreenName
 		},
 	},
 })
 export const { resetAppState, setCurrentScreenName } = appStateSlice.actions
 export const appStateReducer = appStateSlice.reducer
@@ -0,0 +1,14 @@
 import { configureStore } from "@reduxjs/toolkit"
 import { appStateReducer } from "./appStateStore"
 import { userReducer } from "./userStore"
 export const store = configureStore({
 	reducer: {
 		appState: appStateReducer,
 		user: userReducer,
 	},
 })
 export type RootState = ReturnType<typeof store.getState>
 export type AppDispatch = typeof store.dispatch
@@ -0,0 +1,38 @@
 import type { PayloadAction } from "@reduxjs/toolkit"
 import type { components } from "@shared/api/__generated__/openapi.types"
 import { createSlice } from "@reduxjs/toolkit"
 export type UserEntity = components["schemas"]["UserRead"]
 export interface UserState {
 	user: UserEntity | null
 }
 const initialState: UserState = {
 	user: null,
 }
 const userSlice = createSlice({
 	name: "user",
 	initialState,
 	reducers: {
 		setAuthData(
 			state,
 			action: PayloadAction<{
 				user: UserEntity
 			}>,
 		) {
 			state.user = action.payload.user
 		},
 		setUser(state, action: PayloadAction<UserEntity | null>) {
 			state.user = action.payload
 		},
 		reset(state) {
 			state.user = initialState.user
 		},
 	},
 })
 export const { reset: resetUser, setAuthData, setUser } = userSlice.actions
 export const userReducer = userSlice.reducer
@@ -1,37 +1,43 @@
-@mixin font-header-l {
+@mixin font-numeric {
 	font-variant-numeric: lining-nums proportional-nums;
 }
@mixin font-body-16($weight) {
 	font-weight: $weight;
 	font-size: 16px;
 	line-height: 22px;
 	letter-spacing: 0px;
 }
@mixin font-body-14($weight) {
 	font-weight: $weight;
 	font-size: 14px;
 	line-height: 20px;
 	letter-spacing: 0px;
 }
@mixin font-display {
 	@include font-numeric;
 	font-weight: 600;
 	font-size: 32px;
 	line-height: 42px;
 	letter-spacing: -0.65px;
 }
@mixin font-header-l {
 	@include font-numeric;
 	font-weight: 500;
 	font-size: 20px;
 	line-height: 26px;
 	letter-spacing: -0.41px;
 }
@mixin font-subheader-l {
 	font-weight: 500;
 	font-size: 16px;
 	line-height: 22px;
 	letter-spacing: 0px;
 }
@mixin font-body-m {
-	font-weight: 500;
+	@include font-body-16(500);
 	font-size: 16px;
 	line-height: 22px;
 	letter-spacing: 0px;
 }
@mixin font-body-mm {
 	font-weight: 500;
 	font-size: 16px;
 	line-height: 22px;
 	letter-spacing: 0px;
 }
@mixin font-body-mr {
-	font-weight: 400;
+	@include font-body-16(400);
 	font-size: 16px;
 	line-height: 22px;
 	letter-spacing: 0px;
 }
@mixin font-body-s {
@@ -30,4 +30,6 @@ $color-white: var(--color-white);
 $color-black: var(--color-black);
 $header-height: var(--header-height);
 $text-primary: var(--text-primary);
 $text-secondary: var(--text-secondary);
@@ -1,11 +1,12 @@
@import "normalize.css";
@import "@radix-ui/themes/styles.css";
 * {
 	box-sizing: border-box;
 	margin: 0;
 	padding: 0;
 	border: 0;
-	font-family: var(--font-roboto);
+	font-family: var(--font-open-sans);
 	font-variant-numeric: lining-nums proportional-nums;
 	-moz-osx-font-smoothing: grayscale;
 	-webkit-font-smoothing: antialiased;
@@ -14,10 +15,10 @@
 body {
 	background-color: #f8f8f8;
-
+  color: var(--text-primary);
-  @media (prefers-color-scheme: dark) {
+  // @media (prefers-color-scheme: dark) {
-    background-color: #121212;
+  //   background-color: #121212;
-  }
+  // }
 }
 :root {
@@ -54,10 +55,12 @@ body {
 	--color-white: #ffffff;
 	--color-black: #000000;
  --text-primary: #111827;
  --text-secondary: #6b7280;
 	--header-height: 56px;
 }
-
+.radix-themes {
-
+	--default-font-family: var(--font-open-sans);
-
+}
@@ -1,3 +1,10 @@
-import type { AlertProps } from "react-bootstrap/Alert"
+import type { Callout } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface IAlertProps extends AlertProps {}
+export type AlertVariant = "info" | "success" | "warning" | "danger"
 export interface IAlertProps
 	extends Omit<ComponentProps<typeof Callout.Root>, "color"> {
 	variant?: AlertVariant
 	children?: ReactNode
 }
@@ -0,0 +1,30 @@
 .alert {
 	padding: 1rem;
 	border-radius: 0.5rem;
 	font-size: 0.875rem;
 	line-height: 1.5;
 }
 .info {
 	background-color: #e0f2fe;
 	color: #0369a1;
 	border: 1px solid #7dd3fc;
 }
 .success {
 	background-color: #dcfce7;
 	color: #166534;
 	border: 1px solid #86efac;
 }
 .warning {
 	background-color: #fef9c3;
 	color: #854d0e;
 	border: 1px solid #fde047;
 }
 .danger {
 	background-color: #fee2e2;
 	color: #991b1b;
 	border: 1px solid #fca5a5;
 }
@@ -3,11 +3,30 @@
 import type { IAlertProps } from "../model/Alert.d"
 import type { JSX } from "react"
 import { Callout } from "@radix-ui/themes"
 import { AlertCircle, CheckCircle, Info, TriangleAlert } from "lucide-react"
 import { forwardRef } from "react"
-import BootstrapAlert from "react-bootstrap/Alert"
+
 const variantMap = {
 	info: { color: "blue", Icon: Info },
 	success: { color: "green", Icon: CheckCircle },
 	warning: { color: "yellow", Icon: TriangleAlert },
 	danger: { color: "red", Icon: AlertCircle },
 } as const
 export const Alert = forwardRef<HTMLDivElement, IAlertProps>(
-	(props, ref): JSX.Element => <BootstrapAlert ref={ref} {...props} />,
+	({ variant = "info", children, ...props }, ref): JSX.Element => {
 		const { color, Icon } = variantMap[variant]
 		return (
 			<Callout.Root ref={ref} color={color} role="alert" {...props}>
 				<Callout.Icon>
 					<Icon size={16} />
 				</Callout.Icon>
 				<Callout.Text>{children}</Callout.Text>
 			</Callout.Root>
 		)
 	},
 )
 Alert.displayName = "Alert"
@@ -1,3 +1,16 @@
-import type { BadgeProps } from "react-bootstrap/Badge"
+import type { Badge } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface IBadgeProps extends BadgeProps {}
+export type BadgeVariant =
 	| "primary"
 	| "secondary"
 	| "success"
 	| "danger"
 	| "warning"
 	| "info"
 export interface IBadgeProps
 	extends Omit<ComponentProps<typeof Badge>, "color"> {
 	variant?: BadgeVariant
 	children?: ReactNode
 }
@@ -0,0 +1,39 @@
 .badge {
 	display: inline-flex;
 	align-items: center;
 	padding: 0.25rem 0.5rem;
 	border-radius: 9999px;
 	font-size: 0.75rem;
 	font-weight: 500;
 	line-height: 1;
 }
 .primary {
 	background-color: var(--purple-400);
 	color: white;
 }
 .secondary {
 	background-color: var(--green-600);
 	color: white;
 }
 .success {
 	background-color: var(--color-success);
 	color: white;
 }
 .danger {
 	background-color: var(--color-danger);
 	color: white;
 }
 .warning {
 	background-color: var(--color-warning);
 	color: #1f2937;
 }
 .info {
 	background-color: #3b82f6;
 	color: white;
 }
@@ -3,11 +3,24 @@
 import type { IBadgeProps } from "../model/Badge.d"
 import type { JSX } from "react"
 import { Badge as RadixBadge } from "@radix-ui/themes"
 import { forwardRef } from "react"
-import BootstrapBadge from "react-bootstrap/Badge"
+
 const variantMap = {
 	primary: "violet",
 	secondary: "gray",
 	success: "green",
 	danger: "red",
 	warning: "yellow",
 	info: "blue",
 } as const
 export const Badge = forwardRef<HTMLSpanElement, IBadgeProps>(
-	(props, ref): JSX.Element => <BootstrapBadge ref={ref} {...props} />,
+	({ variant = "primary", children, ...props }, ref): JSX.Element => (
 		<RadixBadge ref={ref} color={variantMap[variant]} {...props}>
 			{children}
 		</RadixBadge>
 	),
 )
 Badge.displayName = "Badge"
@@ -1 +0,0 @@
 export * from "./model/Button.d"
@@ -1 +0,0 @@
 export * from "./ui/Button"
@@ -1,3 +1,20 @@
-import type { ButtonProps } from "react-bootstrap/Button"
+import type { Button as RadixButton } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface IButtonProps extends ButtonProps {}
+export type ButtonVariant =
 	| "primary"
 	| "secondary"
 	| "outline"
 	| "ghost"
 	| "danger"
 	| "icon"
 export type ButtonSize = "sm" | "md" | "lg"
 export interface IButtonProps extends Omit<
 	ComponentProps<typeof RadixButton>,
 	"size" | "variant"
 > {
 	variant?: ButtonVariant
 	size?: ButtonSize
 	children?: ReactNode
 }
@@ -4,10 +4,61 @@ import type { IButtonProps } from "../model/Button.d"
 import type { JSX } from "react"
 import { forwardRef } from "react"
-import BootstrapButton from "react-bootstrap/Button"
+
 import {
 	Button as RadixButton,
 	IconButton as RadixIconButton,
 } from "@radix-ui/themes"
 const sizeMap = {
 	sm: "1",
 	md: "2",
 	lg: "3",
 } as const
 const variantMap = {
 	primary: { variant: "solid", color: "indigo" },
 	secondary: { variant: "soft", color: "grass" },
 	outline: { variant: "outline", color: "indigo" },
 	ghost: { variant: "ghost", color: "gray" },
 	danger: { variant: "solid", color: "ruby" },
 	icon: { variant: "ghost", color: "gray" },
 } as const
 export const Button = forwardRef<HTMLButtonElement, IButtonProps>(
-	(props, ref): JSX.Element => <BootstrapButton ref={ref} {...props} />,
+	(
 		{ variant = "primary", size = "md", children, ...props },
 		ref,
 	): JSX.Element => {
 		const visual = variantMap[variant]
 		const radixSize = sizeMap[size]
 		if (variant === "icon") {
 			return (
 				<RadixIconButton
 					ref={ref}
 					size={radixSize}
 					variant={visual.variant}
 					color={visual.color}
 					{...props}
 				>
 					{children}
 				</RadixIconButton>
 			)
 		}
 		return (
 			<RadixButton
 				ref={ref}
 				size={radixSize}
 				variant={visual.variant}
 				color={visual.color}
 				{...props}
 			>
 				{children}
 			</RadixButton>
 		)
 	},
 )
 Button.displayName = "Button"
@@ -1,3 +1,6 @@
-import type { CardProps } from "react-bootstrap/Card"
+import type { Card } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface ICardProps extends CardProps {}
+export interface ICardProps extends ComponentProps<typeof Card> {
 	children?: ReactNode
 }
@@ -0,0 +1,10 @@
 .card {
 	background-color: white;
 	border-radius: 0.75rem;
 	box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
 	padding: 1.5rem;
 	@media (prefers-color-scheme: dark) {
 		background-color: #1f1f1f;
 	}
 }
@@ -3,11 +3,15 @@
 import type { ICardProps } from "../model/Card.d"
 import type { JSX } from "react"
 import { Card as RadixCard } from "@radix-ui/themes"
 import { forwardRef } from "react"
 import BootstrapCard from "react-bootstrap/Card"
 export const Card = forwardRef<HTMLDivElement, ICardProps>(
-	(props, ref): JSX.Element => <BootstrapCard ref={ref} {...props} />,
+	({ children, ...props }, ref): JSX.Element => (
 		<RadixCard ref={ref} {...props}>
 			{children}
 		</RadixCard>
 	),
 )
 Card.displayName = "Card"
@@ -1,3 +1,6 @@
-import type { FormCheckProps } from "react-bootstrap/FormCheck"
+import type { Checkbox } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface ICheckboxProps extends Omit<FormCheckProps, "type"> {}
+export interface ICheckboxProps extends ComponentProps<typeof Checkbox> {
 	label?: ReactNode
 }
@@ -0,0 +1,50 @@
 .wrapper {
 	display: flex;
 	align-items: center;
 	gap: 0.5rem;
 }
 .checkbox {
 	width: 1.25rem;
 	height: 1.25rem;
 	background-color: white;
 	border: 2px solid #d1d5db;
 	border-radius: 0.25rem;
 	cursor: pointer;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	transition: all 0.15s ease;
 	&:hover {
 		border-color: var(--purple-400);
 	}
 	&:focus-visible {
 		outline: 2px solid var(--purple-400);
 		outline-offset: 2px;
 	}
 	&[data-state="checked"] {
 		background-color: var(--purple-400);
 		border-color: var(--purple-400);
 	}
 	&[data-disabled] {
 		opacity: 0.5;
 		cursor: not-allowed;
 	}
 }
 .indicator {
 	color: white;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 }
 .label {
 	font-size: 0.875rem;
 	cursor: pointer;
 	user-select: none;
 }
@@ -3,13 +3,23 @@
 import type { ICheckboxProps } from "../model/Checkbox.d"
 import type { JSX } from "react"
-import { forwardRef } from "react"
+import { Checkbox as RadixCheckbox, Flex, Text } from "@radix-ui/themes"
-import BootstrapFormCheck from "react-bootstrap/FormCheck"
+import { forwardRef, useId } from "react"
-export const Checkbox = forwardRef<HTMLInputElement, ICheckboxProps>(
+export const Checkbox = forwardRef<HTMLButtonElement, ICheckboxProps>(
-	(props, ref): JSX.Element => (
+	({ label, id: propId, ...props }, ref): JSX.Element => {
-		<BootstrapFormCheck ref={ref} type="checkbox" {...props} />
+		const generatedId = useId()
-	),
+		const id = propId ?? generatedId
 		return (
 			<Text as="label" size="2">
 				<Flex gap="2" align="center">
 					<RadixCheckbox ref={ref} id={id} {...props} />
 					{label}
 				</Flex>
 			</Text>
 		)
 	},
 )
 Checkbox.displayName = "Checkbox"
@@ -1,3 +1,5 @@
-import type { FormProps } from "react-bootstrap/Form"
+import type { FormHTMLAttributes, ReactNode } from "react"
-export interface IFormProps extends FormProps {}
+export interface IFormProps extends FormHTMLAttributes<HTMLFormElement> {
 	children?: ReactNode
 }
@@ -0,0 +1,5 @@
 .form {
 	display: flex;
 	flex-direction: column;
 	gap: 1rem;
 }
@@ -4,10 +4,17 @@ import type { IFormProps } from "../model/Form.d"
 import type { JSX } from "react"
 import { forwardRef } from "react"
-import BootstrapForm from "react-bootstrap/Form"
+
 import classNames from "classnames"
 import styles from "./Form.module.scss"
 export const Form = forwardRef<HTMLFormElement, IFormProps>(
-	(props, ref): JSX.Element => <BootstrapForm ref={ref} {...props} />,
+	({ className, children, ...props }, ref): JSX.Element => (
 		<form ref={ref} className={classNames(styles.form, className)} {...props}>
 			{children}
 		</form>
 	),
 )
 Form.displayName = "Form"
@@ -1,3 +1,8 @@
-import type { ModalProps } from "react-bootstrap/Modal"
+import type { Dialog } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface IModalProps extends ModalProps {}
+export interface IModalProps extends ComponentProps<typeof Dialog.Root> {
 	title?: ReactNode
 	description?: ReactNode
 	children?: ReactNode
 }
@@ -0,0 +1,86 @@
 .overlay {
 	position: fixed;
 	inset: 0;
 	background-color: rgba(0, 0, 0, 0.5);
 	z-index: 100;
 	animation: overlayShow 0.15s ease;
 }
 .content {
 	position: fixed;
 	top: 50%;
 	left: 50%;
 	transform: translate(-50%, -50%);
 	max-width: 32rem;
 	width: calc(100% - 2rem);
 	max-height: 85vh;
 	padding: 1.5rem;
 	background-color: white;
 	border-radius: 0.75rem;
 	box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
 	z-index: 101;
 	animation: contentShow 0.15s ease;
 	&:focus {
 		outline: none;
 	}
 	@media (prefers-color-scheme: dark) {
 		background-color: #1f1f1f;
 	}
 }
 .title {
 	margin-bottom: 0.5rem;
 	font-size: 1.125rem;
 	font-weight: 600;
 }
 .description {
 	margin-bottom: 1rem;
 	font-size: 0.875rem;
 	color: #6b7280;
 }
 .close {
 	position: absolute;
 	top: 1rem;
 	right: 1rem;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	padding: 0.25rem;
 	background: transparent;
 	border-radius: 0.25rem;
 	color: #6b7280;
 	cursor: pointer;
 	&:hover {
 		background-color: #f3f4f6;
 	}
 	&:focus-visible {
 		outline: 2px solid var(--purple-400);
 		outline-offset: 2px;
 	}
 }
@keyframes overlayShow {
 	from {
 		opacity: 0;
 	}
 	to {
 		opacity: 1;
 	}
 }
@keyframes contentShow {
 	from {
 		opacity: 0;
 		transform: translate(-50%, -48%) scale(0.96);
 	}
 	to {
 		opacity: 1;
 		transform: translate(-50%, -50%) scale(1);
 	}
 }
@@ -3,11 +3,26 @@
 import type { IModalProps } from "../model/Modal.d"
 import type { JSX } from "react"
 import { Dialog } from "@radix-ui/themes"
 import { forwardRef } from "react"
 import BootstrapModal from "react-bootstrap/Modal"
 export const Modal = forwardRef<HTMLDivElement, IModalProps>(
-	(props, ref): JSX.Element => <BootstrapModal ref={ref} {...props} />,
+	({ title, description, children, ...props }, ref): JSX.Element => (
 		<Dialog.Root {...props}>
 			<Dialog.Content ref={ref}>
 				{title && <Dialog.Title>{title}</Dialog.Title>}
 				{description && (
 					<Dialog.Description size="2" mb="4">
 						{description}
 					</Dialog.Description>
 				)}
 				{children}
 			</Dialog.Content>
 		</Dialog.Root>
 	),
 )
 Modal.displayName = "Modal"
 export const ModalTrigger = Dialog.Trigger
 ModalTrigger.displayName = "ModalTrigger"
@@ -1,3 +1,9 @@
-import type { PaginationProps } from "react-bootstrap/Pagination"
+import type { Flex } from "@radix-ui/themes"
 import type { ComponentProps } from "react"
-export interface IPaginationProps extends PaginationProps {}
+export interface IPaginationProps extends ComponentProps<typeof Flex> {
 	currentPage: number
 	totalPages: number
 	onPageChange: (page: number) => void
 	showFirstLast?: boolean
 }
@@ -0,0 +1,56 @@
 .pagination {
 	display: flex;
 	align-items: center;
 	gap: 0.25rem;
 }
 .button {
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	min-width: 2rem;
 	height: 2rem;
 	padding: 0 0.5rem;
 	background: transparent;
 	border-radius: 0.375rem;
 	font-size: 0.875rem;
 	cursor: pointer;
 	transition: all 0.15s ease;
 	&:hover:not(:disabled) {
 		background-color: #f3f4f6;
 	}
 	&:focus-visible {
 		outline: 2px solid var(--purple-400);
 		outline-offset: 2px;
 	}
 	&:disabled {
 		opacity: 0.5;
 		cursor: not-allowed;
 	}
 }
 .page {
 	font-weight: 500;
 }
 .active {
 	background-color: var(--purple-400);
 	color: white;
 	&:hover:not(:disabled) {
 		background-color: var(--purple-500);
 	}
 }
 .ellipsis {
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	min-width: 2rem;
 	height: 2rem;
 	font-size: 0.875rem;
 	color: #6b7280;
 }
@@ -3,11 +3,113 @@
 import type { IPaginationProps } from "../model/Pagination.d"
 import type { JSX } from "react"
-import { forwardRef } from "react"
+import { Flex, IconButton, Text } from "@radix-ui/themes"
-import BootstrapPagination from "react-bootstrap/Pagination"
+import {
 	ChevronLeft,
 	ChevronRight,
 	ChevronsLeft,
 	ChevronsRight,
 } from "lucide-react"
 import { forwardRef, useMemo } from "react"
-export const Pagination = forwardRef<HTMLUListElement, IPaginationProps>(
+export const Pagination = forwardRef<HTMLDivElement, IPaginationProps>(
-	(props, ref): JSX.Element => <BootstrapPagination ref={ref} {...props} />,
+	(
 		{ currentPage, totalPages, onPageChange, showFirstLast = true, ...props },
 		ref,
 	): JSX.Element => {
 		const pages = useMemo(() => {
 			const items: (number | "ellipsis")[] = []
 			const maxVisible = 5
 			if (totalPages <= maxVisible) {
 				for (let i = 1; i <= totalPages; i++) items.push(i)
 			} else {
 				items.push(1)
 				if (currentPage > 3) items.push("ellipsis")
 				const start = Math.max(2, currentPage - 1)
 				const end = Math.min(totalPages - 1, currentPage + 1)
 				for (let i = start; i <= end; i++) items.push(i)
 				if (currentPage < totalPages - 2) items.push("ellipsis")
 				items.push(totalPages)
 			}
 			return items
 		}, [currentPage, totalPages])
 		return (
 			<Flex
 				ref={ref}
 				role="navigation"
 				align="center"
 				gap="1"
 				aria-label="Pagination"
 				{...props}
 			>
 				{showFirstLast && (
 					<IconButton
 						variant="soft"
 						size="1"
 						onClick={() => onPageChange(1)}
 						disabled={currentPage === 1}
 						aria-label="First page"
 					>
 						<ChevronsLeft size={16} />
 					</IconButton>
 				)}
 				<IconButton
 					variant="soft"
 					size="1"
 					onClick={() => onPageChange(currentPage - 1)}
 					disabled={currentPage === 1}
 					aria-label="Previous page"
 				>
 					<ChevronLeft size={16} />
 				</IconButton>
 				{pages.map((page, index) =>
 					page === "ellipsis" ? (
 						<Text key={`ellipsis-${index}`} size="2" color="gray" mx="1">
 							...
 						</Text>
 					) : (
 						<IconButton
 							key={page}
 							variant={page === currentPage ? "solid" : "soft"}
 							size="1"
 							onClick={() => onPageChange(page)}
 							aria-current={page === currentPage ? "page" : undefined}
 						>
 							{page}
 						</IconButton>
 					),
 				)}
 				<IconButton
 					variant="soft"
 					size="1"
 					onClick={() => onPageChange(currentPage + 1)}
 					disabled={currentPage === totalPages}
 					aria-label="Next page"
 				>
 					<ChevronRight size={16} />
 				</IconButton>
 				{showFirstLast && (
 					<IconButton
 						variant="soft"
 						size="1"
 						onClick={() => onPageChange(totalPages)}
 						disabled={currentPage === totalPages}
 						aria-label="Last page"
 					>
 						<ChevronsRight size={16} />
 					</IconButton>
 				)}
 			</Flex>
 		)
 	},
 )
 Pagination.displayName = "Pagination"
@@ -1,3 +1,9 @@
-import type { FormCheckProps } from "react-bootstrap/FormCheck"
+import type { RadioGroup } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface IRadioProps extends Omit<FormCheckProps, "type"> {}
+export interface IRadioGroupProps
 	extends ComponentProps<typeof RadioGroup.Root> {}
 export interface IRadioProps extends ComponentProps<typeof RadioGroup.Item> {
 	label?: ReactNode
 }
@@ -0,0 +1,55 @@
 .group {
 	display: flex;
 	flex-direction: column;
 	gap: 0.5rem;
 }
 .wrapper {
 	display: flex;
 	align-items: center;
 	gap: 0.5rem;
 }
 .radio {
 	width: 1.25rem;
 	height: 1.25rem;
 	background-color: white;
 	border: 2px solid #d1d5db;
 	border-radius: 50%;
 	cursor: pointer;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	transition: all 0.15s ease;
 	&:hover {
 		border-color: var(--purple-400);
 	}
 	&:focus-visible {
 		outline: 2px solid var(--purple-400);
 		outline-offset: 2px;
 	}
 	&[data-state="checked"] {
 		border-color: var(--purple-400);
 	}
 	&[data-disabled] {
 		opacity: 0.5;
 		cursor: not-allowed;
 	}
 }
 .indicator {
 	width: 0.625rem;
 	height: 0.625rem;
 	background-color: var(--purple-400);
 	border-radius: 50%;
 }
 .label {
 	font-size: 0.875rem;
 	cursor: pointer;
 	user-select: none;
 }
@@ -1,15 +1,35 @@
 "use client"
-import type { IRadioProps } from "../model/Radio.d"
+import type { IRadioGroupProps, IRadioProps } from "../model/Radio.d"
 import type { JSX } from "react"
-import { forwardRef } from "react"
+import { Flex, RadioGroup, Text } from "@radix-ui/themes"
-import BootstrapFormCheck from "react-bootstrap/FormCheck"
+import { forwardRef, useId } from "react"
-export const Radio = forwardRef<HTMLInputElement, IRadioProps>(
+export const RadioGroupRoot = forwardRef<HTMLDivElement, IRadioGroupProps>(
-	(props, ref): JSX.Element => (
+	({ ...props }, ref): JSX.Element => (
-		<BootstrapFormCheck ref={ref} type="radio" {...props} />
+		<RadioGroup.Root ref={ref} {...props} />
 	),
 )
 RadioGroupRoot.displayName = "RadioGroup"
 export const Radio = forwardRef<HTMLButtonElement, IRadioProps>(
 	({ label, id: propId, ...props }, ref): JSX.Element => {
 		const generatedId = useId()
 		const id = propId ?? generatedId
 		return (
 			<Text as="label" size="2">
 				<Flex gap="2" align="center">
 					<RadioGroup.Item ref={ref} id={id} {...props} />
 					{label}
 				</Flex>
 			</Text>
 		)
 	},
 )
 Radio.displayName = "Radio"
 export { RadioGroupRoot as RadioGroup }
@@ -1,3 +1,11 @@
-import type { FormSelectProps } from "react-bootstrap/FormSelect"
+import type { Select } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface ISelectProps extends FormSelectProps {}
+export interface ISelectProps extends ComponentProps<typeof Select.Root> {
 	placeholder?: string
 	children?: ReactNode
 }
 export interface ISelectItemProps extends ComponentProps<typeof Select.Item> {
 	children?: ReactNode
 }
@@ -0,0 +1,91 @@
 .trigger {
 	display: inline-flex;
 	align-items: center;
 	justify-content: space-between;
 	gap: 0.5rem;
 	min-width: 10rem;
 	padding: 0.5rem 0.75rem;
 	background-color: white;
 	border: 1px solid #d1d5db;
 	border-radius: 0.5rem;
 	font-size: 0.875rem;
 	cursor: pointer;
 	transition: all 0.15s ease;
 	&:hover {
 		border-color: var(--purple-400);
 	}
 	&:focus-visible {
 		outline: 2px solid var(--purple-400);
 		outline-offset: 2px;
 	}
 	&[data-placeholder] {
 		color: #9ca3af;
 	}
 	&[data-disabled] {
 		opacity: 0.5;
 		cursor: not-allowed;
 	}
 }
 .icon {
 	display: flex;
 	color: #6b7280;
 }
 .content {
 	overflow: hidden;
 	background-color: white;
 	border: 1px solid #e5e7eb;
 	border-radius: 0.5rem;
 	box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
 	z-index: 50;
 }
 .viewport {
 	padding: 0.25rem;
 }
 .item {
 	position: relative;
 	display: flex;
 	align-items: center;
 	padding: 0.5rem 0.75rem;
 	padding-right: 2rem;
 	border-radius: 0.375rem;
 	font-size: 0.875rem;
 	cursor: pointer;
 	user-select: none;
 	outline: none;
 	&:hover,
 	&[data-highlighted] {
 		background-color: var(--purple-50);
 		color: var(--purple-600);
 	}
 	&[data-disabled] {
 		opacity: 0.5;
 		pointer-events: none;
 	}
 }
 .itemIndicator {
 	position: absolute;
 	right: 0.5rem;
 	display: flex;
 	align-items: center;
 	color: var(--purple-400);
 }
 .scrollButton {
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	padding: 0.25rem;
 	color: #6b7280;
 	cursor: default;
 }
@@ -1,13 +1,34 @@
 "use client"
-import type { ISelectProps } from "../model/Select.d"
+import type { ISelectItemProps, ISelectProps } from "../model/Select.d"
 import type { JSX } from "react"
 import { Select as RadixSelect } from "@radix-ui/themes"
 import { forwardRef } from "react"
 import BootstrapFormSelect from "react-bootstrap/FormSelect"
-export const Select = forwardRef<HTMLSelectElement, ISelectProps>(
+export const Select = forwardRef<HTMLButtonElement, ISelectProps>(
-	(props, ref): JSX.Element => <BootstrapFormSelect ref={ref} {...props} />,
+	({ placeholder, children, ...props }, ref): JSX.Element => (
 		<RadixSelect.Root {...props}>
 			<RadixSelect.Trigger ref={ref} placeholder={placeholder} />
 			<RadixSelect.Content position="popper">
 				{children}
 			</RadixSelect.Content>
 		</RadixSelect.Root>
 	),
 )
 Select.displayName = "Select"
 export const SelectItem = forwardRef<HTMLDivElement, ISelectItemProps>(
 	({ children, ...props }, ref): JSX.Element => (
 		<RadixSelect.Item ref={ref} {...props}>
 			{children}
 		</RadixSelect.Item>
 	),
 )
 SelectItem.displayName = "SelectItem"
 export const SelectGroup = RadixSelect.Group
 export const SelectLabel = RadixSelect.Label
 export const SelectSeparator = RadixSelect.Separator
@@ -1,3 +1,6 @@
-import type { TableProps } from "react-bootstrap/Table"
+import type { Table } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface ITableProps extends TableProps {}
+export interface ITableProps extends ComponentProps<typeof Table.Root> {
 	children?: ReactNode
 }
@@ -0,0 +1,41 @@
 .table {
 	width: 100%;
 	border-collapse: collapse;
 	font-size: 0.875rem;
 	th,
 	td {
 		padding: 0.75rem 1rem;
 		text-align: left;
 	}
 	thead th {
 		font-weight: 600;
 		border-bottom: 2px solid #e5e7eb;
 	}
 	tbody td {
 		border-bottom: 1px solid #e5e7eb;
 	}
 }
 .striped {
 	tbody tr:nth-child(odd) {
 		background-color: #f9fafb;
 	}
 }
 .bordered {
 	border: 1px solid #e5e7eb;
 	th,
 	td {
 		border: 1px solid #e5e7eb;
 	}
 }
 .hover {
 	tbody tr:hover {
 		background-color: #f3f4f6;
 	}
 }
@@ -3,11 +3,22 @@
 import type { ITableProps } from "../model/Table.d"
 import type { JSX } from "react"
 import { Table as RadixTable } from "@radix-ui/themes"
 import { forwardRef } from "react"
 import BootstrapTable from "react-bootstrap/Table"
 export const Table = forwardRef<HTMLTableElement, ITableProps>(
-	(props, ref): JSX.Element => <BootstrapTable ref={ref} {...props} />,
+	({ children, ...props }, ref): JSX.Element => (
 		<RadixTable.Root ref={ref} {...props}>
 			{children}
 		</RadixTable.Root>
 	),
 )
 Table.displayName = "Table"
 export const TableHeader = RadixTable.Header
 export const TableBody = RadixTable.Body
 export const TableRow = RadixTable.Row
 export const TableCell = RadixTable.Cell
 export const TableColumnHeaderCell = RadixTable.ColumnHeaderCell
 export const TableRowHeaderCell = RadixTable.RowHeaderCell
@@ -1,3 +1,20 @@
-import type { TabsProps } from "react-bootstrap/Tabs"
+import type { Tabs } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface ITabsProps extends TabsProps {}
+export interface ITabsProps extends ComponentProps<typeof Tabs.Root> {
 	children?: ReactNode
 }
 export interface ITabsListProps extends ComponentProps<typeof Tabs.List> {
 	children?: ReactNode
 }
 export interface ITabsTriggerProps
 	extends ComponentProps<typeof Tabs.Trigger> {
 	children?: ReactNode
 }
 export interface ITabsContentProps
 	extends ComponentProps<typeof Tabs.Content> {
 	children?: ReactNode
 }
@@ -0,0 +1,49 @@
 .tabs {
 	display: flex;
 	flex-direction: column;
 }
 .list {
 	display: flex;
 	gap: 0.25rem;
 	border-bottom: 1px solid #e5e7eb;
 }
 .trigger {
 	padding: 0.75rem 1rem;
 	background: transparent;
 	font-size: 0.875rem;
 	font-weight: 500;
 	color: #6b7280;
 	cursor: pointer;
 	border-bottom: 2px solid transparent;
 	margin-bottom: -1px;
 	transition: all 0.15s ease;
 	&:hover {
 		color: var(--purple-400);
 	}
 	&:focus-visible {
 		outline: 2px solid var(--purple-400);
 		outline-offset: -2px;
 	}
 	&[data-state="active"] {
 		color: var(--purple-400);
 		border-bottom-color: var(--purple-400);
 	}
 	&[data-disabled] {
 		opacity: 0.5;
 		cursor: not-allowed;
 	}
 }
 .content {
 	padding: 1rem 0;
 	&:focus {
 		outline: none;
 	}
 }
@@ -1,18 +1,40 @@
 "use client"
-import type { ITabsProps } from "../model/Tabs.d"
+import type {
-import type { ForwardRefExoticComponent, JSX, RefAttributes } from "react"
+	ITabsContentProps,
 	ITabsListProps,
 	ITabsProps,
 	ITabsTriggerProps,
 } from "../model/Tabs.d"
 import type { JSX } from "react"
 import { Tabs as RadixTabs } from "@radix-ui/themes"
 import { forwardRef } from "react"
 import BootstrapTabs from "react-bootstrap/Tabs"
 const BootstrapTabsWithRef =
 	BootstrapTabs as unknown as ForwardRefExoticComponent<
 		ITabsProps & RefAttributes<HTMLDivElement>
 	>
 export const Tabs = forwardRef<HTMLDivElement, ITabsProps>(
-	(props, ref): JSX.Element => <BootstrapTabsWithRef ref={ref} {...props} />,
+	({ ...props }, ref): JSX.Element => <RadixTabs.Root ref={ref} {...props} />,
 )
 Tabs.displayName = "Tabs"
 export const TabsList = forwardRef<HTMLDivElement, ITabsListProps>(
 	({ ...props }, ref): JSX.Element => <RadixTabs.List ref={ref} {...props} />,
 )
 TabsList.displayName = "TabsList"
 export const TabsTrigger = forwardRef<HTMLButtonElement, ITabsTriggerProps>(
 	({ ...props }, ref): JSX.Element => (
 		<RadixTabs.Trigger ref={ref} {...props} />
 	),
 )
 TabsTrigger.displayName = "TabsTrigger"
 export const TabsContent = forwardRef<HTMLDivElement, ITabsContentProps>(
 	({ ...props }, ref): JSX.Element => (
 		<RadixTabs.Content ref={ref} {...props} />
 	),
 )
 TabsContent.displayName = "TabsContent"
@@ -1,7 +1,10 @@
-import type { FormControlProps } from "react-bootstrap/FormControl"
+import type { TextField } from "@radix-ui/themes"
 import type { ComponentProps, ReactNode } from "react"
-export interface ITextFieldProps extends FormControlProps {
+export interface ITextFieldProps
 	extends Omit<ComponentProps<typeof TextField.Root>, "color"> {
 	id: string
-	label?: string
+	label?: ReactNode
-	undertitle?: string
+	undertitle?: ReactNode
 	error?: boolean
 }
@@ -0,0 +1,69 @@
 .wrapper {
 	display: flex;
 	flex-direction: column;
 	gap: 0.375rem;
 }
 .label {
 	font-size: 0.875rem;
 	font-weight: 500;
 	color: #374151;
 	@media (prefers-color-scheme: dark) {
 		color: #e5e7eb;
 	}
 }
 .input {
 	width: 100%;
 	padding: 0.5rem 0.75rem;
 	background-color: white;
 	border: 1px solid #d1d5db;
 	border-radius: 0.5rem;
 	font-size: 0.875rem;
 	transition: all 0.15s ease;
 	&::placeholder {
 		color: #9ca3af;
 	}
 	&:hover:not(:disabled) {
 		border-color: #9ca3af;
 	}
 	&:focus {
 		outline: none;
 		border-color: var(--purple-400);
 		box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.1);
 	}
 	&:disabled {
 		opacity: 0.5;
 		cursor: not-allowed;
 		background-color: #f3f4f6;
 	}
 	@media (prefers-color-scheme: dark) {
 		background-color: #1f1f1f;
 		border-color: #4b5563;
 		color: #f3f4f6;
 		&:hover:not(:disabled) {
 			border-color: #6b7280;
 		}
 	}
 }
 .error {
 	border-color: var(--color-danger);
 	&:focus {
 		border-color: var(--color-danger);
 		box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
 	}
 }
 .undertitle {
 	font-size: 0.75rem;
 	color: #6b7280;
 }
@@ -3,25 +3,32 @@
 import type { ITextFieldProps } from "../model/TextField.d"
 import type { JSX } from "react"
-import React, { forwardRef } from "react"
+import { Text, TextField as RadixTextField } from "@radix-ui/themes"
-import BootstrapForm from "react-bootstrap/Form"
+import { forwardRef } from "react"
 export const TextField = forwardRef<HTMLInputElement, ITextFieldProps>(
-	({ id, label, undertitle, ...props }, ref): JSX.Element => (
+	({ id, label, undertitle, error, size = "2", ...props }, ref): JSX.Element => (
-		<React.Fragment>
+		<label htmlFor={id}>
-			{label && <BootstrapForm.Label htmlFor={id}>{label}</BootstrapForm.Label>}
+			{label && (
-			<BootstrapForm.Control
+				<Text as="div" size="2" mb="1" weight="medium">
 					{label}
 				</Text>
 			)}
 			<RadixTextField.Root
 				id={id}
 				ref={ref}
 				size={size}
 				color={error ? "red" : undefined}
 				aria-describedby={undertitle ? `${id}-undertitle` : undefined}
 				aria-invalid={error}
 				{...props}
 				aria-describedby={`${id}-undertitle`}
 			/>
 			{undertitle && (
-				<BootstrapForm.Text id={`${id}-undertitle`} muted>
+				<Text as="p" size="1" color="gray" mt="1" id={`${id}-undertitle`}>
 					{undertitle}
-				</BootstrapForm.Text>
+				</Text>
 			)}
-		</React.Fragment>
+		</label>
 	),
 )
@@ -0,0 +1 @@
 export * from "./ui/Header"
@@ -0,0 +1,3 @@
 export interface IHeaderProps {
 	message?: string
 }
@@ -0,0 +1,27 @@
 .root {
  padding: 12px 24px;
  background-color: variables.$color-white;
 }
 .screenPath {
  display: flex;
  gap: 6px;
  align-items: center;
 }
 .brandTitle {
  @include typography.font-body-16(800);
 }
 .separator, .screenName {
  @include typography.font-body-14(500);
  color: variables.$text-secondary;
 }
 .start {
  display: flex;
  gap: 16px;
  align-items: center;
 }
@@ -0,0 +1,26 @@
 import type { JSX } from "react"
 import { Menu as MenuIcon } from "lucide-react"
 import { FunctionComponent } from "react"
 import { Button } from "@shared/ui"
 import { IHeaderProps } from "../model/Header.d"
 import styles from "./Header.module.scss"
 export const Header: FunctionComponent<IHeaderProps> = (): JSX.Element => {
 	return (
 		<div className={styles.root} data-testid="Header">
 			<div className={styles.start}>
 				<Button variant="icon">
 					<MenuIcon size={24} />
 				</Button>
 				<div className={styles.screenPath}>
 					<h1 className={styles.brandTitle}>Coffee Project</h1>
 					<span className={styles.separator}>/</span>
 					<h3 className={styles.screenName}>Projects</h3>
 				</div>
 			</div>
 		</div>
 	)
 }