carbon-react 119.10.0 → 119.10.2

package/esm/components/flat-table/flat-table.style.js

@@ -13,17 +13,14 @@ const HEADER_OVERLAY_INCREMENT = 3;
 const STICKY_FOOTER_OVERLAY_INCREMENT = 1;
 const ROW_HEADER_OVERLAY_INCREMENT = 5;
 const StyledTableContainer = styled.div`
-  ${_ref => {
-  let {
-    width,
-    overflowX
-  } = _ref;
-  return width && css`
+  ${({
+  width,
+  overflowX
+}) => width && css`
       width: ${width};
 
       ${overflowX && `overflow-x: ${overflowX};`}
-    `;
-}}
+    `}
 `;
 const StyledFlatTable = styled.table`
   border-collapse: separate;
@@ -36,11 +33,9 @@ const StyledFlatTable = styled.table`
     border-top-right-radius: var(--borderRadius100);
   }
 
-  ${_ref2 => {
-  let {
-    caption
-  } = _ref2;
-  return caption && css`
+  ${({
+  caption
+}) => caption && css`
       caption {
         clip: rect(1px, 1px, 1px, 1px);
         height: 1px;
@@ -49,13 +44,11 @@ const StyledFlatTable = styled.table`
         position: absolute;
         top: -99999px;
       }
-    `;
-}}
+    `}
 
-  ${_ref3 => {
-  let {
-    size
-  } = _ref3;
+  ${({
+  size
+}) => {
   const {
     height,
     fontSize,
@@ -77,11 +70,9 @@ const StyledFlatTable = styled.table`
     `;
 }}
 
-  ${_ref4 => {
-  let {
-    isZebra
-  } = _ref4;
-  return isZebra && css`
+  ${({
+  isZebra
+}) => isZebra && css`
       ${StyledFlatTableRow}:nth-child(2n) {
         ${StyledFlatTableRowHeader},
         ${StyledFlatTableCell},
@@ -96,28 +87,22 @@ const StyledFlatTable = styled.table`
           background-color: var(--colorsUtilityMajor025);
         }
       }
-    `;
-}}
+    `}
 `;
 const StyledFlatTableWrapper = styled(Box)`
   border-top-left-radius: var(--borderRadius100);
   border-top-right-radius: var(--borderRadius100);
