@shuvi/router-react 0.0.1-rc.9 → 1.0.0-rc.10

package/lib/Link.d.ts

@@ -1,11 +1,35 @@
 import * as React from 'react';
 import { State, PathRecord } from '@shuvi/router';
 /**
- * The public API for rendering a history-aware <a>.
+ * The public API for rendering a history-aware `<a>`.
+ * ```ts
+ * // jump to `/about`
+ * <Link to="/about">About</Link>
+ * // jump with query
+ * <Link to="/about?sort=name">About</Link>
+ * // with some state
+ * <Link to="/about" state={{fromDashboard: true}}>About</Link>
+ * // props `to` could be a object
+ * <Link to={{
+ *   pathname: "/about",
+ *   search: "?sort=name",
+ *   hash: "#the-hash",
+ * }}>About</Link>
+ * // props target '_self' | '_blank', default is '_self'
+ * <Link to="/about" target="_self">About</Link>
+ * // overrides default redirect mode by `replace`
+ * <Link to="/about" replace>About</Link>
+ * // if `onClick` function, run it first
+ * <Link to="/about" onClick={fn}>About</Link>
+ * // other props will be delivered to `<a>`
+ * <Link to="/about" a='a' b='b'>About</Link> => <{...rest} a>
+ * ```
  */
 export declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
 export interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> {
     replace?: boolean;
     state?: State;
     to: PathRecord;
+    prefetch?: boolean;
+    onMouseEnter?: (e: any) => void;
 }

package/lib/Link.js

@@ -10,19 +10,10 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
-const prop_types_1 = __importDefault(require("prop-types"));
+exports.Link = void 0;
+const React = require("react");
+const PropTypes = require("prop-types");
 const _1 = require(".");
 const router_1 = require("@shuvi/router");
 const constants_1 = require("./constants");
