This also adds a convenient `Scrollbar:auto_hide` function so that we
don't have to handle that at the callsite.
Release Notes:
- N/A
---------
Co-authored-by: David Kleingeld <davidsk@zed.dev>
Follow-up to https://github.com/zed-industries/zed/pull/35121 - in the
process of adding the check for the left mouse button to the guard
(which was practically already there before, just not in the mouse-down
listener), I accidentally removed the negation for the bounds check.
This PR fixes this.
Release Notes:
- N/A
This PR does some minor cleanup to the scrollbar component. Namely, it
removes some clones, reduces the amount of unnecessary notifies and
ensures the scrollbar hover state is more accurately updated.
Release Notes:
- N/A
Follow up to #31836
After enabling rounding in the Taffy layout engine, we frequently run
into cases where the bounds produced by Taffy and ours slightly differ
after 5 or more decimal places. This leads to cases where containers
become scrollable for less than 0.0000x Pixels. In case this happens for
e.g. hover popovers, we render a scrollbar due to the container being
technically scrollable, even though the scroll amount here will in
practice never be visible.
This change fixes this by rounding the `scroll_max` by which we clamp
the current scroll position to two decimal places. We don't benefit from
the additional floating point precision here at all and it stops such
containers from becoming scrollable altogether. Furthermore, we now
store the `scroll_max` instead of the `padded_content_size` as the
former gives a much better idea on whether the corresponding container
is scrollable or not.
| `main` | After these changes |
| -- | -- |
| <img width="610" height="316" alt="main"
src="https://github.com/user-attachments/assets/ffcc0322-6d6e-4f79-a916-bd3c57fe4211"
/> | <img width="610" height="316" alt="scroll_max_rounded"
src="https://github.com/user-attachments/assets/5fe530f5-2e21-4aaa-81f4-e5c53ab73e4f"
/> |
Release Notes:
- Fixed an issue where scrollbars would appear in containers where no
scrolling was possible.
Follow-up to #24797
This PR ensures some cursor styles do not change for draggable elements
during dragging. The linked PR covered this on the higher level for
draggable divs. However, e.g. the pane divider inbetween two editors is
not a draggable div and thus still has the issue that the cursor style
changes during dragging. This PR fixes this issue by setting the hitbox
to `None` in cases where the element is currently being dragged, which
ensures the cursor style is applied to the cursor no matter what during
dragging.
Namely, this change fixes this for
- non-div pane dividers
- minimap slider and the
- editor scrollbars
and implements it for the UI scrollbars (Notably, UI scrollbars do
already have `cursor_default` on their parent container but would not
keep this during dragging. I opted out on removing this from the parent
containers until #30194 or a similar PR is merged).
https://github.com/user-attachments/assets/f97859dd-5f1d-4449-ab92-c27f2d933c4a
Release Notes:
- N/A
tl;dr: This adds `.block_mouse_except_scroll()` which should typically
be used instead of `.occlude()` for cases when the mouse shouldn't
interact with elements drawn below an element. The rationale for
treating scroll events differently:
* Mouse move / click / styles / tooltips are for elements the user is
interacting with directly.
* Mouse scroll events are about finding the current outer scroll
container.
Most use of `occlude` should probably be switched to this, but I figured
I'd derisk this change by minimizing behavior changes to just the 3 uses
of `block_mouse_except_scroll`.
GPUI changes:
* Added `InteractiveElement::block_mouse_except_scroll()`, and removes
`stop_mouse_events_except_scroll()`
* Added `Hitbox::should_handle_scroll()` to be used when handling scroll
wheel events.
* `Window::insert_hitbox` now takes `HitboxBehavior` instead of
`occlude: bool`.
- `false` for that bool is now `HitboxBehavior::Normal`.
- `true` for that bool is now `HitboxBehavior::BlockMouse`.
- The new mode is `HitboxBehavior::BlockMouseExceptScroll`.
* Removes `Default` impl for `HitboxId` since applications should not
manually create `HitboxId(0)`.
Release Notes:
- N/A
Closes#30409
Handles edge case where `f32` turns into `Nan` and causes panic down the
code.
Release Notes:
- Fixed issue where Zed crashes on switching repository via git panel on
Linux.
This PR implements color changing for the scrollbar component based upon
user mouse interaction.
https://github.com/user-attachments/assets/2fd14e2d-cc5c-4272-906e-bd39bfb007e4
This PR also already adds the state for a scrollbar being actively
dragged. However, as themes currently do not provide a color for this
scenario, this implementation re-uses the hover color as a placeholder
instead. If this feature is at all wanted, I can quickly open up a
follow-up PR which adds support for that property to themes as well as
this component.
Release Notes:
- Added hover state to scrollbars outside of the editor.
Open inspector with `dev: toggle inspector` from command palette or
`cmd-alt-i` on mac or `ctrl-alt-i` on linux.
https://github.com/user-attachments/assets/54c43034-d40b-414e-ba9b-190bed2e6d2f
* Picking of elements via the mouse, with scroll wheel to inspect
occluded elements.
* Temporary manipulation of the selected element.
* Layout info and JSON-based style manipulation for `Div`.
* Navigation to code that constructed the element.
Big thanks to @as-cii and @maxdeviant for sorting out how to implement
the core of an inspector.
Release Notes:
- N/A
---------
Co-authored-by: Antonio Scandurra <me@as-cii.com>
Co-authored-by: Marshall Bowers <git@maxdeviant.com>
Co-authored-by: Federico Dionisi <code@fdionisi.me>
Closes https://github.com/zed-industries/zed/issues/23386
This PR updates the scrollbar-component to account for padding present
in the parent container.
Since the linked issue was opened,
https://github.com/zed-industries/zed/pull/25288 improved the behaviour
so that the scrollbar does allow scrolling the entire container, however
the scrollbar thumb still does not go the entire way to the bottom. This
can be seen here:
https://github.com/user-attachments/assets/89204355-e6b8-428b-9fa9-bb614051b6fa
This happens because during layouting of the scrollbar, padding of the
parent container is not taken into account. The scrollbar thumb size is
calculated as if no padding was present.
With this change, padding is now included in the calculation, which
resolves the issue:
https://github.com/user-attachments/assets/1d4c62e0-4555-4332-a9ab-4e114684b4b3
The change here is to store the calculated content size during prepaint
_including_ padding and use this for layouting the scrollbar. This
ensures that the actual scroll max and the content size are always in
sync. Furthermore, the existing `TODO`-comment is also resolved, as we
now no longer look at the size of the last child but the actual parent
size instead.
This also removes an existing panic of the scrollbar-component in cases
where the content size was 0, which was previously not accounted for
(this never happened in practice so far, for example because of the
padding added here:
43712285bf/crates/editor/src/hover_popover.rs (L802-L809)
which prevented the container size from ever being 0).
---
Lastly, as I was wiring through the changes of the `content_size` I
noticed that some code was duplicated during the initial layouting as
well as in the click handlers. I refactored this in the second commit to
use `along` where possible as well as computing the new click offset in
one closure which can be passed to both event listeners. As always,
should any of these changes not be wanted, feel free to let me know and
I will revert these.
Looking forward to your feedback 😄
Release Notes:
- Fixed scrollbars sometimes not scrolling all the way to the bottom.
This required adding scrollbar support to `list`. Since `list` is
virtualized, the scrollbar height will change as more items are
measured. When the user manually drags the scrollbar, we'll persist the
initial height and offset calculations accordingly to prevent the
scrollbar from moving away from the cursor as new items are measured.
We're not doing this yet, but in the future, it'd be nice to budget some
time each frame to layout unmeasured items so that the scrollbar height
is as accurate as possible.
Release Notes:
- N/A
Features:
* Scales dash spacing with border width.
* Laying out dashes around rounded corners.
* Varying border widths with rounded corners - now uses an ellipse for the inner edge of the border.
* When there are no rounded corners, each straight border is laid out separately, so that the dashes to meet at the corners.
* All sides of each dash are antialiased.


Release Notes:
- N/A
---------
Co-authored-by: Michael Sloan <michael@zed.dev>
Co-authored-by: Ben <ben@zed.dev>
This PR addresses 3 issues with the common scrollbar component used in
the Terminal, Outline Panel, etc.
1. Extremely small or invisible scrollbar for long content.
2. Flickering issue when the thumb is already at the bottom-most
position, and the user tries to overscroll.
3. Scrollbar appearing even when there is no excessive content to
scroll.
Before:
<img width="300" alt="image"
src="https://github.com/user-attachments/assets/8a124a72-3b56-4bef-858a-a4942c871829"
/>
After:
<img width="300" alt="Screenshot 2025-02-21 at 3 26 32 AM"
src="https://github.com/user-attachments/assets/2a8a5796-b332-4c06-84b2-226d2de6e300"
/>
Release Notes:
- Fixed extremely small scrollbar thumb for long content in Terminal,
Outline Panel, and more.
---------
Co-authored-by: Danilo <danilo@zed.dev>
Co-authored-by: Richard Feldman <oss@rtfeldman.com>
## Context
While looking through the client crate, I noticed that some of the old
functions and variables were still using gpui::model name that was
deprecated during the gpui3 transition. This PR renames those instances
of model to entity to be more inline with gpui3.
In addition, I also renamed `model` to `entity` in cases found by the
below search terms given by @someone13574
- model = cx.
- model: Entity
- model: &Entity
- OpenedModelHandle
- model.update
- model.upgrade
- model = .*\.root (regex)
- parent_model
- model = cx.new
- cx.spawn(move |model
Release Notes:
- N/A
There's still a bit more work to do on this, but this PR is compiling
(with warnings) after eliminating the key types. When the tasks below
are complete, this will be the new narrative for GPUI:
- `Entity<T>` - This replaces `View<T>`/`Model<T>`. It represents a unit
of state, and if `T` implements `Render`, then `Entity<T>` implements
`Element`.
- `&mut App` This replaces `AppContext` and represents the app.
- `&mut Context<T>` This replaces `ModelContext` and derefs to `App`. It
is provided by the framework when updating an entity.
- `&mut Window` Broken out of `&mut WindowContext` which no longer
exists. Every method that once took `&mut WindowContext` now takes `&mut
Window, &mut App` and every method that took `&mut ViewContext<T>` now
takes `&mut Window, &mut Context<T>`
Not pictured here are the two other failed attempts. It's been quite a
month!
Tasks:
- [x] Remove `View`, `ViewContext`, `WindowContext` and thread through
`Window`
- [x] [@cole-miller @mikayla-maki] Redraw window when entities change
- [x] [@cole-miller @mikayla-maki] Get examples and Zed running
- [x] [@cole-miller @mikayla-maki] Fix Zed rendering
- [x] [@mikayla-maki] Fix todo! macros and comments
- [x] Fix a bug where the editor would not be redrawn because of view
caching
- [x] remove publicness window.notify() and replace with
`AppContext::notify`
- [x] remove `observe_new_window_models`, replace with
`observe_new_models` with an optional window
- [x] Fix a bug where the project panel would not be redrawn because of
the wrong refresh() call being used
- [x] Fix the tests
- [x] Fix warnings by eliminating `Window` params or using `_`
- [x] Fix conflicts
- [x] Simplify generic code where possible
- [x] Rename types
- [ ] Update docs
### issues post merge
- [x] Issues switching between normal and insert mode
- [x] Assistant re-rendering failure
- [x] Vim test failures
- [x] Mac build issue
Release Notes:
- N/A
---------
Co-authored-by: Antonio Scandurra <me@as-cii.com>
Co-authored-by: Cole Miller <cole@zed.dev>
Co-authored-by: Mikayla <mikayla@zed.dev>
Co-authored-by: Joseph <joseph@zed.dev>
Co-authored-by: max <max@zed.dev>
Co-authored-by: Michael Sloan <michael@zed.dev>
Co-authored-by: Mikayla Maki <mikaylamaki@Mikaylas-MacBook-Pro.local>
Co-authored-by: Mikayla <mikayla.c.maki@gmail.com>
Co-authored-by: joão <joao@zed.dev>
Closes#4798
This PR implements a scrollbar for the terminal by turning
`ScrollableHandle` into a trait, allowing us to implement a custom
scroll handle, `TerminalScrollHandle`. It works by converting terminal
lines into pixels that `ScrollableHandle` understands. When
`ScrollableHandle` provides a changed offset (e.g., when you drag the
scrollbar), we convert this pixel offset back into the number of lines
to scroll and update the terminal content accordingly.
While the current version works as expected, I believe the scrollbar's
offset updates could potentially be turned into an event. This event
could then be subscribed to in `TerminalView`, not needing to update the
terminal's offset in the `render` method as it might have performance
implications. Further ideas on this are welcome.
Preview:
https://github.com/user-attachments/assets/560f0aac-4544-4007-8f0b-8833386f608f
Todo:
- [x] Experiment with custom scrollbar responding to terminal mouse
scroll
- [x] Refactor existing scrollbar handle into a trait
- [x] Update terminal to use the scrollbar trait instead of a custom
scrollbar implementation
- [x] Figure out how scrollbar events like mouse drag should notify the
terminal to update its state
- [x] Code clean up
- [x] Scrollbar hide setting for terminal
Release Notes:
- Added scrollbar to the terminal
@iamnbutler edit:
This pull request enhances the image element by introducing the ability
to display loading and fallback states.
Changes:
- Implemented the loading and fallback states for image elements using
`.with_loading` and `.with_fallback` respectively.
- Introduced the `StyledImage` trait and `ImageStyle` to enable a fluent
API for changing image styles across image types (`Img`,
`Stateful<Img>`, etc).
Example Usage:
```rust
fn loading_element() -> impl IntoElement {
div().size_full().flex_none().p_0p5().rounded_sm().child(
div().size_full().with_animation(
"loading-bg",
Animation::new(Duration::from_secs(3))
.repeat()
.with_easing(pulsating_between(0.04, 0.24)),
move |this, delta| this.bg(black().opacity(delta)),
),
)
}
fn fallback_element() -> impl IntoElement {
let fallback_color: Hsla = black().opacity(0.5);
div().size_full().flex_none().p_0p5().child(
div()
.size_full()
.flex()
.items_center()
.justify_center()
.rounded_sm()
.text_sm()
.text_color(fallback_color)
.border_1()
.border_color(fallback_color)
.child("?"),
)
}
impl Render for ImageLoadingExample {
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
img("some/image/path")
.id("image-1")
.with_fallback(|| Self::fallback_element().into_any_element())
.with_loading(|| Self::loading_element().into_any_element())
}
}
```
Note:
An `Img` must have an `id` to be able to add a loading state.
Release Notes:
- N/A
---------
Co-authored-by: nate <nate@zed.dev>
Co-authored-by: michael <michael@zed.dev>
Co-authored-by: Nate Butler <iamnbutler@gmail.com>
Co-authored-by: Antonio Scandurra <me@as-cii.com>
Set the elevation of the scrollbar to 1 borderless, so that the blue
outline is no longer above the scrollbar.
Closes#19875
Release Notes:
- N/A
---------
Co-authored-by: Peter Tripp <peter@zed.dev>
Previously we were always adding the origin coordinate of last item to
the content size, which is incorrect when the list has just one item; in
that case, we should just use the size of that item as the content size
of a list.
Closes #ISSUE
Release Notes:
- N/A