@shuvi/router-react 1.0.0-rc.1 → 1.0.0-rc.12

package/esm/Router.js

@@ -1,11 +1,10 @@
 import * as React from 'react';
-import { useRef, useReducer } from 'react';
 import * as PropTypes from 'prop-types';
 import invariant from '@shuvi/utils/lib/invariant';
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
 import { RouterContext, RouteContext } from './contexts';
 import { useInRouterContext } from './hooks';
 import { __DEV__ } from './constants';
-import { useIsomorphicEffect } from './utils';
 /**
  * Provides location context for the rest of the app.
  *
@@ -22,19 +21,13 @@ export function Router({ children = null, static: staticProp = false, router })
             router: router
         };
     }, [staticProp, router]);
-    const unmount = useRef(false);
-    const forceupdate = useReducer(s => s * -1, 1)[1];
-    useIsomorphicEffect(() => () => (unmount.current = true), []);
-    useIsomorphicEffect(() => {
-        router.listen(() => {
-            if (unmount.current) {
-                return;
-            }
-            forceupdate();
-        });
-    }, [router]);
+    const { subscribe, getSnapshot } = React.useMemo(() => ({
+        subscribe: (fn) => router.listen(fn),
+        getSnapshot: () => router.current
+    }), [router]);
+    const current = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
     return (React.createElement(RouterContext.Provider, { value: contextVal },
-        React.createElement(RouteContext.Provider, { children: children, value: router.current })));
+        React.createElement(RouteContext.Provider, { children: children, value: current })));
 }
 if (__DEV__) {
     Router.displayName = 'Router';

package/esm/contexts.d.ts

@@ -10,8 +10,5 @@ export declare const RouteContext: React.Context<IRoute<{
     props?: import("@shuvi/router").IRouteComponentProps | undefined;
     path: string;
     filepath?: string | undefined;
-    id?: string | undefined;
-    __componentSourceWithAffix__?: string | undefined;
-    __resolveWeak__?: (() => any) | undefined;
 }>>;
 export declare const MatchedRouteContext: React.Context<IRouteContextObject<{}>>;

package/esm/hooks.d.ts

@@ -11,9 +11,6 @@ export declare function useCurrentRoute(): import("@shuvi/router").IRoute<{
     props?: import("@shuvi/router").IRouteComponentProps | undefined;
     path: string;
     filepath?: string | undefined;
-    id?: string | undefined;
-    __componentSourceWithAffix__?: string | undefined;
-    __resolveWeak__?: (() => any) | undefined;
 }>;
 /**
  * Blocks all navigation attempts. This is useful for preventing the page from

package/lib/Router.js

@@ -2,13 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Router = void 0;
 const React = require("react");
-const react_1 = 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.
  *
@@ -25,19 +24,13 @@ function Router({ children = null, static: staticProp = false, router }) {
             router: router
         };
     }, [staticProp, router]);
-    const unmount = (0, react_1.useRef)(false);
-    const forceupdate = (0, react_1.useReducer)(s => s * -1, 1)[1];
-    (0, utils_1.useIsomorphicEffect)(() => () => (unmount.current = true), []);
-    (0, utils_1.useIsomorphicEffect)(() => {
-        router.listen(() => {
-            if (unmount.current) {
-                return;
-            }
-            forceupdate();
-        });
-    }, [router]);
+    const { subscribe, getSnapshot } = React.useMemo(() => ({
+        subscribe: (fn) => router.listen(fn),
+        getSnapshot: () => router.current
+    }), [router]);
+    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: router.current })));
+        React.createElement(contexts_1.RouteContext.Provider, { children: children, value: current })));
 }
 exports.Router = Router;
 if (constants_1.__DEV__) {

package/lib/contexts.d.ts

@@ -10,8 +10,5 @@ export declare const RouteContext: React.Context<IRoute<{
     props?: import("@shuvi/router").IRouteComponentProps | undefined;
     path: string;
     filepath?: string | undefined;
-    id?: string | undefined;
-    __componentSourceWithAffix__?: string | undefined;
-    __resolveWeak__?: (() => any) | undefined;
 }>>;
 export declare const MatchedRouteContext: React.Context<IRouteContextObject<{}>>;

package/lib/hooks.d.ts

@@ -11,9 +11,6 @@ export declare function useCurrentRoute(): import("@shuvi/router").IRoute<{
     props?: import("@shuvi/router").IRouteComponentProps | undefined;
     path: string;
     filepath?: string | undefined;
-    id?: string | undefined;
-    __componentSourceWithAffix__?: string | undefined;
-    __resolveWeak__?: (() => any) | undefined;
 }>;
 /**
  * Blocks all navigation attempts. This is useful for preventing the page from

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shuvi/router-react",
-  "version": "1.0.0-rc.1",
+  "version": "1.0.0-rc.12",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/shuvijs/shuvi.git",
@@ -15,33 +15,35 @@
     "lib",
     "esm"
   ],
+  "scripts": {
+    "dev": "run-p watch:*",
+    "watch:esm": "tsc -p tsconfig.build.json -m esnext --outDir esm -w",
+    "watch:cjs": "tsc -p tsconfig.build.json -m commonjs --outDir lib -w",
+    "prebuild": "rimraf lib esm",
+    "build": "run-p build:*",
+    "build:esm": "tsc -p tsconfig.build.json -m esnext --outDir esm",
+    "build:cjs": "tsc -p tsconfig.build.json -m commonjs --outDir lib"
+  },
   "engines": {
     "node": ">= 12.0.0"
   },
   "dependencies": {
-    "@shuvi/router": "1.0.0-rc.1",
-    "@shuvi/platform-shared": "1.0.0-rc.1",
-    "@shuvi/utils": "1.0.0-rc.1",
-    "prop-types": "^15.8.1"
+    "@shuvi/router": "1.0.0-rc.12",
+    "@shuvi/platform-shared": "1.0.0-rc.12",
+    "@shuvi/utils": "1.0.0-rc.12",
+    "prop-types": "^15.8.1",
+    "use-sync-external-store": "1.1.0"
   },
   "devDependencies": {
     "@types/prop-types": "^15.7.5",
-    "@types/react": "^18.0.9",
-    "@types/react-test-renderer": "^18.0.0",
+    "@types/react": "18.0.9",
+    "@types/react-test-renderer": "18.0.0",
+    "@types/use-sync-external-store": "0.0.3",
     "react-test-renderer": "^18.1.0",
     "react": "18.1.0",
     "react-dom": "18.1.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0"
-  },
-  "scripts": {
-    "dev": "run-p watch:*",
-    "watch:esm": "tsc -p tsconfig.build.json -m esnext --outDir esm -w",
-    "watch:cjs": "tsc -p tsconfig.build.json -m commonjs --outDir lib -w",
-    "prebuild": "rimraf lib esm",
-    "build": "run-p build:*",
-    "build:esm": "tsc -p tsconfig.build.json -m esnext --outDir esm",
-    "build:cjs": "tsc -p tsconfig.build.json -m commonjs --outDir lib"
   }
-}
+}