Lumi.Components.Tooltip

type TooltipProps = Record (BaseTooltipProps (content :: JSX))

toTooltipProps :: JSX -> Record (BaseTooltipProps ()) -> TooltipProps

type BaseTooltipProps :: Row Type -> Row Typetype BaseTooltipProps r = (size :: Nullable Size, style :: CSS, text :: JSX, variant :: String | r)

component :: Component TooltipProps

tooltip :: TooltipProps -> JSX

Lumi's tooltip component.

Tooltip positioning can get wonky depending upon the content size and likely other factors. If the variant-driven defaults aren't sufficient, a variant's absolute positioning may be overridden via CSS variables.

The CSS variables available for overriding currently are:

--lumi-tooltip-text-top
  Default: "-5px"
  Supported variants: "left", "right"

You may override these variables using the style field of TooltipProps:

tooltip
  { variant: "left"
  , style:
      css
        { "--lumi-tooltip-text-top": "-18px"
        -- ...
        }
  -- ...
  }

styles :: JSS

data IconType

Constructors

• Warning
• Info

withTooltip :: JSX -> String -> JSX

withTooltip' :: JSX -> String -> CSS -> IconType -> JSX