Commit Graph
44 Commits
Author SHA1 Message Date
Nate Butler 6b33c9fb86 Toggle & Switch (#21979)
![CleanShot 2024-12-13 at 11 27
39@2x](https://github.com/user-attachments/assets/7c7828c0-c5c7-4dc6-931e-722366d4f15a)

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

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

Release Notes:

- N/A
2024-12-13 14:23:02 -05:00
Nate Butler b58bfed329 Add placeholder git panel (#21894)
Adds a simple git placeholder panel for us to iterate from. Also
includes a number of assets from the git prototyping branch that we will
use.

Note: This panel is staff flagged for now.

Release Notes:

- N/A
2024-12-11 22:13:52 -05:00
Danilo Leal 3281c2d20d theme: Add color darken function (#20746)
This PR adds a `darken` function that allows to reduce the lightness of
a color by a certain factor. This popped up as I wanted to add hover
styles to tinted-colors buttons.

Release Notes:

- N/A
2024-11-18 12:44:49 -03:00
Danilo LealandNate Butler 2944b21a8b Add new DecoratedIcon component (#20516)
This PR creates a new, revamped `DecoratedIcon` component that enables
using different SVGs, one for the knockout background and another for
the actual icon. That's different than what we were doing before—copying
the SVG and using slightly different positioning—because we wanted to
unlock an aligned knockout effect, which was particularly hard to do
with non-simple shapes such as an X.

Release Notes:

- N/A

---------

Co-authored-by: Nate Butler <1714999+iamnbutler@users.noreply.github.com>
2024-11-11 19:09:02 -03:00
Nate Butler d980cd125e Refactor Spacing into DynamicSpacing using proc macro (#20504)
Density tracking issue: #18078 

This PR refactors our spacing system to use a more flexible and
maintainable approach. We've replaced the static `Spacing` enum with a
dynamically generated `DynamicSpacing` enum using a proc macro.

Enum variants now use a `BaseXX` format, where XX = the pixel value @
default rem size and the default UI density.

For example:

`CustomSpacing::Base16` would return 16px at the default UI scale &
density.

I'd love to find another name other than `Base` that is clear (to avoid
base_10, etc confusion), let me know if you have any ideas!

Changes:

- Introduced a new `derive_dynamic_spacing` proc macro to generate the
`DynamicSpacing` enum
- Updated all usages of `Spacing` to use the new `DynamicSpacing`
- Removed the `custom_spacing` function, mapping previous usages to
appropriate `DynamicSpacing` variants
- Improved documentation and type safety for spacing values

New usage example:

```rust
.child(
    div()
        .flex()
        .flex_none()
        .m(DynamicSpacing::Base04.px(cx))
        .size(DynamicSpacing::Base16.rems(cx))
        .children(icon),
)
```

vs old usage example:

```
.child(
    div()
        .flex()
        .flex_none()
        .m(Spacing::Small.px(cx))
        .size(custom_spacing(px(16.)))
        .children(icon),
)
```

Release Notes:

- N/A
2024-11-11 11:08:55 -05:00
Nate Butler 33b1f2e2b3 Add ui::table (#20447)
This PR adds the `ui::Table` component.

It has a rather simple API, but cells can contain either strings or
elements, allowing for some complex uses.

Example usage:

```rust
Table::new(vec!["Product", "Price", "Stock"])
    .width(px(600.))
    .striped()
    .row(vec!["Laptop", "$999", "In Stock"])
    .row(vec!["Phone", "$599", "Low Stock"])
    .row(vec!["Tablet", "$399", "Out of Stock"])
```

For more complex use cases, the table supports mixed content:

```rust
Table::new(vec!["Status", "Name", "Priority", "Deadline", "Action"])
    .width(px(840.))
    .row(vec![
        element_cell(Indicator::dot().color(Color::Success).into_any_element()),
        string_cell("Project A"),
        string_cell("High"),
        string_cell("2023-12-31"),
        element_cell(Button::new("view_a", "View").style(ButtonStyle::Filled).full_width().into_any_element()),
    ])
    // ... more rows
```

Preview:

![CleanShot 2024-11-08 at 20 53
04@2x](https://github.com/user-attachments/assets/b39122f0-a29b-423b-8e24-86ab4c42bac2)

This component is pretty basic, improvements are welcome!

Release Notes:

- N/A
2024-11-08 21:10:15 -05:00
Nate Butler e6bca9054e More previews (#20329)
Release Notes:

- N/A
2024-11-06 21:15:35 -05:00
Marshall Bowers e8d429ff61 ui: Fix swapped element background colors (#19701)
This PR fixes an issue introduced in
https://github.com/zed-industries/zed/pull/18768 where the element
backgrounds colors for `ElevationIndex::ElevatedSurface` and
`ElevationIndex::Surface` were swapped.

Release Notes:

- N/A
2024-10-24 16:34:45 -04:00
Nate Butler ad1c238be4 ui crate docs & spring cleaning (#18768)
Similar to https://github.com/zed-industries/zed/pull/18690 &
https://github.com/zed-industries/zed/pull/18695, this PR enables
required docs for `ui` and does some cleanup.

Changes:
- Enables the `deny(missing_docs)` crate-wide.
- Adds `allow(missing_docs)` on many modules until folks pick them up to
document them
- Documents some modules (all in `ui/src/styles`)
- Crate root-level organization: Traits move to `traits`, other misc
organization
- Cleaned out a bunch of unused code.

Note: I'd like to remove `utils/format_distance` but the assistant panel
uses it. To move it over to use the `time_format` crate we may need to
update it to use `time` instead of `chrono`. Needs more investigation.

Release Notes:

- N/A
2024-10-05 23:28:34 -04:00
Bennet Bo Fenner 2c4e67ea32 Fix missing tooltips for selected buttons (#18435)
Reverts #13857. Hiding tooltips for selected buttons prevents tooltips
like "Close x dock" from showing up, see #14938 for an example.
The intention of the original PR was to hide the "Show application menu"
tooltip, while the context menu is open.
In order to fix this without breaking other UI elements, we track the
state of the context menu using `PopoverMenuHandle` now, which allows us
to prevent the tooltip from showing up while the context menu is open.

Closes #14938

Release Notes:

- Fixed an issue where some tooltips would not show up
2024-09-27 14:16:14 +02:00
Piotr Osiewicz f73e0b54ba chore: Revert changes made to ui crate structure (#17516)
As a part of https://github.com/zed-industries/zed/pull/17488 I
flattened module structure of ui crate to fix module_inception lint.
However, that's actually unnecessary as we can pass that lint via a
custom knob for clippy.

Closes #ISSUE

Release Notes:

- N/A
2024-09-06 21:38:56 +02:00
Piotr Osiewicz 9b464f483b chore: Fix several style lints (#17488)
It's not comprehensive enough to start linting on `style` group, but
hey, it's a start.

Release Notes:

- N/A
2024-09-06 11:58:39 +02:00
Piotr Osiewicz 167fa206c8 assistant: Remove "Resolving" text for step resolution and use Transform instead (#16461)
That way, user can click on "Transform" straight away and get it applied
immediately when it's resolved.



https://github.com/user-attachments/assets/08c99804-3841-4eba-a5eb-7066a9f45b47


TODO:
- [x] Tie "Send" button at the bottom into the same behavior

Release Notes:

- N/A
2024-08-19 15:17:04 +02:00
e7ace39aca assistant: Polish /workflow and steps UI (#15936)
Fixes #15923
Release Notes:

- Assistant workflow steps can now be applied and reverted directly from
within the assistant panel.

---------

Co-authored-by: Antonio Scandurra <me@as-cii.com>
Co-authored-by: Antonio <antonio@zed.dev>
2024-08-08 15:46:33 +02:00
2647e37c72 Add design tweaks to the AI configuration panel (#15894)
This PR polishes elements around setting up LLM providers on the
Assistant panel, including:

- [x] Adding banners for promoting Zed AI and to deal with the "No
provider set up" scenario
- [x] Tweaking the error popover whenever there's no API key added
- [ ] Making configuration panel scrollable

--- 

Release Notes:

- N/A

---------

Co-authored-by: Thorsten Ball <mrnugget@gmail.com>
Co-authored-by: Bennet Bo Fenner <53836821+bennetbo@users.noreply.github.com>
Co-authored-by: Marshall Bowers <1486634+maxdeviant@users.noreply.github.com>
2024-08-08 12:12:36 +02:00
3411657bea Add REPL dropdown menu to toolbar (#14493)
TODO: 


- [x] Actions run from menu not firing
- [x] Menu differentiates idle and busy for running kernel

Menu States:
- [x] No session && no support known

No session && no kernel installed for languages of known support
- (TODO after) Intro to REPL
- [x] Link to docs

No session but can start one
- [x] Start REPL
- (TODO after) More info -> Docs?

Yes Session

- [x] Info: Kernel name, language
  example: chatlab-3.7-adsf87fsa (Python)
  example: condapy-3.7 (Python)
- [x] Change Kernel -> https://zed.dev/docs/repl#change-kernel
- ---
- [x] Run
- [x] Interrupt
- [x] Clear Outputs
- ---
- [x] Shutdown


(Release notes left empty as the change will be documented in the REPL
release!)

Reserved for a follow on PR:

```
- [ ] Status should update when the menu is open (missing `cx.notify`?)
- [ ] Shutdown all kernels action
- [ ] Restart action
- [ ] [Default kernel changed - restart (this kernel) to apply] // todo!(kyle): need some kind of state thing that says if this has happened
```


Release Notes:

- N/A

---------

Co-authored-by: Marshall Bowers <elliott.codes@gmail.com>
Co-authored-by: Kyle Kelley <rgbkrk@gmail.com>
Co-authored-by: Piotr Osiewicz <24362066+osiewicz@users.noreply.github.com>
2024-07-15 11:55:49 -07:00
Marshall Bowers a5a2a46140 ui: Add margin style methods to Label and LabelLike (#14032)
This PR adds margin style methods to the `Label` and `LabelLike`
components.

This allows for callers to provide a margin to these components without
needing to introduce a wrapping `div` to do so.

Release Notes:

- N/A
2024-07-09 17:41:54 -04:00
Marshall Bowers a8f6fd2042 ui: Add NumericStepper component (#13954)
This PR adds a `NumericStepper` component that can be used to display a
numeric value along with controls to increment, decrement, and reset the
value.

The `ApplicationMenu` has been updated to use the `NumericStepper` for
adjusting the buffer and UI font size.

Here it is in action:


https://github.com/zed-industries/zed/assets/1486634/03cffe67-1256-4283-aa3d-560fffa06dad

Note: Due to the way we do font adjustments, once modified the reset
button will be displayed until it is clicked (or the font size
adjustment is otherwise reset). Simply returning to the original value
will currently not hide the reset button.

Release Notes:

- N/A
2024-07-08 18:45:49 -04:00
Thorsten Ball 3960aaa6c2 ui: Don't show tooltip when ButtonLike is selected (#13857)
This fixes the issue of a tooltip covering the thing that the button has
revealed.

It also mirrors what other UI frameworks do. Chrome on Linux behaves the
same, and Safari does the same thing on macOS.

It fixes this:

![Screenshot from 2024-07-05
12-39-22](https://github.com/zed-industries/zed/assets/1185253/51ce4347-d12f-463a-9adb-da031fe2f751)


Release Notes:

- N/A
2024-07-05 14:27:53 +02:00
23167be205 Prompt Library Refinements (#13470)
TODO:

- [x] Moving the cursor out of the title editor should unselect any
selected text

Release Notes:

- N/A

---------

Co-authored-by: Antonio Scandurra <me@as-cii.com>
Co-authored-by: Richard <richard@zed.dev>
2024-06-25 11:43:30 -04:00
versecafeandMarshall Bowers db90d1edfe Use square buttons for code action and run indicators in the gutter (#12906)
### Before

<img width="94" alt="Screenshot 2024-06-14 at 1 34 54 PM"
src="https://github.com/zed-industries/zed/assets/1486634/fe756434-f072-4506-8fd2-c220c17cf112">

<img width="115" alt="Screenshot 2024-06-14 at 1 35 04 PM"
src="https://github.com/zed-industries/zed/assets/1486634/e378f02b-cb55-467d-9a5e-04e162d6daab">

### After

<img width="128" alt="Screenshot 2024-06-14 at 1 34 27 PM"
src="https://github.com/zed-industries/zed/assets/1486634/3d857a85-7673-43b1-8c48-56766455dd81">

<img width="134" alt="Screenshot 2024-06-14 at 1 34 33 PM"
src="https://github.com/zed-industries/zed/assets/1486634/b04c1fef-0a30-4eb1-b8f7-4eff351fcdc7">


Release Notes:

- Improved the look of code action and run indicators in the gutter
([#12803](https://github.com/zed-industries/zed/issues/12803)).

---------

Co-authored-by: Marshall Bowers <elliott.codes@gmail.com>
2024-06-14 14:21:16 -04:00
8c5f30f456 Allow ssh connection for setting up zed (#12063)
Co-Authored-By: Mikayla <mikayla@zed.dev>



Release Notes:

- Magic `ssh` login feature for remote development

---------

Co-authored-by: Mikayla <mikayla@zed.dev>
Co-authored-by: Nate Butler <iamnbutler@gmail.com>
2024-05-21 22:39:16 -06:00
d9a17f61b9 Introduce a new markdown crate (#11556)
This pull request introduces a new `markdown` crate which is capable of
parsing and rendering a Markdown source. One of the key additions is
that it enables text selection within a `Markdown` view. Eventually,
this will replace `RichText` but for now the goal is to use it in the
assistant revamped assistant in the spirit of making progress.

<img width="711" alt="image"
src="https://github.com/zed-industries/zed/assets/482957/b56c777b-e57c-42f9-95c1-3ada22f63a69">

Note that this pull request doesn't yet use the new markdown renderer in
`assistant2`. This is because we need to modify the assistant before
slotting in the new renderer and I wanted to merge this independently of
those changes.

Release Notes:

- N/A

---------

Co-authored-by: Nathan Sobo <nathan@zed.dev>
Co-authored-by: Conrad <conrad@zed.dev>
Co-authored-by: Alp <akeles@umd.edu>
Co-authored-by: Zachiah Sawyer <zachiah@proton.me>
2024-05-09 11:03:33 +02:00
Nate Butler baabdc6f80 Add wiring for UI density (#11260)
Note: You shouldn't use the `unstable.ui_density` setting – it is only
being added for testing and to enable new UI components to be built with
density in mind. Don't expect this to work well, or at all right now.

Adds some of the basic wiring we'll need to start scaling UI elements
throughout the app based on a desired density setting.

Release Notes:

- N/A
2024-05-01 14:28:52 -04:00
Mikayla Maki 55bd760803 Improve diagnostic header UI (#9888)
This PR rearranges the diagnostics to put the headers to the left of the
diagnostic messages and adds an additional button to close the
diagnostics.

<img width="394" alt="Screenshot 2024-03-27 at 2 01 19 PM"
src="https://github.com/zed-industries/zed/assets/2280405/83be4051-6441-47c6-9b48-77c75ce9c8eb">

<img width="326" alt="Screenshot 2024-03-27 at 2 01 56 PM"
src="https://github.com/zed-industries/zed/assets/2280405/d849ca34-91e9-4de6-9d9c-503b75e97d60">

As a drive by, I also quieted a useless but loud log message.

Release Notes:

- Added a close button to the `f8` diagnostics.
2024-03-27 14:30:27 -07:00
Marshall Bowers 29026f7ff9 Encode rem values derived from pixels using rems_from_px (#9367)
This PR adds a new `rems_from_px` helper function that can be used to
compute rem values based on a pixel value.

This is something we do fairly commonly, where we want to express a size
that is a given pixel size at the base rem size (e.g., "14px when the
rem size is 16px").

`rems_from_px` helps make the intent more explicit, as well as prevent
the base rem size from being duplicated everywhere.

Note: Ideally we would want `rems_from_px` to be `const`, but that
depends on https://github.com/rust-lang/rust/issues/57241.

Release Notes:

- N/A
2024-03-14 16:39:55 -04:00
Mikayla e3ad0f794c Finish documenting the action, asset, color, and element modules in GPUI
Remove SmallVec from the public API of GPUI
2024-01-20 20:15:23 -08:00
Conrad IrwinandMikayla baee8dafd6 Fix right click handler for tabs
Also, some fun test helpers

Co-Authored-By: Mikayla <mikayla@zed.dev>
2024-01-18 12:10:38 -07:00
Mikayla 0b43bd7c14 Fix typos detected by crate-ci/typos 2024-01-17 14:31:21 -08:00
Marshall Bowers 119a0adc8c Make channel buttons square (#4092)
This PR makes the channel buttons square.

Release Notes:

- Adjusted the shape of the channel buttons.
2024-01-17 11:47:43 -05:00
Marshall Bowers dc67b7bcaa 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
2024-01-15 11:34:06 -05:00
Marshall Bowers 2999a0fd58 Make tab close button square (#4052)
This PR makes the close button for tabs square.

`IconButton` now accepts a `shape`, and using `IconButtonShape::Square`
will ensure the `IconButton` is square with respect to its contained
icon.

#### Before

<img width="119" alt="Screenshot 2024-01-15 at 10 32 40 AM"
src="https://github.com/zed-industries/zed/assets/1486634/dc806b9b-411f-4cd9-8c10-676d2cbd298b">

#### After

<img width="116" alt="Screenshot 2024-01-15 at 10 32 24 AM"
src="https://github.com/zed-industries/zed/assets/1486634/8b4ef43c-14b6-449f-a235-5d7affd82c4e">

Release Notes:

- Changed the tab close button to be square.
2024-01-15 10:43:03 -05:00
Marshall Bowers 36e36decc8 ui: Fix doc tests (#3989)
There were a ton of doc tests that weren't compiling in the `ui` crate,
so this PR fixes them.

Release Notes:

- N/A
2024-01-09 16:56:28 -05:00
Marshall Bowers b3678463e8 Clean up references in doc comments in ui and theme crates (#3985)
This PR cleans up a number of references in doc comments in the `ui` and
`theme` crates so that `rustdoc` will link and display them correctly.

Release Notes:

- N/A
2024-01-09 15:22:36 -05:00
Nate Butler d3bc7c4096 Document more enums 2024-01-09 14:50:04 -05:00
Nate Butler a7b3045ed1 Document ui crate traits 2024-01-09 14:15:25 -05:00
Nate Butler 9b2ec46772 Add label docs 2024-01-09 13:49:27 -05:00
Nate ButlerandAntonio Scandurra 7255dba0ea Initial button documentation
Co-Authored-By: Antonio Scandurra <me@as-cii.com>
2024-01-09 13:39:15 -05:00
Marshall Bowers 84dd2c6954 Rename IconElement to just Icon (#3974)
This PR renames the `IconElement` component to just `Icon`.

This better matches the rest of our components, as `IconElement` was the
only one using this naming convention.

The `Icon` enum has been renamed to `IconName` to free up the name.

I was trying to come up with a way that would allow rendering an
`Icon::Zed` directly (and thus make the `IconElement` a hidden part of
the API), but I couldn't come up with a way to do this cleanly.

Release Notes:

- N/A
2024-01-09 10:11:20 -05:00
Nate Butler d11d57806a Implement Tinted buttons and selected_style for buttons 2024-01-05 11:19:58 -05:00
Marshall Bowers bb83c02d12 Remove unneeded branches 2024-01-04 17:35:18 -05:00
Nate Butler a39ca584b6 WIP tinted buttons 2024-01-04 11:15:53 -05:00
Marshall Bowers b1a62f06ee Add empty state for project panel (#3863)
This PR adds an empty state for the project panel.

It will now display an "Open a project" button.

Release Notes:

- Added an empty state for the project panel.
2024-01-03 17:00:47 -05:00
Max BrunsfeldandMikayla e2be87c688 Remove 2 suffix for ui, storybook, text
Co-authored-by: Mikayla <mikayla@zed.dev>
2024-01-03 12:33:51 -08:00