PushButtonComponent

This class combines the configuration and the core rendering of a button.

The rendering functions are used by the component factory functions pushButton and clickButton, so they are not meant to be called directly unless you plan to implement your own button. If not, just use those functions for stetting up a button!

Much more important are the configuration functions. You can configure the following aspects:

• the type (`colorScheme`) - default is `primary`

• the label text

• the icon including its position (left or right)

• a state called `loading` for visualizing a longer background task

• an additional label during the loading state

• some predefined styling variants

• link events of the button like `clicks` with external handlers

This can be done within a functional expression that is the last parameter of the two button functions, called `build`. It offers an initialized instance of this PushButtonComponent class as receiver, so every mutating method can be called for configuring the desired state for rendering the button.

The following example shows the usage:

pushButton {
    icon { fromTheme { check } } // set up an icon
    iconPlacement { right } // place the icon on the right side (``left`` is the default)
    loading(someStore.loading) // pass in some [Flow<Boolean>] that shows a spinner if ``true`` is passed
    loadingText("saving") // show an _alternate_ label, if store sends ``true``
    text("save") // define the default label
    disabled(true) // disable the button; could also be a ``Flow<Boolean>`` for dynamic disabling
    events { // open inner context with all DOM-element events
        clicks handledBy someStore.update // react to click event
    }
    element {
        // exposes the underlying HTML button element for direct access. Use with caution!
    }
}