Create a new Button component.

AvardaUi.Button.new
    { label = "Click me" }

Render the Button as HTML.

Always call this after you've built up the button with new and chained settings.

AvardaUi.Button.new {...}
    |> AvardaUi.Button.withIsRequired True
    |> AvardaUi.Select.view

Style variants of the button. This is used with withVariant

Change button variant (Variant). Primary is set by default.

Add a left-side child element, preferably an icon.

Add a right-side child element, preferably an icon.

Disable the button. Visually dims and prevents user actions.

Change button sizing to large (default).

Change button sizing to medium.

Change button sizing to small.

Overwrite or add additional base styles.

Overwrite or add additional hover styles.

Add additional attributes.

Transfer the <button> into <a> tag that looks like a button. You have to specify a link that will be passed into href attribute and additional attributes list, e.g. target or rel.

AvardaUi.Button.new { label = "Link" }
    |> AvardaUi.Button.withMsgTypeLink
        { link = "https://google.com"
        , attributes =
            [ Attributes.target "_blank"
            , Attributes.rel "noopener noreferrer"
            ]
        }
    |> AvardaUi.Button.view

<button> with onClick handler.

<button> with type = "submit". This the default button type.