valknar/pastel-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
a109a1862798f6fd43bda85ee0733dcac0b5c221
pastel-ui/package.json

63 lines
1.9 KiB
JSON
Raw Normal View History

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>
2025-11-07 10:55:42 +01:00
{
"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",
feat: implement missing features and improvements Add comprehensive feature set and fixes: **Theme Improvements:** - Fix theme flickering by adding blocking script in layout - Prevents FOUC (Flash of Unstyled Content) - Smooth transitions between light and dark modes **Tailwind CSS v4 Migration:** - Convert globals.css to Tailwind CSS v4 format - Use @import "tailwindcss" instead of @tailwind directives - Implement @theme block with OkLCH color space - Add @plugin directives for forms and typography - Use :root and .dark class-based theming - Add all custom animations in CSS - Create postcss.config.mjs with @tailwindcss/postcss **Dev Environment:** - Add .env.local with API on port 3001 - Add dev:api and dev:all scripts to package.json - Create .env for API with port 3001 configuration - Enable running both UI and API simultaneously **New Features Implemented:** 1. **Harmony Palettes** (app/palettes/harmony/page.tsx) - Generate color harmonies based on color theory - Support for 6 harmony types: - Monochromatic - Analogous (±30°) - Complementary (180°) - Split-complementary - Triadic (120° spacing) - Tetradic/Square (90° spacing) - Uses complement and rotate API endpoints - Export harmonies in multiple formats 2. **Color Blindness Simulator** (app/accessibility/colorblind/page.tsx) - Simulate 3 types of color blindness: - Protanopia (red-blind, ~1% males) - Deuteranopia (green-blind, ~1% males) - Tritanopia (blue-blind, rare) - Side-by-side comparison of original vs simulated - Support for multiple colors (up to 10) - Educational information about each type - Accessibility tips and best practices 3. **Batch Operations** (app/batch/page.tsx) - Process up to 100 colors at once - Text input (line-separated or comma-separated) - 5 operations supported: - Lighten/Darken - Saturate/Desaturate - Rotate hue - Adjustable amount slider - Export processed colors - Live validation and color count **API Query Hooks:** - Add useSimulateColorBlindness hook - Add useTextColor hook - Export ColorBlindnessRequest and TextColorRequest types **Files Added:** - postcss.config.mjs - .env.local - ../pastel-api/.env - app/accessibility/colorblind/page.tsx - app/palettes/harmony/page.tsx **Files Modified:** - app/globals.css (Tailwind v4 migration) - app/layout.tsx (theme flicker fix) - app/batch/page.tsx (functional implementation) - lib/api/queries.ts (new hooks) - package.json (dev scripts) - tailwind.config.ts (simplified, CSS-first) All features build successfully and are ready for testing. Development server can now run with API via `pnpm dev:all`. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-07 13:47:16 +01:00
"dev:api": "cd ../pastel-api && cargo run",
"dev:all": "pnpm run dev:api & pnpm run dev",
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>
2025-11-07 10:55:42 +01:00
"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",
chore: upgrade to Next.js 16.0.1 with Turbopack Update from Next.js 15.5.6 to Next.js 16.0.1: - Now using Turbopack for production builds - TypeScript config automatically updated (jsx: react-jsx) - Build time improved with Turbopack - All features working correctly Build successful with Next.js 16 + Turbopack! 🚀 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-07 11:01:36 +01:00
"next": "^16.0.1",
"react": "^19.2.0",
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>
2025-11-07 10:55:42 +01:00
"react-colorful": "^5.6.1",
chore: upgrade to Next.js 16.0.1 with Turbopack Update from Next.js 15.5.6 to Next.js 16.0.1: - Now using Turbopack for production builds - TypeScript config automatically updated (jsx: react-jsx) - Build time improved with Turbopack - All features working correctly Build successful with Next.js 16 + Turbopack! 🚀 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-07 11:01:36 +01:00
"react-dom": "^19.2.0",
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>
2025-11-07 10:55:42 +01:00
"sonner": "^1.7.1",
"tailwind-merge": "^2.5.5",
"zustand": "^5.0.2"
},
"devDependencies": {
"@playwright/test": "^1.49.1",
"@tailwindcss/forms": "^0.5.9",
fix: tailwind
2025-11-07 13:32:17 +01:00
"@tailwindcss/postcss": "^4.1.17",
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>
2025-11-07 10:55:42 +01:00
"@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"
}
}
Reference in New Issue Copy Permalink