@@ -31,14 +22,36 @@ function isModifiedEvent(event) {
     return !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey);
 }
 /**
- * The public API for rendering a history-aware <a>.
+ * The public API for rendering a history-aware `<a>`.
+ * ```ts
+ * // jump to `/about`
+ * <Link to="/about">About</Link>
+ * // jump with query
+ * <Link to="/about?sort=name">About</Link>
+ * // with some state
+ * <Link to="/about" state={{fromDashboard: true}}>About</Link>
+ * // props `to` could be a object
+ * <Link to={{
+ *   pathname: "/about",
+ *   search: "?sort=name",
+ *   hash: "#the-hash",
+ * }}>About</Link>
+ * // props target '_self' | '_blank', default is '_self'
+ * <Link to="/about" target="_self">About</Link>
+ * // overrides default redirect mode by `replace`
+ * <Link to="/about" replace>About</Link>
+ * // if `onClick` function, run it first
+ * <Link to="/about" onClick={fn}>About</Link>
+ * // other props will be delivered to `<a>`
+ * <Link to="/about" a='a' b='b'>About</Link> => <{...rest} a>
+ * ```
  */
 exports.Link = React.forwardRef(function LinkWithRef(_a, ref) {
     var { onClick, replace: replaceProp = false, state, target, to } = _a, rest = __rest(_a, ["onClick", "replace", "state", "target", "to"]);
-    let href = _1.useHref(to);
-    let navigate = _1.useNavigate();
-    const location = hooks_1.useCurrentRoute();
-    let path = _1.useResolvedPath(to);
+    let href = (0, _1.useHref)(to);
+    let navigate = (0, _1.useNavigate)();
+    const location = (0, hooks_1.useCurrentRoute)();
+    let path = (0, _1.useResolvedPath)(to);
     function handleClick(event) {
         if (onClick)
             onClick(event);
@@ -50,7 +63,8 @@ exports.Link = React.forwardRef(function LinkWithRef(_a, ref) {
             event.preventDefault();
             // If the URL hasn't changed, a regular <a> will do a replace instead of
             // a push, so do the same here.
-            let replace = !!replaceProp || router_1.pathToString(location) === router_1.pathToString(path);
+            let replace = !!replaceProp ||
+                (location && (0, router_1.pathToString)(location)) === (0, router_1.pathToString)(path);
             navigate(to, { replace, state });
         }
     }
@@ -61,16 +75,19 @@ exports.Link = React.forwardRef(function LinkWithRef(_a, ref) {
 if (constants_1.__DEV__) {
     exports.Link.displayName = 'Link';
     exports.Link.propTypes = {
-        onClick: prop_types_1.default.func,
-        replace: prop_types_1.default.bool,
-        state: prop_types_1.default.object,
-        target: prop_types_1.default.string,
-        to: prop_types_1.default.oneOfType([
-            prop_types_1.default.string,
-            prop_types_1.default.shape({
-                pathname: prop_types_1.default.string,
-                search: prop_types_1.default.string,
-                hash: prop_types_1.default.string
+        onClick: PropTypes.func,
+        replace: PropTypes.bool,
+        state: PropTypes.object,
+        target: PropTypes.string,
+        prefetch: PropTypes.bool,
+        onMouseEnter: PropTypes.func,
+        // @ts-ignore proptypes's bug?
+        to: PropTypes.oneOfType([
+            PropTypes.string,
+            PropTypes.shape({
+                pathname: PropTypes.string,
+                search: PropTypes.string,
+                hash: PropTypes.string
             })
         ]).isRequired
     };

package/lib/MemoryRouter.d.ts

@@ -1,8 +1,8 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import { IMemoryRouterProps } from './types';
 /**
- * A <Router> that stores all entries in memory.
+ * a <Router> that stores all entries in memory.
  */
 export declare function MemoryRouter({ basename, children, routes, initialEntries, initialIndex }: IMemoryRouterProps): React.ReactElement;
 export declare namespace MemoryRouter {

package/lib/MemoryRouter.js

@@ -1,43 +1,41 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const prop_types_1 = __importDefault(require("prop-types"));
+exports.MemoryRouter = void 0;
+const React = require("react");
+const PropTypes = require("prop-types");
 const router_1 = require("@shuvi/router");
 const Router_1 = require("./Router");
 const constants_1 = require("./constants");
 /**
- * A <Router> that stores all entries in memory.
+ * a <Router> that stores all entries in memory.
  */
 function MemoryRouter({ basename, children, routes, initialEntries, initialIndex }) {
-    let routerRef = react_1.default.useRef();
+    let routerRef = React.useRef();
     if (routerRef.current == null) {
-        routerRef.current = router_1.createRouter({
+        routerRef.current = (0, router_1.createRouter)({
             basename,
             routes: routes || [],
-            history: router_1.createMemoryHistory({ initialEntries, initialIndex })
-        });
+            history: (0, router_1.createMemoryHistory)({ initialEntries, initialIndex })
+        }).init();
     }
-    return react_1.default.createElement(Router_1.Router, { children: children, router: routerRef.current });
+    return React.createElement(Router_1.Router, { children: children, router: routerRef.current });
 }
 exports.MemoryRouter = MemoryRouter;
 if (constants_1.__DEV__) {
     MemoryRouter.displayName = 'MemoryRouter';
     MemoryRouter.propTypes = {
-        children: prop_types_1.default.node,
-        routes: prop_types_1.default.arrayOf(prop_types_1.default.object),
-        initialEntries: prop_types_1.default.arrayOf(prop_types_1.default.oneOfType([
-            prop_types_1.default.string,
-            prop_types_1.default.shape({
-                pathname: prop_types_1.default.string,
-                search: prop_types_1.default.string,
-                hash: prop_types_1.default.string,
-                state: prop_types_1.default.object,
-                key: prop_types_1.default.string
+        children: PropTypes.node,
+        routes: PropTypes.arrayOf(PropTypes.object),
+        initialEntries: PropTypes.arrayOf(PropTypes.oneOfType([
+            PropTypes.string,
+            PropTypes.shape({
+                pathname: PropTypes.string,
+                search: PropTypes.string,
+                hash: PropTypes.string,
+                state: PropTypes.object,
+                key: PropTypes.string
             })
         ])),
-        initialIndex: prop_types_1.default.number
+        initialIndex: PropTypes.number
     };
 }

package/lib/Router.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import { IRouterProps } from './types';
 /**
  * Provides location context for the rest of the app.

package/lib/Router.js

@@ -1,21 +1,13 @@
 "use strict";
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const prop_types_1 = __importDefault(require("prop-types"));
+exports.Router = void 0;
+const React = require("react");
+const PropTypes = require("prop-types");
+const invariant_1 = require("@shuvi/utils/lib/invariant");
+const shim_1 = require("use-sync-external-store/shim");
 const contexts_1 = require("./contexts");
 const hooks_1 = require("./hooks");
 const constants_1 = require("./constants");
-const utils_1 = require("./utils");
 /**
  * Provides location context for the rest of the app.
  *
@@ -24,32 +16,28 @@ const utils_1 = require("./utils");
  * in web browsers or a <StaticRouter> for server rendering.
  */
 function Router({ children = null, static: staticProp = false, router }) {
-    utils_1.invariant(!hooks_1.useInRouterContext(), `You cannot render a <Router> inside another <Router>.` +
+    (0, invariant_1.default)(!(0, hooks_1.useInRouterContext)(), `You cannot render a <Router> inside another <Router>.` +
         ` You never need more than one.`);
-    const contextVal = react_1.default.useMemo(() => {
+    const contextVal = React.useMemo(() => {
         return {
             static: staticProp,
             router: router
         };
     }, [staticProp, router]);
-    const unmount = react_1.useRef(false);
-    const forceupdate = react_1.useReducer(s => s * -1, 1)[1];
-    utils_1.useIsomorphicEffect(() => () => (unmount.current = true), []);
-    utils_1.useIsomorphicEffect(() => router.listen(() => {
-        if (unmount.current) {
-            return;
-        }
-        forceupdate();
+    const { subscribe, getSnapshot } = React.useMemo(() => ({
+        subscribe: (fn) => router.listen(fn),
+        getSnapshot: () => router.current
     }), [router]);
-    return (react_1.default.createElement(contexts_1.RouterContext.Provider, { value: contextVal },
-        react_1.default.createElement(contexts_1.RouteContext.Provider, { children: children, value: router.current })));
+    const current = (0, shim_1.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+    return (React.createElement(contexts_1.RouterContext.Provider, { value: contextVal },
+        React.createElement(contexts_1.RouteContext.Provider, { children: children, value: current })));
 }
 exports.Router = Router;
 if (constants_1.__DEV__) {
     Router.displayName = 'Router';
     Router.propTypes = {
-        children: prop_types_1.default.node,
-        router: prop_types_1.default.object,
-        static: prop_types_1.default.bool
+        children: PropTypes.node,
+        router: PropTypes.object,
+        static: PropTypes.bool
     };
 }

package/lib/RouterView.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 export declare function RouterView(): React.ReactElement | null;
 export declare namespace RouterView {
     var displayName: string;

package/lib/RouterView.js

@@ -1,41 +1,42 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const utils_1 = require("@shuvi/router/lib/utils");
+exports.RouterView = void 0;
+const React = require("react");
+const router_1 = require("@shuvi/router");
 const hooks_1 = require("./hooks");
 const constants_1 = require("./constants");
 const contexts_1 = require("./contexts");
-const utils_2 = require("./utils");
-const defaultElement = react_1.default.createElement(RouterView, null);
+const utils_1 = require("./utils");
+const defaultElement = React.createElement(RouterView, null);
+function MatchedRoute({ match, depth, parentPathname, parentParams }) {
+    const { route, params, pathname } = match;
+    const element = React.useMemo(() => route.component
+        ? React.createElement(route.component, route.props)
+        : defaultElement, [route.component, route.props, defaultElement]);
+    return (React.createElement(contexts_1.MatchedRouteContext.Provider, { children: element, value: {
+            depth: depth + 1,
+            params: (0, utils_1.readOnly)(Object.assign(Object.assign({}, parentParams), params)),
+            pathname: (0, router_1.joinPaths)([parentPathname, pathname]),
+            route
+        } }));
+}
 function RouterView() {
-    let { depth, pathname: parentPathname, params: parentParams } = react_1.default.useContext(contexts_1.MactedRouteContext);
-    const { matches } = hooks_1.useCurrentRoute();
-    if (!matches) {
+    let { depth, pathname: parentPathname, params: parentParams } = React.useContext(contexts_1.MatchedRouteContext);
+    const { matches } = (0, hooks_1.useCurrentRoute)();
+    if (!matches.length) {
         return null;
     }
     // Otherwise render an element.
     const matched = matches[depth];
     if (!matched) {
         if (constants_1.__DEV__) {
-            utils_2.warningOnce(parentPathname, false, `Use <RouterView/> under path "${parentPathname}", but it has no children routes.` +
+            (0, utils_1.warningOnce)(parentPathname, false, `Use <RouterView/> under path "${parentPathname}", but it has no children routes.` +
                 `\n\n` +
                 `Please remove the <RouterView/>.`);
         }
         return null;
     }
-    const { route, params, pathname } = matched;
-    const element = route.component
-        ? react_1.default.createElement(route.component, route.props)
-        : defaultElement;
-    return (react_1.default.createElement(contexts_1.MactedRouteContext.Provider, { children: element, value: {
-            depth: depth + 1,
-            params: utils_2.readOnly(Object.assign(Object.assign({}, parentParams), params)),
-            pathname: utils_1.joinPaths([parentPathname, pathname]),
-            route
-        } }));
+    return (React.createElement(MatchedRoute, { match: matched, depth: depth, parentPathname: parentPathname, parentParams: parentParams }));
 }
 exports.RouterView = RouterView;
 if (constants_1.__DEV__) {

package/lib/constants.js

@@ -1,3 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.__DEV__ = void 0;
 exports.__DEV__ = process.env.NODE_ENV !== 'production';

package/lib/contexts.d.ts

@@ -1,6 +1,14 @@
-import React from 'react';
+import * as React from 'react';
 import { IRoute } from '@shuvi/router';
 import { IRouterContextObject, IRouteContextObject } from './types';
 export declare const RouterContext: React.Context<IRouterContextObject>;
-export declare const RouteContext: React.Context<IRoute<import("@shuvi/router").IRouteRecord<any>>>;
-export declare const MactedRouteContext: React.Context<IRouteContextObject>;
+export declare const RouteContext: React.Context<IRoute<{
+    caseSensitive?: boolean | undefined;
+    children?: any[] | undefined;
+    component?: any;
+    redirect?: string | undefined;
+    props?: import("@shuvi/router").IRouteComponentProps | undefined;
+    path: string;
+    filepath?: string | undefined;
+}>>;
+export declare const MatchedRouteContext: React.Context<IRouteContextObject<{}>>;

package/lib/contexts.js

@@ -1,25 +1,23 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
+exports.MatchedRouteContext = exports.RouteContext = exports.RouterContext = void 0;
+const React = require("react");
 const utils_1 = require("./utils");
 const constants_1 = require("./constants");
-exports.RouterContext = react_1.default.createContext(null);
+exports.RouterContext = React.createContext(null);
 if (constants_1.__DEV__) {
     exports.RouterContext.displayName = 'Router';
 }
-exports.RouteContext = react_1.default.createContext(null);
+exports.RouteContext = React.createContext(null);
 if (constants_1.__DEV__) {
     exports.RouterContext.displayName = 'Route';
 }
-exports.MactedRouteContext = react_1.default.createContext({
+exports.MatchedRouteContext = React.createContext({
     depth: 0,
-    params: utils_1.readOnly({}),
+    params: (0, utils_1.readOnly)({}),
     pathname: '',
     route: null
 });
 if (constants_1.__DEV__) {
-    exports.MactedRouteContext.displayName = 'MactedRoute';
+    exports.MatchedRouteContext.displayName = 'MatchedRoute';
 }

package/lib/hooks.d.ts

@@ -1,6 +1,17 @@
 import { IParams, IPathMatch, Blocker, Path, PathRecord, IRouter, IPathPattern } from '@shuvi/router';
-import { INavigateFunction } from './types';
-export declare function useCurrentRoute(): import("@shuvi/router").IRoute<import("@shuvi/router").IRouteRecord<any>>;
+import { INavigateFunction, IRouteContextObject } from './types';
+/**
+ *  is just point `router.current` object
+ */
+export declare function useCurrentRoute(): import("@shuvi/router").IRoute<{
+    caseSensitive?: boolean | undefined;
+    children?: any[] | undefined;
+    component?: any;
+    redirect?: string | undefined;
+    props?: import("@shuvi/router").IRouteComponentProps | undefined;
+    path: string;
+    filepath?: string | undefined;
+}>;
 /**
  * Blocks all navigation attempts. This is useful for preventing the page from
  * changing until some condition is met, like saving form data.
@@ -37,5 +48,7 @@ export declare function useParams(): IParams;
 export declare function useResolvedPath(to: PathRecord): Path;
 /**
  * Returns the current router object
+ * two parts, one is router behavior(browser history mode, hash history mode), another is router content
  */
 export declare function useRouter(): IRouter;
+export declare function useMatchedRoute<ExtendedTypes = {}>(): IRouteContextObject<ExtendedTypes>;

package/lib/hooks.js

@@ -1,18 +1,17 @@
 "use strict";
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
+exports.useMatchedRoute = exports.useRouter = exports.useResolvedPath = exports.useParams = exports.useNavigate = exports.useMatch = exports.useInRouterContext = exports.useHref = exports.useBlocker = exports.useCurrentRoute = void 0;
+const React = require("react");
+const react_1 = require("react");
 const router_1 = require("@shuvi/router");
+const invariant_1 = require("@shuvi/utils/lib/invariant");
 const contexts_1 = require("./contexts");
 const utils_1 = require("./utils");
+/**
+ *  is just point `router.current` object
+ */
 function useCurrentRoute() {
-    return react_1.useContext(contexts_1.RouteContext);
+    return (0, react_1.useContext)(contexts_1.RouteContext);
 }
 exports.useCurrentRoute = useCurrentRoute;
 /**
@@ -20,9 +19,9 @@ exports.useCurrentRoute = useCurrentRoute;
  * changing until some condition is met, like saving form data.
  */
 function useBlocker(blocker, when = true) {
-    utils_1.invariant(useInRouterContext(), `useBlocker() may be used only in the context of a <Router> component.`);
-    const { router } = react_1.useContext(contexts_1.RouterContext);
-    react_1.default.useEffect(() => {
+    (0, invariant_1.default)(useInRouterContext(), `useBlocker() may be used only in the context of a <Router> component.`);
+    const { router } = (0, react_1.useContext)(contexts_1.RouterContext);
+    React.useEffect(() => {
         if (!when)
             return;
         let unblock = router.block((tx) => {
@@ -44,8 +43,8 @@ exports.useBlocker = useBlocker;
  * custom links that are also accessible and preserve right-click behavior.
  */
 function useHref(to) {
-    utils_1.invariant(useInRouterContext(), `useHref() may be used only in the context of a <Router> component.`);
-    const { router } = react_1.useContext(contexts_1.RouterContext);
+    (0, invariant_1.default)(useInRouterContext(), `useHref() may be used only in the context of a <Router> component.`);
+    const { router } = (0, react_1.useContext)(contexts_1.RouterContext);
     const path = useResolvedPath(to);
     return router.resolve(path).href;
 }
@@ -54,7 +53,7 @@ exports.useHref = useHref;
  * Returns true if this component is a descendant of a <Router>.
  */
 function useInRouterContext() {
-    return react_1.useContext(contexts_1.RouterContext) != null;
+    return (0, react_1.useContext)(contexts_1.RouterContext) != null;
 }
 exports.useInRouterContext = useInRouterContext;
 /**
@@ -63,9 +62,9 @@ exports.useInRouterContext = useInRouterContext;
  * <NavLink>.
  */
 function useMatch(pattern) {
-    utils_1.invariant(useInRouterContext(), `useMatch() may be used only in the context of a <Router> component.`);
+    (0, invariant_1.default)(useInRouterContext(), `useMatch() may be used only in the context of a <Router> component.`);
     const { pathname } = useCurrentRoute();
-    return router_1.matchPath(pattern, pathname);
+    return (0, router_1.matchPathname)(pattern, pathname);
 }
 exports.useMatch = useMatch;
 /**
@@ -73,14 +72,14 @@ exports.useMatch = useMatch;
  * may also be used by other elements to change the location.
  */
 function useNavigate() {
-    utils_1.invariant(useInRouterContext(), `useNavigate() may be used only in the context of a <Router> component.`);
-    const { router } = react_1.useContext(contexts_1.RouterContext);
-    const { pathname } = react_1.useContext(contexts_1.MactedRouteContext);
-    const activeRef = react_1.default.useRef(false);
-    react_1.default.useEffect(() => {
+    (0, invariant_1.default)(useInRouterContext(), `useNavigate() may be used only in the context of a <Router> component.`);
+    const { router } = (0, react_1.useContext)(contexts_1.RouterContext);
+    const { pathname } = (0, react_1.useContext)(contexts_1.MatchedRouteContext);
+    const activeRef = React.useRef(false);
+    React.useEffect(() => {
         activeRef.current = true;
     });
-    let navigate = react_1.default.useCallback((to, options = {}) => {
+    let navigate = React.useCallback((to, options = {}) => {
         if (activeRef.current) {
             if (typeof to === 'number') {
                 router.go(to);
@@ -91,7 +90,7 @@ function useNavigate() {
             }
         }
         else {
-            utils_1.warning(false, `You should call navigate() in a useEffect, not when ` +
+            (0, utils_1.warning)(false, `You should call navigate() in a useEffect, not when ` +
                 `your component is first rendered.`);
         }
     }, [router, pathname]);
@@ -103,23 +102,28 @@ exports.useNavigate = useNavigate;
  * URL that were matched by the route path.
  */
 function useParams() {
-    return react_1.useContext(contexts_1.MactedRouteContext).params;
+    return (0, react_1.useContext)(contexts_1.MatchedRouteContext).params;
 }
 exports.useParams = useParams;
 /**
  * Resolves the pathname of the given `to` value against the current location.
  */
 function useResolvedPath(to) {
-    const { router } = react_1.useContext(contexts_1.RouterContext);
-    const { pathname } = react_1.useContext(contexts_1.MactedRouteContext);
-    return react_1.default.useMemo(() => router.resolve(to, pathname).path, [to, pathname]);
+    const { router } = (0, react_1.useContext)(contexts_1.RouterContext);
+    const { pathname } = (0, react_1.useContext)(contexts_1.MatchedRouteContext);
+    return React.useMemo(() => router.resolve(to, pathname).path, [to, pathname]);
 }
 exports.useResolvedPath = useResolvedPath;
 /**
  * Returns the current router object
+ * two parts, one is router behavior(browser history mode, hash history mode), another is router content
  */
 function useRouter() {
-    utils_1.invariant(useInRouterContext(), `useRouter() may be used only in the context of a <Router> component.`);
-    return react_1.useContext(contexts_1.RouterContext).router;
+    (0, invariant_1.default)(useInRouterContext(), `useRouter() may be used only in the context of a <Router> component.`);
+    return (0, react_1.useContext)(contexts_1.RouterContext).router;
 }
 exports.useRouter = useRouter;
+function useMatchedRoute() {
+    return (0, react_1.useContext)(contexts_1.MatchedRouteContext);
+}
+exports.useMatchedRoute = useMatchedRoute;

package/lib/index.d.ts

@@ -1,7 +1,9 @@
-export { generatePath } from './utils';
+export { generatePath, useIsomorphicEffect } from './utils';
 export { MemoryRouter } from './MemoryRouter';
 export { RouterView } from './RouterView';
 export { Router } from './Router';
-export { Link } from './Link';
+export { Link, LinkProps } from './Link';
 export * from './hooks';
+export * from './contexts';
 export * from './types';
+export * from '@shuvi/router';