Crate guise 

guise

A Mantine-inspired component library for gpui.

guise provides a themed palette, sizing tokens, and a growing set of ready-to-use components built on gpui’s RenderOnce builder pattern.

use guise::prelude::*;

Stack::new().gap(Size::Md).child(
    Button::new("save", "Save").variant(Variant::Filled),
)

Install a Theme once at startup, then read it from any component:

guise::theme::Theme::dark().init(cx);

Re-exports

pub use data::Accordion;

pub use data::Avatar;

pub use data::AvatarGroup;

pub use data::List;

pub use data::Table;

pub use data::Tabs;

pub use data::Timeline;

pub use feedback::Alert;

pub use feedback::Loader;

pub use feedback::LoaderVariant;

pub use feedback::Notification;

pub use feedback::Progress;

pub use feedback::RingProgress;

pub use feedback::ToastStack;

pub use input::apply_key;

pub use input::Checkbox;

pub use input::CheckboxGroup;

pub use input::Combobox;

pub use input::ComboboxEvent;

pub use input::Field;

pub use input::KeyOutcome;

pub use input::NumberInput;

pub use input::NumberInputEvent;

pub use input::Radio;

pub use input::RadioGroup;

pub use input::SegmentedControl;

pub use input::SegmentedControlEvent;

pub use input::Select;

pub use input::SelectEvent;

pub use input::Slider;

pub use input::SliderEvent;

pub use input::Switch;

pub use input::TextArea;

pub use input::TextAreaEvent;

pub use input::TextEdit;

pub use input::TextInput;

pub use input::TextInputEvent;

pub use layout::Align;

pub use layout::Center;

pub use layout::Group;

pub use layout::Justify;

pub use layout::SimpleGrid;

pub use layout::Stack;

pub use nav::Breadcrumbs;

pub use nav::NavLink;

pub use nav::Pagination;

pub use nav::PaginationEvent;

pub use nav::StatusBar;

pub use nav::Stepper;

pub use overlay::tooltip;

pub use overlay::Drawer;

pub use overlay::Menu;

pub use overlay::MenuBar;

pub use overlay::MenuColumn;

pub use overlay::Modal;

pub use overlay::Placement;

pub use overlay::Popover;

pub use overlay::Side;

pub use overlay::Spotlight;

pub use overlay::Tooltip;

pub use reactive::provide;

pub use reactive::use_context;

pub use reactive::use_form;

pub use reactive::use_state;

pub use reactive::watch;

pub use reactive::FormState;

pub use reactive::Signal;

pub use style::surface;

pub use style::ColorValue;

pub use style::StyleExt;

pub use style::Surface;

pub use style::Variant;

pub use theme::css;

pub use theme::hsl;

pub use theme::hsla;

pub use theme::rgb;

pub use theme::rgba;

pub use theme::theme;

pub use theme::Color;

pub use theme::ColorName;

pub use theme::ColorScheme;

pub use theme::CssColorError;

pub use theme::Palette;

pub use theme::Scale;

pub use theme::Shades;

pub use theme::Size;

pub use theme::Theme;

Modules

data

Data display: components that present structured content.

feedback

Feedback: components that communicate state to the user.

flex

Flexbox layout primitives, for people who think in Row/Column/ Container/Expanded (à la Flutter).

input

Form inputs.

layout

Layout primitives: vertical Stack, horizontal Group, and Center. These map Mantine’s flex helpers onto gpui’s flex container.

nav

Navigation: components for moving around an app, plus a StatusBar shell.

overlay

Overlays: floating UI that paints above the page.

prelude

Common imports for building with guise.

reactive

A lightweight, React-flavored state layer over gpui.

style

Shared visual variants. Mantine resolves a (color, variant) pair into a background / foreground / border triple that every interactive component (Button, Badge, ActionIcon, …) draws from. This is that resolver.

theme

The theme: palette + sizing tokens + color scheme, exposed as a gpui Global so any component can resolve themed values during render.

Macros

badge

A Badge: badge!(label). Chain setters after.

button

A Button: button!(id, label). Chain setters after.

card

A Card around the given children.

center

A Center wrapping the given children.

code

Inline Code, with optional format! arguments.

col

A Flutter-style vertical Column.

color

A CSS-style color literal, producing a gpui Hsla.

hstack

A themed horizontal Group (token-based spacing).

kbd

A Kbd key, with optional format! arguments.

modal

A Modal around the given children. Chain .title(..) and .on_close(..) after.

paper

A Paper surface around the given children.

row

A Flutter-style horizontal Row.

style

A CSS-like style block. Expands to an element transform applied with StyleExt::apply:

text

Text, with optional format! arguments.

title

Title, with optional format! arguments.

vstack

A themed vertical Stack (token-based spacing).

wrap

A wrapping row, Wrap.

zstack

A layered Stack (z-axis overlap).

Structs

ActionIcon

A compact, square icon button. The Mantine ActionIcon.

Anchor

A text link. The Mantine Anchor.

Badge

A compact status pill. The Mantine Badge.

Button

A clickable button. The Mantine Button.

Card

A content card. The Mantine Card — a Paper with sensible defaults.

Chip

A selectable chip. The Mantine Chip. Controlled: pass checked and a change handler via cx.listener.

CloseButton

A dismiss button. The Mantine CloseButton.

Code

Inline code. The Mantine Code. (Uses the window font; gpui has no generic monospace fallback, so style a real mono family at the app level if needed.)

Collapse

Reveals its child with a fade when open, renders nothing when closed.

CopyButton

A small button that writes text to the system clipboard when clicked, then shows a “Copied” state for a moment. A gpui entity — create with cx.new(|_| CopyButton::new("…")).

Divider

A separator line. The Mantine Divider.

Icon

A themed icon glyph. Inherits the parent’s text color unless color is set.

Indicator

A corner indicator over any child. The Mantine Indicator.

Kbd

A keyboard key. The Mantine Kbd.

Paper

A surface container. The Mantine Paper.

ScrollArea

A scrollable region. ScrollArea::new("id").max_height(240.0).

Skeleton

A pulsing placeholder block. The Mantine Skeleton.

Text

Themed body text. The Mantine Text.

ThemeIcon

A decorative colored icon chip. The Mantine ThemeIcon.

Title

A heading. The Mantine Title; order 1..=6 selects the heading level.

Transition

Plays a one-shot entrance animation around its child.

WebView

A native web view. Create with cx.new(|cx| WebView::new(cx)).

Enums

IconName

A named icon. The glyph is resolved by IconName::glyph.

Orientation

TransitionKind

The kind of entrance motion Transition plays.

WebViewEvent

Emitted as the embedded page loads and changes.