@navinc/base-react-components/src/_deprecated/number-input/index.js

Nav's Pattern Library

import React from 'react'
import styled from 'styled-components'
import { NumberInput, Label, FieldWrapper, Field, Errors, Err } from '../../form-elements/shared.js'
import Copy from '../../copy'
import { deprecationWarning } from '@navinc/utils'

const NumberInputField = ({
  className,
  label,
  value,
  required,
  type,
  hasSpaceForErrors,
  isInvalid,
  errors = [],
  lede = '',
  ...props
}) => {
  deprecationWarning(
    true,
    `NumberInput has been deprecated and will be removed in a future version. Please refactor all uses to use vanilla-masker's \`toPattern\` function instead.`
  )
  return (
    <FieldWrapper className={className}>
      {lede && <Copy bold>{lede}</Copy>}
      <Field isInvalid={isInvalid} value={value} required={required} type={type}>
        <NumberInput
          value={value != null ? value : undefined}
          thousandSeparator=","
          decimalScale={0}
          allowNegative={false}
          required={required}
          onValueChange={props.onChange}
          {...props}
        />
        <Label required={required} value={value}>
          {label}
        </Label>
      </Field>
      <Errors hasSpaceForErrors={hasSpaceForErrors}>
        {!!errors.length && errors.map((err, i) => <Err key={`err-${i}`}>{err}</Err>)}
      </Errors>
    </FieldWrapper>
  )
}

export default styled(NumberInputField)``
export { NumberInputField }