cloud-widgets v1.0.57

Storybook

Storybook documentation

Inputs

TextInput

TextAreaInput

SelectInput

MultiSelectInput

Checkbox

Button

TagInput

RadioInput

RadioGroup

GeosuggestInput

Installation

For install: npm install cloud-widgets --save

Usage

import _ from 'lodash'
import { FormUtils, TextInput, TextAreaInput, SelectInput, MultiSelectInput, TagInput, Button } from 'cloud-widgets'

...

  constructor(props) {
    super(props)
    this.formInputs = {}
  }

  _onSubmit(e) {

    // Function in FormUtils to validate inputs
    if (FormUtils.validateForm(this.formInputs)) {
      const data = {
        firstName: _.get(this.state, 'firstName', ''),
        lastName: _.get(this.state, 'lastName', ''),
      }
      this.props.onSubmit(data)
    }
  }

  _mandatoryValidate(value) {

    // Validation function example
    if (value != null && value != '') {
      return { isValid: true, error: '' }
    } else {
      return { isValid: false, error: 'Mandatory field' }
    }
  }
    
...

  render() {
    return (
      <TextInput
        ref={i => {
          this.formInputs.firstName = i
        }}
        id={'firstName'}
        label={'FirstName:'}
        value={this.state.firstName}
        placeholder={' '}
        onChange={firstName => this.setState({ firstName })}
        validation={v => this._mandatoryValidate(v)}
      />
    )
  }