Manage keyboard focus and navigation with GPUI focus handles and focus events.
npx skills add https://github.com/zerx-lab/rmx --skill gpui-focus-handle
Please help me install this Agent Skill. Skill: gpui-focus-handle Source: https://github.com/zerx-lab/rmx/tree/main/.opencode/skills/gpui-focus-handle Command: npx skills add https://github.com/zerx-lab/rmx --skill gpui-focus-handle
GPUI focus management ensures keyboard navigation and focus tracking across focusable elements, enabling accessible and predictable user interfaces.
Create a FocusHandle in your component: let focus_handle = cx.focus_handle(); Attach to elements: div().track_focus(&focus_handle); Respond to focus: .on_focus(cx.listener(|this, _event, cx| { /* handle focus */ }))
High-intent search queries and answers about installing and using this skill.
You can respond to focus changes in GPUI by attaching on_focus and on_blur event listeners to your elements. These events trigger during component renders, allowing you to update the UI based on the current focus state.
Trapping focus inside a GPUI dialog involves using a FocusHandle to manage the focusable elements within the container. When the dialog closes, the focus handle returns focus to the prior element that was previously active.
You can implement tab-based navigation in GPUI by applying track_focus with a FocusHandle to your focusable elements. This setup natively supports Tab and Shift-Tab keyboard traversal for accessible user interfaces.
GPUI supports event-driven focus transitions during component renders by utilizing on_focus and on_blur listeners. This ensures predictable focus shifts when components update or re-render in the interface.
cnwzhuBuild and compose GPUI UI element trees with div() and chainable styling.
ZzulinManage UnityEvent persistent listeners on GameObjects and components.
longbridgeManage keyboard focus and focus events for GPUI applications.
TheNordicOneEnforce accessible link, button, keyboard, and focus semantics for web UI.
