Skip to content

feat(cli): modernize CLI UI and improve user experience#18

Closed
CarlosEduJs wants to merge 2 commits intomainfrom
feat/cli-ui-improvements
Closed

feat(cli): modernize CLI UI and improve user experience#18
CarlosEduJs wants to merge 2 commits intomainfrom
feat/cli-ui-improvements

Conversation

@CarlosEduJs
Copy link
Copy Markdown
Owner

Summary

  • Modernized CLI UI with enhanced visual components (colors, boxes, tables, gradients)
  • Improved help system with custom formatter, emojis, and examples
  • Centralized error handling with visual error boxes
  • Added new watch command for auto-regeneration on config changes
  • Enhanced clipboard integration with auto-copy functionality
  • Updated all commands to use new UI system

Key Changes

UI System (commit 6734290)

  • Created comprehensive UI theme with colors, icons, and emojis
  • Added visual components: banners, sections, color previews, info/error boxes
  • Implemented table creators for palette, typography, spacing, shadows, and contrast data
  • Added preview renderers for all token types with WCAG compliance badges
  • Created progress/spinner system with category-specific feedback
  • Implemented clipboard utilities with automatic copy and user feedback

Help & Error Handling (commit 7b559a4)

  • Added custom help formatter with colors, emojis, and usage examples
  • Created centralized error handling system with typed CLIError class
  • Added visual error boxes for better error visibility
  • Implemented validation error handlers with "Received vs Expected" format
  • Updated all generate commands to use new error system

New Features

  • Watch command: Auto-regenerate tokens when config file changes
  • Auto-copy to clipboard: Generated tokens automatically copied with feedback
  • WCAG visual indicators: Color-coded badges for AA/AAA compliance levels

Technical Details

  • Version bumped to 0.3.0
  • New dependencies: boxen, cli-table3, gradient-string, clipboardy, chokidar
  • Updated TypeScript config for proper build output
  • All code formatted with Biome
  • Zero TypeScript errors

Testing

  • ✅ Build succeeds
  • ✅ Help system displays correctly
  • ✅ Error handling works as expected
  • ✅ All generate commands work with new UI
  • ✅ Clipboard functionality tested

- Add enhanced UI components with colors, emojis, icons and gradients
- Implement rich table displays for all token types
- Add visual color previews and WCAG contrast badges
- Create progress spinners with category-specific feedback
- Add automatic clipboard copy for generated tokens
- Implement watch mode for live token regeneration
- Add banner, boxes and better visual hierarchy
- Update version to 0.3.0
- Add dependencies: boxen, cli-table3, gradient-string, clipboardy, chokidar

BREAKING CHANGE: Clipboard now copies automatically without prompt
- Add custom help formatter with colors, emojis, and examples
- Add centralized error handling with visual error boxes
- Add typed CLIError class for better error categorization
- Update all generate commands to use new error handlers
- Remove duplicate validation code in gradient command
- Clean up unused imports (emojis from generate.ts)
@CarlosEduJs
Copy link
Copy Markdown
Owner Author

Fechando para reabrir com a branch base correta (release/cli-v0.3.0)

@CarlosEduJs CarlosEduJs closed this Feb 6, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant