feat: init commit for setup monorepo

packages/ui/components/counter.tsx

@@ -1,11 +0,0 @@
-import React, { useState } from "react";
-
-export const Counter: React.FC = () => {
-  const [count, setCount] = useState(0);
-
-  return (
-    <button id="counter" type="button" onClick={() => setCount(count + 1)}>
-      {count}
-    </button>
-  );
-};

packages/ui/package.json

@@ -2,25 +2,29 @@
   "name": "@repo/ui",
   "version": "0.0.0",
   "exports": {
-    ".": "./index.ts",
-    "./counter": "./components/counter.ts",
-    "./header": "./components/header.ts",
-    "./setup-counter": "./utils/counter.ts"
+    ".": "./src/index.ts",
+    "./global.css": "./src/assets/styles/globals.css"
   },
   "license": "MIT",
   "scripts": {
     "lint": "eslint \"**/*.ts\""
   },
   "dependencies": {
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "@tailwindcss/vite": "^4.1.18",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "tailwind-merge": "^3.4.0",
+    "tailwind-variants": "^3.2.2",
+    "tailwindcss": "^4.1.18"
   },
   "devDependencies": {
-    "@types/react": "^19.0.1",
-    "@types/react-dom": "^19.0.2",
     "@repo/eslint-config": "workspace:*",
     "@repo/typescript-config": "workspace:*",
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^3.1.0",
     "eslint": "^8.57.0",
-    "typescript": "5.5.4"
+    "typescript": "5.5.4",
+    "vite": "^5.1.4"
   }
-}
+}

packages/ui/src/assets/styles/globals.css

@@ -0,0 +1,17 @@
+@import 'tailwindcss';
+
+@source "../../../src";
+
+@theme {
+  --color-brand-50: #f5f3fd; /* sangat terang, hampir lavender */
+  --color-brand-100: #e6dbfb;
+  --color-brand-200: #d0b6f8;
+  --color-brand-300: #b78ff5;
+  --color-brand-400: #9f64f1;
+  --color-brand-500: #7d39ed; /* warna utama purple */
+  --color-brand-600: #652ed9;
+  --color-brand-700: #4a23a5;
+  --color-brand-800: #321a7a;
+  --color-brand-900: #1b0f4a;
+  --color-brand-950: #0d0726; /* paling gelap */
+}

packages/ui/src/components/counter.tsx

@@ -0,0 +1,16 @@
+import React, { useState } from 'react';
+
+export const Counter: React.FC = () => {
+  const [count, setCount] = useState(0);
+
+  return (
+    <div>
+      <div className="bg-red-400 text-3xl font-bold underline">100</div>
+      <div className="mt-3 bg-brand-500 text-brand-800">sdsa</div>
+      <div className="text-5xl text-green-500">sada</div>
+      <button id="counter" type="button" onClick={() => setCount(count + 1)}>
+        {count}
+      </button>
+    </div>
+  );
+};

packages/ui/src/components/header.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 
 interface HeaderProps {
   title: string;

packages/ui/vite.config.ts

@@ -0,0 +1,8 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import tailwindcss from '@tailwindcss/vite';
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [react(), tailwindcss()],
+});