guise-ui 1.5.3

A component library for gpui, Zed's GPU-accelerated UI framework: a themed palette, sizing tokens, 130+ composable components, a reactive state layer, and an in-app Safari-style inspector.
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130

//! `Stack` and `Positioned` — Flutter's overlap layout.

use crate::devtools::Probed;
use gpui::prelude::*;
use gpui::{div, px, AnyElement, App, IntoElement, Window};

/// Overlays children on top of one another. Flutter's `Stack`.
///
/// The first child sits in normal flow and defines the size; wrap later
/// children in [`Positioned`] to place them as overlays.
#[derive(IntoElement)]
pub struct Stack {
  children: Vec<AnyElement>,
}

impl Stack {
  pub fn new() -> Self {
    Stack {
      children: Vec::new(),
    }
  }
}

impl Default for Stack {
  fn default() -> Self {
    Stack::new()
  }
}

impl ParentElement for Stack {
  fn extend(&mut self, elements: impl IntoIterator<Item = AnyElement>) {
    self.children.extend(elements);
  }
}

impl RenderOnce for Stack {
  fn render(self, _window: &mut Window, _cx: &mut App) -> impl IntoElement {
    div().relative().children(self.children).probe("Stack")
  }
}

/// Positions a child within a [`Stack`] by edge offsets. Flutter's `Positioned`.
#[derive(IntoElement)]
pub struct Positioned {
  child: AnyElement,
  top: Option<f32>,
  right: Option<f32>,
  bottom: Option<f32>,
  left: Option<f32>,
  width: Option<f32>,
  height: Option<f32>,
}

impl Positioned {
  pub fn new(child: impl IntoElement) -> Self {
    Positioned {
      child: child.into_any_element(),
      top: None,
      right: None,
      bottom: None,
      left: None,
      width: None,
      height: None,
    }
  }

  /// Pins to all four edges (fills the stack).
  pub fn fill(child: impl IntoElement) -> Self {
    Positioned::new(child)
      .top(0.0)
      .right(0.0)
      .bottom(0.0)
      .left(0.0)
  }

  pub fn top(mut self, value: f32) -> Self {
    self.top = Some(value);
    self
  }

  pub fn right(mut self, value: f32) -> Self {
    self.right = Some(value);
    self
  }

  pub fn bottom(mut self, value: f32) -> Self {
    self.bottom = Some(value);
    self
  }

  pub fn left(mut self, value: f32) -> Self {
    self.left = Some(value);
    self
  }

  pub fn width(mut self, value: f32) -> Self {
    self.width = Some(value);
    self
  }

  pub fn height(mut self, value: f32) -> Self {
    self.height = Some(value);
    self
  }
}

impl RenderOnce for Positioned {
  fn render(self, _window: &mut Window, _cx: &mut App) -> impl IntoElement {
    let mut el = div().absolute();
    if let Some(v) = self.top {
      el = el.top(px(v));
    }
    if let Some(v) = self.right {
      el = el.right(px(v));
    }
    if let Some(v) = self.bottom {
      el = el.bottom(px(v));
    }
    if let Some(v) = self.left {
      el = el.left(px(v));
    }
    if let Some(v) = self.width {
      el = el.w(px(v));
    }
    if let Some(v) = self.height {
      el = el.h(px(v));
    }
    el.child(self.child).probe("Positioned")
  }
}