@teambit/lanes 0.0.498 → 0.0.500

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { LanesAspect } from './lanes.aspect';
 export type { LanesMain, Lane } from './lanes.main.runtime';
 export { LanesModel, LanesQuery } from '@teambit/lanes.ui.models.lanes-model';
-export type { LanesUI } from './lanes.ui.runtime';
+export type { LanesUI, LaneCompareProps } from './lanes.ui.runtime';
 export default LanesAspect;
 export { LanesAspect };

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["LanesAspect"],"sources":["index.ts"],"sourcesContent":["import { LanesAspect } from './lanes.aspect';\n\nexport type { LanesMain, Lane } from './lanes.main.runtime';\nexport { LanesModel, LanesQuery } from '@teambit/lanes.ui.models.lanes-model';\nexport type { LanesUI } from './lanes.ui.runtime';\nexport default LanesAspect;\nexport { LanesAspect };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAGA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAA8E,eAE/DA,oBAAW;AAAA"}
+{"version":3,"names":["LanesAspect"],"sources":["index.ts"],"sourcesContent":["import { LanesAspect } from './lanes.aspect';\n\nexport type { LanesMain, Lane } from './lanes.main.runtime';\nexport { LanesModel, LanesQuery } from '@teambit/lanes.ui.models.lanes-model';\nexport type { LanesUI, LaneCompareProps } from './lanes.ui.runtime';\nexport default LanesAspect;\nexport { LanesAspect };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAGA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAA8E,eAE/DA,oBAAW;AAAA"}

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

@@ -1,19 +1,22 @@
 /// <reference types="react" />
 import { RouteProps } from 'react-router-dom';
 import { Harmony } from '@teambit/harmony';
+import { LaneCompareProps as DefaultLaneCompareProps } from '@teambit/lanes.ui.compare.lane-compare';
 import { UiUI } from '@teambit/ui';
 import { NavigationSlot, RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
 import { ScopeUI } from '@teambit/scope';
 import { WorkspaceUI } from '@teambit/workspace';
 import { ComponentID, ComponentUI } from '@teambit/component';
-import { SidebarUI } from '@teambit/sidebar';
 import { MenuWidget, MenuWidgetSlot } from '@teambit/ui-foundation.ui.menu';
 import { LaneOverviewLine, LaneOverviewLineSlot } from '@teambit/lanes.ui.lane-overview';
 import { LanesNavPlugin, LanesOrderedNavigationSlot } from '@teambit/lanes.ui.menus.lanes-overview-menu';
 import { LanesProvider, useLanes } from '@teambit/lanes.hooks.use-lanes';
 import { LaneId } from '@teambit/lane-id';
+import { ComponentCompareUI } from '@teambit/component-compare';
+export declare type LaneCompareProps = Partial<DefaultLaneCompareProps>;
 export declare class LanesUI {
-    private componentUi;
+    private componentUI;
+    private componentCompareUI;
     private routeSlot;
     private navSlot;
     private menuWidgetSlot;
@@ -26,7 +29,7 @@ export declare class LanesUI {
     static dependencies: import("@teambit/harmony").Aspect[];
     static runtime: import("@teambit/harmony").RuntimeDefinition;
     static slots: (((registerFn: () => string) => import("@teambit/harmony").SlotRegistry<RouteProps>) | ((registerFn: () => string) => import("@teambit/harmony").SlotRegistry<LaneOverviewLineSlot>) | ((registerFn: () => string) => import("@teambit/harmony").SlotRegistry<NavigationSlot>))[];
-    constructor(componentUi: ComponentUI, routeSlot: RouteSlot, navSlot: LanesOrderedNavigationSlot, menuWidgetSlot: MenuWidgetSlot, 
+    constructor(componentUI: ComponentUI, componentCompareUI: ComponentCompareUI, routeSlot: RouteSlot, navSlot: LanesOrderedNavigationSlot, menuWidgetSlot: MenuWidgetSlot, 
     /**
      * overview line slot to add new lines beneath the overview section
      */
@@ -75,7 +78,14 @@ export declare class LanesUI {
      */
     registerOverviewLine(...lines: LaneOverviewLine[]): this;
     registerNavigation(routes: LanesNavPlugin[]): void;
-    static provider([uiUi, componentUi, workspaceUi, scopeUi]: [UiUI, ComponentUI, WorkspaceUI, ScopeUI, SidebarUI], _: any, [routeSlot, overviewSlot, navSlot, menuWidgetSlot]: [
+    getLaneCompare: (props: LaneCompareProps) => JSX.Element | null;
+    static provider([uiUi, componentUI, workspaceUi, scopeUi, componentCompareUI]: [
+        UiUI,
+        ComponentUI,
+        WorkspaceUI,
+        ScopeUI,
+        ComponentCompareUI
+    ], _: any, [routeSlot, overviewSlot, navSlot, menuWidgetSlot]: [
         RouteSlot,
         LaneOverviewLineSlot,
         LanesOrderedNavigationSlot,

package/dist/lanes.ui.runtime.js

@@ -7,6 +7,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.LanesUI = void 0;
+function _extends2() {
+  const data = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+  _extends2 = function () {
+    return data;
+  };
+  return data;
+}
 function _defineProperty2() {
   const data = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
   _defineProperty2 = function () {
@@ -28,6 +35,13 @@ function _reactRouterDom() {
   };
   return data;
 }
+function _lodash() {
+  const data = require("lodash");
+  _lodash = function () {
+    return data;
+  };
+  return data;
+}
 function _harmony() {
   const data = require("@teambit/harmony");
   _harmony = function () {
@@ -35,6 +49,13 @@ function _harmony() {
   };
   return data;
 }
+function _lanesUiCompare() {
+  const data = require("@teambit/lanes.ui.compare.lane-compare");
+  _lanesUiCompare = function () {
+    return data;
+  };
+  return data;
+}
 function _ui() {
   const data = require("@teambit/ui");
   _ui = function () {
@@ -77,13 +98,6 @@ function _component() {
   };
   return data;
 }
-function _sidebar() {
-  const data = _interopRequireDefault(require("@teambit/sidebar"));
-  _sidebar = function () {
-    return data;
-  };
-  return data;
-}
 function _lanesUi() {
   const data = require("@teambit/lanes.ui.lane-overview");
   _lanesUi = function () {
@@ -133,15 +147,23 @@ function _lanesHooks2() {
   };
   return data;
 }
+function _componentCompare() {
+  const data = require("@teambit/component-compare");
+  _componentCompare = function () {
+    return data;
+  };
+  return data;
+}
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 class LanesUI {
-  constructor(componentUi, routeSlot, navSlot, menuWidgetSlot,
+  constructor(componentUI, componentCompareUI, routeSlot, navSlot, menuWidgetSlot,
   /**
    * overview line slot to add new lines beneath the overview section
    */
   overviewSlot, workspace, scope) {
-    this.componentUi = componentUi;
+    this.componentUI = componentUI;
+    this.componentCompareUI = componentCompareUI;
     this.routeSlot = routeSlot;
     this.navSlot = navSlot;
     this.menuWidgetSlot = menuWidgetSlot;
@@ -177,6 +199,36 @@ class LanesUI {
     }) => {
       return /*#__PURE__*/_react().default.createElement(_lanesHooks().LanesProvider, null, children);
     });
+    (0, _defineProperty2().default)(this, "getLaneCompare", props => {
+      const routes = this.componentCompareUI.routes;
+      const navLinks = this.componentCompareUI.navLinks;
+      const getElement = (routeProps, href) => {
+        var _routeProps$find;
+        if (routeProps.length === 1) return routeProps[0].element;
+        if (!href) return undefined;
+        return (_routeProps$find = routeProps.find(route => {
+          var _route$path;
+          return (_route$path = route.path) === null || _route$path === void 0 ? void 0 : _route$path.startsWith(href);
+        })) === null || _routeProps$find === void 0 ? void 0 : _routeProps$find.element;
+      };
+      const tabs = (0, _lodash().flatten)(Array.from(navLinks.entries()).map(([id, navProps]) => {
+        const maybeRoutesForId = routes.get(id);
+        const routesForId = maybeRoutesForId && (Array.isArray(maybeRoutesForId) ? [...maybeRoutesForId] : [maybeRoutesForId]) || [];
+        return navProps.map(navProp => ({
+          id: `${id}-${navProp.props.href}`,
+          order: navProp.order,
+          props: navProp.props,
+          element: getElement(routesForId, navProp.props.href)
+        }));
+      }));
+      if (!props.base || !props.compare) return null;
+      return /*#__PURE__*/_react().default.createElement(_lanesUiCompare().LaneCompare, (0, _extends2().default)({}, props, {
+        base: props.base,
+        compare: props.compare,
+        host: props.host || this.host,
+        tabs: props.tabs || tabs
+      }));
+    });
     this.hostAspect = workspace || scope;
     this.lanesHost = workspace ? 'workspace' : 'scope';
     this.host = workspace ? _workspace().default.id : _scope().default.id;
@@ -226,13 +278,13 @@ class LanesUI {
   // }
 
   getLaneComponent() {
-    return this.componentUi.getComponentUI(this.host, {
+    return this.componentUI.getComponentUI(this.host, {
       componentId: this.useComponentId,
       useComponentFilters: this.useComponentFilters
     });
   }
   getLaneComponentMenu() {
-    return this.componentUi.getMenu(this.host, {
+    return this.componentUI.getMenu(this.host, {
       componentId: this.useComponentId,
       useComponentFilters: this.useComponentFilters
     });
@@ -250,7 +302,7 @@ class LanesUI {
       children: /*#__PURE__*/_react().default.createElement(_reactRouterDom().Route, {
         path: `${_lanesUiModels().LanesModel.lanePath}/*`
       }, /*#__PURE__*/_react().default.createElement(_reactRouterDom().Route, {
-        path: "*",
+        path: '*',
         element: this.getLanesOverviewMenu()
       }), /*#__PURE__*/_react().default.createElement(_reactRouterDom().Route, {
         path: "~component/*",
@@ -288,6 +340,13 @@ class LanesUI {
         children: 'Overview'
       },
       order: 1
+    }, {
+      props: {
+        href: '~compare',
+        children: 'Lane Compare'
+      },
+      order: 2,
+      hide: () => true
     }]);
   }
   registerRoutes() {
@@ -331,7 +390,7 @@ class LanesUI {
   registerNavigation(routes) {
     this.navSlot.register(routes);
   }
-  static async provider([uiUi, componentUi, workspaceUi, scopeUi], _, [routeSlot, overviewSlot, navSlot, menuWidgetSlot], harmony) {
+  static async provider([uiUi, componentUI, workspaceUi, scopeUi, componentCompareUI], _, [routeSlot, overviewSlot, navSlot, menuWidgetSlot], harmony) {
     const {
       config
     } = harmony;
@@ -344,7 +403,7 @@ class LanesUI {
     if (host === _scope().default.id) {
       scope = scopeUi;
     }
-    const lanesUi = new LanesUI(componentUi, routeSlot, navSlot, overviewSlot, menuWidgetSlot, workspace, scope);
+    const lanesUi = new LanesUI(componentUI, componentCompareUI, routeSlot, navSlot, overviewSlot, menuWidgetSlot, workspace, scope);
     if (uiUi) uiUi.registerRenderHooks({
       reactContext: lanesUi.renderContext
     });
@@ -369,7 +428,7 @@ class LanesUI {
   }
 }
 exports.LanesUI = LanesUI;
-(0, _defineProperty2().default)(LanesUI, "dependencies", [_ui().UIAspect, _component().default, _workspace().default, _scope().default, _sidebar().default]);
+(0, _defineProperty2().default)(LanesUI, "dependencies", [_ui().UIAspect, _component().default, _workspace().default, _scope().default, _componentCompare().ComponentCompareAspect]);
 (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;

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

@@ -1 +1 @@
-{"version":3,"names":["LanesUI","constructor","componentUi","routeSlot","navSlot","menuWidgetSlot","overviewSlot","workspace","scope","idFromLocation","useIdFromLocation","lanesModel","useLanes","laneFromUrl","useViewedLaneFromUrl","laneComponentId","isDefault","resolveComponentByFullName","undefined","getLaneComponentIdFromUrl","toString","log","logHead","version","children","hostAspect","lanesHost","host","WorkspaceAspect","id","ScopeAspect","registerHostAspectRoutes","registerRoutes","getLaneRoutes","registerMenuRoutes","getMenuRoutes","path","LanesModel","lanesPrefix","lanePath","getLaneOverview","getLaneComponent","overrideComputeLaneUrl","fn","prefix","getLaneComponentUrl","getLaneIdFromPathname","getLaneUrl","getComponentUI","componentId","useComponentId","useComponentFilters","getLaneComponentMenu","getMenu","getLanesOverviewMenu","registerMenuWidget","menuItems","register","registerLanesRoutes","registerNavigation","props","href","exact","order","getLanesSwitcher","LanesSwitcher","getLanesProvider","LanesProvider","getUseLanes","registerLanesDropdown","registerSidebarLink","component","Gallery","weight","registerRoute","route","registerOverviewLine","lines","routes","provider","uiUi","workspaceUi","scopeUi","_","harmony","config","String","get","lanesUi","registerRenderHooks","reactContext","renderContext","viewedLane","currentLane","UIAspect","ComponentAspect","SidebarAspect","UIRuntime","Slot","withType","LanesAspect","addRuntime"],"sources":["lanes.ui.runtime.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Route, RouteProps } from 'react-router-dom';\nimport { Slot, Harmony } from '@teambit/harmony';\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 { NotFoundPage } from '@teambit/design.ui.pages.not-found';\nimport ScopeAspect, { ScopeUI } from '@teambit/scope';\nimport WorkspaceAspect, { WorkspaceUI } from '@teambit/workspace';\nimport ComponentAspect, { ComponentID, ComponentUI, useIdFromLocation } from '@teambit/component';\nimport SidebarAspect, { SidebarUI } from '@teambit/sidebar';\nimport { MenuWidget, MenuWidgetSlot } from '@teambit/ui-foundation.ui.menu';\nimport { LaneOverview, LaneOverviewLine, LaneOverviewLineSlot } from '@teambit/lanes.ui.lane-overview';\nimport {\n  LanesNavPlugin,\n  LanesOrderedNavigationSlot,\n  LanesOverviewMenu,\n} from '@teambit/lanes.ui.menus.lanes-overview-menu';\nimport { UseLaneMenu } from '@teambit/lanes.ui.menus.use-lanes-menu';\nimport { LanesHost, LanesModel } from '@teambit/lanes.ui.models.lanes-model';\nimport { LanesProvider, useLanes } from '@teambit/lanes.hooks.use-lanes';\nimport { LaneSwitcher } from '@teambit/lanes.ui.navigation.lane-switcher';\nimport { LaneId } from '@teambit/lane-id';\nimport { useViewedLaneFromUrl } from '@teambit/lanes.hooks.use-viewed-lane-from-url';\n\nexport class LanesUI {\n  static dependencies = [UIAspect, ComponentAspect, WorkspaceAspect, ScopeAspect, SidebarAspect];\n  static runtime = UIRuntime;\n  static slots = [\n    Slot.withType<RouteProps>(),\n    Slot.withType<LaneOverviewLineSlot>(),\n    Slot.withType<NavigationSlot>(),\n    Slot.withType<MenuWidgetSlot>(),\n  ];\n\n  constructor(\n    private componentUi: ComponentUI,\n    private routeSlot: RouteSlot,\n    private navSlot: LanesOrderedNavigationSlot,\n    private menuWidgetSlot: MenuWidgetSlot,\n    /**\n     * overview line slot to add new lines beneath the overview section\n     */\n    private overviewSlot: LaneOverviewLineSlot,\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(this.getLaneRoutes());\n    this.hostAspect.registerMenuRoutes(this.getMenuRoutes());\n  }\n\n  getLaneRoutes() {\n    return [\n      {\n        path: LanesModel.lanesPrefix,\n        children: (\n          <>\n            <Route path={LanesModel.lanePath}>\n              <Route index element={this.getLaneOverview()} />\n              <Route path=\"~component/*\" element={this.getLaneComponent()} />\n              <Route path=\"*\" element={<NotFoundPage />} />\n            </Route>\n            <Route path=\"*\" element={<NotFoundPage />} />\n          </>\n        ),\n      },\n    ];\n  }\n\n  overrideComputeLaneUrl(\n    fn: () => {\n      prefix: string;\n      path: string;\n      getLaneIdFromPathname: (pathname: string) => LaneId | undefined;\n      getLaneUrl: (laneId: LaneId, relative?: boolean) => string;\n      getLaneComponentUrl: (componentId: ComponentID, laneId: LaneId) => string;\n    }\n  ) {\n    const { prefix, path, getLaneComponentUrl, getLaneIdFromPathname, getLaneUrl } = fn();\n    LanesModel.lanesPrefix = prefix;\n    LanesModel.lanePath = path;\n    LanesModel.getLaneComponentUrl = getLaneComponentUrl;\n    LanesModel.getLaneUrl = getLaneUrl;\n    LanesModel.getLaneIdFromPathname = getLaneIdFromPathname;\n  }\n\n  // getLaneReadme() {\n  //   return <LaneReadmeOverview host={this.host} overviewSlot={this.overviewSlot} routeSlot={this.routeSlot} />;\n  // }\n\n  getLaneComponentIdFromUrl = () => {\n    const idFromLocation = useIdFromLocation();\n    const { lanesModel } = useLanes();\n    const laneFromUrl = useViewedLaneFromUrl();\n    const laneComponentId =\n      idFromLocation && !laneFromUrl?.isDefault()\n        ? lanesModel?.resolveComponentByFullName(idFromLocation, laneFromUrl)\n        : undefined;\n    return laneComponentId;\n  };\n\n  useComponentId = () => {\n    return this.getLaneComponentIdFromUrl()?.toString();\n  };\n\n  useComponentFilters = () => {\n    const laneComponentId = this.getLaneComponentIdFromUrl();\n\n    return {\n      log: laneComponentId && {\n        logHead: laneComponentId.version,\n      },\n    };\n  };\n\n  getLaneComponent() {\n    return this.componentUi.getComponentUI(this.host, {\n      componentId: this.useComponentId,\n      useComponentFilters: this.useComponentFilters,\n    });\n  }\n\n  getLaneComponentMenu() {\n    return this.componentUi.getMenu(this.host, {\n      componentId: this.useComponentId,\n      useComponentFilters: this.useComponentFilters,\n    });\n  }\n\n  getLaneOverview() {\n    return <LaneOverview routeSlot={this.routeSlot} overviewSlot={this.overviewSlot} host={this.lanesHost} />;\n  }\n\n  getMenuRoutes() {\n    return [\n      {\n        path: LanesModel.lanesPrefix,\n        children: (\n          <Route path={`${LanesModel.lanePath}/*`}>\n            <Route path=\"*\" element={this.getLanesOverviewMenu()} />\n            <Route path=\"~component/*\" element={this.getLaneComponentMenu()} />\n          </Route>\n        ),\n      },\n    ];\n  }\n\n  getLanesOverviewMenu() {\n    return <LanesOverviewMenu navigationSlot={this.navSlot} widgetSlot={this.menuWidgetSlot} />;\n  }\n\n  registerMenuWidget(...menuItems: MenuWidget[]) {\n    this.menuWidgetSlot.register(menuItems);\n  }\n\n  private registerLanesRoutes() {\n    this.registerNavigation([\n      // {\n      //   props: {\n      //     href: '.',\n      //     exact: true,\n      //     children: 'README',\n      //   },\n      //   order: 1,\n      //   hide: () => {\n      //     const { lanesModel } = useLanes();\n      //     return !lanesModel?.viewedLane?.readmeComponent;\n      //   },\n      // },\n      {\n        props: {\n          href: '.',\n          exact: true,\n          children: 'Overview',\n        },\n        order: 1,\n      },\n    ]);\n  }\n\n  private registerRoutes() {\n    this.registerHostAspectRoutes();\n    this.registerLanesRoutes();\n  }\n\n  getLanesSwitcher() {\n    const LanesSwitcher = <LaneSwitcher groupByScope={this.lanesHost === 'workspace'} />;\n    return LanesSwitcher;\n  }\n\n  getLanesProvider() {\n    return LanesProvider;\n  }\n\n  getUseLanes() {\n    return useLanes;\n  }\n\n  private registerLanesDropdown() {\n    const LanesSwitcher = this.getLanesSwitcher();\n\n    this.hostAspect?.registerSidebarLink({\n      component: function Gallery() {\n        return LanesSwitcher;\n      },\n      weight: 1000,\n    });\n  }\n\n  private renderContext = ({ children }: { children: ReactNode }) => {\n    return <LanesProvider>{children}</LanesProvider>;\n  };\n\n  registerRoute(route: RouteProps) {\n    this.routeSlot.register(route);\n    return this;\n  }\n\n  /**\n   * register a new line beneath the lane overview section.\n   */\n  registerOverviewLine(...lines: LaneOverviewLine[]) {\n    this.overviewSlot.register(lines);\n    return this;\n  }\n\n  registerNavigation(routes: LanesNavPlugin[]) {\n    this.navSlot.register(routes);\n  }\n\n  static async provider(\n    [uiUi, componentUi, workspaceUi, scopeUi]: [UiUI, ComponentUI, WorkspaceUI, ScopeUI, SidebarUI],\n    _,\n    [routeSlot, overviewSlot, navSlot, menuWidgetSlot]: [\n      RouteSlot,\n      LaneOverviewLineSlot,\n      LanesOrderedNavigationSlot,\n      MenuWidgetSlot\n    ],\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(componentUi, routeSlot, navSlot, overviewSlot, menuWidgetSlot, workspace, scope);\n    if (uiUi) uiUi.registerRenderHooks({ reactContext: lanesUi.renderContext });\n    lanesUi.registerRoutes();\n    lanesUi.registerMenuWidget(() => {\n      const { lanesModel } = useLanes();\n      if (!lanesModel?.viewedLane) return null;\n      const { viewedLane, currentLane } = lanesModel;\n      return <UseLaneMenu host={lanesUi.lanesHost} viewedLaneId={viewedLane.id} currentLaneId={currentLane?.id} />;\n    });\n    lanesUi.registerLanesDropdown();\n    return lanesUi;\n  }\n}\n\nexport default LanesUI;\n\nLanesAspect.addRuntime(LanesUI);\n"],"mappings":"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"}
+{"version":3,"names":["LanesUI","constructor","componentUI","componentCompareUI","routeSlot","navSlot","menuWidgetSlot","overviewSlot","workspace","scope","idFromLocation","useIdFromLocation","lanesModel","useLanes","laneFromUrl","useViewedLaneFromUrl","laneComponentId","isDefault","resolveComponentByFullName","undefined","getLaneComponentIdFromUrl","toString","log","logHead","version","children","props","routes","navLinks","getElement","routeProps","href","length","element","find","route","path","startsWith","tabs","flatten","Array","from","entries","map","id","navProps","maybeRoutesForId","get","routesForId","isArray","navProp","order","base","compare","host","hostAspect","lanesHost","WorkspaceAspect","ScopeAspect","registerHostAspectRoutes","registerRoutes","getLaneRoutes","registerMenuRoutes","getMenuRoutes","LanesModel","lanesPrefix","lanePath","getLaneOverview","getLaneComponent","overrideComputeLaneUrl","fn","prefix","getLaneComponentUrl","getLaneIdFromPathname","getLaneUrl","getComponentUI","componentId","useComponentId","useComponentFilters","getLaneComponentMenu","getMenu","getLanesOverviewMenu","registerMenuWidget","menuItems","register","registerLanesRoutes","registerNavigation","exact","hide","getLanesSwitcher","LanesSwitcher","getLanesProvider","LanesProvider","getUseLanes","registerLanesDropdown","registerSidebarLink","component","Gallery","weight","registerRoute","registerOverviewLine","lines","provider","uiUi","workspaceUi","scopeUi","_","harmony","config","String","lanesUi","registerRenderHooks","reactContext","renderContext","viewedLane","currentLane","UIAspect","ComponentAspect","ComponentCompareAspect","UIRuntime","Slot","withType","LanesAspect","addRuntime"],"sources":["lanes.ui.runtime.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Route, RouteProps } from 'react-router-dom';\nimport { flatten } from 'lodash';\nimport { Slot, Harmony } from '@teambit/harmony';\nimport { LaneCompare, LaneCompareProps as DefaultLaneCompareProps } from '@teambit/lanes.ui.compare.lane-compare';\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 { NotFoundPage } from '@teambit/design.ui.pages.not-found';\nimport ScopeAspect, { ScopeUI } from '@teambit/scope';\nimport WorkspaceAspect, { WorkspaceUI } from '@teambit/workspace';\nimport ComponentAspect, { ComponentID, ComponentUI, useIdFromLocation } from '@teambit/component';\nimport { MenuWidget, MenuWidgetSlot } from '@teambit/ui-foundation.ui.menu';\nimport { LaneOverview, LaneOverviewLine, LaneOverviewLineSlot } from '@teambit/lanes.ui.lane-overview';\nimport {\n  LanesNavPlugin,\n  LanesOrderedNavigationSlot,\n  LanesOverviewMenu,\n} from '@teambit/lanes.ui.menus.lanes-overview-menu';\nimport { UseLaneMenu } from '@teambit/lanes.ui.menus.use-lanes-menu';\nimport { LanesHost, LanesModel } from '@teambit/lanes.ui.models.lanes-model';\nimport { LanesProvider, useLanes } from '@teambit/lanes.hooks.use-lanes';\nimport { LaneSwitcher } from '@teambit/lanes.ui.navigation.lane-switcher';\nimport { LaneId } from '@teambit/lane-id';\nimport { useViewedLaneFromUrl } from '@teambit/lanes.hooks.use-viewed-lane-from-url';\nimport { TabItem } from '@teambit/component.ui.component-compare.models.component-compare-props';\nimport { ComponentCompareAspect, ComponentCompareUI } from '@teambit/component-compare';\n\nexport type LaneCompareProps = Partial<DefaultLaneCompareProps>;\nexport class LanesUI {\n  static dependencies = [UIAspect, ComponentAspect, WorkspaceAspect, ScopeAspect, ComponentCompareAspect];\n\n  static runtime = UIRuntime;\n  static slots = [\n    Slot.withType<RouteProps>(),\n    Slot.withType<LaneOverviewLineSlot>(),\n    Slot.withType<NavigationSlot>(),\n    Slot.withType<MenuWidgetSlot>(),\n  ];\n\n  constructor(\n    private componentUI: ComponentUI,\n    private componentCompareUI: ComponentCompareUI,\n    private routeSlot: RouteSlot,\n    private navSlot: LanesOrderedNavigationSlot,\n    private menuWidgetSlot: MenuWidgetSlot,\n    /**\n     * overview line slot to add new lines beneath the overview section\n     */\n    private overviewSlot: LaneOverviewLineSlot,\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(this.getLaneRoutes());\n    this.hostAspect.registerMenuRoutes(this.getMenuRoutes());\n  }\n\n  getLaneRoutes() {\n    return [\n      {\n        path: LanesModel.lanesPrefix,\n        children: (\n          <>\n            <Route path={LanesModel.lanePath}>\n              <Route index element={this.getLaneOverview()} />\n              <Route path=\"~component/*\" element={this.getLaneComponent()} />\n              {/* <Route path=\"~compare/*\" element={this.getLanesComparePage()} /> */}\n              <Route path=\"*\" element={<NotFoundPage />} />\n            </Route>\n            <Route path=\"*\" element={<NotFoundPage />} />\n          </>\n        ),\n      },\n    ];\n  }\n\n  overrideComputeLaneUrl(\n    fn: () => {\n      prefix: string;\n      path: string;\n      getLaneIdFromPathname: (pathname: string) => LaneId | undefined;\n      getLaneUrl: (laneId: LaneId, relative?: boolean) => string;\n      getLaneComponentUrl: (componentId: ComponentID, laneId: LaneId) => string;\n    }\n  ) {\n    const { prefix, path, getLaneComponentUrl, getLaneIdFromPathname, getLaneUrl } = fn();\n    LanesModel.lanesPrefix = prefix;\n    LanesModel.lanePath = path;\n    LanesModel.getLaneComponentUrl = getLaneComponentUrl;\n    LanesModel.getLaneUrl = getLaneUrl;\n    LanesModel.getLaneIdFromPathname = getLaneIdFromPathname;\n  }\n\n  // getLaneReadme() {\n  //   return <LaneReadmeOverview host={this.host} overviewSlot={this.overviewSlot} routeSlot={this.routeSlot} />;\n  // }\n\n  getLaneComponentIdFromUrl = () => {\n    const idFromLocation = useIdFromLocation();\n    const { lanesModel } = useLanes();\n    const laneFromUrl = useViewedLaneFromUrl();\n    const laneComponentId =\n      idFromLocation && !laneFromUrl?.isDefault()\n        ? lanesModel?.resolveComponentByFullName(idFromLocation, laneFromUrl)\n        : undefined;\n    return laneComponentId;\n  };\n\n  useComponentId = () => {\n    return this.getLaneComponentIdFromUrl()?.toString();\n  };\n\n  useComponentFilters = () => {\n    const laneComponentId = this.getLaneComponentIdFromUrl();\n\n    return {\n      log: laneComponentId && {\n        logHead: laneComponentId.version,\n      },\n    };\n  };\n\n  getLaneComponent() {\n    return this.componentUI.getComponentUI(this.host, {\n      componentId: this.useComponentId,\n      useComponentFilters: this.useComponentFilters,\n    });\n  }\n\n  getLaneComponentMenu() {\n    return this.componentUI.getMenu(this.host, {\n      componentId: this.useComponentId,\n      useComponentFilters: this.useComponentFilters,\n    });\n  }\n\n  getLaneOverview() {\n    return <LaneOverview routeSlot={this.routeSlot} overviewSlot={this.overviewSlot} host={this.lanesHost} />;\n  }\n\n  getMenuRoutes() {\n    return [\n      {\n        path: LanesModel.lanesPrefix,\n        children: (\n          <Route path={`${LanesModel.lanePath}/*`}>\n            <Route path={'*'} element={this.getLanesOverviewMenu()} />\n            <Route path=\"~component/*\" element={this.getLaneComponentMenu()} />\n          </Route>\n        ),\n      },\n    ];\n  }\n\n  getLanesOverviewMenu() {\n    return <LanesOverviewMenu navigationSlot={this.navSlot} widgetSlot={this.menuWidgetSlot} />;\n  }\n\n  registerMenuWidget(...menuItems: MenuWidget[]) {\n    this.menuWidgetSlot.register(menuItems);\n  }\n\n  private registerLanesRoutes() {\n    this.registerNavigation([\n      // {\n      //   props: {\n      //     href: '.',\n      //     exact: true,\n      //     children: 'README',\n      //   },\n      //   order: 1,\n      //   hide: () => {\n      //     const { lanesModel } = useLanes();\n      //     return !lanesModel?.viewedLane?.readmeComponent;\n      //   },\n      // },\n      {\n        props: {\n          href: '.',\n          exact: true,\n          children: 'Overview',\n        },\n        order: 1,\n      },\n      {\n        props: {\n          href: '~compare',\n          children: 'Lane Compare',\n        },\n        order: 2,\n        hide: () => true,\n      },\n    ]);\n  }\n\n  private registerRoutes() {\n    this.registerHostAspectRoutes();\n    this.registerLanesRoutes();\n  }\n\n  getLanesSwitcher() {\n    const LanesSwitcher = <LaneSwitcher groupByScope={this.lanesHost === 'workspace'} />;\n    return LanesSwitcher;\n  }\n\n  getLanesProvider() {\n    return LanesProvider;\n  }\n\n  getUseLanes() {\n    return useLanes;\n  }\n\n  private registerLanesDropdown() {\n    const LanesSwitcher = this.getLanesSwitcher();\n\n    this.hostAspect?.registerSidebarLink({\n      component: function Gallery() {\n        return LanesSwitcher;\n      },\n      weight: 1000,\n    });\n  }\n\n  private renderContext = ({ children }: { children: ReactNode }) => {\n    return <LanesProvider>{children}</LanesProvider>;\n  };\n\n  registerRoute(route: RouteProps) {\n    this.routeSlot.register(route);\n    return this;\n  }\n\n  /**\n   * register a new line beneath the lane overview section.\n   */\n  registerOverviewLine(...lines: LaneOverviewLine[]) {\n    this.overviewSlot.register(lines);\n    return this;\n  }\n\n  registerNavigation(routes: LanesNavPlugin[]) {\n    this.navSlot.register(routes);\n  }\n\n  getLaneCompare = (props: LaneCompareProps) => {\n    const routes = this.componentCompareUI.routes;\n    const navLinks = this.componentCompareUI.navLinks;\n\n    const getElement = (routeProps: RouteProps[], href?: string) => {\n      if (routeProps.length === 1) return routeProps[0].element;\n      if (!href) return undefined;\n      return routeProps.find((route) => route.path?.startsWith(href))?.element;\n    };\n\n    const tabs: TabItem[] = flatten(\n      Array.from(navLinks.entries()).map(([id, navProps]) => {\n        const maybeRoutesForId = routes.get(id);\n        const routesForId =\n          (maybeRoutesForId && (Array.isArray(maybeRoutesForId) ? [...maybeRoutesForId] : [maybeRoutesForId])) || [];\n\n        return navProps.map((navProp) => ({\n          id: `${id}-${navProp.props.href}`,\n          order: navProp.order,\n          props: navProp.props,\n          element: getElement(routesForId, navProp.props.href),\n        }));\n      })\n    );\n\n    if (!props.base || !props.compare) return null;\n\n    return (\n      <LaneCompare\n        {...props}\n        base={props.base}\n        compare={props.compare}\n        host={props.host || this.host}\n        tabs={props.tabs || tabs}\n      />\n    );\n  };\n\n  static async provider(\n    [uiUi, componentUI, workspaceUi, scopeUi, componentCompareUI]: [\n      UiUI,\n      ComponentUI,\n      WorkspaceUI,\n      ScopeUI,\n      ComponentCompareUI\n    ],\n    _,\n    [routeSlot, overviewSlot, navSlot, menuWidgetSlot]: [\n      RouteSlot,\n      LaneOverviewLineSlot,\n      LanesOrderedNavigationSlot,\n      MenuWidgetSlot\n    ],\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      componentUI,\n      componentCompareUI,\n      routeSlot,\n      navSlot,\n      overviewSlot,\n      menuWidgetSlot,\n      workspace,\n      scope\n    );\n    if (uiUi) uiUi.registerRenderHooks({ reactContext: lanesUi.renderContext });\n    lanesUi.registerRoutes();\n    lanesUi.registerMenuWidget(() => {\n      const { lanesModel } = useLanes();\n      if (!lanesModel?.viewedLane) return null;\n      const { viewedLane, currentLane } = lanesModel;\n      return <UseLaneMenu host={lanesUi.lanesHost} viewedLaneId={viewedLane.id} currentLaneId={currentLane?.id} />;\n    });\n    lanesUi.registerLanesDropdown();\n    return lanesUi;\n  }\n}\n\nexport default LanesUI;\n\nLanesAspect.addRuntime(LanesUI);\n"],"mappings":"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"}

package/dist/{preview-1670383551627.js → preview-1670470092710.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.lanes_lanes@0.0.498/dist/lanes.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.lanes_lanes@0.0.498/dist/lanes.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.lanes_lanes@0.0.500/dist/lanes.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.lanes_lanes@0.0.500/dist/lanes.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/lanes.ui.runtime.tsx

@@ -1,6 +1,8 @@
 import React, { ReactNode } from 'react';
 import { Route, RouteProps } from 'react-router-dom';
+import { flatten } from 'lodash';
 import { Slot, Harmony } from '@teambit/harmony';
+import { LaneCompare, LaneCompareProps as DefaultLaneCompareProps } from '@teambit/lanes.ui.compare.lane-compare';
 import { UIRuntime, UiUI, UIAspect } from '@teambit/ui';
 import { LanesAspect } from '@teambit/lanes';
 import { NavigationSlot, RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
@@ -8,7 +10,6 @@ import { NotFoundPage } from '@teambit/design.ui.pages.not-found';
 import ScopeAspect, { ScopeUI } from '@teambit/scope';
 import WorkspaceAspect, { WorkspaceUI } from '@teambit/workspace';
 import ComponentAspect, { ComponentID, ComponentUI, useIdFromLocation } from '@teambit/component';
-import SidebarAspect, { SidebarUI } from '@teambit/sidebar';
 import { MenuWidget, MenuWidgetSlot } from '@teambit/ui-foundation.ui.menu';
 import { LaneOverview, LaneOverviewLine, LaneOverviewLineSlot } from '@teambit/lanes.ui.lane-overview';
 import {
@@ -22,9 +23,13 @@ import { LanesProvider, useLanes } from '@teambit/lanes.hooks.use-lanes';
 import { LaneSwitcher } from '@teambit/lanes.ui.navigation.lane-switcher';
 import { LaneId } from '@teambit/lane-id';
 import { useViewedLaneFromUrl } from '@teambit/lanes.hooks.use-viewed-lane-from-url';
+import { TabItem } from '@teambit/component.ui.component-compare.models.component-compare-props';
+import { ComponentCompareAspect, ComponentCompareUI } from '@teambit/component-compare';
 
+export type LaneCompareProps = Partial<DefaultLaneCompareProps>;
 export class LanesUI {
-  static dependencies = [UIAspect, ComponentAspect, WorkspaceAspect, ScopeAspect, SidebarAspect];
+  static dependencies = [UIAspect, ComponentAspect, WorkspaceAspect, ScopeAspect, ComponentCompareAspect];
+
   static runtime = UIRuntime;
   static slots = [
     Slot.withType<RouteProps>(),
@@ -34,7 +39,8 @@ export class LanesUI {
   ];
 
   constructor(
-    private componentUi: ComponentUI,
+    private componentUI: ComponentUI,
+    private componentCompareUI: ComponentCompareUI,
     private routeSlot: RouteSlot,
     private navSlot: LanesOrderedNavigationSlot,
     private menuWidgetSlot: MenuWidgetSlot,
@@ -69,6 +75,7 @@ export class LanesUI {
             <Route path={LanesModel.lanePath}>
               <Route index element={this.getLaneOverview()} />
               <Route path="~component/*" element={this.getLaneComponent()} />
+              {/* <Route path="~compare/*" element={this.getLanesComparePage()} /> */}
               <Route path="*" element={<NotFoundPage />} />
             </Route>
             <Route path="*" element={<NotFoundPage />} />
@@ -125,14 +132,14 @@ export class LanesUI {
   };
 
   getLaneComponent() {
-    return this.componentUi.getComponentUI(this.host, {
+    return this.componentUI.getComponentUI(this.host, {
       componentId: this.useComponentId,
       useComponentFilters: this.useComponentFilters,
     });
   }
 
   getLaneComponentMenu() {
-    return this.componentUi.getMenu(this.host, {
+    return this.componentUI.getMenu(this.host, {
       componentId: this.useComponentId,
       useComponentFilters: this.useComponentFilters,
     });
@@ -148,7 +155,7 @@ export class LanesUI {
         path: LanesModel.lanesPrefix,
         children: (
           <Route path={`${LanesModel.lanePath}/*`}>
-            <Route path="*" element={this.getLanesOverviewMenu()} />
+            <Route path={'*'} element={this.getLanesOverviewMenu()} />
             <Route path="~component/*" element={this.getLaneComponentMenu()} />
           </Route>
         ),
@@ -186,6 +193,14 @@ export class LanesUI {
         },
         order: 1,
       },
+      {
+        props: {
+          href: '~compare',
+          children: 'Lane Compare',
+        },
+        order: 2,
+        hide: () => true,
+      },
     ]);
   }
 
@@ -239,8 +254,52 @@ export class LanesUI {
     this.navSlot.register(routes);
   }
 
+  getLaneCompare = (props: LaneCompareProps) => {
+    const routes = this.componentCompareUI.routes;
+    const navLinks = this.componentCompareUI.navLinks;
+
+    const getElement = (routeProps: RouteProps[], href?: string) => {
+      if (routeProps.length === 1) return routeProps[0].element;
+      if (!href) return undefined;
+      return routeProps.find((route) => route.path?.startsWith(href))?.element;
+    };
+
+    const tabs: TabItem[] = flatten(
+      Array.from(navLinks.entries()).map(([id, navProps]) => {
+        const maybeRoutesForId = routes.get(id);
+        const routesForId =
+          (maybeRoutesForId && (Array.isArray(maybeRoutesForId) ? [...maybeRoutesForId] : [maybeRoutesForId])) || [];
+
+        return navProps.map((navProp) => ({
+          id: `${id}-${navProp.props.href}`,
+          order: navProp.order,
+          props: navProp.props,
+          element: getElement(routesForId, navProp.props.href),
+        }));
+      })
+    );
+
+    if (!props.base || !props.compare) return null;
+
+    return (
+      <LaneCompare
+        {...props}
+        base={props.base}
+        compare={props.compare}
+        host={props.host || this.host}
+        tabs={props.tabs || tabs}
+      />
+    );
+  };
+
   static async provider(
-    [uiUi, componentUi, workspaceUi, scopeUi]: [UiUI, ComponentUI, WorkspaceUI, ScopeUI, SidebarUI],
+    [uiUi, componentUI, workspaceUi, scopeUi, componentCompareUI]: [
+      UiUI,
+      ComponentUI,
+      WorkspaceUI,
+      ScopeUI,
+      ComponentCompareUI
+    ],
     _,
     [routeSlot, overviewSlot, navSlot, menuWidgetSlot]: [
       RouteSlot,
@@ -260,7 +319,16 @@ export class LanesUI {
     if (host === ScopeAspect.id) {
       scope = scopeUi;
     }
-    const lanesUi = new LanesUI(componentUi, routeSlot, navSlot, overviewSlot, menuWidgetSlot, workspace, scope);
+    const lanesUi = new LanesUI(
+      componentUI,
+      componentCompareUI,
+      routeSlot,
+      navSlot,
+      overviewSlot,
+      menuWidgetSlot,
+      workspace,
+      scope
+    );
     if (uiUi) uiUi.registerRenderHooks({ reactContext: lanesUi.renderContext });
     lanesUi.registerRoutes();
     lanesUi.registerMenuWidget(() => {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/lanes",
-  "version": "0.0.498",
+  "version": "0.0.500",
   "homepage": "https://bit.dev/teambit/lanes/lanes",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.lanes",
     "name": "lanes",
-    "version": "0.0.498"
+    "version": "0.0.500"
   },
   "dependencies": {
     "chalk": "2.4.2",
@@ -18,32 +18,33 @@
     "core-js": "^3.0.0",
     "@teambit/harmony": "0.3.3",
     "@teambit/bit-error": "0.0.402",
-    "@teambit/lane-id": "0.0.138",
-    "@teambit/scope": "0.0.926",
-    "@teambit/lanes.ui.models.lanes-model": "0.0.45",
-    "@teambit/cli": "0.0.620",
-    "@teambit/workspace": "0.0.926",
-    "@teambit/express": "0.0.718",
-    "@teambit/logger": "0.0.713",
-    "@teambit/graphql": "0.0.926",
-    "@teambit/component-compare": "0.0.174",
-    "@teambit/component": "0.0.926",
-    "@teambit/export": "0.0.926",
-    "@teambit/importer": "0.0.355",
-    "@teambit/lanes.modules.diff": "0.0.256",
+    "@teambit/lane-id": "0.0.139",
+    "@teambit/scope": "0.0.928",
+    "@teambit/lanes.ui.models.lanes-model": "0.0.46",
+    "@teambit/cli": "0.0.621",
+    "@teambit/workspace": "0.0.928",
+    "@teambit/express": "0.0.719",
+    "@teambit/logger": "0.0.714",
+    "@teambit/graphql": "0.0.928",
+    "@teambit/component-compare": "0.0.176",
+    "@teambit/component": "0.0.928",
+    "@teambit/export": "0.0.928",
+    "@teambit/importer": "0.0.357",
+    "@teambit/lanes.modules.diff": "0.0.257",
     "@teambit/legacy-bit-id": "0.0.421",
-    "@teambit/merging": "0.0.241",
+    "@teambit/merging": "0.0.243",
+    "@teambit/component.ui.component-compare.models.component-compare-props": "0.0.1",
     "@teambit/design.ui.pages.not-found": "0.0.366",
-    "@teambit/lanes.hooks.use-lanes": "0.0.83",
-    "@teambit/lanes.hooks.use-viewed-lane-from-url": "0.0.45",
-    "@teambit/lanes.ui.lane-overview": "0.0.45",
+    "@teambit/lanes.hooks.use-lanes": "0.0.84",
+    "@teambit/lanes.hooks.use-viewed-lane-from-url": "0.0.46",
+    "@teambit/lanes.ui.compare.lane-compare": "0.0.1",
+    "@teambit/lanes.ui.lane-overview": "0.0.46",
     "@teambit/lanes.ui.menus.lanes-overview-menu": "0.0.4",
-    "@teambit/lanes.ui.menus.use-lanes-menu": "0.0.45",
-    "@teambit/lanes.ui.navigation.lane-switcher": "0.0.45",
-    "@teambit/sidebar": "0.0.926",
+    "@teambit/lanes.ui.menus.use-lanes-menu": "0.0.46",
+    "@teambit/lanes.ui.navigation.lane-switcher": "0.0.46",
     "@teambit/ui-foundation.ui.menu": "0.0.496",
-    "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.499",
-    "@teambit/ui": "0.0.926"
+    "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.500",
+    "@teambit/ui": "0.0.928"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -57,12 +58,12 @@
     "@types/node": "12.20.4",
     "@teambit/component.testing.mock-components": "0.0.17",
     "@teambit/harmony.testing.load-aspect": "0.0.16",
-    "@teambit/snapping": "0.0.241",
+    "@teambit/snapping": "0.0.243",
     "@teambit/workspace.testing.mock-workspace": "0.0.14"
   },
   "peerDependencies": {
     "react-router-dom": "^6.0.0",
-    "@teambit/legacy": "1.0.401",
+    "@teambit/legacy": "1.0.402",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },