- Make tab bar visible
- Fix tab text colors
- Ensure panes cover the available space
- Make the close button close
- Fix bug when unsubscribe called after remove
- WIP: start on editor element
- Add hover behaviour to tabs
- Add PointingHand on tabs
- gpui2: Add on_hover events
- Tooltip on tabs
- MOAR TOOLTIPS
- Use an `IconButton` for the tab close button
- Remove unneeded type qualification
- Tooltips in mouse event handler & fix executor timer
- Move more tooltip logic into gpui2 & fix tooltip moving on paint
- Update tooltip code a bit
- Allow multiple subscriptions from one entity handle
Release Notes:
- N/A
This PR applies a number of field renames in the `ThemeColors` struct
from the `import-theme` branch.
This will help prevent this branch from diverging too far from `main`.
Release Notes:
- N/A
---------
Co-authored-by: Nate Butler <iamnbutler@gmail.com>
Co-authored-by: Marshall Bowers <1486634+maxdeviant@users.noreply.github.com>
Language adapters 2.0 will systematically fix this kind of issue and
cause world peace but until we do that let's be less broken
Release Notes:
- Fixed being unable to find already downloaded Elixir-LS binary on the
file system.
This has a chance to speed up a build in case where e.g. we're single-threaded in aarch64 build; at that point the x86_64 codegen can take place. Also, MIR can probably be shared between the two architectures, further reducing build time.
Vue.js defined a bunch of symbols in it's scanner that collided with
those defined in HTML Tree-sitter grammar. I simply removed them as they
were meant for consumption by the external parties interested in HTML
parser with Vue support - since we handle that ourselves this is not
really necessary to preserve anymore. cc was firing up a bunch of
warnings about unused symbols when I've marked those functions as
`static`, so yeah.
Release Notes:
- Fixed HTML highlighting breaking in presence of <!-- --> comments
(fixeszed-industries/community#2166).
Vue.js defined a bunch of symbols in it's scanner that collided with those defined in HTML Tree-sitter grammar. I simply removed them as they were meant for consumption by the external parties interested in HTML parser with Vue support - since we handle that ourselves this is not really necessary to preserve anymore. cc was firing up a bunch of warnings about unused symbols, so yeah.
Follow-up of https://github.com/zed-industries/zed/pull/3225
That PR enabled every `project::Event::DiskBasedDiagnosticsFinished` to
update the diagnostics, which turned out to be bad, Zed does query for
more diagnostics after every excerpt update, and that seems to be due to
`Event::Edited` emitted by the multibuffers created in the diagnostics
panel.
* now, instead of eagerly updating the diagnostics every time, only do
that if the panel has 0 or 1 caret placed and no changes were made in
the panel yet.
Otherwise, use previous approach and register the updated paths to defer
their update later.
* on every `update_excerpts` in the diagnostics panel, query the entire
diagnostics summary (and store it for the future comparisons), compare
old and new summaries and re-query diagnostics for every path that's not
in both summaries.
Also, query every path that was registered during the
`DiskBasedDiagnosticsFinished` updates that were not eagerly updated
before.
This way we're supposed to get all new diagnostics (for new paths added)
and re-check all old paths that might have stale diagnostics now.
* do diagnostics rechecks concurrently for every path now, speeding the
overall process
Release Notes:
- Fixed diagnostics triggering too eagerly during multicaret edits and
certain stale diagnostics not being removed in time
[[PR Description]]
Adds checkboxes and their stories.
A checkbox can be created simply by passing an id:
~~~rust
#[derive(Component)]
pub struct Checkbox {
id: SharedString,
checked: Selected,
disabled: bool,
}
impl Checkbox {
pub fn new(id: impl Into<SharedString>) -> Self {
Self {
id: id.into(),
checked: Selected::Unselected,
disabled: false,
}
}
//...
}
~~~
I've documented this component rather thoroughly as an example of how
we've been thinking about building out UI elements:
~~~rs
pub fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>)
-> impl Component<V> {
let group_id = format!("checkbox_group_{}", self.id);
// The icon is different depending on the state of the checkbox.
//
// We need the match to return all the same type,
// so we wrap the eatch result in a div.
//
// We are still exploring the best way to handle this.
let icon = match self.checked {
// When selected, we show a checkmark.
Selected::Selected => {
div().child(
IconElement::new(Icon::Check)
.size(crate::IconSize::Small)
.color(
// If the checkbox is disabled we change the color of the icon.
if self.disabled {
IconColor::Disabled
} else {
IconColor::Selected
},
),
)
}
// In an indeterminate state, we show a dash.
Selected::Indeterminate => {
div().child(
IconElement::new(Icon::Dash)
.size(crate::IconSize::Small)
.color(
// If the checkbox is disabled we change the color of the icon.
if self.disabled {
IconColor::Disabled
} else {
IconColor::Selected
},
),
)
}
// When unselected, we show nothing.
Selected::Unselected => div(),
};
// A checkbox could be in an indeterminate state,
// for example the indeterminate state could represent:
// - a group of options of which only some are selected
// - an enabled option that is no longer available
// - a previously agreed to license that has been updated
//
// For the sake of styles we treat the indeterminate state as selected,
// but it's icon will be different.
let selected =
self.checked == Selected::Selected || self.checked ==
Selected::Indeterminate;
// We could use something like this to make the checkbox background when
selected:
//
// ~~~rust
// ...
// .when(selected, |this| {
// this.bg(cx.theme().colors().element_selected)
// })
// ~~~
//
// But we use a match instead here because the checkbox might be
disabled,
// and it could be disabled _while_ it is selected, as well as while it
is not selected.
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,
cx.theme().colors().border),
};
div()
// Rather than adding `px_1()` to add some space around the checkbox,
// we use a larger parent element to create a slightly larger
// click area for the checkbox.
.size_5()
// Because we've enlarged the click area, we need to create a
// `group` to pass down interaction events to the checkbox.
.group(group_id.clone())
.child(
div()
.flex()
// This prevent the flex element from growing
// or shrinking in response to any size changes
.flex_none()
// The combo of `justify_center()` and `items_center()`
// is used frequently to center elements in a flex container.
//
// We use this to center the icon in the checkbox.
.justify_center()
.items_center()
.m_1()
.size_4()
.rounded_sm()
.bg(bg_color)
.border()
.border_color(border_color)
// We only want the interaction states to fire when we
// are in a checkbox that isn't disabled.
.when(!self.disabled, |this| {
// Here instead of `hover()` we use `group_hover()`
// to pass it the group id.
this.group_hover(group_id.clone(), |el| {
el.bg(cx.theme().colors().element_hover)
})
})
.child(icon),
)
}
~~~
Release Notes:
- N/A
[[PR Description]]
A few mix organizational things in UI, as well as some toggle changes.
Simplify toggle:
```rust
/// Whether the entry is toggleable, and if so, whether it is currently toggled.
///
/// To make an element toggleable, simply add a `Toggle::Toggled(_)` and handle it's cases.
///
/// You can check if an element is toggleable with `.is_toggleable()`
///
/// Possible values:
/// - `Toggle::NotToggleable` - The entry is not toggleable
/// - `Toggle::Toggled(true)` - The entry is toggleable and toggled
/// - `Toggle::Toggled(false)` - The entry is toggleable and not toggled
#[derive(Debug, Copy, Clone, PartialEq, Eq)]
pub enum Toggle {
NotToggleable,
Toggled(bool),
}
```
Adds helper functions to easily get the toggle and toggleable states:
```rust
impl Toggle {
/// Returns true if the entry is toggled (or is not toggleable.)
///
/// As element that isn't toggleable is always "expanded" or "enabled"
/// returning true in that case makes sense.
pub fn is_toggled(&self) -> bool {
match self {
Self::Toggled(false) => false,
_ => true,
}
}
pub fn is_toggleable(&self) -> bool {
match self {
Self::Toggled(_) => true,
_ => false,
}
}
}
```
Pulls `disclosure_control` out of components and creates a common def:
```rust
pub fn disclosure_control<V: 'static>(toggle: Toggle) -> impl Component<V> {
match (toggle.is_toggleable(), toggle.is_toggled()) {
(false, _) => div(),
(_, true) => div().child(
IconElement::new(Icon::ChevronDown)
.color(IconColor::Muted)
.size(IconSize::Small),
),
(_, false) => div().child(
IconElement::new(Icon::ChevronRight)
.color(IconColor::Muted)
.size(IconSize::Small),
),
}
}
```
disclosure_control will likely get pulled into it's own component in the
future instead of being in toggle.
Release Notes:
- N/A
This fixes a tiny UX bug where the tooltip would appear to move if you
hovered over an element, then moved your mouse out and back within
500ms.
The fix is to retain the task, so we can drop it to cancel it when the
mouse leaves.
Also changes the time we construct the tooltip to the time it first
shows.
Nate Butler