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

Nav's Pattern Library

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

const CurrencyInputField = ({
  className,
  errors = [],
  hasSpaceForErrors,
  isInvalid,
  isStatic,
  label,
  lede = '',
  placeholder,
  required,
  touched,
  type,
  value,
  ...props
}) => {
  console.warn(
    `[Deprecation]: CurrencyInput has been deprecated and will be removed in a future version. Please refactor all uses to use vanilla-masker's \`toMoney\` function instead.'`
  )
  /* isStatic to be used to overcome auto-populated fields that do not read as values or placeholders */
  const isVisited = touched || value || placeholder || isStatic
  return (
    <FieldWrapper className={className}>
      {lede && <Copy bold>{lede}</Copy>}
      <Field isVisited={isVisited} isInvalid={isInvalid} value={value} required={required} type={type}>
        <CurrencyInput
          isInvalid={isInvalid}
          value={value != null ? value : undefined}
          thousandSeparator=","
          decimalScale={0}
          prefix="$"
          required={required}
          onValueChange={props.onChange}
          placeholder="$"
          {...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(CurrencyInputField)``
export { CurrencyInputField }