render()

in src/tooltip/tooltip.tsx [170:226]

• 53 lines of code
• 6 McCabe index (conditional complexity)

  render() {
    const {
      children,
      'data-test': dataTest,
      title,
      delay,
      theme,
      selfOverflowOnly,
      popupProps,
      long,
      ...restProps
    } = this.props;

    const ariaProps = typeof title === 'string' && !!title ? {'aria-label': title, role: 'tooltip'} : {};

    const {onNestedTooltipShow, onNestedTooltipHide} = this;

    const popup = (
      <Popup
        trapFocus={false}
        anchorElement={this.containerNode}
        hidden={!this.state.showPopup || this.state.showNestedPopup}
        onCloseAttempt={this.hidePopup}
        maxHeight={400}
        attached={false}
        onMouseOut={this.hideIfMovedOutsidePopup}
        top={4}
        dontCloseOnAnchorClick
        ref={this.popupRef}
        {...popupProps}
        className={classNames(
          styles.tooltip,
          {[styles.long]: long, [styles.inheritedTheme]: theme === 'inherit'},
          popupProps?.className,
        )}
      >
        {title}
      </Popup>
    );

    return (
      <TooltipContext.Provider value={{onNestedTooltipShow, onNestedTooltipHide}}>
        <span
          {...ariaProps}
          {...restProps}
          ref={this.containerRef}
          data-test={dataTests('ring-tooltip', dataTest)}
          data-test-title={typeof title === 'string' ? title : undefined}
        >
          {children}
          {theme === 'inherit' ? (
            popup
          ) : (
            <ThemeProvider theme={theme} passToPopups WrapperComponent={props => <span {...props} />}>
              {popup}
            </ThemeProvider>
          )}