zed-industries/zed
1
1
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-26 22:12:04 +03:00
Code Issues Packages Projects Releases Wiki Activity

Toggle & Switch (#21979)

Browse Source 
![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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
crates/assistant/src/assistant_panel.rs
View File

@ -305,7 +305,7 @@ impl PickerDelegate for SavedContextPickerDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(item),
)
}
@ -442,7 +442,7 @@ impl AssistantPanel {
)
}
})
.selected(
.toggle_state(
pane.active_item()
.map_or(false, |item| item.downcast::<ContextHistory>().is_some()),
);
@ -4956,7 +4956,7 @@ fn render_slash_command_output_toggle(
("slash-command-output-fold-indicator", row.0 as u64),
!is_folded,
)
.selected(is_folded)
.toggle_state(is_folded)
.on_click(move |_e, cx| fold(!is_folded, cx))
.into_any_element()
}
@ -4971,7 +4971,7 @@ fn fold_toggle(
) -> AnyElement {
move |row, is_folded, fold, _cx| {
Disclosure::new((name, row.0 as u64), !is_folded)
.selected(is_folded)
.toggle_state(is_folded)
.on_click(move |_e, cx| fold(!is_folded, cx))
.into_any_element()
}
@ -5013,7 +5013,7 @@ fn render_quote_selection_output_toggle(
_cx: &mut WindowContext,
) -> AnyElement {
Disclosure::new(("quote-selection-indicator", row.0 as u64), !is_folded)
.selected(is_folded)
.toggle_state(is_folded)
.on_click(move |_e, cx| fold(!is_folded, cx))
.into_any_element()
}
@ -5036,7 +5036,7 @@ fn render_pending_slash_command_gutter_decoration(
icon = icon.icon_color(Color::Muted);
}
PendingSlashCommandStatus::Running { .. } => {
icon = icon.selected(true);
icon = icon.toggle_state(true);
}
PendingSlashCommandStatus::Error(_) => icon = icon.icon_color(Color::Error),
}

12
crates/assistant/src/inline_assistant.rs
View File

