linear-react-components-ui 0.4.77-beta.8 → 1.0.0-rc.1

package/lib/tabs/MenuItems.js

@@ -1,17 +1,15 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _buttons = _interopRequireDefault(require("./../buttons"));
+var _buttons = _interopRequireDefault(require("../buttons"));
 
 var helpers = _interopRequireWildcard(require("./tabHelpers"));
 
@@ -19,82 +17,70 @@ var _permissionValidations = require("../permissionValidations");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
+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; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var MenuItems = function MenuItems(_ref) {
-  var selectedTabId = _ref.selectedTabId,
-      handlerClick = _ref.handlerClick,
-      handlerRemovePanel = _ref.handlerRemovePanel,
-      tabMenuAlign = _ref.tabMenuAlign,
-      firstTabIdent = _ref.firstTabIdent,
-      tabMenuSize = _ref.tabMenuSize,
+  var handlerClick = _ref.handlerClick,
       currentPanels = _ref.currentPanels,
-      tabWidth = _ref.tabWidth;
-  return /*#__PURE__*/_react["default"].createElement("ul", {
+      handlerRemovePanel = _ref.handlerRemovePanel,
+      _ref$tabWidth = _ref.tabWidth,
+      tabWidth = _ref$tabWidth === void 0 ? 'auto' : _ref$tabWidth,
+      _ref$tabMenuSize = _ref.tabMenuSize,
+      tabMenuSize = _ref$tabMenuSize === void 0 ? 'medium' : _ref$tabMenuSize,
+      _ref$tabMenuAlign = _ref.tabMenuAlign,
+      tabMenuAlign = _ref$tabMenuAlign === void 0 ? 'left' : _ref$tabMenuAlign,
+      _ref$selectedTabId = _ref.selectedTabId,
+      selectedTabId = _ref$selectedTabId === void 0 ? '' : _ref$selectedTabId,
+      _ref$firstTabIdent = _ref.firstTabIdent,
+      firstTabIdent = _ref$firstTabIdent === void 0 ? false : _ref$firstTabIdent;
+  return /*#__PURE__*/_react.default.createElement("ul", {
     className: "menu ".concat(firstTabIdent && '-firsttabident'),
     style: helpers.menuStyles(tabMenuAlign)
-  }, currentPanels.map(function (panel, index) {
+  }, currentPanels === null || currentPanels === void 0 ? void 0 : currentPanels.map(function (panel, index) {
     var _panel$props = panel.props,
         id = _panel$props.id,
+        icon = _panel$props.icon,
         title = _panel$props.title,
+        tooltip = _panel$props.tooltip,
+        disabled = _panel$props.disabled,
+        iconName = _panel$props.iconName,
         closeable = _panel$props.closeable,
         iconAlign = _panel$props.iconAlign,
-        icon = _panel$props.icon,
-        iconName = _panel$props.iconName,
-        disabled = _panel$props.disabled,
-        tooltip = _panel$props.tooltip,
-        tooltipPosition = _panel$props.tooltipPosition,
         tooltipWidth = _panel$props.tooltipWidth,
-        permissionAttr = _panel$props.permissionAttr;
-    var onDenied = (0, _permissionValidations.actionsOnPermissionDenied)(permissionAttr, helpers.onDeniedOptions);
-    return onDenied.unvisible ? null : /*#__PURE__*/_react["default"].createElement("li", {
+        permissionAttr = _panel$props.permissionAttr,
+        tooltipPosition = _panel$props.tooltipPosition;
+    var onDenied = (0, _permissionValidations.actionsOnPermissionDenied)(helpers.onDeniedOptions, permissionAttr);
+    return onDenied.unvisible ? null : /*#__PURE__*/_react.default.createElement("li", {
       key: id,
       style: {
         width: tabWidth
       },
       className: "menuitem ".concat(selectedTabId === id && 'selected')
-    }, /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
+    }, /*#__PURE__*/_react.default.createElement(_buttons.default, {
       className: "btn menubutton",
       boxShadow: false,
       onClick: function onClick() {
-        return handlerClick(id);
+        return handlerClick === null || handlerClick === void 0 ? void 0 : handlerClick(id);
       },
       iconAlign: iconAlign,
       iconName: iconName,
       icon: icon,
-      disabled: disabled || onDenied.disabled,
+      disabled: disabled || !!onDenied.disabled,
       label: title,
       size: tabMenuSize,
       tooltip: tooltip || title,
       tooltipPosition: tooltipPosition,
       tooltipWidth: tooltipWidth
-    }), closeable && currentPanels.length > 1 && /*#__PURE__*/_react["default"].createElement("button", {
+    }), closeable && currentPanels.length > 1 && /*#__PURE__*/_react.default.createElement("button", {
       className: "closepanel",
       onClick: function onClick() {
-        handlerRemovePanel(id, index);
+        handlerRemovePanel === null || handlerRemovePanel === void 0 ? void 0 : handlerRemovePanel(id, index);
       }
     }));
   }));
 };
 
-MenuItems.propTypes = {
-  currentPanels: _propTypes["default"].arrayOf(_propTypes["default"].element).isRequired,
-  selectedTabId: _propTypes["default"].string,
-  handlerClick: _propTypes["default"].func.isRequired,
-  handlerRemovePanel: _propTypes["default"].func,
-  tabMenuAlign: _propTypes["default"].string.isRequired,
-  tabMenuSize: _propTypes["default"].string,
-  firstTabIdent: _propTypes["default"].bool,
-  tabWidth: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number])
-};
-MenuItems.defaultProps = {
-  handlerRemovePanel: null,
-  selectedTabId: '',
-  firstTabIdent: false,
-  tabMenuSize: 'medium',
-  tabWidth: 'auto'
-};
 var _default = MenuItems;
-exports["default"] = _default;
+exports.default = _default;

package/lib/tabs/Panel.d.ts

@@ -0,0 +1,9 @@
+import { PanelProps } from './types.js';
+import 'react';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+
+declare const Panel: ({ id, children, onEndReached, permissionAttr, customClass, onEndReachedThreshold, }: PanelProps) => JSX.Element;
+
+export { Panel as default };

package/lib/tabs/Panel.js

@@ -1,27 +1,25 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _tabHelpers = require("./tabHelpers");
+var _tabHelpers = _interopRequireWildcard(require("./tabHelpers"));
 
 var _permissionValidations = require("../permissionValidations");
 
 var _noPermission = _interopRequireDefault(require("../noPermission"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
+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; }
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
@@ -37,15 +35,17 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 var observer = null;
 
-var Panel = function Panel(props) {
-  var children = props.children,
-      customClass = props.customClass,
-      id = props.id,
-      onEndReached = props.onEndReached,
-      onEndReachedThreshold = props.onEndReachedThreshold,
-      permissionAttr = props.permissionAttr;
-
-  var _useContext = (0, _react.useContext)(_tabHelpers.TabContext),
+var Panel = function Panel(_ref) {
+  var id = _ref.id,
+      children = _ref.children,
+      onEndReached = _ref.onEndReached,
+      permissionAttr = _ref.permissionAttr,
+      _ref$customClass = _ref.customClass,
+      customClass = _ref$customClass === void 0 ? '' : _ref$customClass,
+      _ref$onEndReachedThre = _ref.onEndReachedThreshold,
+      onEndReachedThreshold = _ref$onEndReachedThre === void 0 ? 0.1 : _ref$onEndReachedThre;
+
+  var _useContext = (0, _react.useContext)(_tabHelpers.default),
       selectedTabId = _useContext.selectedTabId,
       contentHeight = _useContext.contentHeight;
 
@@ -57,7 +57,7 @@ var Panel = function Panel(props) {
 
   var onEndReachedRef = (0, _react.useRef)(onEndReached);
 
-  var _useState = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(permissionAttr, _tabHelpers.onDeniedOptions)),
+  var _useState = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(_tabHelpers.onDeniedOptions, permissionAttr)),
       _useState2 = _slicedToArray(_useState, 1),
       onDenied = _useState2[0];
 
@@ -74,7 +74,9 @@ var Panel = function Panel(props) {
     observer = new IntersectionObserver(function (entries) {
       entries.forEach(function (en) {
         if (en.intersectionRatio > 0) {
-          onEndReachedRef.current();
+          var _onEndReachedRef$curr;
+
+          (_onEndReachedRef$curr = onEndReachedRef.current) === null || _onEndReachedRef$curr === void 0 ? void 0 : _onEndReachedRef$curr.call(onEndReachedRef);
         }
       }, options);
     });
@@ -91,50 +93,15 @@ var Panel = function Panel(props) {
       scrollObserver(observedElement.current);
     }
   }, [observedElement]);
-  return /*#__PURE__*/_react["default"].createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     ref: rootElementRef,
     id: id,
     className: " ".concat(customClass, " panel ").concat(hidePanel),
     style: style
-  }, hideContent ? /*#__PURE__*/_react["default"].createElement(_noPermission["default"], null) : children, !hideContent && onEndReached ? /*#__PURE__*/_react["default"].createElement("div", {
+  }, hideContent ? /*#__PURE__*/_react.default.createElement(_noPermission.default, null) : children, !hideContent && onEndReached ? /*#__PURE__*/_react.default.createElement("div", {
     ref: observedElement
-  }) : /*#__PURE__*/_react["default"].createElement("noscript", null));
+  }) : /*#__PURE__*/_react.default.createElement("noscript", null));
 };
 
