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
This commit is contained in:
Nate Butler 2024-11-11 11:08:55 -05:00 committed by GitHub
parent 93ab6ad922
commit 94d8ead270
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
29 changed files with 292 additions and 191 deletions

View file

@ -421,7 +421,7 @@ impl Pane {
// `end_slot`, but due to needing a view here that isn't possible.
let right_children = h_flex()
// Instead we need to replicate the spacing from the [TabBar]'s `end_slot` here.
.gap(Spacing::Small.rems(cx))
.gap(DynamicSpacing::Base04.rems(cx))
.child(
PopoverMenu::new("pane-tab-bar-popover-menu")
.trigger(

View file

@ -38,9 +38,9 @@ impl Render for StatusBar {
h_flex()
.w_full()
.justify_between()
.gap(Spacing::Large.rems(cx))
.py(Spacing::Small.rems(cx))
.px(Spacing::Large.rems(cx))
.gap(DynamicSpacing::Base08.rems(cx))
.py(DynamicSpacing::Base04.rems(cx))
.px(DynamicSpacing::Base08.rems(cx))
.bg(cx.theme().colors().status_bar_background)
.map(|el| match cx.window_decorations() {
Decorations::Server => el,
@ -64,14 +64,14 @@ impl Render for StatusBar {
impl StatusBar {
fn render_left_tools(&self, cx: &mut ViewContext<Self>) -> impl IntoElement {
h_flex()
.gap(Spacing::Large.rems(cx))
.gap(DynamicSpacing::Base08.rems(cx))
.overflow_x_hidden()
.children(self.left_items.iter().map(|item| item.to_any()))
}
fn render_right_tools(&self, cx: &mut ViewContext<Self>) -> impl IntoElement {
h_flex()
.gap(Spacing::Large.rems(cx))
.gap(DynamicSpacing::Base08.rems(cx))
.children(self.right_items.iter().rev().map(|item| item.to_any()))
}
}

View file

@ -97,9 +97,9 @@ impl Render for Toolbar {
v_flex()
.group("toolbar")
.p(Spacing::Large.rems(cx))
.p(DynamicSpacing::Base08.rems(cx))
.when(has_left_items || has_right_items, |this| {
this.gap(Spacing::Large.rems(cx))
this.gap(DynamicSpacing::Base08.rems(cx))
})
.border_b_1()
.border_color(cx.theme().colors().border_variant)
@ -109,7 +109,7 @@ impl Render for Toolbar {
h_flex()
.min_h(rems_from_px(24.))
.justify_between()
.gap(Spacing::Large.rems(cx))
.gap(DynamicSpacing::Base08.rems(cx))
.when(has_left_items, |this| {
this.child(
h_flex()