Tooltip API

API documentation for Tooltip component

TooltipTrigger#

Props#

Defines valid properties in TooltipTrigger component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	(CSSProperties \| ((instance?: ButtonInstance) => CSSProperties)) & (CSSProperties \| ((instance?: TooltipTriggerInstance) => CSSProperties))	null	The style to apply to the component.
className	(string \| ((instance?: ButtonInstance) => string)) & (string \| ((instance?: TooltipTriggerInstance) => string))	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	ButtonPassThrough & Record<PropertyKey, unknown> & TooltipTriggerPassThrough	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	(ReactNode \| ((instance: ButtonInstance) => ReactNode)) & (ReactNode \| ((instance: TooltipTriggerInstance) => ReactNode))	null	The children to render.
size	"small" \| "large" \| "normal"	null	Size of the Button.
severity	string & {} \| "secondary" \| "info" \| "success" \| "warn" \| "danger" \| "contrast" \| "help"	null	Severity type of the Button.
variant	"link" \| "text" \| "outlined"	null	Variant of the Button.
plain	boolean	null	Whether to show the Button with a plain style.
rounded	boolean	null	Whether to show the Button with a rounded style.
raised	boolean	null	Whether to show the Button with a raised style.
iconOnly	boolean	null	Whether to show the Button with a borderless style.
fluid	boolean	null	Whether to show the Button with a fluid width.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by TooltipTrigger component.

name	type	default	description
tooltip	TooltipInstance	null	The Tooltip component instance.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of TooltipTrigger component.

name	type	default	description
root	TooltipTriggerPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of TooltipTrigger component.

values
ComponentInstance<TooltipTriggerProps, TooltipTriggerState, TooltipTriggerExposes>

TooltipPortal#

Props#

Defines valid properties in TooltipPortal component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	(CSSProperties \| ((instance?: PortalInstance) => CSSProperties)) & (CSSProperties \| ((instance?: TooltipPortalInstance) => CSSProperties))	null	The style to apply to the component.
className	(string \| ((instance?: PortalInstance) => string)) & (string \| ((instance?: TooltipPortalInstance) => string))	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	PortalPassThrough & Record<PropertyKey, unknown> & TooltipPortalPassThrough	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	(ReactNode \| ((instance: PortalInstance) => ReactNode)) & (ReactNode \| ((instance: TooltipPortalInstance) => ReactNode))	null	The children to render.
element	ReactNode	null	The element to be rendered as the portal.
appendTo	HTMLElement \| "body" \| "self"	'body'	The DOM element where the portal should be appended to.
visible	boolean	null	Whether the portal is visible or not.
onMounted	() => void	null	Callback function to invoke when the portal is mounted.
onUnmounted	() => void	null	Callback function to invoke when the portal is unmounted.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by TooltipPortal component.

name	type	default	description
tooltip	TooltipInstance	null	The Tooltip component instance.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of TooltipPortal component.

name	type	default	description
root	TooltipPortalPassThroughType<HTMLAttributes<HTMLDivElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of TooltipPortal component.

values
ComponentInstance<TooltipPortalProps, TooltipPortalState, TooltipPortalExposes>

TooltipContent#

Props#

Defines valid properties in TooltipContent component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: TooltipContentInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: TooltipContentInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<TooltipContentPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: TooltipContentInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by TooltipContent component.

name	type	default	description
tooltip	TooltipInstance	null	The Tooltip component instance.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of TooltipContent component.

name	type	default	description
root	TooltipContentPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of TooltipContent component.

values
ComponentInstance<TooltipContentProps, TooltipContentState, TooltipContentExposes>

TooltipArrow#

Props#

Defines valid properties in TooltipArrow component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: TooltipArrowInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: TooltipArrowInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<TooltipArrowPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: TooltipArrowInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by TooltipArrow component.

name	type	default	description
tooltip	TooltipInstance	null	The Tooltip component instance.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of TooltipArrow component.

name	type	default	description
root	TooltipArrowPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of TooltipArrow component.

values
ComponentInstance<TooltipArrowProps, TooltipArrowState, TooltipArrowExposes>

On this page

TooltipTrigger
Props
Exposes
Interfaces
Types
TooltipPortal
Props
Exposes
Interfaces
Types
TooltipContent
Props
Exposes
Interfaces
Types
TooltipArrow
Props
Exposes
Interfaces
Types