-Panel.defaultProps = {
-  title: '',
-  closable: false,
-  hidden: false,
-  iconName: null,
-  icon: null,
-  iconAlign: 'left',
-  customClass: '',
-  children: undefined,
-  tooltipPosition: 'bottom',
-  tooltipWidth: 'auto',
-  onEndReached: undefined,
-  onEndReachedThreshold: 0.1,
-  permissionAttr: undefined
-};
-Panel.propTypes = {
-  children: _propTypes["default"].any,
-  id: _propTypes["default"].string.isRequired,
-  customClass: _propTypes["default"].string,
-
-  /**
-   * Properties are used inside Menu.jsx to build the tabMenus
-   */
-  title: _propTypes["default"].string,
-  closable: _propTypes["default"].bool,
-  hidden: _propTypes["default"].bool,
-  icon: _propTypes["default"].instanceOf(Object),
-  iconName: _propTypes["default"].string,
-  iconAlign: _propTypes["default"].string,
-  tooltipPosition: _propTypes["default"].string,
-  tooltipWidth: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  onEndReached: _propTypes["default"].func,
-  onEndReachedThreshold: _tabHelpers.numberAroundZeroAndOne,
-  permissionAttr: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].arrayOf(_propTypes["default"].object)])
-};
 var _default = Panel;
