Live demo — this example is server-driven; run the showcase locally for the interactive version.
Label
Use Label straight from a Qute template — parameters and slots instead of Java builders. This reference is generated
from the runtime template sources: each template documents its parameters and slots in the header comment shown
beneath its include line.
Label — PatternFly v6
Renders as <span> by default, or <a> when href is set.
Two modes.
Model-driven: pass label=<org.sitenetsoft.quarkus.pha.model.Label> (built via
Label.of(text)) — renders the whole label incl. status icons, remove button
and the phaLabelEditable wiring for editable labels.
Slot shell: omit label and use the parameters + content slot below.
Parameters:
id (optional) — DOM id on the root; omit unless something else
references the label.
Content slot: label text (required, passed as include body).
color (optional) — blue | teal | green | orange | purple | red |
orangered | yellow. Omit for the default grey.
variant (optional) — filled (default) | outline | overflow | add
compact (optional) — boolean; pf-m-compact
disabled (optional) — boolean; pf-m-disabled
clickable (optional) — boolean; pf-m-clickable (cursor + hover treatment)
editable (optional) — boolean; pf-m-editable. Pair with the Alpine.js
phaLabelEditable component for inline editing.
removable (optional) — boolean; renders a close button in __actions.
removeClick (optional) — Alpine @click expression for the close button, e.g.
"$el.closest('li').remove()" inside a label group.
removeAria (optional) — aria-label for the close button (default "Remove").
href (optional) — when set, renders <a> instead of <span>.
iconName (optional) — icon name; renders __icon span before the text.
Overrides the status auto-icon.
status (optional) — info | success | warning | danger | custom.
Auto-picks color + default icon (overridable).
Status → defaults:
info → pf-m-info + fa:circle-info
success → pf-m-success + fa:circle-check
warning → pf-m-warning + fa:triangle-exclamation
danger → pf-m-danger + fa:circle-exclamation
custom → pf-m-custom + fa:bell
label-group
{#include components/data-display/label-group /}
Label group — PatternFly v6
Parameters:
id (optional) — DOM id on the group container; omit unless
something else references the group.
categoryName (optional) — category label rendered before the chips.
Implies pf-m-category.
vertical (optional) — boolean; pf-m-vertical (stacks labels).
startExpanded (optional) — boolean; render the overflow group expanded.
numLabels (optional) — integer (default 3). Overflow threshold; consumed
by the Alpine component. Passed through as
data-num-labels.
closable (optional) — boolean; renders a close button on the group.
closeBtnAria (optional) — aria-label for the group's close button.
ariaLabel (optional) — aria-label on the group when categoryName isn't
set. Defaults to "Label group category".
collapsedText (optional) — text template for the collapsed overflow toggle;
REMAINING_PLACEHOLDER is replaced by the hidden
count. Defaults to "REMAINING_PLACEHOLDER more".
expandedText (optional) — text on the "Show Less" toggle.
Defaults to "Show Less".
Slot:
{#content} — label includes. Each label is wrapped in an <li> by the group.
Model mode: pass group=<org.sitenetsoft.quarkus.pha.model.LabelGroup> (built via
LabelGroup.builder()) — the group wraps each Label model in its <li> chrome.