Sha256: 941d7fcc54e160b40d8c3deaaf481ef6daa67470af4a848639e1e9d0ae168800

Contents?: true

Size: 1.55 KB

Versions: 2

Compression:

Stored size: 1.55 KB

Contents

Rev.registerComponent('Input', class Input extends React.Component {

  static get defaultProps() {
    return {
      dom: 'input',
      type: 'text',
    }
  }

  get typeClassMod() {
    return this.props.dom === 'input' ? this.props.type : this.props.dom
  }

  get labelClassName() {
    let labelClassNamesObject = {
      'RevInput': true,
      'RevInput--label': true,
      'error': this.props.error != null,
    }
    labelClassNamesObject[`RevInput-${this.typeClassMod}`] = true // E.g., "RevInput-checkbox"
    return this.classSet(labelClassNamesObject)
  }

  get input() {
    let props = this.getPropsWithout('dom', 'error', 'className', 'children')
    props.className = this.classAdd({
      'RevInput--input': true,
      'error': this.props.error != null,
    })
    if (this.props.dom === 'input') {
      return React.createElement(this.props.dom, props)
    } else {
      return React.createElement(this.props.dom, props, this.props.children)
    }
  }

  get innerLabel() {
    return <span className="RevInput--innerLabel">{this.props.label}</span>
  }

  get error() {
    if(this.props.error) {
      return <small className="RevError error">{this.props.error}</small>
    }
    return null
  }

  get shouldPutLabelAfterInput() {
    return this.props.type === 'checkbox' || this.props.type === 'radio'
  }

  render() {
    return <label className={this.labelClassName}>
      {this.shouldPutLabelAfterInput ? null : this.innerLabel}
      {this.input}
      {this.shouldPutLabelAfterInput ? this.innerLabel : null}
      {this.error}
    </label>
  }

})

Version data entries

2 entries across 2 versions & 1 rubygems

Version Path
revelry_core-0.1.24.0 app/assets/javascripts/revelry/ui/forms/Input.es6
revelry_core-0.1.23.0 app/assets/javascripts/revelry/ui/forms/Input.es6