Html elements

At some point you only want to put some plain html content in your browser.

When using Mateu there are 2 ways to put custom html content in your browser: by annotating a field with @RawContent or by creating a class annotated with @Element.

A sample usage for the @RawContent annotation:

  @RawContent
  String someContent = """
            <h1>Hello!</h1>
            <p>This is some content for the home page.</p>
            """;

And this is an example using a class annotated with @Element:

  @Caption("Html element")
  public class ElementForm {

    ElementFormDiv div = new ElementFormDiv();

    @Action(visible = false)
    void xx() {
      div.content = "Filled from xx";
    }

  }

  @Element("div")
  public class ElementFormDiv {

    @Attribute
    String style = "width: 200px; height: 100px; background-color: #f5f5f5; cursor: pointer;";

    @Content
    String content = "Hola!";

    @On(value = "click")
    public void clicked(ClientSideEvent event) throws JsonProcessingException {
        content = "Clicked at " + LocalTime.now() + " " + 
                  new ObjectMapper().writeValueAsString(event);
    }

  }

As you can see you can use the @Attribute and @Content annotation to map some content to attributes and the html element content.

You can also use the @On annotation to listen to events in the client side.