@instructure/ui-text-input

category: packages

ui-text-input

     

A styled HTML text input component.

Components

The ui-text-input package contains the following:

• TextInput

Installation

yarn add @instructure/ui-text-input

Usage

---
example: false
---
class ControlledTextInputExample extends React.Component {
  constructor (props) {
    super(props)

    this.state = {
      value: 'Mint chocolate chip'
    }
  }

  handleChange = (e, value) => this.setState({ value })

  render () {
    return (
      <View as="div">
        <TextInput
          label="What is your favorite ice cream flavor?"
          value={this.state.value}
          onChange={this.handleChange}
        />
        <View as="div" margin="medium none none">
          <code>this.state.value = {this.state.value}</code>
        </View>
      </View>
    )
  }
}

render(<ControlledTextInputExample />)