@tramvai/react 2.70.0 → 2.72.0

package/lib/di/context.es.js

@@ -0,0 +1,5 @@
+import { createContext } from 'react';
+
+const DIContext = createContext(null);
+
+export { DIContext };

package/lib/di/context.js

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+
+const DIContext = react.createContext(null);
+
+exports.DIContext = DIContext;

package/lib/di/hoc.es.js

@@ -0,0 +1,14 @@
+import { jsx } from 'react/jsx-runtime';
+import hoistStatics from 'hoist-non-react-statics';
+import { useDi } from './hooks.es.js';
+
+const withDi = (deps) => (WrappedComponent) => {
+    function WrapperWithPropsFromDi(props) {
+        const depsInstance = useDi(deps);
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        return jsx(WrappedComponent, { ...props, ...depsInstance });
+    }
+    return hoistStatics(WrapperWithPropsFromDi, WrappedComponent);
+};
+
+export { withDi };

package/lib/di/hoc.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var hoistStatics = require('hoist-non-react-statics');
+var hooks = require('./hooks.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var hoistStatics__default = /*#__PURE__*/_interopDefaultLegacy(hoistStatics);
+
+const withDi = (deps) => (WrappedComponent) => {
+    function WrapperWithPropsFromDi(props) {
+        const depsInstance = hooks.useDi(deps);
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        return jsxRuntime.jsx(WrappedComponent, { ...props, ...depsInstance });
+    }
+    return hoistStatics__default["default"](WrapperWithPropsFromDi, WrappedComponent);
+};
+
+exports.withDi = withDi;

package/lib/di/hooks.es.js

@@ -0,0 +1,33 @@
+import { useContext, useMemo } from 'react';
+import mapObj from '@tinkoff/utils/object/map';
+import { DIContext } from './context.es.js';
+
+const useDiContainer = () => {
+    const di = useContext(DIContext);
+    if (!di) {
+        if (process.env.NODE_ENV !== 'production') {
+            throw new Error(`DI container not found, make sure that the application uses 'DIContext.Provider' from '@tramvai/react'
+      (in a tramvai application this is usually done by '@tramvai/module-render', otherwise 'DIContext.Provider' from '@tramvai/react' must be explicitly defined somewhere)
+      If the above is correct, make sure that the '@tramvai/react' module is not duplicated in the application dependencies, because then the di versions would be incompatible`);
+        }
+        throw new Error('DI container not found');
+    }
+    return di;
+};
+const isTokenObject = (token) => {
+    return ('token' in token &&
+        (Object.keys(token).length === 1 ||
+            typeof token.optional === 'boolean' ||
+            typeof token.multi === 'boolean'));
+};
+function useDi(deps) {
+    const di = useDiContainer();
+    return useMemo(() => {
+        if (deps.toString() !== '[object Object]' || isTokenObject(deps)) {
+            return di.get(deps);
+        }
+        return mapObj((dep) => di.get(dep), deps);
+    }, [deps, di]);
+}
+
+export { useDi, useDiContainer };

package/lib/di/hooks.js

@@ -0,0 +1,42 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+var mapObj = require('@tinkoff/utils/object/map');
+var context = require('./context.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var mapObj__default = /*#__PURE__*/_interopDefaultLegacy(mapObj);
+
+const useDiContainer = () => {
+    const di = react.useContext(context.DIContext);
+    if (!di) {
+        if (process.env.NODE_ENV !== 'production') {
+            throw new Error(`DI container not found, make sure that the application uses 'DIContext.Provider' from '@tramvai/react'
+      (in a tramvai application this is usually done by '@tramvai/module-render', otherwise 'DIContext.Provider' from '@tramvai/react' must be explicitly defined somewhere)
+      If the above is correct, make sure that the '@tramvai/react' module is not duplicated in the application dependencies, because then the di versions would be incompatible`);
+        }
+        throw new Error('DI container not found');
+    }
+    return di;
+};
+const isTokenObject = (token) => {
+    return ('token' in token &&
+        (Object.keys(token).length === 1 ||
+            typeof token.optional === 'boolean' ||
+            typeof token.multi === 'boolean'));
+};
+function useDi(deps) {
+    const di = useDiContainer();
+    return react.useMemo(() => {
+        if (deps.toString() !== '[object Object]' || isTokenObject(deps)) {
+            return di.get(deps);
+        }
+        return mapObj__default["default"]((dep) => di.get(dep), deps);
+    }, [deps, di]);
+}
+
+exports.useDi = useDi;
+exports.useDiContainer = useDiContainer;

package/lib/error/UniversalErrorBoundary.es.js

@@ -0,0 +1,48 @@
+import { jsx } from 'react/jsx-runtime';
+import { Component } from 'react';
+import { FallbackError } from './fallback.es.js';
+
+class UniversalErrorBoundary extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            error: props.error || null,
+            url: props.url,
+        };
+    }
+    // Reference and explanation here - https://github.com/remix-run/remix/blob/main/packages/remix-react/errorBoundaries.tsx#L35
+    static getDerivedStateFromProps(props, state) {
+        if (props.url !== state.url) {
+            return { error: props.error || null, url: props.url };
+        }
+        return { error: props.error || state.error, url: state.url };
+    }
+    static getDerivedStateFromError(error) {
+        return { error };
+    }
+    componentDidCatch(error, errorInfo) {
+        const { errorHandlers } = this.props;
+        if (errorHandlers) {
+            errorHandlers.forEach((handler) => {
+                handler(error, errorInfo);
+            });
+        }
+    }
+    render() {
+        const { children, fallback: Fallback, fallbackFromDi } = this.props;
+        const { url, error } = this.state;
+        if (!error) {
+            return children;
+        }
+        if (Fallback) {
+            return jsx(Fallback, { url: url, error: error });
+        }
+        if (fallbackFromDi) {
+            return fallbackFromDi;
+        }
+        return jsx(FallbackError, {});
+    }
+}
+UniversalErrorBoundary.displayName = 'UniversalErrorBoundary';
+
+export { UniversalErrorBoundary };