-  ${_ref5 => {
-  let {
-    hasStickyFooter,
-    hasHorizontalScrollbar
-  } = _ref5;
-  return !hasStickyFooter && !hasHorizontalScrollbar && css`
+  ${({
+  hasStickyFooter,
+  hasHorizontalScrollbar
+}) => !hasStickyFooter && !hasHorizontalScrollbar && css`
       border-bottom-left-radius: var(--borderRadius100);
       border-bottom-right-radius: var(--borderRadius100);
-    `;
-}}
+    `}
 
-  ${_ref6 => {
-  let {
-    isInSidebar
-  } = _ref6;
-  return css`
+  ${({
+  isInSidebar
+}) => css`
       box-sizing: border-box;
 
       :focus {
@@ -133,13 +118,11 @@ const StyledFlatTableWrapper = styled(Box)`
       }
 
       ${isInSidebar ? "min-width: fit-content" : `box-shadow: inset 0px 0px 0px 1px var(--colorsUtilityMajor100)`};
-    `;
-}}
+    `}
 
-  ${_ref7 => {
-  let {
-    colorTheme
-  } = _ref7;
+  ${({
+  colorTheme
+}) => {
   switch (colorTheme) {
     case "light":
       return css`
@@ -208,11 +191,9 @@ const StyledFlatTableWrapper = styled(Box)`
   }
 }}
 
-  ${_ref8 => {
-  let {
-    isInSidebar
-  } = _ref8;
-  return isInSidebar && css`
+  ${({
+  isInSidebar
+}) => isInSidebar && css`
       ${StyledFlatTableHead} {
         background-color: var(--colorsUtilityMajor040);
       }
@@ -223,33 +204,26 @@ const StyledFlatTableWrapper = styled(Box)`
         color: var(--colorsUtilityYin090);
         border-bottom-color: var(--colorsUtilityMajor100);
       }
-    `;
-}}
+    `}
 
-  ${_ref9 => {
-  let {
-    hasStickyHead,
-    theme
-  } = _ref9;
-  return hasStickyHead && css`
+  ${({
+  hasStickyHead,
+  theme
+}) => hasStickyHead && css`
       ${StyledFlatTableHead} {
         position: sticky;
         top: 0;
         left: 0;
         z-index: ${theme.zIndex.overlay + ROW_HEADER_OVERLAY_INCREMENT};
       }
-    `;
-}}
+    `}
 
   ${StyledFlatTableHead} ${StyledFlatTableRowHeader},
   ${StyledFlatTableHeader}.isSticky,
   ${StyledFlatTableHead} ${StyledFlatTableCheckbox}.isSticky {
-    z-index: ${_ref10 => {
-  let {
-    theme
-  } = _ref10;
-  return theme.zIndex.overlay + ROW_HEADER_OVERLAY_INCREMENT;
-}};
+    z-index: ${({
+  theme
+}) => theme.zIndex.overlay + ROW_HEADER_OVERLAY_INCREMENT};
   }
 
   thead ${StyledFlatTableHeader}.isSticky, ${StyledFlatTableCheckbox}.isSticky {
@@ -257,12 +231,9 @@ const StyledFlatTableWrapper = styled(Box)`
   }
 
   ${StyledFlatTableHeader}, ${StyledFlatTableCheckbox} {
-    z-index: ${_ref11 => {
-  let {
-    theme
-  } = _ref11;
-  return theme.zIndex.overlay + HEADER_OVERLAY_INCREMENT;
-}};
+    z-index: ${({
+  theme
+}) => theme.zIndex.overlay + HEADER_OVERLAY_INCREMENT};
   }
 
   thead {
@@ -270,16 +241,13 @@ const StyledFlatTableWrapper = styled(Box)`
       th:first-of-type {
         border-top-left-radius: var(--borderRadius100);
       }
-      ${_ref12 => {
-  let {
-    hasVerticalScrollbar
-  } = _ref12;
-  return !hasVerticalScrollbar && css`
+      ${({
+  hasVerticalScrollbar
+}) => !hasVerticalScrollbar && css`
           th:last-of-type {
             border-top-right-radius: var(--borderRadius100);
           }
-        `;
-}}
+        `}
     }
   }
 
@@ -288,36 +256,28 @@ const StyledFlatTableWrapper = styled(Box)`
     ${StyledFlatTableCell}.isSticky,
     tbody
     ${StyledFlatTableCheckbox}.isSticky {
-    z-index: ${_ref13 => {
-  let {
-    theme
-  } = _ref13;
-  return theme.zIndex.overlay;
-}};
+    z-index: ${({
+  theme
+}) => theme.zIndex.overlay};
   }
 
-  ${_ref14 => {
-  let {
-    footer
-  } = _ref14;
-  return footer && css`
+  ${({
+  footer
+}) => footer && css`
     tr:last-child:focus {
       :after {
         border-bottom-left-radius: var(--borderRadius000);
         border-bottom-right-radius: var(--borderRadius000);
       }
-  `;
-}}
+  `}
 
-  ${_ref15 => {
-  let {
-    footer,
-    firstColRowSpanIndex,
-    lastColRowSpanIndex,
-    hasHorizontalScrollbar,
-    hasVerticalScrollbar
-  } = _ref15;
-  return !footer && css`
+  ${({
+  footer,
+  firstColRowSpanIndex,
+  lastColRowSpanIndex,
+  hasHorizontalScrollbar,
+  hasVerticalScrollbar
+}) => !footer && css`
       tbody {
         ${firstColRowSpanIndex >= 0 && css`
           ${StyledFlatTableRow}:nth-of-type(${firstColRowSpanIndex + 1}) {
@@ -352,19 +312,16 @@ const StyledFlatTableWrapper = styled(Box)`
           `}
         }
       }
-    `;
-}}
+    `}
 `;
 StyledFlatTableWrapper.defaultProps = {
   theme: baseTheme
 };
 const StyledFlatTableFooter = styled.div`
