install

components.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.ts",
+    "css": "app/globals.css",
+    "baseColor": "gray",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils"
+  }
+}

lib/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}

package.json

@@ -15,8 +15,11 @@
     "@mdx-js/react": "^3.0.0",
     "@next/mdx": "^14.0.4",
     "@next/third-parties": "14.0.5-canary.26",
+    "@radix-ui/react-icons": "^1.3.0",
     "@types/mdx": "^2.0.10",
     "@uidotdev/usehooks": "^2.4.1",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.0",
     "fast-xml-parser": "^4.3.2",
     "next": "14.0.4",
     "next-auth": "^4.24.5",
@@ -30,6 +33,9 @@
     "recoil": "^0.7.7",
     "recoil-persist": "^5.1.0",
     "remark-gfm": "v3",
+    "shadcn-ui": "^0.8.0",
+    "tailwind-merge": "^2.2.0",
+    "tailwindcss-animate": "^1.0.7",
     "uuidv7": "^0.6.3"
   },
   "devDependencies": {