UTRA Hacks Design System CLI

CLI for installing UTRA Hacks Design System components into your project.

Installation

Use npx to run commands without installing:

npx @utrahacks/ui init

Usage

Initialize

Set up your project:

npx @utrahacks/ui init

Creates:

• utrahacks.config.json configuration file
• Component directories
• Utility functions
• Global styles

Add Components

# Add specific components
npx @utrahacks/ui add button card

# Add all components
npx @utrahacks/ui add --all

# Skip confirmation prompts
npx @utrahacks/ui add button -y

Check for Updates

# List installed components
npx @utrahacks/ui diff

# Check specific component
npx @utrahacks/ui diff button

Configuration

utrahacks.config.json:

{
  "style": "default",
  "tsx": true,
  "paths": {
    "ui": "components/ui",
    "utils": "utils",
    "css": "styles/globals.css"
  }
}

Requirements

• Node.js 16+
• React 18 or 19
• Tailwind CSS v4

Framework Support

Works with:

• Vite
• Next.js
• Create React App
• React Router v7
• Any React-based framework

License

MIT