@steroidsjs/core 2.0.0-rc.6 → 2.0.1-beta.112

package/dist/ui/nav/Router/Router.js

@@ -1,224 +1,260 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-exports.treeToList = exports.walkRoutesRecursive = void 0;
-var React = __importStar(require("react"));
-var react_router_1 = require("react-router");
-var react_router_dom_1 = require("react-router-dom");
-var connected_react_router_1 = require("connected-react-router");
-var get_1 = __importDefault(require("lodash-es/get"));
-var isEqual_1 = __importDefault(require("lodash-es/isEqual"));
-var isArray_1 = __importDefault(require("lodash-es/isArray"));
-var isObject_1 = __importDefault(require("lodash-es/isObject"));
-var react_1 = require("react");
-var react_use_1 = require("react-use");
-var hooks_1 = require("../../../hooks");
-var hoc_1 = require("../../../hoc");
-var router_1 = require("../../../actions/router");
-var useDispatch_1 = __importDefault(require("../../../hooks/useDispatch"));
-var router_2 = require("../../../reducers/router");
-var SsrProvider_1 = require("./SsrProvider");
-var findRedirectPathRecursive = function (route) {
-    if (!route) {
-        return null;
-    }
-    if (typeof route.redirectTo === 'boolean') {
-        var key = isObject_1["default"](route.items) && !isArray_1["default"](route.items) ? Object.keys(route.items)[0] : '0';
-        return findRedirectPathRecursive(get_1["default"](route, ['items', key]));
-    }
-    if (typeof route.redirectTo === 'string') {
-        return route.redirectTo;
-    }
-    return route.path || route.path === ''
-        ? route.path
-        : null;
-};
-var walkRoutesRecursive = function (item, defaultItem, parentItem) {
-    if (defaultItem === void 0) { defaultItem = {}; }
-    if (parentItem === void 0) { parentItem = {}; }
-    var normalizedItem = __assign(__assign(__assign({}, defaultItem), item), { id: item.id, exact: item.exact, path: item.path && (item.path.indexOf('/') !== 0 && parentItem.path ? parentItem.path + '/' : '') + item.path, label: item.label, title: item.title, isVisible: typeof item.isVisible !== 'undefined'
-            ? item.isVisible
-            : (typeof parentItem.isVisible !== 'undefined'
-                ? parentItem.isVisible
-                : defaultItem.isVisible), isNavVisible: typeof item.isNavVisible !== 'undefined'
-            ? item.isNavVisible
-            : (typeof parentItem.isNavVisible !== 'undefined'
-                ? parentItem.isNavVisible
-                : defaultItem.isNavVisible), layout: item.layout || parentItem.layout || defaultItem.layout || null, roles: item.roles || parentItem.roles || defaultItem.roles || null, component: null, componentProps: null });
-    var items = null;
-    if (isArray_1["default"](item.items)) {
-        items = item.items.map(function (i) { return exports.walkRoutesRecursive(i, defaultItem, normalizedItem); });
-    }
-    else if (isObject_1["default"](item.items)) {
-        items = Object.keys(item.items)
-            .map(function (id) { return exports.walkRoutesRecursive(__assign(__assign({}, item.items[id]), { id: id }), defaultItem, normalizedItem); });
-    }
-    return __assign(__assign({}, normalizedItem), { items: items });
-};
-exports.walkRoutesRecursive = walkRoutesRecursive;
-var treeToList = function (item, isRoot) {
-    if (isRoot === void 0) { isRoot = true; }
-    if (isArray_1["default"](item)) {
-        return item;
-    }
-    if (isRoot && !item.id) {
-        item.id = 'root';
-    }
-    var items = item.path ? [item] : [];
-    if (isArray_1["default"](item.items)) {
-        item.items.forEach(function (sub) {
-            items = items.concat(exports.treeToList(sub, false));
-        });
-    }
-    else if (isObject_1["default"](item.items)) {
-        Object.keys(item.items).forEach(function (id) {
-            items = items.concat(exports.treeToList(__assign(__assign({}, item.items[id]), { id: id }), false));
-        });
-    }
-    return items;
-};
-exports.treeToList = treeToList;
-var renderComponent = function (route, activePath, routeProps) {
-    if (route.redirectTo && route.path === activePath) {
-        var to = findRedirectPathRecursive(route);
-        if (to === null) {
-            // eslint-disable-next-line no-console
-            console.error('Not found path for redirect in route:', route);
-            return null;
-        }
-        // Check already redirected
-        if (activePath !== to) {
-            return (React.createElement(react_router_1.Redirect, __assign({}, routeProps, { to: to }, route.componentProps)));
-        }
-    }
-    if (!route.component) {
-        return null;
-    }
-    var Component = route.component;
-    if (route.fetch) {
-        Component = hoc_1.fetch(route.fetch)(Component);
-    }
-    return (React.createElement(Component, __assign({}, routeProps, route.componentProps)));
-};
-// TODO @navigationHoc()
-function Router(props) {
-    var components = hooks_1.useComponents();
-    var _a = hooks_1.useSelector(function (state) {
-        var _a, _b;
-        return ({
-            isInitialized: router_2.isRouterInitialized(state),
-            pathname: get_1["default"](state, 'router.location.pathname'),
-            route: router_2.getRoute(state),
-            routeParams: state.router.params,
-            activePath: (_b = (_a = state.router) === null || _a === void 0 ? void 0 : _a.location) === null || _b === void 0 ? void 0 : _b.pathname,
-            activeRouteIds: router_2.getActiveRouteIds(state)
-        });
-    }), isInitialized = _a.isInitialized, pathname = _a.pathname, route = _a.route, routeParams = _a.routeParams, activePath = _a.activePath, activeRouteIds = _a.activeRouteIds;
-    var routeId = (route === null || route === void 0 ? void 0 : route.id) || null;
-    // Init routes in redux
-    var dispatch = useDispatch_1["default"]();
-    react_use_1.useEffectOnce(function () {
-        if (props.routes) {
-            dispatch(router_1.initRoutes(exports.walkRoutesRecursive(__assign({ id: 'root' }, props.routes), props.defaultRoles ? { roles: props.defaultRoles } : undefined)));
-        }
-    });
-    // Sync route params with redux
-    var prevRouteParams = react_use_1.usePrevious(routeParams);
-    react_1.useEffect(function () {
-        if (!isEqual_1["default"](prevRouteParams, routeParams)) {
-            dispatch(router_1.initParams(routeParams));
-        }
-    }, [dispatch, prevRouteParams, routeParams]);
-    // Routes state
-    var _b = react_1.useState(exports.treeToList(props.routes)), routes = _b[0], setRoutes = _b[1];
-    react_use_1.useUpdateEffect(function () {
-        setRoutes(props.routes);
-    }, [props.routes]);
-    // Fix end slash on switch to base route
-    react_use_1.useUpdateEffect(function () {
-        if (window.history && pathname === '/' && window.location.pathname.match(/\/$/)) {
-            window.history.replaceState({}, '', components.store.history.basename);
-        }
-    }, [components.store.history.basename, pathname]);
-    // Auto scroll to top
-    react_use_1.useUpdateEffect(function () {
-        if (props.autoScrollTop && routeId) {
-            window.scrollTo(0, 0);
-        }
-    }, [props.autoScrollTop, routeId]);
-    var renderItem = function (routeItem, routeProps) {
-        var children = null;
-        activeRouteIds.find(function (activeRouteId) {
-            if (activeRouteId === routeItem.id) {
-                // Stop
-                return true;
-            }
-            var activeRoute = routes.find(function (r) { return r.id === activeRouteId; });
-            children = renderComponent(activeRoute, activePath, __assign(__assign({}, routeProps), { children: children })) || children;
-            return false;
-        });
-        var result = renderComponent(routeItem, activePath, __assign(__assign({}, routeProps), { children: children }));
-        if (!result) {
-            // eslint-disable-next-line no-console
-            console.error('Not found component for route:', routeItem);
-        }
-        return result;
-    };
-    var renderContent = function () {
-        var WrapperComponent = props.wrapperView;
-        var routeNodes = (React.createElement(react_router_1.Switch, null,
-            routes.map(function (routeItem, index) { return (React.createElement(react_router_1.Route, __assign({ key: index, render: function (routeProps) { return renderItem(routeItem, routeProps); } }, routeItem, { component: null }))); }),
-            props.children));
-        if (WrapperComponent) {
-            return (React.createElement(WrapperComponent, __assign({}, props.wrapperProps), routeNodes));
-        }
-        return routeNodes;
-    };
-    if (!isInitialized) {
-        return null;
-    }
-    // TODO double render!!..
-    if (process.env.IS_SSR) {
-        return (React.createElement(SsrProvider_1.SsrProviderContext.Consumer, null, function (context) { return (React.createElement(react_router_1.StaticRouter, { location: components.store.history.location, context: context.staticContext }, renderContent())); }));
-    }
-    if (window.location.protocol === 'file:') {
-        return (React.createElement(react_router_dom_1.HashRouter, null, renderContent()));
-    }
-    return (React.createElement(connected_react_router_1.ConnectedRouter, { history: components.store.history }, renderContent()));
-}
-Router.defaultProps = {
-    autoScrollTop: true
-};
-exports["default"] = Router;
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+exports.treeToList = exports.walkRoutesRecursive = exports.ROUTER_ROLE_404 = exports.ROUTER_ROLE_MODAL = exports.ROUTER_ROLE_LOGIN = void 0;
+var React = __importStar(require("react"));
+var react_router_1 = require("react-router");
+var react_router_dom_1 = require("react-router-dom");
+var connected_react_router_1 = require("connected-react-router");
+var get_1 = __importDefault(require("lodash-es/get"));
+var isEqual_1 = __importDefault(require("lodash-es/isEqual"));
+var isArray_1 = __importDefault(require("lodash-es/isArray"));
+var isObject_1 = __importDefault(require("lodash-es/isObject"));
+var react_1 = require("react");
+var react_use_1 = require("react-use");
+var modal_1 = require("../../../actions/modal");
+var modal_2 = require("../../../reducers/modal");
+var hooks_1 = require("../../../hooks");
+var hoc_1 = require("../../../hoc");
+var router_1 = require("../../../actions/router");
+var useDispatch_1 = __importDefault(require("../../../hooks/useDispatch"));
+var router_2 = require("../../../reducers/router");
+var SsrProvider_1 = require("../../../providers/SsrProvider");
+exports.ROUTER_ROLE_LOGIN = 'login';
+exports.ROUTER_ROLE_MODAL = 'modal';
+exports.ROUTER_ROLE_404 = '404';
+var findRedirectPathRecursive = function (route) {
+    if (!route) {
+        return null;
+    }
+    if (typeof route.redirectTo === 'boolean') {
+        var key = isObject_1["default"](route.items) && !isArray_1["default"](route.items) ? Object.keys(route.items)[0] : '0';
+        return findRedirectPathRecursive(get_1["default"](route, ['items', key]));
+    }
+    if (typeof route.redirectTo === 'string') {
+        return route.redirectTo;
+    }
+    return route.path || route.path === ''
+        ? route.path
+        : null;
+};
+var walkRoutesRecursive = function (item, defaultItem, parentItem) {
+    if (defaultItem === void 0) { defaultItem = {}; }
+    if (parentItem === void 0) { parentItem = {}; }
+    var normalizedItem = __assign(__assign(__assign({}, defaultItem), item), { id: item.id, exact: item.exact, path: item.path && (item.path.indexOf('/') !== 0 && parentItem.path ? parentItem.path + '/' : '') + item.path, label: item.label, title: item.title, isVisible: typeof item.isVisible !== 'undefined'
+            ? item.isVisible
+            : (typeof parentItem.isVisible !== 'undefined'
+                ? parentItem.isVisible
+                : defaultItem.isVisible), isNavVisible: typeof item.isNavVisible !== 'undefined'
+            ? item.isNavVisible
+            : (typeof parentItem.isNavVisible !== 'undefined'
+                ? parentItem.isNavVisible
+                : defaultItem.isNavVisible), layout: item.layout || parentItem.layout || defaultItem.layout || null, roles: item.roles || parentItem.roles || defaultItem.roles || null, component: null, componentProps: null });
+    var items = null;
+    if (isArray_1["default"](item.items)) {
+        items = item.items.map(function (i) { return exports.walkRoutesRecursive(i, defaultItem, normalizedItem); });
+    }
+    else if (isObject_1["default"](item.items)) {
+        items = Object.keys(item.items)
+            .map(function (id) { return exports.walkRoutesRecursive(__assign(__assign({}, item.items[id]), { id: id }), defaultItem, normalizedItem); });
+    }
+    return __assign(__assign({}, normalizedItem), { items: items });
+};
+exports.walkRoutesRecursive = walkRoutesRecursive;
+var treeToList = function (item, isRoot) {
+    if (isRoot === void 0) { isRoot = true; }
+    if (isArray_1["default"](item)) {
+        return item;
+    }
+    if (isRoot && !item.id) {
+        item.id = 'root';
+    }
+    var items = item.path ? [item] : [];
+    if (isArray_1["default"](item.items)) {
+        item.items.forEach(function (sub) {
+            items = items.concat(exports.treeToList(sub, false));
+        });
+    }
+    else if (isObject_1["default"](item.items)) {
+        Object.keys(item.items).forEach(function (id) {
+            items = items.concat(exports.treeToList(__assign(__assign({}, item.items[id]), { id: id }), false));
+        });
+    }
+    return items;
+};
+exports.treeToList = treeToList;
+var renderComponent = function (route, activePath, routeProps) {
+    if (route.redirectTo && route.path === activePath) {
+        var to = findRedirectPathRecursive(route);
+        if (to === null) {
+            // eslint-disable-next-line no-console
+            console.error('Not found path for redirect in route:', route);
+            return null;
+        }
+        // Check already redirected
+        if (activePath !== to) {
+            return (React.createElement(react_router_1.Redirect, __assign({}, routeProps, { to: to }, route.componentProps)));
+        }
+    }
+    if (!route.component) {
+        return null;
+    }
+    var Component = route.component;
+    if (route.fetch) {
+        Component = hoc_1.fetch(route.fetch)(Component);
+    }
+    return (React.createElement(Component, __assign({}, routeProps, route.componentProps)));
+};
+function Router(props) {
+    var components = hooks_1.useComponents();
+    var _a = hooks_1.useSelector(function (state) {
+        var _a, _b;
+        return ({
+            isInitialized: router_2.isRouterInitialized(state),
+            pathname: get_1["default"](state, 'router.location.pathname'),
+            route: router_2.getRoute(state),
+            routeParams: state.router.params,
+            activePath: (_b = (_a = state.router) === null || _a === void 0 ? void 0 : _a.location) === null || _b === void 0 ? void 0 : _b.pathname,
+            activeRouteIds: router_2.getActiveRouteIds(state)
+        });
+    }), isInitialized = _a.isInitialized, pathname = _a.pathname, route = _a.route, routeParams = _a.routeParams, activePath = _a.activePath, activeRouteIds = _a.activeRouteIds;
+    var routeId = (route === null || route === void 0 ? void 0 : route.id) || null;
+    // Init routes in redux
+    var dispatch = useDispatch_1["default"]();
+    react_use_1.useEffectOnce(function () {
+        if (props.routes) {
+            dispatch(router_1.initRoutes(exports.walkRoutesRecursive(__assign({ id: 'root' }, props.routes), props.defaultRoles ? { roles: props.defaultRoles } : undefined)));
+        }
+    });
+    // Sync route params with redux
+    var prevRouteParams = react_use_1.usePrevious(routeParams);
+    react_1.useEffect(function () {
+        if (!isEqual_1["default"](prevRouteParams, routeParams)) {
+            dispatch(router_1.initParams(routeParams));
+        }
+    }, [dispatch, prevRouteParams, routeParams]);
+    // Routes state
+    var _b = react_1.useState(exports.treeToList(props.routes)), routes = _b[0], setRoutes = _b[1];
+    react_use_1.useUpdateEffect(function () {
+        setRoutes(props.routes);
+    }, [props.routes]);
+    // Fix end slash on switch to base route
+    react_use_1.useUpdateEffect(function () {
+        if (window.history && pathname === '/' && window.location.pathname.match(/\/$/)) {
+            window.history.replaceState({}, '', components.store.history.basename);
+        }
+    }, [components.store.history.basename, pathname]);
+    // Auto scroll to top
+    react_use_1.useUpdateEffect(function () {
+        if (props.autoScrollTop && routeId) {
+            window.scrollTo(0, 0);
+        }
+    }, [props.autoScrollTop, routeId]);
+    // Check to open/close modals
+    var prevRoute = react_use_1.usePrevious(route);
+    react_use_1.useUpdateEffect(function () {
+        var _a;
+        if ((prevRoute === null || prevRoute === void 0 ? void 0 : prevRoute.id) !== (route === null || route === void 0 ? void 0 : route.id)) {
+            if (prevRoute && prevRoute.role === exports.ROUTER_ROLE_MODAL) {
+                dispatch(modal_1.closeModal(prevRoute.id));
+            }
+            if (route && route.role === exports.ROUTER_ROLE_MODAL) {
+                var Component = (_a = routes.find(function (item) { return item.id === route.id; })) === null || _a === void 0 ? void 0 : _a.component;
+                if (Component) {
+                    dispatch(modal_1.openModal(Component, __assign({ modalId: route.id }, routeParams)));
+                }
+            }
+        }
+    }, [dispatch, prevRoute, route, routeParams, routes]);
+    // Check close modal - go to parent page
+    var openedModals = hooks_1.useSelector(function (state) { return modal_2.getOpened(state); });
+    var openedModalIds = react_1.useMemo(function () { return (openedModals || []).map(function (modal) { return modal.id; }); }, [openedModals]);
+    var prevOpenedModalIds = react_use_1.usePrevious(openedModalIds);
+    react_1.useEffect(function () {
+        if (prevOpenedModalIds !== openedModalIds && route && !openedModalIds.includes(route.id)
+            && route.role === exports.ROUTER_ROLE_MODAL) {
+            var parentRouteId = activeRouteIds.find(function (activeRouteId) {
+                var activeRoute = routes.find(function (routeItem) { return routeItem.id === activeRouteId; });
+                return activeRoute && activeRoute.role !== exports.ROUTER_ROLE_MODAL;
+            });
+            if (parentRouteId) {
+                // TODO route params?..
+                dispatch(router_1.goToRoute(parentRouteId));
+            }
+        }
+    });
+    var renderItem = function (routeItem, routeProps) {
+        var children = null;
+        activeRouteIds.find(function (activeRouteId) {
+            if (activeRouteId === routeItem.id) {
+                // Stop
+                return true;
+            }
+            var activeRoute = routes.find(function (r) { return r.id === activeRouteId; });
+            children = renderComponent(activeRoute, activePath, __assign(__assign({}, routeProps), { children: children })) || children;
+            return false;
+        });
+        var result = renderComponent(routeItem, activePath, __assign(__assign({}, routeProps), { children: children }));
+        if (!result) {
+            // eslint-disable-next-line no-console
+            console.error('Not found component for route:', routeItem);
+        }
+        return result;
+    };
+    var renderContent = function () {
+        var WrapperComponent = props.wrapperView;
+        var routeNodes = (React.createElement(react_router_1.Switch, null,
+            routes.map(function (routeItem, index) { return (React.createElement(react_router_1.Route, __assign({ key: index, render: function (routeProps) { return renderItem(routeItem, routeProps); } }, routeItem, { component: null }))); }),
+            props.children));
+        if (WrapperComponent) {
+            return (React.createElement(WrapperComponent, __assign({}, props.wrapperProps), routeNodes));
+        }
+        return routeNodes;
+    };
+    if (!isInitialized) {
+        return null;
+    }
+    if (process.env.IS_SSR) {
+        return (React.createElement(SsrProvider_1.SsrProviderContext.Consumer, null, function (context) { return (React.createElement(react_router_1.StaticRouter, { location: components.store.history.location, context: context.staticContext }, renderContent())); }));
+    }
+    if (window.location.protocol === 'file:') {
+        return (React.createElement(react_router_dom_1.HashRouter, null, renderContent()));
+    }
+    return (React.createElement(connected_react_router_1.ConnectedRouter, { history: components.store.history }, renderContent()));
+}
+Router.defaultProps = {
+    autoScrollTop: true
+};
+exports["default"] = Router;

package/dist/ui/nav/Router/index.d.ts

@@ -1,2 +1,2 @@
-import Router from './Router';
-export default Router;
+import Router from './Router';
+export default Router;

package/dist/ui/nav/Router/index.js

@@ -1,7 +1,7 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var Router_1 = __importDefault(require("./Router"));
-exports["default"] = Router_1["default"];
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var Router_1 = __importDefault(require("./Router"));
+exports["default"] = Router_1["default"];