Version:

Install ​

Maven ​

xml
<dependency>
    <groupId>de.mate_ds</groupId>
    <artifactId>mate-facet-flow</artifactId>
</dependency>

Import ​

java
import de.mate_ds.flow.component.facet.Facet;
import de.mate_ds.flow.component.facet.FacetList;
import de.mate_ds.flow.component.facet.FacetListVariant;

Variants ​

Stacked (Default) ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.KEY_SEPARATOR);
list.add(
    new Facet("Name", "Max Mustermann"),
    new Facet("Straße", "Hauptstraße 412"),
    new Facet("Postleitzahl", "23456"),
    new Facet("Ort", "Bautzen")
);

Inline ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.INLINE);
list.add(
    new Facet("Name", "Max Mustermann"),
    new Facet("Telefon", "+49 123 456789")
);
java
FacetList list = new FacetList();
Facet emailFacet = new Facet("E-Mail");
emailFacet.add(new Anchor("mailto:max@beispiel.de", "max@beispiel.de"));
list.add(emailFacet);

Right Aligned ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.INLINE, FacetListVariant.RIGHT_ALIGNED);
list.add(
    new Facet("Ermächtigung", "321,12 €"),
    new Facet("Inanspruchnahme", "12.323,00 €"),
    new Facet("Gesamt-Betrag", "12.345,12 €")
);

Small ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.SMALL);
list.add(
    new Facet("Name", "Max Mustermann"),
    new Facet("Ort", "Bautzen")
);

Medium ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.MEDIUM);
list.add(
    new Facet("Name", "Max Mustermann"),
    new Facet("Ort", "Bautzen")
);

Large ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.LARGE);
list.add(
    new Facet("Name", "Max Mustermann"),
    new Facet("Ort", "Bautzen")
);

With Icon Value Prefix ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.INLINE);

Facet facet = new Facet("Genehmigung");
Icon icon = new Icon(MaterialSymbol.SymbolCheck, "Gültig");
icon.addThemeVariants(IconVariant.SUCCESS);
facet.add(icon, new Span("Liegt vor"));

list.add(facet);

Key Separator ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.INLINE, FacetListVariant.KEY_SEPARATOR);
list.add(
    new Facet("Name", "Max Mustermann"),
    new Facet("Ort", "Bautzen")
);

Empty Value Indicator ​

java
FacetList list = new FacetList();
list.addThemeVariants(FacetListVariant.INLINE, FacetListVariant.EMPTY_VALUE_INDICATOR);
list.add(
    new Facet("Manufacturer", ""),
    new Facet("Factory", "Florida, FL")
);