@tinkoff/router 0.1.71 → 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 +5 -6
- package/lib/index.es.js +5 -6
- package/lib/index.js +16 -18
- package/package.json +1 -1
package/lib/index.browser.js
CHANGED
|
@@ -7,7 +7,8 @@ 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
|
|
10
|
+
import { jsx } from 'react/jsx-runtime';
|
|
11
|
+
import { createContext, useState, useContext, useCallback, isValidElement, cloneElement } from 'react';
|
|
11
12
|
import { useIsomorphicLayoutEffect, useShallowEqual } from '@tinkoff/react-hooks';
|
|
12
13
|
|
|
13
14
|
const PARAMETER_DELIMITER = ':';
|
|
@@ -1104,7 +1105,7 @@ const RouterContext = createContext(null);
|
|
|
1104
1105
|
const RouteContext = createContext(null);
|
|
1105
1106
|
const UrlContext = createContext(null);
|
|
1106
1107
|
|
|
1107
|
-
const Provider = ({ router, children
|
|
1108
|
+
const Provider = ({ router, children }) => {
|
|
1108
1109
|
const [state, setState] = useState({
|
|
1109
1110
|
route: router.getCurrentRoute(),
|
|
1110
1111
|
url: router.getCurrentUrl(),
|
|
@@ -1114,9 +1115,7 @@ const Provider = ({ router, children, }) => {
|
|
|
1114
1115
|
setState({ route: to, url });
|
|
1115
1116
|
});
|
|
1116
1117
|
}, [router]);
|
|
1117
|
-
return (
|
|
1118
|
-
React.createElement(RouteContext.Provider, { value: state.route },
|
|
1119
|
-
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));
|
|
1120
1119
|
};
|
|
1121
1120
|
Provider.displayName = 'Provider';
|
|
1122
1121
|
|
|
@@ -1168,7 +1167,7 @@ function Link(props) {
|
|
|
1168
1167
|
}
|
|
1169
1168
|
return (
|
|
1170
1169
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
1171
|
-
|
|
1170
|
+
jsx("a", Object.assign({}, otherProps, extraProps, { children: children }), void 0));
|
|
1172
1171
|
}
|
|
1173
1172
|
Link.displayName = 'Link';
|
|
1174
1173
|
|
package/lib/index.es.js
CHANGED
|
@@ -7,7 +7,8 @@ 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
|
|
10
|
+
import { jsx } from 'react/jsx-runtime';
|
|
11
|
+
import { createContext, useState, useContext, useCallback, isValidElement, cloneElement } from 'react';
|
|
11
12
|
import { useIsomorphicLayoutEffect, useShallowEqual } from '@tinkoff/react-hooks';
|
|
12
13
|
|
|
13
14
|
const PARAMETER_DELIMITER = ':';
|
|
@@ -1032,7 +1033,7 @@ 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(),
|
|
@@ -1042,9 +1043,7 @@ const Provider = ({ router, children, }) => {
|
|
|
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,12 +1044,12 @@ 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
|
});
|
|
@@ -1058,22 +1058,20 @@ const Provider = ({ router, children, }) => {
|
|
|
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
|
|