package/lib/error/UniversalErrorBoundary.js

@@ -0,0 +1,52 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var fallback = require('./fallback.js');
+
+class UniversalErrorBoundary extends react.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            error: props.error || null,
+            url: props.url,
+        };
+    }
+    // Reference and explanation here - https://github.com/remix-run/remix/blob/main/packages/remix-react/errorBoundaries.tsx#L35
+    static getDerivedStateFromProps(props, state) {
+        if (props.url !== state.url) {
+            return { error: props.error || null, url: props.url };
+        }
+        return { error: props.error || state.error, url: state.url };
+    }
+    static getDerivedStateFromError(error) {
+        return { error };
+    }
+    componentDidCatch(error, errorInfo) {
+        const { errorHandlers } = this.props;
+        if (errorHandlers) {
+            errorHandlers.forEach((handler) => {
+                handler(error, errorInfo);
+            });
+        }
+    }
+    render() {
+        const { children, fallback: Fallback, fallbackFromDi } = this.props;
+        const { url, error } = this.state;
+        if (!error) {
+            return children;
+        }
+        if (Fallback) {
+            return jsxRuntime.jsx(Fallback, { url: url, error: error });
+        }
+        if (fallbackFromDi) {
+            return fallbackFromDi;
+        }
+        return jsxRuntime.jsx(fallback.FallbackError, {});
+    }
+}
+UniversalErrorBoundary.displayName = 'UniversalErrorBoundary';
+
+exports.UniversalErrorBoundary = UniversalErrorBoundary;

package/lib/error/component.es.js

@@ -0,0 +1,46 @@
+import { __decorate } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import { Component } from 'react';
+import { withDi } from '../di/hoc.es.js';
+import { FallbackError } from './fallback.es.js';
+import { ERROR_BOUNDARY_TOKEN, ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN } from './tokens.es.js';
+
+/**
+ * @deprecated Use UniversalErrorBoundary component
+ */
+let ErrorBoundary = class ErrorBoundary extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            hasError: false,
+        };
+    }
+    static getDerivedStateFromError() {
+        return { hasError: true };
+    }
+    componentDidCatch(error, errorInfo) {
+        const { errorHandlers } = this.props;
+        if (errorHandlers) {
+            errorHandlers.forEach((handler) => {
+                handler(error, errorInfo);
+            });
+        }
+    }
+    render() {
+        const { children, fallbackComponent, fallbackComponentFromDi } = this.props;
+        const { hasError } = this.state;
+        if (!hasError) {
+            return children;
+        }
+        return fallbackComponent || fallbackComponentFromDi || jsx(FallbackError, {});
+    }
+};
+ErrorBoundary.displayName = 'ErrorBoundary';
+ErrorBoundary = __decorate([
+    withDi({
+        errorHandlers: { token: ERROR_BOUNDARY_TOKEN, optional: true },
+        fallbackComponentFromDi: { token: ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN, optional: true },
+    })
+], ErrorBoundary);
+
+export { ErrorBoundary };

package/lib/error/component.js

@@ -0,0 +1,48 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var hoc = require('../di/hoc.js');
+var fallback = require('./fallback.js');
+var tokens = require('./tokens.js');
+
+/**
+ * @deprecated Use UniversalErrorBoundary component
+ */
+exports.ErrorBoundary = class ErrorBoundary extends react.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            hasError: false,
+        };
+    }
+    static getDerivedStateFromError() {
+        return { hasError: true };
+    }
+    componentDidCatch(error, errorInfo) {
+        const { errorHandlers } = this.props;
+        if (errorHandlers) {
+            errorHandlers.forEach((handler) => {
+                handler(error, errorInfo);
+            });
+        }
+    }
+    render() {
+        const { children, fallbackComponent, fallbackComponentFromDi } = this.props;
+        const { hasError } = this.state;
+        if (!hasError) {
+            return children;
+        }
+        return fallbackComponent || fallbackComponentFromDi || jsxRuntime.jsx(fallback.FallbackError, {});
+    }
+};
+exports.ErrorBoundary.displayName = 'ErrorBoundary';
+exports.ErrorBoundary = tslib.__decorate([
+    hoc.withDi({
+        errorHandlers: { token: tokens.ERROR_BOUNDARY_TOKEN, optional: true },
+        fallbackComponentFromDi: { token: tokens.ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN, optional: true },
+    })
+], exports.ErrorBoundary);

