@teambit/component.ui.version-dropdown 0.0.488 → 0.0.492

package/__preview-1645365357220.js

@@ -0,0 +1,2 @@
+export const compositions = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_ui_version-dropdown@0.0.492/dist/version-dropdown.composition.js')]
+export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_ui_version-dropdown@0.0.492/dist/version-dropdown.docs.js')]

package/dist/version-dropdown.composition.d.ts

@@ -1,2 +1,3 @@
-export declare const VersionDropdownWithOneVerion: () => JSX.Element;
-export declare const VersionDropdownWithMultipleVerions: () => JSX.Element;
+/// <reference types="react" />
+export declare const VersionDropdownWithOneVersion: () => JSX.Element;
+export declare const VersionDropdownWithMultipleVersions: () => JSX.Element;

package/dist/version-dropdown.composition.js

@@ -3,24 +3,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.VersionDropdownWithMultipleVerions = exports.VersionDropdownWithOneVerion = void 0;
+exports.VersionDropdownWithMultipleVersions = exports.VersionDropdownWithOneVersion = void 0;
 const react_1 = __importDefault(require("react"));
 const react_router_dom_1 = require("react-router-dom");
 const history_1 = require("history");
 const documenter_theme_theme_compositions_1 = require("@teambit/documenter.theme.theme-compositions");
 const version_dropdown_1 = require("./version-dropdown");
 const style = { display: 'flex', justifyContent: 'center', alignContent: 'center' };
