carbon-react 119.10.0 → 119.10.2

package/esm/components/checkbox/checkbox.component.js

@@ -12,42 +12,41 @@ import useFormSpacing from "../../hooks/__internal__/useFormSpacing";
 import { NewValidationContext } from "../carbon-provider/carbon-provider.component";
 let deprecateInputRefWarnTriggered = false;
 let deprecateUncontrolledWarnTriggered = false;
-const Checkbox = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    "aria-labelledby": ariaLabelledBy,
-    id,
-    label,
-    onChange,
-    name,
-    /* FIXME: FE-4102 */
-    onClick,
-    onBlur,
-    onFocus,
-    value,
-    fieldHelp,
-    autoFocus,
-    labelHelp,
-    labelSpacing = 1,
-    labelWidth,
-    adaptiveSpacingBreakpoint,
-    required,
-    error,
-    warning,
-    info,
-    fieldHelpInline,
-    reverse = false,
-    checked,
-    disabled,
-    inputWidth,
-    size,
-    tooltipPosition,
-    "data-component": dataComponent = "checkbox",
-    "data-element": dataElement,
-    "data-role": dataRole,
-    helpAriaLabel,
-    inputRef,
-    ...rest
-  } = _ref;
+const Checkbox = /*#__PURE__*/React.forwardRef(({
+  "aria-labelledby": ariaLabelledBy,
+  id,
+  label,
+  onChange,
+  name,
+  /* FIXME: FE-4102 */
+  onClick,
+  onBlur,
+  onFocus,
+  value,
+  fieldHelp,
+  autoFocus,
+  labelHelp,
+  labelSpacing = 1,
+  labelWidth,
+  adaptiveSpacingBreakpoint,
+  required,
+  error,
+  warning,
+  info,
+  fieldHelpInline,
+  reverse = false,
+  checked,
+  disabled,
+  inputWidth,
+  size,
+  tooltipPosition,
+  "data-component": dataComponent = "checkbox",
+  "data-element": dataElement,
+  "data-role": dataRole,
+  helpAriaLabel,
+  inputRef,
+  ...rest
+}, ref) => {
   const {
     validationRedesignOptIn
   } = useContext(NewValidationContext);

package/esm/components/checkbox/checkbox.style.js

@@ -9,21 +9,19 @@ import StyledValidationIcon from "../../__internal__/validations/validation-icon
 import baseTheme from "../../style/themes/base";
 const StyledCheckbox = styled.div`
   ${margin}
-  ${_ref => {
-  let {
-    disabled,
-    error,
-    warning,
-    info,
-    fieldHelpInline,
-    labelSpacing,
-    inputWidth,
-    reverse,
-    size,
-    adaptiveSpacingSmallScreen,
-    applyNewValidation
-  } = _ref;
-  return css`
+  ${({
+  disabled,
+  error,
+  warning,
+  info,
+  fieldHelpInline,
+  labelSpacing,
+  inputWidth,
+  reverse,
+  size,
+  adaptiveSpacingSmallScreen,
+  applyNewValidation
+}) => css`
     ${adaptiveSpacingSmallScreen && "margin-left: 0;"}
 
     ${StyledCheckableInput} {
@@ -177,8 +175,7 @@ const StyledCheckbox = styled.div`
         }
       `}
     `}
-  `;
-}}
+  `}
 `;
 StyledCheckbox.defaultProps = {
   theme: baseTheme

package/esm/components/confirm/confirm.component.js

@@ -9,35 +9,34 @@ import Button from "../button/button.component";
 import Icon from "../icon";
 import Loader from "../loader";
 import useLocale from "../../hooks/__internal__/useLocale";
-export const Confirm = _ref => {
-  let {
-    "aria-labelledby": ariaLabelledBy,
-    "aria-describedby": ariaDescribedBy,
-    "aria-label": ariaLabel,
-    open,
-    children,
-    cancelButtonDestructive = false,
-    confirmButtonDestructive = false,
-    cancelButtonType = "secondary",
-    confirmButtonType = "primary",
-    cancelButtonIconType,
-    cancelButtonIconPosition,
-    confirmButtonIconType,
-    confirmButtonIconPosition,
-    cancelLabel,
-    onCancel,
-    disableCancel,
-    onConfirm,
-    isLoadingConfirm,
-    disableConfirm,
-    confirmLabel,
-    iconType,
-    subtitle,
-    title,
-    size = "extra-small",
-    showCloseIcon = false,
-    ...rest
-  } = _ref;
+export const Confirm = ({
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-label": ariaLabel,
+  open,
+  children,
+  cancelButtonDestructive = false,
+  confirmButtonDestructive = false,
+  cancelButtonType = "secondary",
+  confirmButtonType = "primary",
+  cancelButtonIconType,
+  cancelButtonIconPosition,
+  confirmButtonIconType,
+  confirmButtonIconPosition,
+  cancelLabel,
+  onCancel,
+  disableCancel,
+  onConfirm,
+  isLoadingConfirm,
+  disableConfirm,
+  confirmLabel,
+  iconType,
+  subtitle,
+  title,
+  size = "extra-small",
+  showCloseIcon = false,
+  ...rest
+}) => {
   const l = useLocale();
   const {
     current: titleId

package/esm/components/confirm/confirm.style.js

@@ -17,21 +17,15 @@ export const StyledConfirmHeading = styled.div`
   ${StyledIcon} {
     margin-right: 16px;
     margin-bottom: 20px;
-    ${_ref => {
-  let {
-    type
-  } = _ref;
-  return type === "warning" && css`
+    ${({
+  type
+}) => type === "warning" && css`
         color: var(--colorsSemanticCaution500);
-      `;
-}}
-    ${_ref2 => {
-  let {
-    type
-  } = _ref2;
-  return type === "error" && css`
+      `}
+    ${({
+  type
+}) => type === "error" && css`
         color: var(--colorsSemanticNegative500);
-      `;
-}}
+      `}
   }
 `;

package/esm/components/content/content.component.js

@@ -2,17 +2,16 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 import React from "react";
 import PropTypes from "prop-types";
 import { StyledContent, StyledContentTitle, StyledContentBody } from "./content.style";
-export const Content = _ref => {
-  let {
-    variant = "primary",
-    children,
-    title,
-    inline = false,
-    align = "left",
-    titleWidth,
-    bodyFullWidth = false,
-    ...rest
-  } = _ref;
+export const Content = ({
+  variant = "primary",
+  children,
+  title,
+  inline = false,
+  align = "left",
+  titleWidth,
+  bodyFullWidth = false,
+  ...rest
+}) => {
   return /*#__PURE__*/React.createElement(StyledContent, _extends({
     align: align,
     bodyFullWidth: bodyFullWidth

package/esm/components/content/content.style.js

@@ -2,12 +2,10 @@ import styled, { css } from "styled-components";
 import { margin } from "styled-system";
 import { baseTheme } from "../../style/themes";
 const StyledContent = styled.div`
-  ${_ref => {
-  let {
-    bodyFullWidth,
-    align
-  } = _ref;
-  return css`
+  ${({
+  bodyFullWidth,
+  align
+}) => css`
     ${margin}
 
     & + & {
@@ -20,20 +18,18 @@ const StyledContent = styled.div`
     ${bodyFullWidth && css`
       text-align: left;
     `}
-  `;
-}}
+  `}
 `;
 StyledContent.defaultProps = {
   theme: baseTheme
 };
 const StyledContentTitle = styled.div`
-  ${_ref2 => {
-  let {
-    titleWidth,
-    inline,
-    variant,
-    align
-  } = _ref2;
+  ${({
+  titleWidth,
+  inline,
+  variant,
+  align
+}) => {
   return css`
       display: ${inline ? "inline-block" : "block"};
       font-weight: bold;
@@ -53,13 +49,12 @@ const StyledContentTitle = styled.div`
 }};
 `;
 const StyledContentBody = styled.div`
-  ${_ref3 => {
-  let {
-    bodyFullWidth,
-    titleWidth,
-    inline,
-    align
-  } = _ref3;
+  ${({
+  bodyFullWidth,
+  titleWidth,
+  inline,
+  align
+}) => {
   return css`
       display: ${inline ? "inline-block" : "block"};
       margin-top: 2px;

package/esm/components/date/__internal__/date-formats/index.js

@@ -31,11 +31,10 @@ const getOutputFormatForLocale = localeCode => {
   };
   const formatter = new Intl.DateTimeFormat(localeCode);
   let separator = "";
-  const format = formatter.formatToParts(new Date()).map(_ref => {
-    let {
-      type,
-      value
-    } = _ref;
+  const format = formatter.formatToParts(new Date()).map(({
+    type,
+    value
+  }) => {
     if (["day", "month", "year"].includes(type)) {
       return formatMap[type];
     }
@@ -71,10 +70,9 @@ const getTrailingChar = format => {
   const lastChar = format.split("").pop();
   return ["y", "M", "d"].includes(lastChar) ? "" : lastChar;
 };
-const getFormatData = _ref2 => {
-  let {
-    code = "en-GB"
-  } = _ref2;
+const getFormatData = ({
+  code = "en-GB"
+}) => {
   if (["en-CA", "en-US"].includes(code)) {
     const format = "MM/dd/yyyy";
     const formats = getInputFormatsArrayForLocale(format);

package/esm/components/date/__internal__/date-picker/date-picker.component.js

@@ -15,18 +15,17 @@ import StyledDayPicker from "./day-picker.style";
 const popoverMiddleware = [offset(3), flip({
   fallbackStrategy: "initialPlacement"
 })];
-const DatePicker = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    inputElement,
-    minDate,
-    maxDate,
-    selectedDays,
-    disablePortal,
-    onDayClick,
-    pickerMouseDown,
-    pickerProps,
-    open
-  } = _ref;
+const DatePicker = /*#__PURE__*/React.forwardRef(({
+  inputElement,
+  minDate,
+  maxDate,
+  selectedDays,
+  disablePortal,
+  onDayClick,
+  pickerMouseDown,
+  pickerProps,
+  open
+}, ref) => {
   const l = useLocale();
   const {
     localize,

package/esm/components/date/__internal__/date-picker/day-picker.style.js

@@ -181,12 +181,9 @@ const StyledDayPicker = styled.div`
   position: absolute;
   height: 346px;
   width: 352px;
-  z-index: ${_ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.zIndex.popover;
-}};
+  z-index: ${({
+  theme
+}) => theme.zIndex.popover};
 
   .DayPicker {
     z-index: 1000;

package/esm/components/date/__internal__/navbar/navbar.component.js

@@ -3,22 +3,19 @@ import PropTypes from "prop-types";
 import StyledButton from "./button.style";
 import StyledNavbar from "./navbar.style";
 import Icon from "../../../icon";
-export const Navbar = _ref => {
-  let {
-    onPreviousClick,
-    onNextClick,
-    className
-  } = _ref;
-  return /*#__PURE__*/React.createElement(StyledNavbar, {
-    className: className
-  }, /*#__PURE__*/React.createElement(StyledButton, {
-    onClick: () => onPreviousClick?.()
-  }, /*#__PURE__*/React.createElement(Icon, {
-    type: "chevron_left"
-  })), /*#__PURE__*/React.createElement(StyledButton, {
-    onClick: () => onNextClick?.()
-  }, /*#__PURE__*/React.createElement(Icon, {
-    type: "chevron_right"
-  })));
-};
+export const Navbar = ({
+  onPreviousClick,
+  onNextClick,
+  className
+}) => /*#__PURE__*/React.createElement(StyledNavbar, {
+  className: className
+}, /*#__PURE__*/React.createElement(StyledButton, {
+  onClick: () => onPreviousClick?.()
+}, /*#__PURE__*/React.createElement(Icon, {
+  type: "chevron_left"
+})), /*#__PURE__*/React.createElement(StyledButton, {
+  onClick: () => onNextClick?.()
+}, /*#__PURE__*/React.createElement(Icon, {
+  type: "chevron_right"
+})));
 export default Navbar;

package/esm/components/date/__internal__/utils.js

@@ -124,9 +124,7 @@ export function checkISOFormatAndLength(value) {
 /**
  * Returns the disabled array of days specified by props maxDate and minDate
  */
-export function getDisabledDays() {
-  let minDate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
-  let maxDate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+export function getDisabledDays(minDate = "", maxDate = "") {
   const days = [];
   if (!minDate && !maxDate) {
     return undefined;

package/esm/components/date/__internal__/weekday/weekday.component.js

@@ -3,18 +3,15 @@ import React from "react";
 import PropTypes from "prop-types";
 import StyledWeekday from "./weekday.style";
 import StyledAbbr from "./abbr.style";
-export const Weekday = _ref => {
-  let {
-    className,
-    title,
-    children,
-    ...props
-  } = _ref;
-  return /*#__PURE__*/React.createElement(StyledWeekday, _extends({
-    className: className,
-    role: "columnheader"
-  }, props), /*#__PURE__*/React.createElement(StyledAbbr, {
-    title: title
-  }, children));
-};
+export const Weekday = ({
+  className,
+  title,
+  children,
+  ...props
+}) => /*#__PURE__*/React.createElement(StyledWeekday, _extends({
+  className: className,
+  role: "columnheader"
+}, props), /*#__PURE__*/React.createElement(StyledAbbr, {
+  title: title
+}, children));
 export default Weekday;

package/esm/components/date/date.component.js

@@ -14,37 +14,36 @@ import useClickAwayListener from "../../hooks/__internal__/useClickAwayListener"
 import Logger from "../../__internal__/utils/logger";
 import useFormSpacing from "../../hooks/__internal__/useFormSpacing";
 let deprecateInputRefWarnTriggered = false;
-const DateInput = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    adaptiveLabelBreakpoint,
-    allowEmptyValue,
-    autoFocus,
-    "data-component": dataComponent,
-    "data-element": dataElement,
-    "data-role": dataRole,
-    disabled,
-    disablePortal = false,
-    helpAriaLabel,
-    labelInline,
-    minDate,
-    maxDate,
-    onBlur,
-    onChange,
-    onClick,
-    onFocus,
-    onKeyDown,
-    pickerProps = {},
-    readOnly,
-    size = "medium",
-    tooltipPosition,
-    value,
-    inputRef,
-    inputWidth,
-    labelWidth,
-    maxWidth,
-    inputName,
-    ...rest
-  } = _ref;
+const DateInput = /*#__PURE__*/React.forwardRef(({
+  adaptiveLabelBreakpoint,
+  allowEmptyValue,
+  autoFocus,
+  "data-component": dataComponent,
+  "data-element": dataElement,
+  "data-role": dataRole,
+  disabled,
+  disablePortal = false,
+  helpAriaLabel,
+  labelInline,
+  minDate,
+  maxDate,
+  onBlur,
+  onChange,
+  onClick,
+  onFocus,
+  onKeyDown,
+  pickerProps = {},
+  readOnly,
+  size = "medium",
+  tooltipPosition,
+  value,
+  inputRef,
+  inputWidth,
+  labelWidth,
+  maxWidth,
+  inputName,
+  ...rest
+}, ref) => {
   const wrapperRef = useRef(null);
   const parentRef = useRef(null);
   const internalInputRef = useRef(null);

package/esm/components/date/date.style.js

@@ -16,28 +16,23 @@ const StyledDateInput = styled.div`
 
   & ${StyledInputPresentation} {
     flex: none;
-    width: ${_ref => {
-  let {
-    inputWidth,
-    maxWidth,
-    size = "medium"
-  } = _ref;
-  return maxWidth || inputWidth ? "" : datePickerWidth[size];
-}};
+    width: ${({
+  inputWidth,
+  maxWidth,
+  size = "medium"
+}) => maxWidth || inputWidth ? "" : datePickerWidth[size]};
 
     ${StyledInput} {
       margin-right: -8px;
     }
   }
 
-  ${_ref2 => {
-  let {
-    applyDateRangeStyling,
-    maxWidth,
-    size = "medium",
-    labelInline
-  } = _ref2;
-  return applyDateRangeStyling && !labelInline && css`
+  ${({
+  applyDateRangeStyling,
+  maxWidth,
+  size = "medium",
+  labelInline
+}) => applyDateRangeStyling && !labelInline && css`
       ${FieldLineStyle} {
         max-width: ${maxWidth || datePickerWidth[size]}};
       }
@@ -45,8 +40,7 @@ const StyledDateInput = styled.div`
       ${StyledValidationMessage}, ${StyledLabel} {
         overflow-wrap: anywhere;
       }
-    `;
-}}
+    `}
 `;
 StyledDateInput.defaultProps = {
   theme: baseTheme

package/esm/components/date-range/date-range.component.js

@@ -11,22 +11,21 @@ import useLocale from "../../hooks/__internal__/useLocale";
 import usePrevious from "../../hooks/__internal__/usePrevious";
 import getFormatData from "../date/__internal__/date-formats";
 import DateRangeContext from "./date-range.context";
-export const DateRange = _ref => {
-  let {
-    endDateProps = {},
-    id,
-    labelsInline,
-    name,
-    onBlur,
-    onChange,
-    startDateProps = {},
-    tooltipPosition,
-    validationOnLabel,
-    value,
-    startRef,
-    endRef,
-    ...rest
-  } = _ref;
+export const DateRange = ({
+  endDateProps = {},
+  id,
+  labelsInline,
+  name,
+  onBlur,
+  onChange,
+  startDateProps = {},
+  tooltipPosition,
+  validationOnLabel,
+  value,
+  startRef,
+  endRef,
+  ...rest
+}) => {
   const l = useLocale();
   const {
     dateFnsLocale

package/esm/components/date-range/date-range.style.js

@@ -10,12 +10,9 @@ const StyledDateRange = styled.div`
   & ${StyledDateInput} {
     width: auto;
     display: inline-block;
-    vertical-align: ${_ref => {
-  let {
-    labelsInline
-  } = _ref;
-  return labelsInline ? "top" : "bottom";
-}};
+    vertical-align: ${({
+  labelsInline
+}) => labelsInline ? "top" : "bottom"};
   }
 
   & ${StyledDateInput}:first-of-type {