blackboard-ui

CLI for adding BlackBoard UI components to your project.

Usage

Initialize your project

npx blackboard-ui@latest init

This will:

• Create a blackboard.json config file
• Add the cn() utility function
• Inject BlackBoard CSS variables into your globals.css

Add components

npx blackboard-ui@latest add button

Add multiple components at once:

npx blackboard-ui@latest add button badge input select

Add all available components:

npx blackboard-ui@latest add --all

Available Components

| Component | Description | | ---------- | ---------------------------------------- | | accordion | Collapsible content sections | | badge | Status labels and indicators | | button | Primary actions with 6 variants | | checkbox | Boolean selections with labels | | field | Form layout primitives | | input | Text fields with validation | | select | Dropdown menus with groups | | textarea | Multiline text inputs | | tooltip | Contextual hover information |

Options

init

| Flag | Description | | ------------ | ------------------------------ | | -y, --yes | Skip prompts, use defaults | | -c, --cwd | Set working directory |

add

| Flag | Description | | ----------------- | ------------------------------ | | -a, --all | Add all components | | -y, --yes | Skip confirmation prompts | | -o, --overwrite | Overwrite existing files | | -c, --cwd | Set working directory |

Configuration

The blackboard.json file stores your project config:

{
  "style": "default",
  "tailwind": {
    "css": "src/app/globals.css"
  },
  "aliases": {
    "components": "@/components/ui",
    "utils": "@/lib/utils"
  }
}

License

MIT