All files / components/inputs/InputText InputText.js

100% Statements 3/3
55.55% Branches 5/9
100% Functions 1/1
100% Lines 3/3

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86                              2x                                                             18x                                                                       2x      
// @flow
/* eslint-disable no-ternary, max-lines-per-function */
 
import {
  ErrorText,
  InfoText,
  Input,
  Label,
  SuccessText,
  Wrapper
} from "./styled"
import React, { type ElementRef, forwardRef } from "react"
import type { ComponentProps } from "."
 
const InputText: React$AbstractComponent<ComponentProps, React$Node> =
  forwardRef(
    (
      {
        className,
        defaultValue,
        disabled,
        error,
        errorText,
        hasContent,
        infoText,
        inputId,
        inputProps,
        isFullBorder,
        label,
        labelId,
        max,
        min,
        name,
        onBlur,
        onChange,
        onInput,
        onKeyDown,
        required,
        step,
        success,
        successText,
        type = "text",
        value
      }: ComponentProps,
      ref: ElementRef<HTMLInputElement | null>
    ): React$Node => (
      <Wrapper className={className}>
        <Input
          {...inputProps}
          $error={error}
          $hasContent={hasContent}
          $success={success}
          aria-invalid={error ? "true" : "false"}
          defaultValue={defaultValue}
          disabled={disabled}
          id={inputId}
          isFullBorder={isFullBorder}
          max={max}
          min={min}
          name={name}
          onBlur={onBlur}
          onChange={onChange}
          onInput={onInput}
          onKeyDown={onKeyDown}
          ref={ref}
          required={required}
          step={step}
          type={type}
          value={value}
        />
        <Label htmlFor={inputId} id={labelId} isFullBorder={isFullBorder}>
          {label}
        </Label>
        {errorText ? <ErrorText role="alert">{errorText}</ErrorText> : null}
        {infoText ? <InfoText aria-live="polite">{infoText}</InfoText> : null}
        {successText ? (
          <SuccessText aria-live="polite">{successText}</SuccessText>
        ) : null}
      </Wrapper>
    )
  )
 
InputText.displayName = "InputText"
 
export default InputText