Skip to content

Conversation

@pyramation
Copy link
Contributor

feat(inquirerer): add event-driven UI engine for custom prompts

Summary

Adds a new ui module to inquirerer that provides an event-driven engine for building rich terminal interfaces. This enables developers to create custom interactive UIs beyond the standard prompt types.

New components:

  • UIEngine - Core engine with render/reducer pattern for custom screens
  • Spinner - Animated loading spinner with multiple styles (dots, line, arc, etc.)
  • ProgressBar - Visual progress indicator for operations with known completion
  • StreamingText - AI-style streaming text display with cursor animation
  • interactiveUpgrade - pnpm-style interactive dependency upgrade UI

Demo scripts:

  • pnpm dev:spinner - Demonstrates spinner styles and states
  • pnpm dev:chat - Simulates AI chat with streaming responses
  • pnpm dev:upgrade - Interactive package upgrade selection

Review & Testing Checklist for Human

  • Run all three demos manually (pnpm dev:spinner, pnpm dev:chat, pnpm dev:upgrade) - these were only briefly tested and the upgrade demo wasn't tested at all
  • Verify terminal cleanup - After running demos, ensure cursor is visible and terminal is in normal state. Also test CTRL+C during each demo to verify cleanup on interrupt
  • Test upgrade UI edge cases - Type a filter that matches nothing, navigate with arrow keys, verify no crashes (similar to the checkbox bug we fixed earlier)
  • Review the empty dispatch method in engine.ts (line 218) - it's a stub for future async event dispatch
  • Note: No automated tests were added for this new feature

Recommended test plan:

  1. Run pnpm build in the inquirerer package
  2. Run each demo script and interact with it
  3. Press CTRL+C during each demo to verify cleanup
  4. In the upgrade demo, try filtering, selecting packages, and pressing ESC to cancel

Notes

  • The package.json has a minor indentation change in the scripts section
  • The Spinner class accepts a UIEngine in constructor but doesn't use it (may be for future extensibility)
  • This is ~1600 lines of new code without unit tests - consider adding tests before publishing

Link to Devin run: https://app.devin.ai/sessions/e424b0eaba2f4789815bb0cc22ca6233
Requested by: Dan Lynch (@pyramation)

- Add UIEngine class for building custom interactive terminal UIs
- Add Spinner component with multiple styles (dots, line, arc, etc.)
- Add ProgressBar component for operations with known completion
- Add StreamingText component for AI-style streaming output
- Add interactiveUpgrade component for pnpm-style dependency upgrades
- Add demo scripts: dev:spinner, dev:chat, dev:upgrade
- Export all UI components from main index

This enables developers to build rich terminal interfaces with:
- Custom rendering via render(state) function
- Event-driven updates (key events, timers, async data)
- Animated spinners and progress bars
- Streaming text display with cursor animation
- Interactive multi-select with filtering
@devin-ai-integration
Copy link

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment and CI monitoring

@pyramation pyramation merged commit 90b2c1b into main Dec 27, 2025
36 checks passed
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.

2 participants