@teambit/lanes 0.0.224 → 0.0.227

package/{__preview-1645372601675.js → __preview-1645630586060.js}

@@ -1 +1 @@
-export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.lanes_lanes@0.0.224/dist/lanes.docs.md')]
+export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.lanes_lanes@0.0.227/dist/lanes.docs.md')]

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { LanesAspect } from './lanes.aspect';
 export type { LanesMain } from './lanes.main.runtime';
+export type { LanesUI } from './lanes.ui.runtime';
 export default LanesAspect;
 export { LanesAspect };

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":["LanesAspect"],"mappings":";;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;eAGeA,oB","sourcesContent":["import { LanesAspect } from './lanes.aspect';\n\nexport type { LanesMain } from './lanes.main.runtime';\nexport default LanesAspect;\nexport { LanesAspect };\n"]}
+{"version":3,"sources":["index.ts"],"names":["LanesAspect"],"mappings":";;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;eAIeA,oB","sourcesContent":["import { LanesAspect } from './lanes.aspect';\n\nexport type { LanesMain } from './lanes.main.runtime';\nexport type { LanesUI } from './lanes.ui.runtime';\nexport default LanesAspect;\nexport { LanesAspect };\n"]}

package/dist/lanes.graphql.js

@@ -39,7 +39,7 @@ function lanesSchema(lanesMain) {
   return {
     typeDefs: (0, _graphqlTag().default)`
       type CompLaneData {
-        id: String!
+        id: ComponentID!
         head: String!
       }
 
@@ -47,6 +47,7 @@ function lanesSchema(lanesMain) {
         name: String!
         components: [CompLaneData]
         isMerged: Boolean
+        remote: String
       }
 
       type FileDiff {
@@ -94,11 +95,17 @@ function lanesSchema(lanesMain) {
           const lanesResults = await lanes.getLanes({});
           return lanesResults.map(lane => ({
             name: lane.name,
-            components: lane.components.map(c => ({
-              id: c.id.toString(),
-              head: c.head.toString()
+            components: lane.components.map(component => _objectSpread(_objectSpread({}, component), {}, {
+              /**
+               * make sure the BitId has the version mapped,
+               * otherwise graphql will cache the lane component response across different lanes with the same component id
+               */
+              id: _objectSpread(_objectSpread({}, component.id), {}, {
+                version: component.head
+              })
             })),
-            isMerged: Boolean(lane.isMerged)
+            isMerged: Boolean(lane.isMerged),
+            remote: lane.remote
           }));
         },
         getLaneByName: async (lanes, {
@@ -110,10 +117,7 @@ function lanesSchema(lanesMain) {
           const laneResult = lanesResults[0];
           return {
             name: laneResult.name,
-            components: laneResult.components.map(c => ({
-              id: c.id.toString(),
-              head: c.head.toString()
-            })),
+            components: laneResult.components,
             isMerged: Boolean(laneResult.isMerged)
           };
         },

package/dist/lanes.graphql.js.map

@@ -1 +1 @@
-{"version":3,"sources":["lanes.graphql.ts"],"names":["lanesSchema","lanesMain","typeDefs","resolvers","Lanes","getLanes","lanes","lanesResults","map","lane","name","components","c","id","toString","head","isMerged","Boolean","getLaneByName","laneResult","getCurrentLaneName","getCurrentLane","getDiff","values","options","getDiffResults","compsWithDiff","item","Query"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAGO,SAASA,WAAT,CAAqBC,SAArB,EAAmD;AACxD,SAAO;AACLC,IAAAA,QAAQ,EAAE,0BAAI;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAnDS;AAoDLC,IAAAA,SAAS,EAAE;AACTC,MAAAA,KAAK,EAAE;AACLC,QAAAA,QAAQ,EAAE,MAAOC,KAAP,IAA4B;AACpC,gBAAMC,YAAY,GAAG,MAAMD,KAAK,CAACD,QAAN,CAAe,EAAf,CAA3B;AACA,iBAAOE,YAAY,CAACC,GAAb,CAAkBC,IAAD,KAAW;AACjCC,YAAAA,IAAI,EAAED,IAAI,CAACC,IADsB;AAEjCC,YAAAA,UAAU,EAAEF,IAAI,CAACE,UAAL,CAAgBH,GAAhB,CAAqBI,CAAD,KAAQ;AAAEC,cAAAA,EAAE,EAAED,CAAC,CAACC,EAAF,CAAKC,QAAL,EAAN;AAAuBC,cAAAA,IAAI,EAAEH,CAAC,CAACG,IAAF,CAAOD,QAAP;AAA7B,aAAR,CAApB,CAFqB;AAGjCE,YAAAA,QAAQ,EAAEC,OAAO,CAACR,IAAI,CAACO,QAAN;AAHgB,WAAX,CAAjB,CAAP;AAKD,SARI;AASLE,QAAAA,aAAa,EAAE,OAAOZ,KAAP,EAAyB;AAAEI,UAAAA;AAAF,SAAzB,KAAwD;AACrE,gBAAMH,YAAY,GAAG,MAAMD,KAAK,CAACD,QAAN,CAAe;AAAEK,YAAAA;AAAF,WAAf,CAA3B;AACA,gBAAMS,UAAU,GAAGZ,YAAY,CAAC,CAAD,CAA/B;AACA,iBAAO;AACLG,YAAAA,IAAI,EAAES,UAAU,CAACT,IADZ;AAELC,YAAAA,UAAU,EAAEQ,UAAU,CAACR,UAAX,CAAsBH,GAAtB,CAA2BI,CAAD,KAAQ;AAAEC,cAAAA,EAAE,EAAED,CAAC,CAACC,EAAF,CAAKC,QAAL,EAAN;AAAuBC,cAAAA,IAAI,EAAEH,CAAC,CAACG,IAAF,CAAOD,QAAP;AAA7B,aAAR,CAA1B,CAFP;AAGLE,YAAAA,QAAQ,EAAEC,OAAO,CAACE,UAAU,CAACH,QAAZ;AAHZ,WAAP;AAKD,SAjBI;AAkBLI,QAAAA,kBAAkB,EAAGd,KAAD,IAAsB;AACxC,iBAAOA,KAAK,CAACe,cAAN,EAAP;AACD,SApBI;AAqBLC,QAAAA,OAAO,EAAE,OAAOhB,KAAP,EAAyB;AAAEiB,UAAAA,MAAF;AAAUC,UAAAA;AAAV,SAAzB,KAAqG;AAC5G,gBAAMC,cAAc,GAAG,MAAMnB,KAAK,CAACgB,OAAN,CAAcC,MAAd,EAAsBC,OAAtB,CAA7B;AACA,iDACKC,cADL;AAEEC,YAAAA,aAAa,EAAED,cAAc,CAACC,aAAf,CAA6BlB,GAA7B,CAAkCmB,IAAD,oCAAgBA,IAAhB;AAAsBd,cAAAA,EAAE,EAAEc,IAAI,CAACd,EAAL,CAAQC,QAAR;AAA1B,cAAjC;AAFjB;AAID;AA3BI,OADE;AA8BTc,MAAAA,KAAK,EAAE;AACLtB,QAAAA,KAAK,EAAE,MAAML;AADR;AA9BE;AApDN,GAAP;AAuFD","sourcesContent":["import { Schema } from '@teambit/graphql';\nimport gql from 'graphql-tag';\nimport { LanesMain } from './lanes.main.runtime';\n\nexport function lanesSchema(lanesMain: LanesMain): Schema {\n  return {\n    typeDefs: gql`\n      type CompLaneData {\n        id: String!\n        head: String!\n      }\n\n      type LanesData {\n        name: String!\n        components: [CompLaneData]\n        isMerged: Boolean\n      }\n\n      type FileDiff {\n        filePath: String!\n        diffOutput: String\n      }\n\n      type FieldsDiff {\n        fieldName: String!\n        diffOutput: String\n      }\n\n      type DiffResults {\n        id: String\n        hasDiff: Boolean\n        filesDiff: [FileDiff]\n        fieldsDiff: [FieldsDiff]\n      }\n\n      type GetDiffResult {\n        newComps: [String]\n        compsWithNoChanges: [String]\n        toLaneName: String\n        compsWithDiff: [DiffResults]\n      }\n\n      input DiffOptions {\n        color: Boolean\n      }\n\n      type Lanes {\n        getLanes: [LanesData]\n        getLaneByName(name: String): LanesData\n        getCurrentLaneName: String\n        getDiff(values: [String], options: DiffOptions): GetDiffResult\n      }\n\n      type Query {\n        lanes: Lanes\n      }\n    `,\n    resolvers: {\n      Lanes: {\n        getLanes: async (lanes: LanesMain) => {\n          const lanesResults = await lanes.getLanes({});\n          return lanesResults.map((lane) => ({\n            name: lane.name,\n            components: lane.components.map((c) => ({ id: c.id.toString(), head: c.head.toString() })),\n            isMerged: Boolean(lane.isMerged),\n          }));\n        },\n        getLaneByName: async (lanes: LanesMain, { name }: { name: string }) => {\n          const lanesResults = await lanes.getLanes({ name });\n          const laneResult = lanesResults[0];\n          return {\n            name: laneResult.name,\n            components: laneResult.components.map((c) => ({ id: c.id.toString(), head: c.head.toString() })),\n            isMerged: Boolean(laneResult.isMerged),\n          };\n        },\n        getCurrentLaneName: (lanes: LanesMain) => {\n          return lanes.getCurrentLane();\n        },\n        getDiff: async (lanes: LanesMain, { values, options }: { values: string[]; options: { color?: boolean } }) => {\n          const getDiffResults = await lanes.getDiff(values, options);\n          return {\n            ...getDiffResults,\n            compsWithDiff: getDiffResults.compsWithDiff.map((item) => ({ ...item, id: item.id.toString() })),\n          };\n        },\n      },\n      Query: {\n        lanes: () => lanesMain,\n      },\n    },\n  };\n}\n"]}
+{"version":3,"sources":["lanes.graphql.ts"],"names":["lanesSchema","lanesMain","typeDefs","resolvers","Lanes","getLanes","lanes","lanesResults","map","lane","name","components","component","id","version","head","isMerged","Boolean","remote","getLaneByName","laneResult","getCurrentLaneName","getCurrentLane","getDiff","values","options","getDiffResults","compsWithDiff","item","toString","Query"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAGO,SAASA,WAAT,CAAqBC,SAArB,EAAmD;AACxD,SAAO;AACLC,IAAAA,QAAQ,EAAE,0BAAI;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KApDS;AAqDLC,IAAAA,SAAS,EAAE;AACTC,MAAAA,KAAK,EAAE;AACLC,QAAAA,QAAQ,EAAE,MAAOC,KAAP,IAA4B;AACpC,gBAAMC,YAAY,GAAG,MAAMD,KAAK,CAACD,QAAN,CAAe,EAAf,CAA3B;AACA,iBAAOE,YAAY,CAACC,GAAb,CAAkBC,IAAD,KAAW;AACjCC,YAAAA,IAAI,EAAED,IAAI,CAACC,IADsB;AAEjCC,YAAAA,UAAU,EAAEF,IAAI,CAACE,UAAL,CAAgBH,GAAhB,CAAqBI,SAAD,oCAC3BA,SAD2B;AAE9B;AACd;AACA;AACA;AACcC,cAAAA,EAAE,kCAAOD,SAAS,CAACC,EAAjB;AAAqBC,gBAAAA,OAAO,EAAEF,SAAS,CAACG;AAAxC;AAN4B,cAApB,CAFqB;AAUjCC,YAAAA,QAAQ,EAAEC,OAAO,CAACR,IAAI,CAACO,QAAN,CAVgB;AAWjCE,YAAAA,MAAM,EAAET,IAAI,CAACS;AAXoB,WAAX,CAAjB,CAAP;AAaD,SAhBI;AAiBLC,QAAAA,aAAa,EAAE,OAAOb,KAAP,EAAyB;AAAEI,UAAAA;AAAF,SAAzB,KAAwD;AACrE,gBAAMH,YAAY,GAAG,MAAMD,KAAK,CAACD,QAAN,CAAe;AAAEK,YAAAA;AAAF,WAAf,CAA3B;AACA,gBAAMU,UAAU,GAAGb,YAAY,CAAC,CAAD,CAA/B;AACA,iBAAO;AACLG,YAAAA,IAAI,EAAEU,UAAU,CAACV,IADZ;AAELC,YAAAA,UAAU,EAAES,UAAU,CAACT,UAFlB;AAGLK,YAAAA,QAAQ,EAAEC,OAAO,CAACG,UAAU,CAACJ,QAAZ;AAHZ,WAAP;AAKD,SAzBI;AA0BLK,QAAAA,kBAAkB,EAAGf,KAAD,IAAsB;AACxC,iBAAOA,KAAK,CAACgB,cAAN,EAAP;AACD,SA5BI;AA6BLC,QAAAA,OAAO,EAAE,OAAOjB,KAAP,EAAyB;AAAEkB,UAAAA,MAAF;AAAUC,UAAAA;AAAV,SAAzB,KAAqG;AAC5G,gBAAMC,cAAc,GAAG,MAAMpB,KAAK,CAACiB,OAAN,CAAcC,MAAd,EAAsBC,OAAtB,CAA7B;AACA,iDACKC,cADL;AAEEC,YAAAA,aAAa,EAAED,cAAc,CAACC,aAAf,CAA6BnB,GAA7B,CAAkCoB,IAAD,oCAAgBA,IAAhB;AAAsBf,cAAAA,EAAE,EAAEe,IAAI,CAACf,EAAL,CAAQgB,QAAR;AAA1B,cAAjC;AAFjB;AAID;AAnCI,OADE;AAsCTC,MAAAA,KAAK,EAAE;AACLxB,QAAAA,KAAK,EAAE,MAAML;AADR;AAtCE;AArDN,GAAP;AAgGD","sourcesContent":["import { Schema } from '@teambit/graphql';\nimport gql from 'graphql-tag';\nimport { LanesMain } from './lanes.main.runtime';\n\nexport function lanesSchema(lanesMain: LanesMain): Schema {\n  return {\n    typeDefs: gql`\n      type CompLaneData {\n        id: ComponentID!\n        head: String!\n      }\n\n      type LanesData {\n        name: String!\n        components: [CompLaneData]\n        isMerged: Boolean\n        remote: String\n      }\n\n      type FileDiff {\n        filePath: String!\n        diffOutput: String\n      }\n\n      type FieldsDiff {\n        fieldName: String!\n        diffOutput: String\n      }\n\n      type DiffResults {\n        id: String\n        hasDiff: Boolean\n        filesDiff: [FileDiff]\n        fieldsDiff: [FieldsDiff]\n      }\n\n      type GetDiffResult {\n        newComps: [String]\n        compsWithNoChanges: [String]\n        toLaneName: String\n        compsWithDiff: [DiffResults]\n      }\n\n      input DiffOptions {\n        color: Boolean\n      }\n\n      type Lanes {\n        getLanes: [LanesData]\n        getLaneByName(name: String): LanesData\n        getCurrentLaneName: String\n        getDiff(values: [String], options: DiffOptions): GetDiffResult\n      }\n\n      type Query {\n        lanes: Lanes\n      }\n    `,\n    resolvers: {\n      Lanes: {\n        getLanes: async (lanes: LanesMain) => {\n          const lanesResults = await lanes.getLanes({});\n          return lanesResults.map((lane) => ({\n            name: lane.name,\n            components: lane.components.map((component) => ({\n              ...component,\n              /**\n               * make sure the BitId has the version mapped,\n               * otherwise graphql will cache the lane component response across different lanes with the same component id\n               */\n              id: { ...component.id, version: component.head },\n            })),\n            isMerged: Boolean(lane.isMerged),\n            remote: lane.remote,\n          }));\n        },\n        getLaneByName: async (lanes: LanesMain, { name }: { name: string }) => {\n          const lanesResults = await lanes.getLanes({ name });\n          const laneResult = lanesResults[0];\n          return {\n            name: laneResult.name,\n            components: laneResult.components,\n            isMerged: Boolean(laneResult.isMerged),\n          };\n        },\n        getCurrentLaneName: (lanes: LanesMain) => {\n          return lanes.getCurrentLane();\n        },\n        getDiff: async (lanes: LanesMain, { values, options }: { values: string[]; options: { color?: boolean } }) => {\n          const getDiffResults = await lanes.getDiff(values, options);\n          return {\n            ...getDiffResults,\n            compsWithDiff: getDiffResults.compsWithDiff.map((item) => ({ ...item, id: item.id.toString() })),\n          };\n        },\n      },\n      Query: {\n        lanes: () => lanesMain,\n      },\n    },\n  };\n}\n"]}

package/dist/lanes.ui.runtime.d.ts

@@ -0,0 +1,46 @@
+import { RouteProps } from 'react-router-dom';
+import { Harmony } from '@teambit/harmony';
+import { MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';
+import { UiUI } from '@teambit/ui';
+import { NavigationSlot, RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
+import { LanesOrderedNavigationSlot } from '@teambit/lanes.ui.lanes';
+import { ScopeUI } from '@teambit/scope';
+import { WorkspaceUI } from '@teambit/workspace';
+import { NavLinkProps, ReactRouterUI } from '@teambit/react-router';
+import { ComponentUI } from '@teambit/component';
+import { SidebarUI } from '@teambit/sidebar';
+export declare class LanesUI {
+    private uiUi;
+    private componentUi;
+    private routeSlot;
+    private menuRouteSlot;
+    private navSlot;
+    private menuItemSlot;
+    private reactRouter;
+    private workspace?;
+    private scope?;
+    static dependencies: import("@teambit/harmony").Aspect[];
+    static runtime: import("@teambit/harmony").RuntimeDefinition;
+    static slots: (((registerFn: () => string) => import("@teambit/harmony").SlotRegistry<RouteProps<string, {
+        [x: string]: string | undefined;
+    }>>) | ((registerFn: () => string) => import("@teambit/harmony").SlotRegistry<MenuItemSlot>) | ((registerFn: () => string) => import("@teambit/harmony").SlotRegistry<NavigationSlot>))[];
+    constructor(uiUi: UiUI, componentUi: ComponentUI, routeSlot: RouteSlot, menuRouteSlot: RouteSlot, navSlot: LanesOrderedNavigationSlot, menuItemSlot: MenuItemSlot, reactRouter: ReactRouterUI, workspace?: WorkspaceUI | undefined, scope?: ScopeUI | undefined);
+    private readonly lanesHost;
+    private readonly hostAspect?;
+    private readonly host;
+    private registerHostAspectRoutes;
+    private registerLanesRoutes;
+    private registerRoutes;
+    private renderContext;
+    registerRoute(route: RouteProps): this;
+    registerNavigation(nav: NavLinkProps, order?: number): void;
+    static provider([uiUi, reactRouter, componentUi, workspaceUi, scopeUi, sidebarUi]: [
+        UiUI,
+        ReactRouterUI,
+        ComponentUI,
+        WorkspaceUI,
+        ScopeUI,
+        SidebarUI
+    ], _: any, [routeSlot, menuItemSlot, menuRouteSlot, navSlot]: [RouteSlot, MenuItemSlot, RouteSlot, LanesOrderedNavigationSlot], harmony: Harmony): Promise<LanesUI>;
+}
+export default LanesUI;

package/dist/lanes.ui.runtime.js

@@ -0,0 +1,234 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.promise.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.LanesUI = void 0;
+
+function _defineProperty2() {
+  const data = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+  _defineProperty2 = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _react() {
+  const data = _interopRequireDefault(require("react"));
+
+  _react = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _harmony() {
+  const data = require("@teambit/harmony");
+
+  _harmony = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _ui() {
+  const data = require("@teambit/ui");
+
+  _ui = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _lanes() {
+  const data = require("@teambit/lanes");
+
+  _lanes = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _lanesUi() {
+  const data = require("@teambit/lanes.ui.lanes");
+
+  _lanesUi = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _scope() {
+  const data = _interopRequireDefault(require("@teambit/scope"));
+
+  _scope = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _workspace() {
+  const data = _interopRequireDefault(require("@teambit/workspace"));
+
+  _workspace = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _reactRouter() {
+  const data = _interopRequireDefault(require("@teambit/react-router"));
+
+  _reactRouter = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _component() {
+  const data = _interopRequireDefault(require("@teambit/component"));
+
+  _component = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _sidebar() {
+  const data = _interopRequireDefault(require("@teambit/sidebar"));
+
+  _sidebar = function () {
+    return data;
+  };
+
+  return data;
+}
+
+class LanesUI {
+  constructor(uiUi, componentUi, routeSlot, menuRouteSlot, navSlot, menuItemSlot, reactRouter, workspace, scope) {
+    this.uiUi = uiUi;
+    this.componentUi = componentUi;
+    this.routeSlot = routeSlot;
+    this.menuRouteSlot = menuRouteSlot;
+    this.navSlot = navSlot;
+    this.menuItemSlot = menuItemSlot;
+    this.reactRouter = reactRouter;
+    this.workspace = workspace;
+    this.scope = scope;
+    (0, _defineProperty2().default)(this, "lanesHost", void 0);
+    (0, _defineProperty2().default)(this, "hostAspect", void 0);
+    (0, _defineProperty2().default)(this, "host", void 0);
+    (0, _defineProperty2().default)(this, "renderContext", ({
+      children
+    }) => {
+      return /*#__PURE__*/_react().default.createElement(_lanesUi().CurrentLaneFromUrl, null, children);
+    });
+    this.hostAspect = workspace || scope;
+    this.lanesHost = workspace ? 'workspace' : 'scope';
+    this.host = workspace ? _workspace().default.id : _scope().default.id;
+  }
+
+  registerHostAspectRoutes() {
+    if (!this.hostAspect) return;
+    this.hostAspect.registerRoutes([{
+      path: _lanesUi().LanesModel.laneComponentUrlRegex,
+      children: this.componentUi.getComponentUI(this.host)
+    }, {
+      path: _lanesUi().LanesModel.laneRouteUrlRegex,
+      children: /*#__PURE__*/_react().default.createElement(_lanesUi().LanesOverview, {
+        routeSlot: this.routeSlot
+      })
+    }]);
+    this.hostAspect.registerMenuRoutes([{
+      path: _lanesUi().LanesModel.laneComponentUrlRegex,
+      children: this.componentUi.getMenu(this.host)
+    }, {
+      path: _lanesUi().LanesModel.laneRouteUrlRegex,
+      children: /*#__PURE__*/_react().default.createElement(_lanesUi().LanesOverviewMenu, {
+        navigationSlot: this.navSlot,
+        host: this.host
+      })
+    }]);
+  }
+
+  registerLanesRoutes() {
+    this.registerNavigation({
+      href: '',
+      children: 'Gallery'
+    });
+  }
+
+  registerRoutes() {
+    this.registerHostAspectRoutes();
+    this.registerLanesRoutes();
+  }
+
+  registerRoute(route) {
+    this.routeSlot.register(route);
+    return this;
+  }
+
+  registerNavigation(nav, order) {
+    this.navSlot.register({
+      props: nav,
+      order
+    });
+  }
+
+  static async provider([uiUi, reactRouter, componentUi, workspaceUi, scopeUi, sidebarUi], _, [routeSlot, menuItemSlot, menuRouteSlot, navSlot], harmony) {
+    const {
+      config
+    } = harmony;
+    const host = String(config.get('teambit.harmony/bit'));
+    let workspace;
+    let scope;
+
+    if (host === _workspace().default.id) {
+      workspace = workspaceUi;
+    }
+
+    if (host === _scope().default.id) {
+      scope = scopeUi;
+    }
+
+    const lanesUi = new LanesUI(uiUi, componentUi, routeSlot, menuRouteSlot, navSlot, menuItemSlot, reactRouter, workspace, scope);
+    uiUi.registerRenderHooks({
+      reactContext: lanesUi.renderContext
+    });
+    const drawer = new (_lanesUi().LanesDrawer)({
+      showScope: lanesUi.lanesHost === 'workspace'
+    });
+    sidebarUi.registerDrawer(drawer);
+    lanesUi.registerRoutes();
+    return lanesUi;
+  }
+
+}
+
+exports.LanesUI = LanesUI;
+(0, _defineProperty2().default)(LanesUI, "dependencies", [_ui().UIAspect, _reactRouter().default, _component().default, _workspace().default, _scope().default, _sidebar().default]);
+(0, _defineProperty2().default)(LanesUI, "runtime", _ui().UIRuntime);
+(0, _defineProperty2().default)(LanesUI, "slots", [_harmony().Slot.withType(), _harmony().Slot.withType(), _harmony().Slot.withType(), _harmony().Slot.withType()]);
+var _default = LanesUI;
+exports.default = _default;
+
+_lanes().LanesAspect.addRuntime(LanesUI);
+
+//# sourceMappingURL=lanes.ui.runtime.js.map

package/dist/lanes.ui.runtime.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["lanes.ui.runtime.tsx"],"names":["LanesUI","constructor","uiUi","componentUi","routeSlot","menuRouteSlot","navSlot","menuItemSlot","reactRouter","workspace","scope","children","hostAspect","lanesHost","host","WorkspaceAspect","id","ScopeAspect","registerHostAspectRoutes","registerRoutes","path","LanesModel","laneComponentUrlRegex","getComponentUI","laneRouteUrlRegex","registerMenuRoutes","getMenu","registerLanesRoutes","registerNavigation","href","registerRoute","route","register","nav","order","props","provider","workspaceUi","scopeUi","sidebarUi","_","harmony","config","String","get","lanesUi","registerRenderHooks","reactContext","renderContext","drawer","LanesDrawer","showScope","registerDrawer","UIAspect","ReactRouterAspect","ComponentAspect","SidebarAspect","UIRuntime","Slot","withType","LanesAspect","addRuntime"],"mappings":"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","sourcesContent":["import React, { ReactNode } from 'react';\nimport { RouteProps } from 'react-router-dom';\nimport { Slot, Harmony } from '@teambit/harmony';\nimport { MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';\nimport { UIRuntime, UiUI, UIAspect } from '@teambit/ui';\nimport { LanesAspect } from '@teambit/lanes';\nimport { NavigationSlot, RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport {\n  LanesDrawer,\n  LanesHost,\n  LanesOverview,\n  LanesOrderedNavigationSlot,\n  LanesModel,\n  LanesOverviewMenu,\n  CurrentLaneFromUrl,\n} from '@teambit/lanes.ui.lanes';\nimport ScopeAspect, { ScopeUI } from '@teambit/scope';\nimport WorkspaceAspect, { WorkspaceUI } from '@teambit/workspace';\nimport ReactRouterAspect, { NavLinkProps, ReactRouterUI } from '@teambit/react-router';\nimport ComponentAspect, { ComponentUI } from '@teambit/component';\nimport SidebarAspect, { SidebarUI } from '@teambit/sidebar';\n\nexport class LanesUI {\n  static dependencies = [UIAspect, ReactRouterAspect, ComponentAspect, WorkspaceAspect, ScopeAspect, SidebarAspect];\n  static runtime = UIRuntime;\n  static slots = [\n    Slot.withType<RouteProps>(),\n    Slot.withType<MenuItemSlot>(),\n    Slot.withType<RouteProps>(),\n    Slot.withType<NavigationSlot>(),\n  ];\n\n  constructor(\n    private uiUi: UiUI,\n    private componentUi: ComponentUI,\n    private routeSlot: RouteSlot,\n    private menuRouteSlot: RouteSlot,\n    private navSlot: LanesOrderedNavigationSlot,\n    private menuItemSlot: MenuItemSlot,\n    private reactRouter: ReactRouterUI,\n    private workspace?: WorkspaceUI,\n    private scope?: ScopeUI\n  ) {\n    this.hostAspect = workspace || scope;\n    this.lanesHost = workspace ? 'workspace' : 'scope';\n    this.host = workspace ? WorkspaceAspect.id : ScopeAspect.id;\n  }\n\n  private readonly lanesHost: LanesHost;\n  private readonly hostAspect?: WorkspaceUI | ScopeUI;\n  private readonly host: string;\n\n  private registerHostAspectRoutes() {\n    if (!this.hostAspect) return;\n    this.hostAspect.registerRoutes([\n      {\n        path: LanesModel.laneComponentUrlRegex,\n        children: this.componentUi.getComponentUI(this.host),\n      },\n      {\n        path: LanesModel.laneRouteUrlRegex,\n        children: <LanesOverview routeSlot={this.routeSlot} />,\n      },\n    ]);\n    this.hostAspect.registerMenuRoutes([\n      {\n        path: LanesModel.laneComponentUrlRegex,\n        children: this.componentUi.getMenu(this.host),\n      },\n      {\n        path: LanesModel.laneRouteUrlRegex,\n        children: <LanesOverviewMenu navigationSlot={this.navSlot} host={this.host} />,\n      },\n    ]);\n  }\n\n  private registerLanesRoutes() {\n    this.registerNavigation({\n      href: '',\n      children: 'Gallery',\n    });\n  }\n\n  private registerRoutes() {\n    this.registerHostAspectRoutes();\n    this.registerLanesRoutes();\n  }\n\n  private renderContext = ({ children }: { children: ReactNode }) => {\n    return <CurrentLaneFromUrl>{children}</CurrentLaneFromUrl>;\n  };\n\n  registerRoute(route: RouteProps) {\n    this.routeSlot.register(route);\n    return this;\n  }\n\n  registerNavigation(nav: NavLinkProps, order?: number) {\n    this.navSlot.register({\n      props: nav,\n      order,\n    });\n  }\n\n  static async provider(\n    [uiUi, reactRouter, componentUi, workspaceUi, scopeUi, sidebarUi]: [\n      UiUI,\n      ReactRouterUI,\n      ComponentUI,\n      WorkspaceUI,\n      ScopeUI,\n      SidebarUI\n    ],\n    _,\n    [routeSlot, menuItemSlot, menuRouteSlot, navSlot]: [RouteSlot, MenuItemSlot, RouteSlot, LanesOrderedNavigationSlot],\n    harmony: Harmony\n  ) {\n    const { config } = harmony;\n    const host = String(config.get('teambit.harmony/bit'));\n    let workspace: WorkspaceUI | undefined;\n    let scope: ScopeUI | undefined;\n    if (host === WorkspaceAspect.id) {\n      workspace = workspaceUi;\n    }\n    if (host === ScopeAspect.id) {\n      scope = scopeUi;\n    }\n    const lanesUi = new LanesUI(\n      uiUi,\n      componentUi,\n      routeSlot,\n      menuRouteSlot,\n      navSlot,\n      menuItemSlot,\n      reactRouter,\n      workspace,\n      scope\n    );\n    uiUi.registerRenderHooks({ reactContext: lanesUi.renderContext });\n    const drawer = new LanesDrawer({ showScope: lanesUi.lanesHost === 'workspace' });\n    sidebarUi.registerDrawer(drawer);\n    lanesUi.registerRoutes();\n\n    return lanesUi;\n  }\n}\n\nexport default LanesUI;\n\nLanesAspect.addRuntime(LanesUI);\n"]}

package/lanes.ui.runtime.tsx

@@ -0,0 +1,150 @@
+import React, { ReactNode } from 'react';
+import { RouteProps } from 'react-router-dom';
+import { Slot, Harmony } from '@teambit/harmony';
+import { MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';
+import { UIRuntime, UiUI, UIAspect } from '@teambit/ui';
+import { LanesAspect } from '@teambit/lanes';
+import { NavigationSlot, RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
+import {
+  LanesDrawer,
+  LanesHost,
+  LanesOverview,
+  LanesOrderedNavigationSlot,
+  LanesModel,
+  LanesOverviewMenu,
+  CurrentLaneFromUrl,
+} from '@teambit/lanes.ui.lanes';
+import ScopeAspect, { ScopeUI } from '@teambit/scope';
+import WorkspaceAspect, { WorkspaceUI } from '@teambit/workspace';
+import ReactRouterAspect, { NavLinkProps, ReactRouterUI } from '@teambit/react-router';
+import ComponentAspect, { ComponentUI } from '@teambit/component';
+import SidebarAspect, { SidebarUI } from '@teambit/sidebar';
+
+export class LanesUI {
+  static dependencies = [UIAspect, ReactRouterAspect, ComponentAspect, WorkspaceAspect, ScopeAspect, SidebarAspect];
+  static runtime = UIRuntime;
+  static slots = [
+    Slot.withType<RouteProps>(),
+    Slot.withType<MenuItemSlot>(),
+    Slot.withType<RouteProps>(),
+    Slot.withType<NavigationSlot>(),
+  ];
+
+  constructor(
+    private uiUi: UiUI,
+    private componentUi: ComponentUI,
+    private routeSlot: RouteSlot,
+    private menuRouteSlot: RouteSlot,
+    private navSlot: LanesOrderedNavigationSlot,
+    private menuItemSlot: MenuItemSlot,
+    private reactRouter: ReactRouterUI,
+    private workspace?: WorkspaceUI,
+    private scope?: ScopeUI
+  ) {
+    this.hostAspect = workspace || scope;
+    this.lanesHost = workspace ? 'workspace' : 'scope';
+    this.host = workspace ? WorkspaceAspect.id : ScopeAspect.id;
+  }
+
+  private readonly lanesHost: LanesHost;
+  private readonly hostAspect?: WorkspaceUI | ScopeUI;
+  private readonly host: string;
+
+  private registerHostAspectRoutes() {
+    if (!this.hostAspect) return;
+    this.hostAspect.registerRoutes([
+      {
+        path: LanesModel.laneComponentUrlRegex,
+        children: this.componentUi.getComponentUI(this.host),
+      },
+      {
+        path: LanesModel.laneRouteUrlRegex,
+        children: <LanesOverview routeSlot={this.routeSlot} />,
+      },
+    ]);
+    this.hostAspect.registerMenuRoutes([
+      {
+        path: LanesModel.laneComponentUrlRegex,
+        children: this.componentUi.getMenu(this.host),
+      },
+      {
+        path: LanesModel.laneRouteUrlRegex,
+        children: <LanesOverviewMenu navigationSlot={this.navSlot} host={this.host} />,
+      },
+    ]);
+  }
+
+  private registerLanesRoutes() {
+    this.registerNavigation({
+      href: '',
+      children: 'Gallery',
+    });
+  }
+
+  private registerRoutes() {
+    this.registerHostAspectRoutes();
+    this.registerLanesRoutes();
+  }
+
+  private renderContext = ({ children }: { children: ReactNode }) => {
+    return <CurrentLaneFromUrl>{children}</CurrentLaneFromUrl>;
+  };
+
+  registerRoute(route: RouteProps) {
+    this.routeSlot.register(route);
+    return this;
+  }
+
+  registerNavigation(nav: NavLinkProps, order?: number) {
+    this.navSlot.register({
+      props: nav,
+      order,
+    });
+  }
+
+  static async provider(
+    [uiUi, reactRouter, componentUi, workspaceUi, scopeUi, sidebarUi]: [
+      UiUI,
+      ReactRouterUI,
+      ComponentUI,
+      WorkspaceUI,
+      ScopeUI,
+      SidebarUI
+    ],
+    _,
+    [routeSlot, menuItemSlot, menuRouteSlot, navSlot]: [RouteSlot, MenuItemSlot, RouteSlot, LanesOrderedNavigationSlot],
+    harmony: Harmony
+  ) {
+    const { config } = harmony;
+    const host = String(config.get('teambit.harmony/bit'));
+    let workspace: WorkspaceUI | undefined;
+    let scope: ScopeUI | undefined;
+    if (host === WorkspaceAspect.id) {
+      workspace = workspaceUi;
+    }
+    if (host === ScopeAspect.id) {
+      scope = scopeUi;
+    }
+    const lanesUi = new LanesUI(
+      uiUi,
+      componentUi,
+      routeSlot,
+      menuRouteSlot,
+      navSlot,
+      menuItemSlot,
+      reactRouter,
+      workspace,
+      scope
+    );
+    uiUi.registerRenderHooks({ reactContext: lanesUi.renderContext });
+    const drawer = new LanesDrawer({ showScope: lanesUi.lanesHost === 'workspace' });
+    sidebarUi.registerDrawer(drawer);
+    lanesUi.registerRoutes();
+
+    return lanesUi;
+  }
+}
+
+export default LanesUI;
+
+LanesAspect.addRuntime(LanesUI);

package/package.json

@@ -1,41 +1,50 @@
 {
   "name": "@teambit/lanes",
-  "version": "0.0.224",
+  "version": "0.0.227",
   "homepage": "https://bit.dev/teambit/lanes/lanes",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.lanes",
     "name": "lanes",
-    "version": "0.0.224"
+    "version": "0.0.227"
   },
   "dependencies": {
     "chalk": "2.4.2",
     "yn": "2.0.0",
     "@teambit/harmony": "0.2.11",
     "graphql-tag": "2.12.1",
+    "react-router-dom": "5.2.0",
     "ramda": "0.27.1",
     "@babel/runtime": "7.12.18",
     "core-js": "^3.0.0",
     "@teambit/bit-error": "0.0.394",
-    "@teambit/cli": "0.0.445",
-    "@teambit/scope": "0.0.652",
-    "@teambit/workspace": "0.0.652",
-    "@teambit/graphql": "0.0.652",
-    "@teambit/lanes.modules.diff": "0.0.106"
+    "@teambit/cli": "0.0.446",
+    "@teambit/scope": "0.0.655",
+    "@teambit/workspace": "0.0.655",
+    "@teambit/graphql": "0.0.655",
+    "@teambit/lanes.modules.diff": "0.0.106",
+    "@teambit/component": "0.0.655",
+    "@teambit/lanes.ui.lanes": "0.0.1",
+    "@teambit/react-router": "0.0.655",
+    "@teambit/sidebar": "0.0.655",
+    "@teambit/ui-foundation.ui.main-dropdown": "0.0.486",
+    "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.488",
+    "@teambit/ui": "0.0.655"
   },
   "devDependencies": {
+    "@types/react-router-dom": "5.1.7",
+    "@types/react": "^17.0.8",
     "@types/mocha": "9.1.0",
     "@types/testing-library__jest-dom": "5.9.5",
     "@types/jest": "^26.0.0",
     "@types/react-dom": "^17.0.5",
-    "@types/react": "^17.0.8",
     "@types/node": "12.20.4",
     "@teambit/component.testing.mock-components": "0.0.3",
     "@teambit/harmony.testing.load-aspect": "0.0.3",
     "@teambit/workspace.testing.mock-workspace": "0.0.3"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.223",
+    "@teambit/legacy": "1.0.225",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -63,7 +72,7 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.223",
+        "@teambit/legacy": "1.0.225",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }