🌟 Features

• 🎯 Copy-Paste & Package Hybrid Architecture: Either copy component sources into your project with npx @alexourus/ui add and customize them, or import them directly as a package via npm i @alexourus/ui.
• ⚡ Built-in CLI: Zero extra packages required to configure your project (npx @alexourus/ui init) and add components (npx @alexourus/ui add button).
• ♿ Accessibility (WCAG 2.1 AA): Built on top of Radix UI primitives with full keyboard navigation and screen reader support.
• 🎨 Rich Theming Support: 7 vibrant theme palettes, 5 radius presets, and full CSS Variables-driven Dark Mode.
• 🧱 49+ Components & SaaS Blocks: Complete set from base primitives (Button, Dialog, InputOTP) to composite SaaS blocks (CookieNotice, PricingTable, AuthCard, DataTable).

🚀 Method 1: Using via CLI (Recommended)

To copy component source codes directly into your project's components/ui directory:

Step 1: Initialize Your Project (Init)

# npm / npx
npx @alexourus/ui init

# pnpm
pnpm dlx @alexourus/ui init

# bun
bunx @alexourus/ui init

Step 2: Add Components (Add)

# Add single or multiple components
npx @alexourus/ui add button card dialog alert input-otp pricing-table

# Add using interactive multi-select picker
npx @alexourus/ui add

# Add all components at once
npx @alexourus/ui add --all

📦 Method 2: Using as a Standard NPM Package

You can also install the package and import components directly in your app:

pnpm add @alexourus/ui
# or
npm install @alexourus/ui
# or
bun add @alexourus/ui

import { Button, Card, CardHeader, CardTitle, CardContent } from "@alexourus/ui";

export default function Example() {
  return (
    <Card className="max-w-sm">
      <CardHeader>
        <CardTitle>alexourus-ui</CardTitle>
      </CardHeader>
      <CardContent className="space-y-4">
        <p className="text-sm text-muted-foreground">Ready for your modern web projects.</p>
        <Button variant="default" className="w-full">Get Started</Button>
      </CardContent>
    </Card>
  );
}

💻 CLI Commands Summary

| Command | Description | |---|---| | npx @alexourus/ui init | Analyzes project, creates components.json, and injects theme CSS variables. | | npx @alexourus/ui add <name> | Copies the specified component to your project and installs required npm dependencies. | | npx @alexourus/ui add --all | Copies all available components and blocks to your project at once. | | npx @alexourus/ui list | Lists all available components and blocks in the library. |

📄 License

This project is licensed under the MIT license.

Developed by Alexourus 🐺