Demos /

Data & insights

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

DataModule

A module wraps a typed table.

Stages

Stage
Compose
Render
Java composition
DataModule.create(String.class).withTitle("Stages").withDataTable(DataTable.create(String.class).addColumn("Stage", value -> value).withData(List.of("Compose", "Render")));

StatsModule

Illustrative values, not measured site statistics.

Example review queue

12
Drafts
4
Reviewed
Java composition
StatsModule.create().withTitle("Example review queue").withColumns(2).addStat("12", "Drafts").addStat("4", "Reviewed");

ComparisonModule

Compare two approaches without inventing product tiers.

Rendering choices

StaticContext
ValuesFixedPer request
Java composition
ComparisonModule.create().withTitle("Rendering choices").addColumn("Static").addColumn("Context", true).addRow("Values", "Fixed", "Per request");

DynamicTableModule

Submit a value to replace actual table data.

Dynamic table

Value
Compose, Render
Java composition
String value = "Compose, Render";
Component module = DynamicTableModule.create().withTitle("Dynamic table").withTableData(new String[]{"Value"}, Collections.singletonList(new String[]{value}));
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-table"))
    .addField("Value", TextInput.create("value").withValue(value).required())
    .withChild(Button.submit("Update dynamic-table")))
    .withChild(new Div().withId("dynamic-result").withAttribute("aria-live", "polite").withChild(module));
// POST /demos/api/dynamic selects the same module with the submitted value.