View Source LiveViewUI.UI.Button (LiveViewUI v0.0.7)

A simple button component for interactive actions.

Example Usage

Here is a basic example of setting up a button component:

<Button.root>
  Default Button
</Button.root>

You can customize the button with different variants, sizes, and HTML elements:

<Button.root variant="destructive" size="lg" as="a" class="extra-class">
  Destructive Button
</Button.root>

:variant - The style variant of the button. Available options:
- :default (default)
- :destructive
- :outline
- :outline-secondary
- :secondary
- :ghost
- :link
:size - The size of the button. Available options:
- :default (default)
- :sm
- :lg
- :icon
:type - The button type attribute (e.g., "button", "submit").
:class - Additional CSS classes to apply to the button.
:as - The HTML element to use for the button. Default is "button" or can be "a".
:rest - Any additional attributes to apply to the button's root element, including disabled, form, name, and value.

root(assigns)

variant (:string) - Defaults to "default".
size (:string) - Defaults to "default".
type (:string) - Defaults to nil.
class (:any) - Defaults to nil.
as (:string) - Defaults to "button".
Global attributes are accepted. Supports all globals plus: ["disabled", "form", "name", "value"].

variant (:string) - Defaults to "default".
size (:string) - Defaults to "default".
type (:string) - Defaults to nil.
class (:any) - Defaults to nil.
as (:string) - Defaults to "button".
Global attributes are accepted. Supports all globals plus: ["disabled", "form", "name", "value"].