open-index/open-npm huggingface dataset:
npm package: @nanonansen2/nook-design-system
Description: A comprehensive, themeable design system for React applications built with Radix UI primitives and Framer Motion animations.
Latest version: 0.0.4

# Nook Design System

A comprehensive, themeable design system for React applications built with Radix UI primitives and Framer Motion animations.

## Features

- 🎨 Themeable components with SCSS modules and CSS variables
- ♿️ Accessible components built on Radix UI primitives
- 🎭 Smooth animations powered by Framer Motion
- 📦 Tree-shakeable ESM package
- 🔒 Type-safe with full TypeScript support
- 📱 Responsive and mobile-first design

## Installation

```bash
npm install @nanonansen2/nook-design-system
```

## Usage

```tsx
import { Button, Input } from '@nanonansen2/nook-design-system'

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

## Available Components

- Button
- Input
- More components coming soon...

## Development

### Setup

1. Clone the repository
2. Install dependencies:

```bash
npm install
```

### Development Commands

- `npm run dev` - Start development server
- `npm run build` - Build the library
- `npm run storybook` - Start Storybook development server
- `npm run lint` - Run ESLint
- `npm run build-storybook` - Build Storybook for production

### Project Structure

```
lib/
  ├── components/     # React components
  ├── tokens/         # Design tokens
  ├── utils/         # Utility functions
  └── main.ts        # Main entry point
```

### Contributing

1. Create a new branch from `main`
2. Make your changes
3. Submit a pull request

Please follow our commit message convention:

- `fix:` for bug fixes
- `feat:` for new features
- `docs:` for documentation changes
- `style:` for formatting changes
- `refactor:` for code refactoring
- `test:` for adding tests
- `chore:` for maintenance tasks

## License

MIT © [Nook Design System]