Skip to main content

component

Macro component 

Source
component!() { /* proc-macro */ }
Expand description

Wraps a single top-level Maud element and injects the local js! and css! helpers inside that root element.

component! performs compile-time shape checks over the token stream it observes. It accepts one top-level element with a body block plus an optional @js-once or @js-always directive.

use maud_extensions::{component, css, js};

fn view() -> maud::Markup {
    js! {
        me().class_add("ready");
    }
    let markup = component! {
        @js-once
        article class="card" {
            p { "Hello" }
        }
    };
    css! {
        me { border: 1px solid #ddd; }
    }
    markup
}