1.0.1 • Published 7 months ago

@nick-w3/ui v1.0.1

Weekly downloads
-
License
AGPL-3.0
Repository
github
Last release
7 months ago

@nick-w3/ui

Core UI component library, built with React, Tailwind CSS, and Storybook.

Overview

This package contains all shared UI components, hooks, and utilities. It provides a consistent design language and component API to ensure cohesive user experiences.

Features

  • šŸŽØ 60+ Production-ready components
  • šŸ“š Comprehensive Storybook documentation
  • šŸŒ— Dark mode support
  • ā™æļø Accessible components
  • šŸŽÆ TypeScript support
  • šŸ”„ Form handling utilities
  • šŸŽ­ Testing utilities
  • šŸ“± Responsive design

Structure

.
ā”œā”€ā”€ src/
│   ā”œā”€ā”€ components/        # High-level components
│   ā”œā”€ā”€ features/         # Feature-specific components
│   │   ā”œā”€ā”€ application/  # Application components
│   │   ā”œā”€ā”€ checker/      # Checker components
│   │   ā”œā”€ā”€ pool/         # Pool components
│   │   ā”œā”€ā”€ program/      # Program components
│   │   ā”œā”€ā”€ project/      # Project components
│   │   └── retrofunding/ # Retrofunding components
│   ā”œā”€ā”€ hooks/            # Shared hooks
│   ā”œā”€ā”€ lib/             # Utilities and helpers
│   ā”œā”€ā”€ primitives/      # Base components
│   ā”œā”€ā”€ theme/           # Theme configuration
│   ā”œā”€ā”€ types/           # TypeScript types
│   └── ui-shadcn/       # Shadcn UI components

Installation

pnpm add @nick-w3/ui

Usage

import { Button, Input } from '@nick-w3/ui'
import '@nick-w3/ui/styles.css'

function MyComponent() {
  return (
    <div>
      <Input placeholder="Enter text..." />
      <Button>Click me</Button>
    </div>
  )
}

Development

# Start Storybook
pnpm dev

# Build package
pnpm build

# Run tests
pnpm test

# Generate new component
pnpm generate-component ComponentName

Available Exports

Components

  • Primitives (Button, Input, Select, etc.)
  • Layout components
  • Navigation components
  • Form components
  • Data display components
  • Feedback components

Features

  • Application management
  • Project evaluation
  • Pool management
  • Program administration
  • Retrofunding interfaces

Hooks

  • useCredentialVerification
  • useIndexedDB
  • usePersistForm
  • useToast

Utilities

  • Date formatting
  • Icon utilities
  • IndexedDB helpers
  • SSR utilities

Documentation

Contributing

  1. Create a new branch
  2. Make your changes
  3. Add or update tests
  4. Add or update Storybook stories
  5. Submit a PR

License

AGPL-3.0 - see the LICENSE file for details.