carbon-react 118.5.1 → 118.5.2

package/lib/components/tabs/__internal__/tab-title/tab-title.component.js

@@ -4,130 +4,104 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.TabTitleContext = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _tabTitle = require("./tab-title.style");
-
 var _tags = _interopRequireDefault(require("../../../../__internal__/utils/helpers/tags/tags"));
-
 var _validationIcon = _interopRequireDefault(require("../../../../__internal__/validations/validation-icon.component"));
-
 var _icon = _interopRequireDefault(require("../../../icon"));
-
 var _events = _interopRequireDefault(require("../../../../__internal__/utils/helpers/events"));
-
 var _tooltipProvider = require("../../../../__internal__/tooltip-provider");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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 _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); }
 const TabTitleContext = /*#__PURE__*/_react.default.createContext({});
-
 exports.TabTitleContext = TabTitleContext;
-
-const TabTitle = /*#__PURE__*/_react.default.forwardRef(({
-  isTabSelected,
-  dataTabId,
-  "data-role": dataRole,
-  title,
-  position,
-  error,
-  warning,
-  info,
-  size = "default",
-  onClick,
-  titlePosition = "before",
-  siblings,
-  errorMessage = "",
-  warningMessage = "",
-  infoMessage = "",
-  borders,
-  alternateStyling = false,
-  noLeftBorder = false,
-  noRightBorder = false,
-  customLayout,
-  isInSidebar,
-  href,
-  onKeyDown,
-  align,
-  tabIndex,
-  ...tabTitleProps
-}, ref) => {
+const TabTitle = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+  let {
+    isTabSelected,
+    dataTabId,
+    "data-role": dataRole,
+    title,
+    position,
+    error,
+    warning,
+    info,
+    size = "default",
+    onClick,
+    titlePosition = "before",
+    siblings,
+    errorMessage = "",
+    warningMessage = "",
+    infoMessage = "",
+    borders,
+    alternateStyling = false,
+    noLeftBorder = false,
+    noRightBorder = false,
+    customLayout,
+    isInSidebar,
+    href,
+    onKeyDown,
+    align,
+    tabIndex,
+    ...tabTitleProps
+  } = _ref;
   const isHref = !!href;
   const hasAlternateStyling = alternateStyling || isInSidebar;
   const hasFailedValidation = error || warning || info;
   const [shouldShowTooltip, setShouldShowTooltip] = (0, _react.useState)(false);
   const hasHover = (0, _react.useRef)(false);
-
   const showTooltip = () => {
     setShouldShowTooltip(true);
   };
-
   const hideTooltip = () => {
-    if (typeof ref === "object" && (ref === null || ref === void 0 ? void 0 : ref.current) !== document.activeElement && !hasHover.current) {
+    if (typeof ref === "object" && ref?.current !== document.activeElement && !hasHover.current) {
       setShouldShowTooltip(false);
     }
   };
-
   const handleKeyDown = ev => {
     ev.stopPropagation();
-
     if (href && _events.default.isEnterOrSpaceKey(ev)) {
       return window.open(href, "_blank");
     }
-
     return onKeyDown(ev);
   };
-
   const handleClick = ev => {
     ev.preventDefault();
-    const customEvent = { ...ev,
-      target: { ...ev.target,
+    const customEvent = {
+      ...ev,
+      target: {
+        ...ev.target,
         dataset: {
           tabid: dataTabId
         }
       }
     };
-
     if (href) {
       onClick(customEvent);
       return window.open(href, "_blank");
-    } // safari does not focus buttons by default
-    // istanbul ignore else (ref is always passed as an object from Tabs component, if was only added to satisfy Typescript compiler)
-
+    }
 
+    // safari does not focus buttons by default
+    // istanbul ignore else (ref is always passed as an object from Tabs component, if was only added to satisfy Typescript compiler)
     if (typeof ref === "object") {
-      var _ref$current;
-
-      ref === null || ref === void 0 ? void 0 : (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.focus();
+      ref?.current?.focus();
     }
-
     return onClick(customEvent);
   };
-
   const renderContent = () => {
     if (customLayout) {
       return /*#__PURE__*/_react.default.createElement(_tabTitle.StyledLayoutWrapper, {
         hasCustomLayout: true
       }, customLayout);
     }
-
     if (!siblings) {
       return title;
     }
-
     const titleText = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
       key: "title"
     }, title);
-
     const titleSiblings = /*#__PURE__*/_react.default.createElement(_tabTitle.StyledLayoutWrapper, {
       titlePosition: titlePosition,
       key: "title-siblings"
@@ -136,15 +110,13 @@ const TabTitle = /*#__PURE__*/_react.default.forwardRef(({
       if (! /*#__PURE__*/_react.default.isValidElement(child)) {
         return child;
       }
-
-      return /*#__PURE__*/_react.default.cloneElement(child, { ...child.props,
+      return /*#__PURE__*/_react.default.cloneElement(child, {
+        ...child.props,
         onClick: handleClick
       });
     }));
-
     return titlePosition === "before" ? [titleText, titleSiblings] : [titleSiblings, titleText];
   };
-
   const titleChildren = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_tabTitle.StyledTitleContent, {
     error: error,
     warning: warning,
@@ -178,7 +150,6 @@ const TabTitle = /*#__PURE__*/_react.default.forwardRef(({
     "data-element": "tab-selected-indicator",
     position: position
   }));
-
   const titleWrapperProps = {
     "aria-selected": isTabSelected,
     "data-element": "select-tab",
@@ -228,7 +199,6 @@ const TabTitle = /*#__PURE__*/_react.default.forwardRef(({
     }
   }, tabTitle));
 });
-
 TabTitle.propTypes = {
   "align": _propTypes.default.oneOf(["left", "right"]),
   "alternateStyling": _propTypes.default.bool,

package/lib/components/tabs/__internal__/tab-title/tab-title.style.js

@@ -3,42 +3,37 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledSelectedIndicator = exports.StyledLayoutWrapper = exports.StyledTitleContent = exports.StyledTabTitleLink = exports.StyledTabTitleButton = void 0;
-
+exports.StyledTitleContent = exports.StyledTabTitleLink = exports.StyledTabTitleButton = exports.StyledSelectedIndicator = exports.StyledLayoutWrapper = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
 var _icon = _interopRequireDefault(require("../../../icon/icon.style"));
-
 var _validationIcon = _interopRequireDefault(require("../../../../__internal__/validations/validation-icon.style"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
 const StyledTitleContent = _styledComponents.default.span`
   outline: none;
   display: inline-block;
   line-height: 20px;
   margin: 0;
 
-  ${({
-  hasCustomLayout,
-  error,
-  warning,
-  info,
-  size,
-  isTabSelected,
-  hasSiblings,
-  borders = false,
-  position = "top",
-  noLeftBorder,
-  noRightBorder,
-  hasHref,
-  alternateStyling,
-  align
-}) => (0, _styledComponents.css)`
+  ${_ref => {
+  let {
+    hasCustomLayout,
+    error,
+    warning,
+    info,
+    size,
+    isTabSelected,
+    hasSiblings,
+    borders = false,
+    position = "top",
+    noLeftBorder,
+    noRightBorder,
+    hasHref,
+    alternateStyling,
+    align
+  } = _ref;
+  return (0, _styledComponents.css)`
     text-align: ${align};
 
     ${position === "left" && (0, _styledComponents.css)`
@@ -229,7 +224,8 @@ const StyledTitleContent = _styledComponents.default.span`
         `}
       `}
     `}
-  `}
+  `;
+}}
 `;
 exports.StyledTitleContent = StyledTitleContent;
 const tabTitleStyles = (0, _styledComponents.css)`
@@ -246,35 +242,43 @@ const tabTitleStyles = (0, _styledComponents.css)`
   text-decoration: none;
   outline-offset: 0px;
   margin: 0;
-  ${({
-  position
-}) => position === "top" && "white-space: nowrap"};
-
-  ${({
-  position
-}) => (0, _styledComponents.css)`
+  ${_ref2 => {
+  let {
+    position
+  } = _ref2;
+  return position === "top" && "white-space: nowrap";
+}};
+
+  ${_ref3 => {
+  let {
+    position
+  } = _ref3;
+  return (0, _styledComponents.css)`
     ${position === "left" && (0, _styledComponents.css)`
       border-top-right-radius: var(--borderRadius000);
     `}
-  `}
+  `;
+}}
 
   a:visited {
     color: inherit;
   }
 
-  ${({
-  size,
-  position = "top",
-  borders = false,
-  noRightBorder,
-  noLeftBorder,
-  isTabSelected,
-  alternateStyling,
-  error,
-  warning,
-  info,
-  isInSidebar
-}) => (0, _styledComponents.css)`
+  ${_ref4 => {
+  let {
+    size,
+    position = "top",
+    borders = false,
+    noRightBorder,
+    noLeftBorder,
+    isTabSelected,
+    alternateStyling,
+    error,
+    warning,
+    info,
+    isInSidebar
+  } = _ref4;
+  return (0, _styledComponents.css)`
     height: ${size === "large" ? "var(--sizing600)" : "var(--sizing500)"};
 
     ${position === "top" && (0, _styledComponents.css)`
@@ -410,7 +414,8 @@ const tabTitleStyles = (0, _styledComponents.css)`
         background-color: var(--colorsActionMinor200);
       `}
     `}
-  `}
+  `;
+}}
 `;
 const StyledTabTitleButton = _styledComponents.default.button`
   ${tabTitleStyles}
@@ -421,12 +426,14 @@ const StyledTabTitleLink = _styledComponents.default.a`
 `;
 exports.StyledTabTitleLink = StyledTabTitleLink;
 const StyledLayoutWrapper = _styledComponents.default.div`
-  ${({
-  hasCustomLayout,
-  titlePosition = "before",
-  hasCustomSibling,
-  position
-}) => (0, _styledComponents.css)`
+  ${_ref5 => {
+  let {
+    hasCustomLayout,
+    titlePosition = "before",
+    hasCustomSibling,
+    position
+  } = _ref5;
+  return (0, _styledComponents.css)`
     ${hasCustomLayout && (0, _styledComponents.css)`
       flex-grow: 2;
     `}
@@ -457,16 +464,19 @@ const StyledLayoutWrapper = _styledComponents.default.div`
         }
       }
     `}
-  `}
+  `;
+}}
 `;
 exports.StyledLayoutWrapper = StyledLayoutWrapper;
 const StyledSelectedIndicator = _styledComponents.default.div`
   position: absolute;
   z-index: 1;
 
-  ${({
-  position = "top"
-}) => (0, _styledComponents.css)`
+  ${_ref6 => {
+  let {
+    position = "top"
+  } = _ref6;
+  return (0, _styledComponents.css)`
     ${position === "top" && (0, _styledComponents.css)`
       bottom: 0px;
       left: 0px;
@@ -484,6 +494,7 @@ const StyledSelectedIndicator = _styledComponents.default.div`
       height: 100%;
       width: var(--sizing025);
     `}
-  `}
+  `;
+}}
 `;
 exports.StyledSelectedIndicator = StyledSelectedIndicator;

package/lib/components/tabs/__internal__/tabs-header/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "default", {
     return _tabsHeader.default;
   }
 });
-
 var _tabsHeader = _interopRequireDefault(require("./tabs-header.component"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/components/tabs/__internal__/tabs-header/tabs-header.component.d.ts

@@ -8,5 +8,5 @@ export interface TabHeaderProps {
     children: React.ReactNode;
     align?: "left" | "right";
 }
-declare const TabsHeader: ({ align, children, position, role, extendedLine, noRightBorder, isInSidebar, }: TabHeaderProps) => JSX.Element;
+declare const TabsHeader: ({ align, children, position, role, extendedLine, noRightBorder, isInSidebar, }: TabHeaderProps) => React.JSX.Element;
 export default TabsHeader;

package/lib/components/tabs/__internal__/tabs-header/tabs-header.component.js

@@ -4,43 +4,36 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _tabsHeader = require("./tabs-header.style");
-
 var _useThrottle = _interopRequireDefault(require("../../../../hooks/__internal__/useThrottle"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
 /*  In the original prototype the tabs have shadows that fade out as you scroll horizontally.
  *  This value is the closest replication to the way that the shadow disappears.
  *  It is ultimately tied to the position of the scroll that will then fade the shadow in and out. */
 const fullOpacityThreshold = 128;
-
 const getOpacityRatio = value => value / fullOpacityThreshold;
-
-const getScrollRight = ({
-  scrollWidth,
-  clientWidth,
-  scrollLeft
-}) => scrollWidth - clientWidth - scrollLeft;
-
-const TabsHeader = ({
-  align = "left",
-  children,
-  position = "top",
-  role,
-  extendedLine,
-  noRightBorder = false,
-  isInSidebar = false
-}) => {
+const getScrollRight = _ref => {
+  let {
+    scrollWidth,
+    clientWidth,
+    scrollLeft
+  } = _ref;
+  return scrollWidth - clientWidth - scrollLeft;
+};
+const TabsHeader = _ref2 => {
+  let {
+    align = "left",
+    children,
+    position = "top",
+    role,
+    extendedLine,
+    noRightBorder = false,
+    isInSidebar = false
+  } = _ref2;
   const [leftScrollOpacity, setLeftScrollOpacity] = (0, _react.useState)(0);
   const [rightScrollOpacity, setRightScrollOpacity] = (0, _react.useState)(1);
   const ref = (0, _react.useRef)(null);
@@ -48,11 +41,9 @@ const TabsHeader = ({
   const {
     current
   } = ref;
-
   if (position === "top" && current) {
     isScrollable = current.scrollWidth > current.clientWidth;
   }
-
   const handleScroll = e => {
     const {
       scrollLeft
@@ -61,7 +52,6 @@ const TabsHeader = ({
     setLeftScrollOpacity(Math.min(getOpacityRatio(scrollLeft), 1));
     setRightScrollOpacity(Math.min(getOpacityRatio(scrollRight), 1));
   };
-
   const throttledHandleScroll = (0, _useThrottle.default)(handleScroll, 50);
   return /*#__PURE__*/_react.default.createElement(_tabsHeader.StyledTabsHeaderWrapper, {
     isInSidebar: isInSidebar,
@@ -80,15 +70,5 @@ const TabsHeader = ({
     ref: ref
   }, position === "top" ? /*#__PURE__*/_react.default.createElement(_tabsHeader.StyledTabsWrapper, null, /*#__PURE__*/_react.default.createElement(_tabsHeader.StyledTabsBottomBorderWrapper, null, /*#__PURE__*/_react.default.createElement(_tabsHeader.StyledTabsBottomBorder, null)), children) : children));
 };
-
-TabsHeader.propTypes = {
-  "align": _propTypes.default.oneOf(["left", "right"]),
-  "children": _propTypes.default.node,
-  "extendedLine": _propTypes.default.bool,
-  "isInSidebar": _propTypes.default.bool,
-  "noRightBorder": _propTypes.default.bool,
-  "position": _propTypes.default.oneOf(["left", "top"]),
-  "role": _propTypes.default.string
-};
 var _default = TabsHeader;
 exports.default = _default;