-  ${_ref16 => {
-  let {
-    hasStickyFooter,
-    theme
-  } = _ref16;
-  return hasStickyFooter && css`
+  ${({
+  hasStickyFooter,
+  theme
+}) => hasStickyFooter && css`
       position: sticky;
       bottom: 0px;
       z-index: ${theme.zIndex.overlay + STICKY_FOOTER_OVERLAY_INCREMENT};
@@ -373,8 +330,7 @@ const StyledFlatTableFooter = styled.div`
         border-bottom-left-radius: var(--borderRadius000);
         border-bottom-right-radius: var(--borderRadius000);
       }
-    `;
-}}
+    `}
 `;
 StyledFlatTableFooter.defaultProps = {
   theme: baseTheme

package/esm/components/flat-table/sort/sort.component.js

@@ -4,12 +4,11 @@ import Event from "../../../__internal__/utils/helpers/events";
 import Icon from "../../icon";
 import { StyledSort, StyledSpaceHolder } from "./sort.style";
 import guid from "../../../__internal__/utils/helpers/guid";
-const Sort = _ref => {
-  let {
-    children,
-    onClick,
-    sortType
-  } = _ref;
+const Sort = ({
+  children,
+  onClick,
+  sortType
+}) => {
   const id = useRef(guid());
   const onKeyDown = e => {
     if (Event.isEnterOrSpaceKey(e)) {

package/esm/components/form/__internal__/form-summary.component.js

@@ -4,12 +4,11 @@ import PropTypes from "prop-types";
 import { StyledFormSummary, StyledInternalSummary, StyledMessagePrefix } from "./form-summary.style";
 import Icon from "../../icon";
 import useLocale from "../../../hooks/__internal__/useLocale";
-export const Summary = _ref => {
-  let {
-    type,
-    errorCount = 0,
-    warningCount = 0
-  } = _ref;
+export const Summary = ({
+  type,
+  errorCount = 0,
+  warningCount = 0
+}) => {
   const l = useLocale();
   const messages = {
     errorCount,
@@ -26,11 +25,10 @@ export const Summary = _ref => {
   }
   return null;
 };
-const FormSummary = _ref2 => {
-  let {
-    fullWidth,
-    ...props
-  } = _ref2;
+const FormSummary = ({
+  fullWidth,
+  ...props
+}) => {
   return /*#__PURE__*/React.createElement(StyledFormSummary, {
     showSummary: !!(props.errorCount || props.warningCount),
     "data-element": "form-summary",

package/esm/components/form/__internal__/form-summary.style.js

@@ -10,26 +10,20 @@ export const StyledFormSummary = styled.div`
   padding: 8px;
   white-space: nowrap;
 
-  ${_ref => {
-  let {
-    fullWidth
-  } = _ref;
-  return fullWidth && css`
+  ${({
+  fullWidth
+}) => fullWidth && css`
       display: flex;
       flex-wrap: wrap;
       width: 100%;
       justify-content: flex-start;
-    `;
-}}
+    `}
 
-  ${_ref2 => {
-  let {
-    showSummary
-  } = _ref2;
-  return showSummary && css`
+  ${({
+  showSummary
+}) => showSummary && css`
       background-color: var(--colorsUtilityMajor025);
-    `;
-}}
+    `}
   ${StyledButton} {
     margin-right: 0;
   }
@@ -47,40 +41,28 @@ export const StyledInternalSummary = styled.div`
   &:last-of-type {
     margin-right: 16px;
   }
-  ${_ref3 => {
-  let {
-    type
-  } = _ref3;
-  return type === "warning" && css`
+  ${({
+  type
+}) => type === "warning" && css`
       color: var(--colorsSemanticCaution650);
-    `;
-}}
-  ${_ref4 => {
-  let {
-    type
-  } = _ref4;
-  return type === "error" && css`
+    `}
+  ${({
+  type
+}) => type === "error" && css`
       color: var(--colorsSemanticNegative600);
-    `;
-}}
+    `}
 
   ${StyledIcon} {
     margin-right: 4px;
-    ${_ref5 => {
-  let {
-    type
-  } = _ref5;
-  return type === "warning" && css`
+    ${({
+  type
+}) => type === "warning" && css`
         color: var(--colorsSemanticCaution650);
-      `;
-}}
-    ${_ref6 => {
-  let {
-    type
-  } = _ref6;
-  return type === "error" && css`
+      `}
+    ${({
+  type
+}) => type === "error" && css`
         color: var(--colorsSemanticNegative600);
-      `;
-}}
+      `}
   }
 `;

package/esm/components/form/form.component.js

@@ -7,24 +7,23 @@ import FormSummary from "./__internal__/form-summary.component";
 import { StyledForm, StyledFormContent, StyledFormFooter, StyledLeftButtons, StyledRightButtons, StyledFullWidthButtons } from "./form.style";
 import { formSpacing } from "./form.config";
 import FormSpacingProvider from "../../__internal__/form-spacing-provider";
-export const Form = _ref => {
-  let {
-    children,
-    saveButton,
-    leftSideButtons,
-    rightSideButtons,
-    errorCount,
-    warningCount,
-    onSubmit,
-    buttonAlignment = "right",
-    stickyFooter,
-    fieldSpacing = 3,
-    noValidate = true,
-    height,
-    fullWidthButtons = false,
-    footerPadding = {},
-    ...rest
-  } = _ref;
+export const Form = ({
+  children,
+  saveButton,
+  leftSideButtons,
+  rightSideButtons,
+  errorCount,
+  warningCount,
+  onSubmit,
+  buttonAlignment = "right",
+  stickyFooter,
+  fieldSpacing = 3,
+  noValidate = true,
+  height,
+  fullWidthButtons = false,
+  footerPadding = {},
+  ...rest
+}) => {
   const {
     isInSidebar
   } = useContext(SidebarContext);

package/esm/components/form/form.style.js

@@ -6,39 +6,31 @@ import baseTheme from "../../style/themes/base";
 import StyledSearch from "../search/search.style";
 import StyledTextarea from "../textarea/textarea.style";
 export const StyledFormContent = styled.div`
-  ${_ref => {
-  let {
-    stickyFooter,
-    isInModal
-  } = _ref;
-  return css`
+  ${({
+  stickyFooter,
+  isInModal
+}) => css`
     ${stickyFooter && css`
       overflow-y: ${isInModal ? "auto" : "inherit"};
       flex: 1;
     `}
-  `;
-}}
+  `}
 `;
 export const StyledFormFooter = styled.div`
   align-items: center;
   display: flex;
 
-  ${_ref2 => {
-  let {
-    buttonAlignment
-  } = _ref2;
-  return buttonAlignment === "right" && css`
+  ${({
+  buttonAlignment
+}) => buttonAlignment === "right" && css`
       justify-content: flex-end;
-    `;
-}}
+    `}
 
-  ${_ref3 => {
-  let {
-    stickyFooter,
-    fullWidthButtons,
-    isInModal
-  } = _ref3;
-  return css`
+  ${({
+  stickyFooter,
+  fullWidthButtons,
+  isInModal
+}) => css`
     ${!stickyFooter && css`
       margin-top: 48px;
     `}
@@ -60,8 +52,7 @@ export const StyledFormFooter = styled.div`
       flex-direction: column;
       align-items: stretch;
     `}
-  `;
-}}
+  `}
 
   ${padding}
 `;
@@ -74,14 +65,11 @@ const HEIGHT_SPACING = 216;
 export const StyledForm = styled.form`
   ${space}
 
-  ${_ref4 => {
-  let {
-    height
-  } = _ref4;
-  return height && css`
+  ${({
+  height
+}) => height && css`
       height: ${height};
-    `;
-}}
+    `}
     
     ${StyledTextarea}
       ${StyledFormField} {
@@ -92,13 +80,11 @@ export const StyledForm = styled.form`
     margin-bottom: 0px;
   }
 
-  ${_ref5 => {
-  let {
-    stickyFooter,
-    isInModal,
-    isInSidebar
-  } = _ref5;
-  return stickyFooter && css`
+  ${({
+  stickyFooter,
+  isInModal,
+  isInSidebar
+}) => stickyFooter && css`
       display: flex;
       flex-direction: column;
       position: relative;
@@ -110,23 +96,16 @@ export const StyledForm = styled.form`
       ${isInSidebar && css`
         min-height: 100%;
       `}
-    `;
-}}
+    `}
 `;
 export const StyledRightButtons = styled.div`
   display: flex;
-  ${_ref6 => {
-  let {
-    fullWidthButtons
-  } = _ref6;
-  return fullWidthButtons ? `margin-left: 0px;` : `margin-left: 16px;`;
-}}
-  ${_ref7 => {
-  let {
-    buttonAlignment
-  } = _ref7;
-  return buttonAlignment === "left" && "flex-grow: 1";
-}};
+  ${({
+  fullWidthButtons
+}) => fullWidthButtons ? `margin-left: 0px;` : `margin-left: 16px;`}
+  ${({
+  buttonAlignment
+}) => buttonAlignment === "left" && "flex-grow: 1"};
 
   ${StyledButton}:last-child {
     margin-right: 0;
@@ -139,18 +118,12 @@ export const StyledFullWidthButtons = styled.div`
 export const StyledLeftButtons = styled.div`
   display: flex;
   justify-content: flex-end;
-  ${_ref8 => {
-  let {
-    fullWidthButtons
-  } = _ref8;
-  return fullWidthButtons ? `margin-right: 0px;` : `margin-right: 16px;`;
-}}
-  ${_ref9 => {
-  let {
-    buttonAlignment
-  } = _ref9;
-  return buttonAlignment === "right" && "flex-grow: 1";
-}};
+  ${({
+  fullWidthButtons
+}) => fullWidthButtons ? `margin-right: 0px;` : `margin-right: 16px;`}
+  ${({
+  buttonAlignment
+}) => buttonAlignment === "right" && "flex-grow: 1"};
 
   ${StyledButton}:last-child {
     margin-right: 0;

package/esm/components/global-header/global-header.component.js

@@ -24,12 +24,11 @@ const StyledLogo = styled(Box)`
     margin-left: var(--spacing500);
   }
 `;
-const GlobalHeader = _ref => {
-  let {
-    children,
-    logo,
-    ...rest
-  } = _ref;
+const GlobalHeader = ({
+  children,
+  logo,
+  ...rest
+}) => {
   return /*#__PURE__*/React.createElement(NavigationBar, _extends({
     isGlobal: true
   }, rest), logo && /*#__PURE__*/React.createElement(StyledLogo, {