create-bunspace 0.4.0 → 0.5.0

package/dist/bin.js

@@ -5189,6 +5189,11 @@ async function selectTemplate(args) {
         title: "Fumadocs - Documentaci\xF3n con Next.js + MDX + Fumadocs",
         value: "fumadocs",
         description: "Bilingual documentation site with GitHub Pages deployment"
+      },
+      {
+        title: "React Starter - BaseUI + React 19 + Vite 8 + Theme Manager",
+        value: "react-starter",
+        description: "Opinionated React starter with animated UI components and theme management"
       }
     ]
   }, {
@@ -5444,6 +5449,69 @@ Operation cancelled`));
     runInstall: args.noInstall ? false : response.runInstall ?? true
   };
 }
+async function promptReactStarter(args) {
+  const gitUser = await getGitUser();
+  const parsed = parseProjectArg(args.projectName);
+  const response = await import_prompts.default([
+    {
+      type: args.projectName ? null : "text",
+      name: "name",
+      message: "Project name",
+      initial: parsed.name,
+      validate: (value) => {
+        if (!value)
+          return "Project name is required";
+        if (!isValidProjectName(value)) {
+          return "Invalid name. Use lowercase letters, numbers, and hyphens only";
+        }
+        return true;
+      },
+      format: (value) => value.toLowerCase().trim()
+    },
+    {
+      type: args.description ? null : "text",
+      name: "description",
+      message: "Description",
+      initial: "React app with BaseUI, theme management, and animated components"
+    },
+    {
+      type: args.author ? null : "text",
+      name: "author",
+      message: "Author",
+      initial: gitUser || "Anonymous"
+    },
+    {
+      type: args.noGit ? null : "confirm",
+      name: "initGit",
+      message: "Initialize git repository?",
+      initial: true
+    },
+    {
+      type: args.noInstall ? null : "confirm",
+      name: "runInstall",
+      message: "Run bun install?",
+      initial: true
+    }
+  ], {
+    onCancel: () => {
+      console.log(kleur_default.red(`
+Operation cancelled`));
+      process.exit(0);
+    }
+  });
+  const name = args.projectName ? parsed.name : response.name;
+  const targetDir = args.dir || `./${name}`;
+  return {
+    template: "react-starter",
+    name,
+    scope: "",
+    description: args.description || response.description || "",
+    author: args.author || response.author || gitUser || "Anonymous",
+    targetDir,
+    initGit: args.noGit ? false : response.initGit ?? true,
+    runInstall: args.noInstall ? false : response.runInstall ?? true
+  };
+}
 async function promptUser(args, templateType) {
   if (templateType === "telegram-bot") {
     return promptTelegramBot(args);
@@ -5451,6 +5519,9 @@ async function promptUser(args, templateType) {
   if (templateType === "fumadocs") {
     return promptFumadocs(args);
   }
+  if (templateType === "react-starter") {
+    return promptReactStarter(args);
+  }
   return promptMonorepo(args);
 }
 async function getDefaultsMonorepo(args) {
@@ -5512,8 +5583,26 @@ async function getDefaults(args, templateType) {
   if (templateType === "fumadocs") {
     return getDefaultsFumadocs(args);
   }
+  if (templateType === "react-starter") {
+    return getDefaultsReactStarter(args);
+  }
   return getDefaultsMonorepo(args);
 }
+async function getDefaultsReactStarter(args) {
+  const gitUser = await getGitUser();
+  const parsed = parseProjectArg(args.projectName);
+  const targetDir = args.dir || parsed.targetDir;
+  return {
+    template: "react-starter",
+    name: parsed.name,
+    scope: "",
+    description: args.description || "React app with BaseUI, theme management, and animated components",
+    author: args.author || gitUser || "Anonymous",
+    targetDir,
+    initGit: !args.noGit,
+    runInstall: !args.noInstall
+  };
+}
 
 // src/generator.ts
 import { mkdir, readdir, stat as stat2, readFile as readFile2, writeFile as writeFile2, copyFile, rename } from "fs/promises";
@@ -5803,6 +5892,15 @@ function generatePlaceholders(config, templateType) {
       SUPPORTED_LOCALES: config.supportedLocales || "es,en"
     };
   }
+  if (templateType === "react-starter") {
+    const projectTitle = config.name.split("-").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
+    return {
+      ...base,
+      PROJECT_NAME: config.name,
+      PROJECT_TITLE: projectTitle,
+      DESCRIPTION: config.description
+    };
+  }
   throw new Error(`Unknown template: ${templateType}`);
 }
 async function copyTemplateDir(src, dest, placeholders) {

package/dist/templates/fumadocs/MUST-FOLLOW-GUIDELINES.md

@@ -18,6 +18,91 @@
 | **Versioning** | Changesets v2.27.11 | Versionado de packages |
 | **Logging** | @mks2508/better-logger v4.0.0 | Logging estructurado |
 | **Error Handling** | @mks2508/no-throw v0.1.0 | Result pattern |
+| **Commit Generation** | gemini-commit-wizard v1.1.3 | Commits estructurados con IA multi-provider |
+
+---
+
+## Commit Workflow — gemini-commit-wizard
+
+**OBLIGATORIO**: Usar `bun run commit` para TODOS los commits. NUNCA hacer commits manuales sin formato estructurado.
+
+### Providers Disponibles
+
+| Provider | Variable de Entorno | Modelo Default | Velocidad |
+|----------|-------------------|---------------|-----------|
+| **Gemini SDK** | `GEMINI_API_KEY` | `gemini-2.5-flash` | Rapido |
+| **Groq** | `GROQ_API_KEY` | `llama-3.3-70b-versatile` | Ultra-rapido |
+| **OpenRouter** | `OPENROUTER_API_KEY` | `anthropic/claude-sonnet-4` | Variable |
+| **Gemini CLI** | _(necesita binario `gemini`)_ | CLI default | Moderado |
+
+**Auto-deteccion**: Gemini SDK > Groq > OpenRouter > Gemini CLI. El primer provider con API key valida se usa automaticamente.
+
+### Comandos
+
+```bash
+# Commit interactivo con IA (auto-detecta provider)
+bun run commit
+
+# Modo rapido sin prompts
+bun run commit:quick
+
+# Auto-aprobar sin push
+bun run commit:auto
+
+# Provider especifico
+bun run commit -- --provider groq
+
+# Provider + modelo especifico
+bun run commit -- --provider openrouter --model anthropic/claude-sonnet-4
+```
+
+### Formato de Commit Estructurado
+
+```
+type(scope): description
+
+Body text (en idioma configurado)
+
+<technical>
+- Detalles tecnicos: archivos, funciones, tipos modificados
+</technical>
+
+<changelog>
+## [Type] [Emoji]
+Entrada de changelog orientada al usuario
+</changelog>
+```
+
+**Types validos**: `feat`, `fix`, `refactor`, `docs`, `test`, `feat-phase` (feature incompleta)
+
+### Configuracion por Proyecto
+
+Crear `.commit-wizard.json` en la raiz del proyecto:
+
+```json
+{
+  "name": "mi-proyecto",
+  "description": "Descripcion breve",
+  "techStack": ["TypeScript", "Bun"],
+  "components": [
+    { "id": "api", "path": "src/api/", "name": "REST API" }
+  ],
+  "commitFormat": {
+    "titleLanguage": "english",
+    "bodyLanguage": "spanish",
+    "includeTechnical": true,
+    "includeChangelog": true
+  },
+  "provider": "groq",
+  "model": "llama-3.3-70b-versatile"
+}
+```
+
+### Prohibido
+
+- `git commit -m "mensaje"` sin formato estructurado
+- Commits sin `<technical>` y `<changelog>` sections
+- Usar providers sin API key configurada (el wizard valida automaticamente)
 
 ---
 
@@ -1167,39 +1252,43 @@ Antes de hacer commit de codigo, verificar:
 
 ---
 
-## REGLA 13: UI Components - Shadcn/UI + Animate UI
+## REGLA 13: UI Components - Shadcn MCP + React Bits + lucide-animated
 
 ### Stack de Componentes UI
 
-**OBLIGATORIO**: Shadcn/UI como base, con **Animate UI como fuente principal** de componentes animados.
+**OBLIGATORIO**: Usar Shadcn MCP Server para instalar componentes via registries externos.
+
+| Registry | URL | Tipo | Prioridad |
+|----------|-----|------|-----------|
+| **@animate-ui** | `https://animate-ui.com/r/{name}.json` | Componentes Shadcn con animaciones | **1º PREFERIDO** |
+| **@react-bits** | `https://reactbits.dev/r/{name}.json` | Componentes interactivos/efectos | **2º PREFERIDO** |
+| **@lucide-animated** | `https://lucide-animated.com/r/{name}.json` | Iconos animados (350+) | **PREFERIDO** |
+| **@prompt-kit** | `https://prompt-kit.com/c/{name}.json` | Chat/Prompt UI | **PREFERIDO** para agents |
+| **@shadcn** | Registry base | Componentes base estándar | Fallback |
 
-### Formato de Comandos
+### Configuracion MCP Server (Primera vez)
 
 ```bash
-# CORRECTO - Formato estandar con Bun
-bunx --bun shadcn@latest add @animate-ui/primitives-texts-sliding-number
-bunx --bun shadcn@latest add @animate-ui/primitives-button
-bunx --bun shadcn@latest add @animate-ui/primitives-card
+# En el directorio del proyecto
+npx shadcn@latest mcp init --client claude
 
-# CORRECTO - Componentes base Shadcn (cuando no exista en Animate UI)
-bunx --bun shadcn@latest add button
-bunx --bun shadcn@latest add card
-bunx --bun shadcn@latest add dialog
+# Esto genera .mcp.json en la raiz del proyecto:
+{
+  "mcpServers": {
+    "shadcn": {
+      "command": "npx",
+      "args": ["shadcn@latest", "mcp"]
+    }
+  }
+}
 
-# Ver registry disponible
-# https://ui.shadcn.com/docs/mcp
+# Reiniciar Claude Code y verificar con /mcp
 ```
 
-### Fuentes de Componentes
-
-| Fuente | Prefijo | Tipo | Prioridad |
-|--------|---------|------|-----------|
-| **Animate UI** | `@animate-ui/primitives-*` | Componentes con animaciones | **PREFERIDO** |
-| **Shadcn Registry** | `shadcn/*` | Componentes base estándar | Alternativa |
-| **Radix UI** | `@radix-ui/*` | Primitivas sin estilos | Solo si es necesario |
-
 ### Configuracion de components.json
 
+**OBLIGATORIO**: Agregar registries externos al `components.json`:
+
 ```json
 {
   "$schema": "https://ui.shadcn.com/schema.json",
@@ -1207,209 +1296,232 @@ bunx --bun shadcn@latest add dialog
   "rsc": false,
   "tsx": true,
   "tailwind": {
-    "config": "tailwind.config.ts",
+    "config": "",
     "css": "src/app/globals.css",
-    "baseColor": "neutral",
+    "baseColor": "zinc",
     "cssVariables": true,
     "prefix": ""
   },
+  "iconLibrary": "lucide",
   "aliases": {
     "components": "@/components",
     "utils": "@/lib/utils",
-    "ui": "@/components/ui"
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
   },
-  "registry": "https://ui.shadcn.com"
+  "registries": {
+    "@animate-ui": "https://animate-ui.com/r/{name}.json",
+    "@react-bits": "https://reactbits.dev/r/{name}.json",
+    "@lucide-animated": "https://lucide-animated.com/r/{name}.json",
+    "@prompt-kit": "https://prompt-kit.com/c/{name}.json"
+  }
 }
 ```
 
-### Patrones de Importacion
-
-```typescript
-// CORRECTO - Importar desde components/ui
-import { Button } from '@/components/ui/button';
-import { Card } from '@/components/ui/card';
-
-// CORRECTO - Componentes Animate UI
-import { SlidingNumber } from '@/components/ui/sliding-number';
-import { AnimatedCard } from '@/components/ui/animated-card';
-import { MorphingText } from '@/components/ui/morphing-text';
-
-// INCORRECTO - Importar directo desde node_modules
-import { Button } from '@radix-ui/react-button';
-```
-
-### Componentes Recomendados (Animate UI)
-
-| Componente | Prefijo | Uso |
-|-----------|---------|-----|
-| `sliding-number` | `@animate-ui/primitives-texts-*` | Números animados, contadores |
-| `morphing-text` | `@animate-ui/primitives-texts-*` | Texto que transforma entre valores |
-| `animated-card` | `@animate-ui/primitives-card*` | Tarjetas con animaciones de entrada |
-| `progress-reveal` | `@animate-ui/primitives-progress-*` | Progress con animación suave |
-| `slide-toggle` | `@animate-ui/primitives-toggle-*` | Switch con animación |
-
-### Componentes Base Shadcn (cuando Animate UI no disponible)
-
-```bash
-# Instalar componentes base esenciales
-bunx --bun shadcn@latest add button
-bunx --bun shadcn@latest add card
-bunx --bun shadcn@latest add input
-bunx --bun shadcn@latest add textarea
-bunx --bun shadcn@latest add accordion
-bunx --bun shadcn@latest add dialog
-bunx --bun shadcn@latest add dropdown-menu
-bunx --bun shadcn@latest add toast
-bunx --bun shadcn@latest add tooltip
-```
-
-### Inicializar Shadcn/UI (Primera vez)
+### Comandos de Instalacion
 
 ```bash
-# En el directorio del app (ej: apps/devenv-agent-ui)
-bunx --bun shadcn@latest init
+# 1º Animate UI (componentes Shadcn con animaciones - PREFERIDO)
+bunx --bun shadcn@latest add @animate-ui/sliding-number
+bunx --bun shadcn@latest add @animate-ui/morphing-text
+bunx --bun shadcn@latest add @animate-ui/animated-card
+bunx --bun shadcn@latest add @animate-ui/progress-reveal
 
-# Responder las preguntas:
-# - Style: new-york (recomendado)
-# - Base color: neutral
-# - CSS variables: true
-# - Tailwind config: tailwind.config.ts
-# - Components path: @/components
-# - Utils path: @/lib/utils
-```
+# 2º React Bits (efectos interactivos)
+bunx --bun shadcn@latest add @react-bits/fade-content
+bunx --bun shadcn@latest add @react-bits/magnet
+bunx --bun shadcn@latest add @react-bits/dock
 
-### Ejemplo Completo de Uso
+# 3º Iconos animados lucide-animated
+bunx --bun shadcn@latest add @lucide-animated/check-circle
+bunx --bun shadcn@latest add @lucide-animated/loader
+bunx --bun shadcn@latest add @lucide-animated/play
 
-```typescript
-// components/agent/MessageItem.tsx
-import { AnimatedCard } from '@/components/ui/animated-card';
-import { MorphingText } from '@/components/ui/morphing-text';
-import { SlidingNumber } from '@/components/ui/sliding-number';
-import type { IMessage } from './MessageItem.types';
+# 4º prompt-kit (chat/agent UI)
+bunx --bun shadcn@latest add @prompt-kit/prompt-input
+bunx --bun shadcn@latest add @prompt-kit/response-stream
 
-export function MessageItem({ message }: IMessageItemProps) {
-  return (
-    <AnimatedCard className="p-4">
-      <div className="flex items-center gap-2">
-        <MorphingText>{message.content}</MorphingText>
-        {message.progress && (
-          <SlidingNumber value={message.progress.percentage} />
-        )}
-      </div>
-    </AnimatedCard>
-  );
-}
+# 5º Shadcn base (solo si no hay alternativa animada)
+bunx --bun shadcn@latest add button card dialog
 ```
 
-### MCP para Buscar Componentes
+### Uso con Claude Code MCP
 
-```bash
-# Usar el MCP server de Shadcn para buscar componentes
-# Ver documentacion: https://ui.shadcn.com/docs/mcp
+Despues de configurar el MCP, usar prompts naturales:
 
-# Ejemplos de busqueda via MCP:
-# - "text animation components"
-# - "card with entrance animation"
-# - "progress with reveal effect"
 ```
+# React Bits
+"Show me all available backgrounds from @react-bits"
+"Add the Dither background from React Bits to the page, make it purple"
+"Add FadeContent from @react-bits for scroll animations"
 
----
-
-## REGLA 14: Iconos Animados - lucie-animated
+# lucide-animated
+"Show me all available icons from @lucide-animated"
+"Add the check-circle animated icon from lucide-animated"
 
-### Stack de Iconos
-
-**OBLIGATORIO**: lucie-animated como fuente principal para iconos animados.
-
-### Formato de Comandos
-
-```bash
-# CORRECTO - Formato estandar con Bun
-bunx --bun shadcn@latest add @lucie-animated/a-arrow-up
-bunx --bun shadcn@latest add @lucie-animated/arrow-down
-bunx --bun shadcn@latest add @lucie-animated/check-circle
-bunx --bun shadcn@latest add @lucie-animated/x-circle
+# Combinados
+"Create a hero section with FadeContent animation and animated icons"
 ```
 
-### Fuentes de Iconos
+### Componentes React Bits Recomendados
 
-| Fuente | Prefijo | Tipo | Prioridad |
-|--------|---------|------|-----------|
-| **lucie-animated** | `@lucie-animated/*` | Iconos animados | **PREFERIDO** |
-| **lucide-react** | `lucide-react` | Iconos estándar sin animar | Alternativa |
-| **Radix Icons** | `@radix-ui/icons` | Iconos Radix | Solo si es necesario |
+| Componente | Categoria | Uso |
+|-----------|-----------|-----|
+| `fade-content` | Animations | Fade in/out con scroll |
+| `text-pressure` | Text Effects | Texto con efecto presion |
+| `magnet` | Interactions | Efecto magnetico cursor |
+| `dock` | Components | Dock estilo macOS |
+| `tilted-card` | Components | Cards con tilt 3D |
+| `spotlight-card` | Components | Cards con spotlight |
+| `dither` | Backgrounds | Fondo con efecto dither |
+| `hyperspeed` | Backgrounds | Efecto velocidad |
 
-### Catalogo Disponible
+### Iconos lucide-animated Recomendados
 
-```bash
-# Ver catalogo completo en:
-# https://lucie-animated.com/
-
-# Iconos comunes disponibles:
-# - Flechas: a-arrow-up, a-arrow-down, a-arrow-left, a-arrow-right
-# - Acciones: check-circle, x-circle, plus-circle, minus-circle
-# - Navegacion: home, settings, user, bell, search
-# - Archivos: file, folder, download, upload
-# - Media: play, pause, volume, volume-x
-```
+| Icono | Uso |
+|-------|-----|
+| `check-circle` | Confirmacion, exito |
+| `x-circle` | Error, cerrar |
+| `loader` | Loading states |
+| `play` / `pause` | Media controls |
+| `arrow-up` / `arrow-down` | Navegacion |
+| `settings` | Configuracion |
+| `bell` | Notificaciones |
 
 ### Patrones de Importacion
 
 ```typescript
-// CORRECTO - Importar desde components/icons
-import { AArrowUp } from '@/components/icons/a-arrow-up';
-import { ArrowDown } from '@/components/icons/arrow-down';
+// CORRECTO - Componentes React Bits
+import { FadeContent } from '@/components/ui/fade-content';
+import { TextPressure } from '@/components/ui/text-pressure';
+import { Dock } from '@/components/ui/dock';
+
+// CORRECTO - Iconos animados lucide-animated
 import { CheckCircle } from '@/components/icons/check-circle';
-import { XCircle } from '@/components/icons/x-circle';
+import { Loader } from '@/components/icons/loader';
+
+// CORRECTO - Componentes base Shadcn
+import { Button } from '@/components/ui/button';
+import { Card } from '@/components/ui/card';
 
-// CORRECTO - Icono estatico (cuando no existe version animada)
+// CORRECTO - Iconos estaticos (fallback)
 import { Settings } from 'lucide-react';
 
-// INCORRECTO - Importar directo desde libreria
-import { AArrowUp } from '@lucie-animated/a-arrow-up';
+// INCORRECTO - Importar directo desde node_modules
+import { FadeContent } from 'react-bits';
 ```
 
-### Estructura de Carpeta
+### Estructura de Carpetas
 
 ```
 components/
-└── icons/
-    ├── a-arrow-up.tsx       # Icono animado
-    ├── arrow-down.tsx        # Icono animado
-    ├── check-circle.tsx      # Icono animado
-    └── index.ts              # Barrel export
+├── ui/                      # Componentes UI (Shadcn + React Bits)
+│   ├── button.tsx
+│   ├── card.tsx
+│   ├── fade-content.tsx     # React Bits
+│   ├── text-pressure.tsx    # React Bits
+│   ├── dock.tsx             # React Bits
+│   └── index.ts             # Barrel export
+├── icons/                   # Iconos animados (lucide-animated)
+│   ├── check-circle.tsx
+│   ├── loader.tsx
+│   ├── play.tsx
+│   └── index.ts             # Barrel export
+└── agent/                   # Componentes de dominio
+    └── ...
 ```
 
 ### Ejemplo Completo de Uso
 
 ```typescript
-// components/agent/AgentControls.tsx
-import { AArrowUp } from '@/components/icons/a-arrow-up';
-import { Play } from '@/components/icons/play';
+// components/agent/MessageItem.tsx
+import { FadeContent } from '@/components/ui/fade-content';
+import { Card } from '@/components/ui/card';
 import { CheckCircle } from '@/components/icons/check-circle';
-import type { IAgentControlsProps } from './AgentControls.types';
+import { Loader } from '@/components/icons/loader';
+import type { IMessageItemProps } from './MessageItem.types';
 
-export function AgentControls({ isRunning, onExecute }: IAgentControlsProps) {
+export function MessageItem({ message, isLoading }: IMessageItemProps) {
   return (
-    <div className="flex gap-2">
-      <button onClick={onExecute}>
-        {isRunning ? (
-          <CheckCircle className="w-5 h-5" />
-        ) : (
-          <Play className="w-5 h-5" />
-        )}
-      </button>
-      <AArrowUp className="w-5 h-5 animate-bounce" />
-    </div>
+    <FadeContent direction="up" duration={0.4}>
+      <Card className="p-4">
+        <div className="flex items-center gap-2">
+          {isLoading ? (
+            <Loader className="w-5 h-5 animate-spin" />
+          ) : (
+            <CheckCircle className="w-5 h-5 text-green-500" />
+          )}
+          <span>{message.content}</span>
+        </div>
+      </Card>
+    </FadeContent>
   );
 }
 ```
 
+### Debug MCP
+
+```bash
+# En Claude Code, usar /mcp para verificar conexion
+/mcp
+
+# Debe mostrar "shadcn" en la lista de servers activos
+# Si hay problemas, reiniciar Claude Code
+```
+
 ### Referencias
 
-- **lucie-animated Gallery**: https://lucie-animated.com/
-- **lucide-react Documentation**: https://lucide.dev/
-- **Shadcn Icons**: https://ui.shadcn.com/docs/components/icon
+- **React Bits**: https://reactbits.dev/
+- **lucide-animated**: https://lucide-animated.com/
+- **Shadcn MCP**: https://ui.shadcn.com/docs/mcp
+- **Shadcn Registry**: https://ui.shadcn.com/
+
+---
+
+## REGLA 14: Package UI Compartido
+
+### Estructura del Package UI
+
+El monorepo tiene un package UI compartido en `core/packages/ui/` para componentes reutilizables:
+
+```
+core/packages/ui/
+├── src/
+│   ├── components/
+│   │   ├── ui/              # Componentes Shadcn + React Bits
+│   │   ├── icons/           # Iconos lucide-animated
+│   │   └── agent/           # Componentes de dominio
+│   ├── lib/
+│   │   └── utils.ts         # cn() y utilidades
+│   ├── hooks/               # Hooks compartidos
+│   └── index.ts             # Barrel export
+├── components.json          # Config Shadcn con registries
+├── package.json
+├── rolldown.config.ts
+└── tsconfig.json
+```
+
+### Uso del Package UI
+
+```typescript
+// Importar desde el package compartido
+import { Button, Card, FadeContent } from 'mks-dev-environment/ui';
+import { CheckCircle, Loader } from 'mks-dev-environment/ui/icons';
+import { cn } from 'mks-dev-environment/ui/lib/utils';
+```
+
+### Instalacion de Componentes en Package UI
+
+```bash
+# Ir al directorio del package UI
+cd core/packages/ui
+
+# Instalar componentes (se guardan en src/components/ui/)
+bunx --bun shadcn@latest add @react-bits/fade-content
+bunx --bun shadcn@latest add @lucide-animated/check-circle
+bunx --bun shadcn@latest add button card
+```
 
 ### Referencias
 
@@ -1707,8 +1819,9 @@ Glassmorphism es la combinación controlada de:
 - **Oxlint** - https://oxlint.com/
 - **Zustand** - https://zustand-demo.pmnd.rs/
 - **Shadcn/UI** - https://ui.shadcn.com/
-- **Animate UI** - https://animate.ui/
-- **lucie-animated** - https://lucie-animated.com/
+- **Shadcn MCP** - https://ui.shadcn.com/docs/mcp
+- **React Bits** - https://reactbits.dev/
+- **lucide-animated** - https://lucide-animated.com/
 
 ### Documentación en Dotfiles