carbon-react 111.12.3 → 111.12.4

package/esm/components/hr/hr.component.js

@@ -1,8 +1,10 @@
 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); }
+
 import React from "react";
 import PropTypes from "prop-types";
 import StyledHr from "./hr.style";
 import useIsAboveBreakpoint from "../../hooks/__internal__/useIsAboveBreakpoint";
+
 const Hr = ({
   adaptiveMxBreakpoint,
   ml,
@@ -12,10 +14,12 @@ const Hr = ({
   const largeScreen = useIsAboveBreakpoint(adaptiveMxBreakpoint);
   let marginLeft = ml;
   let marginRight = mr;
+
   if (adaptiveMxBreakpoint && !largeScreen) {
     marginLeft = 0;
     marginRight = 0;
   }
+
   return /*#__PURE__*/React.createElement(StyledHr, _extends({
     "data-component": "hr",
     ml: marginLeft,
@@ -24,6 +28,7 @@ const Hr = ({
     mb: rest.mb || 3
   }, rest));
 };
+
 Hr.propTypes = {
   "adaptiveMxBreakpoint": PropTypes.number,
   "m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({

package/esm/components/i18n-provider/i18n-provider.component.js

@@ -3,12 +3,14 @@ import PropTypes from "prop-types";
 import merge from "lodash/merge";
 import Context from "../../__internal__/i18n-context";
 import enGB from "../../locales/en-gb";
+
 const I18nProvider = ({
   locale,
   children
 }) => locale ? /*#__PURE__*/React.createElement(Context.Provider, {
   value: merge({}, enGB, locale)
 }, children) : /*#__PURE__*/React.createElement(React.Fragment, null, children);
+
 I18nProvider.propTypes = {
   "children": PropTypes.node,
   "locale": PropTypes.shape({

package/esm/components/icon/icon-unicodes.js

@@ -225,8 +225,7 @@ const legacyNames = {
   in_transit: navigation.arrow_left_right_small,
   progress: misc.circle_with_dots
 };
-const iconUnicodes = {
-  ...communications,
+const iconUnicodes = { ...communications,
   ...business,
   ...primaryNavigation,
   ...actions,

package/esm/components/icon/icon.component.js

@@ -35,9 +35,11 @@ const Icon = /*#__PURE__*/React.forwardRef(({
   ...rest
 }, ref) => {
   const flipBehaviourCheck = Array.isArray(tooltipFlipOverrides) && tooltipFlipOverrides.every(override => ICON_TOOLTIP_POSITIONS.includes(override));
+
   if (tooltipFlipOverrides) {
     !flipBehaviourCheck ? process.env.NODE_ENV !== "production" ? invariant(false, `The tooltipFlipOverrides prop supplied to \`Icon\` must be an array containing some or all of ["top", "bottom", "left", "right"].`) : invariant(false) : void 0;
   }
+
   const isInteractive = !!tooltipMessage && !disabled;
   const {
     tooltipPosition: tooltipPositionFromContext,
@@ -49,22 +51,27 @@ const Icon = /*#__PURE__*/React.forwardRef(({
   const {
     isInTab
   } = useContext(TabTitleContext);
-
   /** Return Icon type with overrides */
+
   const iconType = useMemo(() => {
     // switch tweaks icon names for actual icons in the set
     switch (type) {
       case "help":
         return "question";
+
       case "maintenance":
         return "settings";
+
       case "new":
         return "gift";
+
       case "success":
         return "tick";
+
       case "messages":
       case "email":
         return "message";
+
       default:
         return type;
     }
@@ -75,6 +82,7 @@ const Icon = /*#__PURE__*/React.forwardRef(({
     if (isInTab) {
       return undefined;
     }
+
     return hasTooltip && tabIndex === undefined ? 0 : tabIndex;
   }, [isInTab, hasTooltip, tabIndex]);
   const styledIconProps = {
@@ -99,9 +107,11 @@ const Icon = /*#__PURE__*/React.forwardRef(({
     ...tagComponent("icon", rest),
     ...filterStyledSystemMarginProps(rest)
   };
+
   const shouldShowTooltip = () => {
     return tooltipVisibleFromContext !== undefined ? tooltipVisibleFromContext : tooltipVisible;
   };
+
   if (tooltipMessage) {
     const visible = disabled ? undefined : shouldShowTooltip();
     return /*#__PURE__*/React.createElement(Tooltip, {
@@ -118,6 +128,7 @@ const Icon = /*#__PURE__*/React.forwardRef(({
       target: target
     }, /*#__PURE__*/React.createElement(StyledIcon, styledIconProps));
   }
+
   return /*#__PURE__*/React.createElement(StyledIcon, styledIconProps);
 });
 Icon.propTypes = {

package/esm/components/icon/icon.style.js

@@ -7,12 +7,15 @@ import iconConfig from "./icon-config";
 import browserTypeCheck, { isSafari } from "../../__internal__/utils/helpers/browser-type-check";
 import styledColor from "../../style/utils/color";
 import getColorValue from "../../style/utils/get-color-value";
+
 function adjustIconBgSize(fontSize, bgSize) {
   if (fontSize && fontSize !== "small") {
     return iconConfig.backgroundSize[fontSize];
   }
+
   return bgSize ? iconConfig.backgroundSize[bgSize] : undefined;
 }
+
 const StyledIcon = styled.span`
   ${({
   theme,
@@ -30,6 +33,7 @@ const StyledIcon = styled.span`
   let finalHoverColor;
   let bgColor;
   let bgHoverColor;
+
   try {
     if (disabled) {
       finalColor = "var(--colorsYin030)";
@@ -47,6 +51,7 @@ const StyledIcon = styled.span`
       finalColor = "var(--colorsYin090)";
       finalHoverColor = "var(--colorsYin090)";
     }
+
     if (bg) {
       const {
         backgroundColor
@@ -64,6 +69,7 @@ const StyledIcon = styled.span`
     // eslint-disable-next-line no-console
     console.error(e);
   }
+
   return css`
       position: relative;
       color: ${finalColor};

package/esm/components/icon-button/icon-button.component.js

@@ -1,4 +1,5 @@
 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); }
+
 import React, { useState, useCallback } from "react";
 import PropTypes from "prop-types";
 import Events from "../../__internal__/utils/helpers/events";
@@ -14,6 +15,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
 }, ref) => {
   const [internalRef, setInternalRef] = useState();
   const marginProps = filterStyledSystemMarginProps(rest);
+
   const handleKeyDown = e => {
     if (Events.isEnterKey(e) || Events.isSpaceKey(e)) {
       e.preventDefault();
@@ -22,9 +24,11 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
       e.stopPropagation();
     }
   };
+
   const handleOnClick = e => {
     onAction(e);
   };
+
   const setRefs = useCallback(reference => {
     setInternalRef(reference);
     if (!ref) return;

package/esm/components/image/image.component.js

@@ -1,8 +1,10 @@
 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); }
+
 import React from "react";
 import PropTypes from "prop-types";
 import invariant from "invariant";
 import { StyledImage } from "./image.style";
+
 const Image = ({
   alt,
   src,
@@ -16,6 +18,7 @@ const Image = ({
     src: src
   }, rest), children);
 };
+
 Image.propTypes = {
   "alt": PropTypes.string,
   "background": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({

package/esm/components/image/image.style.js

@@ -5,8 +5,7 @@ const StyledImage = styled.div.attrs(({
   src,
   children,
   hidden = false
-}) => ({
-  ...(src && {
+}) => ({ ...(src && {
     as: "img"
   }),
   children: src ? undefined : children,

package/esm/components/inline-inputs/inline-inputs.component.js

@@ -5,6 +5,7 @@ import StyledInlineInputs, { StyledContentContainer, StyledInlineInput } from ".
 import createGuid from "../../__internal__/utils/helpers/guid";
 import useIsAboveBreakpoint from "../../hooks/__internal__/useIsAboveBreakpoint";
 export const InlineInputsContext = /*#__PURE__*/React.createContext({});
+
 const columnWrapper = (children, gutter, labelId) => {
   return React.Children.map(children, input => {
     return /*#__PURE__*/React.createElement(InlineInputsContext.Provider, {
@@ -17,6 +18,7 @@ const columnWrapper = (children, gutter, labelId) => {
     }, input));
   });
 };
+
 const InlineInputs = ({
   adaptiveLabelBreakpoint,
   label,
@@ -31,9 +33,11 @@ const InlineInputs = ({
   const labelId = useRef(createGuid());
   const largeScreen = useIsAboveBreakpoint(adaptiveLabelBreakpoint);
   let inlineLabel = labelInline;
+
   if (adaptiveLabelBreakpoint) {
     inlineLabel = largeScreen;
   }
+
   function renderLabel() {
     if (!label) return null;
     return /*#__PURE__*/React.createElement(Label, {
@@ -42,6 +46,7 @@ const InlineInputs = ({
       htmlFor: htmlFor
     }, label);
   }
+
   return /*#__PURE__*/React.createElement(StyledInlineInputs, {
     gutter: gutter,
     "data-component": "inline-inputs",
@@ -54,6 +59,7 @@ const InlineInputs = ({
     inputWidth: inputWidth
   }, columnWrapper(children, gutter, label ? labelId.current : undefined)));
 };
+
 InlineInputs.propTypes = {
   "adaptiveLabelBreakpoint": PropTypes.number,
   "children": PropTypes.node,

package/esm/components/link/link.component.js

@@ -1,4 +1,5 @@
 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); }
+
 import React, { useMemo } from "react";
 import PropTypes from "prop-types";
 import Icon from "../icon";
@@ -27,20 +28,23 @@ const Link = /*#__PURE__*/React.forwardRef(({
   ...rest
 }, ref) => {
   const l = useLocale();
+
   const handleOnKeyDown = ev => {
     if (onKeyDown) {
       onKeyDown(ev);
-    }
-
-    // return early if there is no onClick or there is a href prop
+    } // return early if there is no onClick or there is a href prop
     // or the event is not an enter key
+
+
     if (href || !Event.isEnterKey(ev) && !Event.isSpaceKey(ev)) {
       return;
     }
+
     if (onClick) {
       onClick(ev);
     }
   };
+
   const renderLinkIcon = (currentAlignment = "left") => {
     const hasProperAlignment = icon && iconAlign === currentAlignment;
     return hasProperAlignment ? /*#__PURE__*/React.createElement(Icon, {
@@ -52,6 +56,7 @@ const Link = /*#__PURE__*/React.forwardRef(({
       tooltipPosition: tooltipPosition
     }) : null;
   };
+
   const ariaProps = useMemo(() => {
     const restObject = rest;
     return Object.keys(restObject).filter(key => key.startsWith("aria")).reduce((obj, key) => {
@@ -71,13 +76,17 @@ const Link = /*#__PURE__*/React.forwardRef(({
     "aria-label": ariaLabel,
     ...ariaProps
   };
+
   const createLinkBasedOnType = () => {
     let type = "a";
+
     if (onClick && !href) {
       type = "button";
     }
+
     return /*#__PURE__*/React.createElement(type, componentProps, /*#__PURE__*/React.createElement(React.Fragment, null, renderLinkIcon(), /*#__PURE__*/React.createElement(StyledContent, null, isSkipLink ? l.link.skipLinkLabel() : children), renderLinkIcon("right")));
   };
+
   return /*#__PURE__*/React.createElement(StyledLink, _extends({
     isSkipLink: isSkipLink,
     disabled: disabled,

package/esm/components/link/link.style.js

@@ -5,12 +5,14 @@ const colorMap = {
   light: variant => {
     let color = "var(--colorsActionMajor500)";
     let hoverColor = "var(--colorsActionMajor600)";
+
     if (variant === "negative") {
       color = "var(--colorsSemanticNegative500)";
       hoverColor = "var(--colorsSemanticNegative600)";
     } else if (variant === "neutral") {
       color = "var(--colorsActionMajorYin090)";
     }
+
     return {
       color,
       hoverColor,
@@ -20,12 +22,14 @@ const colorMap = {
   dark: variant => {
     let color = "var(--colorsActionMajor350)";
     let hoverColor = "var(--colorsActionMajor450)";
+
     if (variant === "negative") {
       color = "var(--colorsSemanticNegative350)";
       hoverColor = "var(--colorsSemanticNegative450)";
     } else if (variant === "neutral") {
       color = "var(--colorsActionMinor100)";
     }
+
     return {
       color,
       hoverColor,

package/esm/components/link-preview/__internal__/placeholder.component.js

@@ -32,6 +32,7 @@ const Square = styled.div`
   left
 }) => left};
 `;
+
 const Placeholder = () => /*#__PURE__*/React.createElement(StyledPlaceHolder, {
   "data-component": "link preview image placeholder"
 }, /*#__PURE__*/React.createElement(Circle, null), /*#__PURE__*/React.createElement(Square, {
@@ -43,4 +44,5 @@ const Placeholder = () => /*#__PURE__*/React.createElement(StyledPlaceHolder, {
   top: "96px",
   left: "16px"
 }));
+
 export default Placeholder;

package/esm/components/link-preview/link-preview.component.js

@@ -1,4 +1,5 @@
 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); }
+
 import React from "react";
 import PropTypes from "prop-types";
 import { StyledLinkPreview, StyledPreviewWrapper, StyledCloseIconWrapper, StyledTitle, StyledDescription, StyledUrl } from "./link-preview.style";
@@ -8,6 +9,7 @@ import IconButton from "../icon-button";
 import Icon from "../icon";
 import Placeholder from "./__internal__/placeholder.component";
 const SCHEME_SEPARATOR = "://";
+
 const LinkPreview = ({
   as,
   description,
@@ -20,6 +22,7 @@ const LinkPreview = ({
 }) => {
   const loadingState = isLoading || !url;
   const canRenderAsLink = !loadingState && as !== "div";
+
   const imageProps = () => {
     return {
       src: image === null || image === void 0 ? void 0 : image.url,
@@ -27,13 +30,16 @@ const LinkPreview = ({
       height: "152px"
     };
   };
+
   const displayUrl = () => {
     if (url !== null && url !== void 0 && url.includes(SCHEME_SEPARATOR)) {
       const startIndex = url.indexOf(SCHEME_SEPARATOR) + SCHEME_SEPARATOR.length;
       return url.substring(startIndex);
     }
+
     return url;
   };
+
   const linkProps = canRenderAsLink ? {
     href: url,
     target: "_blank",
@@ -54,6 +60,7 @@ const LinkPreview = ({
     type: "close"
   }))));
 };
+
 LinkPreview.propTypes = {
   "as": PropTypes.oneOf(["a", "div"]),
   "description": PropTypes.string,

package/esm/components/loader/loader-square.style.js

@@ -9,28 +9,34 @@ const loaderAnimation = keyframes`
     transform: scale(1);
   }
 `;
+
 const getDimentions = size => {
   let width;
   let marginRight;
+
   switch (size) {
     case "medium":
       width = "16px";
       marginRight = "8px";
       break;
+
     case "large":
       width = "20px";
       marginRight = "8px";
       break;
+
     default:
       width = "12px";
       marginRight = "6px";
   }
+
   return css`
     width: ${width};
     height: ${width};
     margin-right: ${marginRight};
   `;
 };
+
 const StyledLoaderSquare = styled.div`
   ${({
   size,

package/esm/components/loader/loader.component.js

@@ -1,9 +1,11 @@
 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); }
+
 import React from "react";
 import PropTypes from "prop-types";
 import tagComponent from "../../__internal__/utils/helpers/tags/tags";
 import StyledLoader from "./loader.style";
 import StyledLoaderSquare from "./loader-square.style";
+
 const Loader = ({
   "aria-label": ariaLabel = "loader",
   isInsideButton,
@@ -28,6 +30,7 @@ const Loader = ({
     size: size
   }));
 };
+
 Loader.propTypes = {
   "aria-label": PropTypes.string,
   "isActive": PropTypes.bool,

package/esm/components/loader-bar/loader-bar.component.js

@@ -1,8 +1,10 @@
 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); }
+
 import React from "react";
 import PropTypes from "prop-types";
 import tagComponent from "../../__internal__/utils/helpers/tags/tags";
 import StyledLoaderBar, { InnerBar, StyledLoader } from "./loader-bar.style";
+
 const LoaderBar = ({
   size = "medium",
   ...rest
@@ -13,6 +15,7 @@ const LoaderBar = ({
     size: size
   })));
 };
+
 LoaderBar.propTypes = {
   "m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
     "__@toStringTag": PropTypes.string.isRequired,

package/esm/components/loader-bar/loader-bar.style.js

@@ -1,16 +1,20 @@
 import styled, { css, keyframes } from "styled-components";
 import { margin } from "styled-system";
 import baseTheme from "../../style/themes/base";
+
 function getHeight(size) {
   switch (size) {
     case "small":
       return "4px";
+
     case "large":
       return "16px";
+
     default:
       return "8px";
   }
 }
+
 const INNER_BAR_LENGTH = "128px";
 const StyledLoader = styled.div`
   ${margin}

package/esm/components/menu/__internal__/keyboard-navigation/index.js

@@ -1,32 +1,41 @@
 import Events from "../../../../__internal__/utils/helpers/events";
 import MenuItem from "../../menu-item";
+
 function characterNavigation(inputString, focusableItems, currentFocusedIndex) {
   if (!inputString) return currentFocusedIndex;
+
   const getNodeText = node => {
     if (node instanceof Array) return node.map(getNodeText).join("");
     if (typeof node === "object" && node) return getNodeText(node.props.children);
     return node;
   };
+
   const getMenuText = element => {
     if (element.submenu) {
       return element.submenu;
     }
+
     return getNodeText(element.children);
   };
+
   const itemsList = focusableItems.map(item => item && item.type === MenuItem && getMenuText(item.props) && getMenuText(item.props).toLowerCase());
   const matchingItem = itemsList.find(item => item && item.startsWith(inputString));
   const matchingIndex = itemsList.indexOf(matchingItem);
   return matchingIndex === -1 ? currentFocusedIndex : matchingIndex;
 }
+
 function menuKeyboardNavigation(event, focusableItems) {
   if (Events.isHomeKey(event)) {
     event.preventDefault();
     return 0;
   }
+
   if (Events.isEndKey(event)) {
     event.preventDefault();
     return focusableItems.length - 1;
   }
+
   return undefined;
 }
+
 export { characterNavigation, menuKeyboardNavigation };

package/esm/components/menu/__internal__/spec-helper/index.js

@@ -7,6 +7,7 @@ const events = {
     preventDefault: jest.fn()
   }
 };
+
 const openSubmenu = (wrapper, index = 0) => {
   const menuWrapper = wrapper.find(StyledSubmenuWrapper).at(index);
   const menuItem = menuWrapper.exists("a") ? menuWrapper.find("a") : menuWrapper.find("button");
@@ -16,4 +17,5 @@ const openSubmenu = (wrapper, index = 0) => {
   });
   wrapper.update();
 };
+
 export default openSubmenu;