@bydata/react-supertabs 1.1.1 → 1.1.3

package/dist/TabContext.js

@@ -13,6 +13,7 @@ var _reactRouterDom = require("react-router-dom");
 var _usePrevious = _interopRequireDefault(require("./usePrevious"));
 var _Utils = require("./Utils");
 var _Constants = require("./Constants");
+var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["subTabs", "level", "order", "tabId", "unique_identifier", "parent_tab_id", "width", "elementWidth"],
   _excluded2 = ["tab_info"],
   _excluded3 = ["subTabs", "level", "order", "tabId", "unique_identifier", "parent_tab_id", "width", "elementWidth"],
@@ -1830,7 +1831,7 @@ function TabProvider(_ref9) {
       clearTimeout(openingUnexpandedSubTabTimeoutRef.current);
     };
   }, []);
-  return /*#__PURE__*/React.createElement(TabContext.Provider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TabContext.Provider, {
     value: {
       activeTab: activeTab,
       activeTabRef: activeTabRef,
@@ -1887,8 +1888,9 @@ function TabProvider(_ref9) {
       discardSubTabWrapperWidth: discardSubTabWrapperWidth,
       isMobileView: isMobileView,
       isDefaultExpanded: isDefaultExpanded
-    }
-  }, children);
+    },
+    children: children
+  });
 }
 function useTabContext() {
   return (0, _react.useContext)(TabContext);

package/dist/TabList.js

@@ -9,6 +9,7 @@ var _TabContext = require("./TabContext");
 var _reactRouterDom = require("react-router-dom");
 var _ClickOutsideListener = _interopRequireDefault(require("./ClickOutsideListener"));
 require("./TabList.scss");
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -132,103 +133,117 @@ var TabList = function TabList(_ref) {
     return exactMatches.flat().concat(otherMatches);
   };
   var filteredTabs = filterTabs(tabs);
-  return /*#__PURE__*/React.createElement(_ClickOutsideListener["default"], {
-    onOutsideClick: handleOutsideClick
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "tab-list-wrapper ".concat(showList ? 'show' : ''),
-    style: position
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "tab-list"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "tab-list-header ".concat(hasCustomAddButtons ? 'wrap' : '')
-  }, customAddButtons.length > 0 ? customAddButtons.map(function (predefinedSubTab, index) {
-    var title = predefinedSubTab.title || predefinedSubTab.name || (predefinedSubTab !== null && predefinedSubTab !== void 0 && predefinedSubTab.firstName ? "".concat(predefinedSubTab.firstName, " ").concat(predefinedSubTab.lastName || '') : 'Untitled');
-    return /*#__PURE__*/React.createElement(_react.Fragment, {
-      key: predefinedSubTab.id || index
-    }, /*#__PURE__*/React.createElement("button", {
-      className: "icon-add",
-      onClick: function onClick() {
-        onAddButtonClick(predefinedSubTab);
-        closeList();
-        setShowList(false);
-      }
-    }, title), !(index == customAddButtons.length - 1) && /*#__PURE__*/React.createElement("span", {
-      className: "pipe"
-    }));
-  }) : showAddButton && !hasCustomAddButtons && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", {
-    className: "icon-add",
-    onClick: handlePlusButtonClick
-  }, "Tab"), /*#__PURE__*/React.createElement("span", {
-    className: "pipe"
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "tab-list-search-wrapper ".concat(!showAddButton || hasCustomAddButtons ? 'no-add-tab' : '', " ").concat(searchExpanded || !showAddButton || hasCustomAddButtons ? 'expanded' : ''),
-    onClick: expandSearch
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "tab-list-search-wrapper-inner"
-  }, /*#__PURE__*/React.createElement("input", {
-    ref: searchWrapperRef,
-    type: "text",
-    className: "tab-list-search",
-    value: tabListSearch,
-    onChange: handleSearch
-  }), tabListSearch.trim() && /*#__PURE__*/React.createElement("button", {
-    className: "tab-list-close tab-close-btn",
-    onClick: function onClick() {
-      return setTabListSearch('');
-    }
-  })))), /*#__PURE__*/React.createElement("div", {
-    className: "tab-list-open-tabs"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "tab-list-tabs-wrapper"
-  }, filteredTabs.length > 0 ? filteredTabs.map(function (tab, index) {
-    var title = tab.title || tab.name || (tab !== null && tab !== void 0 && tab.firstName ? "".concat(tab.firstName, " ").concat(tab.lastName || '') : 'Untitled');
-    return /*#__PURE__*/React.createElement(_reactRouterDom.NavLink, {
-      className: "tab-list-open-tab ".concat(id === activeTab.id && tab.id === activeSubTab.id ? 'active' : ''),
-      key: tab.id || index,
-      onClick: function onClick(e) {
-        // e.preventDefault();
-        handleTabClick({
-          tab: tab,
-          isSubTab: true,
-          parentId: id,
-          sort: true
-        });
-        // clearTimeout(openingUnexpandedSubTabTimeoutRef.current);
-        updateSubTabChange({
-          parentTabId: id,
-          newTab: tab,
-          oldTab: tabs.find(function (t) {
-            return t.open_order === 1;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ClickOutsideListener["default"], {
+    onOutsideClick: handleOutsideClick,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "tab-list-wrapper ".concat(showList ? 'show' : ''),
+      style: position,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "tab-list",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "tab-list-header ".concat(hasCustomAddButtons ? 'wrap' : ''),
+          children: [customAddButtons.length > 0 ? customAddButtons.map(function (predefinedSubTab, index) {
+            var title = predefinedSubTab.title || predefinedSubTab.name || (predefinedSubTab !== null && predefinedSubTab !== void 0 && predefinedSubTab.firstName ? "".concat(predefinedSubTab.firstName, " ").concat(predefinedSubTab.lastName || '') : 'Untitled');
+            return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+                className: "icon-add",
+                onClick: function onClick() {
+                  onAddButtonClick(predefinedSubTab);
+                  closeList();
+                  setShowList(false);
+                },
+                children: title
+              }), !(index == customAddButtons.length - 1) && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                className: "pipe"
+              })]
+            }, predefinedSubTab.id || index);
+          }) : showAddButton && !hasCustomAddButtons && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+              className: "icon-add",
+              onClick: handlePlusButtonClick,
+              children: "Tab"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              className: "pipe"
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: "tab-list-search-wrapper ".concat(!showAddButton || hasCustomAddButtons ? 'no-add-tab' : '', " ").concat(searchExpanded || !showAddButton || hasCustomAddButtons ? 'expanded' : ''),
+            onClick: expandSearch,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+              className: "tab-list-search-wrapper-inner",
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+                ref: searchWrapperRef,
+                type: "text",
+                className: "tab-list-search",
+                value: tabListSearch,
+                onChange: handleSearch
+              }), tabListSearch.trim() && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+                className: "tab-list-close tab-close-btn",
+                onClick: function onClick() {
+                  return setTabListSearch('');
+                }
+              })]
+            })
+          })]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "tab-list-open-tabs",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: "tab-list-tabs-wrapper",
+            children: filteredTabs.length > 0 ? filteredTabs.map(function (tab, index) {
+              var title = tab.title || tab.name || (tab !== null && tab !== void 0 && tab.firstName ? "".concat(tab.firstName, " ").concat(tab.lastName || '') : 'Untitled');
+              return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactRouterDom.NavLink, {
+                className: "tab-list-open-tab ".concat(id === activeTab.id && tab.id === activeSubTab.id ? 'active' : ''),
+                onClick: function onClick(e) {
+                  // e.preventDefault();
+                  handleTabClick({
+                    tab: tab,
+                    isSubTab: true,
+                    parentId: id,
+                    sort: true
+                  });
+                  // clearTimeout(openingUnexpandedSubTabTimeoutRef.current);
+                  updateSubTabChange({
+                    parentTabId: id,
+                    newTab: tab,
+                    oldTab: tabs.find(function (t) {
+                      return t.open_order === 1;
+                    })
+                  });
+                  // setOpeningUnexpandedSubTab(true);
+                  // openingUnexpandedSubTabTimeoutRef.current = setTimeout(() => {
+                  //     setOpeningUnexpandedSubTab(false);
+                  // }, 300);
+                  closeList();
+                  setShowList(false);
+                },
+                to: tab.url,
+                children: [tab.icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                  className: "icon-container ".concat(tab.icon)
+                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+                  className: "title-wrapper",
+                  children: [title, !tab.isFixed && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                    className: "tab-list-close-btn tab-close-btn",
+                    onClick: function onClick(e) {
+                      e.preventDefault();
+                      e.stopPropagation();
+                      onClose({
+                        tab: tab,
+                        isSubTab: true,
+                        parentIndex: parentIndex
+                      });
+                      closeList();
+                      setShowList(false);
+                    }
+                  })]
+                })]
+              }, tab.id || index);
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "tab-list-no-data",
+              children: "No data found"
+            })
           })
