render()

in packages/eui/src/components/date_picker/super_date_picker/super_date_picker.tsx [754:811]
54 lines of code
10 McCabe index (conditional complexity)

  render() {
    const {
      isAutoRefreshOnly,
      isDisabled,
      isPaused,
      onRefreshChange,
      refreshInterval,
      refreshMinInterval,
      refreshIntervalUnits,
      showUpdateButton,
      'data-test-subj': dataTestSubj,
      width: _width,
      isQuickSelectOnly,
      compressed,
      className,
      memoizedStyles: styles,
    } = this.props;
    const { hasChanged, isInvalid } = this.state;

    const classes = classNames('euiSuperDatePicker', className, {
      'euiSuperDatePicker--needsUpdating':
        hasChanged && !isDisabled && !isInvalid,
    });

    // Force reduction in width if showing quick select only
    const width = isQuickSelectOnly ? 'auto' : _width ?? 'restricted';

    const cssStyles = [
      styles.euiSuperDatePicker,
      styles.widths[width],
      !showUpdateButton && styles.noUpdateButton[width],
      isAutoRefreshOnly && styles.isAutoRefreshOnly[width],
      isQuickSelectOnly && styles.isQuickSelectOnly,
    ];

    return (
      <div css={cssStyles} className={classes} data-test-subj={dataTestSubj}>
        {isAutoRefreshOnly && onRefreshChange ? (
          <EuiAutoRefresh
            isPaused={isPaused}
            refreshInterval={refreshInterval}
            minInterval={refreshMinInterval}
            intervalUnits={refreshIntervalUnits}
            onRefreshChange={this.onRefreshChange}
            fullWidth={width === 'full'}
            compressed={compressed}
            isDisabled={!!isDisabled}
            className={className}
          />
        ) : (
          <>
            {this.renderDatePickerRange()}
            {this.renderUpdateButton()}
          </>
        )}
      </div>
    );
  }