package/lib/error/fallback.es.js

@@ -0,0 +1,21 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+const FallbackError = () => {
+    return (jsxs("div", { children: [jsx("div", { style: {
+                    textAlign: 'center',
+                    marginBottom: 11,
+                    paddingTop: 26,
+                    fontSize: 30,
+                    lineHeight: '36px',
+                    fontWeight: 200,
+                }, children: "An error occurred :(" }), jsxs("div", { style: {
+                    textAlign: 'center',
+                    marginBottom: 17,
+                    color: '#9299a2',
+                    fontSize: 20,
+                    lineHeight: '24px',
+                }, children: ["Try", ' ', jsx("a", { href: "", onClick: () => window.location.reload(), children: "reloading the page" })] })] }));
+};
+FallbackError.displayName = 'FallbackError';
+
+export { FallbackError };

package/lib/error/fallback.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+
+const FallbackError = () => {
+    return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { style: {
+                    textAlign: 'center',
+                    marginBottom: 11,
+                    paddingTop: 26,
+                    fontSize: 30,
+                    lineHeight: '36px',
+                    fontWeight: 200,
+                }, children: "An error occurred :(" }), jsxRuntime.jsxs("div", { style: {
+                    textAlign: 'center',
+                    marginBottom: 17,
+                    color: '#9299a2',
+                    fontSize: 20,
+                    lineHeight: '24px',
+                }, children: ["Try", ' ', jsxRuntime.jsx("a", { href: "", onClick: () => window.location.reload(), children: "reloading the page" })] })] }));
+};
+FallbackError.displayName = 'FallbackError';
+
+exports.FallbackError = FallbackError;

package/lib/error/hoc.es.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import hoistStatics from 'hoist-non-react-statics';
+import { ErrorBoundary } from './component.es.js';
+
+/**
+ * @deprecated Use UniversalErrorBoundary component
+ */
+const withError = ({ fallbackComponent } = {}) => (WrappedComponent) => {
+    function WrapperWithError(props) {
+        return (jsx(ErrorBoundary, { fallbackComponent: fallbackComponent, children: jsx(WrappedComponent, { ...props }) }));
+    }
+    return hoistStatics(WrapperWithError, WrappedComponent);
+};
+
+export { withError };

package/lib/error/hoc.js

