@bydata/react-supertabs 1.1.7 → 1.1.9

package/dist/NotAvailable.js

@@ -13,7 +13,7 @@ var NotAvailable = function NotAvailable(_ref) {
   var title = _ref.title,
     description = _ref.description,
     _ref$subTabName = _ref.subTabName,
-    subTabName = _ref$subTabName === void 0 ? 'Page' : _ref$subTabName;
+    subTabName = _ref$subTabName === void 0 ? "Page" : _ref$subTabName;
   var _useTabContext = (0, _TabContext.useTabContext)(),
     activeSubTab = _useTabContext.activeSubTab;
   var heading = title !== null && title !== void 0 ? title : (0, _Utils.getTitle)(activeSubTab);
@@ -24,7 +24,7 @@ var NotAvailable = function NotAvailable(_ref) {
     className: "not-available-content"
   }, /*#__PURE__*/_react["default"].createElement("h3", {
     className: "title"
-  }, heading.replace('Loading...', 'Untitled')), /*#__PURE__*/_react["default"].createElement("p", {
+  }, heading.replace("Loading...", "Untitled")), /*#__PURE__*/_react["default"].createElement("p", {
     className: "description"
   }, subHeading)));
 };

package/dist/SuperLink.js

@@ -7,35 +7,16 @@ exports["default"] = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactRouterDom = require("react-router-dom");
 var _TabContext = require("./TabContext");
-var _excluded = ["children", "tab", "isSubTab", "isExternal"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-/**
- * Hook that returns whether we're inside a valid React Router context.
- * When the app and the library use different copies of react-router-dom,
- * location can be undefined and NavLink would throw reading pathname.
- */
-function useHasRouterContext() {
-  try {
-    var location = (0, _reactRouterDom.useLocation)();
-    return location != null && typeof location.pathname === 'string';
-  } catch (_unused) {
-    return false;
-  }
-}
 var SuperLink = function SuperLink(_ref) {
   var children = _ref.children,
     tab = _ref.tab,
     _ref$isSubTab = _ref.isSubTab,
     isSubTab = _ref$isSubTab === void 0 ? true : _ref$isSubTab,
     _ref$isExternal = _ref.isExternal,
-    isExternal = _ref$isExternal === void 0 ? false : _ref$isExternal,
-    rest = _objectWithoutProperties(_ref, _excluded);
+    isExternal = _ref$isExternal === void 0 ? false : _ref$isExternal;
   var _useTabContext = (0, _TabContext.useTabContext)(),
     openSuperTabOnRowClick = _useTabContext.openSuperTabOnRowClick;
-  var hasRouterContext = useHasRouterContext();
   var handleSuperLinkClick = function handleSuperLinkClick(e) {
     if (isExternal) {
       e.preventDefault();
@@ -47,22 +28,11 @@ var SuperLink = function SuperLink(_ref) {
       isSubTab: isSubTab
     });
   };
-  if (!hasRouterContext) {
-    return /*#__PURE__*/_react["default"].createElement("a", _extends({
-      href: tab.url,
-      title: tab.title || '',
-      onClick: function onClick(e) {
-        if (!isExternal) {
-          e.preventDefault();
-          handleSuperLinkClick(e);
-        }
-      }
-    }, rest), children);
-  }
-  return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.NavLink, _extends({
+  return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.NavLink, {
     to: tab.url,
     title: tab.title || '',
     onClick: handleSuperLinkClick
-  }, rest), children);
+    // exact
+  }, children);
 };
 var _default = exports["default"] = SuperLink;

package/dist/SuperTabs.js

