render()

in src/list/list.tsx [729:767]

• 35 lines of code
• 12 McCabe index (conditional complexity)

  render() {
    const hint = (this.getSelected() && this.props.hintOnSelection) || this.props.hint;
    const fadeStyles = hint ? {bottom: Dimension.ITEM_HEIGHT} : undefined;

    const rowCount = this.props.data.length + 2;

    const maxHeight = this.props.maxHeight && this.getVisibleListHeight(this.props.maxHeight);

    const classes = classNames(styles.list, this.props.className);

    return (
      <>
        <ActiveItemContext.Updater
          value={this.getId(this.state.activeItem)}
          skipUpdate={this.props.hidden || !isActivatable(this.state.activeItem)}
        />
        <div
          id={this.props.id}
          ref={this.containerRef}
          className={classes}
          onMouseOut={this.props.onMouseOut}
          onBlur={this.props.onMouseOut}
          data-test='ring-list'
        >
          {this.props.shortcuts && (
            <Shortcuts
              map={this.props.shortcutsMap ? {...this.shortcutsMap, ...this.props.shortcutsMap} : this.shortcutsMap}
              scope={this.shortcutsScope}
            />
          )}
          {this.props.renderOptimization
            ? this.renderVirtualized(maxHeight, rowCount)
            : this.renderSimple(maxHeight, rowCount)}
          {this.state.hasOverflow && !this.state.scrolledToBottom && <div className={styles.fade} style={fadeStyles} />}
          {hint && <ListHint label={hint} />}
        </div>
      </>
    );
  }