@anew/router/lib/router.js

Anew Router Manager

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import { Route as DefaultRoute, Router as DefaultRouter, Switch as DefaultSwitch, Redirect as ReactRouterRedirect, Link as ReactRouterLink } from 'react-router-dom';
import { compile } from 'path-to-regexp';
import { createBrowserHistory } from 'history';
import React from 'react';
import trimStart from 'lodash.trimstart';
import isMatch from './isMatch';
import matchRoutes from './matchRoutes';
export var AnewRouter = function AnewRouter(use) {
  var _this = this;

  _defineProperty(this, "use", function (_ref) {
    if (_ref === void 0) {
      _ref = {};
    }

    var _ref2 = _ref,
        routes = _ref2.routes,
        component = _ref2.component,
        config = _objectWithoutPropertiesLoose(_ref2, ["routes", "component"]);

    _this.setConfig(config);

    _this.entry = component;
    _this.routes = _this._build(routes);
  });

  _defineProperty(this, "setConfig", function (_ref3) {
    if (_ref3 === void 0) {
      _ref3 = {};
    }

    var _ref4 = _ref3,
        routes = _ref4.routes,
        config = _objectWithoutPropertiesLoose(_ref4, ["routes"]);

    if (routes) {
      _this.use(routes);
    }

    return _this.config = _extends({}, _this.config, {}, config);
  });

  _defineProperty(this, "wrap", function (component, config, isRoot) {
    if (isRoot === void 0) {
      isRoot = false;
    }

    var _this$setConfig = _this.setConfig(config),
        history = _this$setConfig.history,
        Router = _this$setConfig.Router,
        Route = _this$setConfig.Route;

    var routes = _this.routes,
        entry = _this.entry,
        _render = _this._render;
    var route = {
      routes: routes
    };
    var Component = component || entry;
    var RouteComponent = React.createElement(Route, {
      render: function render(props) {
        return React.createElement(Component, _extends({}, props, {
          route: route,
          RouterView: _render(route)
        }));
      }
    });

    if (isRoot) {
      var _ref5 = !history ? _this.setConfig({
        history: createBrowserHistory()
      }) : _this.config,
          routerHistory = _ref5.history;

      return function AnewRouter(props) {
        return React.createElement(Router, _extends({}, props, {
          history: routerHistory
        }), RouteComponent);
      };
    } else {
      return function AnewRoute() {
        return RouteComponent;
      };
    }
  });

  _defineProperty(this, "Redirect", function (_ref6) {
    var name = _ref6.name,
        params = _ref6.params,
        _ref6$method = _ref6.method,
        method = _ref6$method === void 0 ? 'path' : _ref6$method,
        props = _objectWithoutPropertiesLoose(_ref6, ["name", "params", "method"]);

    var route = _this.get(name);

    return !route.is(_this.config.history.location.pathname) ? React.createElement(ReactRouterRedirect, _extends({
      to: route[method](method === 'data' && !params ? 'path' : params)
    }, props)) : null;
  });

  _defineProperty(this, "Link", function (_ref7) {
    var name = _ref7.name,
        params = _ref7.params,
        _ref7$method = _ref7.method,
        method = _ref7$method === void 0 ? 'path' : _ref7$method,
        props = _objectWithoutPropertiesLoose(_ref7, ["name", "params", "method"]);

    return React.createElement(ReactRouterLink, _extends({
      to: _this.get(name)[method](method === 'data' && !params ? 'path' : params)
    }, props));
  });

  _defineProperty(this, "Protect", function (_ref8) {
    var redirectTo = _ref8.redirectTo,
        active = _ref8.active,
        children = _ref8.children,
        props = _objectWithoutPropertiesLoose(_ref8, ["redirectTo", "active", "children"]);

    var Redirect = _this.Redirect;
    return active ? React.createElement(React.Fragment, null, children) : React.createElement(Redirect, _extends({
      name: redirectTo
    }, props));
  });

  _defineProperty(this, "get", function (name) {
    return _this.names[name];
  });

  _defineProperty(this, "match", function (pathname, _temp) {
    var _ref9 = _temp === void 0 ? {} : _temp,
        name = _ref9.name,
        _ref9$strict = _ref9.strict,
        strict = _ref9$strict === void 0 ? true : _ref9$strict;

    switch (typeof name) {
      case 'string':
        var _this$get$data = _this.get(name).data(),
            routes = _this$get$data.routes,
            path = _this$get$data.path;

        if (routes) {
          return matchRoutes(routes, strict ? pathname : path + "/" + trimStart(pathname, '/'));
        }

        return [];

      case 'object':
        return matchRoutes(name, pathname);

      default:
        return [];
    }
  });

  _defineProperty(this, "contains", function (pathname, _temp2) {
    var _ref10 = _temp2 === void 0 ? {} : _temp2,
        name = _ref10.name,
        strict = _ref10.strict;

    return !!_this.match(pathname, {
      name: name,
      strict: strict
    }).length;
  });

  _defineProperty(this, "_createFullPath", function (path, parentPath) {
    return (parentPath + "/" + path).replace(/\/{2,}/, '/').replace(/(?!^\/)\/+$/, '');
  });

  _defineProperty(this, "_build", function (routes,
  /*recursive param*/
  parentPath) {
    if (routes === void 0) {
      routes = [];
    }

    if (parentPath === void 0) {
      parentPath = '';
    }

    return routes.map(function (route) {
      var _createFullPath = _this._createFullPath,
          _build = _this._build,
          _render = _this._render,
          _match = _this.match,
          _contains = _this.contains;
      var _routes = route.routes,
          path = route.path,
          name = route.name,
          component = route.component,
          render = route.render;

      var fullPath = _createFullPath(path, parentPath);

      route.path = fullPath;

      if (_routes) {
        route.routes = _build(_routes, fullPath);

        if (!component && !render) {
          route.render = _render(route);
        }
      }

      route.actions = {
        path: compile(fullPath),
        data: function data(prop) {
          return prop ? route[prop] : route;
        },
        is: function is(pathname) {
          return isMatch(pathname, fullPath);
        },
        routes: function routes(pathname, _temp3) {
          var _ref11 = _temp3 === void 0 ? {} : _temp3,
              strict = _ref11.strict;

          return _match(pathname, {
            name: _routes,
            strict: strict
          });
        },
        contains: function contains(pathname, _temp4) {
          var _ref12 = _temp4 === void 0 ? {} : _temp4,
              strict = _ref12.strict;

          return _contains(pathname, {
            name: _routes,
            strict: strict
          });
        }
      };

      if (name) {
        _this.names[name] = route.actions;
      }

      return route;
    });
  });

  _defineProperty(this, "_render", function (_ref13) {
    var routes = _ref13.routes,
        _ref13$name = _ref13.name,
        parentName = _ref13$name === void 0 ? '' : _ref13$name;
    var Redirect = _this.Redirect,
        _render = _this._render,
        _this$config = _this.config,
        ConfigSwitch = _this$config.Switch,
        ConfigRoute = _this$config.Route,
        history = _this$config.history;

    if (routes) {
      return (
        /* RouterView */
        function (_ref14) {
          if (_ref14 === void 0) {
            _ref14 = {};
          }

          var _ref15 = _ref14,
              _ref15$Switch = _ref15.Switch,
              Switch = _ref15$Switch === void 0 ? ConfigSwitch : _ref15$Switch,
              _ref15$Route = _ref15.Route,
              Route = _ref15$Route === void 0 ? ConfigRoute : _ref15$Route,
              extraProps = _objectWithoutPropertiesLoose(_ref15, ["Switch", "Route"]);

          return React.createElement(Switch, {
            location: history.location
          }, routes.map(function (route, i) {
            var name = route.name,
                path = route.path,
                strict = route.strict,
                _render2 = route.render,
                redirectTo = route.redirectTo,
                routes = route.routes,
                push = route.push,
                _route$exact = route.exact,
                exact = _route$exact === void 0 ? true : _route$exact,
                Component = route.component;
            var key = parentName + "(" + (name || i) + ")";
            return redirectTo ? React.createElement(Redirect, _extends({}, typeof redirectTo === 'function' ? redirectTo(history) : redirectTo, {
              key: key,
              from: path,
              exact: exact,
              strict: strict,
              push: push
            })) : React.createElement(Route, {
              key: key,
              path: path,
              exact: routes ? false : exact,
              strict: strict,
              render: function render(props) {
                var componentProps = _extends({}, props, {}, extraProps, {
                  RouterView: _render(route),
                  route: route
                });

                return Component ? React.createElement(Component, componentProps) : _render2(componentProps);
              }
            });
          }));
        }
      );
    }
  });

  this.names = {};
  this.config = {
    Router: DefaultRouter,
    Route: DefaultRoute,
    Switch: DefaultSwitch
  };
  this.use(use); // Component Names

  this.Redirect.displayName = 'Router.Redirect';
  this.Link.displayName = 'Router.Link';
  this.Protect.displayName = 'Router.Protect';
};
export default new AnewRouter();