@react-navigation/web/lib/createBrowserApp.js

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: 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; }; }();

exports.default = createBrowserApp;

var _history = require('history');

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _core = require('@react-navigation/core');

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 _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

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 queryString = require('query-string');

var history = (0, _history.createBrowserHistory)();

var getPathAndParamsFromLocation = function getPathAndParamsFromLocation(location) {
  var path = location.pathname.substr(1);
  var params = queryString.parse(location.search);
  return { path: path, params: params };
};

var matchPathAndParams = function matchPathAndParams(a, b) {
  if (a.path !== b.path) {
    return false;
  }
  if (queryString.stringify(a.params) !== queryString.stringify(b.params)) {
    return false;
  }
  return true;
};

var currentPathAndParams = getPathAndParamsFromLocation(history.location);

function createBrowserApp(App) {
  var setHistoryListener = function setHistoryListener(dispatch) {
    history.listen(function (location) {
      var pathAndParams = getPathAndParamsFromLocation(location);
      if (matchPathAndParams(pathAndParams, currentPathAndParams)) {
        return;
      }
      currentPathAndParams = pathAndParams;
      var action = App.router.getActionForPathAndParams(pathAndParams.path, pathAndParams.params);
      dispatch(action);
    });
  };

  var initAction = App.router.getActionForPathAndParams(currentPathAndParams.path, currentPathAndParams.params) || _core.NavigationActions.init();

  var WebApp = function (_React$Component) {
    _inherits(WebApp, _React$Component);

    function WebApp() {
      var _ref;

      var _temp, _this, _ret;

      _classCallCheck(this, WebApp);

      for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
        args[_key] = arguments[_key];
      }

      return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = WebApp.__proto__ || Object.getPrototypeOf(WebApp)).call.apply(_ref, [this].concat(args))), _this), _this.state = { nav: App.router.getStateForAction(initAction) }, _this._title = document.title, _this._actionEventSubscribers = new Set(), _this._dispatch = function (action) {
        var lastState = _this.state.nav;
        var newState = App.router.getStateForAction(action, lastState);
        var dispatchEvents = function dispatchEvents() {
          return _this._actionEventSubscribers.forEach(function (subscriber) {
            return subscriber({
              type: 'action',
              action: action,
              state: newState,
              lastState: lastState
            });
          });
        };
        if (newState && newState !== lastState) {
          _this.setState({ nav: newState }, dispatchEvents);
          var pathAndParams = App.router.getPathAndParamsForState && App.router.getPathAndParamsForState(newState);
          if (pathAndParams && !matchPathAndParams(pathAndParams, currentPathAndParams)) {
            currentPathAndParams = pathAndParams;
            history.push('/' + pathAndParams.path + '?' + queryString.stringify(pathAndParams.params));
          }
        } else {
          dispatchEvents();
        }
      }, _temp), _possibleConstructorReturn(_this, _ret);
    }

    _createClass(WebApp, [{
      key: 'componentDidMount',
      value: function componentDidMount() {
        var _this2 = this;

        setHistoryListener(this._dispatch);
        this._actionEventSubscribers.forEach(function (subscriber) {
          return subscriber({
            type: 'action',
            action: initAction,
            state: _this2.state.nav,
            lastState: null
          });
        });
      }
    }, {
      key: 'componentDidUpdate',
      value: function componentDidUpdate() {
        var _navigation = this._navigation,
            state = _navigation.state,
            getChildNavigation = _navigation.getChildNavigation;

        var childKey = state.routes[state.index].key;
        var activeNav = this._navigation.getChildNavigation(childKey);
        var opts = App.router.getScreenOptions(activeNav);
        this._title = opts.title || opts.headerTitle;
        document.title = this._title;
      }
    }, {
      key: 'render',
      value: function render() {
        var _this3 = this;

        this._navigation = (0, _core.getNavigation)(App.router, this.state.nav, this._dispatch, this._actionEventSubscribers, function () {
          return _this3.props.screenProps;
        }, function () {
          return _this3._navigation;
        });
        return _react2.default.createElement(App, { navigation: this._navigation });
      }
    }]);

    return WebApp;
  }(_react2.default.Component);

  return WebApp;
}