Toggle & Switch (#21979)

![CleanShot 2024-12-13 at 11 27
39@2x](https://github.com/user-attachments/assets/7c7828c0-c5c7-4dc6-931e-722366d4f15a)

- Adds the Switch component
- Updates `Selected`, `Selectable` -> `ToggleState`, `Toggleable`
- Adds `checkbox` and `switch` functions to align better with other
elements in our layout system.

We decided not to merge Switch and Checkbox. However, in a followup I'll
introduce a Toggle or AnyToggle enum so we can update
`CheckboxWithLabel` -> `ToggleWithLabel` as this component will work
exactly the same with either a Checkbox or a Switch.

Release Notes:

- N/A
This commit is contained in:
Nate Butler 2024-12-13 14:23:02 -05:00 committed by GitHub
parent 2f2e7f0317
commit 19d6e067af
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
77 changed files with 626 additions and 453 deletions

View file

@ -395,7 +395,7 @@ impl PickerDelegate for RecentProjectsDelegate {
Some(
ListItem::new(ix)
.selected(selected)
.toggle_state(selected)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.child(

View file

@ -653,7 +653,7 @@ impl RemoteServerProjects {
}))
.child(
ListItem::new(("new-remote-project", ix))
.selected(
.toggle_state(
ssh_server.open_folder.focus_handle.contains_focused(cx),
)
.inset(true)
@ -688,7 +688,7 @@ impl RemoteServerProjects {
}))
.child(
ListItem::new(("server-options", ix))
.selected(
.toggle_state(
ssh_server.configure.focus_handle.contains_focused(cx),
)
.inset(true)
@ -772,7 +772,7 @@ impl RemoteServerProjects {
}))
.child(
ListItem::new((element_id_base, ix))
.selected(navigation.focus_handle.contains_focused(cx))
.toggle_state(navigation.focus_handle.contains_focused(cx))
.inset(true)
.spacing(ui::ListItemSpacing::Sparse)
.start_slot(
@ -984,7 +984,7 @@ impl RemoteServerProjects {
}))
.child(
ListItem::new("add-nickname")
.selected(entries[0].focus_handle.contains_focused(cx))
.toggle_state(entries[0].focus_handle.contains_focused(cx))
.inset(true)
.spacing(ui::ListItemSpacing::Sparse)
.start_slot(Icon::new(IconName::Pencil).color(Color::Muted))
@ -1043,7 +1043,7 @@ impl RemoteServerProjects {
})
.child(
ListItem::new("copy-server-address")
.selected(entries[1].focus_handle.contains_focused(cx))
.toggle_state(entries[1].focus_handle.contains_focused(cx))
.inset(true)
.spacing(ui::ListItemSpacing::Sparse)
.start_slot(Icon::new(IconName::Copy).color(Color::Muted))
@ -1116,7 +1116,7 @@ impl RemoteServerProjects {
}))
.child(
ListItem::new("remove-server")
.selected(entries[2].focus_handle.contains_focused(cx))
.toggle_state(entries[2].focus_handle.contains_focused(cx))
.inset(true)
.spacing(ui::ListItemSpacing::Sparse)
.start_slot(Icon::new(IconName::Trash).color(Color::Error))
@ -1144,7 +1144,7 @@ impl RemoteServerProjects {
}))
.child(
ListItem::new("go-back")
.selected(entries[3].focus_handle.contains_focused(cx))
.toggle_state(entries[3].focus_handle.contains_focused(cx))
.inset(true)
.spacing(ui::ListItemSpacing::Sparse)
.start_slot(
@ -1233,7 +1233,7 @@ impl RemoteServerProjects {
.anchor_scroll(state.add_new_server.scroll_anchor.clone())
.child(
ListItem::new("register-remove-server-button")
.selected(state.add_new_server.focus_handle.contains_focused(cx))
.toggle_state(state.add_new_server.focus_handle.contains_focused(cx))
.inset(true)
.spacing(ui::ListItemSpacing::Sparse)
.start_slot(Icon::new(IconName::Plus).color(Color::Muted))