@tramvai/module-router 2.40.0 → 2.44.2

package/README.md

@@ -268,7 +268,7 @@ const action = declareAction({
 
 ### Working with navigation in React components
 
-You can work with routing inside React components using hooks and components - `useNavigate`, `useRoute`, `Link` from the [@tinkoff/router](references/libs/router.md#интеграция-с-react)
+You can work with routing inside React components using hooks and components - `useNavigate` and `useRoute` from the [@tinkoff/router](references/libs/router.md#интеграция-с-react)
 
 <p>
 <details>
@@ -279,6 +279,53 @@ You can work with routing inside React components using hooks and components - `
 </details>
 </p>
 
+#### Link
+
+A wrapper for a react component that makes it clickable
+
+> If the react component is passed to the Link as children, then this passed component will be rendered and the `href`, `onClick` props will be passed as props to that component and they should be used to make the navigation. Otherwise, the `<a>` tag will be rendered with children as a child.
+> Your passed component need to be wrapped in the `forwardRef` for routes assets prefetching.
+
+```ts
+import { Link } from '@tramvai/module-router';
+import CustomLink from '@custom-scope/link';
+
+export const Component = () => {
+  return (
+    <Link url="/test/">
+      <CustomLink />
+    </Link>
+  );
+};
+
+export const WrapLink = () => {
+  return <Link url="/test/">Click me</Link>;
+};
+```
+
+##### Page resources prefetch
+
+`Link` component will try to prefetch resources for passed `url`, if this `url` is handled by the application router.
+
+It will help to make subsequent page-loads faster because target page assets already be saved in browser cache.
+
+How it works:
+
+- Component determines when it is in the viewport (using `Intersection Observer`)
+- waits until the browser is idle (using `requestIdleCallback`)
+- checks if the user isn't on a slow connection (using `navigator.connection.effectiveType`) or has data-saver enabled (using `navigator.connection.saveData`)
+- triggers page resources (js, css) prefetching
+
+Main reference for this feature - [quicklink](https://github.com/GoogleChromeLabs/quicklink) library.
+
+If you want to disable this behaviour, pass `prefetch={false}` property.
+
+```tsx
+export const WrapLink = () => {
+  return <Link url="/test/" prefetch={false}>Click me</Link>;
+};
+```
+
 ### How to set static routes
 
 [RouterModule](references/modules/router/base.md) allows you to add new routes when configuring your application. The second way is to pass static routes to DI via the `ROUTES_TOKEN` token.

package/__migrations__/1-link-from-module.js

@@ -0,0 +1,49 @@
+'use strict';
+
+var tslib = require('tslib');
+
+var _1LinkFromModule = (function (api) { return tslib.__awaiter(void 0, void 0, void 0, function () {
+    return tslib.__generator(this, function (_a) {
+        switch (_a.label) {
+            case 0: return [4 /*yield*/, api.transform(function (_a, _b, _c) {
+                    var source = _a.source;
+                    var j = _b.j;
+                    var printOptions = _c.printOptions;
+                    var parsed = j(source);
+                    var routerLibImport = parsed.find(j.ImportDeclaration, {
+                        source: { value: '@tinkoff/router' },
+                    });
+                    if (routerLibImport) {
+                        var linkImportSpecifier_1;
+                        routerLibImport.forEach(function (p) {
+                            var _a;
+                            (_a = p.node.specifiers) === null || _a === void 0 ? void 0 : _a.forEach(function (specifier) {
+                                if ('imported' in specifier && specifier.imported.name === 'Link') {
+                                    linkImportSpecifier_1 = specifier;
+                                }
+                            });
+                        });
+                        if (linkImportSpecifier_1) {
+                            routerLibImport.forEach(function (p) {
+                                var _a, _b;
+                                // eslint-disable-next-line no-param-reassign
+                                p.node.specifiers = (_a = p.node.specifiers) === null || _a === void 0 ? void 0 : _a.filter(function (specifier) {
+                                    return !('imported' in specifier && specifier.imported.name === 'Link');
+                                });
+                                if (((_b = p.node.specifiers) === null || _b === void 0 ? void 0 : _b.length) === 0) {
+                                    routerLibImport.remove();
+                                }
+                            });
+                            parsed.addImport(j.importDeclaration([linkImportSpecifier_1], j.stringLiteral('@tramvai/module-router')));
+                            return parsed.toSource(printOptions);
+                        }
+                    }
+                })];
+            case 1:
+                _a.sent();
+                return [2 /*return*/];
+        }
+    });
+}); });
+
+module.exports = _1LinkFromModule;

package/lib/components/link.d.ts

@@ -0,0 +1,19 @@
+interface Props {
+    children?: any;
+    url: string;
+    query?: Record<string, string>;
+    replace?: boolean;
+    target?: string;
+    onClick?: Function;
+    navigateOptions?: Record<string, any>;
+    /**
+     * @description enable or disable target page resources prefetching
+     * @default true
+     */
+    prefetch?: boolean;
+}
+declare function Link(props: Props): JSX.Element;
+declare namespace Link {
+    var displayName: string;
+}
+export { Link };

package/lib/hooks/usePageService.d.ts

@@ -0,0 +1,3 @@
+import type { ExtractDependencyType } from '@tinkoff/dippy';
+import { PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
+export declare const usePageService: () => ExtractDependencyType<typeof PAGE_SERVICE_TOKEN>;

package/lib/hooks/usePrefetch.browser.d.ts

@@ -0,0 +1,5 @@
+export declare const usePrefetch: ({ url, target, prefetch, }: {
+    url: string;
+    target: Element | null;
+    prefetch: boolean;
+}) => void;

package/lib/hooks/usePrefetch.d.ts

@@ -0,0 +1,5 @@
+export declare const usePrefetch: ({ url, target, prefetch, }: {
+    url: string;
+    target: Element | null;
+    prefetch: boolean;
+}) => void;

package/lib/index.browser.js

@@ -1,23 +1,27 @@
-import { provide, commandLineListTokens, Module, DI_TOKEN, COMMAND_LINE_RUNNER_TOKEN } from '@tramvai/core';
-import { Provider, setLogger, NoSpaRouter, Router } from '@tinkoff/router';
-export { Link, Provider, useNavigate, useRoute, useRouter, useUrl } from '@tinkoff/router';
+import { provide, commandLineListTokens, createToken as createToken$1, Module, DI_TOKEN, COMMAND_LINE_RUNNER_TOKEN } from '@tramvai/core';
+import { Provider, setLogger, NoSpaRouter, Router, useNavigate, useRoute } from '@tinkoff/router';
+export { Provider, useNavigate, useRoute, useRouter, useUrl } from '@tinkoff/router';
 import noop from '@tinkoff/utils/function/noop';
-import { LOGGER_TOKEN, BUNDLE_MANAGER_TOKEN, ACTION_REGISTRY_TOKEN, RESPONSE_MANAGER_TOKEN, DISPATCHER_CONTEXT_TOKEN, CONTEXT_TOKEN, COMPONENT_REGISTRY_TOKEN, COMBINE_REDUCERS, STORE_TOKEN, ACTION_PAGE_RUNNER_TOKEN } from '@tramvai/tokens-common';
-import { ROUTER_GUARD_TOKEN, ROUTE_TRANSFORM_TOKEN, ROUTER_TOKEN, ROUTES_TOKEN, ROUTE_RESOLVE_TOKEN, ROUTER_SPA_ACTIONS_RUN_MODE_TOKEN, PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
+import { LOGGER_TOKEN, BUNDLE_MANAGER_TOKEN, ACTION_REGISTRY_TOKEN, RESPONSE_MANAGER_TOKEN, DISPATCHER_TOKEN, DISPATCHER_CONTEXT_TOKEN, CONTEXT_TOKEN, COMPONENT_REGISTRY_TOKEN, COMBINE_REDUCERS, STORE_TOKEN, ACTION_PAGE_RUNNER_TOKEN } from '@tramvai/tokens-common';
+import { ROUTER_GUARD_TOKEN, PAGE_SERVICE_TOKEN, ROUTE_TRANSFORM_TOKEN, ROUTER_TOKEN, ROUTES_TOKEN, ROUTE_RESOLVE_TOKEN, ROUTER_SPA_ACTIONS_RUN_MODE_TOKEN, LINK_PREFETCH_MANAGER_TOKEN } from '@tramvai/tokens-router';
 export * from '@tramvai/tokens-router';
 import { EXTEND_RENDER, TRAMVAI_RENDER_MODE } from '@tramvai/tokens-render';
 import { createEvent, createReducer } from '@tramvai/state';
 import flatten from '@tinkoff/utils/array/flatten';
 import { createToken } from '@tinkoff/dippy';
+import isArray from '@tinkoff/utils/is/array';
+import { resolveLazyComponent, useDi } from '@tramvai/react';
 import identity from '@tinkoff/utils/function/identity';
 import compose from '@tinkoff/utils/function/compose';
 import replace from '@tinkoff/utils/string/replace';
 import { jsx } from 'react/jsx-runtime';
 import { isFileSystemPageComponent, fileSystemPagesEnabled, getStaticFileSystemPages, fileSystemPageToRoute } from '@tramvai/experiments';
+import { addQuery } from '@tinkoff/url';
 import uniq from '@tinkoff/utils/array/uniq';
 import { isRedirectFoundError, isNotFoundError } from '@tinkoff/errors';
 import { __decorate } from 'tslib';
 import { CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN } from '@tramvai/tokens-child-app';
+import { useEffect, useState, useCallback, isValidElement, cloneElement } from 'react';
 
 const setCurrentNavigation = createEvent('SET_CURRENT_ROUTE');
 const setUrlOnRehydrate = createEvent('SET_URL_ON_REHYDRATE');
@@ -64,7 +68,7 @@ const afterUpdateCurrentHooksToken = createToken('router afterUpdateCurrentHooks
 const routeTransformToken = createToken('router finalRouteTransform');
 createToken('router bundleInfoAdditional');
 
-const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, dispatcherContext, }) => {
+const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, dispatcher, dispatcherContext, pageService, }) => {
     const log = logger('route:load-bundles');
     return async ({ to }) => {
         var _a;
@@ -72,7 +76,7 @@ const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, di
             event: 'load-bundle',
             route: to,
         });
-        const { bundle, pageComponent } = to.config;
+        const { bundle, pageComponent, nestedLayoutComponent } = to.config;
         if (!bundleManager.has(bundle, pageComponent)) {
             log.info({
                 event: 'load-bundle-not-found',
@@ -87,12 +91,33 @@ const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, di
         // несмотря на наличие бандла в разметке, все равно мы должны дождаться
         // его загрузки перед рендером
         try {
-            const { components, reducers } = await bundleManager.get(bundle, pageComponent);
+            const promises = [];
+            // for file-system pages bundle is virtual, so it will be loaded in parallel with nested layout
+            // for classic bundles, page component will be loaded after bundle loading
+            promises.push(bundleManager.get(bundle, pageComponent));
+            if (nestedLayoutComponent) {
+                promises.push(resolveLazyComponent(pageService.resolveComponentFromConfig('nestedLayout')));
+            }
+            const [resolvedBundle, resolvedLayout] = await Promise.all(promises);
+            const { components, reducers } = resolvedBundle;
             const component = components[pageComponent];
             // pageComponent should have required fields even if it is lazy,
             // thanks to `git log 9466cb32bfb71ba49144ef839d3d5bce246e213c -L90,103:packages/modules/common/src/bundleManager/bundleManager.ts`
             (_a = component === null || component === void 0 ? void 0 : component.reducers) === null || _a === void 0 ? void 0 : _a.forEach((reducer) => dispatcherContext.getStore(reducer));
             reducers === null || reducers === void 0 ? void 0 : reducers.forEach((reducer) => dispatcherContext.getStore(reducer));
+            // @todo: reuse logic from bundleManager?
+            // register nested layout actions and reducers for current page
+            if (resolvedLayout) {
+                if ('actions' in resolvedLayout && isArray(resolvedLayout.actions)) {
+                    actionRegistry.add(pageComponent, resolvedLayout.actions);
+                }
+                if ('reducers' in resolvedLayout && isArray(resolvedLayout.reducers)) {
+                    resolvedLayout.reducers.forEach((reducer) => {
+                        dispatcher.registerStore(reducer);
+                        dispatcherContext.getStore(reducer);
+                    });
+                }
+            }
         }
         catch (error) {
             log.error({
@@ -128,7 +153,9 @@ const commonGuards = [
             bundleManager: BUNDLE_MANAGER_TOKEN,
             actionRegistry: ACTION_REGISTRY_TOKEN,
             responseManager: RESPONSE_MANAGER_TOKEN,
+            dispatcher: DISPATCHER_TOKEN,
             dispatcherContext: DISPATCHER_CONTEXT_TOKEN,
+            pageService: PAGE_SERVICE_TOKEN,
         },
     },
     {
@@ -430,6 +457,111 @@ const providers$1 = [
     },
 ];
 
+const PREFETCHED_LINKS_CACHE_TOKEN = createToken$1();
+const PREFETCHED_LINKS_QUEUE_TOKEN = createToken$1();
+const prefetchProviders = [
+    provide({
+        provide: PREFETCHED_LINKS_CACHE_TOKEN,
+        useValue: new Set(),
+    }),
+    provide({
+        provide: PREFETCHED_LINKS_QUEUE_TOKEN,
+        useFactory: () => {
+            let queue = Promise.resolve();
+            return {
+                add(run) {
+                    queue = queue.then(run);
+                    return queue;
+                },
+            };
+        },
+    }),
+    provide({
+        provide: LINK_PREFETCH_MANAGER_TOKEN,
+        useFactory: ({ router, routeTransform, routeResolve, componentRegistry, bundleManager, logger, prefetchedLinksCache, prefetchedLinksQueue, }) => {
+            const log = logger('link-prefetch-manager');
+            const prefetch = async (url) => {
+                // prefetch needed for cache assets by browser, so we want to prefetch resources for any page only once.
+                // cache will work only for SPA-router, but anyway resources loading deduplication logic already included in @loadable
+                if (prefetchedLinksCache.has(url)) {
+                    return;
+                }
+                prefetchedLinksCache.add(url);
+                log.info({ event: 'prefetch-route-init', url });
+                // first, try to find static or resolved dynamic route
+                let route = router.resolve(url);
+                // if route not found, try to resolve dynamic route,
+                // logic from `ROUTER_TOKEN` provider factory, without `router.addRoute` method call
+                if (!route && routeResolve) {
+                    // add query `prefetchRoute` to indicate to any `routeResolve` implementation
+                    // that this route request no need to be cached or have any personalization
+                    const parsedUrl = addQuery(url, { prefetchRoute: 'true' });
+                    route = await routeResolve({
+                        url: parsedUrl,
+                        type: 'navigate',
+                    });
+                    if (route) {
+                        route = routeTransform(route);
+                    }
+                }
+                if (!route) {
+                    log.info({ event: 'prefetch-route-not-found', url });
+                    return;
+                }
+                // @todo: очередь запросов!
+                // get name of everything what we need to prefetch,
+                // @loadable will load all scripts and styles for us
+                const { config: { pageComponent, bundle, nestedLayoutComponent }, } = route;
+                const promises = [];
+                // no need for bundle and page component actions amd reducers initialization,
+                // so copy only part of `modules/guards/common/loadBundle.ts` logic,
+                // all relative assets will be fetched
+                if (bundleManager.has(bundle, pageComponent)) {
+                    promises.push(bundleManager.get(bundle, pageComponent));
+                }
+                // no need for nestedLayoutComponent actions amd reducers initialization,
+                // so copy only part of `modules/guards/common/loadBundle.ts` logic,
+                // all relative assets will be fetched
+                if (nestedLayoutComponent) {
+                    promises.push(resolveLazyComponent(componentRegistry.get(nestedLayoutComponent, isFileSystemPageComponent(pageComponent) ? '__default' : bundle)));
+                }
+                await Promise.all(promises)
+                    .then(() => {
+                    log.info({ event: 'prefetch-route-success', url });
+                })
+                    .catch((error) => {
+                    log.warn({
+                        event: 'prefetch-fail',
+                        url,
+                        error,
+                    });
+                });
+            };
+            return {
+                prefetch: (url) => {
+                    // fetch assets sequentially
+                    return prefetchedLinksQueue.add(() => prefetch(url));
+                },
+            };
+        },
+        deps: {
+            router: ROUTER_TOKEN,
+            routeTransform: routeTransformToken,
+            routeResolve: {
+                token: ROUTE_RESOLVE_TOKEN,
+                optional: true,
+            },
+            componentRegistry: COMPONENT_REGISTRY_TOKEN,
+            bundleManager: BUNDLE_MANAGER_TOKEN,
+            logger: LOGGER_TOKEN,
+            prefetchedLinksCache: PREFETCHED_LINKS_CACHE_TOKEN,
+            prefetchedLinksQueue: PREFETCHED_LINKS_QUEUE_TOKEN,
+        },
+    }),
+];
+
+const clientTokens = [...prefetchProviders];
+
 const stopRunAtError = (error) => {
     if (isNotFoundError(error) || isRedirectFoundError(error)) {
         return true;
@@ -461,6 +593,7 @@ const runActionsFactory = ({ store, router, actionRegistry, actionPageRunner, })
 };
 
 const providers = [
+    ...clientTokens,
     ...providers$1,
     provide({
         provide: commandLineListTokens.customerStart,
@@ -529,7 +662,9 @@ const providers = [
                 // run navigation to current location.
                 if (renderMode === 'client' &&
                     (!currentRoute || (currentRoute && currentRoute.actualPath !== window.location.pathname))) {
-                    return router.navigate(window.location.href);
+                    // replace because otherwice we will push in the history the same url twice,
+                    // and history.back will return to the same url
+                    return router.navigate({ url: window.location.href, replace: true });
                 }
             };
         },
@@ -683,4 +818,102 @@ RouterChildAppModule = __decorate([
     })
 ], RouterChildAppModule);
 
-export { NoSpaRouterModule, RouterChildAppModule, RouterStore, SpaRouterModule, generateForRoot, setCurrentNavigation, setUrlOnRehydrate };
+const requestIdleCallback = window.requestIdleCallback ||
+    function (callback) {
+        return window.setTimeout(callback, 1);
+    };
+const cancelIdleCallback = window.cancelIdleCallback ||
+    function (timer) {
+        return window.clearTimeout(timer);
+    };
+
+const isUserNetworkConditionsSuitableForPrefetch = () => {
+    var _a;
+    const { saveData, effectiveType = '' } = (_a = navigator.connection) !== null && _a !== void 0 ? _a : {};
+    return !saveData && !(effectiveType === '2g' || effectiveType === 'slow-2g');
+};
+const usePrefetch = ({ url, target, prefetch, }) => {
+    const linkPrefetchManager = useDi(LINK_PREFETCH_MANAGER_TOKEN);
+    useEffect(() => {
+        if (!target || !prefetch) {
+            return;
+        }
+        let idleId = null;
+        const observer = new IntersectionObserver((entries) => {
+            entries.forEach((entry) => {
+                // when `Link` element in viewport
+                if (entry.isIntersecting && entry.intersectionRatio > 0) {
+                    // only once
+                    observer.disconnect();
+                    if (isUserNetworkConditionsSuitableForPrefetch()) {
+                        // trigger prefetching when browser is idle
+                        idleId = requestIdleCallback(() => {
+                            linkPrefetchManager.prefetch(url);
+                        });
+                    }
+                }
+            });
+        });
+        observer.observe(target);
+        return () => {
+            observer.disconnect();
+            cancelIdleCallback(idleId);
+        };
+    }, [url, target, prefetch, linkPrefetchManager]);
+};
+
+function Link(props) {
+    const { children, onClick, url, query, replace, target, navigateOptions, prefetch = true, ...otherProps } = props;
+    const navigate = useNavigate({ url, query, replace, ...navigateOptions });
+    const [linkElement, setLinkElement] = useState(null);
+    usePrefetch({
+        url,
+        prefetch,
+        target: linkElement,
+    });
+    const handleClick = useCallback((event) => {
+        // ignores the navigation when clicked using right mouse button or
+        // by holding a special modifier key: ctrl, command, win, alt, shift
+        if (target ||
+            event.ctrlKey ||
+            event.metaKey ||
+            event.altKey ||
+            event.shiftKey ||
+            event.button !== 0) {
+            return;
+        }
+        event.preventDefault();
+        navigate();
+        onClick && onClick(event);
+    }, [navigate, target, onClick]);
+    const extraProps = { href: url, onClick: handleClick, target };
+    if (isValidElement(children)) {
+        return cloneElement(children, {
+            // @ts-expect-error
+            ref: (element) => {
+                // @ts-expect-error
+                const { ref } = children;
+                // preserve original ref
+                if (typeof ref === 'function') {
+                    ref(element);
+                }
+                else if (typeof ref === 'object' && ref !== null) {
+                    ref.current = element;
+                }
+                setLinkElement(element);
+            },
+            ...extraProps,
+        });
+    }
+    return (
+    // eslint-disable-next-line react/jsx-props-no-spreading
+    jsx("a", { ref: (element) => setLinkElement(element), ...otherProps, ...extraProps, children: children }));
+}
+Link.displayName = 'Link';
+
+const usePageService = () => {
+    useRoute();
+    return useDi(PAGE_SERVICE_TOKEN);
+};
+
+export { Link, NoSpaRouterModule, RouterChildAppModule, RouterStore, SpaRouterModule, generateForRoot, setCurrentNavigation, setUrlOnRehydrate, usePageService };

package/lib/index.d.ts

@@ -1,6 +1,27 @@
 export { NoSpaRouterModule, SpaRouterModule } from './modules/server';
 export { RouterChildAppModule } from './modules/child-app';
-export { Provider, useNavigate, useRoute, useRouter, useUrl, Link } from '@tinkoff/router';
+export { Provider, useNavigate, useRoute, useRouter, useUrl } from '@tinkoff/router';
+export { Link } from './components/link';
 export * from '@tramvai/tokens-router';
 export { generateForRoot } from './modules/utils/forRoot';
 export * from './stores/RouterStore';
+export * from './hooks/usePageService';
+type RouteConfig = {
+    [key: string]: any;
+    bundle?: string;
+    pageComponent?: string;
+    layoutComponent?: string;
+    nestedLayoutComponent?: string;
+    errorBoundaryComponent?: string;
+    meta?: {
+        seo?: {
+            metaTags?: Record<string, any>;
+            shareSchema?: Record<string, any>;
+        };
+    };
+};
+declare module '@tramvai/react' {
+    interface PageComponentOptions {
+        routeConfig?: RouteConfig;
+    }
+}

package/lib/index.es.js

@@ -1,13 +1,15 @@
 import { __decorate } from 'tslib';
 import { provide, commandLineListTokens, Module } from '@tramvai/core';
-import { Provider, setLogger, isWildcard, isHistoryFallback, Router } from '@tinkoff/router';
-export { Link, Provider, useNavigate, useRoute, useRouter, useUrl } from '@tinkoff/router';
-import { LOGGER_TOKEN, BUNDLE_MANAGER_TOKEN, ACTION_REGISTRY_TOKEN, RESPONSE_MANAGER_TOKEN, DISPATCHER_CONTEXT_TOKEN, CONTEXT_TOKEN, COMPONENT_REGISTRY_TOKEN, COMBINE_REDUCERS, REQUEST_MANAGER_TOKEN, STORE_TOKEN, ACTION_PAGE_RUNNER_TOKEN } from '@tramvai/tokens-common';
-import { ROUTER_GUARD_TOKEN, ROUTE_TRANSFORM_TOKEN, ROUTER_TOKEN, ROUTES_TOKEN, ROUTE_RESOLVE_TOKEN, ROUTER_SPA_ACTIONS_RUN_MODE_TOKEN, PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
+import { Provider, setLogger, isWildcard, isHistoryFallback, Router, useNavigate, useRoute } from '@tinkoff/router';
+export { Provider, useNavigate, useRoute, useRouter, useUrl } from '@tinkoff/router';
+import { LOGGER_TOKEN, BUNDLE_MANAGER_TOKEN, ACTION_REGISTRY_TOKEN, RESPONSE_MANAGER_TOKEN, DISPATCHER_TOKEN, DISPATCHER_CONTEXT_TOKEN, CONTEXT_TOKEN, COMPONENT_REGISTRY_TOKEN, COMBINE_REDUCERS, REQUEST_MANAGER_TOKEN, STORE_TOKEN, ACTION_PAGE_RUNNER_TOKEN } from '@tramvai/tokens-common';
+import { ROUTER_GUARD_TOKEN, PAGE_SERVICE_TOKEN, ROUTE_TRANSFORM_TOKEN, ROUTER_TOKEN, ROUTES_TOKEN, ROUTE_RESOLVE_TOKEN, ROUTER_SPA_ACTIONS_RUN_MODE_TOKEN, LINK_PREFETCH_MANAGER_TOKEN } from '@tramvai/tokens-router';
 export * from '@tramvai/tokens-router';
 import flatten from '@tinkoff/utils/array/flatten';
 import { createToken } from '@tinkoff/dippy';
 import { createEvent, createReducer } from '@tramvai/state';
+import isArray from '@tinkoff/utils/is/array';
+import { resolveLazyComponent, useDi } from '@tramvai/react';
 import { EXTEND_RENDER } from '@tramvai/tokens-render';
 import identity from '@tinkoff/utils/function/identity';
 import compose from '@tinkoff/utils/function/compose';
@@ -20,6 +22,7 @@ import { SERVER_MODULE_PAPI_PUBLIC_ROUTE } from '@tramvai/tokens-server';
 import prop from '@tinkoff/utils/object/prop';
 import { createPapiMethod } from '@tramvai/papi';
 import { CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN } from '@tramvai/tokens-child-app';
+import { useState, useCallback, isValidElement, cloneElement } from 'react';
 
 const routerClassToken = createToken('router routerClassToken');
 const additionalRouterParameters = createToken('router additionalParameters');
@@ -66,7 +69,7 @@ const RouterStore = createReducer('router', initialState)
     };
 });
 
-const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, dispatcherContext, }) => {
+const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, dispatcher, dispatcherContext, pageService, }) => {
     const log = logger('route:load-bundles');
     return async ({ to }) => {
         var _a;
@@ -74,7 +77,7 @@ const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, di
             event: 'load-bundle',
             route: to,
         });
-        const { bundle, pageComponent } = to.config;
+        const { bundle, pageComponent, nestedLayoutComponent } = to.config;
         if (!bundleManager.has(bundle, pageComponent)) {
             log.info({
                 event: 'load-bundle-not-found',
@@ -89,12 +92,33 @@ const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, di
         // несмотря на наличие бандла в разметке, все равно мы должны дождаться
         // его загрузки перед рендером
         try {
-            const { components, reducers } = await bundleManager.get(bundle, pageComponent);
+            const promises = [];
+            // for file-system pages bundle is virtual, so it will be loaded in parallel with nested layout
+            // for classic bundles, page component will be loaded after bundle loading
+            promises.push(bundleManager.get(bundle, pageComponent));
+            if (nestedLayoutComponent) {
+                promises.push(resolveLazyComponent(pageService.resolveComponentFromConfig('nestedLayout')));
+            }
+            const [resolvedBundle, resolvedLayout] = await Promise.all(promises);
+            const { components, reducers } = resolvedBundle;
             const component = components[pageComponent];
             // pageComponent should have required fields even if it is lazy,
             // thanks to `git log 9466cb32bfb71ba49144ef839d3d5bce246e213c -L90,103:packages/modules/common/src/bundleManager/bundleManager.ts`
             (_a = component === null || component === void 0 ? void 0 : component.reducers) === null || _a === void 0 ? void 0 : _a.forEach((reducer) => dispatcherContext.getStore(reducer));
             reducers === null || reducers === void 0 ? void 0 : reducers.forEach((reducer) => dispatcherContext.getStore(reducer));
+            // @todo: reuse logic from bundleManager?
+            // register nested layout actions and reducers for current page
+            if (resolvedLayout) {
+                if ('actions' in resolvedLayout && isArray(resolvedLayout.actions)) {
+                    actionRegistry.add(pageComponent, resolvedLayout.actions);
+                }
+                if ('reducers' in resolvedLayout && isArray(resolvedLayout.reducers)) {
+                    resolvedLayout.reducers.forEach((reducer) => {
+                        dispatcher.registerStore(reducer);
+                        dispatcherContext.getStore(reducer);
+                    });
+                }
+            }
         }
         catch (error) {
             log.error({
@@ -130,7 +154,9 @@ const commonGuards = [
             bundleManager: BUNDLE_MANAGER_TOKEN,
             actionRegistry: ACTION_REGISTRY_TOKEN,
             responseManager: RESPONSE_MANAGER_TOKEN,
+            dispatcher: DISPATCHER_TOKEN,
             dispatcherContext: DISPATCHER_CONTEXT_TOKEN,
+            pageService: PAGE_SERVICE_TOKEN,
         },
     },
     {
@@ -573,6 +599,17 @@ const bundleInfoPapi = createPapiMethod({
     },
 });
 
+// do nothing on server side
+const prefetchManager = {
+    prefetch: async (url) => { },
+};
+const prefetchProviders = [
+    provide({
+        provide: LINK_PREFETCH_MANAGER_TOKEN,
+        useValue: prefetchManager,
+    }),
+];
+
 const serverTokens = [
     {
         provide: additionalRouterParameters,
@@ -587,6 +624,7 @@ const serverTokens = [
         multi: true,
         useValue: bundleInfoPapi,
     },
+    ...prefetchProviders,
 ];
 
 const generateForRoot = (mainModule) => {
@@ -675,4 +713,53 @@ RouterChildAppModule = __decorate([
     })
 ], RouterChildAppModule);
 
-export { NoSpaRouterModule, RouterChildAppModule, RouterStore, SpaRouterModule, generateForRoot, setCurrentNavigation, setUrlOnRehydrate };
+function Link(props) {
+    const { children, onClick, url, query, replace, target, navigateOptions, prefetch = true, ...otherProps } = props;
+    const navigate = useNavigate({ url, query, replace, ...navigateOptions });
+    const [linkElement, setLinkElement] = useState(null);
+    const handleClick = useCallback((event) => {
+        // ignores the navigation when clicked using right mouse button or
+        // by holding a special modifier key: ctrl, command, win, alt, shift
+        if (target ||
+            event.ctrlKey ||
+            event.metaKey ||
+            event.altKey ||
+            event.shiftKey ||
+            event.button !== 0) {
+            return;
+        }
+        event.preventDefault();
+        navigate();
+        onClick && onClick(event);
+    }, [navigate, target, onClick]);
+    const extraProps = { href: url, onClick: handleClick, target };
+    if (isValidElement(children)) {
+        return cloneElement(children, {
+            // @ts-expect-error
+            ref: (element) => {
+                // @ts-expect-error
+                const { ref } = children;
+                // preserve original ref
+                if (typeof ref === 'function') {
+                    ref(element);
+                }
+                else if (typeof ref === 'object' && ref !== null) {
+                    ref.current = element;
+                }
+                setLinkElement(element);
+            },
+            ...extraProps,
+        });
+    }
+    return (
+    // eslint-disable-next-line react/jsx-props-no-spreading
+    jsx("a", { ref: (element) => setLinkElement(element), ...otherProps, ...extraProps, children: children }));
+}
+Link.displayName = 'Link';
+
+const usePageService = () => {
+    useRoute();
+    return useDi(PAGE_SERVICE_TOKEN);
+};
+
+export { Link, NoSpaRouterModule, RouterChildAppModule, RouterStore, SpaRouterModule, generateForRoot, setCurrentNavigation, setUrlOnRehydrate, usePageService };

package/lib/index.js

@@ -10,6 +10,8 @@ var tokensRouter = require('@tramvai/tokens-router');
 var flatten = require('@tinkoff/utils/array/flatten');
 var dippy = require('@tinkoff/dippy');
 var state = require('@tramvai/state');
+var isArray = require('@tinkoff/utils/is/array');
+var react = require('@tramvai/react');
 var tokensRender = require('@tramvai/tokens-render');
 var identity = require('@tinkoff/utils/function/identity');
 var compose = require('@tinkoff/utils/function/compose');
@@ -22,10 +24,12 @@ var tokensServer = require('@tramvai/tokens-server');
 var prop = require('@tinkoff/utils/object/prop');
 var papi = require('@tramvai/papi');
 var tokensChildApp = require('@tramvai/tokens-child-app');
+var react$1 = require('react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var flatten__default = /*#__PURE__*/_interopDefaultLegacy(flatten);
+var isArray__default = /*#__PURE__*/_interopDefaultLegacy(isArray);
 var identity__default = /*#__PURE__*/_interopDefaultLegacy(identity);
 var compose__default = /*#__PURE__*/_interopDefaultLegacy(compose);
 var replace__default = /*#__PURE__*/_interopDefaultLegacy(replace);
@@ -77,7 +81,7 @@ const RouterStore = state.createReducer('router', initialState)
     };
 });
 
-const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, dispatcherContext, }) => {
+const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, dispatcher, dispatcherContext, pageService, }) => {
     const log = logger('route:load-bundles');
     return async ({ to }) => {
         var _a;
@@ -85,7 +89,7 @@ const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, di
             event: 'load-bundle',
             route: to,
         });
-        const { bundle, pageComponent } = to.config;
+        const { bundle, pageComponent, nestedLayoutComponent } = to.config;
         if (!bundleManager.has(bundle, pageComponent)) {
             log.info({
                 event: 'load-bundle-not-found',
@@ -100,12 +104,33 @@ const loadBundle = ({ bundleManager, logger, actionRegistry, responseManager, di
         // несмотря на наличие бандла в разметке, все равно мы должны дождаться
         // его загрузки перед рендером
         try {
-            const { components, reducers } = await bundleManager.get(bundle, pageComponent);
+            const promises = [];
+            // for file-system pages bundle is virtual, so it will be loaded in parallel with nested layout
+            // for classic bundles, page component will be loaded after bundle loading
+            promises.push(bundleManager.get(bundle, pageComponent));
+            if (nestedLayoutComponent) {
+                promises.push(react.resolveLazyComponent(pageService.resolveComponentFromConfig('nestedLayout')));
+            }
+            const [resolvedBundle, resolvedLayout] = await Promise.all(promises);
+            const { components, reducers } = resolvedBundle;
             const component = components[pageComponent];
             // pageComponent should have required fields even if it is lazy,
             // thanks to `git log 9466cb32bfb71ba49144ef839d3d5bce246e213c -L90,103:packages/modules/common/src/bundleManager/bundleManager.ts`
             (_a = component === null || component === void 0 ? void 0 : component.reducers) === null || _a === void 0 ? void 0 : _a.forEach((reducer) => dispatcherContext.getStore(reducer));
             reducers === null || reducers === void 0 ? void 0 : reducers.forEach((reducer) => dispatcherContext.getStore(reducer));
+            // @todo: reuse logic from bundleManager?
+            // register nested layout actions and reducers for current page
+            if (resolvedLayout) {
+                if ('actions' in resolvedLayout && isArray__default["default"](resolvedLayout.actions)) {
+                    actionRegistry.add(pageComponent, resolvedLayout.actions);
+                }
+                if ('reducers' in resolvedLayout && isArray__default["default"](resolvedLayout.reducers)) {
+                    resolvedLayout.reducers.forEach((reducer) => {
+                        dispatcher.registerStore(reducer);
+                        dispatcherContext.getStore(reducer);
+                    });
+                }
+            }
         }
         catch (error) {
             log.error({
@@ -141,7 +166,9 @@ const commonGuards = [
             bundleManager: tokensCommon.BUNDLE_MANAGER_TOKEN,
             actionRegistry: tokensCommon.ACTION_REGISTRY_TOKEN,
             responseManager: tokensCommon.RESPONSE_MANAGER_TOKEN,
+            dispatcher: tokensCommon.DISPATCHER_TOKEN,
             dispatcherContext: tokensCommon.DISPATCHER_CONTEXT_TOKEN,
+            pageService: tokensRouter.PAGE_SERVICE_TOKEN,
         },
     },
     {
@@ -584,6 +611,17 @@ const bundleInfoPapi = papi.createPapiMethod({
     },
 });
 
+// do nothing on server side
+const prefetchManager = {
+    prefetch: async (url) => { },
+};
+const prefetchProviders = [
+    core.provide({
+        provide: tokensRouter.LINK_PREFETCH_MANAGER_TOKEN,
+        useValue: prefetchManager,
+    }),
+];
+
 const serverTokens = [
     {
         provide: additionalRouterParameters,
@@ -598,6 +636,7 @@ const serverTokens = [
         multi: true,
         useValue: bundleInfoPapi,
     },
+    ...prefetchProviders,
 ];
 
 const generateForRoot = (mainModule) => {
@@ -686,10 +725,55 @@ exports.RouterChildAppModule = tslib.__decorate([
     })
 ], exports.RouterChildAppModule);
 
-Object.defineProperty(exports, 'Link', {
-    enumerable: true,
-    get: function () { return router.Link; }
-});
+function Link(props) {
+    const { children, onClick, url, query, replace, target, navigateOptions, prefetch = true, ...otherProps } = props;
+    const navigate = router.useNavigate({ url, query, replace, ...navigateOptions });
+    const [linkElement, setLinkElement] = react$1.useState(null);
+    const handleClick = react$1.useCallback((event) => {
+        // ignores the navigation when clicked using right mouse button or
+        // by holding a special modifier key: ctrl, command, win, alt, shift
+        if (target ||
+            event.ctrlKey ||
+            event.metaKey ||
+            event.altKey ||
+            event.shiftKey ||
+            event.button !== 0) {
+            return;
+        }
+        event.preventDefault();
+        navigate();
+        onClick && onClick(event);
+    }, [navigate, target, onClick]);
+    const extraProps = { href: url, onClick: handleClick, target };
+    if (react$1.isValidElement(children)) {
+        return react$1.cloneElement(children, {
+            // @ts-expect-error
+            ref: (element) => {
+                // @ts-expect-error
+                const { ref } = children;
+                // preserve original ref
+                if (typeof ref === 'function') {
+                    ref(element);
+                }
+                else if (typeof ref === 'object' && ref !== null) {
+                    ref.current = element;
+                }
+                setLinkElement(element);
+            },
+            ...extraProps,
+        });
+    }
+    return (
+    // eslint-disable-next-line react/jsx-props-no-spreading
+    jsxRuntime.jsx("a", { ref: (element) => setLinkElement(element), ...otherProps, ...extraProps, children: children }));
+}
+Link.displayName = 'Link';
+
+const usePageService = () => {
+    router.useRoute();
+    return react.useDi(tokensRouter.PAGE_SERVICE_TOKEN);
+};
+
 Object.defineProperty(exports, 'Provider', {
     enumerable: true,
     get: function () { return router.Provider; }
@@ -710,11 +794,13 @@ Object.defineProperty(exports, 'useUrl', {
     enumerable: true,
     get: function () { return router.useUrl; }
 });
+exports.Link = Link;
 exports.RouterStore = RouterStore;
 exports.SpaRouterModule = SpaRouterModule;
 exports.generateForRoot = generateForRoot;
 exports.setCurrentNavigation = setCurrentNavigation;
 exports.setUrlOnRehydrate = setUrlOnRehydrate;
+exports.usePageService = usePageService;
 Object.keys(tokensRouter).forEach(function (k) {
     if (k !== 'default' && !exports.hasOwnProperty(k)) Object.defineProperty(exports, k, {
         enumerable: true,

package/lib/modules/guards/common/loadBundle.d.ts

@@ -1,9 +1,12 @@
 import type { NavigationGuard } from '@tinkoff/router';
-import type { BUNDLE_MANAGER_TOKEN, ACTION_REGISTRY_TOKEN, LOGGER_TOKEN, RESPONSE_MANAGER_TOKEN, DISPATCHER_CONTEXT_TOKEN } from '@tramvai/tokens-common';
-export declare const loadBundle: ({ bundleManager, logger, actionRegistry, responseManager, dispatcherContext, }: {
+import type { BUNDLE_MANAGER_TOKEN, ACTION_REGISTRY_TOKEN, LOGGER_TOKEN, RESPONSE_MANAGER_TOKEN, DISPATCHER_CONTEXT_TOKEN, DISPATCHER_TOKEN } from '@tramvai/tokens-common';
+import type { PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
+export declare const loadBundle: ({ bundleManager, logger, actionRegistry, responseManager, dispatcher, dispatcherContext, pageService, }: {
     bundleManager: typeof BUNDLE_MANAGER_TOKEN;
     logger: typeof LOGGER_TOKEN;
     actionRegistry: typeof ACTION_REGISTRY_TOKEN;
     responseManager: typeof RESPONSE_MANAGER_TOKEN;
+    dispatcher: typeof DISPATCHER_TOKEN;
     dispatcherContext: typeof DISPATCHER_CONTEXT_TOKEN;
+    pageService: typeof PAGE_SERVICE_TOKEN;
 }) => NavigationGuard;

package/lib/modules/tokens/browser/index.d.ts

@@ -0,0 +1,19 @@
+export declare const clientTokens: (import("@tinkoff/dippy").Provider<unknown, Set<string>> | import("@tinkoff/dippy").Provider<unknown, {
+    add(run: () => Promise<void>): Promise<void>;
+}> | import("@tinkoff/dippy").Provider<{
+    router: import("@tinkoff/dippy").BaseTokenInterface<import("@tinkoff/router").AbstractRouter>;
+    routeTransform: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-router").RouteTransform>;
+    routeResolve: {
+        token: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-router").RouteResolve>;
+        optional: boolean;
+    };
+    componentRegistry: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-common").ComponentRegistry>;
+    bundleManager: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-common").BundleManager>;
+    logger: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-common").LoggerFactory>;
+    prefetchedLinksCache: import("@tinkoff/dippy").BaseTokenInterface<Set<string>>;
+    prefetchedLinksQueue: import("@tinkoff/dippy").BaseTokenInterface<{
+        add(run: () => Promise<void>): Promise<void>;
+    }>;
+}, {
+    prefetch: (url: string) => Promise<void>;
+}>)[];

package/lib/modules/tokens/browser/prefetch.d.ts

@@ -0,0 +1,19 @@
+export declare const prefetchProviders: (import("@tramvai/core").Provider<unknown, Set<string>> | import("@tramvai/core").Provider<unknown, {
+    add(run: () => Promise<void>): Promise<void>;
+}> | import("@tramvai/core").Provider<{
+    router: import("@tinkoff/dippy").BaseTokenInterface<import("@tinkoff/router").AbstractRouter>;
+    routeTransform: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-router").RouteTransform>;
+    routeResolve: {
+        token: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-router").RouteResolve>;
+        optional: boolean;
+    };
+    componentRegistry: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-common").ComponentRegistry>;
+    bundleManager: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-common").BundleManager>;
+    logger: import("@tinkoff/dippy").BaseTokenInterface<import("@tramvai/tokens-common").LoggerFactory>;
+    prefetchedLinksCache: import("@tinkoff/dippy").BaseTokenInterface<Set<string>>;
+    prefetchedLinksQueue: import("@tinkoff/dippy").BaseTokenInterface<{
+        add(run: () => Promise<void>): Promise<void>;
+    }>;
+}, {
+    prefetch: (url: string) => Promise<void>;
+}>)[];

package/lib/modules/tokens/server/prefetch.d.ts

@@ -0,0 +1,3 @@
+export declare const prefetchProviders: import("@tramvai/core").Provider<unknown, {
+    prefetch: (url: string) => Promise<void>;
+}>[];

package/lib/modules/tokens/server/routerOptions.d.ts

@@ -1,6 +1,6 @@
 import type { REQUEST_MANAGER_TOKEN, RESPONSE_MANAGER_TOKEN } from '@tramvai/tokens-common';
 import type { Router } from '@tinkoff/router';
-declare type RouterOptions = Pick<ConstructorParameters<typeof Router>[0], 'onRedirect' | 'onNotFound' | 'onBlock' | 'defaultRedirectCode'>;
+type RouterOptions = Pick<ConstructorParameters<typeof Router>[0], 'onRedirect' | 'onNotFound' | 'onBlock' | 'defaultRedirectCode'>;
 export declare const routerOptions: ({ requestManager, responseManager, }: {
     requestManager: typeof REQUEST_MANAGER_TOKEN;
     responseManager: typeof RESPONSE_MANAGER_TOKEN;

package/lib/modules/utils/forRoot.d.ts

@@ -1,7 +1,7 @@
 import type { Provider } from '@tinkoff/dippy';
 import type { Route } from '@tinkoff/router';
 import { ROUTER_SPA_ACTIONS_RUN_MODE_TOKEN } from '@tramvai/tokens-router';
-declare type ForRoot<T = any> = (routes: Route[], options?: {
+type ForRoot<T = any> = (routes: Route[], options?: {
     spaActionsMode?: typeof ROUTER_SPA_ACTIONS_RUN_MODE_TOKEN;
 }) => {
     mainModule: T;

package/lib/services/page.d.ts

@@ -1,8 +1,8 @@
 import type { Url } from '@tinkoff/url';
 import type { NavigationRoute, NavigateOptions, UpdateCurrentRouteOptions, HistoryOptions } from '@tinkoff/router';
 import type { TramvaiComponent } from '@tramvai/react';
-import type { PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
-declare type PageServiceInterface = typeof PAGE_SERVICE_TOKEN;
+import type { PageServiceComponentType, PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
+type PageServiceInterface = typeof PAGE_SERVICE_TOKEN;
 export declare class PageService implements PageServiceInterface {
     private router;
     private componentRegistry;
@@ -22,7 +22,7 @@ export declare class PageService implements PageServiceInterface {
     go(to: number, options?: HistoryOptions): Promise<void>;
     addComponent(name: string, component: TramvaiComponent): void;
     getComponent(name: string): TramvaiComponent | undefined;
-    resolveComponentFromConfig(property: 'page' | 'layout' | 'header' | 'footer' | 'errorBoundary'): TramvaiComponent;
+    resolveComponentFromConfig(property: PageServiceComponentType): TramvaiComponent;
     private getComponentsGroupName;
 }
 export {};

package/lib/test/unit/guard.d.ts

@@ -1,6 +1,6 @@
 import type { AbstractRouter } from '@tinkoff/router';
 import { getDiWrapper } from '@tramvai/test-helpers';
-declare type Options = Parameters<typeof getDiWrapper>[0] & {
+type Options = Parameters<typeof getDiWrapper>[0] & {
     router?: AbstractRouter;
 };
 export declare const testGuard: (options: Options) => {

package/lib/utils/requestIdleCallback.d.ts

@@ -0,0 +1,2 @@
+export declare const requestIdleCallback: (((callback: IdleRequestCallback, options?: IdleRequestOptions) => number) & typeof globalThis.requestIdleCallback) | ((callback: () => void) => number);
+export declare const cancelIdleCallback: ((handle: number) => void) & typeof globalThis.cancelIdleCallback;

package/package.json

@@ -1,17 +1,19 @@
 {
   "name": "@tramvai/module-router",
-  "version": "2.40.0",
+  "version": "2.44.2",
   "description": "",
   "main": "lib/index.js",
   "browser": {
     "./lib/modules/server.js": "./lib/modules/browser.js",
+    "./lib/hooks/usePrefetch.js": "./lib/hooks/usePrefetch.browser.js",
     "./lib/index.es.js": "./lib/index.browser.js"
   },
   "typings": "lib/index.d.ts",
   "files": [
     "lib",
     "tests.js",
-    "tests.d.ts"
+    "tests.d.ts",
+    "__migrations__"
   ],
   "sideEffects": false,
   "repository": {
@@ -25,25 +27,26 @@
   },
   "dependencies": {
     "@tinkoff/errors": "0.3.5",
-    "@tinkoff/router": "0.2.4",
+    "@tinkoff/router": "0.2.5",
     "@tinkoff/url": "0.8.4",
-    "@tramvai/tokens-child-app": "2.40.0",
-    "@tramvai/tokens-render": "2.40.0",
-    "@tramvai/tokens-router": "2.40.0",
-    "@tramvai/tokens-server": "2.40.0",
-    "@tramvai/experiments": "2.40.0"
+    "@tramvai/react": "2.44.2",
+    "@tramvai/tokens-child-app": "2.44.2",
+    "@tramvai/tokens-render": "2.44.2",
+    "@tramvai/tokens-router": "2.44.2",
+    "@tramvai/tokens-server": "2.44.2",
+    "@tramvai/experiments": "2.44.2"
   },
   "peerDependencies": {
     "@tinkoff/utils": "^2.1.2",
-    "@tramvai/cli": "2.40.0",
-    "@tramvai/core": "2.40.0",
-    "@tramvai/module-log": "2.40.0",
-    "@tramvai/module-server": "2.40.0",
-    "@tramvai/papi": "2.40.0",
-    "@tramvai/state": "2.40.0",
-    "@tramvai/test-helpers": "2.40.0",
-    "@tramvai/test-mocks": "2.40.0",
-    "@tramvai/tokens-common": "2.40.0",
+    "@tramvai/cli": "2.44.2",
+    "@tramvai/core": "2.44.2",
+    "@tramvai/module-log": "2.44.2",
+    "@tramvai/module-server": "2.44.2",
+    "@tramvai/papi": "2.44.2",
+    "@tramvai/state": "2.44.2",
+    "@tramvai/test-helpers": "2.44.2",
+    "@tramvai/test-mocks": "2.44.2",
+    "@tramvai/tokens-common": "2.44.2",
     "@tinkoff/dippy": "0.8.9",
     "react": "*",
     "tslib": "^2.4.0"