carbon-react 119.9.3 → 119.10.1

package/esm/__internal__/character-count/character-count.component.js

@@ -2,13 +2,12 @@ import React from "react";
 import PropTypes from "prop-types";
 import StyledCharacterCount from "./character-count.style";
 import useLocale from "../../hooks/__internal__/useLocale";
-const CharacterCount = _ref => {
-  let {
-    value,
-    limit,
-    isOverLimit,
-    "data-element": dataElement
-  } = _ref;
+const CharacterCount = ({
+  value,
+  limit,
+  isOverLimit,
+  "data-element": dataElement
+}) => {
   const limitMinusValue = +limit - +value;
   const valueMinusLimit = +value - +limit;
   const l = useLocale();

package/esm/__internal__/character-count/character-count.style.js

@@ -5,21 +5,15 @@ const StyledCharacterCount = styled.div`
   font-size: 12px;
   margin-top: 4px;
   margin-bottom: 4px;
-  color: ${_ref => {
-  let {
-    isOverLimit
-  } = _ref;
-  return isOverLimit ? "var(--colorsSemanticNegative500)" : "var(--colorsUtilityYin055)";
-}};
+  color: ${({
+  isOverLimit
+}) => isOverLimit ? "var(--colorsSemanticNegative500)" : "var(--colorsUtilityYin055)"};
 
-  ${_ref2 => {
-  let {
-    isOverLimit
-  } = _ref2;
-  return isOverLimit && css`
+  ${({
+  isOverLimit
+}) => isOverLimit && css`
       font-weight: 700;
-    `;
-}}
+    `}
 `;
 StyledCharacterCount.defaultProps = {
   theme: baseTheme

package/esm/__internal__/checkable-input/checkable-input.component.js

@@ -7,38 +7,37 @@ import FormField from "../form-field";
 import HiddenCheckableInput from "./hidden-checkable-input.component";
 import guid from "../utils/helpers/guid";
 import useInputAccessibility from "../../hooks/__internal__/useInputAccessibility";
-const CheckableInput = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    ariaLabelledBy,
-    autoFocus,
-    checked,
-    children,
-    disabled,
-    loading,
-    error,
-    fieldHelp,
-    fieldHelpInline,
-    info,
-    id: inputId,
-    type,
-    value,
-    inputWidth,
-    label,
-    labelAlign,
-    labelHelp,
-    labelInline = true,
-    labelSpacing = 1,
-    labelWidth,
-    name,
-    onBlur,
-    onChange,
-    onFocus,
-    required,
-    reverse = false,
-    validationOnLabel,
-    warning,
-    ...props
-  } = _ref;
+const CheckableInput = /*#__PURE__*/React.forwardRef(({
+  ariaLabelledBy,
+  autoFocus,
+  checked,
+  children,
+  disabled,
+  loading,
+  error,
+  fieldHelp,
+  fieldHelpInline,
+  info,
+  id: inputId,
+  type,
+  value,
+  inputWidth,
+  label,
+  labelAlign,
+  labelHelp,
+  labelInline = true,
+  labelSpacing = 1,
+  labelWidth,
+  name,
+  onBlur,
+  onChange,
+  onFocus,
+  required,
+  reverse = false,
+  validationOnLabel,
+  warning,
+  ...props
+}, ref) => {
   const {
     current: id
   } = useRef(inputId || guid());

package/esm/__internal__/checkable-input/checkable-input.style.js

@@ -10,16 +10,14 @@ const StyledCheckableInput = styled.div`
   position: relative;
 `;
 const StyledCheckableInputWrapper = styled.div`
-  ${_ref => {
-  let {
-    disabled,
-    fieldHelpInline,
-    inputWidth,
-    labelWidth,
-    labelInline,
-    reverse
-  } = _ref;
-  return css`
+  ${({
+  disabled,
+  fieldHelpInline,
+  inputWidth,
+  labelWidth,
+  labelInline,
+  reverse
+}) => css`
     ${FieldLineStyle} {
       display: flex;
     }
@@ -96,7 +94,6 @@ const StyledCheckableInputWrapper = styled.div`
         width: ${labelWidth}% !important;
       }
     `}
-  `;
-}}
+  `}
 `;
 export { StyledCheckableInput, StyledCheckableInputWrapper };

package/esm/__internal__/checkable-input/hidden-checkable-input.component.js

@@ -3,20 +3,19 @@ import React, { useContext } from "react";
 import PropTypes from "prop-types";
 import HiddenCheckableInputStyle from "./hidden-checkable-input.style";
 import { InputContext, InputGroupContext } from "../input-behaviour";
-const HiddenCheckableInput = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    ariaDescribedBy,
-    ariaLabelledBy,
-    name,
-    checked,
-    type,
-    value,
-    onChange,
-    autoFocus,
-    role,
-    validationIconId,
-    ...props
-  } = _ref;
+const HiddenCheckableInput = /*#__PURE__*/React.forwardRef(({
+  ariaDescribedBy,
+  ariaLabelledBy,
+  name,
+  checked,
+  type,
+  value,
+  onChange,
+  autoFocus,
+  role,
+  validationIconId,
+  ...props
+}, ref) => {
   const {
     onBlur,
     onFocus,

package/esm/__internal__/field-help/field-help.component.js

@@ -1,18 +1,15 @@
 import React from "react";
 import PropTypes from "prop-types";
 import StyledFieldHelp from "./field-help.style";
-export const FieldHelp = _ref => {
-  let {
-    children,
-    labelInline,
-    labelWidth = 30,
-    id
-  } = _ref;
-  return /*#__PURE__*/React.createElement(StyledFieldHelp, {
-    "data-element": "help",
-    labelInline: labelInline,
-    labelWidth: labelWidth,
-    id: id
-  }, children);
-};
+export const FieldHelp = ({
+  children,
+  labelInline,
+  labelWidth = 30,
+  id
+}) => /*#__PURE__*/React.createElement(StyledFieldHelp, {
+  "data-element": "help",
+  labelInline: labelInline,
+  labelWidth: labelWidth,
+  id: id
+}, children);
 export default FieldHelp;

package/esm/__internal__/field-help/field-help.style.js

@@ -5,15 +5,12 @@ const StyledFieldHelp = styled.span`
   margin-top: 8px;
   white-space: pre-wrap;
 
-  ${_ref => {
-  let {
-    labelInline,
-    labelWidth
-  } = _ref;
-  return labelInline && css`
+  ${({
+  labelInline,
+  labelWidth
+}) => labelInline && css`
       margin-left: ${labelWidth}%;
       padding-left: 0;
-    `;
-}}
+    `}
 `;
 export default StyledFieldHelp;

package/esm/__internal__/fieldset/fieldset.component.js

@@ -6,21 +6,20 @@ import ValidationIcon from "../validations/validation-icon.component";
 import { NewValidationContext } from "../../components/carbon-provider/carbon-provider.component";
 import { InputGroupBehaviour, InputGroupContext } from "../input-behaviour";
 import useFormSpacing from "../../hooks/__internal__/useFormSpacing";
-const Fieldset = _ref => {
-  let {
-    legend,
-    children,
-    inline = false,
-    legendWidth,
-    legendAlign = "right",
-    legendSpacing = 2,
-    error,
-    warning,
-    info,
-    isRequired,
-    blockGroupBehaviour,
-    ...rest
-  } = _ref;
+const Fieldset = ({
+  legend,
+  children,
+  inline = false,
+  legendWidth,
+  legendAlign = "right",
+  legendSpacing = 2,
+  error,
+  warning,
+  info,
+  isRequired,
+  blockGroupBehaviour,
+  ...rest
+}) => {
   const {
     validationRedesignOptIn
   } = useContext(NewValidationContext);
@@ -29,26 +28,23 @@ const Fieldset = _ref => {
     blockGroupBehaviour: blockGroupBehaviour
   }, /*#__PURE__*/React.createElement(StyledFieldset, _extends({
     "data-component": "fieldset"
-  }, rest, marginProps), legend && /*#__PURE__*/React.createElement(InputGroupContext.Consumer, null, _ref2 => {
-    let {
-      onMouseEnter,
-      onMouseLeave
-    } = _ref2;
-    return /*#__PURE__*/React.createElement(StyledLegend, {
-      onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave,
-      inline: inline,
-      width: legendWidth,
-      align: legendAlign,
-      rightPadding: legendSpacing
-    }, /*#__PURE__*/React.createElement(StyledLegendContent, {
-      isRequired: isRequired
-    }, legend, !validationRedesignOptIn && /*#__PURE__*/React.createElement(ValidationIcon, {
-      error: error,
-      warning: warning,
-      info: info,
-      tooltipFlipOverrides: ["top", "bottom"]
-    })));
-  }), children));
+  }, rest, marginProps), legend && /*#__PURE__*/React.createElement(InputGroupContext.Consumer, null, ({
+    onMouseEnter,
+    onMouseLeave
+  }) => /*#__PURE__*/React.createElement(StyledLegend, {
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    inline: inline,
+    width: legendWidth,
+    align: legendAlign,
+    rightPadding: legendSpacing
+  }, /*#__PURE__*/React.createElement(StyledLegendContent, {
+    isRequired: isRequired
+  }, legend, !validationRedesignOptIn && /*#__PURE__*/React.createElement(ValidationIcon, {
+    error: error,
+    warning: warning,
+    info: info,
+    tooltipFlipOverrides: ["top", "bottom"]
+  })))), children));
 };
 export default Fieldset;

