Need private packages and team management tools?Check out npm Teams »

@fenderdigital/react-text-field

1.0.10 • Public • Published

TextField for Fender React UI Kit

Description

A compound component used to render input fields. It will also perform field validation..

Installation and Usage

yarn add @fenderdigital/react-text-field --save
import TextField from '@fenderdigital/react-text-field';

Props

  • autoComplete - enables / disabled this browser feature for input fields.
  • children - renders any child elements.
  • containerStyles - configurable tachyon classes.
  • dataId - data id value. mainly, for automation testing.
  • disabled - option to disable the input field.
  • errorMessage - error messaging that is rendered by FieldError.
  • initialValue - optional input field value.
  • value - Use to set input field value. Must be paired with onChange if TextField is to be updated after
  • inputStyles - configurable tachyon classes for the input field element.
  • onChange - onChange callback
  • onBlur - onBlur callback
  • onFocus - onFocus callback
  • onClick - onFocus callback
  • placeholder - text (or html) for the input field's placeholder attribute.
  • type - input field type
propName propType defaultValue isRequired
autoComplete string off -
children node null -
containerStyles string '' -
dataId string text-field -
disabled boolean false -
errorMessage string null -
initialValue string '' -
value string '' -
inputStyles string '' -
onChange func () => {} -
onBlur func null -
onFocus func () => {} -
onClick func () => {} -
placeholder node '' -
type string text -

Development

Check the Monorepo README for development documentation.

Install

npm i @fenderdigital/react-text-field

DownloadsWeekly Downloads

38

Version

1.0.10

License

UNLICENSED

Unpacked Size

20.7 kB

Total Files

7

Last publish

Collaborators

  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar