@tinkoff/router 0.1.69 → 0.1.72
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/react/provider.d.ts +1 -0
- package/lib/index.browser.js +16 -8
- package/lib/index.es.js +7 -8
- package/lib/index.js +17 -19
- package/package.json +2 -2
package/lib/index.browser.js
CHANGED
|
@@ -7,8 +7,9 @@ import noop from '@tinkoff/utils/function/noop';
|
|
|
7
7
|
import each from '@tinkoff/utils/array/each';
|
|
8
8
|
import find from '@tinkoff/utils/array/find';
|
|
9
9
|
import findIndex from '@tinkoff/utils/array/findIndex';
|
|
10
|
-
import
|
|
11
|
-
import {
|
|
10
|
+
import { jsx } from 'react/jsx-runtime';
|
|
11
|
+
import { createContext, useState, useContext, useCallback, isValidElement, cloneElement } from 'react';
|
|
12
|
+
import { useIsomorphicLayoutEffect, useShallowEqual } from '@tinkoff/react-hooks';
|
|
12
13
|
|
|
13
14
|
const PARAMETER_DELIMITER = ':';
|
|
14
15
|
const WILDCARD_REGEXP = /\*/;
|
|
@@ -953,6 +954,15 @@ class Router extends ClientRouter {
|
|
|
953
954
|
if (this.currentNavigation) {
|
|
954
955
|
return this.delayNavigation(navigation);
|
|
955
956
|
}
|
|
957
|
+
// ignore previous navigations that were put in delayedNavigation as we have more fresh navigation to execute
|
|
958
|
+
if (this.delayedNavigation) {
|
|
959
|
+
logger.info({
|
|
960
|
+
event: 'delay-navigation-drop',
|
|
961
|
+
delayedNavigation: this.delayedNavigation,
|
|
962
|
+
navigation,
|
|
963
|
+
});
|
|
964
|
+
this.delayedNavigation = null;
|
|
965
|
+
}
|
|
956
966
|
return this.flattenDelayedNavigation(navigation);
|
|
957
967
|
}
|
|
958
968
|
delayNavigation(navigation) {
|
|
@@ -1095,19 +1105,17 @@ const RouterContext = createContext(null);
|
|
|
1095
1105
|
const RouteContext = createContext(null);
|
|
1096
1106
|
const UrlContext = createContext(null);
|
|
1097
1107
|
|
|
1098
|
-
const Provider = ({ router, children
|
|
1108
|
+
const Provider = ({ router, children }) => {
|
|
1099
1109
|
const [state, setState] = useState({
|
|
1100
1110
|
route: router.getCurrentRoute(),
|
|
1101
1111
|
url: router.getCurrentUrl(),
|
|
1102
1112
|
});
|
|
1103
|
-
|
|
1113
|
+
useIsomorphicLayoutEffect(() => {
|
|
1104
1114
|
return router.registerSyncHook('change', ({ to, url }) => {
|
|
1105
1115
|
setState({ route: to, url });
|
|
1106
1116
|
});
|
|
1107
1117
|
}, [router]);
|
|
1108
|
-
return (
|
|
1109
|
-
React.createElement(RouteContext.Provider, { value: state.route },
|
|
1110
|
-
React.createElement(UrlContext.Provider, { value: state.url }, children))));
|
|
1118
|
+
return (jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsx(RouteContext.Provider, Object.assign({ value: state.route }, { children: jsx(UrlContext.Provider, Object.assign({ value: state.url }, { children: children }), void 0) }), void 0) }), void 0));
|
|
1111
1119
|
};
|
|
1112
1120
|
Provider.displayName = 'Provider';
|
|
1113
1121
|
|
|
@@ -1159,7 +1167,7 @@ function Link(props) {
|
|
|
1159
1167
|
}
|
|
1160
1168
|
return (
|
|
1161
1169
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
1162
|
-
|
|
1170
|
+
jsx("a", Object.assign({}, otherProps, extraProps, { children: children }), void 0));
|
|
1163
1171
|
}
|
|
1164
1172
|
Link.displayName = 'Link';
|
|
1165
1173
|
|
package/lib/index.es.js
CHANGED
|
@@ -7,8 +7,9 @@ import noop from '@tinkoff/utils/function/noop';
|
|
|
7
7
|
import each from '@tinkoff/utils/array/each';
|
|
8
8
|
import find from '@tinkoff/utils/array/find';
|
|
9
9
|
import findIndex from '@tinkoff/utils/array/findIndex';
|
|
10
|
-
import
|
|
11
|
-
import {
|
|
10
|
+
import { jsx } from 'react/jsx-runtime';
|
|
11
|
+
import { createContext, useState, useContext, useCallback, isValidElement, cloneElement } from 'react';
|
|
12
|
+
import { useIsomorphicLayoutEffect, useShallowEqual } from '@tinkoff/react-hooks';
|
|
12
13
|
|
|
13
14
|
const PARAMETER_DELIMITER = ':';
|
|
14
15
|
const WILDCARD_REGEXP = /\*/;
|
|
@@ -1032,19 +1033,17 @@ const RouterContext = createContext(null);
|
|
|
1032
1033
|
const RouteContext = createContext(null);
|
|
1033
1034
|
const UrlContext = createContext(null);
|
|
1034
1035
|
|
|
1035
|
-
const Provider = ({ router, children
|
|
1036
|
+
const Provider = ({ router, children }) => {
|
|
1036
1037
|
const [state, setState] = useState({
|
|
1037
1038
|
route: router.getCurrentRoute(),
|
|
1038
1039
|
url: router.getCurrentUrl(),
|
|
1039
1040
|
});
|
|
1040
|
-
|
|
1041
|
+
useIsomorphicLayoutEffect(() => {
|
|
1041
1042
|
return router.registerSyncHook('change', ({ to, url }) => {
|
|
1042
1043
|
setState({ route: to, url });
|
|
1043
1044
|
});
|
|
1044
1045
|
}, [router]);
|
|
1045
|
-
return (
|
|
1046
|
-
React.createElement(RouteContext.Provider, { value: state.route },
|
|
1047
|
-
React.createElement(UrlContext.Provider, { value: state.url }, children))));
|
|
1046
|
+
return (jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsx(RouteContext.Provider, Object.assign({ value: state.route }, { children: jsx(UrlContext.Provider, Object.assign({ value: state.url }, { children: children }), void 0) }), void 0) }), void 0));
|
|
1048
1047
|
};
|
|
1049
1048
|
Provider.displayName = 'Provider';
|
|
1050
1049
|
|
|
@@ -1096,7 +1095,7 @@ function Link(props) {
|
|
|
1096
1095
|
}
|
|
1097
1096
|
return (
|
|
1098
1097
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
1099
|
-
|
|
1098
|
+
jsx("a", Object.assign({}, otherProps, extraProps, { children: children }), void 0));
|
|
1100
1099
|
}
|
|
1101
1100
|
Link.displayName = 'Link';
|
|
1102
1101
|
|
package/lib/index.js
CHANGED
|
@@ -11,7 +11,8 @@ var noop = require('@tinkoff/utils/function/noop');
|
|
|
11
11
|
var each = require('@tinkoff/utils/array/each');
|
|
12
12
|
var find = require('@tinkoff/utils/array/find');
|
|
13
13
|
var findIndex = require('@tinkoff/utils/array/findIndex');
|
|
14
|
-
var
|
|
14
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
15
|
+
var react = require('react');
|
|
15
16
|
var reactHooks = require('@tinkoff/react-hooks');
|
|
16
17
|
|
|
17
18
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -24,7 +25,6 @@ var noop__default = /*#__PURE__*/_interopDefaultLegacy(noop);
|
|
|
24
25
|
var each__default = /*#__PURE__*/_interopDefaultLegacy(each);
|
|
25
26
|
var find__default = /*#__PURE__*/_interopDefaultLegacy(find);
|
|
26
27
|
var findIndex__default = /*#__PURE__*/_interopDefaultLegacy(findIndex);
|
|
27
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
28
28
|
|
|
29
29
|
const PARAMETER_DELIMITER = ':';
|
|
30
30
|
const WILDCARD_REGEXP = /\*/;
|
|
@@ -1044,36 +1044,34 @@ class NoSpaRouter extends ClientRouter {
|
|
|
1044
1044
|
async runHooks() { }
|
|
1045
1045
|
}
|
|
1046
1046
|
|
|
1047
|
-
const RouterContext =
|
|
1048
|
-
const RouteContext =
|
|
1049
|
-
const UrlContext =
|
|
1047
|
+
const RouterContext = react.createContext(null);
|
|
1048
|
+
const RouteContext = react.createContext(null);
|
|
1049
|
+
const UrlContext = react.createContext(null);
|
|
1050
1050
|
|
|
1051
|
-
const Provider = ({ router, children
|
|
1052
|
-
const [state, setState] =
|
|
1051
|
+
const Provider = ({ router, children }) => {
|
|
1052
|
+
const [state, setState] = react.useState({
|
|
1053
1053
|
route: router.getCurrentRoute(),
|
|
1054
1054
|
url: router.getCurrentUrl(),
|
|
1055
1055
|
});
|
|
1056
|
-
|
|
1056
|
+
reactHooks.useIsomorphicLayoutEffect(() => {
|
|
1057
1057
|
return router.registerSyncHook('change', ({ to, url }) => {
|
|
1058
1058
|
setState({ route: to, url });
|
|
1059
1059
|
});
|
|
1060
1060
|
}, [router]);
|
|
1061
|
-
return (
|
|
1062
|
-
React__default["default"].createElement(RouteContext.Provider, { value: state.route },
|
|
1063
|
-
React__default["default"].createElement(UrlContext.Provider, { value: state.url }, children))));
|
|
1061
|
+
return (jsxRuntime.jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsxRuntime.jsx(RouteContext.Provider, Object.assign({ value: state.route }, { children: jsxRuntime.jsx(UrlContext.Provider, Object.assign({ value: state.url }, { children: children }), void 0) }), void 0) }), void 0));
|
|
1064
1062
|
};
|
|
1065
1063
|
Provider.displayName = 'Provider';
|
|
1066
1064
|
|
|
1067
1065
|
const useRouter = () => {
|
|
1068
|
-
return
|
|
1066
|
+
return react.useContext(RouterContext);
|
|
1069
1067
|
};
|
|
1070
1068
|
|
|
1071
1069
|
const useRoute = () => {
|
|
1072
|
-
return
|
|
1070
|
+
return react.useContext(RouteContext);
|
|
1073
1071
|
};
|
|
1074
1072
|
|
|
1075
1073
|
const useUrl = () => {
|
|
1076
|
-
return
|
|
1074
|
+
return react.useContext(UrlContext);
|
|
1077
1075
|
};
|
|
1078
1076
|
|
|
1079
1077
|
const convertToNavigateOptions = (options) => {
|
|
@@ -1082,7 +1080,7 @@ const convertToNavigateOptions = (options) => {
|
|
|
1082
1080
|
const useNavigate = (rootOptions) => {
|
|
1083
1081
|
const router = useRouter();
|
|
1084
1082
|
const rootOpts = reactHooks.useShallowEqual(convertToNavigateOptions(rootOptions));
|
|
1085
|
-
return
|
|
1083
|
+
return react.useCallback((specificOptions) => {
|
|
1086
1084
|
const opts = rootOpts !== null && rootOpts !== void 0 ? rootOpts : convertToNavigateOptions(specificOptions);
|
|
1087
1085
|
return router.navigate(opts);
|
|
1088
1086
|
}, [rootOpts, router]);
|
|
@@ -1091,7 +1089,7 @@ const useNavigate = (rootOptions) => {
|
|
|
1091
1089
|
function Link(props) {
|
|
1092
1090
|
const { children, onClick, url, query, replace, target, navigateOptions, ...otherProps } = props;
|
|
1093
1091
|
const navigate = useNavigate({ url, query, replace, ...navigateOptions });
|
|
1094
|
-
const handleClick =
|
|
1092
|
+
const handleClick = react.useCallback((event) => {
|
|
1095
1093
|
// ignores the navigation when clicked using right mouse button or
|
|
1096
1094
|
// by holding a special modifier key: ctrl, command, win, alt, shift
|
|
1097
1095
|
if (target ||
|
|
@@ -1107,12 +1105,12 @@ function Link(props) {
|
|
|
1107
1105
|
onClick && onClick(event);
|
|
1108
1106
|
}, [navigate, target, onClick]);
|
|
1109
1107
|
const extraProps = { href: url, onClick: handleClick, target };
|
|
1110
|
-
if (
|
|
1111
|
-
return
|
|
1108
|
+
if (react.isValidElement(children)) {
|
|
1109
|
+
return react.cloneElement(children, extraProps);
|
|
1112
1110
|
}
|
|
1113
1111
|
return (
|
|
1114
1112
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
1115
|
-
|
|
1113
|
+
jsxRuntime.jsx("a", Object.assign({}, otherProps, extraProps, { children: children }), void 0));
|
|
1116
1114
|
}
|
|
1117
1115
|
Link.displayName = 'Link';
|
|
1118
1116
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tinkoff/router",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.72",
|
|
4
4
|
"description": "router",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"typings": "lib/index.d.ts",
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"build-for-publish": "true"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@tinkoff/react-hooks": "0.0.
|
|
25
|
+
"@tinkoff/react-hooks": "0.0.24",
|
|
26
26
|
"@tinkoff/url": "0.7.37",
|
|
27
27
|
"@tinkoff/utils": "^2.1.2"
|
|
28
28
|
},
|