SpinnerComponent

open class SpinnerComponent : Component<Unit> , EventProperties<HTMLDivElement>

This component class offers different configuration values of a spinner.

If you set an `icon`, the spinner will be icon based. The default behaviour is pure CSS based. You can pass the `size` of the border by passing a Thickness value. Have a look at the definitions of your Theme.borderWidths property. Also you can control the `speed` of the animation by passing a value with time unit suffix, either `s` or `ms` according to the standard

Have a look at the following example calls:

// minimal setup -> pure CSS
spinner {}

// pure CSS spinner
spinner {
size { fat } // really, really fat spinner!
}

// icon based
spinner {
icon { star }
}

// with styling and speed customized
spinner({
color { "purple" }
size { large }
}) {
icon { star }
speed { "300ms" }
}

Constructors

SpinnerComponent
Link copied to clipboard
js
fun SpinnerComponent()

Types

Companion
Link copied to clipboard
js
object Companion

Functions

render
Link copied to clipboard
js
open override fun render(context: RenderContext, styling: BoxParams.() -> Unit, baseClass: StyleClass, id: String?, prefix: String)
Central method that should do the actual rendering of a component.

Properties

events
Link copied to clipboard
js
open override val events: ComponentProperty<EventContext<HTMLDivElement>.() -> Unit>
This property enables the client to access all events offered by the underlying HTML element.
icon
Link copied to clipboard
js
val icon: ComponentProperty<Icons.() -> IconDefinition?>
speed
Link copied to clipboard
js
val speed: ComponentProperty<String>
thickness
Link copied to clipboard
js
val thickness: ComponentProperty<Thickness.() -> Property>