-const VersionDropdownWithOneVerion = () => {
+const VersionDropdownWithOneVersion = () => {
     return (react_1.default.createElement(documenter_theme_theme_compositions_1.ThemeCompositions, { style: style },
         react_1.default.createElement(version_dropdown_1.VersionDropdown, { versions: ['0.1'], currentVersion: "0.1" })));
 };
-exports.VersionDropdownWithOneVerion = VersionDropdownWithOneVerion;
-const VersionDropdownWithMultipleVerions = () => {
+exports.VersionDropdownWithOneVersion = VersionDropdownWithOneVersion;
+const VersionDropdownWithMultipleVersions = () => {
     const history = (0, history_1.createBrowserHistory)();
     const versions = ['0.3', '0.2', '0.1'];
     return (react_1.default.createElement(documenter_theme_theme_compositions_1.ThemeCompositions, { style: style },
         react_1.default.createElement(react_router_dom_1.Router, { history: history },
             react_1.default.createElement(version_dropdown_1.VersionDropdown, { versions: versions, currentVersion: versions[0] }))));
 };
-exports.VersionDropdownWithMultipleVerions = VersionDropdownWithMultipleVerions;
+exports.VersionDropdownWithMultipleVersions = VersionDropdownWithMultipleVersions;
 //# sourceMappingURL=version-dropdown.composition.js.map

package/dist/version-dropdown.composition.js.map

@@ -1 +1 @@
-{"version":3,"file":"version-dropdown.composition.js","sourceRoot":"","sources":["../version-dropdown.composition.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,uDAA0C;AAC1C,qCAA+C;AAC/C,sGAAiF;AACjF,yDAAqD;AAErD,MAAM,KAAK,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,CAAC;AAE7E,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,OAAO,CACL,8BAAC,uDAAiB,IAAC,KAAK,EAAE,KAAK;QAC7B,8BAAC,kCAAe,IAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,cAAc,EAAC,KAAK,GAAG,CACzC,CACrB,CAAC;AACJ,CAAC,CAAC;AANW,QAAA,4BAA4B,gCAMvC;AAEK,MAAM,kCAAkC,GAAG,GAAG,EAAE;IACrD,MAAM,OAAO,GAAG,IAAA,8BAAoB,GAAE,CAAC;IACvC,MAAM,QAAQ,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IACvC,OAAO,CACL,8BAAC,uDAAiB,IAAC,KAAK,EAAE,KAAK;QAC7B,8BAAC,yBAAM,IAAC,OAAO,EAAE,OAAO;YACtB,8BAAC,kCAAe,IAAC,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAI,CAC7D,CACS,CACrB,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,kCAAkC,sCAU7C"}
+{"version":3,"file":"version-dropdown.composition.js","sourceRoot":"","sources":["../version-dropdown.composition.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,uDAA0C;AAC1C,qCAA+C;AAC/C,sGAAiF;AACjF,yDAAqD;AAErD,MAAM,KAAK,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,CAAC;AAE7E,MAAM,6BAA6B,GAAG,GAAG,EAAE;IAChD,OAAO,CACL,8BAAC,uDAAiB,IAAC,KAAK,EAAE,KAAK;QAC7B,8BAAC,kCAAe,IAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,cAAc,EAAC,KAAK,GAAG,CACzC,CACrB,CAAC;AACJ,CAAC,CAAC;AANW,QAAA,6BAA6B,iCAMxC;AAEK,MAAM,mCAAmC,GAAG,GAAG,EAAE;IACtD,MAAM,OAAO,GAAG,IAAA,8BAAoB,GAAE,CAAC;IACvC,MAAM,QAAQ,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IACvC,OAAO,CACL,8BAAC,uDAAiB,IAAC,KAAK,EAAE,KAAK;QAC7B,8BAAC,yBAAM,IAAC,OAAO,EAAE,OAAO;YACtB,8BAAC,kCAAe,IAAC,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAI,CAC7D,CACS,CACrB,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,mCAAmC,uCAU9C"}

package/dist/version-dropdown.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 declare type VersionDropdownProps = {
     versions: string[];
     currentVersion?: string;
+    latestVersion?: string;
 } & React.HTMLAttributes<HTMLDivElement>;
-export declare function VersionDropdown({ versions, currentVersion }: VersionDropdownProps): JSX.Element;
+export declare function VersionDropdown({ versions, currentVersion, latestVersion }: VersionDropdownProps): JSX.Element;
 export {};

package/dist/version-dropdown.docs.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { Router } from 'react-router-dom';
 import { createBrowserHistory } from 'history';
 import { VersionDropdown } from './version-dropdown';

package/dist/version-dropdown.js

@@ -5,14 +5,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.VersionDropdown = void 0;
 const evangelist_elements_icon_1 = require("@teambit/evangelist.elements.icon");
-const react_router_dom_1 = require("react-router-dom");
+const base_ui_routing_nav_link_1 = require("@teambit/base-ui.routing.nav-link");
 const evangelist_surfaces_dropdown_1 = require("@teambit/evangelist.surfaces.dropdown");
 const component_ui_version_label_1 = require("@teambit/component.ui.version-label");
 const design_ui_styles_ellipsis_1 = require("@teambit/design.ui.styles.ellipsis");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importDefault(require("react"));
 const version_dropdown_module_scss_1 = __importDefault(require("./version-dropdown.module.scss"));
-function VersionDropdown({ versions, currentVersion }) {
+const LOCAL_VERSION = 'workspace';
+function VersionDropdown({ versions, currentVersion, latestVersion }) {
     if (versions.length < 2) {
         return (react_1.default.createElement("div", { className: version_dropdown_module_scss_1.default.noVersions },
             react_1.default.createElement(VersionPlaceholder, { currentVersion: currentVersion })));
@@ -23,9 +24,9 @@ function VersionDropdown({ versions, currentVersion }) {
                 react_1.default.createElement("div", { className: version_dropdown_module_scss_1.default.title }, "Select version to view"),
                 react_1.default.createElement("div", { className: version_dropdown_module_scss_1.default.versionContainer }, versions.map((version, index) => {
                     const isCurrent = version === currentVersion;
-                    return (react_1.default.createElement(react_router_dom_1.NavLink, { to: `?version=${version}`, key: index, className: (0, classnames_1.default)(version_dropdown_module_scss_1.default.versionLine, isCurrent && version_dropdown_module_scss_1.default.currentVersion) },
+                    return (react_1.default.createElement(base_ui_routing_nav_link_1.NavLink, { href: version === LOCAL_VERSION ? '?' : `?version=${version}`, key: index, className: (0, classnames_1.default)(version_dropdown_module_scss_1.default.versionLine, isCurrent && version_dropdown_module_scss_1.default.currentVersion) },
                         react_1.default.createElement("span", { className: version_dropdown_module_scss_1.default.version }, version),
-                        index === 0 && react_1.default.createElement(component_ui_version_label_1.VersionLabel, { className: version_dropdown_module_scss_1.default.label, status: "latest" })));
+                        version === latestVersion && react_1.default.createElement(component_ui_version_label_1.VersionLabel, { className: version_dropdown_module_scss_1.default.label, status: "latest" })));
                 }))))));
 }
 exports.VersionDropdown = VersionDropdown;

package/dist/version-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"version-dropdown.js","sourceRoot":"","sources":["../version-dropdown.tsx"],"names":[],"mappings":";;;;;;AAAA,gFAAyD;AACzD,uDAA2C;AAC3C,wFAAiE;AACjE,oFAAmE;AACnE,kFAA8D;AAC9D,4DAAoC;AACpC,kDAA0B;AAE1B,kGAAoD;AAOpD,SAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAwB;IAChF,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;QACvB,OAAO,CACL,uCAAK,SAAS,EAAE,sCAAM,CAAC,UAAU;YAC/B,8BAAC,kBAAkB,IAAC,cAAc,EAAE,cAAc,GAAI,CAClD,CACP,CAAC;KACH;IACD,OAAO,CACL,uCAAK,SAAS,EAAE,sCAAM,CAAC,eAAe;QACpC,8BAAC,uCAAQ,IACP,SAAS,EAAE,sCAAM,CAAC,QAAQ,EAC1B,SAAS,EAAE,sCAAM,CAAC,IAAI,EACtB,WAAW,EAAC,EAAE,EACd,YAAY,QACZ,oBAAoB,EAAE,GAAG,EAAE,CAAC,CAC1B,8BAAC,kBAAkB,IAAC,cAAc,EAAE,cAAc,EAAE,SAAS,EAAE,sCAAM,CAAC,YAAY,GAAI,CACvF;YAED;gBACE,uCAAK,SAAS,EAAE,sCAAM,CAAC,KAAK,6BAA8B;gBAC1D,uCAAK,SAAS,EAAE,sCAAM,CAAC,gBAAgB,IACpC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE;oBAC/B,MAAM,SAAS,GAAG,OAAO,KAAK,cAAc,CAAC;oBAC7C,OAAO,CACL,8BAAC,0BAAO,IACN,EAAE,EAAE,YAAY,OAAO,EAAE,EACzB,GAAG,EAAE,KAAK,EACV,SAAS,EAAE,IAAA,oBAAU,EAAC,sCAAM,CAAC,WAAW,EAAE,SAAS,IAAI,sCAAM,CAAC,cAAc,CAAC;wBAE7E,wCAAM,SAAS,EAAE,sCAAM,CAAC,OAAO,IAAG,OAAO,CAAQ;wBAChD,KAAK,KAAK,CAAC,IAAI,8BAAC,yCAAY,IAAC,SAAS,EAAE,sCAAM,CAAC,KAAK,EAAE,MAAM,EAAC,QAAQ,GAAG,CAEjE,CACX,CAAC;gBACJ,CAAC,CAAC,CACE,CACF,CACG,CACP,CACP,CAAC;AACJ,CAAC;AAzCD,0CAyCC;AAED,SAAS,kBAAkB,CAAC,EAAE,cAAc,EAAE,SAAS,EAAmD;IACxG,OAAO,CACL,uCAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,sCAAM,CAAC,WAAW,EAAE,SAAS,CAAC;QACvD,8BAAC,oCAAQ,QAAE,cAAc,CAAY;QACrC,8BAAC,+BAAI,IAAC,EAAE,EAAC,gBAAgB,GAAG,CACxB,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"version-dropdown.js","sourceRoot":"","sources":["../version-dropdown.tsx"],"names":[],"mappings":";;;;;;AAAA,gFAAyD;AACzD,gFAA4D;AAC5D,wFAAiE;AACjE,oFAAmE;AACnE,kFAA8D;AAC9D,4DAAoC;AACpC,kDAA0B;AAE1B,kGAAoD;AAEpD,MAAM,aAAa,GAAG,WAAW,CAAC;AAQlC,SAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,aAAa,EAAwB;IAC/F,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;QACvB,OAAO,CACL,uCAAK,SAAS,EAAE,sCAAM,CAAC,UAAU;YAC/B,8BAAC,kBAAkB,IAAC,cAAc,EAAE,cAAc,GAAI,CAClD,CACP,CAAC;KACH;IAED,OAAO,CACL,uCAAK,SAAS,EAAE,sCAAM,CAAC,eAAe;QACpC,8BAAC,uCAAQ,IACP,SAAS,EAAE,sCAAM,CAAC,QAAQ,EAC1B,SAAS,EAAE,sCAAM,CAAC,IAAI,EACtB,WAAW,EAAC,EAAE,EACd,YAAY,QACZ,oBAAoB,EAAE,GAAG,EAAE,CAAC,CAC1B,8BAAC,kBAAkB,IAAC,cAAc,EAAE,cAAc,EAAE,SAAS,EAAE,sCAAM,CAAC,YAAY,GAAI,CACvF;YAED;gBACE,uCAAK,SAAS,EAAE,sCAAM,CAAC,KAAK,6BAA8B;gBAC1D,uCAAK,SAAS,EAAE,sCAAM,CAAC,gBAAgB,IACpC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE;oBAC/B,MAAM,SAAS,GAAG,OAAO,KAAK,cAAc,CAAC;oBAE7C,OAAO,CACL,8BAAC,kCAAO,IACN,IAAI,EAAE,OAAO,KAAK,aAAa,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,YAAY,OAAO,EAAE,EAC7D,GAAG,EAAE,KAAK,EACV,SAAS,EAAE,IAAA,oBAAU,EAAC,sCAAM,CAAC,WAAW,EAAE,SAAS,IAAI,sCAAM,CAAC,cAAc,CAAC;wBAE7E,wCAAM,SAAS,EAAE,sCAAM,CAAC,OAAO,IAAG,OAAO,CAAQ;wBAChD,OAAO,KAAK,aAAa,IAAI,8BAAC,yCAAY,IAAC,SAAS,EAAE,sCAAM,CAAC,KAAK,EAAE,MAAM,EAAC,QAAQ,GAAG,CAE/E,CACX,CAAC;gBACJ,CAAC,CAAC,CACE,CACF,CACG,CACP,CACP,CAAC;AACJ,CAAC;AA3CD,0CA2CC;AAED,SAAS,kBAAkB,CAAC,EAAE,cAAc,EAAE,SAAS,EAAmD;IACxG,OAAO,CACL,uCAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,sCAAM,CAAC,WAAW,EAAE,SAAS,CAAC;QACvD,8BAAC,oCAAQ,QAAE,cAAc,CAAY;QACrC,8BAAC,+BAAI,IAAC,EAAE,EAAC,gBAAgB,GAAG,CACxB,CACP,CAAC;AACJ,CAAC"}

package/dist/version-dropdown.spec.js

@@ -8,12 +8,12 @@ const react_2 = require("@testing-library/react");
 const chai_1 = require("chai");
 const version_dropdown_composition_1 = require("./version-dropdown.composition");
 it('should render one version', () => {
-    const { getByText } = (0, react_2.render)(react_1.default.createElement(version_dropdown_composition_1.VersionDropdownWithOneVerion, null));
+    const { getByText } = (0, react_2.render)(react_1.default.createElement(version_dropdown_composition_1.VersionDropdownWithOneVersion, null));
     const textVersion = getByText(/^0.1$/);
     (0, chai_1.expect)(textVersion).to.exist;
 });
 it('should return multiple versions', () => {
-    const { getByText, getAllByText } = (0, react_2.render)(react_1.default.createElement(version_dropdown_composition_1.VersionDropdownWithMultipleVerions, null));
+    const { getByText, getAllByText } = (0, react_2.render)(react_1.default.createElement(version_dropdown_composition_1.VersionDropdownWithMultipleVersions, null));
     const textVersionOne = getByText(/^0.1$/);
     const textVersionTwo = getByText(/^0.2$/);
     const textVersionThree = getAllByText(/^0.3$/);

package/dist/version-dropdown.spec.js.map

@@ -1 +1 @@
-{"version":3,"file":"version-dropdown.spec.js","sourceRoot":"","sources":["../version-dropdown.spec.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,kDAAgD;AAChD,+BAA8B;AAC9B,iFAAkH;AAElH,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACnC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,2DAA4B,OAAG,CAAC,CAAC;IAC/D,MAAM,WAAW,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC;IACvC,IAAA,aAAM,EAAC,WAAW,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;AAC/B,CAAC,CAAC,CAAC;AACH,EAAE,CAAC,iCAAiC,EAAE,GAAG,EAAE;IACzC,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,iEAAkC,OAAG,CAAC,CAAC;IACnF,MAAM,cAAc,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC;IAC1C,MAAM,cAAc,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC;IAC1C,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,CAAC,CAAC;IAC/C,IAAA,aAAM,EAAC,cAAc,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAChC,IAAA,aAAM,EAAC,cAAc,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAChC,IAAA,aAAM,EAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;AACxC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"version-dropdown.spec.js","sourceRoot":"","sources":["../version-dropdown.spec.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,kDAAgD;AAChD,+BAA8B;AAC9B,iFAAoH;AAEpH,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACnC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,4DAA6B,OAAG,CAAC,CAAC;IAChE,MAAM,WAAW,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC;IACvC,IAAA,aAAM,EAAC,WAAW,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;AAC/B,CAAC,CAAC,CAAC;AACH,EAAE,CAAC,iCAAiC,EAAE,GAAG,EAAE;IACzC,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,kEAAmC,OAAG,CAAC,CAAC;IACpF,MAAM,cAAc,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC;IAC1C,MAAM,cAAc,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC;IAC1C,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,CAAC,CAAC;IAC/C,IAAA,aAAM,EAAC,cAAc,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAChC,IAAA,aAAM,EAAC,cAAc,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAChC,IAAA,aAAM,EAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;AACxC,CAAC,CAAC,CAAC"}

package/package.json

@@ -1,24 +1,25 @@
 {
   "name": "@teambit/component.ui.version-dropdown",
-  "version": "0.0.488",
+  "version": "0.0.492",
   "homepage": "https://bit.dev/teambit/component/ui/version-dropdown",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.component",
     "name": "ui/version-dropdown",
-    "version": "0.0.488"
+    "version": "0.0.492"
   },
   "dependencies": {
     "classnames": "2.2.6",
-    "react-router-dom": "5.2.0",
     "core-js": "^3.0.0",
+    "@teambit/base-ui.routing.nav-link": "1.0.0",
     "@teambit/evangelist.elements.icon": "1.0.2",
     "@teambit/evangelist.surfaces.dropdown": "1.0.2",
-    "@teambit/component.ui.version-label": "0.0.488",
-    "@teambit/design.ui.styles.ellipsis": "0.0.346"
+    "@teambit/component.ui.version-label": "0.0.491",
+    "@teambit/design.ui.styles.ellipsis": "0.0.347"
   },
   "devDependencies": {
     "history": "4.10.1",
+    "react-router-dom": "5.2.0",
     "@types/history": "4.7.8",
     "@types/react-router-dom": "5.1.7",
     "@types/react": "^17.0.8",
@@ -26,18 +27,17 @@
     "chai": "4.3.0",
     "@types/chai": "4.2.15",
     "@types/classnames": "2.2.11",
-    "@types/mocha": "5.2.7",
+    "@types/mocha": "9.1.0",
     "@types/testing-library__jest-dom": "5.9.5",
     "@babel/runtime": "7.12.18",
     "@types/jest": "^26.0.0",
     "@types/react-dom": "^17.0.5",
     "@types/node": "12.20.4",
-    "@teambit/documenter.theme.theme-compositions": "2.0.3",
-    "@teambit/documenter.ui.section": "1.0.3",
-    "@teambit/documenter.ui.separator": "1.0.3"
+    "@teambit/documenter.theme.theme-compositions": "4.1.1",
+    "@teambit/documenter.ui.section": "4.1.1",
+    "@teambit/documenter.ui.separator": "4.1.1"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.193",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -54,7 +54,7 @@
       },
       "devDependencies": {
         "@teambit/legacy": "-",
-        "@types/mocha": "5.2.7",
+        "@types/mocha": "9.1.0",
         "@types/testing-library__jest-dom": "5.9.5",
         "@babel/runtime": "7.12.18",
         "@types/jest": "^26.0.0",
@@ -65,7 +65,6 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.193",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/version-dropdown.composition.tsx

@@ -6,7 +6,7 @@ import { VersionDropdown } from './version-dropdown';
 
 const style = { display: 'flex', justifyContent: 'center', alignContent: 'center' };
 
-export const VersionDropdownWithOneVerion = () => {
+export const VersionDropdownWithOneVersion = () => {
   return (
     <ThemeCompositions style={style}>
       <VersionDropdown versions={['0.1']} currentVersion="0.1" />
@@ -14,7 +14,7 @@ export const VersionDropdownWithOneVerion = () => {
   );
 };
 
-export const VersionDropdownWithMultipleVerions = () => {
+export const VersionDropdownWithMultipleVersions = () => {
   const history = createBrowserHistory();
   const versions = ['0.3', '0.2', '0.1'];
   return (

package/version-dropdown.spec.tsx

@@ -1,15 +1,15 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import { expect } from 'chai';
-import { VersionDropdownWithOneVerion, VersionDropdownWithMultipleVerions } from './version-dropdown.composition';
+import { VersionDropdownWithOneVersion, VersionDropdownWithMultipleVersions } from './version-dropdown.composition';
 
 it('should render one version', () => {
-  const { getByText } = render(<VersionDropdownWithOneVerion />);
+  const { getByText } = render(<VersionDropdownWithOneVersion />);
   const textVersion = getByText(/^0.1$/);
   expect(textVersion).to.exist;
 });
 it('should return multiple versions', () => {
-  const { getByText, getAllByText } = render(<VersionDropdownWithMultipleVerions />);
+  const { getByText, getAllByText } = render(<VersionDropdownWithMultipleVersions />);
   const textVersionOne = getByText(/^0.1$/);
   const textVersionTwo = getByText(/^0.2$/);
   const textVersionThree = getAllByText(/^0.3$/);

package/version-dropdown.tsx

@@ -1,5 +1,5 @@
 import { Icon } from '@teambit/evangelist.elements.icon';
-import { NavLink } from 'react-router-dom';
+import { NavLink } from '@teambit/base-ui.routing.nav-link';
 import { Dropdown } from '@teambit/evangelist.surfaces.dropdown';
 import { VersionLabel } from '@teambit/component.ui.version-label';
 import { Ellipsis } from '@teambit/design.ui.styles.ellipsis';
@@ -8,12 +8,15 @@ import React from 'react';
 
 import styles from './version-dropdown.module.scss';
 
+const LOCAL_VERSION = 'workspace';
+
 type VersionDropdownProps = {
   versions: string[];
   currentVersion?: string;
+  latestVersion?: string;
 } & React.HTMLAttributes<HTMLDivElement>;
 
-export function VersionDropdown({ versions, currentVersion }: VersionDropdownProps) {
+export function VersionDropdown({ versions, currentVersion, latestVersion }: VersionDropdownProps) {
   if (versions.length < 2) {
     return (
       <div className={styles.noVersions}>
@@ -21,6 +24,7 @@ export function VersionDropdown({ versions, currentVersion }: VersionDropdownPro
       </div>
     );
   }
+
   return (
     <div className={styles.versionDropdown}>
       <Dropdown
@@ -37,14 +41,15 @@ export function VersionDropdown({ versions, currentVersion }: VersionDropdownPro
           <div className={styles.versionContainer}>
             {versions.map((version, index) => {
               const isCurrent = version === currentVersion;
+
               return (
                 <NavLink
-                  to={`?version=${version}`}
+                  href={version === LOCAL_VERSION ? '?' : `?version=${version}`}
                   key={index}
                   className={classNames(styles.versionLine, isCurrent && styles.currentVersion)}
                 >
                   <span className={styles.version}>{version}</span>
-                  {index === 0 && <VersionLabel className={styles.label} status="latest" />}
+                  {version === latestVersion && <VersionLabel className={styles.label} status="latest" />}
                   {/* {version === currentVersion && <VersionLabel className={styles.label} status="checked-out" />} */}
                 </NavLink>
               );