Symfony TUI Component Examples

This repository contains a bleeding-edge example project demonstrating the capabilities of the experimental symfony/tui component.

The symfony/tui component shifts PHP CLI development from an immediate mode (manually redrawing lines) to a retained mode architecture. It is built on top of PHP Fibers and the Revolt event loop, enabling a fully concurrent, non-blocking terminal UI.

Requirements

• PHP 8.4+ (Required for Fibers and modern language features)
• Composer

Installation

Because symfony/tui has not yet been merged into the Symfony mainline repository, this project installs it directly from Fabien Potencier's experimental tui branch.

1. Clone the repository:

   git clone https://github.com/mattleads/TuiComponent.git
   cd TuiComponent

2. Install dependencies:

   composer install

   (Note: This project is pre-configured to clone the experimental Symfony branch into vendor-src/ and map it as a local path repository).

Included Demonstrations

1. The Server Dashboard (app:server-dashboard)

A simple, reactive list widget demonstrating state changes and event listeners.

php bin/console app:server-dashboard

Features Demonstrated:

• SelectListWidget initialization and configuration.
• Listening to SelectEvent to update a TextWidget header reactively.
• Using Padding and Border objects in the StyleSheet.
• Handling CancelEvent (pressing Esc or Ctrl+C) to exit the TUI gracefully.

2. Comprehensive Widgets Demo (app:widgets-demo)

A fully-featured demo simulating a tabbed interface (using a sidebar) to showcase every available widget in the component.

php bin/console app:widgets-demo

Features Demonstrated:

Navigation & Focus Management

• Simulated vertical tabs using a SelectListWidget bound to a ContainerWidget's SelectionChangeEvent.
• Custom TAB and Shift+TAB keybindings for navigating between focusable widgets (overriding the default F6).
• Dynamic styling based on FocusEvent (e.g., highlighting the active window pane cyan).

Available Widgets

1. TextWidget & FIGlet: Demonstrates rendering standard text and large ASCII art banners using bundled FIGlet fonts (e.g., font: 'slant').
2. InputWidget: A single-line text field. Includes custom logic to hide/restore placeholder text on focus/blur.
3. EditorWidget: A fully functional multi-line text editor with word wrap, kill-ring, and scrolling.
4. SettingsListWidget: A preference panel allowing users to cycle through predefined values (e.g., Theme: Dark/Light).
5. MarkdownWidget: Renders CommonMark markdown with full syntax highlighting (requires league/commonmark and tempest/highlight).
6. Loaders & ProgressBarWidget: Demonstrates background operations running concurrently via the Revolt EventLoop. Includes custom styling for the progress bar to differentiate filled/empty states.