@@ -50,7 +50,11 @@ var tooltipStyles = {
   zIndex: 100000,
   boxShadow: "0px 1px 10px 0px rgba(0, 0, 0, 0.10)",
   marginBottom: "5px",
-  minWidth: "fit-content"
+  minWidth: "fit-content",
+  marginTop: "2px",
+  borderRadius: "2px",
+  backgroundColor: 'var(--tab-background-overlay, #272B32)',
+  color: 'var(--tab-text-normal, #BDC3CC)'
 };
 var filterSubTabs = function filterSubTabs(subTabs) {
   // const subTabsInList = [];
@@ -106,6 +110,7 @@ var SuperTabs = function SuperTabs(_ref) {
     updateExpandedID = _useTabContext.updateExpandedID,
     expandedTabIDRef = _useTabContext.expandedTabIDRef,
     updateCurrentTab = _useTabContext.updateCurrentTab,
+    openSuperTabOnRowClick = _useTabContext.openSuperTabOnRowClick,
     hasPrivilege = _useTabContext.hasPrivilege,
     subTabChange = _useTabContext.subTabChange,
     updateSubTabChange = _useTabContext.updateSubTabChange,
@@ -324,8 +329,6 @@ var SuperTabs = function SuperTabs(_ref) {
 
   // Hover handlers for brand wrapper
   var handleBrandHoverEnter = function handleBrandHoverEnter() {
-    console.log('handleBrandHoverEnter', isMobile, preventHomeRedirect);
-
     // Skip hover functionality on mobile devices to avoid conflicts
     if (isMobile) return;
 
@@ -849,7 +852,14 @@ var SuperTabs = function SuperTabs(_ref) {
           ref: provided.innerRef
           // (snapshot.isDragging ? " dragging" : "") +
           ,
-          className: 'tab-with-child-wrapper parent-super-tab' + " tab-".concat(tab.id) + (isActive ? ' active' : '') + (closingTabID === tab.id ? ' stack-closing' : '') + (shrinkedTab ? ' shrinked-parent-tab' : '') + (snapshot.isDragging ? ' dragging' : '')
+          className: 'tab-with-child-wrapper parent-super-tab' + " tab-".concat(tab.id) + (isActive ? ' active' : '') + (closingTabID === tab.id ? ' stack-closing' : '') + (shrinkedTab ? ' shrinked-parent-tab' : '') + (snapshot.isDragging ? ' dragging' : ''),
+          onClick: function onClick() {
+            if (isActive) return;
+            openSuperTabOnRowClick({
+              tab: tab,
+              isSubTab: false
+            });
+          }
         }), /*#__PURE__*/_react["default"].createElement("div", {
           className: 'child-tabs-wrapper tab-' + tab.id + (showSubTabs ? ' expanded' : '')
           // (isActive ? ' active' : '')
@@ -870,6 +880,7 @@ var SuperTabs = function SuperTabs(_ref) {
           // title={tab.title}
           ,
           onClick: function onClick(e) {
+            e.stopPropagation();
             var ignoreActiveTabUpdate = false;
             if (containsSubTabs && !isActive) {
               var _lastOpenedUrl$curren;

package/dist/SuperTabs.scss

@@ -197,6 +197,7 @@ body[data-theme="light"] {
 
         display: flex;
         align-items: center;
+        cursor: pointer !important;
         transition-duration: var(--transition-duration-extended);
         transition-property: padding, opacity, border-color, max-width;
 
@@ -536,6 +537,7 @@ body[data-theme="light"] {
         align-items: center;
         position: relative;
         z-index: 10;
+        cursor: pointer !important;
 
         &:not(.active) {
             position: relative;

package/dist/TabContext.js

@@ -1496,7 +1496,7 @@ function TabProvider(_ref9) {
                   break;
                 }
                 pathName = window.location.pathname;
-                isHomeTab = pathName === homeUrl;
+                isHomeTab = pathName === homeUrl || pathName === '/';
                 _context10.n = 3;
                 return findDuplicateEntriesAndCloseTab(response.tabs);
               case 3:

package/dist/TabList.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _react = _interopRequireWildcard(require("react"));
+var _reactDom = require("react-dom");
 var _TabContext = require("./TabContext");
 var _reactRouterDom = require("react-router-dom");
 var _ClickOutsideListener = _interopRequireDefault(require("./ClickOutsideListener"));
@@ -74,13 +75,16 @@ var TabList = function TabList(_ref) {
     if (popupElem) {
       var popupRect = popupElem.getBoundingClientRect();
       var windowWidth = window.innerWidth;
+      var top = "".concat(popupRect.bottom - 2, "px");
       if (popupRect.right + 300 > windowWidth) {
         position = {
-          right: "".concat(window.innerWidth - (popupRect === null || popupRect === void 0 ? void 0 : popupRect.right), "px")
+          right: "".concat(window.innerWidth - (popupRect === null || popupRect === void 0 ? void 0 : popupRect.right), "px"),
+          top: top
         };
       } else {
         position = {
-          left: "".concat((popupRect === null || popupRect === void 0 ? void 0 : popupRect.left) + 5, "px")
+          left: "".concat((popupRect === null || popupRect === void 0 ? void 0 : popupRect.left) + 5, "px"),
+          top: top
         };
       }
     }
@@ -134,7 +138,7 @@ var TabList = function TabList(_ref) {
     return exactMatches.flat().concat(otherMatches);
   };
   var filteredTabs = filterTabs(tabs);
-  return /*#__PURE__*/_react["default"].createElement(_ClickOutsideListener["default"], {
+  var tabListContent = /*#__PURE__*/_react["default"].createElement(_ClickOutsideListener["default"], {
     onOutsideClick: handleOutsideClick
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "tab-list-wrapper ".concat(showList ? 'show' : ''),
@@ -154,7 +158,7 @@ var TabList = function TabList(_ref) {
         closeList();
         setShowList(false);
       }
-    }, title), !(index == customAddButtons.length - 1) && /*#__PURE__*/_react["default"].createElement("span", {
+    }, title), !(index === customAddButtons.length - 1) && /*#__PURE__*/_react["default"].createElement("span", {
       className: "pipe"
     }));
   }) : showAddButton && !hasCustomAddButtons && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("button", {
@@ -232,5 +236,9 @@ var TabList = function TabList(_ref) {
   }) : /*#__PURE__*/_react["default"].createElement("div", {
     className: "tab-list-no-data"
   }, "No data found"))))));
+  if (!showList) {
+    return null;
+  }
+  return /*#__PURE__*/(0, _reactDom.createPortal)(tabListContent, document.body);
 };
 var _default = exports["default"] = TabList;

package/dist/TabList.scss

@@ -1,11 +1,11 @@
 .tab-list-wrapper {
     padding-top: 12px;
     position: fixed;
-    top: calc(var(--header-height-other-tab) - 8px);
     opacity: 0;
     visibility: hidden;
     transition: opacity 0.3s;
     pointer-events: none;
+    z-index: 10000;
 
     &.show {
         opacity: 1;

package/dist/index.js

@@ -1,24 +1,25 @@
 "use strict";
 
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 Object.defineProperty(exports, "NotAvailable", {
   enumerable: true,
   get: function get() {
-    return _NotAvailable.NotAvailable;
+    return _NotAvailable["default"];
   }
 });
 Object.defineProperty(exports, "SuperLink", {
   enumerable: true,
   get: function get() {
-    return _SuperLink.SuperLink;
+    return _SuperLink["default"];
   }
 });
 Object.defineProperty(exports, "SuperTabs", {
   enumerable: true,
   get: function get() {
-    return _SuperTabs.SuperTabs;
+    return _SuperTabs["default"];
   }
 });
 Object.defineProperty(exports, "TabProvider", {
@@ -45,7 +46,9 @@ Object.defineProperty(exports, "useTabContext", {
     return _TabContext.useTabContext;
   }
 });
-var _SuperTabs = require("./SuperTabs");
-var _SuperLink = require("./SuperLink");
-var _NotAvailable = require("./NotAvailable");
-var _TabContext = require("./TabContext");
+var _SuperTabs = _interopRequireWildcard(require("./SuperTabs"));
+var _SuperLink = _interopRequireDefault(require("./SuperLink"));
+var _NotAvailable = _interopRequireDefault(require("./NotAvailable"));
+var _TabContext = require("./TabContext");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bydata/react-supertabs",
-  "version": "1.1.7",
+  "version": "1.1.9",
   "description": "A customizable React super tabs component.",
   "main": "dist/index.js",
   "module": "dist/index.js",

package/dist/images/icon-stack.svg

@@ -1,6 +0,0 @@
-<svg width="36" height="30" viewBox="0 0 36 30" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M8 4.00098C8 2.89641 8.89543 2.00098 10 2.00098H32C33.1046 2.00098 34 2.89641 34 4.00098V26.001C34 27.1055 33.1046 28.001 32 28.001H10C8.89543 28.001 8 27.1055 8 26.001V4.00098Z" fill="#1D2024"/>
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M10 0.000976562H32C34.2091 0.000976562 36 1.79184 36 4.00098V26.001C36 28.2101 34.2091 30.001 32 30.001H10C7.79086 30.001 6 28.2101 6 26.001V4.00098C6 1.79184 7.79086 0.000976562 10 0.000976562ZM10 2.00098C8.89543 2.00098 8 2.89641 8 4.00098V26.001C8 27.1055 8.89543 28.001 10 28.001H32C33.1046 28.001 34 27.1055 34 26.001V4.00098C34 2.89641 33.1046 2.00098 32 2.00098H10Z" fill="black"/>
-    <path d="M2 4.00098C2 2.89641 2.89543 2.00098 4 2.00098H26C27.1046 2.00098 28 2.89641 28 4.00098V26.001C28 27.1055 27.1046 28.001 26 28.001H4C2.89543 28.001 2 27.1055 2 26.001V4.00098Z" fill="#1D2024"/>
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M4 0.000976562H26C28.2091 0.000976562 30 1.79184 30 4.00098V26.001C30 28.2101 28.2091 30.001 26 30.001H4C1.79086 30.001 0 28.2101 0 26.001V4.00098C0 1.79184 1.79086 0.000976562 4 0.000976562ZM4 2.00098C2.89543 2.00098 2 2.89641 2 4.00098V26.001C2 27.1055 2.89543 28.001 4 28.001H26C27.1046 28.001 28 27.1055 28 26.001V4.00098C28 2.89641 27.1046 2.00098 26 2.00098H4Z" fill="black"/>
-</svg>