Commit graph

37 commits

Author SHA1 Message Date
Jason Lee
5e504d10bb
chore: Refactor tab key to switch focus. (#991)
Wait https://github.com/zed-industries/zed/pull/33008,
https://github.com/zed-industries/zed/pull/34804 to merge.


https://github.com/user-attachments/assets/3c21ebc9-44a0-4311-bb0f-5f63fe8d4bb3

- Improved `focus_ring` to render like an outline.
- Added to support press `Enter`, `Space` key to trigger Checkbox,
Button, Radio.

## Break Changes

- The `FocusableExt` has been changed to only for crate internal.
- The `FocusableCycle` has been removed, now GPUI has it own tab stop
implementation.
2025-09-29 16:48:24 +08:00
Jason Lee
93b578294c
list: Update ListItem and DropdownListItem style. (#1095)
## Break Change

- The `Selectable` trait has been removed `element_id` method, this is
necessary.
- The `item` of `List` now must impl `Selectable` trait.

## List

> NOTE: The default ListItem is no rounded and paddings.

<img width="1144" height="762" alt="image"
src="https://github.com/user-attachments/assets/32348682-f89a-487a-af9f-5ed379a7f2d8"
/>

## Dropdown

<img width="537" height="387" alt="image"
src="https://github.com/user-attachments/assets/3cc99d9f-3714-4d10-b467-6c91917bcbf0"
/>
2025-07-28 18:38:39 +08:00
Jason Lee
37aa26d655
check, radio: Add fade in animation to Checkbox and Radio. (#1092) 2025-07-24 11:41:34 +00:00
Jason Lee
692ee83b61
chore: Move shadow_xs to StyledExt trait. (#1010)
This PR for fix https://github.com/longbridge/gpui-component/pull/1009
mistake.
2025-06-25 16:54:48 +08:00
Jason Lee
c8481bee19
theme: Update theme details to match Shadcn. (#1009)
## Light

<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/b1893648-5994-4c08-a79a-30b10dc62c47"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/de5b4e13-7889-473b-b0c0-9ac11de0a4b0"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/9f17c2a1-3a71-4d56-be6c-49f26f5e7406"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/a4e99a61-a618-4c3b-a237-93bbc17d4cae"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/64313ae5-8284-46ff-a75f-5a14a1e3b339"
/>
<img width="1193" alt="image"
src="https://github.com/user-attachments/assets/5c134172-0ab6-4299-950d-bac3dda7b61d"
/>
<img width="1374" alt="image"
src="https://github.com/user-attachments/assets/c8816288-d008-490d-9db3-4fa796278001"
/>
<img width="1428" alt="image"
src="https://github.com/user-attachments/assets/d903a854-15e3-48aa-8ebd-969c1c91c624"
/>



## Dark

<img width="1467" alt="image"
src="https://github.com/user-attachments/assets/720418b4-8a9b-42c9-814b-a0be660e8eba"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/4ca20f31-c998-40bb-b4bf-6079c506f9ec"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/ae828624-55b3-4d33-8a20-2c71a0a838cc"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/7014c76c-5e18-4cd5-9cf1-6bccbb58e56a"
/>
<img width="1393" alt="image"
src="https://github.com/user-attachments/assets/6e1c514d-5f76-460a-9c7e-a38f2f0e712a"
/>
<img width="1374" alt="image"
src="https://github.com/user-attachments/assets/07ad8c20-317b-4209-9f92-b500f53dd4c0"
/>
<img width="1428" alt="image"
src="https://github.com/user-attachments/assets/6bd2969d-9bec-4ed7-9280-109a81144dfa"
/>
2025-06-25 16:40:27 +08:00
Jason Lee
ed0887420f
chore: Impl Styled for more elements. (#1007)
This PR for continuing #1005 was missed commits.
2025-06-24 19:36:42 +08:00
Jason Lee
7360d2834d
theme: Update default radius to 6px, and modal to 8px. (#995) 2025-06-20 20:07:19 +08:00
Floyd Wang
dc1d516a30
button: Impl Selectable for the dropdown button (#913)
## Break Change
- Add `is_selected` to the `Selectable` trait; Returns true if the
element is selected.
2025-06-02 14:25:18 +08:00
Jason Lee
a9d145dd50
Update disabled menu, button, dropdown etc. to use default cursor. (#814)
To follow macOS UX design.
2025-04-24 21:28:15 +08:00
Jason Lee
5b508d7219
gallery: Redesign the gallery. (#797)
Close #773

<img width="1712" alt="image"
src="https://github.com/user-attachments/assets/e27a28ca-cdd7-4970-8518-4fd0104bb3f8"
/>
2025-04-17 17:12:48 +08:00
Floyd Wang
8930acf648
sidebar: Add suffix for menu item (#792)
| Light | Dark |
| - | - |
| <img width="913" alt="SCR-20250415-mkdr"
src="https://github.com/user-attachments/assets/5c4931e6-4d03-48ec-91c6-ade2d86de75a"
/> | <img width="913" alt="SCR-20250415-mkec"
src="https://github.com/user-attachments/assets/f85af984-ecc3-4cd7-913c-c4e93384dbf1"
/> |
2025-04-15 14:02:52 +08:00
Floyd Wang
95fb86ec08
checkbox: Make checked icon sizable (#785)
| Before | After |
| - | - |
| <img width="642" alt="SCR-20250414-nbwx"
src="https://github.com/user-attachments/assets/fa3daaf8-5465-49f5-8cd5-d59c19b50494"
/> | <img width="644" alt="SCR-20250414-nbli"
src="https://github.com/user-attachments/assets/e45aa560-0183-460a-b76d-e3cb0203067f"
/> |
2025-04-14 14:47:15 +08:00
Floyd Wang
d04866eb77
checkbox: Support sizable (#781)
| Before | After |
| - | - |
| <img width="672" alt="SCR-20250409-pgbg"
src="https://github.com/user-attachments/assets/73a46b13-a3bb-4f58-afb0-aa388bbaefb5"
/> | <img width="669" alt="SCR-20250409-phiy"
src="https://github.com/user-attachments/assets/1230a02d-cdc7-4c2e-9949-bcad09eb2edc"
/> |
2025-04-09 17:31:56 +08:00
Jason Lee
c98e4f0521
checkbox: Add children to Radio, Checkbox to display long texts. (#724)
This change is going to solve the wrapped text line-height.

Before this change, the Label is must set `line-height: 100%` to render
at same line with the checkbox.

But if there have a long text in label, wrapped lines need more
line-height to leave lines spaces. But if we set line-height over the
100%, that the checkbox will not align horizontal center.

So, this change to use other child to solve this issue, we can set
line-height to the child not to the label.


<img width="1204" alt="image"
src="https://github.com/user-attachments/assets/981cf925-01c7-48d7-9dd2-881c727a1759"
/>
2025-03-20 19:12:48 +08:00
Jason Lee
6bcc34c7f0
checkbox, switch: Improve Checkbox, Switch to use wrap text and TextView. (#651)
This change to revert #233 to let label to wrap.


<img width="1279" alt="image"
src="https://github.com/user-attachments/assets/8081216f-0ea0-4ba2-9095-6fd84102e03b"
/>
2025-02-24 18:04:06 +08:00
Jason Lee
8fa210bc21
text_view: Update Switch, Checkbox, Radio to let label method support TextView. (#649)
- Add `style` method to TextView.
- Add `inline` method to TextView to use default inline style.
2025-02-24 15:49:54 +08:00
Jason Lee
3ffbbb0688
theme: Ensure all elements to use radius. (#596)
- Fix menu dispatch action.
2025-02-03 19:03:16 +08:00
Jason Lee
327d40e0e0
chore: Upgrade GPUI 3 (#587)
The pervious version has keep on
[gpui2](https://github.com/longbridge/gpui-component/tree/gpui2) branch,
if there need to use.

Ref https://github.com/zed-industries/zed/pull/22632

## Prepare

### Generate index.scip

```bash
rust-analyzer scip ./ > index.scip
```

### Get [refactor](https://github.com/zed-industries/refactor)

```bash
https://github.com/zed-industries/refactor.git
```

## Refactor exist code

```bash
cd refactor
cargo run -- ~/work/gpui-component
```

Then will get result if successed:

```
    Finished `dev` profile [unoptimized + debuginfo] target(s) in 0.03s
     Running `target/debug/refactor /Users/jason/work/gpui-component`
Loaded 115 SCIP documents
Processing files starting with focus path: ""
Changed 90 files
```

-------------

## Changes

```diff
- View<T>
- Model<T>
+ Entity<T>

- WeakView<T>
+ WeakEntity<T>

- FocusableView
+ Focusable

- cx.bounds()
+ window.bounds()
- cx.refresh()
+ window.refresh()
- cx.focused()
+ window.focused(cx)
- cx.with_optional_element_state
- window.with_optional_element_state
```

```diff
- &mut WindowContext
+ &mut Window, &mut App

- cx: &mut WindowContext
+ window: &mut Window, cx: &mut App

- &mut ViewContext<
+ &mut Window, &mut Context<

- cx: &mut ViewContext<
+ window: &mut Window, cx: &mut Context<
```

```diff
- cx.spawn(|_, mut cx| async move { 
+ cx.spawn_in(window, |_, mut cx| async move {
- cx.dispatch_action(Box::new(...))
+ window.dispatch_action(Box::new(...), cx)
```

`cx.spawn`

```diff
- cx.spawn(|view, mut cx| async move {
+ cx.spawn_in(window, |view, mut window| async move {
+     _ = view.update_in(&mut window, move |view, window, cx| {
```
2025-01-27 03:58:48 +08:00
Jason Lee
e03a0d4f4e
chore: Fix Switch, Radio, Checkbox to use inline layout. (#569) 2025-01-23 18:05:32 +08:00
Jason Lee
9f2cd84b23
color: Add mix method and merge ColorExt to Colorize. (#561)
- Add `mix` method to mix two color.
- Export `ui::theme::*` to crate root, before `use
ui:theme::ActiveTheme` to `use ui::ActiveTheme`.

## Break Changes

- Moved `ui::theme::Colorize` to `ui::Colorize`.
- Merged `ColorExt` to `Colorize`.
- Renamed `to_hex_string` to `to_hex`, `parse_hex_string` to
`parse_hex`.
2025-01-21 18:31:01 +08:00
Jason Lee
41c64e2912
chore: Update controls detail. (#352)
- Better icon style in Input, Dropdown, DatePicker.
2024-10-16 17:51:39 +08:00
Jason Lee
cbed7b1ea1
menu: Add scrollable support to menu. (#310)
<img width="274" alt="image"
src="https://github.com/user-attachments/assets/eaff16a6-1294-4381-96c0-c178c195999b">
2024-10-04 14:24:05 +08:00
Jason Lee
75b4f34b92
Try fix Button, Checkbox, Radio text line-height (#240)
<img width="1202" alt="屏幕截图 2024-09-12 224306"
src="https://github.com/user-attachments/assets/b96fee5e-6d39-4ba0-829c-3eaf4aed8ff2">
2024-09-16 10:36:18 +08:00
Jason Lee
55585f9699
windows: Fix button and checkbox line-height again. (#244)
<img width="1202"
src="https://github.com/user-attachments/assets/6741041a-f449-4600-bec1-751841dcec88">
2024-09-13 22:55:59 +08:00
Jason Lee
fbbb985e84
ui: Improve UI details (Modal, Checkbox, Radio and MenuItem) (#233)
- modal: Reduce modal title line height.
- checkbox, radio: Fix label line height to align with checkbox.
- menu: Update Menu item style, height to 28px, and fix divider padding.

<img width="523" alt="image"
src="https://github.com/user-attachments/assets/c254dc07-9d37-4885-b687-58ec4d8e95a4">

<img width="453" alt="image"
src="https://github.com/user-attachments/assets/3ad44419-1953-4048-8173-4d8c0646777a">

<img width="369" alt="image"
src="https://github.com/user-attachments/assets/84d23eb2-15f9-47d7-b6d4-15295ab3a544">
2024-09-10 19:42:54 +08:00
ihavecoke
303dd51047
Use small size for calendar month item to fixed content overflow (#231) 2024-09-10 00:16:31 +08:00
Jason Lee
a049f606c0
Fix Checkbox, Radio label color. (#200) 2024-09-02 00:24:57 +08:00
Jason Lee
bb6d8d8f60
Cleanup first version impls (#132) 2024-08-11 14:46:55 +08:00
Jason Lee
e9d409a4b1
Add Link style Button (#97)
<img width="1305" alt="image"
src="https://github.com/user-attachments/assets/ee42d86f-e237-4544-aa2d-1414dabfb55e">

- Update `primary`, `danger`, `outline`, `ghost`, `link` methods to as a
builder method to just change style.
- Add `compact` used to reduce padding.

<img width="1279" alt="image"
src="https://github.com/user-attachments/assets/ccbd71c0-9157-4ef8-b164-b99ade24cf92">
2024-08-01 19:54:35 +08:00
Jason Lee
d659713555
Fix Label, Checkbox, Radio to support label text wrap. (#90)
<img width="1102" alt="image"
src="https://github.com/user-attachments/assets/1443378d-54e9-43a4-8bb8-0d0f4581169d">
2024-07-31 11:49:32 +08:00
Floyd Wang
4d9077fe85 Rename ui::stock to ui::stack 2024-07-09 16:25:07 +08:00
Jason Lee
cbbd20867f
Add Icon Button support. (#11)
When the Button have no label present, it will use the Icon mode.

<img width="891" alt="image"
src="https://github.com/huacnlee/gpui-component/assets/5518/ca6240d5-02c8-4201-9a79-4afdf9938dd8">
2024-07-01 21:32:03 +08:00
Jason Lee
3288270b49
Add Popover (#6) 2024-06-29 10:03:59 +08:00
Jason Lee
daf4e713d1 Fix ListItem check icon. 2024-06-28 10:11:00 +08:00
Jason Lee
e4fcd24382 Add label to Switch 2024-06-26 10:25:51 +08:00
Jason Lee
08a99217a2 Add TabBar 2024-06-25 19:07:05 +08:00
Jason Lee
8440df938a Add checkbox, title_bar. 2024-06-25 17:16:04 +08:00