package/esm/__internal__/fieldset/fieldset.style.js

@@ -16,11 +16,9 @@ const StyledLegendContent = styled.span`
   display: flex;
   align-items: center;
   line-height: 24px;
-  ${_ref => {
-  let {
-    isRequired
-  } = _ref;
-  return isRequired && css`
+  ${({
+  isRequired
+}) => isRequired && css`
       ::after {
         content: "*";
         line-height: 24px;
@@ -28,8 +26,7 @@ const StyledLegendContent = styled.span`
         font-weight: 700;
         margin-left: var(--spacing100);
       }
-    `;
-}}
+    `}
 `;
 const StyledLegend = styled.legend`
   display: flex;
@@ -37,21 +34,18 @@ const StyledLegend = styled.legend`
   margin-bottom: 8px;
   padding: 0;
   font-weight: 600;
-  ${_ref2 => {
-  let {
-    inline,
-    width,
-    align,
-    rightPadding
-  } = _ref2;
-  return inline && css`
+  ${({
+  inline,
+  width,
+  align,
+  rightPadding
+}) => inline && css`
       float: left;
       box-sizing: border-box;
       margin: 0;
       ${width && `width: ${width}%`};
       justify-content: ${align === "right" ? "flex-end" : "flex-start"};
       padding-right: ${rightPadding === 1 ? "var(--spacing100)" : "var(--spacing200)"};
-    `;
-}}
+    `}
 `;
 export { StyledFieldset, StyledLegend, StyledLegendContent };

