TooltipPositioningOptions

remarks: @since 2.8.0

Hierarchy

TooltipPositioningOptions
- BaseTooltipHookOptions

Index

Properties

Optional dense

dense?: boolean

Boolean if the tooltip is using the dense spec. This will reduce the padding, margin and font size for the tooltip and is usually used for desktop displays.

Optional denseSpacing

denseSpacing?: string | number

The amount of spacing to use for a dense tooltip. This is the distance between the container element and the tooltip.

Optional disableAutoSpacing

disableAutoSpacing?: boolean

Since react-md provides mixins to automatically apply a dense spec through mixins via media queries, the dense spec might be applied in css instead of in JS. This component will actually check the current spacing amount that has been applied when the tooltip becomes visible.

If this behavior is not desired, you can enable this prop and it will only use the provided spacing or denseSpacing props based on the dense prop.

Note: This will be defaulted to true when the process.env.NODE_ENV === 'test' since test environments normally don't have a default window.getComputedStyle value that is not NaN which will display errors in your tests.

Optional disableSwapping

disableSwapping?: boolean

Boolean if the auto-swapping behavior should be disabled. When this value is undefined, it'll be treated as true when the position prop is defined, otherwise false.

Optional spacing

spacing?: string | number

The amount of spacing to use for a non-dense tooltip. This is the distance between the container element and the tooltip.

Optional style

style?: CSSProperties

An optional style object to merge and override the generated fixed positioning styles.

Optional vhMargin

vhMargin?: number

This is the viewport height margin to use in the positioning calculation. This is just used so that the tooltip can be placed with some spacing between the top and bottom edges of the viewport if desired.

Optional vwMargin

vwMargin?: number

This is the viewport width margin to use in the positioning calculation. This is just used so that the tooltip can be placed with some spacing between the left and right edges of the viewport if desired.