Rename h_stack and v_stack to h_flex and v_flex, respectively (#4053)

This PR renames the `h_stack` and `v_stack` to `h_flex` and `v_flex`,
respectively.

We were previously using `h_stack` and `v_stack` to match SwiftUI, but
`h_flex` and `v_flex` fit better with the web/flexbox terminology that
the rest of GPUI uses.

Additionally, we were already calling the utility functions used to
implement `h_stack` and `v_stack` by the new names.

Release Notes:

- N/A
This commit is contained in:
Marshall Bowers 2024-01-15 11:34:06 -05:00 committed by GitHub
parent b136d21ebf
commit 90f4c70a82
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
69 changed files with 271 additions and 271 deletions

View File

@ -295,7 +295,7 @@ impl Render for ActivityIndicator {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let content = self.content_to_render(cx);
let mut result = h_stack()
let mut result = h_flex()
.id("activity-indicator")
.on_action(cx.listener(Self::show_error_message))
.on_action(cx.listener(Self::dismiss_error_message));

View File

@ -1090,7 +1090,7 @@ fn build_api_key_editor(cx: &mut ViewContext<AssistantPanel>) -> View<Editor> {
impl Render for AssistantPanel {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
if let Some(api_key_editor) = self.api_key_editor.clone() {
v_stack()
v_flex()
.on_action(cx.listener(AssistantPanel::save_credentials))
.track_focus(&self.focus_handle)
.child(Label::new(
@ -1115,26 +1115,26 @@ impl Render for AssistantPanel {
} else {
let header = TabBar::new("assistant_header")
.start_child(
h_stack().gap_1().child(Self::render_hamburger_button(cx)), // .children(title),
h_flex().gap_1().child(Self::render_hamburger_button(cx)), // .children(title),
)
.children(self.active_editor().map(|editor| {
h_stack()
h_flex()
.h(rems(Tab::HEIGHT_IN_REMS))
.flex_1()
.px_2()
.child(Label::new(editor.read(cx).title(cx)).into_element())
}))
.end_child(if self.focus_handle.contains_focused(cx) {
h_stack()
h_flex()
.gap_2()
.child(h_stack().gap_1().children(self.render_editor_tools(cx)))
.child(h_flex().gap_1().children(self.render_editor_tools(cx)))
.child(
ui::Divider::vertical()
.inset()
.color(ui::DividerColor::Border),
)
.child(
h_stack()
h_flex()
.gap_1()
.child(Self::render_plus_button(cx))
.child(self.render_zoom_button(cx)),
@ -1153,7 +1153,7 @@ impl Render for AssistantPanel {
} else {
div()
};
v_stack()
v_flex()
.key_context("AssistantPanel")
.size_full()
.on_action(cx.listener(|this, _: &workspace::NewFile, cx| {
@ -2530,7 +2530,7 @@ impl Render for ConversationEditor {
.child(self.editor.clone()),
)
.child(
h_stack()
h_flex()
.absolute()
.gap_1()
.top_3()
@ -2616,7 +2616,7 @@ impl EventEmitter<InlineAssistantEvent> for InlineAssistant {}
impl Render for InlineAssistant {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl Element {
let measurements = self.measurements.get();
h_stack()
h_flex()
.w_full()
.py_2()
.border_y_1()
@ -2628,7 +2628,7 @@ impl Render for InlineAssistant {
.on_action(cx.listener(Self::move_up))
.on_action(cx.listener(Self::move_down))
.child(
h_stack()
h_flex()
.justify_center()
.w(measurements.gutter_width)
.child(
@ -2676,7 +2676,7 @@ impl Render for InlineAssistant {
}),
)
.child(
h_stack()
h_flex()
.w_full()
.ml(measurements.anchor_x - measurements.gutter_width)
.child(self.render_prompt_editor(cx)),

View File

@ -4,7 +4,7 @@ use gpui::{
};
use menu::Cancel;
use util::channel::ReleaseChannel;
use workspace::ui::{h_stack, v_stack, Icon, IconName, Label, StyledExt};
use workspace::ui::{h_flex, v_flex, Icon, IconName, Label, StyledExt};
pub struct UpdateNotification {
version: SemanticVersion,
@ -16,12 +16,12 @@ impl Render for UpdateNotification {
fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> impl IntoElement {
let app_name = cx.global::<ReleaseChannel>().display_name();
v_stack()
v_flex()
.on_action(cx.listener(UpdateNotification::dismiss))
.elevation_3(cx)
.p_4()
.child(
h_stack()
h_flex()
.justify_between()
.child(Label::new(format!(
"Updated to {app_name} {}",

View File

@ -31,7 +31,7 @@ impl EventEmitter<ToolbarItemEvent> for Breadcrumbs {}
impl Render for Breadcrumbs {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let element = h_stack().text_ui();
let element = h_flex().text_ui();
let Some(active_item) = self.active_item.as_ref() else {
return element;
};
@ -51,7 +51,7 @@ impl Render for Breadcrumbs {
Label::new("").color(Color::Muted).into_any_element()
});
let breadcrumbs_stack = h_stack().gap_1().children(breadcrumbs);
let breadcrumbs_stack = h_flex().gap_1().children(breadcrumbs);
match active_item
.downcast::<Editor>()
.map(|editor| editor.downgrade())

View File

@ -325,13 +325,13 @@ impl ChatPanel {
};
let this = cx.view().clone();
v_stack()
v_flex()
.w_full()
.relative()
.overflow_hidden()
.when(!is_continuation_from_previous, |this| {
this.pt_3().child(
h_stack()
h_flex()
.child(
div().absolute().child(
Avatar::new(message.sender.avatar_uri.clone())
@ -358,7 +358,7 @@ impl ChatPanel {
})
.when(is_continuation_from_previous, |this| this.pt_1())
.child(
v_stack()
v_flex()
.w_full()
.text_ui_sm()
.id(element_id)
@ -514,14 +514,14 @@ impl ChatPanel {
impl Render for ChatPanel {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.track_focus(&self.focus_handle)
.full()
.on_action(cx.listener(Self::send))
.child(
h_stack().z_index(1).child(
h_flex().z_index(1).child(
TabBar::new("chat_header").child(
h_stack()
h_flex()
.w_full()
.h(rems(ui::Tab::HEIGHT_IN_REMS))
.px_2()
@ -567,7 +567,7 @@ impl Render for ChatPanel {
}
}))
.child(
h_stack()
h_flex()
.when(!self.is_scrolled_to_bottom, |el| {
el.border_t_1().border_color(cx.theme().colors().border)
})

View File

@ -887,7 +887,7 @@ impl CollabPanel {
.ok();
}))
.start_slot(
h_stack()
h_flex()
.gap_1()
.child(render_tree_branch(is_last, false, cx))
.child(IconButton::new(0, IconName::Folder)),
@ -908,7 +908,7 @@ impl CollabPanel {
ListItem::new(("screen", id))
.selected(is_selected)
.start_slot(
h_stack()
h_flex()
.gap_1()
.child(render_tree_branch(is_last, false, cx))
.child(IconButton::new(0, IconName::Screen)),
@ -949,7 +949,7 @@ impl CollabPanel {
this.open_channel_notes(channel_id, cx);
}))
.start_slot(
h_stack()
h_flex()
.gap_1()
.child(render_tree_branch(false, true, cx))
.child(IconButton::new(0, IconName::File)),
@ -970,7 +970,7 @@ impl CollabPanel {
this.join_channel_chat(channel_id, cx);
}))
.start_slot(
h_stack()
h_flex()
.gap_1()
.child(render_tree_branch(false, false, cx))
.child(IconButton::new(0, IconName::MessageBubbles)),
@ -1726,12 +1726,12 @@ impl CollabPanel {
fn render_signed_out(&mut self, cx: &mut ViewContext<Self>) -> Div {
let collab_blurb = "Work with your team in realtime with collaborative editing, voice, shared notes and more.";
v_stack()
v_flex()
.gap_6()
.p_4()
.child(Label::new(collab_blurb))
.child(
v_stack()
v_flex()
.gap_2()
.child(
Button::new("sign_in", "Sign in")
@ -1832,14 +1832,14 @@ impl CollabPanel {
}
fn render_signed_in(&mut self, cx: &mut ViewContext<Self>) -> Div {
v_stack()
v_flex()
.size_full()
.child(list(self.list_state.clone()).full())
.child(
v_stack()
v_flex()
.child(div().mx_2().border_primary(cx).border_t())
.child(
v_stack()
v_flex()
.p_2()
.child(self.render_filter_input(&self.filter_editor, cx)),
),
@ -1961,7 +1961,7 @@ impl CollabPanel {
| Section::Offline => true,
};
h_stack()
h_flex()
.w_full()
.group("section-header")
.child(
@ -2007,7 +2007,7 @@ impl CollabPanel {
.selected(is_selected)
.on_click(cx.listener(move |this, _, cx| this.call(user_id, cx)))
.child(
h_stack()
h_flex()
.w_full()
.justify_between()
.child(Label::new(github_login.clone()))
@ -2105,11 +2105,11 @@ impl CollabPanel {
.indent_step_size(px(20.))
.selected(is_selected)
.child(
h_stack()
h_flex()
.w_full()
.justify_between()
.child(Label::new(github_login.clone()))
.child(h_stack().children(controls)),
.child(h_flex().children(controls)),
)
.start_slot(Avatar::new(user.avatar_uri.clone()))
}
@ -2149,11 +2149,11 @@ impl CollabPanel {
ListItem::new(("channel-invite", channel.id as usize))
.selected(is_selected)
.child(
h_stack()
h_flex()
.w_full()
.justify_between()
.child(Label::new(channel.name.clone()))
.child(h_stack().children(controls)),
.child(h_flex().children(controls)),
)
.start_slot(
Icon::new(IconName::Hash)
@ -2289,21 +2289,21 @@ impl CollabPanel {
.color(Color::Muted),
)
.child(
h_stack()
h_flex()
.id(channel_id as usize)
.child(Label::new(channel.name.clone()))
.children(face_pile.map(|face_pile| face_pile.render(cx))),
),
)
.child(
h_stack()
h_flex()
.absolute()
.right(rems(0.))
.h_full()
// HACK: Without this the channel name clips on top of the icons, but I'm not sure why.
.z_index(10)
.child(
h_stack()
h_flex()
.h_full()
.gap_1()
.px_1()
@ -2410,7 +2410,7 @@ fn render_tree_branch(is_last: bool, overdraw: bool, cx: &mut WindowContext) ->
impl Render for CollabPanel {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.key_context("CollabPanel")
.on_action(cx.listener(CollabPanel::cancel))
.on_action(cx.listener(CollabPanel::select_next))
@ -2603,7 +2603,7 @@ struct DraggedChannelView {
impl Render for DraggedChannelView {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl Element {
let ui_font = ThemeSettings::get_global(cx).ui_font.family.clone();
h_stack()
h_flex()
.font(ui_font)
.bg(cx.theme().colors().background)
.w(self.width)

View File

@ -152,19 +152,19 @@ impl Render for ChannelModal {
let visibility = channel.visibility;
let mode = self.picker.read(cx).delegate.mode;
v_stack()
v_flex()
.key_context("ChannelModal")
.on_action(cx.listener(Self::toggle_mode))
.on_action(cx.listener(Self::dismiss))
.elevation_3(cx)
.w(rems(34.))
.child(
v_stack()
v_flex()
.px_2()
.py_1()
.gap_2()
.child(
h_stack()
h_flex()
.w_px()
.flex_1()
.gap_1()
@ -172,13 +172,13 @@ impl Render for ChannelModal {
.child(Label::new(channel_name)),
)
.child(
h_stack()
h_flex()
.w_full()
.h(rems(22. / 16.))
.justify_between()
.line_height(rems(1.25))
.child(
h_stack()
h_flex()
.gap_2()
.child(
Checkbox::new(
@ -212,7 +212,7 @@ impl Render for ChannelModal {
),
)
.child(
h_stack()
h_flex()
.child(
div()
.id("manage-members")
@ -391,7 +391,7 @@ impl PickerDelegate for ChannelModalDelegate {
.selected(selected)
.start_slot(Avatar::new(user.avatar_uri.clone()))
.child(Label::new(user.github_login.clone()))
.end_slot(h_stack().gap_2().map(|slot| {
.end_slot(h_flex().gap_2().map(|slot| {
match self.mode {
Mode::ManageMembers => slot
.children(

View File

@ -36,17 +36,17 @@ impl ContactFinder {
impl Render for ContactFinder {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.elevation_3(cx)
.child(
v_stack()
v_flex()
.px_2()
.py_1()
.bg(cx.theme().colors().element_background)
// HACK: Prevent the background color from overflowing the parent container.
.rounded_t(px(8.))
.child(Label::new("Contacts"))
.child(h_stack().child(Label::new("Invite new contacts"))),
.child(h_flex().child(Label::new("Invite new contacts"))),
)
.child(self.picker.clone())
.w(rems(34.))

View File

@ -14,7 +14,7 @@ use rpc::proto;
use std::sync::Arc;
use theme::{ActiveTheme, PlayerColors};
use ui::{
h_stack, popover_menu, prelude::*, Avatar, Button, ButtonLike, ButtonStyle, ContextMenu, Icon,
h_flex, popover_menu, prelude::*, Avatar, Button, ButtonLike, ButtonStyle, ContextMenu, Icon,
IconButton, IconName, TintColor, Tooltip,
};
use util::ResultExt;
@ -58,7 +58,7 @@ impl Render for CollabTitlebarItem {
let client = self.client.clone();
let project_id = self.project.read(cx).remote_id();
h_stack()
h_flex()
.id("titlebar")
.justify_between()
.w_full()
@ -83,7 +83,7 @@ impl Render for CollabTitlebarItem {
})
// left side
.child(
h_stack()
h_flex()
.gap_1()
.children(self.render_project_host(cx))
.child(self.render_project_name(cx))
@ -128,7 +128,7 @@ impl Render for CollabTitlebarItem {
)?;
Some(
v_stack()
v_flex()
.id(("collaborator", collaborator.user.id))
.child(face_pile)
.child(render_color_ribbon(
@ -160,7 +160,7 @@ impl Render for CollabTitlebarItem {
)
// right side
.child(
h_stack()
h_flex()
.gap_1()
.pr_1()
.when_some(room, |this, room| {
@ -634,7 +634,7 @@ impl CollabTitlebarItem {
.trigger(
ButtonLike::new("user-menu")
.child(
h_stack()
h_flex()
.gap_0p5()
.child(Avatar::new(user.avatar_uri.clone()))
.child(Icon::new(IconName::ChevronDown).color(Color::Muted)),
@ -657,7 +657,7 @@ impl CollabTitlebarItem {
.trigger(
ButtonLike::new("user-menu")
.child(
h_stack()
h_flex()
.gap_0p5()
.child(Icon::new(IconName::ChevronDown).color(Color::Muted)),
)

View File

@ -19,7 +19,7 @@ use serde::{Deserialize, Serialize};
use settings::{Settings, SettingsStore};
use std::{sync::Arc, time::Duration};
use time::{OffsetDateTime, UtcOffset};
use ui::{h_stack, prelude::*, v_stack, Avatar, Button, Icon, IconButton, IconName, Label};
use ui::{h_flex, prelude::*, v_flex, Avatar, Button, Icon, IconButton, IconName, Label};
use util::{ResultExt, TryFutureExt};
use workspace::{
dock::{DockPosition, Panel, PanelEvent},
@ -251,13 +251,13 @@ impl NotificationPanel {
.rounded_full()
}))
.child(
v_stack()
v_flex()
.gap_1()
.size_full()
.overflow_hidden()
.child(Label::new(text.clone()))
.child(
h_stack()
h_flex()
.child(
Label::new(format_timestamp(
timestamp,
@ -276,7 +276,7 @@ impl NotificationPanel {
)))
} else if needs_response {
Some(
h_stack()
h_flex()
.flex_grow()
.justify_end()
.child(Button::new("decline", "Decline").on_click({
@ -541,10 +541,10 @@ impl NotificationPanel {
impl Render for NotificationPanel {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.size_full()
.child(
h_stack()
h_flex()
.justify_between()
.px_2()
.py_1()
@ -558,7 +558,7 @@ impl Render for NotificationPanel {
.map(|this| {
if self.client.user_id().is_none() {
this.child(
v_stack()
v_flex()
.gap_2()
.p_4()
.child(
@ -592,7 +592,7 @@ impl Render for NotificationPanel {
)
} else if self.notification_list.item_count() == 0 {
this.child(
v_stack().p_4().child(
v_flex().p_4().child(
div().flex().w_full().items_center().child(
Label::new("You have no notifications.")
.color(Color::Muted)
@ -711,7 +711,7 @@ impl Render for NotificationToast {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let user = self.actor.clone();
h_stack()
h_flex()
.id("notification_panel_toast")
.children(user.map(|user| Avatar::new(user.avatar_uri.clone())))
.child(Label::new(self.text.clone()))

View File

@ -33,7 +33,7 @@ impl ParentElement for CollabNotification {
impl RenderOnce for CollabNotification {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
h_stack()
h_flex()
.text_ui()
.justify_between()
.size_full()
@ -42,9 +42,9 @@ impl RenderOnce for CollabNotification {
.p_2()
.gap_2()
.child(img(self.avatar_uri).w_12().h_12().rounded_full())
.child(v_stack().overflow_hidden().children(self.children))
.child(v_flex().overflow_hidden().children(self.children))
.child(
v_stack()
v_flex()
.child(self.accept_button)
.child(self.dismiss_button),
)

View File

@ -137,7 +137,7 @@ impl Render for IncomingCallNotification {
move |_, cx| state.respond(false, cx)
}),
)
.child(v_stack().overflow_hidden().child(Label::new(format!(
.child(v_flex().overflow_hidden().child(Label::new(format!(
"{} is sharing a project in Zed",
self.state.call.calling_user.github_login
)))),

View File

@ -24,7 +24,7 @@ impl Render for CollabNotificationStory {
Button::new("decline", "Decline"),
)
.child(
v_stack()
v_flex()
.overflow_hidden()
.child(Label::new("maxdeviant is sharing a project in Zed")),
),

View File

@ -11,7 +11,7 @@ use gpui::{
};
use picker::{Picker, PickerDelegate};
use ui::{h_stack, prelude::*, v_stack, HighlightedLabel, KeyBinding, ListItem, ListItemSpacing};
use ui::{h_flex, prelude::*, v_flex, HighlightedLabel, KeyBinding, ListItem, ListItemSpacing};
use util::{
channel::{parse_zed_link, ReleaseChannel, RELEASE_CHANNEL},
ResultExt,
@ -84,7 +84,7 @@ impl FocusableView for CommandPalette {
impl Render for CommandPalette {
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack().w(rems(34.)).child(self.picker.clone())
v_flex().w(rems(34.)).child(self.picker.clone())
}
}
@ -311,7 +311,7 @@ impl PickerDelegate for CommandPaletteDelegate {
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.child(
h_stack()
h_flex()
.w_full()
.justify_between()
.child(HighlightedLabel::new(

View File

@ -57,7 +57,7 @@ impl CopilotCodeVerification {
.read_from_clipboard()
.map(|item| item.text() == &data.user_code)
.unwrap_or(false);
h_stack()
h_flex()
.w_full()
.p_1()
.border()
@ -90,7 +90,7 @@ impl CopilotCodeVerification {
} else {
"Connect to Github"
};
v_stack()
v_flex()
.flex_1()
.gap_2()
.items_center()
@ -118,7 +118,7 @@ impl CopilotCodeVerification {
)
}
fn render_enabled_modal(cx: &mut ViewContext<Self>) -> impl Element {
v_stack()
v_flex()
.gap_2()
.child(Headline::new("Copilot Enabled!").size(HeadlineSize::Large))
.child(Label::new(
@ -132,7 +132,7 @@ impl CopilotCodeVerification {
}
fn render_unauthorized_modal() -> impl Element {
v_stack()
v_flex()
.child(Headline::new("You must have an active GitHub Copilot subscription.").size(HeadlineSize::Large))
.child(Label::new(
@ -163,7 +163,7 @@ impl Render for CopilotCodeVerification {
_ => div().into_any_element(),
};
v_stack()
v_flex()
.id("copilot code verification")
.elevation_3(cx)
.w_96()

View File

@ -36,7 +36,7 @@ use std::{
};
use theme::ActiveTheme;
pub use toolbar_controls::ToolbarControls;
use ui::{h_stack, prelude::*, Icon, IconName, Label};
use ui::{h_flex, prelude::*, Icon, IconName, Label};
use util::TryFutureExt;
use workspace::{
item::{BreadcrumbText, Item, ItemEvent, ItemHandle},
@ -654,11 +654,11 @@ impl Item for ProjectDiagnosticsEditor {
})
.into_any_element()
} else {
h_stack()
h_flex()
.gap_1()
.when(self.summary.error_count > 0, |then| {
then.child(
h_stack()
h_flex()
.gap_1()
.child(Icon::new(IconName::XCircle).color(Color::Error))
.child(Label::new(self.summary.error_count.to_string()).color(
@ -672,7 +672,7 @@ impl Item for ProjectDiagnosticsEditor {
})
.when(self.summary.warning_count > 0, |then| {
then.child(
h_stack()
h_flex()
.gap_1()
.child(Icon::new(IconName::ExclamationTriangle).color(Color::Warning))
.child(Label::new(self.summary.warning_count.to_string()).color(
@ -796,7 +796,7 @@ fn diagnostic_header_renderer(diagnostic: Diagnostic) -> RenderBlock {
let message: SharedString = message.into();
Arc::new(move |cx| {
let highlight_style: HighlightStyle = cx.theme().colors().text_accent.into();
h_stack()
h_flex()
.id("diagnostic header")
.py_2()
.pl_10()
@ -805,7 +805,7 @@ fn diagnostic_header_renderer(diagnostic: Diagnostic) -> RenderBlock {
.justify_between()
.gap_2()
.child(
h_stack()
h_flex()
.gap_3()
.map(|stack| {
stack.child(
@ -824,7 +824,7 @@ fn diagnostic_header_renderer(diagnostic: Diagnostic) -> RenderBlock {
)
})
.child(
h_stack()
h_flex()
.gap_1()
.child(
StyledText::new(message.clone()).with_highlights(
@ -844,7 +844,7 @@ fn diagnostic_header_renderer(diagnostic: Diagnostic) -> RenderBlock {
),
)
.child(
h_stack()
h_flex()
.gap_1()
.when_some(diagnostic.source.as_ref(), |stack, source| {
stack.child(

View File

@ -6,7 +6,7 @@ use gpui::{
};
use language::Diagnostic;
use lsp::LanguageServerId;
use ui::{h_stack, prelude::*, Button, ButtonLike, Color, Icon, IconName, Label, Tooltip};
use ui::{h_flex, prelude::*, Button, ButtonLike, Color, Icon, IconName, Label, Tooltip};
use workspace::{item::ItemHandle, StatusItemView, ToolbarItemEvent, Workspace};
use crate::{Deploy, ProjectDiagnosticsEditor};
@ -23,14 +23,14 @@ pub struct DiagnosticIndicator {
impl Render for DiagnosticIndicator {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let diagnostic_indicator = match (self.summary.error_count, self.summary.warning_count) {
(0, 0) => h_stack().map(|this| {
(0, 0) => h_flex().map(|this| {
this.child(
Icon::new(IconName::Check)
.size(IconSize::Small)
.color(Color::Default),
)
}),
(0, warning_count) => h_stack()
(0, warning_count) => h_flex()
.gap_1()
.child(
Icon::new(IconName::ExclamationTriangle)
@ -38,7 +38,7 @@ impl Render for DiagnosticIndicator {
.color(Color::Warning),
)
.child(Label::new(warning_count.to_string()).size(LabelSize::Small)),
(error_count, 0) => h_stack()
(error_count, 0) => h_flex()
.gap_1()
.child(
Icon::new(IconName::XCircle)
@ -46,7 +46,7 @@ impl Render for DiagnosticIndicator {
.color(Color::Error),
)
.child(Label::new(error_count.to_string()).size(LabelSize::Small)),
(error_count, warning_count) => h_stack()
(error_count, warning_count) => h_flex()
.gap_1()
.child(
Icon::new(IconName::XCircle)
@ -64,7 +64,7 @@ impl Render for DiagnosticIndicator {
let status = if !self.in_progress_checks.is_empty() {
Some(
h_stack()
h_flex()
.gap_2()
.child(Icon::new(IconName::ArrowCircle).size(IconSize::Small))
.child(
@ -91,7 +91,7 @@ impl Render for DiagnosticIndicator {
None
};
h_stack()
h_flex()
.h(rems(1.375))
.gap_2()
.child(

View File

@ -99,8 +99,8 @@ use sum_tree::TreeMap;
use text::{OffsetUtf16, Rope};
use theme::{ActiveTheme, PlayerColor, StatusColors, SyntaxTheme, ThemeColors, ThemeSettings};
use ui::{
h_stack, prelude::*, ButtonSize, ButtonStyle, IconButton, IconName, IconSize, ListItem,
Popover, Tooltip,
h_flex, prelude::*, ButtonSize, ButtonStyle, IconButton, IconName, IconSize, ListItem, Popover,
Tooltip,
};
use util::{post_inc, RangeExt, ResultExt, TryFutureExt};
use workspace::{searchable::SearchEvent, ItemNavHistory, Pane, SplitDirection, ViewId, Workspace};
@ -1264,7 +1264,7 @@ impl CompletionsMenu {
None
} else {
Some(
h_stack().ml_4().child(
h_flex().ml_4().child(
Label::new(text.clone())
.size(LabelSize::Small)
.color(Color::Muted),
@ -1290,7 +1290,7 @@ impl CompletionsMenu {
)
.map(|task| task.detach_and_log_err(cx));
}))
.child(h_stack().overflow_hidden().child(completion_label))
.child(h_flex().overflow_hidden().child(completion_label))
.end_slot::<Div>(documentation_label),
)
})
@ -9747,7 +9747,7 @@ pub fn diagnostic_block_renderer(diagnostic: Diagnostic, _is_valid: bool) -> Ren
let group_id: SharedString = cx.block_id.to_string().into();
// TODO: Nate: We should tint the background of the block with the severity color
// We need to extend the theme before we can do this
h_stack()
h_flex()
.id(cx.block_id)
.group(group_id.clone())
.relative()

View File

@ -53,7 +53,7 @@ use std::{
use sum_tree::Bias;
use theme::{ActiveTheme, PlayerColor};
use ui::prelude::*;
use ui::{h_stack, ButtonLike, ButtonStyle, IconButton, Tooltip};
use ui::{h_flex, ButtonLike, ButtonStyle, IconButton, Tooltip};
use util::ResultExt;
use workspace::item::Item;
@ -2293,7 +2293,7 @@ impl EditorElement {
.size_full()
.p_1p5()
.child(
h_stack()
h_flex()
.id("path header block")
.py_1p5()
.pl_3()
@ -2306,8 +2306,8 @@ impl EditorElement {
.justify_between()
.hover(|style| style.bg(cx.theme().colors().element_hover))
.child(
h_stack().gap_3().child(
h_stack()
h_flex().gap_3().child(
h_flex()
.gap_2()
.child(
filename
@ -2339,12 +2339,12 @@ impl EditorElement {
}),
)
} else {
h_stack()
h_flex()
.id(("collapsed context", block_id))
.size_full()
.gap(gutter_padding)
.child(
h_stack()
h_flex()
.justify_end()
.flex_none()
.w(gutter_width - gutter_padding)

View File

@ -32,7 +32,7 @@ use std::{
};
use text::Selection;
use theme::Theme;
use ui::{h_stack, prelude::*, Label};
use ui::{h_flex, prelude::*, Label};
use util::{paths::PathExt, paths::FILE_ROW_COLUMN_DELIMITER, ResultExt, TryFutureExt};
use workspace::{
item::{BreadcrumbText, FollowEvent, FollowableItemHandle},
@ -619,7 +619,7 @@ impl Item for Editor {
Some(util::truncate_and_trailoff(&description, MAX_TAB_TITLE_LEN))
});
h_stack()
h_flex()
.gap_2()
.child(Label::new(self.title(cx).to_string()).color(label_color))
.when_some(description, |this, description| {

View File

@ -422,7 +422,7 @@ impl Render for FeedbackModal {
let open_community_repo =
cx.listener(|_, _, cx| cx.dispatch_action(Box::new(OpenZedCommunityRepo)));
v_stack()
v_flex()
.elevation_3(cx)
.key_context("GiveFeedback")
.on_action(cx.listener(Self::cancel))
@ -461,10 +461,10 @@ impl Render for FeedbackModal {
.child(self.feedback_editor.clone()),
)
.child(
v_stack()
v_flex()
.gap_1()
.child(
h_stack()
h_flex()
.bg(cx.theme().colors().editor_background)
.p_2()
.border()
@ -483,7 +483,7 @@ impl Render for FeedbackModal {
),
)
.child(
h_stack()
h_flex()
.justify_between()
.gap_1()
.child(
@ -495,7 +495,7 @@ impl Render for FeedbackModal {
.on_click(open_community_repo),
)
.child(
h_stack()
h_flex()
.gap_1()
.child(
Button::new("cancel_feedback", "Cancel")

View File

@ -119,7 +119,7 @@ impl FocusableView for FileFinder {
}
impl Render for FileFinder {
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack().w(rems(34.)).child(self.picker.clone())
v_flex().w(rems(34.)).child(self.picker.clone())
}
}
@ -786,7 +786,7 @@ impl PickerDelegate for FileFinderDelegate {
.inset(true)
.selected(selected)
.child(
v_stack()
v_flex()
.child(HighlightedLabel::new(file_name, file_name_positions))
.child(HighlightedLabel::new(full_path, full_path_positions)),
),

View File

@ -5,7 +5,7 @@ use gpui::{
};
use text::{Bias, Point};
use theme::ActiveTheme;
use ui::{h_stack, prelude::*, v_stack, Label};
use ui::{h_flex, prelude::*, v_flex, Label};
use util::paths::FILE_ROW_COLUMN_DELIMITER;
use workspace::ModalView;
@ -160,12 +160,12 @@ impl Render for GoToLine {
.on_action(cx.listener(Self::confirm))
.w_96()
.child(
v_stack()
v_flex()
.px_1()
.pt_0p5()
.gap_px()
.child(
v_stack()
v_flex()
.py_0p5()
.px_1()
.child(div().px_1().py_0p5().child(self.line_editor.clone())),
@ -177,7 +177,7 @@ impl Render for GoToLine {
.bg(cx.theme().colors().element_background),
)
.child(
h_stack()
h_flex()
.justify_between()
.px_2()
.py_1()

View File

@ -68,7 +68,7 @@ impl LanguageSelector {
impl Render for LanguageSelector {
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack().w(rems(34.)).child(self.picker.clone())
v_flex().w(rems(34.)).child(self.picker.clone())
}
}

View File

@ -785,7 +785,7 @@ impl Render for LspLogToolbarItemView {
{
let log_toolbar_view = log_toolbar_view.clone();
move |cx| {
h_stack()
h_flex()
.w_full()
.justify_between()
.child(Label::new(RPC_MESSAGES))
@ -837,7 +837,7 @@ impl Render for LspLogToolbarItemView {
.into()
});
h_stack().size_full().child(lsp_menu).child(
h_flex().size_full().child(lsp_menu).child(
div()
.child(
Button::new("clear_log_button", "Clear").on_click(cx.listener(

View File

@ -9,7 +9,7 @@ use language::{Buffer, OwnedSyntaxLayerInfo};
use std::{mem, ops::Range};
use theme::ActiveTheme;
use tree_sitter::{Node, TreeCursor};
use ui::{h_stack, popover_menu, ButtonLike, Color, ContextMenu, Label, LabelCommon, PopoverMenu};
use ui::{h_flex, popover_menu, ButtonLike, Color, ContextMenu, Label, LabelCommon, PopoverMenu};
use workspace::{
item::{Item, ItemHandle},
SplitDirection, ToolbarItemEvent, ToolbarItemLocation, ToolbarItemView, Workspace,
@ -239,7 +239,7 @@ impl SyntaxTreeView {
fn render_node(cursor: &TreeCursor, depth: u32, selected: bool, cx: &AppContext) -> Div {
let colors = cx.theme().colors();
let mut row = h_stack();
let mut row = h_flex();
if let Some(field_name) = cursor.field_name() {
row = row.children([Label::new(field_name).color(Color::Info), Label::new(": ")]);
}

View File

@ -64,7 +64,7 @@ impl ModalView for OutlineView {
impl Render for OutlineView {
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack().w(rems(34.)).child(self.picker.clone())
v_flex().w(rems(34.)).child(self.picker.clone())
}
}

View File

@ -5,7 +5,7 @@ use gpui::{
View, ViewContext, WindowContext,
};
use std::{cmp, sync::Arc};
use ui::{prelude::*, v_stack, Color, Divider, Label, ListItem, ListItemSpacing, ListSeparator};
use ui::{prelude::*, v_flex, Color, Divider, Label, ListItem, ListItemSpacing, ListSeparator};
use workspace::ModalView;
pub struct Picker<D: PickerDelegate> {
@ -236,7 +236,7 @@ impl<D: PickerDelegate> ModalView for Picker<D> {}
impl<D: PickerDelegate> Render for Picker<D> {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let picker_editor = h_stack()
let picker_editor = h_flex()
.overflow_hidden()
.flex_none()
.h_9()
@ -264,7 +264,7 @@ impl<D: PickerDelegate> Render for Picker<D> {
.child(Divider::horizontal())
.when(self.delegate.match_count() > 0, |el| {
el.child(
v_stack()
v_flex()
.flex_grow()
.py_2()
.max_h(self.max_height.unwrap_or(rems(18.).into()))
@ -309,7 +309,7 @@ impl<D: PickerDelegate> Render for Picker<D> {
})
.when(self.delegate.match_count() == 0, |el| {
el.child(
v_stack().flex_grow().py_2().child(
v_flex().flex_grow().py_2().child(
ListItem::new("empty_state")
.inset(true)
.spacing(ListItemSpacing::Sparse)

View File

@ -30,7 +30,7 @@ use std::{
sync::Arc,
};
use theme::ThemeSettings;
use ui::{prelude::*, v_stack, ContextMenu, Icon, KeyBinding, Label, ListItem};
use ui::{prelude::*, v_flex, ContextMenu, Icon, KeyBinding, Label, ListItem};
use unicase::UniCase;
use util::{maybe, ResultExt, TryFutureExt};
use workspace::{
@ -1541,7 +1541,7 @@ impl Render for ProjectPanel {
.child(menu.clone())
}))
} else {
v_stack()
v_flex()
.id("empty-project_panel")
.size_full()
.p_4()
@ -1565,7 +1565,7 @@ impl Render for DraggedProjectEntryView {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl Element {
let settings = ProjectPanelSettings::get_global(cx);
let ui_font = ThemeSettings::get_global(cx).ui_font.family.clone();
h_stack()
h_flex()
.font(ui_font)
.bg(cx.theme().colors().background)
.w(self.width)

View File

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

View File

@ -93,7 +93,7 @@ impl Render for QuickActionBar {
},
);
h_stack()
h_flex()
.id("quick action bar")
.gap_2()
.children(inlay_hints_button)

View File

@ -104,7 +104,7 @@ impl FocusableView for RecentProjects {
impl Render for RecentProjects {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.w(rems(self.rem_width))
.child(self.picker.clone())
.on_mouse_down_out(cx.listener(|this, _, cx| {
@ -236,7 +236,7 @@ impl PickerDelegate for RecentProjectsDelegate {
.spacing(ListItemSpacing::Sparse)
.selected(selected)
.child(
v_stack()
v_flex()
.child(highlighted_location.names)
.when(self.render_paths, |this| {
this.children(highlighted_location.paths)

View File

@ -21,7 +21,7 @@ use settings::Settings;
use std::{any::Any, sync::Arc};
use theme::ThemeSettings;
use ui::{h_stack, prelude::*, Icon, IconButton, IconName, ToggleButton, Tooltip};
use ui::{h_flex, prelude::*, Icon, IconButton, IconName, ToggleButton, Tooltip};
use util::ResultExt;
use workspace::{
item::ItemHandle,
@ -186,7 +186,7 @@ impl Render for BufferSearchBar {
} else {
cx.theme().colors().border
};
h_stack()
h_flex()
.w_full()
.gap_2()
.key_context(key_context)
@ -216,7 +216,7 @@ impl Render for BufferSearchBar {
this.on_action(cx.listener(Self::toggle_whole_word))
})
.child(
h_stack()
h_flex()
.flex_1()
.px_2()
.py_1()
@ -243,11 +243,11 @@ impl Render for BufferSearchBar {
})),
)
.child(
h_stack()
h_flex()
.gap_2()
.flex_none()
.child(
h_stack()
h_flex()
.child(
ToggleButton::new("search-mode-text", SearchMode::Text.label())
.style(ButtonStyle::Filled)
@ -303,12 +303,12 @@ impl Render for BufferSearchBar {
}),
)
.child(
h_stack()
h_flex()
.gap_0p5()
.flex_1()
.when(self.replace_enabled, |this| {
this.child(
h_stack()
h_flex()
.flex_1()
// We're giving this a fixed height to match the height of the search input,
// which has an icon inside that is increasing its height.
@ -346,7 +346,7 @@ impl Render for BufferSearchBar {
}),
)
.child(
h_stack()
h_flex()
.gap_0p5()
.flex_none()
.child(

View File

@ -38,7 +38,7 @@ use std::{
use theme::ThemeSettings;
use ui::{
h_stack, prelude::*, v_stack, Icon, IconButton, IconName, Label, LabelCommon, LabelSize,
h_flex, prelude::*, v_flex, Icon, IconButton, IconName, Label, LabelCommon, LabelSize,
Selectable, ToggleButton, Tooltip,
};
use util::{paths::PathMatcher, ResultExt as _};
@ -360,19 +360,19 @@ impl Render for ProjectSearchView {
.max_w_96()
.child(Label::new(text).size(LabelSize::Small))
});
v_stack()
v_flex()
.flex_1()
.size_full()
.justify_center()
.bg(cx.theme().colors().editor_background)
.track_focus(&self.focus_handle)
.child(
h_stack()
h_flex()
.size_full()
.justify_center()
.child(h_stack().flex_1())
.child(v_stack().child(major_text).children(minor_text))
.child(h_stack().flex_1()),
.child(h_flex().flex_1())
.child(v_flex().child(major_text).children(minor_text))
.child(h_flex().flex_1()),
)
}
}
@ -431,7 +431,7 @@ impl Item for ProjectSearchView {
let tab_name = last_query
.filter(|query| !query.is_empty())
.unwrap_or_else(|| "Project search".into());
h_stack()
h_flex()
.gap_2()
.child(Icon::new(IconName::MagnifyingGlass).color(if selected {
Color::Default
@ -1601,8 +1601,8 @@ impl Render for ProjectSearchBar {
let search = search.read(cx);
let semantic_is_available = SemanticIndex::enabled(cx);
let query_column = v_stack().child(
h_stack()
let query_column = v_flex().child(
h_flex()
.min_w(rems(512. / 16.))
.px_2()
.py_1()
@ -1617,7 +1617,7 @@ impl Render for ProjectSearchBar {
.child(Icon::new(IconName::MagnifyingGlass))
.child(self.render_text_input(&search.query_editor, cx))
.child(
h_stack()
h_flex()
.child(
IconButton::new("project-search-filter-button", IconName::Filter)
.tooltip(|cx| {
@ -1674,11 +1674,11 @@ impl Render for ProjectSearchBar {
),
);
let mode_column = v_stack().items_start().justify_start().child(
h_stack()
let mode_column = v_flex().items_start().justify_start().child(
h_flex()
.gap_2()
.child(
h_stack()
h_flex()
.child(
ToggleButton::new("project-search-text-button", "Text")
.style(ButtonStyle::Filled)
@ -1744,7 +1744,7 @@ impl Render for ProjectSearchBar {
),
);
let replace_column = if search.replace_enabled {
h_stack()
h_flex()
.flex_1()
.h_full()
.gap_2()
@ -1757,9 +1757,9 @@ impl Render for ProjectSearchBar {
.child(self.render_text_input(&search.replacement_editor, cx))
} else {
// Fill out the space if we don't have a replacement editor.
h_stack().flex_1()
h_flex().flex_1()
};
let actions_column = h_stack()
let actions_column = h_flex()
.when(search.replace_enabled, |this| {
this.child(
IconButton::new("project-search-replace-next", IconName::ReplaceNext)
@ -1820,7 +1820,7 @@ impl Render for ProjectSearchBar {
.tooltip(|cx| Tooltip::for_action("Go to next match", &SelectNextMatch, cx)),
);
v_stack()
v_flex()
.key_context(key_context)
.flex_grow()
.gap_2()
@ -1880,7 +1880,7 @@ impl Render for ProjectSearchBar {
})
})
.child(
h_stack()
h_flex()
.justify_between()
.gap_2()
.child(query_column)
@ -1890,12 +1890,12 @@ impl Render for ProjectSearchBar {
)
.when(search.filters_enabled, |this| {
this.child(
h_stack()
h_flex()
.flex_1()
.gap_2()
.justify_between()
.child(
h_stack()
h_flex()
.flex_1()
.h_full()
.px_2()
@ -1921,7 +1921,7 @@ impl Render for ProjectSearchBar {
}),
)
.child(
h_stack()
h_flex()
.flex_1()
.h_full()
.px_2()

View File

@ -255,8 +255,8 @@ impl Story {
.child(label.into())
}
/// Note: Not ui::v_stack() as the story crate doesn't depend on the ui crate.
pub fn v_stack() -> Div {
/// Note: Not `ui::v_flex` as the `story` crate doesn't depend on the `ui` crate.
pub fn v_flex() -> Div {
div().flex().flex_col().gap_1()
}
}
@ -298,7 +298,7 @@ impl RenderOnce for StoryItem {
.gap_4()
.w_full()
.child(
Story::v_stack()
Story::v_flex()
.px_2()
.w_1_2()
.min_h_px()
@ -319,7 +319,7 @@ impl RenderOnce for StoryItem {
}),
)
.child(
Story::v_stack()
Story::v_flex()
.px_2()
.flex_none()
.w_1_2()

View File

@ -11,7 +11,7 @@ impl Render for OverflowScrollStory {
.child(Story::title("Overflow Scroll"))
.child(Story::label("`overflow_x_scroll`"))
.child(
h_stack()
h_flex()
.id("overflow_x_scroll")
.gap_2()
.overflow_x_scroll()
@ -24,7 +24,7 @@ impl Render for OverflowScrollStory {
)
.child(Story::label("`overflow_y_scroll`"))
.child(
v_stack()
v_flex()
.id("overflow_y_scroll")
.gap_2()
.overflow_y_scroll()

View File

@ -117,7 +117,7 @@ impl Render for TextStory {
// type Element = Div;
// fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
// v_stack()
// v_flex()
// .bg(blue())
// .child(
// div()

View File

@ -13,7 +13,7 @@ use search::{buffer_search::DivRegistrar, BufferSearchBar};
use serde::{Deserialize, Serialize};
use settings::Settings;
use terminal::terminal_settings::{TerminalDockPosition, TerminalSettings};
use ui::{h_stack, ButtonCommon, Clickable, IconButton, IconSize, Selectable, Tooltip};
use ui::{h_flex, ButtonCommon, Clickable, IconButton, IconSize, Selectable, Tooltip};
use util::{ResultExt, TryFutureExt};
use workspace::{
dock::{DockPosition, Panel, PanelEvent},
@ -68,7 +68,7 @@ impl TerminalPanel {
pane.display_nav_history_buttons(false);
pane.set_render_tab_bar_buttons(cx, move |pane, cx| {
let terminal_panel = terminal_panel.clone();
h_stack()
h_flex()
.gap_2()
.child(
IconButton::new("plus", IconName::Plus)

View File

@ -20,7 +20,7 @@ use terminal::{
Clear, Copy, Event, MaybeNavigationTarget, Paste, ShowCharacterPalette, Terminal,
};
use terminal_element::TerminalElement;
use ui::{h_stack, prelude::*, ContextMenu, Icon, IconName, Label};
use ui::{h_flex, prelude::*, ContextMenu, Icon, IconName, Label};
use util::{paths::PathLikeWithPosition, ResultExt};
use workspace::{
item::{BreadcrumbText, Item, ItemEvent},
@ -697,7 +697,7 @@ impl Item for TerminalView {
cx: &WindowContext,
) -> AnyElement {
let title = self.terminal().read(cx).title(true);
h_stack()
h_flex()
.gap_2()
.child(Icon::new(IconName::Terminal))
.child(Label::new(title).color(if selected {

View File

@ -10,7 +10,7 @@ use picker::{Picker, PickerDelegate};
use settings::{update_settings_file, SettingsStore};
use std::sync::Arc;
use theme::{Theme, ThemeMeta, ThemeRegistry, ThemeSettings};
use ui::{prelude::*, v_stack, ListItem, ListItemSpacing};
use ui::{prelude::*, v_flex, ListItem, ListItemSpacing};
use util::ResultExt;
use workspace::{ui::HighlightedLabel, ModalView, Workspace};
@ -70,7 +70,7 @@ impl FocusableView for ThemeSelector {
impl Render for ThemeSelector {
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack().w(rems(34.)).child(self.picker.clone())
v_flex().w(rems(34.)).child(self.picker.clone())
}
}

View File

@ -362,7 +362,7 @@ impl RenderOnce for Button {
};
self.base.child(
h_stack()
h_flex()
.gap_1()
.when(self.icon_position == Some(IconPosition::Start), |this| {
this.children(self.icon.map(|icon| {
@ -375,7 +375,7 @@ impl RenderOnce for Button {
}))
})
.child(
h_stack()
h_flex()
.gap_2()
.justify_between()
.child(

View File

@ -103,7 +103,7 @@ impl RenderOnce for Checkbox {
),
};
h_stack()
h_flex()
.id(self.id)
// Rather than adding `px_1()` to add some space around the checkbox,
// we use a larger parent element to create a slightly larger

View File

@ -1,5 +1,5 @@
use crate::{
h_stack, prelude::*, v_stack, Icon, IconName, KeyBinding, Label, List, ListItem, ListSeparator,
h_flex, prelude::*, v_flex, Icon, IconName, KeyBinding, Label, List, ListItem, ListSeparator,
ListSubHeader,
};
use gpui::{
@ -234,7 +234,7 @@ impl ContextMenuItem {
impl Render for ContextMenu {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
div().elevation_2(cx).flex().flex_row().child(
v_stack()
v_flex()
.min_w(px(200.))
.track_focus(&self.focus_handle)
.on_mouse_down_out(cx.listener(|this, _, cx| this.cancel(&menu::Cancel, cx)))
@ -277,7 +277,7 @@ impl Render for ContextMenu {
let menu = cx.view().downgrade();
let label_element = if let Some(icon) = icon {
h_stack()
h_flex()
.gap_1()
.child(Label::new(label.clone()))
.child(Icon::new(*icon))
@ -298,7 +298,7 @@ impl Render for ContextMenu {
.ok();
})
.child(
h_stack()
h_flex()
.w_full()
.justify_between()
.child(label_element)

View File

@ -1,4 +1,4 @@
use crate::{h_stack, prelude::*, Icon, IconName, IconSize};
use crate::{h_flex, prelude::*, Icon, IconName, IconSize};
use gpui::{relative, rems, Action, FocusHandle, IntoElement, Keystroke};
#[derive(IntoElement, Clone)]
@ -12,13 +12,13 @@ pub struct KeyBinding {
impl RenderOnce for KeyBinding {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
h_stack()
h_flex()
.flex_none()
.gap_2()
.children(self.key_binding.keystrokes().iter().map(|keystroke| {
let key_icon = Self::icon_for_key(&keystroke);
h_stack()
h_flex()
.flex_none()
.gap_0p5()
.p_0p5()

View File

@ -1,7 +1,7 @@
use gpui::AnyElement;
use smallvec::SmallVec;
use crate::{prelude::*, v_stack, Label, ListHeader};
use crate::{prelude::*, v_flex, Label, ListHeader};
#[derive(IntoElement)]
pub struct List {
@ -47,7 +47,7 @@ impl ParentElement for List {
impl RenderOnce for List {
fn render(self, _cx: &mut WindowContext) -> impl IntoElement {
v_stack().w_full().py_1().children(self.header).map(|this| {
v_flex().w_full().py_1().children(self.header).map(|this| {
match (self.children.is_empty(), self.toggle) {
(false, _) => this.children(self.children),
(true, Some(false)) => this,

View File

@ -1,4 +1,4 @@
use crate::{h_stack, prelude::*, Disclosure, Label};
use crate::{h_flex, prelude::*, Disclosure, Label};
use gpui::{AnyElement, ClickEvent};
#[derive(IntoElement)]
@ -76,7 +76,7 @@ impl Selectable for ListHeader {
impl RenderOnce for ListHeader {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
h_stack()
h_flex()
.id(self.label.clone())
.w_full()
.relative()
@ -95,7 +95,7 @@ impl RenderOnce for ListHeader {
.w_full()
.gap_1()
.child(
h_stack()
h_flex()
.gap_1()
.children(self.toggle.map(|is_open| {
Disclosure::new("toggle", is_open).on_toggle(self.on_toggle)
@ -109,7 +109,7 @@ impl RenderOnce for ListHeader {
.child(Label::new(self.label.clone()).color(Color::Muted)),
),
)
.child(h_stack().children(self.end_slot))
.child(h_flex().children(self.end_slot))
.when_some(self.end_hover_slot, |this, end_hover_slot| {
this.child(
div()

View File

@ -146,7 +146,7 @@ impl ParentElement for ListItem {
impl RenderOnce for ListItem {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
h_stack()
h_flex()
.id(self.id)
.w_full()
.relative()
@ -169,7 +169,7 @@ impl RenderOnce for ListItem {
})
})
.child(
h_stack()
h_flex()
.id("inner_list_item")
.w_full()
.relative()
@ -219,9 +219,9 @@ impl RenderOnce for ListItem {
.child(Disclosure::new("toggle", is_open).on_toggle(self.on_toggle))
}))
.child(
h_stack()
h_flex()
// HACK: We need to set *any* width value here in order for this container to size correctly.
// Without this the `h_stack` will overflow the parent `inner_list_item`.
// Without this the `h_flex` will overflow the parent `inner_list_item`.
.w_px()
.flex_1()
.gap_1()
@ -230,7 +230,7 @@ impl RenderOnce for ListItem {
)
.when_some(self.end_slot, |this, end_slot| {
this.justify_between().child(
h_stack()
h_flex()
.when(self.end_hover_slot.is_some(), |this| {
this.visible()
.group_hover("list_item", |this| this.invisible())
@ -240,7 +240,7 @@ impl RenderOnce for ListItem {
})
.when_some(self.end_hover_slot, |this, end_hover_slot| {
this.child(
h_stack()
h_flex()
.h_full()
.absolute()
.right_2()

View File

@ -1,5 +1,5 @@
use crate::prelude::*;
use crate::{h_stack, Icon, IconName, IconSize, Label};
use crate::{h_flex, Icon, IconName, IconSize, Label};
#[derive(IntoElement)]
pub struct ListSubHeader {
@ -25,7 +25,7 @@ impl ListSubHeader {
impl RenderOnce for ListSubHeader {
fn render(self, _cx: &mut WindowContext) -> impl IntoElement {
h_stack().flex_1().w_full().relative().py_1().child(
h_flex().flex_1().w_full().relative().py_1().child(
div()
.h_6()
.when(self.inset, |this| this.px_2())

View File

@ -1,5 +1,5 @@
use crate::prelude::*;
use crate::v_stack;
use crate::v_flex;
use gpui::{
div, AnyElement, Element, IntoElement, ParentElement, RenderOnce, Styled, WindowContext,
};
@ -43,10 +43,10 @@ impl RenderOnce for Popover {
div()
.flex()
.gap_1()
.child(v_stack().elevation_2(cx).px_1().children(self.children))
.child(v_flex().elevation_2(cx).px_1().children(self.children))
.when_some(self.aside, |this, aside| {
this.child(
v_stack()
v_flex()
.elevation_2(cx)
.bg(cx.theme().colors().surface_background)
.px_1()

View File

@ -4,12 +4,12 @@ use crate::StyledExt;
/// Horizontally stacks elements. Sets `flex()`, `flex_row()`, `items_center()`
#[track_caller]
pub fn h_stack() -> Div {
pub fn h_flex() -> Div {
div().h_flex()
}
/// Vertically stacks elements. Sets `flex()`, `flex_col()`
#[track_caller]
pub fn v_stack() -> Div {
pub fn v_flex() -> Div {
div().v_flex()
}

View File

@ -2,7 +2,7 @@ use gpui::{Render, ViewContext};
use story::Story;
use crate::prelude::*;
use crate::{h_stack, Checkbox};
use crate::{h_flex, Checkbox};
pub struct CheckboxStory;
@ -12,7 +12,7 @@ impl Render for CheckboxStory {
.child(Story::title_for::<Checkbox>())
.child(Story::label("Default"))
.child(
h_stack()
h_flex()
.p_2()
.gap_2()
.rounded_md()
@ -27,7 +27,7 @@ impl Render for CheckboxStory {
)
.child(Story::label("Disabled"))
.child(
h_stack()
h_flex()
.p_2()
.gap_2()
.rounded_md()

View File

@ -60,7 +60,7 @@ impl Render for ListItemStory {
ListItem::new("with_end_hover_slot")
.child("Hello, world!")
.end_slot(
h_stack()
h_flex()
.gap_2()
.child(Avatar::new(SharedUrl::from(
"https://avatars.githubusercontent.com/u/1789?v=4",

View File

@ -13,10 +13,10 @@ impl Render for TabStory {
Story::container()
.child(Story::title_for::<Tab>())
.child(Story::label("Default"))
.child(h_stack().child(Tab::new("tab_1").child("Tab 1")))
.child(h_flex().child(Tab::new("tab_1").child("Tab 1")))
.child(Story::label("With indicator"))
.child(
h_stack().child(
h_flex().child(
Tab::new("tab_1")
.start_slot(Indicator::dot().color(Color::Warning))
.child("Tab 1"),
@ -24,7 +24,7 @@ impl Render for TabStory {
)
.child(Story::label("With close button"))
.child(
h_stack().child(
h_flex().child(
Tab::new("tab_1")
.end_slot(
IconButton::new("close_button", IconName::Close)
@ -38,13 +38,13 @@ impl Render for TabStory {
)
.child(Story::label("List of tabs"))
.child(
h_stack()
h_flex()
.child(Tab::new("tab_1").child("Tab 1"))
.child(Tab::new("tab_2").child("Tab 2")),
)
.child(Story::label("List of tabs with first tab selected"))
.child(
h_stack()
h_flex()
.child(
Tab::new("tab_1")
.selected(true)
@ -65,7 +65,7 @@ impl Render for TabStory {
)
.child(Story::label("List of tabs with last tab selected"))
.child(
h_stack()
h_flex()
.child(
Tab::new("tab_1")
.position(TabPosition::First)
@ -90,7 +90,7 @@ impl Render for TabStory {
)
.child(Story::label("List of tabs with second tab selected"))
.child(
h_stack()
h_flex()
.child(
Tab::new("tab_1")
.position(TabPosition::First)

View File

@ -35,7 +35,7 @@ impl Render for TabBarStory {
.child(Story::title_for::<TabBar>())
.child(Story::label("Default"))
.child(
h_stack().child(
h_flex().child(
TabBar::new("tab_bar_1")
.start_child(
IconButton::new("navigate_backward", IconName::ArrowLeft)

View File

@ -25,7 +25,7 @@ impl Render for ToggleButtonStory {
StorySection::new().child(
StoryItem::new(
"Toggle button group",
h_stack()
h_flex()
.child(
ToggleButton::new(1, "Apple")
.style(ButtonStyle::Filled)
@ -59,7 +59,7 @@ impl Render for ToggleButtonStory {
StorySection::new().child(
StoryItem::new(
"Toggle button group with selection",
h_stack()
h_flex()
.child(
ToggleButton::new(1, "Apple")
.style(ButtonStyle::Filled)

View File

@ -135,7 +135,7 @@ impl RenderOnce for Tab {
})
.cursor_pointer()
.child(
h_stack()
h_flex()
.group("")
.relative()
.h_full()
@ -145,7 +145,7 @@ impl RenderOnce for Tab {
// .hover(|style| style.bg(tab_hover_bg))
// .active(|style| style.bg(tab_active_bg))
.child(
h_stack()
h_flex()
.w_3()
.h_3()
.justify_center()
@ -157,7 +157,7 @@ impl RenderOnce for Tab {
.children(self.start_slot),
)
.child(
h_stack()
h_flex()
.w_3()
.h_3()
.justify_center()

View File

@ -102,7 +102,7 @@ impl RenderOnce for TabBar {
.bg(cx.theme().colors().tab_bar_background)
.when(!self.start_children.is_empty(), |this| {
this.child(
h_stack()
h_flex()
.flex_none()
.gap_1()
.px_1()
@ -129,7 +129,7 @@ impl RenderOnce for TabBar {
.border_color(cx.theme().colors().border),
)
.child(
h_stack()
h_flex()
.id("tabs")
.z_index(2)
.flex_grow()
@ -142,7 +142,7 @@ impl RenderOnce for TabBar {
)
.when(!self.end_children.is_empty(), |this| {
this.child(
h_stack()
h_flex()
.flex_none()
.gap_1()
.px_1()

View File

@ -3,7 +3,7 @@ use settings::Settings;
use theme::ThemeSettings;
use crate::prelude::*;
use crate::{h_stack, v_stack, Color, KeyBinding, Label, LabelSize, StyledExt};
use crate::{h_flex, v_flex, Color, KeyBinding, Label, LabelSize, StyledExt};
pub struct Tooltip {
title: SharedString,
@ -73,7 +73,7 @@ impl Render for Tooltip {
overlay().child(
// padding to avoid mouse cursor
div().pl_2().pt_2p5().child(
v_stack()
v_flex()
.elevation_2(cx)
.font(ui_font)
.text_ui()
@ -81,7 +81,7 @@ impl Render for Tooltip {
.py_1()
.px_2()
.child(
h_stack()
h_flex()
.gap_4()
.child(self.title.clone())
.when_some(self.key_binding.clone(), |this, key_binding| {

View File

@ -13,7 +13,7 @@ pub use crate::fixed::*;
pub use crate::selectable::*;
pub use crate::styles::{vh, vw};
pub use crate::visible_on_hover::*;
pub use crate::{h_stack, v_stack};
pub use crate::{h_flex, v_flex};
pub use crate::{Button, ButtonSize, ButtonStyle, IconButton, SelectableButton};
pub use crate::{ButtonCommon, Color, StyledExt};
pub use crate::{Headline, HeadlineSize};

View File

@ -9,7 +9,7 @@ use gpui::{
use picker::{Picker, PickerDelegate};
use std::{ops::Not, sync::Arc};
use ui::{
h_stack, v_stack, Button, ButtonCommon, Clickable, HighlightedLabel, Label, LabelCommon,
h_flex, v_flex, Button, ButtonCommon, Clickable, HighlightedLabel, Label, LabelCommon,
LabelSize, ListItem, ListItemSpacing, Selectable,
};
use util::ResultExt;
@ -65,7 +65,7 @@ impl FocusableView for BranchList {
impl Render for BranchList {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.w(rems(self.rem_width))
.child(self.picker.clone())
.on_mouse_down_out(cx.listener(|this, _, cx| {
@ -290,7 +290,7 @@ impl PickerDelegate for BranchListDelegate {
}
fn render_header(&self, _: &mut ViewContext<Picker<Self>>) -> Option<AnyElement> {
let label = if self.last_query.is_empty() {
h_stack()
h_flex()
.ml_3()
.child(Label::new("Recent branches").size(LabelSize::Small))
} else {
@ -298,7 +298,7 @@ impl PickerDelegate for BranchListDelegate {
let suffix = if self.matches.len() == 1 { "" } else { "es" };
Label::new(format!("{} match{}", self.matches.len(), suffix)).size(LabelSize::Small)
});
h_stack()
h_flex()
.px_3()
.h_full()
.justify_between()
@ -313,7 +313,7 @@ impl PickerDelegate for BranchListDelegate {
}
Some(
h_stack().mr_3().pb_2().child(h_stack().w_full()).child(
h_flex().mr_3().pb_2().child(h_flex().w_full()).child(
Button::new("branch-picker-create-branch-button", "Create branch").on_click(
cx.listener(|_, _, cx| {
cx.spawn(|picker, mut cx| async move {

View File

@ -62,7 +62,7 @@ impl BaseKeymapSelector {
impl Render for BaseKeymapSelector {
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack().w(rems(34.)).child(self.picker.clone())
v_flex().w(rems(34.)).child(self.picker.clone())
}
}

View File

@ -60,8 +60,8 @@ pub struct WelcomePage {
impl Render for WelcomePage {
fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> impl IntoElement {
h_stack().full().track_focus(&self.focus_handle).child(
v_stack()
h_flex().full().track_focus(&self.focus_handle).child(
v_flex()
.w_96()
.gap_4()
.mx_auto()
@ -74,12 +74,12 @@ impl Render for WelcomePage {
.mx_auto(),
)
.child(
h_stack()
h_flex()
.justify_center()
.child(Label::new("Code at the speed of thought")),
)
.child(
v_stack()
v_flex()
.gap_2()
.child(
Button::new("choose-theme", "Choose a theme")
@ -129,7 +129,7 @@ impl Render for WelcomePage {
),
)
.child(
v_stack()
v_flex()
.p_3()
.gap_2()
.bg(cx.theme().colors().elevated_surface_background)
@ -137,7 +137,7 @@ impl Render for WelcomePage {
.border_color(cx.theme().colors().border)
.rounded_md()
.child(
h_stack()
h_flex()
.gap_2()
.child(
Checkbox::new(
@ -163,7 +163,7 @@ impl Render for WelcomePage {
.child(Label::new("Enable vim mode")),
)
.child(
h_stack()
h_flex()
.gap_2()
.child(
Checkbox::new(
@ -201,7 +201,7 @@ impl Render for WelcomePage {
.child(Label::new("Send anonymous usage data")),
)
.child(
h_stack()
h_flex()
.gap_2()
.child(
Checkbox::new(

View File

@ -9,7 +9,7 @@ use schemars::JsonSchema;
use serde::{Deserialize, Serialize};
use settings::SettingsStore;
use std::sync::Arc;
use ui::{h_stack, ContextMenu, IconButton, Tooltip};
use ui::{h_flex, ContextMenu, IconButton, Tooltip};
use ui::{prelude::*, right_click_menu};
const RESIZE_HANDLE_SIZE: Pixels = Pixels(6.);
@ -682,7 +682,7 @@ impl Render for PanelButtons {
)
});
h_stack().gap_0p5().children(buttons)
h_flex().gap_0p5().children(buttons)
}
}

View File

@ -2,7 +2,7 @@ use gpui::{
div, prelude::*, px, AnyView, DismissEvent, FocusHandle, ManagedView, Render, Subscription,
View, ViewContext, WindowContext,
};
use ui::{h_stack, v_stack};
use ui::{h_flex, v_flex};
pub trait ModalView: ManagedView {
fn on_before_dismiss(&mut self, _: &mut ViewContext<Self>) -> bool {
@ -120,7 +120,7 @@ impl Render for ModalLayer {
.left_0()
.z_index(169)
.child(
v_stack()
v_flex()
.h(px(0.0))
.top_20()
.flex()
@ -128,7 +128,7 @@ impl Render for ModalLayer {
.items_center()
.track_focus(&active_modal.focus_handle)
.child(
h_stack()
h_flex()
.on_mouse_down_out(cx.listener(|this, _, cx| {
this.hide_modal(cx);
}))

View File

@ -173,7 +173,7 @@ pub mod simple_message_notification {
};
use std::sync::Arc;
use ui::prelude::*;
use ui::{h_stack, v_stack, Button, Icon, IconName, Label, StyledExt};
use ui::{h_flex, v_flex, Button, Icon, IconName, Label, StyledExt};
pub struct MessageNotification {
message: SharedString,
@ -218,11 +218,11 @@ pub mod simple_message_notification {
impl Render for MessageNotification {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.elevation_3(cx)
.p_4()
.child(
h_stack()
h_flex()
.justify_between()
.child(div().max_w_80().child(Label::new(self.message.clone())))
.child(

View File

@ -35,7 +35,7 @@ use ui::{
prelude::*, right_click_menu, ButtonSize, Color, IconButton, IconButtonShape, IconName,
IconSize, Indicator, Label, Tab, TabBar, TabPosition, Tooltip,
};
use ui::{v_stack, ContextMenu};
use ui::{v_flex, ContextMenu};
use util::{maybe, truncate_and_remove_front, ResultExt};
#[derive(PartialEq, Clone, Copy, Deserialize, Debug)]
@ -271,7 +271,7 @@ impl Pane {
custom_drop_handle: None,
can_split: true,
render_tab_bar_buttons: Rc::new(move |pane, cx| {
h_stack()
h_flex()
.gap_2()
.child(
IconButton::new("plus", IconName::Plus)
@ -1444,7 +1444,7 @@ impl Pane {
.track_scroll(self.tab_bar_scroll_handle.clone())
.when(self.display_nav_history_buttons, |tab_bar| {
tab_bar.start_child(
h_stack()
h_flex()
.gap_2()
.child(
IconButton::new("navigate_backward", IconName::ArrowLeft)
@ -1718,7 +1718,7 @@ impl FocusableView for Pane {
impl Render for Pane {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
v_stack()
v_flex()
.key_context("Pane")
.track_focus(&self.focus_handle)
.size_full()

View File

@ -12,7 +12,7 @@ use gpui::{
WindowContext,
};
use std::sync::{Arc, Weak};
use ui::{h_stack, prelude::*, Icon, IconName, Label};
use ui::{h_flex, prelude::*, Icon, IconName, Label};
pub enum Event {
Close,
@ -98,7 +98,7 @@ impl Item for SharedScreen {
selected: bool,
_: &WindowContext<'_>,
) -> gpui::AnyElement {
h_stack()
h_flex()
.gap_1()
.child(Icon::new(IconName::Screen))
.child(

View File

@ -4,7 +4,7 @@ use gpui::{
WindowContext,
};
use std::any::TypeId;
use ui::{h_stack, prelude::*};
use ui::{h_flex, prelude::*};
use util::ResultExt;
pub trait StatusItemView: Render {
@ -50,14 +50,14 @@ impl Render for StatusBar {
impl StatusBar {
fn render_left_tools(&self, _: &mut ViewContext<Self>) -> impl IntoElement {
h_stack()
h_flex()
.items_center()
.gap_2()
.children(self.left_items.iter().map(|item| item.to_any()))
}
fn render_right_tools(&self, _: &mut ViewContext<Self>) -> impl IntoElement {
h_stack()
h_flex()
.items_center()
.gap_2()
.children(self.right_items.iter().rev().map(|item| item.to_any()))

View File

@ -4,7 +4,7 @@ use gpui::{
WindowContext,
};
use ui::prelude::*;
use ui::{h_stack, v_stack};
use ui::{h_flex, v_flex};
pub enum ToolbarItemEvent {
ChangeLocation(ToolbarItemLocation),
@ -103,18 +103,18 @@ impl Render for Toolbar {
let has_left_items = self.left_items().count() > 0;
let has_right_items = self.right_items().count() > 0;
v_stack()
v_flex()
.p_2()
.when(has_left_items || has_right_items, |this| this.gap_2())
.border_b()
.border_color(cx.theme().colors().border_variant)
.bg(cx.theme().colors().toolbar_background)
.child(
h_stack()
h_flex()
.justify_between()
.when(has_left_items, |this| {
this.child(
h_stack()
h_flex()
.flex_1()
.justify_start()
.children(self.left_items().map(|item| item.to_any())),
@ -122,7 +122,7 @@ impl Render for Toolbar {
})
.when(has_right_items, |this| {
this.child(
h_stack()
h_flex()
.flex_1()
.justify_end()
.children(self.right_items().map(|item| item.to_any())),