Dwind Component Catalog

Complete reference for all available components in dwui.

DWUI Components

Source: /home/mmy/repos/oss/dominator-css-bindgen/crates/dwui/src/components/

Button (button!)

Variants: ButtonType::Flat, ButtonType::Border

#![allow(unused)]
fn main() {
button!({
    .content(text("Click me"))
    .on_click(|_| { /* handle */ })
    .disabled_signal(is_disabled.signal())
})
}

Modal (modal!)

Variants: ModalSize::Small, Medium, Large, Full

#![allow(unused)]
fn main() {
modal!({
    .content(text("Modal body"))
    .open_signal(is_open.signal())
    .on_close(|| { is_open.set(false); })
})
}

TextInput (text_input!)

#![allow(unused)]
fn main() {
text_input!({
    .value(Box::new(text_mutable.clone()))
    .label_signal(always("Username"))
    .input_type(TextInputType::Text)
})
}

Select (select!)

#![allow(unused)]
fn main() {
select!({
    .value(Box::new(selected.clone()))
    .options_signal_vec(options_signal)
    .label_signal(always("Choose"))
})
}

Slider (slider!)

#![allow(unused)]
fn main() {
slider!({
    .value(Box::new(val.clone()))
    .min_signal(always(0.0))
    .max_signal(always(100.0))
})
}

Card (card!)

Variants: ColorScheme::Primary, Secondary, Void

#![allow(unused)]
fn main() {
card!({
    .content_signal(always(text("Card body")))
    .scheme_signal(always(ColorScheme::Primary))
})
}

Heading (heading!)

#![allow(unused)]
fn main() {
heading!({
    .content_signal(always(text("Title")))
    .text_size_signal(always(TextSize::Large))
})
}

List (pretty_list!)

#![allow(unused)]
fn main() {
pretty_list!({
    .items_signal_vec(items_signal)
    .selected_index_signal(selected.signal())
    .item_click_handler(|index| { /* handle */ })
})
}

Common Patterns

Signal Props

All #[signal] props accept both static and reactive values:

• Static: .prop(value)
• Reactive: .prop_signal(signal)

Validation

#![allow(unused)]
fn main() {
pub enum ValidationResult {
    Valid,
    Invalid { message: String },
}
}

Custom Styling via apply

#![allow(unused)]
fn main() {
button!({
    .content(text("Custom"))
    .apply(|b| b.dwclass!("border border-blue-500"))
})
}