Skip to main content
Version: 1.0.4

InfoTooltip

@spartanfx/react v1.0.4


@spartanfx/react / InfoTooltip

Variable: InfoTooltip

const InfoTooltip: React.FC<IInfoTooltipProps>

Displays an information icon that reveals a Fluent UI tooltip on hover or focus.

Remarks

  • The component renders nothing if content is not provided.
  • Tooltip rendering and positioning are delegated to Fluent UI’s TooltipHost.
  • Default callout and style values are applied to ensure a consistent, modern appearance, but can be overridden via props.
  • The icon appearance adapts based on the selected variant.

This component is intended for inline contextual help, such as explaining form fields, buttons, or UI affordances without cluttering the layout.

Examples

<InfoTooltip content="This field is required." />
<InfoTooltip
content="Changing this value will affect all dependent items."
variant="warning"
iconProps={{ iconName: "Warning" }}
calloutProps={{ directionalHint: DirectionalHint.rightCenter }}
/>