render()

in src/input/base-input.tsx [307:390]
73 lines of code
5 McCabe index (conditional complexity)

  render() {
    const {
      overrides: {
        // @ts-ignore
        InputContainer: InputContainerOverride,
        // @ts-ignore
        Input: InputOverride,
        // @ts-ignore
        Before: BeforeOverride,
        // @ts-ignore
        After: AfterOverride,
      },
    } = this.props;

    // more here https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#Preventing_autofilling_with_autocompletenew-password
    const autoComplete =
      this.state.initialType === 'password' &&
      this.props.autoComplete === BaseInput.defaultProps.autoComplete
        ? 'new-password'
        : this.props.autoComplete;

    const sharedProps = getSharedProps(this.props, this.state);

    const [InputContainer, inputContainerProps] = getOverrides(
      InputContainerOverride,
      StyledInputContainer
    );
    const [Input, inputProps] = getOverrides(InputOverride, StyledInput);
    const [Before, beforeProps] = getOverrides(BeforeOverride, NullComponent);
    const [After, afterProps] = getOverrides(AfterOverride, NullComponent);

    return (
      <InputContainer
        data-baseweb={this.props['data-baseweb'] || 'base-input'}
        {...sharedProps}
        {...inputContainerProps}
      >
        <Before {...sharedProps} {...beforeProps} />

        <Input
          ref={this.inputRef}
          aria-activedescendant={this.props['aria-activedescendant']}
          aria-autocomplete={this.props['aria-autocomplete']}
          aria-controls={this.props['aria-controls']}
          aria-errormessage={this.props['aria-errormessage']}
          aria-haspopup={this.props['aria-haspopup']}
          aria-label={this.props['aria-label']}
          aria-labelledby={this.props['aria-labelledby']}
          aria-describedby={this.props['aria-describedby']}
          aria-invalid={this.props.error}
          aria-required={this.props.required}
          autoComplete={autoComplete}
          disabled={this.props.disabled}
          readOnly={this.props.readOnly}
          id={this.props.id}
          inputMode={this.props.inputMode}
          maxLength={this.props.maxLength}
          name={this.props.name}
          onBlur={this.onBlur}
          onChange={this.props.onChange}
          onFocus={this.onFocus}
          onKeyDown={this.props.onKeyDown}
          onKeyPress={this.props.onKeyPress}
          onKeyUp={this.props.onKeyUp}
          pattern={this.props.pattern}
          placeholder={this.props.placeholder}
          type={this.getInputType()}
          required={this.props.required}
          role={this.props.role}
          value={this.props.value}
          min={this.props.min}
          max={this.props.max}
          step={this.props.step}
          rows={this.props.type === CUSTOM_INPUT_TYPE.textarea ? this.props.rows : null}
          {...sharedProps}
          {...inputProps}
        />
        {this.renderClear()}
        {this.renderMaskToggle()}

        <After {...sharedProps} {...afterProps} />
      </InputContainer>
    );
  }