Installation Guide

Get started with PacmanUI in just a few steps

1. Install Base Package

Start by installing the base PacmanUI package

pnpm → pnpm add pacmanui
npm  → npm install pacmanui

2. List Available Components

View all available components

pnpm → pnpm dlx pacmanui list
npm  → npx pacmanui list

3. Install Components

Install only the components you need

pnpm → pnpm dlx pacmanui add <component>
npm  → npx pacmanui add <component>

Usage Example

import { Accordion } from '@/components/pacmanui/accordion'
import { DatePicker } from '@/components/pacmanui/date-picker'
import { Toast } from '@/components/pacmanui/toast'

export default function HomePage() {
  const accordionItems = [
    {
      title: "What is PacmanUI?",
      content: "PacmanUI is a beautiful and modular React component library with component-by-component installation."
    },
    {
      title: "Why choose PacmanUI?",
      content: "PacmanUI offers beautiful animations, dark mode support, and highly customizable components."
    }
  ]

  return (
    <div>
      <Accordion items={accordionItems} variant="card" allowMultiple={false} />
      
      <DatePicker
        onChange={(date) => console.log(date)}
        placeholder="Select a date"
      />

      <Toast
        title="Success!"
        description="Component installed successfully"
        variant="success"
      />
    </div>
  )
}

Get Started