guise-ui 0.2.3

A Mantine-inspired component library for gpui, Zed's GPU-accelerated UI framework.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59

//! `Space` — a fixed spacing block on one axis, sized by the theme's
//! spacing scale.
//!
//! ```ignore
//! use guise::prelude::*;
//!
//! Stack::new()
//!     .child(Title::new("Heading").order(3))
//!     .child(Space::y(Size::Md))
//!     .child(Text::new("Body copy."))
//! ```

use gpui::prelude::*;
use gpui::{div, px, App, IntoElement, Window};

use crate::theme::{theme, Size};

/// The axis a [`Space`] occupies.
#[derive(Debug, Clone, Copy, PartialEq, Eq)]
enum SpaceAxis {
    Horizontal,
    Vertical,
}

/// A fixed gap between siblings. The Mantine `Space`.
#[derive(IntoElement)]
pub struct Space {
    axis: SpaceAxis,
    size: Size,
}

impl Space {
    /// Horizontal space: a block `size` wide (for rows).
    pub fn x(size: Size) -> Self {
        Space {
            axis: SpaceAxis::Horizontal,
            size,
        }
    }

    /// Vertical space: a block `size` tall (for columns).
    pub fn y(size: Size) -> Self {
        Space {
            axis: SpaceAxis::Vertical,
            size,
        }
    }
}

impl RenderOnce for Space {
    fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement {
        let gap = theme(cx).spacing(self.size);
        let el = div().flex_none();
        match self.axis {
            SpaceAxis::Horizontal => el.w(px(gap)),
            SpaceAxis::Vertical => el.h(px(gap)),
        }
    }
}