Skip to main content
<juo-button variant="solid" size="md">Button</juo-button>
Button with variants, sizes, icons, and async handler support. When a handler is provided, the button renders an inline loading state while the promise settles, then a success or error glyph.

​
Usage

<juo-button variant="solid" size="md">Button</juo-button>

​
Reference

​
Parameters

​
disabled
attr · prop · boolean | Record<string, boolean>
default:"false"
Complex values (Record<string, boolean>) must be assigned via the disabled JS property instead.
​
handler
prop · (() => unknown)
​
type
attr · reset | submit | button | link
default:"button"
​
variant
attr · solid | link | outline | ghost
default:"solid"
​
size
attr · md | sm | lg | xl
default:"md"
​
icon
attr · prop · string | Component
Complex values (Component) must be assigned via the icon JS property instead.
​
icon-position
attr · start | end
default:"start"

​
Events

The element dispatches native CustomEvents; the payload is in event.detail.
​
click
CustomEvent
event.detail: [event: MouseEvent]

​
Slots

​
default
slot