diff --git a/src/components/views/elements/Field.tsx b/src/components/views/elements/Field.tsx index 86ae9eb932..2d57d1772b 100644 --- a/src/components/views/elements/Field.tsx +++ b/src/components/views/elements/Field.tsx @@ -60,6 +60,8 @@ interface IProps { // If specified, contents will appear as a tooltip on the element and // validation feedback tooltips will be suppressed. tooltipContent?: JSX.Element | string; + // If specified the tooltip will be shown regardless of feedback + forceTooltipVisible?: boolean; // If specified, the tooltip with be aligned accorindly with the field, defaults to Right. tooltipAlignment?: ComponentProps["placement"]; // If specified alongside tooltipContent, the class name to apply to the @@ -271,6 +273,7 @@ export default class Field extends React.PureComponent { validateOnChange, validateOnFocus, usePlaceholderAsHint, + forceTooltipVisible, tooltipAlignment, ...inputProps } = this.props; @@ -279,7 +282,7 @@ export default class Field extends React.PureComponent { const tooltipProps: Pick, "aria-live" | "aria-atomic"> = {}; let tooltipOpen = false; if (tooltipContent || this.state.feedback) { - tooltipOpen = this.state.feedbackVisible; + tooltipOpen = (this.state.focused && forceTooltipVisible) || this.state.feedbackVisible; if (!tooltipContent) { tooltipProps["aria-atomic"] = "true";