MatBlazor - Material Design components for Blazor and Razor Components

MatTooltip

The Material tooltip provides a text label that is displayed when the user hovers an element.

Name Type Description
Attributes Dictionary<String,Object>
ChildContent RenderFragment<ForwardRef> Child content of MatTooltip
Class String Specifies one or more classnames for an DOM element.
Id String
Position MatTooltipPosition
RefBack ForwardRef
Style String Specifies an inline style for an DOM element.
TargetForwardRef ForwardRef
TargetId String
Tooltip String
TooltipContent RenderFragment
Wrap Boolean
Ref ElementReference Returned ElementRef reference for DOM element.
ForwardRef Concept for MatBlazor components

ChildContent of MatTooltip is a template for tooltips target with RefBack marker as @context

All MatBlazor components supports ForwardRef concept. So you can apply parameter RefBack="@context"

.
My tooltip
My tooltip
My tooltip
My tooltip
ForwardRef Concept for Html elements

All Html DOM elements just should return ElementReference reference to @context.Current

.
SPAN
My tooltip
My tooltip
My tooltip

Complex

Any Html structures can have tooltips

My tooltip
TargetId Concept for Html elements

MatTooltip can use target by Id

.
Span with id=mySpanForDemoTooltip
My tooltip

Complex div

Paragraph with id=myComplexDivForDemoTooltip

My tooltip
Wrap Concept for any tooltip

MatTooltip can create own wrapper

.
Span with Wrapper
My tooltip
My tooltip
MatTooltipPosition
Right tooltip
Left tooltip
Top tooltip
Bottom tooltip
If you like MatBlazor, please put a star on GitHub.