-exports["default"] = _default;
+exports.default = _default;

package/lib/tabs/index.d.ts

@@ -0,0 +1,10 @@
+export { default as TabPanel } from './Panel.js';
+import { ITabsPros } from './types.js';
+import 'react';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+
+declare const Tabs: ({ toolbar, children, selectedTab, firstTabIdent, handlerTabClick, handlerCloseTab, style, tabMenuSize, tabMenuAlign, tabMenuPosition, customClassForToolBar, tabsWidthOnExceedCount, ...props }: ITabsPros) => JSX.Element;
+
+export { Tabs as default };

package/lib/tabs/index.js

@@ -1,6 +1,6 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -8,30 +8,30 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "TabPanel", {
   enumerable: true,
   get: function get() {
-    return _Panel["default"];
+    return _Panel.default;
   }
 });
-exports["default"] = void 0;
+exports.default = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _Menu = _interopRequireDefault(require("./Menu"));
 
 var _Panel = _interopRequireDefault(require("./Panel"));
 
-var _tabHelpers = require("./tabHelpers");
+var _tabHelpers = _interopRequireWildcard(require("./tabHelpers"));
 
 require("../assets/styles/tabs.scss");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var _excluded = ["toolbar", "children", "selectedTab", "firstTabIdent", "handlerTabClick", "handlerCloseTab", "style", "tabMenuSize", "tabMenuAlign", "tabMenuPosition", "customClassForToolBar", "tabsWidthOnExceedCount"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
+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; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
@@ -53,17 +53,34 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var DROPDOWN_WIDTH = 26;
 
-var Tabs = function Tabs(props) {
-  var handlerTabClick = props.handlerTabClick,
-      children = props.children,
-      handlerCloseTab = props.handlerCloseTab,
-      tabMenuPosition = props.tabMenuPosition,
-      style = props.style,
-      selectedTab = props.selectedTab,
-      toolbar = props.toolbar,
-      tabsWidthOnExceedCount = props.tabsWidthOnExceedCount;
+var Tabs = function Tabs(_ref) {
+  var _panels$, _panels$$props;
+
+  var toolbar = _ref.toolbar,
+      children = _ref.children,
+      selectedTab = _ref.selectedTab,
+      firstTabIdent = _ref.firstTabIdent,
+      handlerTabClick = _ref.handlerTabClick,
+      handlerCloseTab = _ref.handlerCloseTab,
+      _ref$style = _ref.style,
+      style = _ref$style === void 0 ? {} : _ref$style,
+      _ref$tabMenuSize = _ref.tabMenuSize,
+      tabMenuSize = _ref$tabMenuSize === void 0 ? 'default' : _ref$tabMenuSize,
+      _ref$tabMenuAlign = _ref.tabMenuAlign,
+      tabMenuAlign = _ref$tabMenuAlign === void 0 ? 'left' : _ref$tabMenuAlign,
+      _ref$tabMenuPosition = _ref.tabMenuPosition,
+      tabMenuPosition = _ref$tabMenuPosition === void 0 ? 'top' : _ref$tabMenuPosition,
+      _ref$customClassForTo = _ref.customClassForToolBar,
+      customClassForToolBar = _ref$customClassForTo === void 0 ? '' : _ref$customClassForTo,
+      _ref$tabsWidthOnExcee = _ref.tabsWidthOnExceedCount,
+      tabsWidthOnExceedCount = _ref$tabsWidthOnExcee === void 0 ? 0 : _ref$tabsWidthOnExcee,
+      props = _objectWithoutProperties(_ref, _excluded);
 
   var _useState = (0, _react.useState)((0, _tabHelpers.buildPanels)(children) || []),
       _useState2 = _slicedToArray(_useState, 2),
@@ -80,7 +97,7 @@ var Tabs = function Tabs(props) {
       dropdownPanels = _useState6[0],
       setDropdownPanels = _useState6[1];
 
-  var _useState7 = (0, _react.useState)(selectedTab || panels[0].props.id),
+  var _useState7 = (0, _react.useState)(selectedTab || ((_panels$ = panels[0]) === null || _panels$ === void 0 ? void 0 : (_panels$$props = _panels$.props) === null || _panels$$props === void 0 ? void 0 : _panels$$props.id)),
       _useState8 = _slicedToArray(_useState7, 2),
       selectedTabId = _useState8[0],
       setSelectedTabId = _useState8[1];
@@ -89,7 +106,7 @@ var Tabs = function Tabs(props) {
       _useState10 = _slicedToArray(_useState9, 1),
       customClass = _useState10[0];
 
-  var _useState11 = (0, _react.useState)(undefined),
+  var _useState11 = (0, _react.useState)(0),
       _useState12 = _slicedToArray(_useState11, 2),
       contentHeight = _useState12[0],
       setContentHeight = _useState12[1];
@@ -116,10 +133,10 @@ var Tabs = function Tabs(props) {
   var _toolBarRef = (0, _react.useRef)(null);
 
   var getTabListWidth = function getTabListWidth() {
-    var tabMenu = _menuRef.current.children[0];
-
-    var tabList = _toConsumableArray(tabMenu.children);
+    var _menuRef$current;
 
+    var tabMenu = (_menuRef$current = _menuRef.current) === null || _menuRef$current === void 0 ? void 0 : _menuRef$current.children[0];
+    var tabList = Array.from(tabMenu === null || tabMenu === void 0 ? void 0 : tabMenu.childNodes);
     var tabsListWidth = tabList.reduce(function (total, tab) {
       return total + tab.clientWidth;
     }, 0);
@@ -127,9 +144,11 @@ var Tabs = function Tabs(props) {
   };
 
   var getMenuAttributes = function getMenuAttributes() {
-    var menuSize = _menuRef.current.clientWidth;
+    var _menuRef$current2;
+
+    var menuSize = (_menuRef$current2 = _menuRef.current) === null || _menuRef$current2 === void 0 ? void 0 : _menuRef$current2.clientWidth;
     var toolbarSize = toolbar && _toolBarRef.current ? _toolBarRef.current.clientWidth : 0;
-    var contentWidth = (toolbar ? menuSize - toolbarSize : menuSize) - DROPDOWN_WIDTH;
+    var contentWidth = menuSize ? (toolbar ? menuSize - toolbarSize : menuSize) - DROPDOWN_WIDTH : 0;
     setTabsContentWidth(contentWidth);
   };
 
@@ -142,10 +161,12 @@ var Tabs = function Tabs(props) {
 
     if (newDropdownPanels.length) {
       var newDropdownPanelsIds = newDropdownPanels.map(function (dd) {
-        return dd.props.id;
+        var _dd$props;
+
+        return dd === null || dd === void 0 ? void 0 : (_dd$props = dd.props) === null || _dd$props === void 0 ? void 0 : _dd$props.id;
       });
       newCurrentPanels = newCurrentPanels.filter(function (tab) {
-        return !newDropdownPanelsIds.includes(tab.props.id);
+        return !newDropdownPanelsIds.includes(tab === null || tab === void 0 ? void 0 : tab.props.id);
       });
     }
 
@@ -165,15 +186,19 @@ var Tabs = function Tabs(props) {
 
   var onMenuClick = function onMenuClick(tabId) {
     var includedInDropdown = dropdownPanels.filter(function (item) {
-      return item.props.id === tabId;
+      var _item$props;
+
+      return (item === null || item === void 0 ? void 0 : (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.id) === tabId;
     });
 
     if (includedInDropdown.length > 0 && getTabListWidth() > 0) {
       var newDropdownPanels = dropdownPanels.filter(function (item) {
-        return item.props.id !== tabId;
+        var _item$props2;
+
+        return (item === null || item === void 0 ? void 0 : (_item$props2 = item.props) === null || _item$props2 === void 0 ? void 0 : _item$props2.id) !== tabId;
       });
       var newPanels = panels.filter(function (item) {
-        return item.props.id !== tabId;
+        return (item === null || item === void 0 ? void 0 : item.props.id) !== tabId;
       });
       var newCurrentPanels = currentPanels.slice(0, -1);
       newDropdownPanels.push(currentPanels.pop());
@@ -188,25 +213,30 @@ var Tabs = function Tabs(props) {
     setSelectedTabId(tabId);
   };
 
-  var onRemovePanel = function onRemovePanel(closedPanelId, panelIndex) {
+  var onRemovePanel = function onRemovePanel(closedPanelId) {
+    var panelIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
     var fromDropdownPanels = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var newSelectedTabId = selectedTabId;
     var remainPanels;
 
     if (!fromDropdownPanels) {
+      var _remainPanels;
+
       remainPanels = panels.filter(function (panel) {
-        return panel.props.id !== closedPanelId;
+        return (panel === null || panel === void 0 ? void 0 : panel.props.id) !== closedPanelId;
       });
-      newSelectedTabId = selectedTabId === closedPanelId ? remainPanels[panelIndex - (panelIndex === 0 ? 0 : 1)].props.id : selectedTabId;
+      newSelectedTabId = selectedTabId === closedPanelId ? (_remainPanels = remainPanels[panelIndex - (panelIndex === 0 ? 0 : 1)]) === null || _remainPanels === void 0 ? void 0 : _remainPanels.props.id : selectedTabId;
       setSelectedTabId(newSelectedTabId);
     } else {
       remainPanels = dropdownPanels.filter(function (panel) {
-        return panel.props.id !== closedPanelId;
+        var _panel$props;
+
+        return (panel === null || panel === void 0 ? void 0 : (_panel$props = panel.props) === null || _panel$props === void 0 ? void 0 : _panel$props.id) !== closedPanelId;
       });
       setDropdownPanels(remainPanels);
     }
 
-    if (handlerCloseTab) handlerCloseTab(closedPanelId, newSelectedTabId);
+    if (handlerCloseTab && newSelectedTabId) handlerCloseTab(closedPanelId, newSelectedTabId);
   };
 
   var onResize = function onResize() {
@@ -221,20 +251,25 @@ var Tabs = function Tabs(props) {
   };
 
   var renderContent = function renderContent() {
-    var menu = /*#__PURE__*/_react["default"].createElement(_Menu["default"], _extends({}, props, {
+    var menu = /*#__PURE__*/_react.default.createElement(_Menu.default, _extends({}, props, {
+      toolbar: toolbar,
       tabWidth: tabWidth,
+      customClass: customClass,
+      tabMenuSize: tabMenuSize,
+      handlerClick: onMenuClick,
+      tabMenuAlign: tabMenuAlign,
+      firstTabIdent: firstTabIdent,
+      currentPanels: currentPanels,
+      selectedTabId: selectedTabId,
+      dropdownPanels: dropdownPanels,
+      handlerRemovePanel: onRemovePanel,
+      customClassForToolBar: customClassForToolBar,
       menuRef: function menuRef(ref) {
         _menuRef.current = ref;
       },
       toolBarRef: function toolBarRef(ref) {
         _toolBarRef.current = ref;
-      },
-      customClass: customClass,
-      currentPanels: currentPanels,
-      dropdownPanels: dropdownPanels,
-      selectedTabId: selectedTabId,
-      handlerClick: onMenuClick,
-      handlerRemovePanel: onRemovePanel
+      }
     }));
     /*
       Change the order of elements depending of menus position
@@ -242,10 +277,10 @@ var Tabs = function Tabs(props) {
 
 
     if (tabMenuPosition === 'top' || tabMenuPosition === 'left') {
-      return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, menu, panels);
+      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, menu, panels);
     }
 
-    return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, panels, menu);
+    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, panels, menu);
   };
 
   (0, _react.useEffect)(function () {
@@ -262,49 +297,20 @@ var Tabs = function Tabs(props) {
   (0, _react.useEffect)(function () {
     getTabsList();
   }, [panels.length, currentPanels.length, tabsContentWidth]);
-
-  var getContextValues = function getContextValues() {
-    return {
-      selectedTabId: selectedTabId,
-      contentHeight: contentHeight
-    };
+  var contextValues = {
+    selectedTabId: selectedTabId,
+    contentHeight: contentHeight
   };
-
-  return /*#__PURE__*/_react["default"].createElement(_tabHelpers.TabContext.Provider, {
-    value: getContextValues()
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    ref: function ref(_ref) {
-      componentRef.current = _ref;
+  return /*#__PURE__*/_react.default.createElement(_tabHelpers.default.Provider, {
+    value: contextValues
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    ref: function ref(_ref2) {
+      componentRef.current = _ref2;
     },
     className: (0, _tabHelpers.tabsClass)(tabMenuPosition),
     style: style
   }, renderContent()));
 };
 
-Tabs.propTypes = {
-  selectedTab: _propTypes["default"].string,
-  tabMenuAlign: _propTypes["default"].oneOf(['left', 'center', 'right', 'top', 'bottom']),
-  tabMenuPosition: _propTypes["default"].oneOf(['top', 'left', 'bottom', 'right']),
-  tabMenuSize: _propTypes["default"].string,
-  handlerTabClick: _propTypes["default"].func,
-  handlerCloseTab: _propTypes["default"].func,
-  children: _propTypes["default"].any.isRequired,
-  toolbar: _propTypes["default"].object,
-  customClassForToolBar: _propTypes["default"].string,
-  style: _propTypes["default"].object,
-  tabsWidthOnExceedCount: _propTypes["default"].number
-};
-Tabs.defaultProps = {
-  selectedTab: null,
-  tabMenuAlign: 'left',
-  tabMenuPosition: 'top',
-  tabMenuSize: 'default',
-  handlerTabClick: null,
-  handlerCloseTab: null,
-  toolbar: undefined,
-  customClassForToolBar: '',
-  style: {},
-  tabsWidthOnExceedCount: 0
-};
 var _default = Tabs;
-exports["default"] = _default;
+exports.default = _default;

package/lib/tabs/tabHelpers.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+import { Position } from '../@types/Position.js';
+import { PanelTypeAndProps, TabsContextValues } from './types.js';
+import '../@types/Size.js';
+import '../@types/PermissionAttr.js';
+
+/**
+ * Recursive funcion to get the panels passed as children elements to the Tabs Component.
+ * Sometimes, when tabs were added dynamically, the children can came as array or Panels.
+ */
+declare function buildPanels(children: ReactNode | ReactNode, panels?: Array<ReactNode>): PanelTypeAndProps[];
+declare function tabsClass(tabMenuPosition: Exclude<Position, 'center'>): string;
+declare function menuStyles(tabMenuAlign: Position): {
+    justifyContent: string;
+};
+declare function numberAroundZeroAndOne(props: Array<object>, propName: number, componentName: string): Error | null;
+declare const onDeniedOptions: string[];
+declare const TabContext: React.Context<TabsContextValues>;
+
+export { buildPanels, TabContext as default, menuStyles, numberAroundZeroAndOne, onDeniedOptions, tabsClass };