Live demo — this example is server-driven; run the showcase locally for the interactive version.
Button
Use Button 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.
Button — PatternFly v6
Renders as <button>, <a> (when href is set), or a custom element (component).
Parameters:
id (optional) — DOM id on the root; omit unless something else
references the button (e.g. a popover/menu trigger).
variant (optional) — primary (default) | secondary | tertiary | danger |
warning | link | plain | control | stateful.
Not applied when hamburger/favorite/settings is set
(those imply their own plain variant).
danger (optional) — boolean; pf-m-danger accent alongside the link or
secondary variant (PF isDanger).
size (optional) — sm | lg. Default size is unmodified.
circle (optional) — boolean; pf-m-circle (circular icon-only button).
block (optional) — boolean; pf-m-block
inline (optional) — boolean; pf-m-inline. Used with variant="link".
disabled (optional) — boolean; renders the HTML disabled attribute.
ariaDisabled (optional) — boolean; renders aria-disabled but keeps focusable.
clicked (optional) — boolean; pf-m-clicked (active styling).
hasNoPadding (optional) — boolean; pf-m-no-padding (only meaningful for plain)
isLoading (optional) — boolean; pf-m-progress + pf-m-in-progress + spinner
spinnerLabel (optional) — aria-label on the loading spinner
component (optional) — element override: "span" (or any other tag) makes
the button render as that tag. Default is "button"
(or "a" when href is set).
href (optional) — link target. When set, renders <a> by default.
type (optional) — submit | reset (default "button" for <button>)
ariaLabel (optional) — accessible label
ariaExpanded (optional) — true | false. For toggling buttons (hamburger etc.)
attrs (optional) — raw attribute passthrough rendered verbatim into
the opening tag (Alpine directives, data-*, etc.).
CAUTION: inherits through nested includes like any
Qute data — composers that nest this include inside
another attrs-bearing include should shadow it with
attrs='' (see feedback_qute_include_inheritance).
icon (optional) — icon name (set:slug) to render inside __icon span.
iconPosition (optional) — start (default) | end
count (optional) — integer. Renders __count badge to the end.
countRead (optional) — boolean; adds pf-m-read on the count badge.
stateful (optional) — boolean; pf-m-stateful
state (optional) — read | unread | attention (for stateful)
favorite (optional) — boolean; pf-m-favorite (implies pf-m-plain).
favorited (optional) — boolean; pf-m-favorited.
settings (optional) — boolean; pf-m-settings (implies pf-m-plain).
hamburger (optional) — boolean; pf-m-hamburger (implies pf-m-plain).
hamburgerVariant (optional) — expand | collapse. Adds pf-m-{value}.
hamburgerExpandExpr (optional) — Alpine state var (e.g. "sidebarOpen"): emits
the toggle binding trio (:class pf-m-expand,
:aria-expanded, @click). Composition sites use this
because attrs='...' literals cannot carry the
single-quoted class name.
Slot:
{#content} — button text (wrapped in pf-v6-c-button__text), or omit for
icon-only buttons.
Guard `component`: example-card and other wrappers pass component=<slug>
through Qute include-data inheritance, so we only treat it as a tag
override when it's an allow-listed value (`span` / `div` are the actual
supported overrides). See memory feedback_qute_include_inheritance.
Model mode: pass btn=<org.sitenetsoft.quarkus.pha.model.Button> (built via
Button.of/icon/favorite/settings/hamburger builders) — mirrors the full parameter
surface below. Composite templates that delegate their buttons here may pass
btnAttrs='...' (raw attribute passthrough, e.g. Alpine bindings) — named
distinctly from attrs so param-mode attrs never leaks in via include-data
inheritance.
button-body
{#include components/actions/button-body /}
Button body — internal helper for components/actions/button.
Renders the icon + text + count subelements in the right order.
Not intended for direct use; included by button.html.