linear-react-components-ui 1.1.0-beta.2 → 1.1.0-beta.4

package/lib/inputs/period/index.js

@@ -310,9 +310,7 @@ var PeriodPicker = function PeriodPicker(props) {
     if (showCalendarInDialog) {
       return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
         dialogSize: dialogSize,
-        handlerClose: function handlerClose() {
-          return setShowCalendarValueInitial(false);
-        }
+        onOpenChange: setShowCalendarValueInitial
       }, getCalendar(valueInitial, calendarColorStyle, 'valueInitial'));
     }
     return /*#__PURE__*/_react["default"].createElement(_Dropdown["default"], {
@@ -330,9 +328,7 @@ var PeriodPicker = function PeriodPicker(props) {
     if (showCalendarInDialog) {
       return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
         dialogSize: dialogSize,
-        handlerClose: function handlerClose() {
-          return setShowCalendarValueFinal(false);
-        }
+        onOpenChange: setShowCalendarValueFinal
       }, getCalendar(valueFinal, calendarColorStyle, 'valueFinal'));
     }
     return /*#__PURE__*/_react["default"].createElement(_Dropdown["default"], {
@@ -349,9 +345,7 @@ var PeriodPicker = function PeriodPicker(props) {
     if (showCalendarInDialog) {
       return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
         dialogSize: dialogSize,
-        handlerClose: function handlerClose() {
-          return setShowPeriodSelection(false);
-        }
+        onOpenChange: setShowPeriodSelection
       }, getPeriodSelection(valuePeriodSelection, setPeriodDates));
     }
     return /*#__PURE__*/_react["default"].createElement(_Dropdown["default"], {

package/lib/inputs/period/types.d.ts

@@ -19,7 +19,7 @@ interface IPeriodOptions {
 }
 interface IDialogProps {
     children: ReactNode | ReactNode[];
-    handlerClose: () => void;
+    onOpenChange: (open: boolean) => void;
     dialogSize: {
         width: string;
         height: string;

package/lib/panel/Content.d.ts

@@ -1,4 +1,4 @@
-import { a as IPanelContentProps } from '../types-exUmt06D.js';
+import { IPanelContentProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/DangerPanel.d.ts

@@ -1,4 +1,4 @@
-import { I as IPanelProps } from '../types-exUmt06D.js';
+import { IPanelProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/Default.d.ts

@@ -1,4 +1,4 @@
-import { I as IPanelProps } from '../types-exUmt06D.js';
+import { IPanelProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/Header.d.ts

@@ -1,4 +1,4 @@
-import { b as IPanelHeaderProps } from '../types-exUmt06D.js';
+import { IPanelHeaderProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/InfoPanel.d.ts

@@ -1,4 +1,4 @@
-import { I as IPanelProps } from '../types-exUmt06D.js';
+import { IPanelProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/PrimaryPanel.d.ts

@@ -1,4 +1,4 @@
-import { I as IPanelProps } from '../types-exUmt06D.js';
+import { IPanelProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/SuccessPanel.d.ts

@@ -1,4 +1,4 @@
-import { I as IPanelProps } from '../types-exUmt06D.js';
+import { IPanelProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/ToolBar.d.ts

@@ -1,4 +1,4 @@
-import { I as IPanelProps } from '../types-exUmt06D.js';
+import { IPanelProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/WarningPanel.d.ts

@@ -1,4 +1,4 @@
-import { I as IPanelProps } from '../types-exUmt06D.js';
+import { IPanelProps } from './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/helpers.d.ts

@@ -1,6 +1,11 @@
-import 'react';
-export { P as default, g as getCurrentThreshold, n as numberAroundZeroAndOne } from '../types-exUmt06D.js';
+import React__default from 'react';
+import { ContextProps } from './types.js';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';
 import '../@types/Icon.js';
 import '../icons/helper.js';
+
+declare function getCurrentThreshold(scrollableElement: HTMLDivElement, scrollThreshold: number): number;
+declare const PanelContext: React__default.Context<ContextProps>;
+
+export { PanelContext as default, getCurrentThreshold };

package/lib/panel/helpers.js

@@ -5,21 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 exports.getCurrentThreshold = getCurrentThreshold;
-exports.numberAroundZeroAndOne = numberAroundZeroAndOne;
 var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-function numberAroundZeroAndOne(_ref) {
-  var props = _ref.props,
-    propName = _ref.propName,
-    componentName = _ref.componentName;
-  if (props[propName]) {
-    var value = props[propName];
-    if (typeof value === 'number') {
-      return value >= 0 && value <= 1 ? value : new Error("invalid value of ".concat(propName, " in ").concat(componentName, " component, is not between 0 and 1"));
-    }
-  }
-  return null;
-}
 function getCurrentThreshold(scrollableElement, scrollThreshold) {
   var MIN_THRESHOLD = 0;
   var MAX_THRESHOLD = 1;

package/lib/panel/index.d.ts

@@ -6,7 +6,7 @@ export { default as SuccessPanel } from './SuccessPanel.js';
 export { default as InfoPanel } from './InfoPanel.js';
 export { default as PanelHeader } from './Header.js';
 export { default as PanelContent } from './Content.js';
-import '../types-exUmt06D.js';
+import './types.js';
 import 'react';
 import '../@types/PermissionAttr.js';
 import '../internals/colorStyles.js';

package/lib/panel/types.d.ts

@@ -1,6 +1,47 @@
-import 'react';
-export { A as AsyncFunc, C as ContextProps, F as Func, a as IPanelContentProps, b as IPanelHeaderProps, I as IPanelProps, c as IParameterFunction } from '../types-exUmt06D.js';
-import '../@types/PermissionAttr.js';
-import '../internals/colorStyles.js';
-import '../@types/Icon.js';
+import { ComponentPropsWithoutRef, ReactNode, ReactElement } from 'react';
+import { PermissionAttr } from '../@types/PermissionAttr.js';
+import ColorStyles from '../internals/colorStyles.js';
+import { IconNames } from '../@types/Icon.js';
 import '../icons/helper.js';
+
+type Func = () => void;
+type AsyncFunc = () => Promise<void>;
+interface IPanelProps extends Omit<ComponentPropsWithoutRef<'div'>, 'className'> {
+    customClass?: string;
+    startOpened?: boolean;
+    toggleable?: boolean;
+    children?: ReactNode;
+    colorStyle?: typeof ColorStyles | string;
+    gridCols?: string;
+    title?: string;
+    onEndReached?: Func | AsyncFunc;
+    onEndReachedThreshold?: number;
+    permissionAttr?: PermissionAttr | PermissionAttr[];
+}
+interface IPanelContentProps extends Omit<ComponentPropsWithoutRef<'div'>, 'className'> {
+    customClass?: string;
+}
+interface IPanelHeaderProps extends Omit<ComponentPropsWithoutRef<'div'>, 'className'> {
+    title?: string;
+    icon?: ReactElement;
+    titleIcon?: IconNames;
+    customClass?: string;
+    styleForTitle?: object;
+    customClassForTitle?: string;
+    headerColored?: boolean;
+}
+type ContextProps = {
+    toggleable: boolean;
+    handlerToggleable: () => void;
+    opened: boolean;
+    hideContent: boolean;
+    onEndReached?: Func | AsyncFunc;
+    onEndReachedThreshold: number;
+};
+interface IParameterFunction {
+    props: any;
+    propName: string | number;
+    componentName: string;
+}
+
+export type { AsyncFunc, ContextProps, Func, IPanelContentProps, IPanelHeaderProps, IPanelProps, IParameterFunction };

package/lib/tabs/DropdownTabs.d.ts

@@ -0,0 +1,11 @@
+import { DropdownProps } from './types.js';
+import 'react';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+
+declare const DropdownTabs: ({ tabs, tabMenuSize, }: DropdownProps) => JSX.Element | null;
+
+export { DropdownTabs as default };

package/lib/tabs/DropdownTabs.js

@@ -0,0 +1,75 @@
+"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
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _buttons = _interopRequireDefault(require("../buttons"));
+var _list = _interopRequireWildcard(require("../list"));
+var _useTabs2 = require("./useTabs");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+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); }
+var DropdownTab = function DropdownTab(_ref) {
+  var id = _ref.id,
+    title = _ref.title,
+    closeable = _ref.closeable,
+    iconAlign = _ref.iconAlign,
+    icon = _ref.icon,
+    iconName = _ref.iconName,
+    disabled = _ref.disabled,
+    tabMenuSize = _ref.tabMenuSize;
+  var _useTabs = (0, _useTabs2.useTabs)(),
+    selectTab = _useTabs.selectTab,
+    removeTab = _useTabs.removeTab;
+  return /*#__PURE__*/_react["default"].createElement(_list.ListItem, {
+    key: id
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "menuitem"
+  }, /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
+    className: "btn menubutton",
+    boxShadow: false,
+    onClick: function onClick() {
+      return selectTab(id);
+    },
+    iconAlign: iconAlign,
+    iconName: iconName,
+    icon: icon,
+    disabled: disabled,
+    label: title,
+    size: tabMenuSize,
+    transparent: true
+  }), closeable && /*#__PURE__*/_react["default"].createElement("button", {
+    className: "closepanel",
+    onClick: function onClick() {
+      return removeTab(id);
+    }
+  })));
+};
+var DropdownTabs = function DropdownTabs(_ref2) {
+  var _ref2$tabs = _ref2.tabs,
+    tabs = _ref2$tabs === void 0 ? [] : _ref2$tabs,
+    _ref2$tabMenuSize = _ref2.tabMenuSize,
+    tabMenuSize = _ref2$tabMenuSize === void 0 ? 'medium' : _ref2$tabMenuSize;
+  var hasTabs = tabs.length > 0;
+  if (tabs.length === 0) return null;
+  return /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
+    dropdown: true,
+    dropdownAlign: "right",
+    transparent: true,
+    boxShadow: false,
+    size: "large",
+    customClass: "dropdownbutton ".concat(hasTabs ? 'show' : '')
+  }, /*#__PURE__*/_react["default"].createElement(_list["default"], {
+    customClass: "dropdown-hide-tabs"
+  }, tabs.map(function (tab) {
+    return /*#__PURE__*/_react["default"].createElement(DropdownTab, _extends({
+      key: tab.id,
+      tabMenuSize: tabMenuSize
+    }, tab));
+  })));
+};
+var _default = exports["default"] = DropdownTabs;

package/lib/tabs/Menu.d.ts

@@ -6,6 +6,6 @@ import '../@types/PermissionAttr.js';
 import '../@types/Icon.js';
 import '../icons/helper.js';
 
-declare const Menu: ({ menuRef, toolbar, toolBarRef, customClassForToolBar, ...props }: MenuProps) => JSX.Element;
+declare const Menu: ({ toolbar, customClassForToolBar, tabWidth, ...props }: MenuProps) => JSX.Element;
 
 export { Menu as default };

package/lib/tabs/Menu.js

@@ -5,29 +5,41 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _MenuItems = _interopRequireDefault(require("./MenuItems"));
-var _DropdownItems = _interopRequireDefault(require("./DropdownItems"));
-var _excluded = ["menuRef", "toolbar", "toolBarRef", "customClassForToolBar"];
+var _MenuTabs = _interopRequireDefault(require("./MenuTabs"));
+var _DropdownTabs = _interopRequireDefault(require("./DropdownTabs"));
+var _useTabs2 = require("./useTabs");
+var _excluded = ["toolbar", "customClassForToolBar", "tabWidth"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 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 Menu = function Menu(_ref) {
-  var menuRef = _ref.menuRef,
-    toolbar = _ref.toolbar,
-    toolBarRef = _ref.toolBarRef,
+  var toolbar = _ref.toolbar,
     _ref$customClassForTo = _ref.customClassForToolBar,
     customClassForToolBar = _ref$customClassForTo === void 0 ? '' : _ref$customClassForTo,
+    _ref$tabWidth = _ref.tabWidth,
+    tabWidth = _ref$tabWidth === void 0 ? 'auto' : _ref$tabWidth,
     props = _objectWithoutProperties(_ref, _excluded);
+  var _useTabs = (0, _useTabs2.useTabs)(),
+    menuTabs = _useTabs.menuTabs,
+    menuRef = _useTabs.menuRef,
+    dropdownTabs = _useTabs.dropdownTabs;
   return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "menucontainer",
-    ref: function ref(_ref2) {
-      menuRef === null || menuRef === void 0 ? void 0 : menuRef(_ref2);
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_MenuItems["default"], props), /*#__PURE__*/_react["default"].createElement(_DropdownItems["default"], props), toolbar && /*#__PURE__*/_react["default"].cloneElement(toolbar, {
-    customClass: "menubar ".concat(customClassForToolBar),
-    innerRef: toolBarRef ? function (r) {
-      toolBarRef(r);
-    } : undefined
+    className: "menucontainer"
+  }, /*#__PURE__*/_react["default"].createElement(_MenuTabs["default"], {
+    tabs: menuTabs,
+    tabWidth: tabWidth,
+    tabMenuSize: props.tabMenuSize,
+    tabMenuAlign: props.tabMenuAlign,
+    firstTabIdent: props.firstTabIdent,
+    ref: menuRef
+  }), /*#__PURE__*/_react["default"].createElement(_DropdownTabs["default"], {
+    tabs: dropdownTabs,
+    tabWidth: tabWidth,
+    tabMenuSize: props.tabMenuSize,
+    tabMenuAlign: props.tabMenuAlign,
+    firstTabIdent: props.firstTabIdent
+  }), toolbar && /*#__PURE__*/_react["default"].cloneElement(toolbar, {
+    customClass: "menubar ".concat(customClassForToolBar)
   }));
 };
 var _default = exports["default"] = Menu;

package/lib/tabs/{DropdownItems.d.ts → MenuTabs.d.ts}

@@ -1,11 +1,11 @@
+import React__default from 'react';
 import { MenuProps } from './types.js';
-import 'react';
 import '../@types/Size.js';
 import '../@types/Position.js';
 import '../@types/PermissionAttr.js';
 import '../@types/Icon.js';
 import '../icons/helper.js';
 
-declare const DropdownItems: ({ handlerClick, handlerRemovePanel, dropdownPanels, tabMenuSize, }: MenuProps) => JSX.Element | null;
+declare const MenuTabs: React__default.ForwardRefExoticComponent<MenuProps & React__default.RefAttributes<HTMLUListElement>>;
 
-export { DropdownItems as default };
+export { MenuTabs as default };

package/lib/tabs/MenuTabs.js

@@ -0,0 +1,90 @@
+"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
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _buttons = _interopRequireDefault(require("../buttons"));
+var helpers = _interopRequireWildcard(require("./tabHelpers"));
+var _permissionValidations = require("../permissionValidations");
+var _useTabs2 = require("./useTabs");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+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); }
+var MenuTab = function MenuTab(_ref) {
+  var id = _ref.id,
+    title = _ref.title,
+    tabWidth = _ref.tabWidth,
+    iconAlign = _ref.iconAlign,
+    iconName = _ref.iconName,
+    icon = _ref.icon,
+    disabled = _ref.disabled,
+    permissionAttr = _ref.permissionAttr,
+    tabMenuSize = _ref.tabMenuSize,
+    tooltip = _ref.tooltip,
+    tooltipPosition = _ref.tooltipPosition,
+    tooltipWidth = _ref.tooltipWidth,
+    closeable = _ref.closeable;
+  var _useTabs = (0, _useTabs2.useTabs)(),
+    selectedTabId = _useTabs.selectedTabId,
+    selectTab = _useTabs.selectTab,
+    removeTab = _useTabs.removeTab,
+    tabsCount = _useTabs.tabsCount;
+  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"], {
+    className: "btn menubutton",
+    boxShadow: false,
+    onClick: function onClick() {
+      return selectTab(id);
+    },
+    iconAlign: iconAlign,
+    iconName: iconName,
+    icon: icon,
+    disabled: disabled || !!onDenied.disabled,
+    label: title,
+    size: tabMenuSize,
+    tooltip: tooltip || title,
+    tooltipPosition: tooltipPosition,
+    tooltipWidth: tooltipWidth
+  }), closeable && tabsCount > 1 && /*#__PURE__*/_react["default"].createElement("button", {
+    className: "closepanel",
+    onClick: function onClick() {
+      return removeTab(id);
+    }
+  }));
+};
+var MenuTabs = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
+  var _ref2$tabs = _ref2.tabs,
+    tabs = _ref2$tabs === void 0 ? [] : _ref2$tabs,
+    _ref2$tabWidth = _ref2.tabWidth,
+    tabWidth = _ref2$tabWidth === void 0 ? 'auto' : _ref2$tabWidth,
+    _ref2$tabMenuSize = _ref2.tabMenuSize,
+    tabMenuSize = _ref2$tabMenuSize === void 0 ? 'medium' : _ref2$tabMenuSize,
+    _ref2$tabMenuAlign = _ref2.tabMenuAlign,
+    tabMenuAlign = _ref2$tabMenuAlign === void 0 ? 'left' : _ref2$tabMenuAlign,
+    _ref2$firstTabIdent = _ref2.firstTabIdent,
+    firstTabIdent = _ref2$firstTabIdent === void 0 ? false : _ref2$firstTabIdent;
+  return /*#__PURE__*/_react["default"].createElement("ul", {
+    className: "menu ".concat(firstTabIdent && '-firsttabident'),
+    style: helpers.menuStyles(tabMenuAlign),
+    ref: ref
+  }, tabs.map(function (tab) {
+    return /*#__PURE__*/_react["default"].createElement(MenuTab, _extends({
+      key: tab.id,
+      menuTabsLength: tabs.length,
+      tabMenuSize: tabMenuSize,
+      tabWidth: tabWidth
+    }, tab));
+  }));
+});
+MenuTabs.displayName = 'MenuTabs';
+var _default = exports["default"] = MenuTabs;