@@ -0,0 +1,23 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var hoistStatics = require('hoist-non-react-statics');
+var component = require('./component.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var hoistStatics__default = /*#__PURE__*/_interopDefaultLegacy(hoistStatics);
+
+/**
+ * @deprecated Use UniversalErrorBoundary component
+ */
+const withError = ({ fallbackComponent } = {}) => (WrappedComponent) => {
+    function WrapperWithError(props) {
+        return (jsxRuntime.jsx(component.ErrorBoundary, { fallbackComponent: fallbackComponent, children: jsxRuntime.jsx(WrappedComponent, { ...props }) }));
+    }
+    return hoistStatics__default["default"](WrapperWithError, WrappedComponent);
+};
+
+exports.withError = withError;

package/lib/error/tokens.es.js

@@ -0,0 +1,12 @@
+import { createToken } from '@tinkoff/dippy';
+
+const ERROR_BOUNDARY_TOKEN = createToken('reactErrorBoundaryHandlers', {
+    multi: true,
+});
+const ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN = createToken('rootErrorBoundaryComponent');
+/**
+ * @deprecated
+ */
+const ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN = createToken('errorBoundaryFallbackComponent');
+
+export { ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN, ERROR_BOUNDARY_TOKEN, ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN };

package/lib/error/tokens.js

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var dippy = require('@tinkoff/dippy');
+
+const ERROR_BOUNDARY_TOKEN = dippy.createToken('reactErrorBoundaryHandlers', {
+    multi: true,
+});
+const ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN = dippy.createToken('rootErrorBoundaryComponent');
+/**
+ * @deprecated
+ */
+const ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN = dippy.createToken('errorBoundaryFallbackComponent');
+
+exports.ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN = ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN;
+exports.ERROR_BOUNDARY_TOKEN = ERROR_BOUNDARY_TOKEN;
+exports.ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN = ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN;

package/lib/lazy/lazy.es.js

@@ -0,0 +1,64 @@
+import hoistStatics from 'hoist-non-react-statics';
+import loadable from '@loadable/component';
+
+const resolveLazyComponent = async (componentOrLoader) => {
+    if (!componentOrLoader) {
+        return;
+    }
+    if ('load' in componentOrLoader && typeof componentOrLoader.load === 'function') {
+        const mod = await componentOrLoader.load();
+        let component;
+        if (mod.__esModule) {
+            component = mod.default;
+        }
+        else {
+            component = mod.default || mod;
+        }
+        // manually hoist static properties from preloaded component to loadable wrapper,
+        // this open access to current page component static properties outside before rendering
+        hoistStatics(componentOrLoader, component);
+        return component;
+    }
+    return componentOrLoader;
+};
+/**
+ * @private Only for internal usage!
+ * The method is intended to make it possible to wait for retries to synchronously load unsuccessful CSS assets
+ */
+const __lazyErrorHandler = (error, load) => {
+    // This error from `mini-css-extract-plugin` fired, when a file loading initiated by this plugin failed.
+    // By default, this error will cancel the loading of the component via `loadable`.
+    // Now, we can add `__lazyErrorHandler` to catch block of any dynamic import,
+    // and if failed assets was loaded again, `loadable` will not fail
+    if ((error === null || error === void 0 ? void 0 : error.code) === 'CSS_CHUNK_LOAD_FAILED') {
+        const failedLinkUrl = error.request;
+        // `mini-css-extract-plugin` instantly removes failed link tags,
+        // so we can expect only link tag from our recovery mechanism
+        const fallbackLinkTag = document.querySelector(`link[href="${failedLinkUrl}"]`) ||
+            document.querySelector(`link[data-href="${failedLinkUrl}"]`);
+        if (fallbackLinkTag) {
+            return load();
+        }
+    }
+    throw error;
+};
+const lazy = (load, options = {}) => {
+    if (process.env.NODE_ENV === 'development') {
+        if (!('requireAsync' in load)) {
+            console.error(`Lazy import was not processed by lazy-component babel plugin.
+Check lazy helper usage, expected signature is "lazy(() => import('./path/to/component'))",
+the first argument should be transformed into a special object, but the current value is
+"${load.toString()}"`);
+        }
+    }
+    // @ts-expect-error
+    const originalImportAsync = load.importAsync;
+    // @ts-expect-error
+    // eslint-disable-next-line no-param-reassign
+    load.importAsync = () => originalImportAsync().catch((e) => __lazyErrorHandler(e, originalImportAsync));
+    return loadable(load, {
+        fallback: options.loading,
+    });
+};
+
+export { __lazyErrorHandler, lazy, resolveLazyComponent };

package/lib/lazy/lazy.js

@@ -0,0 +1,75 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var hoistStatics = require('hoist-non-react-statics');
+var loadable = require('@loadable/component');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var hoistStatics__default = /*#__PURE__*/_interopDefaultLegacy(hoistStatics);
+var loadable__default = /*#__PURE__*/_interopDefaultLegacy(loadable);
+
+const resolveLazyComponent = async (componentOrLoader) => {
+    if (!componentOrLoader) {
+        return;
+    }
+    if ('load' in componentOrLoader && typeof componentOrLoader.load === 'function') {
+        const mod = await componentOrLoader.load();
+        let component;
+        if (mod.__esModule) {
+            component = mod.default;
+        }
+        else {
+            component = mod.default || mod;
+        }
+        // manually hoist static properties from preloaded component to loadable wrapper,
+        // this open access to current page component static properties outside before rendering
+        hoistStatics__default["default"](componentOrLoader, component);
+        return component;
+    }
+    return componentOrLoader;
+};
+/**
+ * @private Only for internal usage!
+ * The method is intended to make it possible to wait for retries to synchronously load unsuccessful CSS assets
+ */
+const __lazyErrorHandler = (error, load) => {
+    // This error from `mini-css-extract-plugin` fired, when a file loading initiated by this plugin failed.
+    // By default, this error will cancel the loading of the component via `loadable`.
+    // Now, we can add `__lazyErrorHandler` to catch block of any dynamic import,
+    // and if failed assets was loaded again, `loadable` will not fail
+    if ((error === null || error === void 0 ? void 0 : error.code) === 'CSS_CHUNK_LOAD_FAILED') {
+        const failedLinkUrl = error.request;
+        // `mini-css-extract-plugin` instantly removes failed link tags,
+        // so we can expect only link tag from our recovery mechanism
+        const fallbackLinkTag = document.querySelector(`link[href="${failedLinkUrl}"]`) ||
+            document.querySelector(`link[data-href="${failedLinkUrl}"]`);
+        if (fallbackLinkTag) {
+            return load();
+        }
+    }
+    throw error;
+};
+const lazy = (load, options = {}) => {
+    if (process.env.NODE_ENV === 'development') {
+        if (!('requireAsync' in load)) {
+            console.error(`Lazy import was not processed by lazy-component babel plugin.
+Check lazy helper usage, expected signature is "lazy(() => import('./path/to/component'))",
+the first argument should be transformed into a special object, but the current value is
+"${load.toString()}"`);
+        }
+    }
+    // @ts-expect-error
+    const originalImportAsync = load.importAsync;
+    // @ts-expect-error
+    // eslint-disable-next-line no-param-reassign
+    load.importAsync = () => originalImportAsync().catch((e) => __lazyErrorHandler(e, originalImportAsync));
+    return loadable__default["default"](load, {
+        fallback: options.loading,
+    });
+};
+
+exports.__lazyErrorHandler = __lazyErrorHandler;
+exports.lazy = lazy;
+exports.resolveLazyComponent = resolveLazyComponent;

package/lib/react.es.js

@@ -1,226 +1,9 @@
-import { createContext, useContext, useMemo, Component } from 'react';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import hoistStatics from 'hoist-non-react-statics';
-import mapObj from '@tinkoff/utils/object/map';
-import { __decorate } from 'tslib';
-import { createToken } from '@tinkoff/dippy';
-import loadable from '@loadable/component';
-
-const DIContext = createContext(null);
-
-const useDiContainer = () => {
-    const di = useContext(DIContext);
-    if (!di) {
-        if (process.env.NODE_ENV !== 'production') {
-            throw new Error(`DI container not found, make sure that the application uses 'DIContext.Provider' from '@tramvai/react'
-      (in a tramvai application this is usually done by '@tramvai/module-render', otherwise 'DIContext.Provider' from '@tramvai/react' must be explicitly defined somewhere)
-      If the above is correct, make sure that the '@tramvai/react' module is not duplicated in the application dependencies, because then the di versions would be incompatible`);
-        }
-        throw new Error('DI container not found');
-    }
-    return di;
-};
-const isTokenObject = (token) => {
-    return ('token' in token &&
-        (Object.keys(token).length === 1 ||
-            typeof token.optional === 'boolean' ||
-            typeof token.multi === 'boolean'));
-};
-function useDi(deps) {
-    const di = useDiContainer();
-    return useMemo(() => {
-        if (deps.toString() !== '[object Object]' || isTokenObject(deps)) {
-            return di.get(deps);
-        }
-        return mapObj((dep) => di.get(dep), deps);
-    }, [deps, di]);
-}
-
-const withDi = (deps) => (WrappedComponent) => {
-    function WrapperWithPropsFromDi(props) {
-        const depsInstance = useDi(deps);
-        // eslint-disable-next-line react/jsx-props-no-spreading
-        return jsx(WrappedComponent, { ...props, ...depsInstance });
-    }
-    return hoistStatics(WrapperWithPropsFromDi, WrappedComponent);
-};
-
-const FallbackError = () => {
-    return (jsxs("div", { children: [jsx("div", { style: {
-                    textAlign: 'center',
-                    marginBottom: 11,
-                    paddingTop: 26,
-                    fontSize: 30,
-                    lineHeight: '36px',
-                    fontWeight: 200,
-                }, children: "An error occurred :(" }), jsxs("div", { style: {
-                    textAlign: 'center',
-                    marginBottom: 17,
-                    color: '#9299a2',
-                    fontSize: 20,
-                    lineHeight: '24px',
-                }, children: ["Try", ' ', jsx("a", { href: "", onClick: () => window.location.reload(), children: "reloading the page" })] })] }));
-};
-FallbackError.displayName = 'FallbackError';
-
-class UniversalErrorBoundary extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            error: props.error || null,
-            url: props.url,
-        };
-    }
-    // Reference and explanation here - https://github.com/remix-run/remix/blob/main/packages/remix-react/errorBoundaries.tsx#L35
-    static getDerivedStateFromProps(props, state) {
-        if (props.url !== state.url) {
-            return { error: props.error || null, url: props.url };
-        }
-        return { error: props.error || state.error, url: state.url };
-    }
-    static getDerivedStateFromError(error) {
-        return { error };
-    }
-    componentDidCatch(error, errorInfo) {
-        const { errorHandlers } = this.props;
-        if (errorHandlers) {
-            errorHandlers.forEach((handler) => {
-                handler(error, errorInfo);
-            });
-        }
-    }
-    render() {
-        const { children, fallback: Fallback, fallbackFromDi } = this.props;
-        const { url, error } = this.state;
-        if (!error) {
-            return children;
-        }
-        if (Fallback) {
-            return jsx(Fallback, { url: url, error: error });
-        }
-        if (fallbackFromDi) {
-            return fallbackFromDi;
-        }
-        return jsx(FallbackError, {});
-    }
-}
-UniversalErrorBoundary.displayName = 'UniversalErrorBoundary';
-
-const ERROR_BOUNDARY_TOKEN = createToken('reactErrorBoundaryHandlers', {
-    multi: true,
-});
-const ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN = createToken('rootErrorBoundaryComponent');
-/**
- * @deprecated
- */
-const ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN = createToken('errorBoundaryFallbackComponent');
-
-/**
- * @deprecated Use UniversalErrorBoundary component
- */
-let ErrorBoundary = class ErrorBoundary extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            hasError: false,
-        };
-    }
-    static getDerivedStateFromError() {
-        return { hasError: true };
-    }
-    componentDidCatch(error, errorInfo) {
-        const { errorHandlers } = this.props;
-        if (errorHandlers) {
-            errorHandlers.forEach((handler) => {
-                handler(error, errorInfo);
-            });
-        }
-    }
-    render() {
-        const { children, fallbackComponent, fallbackComponentFromDi } = this.props;
-        const { hasError } = this.state;
-        if (!hasError) {
-            return children;
-        }
-        return fallbackComponent || fallbackComponentFromDi || jsx(FallbackError, {});
-    }
-};
-ErrorBoundary.displayName = 'ErrorBoundary';
-ErrorBoundary = __decorate([
-    withDi({
-        errorHandlers: { token: ERROR_BOUNDARY_TOKEN, optional: true },
-        fallbackComponentFromDi: { token: ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN, optional: true },
-    })
-], ErrorBoundary);
-
-/**
- * @deprecated Use UniversalErrorBoundary component
- */
-const withError = ({ fallbackComponent } = {}) => (WrappedComponent) => {
-    function WrapperWithError(props) {
-        return (jsx(ErrorBoundary, { fallbackComponent: fallbackComponent, children: jsx(WrappedComponent, { ...props }) }));
-    }
-    return hoistStatics(WrapperWithError, WrappedComponent);
-};
-
-const resolveLazyComponent = async (componentOrLoader) => {
-    if (!componentOrLoader) {
-        return;
-    }
-    if ('load' in componentOrLoader && typeof componentOrLoader.load === 'function') {
-        const mod = await componentOrLoader.load();
-        let component;
-        if (mod.__esModule) {
-            component = mod.default;
-        }
-        else {
-            component = mod.default || mod;
-        }
-        // manually hoist static properties from preloaded component to loadable wrapper,
-        // this open access to current page component static properties outside before rendering
-        hoistStatics(componentOrLoader, component);
-        return component;
-    }
-    return componentOrLoader;
-};
-/**
- * @private Only for internal usage!
- * The method is intended to make it possible to wait for retries to synchronously load unsuccessful CSS assets
- */
-const __lazyErrorHandler = (error, load) => {
-    // This error from `mini-css-extract-plugin` fired, when a file loading initiated by this plugin failed.
-    // By default, this error will cancel the loading of the component via `loadable`.
-    // Now, we can add `__lazyErrorHandler` to catch block of any dynamic import,
-    // and if failed assets was loaded again, `loadable` will not fail
-    if ((error === null || error === void 0 ? void 0 : error.code) === 'CSS_CHUNK_LOAD_FAILED') {
-        const failedLinkUrl = error.request;
-        // `mini-css-extract-plugin` instantly removes failed link tags,
-        // so we can expect only link tag from our recovery mechanism
-        const fallbackLinkTag = document.querySelector(`link[href="${failedLinkUrl}"]`) ||
-            document.querySelector(`link[data-href="${failedLinkUrl}"]`);
-        if (fallbackLinkTag) {
-            return load();
-        }
-    }
-    throw error;
-};
-const lazy = (load, options = {}) => {
-    if (process.env.NODE_ENV === 'development') {
-        if (!('requireAsync' in load)) {
-            console.error(`Lazy import was not processed by lazy-component babel plugin.
-Check lazy helper usage, expected signature is "lazy(() => import('./path/to/component'))",
-the first argument should be transformed into a special object, but the current value is
-"${load.toString()}"`);
-        }
-    }
-    // @ts-expect-error
-    const originalImportAsync = load.importAsync;
-    // @ts-expect-error
-    // eslint-disable-next-line no-param-reassign
-    load.importAsync = () => originalImportAsync().catch((e) => __lazyErrorHandler(e, originalImportAsync));
-    return loadable(load, {
-        fallback: options.loading,
-    });
-};
-
-export { DIContext, ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN, ERROR_BOUNDARY_TOKEN, ErrorBoundary, FallbackError, ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN, UniversalErrorBoundary, __lazyErrorHandler, lazy, resolveLazyComponent, useDi, useDiContainer, withDi, withError };
+export { DIContext } from './di/context.es.js';
+export { withDi } from './di/hoc.es.js';
+export { useDi, useDiContainer } from './di/hooks.es.js';
+export { UniversalErrorBoundary } from './error/UniversalErrorBoundary.es.js';
+export { ErrorBoundary } from './error/component.es.js';
+export { FallbackError } from './error/fallback.es.js';
+export { withError } from './error/hoc.es.js';
+export { ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN, ERROR_BOUNDARY_TOKEN, ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN } from './error/tokens.es.js';
+export { __lazyErrorHandler, lazy, resolveLazyComponent } from './lazy/lazy.es.js';

