feat: initial Next.js 15 implementation with TypeScript and Tailwind CSS 4

Add complete project structure and foundation:

**Core Setup:**
- Next.js 15.5.6 with App Router and React 19
- TypeScript 5.7 with strict mode
- Tailwind CSS 4.1 with custom theme configuration
- ESLint and Prettier configuration

**Dependencies Installed:**
- @tanstack/react-query - Server state management
- zustand - Client state management
- framer-motion - Animations
- lucide-react - Icon library
- react-colorful - Color picker component
- cmdk - Command palette
- sonner - Toast notifications
- clsx + tailwind-merge - Class name utilities

**Project Structure:**
- app/ - Next.js App Router pages
- components/ - React components (ui, color, tools, layout, providers)
- lib/ - Utilities, API client, hooks, stores, constants
- tests/ - Unit and E2E test directories

**API Integration:**
- Type-safe Pastel API client with all 21 endpoints
- Complete TypeScript type definitions for requests/responses
- Error handling and response types

**UI Components:**
- Button component with variants (default, outline, ghost, destructive)
- Input component with focus states
- Providers wrapper (React Query, Toast)
- Root layout with Inter font and metadata

**Pages:**
- Home page with gradient hero and feature cards
- Links to playground and palette generation (pages pending)

**Configuration:**
- Tailwind with HSL color variables for theming
- Dark/light mode CSS variables
- Custom animations (fade-in, slide-up, slide-down)
- @tailwindcss/forms and @tailwindcss/typography plugins

Build successful: 102 kB First Load JS, static generation working.

Ready for color components and playground implementation.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
valknarness
2025-11-07 10:55:42 +01:00
parent c544fbb6f2
commit bd05f109b4
16 changed files with 6085 additions and 0 deletions

59
package.json Normal file
View File

@@ -0,0 +1,59 @@
{
"name": "pastel-ui",
"version": "0.1.0",
"private": true,
"description": "Modern web UI for color manipulation, palette generation, and accessibility analysis",
"author": "valknarness",
"license": "MIT",
"packageManager": "pnpm@10.20.0",
"scripts": {
"dev": "next dev",
"dev:turbo": "next dev --turbopack",
"build": "next build",
"start": "next start",
"lint": "next lint",
"lint:fix": "next lint --fix",
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,css,md}\"",
"type-check": "tsc --noEmit",
"test": "vitest",
"test:ui": "vitest --ui",
"test:e2e": "playwright test",
"test:e2e:ui": "playwright test --ui",
"analyze": "ANALYZE=true next build"
},
"dependencies": {
"@tanstack/react-query": "^5.62.11",
"clsx": "^2.1.1",
"cmdk": "^1.0.4",
"framer-motion": "^11.15.0",
"lucide-react": "^0.468.0",
"next": "^15.1.3",
"react": "^19.0.0",
"react-colorful": "^5.6.1",
"react-dom": "^19.0.0",
"sonner": "^1.7.1",
"tailwind-merge": "^2.5.5",
"zustand": "^5.0.2"
},
"devDependencies": {
"@playwright/test": "^1.49.1",
"@tailwindcss/forms": "^0.5.9",
"@tailwindcss/typography": "^0.5.15",
"@testing-library/react": "^16.1.0",
"@testing-library/user-event": "^14.5.2",
"@types/node": "^22.10.2",
"@types/react": "^19.0.1",
"@types/react-dom": "^19.0.2",
"@typescript-eslint/eslint-plugin": "^8.46.3",
"@typescript-eslint/parser": "^8.46.3",
"@vitest/ui": "^2.1.8",
"eslint": "^9.17.0",
"eslint-config-next": "^15.1.3",
"postcss": "^8.4.49",
"prettier": "^3.4.2",
"tailwindcss": "^4.0.0",
"typescript": "^5.7.2",
"vitest": "^2.1.8",
"webpack-bundle-analyzer": "^4.10.2"
}
}