-        });
-        // setOpeningUnexpandedSubTab(true);
-        // openingUnexpandedSubTabTimeoutRef.current = setTimeout(() => {
-        //     setOpeningUnexpandedSubTab(false);
-        // }, 300);
-        closeList();
-        setShowList(false);
-      },
-      to: tab.url
-    }, tab.icon && /*#__PURE__*/React.createElement("span", {
-      className: "icon-container ".concat(tab.icon)
-    }), /*#__PURE__*/React.createElement("div", {
-      className: "title-wrapper"
-    }, title, !tab.isFixed && /*#__PURE__*/React.createElement("span", {
-      className: "tab-list-close-btn tab-close-btn",
-      onClick: function onClick(e) {
-        e.preventDefault();
-        e.stopPropagation();
-        onClose({
-          tab: tab,
-          isSubTab: true,
-          parentIndex: parentIndex
-        });
-        closeList();
-        setShowList(false);
-      }
-    })));
-  }) : /*#__PURE__*/React.createElement("div", {
-    className: "tab-list-no-data"
-  }, "No data found"))))));
+        })]
+      })
+    })
+  });
 };
 var _default = exports["default"] = TabList;

package/dist/TabStack.js

@@ -7,6 +7,7 @@ exports["default"] = void 0;
 var _react = require("react");
 var _TabContext = require("./TabContext");
 var _TabList = _interopRequireDefault(require("./TabList"));
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
 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); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
