@bizjs/iui

Ant-like UI component library based on shadcn/ui and Tailwind CSS v4.

Features

• 🎨 Dual Export Strategy: Primitives (shadcn原始组件) + Components (ant-like封装组件)
• 🎯 Flexible Styling: Support both styles and classNames props
• 🌗 Dark Mode: Built-in dark mode support with CSS variables
• 📦 TypeScript: Full TypeScript support with strict mode
• ⚡ Modern Stack: Vite 7.x + Tailwind CSS v4 + React 18+

Installation

pnpm add @bizjs/iui

Quick Start

import { Button } from '@bizjs/iui'
import '@bizjs/iui/styles'

function App() {
  return (
    <Button type="primary">Click me</Button>
  )
}

Usage

Using Ant-like Components

import { Card } from '@bizjs/iui'

<Card 
  title="Card Title"
  styles={{ content: { padding: 32 } }}
  classNames={{ header: 'bg-blue-50' }}
>
  Card content
</Card>

Using Primitives

import { Button } from '@bizjs/iui/primitives'

<Button variant="default">Primitive Button</Button>

Development

# Install dependencies
pnpm install

# Start development server
pnpm dev

# Build library
pnpm build

# Start documentation
pnpm docs:dev

Project Structure

@bizjs/iui/
├── src/
│   ├── primitives/      # shadcn original components
│   ├── components/      # ant-like wrapped components
│   ├── styles/          # CSS variables and themes
│   ├── hooks/           # React hooks (useTheme, etc.)
│   └── utils/           # Utility functions
├── docs/                # VitePress documentation
└── plans/               # Architecture and implementation guides

Documentation

See the plans directory for detailed architecture and implementation guides:

• Architecture Design
• Implementation Guide
• Key Principles
• Component Customization Guide

License

MIT