package/lib/react.js

@@ -2,247 +2,32 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var react = require('react');
-var jsxRuntime = require('react/jsx-runtime');
-var hoistStatics = require('hoist-non-react-statics');
-var mapObj = require('@tinkoff/utils/object/map');
-var tslib = require('tslib');
-var dippy = require('@tinkoff/dippy');
-var loadable = require('@loadable/component');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var hoistStatics__default = /*#__PURE__*/_interopDefaultLegacy(hoistStatics);
-var mapObj__default = /*#__PURE__*/_interopDefaultLegacy(mapObj);
-var loadable__default = /*#__PURE__*/_interopDefaultLegacy(loadable);
-
-const DIContext = react.createContext(null);
-
-const useDiContainer = () => {
-    const di = react.useContext(DIContext);
-    if (!di) {
-        if (process.env.NODE_ENV !== 'production') {
-            throw new Error(`DI container not found, make sure that the application uses 'DIContext.Provider' from '@tramvai/react'
-      (in a tramvai application this is usually done by '@tramvai/module-render', otherwise 'DIContext.Provider' from '@tramvai/react' must be explicitly defined somewhere)
-      If the above is correct, make sure that the '@tramvai/react' module is not duplicated in the application dependencies, because then the di versions would be incompatible`);
-        }
-        throw new Error('DI container not found');
-    }
-    return di;
-};
-const isTokenObject = (token) => {
-    return ('token' in token &&
-        (Object.keys(token).length === 1 ||
-            typeof token.optional === 'boolean' ||
-            typeof token.multi === 'boolean'));
-};
-function useDi(deps) {
-    const di = useDiContainer();
-    return react.useMemo(() => {
-        if (deps.toString() !== '[object Object]' || isTokenObject(deps)) {
-            return di.get(deps);
-        }
-        return mapObj__default["default"]((dep) => di.get(dep), deps);
-    }, [deps, di]);
-}
-
-const withDi = (deps) => (WrappedComponent) => {
-    function WrapperWithPropsFromDi(props) {
-        const depsInstance = useDi(deps);
-        // eslint-disable-next-line react/jsx-props-no-spreading
-        return jsxRuntime.jsx(WrappedComponent, { ...props, ...depsInstance });
-    }
-    return hoistStatics__default["default"](WrapperWithPropsFromDi, WrappedComponent);
-};
-
-const FallbackError = () => {
-    return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { style: {
-                    textAlign: 'center',
-                    marginBottom: 11,
-                    paddingTop: 26,
-                    fontSize: 30,
-                    lineHeight: '36px',
-                    fontWeight: 200,
-                }, children: "An error occurred :(" }), jsxRuntime.jsxs("div", { style: {
-                    textAlign: 'center',
-                    marginBottom: 17,
-                    color: '#9299a2',
-                    fontSize: 20,
-                    lineHeight: '24px',
-                }, children: ["Try", ' ', jsxRuntime.jsx("a", { href: "", onClick: () => window.location.reload(), children: "reloading the page" })] })] }));
-};
-FallbackError.displayName = 'FallbackError';
-
-class UniversalErrorBoundary extends react.Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            error: props.error || null,
-            url: props.url,
-        };
-    }
-    // Reference and explanation here - https://github.com/remix-run/remix/blob/main/packages/remix-react/errorBoundaries.tsx#L35
-    static getDerivedStateFromProps(props, state) {
-        if (props.url !== state.url) {
-            return { error: props.error || null, url: props.url };
-        }
-        return { error: props.error || state.error, url: state.url };
-    }
-    static getDerivedStateFromError(error) {
-        return { error };
-    }
-    componentDidCatch(error, errorInfo) {
-        const { errorHandlers } = this.props;
-        if (errorHandlers) {
-            errorHandlers.forEach((handler) => {
-                handler(error, errorInfo);
-            });
-        }
-    }
-    render() {
-        const { children, fallback: Fallback, fallbackFromDi } = this.props;
-        const { url, error } = this.state;
-        if (!error) {
-            return children;
-        }
-        if (Fallback) {
-            return jsxRuntime.jsx(Fallback, { url: url, error: error });
-        }
-        if (fallbackFromDi) {
-            return fallbackFromDi;
-        }
-        return jsxRuntime.jsx(FallbackError, {});
-    }
-}
-UniversalErrorBoundary.displayName = 'UniversalErrorBoundary';
-
-const ERROR_BOUNDARY_TOKEN = dippy.createToken('reactErrorBoundaryHandlers', {
-    multi: true,
+var context = require('./di/context.js');
+var hoc = require('./di/hoc.js');
+var hooks = require('./di/hooks.js');
+var UniversalErrorBoundary = require('./error/UniversalErrorBoundary.js');
+var component = require('./error/component.js');
+var fallback = require('./error/fallback.js');
+var hoc$1 = require('./error/hoc.js');
+var tokens = require('./error/tokens.js');
+var lazy = require('./lazy/lazy.js');
+
+
+
+exports.DIContext = context.DIContext;
+exports.withDi = hoc.withDi;
+exports.useDi = hooks.useDi;
+exports.useDiContainer = hooks.useDiContainer;
+exports.UniversalErrorBoundary = UniversalErrorBoundary.UniversalErrorBoundary;
+Object.defineProperty(exports, 'ErrorBoundary', {
+	enumerable: true,
+	get: function () { return component.ErrorBoundary; }
 });
-const ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN = dippy.createToken('rootErrorBoundaryComponent');
-/**
- * @deprecated
- */
-const ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN = dippy.createToken('errorBoundaryFallbackComponent');
-
-/**
- * @deprecated Use UniversalErrorBoundary component
- */
-exports.ErrorBoundary = class ErrorBoundary extends react.Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            hasError: false,
-        };
-    }
-    static getDerivedStateFromError() {
-        return { hasError: true };
-    }
-    componentDidCatch(error, errorInfo) {
-        const { errorHandlers } = this.props;
-        if (errorHandlers) {
-            errorHandlers.forEach((handler) => {
-                handler(error, errorInfo);
-            });
-        }
-    }
-    render() {
-        const { children, fallbackComponent, fallbackComponentFromDi } = this.props;
-        const { hasError } = this.state;
-        if (!hasError) {
-            return children;
-        }
-        return fallbackComponent || fallbackComponentFromDi || jsxRuntime.jsx(FallbackError, {});
-    }
-};
-exports.ErrorBoundary.displayName = 'ErrorBoundary';
-exports.ErrorBoundary = tslib.__decorate([
-    withDi({
-        errorHandlers: { token: ERROR_BOUNDARY_TOKEN, optional: true },
-        fallbackComponentFromDi: { token: ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN, optional: true },
-    })
-], exports.ErrorBoundary);
-
-/**
- * @deprecated Use UniversalErrorBoundary component
- */
-const withError = ({ fallbackComponent } = {}) => (WrappedComponent) => {
-    function WrapperWithError(props) {
-        return (jsxRuntime.jsx(exports.ErrorBoundary, { fallbackComponent: fallbackComponent, children: jsxRuntime.jsx(WrappedComponent, { ...props }) }));
-    }
-    return hoistStatics__default["default"](WrapperWithError, WrappedComponent);
-};
-
-const resolveLazyComponent = async (componentOrLoader) => {
-    if (!componentOrLoader) {
-        return;
-    }
-    if ('load' in componentOrLoader && typeof componentOrLoader.load === 'function') {
-        const mod = await componentOrLoader.load();
-        let component;
-        if (mod.__esModule) {
-            component = mod.default;
-        }
-        else {
-            component = mod.default || mod;
-        }
-        // manually hoist static properties from preloaded component to loadable wrapper,
-        // this open access to current page component static properties outside before rendering
-        hoistStatics__default["default"](componentOrLoader, component);
-        return component;
-    }
-    return componentOrLoader;
-};
-/**
- * @private Only for internal usage!
- * The method is intended to make it possible to wait for retries to synchronously load unsuccessful CSS assets
- */
-const __lazyErrorHandler = (error, load) => {
-    // This error from `mini-css-extract-plugin` fired, when a file loading initiated by this plugin failed.
-    // By default, this error will cancel the loading of the component via `loadable`.
-    // Now, we can add `__lazyErrorHandler` to catch block of any dynamic import,
-    // and if failed assets was loaded again, `loadable` will not fail
-    if ((error === null || error === void 0 ? void 0 : error.code) === 'CSS_CHUNK_LOAD_FAILED') {
-        const failedLinkUrl = error.request;
-        // `mini-css-extract-plugin` instantly removes failed link tags,
-        // so we can expect only link tag from our recovery mechanism
-        const fallbackLinkTag = document.querySelector(`link[href="${failedLinkUrl}"]`) ||
-            document.querySelector(`link[data-href="${failedLinkUrl}"]`);
-        if (fallbackLinkTag) {
-            return load();
-        }
-    }
-    throw error;
-};
-const lazy = (load, options = {}) => {
-    if (process.env.NODE_ENV === 'development') {
-        if (!('requireAsync' in load)) {
-            console.error(`Lazy import was not processed by lazy-component babel plugin.
-Check lazy helper usage, expected signature is "lazy(() => import('./path/to/component'))",
-the first argument should be transformed into a special object, but the current value is
-"${load.toString()}"`);
-        }
-    }
-    // @ts-expect-error
-    const originalImportAsync = load.importAsync;
-    // @ts-expect-error
-    // eslint-disable-next-line no-param-reassign
-    load.importAsync = () => originalImportAsync().catch((e) => __lazyErrorHandler(e, originalImportAsync));
-    return loadable__default["default"](load, {
-        fallback: options.loading,
-    });
-};
-
-exports.DIContext = DIContext;
-exports.ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN = ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN;
-exports.ERROR_BOUNDARY_TOKEN = ERROR_BOUNDARY_TOKEN;
-exports.FallbackError = FallbackError;
-exports.ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN = ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN;
-exports.UniversalErrorBoundary = UniversalErrorBoundary;
-exports.__lazyErrorHandler = __lazyErrorHandler;
-exports.lazy = lazy;
-exports.resolveLazyComponent = resolveLazyComponent;
-exports.useDi = useDi;
-exports.useDiContainer = useDiContainer;
-exports.withDi = withDi;
-exports.withError = withError;
+exports.FallbackError = fallback.FallbackError;
+exports.withError = hoc$1.withError;
+exports.ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN = tokens.ERROR_BOUNDARY_FALLBACK_COMPONENT_TOKEN;
+exports.ERROR_BOUNDARY_TOKEN = tokens.ERROR_BOUNDARY_TOKEN;
+exports.ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN = tokens.ROOT_ERROR_BOUNDARY_COMPONENT_TOKEN;
+exports.__lazyErrorHandler = lazy.__lazyErrorHandler;
+exports.lazy = lazy.lazy;
+exports.resolveLazyComponent = lazy.resolveLazyComponent;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tramvai/react",
-  "version": "2.70.0",
+  "version": "2.72.0",
   "description": "",
   "main": "lib/react.js",
   "typings": "lib/react.d.ts",
@@ -13,20 +13,19 @@
     "url": "git@github.com:Tinkoff/tramvai.git"
   },
   "scripts": {
-    "build": "tramvai-build --for-publish",
-    "watch": "tsc -w",
-    "build-for-publish": "true"
+    "build": "tramvai-build --forPublish --preserveModules",
+    "watch": "tsc -w"
   },
   "dependencies": {
     "@loadable/component": "^5.15.2",
     "@types/loadable__component": "^5.13.4",
-    "@tramvai/types-actions-state-context": "2.70.0",
+    "@tramvai/types-actions-state-context": "2.72.0",
     "hoist-non-react-statics": "^3.3.0"
   },
   "peerDependencies": {
-    "@tinkoff/dippy": "0.8.12",
+    "@tinkoff/dippy": "0.8.13",
     "@tinkoff/utils": "^2.1.2",
-    "@tinkoff/url": "0.8.4",
+    "@tinkoff/url": "0.8.5",
     "react": ">=16.14.0",
     "react-dom": ">=16.14.0",
     "tslib": "^2.4.0"