Optional
aboutOptional
acceptOptional
acceptOptional
accessOptional
actionOptional
allowOptional
allowOptional
altOptional
animationOptional
appendThe element to append the tooltip to, defaults to body
Optional
ariaaria-labelledby or aria-describedby for tooltip. The trigger will be cloned to add the aria attribute, and the corresponding id in the form of 'pf-tooltip-#' is added to the content container. If you don't want that or prefer to add the aria attribute yourself on the trigger, set aria to 'none'.
Optional
aria-Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.
Optional
aria-Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.
Optional
aria-Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.
Optional
aria-Defines a string value that labels the current element, which is intended to be converted into Braille.
Optional
aria-Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.
Optional
aria-Optional
aria-Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.
Optional
aria-Defines the total number of columns in a table, grid, or treegrid.
Optional
aria-Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.
Optional
aria-Defines a human readable text alternative of aria-colindex.
Optional
aria-Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.
Optional
aria-Identifies the element (or elements) whose contents or presence are controlled by the current element.
Optional
aria-Indicates the element that represents the current item within a container or set of related elements.
Optional
aria-Identifies the element (or elements) that describes the object.
Optional
aria-Defines a string value that describes or annotates the current element.
Optional
aria-Identifies the element that provides a detailed, extended description for the object.
Optional
aria-Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.
Optional
aria-Indicates what functions can be performed when a dragged object is released on the drop target.
Optional
aria-Identifies the element that provides an error message for the object.
Optional
aria-Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.
Optional
aria-Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.
Optional
aria-Indicates an element's "grabbed" state in a drag-and-drop operation.
Optional
aria-Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.
Optional
aria-Indicates whether the element is exposed to an accessibility API.
Optional
aria-Indicates the entered value does not conform to the format expected by the application.
Optional
aria-Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.
Optional
aria-Defines a string value that labels the current element.
Optional
aria-Identifies the element (or elements) that labels the current element.
Optional
aria-Defines the hierarchical level of an element within a structure.
Optional
aria-Determines whether the tooltip is an aria-live region. If the triggerRef prop is passed in the default behavior is 'polite' in order to ensure the tooltip contents is announced to assistive technologies. Otherwise the default behavior is 'off'.
Optional
aria-Indicates whether an element is modal when displayed.
Optional
aria-Indicates whether a text box accepts multiple lines of input or only a single line.
Optional
aria-Indicates that the user may select more than one item from the current selectable descendants.
Optional
aria-Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.
Optional
aria-Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.
Optional
aria-Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.
Optional
aria-Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.
Optional
aria-Indicates the current "pressed" state of toggle buttons.
Optional
aria-Indicates that the element is not editable, but is otherwise operable.
Optional
aria-Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.
Optional
aria-Indicates that user input is required on the element before a form may be submitted.
Optional
aria-Defines a human-readable, author-localized description for the role of an element.
Optional
aria-Defines the total number of rows in a table, grid, or treegrid.
Optional
aria-Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.
Optional
aria-Defines a human readable text alternative of aria-rowindex.
Optional
aria-Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.
Optional
aria-Indicates the current "selected" state of various widgets.
Optional
aria-Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.
Optional
aria-Indicates if items in a table or grid are sorted in ascending or descending order.
Optional
aria-Defines the maximum allowed value for a range widget.
Optional
aria-Defines the minimum allowed value for a range widget.
Optional
aria-Defines the current value for a range widget.
Optional
aria-Defines the human readable text alternative of aria-valuenow for a range widget.
Optional
asOptional
asyncOptional
autoOptional
autoOptional
autoOptional
autoOptional
autoOptional
autoOptional
captureOptional
cellOptional
cellOptional
challengeOptional
charOptional
checkedOptional
childrenThe trigger reference element to which the Tooltip is relatively placed to.
If you cannot wrap the element with the Tooltip, you can use the triggerRef prop instead.
Usage:
Optional
citeOptional
classIDOptional
classTooltip additional class
Optional
colorOptional
colsOptional
colTooltip content
Optional
contentOptional
contextOptional
controlsOptional
coordsOptional
crossOptional
dangerouslyOptional
dataOptional
datatypeOptional
dateOptional
defaultOptional
defaultOptional
defaultOptional
deferOptional
dirOptional
disabledOptional
distanceDistance of the tooltip to its target, defaults to 15
Optional
downloadOptional
draggableOptional
enableIf true, tries to keep the tooltip in view by flipping it if necessary
Optional
encOptional
enterOptional
entryDelay in ms before the tooltip appears
Optional
exitDelay in ms before the tooltip disappears, Avoid passing in a value of "0", as users should be given ample time to move their mouse from the trigger to the tooltip content without the content being hidden.
Optional
flipThe desired position to flip the tooltip to if the initial position is not possible. By setting this prop to 'flip' it attempts to flip the tooltip to the opposite side if there is no space. You can also pass an array of positions that determines the flip order. It should contain the initial position followed by alternative positions if that position is unavailable. Example: Initial position is 'top'. Button with tooltip is in the top right corner. 'flipBehavior' is set to ['top', 'right', 'left']. Since there is no space to the top, it checks if right is available. There's also no space to the right, so it finally shows the tooltip on the left.
Optional
formOptional
formOptional
formOptional
formOptional
formOptional
formOptional
frameOptional
headersOptional
heightOptional
hiddenOptional
highOptional
hrefOptional
hrefOptional
htmlOptional
httpOptional
idid of the tooltip
Optional
inlistOptional
inputHints at the type of data that might be entered by the user while editing the element or its contents
Optional
integrityOptional
isSpecify that a standard HTML element should behave like a defined custom built-in element
Optional
isFlag to indicate that the text content is left aligned
Optional
isvalue for visibility when trigger is 'manual'
Optional
itemIDOptional
itemOptional
itemOptional
itemOptional
itemOptional
keyOptional
keyOptional
keyOptional
kindOptional
labelOptional
langOptional
listOptional
loopOptional
lowOptional
manifestOptional
marginOptional
marginOptional
maxOptional
maxOptional
maxMaximum width of the tooltip (default 18.75rem)
Optional
mediaOptional
mediaOptional
methodOptional
minOptional
minOptional
minMinimum width of the tooltip. If set to "trigger", the minimum width will be set to the reference element width.
Optional
multipleOptional
mutedOptional
nameOptional
nonceOptional
noOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onCallback when tooltip's hide transition has finished executing
Optional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
onOptional
openOptional
optimumOptional
patternOptional
placeholderOptional
playsOptional
positionTooltip position. Note: With 'enableFlip' set to true, it will change the position if there is not enough space for the starting position. The behavior of where it flips to can be controlled through the flipBehavior prop. The 'auto' position chooses the side with the most space. The 'auto' position requires the 'enableFlip' prop to be true.
Optional
posterOptional
prefixOptional
preloadOptional
propertyOptional
radioOptional
readOptional
refAllows getting a ref to the component instance.
Once the component unmounts, React will set ref.current
to null
(or call the ref with null
if you passed a callback ref).
Optional
relOptional
requiredOptional
resourceOptional
resultsOptional
revOptional
reversedOptional
roleOptional
rowsOptional
rowOptional
sandboxOptional
scopeOptional
scopedOptional
scrollingOptional
seamlessOptional
securityOptional
selectedOptional
shapeOptional
sizeOptional
sizesOptional
slotOptional
spanOptional
spellOptional
srcOptional
srcOptional
srcOptional
srcOptional
startOptional
stepOptional
styleOptional
summaryOptional
suppressOptional
suppressOptional
tabOptional
targetOptional
titleOptional
translateOptional
triggerTooltip trigger: click, mouseenter, focus, manual Set to manual to trigger tooltip programmatically (through the isVisible prop)
Optional
triggerThe trigger reference element to which the Tooltip is relatively placed to. If you can wrap the element with the Tooltip, you can use the children prop instead, or both props together. When passed along with the trigger prop, the div element that wraps the trigger will be removed. Usage: <Tooltip triggerRef={() => document.getElementById('reference-element')} />
Optional
typeOptional
typeofOptional
unselectableOptional
useOptional
valueOptional
vocabOptional
widthOptional
wmodeOptional
wrapOptional
zz-index of the tooltip
CSS fade transition animation duration