Hydra UI CLI

A beautiful, modern CLI tool for managing React UI components with stunning terminal styling and gradient effects.

✨ Features

• 🎨 Beautiful Terminal UI - Modern styling with gradients, boxes, and colors
• 🚀 Simple Setup - Initialize Hydra UI in your existing projects
• 📦 Component Management - Add components from your repository
• 🔍 Smart Discovery - List available components with status indicators
• ⚡ Fast & Reliable - Built with TypeScript and modern Node.js

🚀 Quick Start

Installation

npm install -g hydra-ui-cli

Initialize in Your Project

# Navigate to your existing React project
cd my-react-app

# Initialize Hydra UI
hydra-ui init

Add Components

# List available components
hydra-ui list

# Add a component
hydra-ui add Button

📋 Commands

| Command | Description | |---------|-------------| | hydra-ui init | Initialize Hydra UI in your existing project | | hydra-ui list | List all available components with beautiful styling | | hydra-ui add <component> | Add a component to your project | | hydra-ui version --verbose | Show detailed version information | | hydra-ui help | Show beautiful welcome screen and help |

🎨 Beautiful Terminal Experience

The CLI features stunning visual design:

• Gradient ASCII logos with modern fonts
• Color-coded status messages (success, error, info)
• Boxed content with rounded borders
• Step-by-step instructions with icons
• Professional styling throughout

🏗️ Repository Structure

Your component repository should follow this structure:

your-repo/
├── components/
│   ├── Button/
│   │   ├── Button.tsx
│   │   ├── types.ts
│   │   └── index.ts
│   ├── Card/
│   │   ├── Card.tsx
│   │   ├── types.ts
│   │   └── index.ts
│   └── Modal/
│       ├── Modal.tsx
│       ├── types.ts
│       └── index.ts
└── README.md

⚙️ Configuration

After running hydra-ui init, a hydra-ui.json file is created:

{
  "componentsDir": "./src/components",
  "registry": "https://hydra-ui.dev/registry"
}

🎯 Usage Examples

# Initialize Hydra UI in your project
hydra-ui init

# List all available components
hydra-ui list

# Add components to your project
hydra-ui add Button
hydra-ui add Card
hydra-ui add Modal

# Add to custom directory
hydra-ui add Button --directory src/ui

# Show version with system info
hydra-ui version --verbose

🛠️ Development

# Clone the repository
git clone https://github.com/your-username/hydra-ui-cli.git
cd hydra-ui-cli

# Install dependencies
npm install

# Build the project
npm run build

# Link globally for testing
npm link

# Run in development
npm run dev

📦 Package Info

• Size: ~19KB (compressed)
• Dependencies: Minimal, focused on core functionality
• Node.js: Requires Node.js 16.0.0 or higher
• License: MIT

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

Built with ❤️ for developers who love beautiful terminal experiences! ✨