react-whitebox/lib/index.js

A component to display your errors.

'use strict';

exports.__esModule = true;

var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();

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

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }

function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _styleJs = require('./style.js');

var _styleJs2 = _interopRequireDefault(_styleJs);

var _errorStackParser = require('error-stack-parser');

var _errorStackParser2 = _interopRequireDefault(_errorStackParser);

var _objectAssign = require('object-assign');

var _objectAssign2 = _interopRequireDefault(_objectAssign);

var RedBox = (function (_Component) {
  _inherits(RedBox, _Component);

  function RedBox() {
    _classCallCheck(this, RedBox);

    _Component.apply(this, arguments);
  }

  RedBox.prototype.render = function render() {
    var error = this.props.error;

    var _assign = _objectAssign2['default']({}, _styleJs2['default'], this.props.style);

    var redbox = _assign.redbox;
    var message = _assign.message;
    var stack = _assign.stack;
    var frame = _assign.frame;
    var file = _assign.file;
    var linkToFile = _assign.linkToFile;

    var frames = _errorStackParser2['default'].parse(error).map(function (f, index) {
      var link = f.fileName + ':' + f.lineNumber + ':' + f.columnNumber;
      return _react2['default'].createElement(
        'div',
        { style: frame, key: index },
        _react2['default'].createElement(
          'div',
          null,
          f.functionName
        ),
        _react2['default'].createElement(
          'div',
          { style: file },
          _react2['default'].createElement(
            'a',
            { href: link, style: linkToFile },
            link
          )
        )
      );
    });
    return _react2['default'].createElement(
      'div',
      { style: redbox },
      _react2['default'].createElement(
        'div',
        { style: message },
        error.name,
        ': ',
        error.message
      ),
      _react2['default'].createElement(
        'div',
        { style: stack },
        frames
      )
    );
  };

  _createClass(RedBox, null, [{
    key: 'propTypes',
    value: {
      error: _react.PropTypes.instanceOf(Error).isRequired
    },
    enumerable: true
  }, {
    key: 'displayName',
    value: 'RedBox',
    enumerable: true
  }]);

  return RedBox;
})(_react.Component);

exports['default'] = RedBox;
module.exports = exports['default'];