Demos /

Reading & content

Working framework components, paired with the Java that composes them.

ContentModule

Markdown-backed prose with an explicit title.

A readable interface

Compose Java components into HTML.

Java composition
ContentModule.create().withTitle("A readable interface").withContent("Compose **Java components** into HTML.");

RichContentModule

Mixed typed components in one module.

A composed article

Composition

Small pieces, one document.

Java composition
RichContentModule.create("A composed article").addHeader(Header.H3("Composition")).addParagraph(new Paragraph("Small pieces, one document."));

QuoteModule

A quotation and attribution.

Design note

"Make the data flow explicit."

Example author
Java composition
QuoteModule.create().withTitle("Design note").withQuote("Make the data flow explicit.").withAuthor("Example author").centered();

SimpleListModule

List items retain raw identities; positional editable descriptors are separate.

Reading list

  • Components
  • Templates
Java composition
SimpleListModule.create().withTitle("Reading list").addItem(ListItem.create("Components")).addItem(ListItem.create("Templates"));

TimelineModule

An illustrative content workflow, not a project roadmap.

Example workflow

1

Draft

Write content.
2

Review

Check the result.
Java composition
TimelineModule.create().withTitle("Example workflow").addEvent("1", "Draft", "Write content.").addEvent("2", "Review", "Check the result.");

DynamicListModule

Submit comma-separated values to render a different list.

Dynamic list

  • Compose
  • Render
Java composition
String value = "Compose, Render";
Component module = DynamicListModule.create().withTitle("Dynamic list").withListItems(List.of(value.split(",")));
new Div().withChild(Form.create().withAction("/demos/api/dynamic").withMethod(Form.Method.POST)
    .withHxPost("/demos/api/dynamic").withHxTarget("#dynamic-result").withHxSwap("outerHTML")
    .withChild(new HtmlTag("input", true).withAttribute("type", "hidden")
        .withAttribute("name", "kind").withAttribute("value", "dynamic-list"))
    .addField("Value", TextInput.create("value").withValue(value).required())
    .withChild(Button.submit("Update dynamic-list")))
    .withChild(new Div().withId("dynamic-result").withAttribute("aria-live", "polite").withChild(module));
// POST /demos/api/dynamic selects the same module with the submitted value.