Some react-hardware internals.

Button.js

import React from 'react';
import createReactHardwareComponentClass from '../createReactHardwareComponentClass';
import modes from './inputModes';
import HardwareManager from '../HardwareManager';
import ReactHardwareEventEmitter from '../ReactHardwareEventEmitter';
import findNodeHandle from '../findNodeHandle';
var {PropTypes} = React;

var DOWN_EVENT = 'topDown';
var UP_EVENT = 'topUp';
var CHANGE_EVENT = 'topChange';
var HOLD_EVENT = 'topHold';

var collect = (obj, ...things) =>
  things.reduce((memo, thing) => ((memo[thing] = obj[thing]), memo), {});

var EVENT_TYPE = collect(
  HardwareManager.customDirectEventTypes,
  CHANGE_EVENT, DOWN_EVENT, HOLD_EVENT, UP_EVENT
);

var BUTTON_REF = 'button';

var viewConfig = {
  uiViewClassName: 'Button',
  validAttributes: {
    pin: true,
    mode: true,

    onHold: true,
    onChange: true,
    onDown: true,
    onUp: true,
  },
};

function emitEvent(componentInstance, eventName, value) {
  ReactHardwareEventEmitter.receiveEvent(
    findNodeHandle(componentInstance),
    eventName,
    {
      value: value,
      target: componentInstance,
      type: EVENT_TYPE[eventName].registrationName,
    }
  );
}

class Button extends React.Component {
  constructor(props, context) {
    super(props, context);

    this.state = {
      isDown: false,
      inverted: props.inverted || false,
    };
  }

  componentWillMount() {
    // random private data that shouldn’t trigger a render
    this._timer = null;
  }

  componentDidMount() {
    // set up the hardware polling
    HardwareManager.read(findNodeHandle(this.refs[BUTTON_REF]), newValue => {
      if (newValue !== this.value) {
        // TODO: add support for inverted buttons like johnny-five.
        var eventName = newValue === 0 ? UP_EVENT : DOWN_EVENT;
        emitEvent(this, eventName, newValue);
        emitEvent(this, CHANGE_EVENT, newValue);

        if (eventName === DOWN_EVENT) {
          this._timer = setTimeout(
            _ => emitEvent(this, HOLD_EVENT, newValue),
            this.props.holdtime
          );
        }
        else {
          this._timer = clearTimeout(this._timer);
        }

        this.value = newValue;
      }
    });
  }

  componentWillUnmount() {
    // TODO: maybe move this destroyer to the HardwareManager
    HardwareManager.destroyRead(findNodeHandle(this.refs[BUTTON_REF]));
  }

  render() {
    var props = Object.assign({}, this.props);

    return (
      <Hardware
        ref={BUTTON_REF}
        mode={modes.INPUT}
        {...props} />
    );
  }
}

var Hardware = createReactHardwareComponentClass(viewConfig);

Button.propTypes = {
  pin: PropTypes.number.isRequired,
  mode: PropTypes.number,
  holdtime: PropTypes.number,

  onChange: PropTypes.func,
  onDown: PropTypes.func,
  onHold: PropTypes.func,
  onUp: PropTypes.func,
};

Button.defaultProps = {
  holdtime: 1000,
};

export default Button;

Led.js

import React from 'react';
import createReactHardwareComponentClass from '../createReactHardwareComponentClass';
import modes from './inputModes';
var {PropTypes} = React;

var viewConfig = {
  uiViewClassName: 'Led',
  validAttributes: {
    pin: true,
    value: true,
    mode: true,
  },
};

class Led extends React.Component {
  render() {
    return (
      <Hardware {...this.props} />
    );
  }
}

Led.displayName = 'Led';

Led.propTypes = {
  pin: PropTypes.number.isRequired,
  mode: PropTypes.number,
  value: PropTypes.number,
};

var Hardware = createReactHardwareComponentClass(viewConfig);
Hardware.defaultProps = {mode: modes.OUTPUT};

export default Led;

Switch.js

import React from 'react';
import createReactHardwareComponentClass from '../createReactHardwareComponentClass';
import modes from './inputModes';
import HardwareManager from '../HardwareManager';
import ReactHardwareEventEmitter from '../ReactHardwareEventEmitter';
import findNodeHandle from '../findNodeHandle';
var {PropTypes} = React;

var CHANGE_EVENT = 'topChange';
var CLOSE_EVENT = 'topClose';
var OPEN_EVENT = 'topOpen';

var collect = (obj, ...things) =>
  things.reduce((memo, thing) => ((memo[thing] = obj[thing]), memo), {});

var EVENT_TYPE = collect(
  HardwareManager.customDirectEventTypes,
  CHANGE_EVENT, CLOSE_EVENT, OPEN_EVENT
);

var SWITCH_REF = 'switch';

var viewConfig = {
  uiViewClassName: 'Switch',
  validAttributes: {
    pin: true,
    mode: true,

    onChange: true,
    onClose: true,
    onOpen: true,
  },
};

function emitEvent(componentInstance, eventName, value) {
  ReactHardwareEventEmitter.receiveEvent(
    findNodeHandle(componentInstance),
    eventName,
    {
      value: value,
      target: componentInstance,
      type: EVENT_TYPE[eventName].registrationName,
    }
  );
}

class Switch extends React.Component {
  componentDidMount() {
    // set up the hardware polling
    HardwareManager.read(findNodeHandle(this.refs[SWITCH_REF]), newValue => {
      if (newValue !== this.value) {
        var eventName = newValue === 0 ? CLOSE_EVENT : OPEN_EVENT;
        emitEvent(this, eventName, newValue);
        emitEvent(this, CHANGE_EVENT, newValue);

        this.value = newValue;
      }
    });
  }

  componentWillUnmount() {
    // TODO: maybe move this destroyer to the HardwareManager
    HardwareManager.destroyRead(findNodeHandle(this.refs[SWITCH_REF]));
  }

  render() {
    var props = Object.assign({}, this.props);

    return (
      <Hardware
        ref={SWITCH_REF}
        mode={modes.INPUT}
        {...props} />
    );
  }
}

var Hardware = createReactHardwareComponentClass(viewConfig);

Switch.propTypes = {
  pin: PropTypes.number.isRequired,
  mode: PropTypes.number,

  onChange: PropTypes.func,
  onClose: PropTypes.func,
  onOpen: PropTypes.func,
};

export default Switch;