@eixox/jetfuel-firebase-react/src/Xinput.js

Our jetfuel lib to connect react to firebase

import React, { Component } from "react";
import PropTypes from "prop-types";

/**
 * A generic multipurpose input; Unmanaged by default and raises events to managed components;
 */
export default class Xinput extends Component {
  /**
 * The Constructor of this input;
 * @param {*} props 
 */
  constructor(props) {
    super(props);
  }

  /**
   * Fires when a single line, multiline or single option input has it's value changed;
   * @param {*} event 
   */
  onValueChange(value) {
    var interceptor = this.props.interceptor;
    if (interceptor) {
      if (interceptor instanceof Array) {
        for (var i = 0; i < interceptor.length; i++)
          value = interceptor[i](value);
      } else value = interceptor(value);
    }
    if (this.props.onChange) this.props.onChange(value);
  }

  /**
   * Fires when a multi option is selected;
   * @param {*} value 
   */
  onValueToggle(value) {
    var av = this.props.value;
    if (!av || !(av instanceof Array)) {
      av = [];
      av.push(value);
    } else {
      var cindex = av.indexOf(value);
      if (cindex >= 0) av.splice(cindex, 1);
      else av.push(value);
    }
    if (this.props.onChange) this.props.onChange(av);
  }

  /**
   * Checks if the given option is present on the values array;
   * @param {*} opt 
   */
  isValueSelected(opt) {
    var av = this.props.value;
    return av && av instanceof Array && av.indexOf(opt) >= 0;
  }

}