@ -1534,7 +1534,7 @@ impl Render for PromptEditor {
v_flex()
.child(
IconButton::new("rate-limit-error", IconName::XCircle)
.selected(self.show_rate_limit_notice)
.toggle_state(self.show_rate_limit_notice)
.shape(IconButtonShape::Square)
.icon_size(IconSize::Small)
.on_click(cx.listener(Self::toggle_rate_limit_notice)),
@ -2133,15 +2133,15 @@ impl PromptEditor {
"dont-show-again",
Label::new("Don't show again"),
if dismissed_rate_limit_notice() {
ui::Selection::Selected
ui::ToggleState::Selected
} else {
ui::Selection::Unselected
ui::ToggleState::Unselected
},
|selection, cx| {
let is_dismissed = match selection {
ui::Selection::Unselected => false,
ui::Selection::Indeterminate => return,
ui::Selection::Selected => true,
ui::ToggleState::Unselected => false,
ui::ToggleState::Indeterminate => return,
ui::ToggleState::Selected => true,
};
set_rate_limit_notice_dismissed(is_dismissed, cx)

8
crates/assistant/src/prompt_library.rs
View File

@ -232,13 +232,13 @@ impl PickerDelegate for PromptPickerDelegate {
let element = ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(h_flex().h_5().line_height(relative(1.)).child(Label::new(
prompt.title.clone().unwrap_or("Untitled".into()),
)))
.end_slot::<IconButton>(default.then(|| {
IconButton::new("toggle-default-prompt", IconName::SparkleFilled)
.selected(true)
.toggle_state(true)
.icon_color(Color::Accent)
.shape(IconButtonShape::Square)
.tooltip(move |cx| Tooltip::text("Remove from Default Prompt", cx))
@ -274,7 +274,7 @@ impl PickerDelegate for PromptPickerDelegate {
})
.child(
IconButton::new("toggle-default-prompt", IconName::Sparkle)
.selected(default)
.toggle_state(default)
.selected_icon(IconName::SparkleFilled)
.icon_color(if default { Color::Accent } else { Color::Muted })
.shape(IconButtonShape::Square)
@ -1053,7 +1053,7 @@ impl PromptLibrary {
IconName::Sparkle,
)
.style(ButtonStyle::Transparent)
.selected(prompt_metadata.default)
.toggle_state(prompt_metadata.default)
.selected_icon(IconName::SparkleFilled)
.icon_color(if prompt_metadata.default {
Color::Accent

4
crates/assistant/src/slash_command_picker.rs
View File

@ -176,7 +176,7 @@ impl PickerDelegate for SlashCommandDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Dense)
.selected(selected)
.toggle_state(selected)
.tooltip({
let description = info.description.clone();
move |cx| cx.new_view(|_| Tooltip::new(description.clone())).into()
@ -229,7 +229,7 @@ impl PickerDelegate for SlashCommandDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Dense)
.selected(selected)
.toggle_state(selected)
.child(renderer(cx)),
),
}

2
crates/assistant2/src/context_picker.rs
View File

@ -174,7 +174,7 @@ impl PickerDelegate for ContextPickerDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Dense)
.selected(selected)
.toggle_state(selected)
.tooltip({
let description = entry.description.clone();
move |cx| cx.new_view(|_cx| Tooltip::new(description.clone())).into()

2
crates/assistant2/src/context_picker/file_context_picker.rs
View File

@ -260,7 +260,7 @@ impl PickerDelegate for FileContextPickerDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(mat.path.to_string_lossy().to_string()),
)
}

12
crates/assistant2/src/inline_assistant.rs
View File

@ -1623,7 +1623,7 @@ impl Render for PromptEditor {
v_flex()
.child(
IconButton::new("rate-limit-error", IconName::XCircle)
.selected(self.show_rate_limit_notice)
.toggle_state(self.show_rate_limit_notice)
.shape(IconButtonShape::Square)
.icon_size(IconSize::Small)
.on_click(cx.listener(Self::toggle_rate_limit_notice)),
@ -2065,15 +2065,15 @@ impl PromptEditor {
"dont-show-again",
Label::new("Don't show again"),
if dismissed_rate_limit_notice() {
ui::Selection::Selected
ui::ToggleState::Selected
} else {
ui::Selection::Unselected
ui::ToggleState::Unselected
},
|selection, cx| {
let is_dismissed = match selection {
ui::Selection::Unselected => false,
ui::Selection::Indeterminate => return,
ui::Selection::Selected => true,
ui::ToggleState::Unselected => false,
ui::ToggleState::Indeterminate => return,
ui::ToggleState::Selected => true,
};
set_rate_limit_notice_dismissed(is_dismissed, cx)

4
crates/assistant2/src/message_editor.rs
View File

@ -268,8 +268,8 @@ impl Render for MessageEditor {
self.use_tools.into(),
cx.listener(|this, selection, _cx| {
this.use_tools = match selection {
Selection::Selected => true,
Selection::Unselected | Selection::Indeterminate => false,
ToggleState::Selected => true,
ToggleState::Unselected | ToggleState::Indeterminate => false,
};
}),
)))

22
crates/collab_ui/src/collab_panel.rs
View File

@ -841,7 +841,7 @@ impl CollabPanel {
ListItem::new(SharedString::from(user.github_login.clone()))
.start_slot(Avatar::new(user.avatar_uri.clone()))
.child(Label::new(user.github_login.clone()))
.selected(is_selected)
.toggle_state(is_selected)
.end_slot(if is_pending {
Label::new("Calling").color(Color::Muted).into_any_element()
} else if is_current_user {
@ -894,7 +894,7 @@ impl CollabPanel {
.into();
ListItem::new(project_id as usize)
.selected(is_selected)
.toggle_state(is_selected)
.on_click(cx.listener(move |this, _, cx| {
this.workspace
.update(cx, |workspace, cx| {
@ -924,7 +924,7 @@ impl CollabPanel {
let id = peer_id.map_or(usize::MAX, |id| id.as_u64() as usize);
ListItem::new(("screen", id))
.selected(is_selected)
.toggle_state(is_selected)
.start_slot(
h_flex()
.gap_1()
@ -964,7 +964,7 @@ impl CollabPanel {
let channel_store = self.channel_store.read(cx);
let has_channel_buffer_changed = channel_store.has_channel_buffer_changed(channel_id);
ListItem::new("channel-notes")
.selected(is_selected)
.toggle_state(is_selected)
.on_click(cx.listener(move |this, _, cx| {
this.open_channel_notes(channel_id, cx);
}))
@ -996,7 +996,7 @@ impl CollabPanel {
let channel_store = self.channel_store.read(cx);
let has_messages_notification = channel_store.has_new_messages(channel_id);
ListItem::new("channel-chat")
.selected(is_selected)
.toggle_state(is_selected)
.on_click(cx.listener(move |this, _, cx| {
this.join_channel_chat(channel_id, cx);
}))
@ -2253,7 +2253,7 @@ impl CollabPanel {
})
.inset(true)
.end_slot::<AnyElement>(button)
.selected(is_selected),
.toggle_state(is_selected),
)
}
@ -2270,7 +2270,7 @@ impl CollabPanel {
let item = ListItem::new(github_login.clone())
.indent_level(1)
.indent_step_size(px(20.))
.selected(is_selected)
.toggle_state(is_selected)
.child(
h_flex()
.w_full()
@ -2381,7 +2381,7 @@ impl CollabPanel {
ListItem::new(github_login.clone())
.indent_level(1)
.indent_step_size(px(20.))
.selected(is_selected)
.toggle_state(is_selected)
.child(
h_flex()
.w_full()
@ -2425,7 +2425,7 @@ impl CollabPanel {
];
ListItem::new(("channel-invite", channel.id.0 as usize))
.selected(is_selected)
.toggle_state(is_selected)
.child(
h_flex()
.w_full()
@ -2448,7 +2448,7 @@ impl CollabPanel {
ListItem::new("contact-placeholder")
.child(Icon::new(IconName::Plus))
.child(Label::new("Add a Contact"))
.selected(is_selected)
.toggle_state(is_selected)
.on_click(cx.listener(|this, _, cx| this.toggle_contact_finder(cx)))
}
@ -2547,7 +2547,7 @@ impl CollabPanel {
// Add one level of depth for the disclosure arrow.
.indent_level(depth + 1)
.indent_step_size(px(20.))
.selected(is_selected || is_active)
.toggle_state(is_selected || is_active)
.toggle(disclosed)
.on_toggle(
cx.listener(move |this, _, cx| {

14
crates/collab_ui/src/collab_panel/channel_modal.rs
View File

@ -89,15 +89,15 @@ impl ChannelModal {
cx.notify()
}
fn set_channel_visibility(&mut self, selection: &Selection, cx: &mut ViewContext<Self>) {
fn set_channel_visibility(&mut self, selection: &ToggleState, cx: &mut ViewContext<Self>) {
self.channel_store.update(cx, |channel_store, cx| {
channel_store
.set_channel_visibility(
self.channel_id,
match selection {
Selection::Unselected => ChannelVisibility::Members,
Selection::Selected => ChannelVisibility::Public,
Selection::Indeterminate => return,
ToggleState::Unselected => ChannelVisibility::Members,
ToggleState::Selected => ChannelVisibility::Public,
ToggleState::Indeterminate => return,
},
cx,
)
@ -159,9 +159,9 @@ impl Render for ChannelModal {
"is-public",
Label::new("Public").size(LabelSize::Small),
if visibility == ChannelVisibility::Public {
ui::Selection::Selected
ui::ToggleState::Selected
} else {
ui::Selection::Unselected
ui::ToggleState::Unselected
},
cx.listener(Self::set_channel_visibility),
))
@ -386,7 +386,7 @@ impl PickerDelegate for ChannelModalDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.start_slot(Avatar::new(user.avatar_uri.clone()))
.child(Label::new(user.github_login.clone()))
.end_slot(h_flex().gap_2().map(|slot| {

2
crates/collab_ui/src/collab_panel/contact_finder.rs
View File

@ -151,7 +151,7 @@ impl PickerDelegate for ContactFinderDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.start_slot(Avatar::new(user.avatar_uri.clone()))
.child(Label::new(user.github_login.clone()))
.end_slot::<Icon>(icon_path.map(Icon::from_path)),

2
crates/command_palette/src/command_palette.rs
View File

@ -397,7 +397,7 @@ impl PickerDelegate for CommandPaletteDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(
h_flex()
.w_full()

6
crates/editor/src/code_context_menus.rs
View File

@ -16,8 +16,8 @@ use project::{CodeAction, Completion, TaskSourceKind};
use task::ResolvedTask;
use ui::{
h_flex, ActiveTheme as _, Color, FluentBuilder as _, InteractiveElement as _, IntoElement,
Label, LabelCommon as _, LabelSize, ListItem, ParentElement as _, Popover, Selectable as _,
StatefulInteractiveElement as _, Styled, StyledExt as _,
Label, LabelCommon as _, LabelSize, ListItem, ParentElement as _, Popover,
StatefulInteractiveElement as _, Styled, StyledExt as _, Toggleable as _,
};
use util::ResultExt as _;
use workspace::Workspace;
@ -473,7 +473,7 @@ impl CompletionsMenu {
div().min_w(px(220.)).max_w(px(540.)).child(
ListItem::new(mat.candidate_id)
.inset(true)
.selected(item_ix == selected_item)
.toggle_state(item_ix == selected_item)
.on_click(cx.listener(move |editor, _event, cx| {
cx.stop_propagation();
if let Some(task) = editor.confirm_completion(

6
crates/editor/src/editor.rs
View File

@ -4811,7 +4811,7 @@ impl Editor {
.shape(ui::IconButtonShape::Square)
.icon_size(IconSize::XSmall)
.icon_color(Color::Muted)
.selected(is_active)
.toggle_state(is_active)
.tooltip({
let focus_handle = self.focus_handle.clone();
move |cx| {
@ -4988,7 +4988,7 @@ impl Editor {
.shape(ui::IconButtonShape::Square)
.icon_size(IconSize::XSmall)
.icon_color(Color::Muted)
.selected(is_active)
.toggle_state(is_active)
.on_click(cx.listener(move |editor, _e, cx| {
editor.focus(cx);
editor.toggle_code_actions(
@ -13772,7 +13772,7 @@ impl EditorSnapshot {
if folded || (is_foldable && (row_contains_cursor || self.gutter_hovered)) {
Some(
Disclosure::new(("gutter_crease", buffer_row.0), !folded)
.selected(folded)
.toggle_state(folded)
.on_click(cx.listener_for(&editor, move |this, _e, cx| {
if folded {
this.unfold_at(&UnfoldAt { buffer_row }, cx);

12
crates/editor/src/editor_settings_controls.rs
View File

@ -265,8 +265,8 @@ impl RenderOnce for BufferFontLigaturesControl {
|selection, cx| {
Self::write(
match selection {
Selection::Selected => true,
Selection::Unselected | Selection::Indeterminate => false,
ToggleState::Selected => true,
ToggleState::Unselected | ToggleState::Indeterminate => false,
},
cx,
);
@ -318,8 +318,8 @@ impl RenderOnce for InlineGitBlameControl {
|selection, cx| {
Self::write(
match selection {
Selection::Selected => true,
Selection::Unselected | Selection::Indeterminate => false,
ToggleState::Selected => true,
ToggleState::Unselected | ToggleState::Indeterminate => false,
},
cx,
);
@ -371,8 +371,8 @@ impl RenderOnce for LineNumbersControl {
|selection, cx| {
Self::write(
match selection {
Selection::Selected => true,
Selection::Unselected | Selection::Indeterminate => false,
ToggleState::Selected => true,
ToggleState::Unselected | ToggleState::Indeterminate => false,
},
cx,
);

2
crates/editor/src/hunk_diff.rs
View File

@ -726,7 +726,7 @@ impl Editor {
.shape(IconButtonShape::Square)
.icon_size(IconSize::Small)
.style(ButtonStyle::Subtle)
.selected(
.toggle_state(
hunk_controls_menu_handle
.is_deployed(),
)

2
crates/extensions_ui/src/extension_version_selector.rs
View File

@ -210,7 +210,7 @@ impl PickerDelegate for ExtensionVersionSelectorDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.disabled(disabled)
.child(
HighlightedLabel::new(

18
crates/extensions_ui/src/extensions_ui.rs
View File

@ -933,7 +933,7 @@ impl ExtensionsPage {
fn update_settings<T: Settings>(
&mut self,
selection: &Selection,
selection: &ToggleState,
cx: &mut ViewContext<Self>,
callback: impl 'static + Send + Fn(&mut T::FileContent, bool),
) {
@ -942,8 +942,8 @@ impl ExtensionsPage {
let selection = *selection;
settings::update_settings_file::<T>(fs, cx, move |settings, _| {
let value = match selection {
Selection::Unselected => false,
Selection::Selected => true,
ToggleState::Unselected => false,
ToggleState::Selected => true,
_ => return,
};
@ -998,9 +998,9 @@ impl ExtensionsPage {
"enable-vim",
Label::new("Enable vim mode"),
if VimModeSetting::get_global(cx).0 {
ui::Selection::Selected
ui::ToggleState::Selected
} else {
ui::Selection::Unselected
ui::ToggleState::Unselected
},
cx.listener(move |this, selection, cx| {
this.telemetry
@ -1090,7 +1090,7 @@ impl Render for ExtensionsPage {
ToggleButton::new("filter-all", "All")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(self.filter == ExtensionFilter::All)
.toggle_state(self.filter == ExtensionFilter::All)
.on_click(cx.listener(|this, _event, cx| {
this.filter = ExtensionFilter::All;
this.filter_extension_entries(cx);
@ -1104,7 +1104,7 @@ impl Render for ExtensionsPage {
ToggleButton::new("filter-installed", "Installed")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(self.filter == ExtensionFilter::Installed)
.toggle_state(self.filter == ExtensionFilter::Installed)
.on_click(cx.listener(|this, _event, cx| {
this.filter = ExtensionFilter::Installed;
this.filter_extension_entries(cx);
@ -1118,7 +1118,9 @@ impl Render for ExtensionsPage {
ToggleButton::new("filter-not-installed", "Not Installed")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(self.filter == ExtensionFilter::NotInstalled)
.toggle_state(
self.filter == ExtensionFilter::NotInstalled,
)
.on_click(cx.listener(|this, _event, cx| {
this.filter = ExtensionFilter::NotInstalled;
this.filter_extension_entries(cx);

2
crates/file_finder/src/file_finder.rs
View File

@ -1228,7 +1228,7 @@ impl PickerDelegate for FileFinderDelegate {
.start_slot::<Icon>(file_icon)
.end_slot::<AnyElement>(history_icon)
.inset(true)
.selected(selected)
.toggle_state(selected)
.child(
h_flex()
.gap_2()

2
crates/file_finder/src/new_path_prompt.rs
View File

@ -414,7 +414,7 @@ impl PickerDelegate for NewPathDelegate {
ListItem::new(ix)
.spacing(ListItemSpacing::Sparse)
.inset(true)
.selected(selected)
.toggle_state(selected)
.child(LabelLike::new().child(m.styled_text(self.project.read(cx), cx))),
)
}

2
crates/file_finder/src/open_path_prompt.rs
View File

@ -283,7 +283,7 @@ impl PickerDelegate for OpenPathDelegate {
ListItem::new(ix)
.spacing(ListItemSpacing::Sparse)
.inset(true)
.selected(selected)
.toggle_state(selected)
.child(LabelLike::new().child(candidate.string.clone())),
)
}

2
crates/git_ui/src/git_panel.rs
View File

@ -658,7 +658,7 @@ impl GitPanel {
) -> impl IntoElement {
let id = id.to_proto() as usize;
let checkbox_id = ElementId::Name(format!("checkbox_{}", id).into());
let is_staged = Selection::Selected;
let is_staged = ToggleState::Selected;
h_flex()
.id(id)

2
crates/language_model_selector/src/language_model_selector.rs
View File

@ -267,7 +267,7 @@ impl PickerDelegate for LanguageModelPickerDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.start_slot(
div().pr_0p5().child(
Icon::new(model_info.icon)

2
crates/language_selector/src/language_selector.rs
View File

@ -281,7 +281,7 @@ impl PickerDelegate for LanguageSelectorDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.start_slot::<Icon>(language_icon)
.child(HighlightedLabel::new(label, mat.positions.clone())),
)

8
crates/language_tools/src/lsp_log.rs
View File

@ -14,7 +14,7 @@ use lsp::{
};
use project::{search::SearchQuery, Project, WorktreeId};
use std::{borrow::Cow, sync::Arc};
use ui::{prelude::*, Button, Checkbox, ContextMenu, Label, PopoverMenu, Selection};
use ui::{prelude::*, Button, Checkbox, ContextMenu, Label, PopoverMenu, ToggleState};
use workspace::{
item::{Item, ItemHandle},
searchable::{SearchEvent, SearchableItem, SearchableItemHandle},
@ -1251,9 +1251,9 @@ impl Render for LspLogToolbarItemView {
Checkbox::new(
"LspLogEnableRpcTrace",
if rpc_trace_enabled {
Selection::Selected
ToggleState::Selected
} else {
Selection::Unselected
ToggleState::Unselected
},
)
.on_click(cx.listener_for(
@ -1261,7 +1261,7 @@ impl Render for LspLogToolbarItemView {
move |view, selection, cx| {
let enabled = matches!(
selection,
Selection::Selected
ToggleState::Selected
);
view.toggle_rpc_logging_for_server(
server_id, enabled, cx,

10
crates/markdown_preview/src/markdown_renderer.rs
View File

@ -20,7 +20,7 @@ use theme::{ActiveTheme, SyntaxTheme, ThemeSettings};
use ui::{
h_flex, relative, tooltip_container, v_flex, Checkbox, Clickable, Color, FluentBuilder,
IconButton, IconName, IconSize, InteractiveElement, Label, LabelCommon, LabelSize, LinkPreview,
Selection, StatefulInteractiveElement, StyledExt, StyledImage, ViewContext, VisibleOnHover,
StatefulInteractiveElement, StyledExt, StyledImage, ToggleState, ViewContext, VisibleOnHover,
VisualContext as _,
};
use workspace::Workspace;
@ -180,9 +180,9 @@ fn render_markdown_list_item(
Checkbox::new(
"checkbox",
if *checked {
Selection::Selected
ToggleState::Selected
} else {
Selection::Unselected
ToggleState::Unselected
},
)
.when_some(
@ -192,8 +192,8 @@ fn render_markdown_list_item(
let range = range.clone();
move |selection, cx| {
let checked = match selection {
Selection::Selected => true,
Selection::Unselected => false,
ToggleState::Selected => true,
ToggleState::Unselected => false,
_ => return,
};

2
crates/outline/src/outline.rs
View File

@ -280,7 +280,7 @@ impl PickerDelegate for OutlineViewDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(
div()
.text_ui(cx)

4
crates/outline_panel/src/outline_panel.rs
View File

@ -51,7 +51,7 @@ use workspace::{
ui::{
h_flex, v_flex, ActiveTheme, ButtonCommon, Clickable, Color, ContextMenu, FluentBuilder,
HighlightedLabel, Icon, IconButton, IconButtonShape, IconName, IconSize, Label,
LabelCommon, ListItem, Scrollbar, ScrollbarState, Selectable, StyledExt, StyledTypography,
LabelCommon, ListItem, Scrollbar, ScrollbarState, StyledExt, StyledTypography, Toggleable,
Tooltip,
},
OpenInTerminal, WeakItemHandle, Workspace,
@ -2045,7 +2045,7 @@ impl OutlinePanel {
ListItem::new(item_id)
.indent_level(depth)
.indent_step_size(px(settings.indent_size))
.selected(is_active)
.toggle_state(is_active)
.when_some(icon_element, |list_item, icon_element| {
list_item.child(h_flex().child(icon_element))
})

4
crates/project_symbols/src/project_symbols.rs
View File

@ -11,7 +11,7 @@ use std::{borrow::Cow, cmp::Reverse, sync::Arc};
use theme::ActiveTheme;
use util::ResultExt;
use workspace::{
ui::{v_flex, Color, Label, LabelCommon, LabelLike, ListItem, ListItemSpacing, Selectable},
ui::{v_flex, Color, Label, LabelCommon, LabelLike, ListItem, ListItemSpacing, Toggleable},
Workspace,
};
@ -240,7 +240,7 @@ impl PickerDelegate for ProjectSymbolsDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(
v_flex()
.child(

2
crates/recent_projects/src/recent_projects.rs
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(

16
crates/recent_projects/src/remote_servers.rs
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))

2
crates/repl/src/components/kernel_options.rs
View File

@ -150,7 +150,7 @@ impl PickerDelegate for KernelPickerDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(
h_flex()
.w_full()

4
crates/search/src/buffer_search.rs
View File

@ -272,7 +272,7 @@ impl Render for BufferSearchBar {
.on_click(cx.listener(|this, _: &ClickEvent, cx| {
this.toggle_replace(&ToggleReplace, cx);
}))
.selected(self.replace_enabled)
.toggle_state(self.replace_enabled)
.tooltip({
let focus_handle = focus_handle.clone();
move |cx| {
@ -300,7 +300,7 @@ impl Render for BufferSearchBar {
.on_click(cx.listener(|this, _: &ClickEvent, cx| {
this.toggle_selection(&ToggleSelection, cx);
}))
.selected(self.selection_search_enabled)
.toggle_state(self.selection_search_enabled)
.tooltip({
let focus_handle = focus_handle.clone();
move |cx| {

8
crates/search/src/project_search.rs
View File

@ -35,7 +35,7 @@ use std::{
use theme::ThemeSettings;
use ui::{
h_flex, prelude::*, utils::SearchInputWidth, v_flex, Icon, IconButton, IconButtonShape,
IconName, KeyBinding, Label, LabelCommon, LabelSize, Selectable, Tooltip,
IconName, KeyBinding, Label, LabelCommon, LabelSize, Toggleable, Tooltip,
};
use util::paths::PathMatcher;
use workspace::{
@ -1645,7 +1645,7 @@ impl Render for ProjectSearchBar {
.on_click(cx.listener(|this, _, cx| {
this.toggle_filters(cx);
}))
.selected(
.toggle_state(
self.active_project_search
.as_ref()
.map(|search| search.read(cx).filters_enabled)
@ -1669,7 +1669,7 @@ impl Render for ProjectSearchBar {
.on_click(cx.listener(|this, _, cx| {
this.toggle_replace(&ToggleReplace, cx);
}))
.selected(
.toggle_state(
self.active_project_search
.as_ref()
.map(|search| search.read(cx).replace_enabled)
@ -1878,7 +1878,7 @@ impl Render for ProjectSearchBar {
.child(
IconButton::new("project-search-opened-only", IconName::FileSearch)
.shape(IconButtonShape::Square)
.selected(self.is_opened_only_enabled(cx))
.toggle_state(self.is_opened_only_enabled(cx))
.tooltip(|cx| Tooltip::text("Only Search Open Files", cx))
.on_click(cx.listener(|this, _, cx| {
this.toggle_opened_only(cx);

2
crates/search/src/search.rs
View File

@ -113,7 +113,7 @@ impl SearchOptions {
.on_click(action)
.style(ButtonStyle::Subtle)
.shape(IconButtonShape::Square)
.selected(active)
.toggle_state(active)
.tooltip({
let action = self.to_toggle_action();
let label = self.label();

10
crates/settings_ui/src/appearance_settings_controls.rs
View File

@ -145,7 +145,7 @@ impl RenderOnce for ThemeModeControl {
ToggleButton::new("light", "Light")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(value == ThemeMode::Light)
.toggle_state(value == ThemeMode::Light)
.on_click(|_, cx| Self::write(ThemeMode::Light, cx))
.first(),
)
@ -153,7 +153,7 @@ impl RenderOnce for ThemeModeControl {
ToggleButton::new("system", "System")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(value == ThemeMode::System)
.toggle_state(value == ThemeMode::System)
.on_click(|_, cx| Self::write(ThemeMode::System, cx))
.middle(),
)
@ -161,7 +161,7 @@ impl RenderOnce for ThemeModeControl {
ToggleButton::new("dark", "Dark")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(value == ThemeMode::Dark)
.toggle_state(value == ThemeMode::Dark)
.on_click(|_, cx| Self::write(ThemeMode::Dark, cx))
.last(),
)
@ -375,8 +375,8 @@ impl RenderOnce for UiFontLigaturesControl {
|selection, cx| {
Self::write(
match selection {
Selection::Selected => true,
Selection::Unselected | Selection::Indeterminate => false,
ToggleState::Selected => true,
ToggleState::Unselected | ToggleState::Indeterminate => false,
},
cx,
);

2
crates/snippets_ui/src/snippets_ui.rs
View File

@ -219,7 +219,7 @@ impl PickerDelegate for ScopeSelectorDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(HighlightedLabel::new(label, mat.positions.clone())),
)
}

2
crates/storybook/src/stories/picker.rs
View File

@ -59,7 +59,7 @@ impl PickerDelegate for Delegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(Label::new(candidate)),
)
}

2
crates/tab_switcher/src/tab_switcher.rs
View File

@ -407,7 +407,7 @@ impl PickerDelegate for TabSwitcherDelegate {
ListItem::new(ix)
.spacing(ListItemSpacing::Sparse)
.inset(true)
.selected(selected)
.toggle_state(selected)
.child(h_flex().w_full().child(label))
.start_slot::<Icon>(icon)
.map(|el| {

4
crates/tasks_ui/src/modal.rs
View File

@ -13,7 +13,7 @@ use task::{ResolvedTask, TaskContext, TaskTemplate};
use ui::{
div, h_flex, v_flex, ActiveTheme, Button, ButtonCommon, ButtonSize, Clickable, Color,
FluentBuilder as _, Icon, IconButton, IconButtonShape, IconName, IconSize, IntoElement,
KeyBinding, LabelSize, ListItem, ListItemSpacing, RenderOnce, Selectable, Tooltip,
KeyBinding, LabelSize, ListItem, ListItemSpacing, RenderOnce, Toggleable, Tooltip,
WindowContext,
};
use util::ResultExt;
@ -379,7 +379,7 @@ impl PickerDelegate for TasksModalDelegate {
};
item
})
.selected(selected)
.toggle_state(selected)
.child(highlighted_location.render(cx)),
)
}

4
crates/terminal_view/src/terminal_panel.rs
View File

@ -26,7 +26,7 @@ use terminal::{
Terminal,
};
use ui::{
prelude::*, ButtonCommon, Clickable, ContextMenu, FluentBuilder, PopoverMenu, Selectable,
prelude::*, ButtonCommon, Clickable, ContextMenu, FluentBuilder, PopoverMenu, Toggleable,
Tooltip,
};
use util::{ResultExt, TryFutureExt};
@ -201,7 +201,7 @@ impl TerminalPanel {
let zoomed = pane.is_zoomed();
IconButton::new("toggle_zoom", IconName::Maximize)
.icon_size(IconSize::Small)
.selected(zoomed)
.toggle_state(zoomed)
.selected_icon(IconName::Minimize)
.on_click(cx.listener(|pane, _, cx| {
pane.toggle_zoom(&workspace::ToggleZoom, cx);

2
crates/theme_selector/src/theme_selector.rs
View File

@ -285,7 +285,7 @@ impl PickerDelegate for ThemeSelectorDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(HighlightedLabel::new(
theme_match.string.clone(),
theme_match.positions.clone(),

8
crates/title_bar/src/collab.rs
View File

@ -322,7 +322,7 @@ impl TitleBar {
})
.style(ButtonStyle::Subtle)
.selected_style(ButtonStyle::Tinted(TintColor::Accent))
.selected(is_shared)
.toggle_state(is_shared)
.label_size(LabelSize::Small)
.on_click(cx.listener(move |this, _, cx| {
if is_shared {
@ -380,7 +380,7 @@ impl TitleBar {
})
.style(ButtonStyle::Subtle)
.icon_size(IconSize::Small)
.selected(is_muted)
.toggle_state(is_muted)
.selected_style(ButtonStyle::Tinted(TintColor::Negative))
.on_click(move |_, cx| {
toggle_mute(&Default::default(), cx);
@ -400,7 +400,7 @@ impl TitleBar {
.style(ButtonStyle::Subtle)
.selected_style(ButtonStyle::Tinted(TintColor::Negative))
.icon_size(IconSize::Small)
.selected(is_deafened)
.toggle_state(is_deafened)
.tooltip(move |cx| {
if is_deafened {
let label = "Unmute Audio";
@ -430,7 +430,7 @@ impl TitleBar {
IconButton::new("screen-share", ui::IconName::Screen)
.style(ButtonStyle::Subtle)
.icon_size(IconSize::Small)
.selected(is_screen_sharing)
.toggle_state(is_screen_sharing)
.selected_style(ButtonStyle::Tinted(TintColor::Accent))
.tooltip(move |cx| {
Tooltip::text(

2
crates/toolchain_selector/src/toolchain_selector.rs
View File

@ -345,7 +345,7 @@ impl PickerDelegate for ToolchainSelectorDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(HighlightedLabel::new(label, name_highlights))
.child(
HighlightedLabel::new(path, path_highlights)

4
crates/ui/src/components.rs
View File

@ -1,6 +1,5 @@
mod avatar;
mod button;
mod checkbox;
mod content_group;
mod context_menu;
mod disclosure;
@ -28,6 +27,7 @@ mod stack;
mod tab;
mod tab_bar;
mod table;
mod toggle;
mod tool_strip;
mod tooltip;
@ -36,7 +36,6 @@ mod stories;
pub use avatar::*;
pub use button::*;
pub use checkbox::*;
pub use content_group::*;
pub use context_menu::*;
pub use disclosure::*;
@ -64,6 +63,7 @@ pub use stack::*;
pub use tab::*;
pub use tab_bar::*;
pub use table::*;
pub use toggle::*;
pub use tool_strip::*;
pub use tooltip::*;

12
crates/ui/src/components/button/button.rs
View File

@ -194,7 +194,7 @@ impl Button {
}
}
impl Selectable for Button {
impl Toggleable for Button {
/// Sets the selected state of the button.
///
/// This method allows the selection state of the button to be specified.
@ -213,8 +213,8 @@ impl Selectable for Button {
/// ```
///
/// Use [`selected_style`](Button::selected_style) to change the style of the button when it is selected.
fn selected(mut self, selected: bool) -> Self {
self.base = self.base.selected(selected);
fn toggle_state(mut self, selected: bool) -> Self {
self.base = self.base.toggle_state(selected);
self
}
}
@ -405,7 +405,7 @@ impl RenderOnce for Button {
this.children(self.icon.map(|icon| {
ButtonIcon::new(icon)
.disabled(is_disabled)
.selected(is_selected)
.toggle_state(is_selected)
.selected_icon(self.selected_icon)
.selected_icon_color(self.selected_icon_color)
.size(self.icon_size)
@ -429,7 +429,7 @@ impl RenderOnce for Button {
this.children(self.icon.map(|icon| {
ButtonIcon::new(icon)
.disabled(is_disabled)
.selected(is_selected)
.toggle_state(is_selected)
.selected_icon(self.selected_icon)
.selected_icon_color(self.selected_icon_color)
.size(self.icon_size)
@ -500,7 +500,7 @@ impl ComponentPreview for Button {
),
single_example(
"Selected",
Button::new("selected", "Selected").selected(true),
Button::new("selected", "Selected").toggle_state(true),
),
],
),

4
crates/ui/src/components/button/button_icon.rs
View File

@ -65,8 +65,8 @@ impl Disableable for ButtonIcon {
}
}
impl Selectable for ButtonIcon {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for ButtonIcon {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}

6
crates/ui/src/components/button/button_like.rs
View File

@ -6,7 +6,7 @@ use smallvec::SmallVec;
use crate::{prelude::*, DynamicSpacing, ElevationIndex};
/// A trait for buttons that can be Selected. Enables setting the [`ButtonStyle`] of a button when it is selected.
pub trait SelectableButton: Selectable {
pub trait SelectableButton: Toggleable {
fn selected_style(self, style: ButtonStyle) -> Self;
}
@ -400,8 +400,8 @@ impl Disableable for ButtonLike {
}
}
impl Selectable for ButtonLike {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for ButtonLike {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}

8
crates/ui/src/components/button/icon_button.rs
View File

@ -66,9 +66,9 @@ impl Disableable for IconButton {
}
}
impl Selectable for IconButton {
fn selected(mut self, selected: bool) -> Self {
self.base = self.base.selected(selected);
impl Toggleable for IconButton {
fn toggle_state(mut self, selected: bool) -> Self {
self.base = self.base.toggle_state(selected);
self
}
}
@ -157,7 +157,7 @@ impl RenderOnce for IconButton {
.child(
ButtonIcon::new(self.icon)
.disabled(is_disabled)
.selected(is_selected)
.toggle_state(is_selected)
.selected_icon(self.selected_icon)
.when_some(selected_style, |this, style| this.selected_style(style))
.size(self.icon_size)

6
crates/ui/src/components/button/toggle_button.rs
View File

@ -57,9 +57,9 @@ impl ToggleButton {
}
}
impl Selectable for ToggleButton {
fn selected(mut self, selected: bool) -> Self {
self.base = self.base.selected(selected);
impl Toggleable for ToggleButton {
fn toggle_state(mut self, selected: bool) -> Self {
self.base = self.base.toggle_state(selected);
self
}
}

248
crates/ui/src/components/checkbox.rs
View File

@ -1,248 +0,0 @@
#![allow(missing_docs)]
use gpui::{div, prelude::*, ElementId, IntoElement, Styled, WindowContext};
use crate::prelude::*;
use crate::{Color, Icon, IconName, Selection};
/// # Checkbox
///
/// Checkboxes are used for multiple choices, not for mutually exclusive choices.
/// Each checkbox works independently from other checkboxes in the list,
/// therefore checking an additional box does not affect any other selections.
#[derive(IntoElement)]
pub struct Checkbox {
id: ElementId,
checked: Selection,
disabled: bool,
on_click: Option<Box<dyn Fn(&Selection, &mut WindowContext) + 'static>>,
}
impl Checkbox {
pub fn new(id: impl Into<ElementId>, checked: Selection) -> Self {
Self {
id: id.into(),
checked,
disabled: false,
on_click: None,
}
}
pub fn disabled(mut self, disabled: bool) -> Self {
self.disabled = disabled;
self
}
pub fn on_click(mut self, handler: impl Fn(&Selection, &mut WindowContext) + 'static) -> Self {
self.on_click = Some(Box::new(handler));
self
}
}
impl RenderOnce for Checkbox {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
let group_id = format!("checkbox_group_{:?}", self.id);
let icon = match self.checked {
Selection::Selected => Some(Icon::new(IconName::Check).size(IconSize::Small).color(
if self.disabled {
Color::Disabled
} else {
Color::Selected
},
)),
Selection::Indeterminate => Some(
Icon::new(IconName::Dash)
.size(IconSize::Small)
.color(if self.disabled {
Color::Disabled
} else {
Color::Selected
}),
),
Selection::Unselected => None,
};
let selected =
self.checked == Selection::Selected || self.checked == Selection::Indeterminate;
let (bg_color, border_color) = match (self.disabled, selected) {
(true, _) => (
cx.theme().colors().ghost_element_disabled,
cx.theme().colors().border_disabled,
),
(false, true) => (
cx.theme().colors().element_selected,
cx.theme().colors().border,
),
(false, false) => (
cx.theme().colors().element_background,
cx.theme().colors().border,
),
};
h_flex()
.id(self.id)
.justify_center()
.items_center()
.size(DynamicSpacing::Base20.rems(cx))
.group(group_id.clone())
.child(
div()
.flex()
.flex_none()
.justify_center()
.items_center()
.m(DynamicSpacing::Base04.px(cx))
.size(DynamicSpacing::Base16.rems(cx))
.rounded_sm()
.bg(bg_color)
.border_1()
.border_color(border_color)
.when(!self.disabled, |this| {
this.group_hover(group_id.clone(), |el| {
el.bg(cx.theme().colors().element_hover)
})
})
.children(icon),
)
.when_some(
self.on_click.filter(|_| !self.disabled),
|this, on_click| this.on_click(move |_, cx| on_click(&self.checked.inverse(), cx)),
)
}
}
impl ComponentPreview for Checkbox {
fn description() -> impl Into<Option<&'static str>> {
"A checkbox lets people choose between a pair of opposing states, like enabled and disabled, using a different appearance to indicate each state."
}
fn examples(_: &mut WindowContext) -> Vec<ComponentExampleGroup<Self>> {
vec![
example_group_with_title(
"Default",
vec![
single_example(
"Unselected",
Checkbox::new("checkbox_unselected", Selection::Unselected),
),
single_example(
"Indeterminate",
Checkbox::new("checkbox_indeterminate", Selection::Indeterminate),
),
single_example(
"Selected",
Checkbox::new("checkbox_selected", Selection::Selected),
),
],
),
example_group_with_title(
"Disabled",
vec![
single_example(
"Unselected",
Checkbox::new("checkbox_disabled_unselected", Selection::Unselected)
.disabled(true),
),
single_example(
"Indeterminate",
Checkbox::new("checkbox_disabled_indeterminate", Selection::Indeterminate)
.disabled(true),
),
single_example(
"Selected",
Checkbox::new("checkbox_disabled_selected", Selection::Selected)
.disabled(true),
),
],
),
]
}
}
use std::sync::Arc;
/// A [`Checkbox`] that has a [`Label`].
#[derive(IntoElement)]
pub struct CheckboxWithLabel {
id: ElementId,
label: Label,
checked: Selection,
on_click: Arc<dyn Fn(&Selection, &mut WindowContext) + 'static>,
}
impl CheckboxWithLabel {
pub fn new(
id: impl Into<ElementId>,
label: Label,
checked: Selection,
on_click: impl Fn(&Selection, &mut WindowContext) + 'static,
) -> Self {
Self {
id: id.into(),
label,
checked,
on_click: Arc::new(on_click),
}
}
}
impl RenderOnce for CheckboxWithLabel {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
h_flex()
.gap(DynamicSpacing::Base08.rems(cx))
.child(Checkbox::new(self.id.clone(), self.checked).on_click({
let on_click = self.on_click.clone();
move |checked, cx| {
(on_click)(checked, cx);
}
}))
.child(
div()
.id(SharedString::from(format!("{}-label", self.id)))
.on_click(move |_event, cx| {
(self.on_click)(&self.checked.inverse(), cx);
})
.child(self.label),
)
}
}
impl ComponentPreview for CheckboxWithLabel {
fn description() -> impl Into<Option<&'static str>> {
"A checkbox with an associated label, allowing users to select an option while providing a descriptive text."
}
fn examples(_: &mut WindowContext) -> Vec<ComponentExampleGroup<Self>> {
vec![example_group(vec![
single_example(
"Unselected",
CheckboxWithLabel::new(
"checkbox_with_label_unselected",
Label::new("Always save on quit"),
Selection::Unselected,
|_, _| {},
),
),
single_example(
"Indeterminate",
CheckboxWithLabel::new(
"checkbox_with_label_indeterminate",
Label::new("Always save on quit"),
Selection::Indeterminate,
|_, _| {},
),
),
single_example(
"Selected",
CheckboxWithLabel::new(
"checkbox_with_label_selected",
Label::new("Always save on quit"),
Selection::Selected,
|_, _| {},
),
),
])]
}
}

4
crates/ui/src/components/context_menu.rs
View File

@ -434,7 +434,7 @@ impl Render for ContextMenu {
ListItem::new(ix)
.inset(true)
.disabled(*disabled)
.selected(Some(ix) == self.selected_index)
.toggle_state(Some(ix) == self.selected_index)
.when_some(*toggle, |list_item, (position, toggled)| {
let contents = if toggled {
v_flex().flex_none().child(
@ -495,7 +495,7 @@ impl Render for ContextMenu {
let selectable = *selectable;
ListItem::new(ix)
.inset(true)
.selected(if selectable {
.toggle_state(if selectable {
Some(ix) == self.selected_index
} else {
false

6
crates/ui/src/components/disclosure.rs
View File

@ -34,8 +34,8 @@ impl Disclosure {
}
}
impl Selectable for Disclosure {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for Disclosure {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}
@ -65,7 +65,7 @@ impl RenderOnce for Disclosure {
.shape(IconButtonShape::Square)
.icon_color(Color::Muted)
.icon_size(IconSize::Small)
.selected(self.selected)
.toggle_state(self.selected)
.when_some(self.on_toggle, move |this, on_toggle| {
this.on_click(move |event, cx| on_toggle(event, cx))
})

4
crates/ui/src/components/dropdown_menu.rs
View File

@ -85,8 +85,8 @@ impl Disableable for DropdownMenuTrigger {
}
}
impl Selectable for DropdownMenuTrigger {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for DropdownMenuTrigger {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}

4
crates/ui/src/components/list/list_header.rs
View File

@ -73,8 +73,8 @@ impl ListHeader {
}
}
impl Selectable for ListHeader {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for ListHeader {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}

4
crates/ui/src/components/list/list_item.rs
View File

@ -156,8 +156,8 @@ impl Disableable for ListItem {
}
}
impl Selectable for ListItem {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for ListItem {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}

4
crates/ui/src/components/list/list_sub_header.rs
View File

@ -32,8 +32,8 @@ impl ListSubHeader {
}
}
impl Selectable for ListSubHeader {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for ListSubHeader {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}

6
crates/ui/src/components/popover_menu.rs
View File

@ -11,9 +11,9 @@ use gpui::{
use crate::prelude::*;
pub trait PopoverTrigger: IntoElement + Clickable + Selectable + 'static {}
pub trait PopoverTrigger: IntoElement + Clickable + Toggleable + 'static {}
impl<T: IntoElement + Clickable + Selectable + 'static> PopoverTrigger for T {}
impl<T: IntoElement + Clickable + Toggleable + 'static> PopoverTrigger for T {}
pub struct PopoverMenuHandle<M>(Rc<RefCell<Option<PopoverMenuHandleState<M>>>>);
@ -129,7 +129,7 @@ impl<M: ManagedView> PopoverMenu<M> {
pub fn trigger<T: PopoverTrigger>(mut self, t: T) -> Self {
self.child_builder = Some(Box::new(|menu, builder| {
let open = menu.borrow().is_some();
t.selected(open)
t.toggle_state(open)
.when_some(builder, |el, builder| {
el.on_click(move |_, cx| show_menu(&builder, &menu, cx))
})

6
crates/ui/src/components/stories/button.rs
View File

@ -13,11 +13,11 @@ impl Render for ButtonStory {
.child(Story::label("Default"))
.child(Button::new("default_filled", "Click me"))
.child(Story::label("Selected"))
.child(Button::new("selected_filled", "Click me").selected(true))
.child(Button::new("selected_filled", "Click me").toggle_state(true))
.child(Story::label("Selected with `selected_label`"))
.child(
Button::new("selected_label_filled", "Click me")
.selected(true)
.toggle_state(true)
.selected_label("I have been selected"),
)
.child(Story::label("With `label_color`"))
@ -27,7 +27,7 @@ impl Render for ButtonStory {
.child(Story::label("Selected with `icon`"))
.child(
Button::new("filled_and_selected_with_icon", "Click me")
.selected(true)
.toggle_state(true)
.icon(IconName::FileGit),
)
.child(Story::label("Default (Subtle)"))

6
crates/ui/src/components/stories/icon_button.rs
View File

@ -21,7 +21,7 @@ impl Render for IconButtonStory {
let selected_button = StoryItem::new(
"Selected",
IconButton::new("selected_icon_button", IconName::Hash).selected(true),
IconButton::new("selected_icon_button", IconName::Hash).toggle_state(true),
)
.description("Displays an icon button that is selected.")
.usage(
@ -33,7 +33,7 @@ impl Render for IconButtonStory {
let selected_with_selected_icon = StoryItem::new(
"Selected with `selected_icon`",
IconButton::new("selected_with_selected_icon_button", IconName::AudioOn)
.selected(true)
.toggle_state(true)
.selected_icon(IconName::AudioOff),
)
.description(
@ -89,7 +89,7 @@ impl Render for IconButtonStory {
let selected_with_tooltip_button = StoryItem::new(
"Selected with `tooltip`",
IconButton::new("selected_with_tooltip_button", IconName::InlayHint)
.selected(true)
.toggle_state(true)
.tooltip(|cx| Tooltip::text("Toggle inlay hints", cx)),
)
.description("Displays a selected icon button with tooltip.")

6
crates/ui/src/components/stories/tab.rs
View File

@ -48,7 +48,7 @@ impl Render for TabStory {
h_flex()
.child(
Tab::new("tab_1")
.selected(true)
.toggle_state(true)
.position(TabPosition::First)
.child("Tab 1"),
)
@ -85,7 +85,7 @@ impl Render for TabStory {
.child(
Tab::new("tab_4")
.position(TabPosition::Last)
.selected(true)
.toggle_state(true)
.child("Tab 4"),
),
)
@ -100,7 +100,7 @@ impl Render for TabStory {
.child(
Tab::new("tab_2")
.position(TabPosition::Middle(Ordering::Equal))
.selected(true)
.toggle_state(true)
.child("Tab 2"),
)
.child(

2
crates/ui/src/components/stories/tab_bar.rs
View File

@ -13,7 +13,7 @@ impl Render for TabBarStory {
let tabs = (0..tab_count)
.map(|index| {
Tab::new(index)
.selected(index == selected_tab_index)
.toggle_state(index == selected_tab_index)
.position(if index == 0 {
TabPosition::First
} else if index == tab_count - 1 {

2
crates/ui/src/components/stories/toggle_button.rs
View File

@ -68,7 +68,7 @@ impl Render for ToggleButtonStory {
ToggleButton::new(2, "Banana")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(true)
.toggle_state(true)
.middle(),
)
.child(

4
crates/ui/src/components/tab.rs
View File

@ -91,8 +91,8 @@ impl InteractiveElement for Tab {
impl StatefulInteractiveElement for Tab {}
impl Selectable for Tab {
fn selected(mut self, selected: bool) -> Self {
impl Toggleable for Tab {
fn toggle_state(mut self, selected: bool) -> Self {
self.selected = selected;
self
}

409
crates/ui/src/components/toggle.rs Normal file
View File

@ -0,0 +1,409 @@
#![allow(missing_docs)]
use gpui::{div, prelude::*, ElementId, IntoElement, Styled, WindowContext};
use std::sync::Arc;
use crate::prelude::*;
use crate::utils::is_light;
use crate::{Color, Icon, IconName, ToggleState};
/// Creates a new checkbox
pub fn checkbox(id: impl Into<ElementId>, toggle_state: ToggleState) -> Checkbox {
Checkbox::new(id, toggle_state)
}
/// Creates a new switch
pub fn switch(id: impl Into<ElementId>, toggle_state: ToggleState) -> Switch {
Switch::new(id, toggle_state)
}
/// # Checkbox
///
/// Checkboxes are used for multiple choices, not for mutually exclusive choices.
/// Each checkbox works independently from other checkboxes in the list,
/// therefore checking an additional box does not affect any other selections.
#[derive(IntoElement)]
pub struct Checkbox {
id: ElementId,
toggle_state: ToggleState,
disabled: bool,
on_click: Option<Box<dyn Fn(&ToggleState, &mut WindowContext) + 'static>>,
}
impl Checkbox {
pub fn new(id: impl Into<ElementId>, checked: ToggleState) -> Self {
Self {
id: id.into(),
toggle_state: checked,
disabled: false,
on_click: None,
}
}
pub fn disabled(mut self, disabled: bool) -> Self {
self.disabled = disabled;
self
}
pub fn on_click(
mut self,
handler: impl Fn(&ToggleState, &mut WindowContext) + 'static,
) -> Self {
self.on_click = Some(Box::new(handler));
self
}
}
impl RenderOnce for Checkbox {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
let group_id = format!("checkbox_group_{:?}", self.id);
let icon = match self.toggle_state {
ToggleState::Selected => Some(Icon::new(IconName::Check).size(IconSize::Small).color(
if self.disabled {
Color::Disabled
} else {
Color::Selected
},
)),
ToggleState::Indeterminate => Some(
Icon::new(IconName::Dash)
.size(IconSize::Small)
.color(if self.disabled {
Color::Disabled
} else {
Color::Selected
}),
),
ToggleState::Unselected => None,
};
let selected = self.toggle_state == ToggleState::Selected
|| self.toggle_state == ToggleState::Indeterminate;
let (bg_color, border_color) = match (self.disabled, selected) {
(true, _) => (
cx.theme().colors().ghost_element_disabled,
cx.theme().colors().border_disabled,
),
(false, true) => (
cx.theme().colors().element_selected,
cx.theme().colors().border,
),
(false, false) => (
cx.theme().colors().element_background,
cx.theme().colors().border,
),
};
h_flex()
.id(self.id)
.justify_center()
.items_center()
.size(DynamicSpacing::Base20.rems(cx))
.group(group_id.clone())
.child(
div()
.flex()
.flex_none()
.justify_center()
.items_center()
.m(DynamicSpacing::Base04.px(cx))
.size(DynamicSpacing::Base16.rems(cx))
.rounded_sm()
.bg(bg_color)
.border_1()
.border_color(border_color)
.when(!self.disabled, |this| {
this.group_hover(group_id.clone(), |el| {
el.bg(cx.theme().colors().element_hover)
})
})
.children(icon),
)
.when_some(
self.on_click.filter(|_| !self.disabled),
|this, on_click| {
this.on_click(move |_, cx| on_click(&self.toggle_state.inverse(), cx))
},
)
}
}
/// A [`Checkbox`] that has a [`Label`].
#[derive(IntoElement)]
pub struct CheckboxWithLabel {
id: ElementId,
label: Label,
checked: ToggleState,
on_click: Arc<dyn Fn(&ToggleState, &mut WindowContext) + 'static>,
}
impl CheckboxWithLabel {
pub fn new(
id: impl Into<ElementId>,
label: Label,
checked: ToggleState,
on_click: impl Fn(&ToggleState, &mut WindowContext) + 'static,
) -> Self {
Self {
id: id.into(),
label,
checked,
on_click: Arc::new(on_click),
}
}
}
impl RenderOnce for CheckboxWithLabel {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
h_flex()
.gap(DynamicSpacing::Base08.rems(cx))
.child(Checkbox::new(self.id.clone(), self.checked).on_click({
let on_click = self.on_click.clone();
move |checked, cx| {
(on_click)(checked, cx);
}
}))
.child(
div()
.id(SharedString::from(format!("{}-label", self.id)))
.on_click(move |_event, cx| {
(self.on_click)(&self.checked.inverse(), cx);
})
.child(self.label),
)
}
}
/// # Switch
///
/// Switches are used to represent opposite states, such as enabled or disabled.
#[derive(IntoElement)]
pub struct Switch {
id: ElementId,
toggle_state: ToggleState,
disabled: bool,
on_click: Option<Box<dyn Fn(&ToggleState, &mut WindowContext) + 'static>>,
}
impl Switch {
pub fn new(id: impl Into<ElementId>, state: ToggleState) -> Self {
Self {
id: id.into(),
toggle_state: state,
disabled: false,
on_click: None,
}
}
pub fn disabled(mut self, disabled: bool) -> Self {
self.disabled = disabled;
self
}
pub fn on_click(
mut self,
handler: impl Fn(&ToggleState, &mut WindowContext) + 'static,
) -> Self {
self.on_click = Some(Box::new(handler));
self
}
}
impl RenderOnce for Switch {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
let is_on = self.toggle_state == ToggleState::Selected;
let adjust_ratio = if is_light(cx) { 1.5 } else { 1.0 };
let base_color = cx.theme().colors().text;
let bg_color = if is_on {
cx.theme()
.colors()
.element_background
.blend(base_color.opacity(0.08))
} else {
cx.theme().colors().element_background
};
let thumb_color = base_color.opacity(0.8);
let thumb_hover_color = base_color;
let border_color = cx.theme().colors().border_variant;
// Lighter themes need higher contrast borders
let border_hover_color = if is_on {
border_color.blend(base_color.opacity(0.16 * adjust_ratio))
} else {
border_color.blend(base_color.opacity(0.05 * adjust_ratio))
};
let thumb_opacity = match (is_on, self.disabled) {
(_, true) => 0.2,
(true, false) => 1.0,
(false, false) => 0.5,
};
let group_id = format!("switch_group_{:?}", self.id);
h_flex()
.id(self.id)
.items_center()
.w(DynamicSpacing::Base32.rems(cx))
.h(DynamicSpacing::Base20.rems(cx))
.group(group_id.clone())
.child(
h_flex()
.when(is_on, |on| on.justify_end())
.when(!is_on, |off| off.justify_start())
.items_center()
.size_full()
.rounded_full()
.px(DynamicSpacing::Base02.px(cx))
.bg(bg_color)
.border_1()
.border_color(border_color)
.when(!self.disabled, |this| {
this.group_hover(group_id.clone(), |el| el.border_color(border_hover_color))
})
.child(
div()
.size(DynamicSpacing::Base12.rems(cx))
.rounded_full()
.bg(thumb_color)
.when(!self.disabled, |this| {
this.group_hover(group_id.clone(), |el| el.bg(thumb_hover_color))
})
.opacity(thumb_opacity),
),
)
.when_some(
self.on_click.filter(|_| !self.disabled),
|this, on_click| {
this.on_click(move |_, cx| on_click(&self.toggle_state.inverse(), cx))
},
)
}
}
impl ComponentPreview for Checkbox {
fn description() -> impl Into<Option<&'static str>> {
"A checkbox lets people choose between a pair of opposing states, like enabled and disabled, using a different appearance to indicate each state."
}
fn examples(_: &mut WindowContext) -> Vec<ComponentExampleGroup<Self>> {
vec![
example_group_with_title(
"Default",
vec![
single_example(
"Unselected",
Checkbox::new("checkbox_unselected", ToggleState::Unselected),
),
single_example(
"Indeterminate",
Checkbox::new("checkbox_indeterminate", ToggleState::Indeterminate),
),
single_example(
"Selected",
Checkbox::new("checkbox_selected", ToggleState::Selected),
),
],
),
example_group_with_title(
"Disabled",
vec![
single_example(
"Unselected",
Checkbox::new("checkbox_disabled_unselected", ToggleState::Unselected)
.disabled(true),
),
single_example(
"Indeterminate",
Checkbox::new(
"checkbox_disabled_indeterminate",
ToggleState::Indeterminate,
)
.disabled(true),
),
single_example(
"Selected",
Checkbox::new("checkbox_disabled_selected", ToggleState::Selected)
.disabled(true),
),
],
),
]
}
}
impl ComponentPreview for Switch {
fn description() -> impl Into<Option<&'static str>> {
"A switch toggles between two mutually exclusive states, typically used for enabling or disabling a setting."
}
fn examples(_cx: &mut WindowContext) -> Vec<ComponentExampleGroup<Self>> {
vec![
example_group_with_title(
"Default",
vec![
single_example(
"Off",
Switch::new("switch_off", ToggleState::Unselected).on_click(|_, _cx| {}),
),
single_example(
"On",
Switch::new("switch_on", ToggleState::Selected).on_click(|_, _cx| {}),
),
],
),
example_group_with_title(
"Disabled",
vec![
single_example(
"Off",
Switch::new("switch_disabled_off", ToggleState::Unselected).disabled(true),
),
single_example(
"On",
Switch::new("switch_disabled_on", ToggleState::Selected).disabled(true),
),
],
),
]
}
}
impl ComponentPreview for CheckboxWithLabel {
fn description() -> impl Into<Option<&'static str>> {
"A checkbox with an associated label, allowing users to select an option while providing a descriptive text."
}
fn examples(_: &mut WindowContext) -> Vec<ComponentExampleGroup<Self>> {
vec![example_group(vec![
single_example(
"Unselected",
CheckboxWithLabel::new(
"checkbox_with_label_unselected",
Label::new("Always save on quit"),
ToggleState::Unselected,
|_, _| {},
),
),
single_example(
"Indeterminate",
CheckboxWithLabel::new(
"checkbox_with_label_indeterminate",
Label::new("Always save on quit"),
ToggleState::Indeterminate,
|_, _| {},
),
),
single_example(
"Selected",
CheckboxWithLabel::new(
"checkbox_with_label_selected",
Label::new("Always save on quit"),
ToggleState::Selected,
|_, _| {},
),
),
])]
}
}

2
crates/ui/src/prelude.rs
View File

@ -12,8 +12,8 @@ pub use crate::traits::clickable::*;
pub use crate::traits::component_preview::*;
pub use crate::traits::disableable::*;
pub use crate::traits::fixed::*;
pub use crate::traits::selectable::*;
pub use crate::traits::styled_ext::*;
pub use crate::traits::toggleable::*;
pub use crate::traits::visible_on_hover::*;
pub use crate::DynamicSpacing;
pub use crate::{h_flex, h_group, v_flex, v_group};

2
crates/ui/src/traits.rs
View File

@ -2,6 +2,6 @@ pub mod clickable;
pub mod component_preview;
pub mod disableable;
pub mod fixed;
pub mod selectable;
pub mod styled_ext;
pub mod toggleable;
pub mod visible_on_hover;

17
crates/ui/src/traits/selectable.rs → crates/ui/src/traits/toggleable.rs
View File

@ -1,14 +1,15 @@
/// A trait for elements that can be selected.
/// A trait for elements that can be toggled.
///
/// Generally used to enable "toggle" or "active" behavior and styles on an element through the [`Selection`] status.
pub trait Selectable {
/// Implement this for elements that are visually distinct
/// when in two opposing states, like checkboxes or switches.
pub trait Toggleable {
/// Sets whether the element is selected.
fn selected(self, selected: bool) -> Self;
fn toggle_state(self, selected: bool) -> Self;
}
/// Represents the selection status of an element.
#[derive(Debug, Default, PartialEq, Eq, Hash, Clone, Copy)]
pub enum Selection {
pub enum ToggleState {
/// The element is not selected.
#[default]
Unselected,
@ -18,7 +19,7 @@ pub enum Selection {
Selected,
}
impl Selection {
impl ToggleState {
/// Returns the inverse of the current selection status.
///
/// Indeterminate states become selected if inverted.
@ -30,7 +31,7 @@ impl Selection {
}
}
impl From<bool> for Selection {
impl From<bool> for ToggleState {
fn from(selected: bool) -> Self {
if selected {
Self::Selected
@ -40,7 +41,7 @@ impl From<bool> for Selection {
}
}
impl From<Option<bool>> for Selection {
impl From<Option<bool>> for ToggleState {
fn from(selected: Option<bool>) -> Self {
match selected {
Some(true) => Self::Selected,

8
crates/ui/src/utils.rs
View File

@ -1,5 +1,8 @@
//! UI-related utilities
use gpui::WindowContext;
use theme::ActiveTheme;
mod color_contrast;
mod format_distance;
mod search_input;
@ -9,3 +12,8 @@ pub use color_contrast::*;
pub use format_distance::*;
pub use search_input::*;
pub use with_rem_size::*;
/// Returns true if the current theme is light or vibrant light.
pub fn is_light(cx: &WindowContext) -> bool {
cx.theme().appearance.is_light()
}

2
crates/vcs_menu/src/lib.rs
View File

@ -284,7 +284,7 @@ impl PickerDelegate for BranchListDelegate {
ListItem::new(SharedString::from(format!("vcs-menu-{ix}")))
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.map(|parent| match hit {
BranchEntry::Branch(branch) => {
let highlights: Vec<_> = branch

2
crates/welcome/src/base_keymap_picker.rs
View File

@ -208,7 +208,7 @@ impl PickerDelegate for BaseKeymapSelectorDelegate {
ListItem::new(ix)
.inset(true)
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.toggle_state(selected)
.child(HighlightedLabel::new(
keymap_match.string.clone(),
keymap_match.positions.clone(),

18
crates/welcome/src/welcome.rs
View File

@ -273,9 +273,9 @@ impl Render for WelcomePage {
"enable-vim",
Label::new("Enable Vim Mode"),
if VimModeSetting::get_global(cx).0 {
ui::Selection::Selected
ui::ToggleState::Selected
} else {
ui::Selection::Unselected
ui::ToggleState::Unselected
},
cx.listener(move |this, selection, cx| {
this.telemetry
@ -298,9 +298,9 @@ impl Render for WelcomePage {
"enable-crash",
Label::new("Send Crash Reports"),
if TelemetrySettings::get_global(cx).diagnostics {
ui::Selection::Selected
ui::ToggleState::Selected
} else {
ui::Selection::Unselected
ui::ToggleState::Unselected
},
cx.listener(move |this, selection, cx| {
this.telemetry.report_app_event(
@ -324,9 +324,9 @@ impl Render for WelcomePage {
"enable-telemetry",
Label::new("Send Telemetry"),
if TelemetrySettings::get_global(cx).metrics {
ui::Selection::Selected
ui::ToggleState::Selected
} else {
ui::Selection::Unselected
ui::ToggleState::Unselected
},
cx.listener(move |this, selection, cx| {
this.telemetry.report_app_event(
@ -381,7 +381,7 @@ impl WelcomePage {
fn update_settings<T: Settings>(
&mut self,
selection: &Selection,
selection: &ToggleState,
cx: &mut ViewContext<Self>,
callback: impl 'static + Send + Fn(&mut T::FileContent, bool),
) {
@ -390,8 +390,8 @@ impl WelcomePage {
let selection = *selection;
settings::update_settings_file::<T>(fs, cx, move |settings, _| {
let value = match selection {
Selection::Unselected => false,
Selection::Selected => true,
ToggleState::Unselected => false,
ToggleState::Selected => true,
_ => return,
};

2
crates/workspace/src/dock.rs
View File

@ -781,7 +781,7 @@ impl Render for PanelButtons {
.trigger(
IconButton::new(name, icon)
.icon_size(IconSize::Small)
.selected(is_active_button)
.toggle_state(is_active_button)
.on_click({
let action = action.boxed_clone();
move |_, cx| cx.dispatch_action(action.boxed_clone())

6
crates/workspace/src/pane.rs
View File

@ -481,7 +481,7 @@ impl Pane {
let zoomed = pane.is_zoomed();
IconButton::new("toggle_zoom", IconName::Maximize)
.icon_size(IconSize::Small)
.selected(zoomed)
.toggle_state(zoomed)
.selected_icon(IconName::Minimize)
.on_click(cx.listener(|pane, _, cx| {
pane.toggle_zoom(&crate::ToggleZoom, cx);
@ -2038,7 +2038,7 @@ impl Pane {
ClosePosition::Left => ui::TabCloseSide::Start,
ClosePosition::Right => ui::TabCloseSide::End,
})
.selected(is_active)
.toggle_state(is_active)
.on_click(
cx.listener(move |pane: &mut Self, _, cx| pane.activate_item(ix, true, true, cx)),
)
@ -3273,7 +3273,7 @@ impl Render for DraggedTab {
cx,
);
Tab::new("")
.selected(self.is_active)
.toggle_state(self.is_active)
.child(label)
.render(cx)
.font(ui_font)

5
crates/workspace/src/theme_preview.rs
View File

@ -6,7 +6,7 @@ use ui::{
element_cell, prelude::*, string_cell, utils::calculate_contrast_ratio, AudioStatus,
Availability, Avatar, AvatarAudioStatusIndicator, AvatarAvailabilityIndicator, ButtonLike,
Checkbox, CheckboxWithLabel, ContentGroup, DecoratedIcon, ElevationIndex, Facepile,
IconDecoration, Indicator, Table, TintColor, Tooltip,
IconDecoration, Indicator, Switch, Table, TintColor, Tooltip,
};
use crate::{Item, Workspace};
@ -369,6 +369,7 @@ impl ThemePreview {
.overflow_scroll()
.size_full()
.gap_2()
.child(Switch::render_component_previews(cx))
.child(ContentGroup::render_component_previews(cx))
.child(IconDecoration::render_component_previews(cx))
.child(DecoratedIcon::render_component_previews(cx))
@ -394,7 +395,7 @@ impl ThemePreview {
this.current_page = p;
cx.notify();
}))
.selected(p == self.current_page)
.toggle_state(p == self.current_page)
.selected_style(ButtonStyle::Tinted(TintColor::Accent))
}))
}

6
crates/zed/src/zed/quick_action_bar.rs
View File

@ -162,7 +162,7 @@ impl Render for QuickActionBar {
.shape(IconButtonShape::Square)
.icon_size(IconSize::Small)
.style(ButtonStyle::Subtle)
.selected(self.toggle_selections_handle.is_deployed())
.toggle_state(self.toggle_selections_handle.is_deployed())
.when(!self.toggle_selections_handle.is_deployed(), |this| {
this.tooltip(|cx| Tooltip::text("Selection Controls", cx))
}),
@ -212,7 +212,7 @@ impl Render for QuickActionBar {
.shape(IconButtonShape::Square)
.icon_size(IconSize::Small)
.style(ButtonStyle::Subtle)
.selected(self.toggle_settings_handle.is_deployed())
.toggle_state(self.toggle_settings_handle.is_deployed())
.when(!self.toggle_settings_handle.is_deployed(), |this| {
this.tooltip(|cx| Tooltip::text("Editor Controls", cx))
}),
@ -407,7 +407,7 @@ impl RenderOnce for QuickActionBarButton {
.shape(IconButtonShape::Square)
.icon_size(IconSize::Small)
.style(ButtonStyle::Subtle)
.selected(self.toggled)
.toggle_state(self.toggled)
.tooltip(move |cx| {
Tooltip::for_action_in(tooltip.clone(), &*action, &self.focus_handle, cx)
})

2
crates/zeta/src/rate_completion_modal.rs
View File

@ -578,7 +578,7 @@ impl Render for RateCompletionModal {
.inset(true)
.spacing(ListItemSpacing::Sparse)
.focused(index == self.selected_index)
.selected(selected)
.toggle_state(selected)
.start_slot(if rated {
Icon::new(IconName::Check).color(Color::Success).size(IconSize::Small)
} else if completion.edits.is_empty() {