@@ -48,51 +49,53 @@ var TabStack = function TabStack(_ref) {
   }, [tab.customAddButtons, hasPrivilege]);
   var hasAddBtnPrivilege = typeof tab.showAddButton === 'boolean' ? tab.showAddButton : _typeof(tab.showAddButton) === 'object' && Array.isArray(tab.showAddButton) ? hasPrivilege(tab.showAddButton) : false;
   var hasCustomAddButtons = tab.customAddButtons && Array.isArray(tab.customAddButtons) && tab.customAddButtons.length > 0;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "stack-wrapper stack-".concat(tab.id, " ").concat(showSubTabs || isActive ? 'expanded' : '', " ").concat(isTabClosing ? 'stack-closing' : ''),
     onMouseEnter: function onMouseEnter() {
       return !showAddButton && subTabsInList.length > 1 && setShowTabStack(tab.id);
     },
     onMouseLeave: function onMouseLeave() {
       return !showAddButton && subTabsInList.length > 1 && !tabListSearch.trim() && setShowTabStack(null);
-    }
-  }, /*#__PURE__*/React.createElement("button", {
-    className: "icon-stack",
-    onClick: function onClick() {
-      setShowTabStack('');
-      if (hasCustomAddButtons && subTabsInList.length <= 1) {
-        !showTabStack && setShowTabStack(tab.id);
-      } else if (showAddButton) {
-        var _addButtonCallBackRef, _addButtonCallBackRef2;
-        (_addButtonCallBackRef = addButtonCallBackRefs.current) === null || _addButtonCallBackRef === void 0 || (_addButtonCallBackRef2 = _addButtonCallBackRef[tab.id]) === null || _addButtonCallBackRef2 === void 0 || _addButtonCallBackRef2.call(_addButtonCallBackRef);
-      } else {
-        toggleSubTabs(tab, tab.subTabs);
-      }
-    }
-  }, showAddButton && !showChevron && /*#__PURE__*/React.createElement("span", {
-    className: "icon-plus"
-  }), showChevron && /*#__PURE__*/React.createElement("span", {
-    className: "icon-chevron  ".concat(showSubTabs ? 'open' : '')
-  })), /*#__PURE__*/React.createElement(_TabList["default"], {
-    id: tab.id,
-    isTabExpanded: showSubTabs,
-    showTabStack: showTabStack,
-    showAddButton: hasAddBtnPrivilege,
-    handleTabClick: handleTabClick,
-    tabs: subTabsInList,
-    onClose: handleTabClose,
-    parentIndex: index,
-    hasCustomAddButtons: hasCustomAddButtons,
-    customAddButtons: customAddButtons,
-    onAddButtonClick: function onAddButtonClick(data) {
-      var _addButtonCallBackRef3, _addButtonCallBackRef4;
-      return (_addButtonCallBackRef3 = addButtonCallBackRefs.current) === null || _addButtonCallBackRef3 === void 0 || (_addButtonCallBackRef4 = _addButtonCallBackRef3[tab.id]) === null || _addButtonCallBackRef4 === void 0 ? void 0 : _addButtonCallBackRef4.call(_addButtonCallBackRef3, data);
     },
-    closeList: function closeList() {
-      return setShowTabStack(null);
-    },
-    tabListSearch: tabListSearch,
-    setTabListSearch: setTabListSearch
-  }));
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
+      className: "icon-stack",
+      onClick: function onClick() {
+        setShowTabStack('');
+        if (hasCustomAddButtons && subTabsInList.length <= 1) {
+          !showTabStack && setShowTabStack(tab.id);
+        } else if (showAddButton) {
+          var _addButtonCallBackRef, _addButtonCallBackRef2;
+          (_addButtonCallBackRef = addButtonCallBackRefs.current) === null || _addButtonCallBackRef === void 0 || (_addButtonCallBackRef2 = _addButtonCallBackRef[tab.id]) === null || _addButtonCallBackRef2 === void 0 || _addButtonCallBackRef2.call(_addButtonCallBackRef);
+        } else {
+          toggleSubTabs(tab, tab.subTabs);
+        }
+      },
+      children: [showAddButton && !showChevron && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "icon-plus"
+      }), showChevron && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "icon-chevron  ".concat(showSubTabs ? 'open' : '')
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabList["default"], {
+      id: tab.id,
+      isTabExpanded: showSubTabs,
+      showTabStack: showTabStack,
+      showAddButton: hasAddBtnPrivilege,
+      handleTabClick: handleTabClick,
+      tabs: subTabsInList,
+      onClose: handleTabClose,
+      parentIndex: index,
+      hasCustomAddButtons: hasCustomAddButtons,
+      customAddButtons: customAddButtons,
+      onAddButtonClick: function onAddButtonClick(data) {
+        var _addButtonCallBackRef3, _addButtonCallBackRef4;
+        return (_addButtonCallBackRef3 = addButtonCallBackRefs.current) === null || _addButtonCallBackRef3 === void 0 || (_addButtonCallBackRef4 = _addButtonCallBackRef3[tab.id]) === null || _addButtonCallBackRef4 === void 0 ? void 0 : _addButtonCallBackRef4.call(_addButtonCallBackRef3, data);
+      },
+      closeList: function closeList() {
+        return setShowTabStack(null);
+      },
+      tabListSearch: tabListSearch,
+      setTabListSearch: setTabListSearch
+    })]
+  });
 };
 var _default = exports["default"] = TabStack;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bydata/react-supertabs",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "description": "A customizable React super tabs component.",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -9,25 +9,19 @@
     "README.md"
   ],
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
     "build": "rm -rf dist && NODE_ENV=production babel src --out-dir dist --copy-files"
   },
-  "keywords": [],
-  "author": "",
   "license": "ISC",
-  "devDependencies": {
-    "@babel/cli": "^7.16.8",
-    "@babel/core": "^7.16.12",
-    "@babel/plugin-transform-runtime": "^7.16.10",
-    "@babel/preset-env": "^7.16.11",
-    "@babel/preset-react": "^7.16.7",
-    "@rollup/plugin-babel": "^5.3.0",
-    "autoprefixer": "^10.4.2",
-    "rollup": "^2.77.1",
-    "rollup-plugin-styles": "^4.0.0"
+  "peerDependencies": {
+    "react": ">=16",
+    "react-dom": ">=16"
   },
-  "dependencies": {
-    "@babel/runtime": "^7.16.7",
-    "next-transpile-modules": "^9.0.0"
+  "devDependencies": {
+    "@babel/cli": "^7.24.0",
+    "@babel/core": "^7.24.0",
+    "@babel/preset-env": "^7.24.0",
+    "@babel/preset-react": "^7.24.0",
+    "react": "16.14.0",
+    "react-dom": "16.14.0"
   }
-}
+}