tooltip

fun StyleParams.tooltip(vararg text: String): BasicParams.() -> Unit
fun StyleParams.tooltip(vararg text: String, tooltipPlacement: TooltipPlacements.() -> Style<BasicParams>): BasicParams.() -> Unit


fun Tag<HTMLElement>.tooltip(    styling: BasicParams.() -> Unit = {},     text: String? = null,     baseClass: StyleClass = StyleClass.None,     id: String = "fc2-tooltip-",     prefix: String = "tooltip",     build: TooltipComponent.() -> Unit): Div

This factory function creates a Tooltip.

A tooltip should be used to display fast information for the user. The individual text will be shown on hovering the RenderContext's element in which it is called.

Example usage:

 span {
+"hover me"
tooltip {
text("some tooltip text")
placement { bottomEnd }
}
}

There exist also one convenience functions, that allow a terser creation! This one offers the whole freedom to provide the common component's parameters though.

Especially dynamic text content (Flow<String>) is only possible to set up within the context itself.

See also


fun Tag<HTMLElement>.tooltip(vararg text: String, build: TooltipComponent.() -> Unit)

tooltip factory function that allow a terser creation for just static text as tooltip's content.

Example usage:

span {
+"hover me"
tooltip("my Tooltip") { }
}

One can configure the placement too:

span {
+"hover me"
tooltip("my Tooltip") { placement { bottom } }
}

One can pass multiple text values as parameters, which will result in multi line tooltip:

span {
+"hover me"
tooltip("first line", "second line") { }
}

See also

Parameters

text

the content of the tooltip; pass multiple text parameters to create multi line content

build

a lambda expression for setting up the component itself