package/esm/__internal__/focus-trap/focus-trap.component.js

@@ -9,17 +9,16 @@ export const TAB_GUARD_BOTTOM = "tab-guard-bottom";
 
 // TODO investigate why React.RefObject<T> produces a failed prop type when current = null
 
-const FocusTrap = _ref => {
-  let {
-    children,
-    autoFocus = true,
-    focusableSelectors,
-    focusFirstElement,
-    bespokeTrap,
-    wrapperRef,
-    isOpen,
-    additionalWrapperRefs
-  } = _ref;
+const FocusTrap = ({
+  children,
+  autoFocus = true,
+  focusableSelectors,
+  focusFirstElement,
+  bespokeTrap,
+  wrapperRef,
+  isOpen,
+  additionalWrapperRefs
+}) => {
   const trapRef = useRef(null);
   const [currentFocusedElement, setCurrentFocusedElement] = useState();
   const {

package/esm/__internal__/form-field/form-field.component.js

@@ -9,38 +9,37 @@ import tagComponent from "../utils/helpers/tags/tags";
 import { TabContext } from "../../components/tabs/tab";
 import useIsAboveBreakpoint from "../../hooks/__internal__/useIsAboveBreakpoint";
 import useFormSpacing from "../../hooks/__internal__/useFormSpacing";
-const FormField = _ref => {
-  let {
-    children,
-    "data-component": dataComponent,
-    disabled,
-    loading,
-    fieldHelp: fieldHelpContent,
-    fieldHelpInline,
-    error,
-    warning,
-    info,
-    tooltipId,
-    fieldHelpId,
-    label,
-    labelId,
-    labelAlign,
-    labelHelp,
-    labelHelpIcon,
-    labelInline,
-    labelSpacing = 2,
-    labelWidth,
-    labelAs,
-    id,
-    reverse,
-    isOptional,
-    useValidationIcon,
-    adaptiveLabelBreakpoint,
-    isRequired,
-    validationIconId,
-    validationRedesignOptIn,
-    ...rest
-  } = _ref;
+const FormField = ({
+  children,
+  "data-component": dataComponent,
+  disabled,
+  loading,
+  fieldHelp: fieldHelpContent,
+  fieldHelpInline,
+  error,
+  warning,
+  info,
+  tooltipId,
+  fieldHelpId,
+  label,
+  labelId,
+  labelAlign,
+  labelHelp,
+  labelHelpIcon,
+  labelInline,
+  labelSpacing = 2,
+  labelWidth,
+  labelAs,
+  id,
+  reverse,
+  isOptional,
+  useValidationIcon,
+  adaptiveLabelBreakpoint,
+  isRequired,
+  validationIconId,
+  validationRedesignOptIn,
+  ...rest
+}) => {
   const invalidValidationProp = useMemo(() => {
     const validationProps = {
       error: !!error,

package/esm/__internal__/form-field/form-field.style.js

@@ -14,14 +14,11 @@ FormFieldStyle.defaultProps = {
   theme: baseTheme
 };
 const FieldLineStyle = styled.div`
-  ${_ref => {
-  let {
-    inline
-  } = _ref;
-  return css`
+  ${({
+  inline
+}) => css`
     display: ${inline ? "flex" : "block"};
-  `;
-}}
+  `}
 `;
 export { FieldLineStyle };
 export default FormFieldStyle;

package/esm/__internal__/form-spacing-provider/form-spacing-provider.component.js

@@ -1,15 +1,12 @@
 import React from "react";
 import PropTypes from "prop-types";
 import { FormSpacingContext } from "./form-spacing-context";
-const FormSpacingProvider = _ref => {
-  let {
-    marginBottom,
-    children
-  } = _ref;
-  return /*#__PURE__*/React.createElement(FormSpacingContext.Provider, {
-    value: {
-      marginBottom
-    }
-  }, children);
-};
+const FormSpacingProvider = ({
+  marginBottom,
+  children
+}) => /*#__PURE__*/React.createElement(FormSpacingContext.Provider, {
+  value: {
+    marginBottom
+  }
+}, children);
 export default FormSpacingProvider;

package/esm/__internal__/full-screen-heading/full-screen-heading.style.js

@@ -5,14 +5,11 @@ export const StyledHeaderContainer = styled.div`
   flex-wrap: wrap;
 `;
 const StyledFullScreenHeading = styled.div`
-  ${_ref => {
-  let {
-    hasContent
-  } = _ref;
-  return hasContent && css`
+  ${({
+  hasContent
+}) => hasContent && css`
       border-bottom: 1px solid var(--colorsUtilityMajor050);
-    `;
-}}
+    `}
   background-color: var(--colorsUtilityYang100);
   display: flex;
   justify-content: space-between;

package/esm/__internal__/input/input-presentation.component.js

@@ -3,22 +3,21 @@ import PropTypes from "prop-types";
 import InputPresentationStyle, { StyledInputPresentationContainer } from "./input-presentation.style";
 import { InputContext, InputGroupContext } from "../input-behaviour";
 import { NewValidationContext } from "../../components/carbon-provider/carbon-provider.component";
-const InputPresentation = _ref => {
-  let {
-    children,
-    positionedChildren,
-    prefix,
-    inputWidth,
-    maxWidth,
-    align,
-    disabled,
-    readOnly,
-    size = "medium",
-    error,
-    warning,
-    info,
-    hasIcon
-  } = _ref;
+const InputPresentation = ({
+  children,
+  positionedChildren,
+  prefix,
+  inputWidth,
+  maxWidth,
+  align,
+  disabled,
+  readOnly,
+  size = "medium",
+  error,
+  warning,
+  info,
+  hasIcon
+}) => {
   const {
     hasFocus,
     onMouseDown,