Elements

To define elements and their contents, Asteracea provides a syntax similar to HTML:

#![allow(unused)]
fn main() {
asteracea::component! {
  Div()()

  <div>
}
}

<DIV></DIV>

<name opens an element and > is enough to close one. However, you can alternatively close elements with /name> too, which the compiler will validate:

#![allow(unused)]
fn main() {
asteracea::component! {
  Div()()

  <div
    // [complex nested template]
  /div>
}
}

<DIV></DIV>

Elements can contain any number of valid Asteracea component bodies, which are rendered as the element's children, as long as the specific element supports it:

#![allow(unused)]
fn main() {
asteracea::component! {
  Span()()

  <span
    "This is text within a <span>."
    <!-- "This is a comment within a <span>." -->
  >
}
}

<SPAN>This is text within a &lt;span>.<!--This is a comment within a <span>.--></SPAN>

This includes other elements:

#![allow(unused)]
fn main() {
asteracea::component! {
  DivSpan()()

  <div
    <span "This is text within a <span>.">
  >
}
}

<DIV><SPAN>This is text within a &lt;span>.</SPAN></DIV>

Elements are statically validated against lignin-schema.

Empty elements like <br> are written like any other element, but don't accept children and won't render a closing tag to HTML when using lignin-html:

#![allow(unused)]
fn main() {
asteracea::component! {
  Br()()

  <br>
}
}

<BR>

To use custom element names without validation, quote them like this:

#![allow(unused)]
fn main() {
asteracea::component! {
  Custom()()

  <"custom-element">
}
}

<custom-element></custom-element>