@lyra/components/lib/utilities/Stacked.js

Basic UX components

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.createStack = createStack;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _nanoPubsub = require('nano-pubsub');

var _nanoPubsub2 = _interopRequireDefault(_nanoPubsub);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function createStack() {
  let stack = [];
  const changes = (0, _nanoPubsub2.default)();

  function remove(instance) {
    stack = stack.filter(entry => entry !== instance);
    onChange();
  }

  function peek() {
    return stack[stack.length - 1];
  }
  function push(entry) {
    stack.push(entry);
    onChange();
  }

  function onChange() {
    changes.publish(peek());
  }

  return {
    remove,
    peek,
    push,
    subscribe: changes.subscribe
  };
}

const DEFAULT_STACK = createStack();

class Stacked extends _react2.default.Component {

  constructor(props) {
    super();
    this.state = {
      top: null
    };
    this._unsubscribe = props.stack.subscribe(top => {
      this.setState(() => ({ top }));
    });
  }
  componentWillMount() {
    const stack = this.props.stack;

    stack.push(this);
  }

  componentWillUnmount() {
    const stack = this.props.stack;

    this._unsubscribe();
    stack.remove(this);
  }

  render() {
    return this.props.children(this.state.top === this);
  }
}
exports.default = Stacked;
Stacked.propTypes = {
  children: _propTypes2.default.func.isRequired,
  stack: _propTypes2.default.shape({
    remove: _propTypes2.default.func,
    peek: _propTypes2.default.func,
    push: _propTypes2.default.func,
    subscribe: _propTypes2.default.func
  })
};
Stacked.defaultProps = {
  stack: DEFAULT_STACK
};