oak-team/oak-gpui
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

onboarding: Wire up tab index (#35659)

Browse Source 
Closes #ISSUE

Allows tabbing through everything in all three pages. Until #35075 is
merged it is not possible to actually "click" tab focused buttons with
the keyboard.

Additionally adds an action `onboarding::Finish` and displays the
keybind. The action corresponds to both the "Skip all" and "Start
Building" buttons, with the keybind displayed similar to how it is for
the page nav buttons

Release Notes:

- N/A *or* Added/Fixed/Improved ...

---------

Co-authored-by: MrSubidubi <finn@zed.dev>
This commit is contained in:
Ben Kunkle
2025-08-05 19:48:15 +00:00
committed by GitHub
co-authored by MrSubidubi
parent 0b5592d788
commit 6b77654f66
11 changed files with 505 additions and 280 deletions
Download Patch File Download Diff File Expand all files Collapse all files
crates/ui/src/components/button/toggle_button.rs
+15
View File
@@ -412,6 +412,7 @@ where
size: ToggleButtonGroupSize,
button_width: Rems,
selected_index: usize,
tab_index: Option<isize>,
}
impl<T: ButtonBuilder, const COLS: usize> ToggleButtonGroup<T, COLS> {
@@ -423,6 +424,7 @@ impl<T: ButtonBuilder, const COLS: usize> ToggleButtonGroup<T, COLS> {
size: ToggleButtonGroupSize::Default,
button_width: rems_from_px(100.),
selected_index: 0,
tab_index: None,
}
}
}
@@ -436,6 +438,7 @@ impl<T: ButtonBuilder, const COLS: usize> ToggleButtonGroup<T, COLS, 2> {
size: ToggleButtonGroupSize::Default,
button_width: rems_from_px(100.),
selected_index: 0,
tab_index: None,
}
}
}
@@ -460,6 +463,15 @@ impl<T: ButtonBuilder, const COLS: usize, const ROWS: usize> ToggleButtonGroup<T
self.selected_index = index;
self
}
/// Sets the tab index for the toggle button group.
/// The tab index is set to the initial value provided, then the
/// value is incremented by the number of buttons in the group.
pub fn tab_index(mut self, tab_index: &mut isize) -> Self {
self.tab_index = Some(*tab_index);
*tab_index += (COLS * ROWS) as isize;
self
}
}
impl<T: ButtonBuilder, const COLS: usize, const ROWS: usize> RenderOnce
@@ -479,6 +491,9 @@ impl<T: ButtonBuilder, const COLS: usize, const ROWS: usize> RenderOnce
let entry_index = row_index * COLS + col_index;
ButtonLike::new((self.group_name, entry_index))
.when_some(self.tab_index, |this, tab_index| {
this.tab_index(tab_index + entry_index as isize)
})
.when(entry_index == self.selected_index || selected, |this| {
this.toggle_state(true)
.selected_style(ButtonStyle::Tinted(TintColor::Accent))