@teambit/react-router 0.0.802 → 0.0.803

package/dist/react-router.ui.runtime.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { Location, NavigationType, RouteProps } from 'react-router-dom';
 import { SlotRegistry } from '@teambit/harmony';
-import { RenderPlugins } from '@teambit/ui';
+import type { SSR } from '@teambit/ui';
 import { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
 import { Routing } from './routing-method';
 export declare type LocationListener = (location: Location, action: NavigationType) => void;
@@ -49,8 +49,9 @@ export declare class ReactRouterUI {
     navigateTo: (path: Location | string, action?: NavigationType | undefined) => void;
     private navigate?;
     private handleLocationChange;
-    private AppRoutingContext;
-    renderPlugin: RenderPlugins<RenderContext>;
+    private RoutingContext;
+    private ServerRouting;
+    renderPlugin: SSR.RenderPlugin<RenderContext>;
     static slots: (((registerFn: () => string) => SlotRegistry<RouteProps>) | ((registerFn: () => string) => SlotRegistry<LocationListener>))[];
     static runtime: import("@teambit/harmony").RuntimeDefinition;
     static provider(deps: any, config: any, [routeSlot, routeChangeSlot]: [RouteSlot, RouteChangeSlot]): Promise<ReactRouterUI>;

package/dist/react-router.ui.runtime.js

@@ -53,16 +53,6 @@ function _ui() {
   return data;
 }
 
-function _uiFoundationUi() {
-  const data = require("@teambit/ui-foundation.ui.is-browser");
-
-  _uiFoundationUi = function () {
-    return data;
-  };
-
-  return data;
-}
-
 function _reactRouter() {
   const data = require("./react-router.aspect");
 
@@ -115,7 +105,7 @@ class ReactRouterUI {
   routeChangeListener) {
     this.routeSlot = routeSlot;
     this.routeChangeListener = routeChangeListener;
-    (0, _defineProperty2().default)(this, "routingMode", _uiFoundationUi().isBrowser ? _routingMethod().Routing.url : _routingMethod().Routing.static);
+    (0, _defineProperty2().default)(this, "routingMode", _routingMethod().Routing.url);
     (0, _defineProperty2().default)(this, "navigateTo", (path, action) => {
       var _this$navigate, _this$navigate2;
 
@@ -145,7 +135,7 @@ class ReactRouterUI {
       const listeners = this.routeChangeListener.values();
       listeners.forEach(listener => listener(location, action));
     });
-    (0, _defineProperty2().default)(this, "AppRoutingContext", ({
+    (0, _defineProperty2().default)(this, "RoutingContext", ({
       children,
       renderCtx
     }) => {
@@ -158,6 +148,19 @@ class ReactRouterUI {
         onNavigatorChange: nav => this.navigate = nav
       }));
     });
+    (0, _defineProperty2().default)(this, "ServerRouting", ({
+      children,
+      renderCtx
+    }) => {
+      return /*#__PURE__*/_react().default.createElement(_routeContext().RouteContext, {
+        reactRouterUi: this,
+        routing: _routingMethod().Routing.static,
+        location: renderCtx === null || renderCtx === void 0 ? void 0 : renderCtx.initialLocation
+      }, children, /*#__PURE__*/_react().default.createElement(_LocationHooks().LocationHooks, {
+        onLocationChange: this.handleLocationChange,
+        onNavigatorChange: nav => this.navigate = nav
+      }));
+    });
     (0, _defineProperty2().default)(this, "renderPlugin", {
       browserInit: () => {
         const initialLocation = `${window.location.pathname}${window.location.search}${window.location.hash}`;
@@ -173,7 +176,8 @@ class ReactRouterUI {
           initialLocation
         };
       },
-      reactContext: this.AppRoutingContext
+      reactClientContext: this.RoutingContext,
+      reactServerContext: this.ServerRouting
     });
   }
   /**

package/dist/react-router.ui.runtime.js.map

@@ -1 +1 @@
-{"version":3,"names":["ReactRouterUI","constructor","routeSlot","routeChangeListener","isBrowser","Routing","url","static","path","action","state","undefined","navigate","replace","location","listeners","values","forEach","listener","children","renderCtx","routingMode","initialLocation","handleLocationChange","nav","browserInit","window","pathname","search","hash","serverInit","browser","reactContext","AppRoutingContext","renderRoutes","routes","setRoutingMode","routing","register","route","registerListener","provider","deps","config","routeChangeSlot","Slot","withType","UIRuntime","ReactRouterAspect","addRuntime"],"sources":["react-router.ui.runtime.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { NavigateFunction } from 'react-router-dom';\nimport type { Location, NavigationType, RouteProps } from 'react-router-dom';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport { RenderPlugins, UIRuntime } from '@teambit/ui';\nimport { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { isBrowser } from '@teambit/ui-foundation.ui.is-browser';\n\nimport { ReactRouterAspect } from './react-router.aspect';\nimport { RouteContext, RootRoute } from './route-context';\nimport { Routing } from './routing-method';\nimport { LocationHooks } from './LocationHooks';\n\nexport type LocationListener = (location: Location, action: NavigationType) => void;\ntype RouteChangeSlot = SlotRegistry<LocationListener>;\ntype RenderContext = { initialLocation?: string };\n\nexport class ReactRouterUI {\n  private routingMode = isBrowser ? Routing.url : Routing.static;\n\n  constructor(\n    /**\n     * route slot.\n     */\n    private routeSlot: RouteSlot,\n    /**\n     *\n     */\n    private routeChangeListener: RouteChangeSlot\n  ) {}\n\n  /**\n   * render all slot routes.\n   */\n  renderRoutes(routes: RouteProps[]) {\n    return <RootRoute routeSlot={this.routeSlot} rootRoutes={routes} />;\n  }\n\n  /** decides how navigation is stored and applied.\n   * Url - updates the `window.location.pathname`.\n   * Hash - updates `window.location.hash`.\n   * InMemory - store state internally and don't update the browser.\n   */\n  setRoutingMode(routing: Routing) {\n    this.routingMode = routing;\n  }\n\n  /**\n   * register a new route.\n   */\n  register(route: RouteProps) {\n    this.routeSlot.register(route);\n    return this;\n  }\n\n  registerListener(listener: LocationListener) {\n    this.routeChangeListener.register(listener);\n  }\n\n  /**\n   * change browser location\n   */\n  navigateTo = (\n    /** destination */\n    path: Location | string,\n    /** history action to execute (pop / push / replace) */\n    action?: NavigationType\n  ) => {\n    const state = typeof path !== 'string' ? path.state : undefined;\n\n    switch (action) {\n      case 'POP':\n        return; // TBD;\n      case 'REPLACE':\n        this.navigate?.(path, { replace: true, state });\n        return;\n      case 'PUSH':\n      default:\n        this.navigate?.(path, { state });\n    }\n  };\n\n  private navigate?: NavigateFunction = undefined;\n\n  private handleLocationChange = (location: Location, action: NavigationType) => {\n    const listeners = this.routeChangeListener.values();\n    listeners.forEach((listener) => listener(location, action));\n  };\n\n  private AppRoutingContext = ({ children, renderCtx }: { children: ReactNode; renderCtx?: RenderContext }) => {\n    return (\n      <RouteContext reactRouterUi={this} routing={this.routingMode} location={renderCtx?.initialLocation}>\n        {children}\n        <LocationHooks\n          onLocationChange={this.handleLocationChange}\n          onNavigatorChange={(nav) => (this.navigate = nav)}\n        />\n      </RouteContext>\n    );\n  };\n\n  public renderPlugin: RenderPlugins<RenderContext> = {\n    browserInit: () => {\n      const initialLocation = `${window.location.pathname}${window.location.search}${window.location.hash}`;\n      return { initialLocation };\n    },\n    serverInit: ({ browser }) => {\n      const initialLocation = browser?.location.url;\n      return { initialLocation };\n    },\n    reactContext: this.AppRoutingContext,\n  };\n\n  static slots = [Slot.withType<RouteProps>(), Slot.withType<LocationListener>()];\n  static runtime = UIRuntime;\n\n  static async provider(deps, config, [routeSlot, routeChangeSlot]: [RouteSlot, RouteChangeSlot]) {\n    return new ReactRouterUI(routeSlot, routeChangeSlot);\n  }\n}\n\nReactRouterAspect.addRuntime(ReactRouterUI);\n"],"mappings":"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"}
+{"version":3,"names":["ReactRouterUI","constructor","routeSlot","routeChangeListener","Routing","url","path","action","state","undefined","navigate","replace","location","listeners","values","forEach","listener","children","renderCtx","routingMode","initialLocation","handleLocationChange","nav","static","browserInit","window","pathname","search","hash","serverInit","browser","reactClientContext","RoutingContext","reactServerContext","ServerRouting","renderRoutes","routes","setRoutingMode","routing","register","route","registerListener","provider","deps","config","routeChangeSlot","Slot","withType","UIRuntime","ReactRouterAspect","addRuntime"],"sources":["react-router.ui.runtime.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { NavigateFunction } from 'react-router-dom';\nimport type { Location, NavigationType, RouteProps } from 'react-router-dom';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport { UIRuntime } from '@teambit/ui';\nimport type { SSR } from '@teambit/ui';\nimport { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';\n\nimport { ReactRouterAspect } from './react-router.aspect';\nimport { RouteContext, RootRoute } from './route-context';\nimport { Routing } from './routing-method';\nimport { LocationHooks } from './LocationHooks';\n\nexport type LocationListener = (location: Location, action: NavigationType) => void;\ntype RouteChangeSlot = SlotRegistry<LocationListener>;\ntype RenderContext = { initialLocation?: string };\n\nexport class ReactRouterUI {\n  private routingMode = Routing.url;\n\n  constructor(\n    /**\n     * route slot.\n     */\n    private routeSlot: RouteSlot,\n    /**\n     *\n     */\n    private routeChangeListener: RouteChangeSlot\n  ) {}\n\n  /**\n   * render all slot routes.\n   */\n  renderRoutes(routes: RouteProps[]) {\n    return <RootRoute routeSlot={this.routeSlot} rootRoutes={routes} />;\n  }\n\n  /** decides how navigation is stored and applied.\n   * Url - updates the `window.location.pathname`.\n   * Hash - updates `window.location.hash`.\n   * InMemory - store state internally and don't update the browser.\n   */\n  setRoutingMode(routing: Routing) {\n    this.routingMode = routing;\n  }\n\n  /**\n   * register a new route.\n   */\n  register(route: RouteProps) {\n    this.routeSlot.register(route);\n    return this;\n  }\n\n  registerListener(listener: LocationListener) {\n    this.routeChangeListener.register(listener);\n  }\n\n  /**\n   * change browser location\n   */\n  navigateTo = (\n    /** destination */\n    path: Location | string,\n    /** history action to execute (pop / push / replace) */\n    action?: NavigationType\n  ) => {\n    const state = typeof path !== 'string' ? path.state : undefined;\n\n    switch (action) {\n      case 'POP':\n        return; // TBD;\n      case 'REPLACE':\n        this.navigate?.(path, { replace: true, state });\n        return;\n      case 'PUSH':\n      default:\n        this.navigate?.(path, { state });\n    }\n  };\n\n  private navigate?: NavigateFunction = undefined;\n\n  private handleLocationChange = (location: Location, action: NavigationType) => {\n    const listeners = this.routeChangeListener.values();\n    listeners.forEach((listener) => listener(location, action));\n  };\n\n  private RoutingContext = ({ children, renderCtx }: { children: ReactNode; renderCtx?: RenderContext }) => {\n    return (\n      <RouteContext reactRouterUi={this} routing={this.routingMode} location={renderCtx?.initialLocation}>\n        {children}\n        <LocationHooks\n          onLocationChange={this.handleLocationChange}\n          onNavigatorChange={(nav) => (this.navigate = nav)}\n        />\n      </RouteContext>\n    );\n  };\n\n  private ServerRouting = ({ children, renderCtx }: { children: ReactNode; renderCtx?: RenderContext }) => {\n    return (\n      <RouteContext reactRouterUi={this} routing={Routing.static} location={renderCtx?.initialLocation}>\n        {children}\n        <LocationHooks\n          onLocationChange={this.handleLocationChange}\n          onNavigatorChange={(nav) => (this.navigate = nav)}\n        />\n      </RouteContext>\n    );\n  };\n\n  public renderPlugin: SSR.RenderPlugin<RenderContext> = {\n    browserInit: () => {\n      const initialLocation = `${window.location.pathname}${window.location.search}${window.location.hash}`;\n      return { initialLocation };\n    },\n    serverInit: ({ browser }) => {\n      const initialLocation = browser?.location.url;\n      return { initialLocation };\n    },\n    reactClientContext: this.RoutingContext,\n    reactServerContext: this.ServerRouting,\n  };\n\n  static slots = [Slot.withType<RouteProps>(), Slot.withType<LocationListener>()];\n  static runtime = UIRuntime;\n\n  static async provider(deps, config, [routeSlot, routeChangeSlot]: [RouteSlot, RouteChangeSlot]) {\n    return new ReactRouterUI(routeSlot, routeChangeSlot);\n  }\n}\n\nReactRouterAspect.addRuntime(ReactRouterUI);\n"],"mappings":"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"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/react-router",
-  "version": "0.0.802",
+  "version": "0.0.803",
   "homepage": "https://bit.dev/teambit/ui-foundation/react-router",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.ui-foundation",
     "name": "react-router",
-    "version": "0.0.802"
+    "version": "0.0.803"
   },
   "dependencies": {
     "@babel/runtime": "7.12.18",
@@ -14,9 +14,8 @@
     "@teambit/base-react.navigation.link": "2.0.27",
     "@teambit/harmony": "0.3.3",
     "@teambit/ui-foundation.ui.navigation.react-router-adapter": "6.1.1",
-    "@teambit/ui-foundation.ui.is-browser": "0.0.486",
     "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.490",
-    "@teambit/ui": "0.0.802"
+    "@teambit/ui": "0.0.803"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -28,7 +27,7 @@
   },
   "peerDependencies": {
     "react-router-dom": "^6.0.0",
-    "@teambit/legacy": "1.0.316",
+    "@teambit/legacy": "1.0.317",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },

package/{preview-1659151732866.js → preview-1659271062546.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_react-router@0.0.802/dist/react-router.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_react-router@0.0.802/dist/react-router.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_react-router@0.0.803/dist/react-router.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_react-router@0.0.803/dist/react-router.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/react-router.ui.runtime.tsx

@@ -2,9 +2,9 @@ import React, { ReactNode } from 'react';
 import { NavigateFunction } from 'react-router-dom';
 import type { Location, NavigationType, RouteProps } from 'react-router-dom';
 import { Slot, SlotRegistry } from '@teambit/harmony';
-import { RenderPlugins, UIRuntime } from '@teambit/ui';
+import { UIRuntime } from '@teambit/ui';
+import type { SSR } from '@teambit/ui';
 import { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
-import { isBrowser } from '@teambit/ui-foundation.ui.is-browser';
 
 import { ReactRouterAspect } from './react-router.aspect';
 import { RouteContext, RootRoute } from './route-context';
@@ -16,7 +16,7 @@ type RouteChangeSlot = SlotRegistry<LocationListener>;
 type RenderContext = { initialLocation?: string };
 
 export class ReactRouterUI {
-  private routingMode = isBrowser ? Routing.url : Routing.static;
+  private routingMode = Routing.url;
 
   constructor(
     /**
@@ -87,7 +87,7 @@ export class ReactRouterUI {
     listeners.forEach((listener) => listener(location, action));
   };
 
-  private AppRoutingContext = ({ children, renderCtx }: { children: ReactNode; renderCtx?: RenderContext }) => {
+  private RoutingContext = ({ children, renderCtx }: { children: ReactNode; renderCtx?: RenderContext }) => {
     return (
       <RouteContext reactRouterUi={this} routing={this.routingMode} location={renderCtx?.initialLocation}>
         {children}
@@ -99,7 +99,19 @@ export class ReactRouterUI {
     );
   };
 
-  public renderPlugin: RenderPlugins<RenderContext> = {
+  private ServerRouting = ({ children, renderCtx }: { children: ReactNode; renderCtx?: RenderContext }) => {
+    return (
+      <RouteContext reactRouterUi={this} routing={Routing.static} location={renderCtx?.initialLocation}>
+        {children}
+        <LocationHooks
+          onLocationChange={this.handleLocationChange}
+          onNavigatorChange={(nav) => (this.navigate = nav)}
+        />
+      </RouteContext>
+    );
+  };
+
+  public renderPlugin: SSR.RenderPlugin<RenderContext> = {
     browserInit: () => {
       const initialLocation = `${window.location.pathname}${window.location.search}${window.location.hash}`;
       return { initialLocation };
@@ -108,7 +120,8 @@ export class ReactRouterUI {
       const initialLocation = browser?.location.url;
       return { initialLocation };
     },
-    reactContext: this.AppRoutingContext,
+    reactClientContext: this.RoutingContext,
+    reactServerContext: this.ServerRouting,
   };
 
   static slots = [Slot.withType<RouteProps>(), Slot.withType<LocationListener>()];