What problem does it solve?
GPUI developers often face fragmented UI patterns, leading to inconsistent interfaces and slower delivery. This Skill provides a curated set of reusable UI patterns for GPUI applications, enabling teams to compose complex components with confidence and consistency.
Core Features & Use Cases
- Modal/Overlay Pattern: quick, accessible overlays for dialogs and lightboxes.
- List Pattern: dynamic, data-driven lists with efficient rendering and actions.
- Form Pattern: structured forms with validation, layout, and feedback.
- Global State Pattern: shared application state to synchronize components.
- Parent-Child Communication: event-driven coordination between components.
- Tab Navigation: tabbed interfaces with clean content switching.
- Loading State Pattern: asynchronous data loading with clear UX states.
- Dropdown Pattern: contextual menus and options.
- Production Component Patterns: reusable, production-ready components.
- Size System Pattern: responsive sizing for consistent UIs.
- Focus Management Pattern: keyboard focus handling and accessibility.
Quick Start
Use gpui-patterns to implement a modal overlay, a dynamic list, and a responsive form in your GPUI project.